/* Clearfix */
.clearfix:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
* html > body .clearfix {
	display: block;
	width: 100%;
}
* html .clearfix {
	height: 1%;
}
/* CSS Document */

html
{
	overflow:auto;
}

body
{
	font-size:11px;
	font-family:Verdana;
	margin:0px;
	padding:0px;
	background:#25221b url(/images/bg_shape.jpg) top center no-repeat;
	color:#25221b;
	line-height:1.5em;
}

a
{
	text-decoration:none;
	outline:none;
}


a img
{
	border:none;
}

.center
{
	width:100%;
	border-top:solid 5px #918363;
	background:url(/images/bg.jpg) center 99px no-repeat;
	text-align:center;
	position:absolute;
}
#container
{
	width:1002px;
	text-align:justify;
	margin:0px auto;
}
#banner
{
	height:99px;
	width:1151px;
	margin:0px auto;
	position:relative;
	
	background:transparent url(/images/logo.png) top left no-repeat;

}

#logo
{
	position:absolute;
	top:-10px;
	left:30px;
	
	width:1151px;
	height:105px;
}


#body
{
	height:410px;
	width:1002px;
}

#body .left
{
	float:left;
	display:inline;
	width:750px;
	height:410px;
	overflow:hidden;
	position:relative;

}

#body .left .big_cup
{
	position:absolute;
	top:0px;
	left:0px;
	/*background:transparent url(/images/big_cup.png) top left no-repeat;*/
	width:386px;
	height:410px;
}


#body div.right
{
	float:left;
	display:inline;
	width:252px;
	background:url(/images/menu_bg.jpg) no-repeat;
	position:relative;
}
#menu
{
	height:200px;
	width:252px;
	overflow:hidden;

}
#menu ul
{
	margin:0px;
	padding:0px;
	list-style:none;
	width:252px;
}
#menu ul li
{
	height:40px;
	width:242px;
	padding-right:5px;
}
#menu a
{
	display:inline-block;
	position:relative;
	float:left;
	width:250px;
	height:50px;
	line-height:50px;
	background-color:transparent;
	background-position:0px 0px;
	background-repeat:no-repeat;
	text-indent:-9999px;
	outline:none;
	cursor:pointer;
}

#menu a.hover
{
	background-position:0px -50px;
}


#menu .home
{
	background-image:url(/images/menu-trang-chu.png);
}

#menu .gioi-thieu
{
	background-image:url(/images/menu-gioi-thieu.png);
}

#menu .san-pham
{
	background-image:url(/images/menu-san-pham.png);
}

#menu .dat-hang
{
	background-image:url(/images/menu-dat-hang.png);
}

#menu .lien-he
{
	background-image:url(/images/menu-lien-he.png);
}

#info
{
	width:252px;
	padding-top:5px;
	height:140px;
}
#info h1
{
	margin:0;
	padding:0;
	height:25px;
	padding-left:5px;
	line-height:24px;
	background:#e5decd;
	color:#2d2423;
	font-size:11px;
	font-weight:bold;
}
#info .content
{
	padding:5px 0px;
	width:252px;
	height:105px;
	color:#191712;
}

#info ul, #info li
{
	padding:0px;
	margin:0px;
	list-style:none;
}

#info .anyClass
{
	width:210px;
	float:left;
	position: relative;
	visibility: hidden;
	left: -5000px;

}

#info li, #info li img
{
	width:200px;
	height:100px;
}


#slide
{
	width:252px;
	height:65px;
	background:url(/images/tgp_slide.jpg) no-repeat;
}
#copyright
{
	width:252px;
	padding-top:8px;
	height:30px;
	text-align:center;
	color:#e4e4e4;
	cursor:pointer;
	font-size:11px;
	font-family:Tahoma;
}


#blocks, #blocks li.block
{
	list-style:none;
	padding:0px;
	
	margin:0px;
}

#blocks
{
	width:9999px;
	position:relative;
}

li#home
{
	background-image:url(/images/bg_home.jpg);
}

li#gioi-thieu
{
	background-image:url(/images/bg_gt.jpg);
}

li#san-pham
{
	background-image:url(/images/bg_sp.jpg);
}

li#lien-he
{
	background-image:url(/images/bg_lh.jpg);
}


#blocks li.block
{
	float:left;
	display:inline;
	width:751px;
	height:410px;
	position:relative;
	background-position:top left;
	background-repeat:no-repeat;
	background-color:transparent;
	/*background:transparent url(/images/bg.png) top left no-repeat;*/
}

