/* #003883  */

/*___________________________________________________

Author: Stuart Gamblen
Version: 0.1.0
URL: http://www.upwardcreative.com
Based on: Golden Grid System (1.01) <http://goldengridsystem.com/> 
by Joni Korpi <http://jonikorpi.com/>
_____________________________________________________

/* @group ------- RESET --------------------------------------------------------- 
Margin, padding, and border resets except for form element*/
body, div, h1, h2, h3, h4, h5, h6, p, blockquote, pre, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
}
/* @end */

/* @group ------- CONSISTANCY FIXES --------------------------------------- 
adopted from http://necolas.github.com/normalize.css */
html {
  height: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  min-height: 100%;
  font-size: 100%;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, audio, canvas, video {
  display: block;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

b, strong {
  font-weight: bold;
}

abbr[title] {
  border-bottom: 1px dotted;
}

input,
textarea,
button,
select {
  margin: 0;
  font-size: 100%;
  line-height: normal;
  vertical-align: baseline;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer;
  -webkit-appearance: button;
}

input[type="checkbox"], input[type="radio"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

textarea {
  overflow: auto;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}
/* @end */

/* @group ------- SIMPLE FLUID MEDIA ------------------------------------------*/
figure {
  position: relative;
}

figure img,
figure object,
figure embed,
figure video {
  max-width: 100%;
  display: block;
}

img {
  border: 0;
  /* -ms-interpolation-mode: bicubic; */
}
/* @end */

/* @group - TYPOGRAPHY --------------------------------------------------------*/
@font-face {
  font-family: 'DINNextLTPro-Heavy';
  src: url('fonts/DINNextLTPro-Heavy.eot');
  src: url('fonts/DINNextLTPro-Heavy.eot?#iefix') format('embedded-opentype'),
       url('fonts/DINNextLTPro-Heavy.woff') format('woff'),
       url('fonts/DINNextLTPro-Heavy.ttf') format('truetype'),
       url('fonts/DINNextLTPro-Heavy.svg#DINNextLTPro-Heavy') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'DroidSansRegular';
  src: url('fonts/DroidSans-webfont.eot');
  src: url('fonts/DroidSans-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/DroidSans-webfont.woff') format('woff'),
       url('fonts/DroidSans-webfont.ttf') format('truetype'),
       url('fonts/DroidSans-webfont.svg#DroidSansRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* @end */

/* @group - ZOOMABLE BASELINE GRID TYPE SIZE PRESETS --------------------------*/
body {
  font-family: "DroidSansRegular", "Helvetica Neue", Helvetica, Arial, sans-serif;
  background: #F1F1F1 url('imgs/mainBgTile.png');
  font-size: 1em;
  line-height: 1.5em;
}

p {
  color: #494949;
}

address.cDetails {
  font-style: normal;
}

#content p {
  margin: 0.6em 0 1em 0;
}

#footContact p.cDetails {
  color: #003883 ;
  font-size: 1em;
  font-family: "DINNextLTPro-Heavy", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
}

#footContact .call {
  margin-top: 1em;
}

#content #process p {
  font-size: 1.1em;
  line-height: 1.5em;
}

footer p, #footer li, address {
  font-size: 0.9em;
  color: #D6D6D6;
}


h1 {
  font: 2em "DINNextLTPro-Heavy", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  color: #222;
  letter-spacing: -1px;
}

h2 {
  font-family: "DINNextLTPro-Heavy", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  font-size: 1.7em;
  font-weight: normal;
  line-height: 1em;
  color: #222;
  letter-spacing: -1px;
}

#portfolio h2 {
  font-family: "DroidSansRegular", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.8em;
  line-height: 1.5em;
  color: #222;
  letter-spacing: 0;
}

.big {
  font: 2em "DINNextLTPro-Heavy", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.small {
  font: 1.4em "DroidSansRegular", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform: none;
}

h3 {
  text-transform: uppercase;
  font-size: 0.8em;
  color: #222222;
  line-height: 1.5em;
}

h4 {
  font: 1.6em "DINNextLTPro-Heavy", "Helvetica Neue", Helvetica, Arial, sans-serif; /* 1.75em */
  text-transform: uppercase;
  color: white;
  letter-spacing: -1px;
}

.fwBoxR h4 {
  color: #494949;
  margin-top: 1em;
}

.inner h4 {
  color: #FFFFFF;
  margin: 0 0 0.2em 0;
}

blockquote {
  font-size: 1.2em;
  line-height: 1.5em;
  margin-bottom: 0.625em;
  color: #494949;
  margin-top: 0.5em;
}

.speach {
  font-family: "DINNextLTPro-Heavy", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1.5em;
  color: #222222;
  position : relative;
  top : 0.2em;
}

cite span {
  display: block;
  font-style: normal;
  font-weight: normal;
  text-transform: uppercase;
  color: #494949;
  font-size: 0.9em;
}

cite span.person strong {
  color: #222222;
}
/* @end */

/* @group ------- COLOURS & LINKS ---------------------------------------------*/
/* HEADER */
span.one {
  color: #FFF;
}

span.two {
  color: #003883 ;
}

span.three {
  /*color: #003883 ;*/
  font-size: 0.65em;
  line-height: 0.5em;
}

#logo a {
	border-bottom: none;
	z-index:10;
}

/* NAV */
nav ul li a {
  color: #494949;
  display: block;
  padding: 8px 10px;
  text-decoration: none;
  border-bottom: none;
  height: 17px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  /*float: left;*/
}

nav ul li a:hover, nav ul li a:focus {
  color: #FFF;
  background-color: #003883 ;
  border-bottom: none;  
}

nav ul li.current a, nav ul li.current a:hover {
  background-color: #222;
  color: #FFF;
}

nav ul li a:active {
  color: #FFF;
}

/* MAIN LINK */
a {
  text-decoration: none;
  color: #003883 ;
  border-bottom: transparent 1px solid;
}

