@charset "utf-8";
/* --------------------------------------------------------- */
/* -- INCLUDE THE ICON FONT -------------------------------- */
@font-face {
    font-family: 'IconFont';
    src: url('/includes/font/icon/icon.eot');
    src: url('/includes/font/icon/icon.eot?#iefix') 	format('embedded-opentype'),
         url('/includes/font/icon/icon.woff') 			format('woff'),
         url('/includes/font/icon/icon.ttf') 			format('truetype'),
         url('/includes/font/icon/icon.svg#icon')	 	format('svg');
    font-weight:	normal;
    font-style: 	normal;
}

/* --------------------------------------------------------- */
/* -- ELEMENT RESET ---------------------------------------- */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 			0;
  padding: 			0;
  border:			0;
  font-size: 		100%;
  font: 			inherit;
  vertical-align: 	baseline;
}

/* --------------------------------------------------------- */
/* -- BODY ------------------------------------------------- */
html {
	width: 				100%;
	height:				100%;
	overflow-y: 		scroll;
}

body {
	background-color: 	#fff;
	font-family: 		Arial, Helvetica, sans-serif;
	font-size: 			14px;
	background-color: 	#fff;
}

a {
	color: 				#ce212b;
}

a:focus, a:hover, a:active {
	outline:			none;
}

*:focus {
    outline: 			0;
}

::-webkit-input-placeholder {
   color: 				#999;
}

::-moz-input-placeholder {
   color: 				#999;
}

:-ms-input-placeholder {
   color: 				#999;
}

strong {
	font-weight: 		bold;
}

em {
	font-style: 		italic;
}


/* --------------------------------------------------------- */
/* -- CLEARFIX --------------------------------------------- */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/* --------------------------------------------------------- */
/* -- SHARED ELEMENTS -------------------------------------- */
.container {
	width: 				1046px;
	margin: 			0px auto;
}

.container-main {
	margin-bottom: 		80px;
}

.column-full {

}

.column-main {
	float: 				left;
	width: 				731px;
}

.column-side {
	float: 				left;
	margin-left: 		15px;
	width: 				300px;
}

section {
	margin-top: 		15px;
}

.column-main section img {
	display: 			block;
	width: 				100%;
}

/* --------------------------------------------------------- */
/* -- HEADER ----------------------------------------------- */
header {
	margin-top: 		30px;
	margin-bottom: 		15px;
}

.header-logo {
	float: 				left;
}

.header-right {
	float: 				left;
	margin-left: 		15px;
	width: 				718px;
	line-height: 		30px;
	text-align: 		left;
}

.header-social {
	float: 				right;
	width: 				50%;
	line-height: 		30px;
	text-align: 		right;
}


/* --------------------------------------------------------- */
/* -- HEADERS ---------------------------------------------- */
h1 {
	margin: 			0px;
	padding: 			5px 10px;
	font-weight: 		bold;
	font-size:			2rem;
	line-height: 		36px;
	color: 				#000;
}

h1.header-channel {
	background-color: 	#ce212b;
	color: 				#fff;
}

h1.header-product {
	margin-top: 		15px;
	margin-bottom: 		15px;
}

h2 {
	margin: 			10px 0px;
	padding: 			5px 10px;
	background-color: 	#ce212b;
	color: 				#fff;
	font-size:			1.2rem;
	font-weight: 		bold;
	line-height: 		1.2rem;
	color: 				#fff;
	text-transform:		uppercase;
}

h2.homepage-callout {
	margin-top: 		0px;
	padding: 			10px 0px;
	font-size: 			1.5rem;
	text-align: 		center;
}

h2.homepage-callout a {
	display: 			block;
	color: 				#fff;
	text-decoration: 	none;
}

h2.homepage-callout a:hover {
	color: 				#000;
}

/* --------------------------------------------------------- */
/* -- MENU ------------------------------------------------- */
nav {
	display: 			block;
	width: 				100%;
	background-color: 	#000;
}

nav ul {
	list-style-type: 	none;
	text-align: 		center;
}

nav ul li {
	display: 			inline-block;
}

nav ul li a {
	display: 			block;
	padding: 			0px 8px;
	color: 				#fff;
	font-size: 			15px;
	line-height: 		27px;
	font-weight: 		bold;
	text-decoration: 	none;
	text-transform: 	uppercase;
}

nav ul li a:hover {
	color: 				#ce212b;
}


