*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
.clear:before, .clear:after {content:' '; display:table;}
.clear:after {clear:both;}
.clear {*zoom:1;}

body {font-family: Arial; color:#2e3031; background:#f2f2f2; }
a { text-decoration:none; }

input, textarea {
	margin:2px;
	padding:5px;
	display:inline-block;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border:none;
	font-size:15px;
	border: 1px solid #ececec;
}

textarea {
	margin:0px;
	min-height:120px;
}

input:focus, textarea:focus {
	border: 1px solid #E8BB43;
	outline: none;
}

#PageContent {
	text-align:center; 
	overflow:auto; 
	position:absolute;
	top:0px; 
	left:0px; 
	height:100%; 
	width:100%;
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
}

#AlertContainer, #subAlertContainer {
	display:block; 
	visibility:hidden; 
	background:none;
	overflow:auto;
	position:absolute; 
	height:100%; 
	width:100%; 
	top:0px; 
	left:0px;	
}
#AlertBg, #subAlertBg {
	position:absolute; 
	height:100%; 
	width:100%; 
	background:#000; 
	opacity: 0.5; 
	filter: alpha(opacity=50);
}
#AlertMsn, #subAlertMsn {
	position:absolute; 
	max-height:99%;
	overflow:auto;
	-webkit-box-shadow: 4px 3px 26px -5px rgba(0,0,0,0.48);
	-moz-box-shadow: 4px 3px 26px -5px rgba(0,0,0,0.48);
	box-shadow: 4px 3px 26px -5px rgba(0,0,0,0.48);
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	-webkit-transition: all .3s;
	display:inline-block;
}
#AlertClose, #subAlertClose {
	width:30px;
	height:30px;
	position:absolute;
	cursor: pointer;
	color:#FFF;
	background:#FE330A;
	padding:5px;
	 border-radius:20px;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	font-weight:bold;
	display:block; 
	visibility:hidden;
}
#AlertClose:hover, #subAlertClose:hover { color:#FE330A; background:#FFF; }

.IDError, .AlertERROR {color:red;}