a:hover, a:focus {
  color: #003883 ;
  border-bottom: #003883  1px solid;
}

a:visited {
  border-bottom: #003883  1px solid;
}

/* BUTTONS */
a.two { 
  font-size: 0.75em;
  background: #003883 ;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
  color: white;
  text-decoration: none;
  padding: 0.6em 0.8em 0.55em;
  text-transform: uppercase;
  border-bottom: none;
  line-height: 1em;
  float: left;
}

a.two:hover, a.two:focus {
  background: #222222;
  color: #FFFFFF;
  border-bottom: none;
}

.project a.two {
  background: #DDD;
  color: white;
}

.project a.two:hover, .project a.two:focus {
  background: #222222;
  color: #FFFFFF;
  border-bottom: none;
}

/* 404 */
#fourOfour #illuTitle a {
  color: #FFF;
  border-bottom: none;
}

#fourOfour #illuTitle a:hover, #fourOfour #illuTitle a:focus {
  color: #222222;
}

/* SELECTION */
::selection {
  background: #222222;
  color: #FFF;
}
::-moz-selection {
    background: #222222;
    color: #FFF;
}
img::selection {
    background: #222222;
    color: #FFF;
}
img::-moz-selection {
    background: #222222;
    color: #FFF;
}
body {
  -webkit-tap-highlight-color: #222222;
  text-align: center;
}

/* TRANSITIONAL ELEMENTS */
a, nav ul li a, .box, a.two, figure img, .mask, button.submit, input.submit, a.anchorLink, a.anchorLink span {
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  transition: all 200ms linear;       
}
/* @end */

/* @group - MOBILE FIRST LAYOUT (320px: Mobile width) -------------------------*/
/* ---------------- CONSTRAIN WIDTH ----------------------------------*/
#banner, #illuTitle, #content, #contact, div.inner {
  width: 20em;
}

.wrap {
  margin: 0 auto;
  text-align: left;
  z-index:299;
}

/* ---------------- GLOBAL CODE --------------------------------------*/
.wrapper {  /*  SIMPLE ELASTIC GUTTERS - Note: Box-sizing will not work in IE6-8 */
  padding: 0 0.75em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

li {
  list-style: none outside none;
}

.box {
  padding: 1.5em 1.5em 1.5em 1.5em;
  background-color: #FFFFFF;
  color: #494949;
  overflow: hidden;
  border-bottom: 2px solid #003883 ;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.only_border_bottom {
  padding-top: 1.5em;
  margin-bottom: 1.5em;
  width:100%;
  border-bottom: 2px solid #003883 ;
}

/* ---------------- HEADER ---------------------------------------------*/
#headmast {
  width: 100%;
  background-color: #FFFFFF;
  border-top: 7px solid black;
}

#banner {
  height: 210px;
  padding: 0 0.75em;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

#portfolio #banner {
  height: 214px;
}

#logo {
 /*float: left;*/
  /*margin: 0 auto;*/
  padding-top: 2em;
  height: 55px;
  z-index:10;
}

/* MENU */
nav {
  float:right;
  height: 37px;
  /*margin: 1.5em auto 0;*/
  width: 205px;
}

nav .wrapper {
  float: left;
  width: 100%;
}

nav ul{
  font: 0.9em "DroidSansRegular", "Helvetica Neue", Helvetica, Arial, sans-serif;
  list-style: none outside none;
  margin: 0;
}

/*
nav ul{
  font: 1em "DroidSansRegular", "Helvetica Neue", Helvetica, Arial, sans-serif;
  list-style: none outside none;
  margin: 0;
}
*/

nav ul li {
  float: left;
  margin: 0 0 5px 5px;
  background-color: #f1f1f1;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  display: inline;
}

/* ADD THIS */
#headSocial {
  position: absolute; 
  top: 0px;
  float: left;
  right: 0;
}

#headSocial .addthis_toolbox {
  float: left;
  background-color: #F1F1F1;
  padding: 6px 2px 7px 9px; /*0.5em 0 0.45em 0.5em;*/ /*height: 27px; 1.6875em */ /*  7px 2px 8px 6px*/
  margin: 0 0.75em 0 0;
  height: 20px;
  -webkit-border-bottom-right-radius: 2px;
  -webkit-border-bottom-left-radius: 2px;
  -moz-border-radius-bottomright: 2px;
  -moz-border-radius-bottomleft: 2px;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px; 
}

.addthis_button_twitter_follow_native {
  width: 145px;
}

.addthis_button_tweet {
  width: 102px;
}

/* -- MAIN TITLE & ILLUSTRATION -- */
#bannerTwo {
  background: /*#003883 */ #ccc url('imgs/headerBG.png');
}

#illuTitle {          
  position: relative;
  padding: 0 0.75em;
  height: 19em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  z-index:99;
}

#illuTitle h1 {
  position: absolute;
  width: 92%;
  font-size: 1.8em;
  line-height: 0.835em;
  text-align: left;
  top: 1.1em;
  letter-spacing: -1px;
}

#fourOfour #illuTitle {
  height: 11em;
}

#fourOfour #illuTitle h1{
  width: 92%;
}

.mainImage {
  position: absolute;
  bottom: 1.2em;
  right: 0.75em;
  width: 92%;
}      

#work .mainImage {
  right: 3.2em;
  width: 68%;
}

#tearOne {
  position: absolute;
  width: 100%;
  height: 22px;
  background: url('imgs/paperEdgeOne.png') repeat-x left top;
  top: 208px;
  left: 0;
}

#tearTwo {
  position: absolute;
  width: 100%;
  height: 22px;
  background: url('imgs/paperEdgeTwo.png') repeat-x left top;
  top: -11px;
  left: 0;
}

/* ---------------- MAIN CONTENT ------------------------------------ */
#container {
  position: relative;
}

#content {
  padding-top: 0.7em;
}

