body { background: #396803 url(../i/bg-page-min.jpg) fixed top left; color: #4d4d4d; text-align: center; font-size:100%; font-family: arial; }

#cta { display: none; position: absolute; top: 0; left: 0; width: 100%; padding: 0.5em 0; color: #000; background: #ffffb4; text-align: center; overflow: hidden; box-shadow: 0px 4px 5px rgba(0,0,0,0.3); }
#cta p a { text-decoration: none; }
#cta p { padding: 0 3em; font-family: 'MuseoSlab500', Georgia; }
a#close_cta { position: absolute; display: block; top: 1em; right: 1em; text-indent: -9999em; width: 24px; height: 24px; background: url(../i/close.png) 0 0 no-repeat; }

/* ===================== Text ===================== */
p.button { text-align:center; float:left;}
p.button a { width:218px; background:#3c8fc8; display:block; padding:10px 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border:1px solid #347bab; background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5ea1cf), color-stop(100%, #3c8fc8));background-image:-webkit-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-moz-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-o-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-ms-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:linear-gradient(top, #5ea1cf,#3c8fc8);-webkit-box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px;-moz-box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px;box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px; }

#container header p.button a:link{text-decoration: none; color:#fff;}
#container header p.button a:visited{text-decoration: none; color:#fff;}
#container header p.button a:hover{text-decoration: none; color:#fff; background: #3c8fc8;}
#container header p.button a:active{text-decoration: none; color:#fff;}

header a:link{text-decoration: none; color:#fff;}
header a:visited{text-decoration: none; color:#fff;}
header a:hover{text-decoration: underline; color:#fff;}
header a:active{text-decoration: none; color:#fff;}

#container a:link{text-decoration: none; color:#3c8fc8;}
#container a:visited{text-decoration: none; color:#3c8fc8;}
#container a:hover{text-decoration: underline; color:#3c8fc8;}
#container a:active{text-decoration: none; color:#3c8fc8;}

nav ul li {text-transform: uppercase; font-size: 95%; }

#container section h1 { font-size: 100%; }
#container section p { font-size: 95%; line-height: 180%;}
#container section ul { font-size: 95%; line-height: 180% }
#container section ol { font-size: 95%; line-height: 180% }

#container header h1 { font-family: 'MuseoSlab500', Georgia, serif; font-weight: normal; color:#659e1b; font-size: 170%; margin:0 0 20px 0;}
#container header p { font-family: 'Museo sans', "Trebuchet MS", sans-serif; color:#666; line-height: 150%; font-size: 105%;}

#container h2{font-family: 'MuseoSlab500', Georgia, serif; font-weight: normal; font-size: 120%; color:#659e1b; }
#container h3{font-family: 'MuseoSlab500', Georgia, serif; font-weight: normal; font-size: 110%; color:#6d6d6d; }


address{font-style: normal;}

/* ===================== Images ===================== */
img{max-width: 100%;}



/* ===================== CONTAINING ELEMENTS ===================== */
#wrapper { text-align: center; width: 940px; margin: auto; padding:0;}
header { float: left; width:820px; margin: 60px 0 60px 60px; }
header h1 { float:left; }
header h1 a { background: url(../i/logo.png) top center no-repeat; display: block; width:201px; height:70px; text-indent: -100000px; }
header nav { margin:0; }
nav ul{ float:right; font-size: 90%;}
nav ul li { float:left; margin:0 0 0 35px; }
nav ul li a { display: block; padding:25px 0 12px 0; transition: padding 0.15s ease-out; -moz-transition: padding 0.15s ease-out; -webkit-transition: padding 0.15s ease-out; -o-transition: padding 0.15s ease-out; }
nav ul li a:hover { text-decoration: none; padding:21px 0 4px 0;}
nav ul li a.selected{ background: url(../i/bg-menu.png) 50% 100% no-repeat; }
nav ul li a.selected:hover{ -moz-transition: none; padding:25px 0 12px 0; -webkit-transition: none; -o-transition: color 0 ease-in; transition: none;}

#container { float:left; width:940px; background: #fff; text-align: left; padding:0 0 55px 0; margin:0 0 100px 0; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;}
#container header { float: left; width:880px; margin: 0 0 50px 60px; }
#header-left{float:left; width:460px; clear: left; margin:55px 0 0 0;}
#container header h1 { float:left; width:460px;}
#container header p { float:left; width:460px; }
#header-right{float:right; width:280px; margin:60px 60px 0 0;}
#header-right p.button{float:right; width:220px; margin:50px 0 0 0; font-size: 100%; font-family: Arial;}

#header-right .vcard { float:left; width:280px; border-top:1px solid #e0e0e0; border-bottom:1px solid #e0e0e0; padding:0 0 15px 0; font-size:85%;}
#header-right .vcard p strong{ float:left; width:100%; margin:15px 0 0 0; color:#659e1b; font-weight: normal; font-family: 'MuseoSlab500', Georgia, serif;}
#header-right .vcard p { float:left; width:100%; color:#6d6d6d; font-family: "Museo sans", "Trebuchet MS", sans-serif;}
#header-right .vcard address { float:left; width:100%; color:#6d6d6d; font-family: "Museo sans", "Trebuchet MS", sans-serif;}

footer { float:left; width: 940px; margin:0;}
footer .vcard { float:left; width:233px; margin:0 0 0 60px; text-align: center; font-size: 82%; line-height: 175%; }
footer .vcard p strong{ color:#659e1b; font-weight: normal; font-family: MuseoSlab500, Georgia, serif; }
footer .vcard p { color:#6d6d6d; font-family: "Museo sans", "Trebuchet MS", sans-serif;}
footer .vcard address { color:#6d6d6d; font-family: "Museo sans", "Trebuchet MS", sans-serif;}

#twitter{float:left; margin:40px 0 0 60px; width:820px; text-align: center;}
#twitter ul{list-style: none; margin:0; width:720px; padding:45px 50px 20px 50px; background: #dbebf6 url(../i/bg-twitter.png) top center no-repeat; -moz-border-radius-topleft: 0px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px;}

#copy{ float:left; width:820px; margin:0 0 100px 60px; }
#copy p{ font-size: 90%; color:#fff; line-height: 200%;}

.clear{clear:both;}

/*===================== Individual pages ===================== */

/*Home*/
#container section.adaptive{ float:left; width:820px; padding:60px; background: url(../i/bg-grid-brown.png); margin:0 0 50px 0;}
#container .detail{float:right; width:320px; margin:20px 0 0 0;}
#container .detail h1{margin:0 0 10px 0; font-weight: normal; font-family: 'MuseoSlab500', Georgia, serif; font-size: 110%; background: url(../i/bg-tape-purple-small.png) top left no-repeat; height:30px; color:#fff; padding:8px 0 0 0; text-indent: 30px;}
#container .detail h2{color:#6d6d6d; font-size: 100%; padding:0 0 0 30px;}
#container .detail p{float:left; font-size:105%; margin:0 0 0 100px; font-family: 'MuseoSlab500', Georgia, serif; font-style: italic; }
#container .detail ul{float:left; font-size:95%; line-height: 130%; margin:20px 0 0 0; list-style: none;}
#container .detail ul li{float:left; width:290px; margin:0 0 20px 30px;  }
#container .detail ul li img{float:left; margin:0 20px 0 0;}
#container .detail p.button a{color:#fff;}
#container section.adaptive .monitor{float:left; width:500px;}
#container section.adaptive .ipad{position:relative; margin:-200px 0 0 400px;}
#container section.adaptive .iphone{position:relative; margin:-200px 0 0 705px;}

/*Testimonials*/
#container section.testimonials{ float:left; width:900px; padding:0; margin:0 0 50px 0;}
#container .testimonial{float:left; width:850px; margin:0; padding:0 60px; text-align: center; text-align: left;}
#container .testimonial h2 { margin-bottom: .7em; }
.testimonial cite { display: block; clear: left; font-style: italic; }
.testimonial blockquote { font-size: 18px; font-style: italic;  margin: 0.25em 0 0.25em 1.5em; padding: 0.25em 40px; line-height: 1.45; position: relative; color: #383838; }
.testimonial blockquote:before { display: block; content: "\201C"; font-size: 90px; position: absolute; left: -20px; top: -20px; color: #ccc; font-style: normal; }
.testimonial blockquote cite { color: #999999; font-size: 14px; display: block; margin-top: 5px; }
 
.testimonial blockquote cite:before { content: "\2014 \2009"; }


/*Services*/
#container section.services{ float:left; width:940px; padding:0; margin:0 0 50px 0;}

#container .service{float:left; width:940px; margin:0; padding:0 60px; text-align: center;}
#container .service h1{margin:0 0 15px 0; font-weight: normal; font-family: 'MuseoSlab500', Georgia, serif; font-size: 150%;}
#container .service h2{text-align: center; margin:15px 0;}
#container .service p{margin:0 0 15px 0; width:500px; margin:auto; line-height: 150%; font-family: 'Museo500', Georgia, serif; font-size: 110%; background: #fff;}

#container .service .badge{float:left; width:210px; margin:60px 25px 0 35px; }
#container .service .badge p{width:210px; margin:0; line-height: 150%; font-size: 90%; font-family: arial, sans-serif;}

#container .research{ background: url(../i/bg-portfolio.png); width:820px; padding:60px;}
#container .research h1{ background: url(../i/bg-tape-green.png) top center no-repeat; height:44px; color:#fff; padding:8px 0 0 0; }
#container .research h2{ color:#2ca02c; }
#container .design{ background: url(../i/bg-portfolio.png); width:820px; padding:60px;}
#container .design h1{ background: url(../i/bg-tape-blue.png) top center no-repeat; height:44px; color:#fff; padding:8px 0 0 0; }
#container .design h2{ color:#37abc8; }
#container .development{ background: url(../i/bg-portfolio.png); width:820px; padding:60px;}
#container .development h1{ background: url(../i/bg-tape-orange.png) top center no-repeat; height:44px; color:#fff; padding:8px 0 0 0; }
#container .development h2{ color:#ff7f2a; }
#container .strategy{ background: url(../i/bg-portfolio.png); width:820px; padding:60px;}
#container .strategy h1{ background: url(../i/bg-tape-aqua.png) top center no-repeat; height:44px; color:#fff; padding:8px 0 0 0; }
#container .strategy h2{ color:#008080; }

#container section.services .service-content{ float:left; width:400px; margin:45px 80px 45px 120px;}
#container section.services .service-image{ float:left; width:220px; margin:85px 0 0 0; }

/*About*/
#container section.about{ float:left; width:920px; padding:25px 0 0 0; background: url(../i/bg-grid-grey.png); margin:0 0 50px 0; border:10px solid #fff;}
#container section.about .staff{float:left; width:770px; margin:0 0 25px 60px; background: #fff; padding:20px 25px; }
#container section.about .pic{float:left; width:200px; margin:0 35px 0 0;}
#container section.about .bio{float:left; width:535px; margin:0;}
#container section.about .skills{float:left; width:535px; }
#container section.about .skills ul{margin:0; list-style-type: none; }
#container section.about .skills ul li{ display: inline; padding:0 0 0 15px; margin:0 10px 0 0; background:url(../i/bg-tick.png) 0 50% no-repeat; color:#999; }  
#container section.about h2{ margin: 0 0 15px 0; }
#container section.about p { margin:0 0 15px 0; line-height: 135%; }
#container section.about img { float:left; }

/*Portfolio*/
#container section.portfolio{ float:left; width:940px; padding:0; margin:0 0 10px 0; }
#container section.portfolio .portfolio-item{float:left; width:940px; padding:40px 0 0 0; background: url(../i/bg-portfolio.png); margin:0 0 40px 0; overflow: hidden;}
#container section.portfolio .description{float:left; width:280px; padding:10px; margin:0 0 0 60px; background: #ffffff;}
#container section.portfolio .description h2{color:#659e1b; margin:0 0 5px 0;}
#container section.portfolio .description p{font-size: 90%; line-height: 150%; margin:0 0 15px 0;}
#container section.portfolio .portfolio-item img{float:left; -webkit-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1); margin:0 0 0 60px;}
#container section.portfolio .portfolio-vid{float:left; margin:0 0 0 60px;}


/*Blog*/
#container section.blog{ float:left; width:885px; padding:25px 20px 0 35px; margin:20px 0 50px 0; background: url(../i/bg-grid-grey.png); }
#container section.blog .summary { float:left; width:358px; padding:20px; margin:0 10px 25px 20px; background: #fff; text-align: left; min-height: 220px; }
#container section.blog .summary time { float:left; font-size: 80%; color:#999; margin: 0 0 15px 0;}
#container section.blog .summary h2 { float:left; width:358px; margin:0 0 15px 0px; color:#659e1b; }
#container section.post article h3{	float:right; width:515px; margin:0 70px 5px 0; color:#659e1b; font-size: 100%;}
#container section.blog .summary p { float:left; width:358px; margin:0 0 10px 0px; line-height: 140%;}
#container a summary{display: block; width:389px; height: 250px;}
#container a:hover summary p a:hover{text-decoration: none;}

#container section.post{ float:left; width:940px; padding:25px 0 0 0; margin:20px 10px 0 0; background: url(../i/bg-grid-grey.png); }
#container section.post article{float:left; width:790px; padding:50px 0 0 0; margin:0 0 25px 80px; background: #fff;}
#container section.post article header{float:left; width:725px; padding:0; margin:0 0 25px 0; }
#container section.post article header time { float:left; width:170px; padding:5px; background: #fc0; margin:0 0 0 -40px; text-align: center; font-size: 95%; color:#fff;}
#container section.post article header span.aside{float:right; text-align: right; width: 110px; margin:10px 65px 0 0; color:#999; font-size: 80%;}
#container section.post article header h1 { float:left; width:515px; margin: 0 0 10px 65px; }
#container section.post article header p { width:515px; padding:0 0 25px 0; margin: 0 5px 0 0; font-size: 105%; border-bottom: 1px dashed #ccc; line-height: 180%;}
#container section.post article h2{	float:right; width:515px; margin:0 70px 5px 0; color:#659e1b;}
#container section.post article p{float:right; width:515px; margin:0 70px 30px 0; }
#container section.post article ul{float:right; width:475px; margin:0 70px 30px 0; }
#container section.post article ol{float:right; width:475px; margin:0 70px 30px 0;}
#container section.post article img{float:right; margin:0 70px 30px 0;}
#container section.post article span.aside{float:right; text-align: right; width: 120px; margin:10px 65px 0 0; color:#999; font-size: 80%; }
#container section.post article span.aside img{margin:0; text-align: left;}
#container section.post article .quote { color:#659e1b !important; font-size: 100% !important; font-family: Georgia; font-style: italic;}
#container section.post article .link{ background: url(../i/icon-external-link.png) 60% 92% no-repeat; }

section#comments {float:left; width:100%; padding:25px 0; margin:0 0 50px 0; background: #fffff3;}
section#comments h1{float:right; width:515px; margin:0 125px 5px 0; font-family: 'MuseoSlab500', Georgia, serif; font-weight: normal; font-size: 150%; color:#659e1b;}
section#comments p span{font-size: 80%;}
section#comments p{float:right; width:515px; margin:0 125px 5px 0; }
section#comments .comment{float:right; width:515px; margin:25px 125px 0 0; padding:0 0 25px 0; border-bottom: 1px dashed #ccc; }
section#comments .comment h2{font-family: Arial, sans-serif; font-size: 100%; color:#3c8fc8;}
section#comments .comment p{float:right; width:515px; margin:0; }
#comment-block {float:right; width:515px; margin:25px 125px 5px 0; }
#comment-block h3{float:right; width:515px; margin:0 0 10px 0; color:#659e1b;}
#comment-block .row{float:right; width:515px; margin:0 0 5px 0;}
#comment-block p.note{float:left; margin: 0; font-size: 80%; font-style: italic;}

#comment-block label { font-size: 90%; font-weight: bold; }
#comment-block input { width:96%; margin:5px 0 15px 0; border:1px solid #ccc; padding:1% 2%;}
#comment-block .submit input { width:218px; background:#3c8fc8; display:block; padding:10px 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border:1px solid #347bab; background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5ea1cf), color-stop(100%, #3c8fc8));background-image:-webkit-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-moz-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-o-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-ms-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:linear-gradient(top, #5ea1cf,#3c8fc8);-webkit-box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px;-moz-box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px;box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px; color:#fff;}
#comment-block .submit input:hover {text-decoration: none; background: #3c8fc8;}
#comment-block textarea { width:96%; border:1px solid #ccc; padding:1% 2%; margin:5px 0 15px 0; }
.required { color:red; }
#comment-block .captcha{float:left; margin:0;}
#comment-block .captcha label{float:left; width:515px;}
#comment-block .captcha img{float:left; margin:5px 20px 0 0;}
#comment-block .captcha input{float:left; width:200px;}


/*Contact*/
#container section.contact{ float:left; width:940px; padding:0; background: url(../i/bg-map.gif); margin:0; }
#container section.contact.nomap{background: #fff;}
#container section.contact #enquiries { float:left; width:400px; padding:30px; background: #fff; margin:25px 0 25px 60px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }

#container section.contact #enquiries p { margin:0 0 20px 0; }
#container section.contact #enquiries p.note { color:#999; margin:0 0 20px 0; font-size: 90%; font-style: italic; }
#container section.contact #enquiries h2 { color:#659e1b; margin:0 0 20px 0; }
#container section.contact #enquiries label { font-size: 90%; }
#container section.contact #enquiries input { width:96%; margin:5px 0 15px 0; border:1px solid #ccc; padding:1% 2%;}
#container section.contact #enquiries .submit input { width:218px; background:#3c8fc8; display:block; padding:10px 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border:1px solid #347bab; background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5ea1cf), color-stop(100%, #3c8fc8));background-image:-webkit-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-moz-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-o-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-ms-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:linear-gradient(top, #5ea1cf,#3c8fc8);-webkit-box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px;-moz-box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px;box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px; color:#fff; }
#container section.contact #enquiries .submit input:hover {text-decoration: none; background: #3c8fc8;}
#container section.contact #enquiries textarea { width:96%; border:1px solid #ccc; padding:1% 2%; margin:5px 0 25px 0; }
.required { color:red; }

/* ===================== MEDIA QUERIES =====================  */


/* ======= tablets  ======= */
@media screen and (max-width:768px){

}

/* ======= phones  ======= */
@media screen and (max-width:535px){

body{background: #396803 url(../i/bg-page-small.png) fixed top center;}

#wrapper { width:100%; }
header { width:100%; float:left; text-align: center; margin: 40px 0 40px 0;  }

header h1 { float: none; margin: 0 auto 20px auto; }
header h1 a { width:100%; }

header nav { text-align: center; float: left; width:100%; margin:25px 0 0 0; }
header nav ul { margin:0 1%; width:98%; }
header nav ul li { float:left; width:100%; margin:0 0 8px 0; text-align: center; }
header nav ul li:last-child{margin:0; }
header nav ul li a { display: block; line-height: 180%; padding:0; width:40%; margin:auto;}
header nav ul li a:hover { padding:0; }
header nav ul li a.selected { background: url(../i/bg-menu.png) 100% 50% no-repeat; }
header nav ul li a.selected:hover { padding:0; }


#container { width:100%;  -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; padding:25px 0 0 0;}
#container header { width:100%; margin:0 0 25px 0; text-align: center; }
#header-left { width:100%; margin:0; text-align: center;}
#container header h1 { width:93%; margin:0 3.5% 25px 3.5%; }
#container header p { width:93%; margin:0 3.5% 25px 3.5%; }

#header-right { width:100%; margin:0; text-align: center;}
#container header p.button {margin:auto; float: left; width:100%; text-align: center; background-color: transparent;}
#container header p.button a{width:218px; background:#3c8fc8; display:block; padding:10px 0; margin:auto; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border:1px solid #347bab; background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5ea1cf), color-stop(100%, #3c8fc8));background-image:-webkit-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-moz-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-o-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:-ms-linear-gradient(top, #5ea1cf,#3c8fc8);background-image:linear-gradient(top, #5ea1cf,#3c8fc8);-webkit-box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px;-moz-box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px;box-shadow:rgba(255,255,255,0.3) 0 1px 0 inset,rgba(0,0,0,0.05) 0 1px 2px;}
#container header p.button a:hover { background-color: #3c8fc8; }
#header-right .vcard { float: left; width:93%; margin:0 3.5% 0 3.5%; text-align: center;}
#header-right .vcard p strong{ width:100%; margin:15px 0 0 0; }
#header-right .vcard p { margin:0; padding:0; width: 100%;}
#header-right .vcard address { width: 100%; }

footer { width:93%; margin:25px 3.5% 0 3.5%; }
footer .vcard { width:100%; margin:0 0 25px 0; text-align: center;}

#twitter{ width:93%; margin:0 3.5% 25px 3.5%; }
#twitter ul{width:80%; padding:45px 10% 20px 10%; border-radius: 0;}

#copy { width:100%; margin:0 0 100px 0;}

#container section.grid { width:100%; padding:0; margin:0; }
#container section.contact { width:100%; padding:0; }

#container section.about { float:left; width:100%; }
#container section.about .staff{ float:left; width:93%; padding:15px 0 0 0; margin:0 3.5% 25px 3.5%; }
#container section.about .pic{float:left; width:93%; padding:0 3.5%; margin:0 0 25px 0;}
#container section.about .bio{float:left; width:93%; padding:0 3.5%; }
#container section.about .staff img{margin:0;}

/*Home*/
#container section.adaptive{ width:100%; padding:15px 0; margin:0;}
#container .detail{width:86%; margin:0 3.5% 15px 3.5%; padding:3.5%;}
#container .detail h1{margin:0 0 10px 0;}
#container .detail p{line-height: 130%; text-align: center; width: 100%; padding:0; margin: 0; }
#container section.adaptive .monitor{width:93%; margin:0 3.5%;}
#container section.adaptive .ipad{width:93%; margin:0 3.5%; text-align: center;}
#container section.adaptive .ipad img{max-width:70%;}
#container section.adaptive .iphone{width:93%; margin:0 3.5%; text-align: center;}
#container section.adaptive .iphone img{max-width:50%;}

p.tweet { display: block; padding-left: 130px; background: #f0f; }
/*Services*/

#container section.services{ width:100%; margin: 0; padding:0;}

#container .service{ width:93%; margin:0 3.5%; background: #fff;}
#container .service h1{margin:0 0 5px 0;}
#container .service p{margin:0 0 5px 0; width:100%;}

#container .research{ width:93%; margin:0; padding:25px 3.5% 25px 3.5%; background: url(../i/bg-portfolio-small.png);}
#container .design{width:93%; margin:0; padding:25px 3.5% 25px 3.5%;  background: url(../i/bg-portfolio-small.png);}
#container .development{ width:93%; margin:0; padding:25px 3.5% 25px 3.5%;  background: url(../i/bg-portfolio-small.png);}
#container .strategy{ width:93%; margin:0; padding:25px 3.5% 25px 3.5%; background: url(../i/bg-portfolio-small.png);}

#container .service .badge{width:93%; margin:20px 3.5% 20px 3.5%;}
#container .service .badge p{width:93%; margin:0 3.5%;}

#container section.services .service-content{ width:100%; margin:0; }
#container section.services .service-image{ max-width: 100%; margin:25px 0 0 0; padding:0;}

#container .research h1{ background-image:none; background-color:#2ca02c; height:auto; padding:5px 0; margin:0 0 10px 0; font-size: 120%;}
#container .research h2{ font-size: 100%; }
#container .design h1{ background-image:none; background-color:#37abc8; height:auto; padding:5px 0; margin:0 0 10px 0; font-size: 120%; }
#container .design h2{ font-size: 100%; }
#container .development h1{ background-image:none; background-color:#ff7f2a; height:auto; padding:5px 0; margin:0 0 10px 0; font-size: 120%; }
#container .development h2{ font-size: 100%; }
#container .strategy h1{ background-image:none; background-color:#008080; height:auto; padding:5px 0; margin:0 0 10px 0; font-size: 120%; }
#container .strategy h2{ font-size: 100% }


.testimonial { display: none !important; }

div.testimonial blockquote { display: none; }

/*Portfolio*/
#container section.portfolio{ float:left; width:100%; padding:0; margin:0; }
#container section.portfolio .portfolio-item{float:left; width:100%; padding:15px 0 0 0; background: url(../i/bg-portfolio-small.png); margin:0; overflow: hidden; text-align: center;}
#container section.portfolio .description{width:73%; padding:0; margin:-30px 10% 20px 10%; padding:10px 3.5%; text-align: left;}
#container section.portfolio .description h2{width:100%;}
#container section.portfolio .description p{width:100%;}
#container section.portfolio .portfolio-item img{ box-shadow: none; max-width: 100%; margin: 0 auto;}

/*Contact*/
#container section.contact #enquiries { float:left; width:86%; margin:25px 3.5%; padding:25px 3.5%;}
#container section.contact #enquiries input { width:96%; }
#container section.contact #enquiries textarea { width:96%; }

/*Blog*/
#container section.blog { width:100%; padding:25px 0 0 0; margin:0;}
#container section.blog .summary { float:left; width:86%; padding:15px 3.5% 0 3.5%; margin:0 3.5% 25px 3.5%; text-align: left; }
#container section.blog .summary time { float:left; width:100%; padding:0; margin:0 0 15px 0; text-align: left; background: #fff; color:#ccc; font-size: 80%; }
#container section.blog .summary h2 { float:left; width:100%; margin:0 0 15px 0; }
#container section.blog .summary p { float:left; width:100%; margin:0 0 15px 0; }

#container section.post { width:100%; padding:25px 0 0 0; margin:0;}
#container section.post article{float:left; width:100%; padding:0; margin:0; background: #fff;}
#container section.post article header {float:left; width:100%; padding:0; margin:0 0 25px 0; }
#container section.post article header time{ margin:0; width: 97%; margin:15px 0; background: #fff; color:#ccc;}
#container section.post article header h1{width:93%; margin:0 3.5% 15px 3.5%; text-align: center;}
#container section.post article header p{width:93%; margin:0 3.5%; text-align: center;}

#container section.post article header span.aside{ margin:0; width:93%; margin:25px 3.5% 0 3.5%; text-align: center; }
#container section.post article span.aside{ margin:0; width:93%; margin:0 3.5% 15px 3.5%; text-align: center;}

#container section.post article p { margin:0; width:93%; margin:0 3.5% 15px 3.5%; }
#container section.post article h2 { margin:0; width:93%; margin:30px 3.5% 15px 3.5%; }
#container section.post article ul { margin:0; width:81.5%; margin:0 3.5% 15px 15%; }
#container section.post article ol { margin:0; width:81.5%; margin:0 3.5% 15px 15%; }
#container section.post article img { margin:0; max-width:93%; margin:0 3.5% 15px 3.5%; }

section#comments { width:100%; margin:0; }
section#comments h1 { width:93%; margin:0 3.5% 15px 3.5%; }
section#comments p { width:93%; margin:0 3.5% 15px 3.5%; }
section#comments .comment { width:93%; margin:0 3.5% 25px 3.5%; }
section#comments .comment h2{ width:100%; margin:0; }
section#comments .comment p{ width:100%; margin:0; }

#comment-block { float:left; width:93%; margin:0 3.5% 0 3.5%;}
#comment-block h3 { width:100%; }
#comment-block .row{width:100%;}
#comment-block p.note { width:96%; }
#comment-block input { width:96%; }
#comment-block textarea { width:96%; }
#comment-block .captcha label{ width:96%; }
#comment-block .captcha img{ clear:left; }
#comment-block .captcha input{ width:96%; }



.info {}
.error { background: #FBE6F2 no-repeat; border: 1px solid #D893A1; color: #333; margin: 10px 0 20px; padding: 10px; }
.error p { margin: 0; padding: 0 0 0 2em; }

.half_column { display: none !important;  }