body {font:14px Helvetica, Arial, Helvetica, sans-serif; margin:0; background:#383838; width:100%; color:#626262;}
a {color:#FF0000; text-decoration:none;}
a:hover {text-decoration:underline;}
section, header, footer, nav {display:block;}
img {border:0; vertical-align:top; max-width:100%;}
h1 {font-size:4.285em; margin:0 0 0.167em; text-align:center; color:#404040; text-shadow:0px 1px 1px rgba(255,255,255,0.5);}
h2 {font-size:2.714em; color:#404040; text-align:center; margin:0 0 0.417em; text-shadow:0px 1px 1px rgba(255,255,255,0.5);}
.subHeading {display:block; font-size:1.5em; font-weight:normal; text-align:center; color:#404040; text-shadow:0px 1px 1px rgba(255,255,255,0.5);}
ul {padding:0; margin:0; list-style:none;}
section {background:#EBEBEB url(../img/sep-hor.gif) top center no-repeat; position:relative; width:100%; padding:2.5em 0;}
section ul {margin:0 0 0.5em;}
.center {max-width:960px; width:100%; margin:0 auto;}
.center p {padding:0 5%; text-align:center;}
.hidden{display:none;}

/* main styles */
#wrapper {width:100%;}

/* welcome */
#welcome h1 {text-align:center;}
#welcome h1 img {height:100px; width:300px;}
#welcome h2 {font-size:12px; font-weight:normal; color:#E00200; text-transform:uppercase; letter-spacing:2px;}
#welcome .subHeading {background: url(../img/sep-hor.gif) top center no-repeat; margin:0; padding:0.4em 0 0 0;}
#bigImg {background:transparent url(../img/fiat5ino.jpg) bottom center no-repeat; background-size:cover; border-bottom:1px solid #FF0000; height:400px; padding:0;}

/* header */
#header {background:#E4E4E4; border-top:1px solid #FF0000; border-bottom:1px solid #FFFFFF; line-height:50px; padding:0; position:relative; width:100%; z-index:100;
  -moz-box-shadow:0 0 10px #FFFFFF; -webkit-box-shadow:0 0 10px #FFFFFF; box-shadow:0 0 10px #FFFFFF;}
#header .content {border-top:6px solid #4A4A4A;}
#brand {display:none; float:left; height:50px; width:130px;}
#brand a {display:block; margin:5px 0 0 0;}
#brand a img {height:40px; width:120px;}
.is-sticky #brand {display:block;}
#mainNav {text-align:right;}
#mainNav li {display:inline-block; padding:0 1%;}
#mainNav li:last-child {margin-right:10px;}
#mainNav a {color:#404040; position:relative; display:inline-block; padding:0; text-decoration:none;}
#mainNav a span {color:#404040; text-decoration:none; padding:0; display:block;}
#mainNav a:hover span, #mainNav li a.active span {color:#FF0000;}

/* gallery */
#photoGallery .flex-direction-nav li .prev {left:-7%;}
#photoGallery .flex-direction-nav li .next {right:-7%;}
.gallery {padding:0; position:relative; margin:0 auto; width:80%; position:relative;}
.slides {border: 1px solid #FFFFFF; list-style:none; overflow:hidden; padding:0; width:100%;}
.slides li {padding:0; display:none; position:relative; background:url(../img/sep-vert.gif) no-repeat 50% 50%;}

/* map */
#map {border-top:1px solid #1E1E1E; border-bottom:1px solid #1E1E1E; height:600px; overflow:hidden;}
#map iframe {border:0; height:600px; width:100%;}

/* tech spec */
#techspec {background:transparent url(../img/sep-hor.gif) no-repeat top center; display:none;}
#techspec-trigger {left:0; position:absolute; top:0; z-index:200;}
#techspec-trigger a {display:block; background:rgba(235,235,235,0.85) url(../img/back-top.png) 0 0 no-repeat; height:20px; text-indent:-9999px; width:20px;}

#logo-cdcl {border:1px solid #1E1E1E; height:200px; width:200px;}

/* footer */
#footer {color:#FFFFFF; font-size:0.9em; height:16px; line-height:16px; padding:10px 0; position:relative; width:100%;}
#footer a {color:#FFFFFF;}

/* copyright */
.copy {color:#B4B4B4; float:left; margin-left:10px;}

/* viewing */
.view {float:right; height:16px; margin-right:10px;}
.view h4 {font-weight:normal; margin:0 5px 0 0; display:inline-block;}
.view .view_holder {display:inline-block;}
.view .monitor, .view .ipad, .view .iphone {background-position:0 0; background-repeat:no-repeat; display:inline-block; margin-left:5px;}
.view .monitor {background-image:url(../img/monitor.png); background-position:0 -16px; width:15px; height:16px;}
.view .ipad {background-image:url(../img/ipad.png); width:13px; height:16px;}
.view .iphone {background-image:url(../img/iphone.png); width:9px; height:15px;}

/* scroll to top */
#back-top {bottom:37px; position:fixed; right:18px; z-index:200;}
#back-top a {display:block;	background:rgba(235,235,235,0.85) url(../img/back-top.png) 0 0 no-repeat; height:20px; text-indent:-9999px; width:20px;
  -webkit-transition-duration:0s; -moz-transition-duration:0s; -o-transition-duration:0s; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;}


@media all and (max-width: 1024px) {
  /* viewing */
  .view .monitor {background-position:0 0;}
  .view .ipad {background-position:0 -16px;}
  .view .iphone {background-position:0 0;}

  /* map */
  #map {height:450px;} 
  #map iframe {height:450px;} 
}

@media all and (max-width: 960px) {
  .center {width:auto;}

  /* map */
  #map {height:400px;} 
  #map iframe {height:400px;} 
}

@media all and (max-width: 780px) {
  body {font-size:13px;}
}

@media all and (max-width: 568px) {
  body {font-size:12px;}

  /* header */
  .is-sticky #brand {display:none;}

  /* gallery */
  .gallery {width:100%;}
  .flex-direction-nav {display:none;}

  /* map */
  #map {height:200px;} 
  #map iframe {height:200px;} 

  /* footer */
  #footer {font-size:0.8em;}
  #back-top {right:5px;}

  /* viewing */
  .view .monitor {background-position:0 0;}
  .view .ipad {background-position:0 0;}
  .view .iphone {background-position:0 -16px;}
}

@media all and (max-width: 400px) {

  #mainNav li:first-child {display:none;}
}

@media all and (max-width: 320px) {

  /* map */
  #map {height:150px;} 
  #map iframe {height:150px;} 
}
