/*
<ItemTemplate>
 <div class="category_box design[name]">
                    <h2 class="title"> </h2>
                    <p class="description"></p>
                    <div class="products_box">                        
                                <ItemTemplate>
                                    <div class="product">
                                        <h3><%# Eval("name")%></h3>
                                        <div>
                                            <div class="image_box">
                                                <img alt="" src='<%# "imageDisplay.aspx?img=" + ConfigurationManager.AppSettings.Get("pictureFolder")+"/"+ Eval("image") + "&imgSize=75,114&keepRatio=1&maxHeight=114"%>' />                                       
                                            </div>
                                            <p><%# "<span class='shortText'>" + Eval("shortText").ToString().Replace(System.Environment.NewLine, "<br />") +"</span>" %>
                                            <%# Eval("shortDescription").ToString().Replace(System.Environment.NewLine, "<br />") %></p>
                                            <a class="add_cart" href='cart.aspx?id=<%# Eval("ID")%>'>Add to <br />shopping cart</a>
                                            <div class="info_and_price">
                                                <div class="price">$<%# Eval("price")%></div>
                                                <a class="more_info" href='product.aspx?id=<%# Eval("ID")%>'>More Information</a>                                           
                                            </div>
                                        </div>                                  
                                    </div>
                                </ItemTemplate>
                    </div>
  </div>
</ItemTemplate>
*/
/*
   public struct CategotyDesignGreen
    {
        // category design
        public const string strCategoryTitleColor = "#6FAF32";        
        // box design
        public const string strDesignBoxImage = "/images/green_box.gif";
        public const string strCartImage = "/images/orange_cart.jpg";
        public const string strAddToShoppingColor = "#692E1F";
        public const string strShortTextColor = "#6FAF32";
        public const string strMoreInformationColor = "#5B8C11";   /* product page second title color   51980D and bold            
    }
    public struct CategotyDesignBlue
    {
        // category design
        public const string strCategoryTitleColor = "#5A7BB4";
        // box design
        public const string strDesignBoxImage = "/images/blue_box.gif";
        public const string strCartImage = "/images/blue_cart.jpg";
        public const string strAddToShoppingColor = "#692E1F";
        public const string strShortTextColor = "#5A7BB4";
        public const string strMoreInformationColor = "#5173AD";  
    }

    public struct CategotyDesignBrown
    {
        // category design
        public const string strCategoryTitleColor = "#692E1F";  
        // box design
        public const string strDesignBoxImage = "/images/brown_box.gif";
        public const string strCartImage = "/images/brown_cart.jpg";
        public const string strAddToShoppingColor = "#FF6400";
        public const string strShortTextColor = "#692E1F";
        public const string strMoreInformationColor = "#692E1F";
    } */
   
   
.category_box h2
{
   font-size: 18px;  
   padding-bottom: 0px;  
   margin-bottom: 0px;
   margin-top: 0px;
   padding-top: 0px;
}
.design_green h2
{
    color: #6FAF32;   
}
.design_blue h2
{
    color: #5A7BB4;   
}
.design_brown h2
{
    color: #692E1F;   
}
.category_box
{
     width: 690px;
     /*background-color:Yellow; */
     padding-top: 20px;
   *  padding-top: 0px;
     clear: both;
}

.category_box .products_box
{
    clear: both;
}
.category_box p
{
   font-size: 12px;
   line-height: 18px;
   color: #000000;
   padding-top: 5px;
   margin-top: 0px;
}


