@charset "UTF-8";
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;margin:0;padding:0;}
table{border-collapse:separate;border-spacing:0;margin-bottom:1.4em;}
caption,th,td{text-align:left;font-weight:400;}
blockquote:before,blockquote:after,q:before,q:after{content:"";}
blockquote,q{quotes:;}
a img{border:0 none;}


html, body							{ height:100%; width:100% }
body										{ background-color:white; }
.page										{ max-width:600px; width:92%; margin-left:auto; margin-right:auto; position:relative }
img											{ width: auto; max-width: 100%; height: auto;}

/* 
02 Typography
*/

body,
input,
textarea,
button									{ font-size: 125%; line-height: 1.5; font-family: Georgia, Times, "Times New Roman", serif; color:#424242; }

/* Styles */
.strong 								{ font-weight:bold }
.italic 								{ font-style:italic }
.small 									{ font-size:0.700em }
.grey 									{ color:#939393 }
.light-grey 						{ color:#cecece }
.smallcaps 							{ font-family:Georgia, Times, "Times New Roman", serif; }
.blockquote 						{ padding-left: 1em; border-left: 4px solid #e8e8e8; font-style: italic }

/* Headings */
h1 											{ font-size:0.875em; }
h2 											{ font-size:2.000em; line-height: 1.2;  margin-bottom:0.500em; }
h3 											{ font-size:1.000em; font-weight: bold;  margin-bottom:0.500em;}

/* A */
a												{ color:#000; background-color:#ccc;padding:0 1px; text-decoration:none; -moz-transition: all 0.2s ease-out;  -o-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; transition: all 0.2s ease-out; }
a:hover 								{ color:#be005e; background-color:#fff2f8; }

/* Extras */
.article p					 	 	{ margin-bottom:1.000em; }
#article p.last 				{ margin-bottom:0; }
.article-title					{ float:left }
p.margin-bottom					{ margin-bottom: 2.000em; }
.margin-no							{ margin-bottom: 0; }
.info-title							{ padding-top: 0.500em;}



/* 
02 Floats
*/

.left 									{ float:left; }
.right				 					{ float:right; }
.left-text 							{ text-align:left }
.right-text 						{ text-align:right }
.center-text 						{ text-align:center }
.clear									{ clear:both; display:block; overflow:hidden; visibility:hidden; width:0; height:0 }
.clearfix:after					{ clear:both; content:''; display:block; font-size:0; line-height:0; visibility:hidden; width:0; height:0 }
* html .clearfix,
*:first-child+html .clearfix		{ zoom:1 }


/* 
---------------------------------------------------------------------------------------------------------- 
02 Navigation / lists
---------------------------------------------------------------------------------------------------------- 
*/

.nav 										{ margin-top:1em; }
ul.nav li 							{ list-style: none; border-bottom:1px solid #9e004a; width:100%; z-index:1; }
ul.nav li:first-child		{ border-top:1px solid #9e004a; }
ul.nav li a 						{ color:white; display:block;  padding:10px 0; }
ul.nav li a:hover 			{ background-color:white; color:#be005e; text-indent: 1em }
.arrow									{ display: none; color: #e65599}
ul.nav li a:hover span.arrow 			{text-indent: -1em }

.home 									{ position:fixed; top:0; left:0; display:table; width:80px; height:80px; font-size:14px; color:white; text-align:center; text-decoration:none; border-bottom:0; background-color:#be005e; z-index:5 }
.home:hover 						{ background-color:#231f20; color:#be005e; }
.home span 							{ display:table-cell;	vertical-align:middle; position:relative; }
#table-of-contents .home				{background-color:#be005e; color:white;}
#table-of-contents .home:hover	{background-color:#be005e; color:white;}

.menu-site							{	width:44%; float: left }
.menu-elsewhere					{	width:44%; float: right }
.mmenu										{ display:none }
.menu										{ display: block; border-bottom:1px solid #dadada; background-color:#f8f8f8; position:fixed; width:100%; padding: 0.875em 0; font-size:0.875em; font-family:"ff-tundra-sc-web-pro", Georgia, Times, "Times New Roman", serif; z-index:5;  -moz-box-shadow: 0 0 3px rgba(0,0,0, 0.1); -webkit-box-shadow: 0 0 3px rgba(0,0,0, 0.1); box-shadow: 0 0 3px rgba(0,0,0, 0.1); }

ul.styled-list li				{ list-style:none; padding:0.2em 0; }
ul.styled-list					{ margin-bottom:1.000em; }

ul.styled-list-hor li		{ list-style:none; float: left; padding:0.500em 0; }

ul.normalul							{ margin-bottom: 1em}

#table-of-contents			{ background-color: #be005e; font-family:Georgia, Times, "Times New Roman", serif; color: #f0b8d2  }
#table-of-contents hr		{ border-top:1px solid #9e004a; border-bottom:0; border-right:0; border-left:0; margin:0.500em 0 1.500em 0;  }


/* 
---------------------------------------------------------------------------------------------------------- 
02 Form Elements
---------------------------------------------------------------------------------------------------------- 
*/

input, 
textarea 								{ width: 90%; margin-bottom: 1.000em; background-color: white; border: 1px solid #e2e2e2; font-size: 1em; padding: 0.500em; -moz-transition: all 0.2s ease-out;  -o-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; transition: all 0.2s ease-out;outline: none;  -webkit-appearance: none; border-radius: 0;}
input:hover,
textarea:hover  				{ border: 1px solid #d4dbde; background-color: white }
input:focus,
textarea:focus  				{ border: 1px solid #00b6eb; background-color: white; -moz-box-shadow: 0 0 10px rgba(0,182,235, 0.5); -webkit-box-shadow: 0 0 10px rgba(0,182,235, 0.5); box-shadow: 0 0 10px rgba(0,182,235, 0.5);}

.error									{ border: 1px solid #be005e; background-color: white; }
.error:hover						{ border: 1px solid #; }
.error:focus						{ border: 1px solid #be005e; -moz-box-shadow: 0 0 10px rgba(190,0,94, 0.5); -webkit-box-shadow: 0 0 10px rgba(190,0,94, 0.5); box-shadow: 0 0 10px rgba(190,0,94, 0.5); }
select									{ margin-bottom: 1em;}
#contact-form 					{ width: 100%; height: 100%; }
.errormsg								{ position: absolute; top:2px; right:0; background-color:#be005e; color: white; font-size: 0.600em; width: 52px; height: 52px; text-align: center;display:table;  }
.errormsg p							{ display:table-cell;	vertical-align:middle; position:relative;}
.input-container				{ position: relative }
.select-box							{ margin-bottom: 4.000em; }


/* 
---------------------------------------------------------------------------------------------------------- 
02 Other Elements
---------------------------------------------------------------------------------------------------------- 
*/

.article 								{ padding: 10.00em 0}
#info .article 					{ padding:0}
.content 								{ padding: 1.000em 0; margin: auto}
.latestarticle					{ padding: 3.000em 0 ;}
.profile-pic						{ margin-bottom: 2em; border-bottom: 1px solid #e9e9e9}
#container a:hover			{ background-color: transparent}

/* HR */
hr 											{ border-top:1px solid #e9e9e9; border-bottom:0; border-right:0; border-left:0; margin:2.000em 0; }
hr.smallmargin					{ margin:1em 0; }
hr.smallhr 							{ width: 50px; margin: 1.500em auto  }
hr.titlehr							{ margin:0.500em 0; }

/* Grid */
.container							{ width:92%; margin:0px auto; position: relative; }
.grid-1,
.grid-2,
.grid-3									{ float: left; margin:0 1.515151515152% 3em;}
.grid-2 								{ width:13.636363636364%; background-color: #f1f1f1; height: 10em;}
.grid-1									{ width: 30.30303030303%; background-color: #e9e9e9; height: 10em;}
.grid-3									{ width: 46.969696969697%;}
.thumb-logo							{ display:table; text-align: center; height:100%; width: 100%; background-color: #e9e9e9}
.thumb-logo a:hover			{ background-color: #e9e9e9}
.client-logo						{ display:table-cell;	vertical-align:middle; position:relative; }

/* Masonry */
.box 										{ float: left; }
.photo.col3 						{ width: 30%; margin: 0 1.515151515152% 3em; }
.photo.col3 img 				{ width: 101%; height: auto; }
#container 							{ clear: both; width: 92%;margin: 0px auto; }
#container.masonry 			{ overflow-x: hidden; overflow-y: hidden; }
.lazy-image 						{ display: none; }


/* 
---------------------------------------------------------------------------------------------------------- 
02 IE - still need to do some work here.
---------------------------------------------------------------------------------------------------------- 
*/

.ie7 .home .logo 				{ display: none; }
.ie7 .home 							{ background-image: url(img/logo.png); background-repeat: no-repeat; background-position: center; }
.ie7 .home:hover 				{ background-image: url(img/logo-hover.png); background-repeat: no-repeat; background-position: center; }
.ie7 .dropcap 					{ line-height: 200px; top: -145px; margin-bottom: -180px; }


/* 
---------------------------------------------------------------------------------------------------------- 
02 Media Queries 
---------------------------------------------------------------------------------------------------------- 
*/

@media screen and (max-width: 700px){

body										{ font-size: 100%; }
h2 											{ font-size:1.8em;}
.menu										{ display: block; border-bottom:1px solid #dadada; background-color:#f8f8f8; position:fixed; width:100%; padding: 0.875em 0; font-size:0.875em; font-family:"ff-tundra-sc-web-pro", Georgia, Times, "Times New Roman", serif; z-index:5;  -moz-box-shadow: 0 0 3px rgba(0,0,0, 0.1); -webkit-box-shadow: 0 0 3px rgba(0,0,0, 0.1); box-shadow: 0 0 3px rgba(0,0,0, 0.1); }
#project-inquiry .menu, 
#work .menu, 					 	{ position:relative;}
#table-of-contents .menu			{ display: block; border:none; background-color:#af0057; position:relative; width:100%; padding: 0.875em 0; font-size:0.875em; font-family:Georgia, Times, "Times New Roman", serif; z-index:5; margin-bottom: 2em}
#table-of-contents .menu p {font-weight: bold}
.home 									{ display:none; }

.prev-arrow							{ display: none }
.next-arrow							{ display: none }
.small 									{ font-size:0.875em }
#project-inquiry .wrapper			{padding:5.000em 0;}
#project-inquiry .slidewrap, 
#project-inquiry .slider, 
#project-inquiry .slide { height:auto }
.grid-1 								{ float: none; width:96.969696969697%; }
.grid-2 								{ float: none; width:96.969696969697%; }
.grid-3 								{ float: none; width:96.969696969697%; }
.content 								{ padding: 1.000em 0; margin: auto}
.menu-site							{	width:100%; float: none; padding-bottom: 2em }
.menu-elsewhere					{	width:100%; float: none }
.arrow									{ display: inline;}
.date										{ float:none }
.article-title					{ float:none; display: block }
.photo.col3 						{ width: 96.969696969697%; }
}

@media screen and (min-width: 700px) and (max-width: 900px) {

body										{ font-size: 105%; }
.grid-1 								{ width:46.969696969697%; }
.grid-2 								{ float: none; width:96.969696969697%; }
.photo.col3 						{ width: 45%; }	
}

@media screen and (min-width: 900px) and (max-width: 1100px) {

body										{ font-size: 115%; }
.grid-1 								{ width:46.969696969697%; }
.photo.col3 						{ width: 45%; }
}
	
@media screen and (min-width: 1100px) {

body										{ font-size: 125%; }
}