@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: "Kittithada Light 45 Regular";
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/psl240pro.eot") format("embedded-opentype"), url("../fonts/psl240pro.woff") format("woff"), url("../fonts/psl240pro.ttf") format("truetype"), url("../fonts/psl240pro.svg") format("svg");
}

@font-face {
    font-family: "bebas";
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/bebasneue-webfont.eot") format("embedded-opentype"), url("../fonts/bebasneue-webfont.woff") format("woff"), url("../fonts/bebasneue-webfont.ttf") format("truetype"), url("../fonts/bebasneue-webfont.svg") format("svg");
}

h2{
	font-family:'bebas';
	font-size:35px;
	color:#a11726;}
section{
	/*border-bottom:2px solid #a11726;*/
	padding-bottom:40px;
	background:url(../images/line.gif) repeat-x left bottom;}	
section.last{ background:none;}	
.line{ height:14px; background:url(../images/line.gif) repeat-x left bottom; margin-top:10px;}	
.cny-container{
	width:1200px;
	margin:0 auto;}
.containerx{
	max-width:1900px;
	margin:0 auto;}	

.header{
	padding-bottom: 14px;
    border-bottom: 4px solid #bb2939;}
.header a{
	width:141px;
	height:58px;
	display:block;
	margin:0 auto;}

#carousel-example-generic .item > img{
	width:100%;}
#carousel-example-generic #item1 a{
	position:absolute;
	bottom:4%;
	right:23%;}	
#carousel-example-generic #item1 a img{
	width:100%;
	height:auto;}	
#carousel-example-generic #item2 .btn1{
	position:absolute;
	bottom:13%;
	left:29%;
	width:17%;
	}
#carousel-example-generic #item2 .btn2{
	position:absolute;
	bottom:13%;
	right:29%;
	width:20%;
	}	
#carousel-example-generic #item3 .btn1{
	position:absolute;
	bottom:11%;
	left:29%;
	width:20%;
	}
#carousel-example-generic #item3 .btn2{
	position:absolute;
	bottom:11%;
	right:27%;
	width:20%;
	}	
#carousel-example-generic #item2 [class*="btn"] img{
	width:100%;}	
nav{
	border-bottom:2px solid #a11726;
	border-top:2px solid #a11726;}	
nav .wrap{
	text-align:center;}	
nav a{
	display:inline-block;
	text-align:center; 	
	font-family:'bebas';
	font-size:30px;
	color:#a11727;
	border-right:1px solid gray;
	padding:10px 30px;}	
	
nav a:first-child{
	border-left:1px solid gray;}	
nav a:hover{
	background:#a11727;
	color:white;
	}	
	
[class*="wrap-product"] > div{
	text-align:center;
	border:1px solid #f5c354;}	
[class*="wrap-product"] img{ 
	padding:20px 0;
}	

.coupon img{
	display:block;
	margin:20px auto 0 auto;}
	
.term .txt,
.campaign .txt,
.promo .txt{
	font-family:'Kittithada Light 45 Regular';
	font-size:25px;
	line-height:100%;}	
.term ul{}
.term li{ margin-bottom:15px;
 font-size:23px;}	
.term li p {
	text-indent:20px;
	margin-top:10px;} 
	
.btnTop{	
	position:fixed;
	bottom:40px;
	right:20px;
	padding: 16px 15px;
	background: rgba(255,255,255,0.4);
	display:none;
}
.infoGraph{ padding:30px 0;}
.infoGraph img{ display:block; margin:0 auto; max-width:597px; width:100%; height:auto;}
[class*="wrap-product"] img{
		width:90%}
footer{
	height:70px;
	background:black; 
	text-indent:-9999px;
	overflow:hidden;
	background:url(../images/footer.jpg) no-repeat center center #000;}
@media screen and (max-width: 1024px) {
	#carousel-example-generic #item3 .btn1{
	left:27%
	}
	.coupon img{ width:100%;}
	#carousel-example-generic #item1 a{
		width:20%;}
}
@media screen and (max-width: 768px) {	
#carousel-example-generic #item3 .btn1{
	left:19%;
	width:26%;}
#carousel-example-generic #item3 .btn2{	
	right: 19%;
width: 26%;
}
	
#carousel-example-generic #item2 .btn1{	
	left:20%;
	width:25%;

	}
#carousel-example-generic #item2 .btn2{
	bottom:12%;
	right:20%;
	width:31%;

	}	
	#carousel-example-generic #item1 a{
		display:block;
		width:32%;
		/*bottom:10%;*/
		/*position:static;
		right:auto;
		margin:-60% auto 0 auto;*/
		bottom:12%;
		right:auto;
		left:34%;
		}
	#carousel-example-generic .item a img{
		width:100%;}	
}
@media screen and (max-width: 767px) {	
	
}
@media screen and (max-width: 414px) {
    nav a{
		display:block;
		width:100%;
		border-top:1px solid gray}
#carousel-example-generic #item3 .btn1{
left: 11%;
width: 33%;
bottom: 12%;}
#carousel-example-generic #item3 .btn2{	
right: 11%;
width: 33%;
bottom: 12%;
}
	
}	
@media screen and (max-width: 768px) {	

#carousel-example-generic #item2 .btn1{	
	left:13%;
	width:31%;

	}
#carousel-example-generic #item2 .btn2{
	right:13%;
	width:35%;
	}	
}
@media screen and (max-width: 320px) {
	#carousel-example-generic #item1 a{
		bottom:15%;}
#carousel-example-generic #item3 .btn1{
bottom: 13%;}
#carousel-example-generic #item3 .btn2{	
bottom: 13%;
}
	}