﻿*{
	margin:0px;
	padding:0px;
}
header, section, footer, aside, nav, article, hgruop{
	display:block;
}
#top_header{
	display:-moz-box;/* Firefox */
	-moz-box-orient:horizontal;
	-moz-box-align:center;
	display:-webkit-box;/* Safari and Chrome */
	-webkit-box-orient:horizontal;
	-webkit-box-align:center;
}
body{
	width:100%;
	display:-moz-box;/* Firefox */
	-moz-box-pack:center;/* Firefox */
	display:-webkit-box;/* Safari and Chrome */
	-webkit-box-pack:center;/* Safari and Chrome */
	font-family: times new roman;
}
div#bg{ /*BACKGROUND*/
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:-1;

-webkit-filter: blur(2px);filter: blur(2px);
}


div.container {
    	width: 100%;
    	border: 1px solid gray;
}

header, footer {
	padding: 1em;
	clear: left;
	text-align: center;
}

nav {
    	float: left;
   	max-width: 160px;
    	margin: 0;
    	padding: 1em;
}

nav ul {
   	list-style-type: none;
    	padding: 0;
}
   
nav ul a {
   	text-decoration: none;
}

article {
    	margin-left: 170px;
    	padding: 1em;
    	overflow: hidden;
}

/* MENU TOP*/
.button {
  	display: inline-block;
  	border-radius: 4px;
  	background-color: #FF0000;
  	border: none;
  	color: #FFFFFF;
  	text-align: center;
  	font-size: 15px;
 	font-weight: bold;
  	padding: 5px;
  	width: 150px;
  	transition: all 0.5s;
  	cursor: pointer;
  	margin: 0px;
}

.button span {
  	cursor: pointer;
  	display: inline-block;
  	position: relative;
 	transition: 0.5s;
}

.button span:after {
  	content: '\00bb';
  	position: absolute;
 	opacity: 0;
 	top: 0;
 	right: -20px;
 	transition: 0.5s;
}

.button:hover span {
  	padding-right: 25px;
}

.button:hover span:after {
  	opacity: 1;
  	right: 0;
}
/* MENU TOP*/

/* MENU LEFT*/
ul{
                width: 160px;
            }

ul li{
                height: 30px;           /*Cao 30px*/
                line-height: 30px;      /*Cho chữ canh giữa 30px*/    
                list-style: none;       /*Không hiển thị dấu chấm đầu menu*/
                padding: 0px 10px;      /*đẩy nôi dung menu vào 10cm (trái + phải)*/
                background: #E6E6E6;       /*trắng xám*/
                border: solid 1px #BEBEBE;  /*đường viền xám*/
                border-bottom: none;    /*vì menu liền kề nhau nên border-bottom không cần*/
                position: relative;     /*chọn làm khung*/
            }

ul li:last-child{
                border-bottom: solid 1px #BEBEBE;
            }

ul li ul{
                position: absolute;     
                top: -1px;          /*cho ngang hàng với menu cha, vì menu cha có border - 1 nên ta phải trừ đi 1*/
                right: -160px;      /*vì nàm ngoài khung và dài 160px nên là số âm 160px */
                display: none;      /*Ban đầu sẽ không hiển thị*/
            }

ul li:hover ul{
                display: block;
            }
/* MENU LEFT*/

/*SẢN PHẨM TRANG CHỦ*/
.product-wrapper{
	margin-top: 10px;
	height: auto;
	width: auto;
}
.product-box{ /*Tung o trong SP TRANG CHU*/
	/*border-radius: 10px;  Bo goc o trong SP TRANG CHU*/
	float: left;
	position: relative;
	width:200px; /*Chieu rong phan nen tung o trong SP TRANG CHU*/
	height: 210x; /*Chieu cao phan nen tung o trong SP TRANG CHU*/
	margin-left:7px; /*Khoang cach tung o trong SP TRANG CHU*/
	margin-top:3px;
	margin-bottom: 3px;
}
.product-box img{ /* Phan hinh anh*/
	/*margin: 10px; D�ng d? thay th? cho padding c?a product-box*/
	width: 140px; /*Chieu rong anh*/
	height: 110px; /*Chieu cao anh*/
	box-shadow: 0px 0px 8px black; /*Do bong phan hinh anh tung o trong DS*/ 
	position: absolute;
	left: 30px;/* Vi tri anh trong DS*/
	top: 5px;/* Vi tri anh trong DS*/
}

img.Hinhsanpham { /*Hinh dai dien san pham*/
	float: left;
	display: inline-block;
	border-radius: 10px;
			
}
p.tensanpham {
	clear: both;
	font-size: 14px;
	text-align: center;
}


/*SẢN PHẨM TRANG CHỦ*/


/*SẢN PHẨM CHI TIẾT*/

/*SẢN PHẨM CHI TIẾT*/