#blocks li.block .content
{
	height:390px;
	padding:10px 20px 10px 115px;
	color:#BF9872;
}



#shadow_top, #shadow_bottom
{
	position:absolute;
	left:0px;
	width:100%;
	height:10px;
	z-index:10;
	line-height:0px;
	font-size:0px;
}

#shadow_top
{
	top:99px;
	background:transparent url(/images/shadow_top.png) top left repeat-x;
	
}

#shadow_bottom
{
	top:-10px;
	background:transparent url(/images/shadow_bottom.png) top left repeat-x;
}

#shadow_right
{
	width:121px;
	height:410px;
	background:transparent url(/images/shadow_right.png) top left no-repeat;
	position:absolute;
	left:-119px;
}

#video-wrapper
{
	margin-left:368px;
}

#slideshow
{
	width:382px;
	height:120px;
	position: relative;
	overflow: hidden;
	margin-left:368px;
	z-index:5;
}

	#slideshow a {
		position:absolute;
		z-index: 1;
		width: 100%;
		height: 100%;
		outline:none;
	}

	#slideshow img {
		border: none;
	}
	
	
	
/* pagination control */

#slideshow ul,
#slideshow ol {
	list-style: none;
	position: absolute;
	margin: 0;
	padding: 0;
	bottom: 7px;
	right: 5px;
	z-index: 3;
}

	#slideshow ul li,
	#slideshow ol li {
		float: left;
		margin: 0 3px;
		width: 17px;
	}
	
	#slideshow ul li a {
		position: relative;
		display: block;
		background:transparent url(/images/slide_nav.png) 0px 0px no-repeat;
		width: 17px;
		height: 17px;
		line-height:17px;
		text-decoration: none;
		color:#FFFFFF;
		text-align: center;
		font-size: 11px;
		font-weight: bold;
	}
	
	#slideshow ul li a.current, #slideshow ul li a:hover {
		
		background-position:0px -17px;
		color: #3b3a38;
	}
	
	#slideshow .caption
	{
		width:382px;
		height:3px;
		background:transparent url(/images/slide_border.png) top left no-repeat;
		z-index:3;
		position:absolute;
		bottom:0px;
		font-size:0px;
		line-height:0px;
	}
	
#slideshow ol {
	display:none !important;
}



#tabs ul, #tabs li
{
	padding:0px;
	margin:0px;
	list-style:none;
}

#tabs li
{
	display:inline;
	float:left;
	height:92px;
	padding:10px 18px 0px;
}

#tabs li.delimiter
{
	padding:0px;
	margin-top:10px;
	width:2px;
	background:transparent url(/images/tab-delimiter.png) left top no-repeat;
}

#tabs a
{
	outline:none;
	display:block;
	text-indent:-9999px;
	height:78px;
	background-color:transparent;
	background-position:left top;
	background-repeat:no-repeat;
}

#tabs a:hover, #tabs a.hover
{
	background-position:left bottom;
}

#tabs a.selected
{
	background-position:left bottom !important;
}


#tabs .den a
{
	background-image:url(/images/tab-den.png);
	width:112px;
}

#tabs .den-kieng a
{
	background-image:url(/images/tab-den-kieng.png);
	width:177px;
}

#tabs .sua a
{
	background-image:url(/images/tab-sua.png);
	width:118px;
}

#tabs .sua-kieng a
{
	background-image:url(/images/tab-sua-kieng.png);
	width:183px;
}

#tabs-content
{
	clear:both;
	height:310px;
}


#contact
{
	position:relative;
	width:630px;
	margin:20px auto 0px;
}

#contact input, button, textarea
{
	border:none;
	font-size:11px;
	font-family:Tahoma;
	color:#563E29;
	padding:0px;
	margin:0px;
}

#contact fieldset
{
	padding:3px 0px;
	margin:0px;
	border:none;
}

#contact .input
{
	background:transparent url(/images/bg-input.png) top left no-repeat;
	height:24px;
	padding:9px 8px 0;
	width:202px;
}

#contact input.error, textarea.error
{
	color:#9C1A1A;
}

#contact .textarea
{
	overflow:auto;
	background:transparent url(/images/bg-textarea.png) top left no-repeat;
	height:101px;
	padding:8px 6px 6px 8px;
	width:208px;
}

#contact .submit
{
	display:block;
	margin:10px auto 0px;
}

