/* MAIN CONTAINERS */

[class*="span"] { float:left; margin-left:1%; }

img, iframe { max-width:100%; height: auto; }


/* LAYOUT */

.row-fluid [class*="span"] { float: left; margin-left: 2.127659574468085%; }

.row-fluid [class*="span"]:first-child { margin-left: 0; }

.row-fluid .controls-row [class*="span"] + [class*="span"] { margin-left: 2.127659574468085%; }

.row-fluid .span12 { width:100%; }

.row-fluid .span11 { width:91.48936170212765%; }

.row-fluid .span10 { width:82.97872340425532%; }

.row-fluid .span9 { width:74.46808510638297%; }

.row-fluid .span8 { width:65.95744680851064%; }

.row-fluid .span7 { width:57.44680851063829%; }

.row-fluid .span6 { width:48.93617021276595%; }

.row-fluid .span5 { width:40.42553191489362%; }

.row-fluid .span4 { width:31.914893617021278%; }

.row-fluid .span3 { width:23.404255319148934%; }

.row-fluid .span2 { width:14.893617021276595%; }

.row-fluid .span1 { width:6.382978723404255%; }



/* BELOW 1100PX */

@media (max-width: 1099px) {

	.container {width: 90%;}
	
	#top {height: 80px;}
	
	nav {font-family: 'Open Sans', sans-serif; font-size: 18px; font-weight: 200;  display: block;}
	
	nav li a {line-height: 18px; padding: 25px 25px 15px 25px;}
	
	.social-links .social img {width: 25px; margin: 0px 1px;}
	
	.small-pic1 {padding: 9px 29px 0px 9px; margin: 10px 10px;}
	
	.small-pic2 {padding: 12px 28px 0px 10px; margin: 10px 10px;}
	
	.small-pic3 {padding: 13px 28px 0px 10px; margin: 10px 10px;}
	
	.small-pic4 {padding: 12px 31px 0px 7px; margin: 10px 10px;}
	
}

/* BELOW 1024PX */

@media (max-width: 1023px) {
	
	#primary {height: 110px;}
	
	#logo {width: 300px; float: left; padding: 10px 0px;}
	
	#nav-toggle {display: block;}
	
	#top {display: none; width: 100%; height: auto; position:relative; border-bottom: 1px solid #e5e5e5; margin-top: -10px;}
	
	nav li {margin: 0px; padding: 0px; display: block; float: none;}
	
	nav li a {color: #ffffff; line-height:30px; width: 90.5%; background-color: #626367; padding: 10px 5%; border-bottom: 1px solid #969698;}
	
	nav li a:hover {background-color: #aac9be; color: #ffffff;}

	#featured {padding: 15px 0px;}
	
	#main .span9 {width: 100%; float: none; margin-left: 0px;}
	
	#main .span3 {width: 100%;}
	
	.advert, .social-links {display: none; border: none;}
	
	.current-project {width: 100%; border: none; text-align: center; padding: 20px 0px;}
	
	.search {border-bottom: none;}
		
	.blog-nav-link-right {float: right;}
	
}



/* BELOW 768PX */

@media (max-width: 767px) {

	#samples .span3 {width:48.93617021276595%; margin-left: 0px;}
	
	#samples .span3:nth-child(odd) { margin-right: 2.127659574468085%; }
	
	.clear-late {clear: both;}
	
	.related-posts {width: 100%; padding: 25px 0px; margin: 60px auto 30px auto;}
	
	.small-pic1 {border-right: none; padding: 9px 29px 0px 9px; margin: 10px 0px;}
	
	.small-pic2 {border-right: none; padding: 12px 28px 0px 10px; margin: 10px 0px;}
	
	.small-pic3 {border-right: none; padding: 13px 28px 0px 10px; margin: 10px 0px;}
	
	.small-pic4 {border-right: none; padding: 12px 31px 0px 7px; margin: 10px 0px;}
	
}	


/* BELOW 480 */

@media (max-width: 479px) {
	
	#main {padding-top: 10px;}
	
	#primary {height: 90px;}
	
	#logo {width: 200px;}
	
	#nav-toggle {margin-top: 25px;}
	
	.side-padding {padding: 0px 0px;}
	
	.editorial {padding: 30px 0px;}
	
	.editorial li {width: 94%; height: auto; border: 3% solid #e5e5e5; margin: 10px 0px;}
	
	.consultation {width: 94%; height: auto; border: 3% solid #e5e5e5;}
	
	.alignleft, .alignright {width: 100%; height: auto;}
	
	.blog-nav-link-left, .blog-nav-link-right {width: 100%; margin: 0px 0px 10px 0px;}
		
	#archives {margin-top: 0px; }

}