/* CSS Document for Puzzlering - Firefox/Safari/Opera */

body {
  background: #006D7A;
  margin-top: 0px;
  margin-left: 0px;
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #000;
  }

div.VideoTitle {
  position: relative;
  top: 0px;
  left: 70px;
  font-family: "Trebuchet MS", Arial, Verdana;
  font-size: 18px;
  font-weight: bold;
  color: #006D7A;
  text-align: left;
  }

div.VideosBG {
  background: url("../gfx/bg_video.jpg") no-repeat;
  width: 428px;
  height: 285px;
  z-index: 1;
  }
  
div.VideoContent {
  position: relative;
  left: 0px;
  z-index: 2;
  }
  
td {
  background: #FFFFFF;
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #000;
  }

/* Applied to left menu */
td.Menu {
  background: #D9B76F;
  width: 150px;
  height: 30px;
  vertical-align: middle;
  padding-left: 12px;
  }

/* Applied to where decor images are on the home page */ 
td.HomeRight {
  width: 145px;
  height: 160px;
  text-align: right;
  vertical-align: top;
  }

/* Applied to text on the home page */
td.HomeRightText {
  width: 290px;
  padding-top: 15px;
  padding-left: 20px;
  }

/* Applied to puzzle rings main page where all products are displayed */
td.ProductImage {
  width: 185px;
  text-align: center;
  vertical-align: top;
  border-style: solid;
  border-width: 0px 1px 0px 0px;
  border-color: #DEBE7E;
  padding-top: 25px;
  }

/* Applied to puzzle rings main page where all products are displayed */
td.ProductDescription {
  width: 185px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 13px;
  font-weight: bold;
  color: #000;
  text-align: center;
  vertical-align: middle;
  border-style: solid;
  border-width: 0px 1px 1px 0px;
  border-color: #DEBE7E;
  padding-bottom: 25px;
  }

/* This is the left side on the individual product page */
td.ProductImageLarge {
  width: 330px;
  text-align: left;
  vertical-align: top;
  border-style: solid;
  border-width: 0px 1px 0px 0px;
  border-color: #DEBE7E;
  }

/* This is the right side on the individual product page where user selects size and color */
td.ProductSelect {
  width: 225px;
  text-align: left;
  vertical-align: top;
  padding-left: 15px;
  }
  
/* This is the blue header on the left side below the large image of the ring on the individual product page */
td.ProductDescriptionHeader {
  background: #02736D;
  width: 295px;
  height: 25px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 13px;
  font-weight: bold;
  color: #FFF;
  text-align: center;
  }
  
/* This is the description of the product on the individual product page */
td.ProductDescriptionContent {
  width: 295px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: left;
  padding-top: 5px;
  }
  
/* This is the blue header on the right side of the individual product page where user selects size and color */
td.ProductDetailsHeader {
  background: #02736D;
  width: 225px;
  height: 25px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 13px;
  font-weight: bold;
  color: #FFF;
  text-align: center;
  }
  
/* This is the bullet image for individual product details */
td.ProductDetailsLeft {
  width: 25px;
  height: 25px;
  text-align: center;
  }
  
/* This is the one-line description for individual product details */
td.ProductDetailsRight {
  width: 200px;
  height: 25px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: left;
  }
  
/* This is the left side of the product price table */
td.ProductPriceLeft {
  width: 100px;
  height: 22px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: left;
  border-style: solid;
  border-width: 0px 0px 1px 0px;
  border-color: #006D7A;
  padding-left: 5px;
  }
  
/* This is the right side of the product price table */
td.ProductPriceRight {
  width: 195px;
  height: 22px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: left;
  border-style: solid;
  border-width: 0px 0px 1px 0px;
  border-color: #006D7A;
  }

/* This is the red header on the right side of the individual product page where we display free ring sizer */
td.BonusOfferHeader {
  background: #B22222;
  width: 225px;
  height: 25px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 13px;
  font-weight: bold;
  color: #FFF;
  text-align: center;
  }
  
/* This is the yellow header on the right side of the individual product page where we display additional services */
td.NeedHelpHeader {
  background: #D9B76F;
  width: 225px;
  height: 25px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 13px;
  font-weight: bold;
  color: #000;
  text-align: center;
  }

/* Applied to contact form left side field names */
td.ContactFormLeft {
  width: 85px;
  height: 35px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 12px;
  font-weight: bold;
  color: #000;
  text-align: left;
  padding: 3px;
  border-style: solid;
  border-width: 0px 0px 1px 0px;
  border-color: #000;
  }

