/* 
    Document   : product_promo_site
    Created on : 10/01/2012, 5:27:08 PM
    Author     : Jeremy
    Description:
        Purpose of the stylesheet follows.
*/


table.promo{  
    /*width: 880px;*/   /*The width of the product promo(if needed)*/
}

/***arrows***/
    /*Set the width (for alignment even if arrows are not there)*/
    .promo td.control_arrows{
        width: 22px;
        vertical-align: middle;
    }
        .promo td.control_arrows a img{
        margin-bottom: 80px;
    }
     .promo td.left a img{
         display: block;
         float: right;
     }
     .promo td.left a {
         display: block;
         width: 17px;
         height: 91px;
         padding-bottom: 80px;
         background: url("../../../../styles/standard/site/images/site/previous.png") no-repeat;
     }
     .promo td.left a:hover {
         background: url("../../../../styles/standard/site/images/site/previous_over.png") no-repeat;
     }
     .promo td.right a {
         display: block;
         width: 17px;
         height: 91px;
         padding-bottom: 80px;
         background: url("../../../../styles/standard/site/images/site/next.png") no-repeat;
     }
     .promo td.right a:hover {
         background: url("../../../../styles/standard/site/images/site/next_over.png") no-repeat;
     }
/*Cat promo*/
    .promo .category_container{
         background: url("../../../../styles/standard/site/images/site/promo-bg.jpg") repeat-x scroll 0 0 #F6B24F;
         width: 250px;
         border-radius: 20px 20px 20px 20px;
    }
    
    
    

        
/*Per Product*/
            /*The width of the slides in the middle (required for centering)*/
            .promo .slides{width: 180px;height: 230px;}

            .promo .slides{
                
            }
            
            
            /* |------------------------------------------|
             * |            .cat name                     |
             * |------------------------------------------|
             * |---\/Inside the slide\/---                |
             * |  |------------------------------------|  |
             * |  |       .image and name              |  |
             * |  |------------------------------------|  |
             * |  |       .desc                        |  |
             * |  |------------------------------------|  |
             * |  |       .buttons                     |  |
             * |  |------------------------------------|  |
             * |------------------------------------------|
             *
             */
             /*All*/
             .slides td{
                 vertical-align: top;
                 text-align: center;
             }
             
             /*Constant*/
             td.cat_name{height: 50px;}
             /*Side*/
             .slides td{
                 vertical-align: top;
                 text-align: center;
             }
             .slides td.image_and_name{height: 159px;}
             
             .slides td.description{height: 39px;}
             .slides td.description *{font-size: 12px;}
             .slides td.buttons{height: 30px;}
             .slides tr.buttons td.moreinfo a{
                width: 84px;
                height: 29px;
                display: block;
                background: url("../../../../styles/standard/products/images/more_info.png") no-repeat;
             }
             .slides tr.buttons td.moreinfo a:hover{
                  background: url("../../../../styles/standard/products/images/more_info_over.png") no-repeat;
             }
             .slides tr.buttons td.enquire a{
                width: 84px;
                height: 29px;
                float: right;
                display: block; 
                background: url("../../../../styles/standard/products/images/enquire.png") no-repeat;
             }
             .slides tr.buttons td.enquire a:hover{
                  background: url("../../../../styles/standard/products/images/enquire_over.png") no-repeat;
             }
             
             /*Style Chagnes*/
             .promo tr td.set div.category_container table.product_container tr td.cat_name h2{border-bottom: none;}
             .promo tr td.set div.category_container table.product_container tr td.cat_name h2 a{font-size: 18px;}
             .promo tr td.set div.category_container table.product_container tr td.products div.slides td.image_and_name div h3 a{font-size: 16px;}