/* --------------------------------------------------------- */
/* -- FONT ICONS ------------------------------------------- */
[class^="icon-"]:before, [class*=" icon-"]:before {
  	font-family: 		"IconFont";
  	font-style: 		normal;
  	font-weight: 		normal;
  	speak: 				none;
  	display: 			inline-block;
  	text-decoration: 	inherit;
  	width: 				1em;
  	margin-right: 		.2em;
  	text-align: 		center;
  	font-variant: 		normal;
  	text-transform: 	none;
  	line-height: 		1em;
  	margin-left: 		.2em;
}

.icon-facebook:before { content: '\e800'; } /* '' */
.icon-twitter:before { content: '\e801'; } /* '' */
.icon-youtube:before { content: '\e802'; } /* '' */
.icon-instagram:before { content: '\e803'; } /* '' */
.icon-mail:before { content: '\e804'; } /* '' */
.icon-up-big:before { content: '\e805'; } /* '' */
.icon-left-big:before { content: '\e806'; } /* '' */
.icon-search:before { content: '\e807'; } /* '' */
.icon-zoom-in:before { content: '\e808'; } /* '' */
.icon-menu:before { content: '\e809'; } /* '' */
.icon-user:before { content: '\e80a'; } /* '' */
.icon-cart:before { content: '\e80b'; } /* '' */
.icon-left-open-big:before { content: '\e80c'; } /* '' */
.icon-right-open-big:before { content: '\e80d'; }

.icon-cart {
	position: 				relative;
}

.icon-cart span {
	position: 				absolute;
	display: 				inline-block;
	width: 					20px;
	height: 				20px;
	top: 					-5px;
	right:					-15px;
	border-radius: 			50%;
	font-size: 				10px;
	line-height: 			20px;
	background-color: 		#ce212b;
	color: 					#fff;
	text-align: 			center;
}

/* --------------------------------------------------------- */
/* -- SOCIAL MEDIA ICONS HEADER ---------------------------- */
.social-media {
	text-align: 			right;
}

a.social-media-icon {
	display: 				inline-block;
	margin-right: 			5px;
	width: 					26px;
	height: 				21px;
	color: 					#333;
	text-decoration: 		none;
	font-size: 				21px;
}

a.social-media-icon:hover {
	color: 					#ce212b;
}

a.social-media-icon.icon-twitter {
	margin-right: 			0px;
}

a.social-media-icon.icon-facebook {
	margin-right: 			0px;
}


/* --------------------------------------------------------- */
/* -- SEARCH FORM ------------------------------------------ */
.search {
	background-color: 			#000;
	padding: 					10px;
}

.search h1 {
	color: 						#fff;
}

.search form {
	float: 						right;
	margin-top: 				8px;
	margin-right: 				5px;
	padding: 					0px;
}

.search form input {
	display: 					inline-block;
	width: 						350px;
	border: 					0px;
	background-color: 			#666666;
	padding: 					5px 10px;
	color: 						#fff;
	line-height:				24px;
	font-size: 					18px;
	vertical-align: 			top;
}

.search form input[type=submit] {
	background-color: 			#333333;
	font-size: 					24px;
	line-height:				24px;
	width: 						auto;
	cursor: 					pointer;
}




/* --------------------------------------------------------- */
/* -- ADVERTISING ------------------------------------------ */
#cmn_wrap {
	margin: 				0 auto;
}

#cmn_ad_tag_head, #cmn_ad_tag_head div, #cmn_ad_tag_head table, #cmn_ad_tag_head table td, #cmn_ad_tag_head table img #cmn_ad_tag_head img, {
	margin: 				0 auto;
	text-align: 			center !important;
}

.fw_vladtv {
	margin:					70px auto 10px auto !important;
	max-width: 				1026px;
	min-height: 			90px;
	line-height: 			0px;
	text-align: 			center !important;
}

.ad-content {
	margin-top: 			20px;
	margin-left: 			50px;
	text-align: 			center;
	line-height: 			0px;
}

.ad-300 {
	min-height: 			250px;
	text-align: 			center;
	line-height: 			0px;
	background-color: 		#EAEAEA;
}


/* --------------------------------------------------------- */
/* -- VIDEO EMBED ------------------------------------------ */
.video-iframe {
    position: 			relative;
	margin: 			0px;
	padding-bottom: 	56.25%; /* 16/9 ratio */
    height: 			0;
	background-color: 	#000;
    overflow: 			hidden;
}

.video-iframe iframe {
    position: 			absolute;
    top: 				0;
    left: 				0;
    width: 				100%;
    height: 			100%;
}