#content .wrapper {
  margin-top: 1.5em;
}    

.fwWrapper{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

#fwBG {
  background-color: #FFFFFF;
  overflow: hidden;
  border-bottom: 2px solid #003883 ;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.fwBoxL {
  padding: 1.5em 1.5em 0em 1.5em;
  background-color: #FFFFFF;
  color: #494949;
}

.fwBoxR {
  padding: 0em 1.5em 1.5em 1.5em;
  background-color: #FFFFFF;
  color: #494949;
  float: left;
}

#content .first {
  margin-top: 0;
}

/* ADDTHIS SOCIAL MEDIA */
.addthis_default_style .at300b, .addthis_default_style .at300bo, .addthis_default_style .at300m {
  height: 20px;
  padding: 0;
}

.addthis_default_style .addthis_button_twitter_follow_native {
  padding: 0;
}

/* ---------------- FOOTER -----------------------------------------*/
#footer {
  background: none;
  clear: both;
}

/* CONTACT SECTION */
#contact {
  padding: 3em 0.75em; /* padding-top: 3em; */
  margin: 0 auto;
}

#contact section {
  margin-top: 0.5em;
}

.details {
  width: 13em;
  float: none;
}

#tearFooter {
  width: 100%;
  height: 22px;
  background: url('imgs/paperEdgeFooter.png') repeat-x left top;
}

/* BOTTOM SECTION */
#footBottom {
  background: #222 url('imgs/footerTile.png');
  overflow: hidden;
  padding: 0.3em 0 2.5em 0;
}        

.inner {
  position: relative;
  overflow: hidden;
}

#tweets, #footSocial, #copyright {
  margin-top: 2.5em;
  width: 100%;
}

#twitter li, #footList, .boring, #footAdWrap {
  border-top: 1px dotted black;
  padding: 0.8em 0;
}

/* To top button */
#footAddress {
  margin-top: 3.5em;
  width: 100%;
}

#footAddress address {
  font-style: normal;
  margin-bottom: 1.5em;
}

#footerLogo {
  background: url(imgs/footerLogo.png) no-repeat 0 5px;
  padding: 0.5em 0 0.5em 3.8em;
  color: #FFF;
}

a.anchorLink {
  float: left;
  margin-top: 0.2em;
  font-size: 0.75em;
  color: #000;
  background-color: #003883 ;
  border-bottom: none;
  line-height: 1em;
  padding: 0.2em 0.5em;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

a.anchorLink:hover, a.anchorLink:focus  {
  color: #FFF;
}

a.anchorLink span {
  color: #FFF;
}

a.anchorLink:hover span, a.anchorLink:focus span {
  color: #000;
}

/* Social media images & links */
#footList { overflow: hidden;}
#footList li { width: 39px; height: 39px; float: left; margin: 0 0.625em 0 0; padding-bottom: 1em; display: inline;}
#footList a { 
  font: 0/0 a;
  text-shadow: none;
  color: transparent;
  display: block; 
  width: 39px; 
  height: 39px; 
  float: left; 
  background-color: transparent; 
  padding: 0; 
  border: none;
}
#footList span { background: transparent url(imgs/social_icons.png) no-repeat 0 0; height: 100%; width: 100%; float: left;}

#footList a#facebook span { background-position: 0 0; }
#footList a#facebook:hover span { background-position: 0 100%; }
#footList a#twit span { background-position: -39px 0; }
#footList a#twit:hover span { background-position: -39px 100%; }
#footList a#googlePlus span { background-position: -78px 0; }
#footList a#googlePlus:hover span { background-position: -78px 100%; }
#footList a#linkedin span { background-position: -117px 0; }
#footList a#linkedin:hover span { background-position: -117px 100%; }
#footList a#behance span { background-position: -156px 0; }
#footList a#behance:hover span { background-position: -156px 100%; }
#footList a#flickr span { background-position: -195px 0; }
#footList a#flickr:hover span { background-position: -195px 100%; }
#footList a#instagram span { background-position: -234px 0; }
#footList a#instagram:hover span { background-position: -234px 100%; }
#footList a#pinterest span { background-position: -273px 0; }
#footList a#pinterest:hover span { background-position: -273px 100%; }
/* #footList a#dribbble span { background-position: -234px 0; }
#footList a#dribbble:hover span { background-position: -234px 100%; } */

/* ---------------- SPECIFIC PAGES ------------------------------------------*/
/* ----- HOME PAGE ---------*/
#feat #featOne.wrapper {
  padding: 1em 0 2em 0;
  margin: 0;
}

#feat #featTwo.wrapper {
  padding: 0;
  margin: 0;
}

#feat #featOne img, #feat #featTwo img {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

#hRow .info {
  padding: 1em 0 1.5em 0;
}


/* ----- ABOUT PAGE --------*/
#aRowTwo ul {
  margin-top: 1em;
  padding: 0.23em 0;
  border-top: 1px dotted #494949;
}

#aRowTwo li {
  /* background: url('imgs/about/tick.png') no-repeat 0 0.9em; */
  padding: 0.5em 0 0.5em 0em; /* 0.5em 0 0.5em 1.7em; */
  border-bottom: 1px dotted #494949;
}

#aRow blockquote {
  color: #222;
}

.me {
  background-color: #f1f1f1;
}

.me img {
  margin: 1em auto 1em;
}

/* AddThis */
#aRow .addthis_button_twitter_follow_native { /*Follow button */
  margin: 0.4em 0 0em 0;
}

/* ----- SERVICES PAGE -----*/
.sBranding img, .sPrint img, .sIllu img, .sPrinting img, .sWeb img, .sWebS img {
  margin: 0 auto 1.5em;
}

#sWebRow .fwBoxL {
  margin-bottom: 0.75em;
  overflow: hidden;
}

/* Centre images */
#process {
  margin-top: 4em;
}

#process figure img {
  margin: 1em auto;
}

#content #process .wrapper{
  margin-top: 0em;
}

