﻿body { /*the whole backgound of the detail merchandise picture*/
    color: #574c3f;
    font-family: Helvetica, sans-serif;
    font-size: 14px;
    background-color: white;
    width: 1250px;
    margin: auto;    
}
.btntreeview {
  /*  background: linear-gradient(to bottom, darkgreen, green); background nut*/
   padding: 10px;
    margin: 10px;
    color: white;

    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border: 0;
    clear: both;
    width: 150px;
   margin-left: 10px ;
    height:60px;
      background-color:blue;
      font-size: 16px;
      font-family:Arial;
      font-weight: bold; 
}

#wrapper {  /* ghichu wrapper is content in div blank without id*/
    width: 1250px;
    margin: auto;    /*balance left right distance ghichu */
    padding-bottom: 140px;/*keo dan wrapper de tranh 2 cai navm va tentiem */
    background-color: white;
   
}
#banner { /*banner is slide show pic ghichu */
    width: 1250px;
    margin: auto;    
    padding-bottom: 10px;
    background-color: white;
}

#navigation {
    height: 40px;
     
   /* background: linear-gradient(to top, #c2bcb5, #a8f8f1);*/
    background-color: aliceblue;
   
}
#t {
    height: 40px;
     
   /* background: linear-gradient(to top, #c2bcb5, #a8f8f1);*/
    background-color: aliceblue;
   
}
#nav {
    display: block;
    list-style: none;
    text-align: center;
    font-weight: bold;
     
}

    #nav ul {
        display: block;
        list-style: none;
       background-color: aliceblue;
    }

    #nav li {
        float: left;
        display: block;
        margin-top: 15px;
        text-transform: uppercase;
        padding: 0px 20px 0px 20px;
        border-left: 1px solid #FFFFFF;
    }

    #nav a:link, #nav a :visited, #nav a:active {
        display: block;
        color: #574c3f;
        text-decoration: none;
    }

    #nav a:hover {
        background-color: bisque;
    }

a:visited {
    display: block;
    color: #574c3f;
    text-decoration: none;
}

#content {
    padding: 20px;
    min-height: 400px;
}

/*Generic Controls*/
.button {
    background: linear-gradient(to bottom, darkgreen, green);
    padding: 10px;
    margin: 10px;
    color: white;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border: 0;
    clear: both;
    width: 150px;
}

/*Webshop */
#ContentPlaceHolder1_pnlProducts div /*moi page se co contentplaceholder1 noi vo day ghichu*/
{
    float: left;
    width: 300px; /* KICH THUOC MOI O HINH  ghichu*/
    height: 300px;
    text-align: center;
}

.productName {
   /* font-weight: bold;*/
    font-size: 14px;
}

.productPrice {
    font-family: arial,helvetica,sans-serif;
    color: #FFB600;
}

.productImage {
    width: 250px; /*SIZE HINH TRONG Ô */
    height: 250px;
    vertical-align: central;
    padding: 10px;
  /* -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
        3 hang nay la round image corner
   */
}

/*Detail page*/
#detailimcolumn1 {
    height: 500px;
    width: 500px;
    margin-right: 30px;
}
#detailimcolumn2 {
    height: 100px;
    width: 100px;
    
}
.detailsImage {
    height: 100%;  /* hinh thi hien 100 trong column1 rong 500px*/
    width: 100%;
    margin-right: 30px;
}

.detailsDescription {
    font-style: italic;
    width: 300px;
}

.detailsPrice {
    font-weight: bold;
    font-size: 18px;
    width: 50px;
}

.inputs {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-color: #EAEAEA;
    border: 1px solid #CACACA;
    color: #444;
    margin: 0 0 25px 35px;
    padding: 5px 9px;
    }

.inputs:focus {
    background: #FFF;
    -webkit-box-shadow: 0 0 25px #CCC;
    -moz-box-shadow: 0 0 25px #ccc;
    box-shadow: 0 0 25px #CCC;
}

/*Shopping Cart Page */
.CartTable
{
    text-align: center;
    border: 15px solid #f5f4f2;
    margin-bottom: 10px;
    width: 100%;
    padding: 10px;
}

.CartTable input
{
    width: 65px;
    height: 65px;
}

.CartTable h4
{
    padding: 0;
    margin: 0;
}

.CartTable tr td select
{
    width: 100px;
}

 #navm {

            margin:1px; /*entire row separate 10px from the left egde of screen */
         background-color: coral;
       position: absolute;
       /*  position: fixed;  code nay cho bar stay fixed wont scroll with screen*/
      /*   top: 200px; /*top screen to top edge of nav bar*/
       /*  width: 99%;the width of the nav bar less 1px of right screen edge*/
         height:45px;/* chieu cao red bar */
         transition: top 0.3s; /* Transition effect when sliding down (and up) */

        }
        #navm ul{
            padding:0;
            list-style:none;
           
        } 
        #navm ul li /*dinh vi tab*/
        {
            float:left;/*tab trai dai sang ben trai*/
            text-align:center;
            width:120px; /*do rong tab*/
         
            margin:1px;
        }
         #navm ul li a 
        {
            color:black;/*color text in tab*/
            text-decoration:none;
            font-family:Arial;
            background-color:aqua;/*color tat ca tab*/
         
           /*padding:10px;   chieu cao cua tab ko can*/
        
        }
        #navm a /*cai nay phai co de di chung voi hover neu ko thi hover ko work*/
        {
	text-decoration: none;
	color: #ECECEC;
	line-height: 30px;  /*lenh nay chinh kich thuoc tab va can xung text trong tab   */
	display: block;	
     margin-top:5px;/*balance top bottom tab in red bar  */
   
}
        #navm a:hover { /* khoi dong hover cho cac tab chinh  */

	color: white;
	background-color: red;
	}
     #navm ul li ul { /* hide nhung tab nho de cho hover   */
	
	display: none;	
   position:initial;/*stop dropmenu push down content, absolute list small tab into horrizontal line not verticle*/
}
    #navm ul li:hover ul {  /* display nhung tab nho khi hover   */
	
	display: block;	
   
}
     #tentiem ul li /*dinh vi tab*/
        {
            float:right;/*tab trai dai sang ben trai*/
            text-align:center;
            width:80px; /*do rong tab*/
           display:block;
            margin:1px;
        }
      #tentiem ul li a 
        {
            color:white;/*color text in tab*/
            text-decoration:none;
            font-family:Arial;
            background-color:aqua;/*color tat ca tab*/
        
           /*padding:10px;   chieu cao cua tab ko can*/
        
        }
        #tentiem {
            font-size: 12px;
            margin:1px; /*entire row separate 10px from the left egde of screen */
         background-color: white;
       /*  position: fixed;*/
         top: 0px; /*top screen to top edge of nav bar*/
       /*  width: 99%;/*the width of the nav bar less 1px of right screen edge*/
         height:110px;
       /* text-align:left;*/
       transition: top 0.5s; /* Transition effect when sliding down (and up) */

        }