/* --------------------------------------------------------- */
/* -- HOMEPAGE PRODUCT ------------------------------------- */
.homepage-product {
	margin-bottom: 		21px;
}

.homepage-product img {
	float: 				left;
	margin-right: 		15px;
	width: 				120px;
	height: 			67px;
}

.homepage-product-title {
	padding: 			5px 0px 0px 0px;
	color: 				#000;
	text-decoration: 	none;
	font-weight: 		bold;
}

.homepage-product-price {
	color: 				#ce212b;
}

/* --------------------------------------------------------- */
/* -- CONTENT LOADER --------------------------------------- */
.loader {
	margin: 			30px 0px;
}

.loader #button-load {
	display: 			block;
	margin: 			5px auto;
	max-width: 			300px;
	border: 			2px solid #000;
	border-radius: 		3px;
	padding: 			15px 0px;
	text-align: 		center;
	font-size: 			1.2rem;
	font-weight: 		bold;
	text-decoration: 	none;
	text-transform: 	uppercase;
	color: 				#000;
	transition: 		0.2s ease-in-out;
}

.loader #button-load:hover {
	border: 			2px solid #666;
	color: 				#666;
}

#button-load.button-animated {
	max-width: 			150px;
}



/* --------------------------------------------------------- */
/* -- CHANNEL ENTRY ---------------------------------------- */
.entry {
	position: 			relative;
	float: 				left;
	margin: 			30px 28px 0px 0px;
	width: 				240px;
	height: 			240px;
	color: 				#fff;
	text-align: 		center;
	font-size: 			1.1rem;
}

.entry a {
	text-decoration: 	none;
}

.entry.entry-pos-2, .entry.entry-pos-3  {
	margin-right: 		29px;
}

.entry.entry-pos-4 {
	margin-right: 		0px;
}

.entry img {
	display: 			block;
	width: 				100%;
	height: 			100%;
}

.entry-rollover {
	display: 			none;
	position: 			absolute;
	width: 				100%;
	height: 			100%;
	background-color: 	rgba(0,0,0,0.5);
}

.entry:hover .entry-rollover {
	display: 			block;
}

.entry-rollover a {
	display: 			block;
	width: 				100%;
	height: 			100%;
	color: 				#fff;
}

.entry-rollover .entry-social {
	position: 			absolute;
	top: 				80px;
	width: 				100%;
	z-index: 			100;
}

.entry-rollover .sharing-buttons {
	list-style-type:   	none;
	position: 			absolute;
	top: 				115px;
	width: 				100%;
	z-index: 			100;
}

.sharing-buttons li {
	display: 			inline-block;
}

.sharing-buttons li a {
	color: 				#fff;
	font-size: 			1.5rem;
}

.entry-title {
	position: 			absolute;
	bottom: 			5px;
	width: 				100%;
}




/* --------------------------------------------------------- */
/* -- HOMEPAGE SPOTLIGHT ----------------------------------- */
.entry-spotlight {
	position: 			relative;
	float: 				left;
	margin: 			10px 0px 10px 0px;
	width: 				320px;
	color: 				#fff;
	text-align: 		center;
}

.entry-spotlight img {
	margin-bottom: 		5px;
	width: 				320px;
	height: 			320px;
}

.entry-spotlight.entry-pos-2  {
	margin: 			10px 42px 10px 42px;
}

.entry-spotlight-type {
	background-color:  	#ce212b;
	padding: 			5px;
	font-size: 			1.2rem;
	color: 				#fff;
	text-align: 		center;
}

.entry-spotlight-title {
	text-align: 		center;
	font-size: 			1.2rem;
}

.entry-spotlight-title a {
	display: 			block;
	color: 				#000;
	text-decoration: 	none;
}


/* --------------------------------------------------------- */
/* -- PRODUCT ENTRY ---------------------------------------- */
.entry-product {
	width: 				240px;
	height: 			170px;
}

.entry-product img {
	width: 				240px;
	height: 			119px;
}

.entry-product-title {
	padding: 			5px 0px;
	font-size: 			1.0rem;
	color: 				#000;
	text-decoration: 	none;
}

.entry-product-price {
	font-size: 			0.8rem;
	color: 				#ce212b;
}


/* --------------------------------------------------------- */
/* -- DETAIL ARTICLE --------------------------------------- */
article {
	float: 				left;
	width: 				620px;
}

.column-side h1 {
	margin-top: 		10px;
	background-color: 	#ce212b;
	color: 				#fff;
	font-size: 			1.5rem;
	line-height:		1.5rem;
}

