/* !TAB 1: Framing */
#presentation{
    height: 80px;
}

#taylor_image{
    position: relative;
    float: left;
    margin-top: 5px;
    height:334px;
    width:222px;
    padding:5px;
}

#blurb{
    float: left;
    font-size: 8pt;
    width: 478px;
    height: 344px;
    padding-right: 5px;
    margin: 5px 0px 0px 5px;
}

.paragraph{
    position: relative;
    width: 220px;
    height: 210px;
    padding: 2px 4px 2px 4px;
    margin: 2px 5px 0px 5px;
}

#moulding{
    top: 0px;
    left: 0px;
    height: 230px;
}

#backing{
    top: -236px;
    left: 245px;
    height: 230px;
}

#glazing{
    top: -235px;
    left: 0px;
    height: 90px;
}

#mats{
    top: -330px;
    left: 245px;
    height: 90px;
}
/* !End TAB 1: Framing */

/* !Hardwood TAB 2 */
#hardwoods-description  {height: 215px;}
#hardwoods-image        {height: 180px;}
#hardwoods-legend       {height: 175px;}
/* !End Hardwood TAB 2 */

/* !Metals TAB 3 */
#metals-description     {height: 215px;}
#metals-image           {height: 180px;}
#metals-legend          {height: 175px;}
/* !End Metals TAB 3 */

/* !TAB 4: FAQ */
#component_image{
    position: relative;
    text-align: center;
}

#questions{
    position: relative;
    margin-top: 5px;
    padding: 5px;
    width: 725px;
}

/* some styling for triggers */
#questions{
    display: table;
}

#questions .item img {
    margin:0 5px;
    background-color:#fff;
    border:1px solid #ccc;
    padding:2px;
    float: left;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
}

.simple_overlay {   /* the overlayed element */
    top: -50px;
    left: 5px;
    width:670px;
    /* CSS3 styling */
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    font-size:12px;
}

.simple_overlay img{
    float:left;
    margin: 5px 0px 0px 5px;;
}

/* styling for elements inside the overlay */
.simple_overlay .details {
    top:20px;
    right:130px;
    color:white;
    width:90%;
    float: left;
    padding: 10px;
    margin: 5px;
}

.simple_overlay .details h3 {
    color:#84a3d3;
    font-size:15px;
    margin-top: 5px;
}

.simple_overlay .details h4 {
    color:#84a3d3;
    font-size:12px;
}


.overlay div.close {    /* default close button positioned on upper right corner */
    position:absolute; right:0px; top:0px;
    z-index: 10;
}
/* !End Tab 4 FAQ*/

/* !Frame examples: Tab 5 */
#examples{
    width: 715px;
    height: 430px;
}

.eg{
    position: relative;
    margin: 5px;
}

#egThumbs{
    top: 0px;
    left: 0px;
    width: 205px;
    height: 78px;
    padding: 5px;
}

#egDescription{
    top: 0px;
    left: 0px;
    width: 205px;
    height: 296px;
    padding: 5px;
    margin-top: 5px;
}

#egFrame{
    float: left;
    top: -413px;
    left: 222px;
    width: 500px;
    height:401px;
}

#eglegends{
    width: 470px;
    padding: 5px 25px 5px 25px;
    margin: 5px;
    font-size: 6pt;
}

#egleftlegend{
    position: relative;
    float:left;
    width:265px;
    margin: 5px;
}
#egrightlegend{
    position: relative;
    float:left;
    width:153px;
    margin: 5px;
}

#egTitle{
    position: absolute;
    text-align: center;
    width:500px;
    color: #8a8a8a;
    font-weight: bold;
    display: block;
    margin-top: 5px;
    font-size: 14pt;
}

img#lhseg{margin-top:122px;float:left;}

img#rhseg{margin:68px 0px 0px 9px;float:left;}

#egarrowleft {margin: 190px 5px 0px 5px;}

#egarrowright{margin: 190px 5px 0px 5px;}
/* !End frame examples Tab 5 */

/* !Face-mounting: Tab 6 */
#mounting-top{
    height: 205px;
}

#mounting-display{
    position: relative;
    float: right;
    height: 185px;
    width: 175px;
}

#mounting-description{
    height: 185px;
    width: 540px;
    float: left;
}

#mounting-image {
    height: 226px;
    width: 160px;
}

#mounting-legend{
    height: 221px;
    width: 534px;
}
/* !End Face-mounting: Tab 6 */

/*  !Installation styles tab 7 */
#installation-thumbs{
   height: 39px;
   width: 205px;
   padding: 5px;
   margin-top: 10px;
}

#installation-description{height: 125px;}

#installation-legend{
    position: relative;
    height: 199px;
    width: 205px;
    padding: 5px;
    margin-top: 5px;
}

#slide{
    position: relative;
    float: right;
    top: -267px;
    width: 495px;
    height: 265px;
    text-align: center;
}

.arrow{position: relative; float: left; width: 25px; height: 25px;}

#arrowleft {margin: 120px 5px 0px 5px;}
#arrowright{margin: 120px 5px 0px 5px;}

#installation-image{
   position: relative;
   float: left; 
   width: 405px;
   height:265px;
   padding-top: 5px;
}
/*  !End Installation styles tab 7 */

/* !Crating tab 8 */
#crating-description{
    height: 180px;
}

#crating-images{
    position: relative;
    width: 714px;
    height: 200px;
    padding: 5px 5px 10px 5px;
    margin-top: 5px;
    border: 1px solid silver;
}

.crate-image{
    position: relative;
    float: left;
    margin: 10px 12px 10px 5px;
    height: 195px;
    font-size: 6pt;
}
/* !End crating tab 8*/