body{text-align: center; font-family: Georgia, serif; margin: 0; color:#333;}

/*MEDIA*/
img, embed, object, video, iframe{max-width:100%; margin:0 0 2em 0;}	

/*TYPE*/
a.button{background-color:#4d3e0f; color:#ffcc33; border:1px solid #4d3e0f; padding:10px; font: 16px/100% "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;}
a.button:hover{background:#ffcc33; border:1px solid #4d3e0f; color:#4d3e0f;}


/*HOME PAGE*/

.main{float:left; width:100%; text-align: center; margin:0 auto;}
.main img{margin:0;	}

.intro{background: #ffcc33 url(../i/icon-magazine.png) bottom center no-repeat; padding:2em 0 130px 0; float:left;}
.intro .container{width:500px; margin:auto; text-align: center;}

.devices{background: #fff url(../i/icon-devices.png) 50% 40% no-repeat; padding:0; float:left; text-align: center;}
.web{background: #fff url(../i/icon-web.png) 50% 40% no-repeat; padding:0; float:left; text-align: center;}
.design{background: #fff url(../i/icon-design.png) 50% 40% no-repeat; padding:0; float:left; text-align: center; padding:0;}
.formats{background: #fff url(../i/icon-formats.png) 50% 40% no-repeat; padding:0; float:left; text-align: center; padding:0;}
.devices .container, .web .container, .design .container , .formats .container{margin:auto; width:500px;}
.desc_right{width:200px; margin:3em 0 2em 0; float:right; text-align: left;}
.desc_left{width:200px; margin:3em 0 2em 0; float:left; text-align: right;}
.desc_right p, .desc_left p{margin:0; padding:0; font-size: 99%; color:#4d4d4d; line-height: 1.4em; font-family: arial, sans-serif;}
.desc_right h2, .desc_left h2{margin:0; padding:0; font-size: 130%; line-height: 1.4em; font-family: Georgia, "Times New Roman", serif; color:#4c3d0f;}

.partners{background: #ffcc33 url(../i/icon-launch.png) top center no-repeat; padding:100px 0 5em 0; float:left;}
.partners .container{width:500px; margin:auto; text-align: center;}
.partners h2{color:#4c3d0f;}
.partners p{margin:0;}

.blog{padding:2em 0 3em 0;}
.blog ul{list-style: none; width:500px; text-align: center; margin:0 auto; padding:0;}
.blog li a{text-decoration: none; color:#333;}
.blog li a:hover{text-decoration: underline;}
.blog span {text-decoration:none; background-color: #ffcc33; font-size: 0.7em; padding:0.15em 0.5em; color:#4d3e0f; margin:0 1em 0 0;}

.contact{background: #ffcc33 url(../i/icon-chat.png) top center no-repeat; padding:100px 0 2em 0; float:left;}
.contact .container{width:500px; margin:auto; text-align: center;}
.contact h2{color:#4c3d0f;}
.contact p{margin:0;}
.contact img{margin:0 0 10px 0;}
.contact .sm p{margin:0; font-size: 1em;}
.contact .sm p a{margin:0; font-size: 1em;}
.contact .sm{float:left; width:166px; margin:25px 0 0 0;}

footer{width:100%; background-color: #ffcc33; float:left; padding:2em 0 0 0; font-size: 80%;}
footer p{}

.intro h1{width:500px; font-size:1.5em; line-height:1.4em; font-weight: normal; font-style: italic; margin:1.5em auto 0 auto; padding:0; color:#4c3d0f;}

p.handwritten{font-family: 'Nothing You Could Do', cursive; background: url(../i/bg-arrow.png) bottom center no-repeat; padding-bottom: 30px; margin: 2em 0 0 0;}

/*BLOG*/
#main-blog{float:right; width:51%; padding:2em 10%; background: #fff; margin:0; text-align: left; min-height: 100%;}
.entry{width:100%; border-bottom:1px solid #ccc; margin:0 0 2em 0;}
#sidebar{float:left; width:25%; text-align: center; padding:2em 2% 2em 2%; position: fixed; background: #ffcc33; min-height:100%;}
#sidebar img{max-width: 90%;}
#sidebar p{margin-bottom: 1em; color:#4c3d0f;}
#sidebar ul{list-style: none; padding:0; margin:0;}

#sidebar a{color:#4c3d0f; text-decoration: none;}

h1{font-size:2em; line-height: 1em; margin:1em 0; border:none; padding:0; font-weight: normal; color:#ffcc33;}
h2{font-size:1.7em; line-height:1.3em; margin:2em 0 1em 0; font-weight: normal; color:#ffcc33;}
h3{font-size:1.5em; line-height:1.3em; margin:2em 0 1em 0; font-weight: normal; color:#ffcc33;}
h4{font-size:1.4em; line-height:1.3em; margin:2em 0 1em 0; font-weight: normal; color:#ffcc33;}
h5{font-size:1.3em; line-height:1.3em; margin:2em 0 1em 0; font-weight: normal; color:#ffcc33;}
p{font-size: 1.18em; line-height: 1.6em; margin:0 0 2em 0; color:#333; font-weight: normal;}
ul, ol{font-size: 1.2em; margin:0 0 2em 0;}
li{margin:0 0 0.8em 0; line-height: 1.4em;}
ol{list-style-type: decimal;}
ul{list-style-type: disc;}
blockquote{width:100%; border-top:1px solid #ffcc33; border-bottom:1px solid #ffcc33; padding-top:2em; margin-left:0; margin-bottom: 2em; background: #fffae4;}
blockquote p{font-style: italic; margin-bottom: 1.5em; font-size: 1.3em; width: 90%; margin-left: 5%;}
table{margin: 0 0 30px 0; max-width: 100%;}
p a{text-decoration:none; background-color: #ffcc33; font-size: 0.9em; padding:0.15em 0.5em; color:#4d3e0f;}
p a:hover{background-color:#4d3e0f; color:#ffcc33;}
.center{text-align: center;}
.left{text-align: left;}
.italic{font-style: italic;}

p.date{font-size: 1em; margin:0 0 1em 0;}

/*FORM*/
/*FORM*/

form {
		float:left;
		width:100%;
		margin:0 auto 2em auto;
		text-align: center;
		}
	fieldset {
		margin-bottom: 20px; }
	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="submit"],
	textarea,
	select {
		float: none;
		border: none;
		padding: 15px 10px;
		outline: none;
		font: 16px/100% "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		font-weight:normal;
		color: #ccc;
		margin: 0 auto 1em auto;
		width: 100%;
		display: block;
		background: #fff;
		-webkit-appearance: none;}
	select {
		padding: 0; }
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus,
	textarea:focus {
 		color: #444;
 		-moz-box-shadow: 0 0 5px rgba(0,0,0,.4);
		-webkit-box-shadow: 0 0 5px rgba(0,0,0,.4);
		box-shadow:  0 0 3px rgba(0,0,0,.4); }
	textarea {
		min-height: 60px; }
	label,
	legend {
		display: block;
		font-weight: bold;
		font-size: 14px;
		 }
		 form label {
  display: block;
  overflow: hidden;
  width: 0;
  height: 0;
}
	select {
		width: 220px; }
	input[type="checkbox"] {
		display: inline; }
	label span,
	legend span {
		font-weight: normal;
		font-size: 13px;
		color: #444; }
		
	label{margin:10px 0 10px 0;}
	p.note, div.error {margin-top:2em; font-style: italic; font-size: 0.9em;}

	form .row{margin:0; padding: 0; float:left; width:100%; text-align: center;}
	
	input[type="file"]{margin:0 0 10px 0;}
	
	.row_error input[type="text"],
	.row_error input[type="password"],
	.row_error input[type="email"],
	.row_error textarea,
	.row_error select{border:1px solid red;}
	
	.row_error p.note{color:red;}
	
	input[type="submit"] {
	width:auto;
	margin:auto;
	cursor: pointer;
	color: #ffcc33 !important;
	background: #4c3d0f;
	border: 1px solid #4c3d0f;
}

input[type="submit"]:hover {
	color:#4c3d0f !important;
	background: #ffcc33;
}

#sidebar form{text-align: center;}

#sidebar input[type="text"],
	#sidebar input[type="password"],
	#sidebar input[type="email"],
	#sidebar textarea,
	#sidebar select {
	margin:0 auto 1em auto; float:none; width:90% !important;}
	
	#sidebar input[type="submit"]{
	margin:0 auto 1em auto; float:none; width:auto;}

p.note, div.error {clear: both; background: red; padding:1em; font-style: normal; font-family: Arial, sans-serif; color:#fff;}
div.error { margin-bottom: 3em; }
p.note a{text-decoration: underline; background-color: red; color:#fff; font-size: 100%; padding:0;}
p.note a:hover{color:#000;}

/*Signup*/

#main-blog form#signup input[type="email"], form#signup input[type="text"], form#signup input[type="password"]{width:500px; border:1px solid #ccc; clear: both; }

form#signup label {display: block; float:left; overflow: auto; width: auto; height: auto; font-family: arial, sans-serif;}

form#signup .row{float:left; width:100%; clear: both;}
form#signup .half{float:left; width:240px; margin:0 20px 0 0;}
form#signup .half:last-child{margin:0;}
form#signup .half input{width:100%;}

form#signup input[type="submit"]{float:left;}

/*=============PHONES==========*/
@media only screen and (max-width: 568px) {
body{padding:0;}
img{max-width:100%;}
.main{width:100%; margin:0;}
.main .container{width:90%;}

.devices{background: #fff url(../i/icon-devices.png) 5% -50px no-repeat; padding:0; float:left; text-align: center;}
.web{background: #fff url(../i/icon-web.png) 5% -50px no-repeat; padding:0; float:left; text-align: center;}
.design{background: #fff url(../i/icon-design.png) 5% -50px no-repeat; padding:0; float:left; text-align: center; padding:0;}
.formats{background: #fff url(../i/icon-formats.png) 5% -50px no-repeat; padding:0; float:left; text-align: center; padding:0;}

.desc_right{width:200px; margin:30px 0 30px 90px; float:none; text-align: left;}
.desc_left{width:200px; margin:30px 0 30px 90px; float:none; text-align: left;}

.blog{width:100%; text-align: center;}
.blog .container{width:100%;}
.blog ul{width:90%; margin: auto;}
.blog span{width:auto;}

.intro h1{width:100%; text-align: center;}
h1{width:100%;}
p.handwritten{padding-bottom: 30px; margin: 1em 0;}

input[type="text"],
	input[type="password"],
	input[type="email"],
	textarea,
	select {
	margin:0 auto 1em auto; float:none; width:100% !important; -webkit-appearance: none;}
	
	input[type="submit"]{
	margin:0 auto 1em auto; float:none; width: auto; border:none; -webkit-appearance: none;}
	
	form#signup .half{width:100%;}
	
/*Blog*/

#main-blog{float:none; width:90%; padding:2em 5%; margin:0;}
#main-blog h1{border:none;}

.entry{border-bottom:1px solid #ccc; margin:0 0 2em 0;}
#sidebar{float:none; width:90%; padding:5%; position: static;}

}