﻿/* ------------------------------------------------------ */

/* FrameWork Setup */

body , html
{
    margin:0;
    padding:0;
    height:100%;
    font-family:Arial;
}

body 
{

}

form
{
    height:100%;
}

#container
{
    position:relative;
    margin-left:auto;
    margin-right:auto;
    width:960px;
    background:url(../Images/Design/footer-bg.jpg) no-repeat center bottom;    
    background-color:#2a2a2a;
}

#header
{
    height:80px;
    width:100%;
}

#body
{
   /*padding-bottom:40px;*/

}

#footer
{
    /*position:absolute;
    bottom:0;*/
    width:100%;
    height:40px;
    background-color:#000;
    color:#fff;
}

#clearheader
{
    height:80px;
}

.content
{
   background:url(../Images/Design/footer-tp.jpg) repeat-x left top;
   min-height:150px;
   width:940px;
   padding:0px 0 0 20px;
}

/* ----------------------------------------------------------------------------------------- */
/* General */

.clearBoth
{
    clear:both;
}

.bold
{
    font-weight:bold;
}

#copy
{
    color:#fff;
    padding:20px 0 0 0;
}

#copy h1
{
    font-size:1.4em;
    margin:0 0 20px 0;
    font-weight:bold;
}

#copy h2
{
    font-size:0.9em;
    font-weight:bold;
}

#copy p
{
    font-size:0.9em;
    margin:0 0 10px 0;
}

.floatLeft
{
    float:left;
}


/*-------------------------------------------------------------------------------------------*/
/* master page */

#header
{
    background-color:#fff;
    width:960px;
    height:81px;
}

#header .title
{
    float:left;
    margin:26px 0 0 0;
}


#header .number
{
    float:right;
    margin:26px 0 0 0;
}

#nav
{
    width:960px;
    height:60px;
    background-color:#000;
    font-size:0.9em;
    font-weight:bold;
}

/*----------------------------------------------------*/

/* main menu */
#nav .MainMenu
{
    width:960px;
    height:60px;
    color:#ccc;
    padding: 0;
    margin:0;
    list-style: none; 
}

#nav .MainMenu .count
{
    margin:13px 0 0 10px;
    width:30px;
    background-image:url(../images/Design/count-bg.gif);
    background-position:left top;
    background-repeat:no-repeat;
    padding:7px 0 0 0px;
    color:#000;
    text-align:center;
}

#nav .MainMenu .countblank
{
    margin:13px 0 0 10px;
    width:30px;
    padding:7px 0 0 0px;
    color:#000;
    text-align:center;
}


#nav .MainMenu .contact
{
        margin:20px 0 0 30px;
}

#nav .MainMenu li
{
    display:inline;
    padding: 0;
    float:left;
    margin:20px 0 0 70px;
    height:30px;
}

#nav .MainMenu a
{
   float:left;
   display:block;
   color:#ccc;
   text-decoration:none;
   height:30px;
}

#nav .MainMenu a:hover
{
    color:#fff;
}

#nav .MainMenu a.selected
{
    color:#fff;
    background-image:url(../images/Design/MainmenuSelectedBottom.gif);
    background-position:center 20px;
    background-repeat:repeat-x;
}

/*-------------------------------------------------------------------*/

/*Footer Menu */


#footer .FooterMenu
{
    float:right;
    width:514px;
    height:40px;
    color:#ccc;
    padding: 0;
    margin:0 10px 0 0;
    list-style: none; 
    font-size:0.8em;
}

#footer .FooterMenu li
{
    float:left;
    margin:10px 0 0 10px;
    height:20px;
}

#footer .FooterMenu a
{
    float:left;
   display:block;
   color:#ccc;
   text-decoration:none;
   height:20px;
   background-image:url(../images/Design/FooterSeperator.gif);
   background-position:right center;
   background-repeat:no-repeat;
   padding:0 10px 0 0;
}

#footer .FooterMenu a:hover
{
    color:#fff;
}

#footer .FooterMenu a.selected
{
    color:#fff;
}


/* ------------------------------------------------------------------*/

/*default page */

#flashcontainer
{
    width:405px;
    height:270px;
    float:left;
    margin:20px 0 0 0;
    background-color:#000;
}

#flashcontainer #flash
{
    margin:2px 0 0 2px;
}