/* ----- WORK PAGE ---------*/
#wRow .box {
  padding: 1.25em;
  height: 6.6em;
}

#wRow h3, #hRow h3 {
  margin-bottom: 0.4em;
}

#wRow .box {
  -webkit-border-top-right-radius: 0;
  -webkit-border-top-left-radius: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-topleft: 0;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}

.wImage
{
	height:207px;
	width:100%;
	background: #ffffff;
	border-bottom: 2px solid #003883 ;
	margin:0;padding:0 auto;
	text-align:center;
	line-height:207px;
	/*display:table;*/
}
.wImage img { max-height:100%; }
.p_blank{}

#work img {
  -webkit-border-top-left-radius: 2px;
  -webkit-border-top-right-radius: 2px;
  -moz-border-radius-topleft: 2px;
  -moz-border-radius-topright: 2px;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
} 

.mask {
  background-color: #222222;
  cursor: pointer;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft. Alpha(Opacity=0)"; /* IE 8 hack */
  filter: alpha(opacity = 0); /* IE 5-7 hack */
}

.mask:hover {
  height: 100%;
  opacity: 0.4;
  -ms-filter: "progid:DXImageTransform.Microsoft. Alpha(Opacity=40)"; /* IE 8 hack */
  filter: alpha(opacity = 40); /* IE 5-7 hack */
}        

/* ----- PORTFOLIO PAGE ---- */
/* Nav */
.portHead {
  position: relative;
}

.project {
  margin: 2em 0 0 0;
}

/* Margins */
#content .project .wrapper {
  margin-top: 0;
}

.folio {
  margin-top: 1.5em;
}

.prevNext {
  margin: 0.9em 0 0;
}

.prevNext a[rel~="prev"], .prevNext a[rel~="next"] {
  background: url('imgs/portfolio/prev_next.png') no-repeat -48px 0px #DDD;
  display: block;
  overflow: hidden;
  font:0px/0 a;
  text-shadow: none;
  color: transparent;
  height: 48px;
  width: 48px;
  -webkit-tap-highlight-color: transparent;
  -webkit-border-radius: 48px;
  -moz-border-radius: 48px;
  border-radius: 48px;
  border-bottom: none;
}

.prevNext a[rel~="prev"] {
  background-position: 0px 0px;
  float: left;
  margin-right: 8px;
  border-bottom: none;
}

.prevNext a[rel~="prev"]:hover, .prevNext a[rel~="next"]:hover, .prevNext a[rel~="prev"]:focus, .prevNext a[rel~="next"]:focus {
  background-color: #222222;
}

.prevNext a[rel~="prev"]:active, .prevNext a[rel~="next"]:active {
  background-color: #003883 ;
}

/* Images */
.folio img {
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
  margin-bottom: 1.5em;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.folio .browser {
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  margin-bottom: 1.5em;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.folio .noFx {
  border: 0 none;
  box-shadow: none;
}

/* Social buttons */
.folioSocial {
  padding: 0.5em 0;
  margin-bottom: 1.5em;
  border-top: 1px dotted #DDD;
  border-bottom: 1px dotted #DDD;
}

.folioSocial .addthis_button_tweet, .folioSocial .addthis_button_facebook_like, .folioSocial .addthis_button_google_plusone, .folioSocial .addthis_counter.addthis_pill_style {
  padding: 0.7em 0;
}

/* Text */
.blockTwo {
  font-size: 1.1em;
}

.citeTwo span {
  font-size: 0.9em;
  margin-bottom: 1.1em;
  line-height: 1.5em;
}

/* ----- CONTACT PAGE ------ */
#cRowTwo {
  margin-bottom: 3em;
  width: 100%;
}

#cRow p, #cRowTwo p {
  margin-bottom: 0;
}

#cRow p.cDetails, #cRow address.cDetails {
  margin: 0;
}

#details h3 {
  line-height: 1.2em;
}

#details p.cDetails, #details address.cDetails {
  color: #222;
}

/* Details */
#details .envelope, #details .tel, #details .fax, #details #skype, #details #location, #details #dlvCard {
  margin: 0;
  float: none;
  width: auto;
}

#details .mail, #details .call, #details #skypeInfo, #details #address, #details #dlvCard {
  padding-left: 3.5em;
  width: auto;
}

#details .cDetails {
  font-size: 1em;
}

#details .envelope {
  margin-top: 0.9em;
  background: url('imgs/envelope.png') no-repeat 0 0;
  height: 2.5em;
}

#details .tel {
  background: url('imgs/tel.png') no-repeat 0 0;
  height: 2.5em;
}

#details .fax {
  background: url('imgs/fax.png') no-repeat 0 0;
  height: 2.5em;
}

#details #skype {
  background: url('imgs/skype.png') no-repeat 0 0;
  height: 2.5em;
}

#details #location {
  background: url('imgs/location.png') no-repeat 0 0;
}

#details #dlvCard {
  background: url('imgs/download.png') no-repeat 0 0;
  height: 2.5em;
}

#details .envelope, #details .tel, #details .fax, #details #skype, #details #location {
  margin-bottom: 1.4em;
}

/* Contact Form */
#frm_cart, 
#aregform, 
#pregform, 
#loginform,
#contactform, #directions #saddr {
  margin-top: 0.9em;
}

#rForm p, label, legend, 
#cForm p, label, legend { 
  font-family: "DroidSansRegular", "Helvetica Neue", Helvetica, Arial, sans-serif; 
}

#rForm, 
#cForm {
  position: relative;
}

#rForm .container, 
#cForm .container { 
  margin-bottom: 0.8em;
}

#rForm label, 
#cForm label { 
  display: block; 
  font-size: 1em;
  color: #494949;
}