/* Applied to contact form right side fields */
td.ContactFormRight {
  width: 295px;
  height: 35px;
  padding: 3px;
  border-style: solid;
  border-width: 0px 0px 1px 0px;
  border-color: #000;
  }
  
/* Applied to sales tax table on FAQ page */
td.SalesTaxLeft {
  width: 250px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: left;
  border-style: solid;
  border-width: 0px 0px 1px 0px;
  border-color: #006A71;
  padding-left: 3px;
  }

/* Applied to sales tax table on FAQ page */
td.SalesTaxOtherColumns {
  width: 105px;
  font-family: "Trebuchet MS", Arial,Verdana;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: center;
  border-style: solid;
  border-width: 0px 0px 1px 0px;
  border-color: #006A71;
  }

/* Applied to footer left side */
td.FooterLeft {
  background: #D9B76F;
  width: 358px;
  height: 40px;
  text-align: left;
  }

/* Applied to footer right side */
td.FooterRight {
  background: #D9B76F;
  width: 233px;
  height: 40px;
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 11px;
  font-weight: normal;
  color: #000000;
  text-align: right;
  padding-right: 5px;
  }
  
h1 {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-weight: normal;
  color: #006D7A;
  }
  
h2 {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-weight: normal;
  color: #D9B76F;
  }

/* Applied to all */
p {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: justify;
  line-height: 125%;
  }

/* Applied to text on About Us page */
p.AboutUs {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: left;
  line-height: 125%;
  }
  
/* Applied to questions on top of FAQ page */
p.FAQ {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: justify;
  line-height: 150%;
  }
  
/* Applied to questions in the body of FAQ page */
p.Question {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
  color: #006A71;
  text-transform: uppercase;
  }
  
/* Applied to page titles */
p.Title {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: bold;
  color: #02736D;
  }

/* Applied to product category titles */
p.TitleCategories {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 26px;
  font-weight: normal;
  color: #02736D;
  padding-bottom: 15px;
  }

/* Applied to individual product titles */
p.TitleProducts {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: normal;
  color: #02736D;
  padding-bottom: 15px;
  }

/* Applied to title on Privacy Policy page */
p.TitlePrivacyPolicy {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: #000;
  }
  
/* This is the price when user first visits an individual product page. It says "Starting from" */
.ProductPrice {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: bold;
  color: #02736D;
  }

/* This is when product selections have been made */
.OutputLeft {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;
  color: #000;
  }

/* This is when product selections have been made */
.OutputRight {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 19px;
  font-weight: bold;
  color: #B22222;
  }

/* This is the quote on the home page */
.Quote {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;
  color: #02736D;
  }
  
.FormInfoLeft {
  color: #02736D;
  font-family: "Trebuchet MS", Arial, Verdana;
  font-size: 12px;
  font-weight: bold;
  }
	  
.FormInfoRight {
  color: #000000;
  font-family: "Trebuchet MS", Arial, Verdana;
  font-size: 12px;
  font-weight: normal;
  }
  
#PaymentOKHeader {
  background: #B22222;
  width: 566px;
  height: 25px;
  font-family: "Trebuchet MS", Arial, Verdana;
  font-size: 18px;
  font-weight: normal;
  color: #FFF;
  text-align: left;
  padding-left: 5px;
  }
  
a { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
  color: #006A71;
  text-decoration: none;
  }

a:hover { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
  color: #DEBE7E;
  text-decoration: underline;
  }
  
a.Menu { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 13px; 
  font-weight: bold;
  color: #FFFFFF; 
  text-decoration: none;
  }

a.Menu:hover { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 13px; 
  font-weight: bold;
  color: #000000;
  text-decoration: none;
  }
  
a.RingSize { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: bold;
  color: #006A71;
  text-decoration: none;
  }

a.RingSize:hover { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: bold;
  color: #DEBE7E;
  text-decoration: underline;
  }
  
a.FooterRight { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 11px; 
  font-weight: bold;
  color: #000000; 
  text-decoration: none;
  }

a.FooterRight:hover { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 11px; 
  font-weight: bold;
  color: #000000;
  text-decoration: underline;
  }
  
a.FooterLeft { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px; 
  font-weight: bold;
  color: #000000; 
  text-decoration: none;
  }

a.FooterLeft:hover { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 12px; 
  font-weight: bold;
  color: #000000;
  text-decoration: underline;
  }
  
a.h2 { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 23px;
  font-weight: normal;
  color: #006A71;
  text-decoration: none;
  }

a.h2:hover { 
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 23px;
  font-weight: normal;
  color: #DEBE7E;
  text-decoration: underline;
  }