/*
   screen.css
   shevron
   
   Copyright 2009 Webfirm. All rights reserved.
*/

@import url('reset.css');

body {
  background: #fff url('../images/core/body.gif') 0 0 repeat-x;
  font: 11px/22px Verdana, Arial, Tahoma, sans-serif;
}

#container {
  width: 960px;
  margin: 0 auto;
}


/*  =banner
*****************************/
#banner {
  width: 960px;
  height: 116px;
  background: #5e5e5e url('../images/core/banner-inner_background.jpg') top right no-repeat;
}

body#p-index #banner {
  width: 740px;
  height: 432px;
  float: right;
  display: inline;
  background: #5e5e5e url('../images/core/banner-background.jpg') bottom center no-repeat;
}

#ctabanner {
  width: 720px;
  padding: 10px;
}

#ctabanner .cta {
  float: left;
  display: inline;
  width: 230px;
  height: 190px;
  margin: 0 5px 0;
  overflow: hidden;
}


/*  =secondary
*****************************/
#secondary {
  float: left;
  display: inline;
  width: 220px;
  padding-bottom: 185px;
  margin: 71px 0 0;
  background: #cf0405 url('../images/core/secondary-background.png') bottom center no-repeat;
}


/*  =nav
*****************************/
#navigation {
  width: 960px;
  height: 30px;
  background: url('../images/nav/nav_inner-background.png') 0 0 repeat-x;
}

#navigation li {
  float: left;
  display: inline;
}

#navigation li a {
  color: #fff;
  text-decoration: none;
  display: inline-block;
  line-height: 30px;
  padding: 0 10px;
  background: url('../images/nav/nav_inner-background.png');
}
#navigation li a:hover {background-position: 0 -30px !important;}

body#p-profile #navigation li a#nav-profile,
body#p-interior #navigation li a#nav-interior,
body#p-exterior #navigation li a#nav-exterior,
body#p-babydays #navigation li a#nav-baby,
body#p-distributors #navigation li a#nav-international,
body#p-login #navigation li a#nav-login,
body#p-contact #navigation li a#nav-contact {background-position: 0 -60px !important; color: #505050; cursor: default; font-weight: bold;}


body#p-index #navigation {background: none; height: auto; width: 220px;}

body#p-index #navigation li {
  width: 220px;
  height: 35px;
  line-height: 35px;
  float: none;
}

body#p-index #navigation li a {
  display: block;
  width: 200px;
  height: 35px;
  background: url('../images/nav/nav-background.png') 0 0 no-repeat;
  font: 10px/35px Arial, Verdana, Tahoma, sans-serif;
  text-transform: uppercase;
  text-decoration: none;
  padding: 0 0 0 20px;
  margin: 0;
}

body#p-index #navigation li a:hover {
  background-position: 0 -35px !important;
}


/*  =contactinfo
*****************************/
#contactinfo {
  font: 11px/16px Verdana, Arial, Tahoma, sans-serif;
  color: #fff;
  width: 206px;
  padding: 34px 0 42px 14px;
  background: url('../images/core/contactinfo-background.jpg') no-repeat;
}

#contactinfo h2 {
  font: 18px Arial, Verdana, Tahoma, sans-serif;
  padding-left: 50px;
  margin: 0 0 10px 0;
}

#contactinfo p {
  margin: 0 0 6px;
}

#contactinfo a {color: #fff;}
#contactinfo a:hover {text-decoration: none;}


/*  =primary
*****************************/
#primary {
  width: 938px;
  display: block;
  background: #f5f5f5 url('../images/core/primary-background.jpg') 0 0 no-repeat; 
  color: #505050;
  padding: 10px;
  border-left: 1px solid #D7D7D7;
  border-right: 1px solid #D7D7D7;
  border-bottom: 1px solid #D7D7D7;
}