.category_box .product
{
    width: 210px;
    padding-left: 5px;
    height: 238px;
    background-repeat : no-repeat;
}
.design_green .product
{
    background-image:url('../images/green_box.gif');
}
.design_blue .product
{
    background-image:url('../images/blue_box.gif');
}
.design_brown .product
{
    background-image:url('../images/brown_box.gif');
}

 .product h3
 {
     width: 210px;
     height: 20px;
     color: #FFFFFF; 
     font-size: 12px;      
     font-weight: bold;
    /* text-align:center; */
     text-indent: 35px;
     white-space: nowrap; 
     overflow:hidden;  
     margin-right: 0px; 
     padding-right: 0px;
     margin-bottom: 0px;
     padding-bottom: 10px;
     padding-top: 3px;
     margin-top: 0px;
 } 
 .product
 {
     float: left;
     margin-right: 13px;
 }
  .product .image_box
  {
      float:left;
      height:137px;
      overflow: hidden;   
  }
 .product .image_box img
 {
     float:left;
     margin-right: 0px;
 }
 .product p
 {     
     float:right; 
     width: 128px;  
     height: 145px;
     font-size:12px;
     padding-bottom: 15px;
     padding-top: 0px;
     padding-left: 0px;
     padding-right: 4px;     
     margin: 0px;
     color: #000000; /* shortText */
    /*white-space: pre;      */
 }
  .product p .shortText
 {
    display:block;
    font-weight:bold;
    font-size:12px;
 }
   .design_green  .product p .shortText
  {
    color: #6FAF32;
  }  
  .design_blue  .product p .shortText
  {
    color: #5A7BB4;
  } 
  .design_brown  .product p .shortText
  {
    color: #692E1F;
  } 
  
  .product a.add_cart
  {
      float:left;
      display: block;
      width: 75px;
      height: 30px; 
      font-size: 12px;
      background-position: top center;
      background-repeat: no-repeat;
      text-align:center;
      text-decoration: none; 
      padding-top: 30px; 
  }
  .design_green  .product a.add_cart
  {
    background-image:url('../images/orange_cart.jpg');
    color: #692E1F;
  }  
  .design_blue  .product a.add_cart
  {
    background-image:url('../images/blue_cart.jpg');
    color: #692E1F;
  } 
  .design_brown  .product a.add_cart
  {
    background-image:url('../images/brown_cart.jpg');
    color: #FF6400;
  } 
  
   .product .info_and_price
   {
        float:right;
   }
 .product .info_and_price a.more_info
 {
    
     font-size: 13px;
     text-decoration: none;
     padding-right: 13px;
 }
.price .strikeout
{
    text-decoration: line-through;    
}
  .product .info_and_price .price
  {
      width: 100px;
      height: 20px;     
      color: #000000;
      font-size:15px; 
      font-weight: bold;
  }
   .design_green  .info_and_price a.more_info
  {
    color: #5B8C11;
  }  
   .design_blue  .info_and_price a.more_info
  {
    color: #5173AD;
  }  
     .design_brown  .info_and_price a.more_info
  {
    color: #692E1F;
  }  
  
  
  /* Product Page */
             /*         <div class="product_box">
                        <div class="image_box">
                             <img alt="" id="imgProduct" runat="server" />                                       
                        </div>
                        <div class="details">
                            <h2><asp:Literal ID="ltrlProductName2"  runat="server"></asp:Literal></h2>                               
                             <p><asp:Literal ID="ltrlProductDescription"  runat="server"></asp:Literal></p>
                              <div class="buttons">
                                   <a class="add_cart" id="lnkAddCart"  runat="server">Add to <br />shopping cart</a>
                                   <a class="all_products" href="all_products.aspx"><img src="images/all_products.gif" /></a>
                              </div>
                        </div>
                     </div> */
 .product_box
 {
     float: left;       
     width: 570px; 
         min-height: 333px;
    height: auto !important;
    height: 333px;
     /* background-color:Yellow;  */
 }             
* html .product_box
 {
     float: left;       
     width: 590px; 
     height: 333px;
     /* background-color:Yellow;  */
 }    
     
 .product_box .image_box
  {
      float:left;
      width: 173px;
      height:269px;
      margin-right: 17px;
  }    
   .product_box .details
  {
     float:left;
     width: 380px;  
  } 
     .product_box .details p
     {
        width: 365px; 
        /*Min-height: 100px;*/
        vertical-align: top;
     }
        
    .product_box a.add_cart
  {
      float:left;
      display: block;
      width: 118px;
      height: 40px; 
      font-size: 18px;
      margin-left:10px;
      background-position: top center;
      background-image:url('../images/cart_white.jpg');
      background-repeat: no-repeat;
      text-align:center;
      text-decoration: none; 
      padding-top: 55px; 
  }
  
    .design_green  .product_box a.add_cart
  {
    color: #692E1F;
  }  
  .design_blue  .product_box a.add_cart
  {
    color: #692E1F;
  } 
  .design_brown  .product_box a.add_cart
  {
    color: #FF6400;
  } 
 .product_box .buttons
 {
    width: 400px;
    height: 100px;
 }