.article-meta {
	margin-top: 		5px;
	padding: 			5px 10px;
	background-color: 	#000;
	color: 				#fff;
}

.article-media {
	margin-top: 		10px;
	background-color: 	#dd;
}

.article-body {
	margin: 			10px;
}

.article-body p {
	margin-bottom:		10px;
}

.article-media img {
	max-width: 			100%;
	width: 				100%;
	height: 			auto;
}

.article-comments {
	margin-top: 		15px;
}

article.cut-gallery {
	float: 				none;
	width: 				100%;
}

article.cut-gallery img {
	display: 			block;
	margin: 			0px auto;
	max-width: 			640px;
}

aside.cut-gallery {
	float: 				none;
}


/* --------------------------------------------------------- */
/* -- PRODUCT DETAIL --------------------------------------- */
article.product {
	float: 				left;
	width: 				620px;
}

article.product h1 {
	margin-top: 		15px;
	color: 				#000;
}

article.product .article-date {
	margin-top: 		5px;
}

article.product .article-media {
	margin-top: 		15px;
}

article.product img {
	max-width: 			620px;
}

aside.product {
	float: 				left;
	margin-top: 		15px;
	box-sizing:			border-box;
	width: 				426px;
	padding-left: 		30px;
}

.product-description {
	text-align: 		justify;
	font-size: 			1.2rem;
	line-height: 		1.8rem;
}

.product-purchase {
	margin-top: 		60px;
}

.product-shipping {
	margin-top: 		30px;
	font-style: 		italic;
	color: 				#333;
}

.form-product {
	margin: 			15px 0px;
}

.form-product input[type=submit] {
	border: 			none;
	background-color: 	#ce212b;
	padding: 			10px;
	font-size: 			1.2rem;
	color: 				#fff;
	cursor: 			pointer;
}

.form-product select {
	margin-bottom: 		15px;
	border: 			1px solid #CCC;
	padding: 			8px;
	font-size: 			1.2rem;
	color: 				#333;
	cursor: 			pointer;
}


/* --------------------------------------------------------- */
/* -- SHOPPING CART ---------------------------------------- */
#table-cart {
	margin-top: 		30px;
	width: 				100%;
	border-collapse:	collapse;
}

#table-cart th {
	border: 			1px solid #999;
	padding: 			5px;
	background-color: 	#CCC;
}

#table-cart td {
	border: 			1px solid #999;
	padding: 			5px;
}

#table-cart td.cart-quan {
	text-align: 		center;
}

#table-cart td.cart-price {
	text-align: 		right;
}

#table-cart td img {
	width: 				75px;
	height: 			auto;
}

.cart-area {
	margin-top: 		30px;
	text-align: 		right;
}

/* --------------------------------------------------------- */
/* -- USER SECTION ----------------------------------------- */
.table-user {
	margin-top: 		15px;
	width: 				100%;
	border-collapse:	collapse;
}

.table-user th {
	border: 			1px solid #999;
	padding: 			5px;
	background-color: 	#CCC;
}

.table-user td {
	border: 			1px solid #999;
	padding: 			5px;
}

.table-user td img {
	width: 				75px;
	height: 			75px;
}


/* --------------------------------------------------------- */
/* -- GALLERY ---------------------------------------------- */
.gallery {
	position: 			relative;
	margin: 			0px auto;
	width: 				620px;
	height: 			620px;
	background-color: 	#000;
	overflow: 			hidden;
}

.gallery ul {
	list-style-type: 	none;
	margin:			 	0;
	height: 			620px;
	padding: 			0;
	transition:			all 250ms ease-in-out;
}

.gallery ul li {
	position: 			relative;
	display: flex; /* add */
    justify-content: center; /* add to align horizontal */
    align-items: center; /* add to align vertical */
	float: 				left;
	margin: 			0;
	width: 				620px;
	height: 			620px;
	padding: 			0;
	transform: 			translateZ(0);
}

.gallery-product, .gallery-product ul li {
	height: 			347px;
}

.gallery ul li a {
	text-decoration: 	none;
	color: 				#fff;
}

.gallery ul li > img {
	display: 			block;
	margin: 			auto auto;
	border: 			none;
	max-height:			100%;
	width: 				auto;
	max-width: 			100%;
	height: 			auto;
}