#contact label
{
	float:left;
	text-align:right;
	height:35px;
	line-height:35px;
	color:#81491F;
	padding-right:2px;
	width:80px;
}

#contact label.error
{
	background:transparent url(/images/bg-status.png) no-repeat scroll left top;
	position:absolute;
	text-align:left;
	text-indent:-9999px;
	margin-left:3px;
}

#contact fieldset.right
{
	position:absolute;
	margin-left:320px;
	
}

#lien-he .contact-info
{
	text-align:center;
	margin-top:15px;
}

#footer
{
	position:relative;
}

#footer a
{
	color:#FFF201;
}

#footer .footer-wrapper
{
	width:1002px;
	margin:0px auto;
	position:relative;
	color:#FFFFFF;
}

#footer .footer-left
{
	position:absolute;
	left:30px;
	text-align:center;
	background:transparent url(/images/copyright.png) top left no-repeat;
	width:212px;
	height:16px;
	top:15px;
	text-indent:-9999px;
}


#footer .footer-right
{
	position:absolute;
	right:45px;
	top:15px;
}

#footer .footer-right a
{
	text-indent:-9999px;
	display:block;
	width:167px;
	height:13px;
	outline:none;
	background:transparent url(/images/tgp.png) top left no-repeat;
}


#flags
{
	position:absolute;
	right:75px;
	top:5px;
	z-index:1;
}.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #382f2a;
	padding:0px 7px 0px 4px;
}
.jScrollPaneDrag {
	position: absolute;
	background: #282121;
	border:1px solid #71685B;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}/*
 * FancyBox - jQuery Plugin
 * Simple and fancy lightbox alternative
 *
 * Copyright (c) 20010 Janis Skarnelis
 * Examples and documentation at: http://fancybox.net
 *
 * Version: 1.3.0 (02/02/2010)
 * Requires: jQuery v1.3+
 *
 * Dual licensed under the MIT and GPL licenses:
 *   http://www.opensource.org/licenses/mit-license.php
 *   http://www.gnu.org/licenses/gpl.html
 */
 
#fancybox-loading {
	position: fixed;
	top: 50%;
	left: 50%;
	height: 40px;
	width: 40px;
	margin-top: -20px;
	margin-left: -20px;
	cursor: pointer;
	overflow: hidden;
	background: transparent;
	z-index: 1104;
	display: none;
}

* html #fancybox-loading {	/* IE6 */
	position: absolute;
	margin-top: 0;
}

#fancybox-loading div {
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 480px;
	background: transparent url('/images/fancy/fancy_loading.png') no-repeat;
}

#fancybox-overlay {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: #000;
	z-index: 1100;
	display: none;
}

* html #fancybox-overlay {	/* IE6 */
	position: absolute;
	width: 100%;
}

#fancybox-tmp {
	padding: 0;
	margin: 0;
	border: 0;
	overflow: auto;
	display: none;
}

#fancybox-wrap {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 20px;
	z-index: 1101;
	display: none;
}

#fancybox-outer {
	position: relative;
	width: 100%;
	height: 100%;
	background: #FFF;
}

#fancybox-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: 0;
	outline: none;
	overflow: hidden;
}

#fancybox-hide-sel-frame {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
}

#fancybox-close {
	position: absolute;
	top: -15px;
	right: -15px;
	width: 32px;
	height: 32px;
	background: url('/images/fancy/fancy_close.png') top left no-repeat;
	cursor: pointer;
	z-index: 1103;
	display: none;
}

#fancybox_error {
	color: #444;
	font: normal 12px/20px Arial;
}

#fancybox-content {
	height: auto;
	width: auto;
	padding: 0;
	margin: 0;
}

#fancybox-img {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	border: none;
	outline: none;
	line-height: 0;
	vertical-align: top;
	-ms-interpolation-mode: bicubic;
}

#fancybox-frame {
	position: relative;
	width: 100%;
	height: 100%;
	border: none;
	display: block;
}

#fancybox-title {
	position: absolute;
	bottom: 0;
	left: 0;
	font-family: Arial;
	font-size: 12px;
	z-index: 1102;
}

.fancybox-title-inside {
	padding: 10px 0;
	text-align: center;
	color: #333;
}

.fancybox-title-outside {
	padding-top: 5px;
	color: #FFF;
	text-align: center;
	font-weight: bold;
}

.fancybox-title-over {
	color: #FFF;
	text-align: left;
}