#sForm input[type="text"], 
#rForm input[type="text"], #rForm input[type="password"], 
#cForm input[type="text"], #cForm input[type="password"], textarea, #directions input[type="text"], select { 
  padding: 0.3125em 0; 
  color: #494949; 
  background: whitesmoke; 
  border: 1px solid #E2E2E2;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px; 
  -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.05);
  -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.05);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.05);
  outline: 0;
}

table.compra {
	width:100%;
	/*font-size: 0.8em;*/
}
table.compra td {
	padding: 0.125em 0;
	text-align:center;
	border-bottom:1px solid #E2E2E2;
}
table.compra input[type="text"] {
  padding: 0.3125em 0; 
  color: #494949; 
  background: whitesmoke; 
  border: 1px solid #E2E2E2;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px; 
  -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.05);
  -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.05);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.05);
  outline: 0;
  
  width: 5em;
}
table.compra td.top_compra {
	/*border: 1px solid #E2E2E2;*/
	font-weight:bold;
}
table.compra td.acqista {
	text-align:right;
}
table.compra td.futura {
	font-size:1em;
	line-height:1em;
}

input {
  -moz-appearance: none;
}

#cForm label.verify {
  padding: 0.2em 0.625em 0 0;
}

#cForm input#verify {
  display: inline-block;
}

#cForm input#username, #cForm input#password,
#cForm input#name, #cForm input#email, #cForm input#phone, #cForm textarea#comments, #cForm input#verify {
  width: 100%;
  margin: 0;
}

#rForm input#acognome, #rForm input#anome, #rForm select#psesso, 
#rForm input#pcognome, #rForm input#pnome, #rForm select#psesso {
  width: 49%;
  margin: 0;
}

#rForm input#arag_soc {
  width: 100%;/*66%;*/
  margin:0;
}

#rForm input#atipo, 
#rForm select#pmese_nascita, #rForm select#pgiorno_nascita, #rForm select#panno_nascita {
  width: 32%;
  margin: 0;
}

#rForm input#aindirizzo, 
#rForm input#astato, 
#rForm input#ap_iva, 
#rForm input#acod_f, 
#rForm input#ae_mail, 
#rForm input#atel, 
#rForm input#ausername, 
#rForm input#apassword, 
#rForm input#arepeatpassword, 

#rForm input#pindirizzo, input#dest_nome, input#dest_via, input#dest_note, 
#rForm input#pstato, 
#rForm input#pcod_f, 
#rForm input#psesso, 
#rForm input#pstato_nascita, 
#rForm input#pe_mail, input#email, 
#rForm input#ptel, 
#rForm input#pusername, 
#rForm input#ppassword, 
#rForm input#prepeatpassword {
  width: 100%;
  margin: 0;
}

#rForm input#acap, input#dest_cap, 
#rForm input#pcap {
  width: 24%;
  margin: 0;
}
#rForm input#acitta, input#dest_citta, 
#rForm input#pcitta {
  width: 64%;
  margin: 0;
}

#rForm input#aprov, input#dest_prov, 
#rForm input#pprov {
  width: 9%;
  margin: 0;
}

#rForm input#pcitta_nascita {
  width: 89%;
  margin: 0;
}
#rForm input#pprov_nascita {
  width: 9%;
  margin: 0;
}

#rForm input:focus, textarea:focus, select:focus, 
#cForm input:focus, textarea:focus, select:focus, #directions #saddr:focus { 
  border: 1px solid #CCC; 
  background-color: #FFF;
}

table.compra input.submit, button.submit, 
#sForm input.submit, button.submit, 
#rForm input.submit, button.submit, 
#cForm input.submit, #directions input.submit {
  padding: 0.25em 0.6em; 
  width: auto; 
  cursor: pointer; 
  border: 1px solid #003883 ; 
  background: #003883 ; 
  color: #fff; 
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

table.compra input.submit:hover, button.submit:hover, 
#sForm input.submit:hover, button.submit:hover, 
#rForm input.submit:hover, button.submit:hover, 
#cForm input.submit:hover, #directions input.submit:hover { 
  background: #222222; 
  border: 1px solid #222222; 
}

table.compra input[type="submit"][disabled], 
#sForm input[type="submit"][disabled], 
#rForm input[type="submit"][disabled], 
#cForm input[type="submit"][disabled] { 
  background: #888; 
}

#rForm #message, 
#cForm #message {
  margin: 1em 0; 
  padding: 0;
}

#rForm .error_message, 
#cForm .error_message { 
  display: block; 
  height: 22px; 
  line-height: 22px; 
  background: #FBE3E4 url('/imgs/contact/error.gif') 
  no-repeat 10px center; 
  padding: 3px 10px 3px 35px; 
  color: #8a1f11;
  border: 1px solid #FBC2C4;
}

#rForm .loader, 
#cForm .loader { 
  padding: 0 0.625em; 
}

#rForm #success_page h1, 
#cForm #success_page h1 { 
  background: url('/imgs/contact/success.gif') left no-repeat; 
  padding-left: 22px;
  font-size: 1.5em;

  color: #222222;
  top: 2.8em;
}

acronym { 
  border-bottom: 1px dotted #ccc;
}

/* ---------------- FIXES FOR IE6-8 ----------------------------------- 
/* ----- Constain width -----*/
.ie #banner, .ie #illuTitle, .ie #content, .ie #contact, .ie div.inner {
  width: 38.5em;
}

/* ----- HEADER -----------------------*/
.ie #banner {
  height: 181px;
}

.ie #portfolio #banner {
  height: 186px;
}

.ie #logo {
  width: 296px;
  height: 55px; 
}

.ie #tearOne {
  top: 180px;
}

.ie nav {
  width: 339px;
}

.ie #illuTitle {
  height: 10.95em;
}

.ie #illuTitle h1 {
  width: 90%;
  font-size: 2.3em;
  top: 0.87em;
  letter-spacing: -2px;
}

.ie #fourOfour #illuTitle {
  height: 9.2em;
}

.ie #fourOfour #illuTitle h1{
  width: 96%;
}