body#p-index #primary {
  float: right;
  clear: right;
  display: inline;
  width: 700px;
  padding: 20px;
  background: #f5f5f5 url('../images/core/primary-background.jpg') 0 0 no-repeat;
  border: 0;
}

#primary h1 {
  margin: 20px 0 20px 8px;
  font-size: 30px;
}

#primary h2 {
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
}

#primary h3 {text-transform: uppercase; font-size: 12px;}

body#p-index #primary h1 {margin: 0;}

#primary p {
  margin: 20px 0;
}

#primary a {color: #d30405;}
#primary a:hover {text-decoration: none;}

#primary hr {
  clear: both;
  display: block;
  height: 0;
  width: 100%;
  border: 0;
  border-top: 1px solid #dddddd;
}

#primary ul {
  margin: 0 0 20px 20px;
  list-style: square;
}

#primary table {
  width: 100%;
  clear: both;
  margin: 0 0 20px 0;
}

#primary table caption {
 font-size: 1.3em;
 font-weight: bold;
 color: #000;
 border-bottom: 2px solid #000;
 text-align: left;
}

#primary table tr {border-bottom: 1px solid #D2D2D2;}
#primary table th {text-align: left;padding: 3px;}
#primary table td {padding: 3px; width: 232px;}


/*  =vcard
*****************************/
div.org {font-weight: bold;}


/*  =footer
*****************************/
#footer {
  width: 960px;
  display: block;
  clear: both;
  font-size: 10px;
  color: #505050;
  text-transform: lowercase;
  text-align: center;
}


body#p-index #footer {
  width: 740px;
  float: right;
  display: inline;
  clear: both;
}

#footer a {color: #505050; text-decoration: none;}
#footer a:hover {text-decoration: underline;}


/*  =products
*****************************/
#primary .product {
  width: 920px;
  margin: 10px auto;
}

body#p-exterior #primary .product {
  width: 289px;
  float: left;
  display: inline;
  margin: 0 5px;
  padding: 5px;
  border: 1px solid #E2E2E2;
}

body#p-interior #primary .product {
  width: 445px;
  float: left;
  display: inline;
  margin: 0 5px;
  padding: 5px;
  border: 1px solid #E2E2E2;
}

#primary .product .gallery {
  width: 290px;
  float: left;
  display: inline;
}

body#p-exterior #primary .product .gallery {
  width: auto;
  float: none;
  display: block;
  height: 250px;
}

body#p-exterior #primary .product .gallery p.caption {margin: 0; font-weight: bold; line-height: 12px;}

#primary .product .gallery .logo {
  width: 267px;
  height: 112px;
  padding: 11px;
  overflow: hidden;
  background: url('../images/core/product-logo_background.jpg');
}

#primary .product .gallery .thumb {
  width: 130px;
  height: 88px;
  padding: 2px 0 0;
  background: url('../images/core/gallery-thumb_background.png') 0 0 no-repeat;
  float: left;
  display: inline;
  margin-right: 20px;
  text-align: center;
  position: relative;
  z-index: 5;
}

#primary .thumbalone {
  width: 290px;
  height: 164px;
  padding: 2px;
  border: 1px solid #CCCCCC;
  float: left;
  display: inline;
  margin-right: 20px;
  margin-bottom: 8px;
  text-align: center;
  position: relative;
  z-index: 5;
}

body#p-exterior #primary .product .gallery .thumb {
  margin-right: 0px;
  height: auto;
}

#primary .product .gallery .secondary {float: right; display: inline; margin: 0;}

#primary .product .gallery .thumb:hover,
#primary .product .gallery .thumb-hover {background-position: -130px 0 !important;}

#primary .product .gallery .thumb span {
  width: 30px;
  height: 30px;
  background: url('../images/core/view.png');
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

/* baby page 2 */

#primary .product .gallery1 {
  width: 130px;
	height: 100px;
  float: left;
  display: inline;
	padding:  0 85px;
	_padding: 0 75px; /* for ie6 */
}