.gallery-title {
	position: 			absolute;
	left: 				0;
	bottom: 			0;
	z-index: 			101;
	height: 			auto;
	padding: 			25px 10px 5px 10px;
	background:			linear-gradient(0deg, rgba(0,0,0,0.85) 45%, rgba(0,0,0,0.0));
	font-size:			18px;
	line-height: 		20px;
}

/* --------------------------------------------------------- */
/* -- GALLERY NAV/OVERLAY ---------------------------------- */
.gallery-arrow {
	display: 			block;
	position: 			absolute;
	top: 				50%;
	z-index: 			10001;
	margin-top: 		-10px;
	width: 				30px;
	height: 			20px;
	background: 		rgba(0,0,0,0.5);
	padding: 			10px 0px;
	font-size: 			20px;
	line-height: 		20px;
	color: 				#FFF;
	cursor: 			pointer;
	text-decoration: 	none;
	text-shadow: 		1px 1px 3px #000;
}

.gallery-arrow-prev {
	display: 					none;
	left: 						0px;
	border-top-right-radius: 	2px;
	border-bottom-right-radius: 2px;
}

.gallery-arrow-next {
	right: 						0px;
	border-top-left-radius: 	2px;
	border-bottom-left-radius: 	2px;
}

#gallery-counter {
	position: 			absolute;
	top: 				0px;
	right: 				0px;
	z-index: 			510;
	width: 				60px;
	display: 			block;
	background-color: 	rgba(0, 0, 0, 0.45);
	padding: 			4px 0px;
	color: 				#fff;
	text-align: 		center;
}

/* --------------------------------------------------------- */
/* -- OVERLAY GALLERY -------------------------------------- */
#gallery-overlay {
	display: 			none;
	position: 			fixed;
	left:				0;
	top: 				0;
	z-index: 			200001;
	width: 				100%;
	height: 			100%;
	background: 		rgba(255, 255, 255, 0.75);
}

.gallery-overlay-box {
	position: 			relative;
	width: 				950px;
	height: 			650px;
	border-radius: 		10px;
	border: 			1px solid #EAEAEA;
	box-shadow:			1px 1px 3px 2px rgba(0,0,0,0.3);
	background-color: 	#fff;
	padding: 			5px 0px 0px 15px;
}

#gallery-close {
	position: 			absolute;
	display: 			block;
	top: 				-30px;
	right: 				-30px;
	width: 				40px;
	height: 			40px;
	background-color: 	#000;
	border-radius: 		50%;
	font-size:			30px;
	line-height: 		40px;
	text-align: 		center;
	text-decoration: 	none;
	color: 				#CCC;
}




/* --------------------------------------------------------- */
/* -- PAGE LAYOUT ------------------------------------------ */
#content p {
	margin-top: 		15px;
	line-height: 		1.5rem;
}

/* --------------------------------------------------------- */
/* -- USER FORMS ------------------------------------------- */
.form-user {
	margin: 			15px;

}

.form-user p {
	clear: 				both;
	margin: 			15px 0px;
}

.form-user p label {
	float: 				left;
	width: 				130px;
	line-height: 		1.6rem;
	font-size: 			1.2rem;
}

.form-user input, .form-user select {
	border: 			1px solid #666;
	border-radius: 		3px;
	padding: 			3px 5px;
	font-size: 			1.2rem;
}

.form-user input[type=submit] {
	border: 			0px;
	background-color: 	#ce212b;
	cursor: 			pointer;
	color: 				#fff;
}

.error {
	margin: 			15px 0px;
	background-color: 	#ce212b;
	border-radius: 		5px;
	padding: 			10px;
	font-weight: 		bold;
	color: 				#fff;
}


.nav-pages ul {
	list-style: 		none;
	margin-left: 		10px;
}

.nav-pages ul li {
	margin: 			10px 0px;
	font-size: 			1.1rem;
}

.nav-pages ul li a {
	display: 			block;
	text-decoration: 	none;
	color: 				#000;
}

.nav-pages ul li a:hover {
	color: 				#ce212b;
}


/* --------------------------------------------------------- */
/* -- SHOP SEARCH DISPLAY ---------------------------------- */
.entry-shop {
	margin-bottom: 		15px;
	border-bottom: 		1px solid #CCC;
	padding-bottom: 	15px;
}

.entry-shop img, .image-none {
	float: 				left;
	width: 				200px;
	height: 			200px;
	background-color: 	#000;
}

.shop-text {
	float: 				left;
	margin-left: 		15px;
	line-height: 		1.2rem;
}

.shop-text h3 {
	margin: 			15px 0px;
	font-size: 			1.5rem;
}