.ie .mainImage {
  width: 41.8%;
}

.ie #about .mainImage {
  width: 43%;
}

.ie #services .mainImage {
  width: 44%;
}

.ie #work .mainImage {
  right: 1.6em;
  width: 31.5%;
}

.ie #contactPage .mainImage {
  width: 42.5%;
}

/* ----- PAGES ------------------------*/
/* ----- Home -------*/
.ie #featOne, .ie #featTwo {
  width: 50%;
  float: left;
}

.ie #feat #featOne.wrapper {
  padding: 1em 0.75em 0 0;
}

.ie #feat #featTwo.wrapper {
  padding: 1em 0 0 0.75em;
}

.ie #hire #contentSocial {
  float: left;
}

.ie #hire .addthis_button_twitter_follow_native {
  margin: 0.2em 0 0 1.4em;
  clear: left;
}

.ie #hire .addthis_button_tweet {
  margin: 0.2em 0 0 2.2em;
  clear: none;
}

/* ----- About -------*/
.ie #skills, .ie #tools {
  width: 50%;
  float: left;
}

.ie #quoteThree {
  float: left;
}

.ie #aRow .addthis_button_twitter_follow_native {
  margin: 0.4em 0 0 0;
}

.ie #aRow .addthis_button_tweet {
  margin: 0.4em 0 0 2.2em;
  clear: none;
}

/* ----- Work -------*/
.ie #wRow div.wrapper {
  width: 50%;
  float: left;
}

.ie #wRow .box {
  height: 6.5em;
}

.ie #work h2 {
  font-size: 1.7em;
}

/* ----- Portfolio ----*/
.ie .prevNext {
  left: 31.25em;
  position: absolute;
  right: 0;
  top: 0;
  margin: 0.25em 0 0 0;
}

.ie .project {
  margin-top: 2.5em;  
}

.ie .folio {
  margin-top: 2.5em;
}

.ie .folioSplit.wrapper {
  width: 50%;
  float: left;
}

.ie .folio img, .ie .folio .browser, .ie .folio .noFx {
  margin-bottom: 2.2em;
}

/* ---- Contact ----*/
.ie #details .cDetails {
  font-size: 1.4em;
}

/* ---- Footer ----*/
.ie #footContact p.cDetails {
  font-size: 1.6em;
  letter-spacing: -1px;
}
/* @end */

/* @group -------------- PHONE LANDSCAPE 480px -----------------------*/
@media screen and (min-width: 29.9375em) {
/* Constrain width */
  #banner, #illuTitle, #content, #contact, div.inner {
    width: 28.5em; 
  }

/* ---- MAIN CONTENT -------------------*/
  section {
    float: left;
  }

/* ----- HEADER ------------------------*/
  #banner {
    height: 181px;
  }

  #portfolio #banner {
    height: 186px;
  }

  #logo {
    width: 296px;
    height: 55px;
  }

  nav {
    width: 339px;
  }

  #tearOne {
    top: 180px
  }

  #illuTitle {
    height: 27.5em;
  }

  #illuTitle h1 {
    width: 100%;
    font-size: 2.7em;
    top: 0.85em;
    letter-spacing: -2px;
  }

  #fourOfour #illuTitle {
    height: 15.2em;
  }

  #fourOfour #illuTitle h1{
    width: 100%;
  }

  .mainImage {
    width: 95%;
  }

  #work .mainImage {
    right: 4.3em;
    width: 69%;
  }

/* ---- Home ----------*/
  #feat #featOne.wrapper {
    padding: 1em 0.75em 0 0;
  }

  #feat #featTwo.wrapper {
    padding: 1em 0 0 0.75em;
  }

  #featOne, #featTwo {
    width: 50%;
    float: left;
  }

  #hire, #testOne, #testTwo, #feat {
    float: left;
  }

  /* AddThis */
  #hire .addthis_button_twitter_follow_native {
    margin: 1.4em 0 0 0;
  }

  #hire .addthis_button_tweet {
    margin: 1.4em 0 0 2.2em;
    clear: none;
  }

/* ----- About ---------*/
  /* AddThis */
  #aRow .addthis_button_twitter_follow_native {
    margin: 0.4em 0 0 0;
  }

  #aRow .addthis_button_tweet {
    margin: 0.4em 0 0 2.2em;
    clear: none;
  }

/* ----- Work ---------*/
  #wRow .wrapper {
    float: left;
    width: 50%;
  }
  
  #process {
    float: left;
  }

  #wRow .box {
    height: 7.6em;
  }

/* ----- Portfolio ----*/
  .project {
    width: 100%;
  }

  .folioSplit.wrapper {
    float: left;
    width: 50%;
  }

  .folioSocial {
    float: left;
    width: 100%;
  }
/* ---- Contact ----*/
  #details .cDetails {
    font-size: 1.4em;
  }

/* ----- Footer ----*/
  #footContact p.cDetails {
    font-size: 1.6em;
    letter-spacing: -1px;
  }

  #footAddress {
    float: left;
  }

  #footAddress address {
    float: left;
  }
}
/* @end */

/* @group -------------- SMALL TABLET PORTRAIT 600px ------------------*/ 
@media screen and (min-width: 37.5em) {
/* Constrain width */
  #banner, #illuTitle, #content, #contact, div.inner {
    width: 36em;
  }

/* ----- HEADER ------------------------*/

  nav {
    width: 539px; /* 339px */
  }

  #illuTitle {
    height: 10.45em;
  }

  #illuTitle h1 {
    width: 90%;
    font-size: 2.2em;
    top: 0.9em;
  }

  #fourOfour #illuTitle {
    height: 8.8em;
  }

  #fourOfour #illuTitle h1{
    width: 96%;
  }

  .mainImage {
    width: 41.5%;
  }

  #about .mainImage {
    width: 44%;
  }

  #services .mainImage {
    width: 46%;
  }

  #work .mainImage {
    right: 1.5em;
    width: 32%;
  }

  #contactPage .mainImage {
    width: 42.5%;
  }