#primary .product .gallery1 .thumb1 {
  width: 130px;
  height: 88px;
  padding: 2px 0 0;
  background: url('../images/core/gallery-thumb_background.png') 0 0 no-repeat;
  float: left;
  display: inline;
  margin-right: 20px;
  text-align: center;
  position: relative;
  z-index: 5;
}

#primary .product .gallery1 .thumb1:hover,
#primary .product .gallery1 .thumb1-hover {background-position: -130px 0 !important;}

#primary .product .gallery1 .thumb1 span {
  width: 30px;
  height: 30px;
  background: url('../images/core/view.png');
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}


#fabric-list { margin: 10px 0; }
#fabric-list ul { list-style-type: none; margin: 0; padding: 0; }
#fabric-list ul li { width: 58px; height: 65px; _height: 85px; /* for ie6 */ float: left; text-align: center; line-height: 1.2em; padding: 0 5px; margin-bottom: 1em; font-size: 0.9em; }

#p-interior .gallery{
	width: 440px !important;
	margin: 0;
}
#p-interior .swatches{
	width: 440px !important;
	margin-left: 0px;
	margin-top: 20px;
	margin-bottom: 20px;
}
#fabric-picker{
	float: left;
	width: 269px;
	border:1px solid #CCCCCC;
	margin-left: 10px;
}
#fabric-picker ul{
	list-style-type: none;
	padding: 2px;
	margin: 0;
}
#fabric-picker ul li{
	float: none;
}
#fabric-picker ul li img{
	border: none !important;
}
#fabric-listing{
	float: left;
}
#fabric-listing ul{
	list-style-type: none;
}
#fabric-listing ul li{
	padding-top: 5px;
}
#playvideo{
	margin-top: 20px;
}
#canvas-grey{ height: 28px; }
#ranger-grey-blue{ height: 25px; }
#ranger-grey-grey{ height: 24px; }
#ranger-grey-silver{ height: 21px; }
#ranger-grey-red{ height: 30px; }
#ranger-black{ height: 29px; }
#ranger-black-blue{ height: 24px; }
#ranger-black-grey{ height: 26px; }
#rangerblack-silver{ height: 23px }
#ranger-black-red{ height: 27px; }
#sanctus-grey{ height: 27px; }
#sanctus-blue{ height: 23px; }
#cobra-grey{ height: 29px; }
#cobra-graphite{ height: 21px; }
#mirage-grey-insert{ height: 29px; }
#mirage-grey{ height: 32px; }
#xplorer-gold{ height: 25px; }
#discovery-green{ height: 28px; }


#products-list { margin: 20px 0; width: 100%; }
#products-list ul { list-style-type: none; margin: 0; padding: 0; }
#products-list ul li { width: 300px; float: left; text-align: center; line-height: 1.2em; display: inline; font-size: 1em; margin-bottom: 2em; }
#products-list ul li img { margin-bottom: 0.5em; }
#products-list ul li.left { margin-left: 14em; }

#centre { margin-left: 300px; }

#primary .product .gallery .swatches img {border: 1px solid #525252;}

#primary .product .info {
  width: 620px;
  float: right;
  display: inline;
  line-height: 20px;
  font-size: 10px;
  text-align: justify;
}

body#p-exterior #primary .product .info {
  width: auto;
  float: none;
  display: block;
  clear: both;
  text-align: left;
  margin-top: 10px;
}

body#p-interior #primary .product .info {
  width: auto;
  float: none;
  display: block;
  clear: both;
  text-align: justify;
  margin-top: 10px;
}
#primary .product .info h2 {
  font-size: 24px;
  line-height: 20px;
  font-weight: normal;
}

body#p-exterior #primary .product .info h2 {
  font-size: 18px;
  font-weight: bold;
}

#primary .product .info p {margin: 10px 0;}

#p-index #player{
	margin-left: 200px;
}

#playerhome {
	float:right; padding-left: 10px; }
	
.playercaption { font-size: 9px; }