html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block;}
html{overflow-y:scroll;background:#FFF;}
img, embed, object, video{max-width:100%;border:none}
body{font-family:'Source Sans Pro', sans-serif;font-size:1em;line-height:1.618em;color:#000;}
h1, h2, h3, h4, h5, h6{margin-bottom:0.809em;line-height:1em;text-rendering:optimizeLegibility;}
p, ul, ol, dl, blockquote{font-size:1em;line-height:1.618em;margin-bottom:1.618em;}
ul{list-style-type:disc;margin-left:1.618em;}
ol{list-style-type:decimal;margin-left:1.618em;}
nav{background-color:#fff}
nav ul, nav ol{list-style:none;margin:0;padding:0;}
b, strong{font-weight:700;}
i, em{font-style:italic;}
small{font-size:80%;}
a, a:visited{outline:none;color:#FB7F0D;text-decoration:none;}
a:hover{outline:none;text-decoration:none;}
a:active, a:focus{outline:none;}
.highlight{}
.nav{max-width:100%;text-align:center;padding:4px 0 8px 0}
.nav li{display:inline;margin:0 40px;}
.nav li a{color:#FB7F0D;font-size:1.3em;line-height:1.5em;font-weight:700;text-decoration:none;vertical-align:middle;}
.nav li a:hover{opacity:0.7}
.nav li a:active{opacity:0.5}
.nav li a img{vertical-align:middle;margin-top:-0.2em;}
.nav-fixed{background:#fff;position:fixed;left:0;top:0;max-width:100%;width:100%;z-index:2;}
.container-full{padding-top:2em;width:100%;text-align:center}
.container{padding:1.618em;margin:0 auto;position:relative;max-width:60em;}
aside{width:100%;}
#services.container-full{padding-top:0}
#services{background:#E6DDCF;}
#about{background:#f2f2f2;}
#contact{text-align:center;background:#e2e2e2;}
#contact .container{max-width:500px;}
#logo-container{box-sizing:border-box;padding:30px 0;text-align:center;width:100%;}
#home h1 {margin-top:0}
#home h2 {font-size:2em;}
#about a, #contact a {font-weight:700;}
#work{background:#e2e2e2;overflow:hidden}
#work p{width:288px;margin-left:-144px;padding-left:50%}
#about p, #contact p{font-weight:300;font-size:1.2em;line-height:1.2em;margin:0;}
#about p{text-align:justify}
#contact span.info{font-weight:300;font-size:1.4em;line-height:1.4em;margin:0;}
#footer{text-align:center;background:#2b2b2b;color:#969A7A;border-top:5px solid #FB7F0D;z-index:30;position:relative}
#footer.container-full{padding-top:0;}
.cf:before, .cf:after{content:"";display:block;}
.cf:after{clear:both;}
.column{display:inline-block;vertical-align:text-top;width:30%;margin:1em 1.5%}
#about .column{margin:1.5em 1.5%}
#about .column p{padding-bottom:0.5em}
#work .column{margin:1.2em 1.5%;font-size:1.1em;}
#footer .column{margin:0 1.5%;text-align:center;}
#baselogo {width:100%;}
#baselogo div {margin:0 auto;max-width:500px;}
#baselogo img {width:100%;height:auto;margin:0 0 0 -1em;}
div.spacer {padding-top:3em;}
a#downarrow{display:none;position:fixed;bottom:0px;left:50%;min-width:88px;min-height:26px;margin:0 0 0 -44px;padding:0;opacity:0.7;z-index:20;
	background:url(../img/down.png) no-repeat top center;transition:all ease-in-out .4s;-webkit-transition:all ease-in-out .4s;
	-moz-transition: all ease-in-out .4s;-o-transition:all ease-in-out .4s;-webkit-backface-visibility:hidden;}
a#downarrow:hover{opacity:1;}
#navinline.fixit{position:fixed;top:0;width:100%;left:50%;margin:0 0 0 -50%;z-index:100;background-color:#fff;}
#navinline.moving{position:absolute;top:0;width:100%;left:50%;margin:0 0 0 -50%;z-index:100;background-color:#fff;}
h1{color:#382E15;text-align:center;font-weight:400;line-height:1.3em;
	margin-top:1.9em;margin-bottom:0.5em;padding:0 3em;font-size:3em;}
.ampersand{font-family:'Libre Baskerville', serif;font-size:1.3em;font-style:italic;position:relative;top:.15em;margin-left:-.2em;margin-right:-.19em;}
h1 span, h2 span{color:#FB7F0D}
h2{color:#382E15;text-align:center;font-size:1.3em;font-weight:700;letter-spacing:.05em;margin-bottom:0;text-transform:uppercase;}
#about h2, #work h2, #contact h2{color:#666;display:block;}
#footer h2{color:#fff;display:block;text-align:center;margin-bottom:0.2em}
h3 span {font-size:150%;font-weight:300;line-height:1.1em;display:inline-block;width:100%;color:#382E15;}
/*Services*/
h3 span:first-child{margin:1.1em 0 0.7em 0}
h3.h3l span:nth-child(2){font-size:28px}
h3.h3l span:nth-child(3){font-size:32.1px;letter-spacing:0.01em}
h3.h3l span:nth-child(4){font-size:19.4px;letter-spacing:0.01em}
h3.h3l span:nth-child(5){font-size:28.4px}
h3.h3l span:nth-child(6){font-size:1.47em;letter-spacing:0.01em}
h3.h3r span:nth-child(2){font-size:34px;letter-spacing:0.07em}
h3.h3r span:nth-child(3){font-size:21px}
h3.h3r span:nth-child(4){font-size:31px;letter-spacing:0.04em}
h3.h3r span:nth-child(5){font-size:46px;letter-spacing:0.01em}
h3.h3r span:nth-child(6){font-size:1.45em}
/*About*/
h3.heading{position:relative;width:200px;height:150px;overflow:hidden;display:inline-block;font-weight:300;font-size:1.4em;line-height:8em}
h3.heading img{position:relative;top:0;max-width:none}
h3 img.head-1{left:0}
h3 img.head-2{left:-200px}
h3 img.head-3{left:-399px}
h3 img.head-4{left:-600px}
h3 img.head-5{left:-800px}
h3 img.head-6{left:-1000px}
/*Work*/
h3.website{position:relative;width:288px;height:175px;overflow:hidden;display:inline-block;font-weight:300;font-size:1.4em;line-height:8em}
h3.website img{position:relative;top:0;max-width:none}
h3 img.webpic-1{left:0}
h3 img.webpic-2{left:-288px}
h3 img.webpic-3{left:-576px}
h3 img.webpic-4{left:-864px}
h3 img.webpic-5{left:-1152px}
h3 img.webpic-6{left:-1440px}
h3 img.webpic-7{left:-1728px}
h3 img.webpic-8{left:-2016px}
h3 img.webpic-9{left:-2304px}
h4{font-weight:300;font-size:1.5em;margin-bottom:.1em;margin-top:.1em;}
#about h4, #contact h4{line-height:1.2em;padding-top:3em;margin-top:0;text-align:center;}
span.icon{position:relative;overflow:hidden;display:inline-block;font-weight:300;font-size:1.4em;line-height:1.62em;vertical-align:middle;}
span.icon img{position:relative;top:0;max-width:none;}
span.icon-e{width:41px;height:46px;margin-right:10px;}
img.icon-e{left:0}
span.icon-p{width:240px;height:46px;}
img.icon-p{left:-111px}
span.icon-p{width:240px;height:46px;}
img.icon-p{left:-111px}
span.icon-f{width:35px;height:46px;vertical-align:baseline;}
img.icon-f{left:-76px}
span.icon-t{width:35px;height:46px;vertical-align:baseline;}
img.icon-t{left:-41px}

@media only screen and (min-width:768px) and (max-width:1023px){
	.nav li{margin:0 30px;}
	.column{width:45%;margin:1em 2%}
	#footer .column{width:30%;margin:0 1.5%}
}
@media only screen and (max-width:767px){
	.container{max-width:100%;padding:0 0.5em}
	h1{font-size:2em;padding:0;}
	.nav li{display:inline;margin:0 10px;font-size:1.1em;}
	.nav li a img{padding-top:0.1em;}
	.column{width:90%;margin:1em 5%}
	#footer.container-full {padding:3% 1% 1% 1%}
	#footer .column{width:29%;margin:0 1.5%}
	#hidemob{display:none}
	#navinline.fixit{border-bottom:1px solid #f2f2f2;}
	div.spacer {padding-top:1em;}
}
@media only screen and (max-width:319px){
	body{min-width:300px;font-size:90%}
	.container{max-width:100%;padding:0 0.2em}
	.column{width:98%;margin:0.5em 0}
	#work .column{margin:1em 0}
	div.spacer {padding-top:0.5em;}
	#work p{width:95%;margin-left:0;padding-left:0}
}