.cwhite { background:white; } .cwhite_h:hover { background:white; }
.cgrey { background:#2e3031; }
.clightgrey { background:#f2f2f2; }
.clightgreyx2 { background:#d9d9d9; }
.cyellow { background:#E8BB43; }
.cred { background:#be0811; }
.cblue { background:#003b85; }

.twhite {color:white; fill:white;}
.tblack {color:black;}
.tred {color:#be0811;}
.tblue {color:#003b85;}
.tgray {color:#8c8c8c; fill:#8c8c8c;}
.tyellow {color:#E8BB43;  fill:#E8BB43;} .tyellow_h:hover { color:#E8BB43;  fill:#E8BB43; }
.tbold {font-weight:bold;}

.flex{display:flex;}
.flexcol { flex:1; }
.flexcol2 { flex:2; }
.flexcenter{ display:flex; align-items: center; align-content: center; justify-content: center;}
.flexrowcol{ flex-direction: row;}
.flexab2in{ justify-content: space-between;}
.inline { display:inline-block; }
.block { display:block; }
.padding5 { padding:5px; }
.padding10 { padding:10px; }
.padding20 { padding:20px; }
.margin2 {margin:2px;}
.margin5 {margin:5px;}
.margin10 {margin:10px;}
.vAlignMiddle { vertical-align:middle; }
.vAlignTop { vertical-align:top; }
.posRight { float:right; }
.posLeft { float:left; }
.posRelative { position:relative; }
.posAbsolute { position:absolute; }
.posFixed { position:fixed; }
.aCenter { text-align:center; }
.aLeft { text-align:left; }
.aJustify {text-align:justify;}
.aRight {text-align:right;}

.fsize10 {font-size:10px;}
.fsize12 {font-size:12px;}
.fsize14 {font-size:14px;}
.fsize16 {font-size:16px;}
.fsize20 {font-size:20px;}
.fsize1_5 {font-size: 1.5rem; line-height: 1.25;}

.columnHalf {width:49%;}
.columnDouble {width:67%;}
.columnQuad {width:32.8%;}

.w20 {width:20px;}
.w40 {width:40px;}
.w80 {width:80px;}
.w120 {width:120px;}
.w300 {width:300px;}
.h250 {height:250px;}
.h300 {height:300px;}
.w100Full {width:100%}
.w100Max {max-width:100%}
.w300Min {min-width:310px;}
.w300Max {max-width:310px;}
.w480Max {max-width:480px;}
.w960Max {max-width:960px;}

.mLeft20 {margin-left:20px;}
.pLeft20 {padding-left:20px;}
.pTop10 {padding-top:10px;}
.pTop30 {padding-top:30px;}
.pLeft30 {padding-left:30px;}
.pRight30 {padding-right:30px;}

.border {border:1px solid #c1c1c1;}
.borderl {border-left:1px solid #c1c1c1;}
.borderb {border-bottom:1px solid #c1c1c1;}
.round10 { border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; }
.round30 { border-radius:30px; -moz-border-radius:30px; -webkit-border-radius:30px; }
.round320 { border-radius:320px; -moz-border-radius:320px; -webkit-border-radius:320px; }
.borderd {border:3px dashed #ececec;}
.select {cursor:pointer;}

.overflowh {overflow:hidden;}

.on:hover {
	color:#FFF;
	background:#E8BB43;
	fill:#FFF;
	
	-moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
}

.ongrey:hover {
	background:#ececec;
}

.animall {
	-moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
}

.overshadow {
	-webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
	-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
	box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
	
	-moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
}
.overshadow:hover, .overshadowsel{
	-webkit-box-shadow: 2px 10px 10px -10px rgba(0,0,0,0.6);
	-moz-box-shadow: 2px 10px 10px -10px rgba(0,0,0,0.6);
	box-shadow: 2px 10px 10px -10px rgba(0,0,0,0.6);
	
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}

.nobreak {white-space:nowrap; overflow:auto;}
.normalbreak {white-space:normal;}
.asmouse {cursor:pointer;}
.noselect {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}

span.icon{
	display:inline-block;
	vertical-align:middle;
}

.MiddleContent { text-align:center;	}

.menuButton, .categoryButton, .categoryButton span.icon, .footerButton {
	-moz-transition: all .2s;
    -ms-transition: all .2s;
    -o-transition: all .2s;
    -webkit-transition: all .2s;
	color:white;
	text-transform:uppercase;
	font-size: 0.9em;
	font-weight: 700;
}
.menuButton {
	padding:15px;
	margin:2px;
	height:47px;
	position:relative;
}
.menuButton:hover, .menuButton.select {
	border-top:3px solid #FFF;
}

.menuButton span.number{
	display:inline-block;
	position:absolute;
	background:red;
	border-radius:20px;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	padding:3px;
	top:25px;
	right:5px;
	margin:0px;
}
.menuButton:hover span.number{
	background:white;
}

.socialButtom {
	-moz-transition: all .2s;
    -ms-transition: all .2s;
    -o-transition: all .2s;
    -webkit-transition: all .2s;
	width: 25px;
    margin: 3px;
    fill: #fff;
	color: #fff;
}

.socialButtom:hover {
	color:#be0811;
	fill:#be0811;
}

.m-compact {
	background:#f3f3f3;
	color:#2e3031;
	height:auto;
	display:inline-block;
	padding:10px;
}

.footerButton {
	display:block;
	text-align:left;
	padding:10px;
	border-left:1px solid;
}

.footerButton:hover, .footerButton.select {
	background:#be0811;
	margin-left:2px;
}

.categoryButton {
	font-size:18px;
	font-weight:bold;
	width:250px;
	text-align:center;
	display:inline-block;
	padding:20px;
	vertical-align:top;
}
.categoryButton span.icon{
	border-radius:100px;
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	margin-bottom:15px;
}
.categoryButton:hover {
	padding-top:30px;
	color:#98d9ff;
}
.categoryButton:hover span.icon {
	margin-bottom:5px;
}

.normalButton{
	color:#003b85;
	letter-spacing:0px;
	font-size:15px;
}
.normalButton:hover, .normalButton.select{
	color:#be0811;
}

.normalButton.fsize{
	font-size:10px;
}

.title, .sub_title_w, .sub_title_b{
	text-transform:uppercase;
	font-weight: 800;
	letter-spacing:-1px;
	text-align:center;
	font-size:calc(0.6em + 3vw);
	padding:30px;
	line-height:0.8;
}
.title div:first-child {
	font-size: calc(0.2em + 3vw);
	font-weight:normal;
}

.sub_title_w, .sub_title_b {
	text-align:left;
	font-size:20px;
	padding:5px;
}

.main_banner {
	width:100%;
	text-align:center;
	overflow:hidden;
	position:relative;
}
.main_banner img {
	max-width:100%;
	min-width:500px;
}
.main_banner div.title{
	position:absolute;
	top:40%;
	width:100%;
}

.footer {
	perspective:2px;
	position:relative;
	background: url(images/bg_footer.jpg) no-repeat fixed #be0811;
}

.pageClass {list-style: none; text-align:left; display:inline-block; padding:5px;}
.pageClass h2 {font-size:14px; font-weight:normal;}
.pageClass li {display:inline-block; vertical-align:middle;}
.pageClass a, .pageClass a.select{padding:5px; border: 1px solid #d8d9db; margin:1px; color: #808285; background: #E8E8E8;}
.pageClass a:hover, .pageClass a.select, .pageClass a.select:hover{color:#000;}

.mq_sview, .chide {
	display:none;
	visibility:hidden;
}

.mq_mview {
	display:inline-block;
	visibility:visible;
}

.mq_mview_flex {
	display:flex;
	visibility:visible;
}

.mq_mainmenu, .mq_mainmenuout {
	 background: rgba(0, 0, 0, 0.8);
	white-space:normal;
	position:fixed;
	z-index:2;
	top:0;
	right:0;
	padding:30px;
	height:100%;
	-webkit-animation-name: mainmenuin;
	animation-name: mainmenuin;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
}

.mq_mainmenuout {
	-webkit-animation-name: mainmenuout;
	animation-name: mainmenuout;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;	
}

.animLeft {
	-webkit-animation-name:InLeft;
	animation-name:InLeft;
	-webkit-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both;
}

.animLeftN {
	-webkit-animation-name:OutLeft;
	animation-name:OutLeft;
	-webkit-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both;
}

.mq_mainmenuout a.menuButton, .mq_mainmenu a.menuButton {
	display:block;
	padding-top:20px;
	height:auto;
	text-align:right;
}

.img_product {
	width:600px;
	height:auto;
	overflow:hidden;
	display:inline-block;
	position:relative;
}

.shadow {box-shadow:1px 1px 10px rgba(0, 0, 0, 0.3);}
.tshadow {text-shadow:0 6px 6px rgba(0, 0, 0, 0.2), 0 3px 2px rgba(0, 0, 0, 0.1);}

.control{
	position:absolute;
	top:50%;
	padding:8px;
	background:#fff;
	border-radius:20px;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;	
	margin-top:-20px;
	box-shadow:1px 1px 10px rgba(0, 0, 0, 0.3);
	z-index:2;
}
.prev, .next{ color:#000; font-size:18px; }
.prev{ left:10px; }
.next{ right:10px; }
.prev:active, .next:active{ transform: scale(0.8); }
.close{
	top:-2px; 
	right:-2px;
	border-radius:20px;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;	
}

.backbg {
	position:fixed;
	width:100%;
	height:100%;
	background:#000;
	opacity: 0.7; 
	filter: alpha(opacity=70);
	top:0;
	left:0;
	bottom:0;
	right:0;
	display:none;
	z-index:3;
}
.backcont {
	position:fixed;
	width:100%;
	height:100%;
	top:0;
	left:0;
	bottom:0;
	right:0;
	display:none;
	overflow:scroll;
	z-index:4;
}

.box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.inputClass{
	margin:3px;
	padding:10px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	background:#fff;
}

.inputClass[type="button"], .inputClass[type="submit"], .inputClass[type="checkbox"]  {
	background:#E8BB43;
	color:#FFF;
	padding:10px; padding-left:30px; padding-right:30px;
	border:1px solid;

	-moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
}

.inputClass[type="button"]:hover, .inputClass[type="submit"]:hover, .inputClass[type="checkbox"]:hover  {
	background:#FFF;
	color:#E8BB43;
	
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}

.inputClass[type="checkbox"]  {
	border: 1px solid #ff017c;
	display:inline-block;
}

textarea.inputClass {
	height:200px;
}

.labelClass{
	width:120px;
	padding:5px;
	display:inline-block;
	vertical-align:top;	
	text-align:right;
}

.editor {
	padding:5px;
}
.editor div.header {
	border:1px solid #E5E5E5;
	background:#F9F9F9;
	padding:3px;
	color:#000;
	text-align:left;
}
.editor div.header span.control {
	position:relative;
	background:url(images/editor.png);
	display:inline-block;
	width:28px;
	height:28px;
	cursor:pointer;
	vertical-align:middle;

	border-radius:0px;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	box-shadow:none;
}
.editor div.header span.control:hover {
	background-color:#E5E5E5;
	text-decoration: none;
}
.editor div.header span.space {
	display:inline-block;
	background:#E5E5E5;
	width:1px;
	height:28px;
	margin-left:1px;
	margin-right:1px;
}
.editor div.header div.info {
	border-top:1px solid #E5E5E5;
	margin-top:5px;
}
.emoji{ 
	background:url(images/editor.png); 
	width:28px;
	height:28px; 
	display:inline-block; 
	border:none; 
	margin:0;
	padding:0; 
	vertical-align:middle; 
}
.editor .body {
	border:1px solid #E5E5E5;
	background:#FFF;
	color:#000;
	
	width:100%;
	height:300px;
	
	resize:vertical;
}

.calendar-box {
	background:#ebebeb;
	border:1px solid #b6b1b1;
	margin:2px;
	padding:2px;
	text-align:center;
	position:absolute;
	z-index:100;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
	.calendar-box table {
		width:100%;
	}
	
	.calendar-title select {
		display: inline-block;
		vertical-align: middle;
		margin: 2px;
	}
	
	tr.calendar-header td {
		color:#000;
		font-size:11px;
	}
	
	.calendar-days {
		padding:5px;
	}
	
	.calendar-days a{
		color:#666565;
		text-decoration: none;
		padding:5px;		
		border-radius:200px;
		-moz-border-radius:200px;
		-webkit-border-radius:200px;
	}
	
	.calendar-days.today  a{
		color:#000;
		font-weight:bold;
		border: 1px solid #000;
	}
	
	.calendar-days a:hover, .calendar-days.selected  a, .calendar-days.selected  a:hover{
		color:#FFF;
		font-weight:bold;
		background:#000;		
	}
	
	.calendar-cancel {
		border:1px solid #000;
		padding:5px;
		background:#000;
		color:#FFF;
		font-weight:bold;
		-moz-transition: all .3s;
		-ms-transition: all .3s;
		-o-transition: all .3s;
		-webkit-transition: all .3s;
	}
	.calendar-cancel:hover {
		background:#FFF;
		color:#000;
		border:1px solid #FFF;
		border-bottom-color:#000;
		text-decoration: none;
	}
	
.ccbgyellow { background:#f9d759 }
.ccbgpurple { background:#c595e9; }
.ccbgpink { background:#f19ad2; }
.ccbgblue { background:#84b9e7; }

/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

@media only screen and (min-width:320px) {
	.columnHalf, .columnQuad, .columnDouble {width:99%;} 
	.mq_sview {display:inline-block; visibility:visible;} 
	.mq_mview_flex,.mq_mview {display:none; visibility:hidden;}
	.main_banner div.title {top:20%;}
	.img_product {width:100%;}
	.flexrowcol{flex-direction: column;}
	
	.title, .sub_title_w, .sub_title_b{ font-size:calc(0.6em + 6vw);}
	.title div:first-child {font-size: calc(0.2em + 6vw);}
}

@media only screen and (min-width:480px) { 
	.columnHalf, .columnQuad, .columnDouble {width:99%;} 
	.mq_sview {display:inline-block; visibility:visible;} 
	.mq_mview_flex,.mq_mview {display:none; visibility:hidden;}
	.main_banner div.title {top:20%;}
	.img_product {width:100%;}
	.flexrowcol{flex-direction: column;}
	
	.title, .sub_title_w, .sub_title_b{ font-size:calc(0.6em + 4vw);}
	.title div:first-child {font-size: calc(0.2em + 4vw);}
}

@media only screen and (min-width:768px) { 
	.columnHalf {width:49%;} 
	.columnDouble {width:67%;} 
	.columnQuad {width:32.8%;} 
	.mq_sview {display:inline-block; visibility:visible;} 
	.mq_mview_flex, .mq_mview {display:none; visibility:hidden;}
	.main_banner div.title {top:30%;}
	.img_product {width:49.9%;}
	.flexrowcol{flex-direction: row;}
	
	.title, .sub_title_w, .sub_title_b{ font-size:calc(0.6em + 3vw);}
	.title div:first-child {font-size: calc(0.2em + 3vw);}
}

@media only screen and (min-width:1024px) {
	.mq_mview {display:inline-block; visibility:visible;} 
	.mq_mview_flex {display:flex; visibility:visible;} 
	.mq_sview {display:none; visibility:hidden;}
	.main_banner div.title {top:40%;}
	.img_product {width:49.9%;}
}

@media only screen and (min-width:1140px) {  .img_product {width:49.9%;}  }

@media only screen and (min-width:1280px) {  .img_product {width:600px;} }

@media only screen and (-webkit-min-device-pixel-ratio:1.5),
	   only screen and (min-resolution:144dpi) {}
	   
@-webkit-keyframes InLeft{ 0%{ opacity: 1; margin-left:0;} 100%{opacity:0; margin-left:-295px;}}  
@keyframes InLeft{ 0%{opacity: 1; margin-left:0;} 100%{opacity:0; margin-left:-295px;}}
@-webkit-keyframes OutLeft{	0%{opacity: 0; margin-left:-295px;} 100%{opacity:1; margin-left:0;}}
@keyframes OutLeft{	0%{opacity: 0; margin-left:-295px;}	100%{opacity:1; margin-left:0;}}
	   
@-webkit-keyframes fadeIn { 0% { opacity: 0;} 100% { opacity: 1;} }  
@keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } }
@-webkit-keyframes fadeOut { 0% { opacity: 1;} 100% { opacity: 0;} }  
@keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } 

@-webkit-keyframes openAlert {  
	0% { opacity: 0; margin-left: -320px; -webkit-transform: scale(0.6); -ms-transform: scale(0.6); transform: scale(0.6); } 
	100% { opacity: 1; margin-left: 0px; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);	} 
}
@keyframes openAlert {  
	0% { opacity: 0; margin-left: -320px; } 
	100% { opacity: 1; margin-left: 0px;}  
}
@-webkit-keyframes closeAlert {  
	0% { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);	} 
	100% { opacity: 0; -webkit-transform: scale(0.6); -ms-transform: scale(0.6); transform: scale(0.6);	} 
}
@keyframes closeAlert {  
	0% { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 
	100% { opacity: 0; -webkit-transform: scale(0.6); -ms-transform: scale(0.6); transform: scale(0.6); }  
}

@-webkit-keyframes mainmenuin { 0% {opacity: 0; right: -320px;} 50% {right: 0px;} 100% { opacity: 1; } }  
@keyframes mainmenuin { 0% {opacity: 0; right: -320px;} 50% {right: 0px;} 100% { opacity: 1;} }
@-webkit-keyframes mainmenuout { 0% { opacity: 1; right: 0px;} 50% {right: -320px;} 100% { opacity: 0; } } 
@keyframes mainmenuout { 0% { opacity: 1; right: 0px;} 50% {right: -320px;} 100% { opacity: 0; } } 

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: rgba(14, 61, 132, 0.2);
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.5);
}

::selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}

@media print {
	* {
		background:transparent !important;
		color:#000 !important;
		box-shadow:none !important;
		text-shadow:none !important;
	}
	a,
	a:visited {
		text-decoration:underline;
	}
	a[href]:after {
		content:" (" attr(href) ")";
	}
	abbr[title]:after {
		content:" (" attr(title) ")";
	}
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content:"";
	}
	pre,blockquote {
		border:1px solid #999;
		page-break-inside:avoid;
	}
	thead {
		display:table-header-group;
	}
	tr,img {
		page-break-inside:avoid;
	}
	img {
		max-width:100% !important;
	}
	@page {
		margin:0.5cm;
	}
	p,
	h2,
	h3 {
		orphans:3;
		widows:3;
	}
	h2,
	h3 {
		page-break-after:avoid;
	}
}