/*
	Fonts:
	font-family:'HelveticaNeueW01-55Roma';
	font-family:'HelveticaNeueW01-56It';
	font-family:'HelveticaNeueW01-65Medi';
	font-family:'HelveticaNeueW01-75Bold';
	
	Colours:
	Light pink: #E64097
	Dark pink:  #AF006E
	
	Grey 1: #E9E3DC
	Grey 2: #BFB6AD
	Grey 3: #54534A
	Grey 4: #162732
*/

/*
	HTML5 Reset :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:
	
	Eric Meyer					:: http://ericmeyer.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com
	
-------------------------------------------------------------------------------*/

/* Let's default this puppy out / And now the Denza Girls have taken ovahhhh.
-------------------------------------------------------------------------------*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img,
object,
embed {max-width: 100%;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

p { margin-bottom: 1.5em; }

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}

del {text-decoration: line-through;}

/* abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;} */

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  

/* Structure
-------------------------------------------------------------- */
body {
  background-color: #fff;
}

div.wrapper {
  /*max-width: 1920px;
  min-width: 100px;*/
  margin: 0 auto;
  position: relative;
}

b { font-family: 'HelveticaNeueW01-75Bold', HelveticaNeue-Bold, Helvetica, Arial, sans-serif; }
.fontface b { font-weight: 100; }

h3 { font-family: 'HelveticaNeueW01-75Bold', HelveticaNeue-Bold, Helvetica, Arial, sans-serif; }
.fontface h3 { font-weight: 100;}

h4 {
  margin-bottom: 1.5em;
  font-weight: 100;
}

a, a:link, a:visited {
  color: #E64097; text-decoration: underline;
  -webkit-transition: color .2s ease-out;
}
a:hover { color: #AF006E; }

/* Nav
-------------------------------------------------------------- */
nav#main {
  position: fixed;
  top: 286px;
  width: 244px;
  margin: 0 auto;
  
  z-index: 9999;
}

nav#main ul.nav {
  margin: 0 auto;
  box-shadow: 1px 1px 2px #BFB6AD;
}

.ie nav#main {
  border: 2px solid #BFB6AD;
  border-width: 0 2px 2px 0;
}

nav#main ul.nav li {
  display: block;
  width: 244px; height: 24px;
}

nav#main ul.nav li a,
nav#main ul.nav li a:link {
  display: block;
  width: 100%; height: 100%;
  
  /*padding-left: 10px;*/
  background-color: #E9E3DC;
  color: #54534A;
  
  font-family: 'HelveticaNeueW01-55Roma', HelveticaNeue, Helvetica, sans-serif;
  font-size: 14px; line-height: 24px;
  
  text-transform: lowercase;
  text-decoration: none;
  text-indent: 10px;
  
  -webkit-transition: background-color .4s linear;
  -moz-transition: background-color .4s linear;
  transition: background-color .4s linear;
}

nav#main ul.nav li.here a {
  color: #fff;
  background-color: #AF006E;
}

nav#main ul.nav li a:hover {
  background-color: #BFB6AD;
}

/* Footer
-------------------------------------------------------------- */
footer {
  position: fixed;
  bottom: 0;
  
  width: 100%; height: 20px;
  
  z-index: 9999;
  
  font-family: 'HelveticaNeueW01-55Roma', HelveticaNeue, Helvetica, sans-serif;
  font-size: 12px; line-height: 20px;
  
  background-color: #54534A;
  color: #fff;
  
  box-shadow: 0 10px 30px #333;
  -moz-box-shadow: 0 10px 30px #333;
  -webkit-box-shadow: 0 10px 30px #333;
}

footer a, footer a:link, footer a:hover {
  color: #fff;
  text-decoration: none;
}

footer ul.footer {
  width: 650px;
  margin: 0 auto;
}

footer ul.footer li {
  float: left;
  list-style: disc;
  list-style-position: inside;
  margin: 0 20px 0 -1em;
  padding: 0;
}

footer ul.footer li.address { list-style: none; margin-left: 0; }
footer ul.footer li.copyright { margin-right: 0; }


/* Typography
-------------------------------------------------------------- */
section {
  width: 100%;
  position: relative;
  box-shadow: 0 10px 30px #333;
  -moz-box-shadow: 0 10px 30px #333;
  -webkit-box-shadow: 0 10px 30px #333;
}

section>article {
  width: 960px;
  margin: 0 auto;
  padding-bottom: 72px;
  
  font-family: 'HelveticaNeueW01-55Roma', HelveticaNeue, Helvetica, sans-serif;
  font-size: 14px; line-height: 18px;
  
  color: #f2f2f2;

  /*background: url(/img/grid.png) repeat-y -20px 0;*/
}