#flashcontainer #title
{
    margin:-50px 0 0 90px;
    color:#fff;
    width:240px;
}

#welcome #copy
{
    width:489px;
    height:255px;
    float:left;
    color:#fff;
    margin:10px 30px 0 0;
}

#featureboxes
{
    margin:25px 0 0 0;
    padding:0 0 0 1px;
    height:122px;
    width:940px;
}

#featureboxes a
{
    width:277px;
    color:#fff;
    text-decoration:none;
    padding:7px 0 0 15px;
    font-size:0.9em;
    height:86px;
    display:block;
}

#featureboxes a div
{
    line-height:0;
    font-size:0;
}

#featureboxes .SeeTheProcess
{
    background-image:url(/Images/Design/SeeTheProcess-bg.jpg);
    background-position:left top;
    background-repeat:no-repeat;
    margin:0 22px 0 0;
    width:292px;
    height:122px;
    float:left;
    display:inline;
}

#featureboxes .RequestSample
{
    background-image:url(/Images/Design/RequestedSamples-bg.jpg);
    background-position:left top;
    background-repeat:no-repeat;
    margin:0 0 0 0;
    width:292px;
    height:122px;
    float:left;
}

#featureboxes .FeaturedStone
{
    background-image:url(/Images/Design/FeaturedStones-bg.jpg);
    background-position:left top;
    background-repeat:no-repeat;
    margin:0 23px 0 0;
    width:292px;
    height:122px;
    float:left;
    display:inline;
}


#featureboxes  .small
{
    font-size:0.9em;
}



/*-------------------------------------------------------------------------*/
/*Featured Stones */

#featured
{
    float:left;
    padding-top:20px;
    
}

#featured #products
{
    height:300px;
    width:580px;
}

#featured #list
{
    width:565px;
    height:276px;
    overflow:auto;
    background-image:url(/Images/Design/ListBox-bg.jpg);
    background-position:left top;
    background-repeat:repeat-x;
    padding:5px;
}

#featured #copy
{
    width:580px;
}

#featured .enlargelink
{
    margin:225px 10px 0 0;
    float:right;
}

#featured .backlink
{
    margin:225px 10px 0 0;
    float:left;
}


#videos
{
    float:left;
    height:447px;
    width:322px;
      margin:0 0 20px 20px;
     display:inline;
     padding-top:20px;   
 }

#videos #flashvideo
{
    position:relative;
  width:322px;
  height:220px;
  background-color:#000;
    margin:0 0 5px 0;
}

#videos #flashvideo #flash
{
    margin:0 0 0 1px;
    height:220px;
    width:325px;
}


#videos #flashvideo #title
{
    position:absolute;
    bottom:20px;
    text-align:center;
    color:#fff;
    font-weight:bold;
    width:255px;
    font-size:0.8em;
    margin-left:33px;
    }

#videos #videolist
{
  width:322px;
  height:228px;
  background-color:#000;
}

.Product
{
    padding:0 6px 0 0;
    height:260px;
    width:210px;
}

.Product a
{
    text-decoration:none;
    height:260px;
    width:218px;
    display:block;
}

.Product .productname
{
    text-align:center;
    width:218px;
    color:#fff;
    margin:-30px 0 0 0;
    display:block;
}

#videocontaner
{
    height:190px;
    width:308px;
    overflow:auto;
    padding:0 0 0 10px;
}

#videocontaner .video
{
    width:292px;
    height:80px;
    background-image:url(/Images/Design/Video-bg.jpg);
    background-position:left top;
    background-repeat:no-repeat;
}


#videocontaner .video a
{
    color:#fff;
    text-decoration:none;
}

#videocontaner .video .title
{
    float:left;
    margin:5px 0 5px 10px;
    width:175px;
    height:30px;
    font-size:0.8em;
    font-weight:bold;
    line-height:1.4em;
    font-family:Verdana;
}

#videocontaner .video .text
{
    float:left;
    margin:0 0 0 10px;
    width:170px;
    height:30px;
   font-size:0.7em;
   font-family:Verdana;
}

#videocontaner .video img
{
    float:left;
    width:100px;
    height:70px;
    margin:0 0 0 5px;
}


#videos #videolist h3
{
    padding:10px 0 5px 7px;
    font-family:Verdana;
    font-weight:bold;
    color:#fff;

}
/*----------------------------------------------------------------*/