#fancybox-title-over {
	padding: 10px;
	background: url('/images/fancy/fancy_title_over.png');
	display: block;
}

#fancybox-title-wrap {
	display: inline-block;
}

#fancybox-title-wrap span {
	height: 32px;
	float: left;
}

#fancybox-title-left {
	padding-left: 15px;
	background: transparent url('/images/fancy/fancy_title_left.png') repeat-x;
}

#fancybox-title-main {
	font-weight: bold;
	line-height: 29px;
	background: transparent url('/images/fancy/fancy_title_main.png') repeat-x;
	color: #FFF;
}

#fancybox-title-right {
	padding-left: 15px;
	background: transparent url('/images/fancy/fancy_title_right.png') repeat-x;
}

#fancybox-left, #fancybox-right {
	position: absolute;
	bottom: 0px;
	height: 100%;
	width: 35%;
	cursor: pointer;
	outline: none;
	background-image: url('/images/fancy/blank.gif');
	z-index: 1102;
	display: none;
}

#fancybox-left {
	left: 0px;
}

#fancybox-right {
	right: 0px;
}

#fancybox-left-ico, #fancybox-right-ico {
	position: absolute;
	top: 50%;
	left: -9999px;
	width: 30px;
	height: 30px;
	margin-top: -15px;
	cursor: pointer;
	z-index: 1102;
	display: block;
}

#fancybox-left-ico {
	background: transparent url('/images/fancy/fancy_nav_left.png') no-repeat;
}

#fancybox-right-ico {
	background: transparent url('/images/fancy/fancy_nav_right.png') no-repeat;
}

#fancybox-left:hover, #fancybox-right:hover {
	visibility: visible;    /* IE6 */
}

#fancybox-left:hover span {
	left: 20px;
}

#fancybox-right:hover span {
	left: auto;
	right: 20px;
}

div.fancy-bg {
	position: absolute;
	padding: 0;
	margin: 0;
	border: 0;
	z-index: 1001;
}

div#fancy-bg-n {
	top: -20px;
	left: 0;
	width: 100%;
	height: 20px;
	background: transparent url('/images/fancy/fancy_shadow_n.png') repeat-x;
}

div#fancy-bg-ne {
	top: -20px;
	right: -20px;
	width: 20px;
	height: 20px;
	background: transparent url('/images/fancy/fancy_shadow_ne.png') no-repeat;
}

div#fancy-bg-e {
	top: 0;
	right: -20px;
	height: 100%;
	width: 20px;
	background: transparent url('/images/fancy/fancy_shadow_e.png') repeat-y;
}

div#fancy-bg-se {
	bottom: -20px;
	right: -20px;
	width: 20px;
	height: 20px;
	background: transparent url('/images/fancy/fancy_shadow_se.png') no-repeat;
}

div#fancy-bg-s {
	bottom: -20px;
	left: 0;
	width: 100%;
	height: 20px;
	background: transparent url('/images/fancy/fancy_shadow_s.png') repeat-x;
}

div#fancy-bg-sw {
	bottom: -20px;
	left: -20px;
	width: 20px;
	height: 20px;
	background: transparent url('/images/fancy/fancy_shadow_sw.png') no-repeat;
}

div#fancy-bg-w {
	top: 0;
	left: -20px;
	height: 100%;
	width: 20px;
	background: transparent url('/images/fancy/fancy_shadow_w.png') repeat-y;
}

div#fancy-bg-nw {
	top: -20px;
	left: -20px;
	width: 20px;
	height: 20px;
	background: transparent url('/images/fancy/fancy_shadow_nw.png') no-repeat;
}/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
	display:none;
    position: relative;
	width:200px;
	padding:0px 20px;
	margin-left:5px;
}

.jcarousel-clip {
	width:200px;
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 75px;
    height: 75px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
 .jcarousel-next, .jcarousel-prev
 {
 	z-index: 3;
	height:22px;
	width:22px;
	background-color:#333333;
	position:absolute;
	top:45px;
	cursor:pointer;
	visibility:visible;
 }
 
.jcarousel-next {
    right:-3px;
	background:transparent url(/images/arrow-right.png) left top no-repeat;
}

.jcarousel-prev {
	left:-3px;
	background:transparent url(/images/arrow-left.png) left top no-repeat;
}

.jcarousel-prev-disabled, .jcarousel-next-disabled
{
	visibility:hidden;
}