section>article header {
  padding: 77px 0 122px 0;
  width: 100%; height: 83px;
}

section>article div.container {
  width: 590px;
  margin-left: 360px;
  margin-right: 10px;
}

section>article header h1,
section>article header h2 {
  width: 950px;
  margin-right: 10px;

  font-family: 'HelveticaNeueW01-65Medi', HelveticaNeue-Medium, Helvetica, Arial, sans-serif;
  font-size: 83px; line-height: 1em;
  font-weight: 100;

  letter-spacing: -3px;
  text-transform: lowercase;
  text-align: right;
  
  color: #af0063;
}

section>article header h2 { position: relative; }

section>article header h2 span.static {
  position: absolute;
  right: 238px;
}

section>article header h2 span.denza {
  color: #af0063;
  display: none;
}

.leader {
  font-size: 26px;
  line-height: 36px;
}

.column {
  width: 290px;
  margin-right: 10px;
  float: left;
}

.last {
  margin-right: 0;
}

/* Quotes
-------------------------------------------------------------- */
div.quote { margin-bottom: 1.5em; }

div.quote blockquote {
  font-family: 'HelveticaNeueW01-56It', HelveticaNeue-Italic, Helvetica, Arial, sans-serif;
  font-style: italic;
  font-size: 16px; line-height: 18px;
  
  width: 440px;
}

div.quote div.cite {
  font-size: 12px; line-height: 18px;
  width: 140px;
}

div.quote.left blockquote {
  float: left;
  margin-right: 10px;
}

div.quote.left div.cite { float: right; }

div.quote.right blockquote {
  float: right;
  margin-left: 10px;
}

div.quote.right div.cite { float: left; }

/* Google Map
-------------------------------------------------------------- */
#googlemap { width: 600px; height: 288px; margin-bottom: 1.5em;}

/* Sections
-------------------------------------------------------------- */
/*section#home { background: #e64097 url(/img/Pink-Cotton.jpg); }*/
section#home { background: #e64097; }
section#home article { color: #e9e3dc; }
section#home article header h1,
section#home article header h2 { color: #af006e; }

/*section#vanessa { background: #BFB6AD url(/img/Warm-Grey-7-Wool.jpg); }*/
section#vanessa { background: #BFB6AD; }
section#vanessa article { color: #54534A; }
section#vanessa blockquote { color: #E9E3DC; }
section#vanessa article header h2 { color: #54534A; }

/*section#register { background: #E9E3DC url(/img/Warm-Grey-2-Canvas.jpg); }*/
section#register { background: #E9E3DC; }
section#register article { color: #54534A; }
section#register article .leader { color: #54534A; }
section#register article h3 { color: #E64097; }
section#register article header h2 { color: #BFB6AD; }

/*section#clients { background: #BFB6AD url(/img/Warm-Grey-7-Denim.jpg); }*/
section#clients { background: #BFB6AD; }
section#clients article { color: #fff; }
section#clients article header h2 { color: #54534A; }

/*section#team { background: #E9E3DC url(/img/Warm-Grey-2-Cotton.jpg); }*/
section#team { background: #E9E3DC; }
section#team article { color: #54534A; }
section#team article header h2 { color: #54534A; }

/*section#contact { background: #BFB6AD url(/img/Warm-Grey-7-Canvas.jpg); }*/
section#contact { background: #BFB6AD; }
section#contact article { color: #54534A; }
section#contact article header h2 { color: #54534A; }
section#contact article h3 { color: #AF006E; }


/* Print Styles */

@media print {
  body {
    background-color: #fff;
    color: #000;
  }

  nav { display: none; }
  footer { display: none; }
  section { display: none; }

  div.wrapper { height: auto!important; }

  section#contact {
    display: block;
    position: static!important;
    width: 100%;
    margin: 0;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
  }

  section>article {
    width: 100%;
    margin: 0;
    padding-bottom: 0;

    color: #000;
  }

  section>article div.container {
    width: 100%;
    margin: 0;
  }

  section>article header {
    padding: 0;
    width: 100%;
  }

  section>article header h2 { margin: 0; }

  section>article header h2 span.static { position: static; }
  section>article header h2 span.denza { color: #333; display: inline; }

  section#contact article h2 { color: #333; }
  section#contact article h3 { color: #000; }

  #googlemap { width: 100%; }

  .column {
    width: 45%;
    margin-right: 5%;
    float: left;
  }
}