/* Product detail page */

#featured #detail h1
{
    font-size:1.4em;
    margin:0 0 20px 0;
        float:left;
        font-weight:bold;
}

#featured #detail p
{
    font-size:0.9em;
    margin:0 0 20px 0;
}

#featured
{
   width:580px;
}

#featured #detail
{
    color:#fff;
    width:558px;
    margin:10px 0 0 10px;
}

#featured #detail input
{
    float:right;
}

#featured .branco
{
    background-image:url(/Images/Design/Video-bg.jpg);
    background-position:left top;
    background-repeat:no-repeat;
}
/*--------------------------------------------------------------*/

/* contact page */

#contact
{

}

#contact #details
{
    width:470px;
    float:left;
   
}


#contact #details label
{
    width:100px;
    margin:0 0 15px 70px;
    display:inline;
    float:left;
}

#contact #details input
{
    width:275px;
    margin:0 3px 15px 0;
    float:left;
}



#contact #message
{
    margin:0 0 0 10px;
    width:400px;
    float:left;
}


#contact #message label
{
    width:100px;
    display:block;
    float:left;
        
}

#contact #button input
{
    float:right;
    margin:0 20px 0 0;
}
/*-----------------------------------------------------------*/

/*Request Smaples Page 1 */

#text
{
    float:left;
    width:700px;
}

#steps
{
    float:right;
    width:205px;
    height:21px;
    margin:5px 30px 0 0;
    display:inline;
}

#steps img
{
    margin:0;
    float:left;
}

#steps .connector
{
    padding:9px 0 0 0;
}

#samples
{
    margin:0 0 50px 50px;
}

#samples a
{
    color:#fff;
}

#samples .message
{
    margin:0 0 70px 0;
    font-weight:bold;
}

#samples .btn
{
    float:right;
    margin:0 20px 0 0;
}


#samples h4
{
    font-size:0.8em;
    margin:0 0 0 320px;
    float:left;
}

#samples h4.second
{
    font-size:0.8em;
    margin:0 0 0 405px;
    float:left;
}



.sample
{
    margin:20px 100px 10px 0;
    height:45px;
}

.sample img
{
    float:left;
    
}

.sample h3
{
    float:left;
    margin:10px 0 0 20px;
    font-weight:normal;
    width:260px;
}


.sample input
{
    float:left;
    margin:10px 0 0 0;
}

/*reuest samples page 2 */

#navigation
{
    margin:15px 0 80px 0;
}

#navigation .nextbtn
{
    margin:0 20px 0 0;
    float:right;
}

#navigation .backbtn
{
    float:left;
}

/*request samples 3 */

#YourDetails
{
    margin:10px 0 0 0;

}

#YourDetails #Details
{
    float:left;
    font-size:0.9em;

}

#YourDetails #DetailsSecond
{
    float:left;
    font-size:0.9em;

}

#YourDetails #Details label
{
    width:100px;
    margin:0 0 15px 70px;
    display:inline;
    float:left;
}

#YourDetails #Details input
{
    float:left;
        width:275px;
    margin:0 0 15px 0;
}

#YourDetails #Details img
{
    float:left;
    margin:0 0 0 5px;
}

#YourDetails #DetailsSecond label
{
    width:100px;
    margin:0 0 15px 25px;
    display:block;
    float:left;
}

#YourDetails #DetailsSecond input
{
    float:left;
        width:275px;
    margin:0 0 15px 0;
}

#YourDetails #DetailsSecond img
{
    float:left;
    margin:0 0 0 5px;
}

#RequestedSamples
{
    width:300px;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:60px;
}

#privacy
{
        margin:0 0 70px 0;
}

#terms
{
    margin:0 0 70px 0;
}

/*------------------------------------------------------------------*/

/* see the process page */

#processContainerFlash
{
    height:370px;
    width:960px;
    padding:0;
    margin:0;
}

#processContainerFlash object
{
    margin: 0 auto 0 auto;
}

.errorSummary {width: 80%;margin:10px 0px 20px 65px;font-size:0.9em;}
.errorSummary h4 {margin:3px 0px 3px 3px;color:#CC0000;font-weight:bold;}
.errorSummary ul {margin: 0px;padding: 5px;color:#fff;list-style-type:none;}
.errorSummary ul li {list-style-type:none;background:none;}