/* ----- CONTENT -----------------------*/
/* ----- Home --------*/ 
  #hire #contentSocial {
    float: left;
  }

  #hire .addthis_button_twitter_follow_native {
    margin: 0.2em 0 0 1.4em;
    clear: left;
  }

  #hire .addthis_button_tweet {
    margin: 0.2em 0 0 2.2em;
  }

/* ----- About --------*/
  #skills.wrapper, #tools.wrapper {
    width: 50%;
    float: left;
  }

  #quoteThree {
    float: left;
  }

  cite span {
    font-size: 1em;
  }

/* ----- Work ---------*/
  #wRow .wrapper {
    width: 33.333%;
  }

  #wRow .box {
    height: 8.4em;
  }

  #work h2 {
    font-size: 1.5em;
  }

/* ----- Portfolio ----*/
  .prevNext {
    margin: 1.3em 0 0.6em;
  }

  .folio {
    margin-top: 1.8em;
  }

  .folio img, .folio .browser, .folio .noFx {
    margin-bottom: 2em;
  }

  /*----- Footer ----*/
  /* Contact section */
  .envelope, .tel, .fax {
    height: 2.5em;
    width: 2.5em;      
    margin: 0.23em 0.7em 0 0;
    float: left;
  }

  .envelope {
    background: url('imgs/envelope.png') no-repeat 0 0;
  }

  .tel {
    background: url('imgs/tel.png') no-repeat 0 0;
  }
  
  .fax {
    background: url('imgs/fax.png') no-repeat 0 0;
  }
}
/* @end */

/* @group -------------- SMALL TABLET PORTRAIT 640px ------------------*/
@media screen and (min-width: 40em) {
/* Constrain width */
  #banner, #illuTitle, #content, #contact, div.inner {
    width: 38.5em;
  }

/* ----- HEADER ------------------------*/
  #illuTitle {
    height: 10.95em;
  }

  #illuTitle h1 {
    font-size: 2.3em;
    top: 0.87em;
  }

  #fourOfour #illuTitle {
    height: 9.2em;
  }

  .mainImage {
    width: 41.8%;
  }
  
  #about .mainImage {
    width: 43%;
  }

  #services .mainImage {
    width: 44%;
  }

  #work .mainImage {
    right: 1.6em;
    width: 31.5%;
  }

  #contactPage .mainImage {
    width: 42.5%;
  }

  /* ----- Work ---------*/
  #wRow .box {
    height: 8.8em;
  }

  #work h2 {
    font-size: 1.7em;
  }

  /* ----- Portfolio ----*/
  .prevNext {
    left: 31.25em;
    position: absolute;
    right: 0;
    top: 0;
    margin: 0.25em 0 0 0;
  }

  .folio {
    margin-top: 2.5em;
  }

  .folio img, .folio .browser, .folio .noFx {
    margin-bottom: 2.2em;
  }
}
/* @end */

/* @group -------------- IPAD PORTRAIT 768px --------------------------*/ 
@media screen and (min-width: 48em) {
/* Constrain width */
  #banner, #illuTitle, #content, #contact, div.inner {
    width: 46.5em; /* 768px -24px margins */
  }

/* ----- MAIN CONTENT ------------------*/
  #headSocial a.addthis_button_facebook_like.at300b {
    padding: 2px 0 0 0;
  }

  .fwBoxR {
    border-left: 2px dotted #F1F1F1;
  }

/* ----- HEADER ------------------------*/
  #banner {
    height: 132px;
  }

  #portfolio #banner {
    height: 137px
  }

  #logo {
    float: left;
    padding-top: 40px; /* 31px */
  }

  nav {
    float: right;
    margin-top: 50px;
    width: 566px; /* 366px */
  }

  nav ul { 
    float: right;
    font-size: 1em;
  }

  #tearOne {
    top: 130px
  }

  #headSocial .addthis_toolbox {
    height: 22px;
  }

  #illuTitle{
    height: 13.2em;
  }

  #illuTitle h1 {
    font-size: 2.75em;
    top: 0.9em;
    width: 95%;
  }

  #fourOfour #illuTitle {
    height: 11.1em;
  }

  #mainImage {
    width: 41%
  }

  #services .mainImage {
    width: 44.5%;
  } 

  #work .mainImage {
    right: 2.1em;
    width: 31.5%;
  }   

  #contactPage .mainImage {
    width: 42%;
  }   

/* ----- CONTENT ------------------------*/
  /* ----- About --------*/
  #aRow .fwBoxL {
    padding: 1.5em 2.25em 1.5em 1.5em;
  }

  #aRow .fwBoxR {
    padding: 1.5em 1.5em 1.5em 2.25em;
  }

  #aRow .wrapper {
    float: left;
    width: 50%;
  }

  #aRow .fwWrapper {
    float: left;
    width: 50%;
  }

  #aRow .fwBoxL p {
    margin-bottom: 0em;
  }

/* ----- Services -----*/
  .sBranding img {
    float: left;
    margin: 5em 1.5em 4em 0;
  }

  .sPrint img {
    float: left;
    margin: 4.3em 1.5em 3em 0;
  }

  .sIllu img {
    float: left;
    margin: 2.4em 1.5em 2em 0;
  }

  .sPrinting img {
    float: left;
    margin: 2.3em 1.5em 2em 0;
  }
  
  .sWeb img {
    float: left;
    margin: 4em 1.5em 2em 0;
  }

  .sWebS img {
    float: left;
    margin: 3.3em 1.5em 2em 0;
  }

  .wContent {
    float: left;
    width: 75%;
  }

  .fwBoxL {
    padding-right: 1.5em;
  }

  /* ----- Work ---------*/
  #wRow .box {
    height: 7.7em;
  }

  /* ----- Portfolio ----*/     
  .prevNext {
    left: 39.25em;
  }

  /* ----- Contact ------*/
  #cRow, #cRowTwo {
    width: 50%;
    float: left;
    margin-bottom: 3em;
  }
	/* --- full width --- */
	 #cfwRow {
		width: 100%;
		float: left;
	}
  /* ---- Contact ----*/
  #details .cDetails {
    font-size: 1.2em;
  }

/* ----- FOOTER -------------------------*/  
/* Bottom section */
  .inner div.wrapper {
    float: left;
    width: 50%;
  }

  #tweets, #footRight {
    width: 50%;
    float: left;
  }

  #copyright { 
    float: left
  } 
}
/* @end */

/* @group -------------- IPAD LANDSCAPE 1024px ------------------------*/ 
@media screen and (min-width: 64em) {
/* Constrain width */
  #banner, #illuTitle, #content, #contact, div.inner {
    width: 62.5em;
  }

/* ----- HEADER ------------------------*/
  nav {
    /*margin-right: 106px;*/margin-right: 6px;
  }

  nav ul li a {
    height: 19px;
  }

  #headSocial {
    position: absolute;
    right: 0;
    top: 50px;
    margin: 0;
  }

  #headSocial .addthis_toolbox {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
  }

  #tearTwo {
    top: -13px;
  }

  #illuTitle {
    height: 17.3em;
  }

  #illuTitle h1 {
    font-size: 3.8em;
    top: 0.72em;
    width: 100%;
    letter-spacing: -4px;
  }

  #fourOfour #illuTitle {
    height: 14.35em;
  }

  .mainImage {
    width: 42%;
  }
  
  #work .mainImage {
    right: 3.3em;
    width: 31%;
  }

/* ----- CONTENT -----------------------*/
/* ----- Home --------- */
  #hRow, #hRowTwo {
    width: 50%;
    float: left;
  }

  #hRow #testOne, #hRow #testTwo {
    width: 50%;
    float: left;
  }

  #testOne {
    margin-top: 0;
  }

  #hRow #quoteOne, #hRow #quoteTwo {
    width: 100%;
  }

  /* ----- About ---------*/
  #quoteThree.wrapper {
    width: 50%;
  }

  #skills.wrapper, #tools.wrapper {
    width: 25%;
  }
  
  #sWebRow .fwBoxL {
    margin-bottom: 0;
  }       

/* ----- Services -----*/
  .sBranding img, .sPrint img, .sIllu img, .sPrinting img, .sWeb img, .sWebS img {
    float: none;
    margin: 0 auto 1.5em;
  }
  
  .wContent {
    width: 100%;
  }

  .fwBoxL {
    padding: 1.5em 2.25em 0em 1.5em;
  }

  .fwBoxR {
    padding: 1.5em 1.5em 1.5em 2.25em;
  }

  #sBrandRow .wrapper, #sIlluRow .wrapper {
    float: left;
    width: 50%;
  }

  #sWebRow .fwWrapper {
    float: left;
    width: 50%;
  }

  #process {
    margin: 4em 13.5% 0;
  }

/* ----- Work ---------*/
  #wRow .wrapper {
    width: 25%;
  }

  /* ----- Work ---------*/
  #wRow .box {
    height: 7.7em;
  }

/* ----- Portfolio ----*/
  .prevNext {
    left: 47.625em;
  }

  .folioSocial {
    border-top: 1px solid #494949;
  }
  
  #content .project .desc {
    float: left;
    width: 25%;
    margin-top: 2.5em;
  }

  .folio {
    float: left;
    width: 75%;
    /*padding-right: 2.040816327%;   4.081632653061  2.0408163265305 */ 
  }

  .folio img, .folio .browser, .folio .noFx {
    margin-bottom: 2.5em;
  }

  .folioSocial {
    padding: 1em 0;
  }

  .folioSplit.wrapper {
    width: 50%;
    float: left;
  }

  /* ---- Contact ----*/
  #details .cDetails {
    font-size: 1.4em;
  }

  /* ----- FOOTER -------------------------*/
  /* Contact section */
  .contactSplit {
    float: left;
    width: 50%;
  }

  #footContact .call {
    margin-top: 0;
  }

  .contactSplit {
    margin-top: 0.35em;
  }

  .tel {     
    margin-left: 0.75em;
  }

  .fax {     
    margin-left: 0.75em;
  }

  a.anchorLink {
    float: right;
  }
}
/* @end */

/* @group -------------- IPAD LANDSCAPE 1200px ------------------------*/ 
@media screen and (min-width: 75em) {
/* Constrain width */
  #banner, #illuTitle, #content, #contact, div.inner {
    width: 71.5em;
  }

/* ----- HEADER ------------------------*/
  #illuTitle h1 {
    font-size: 4.4em;
    top: 0.69em;
    letter-spacing: -4px;
  }

  #illuTitle {
    height: 19.8em;
  }

  #fourOfour #illuTitle {
    height: 16.2em;
  }

  .mainImage  {
    width: 42.3%;
  }

/* ----- Services -----*/
  .sBranding img, .sPrint img {
    float: left;
    margin: 7em 1.5em 6em 0;
  }

  .sIllu img, .sPrinting img {
    float: left;
    margin: 3.9em 1.5em 3em 0;
  }

  .sWeb img, .sWebS img {
    float: left;
    margin: 6.5em 1.5em 6em 0;
  }

  .wContent {
    float: left;
    width: 66.7%;
  }

  #process {
    margin: 4em 19% 0;
  }

/* ----- Work ---- */ 
  #wRow .box {
    height: 6.5em;
  }

/* ----- Portfolio ---- */ 
  .prevNext {
    left: 54.375em;
  }

  .prevnext a[rel~="prev"] {
    background-position: 0px 0px;
  }

  .prevNext a[rel~="next"] {
    background-position: -48px 0px;
  }
}
/* @end */

/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}
/*
#logo {display:none;}
*/