@charset "utf-8";
/* CSS Document */
/* Developed and copyright by Supawee "Bom" Ippoodom */

/* Reset - Start */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table,
caption, tbody, tfoot, thead, tr, th, td
                  {margin: 0;padding: 0;border: 0;outline: 0;
                  font-size: 100%;vertical-align: baseline;
                  background: transparent;}
body              {line-height: 1;}
ol, ul            {list-style: none;}
blockquote, q     {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';	content: none;}
:focus            {outline: 0;}
ins               {text-decoration: none;}
del               {text-decoration: line-through;}
table             {border-collapse: collapse;border-spacing: 0;}
:focus{
	outline: transparent !important;
}
/* Reset - End */

*{ margin:0 0; padding:0 0; }
a, a:hover, a:active, a:visited{ text-decoration:none; cursor:pointer; }
a img{ border:none; }
.noinnertext{ font-size:0; line-height:0; overflow:hidden; text-indent:-999em; text-decoration:none; }
.al-l{ text-align:left; }
.al-c{ text-align:center; }
.al-r{ text-align:right; }
.bold{ font-weight:400; }
.italic{ font-style:italic; }
.underline{ text-decoration:underline; }
.img-fullwidth{ max-width:100%; }
.img-maxwidth{ width:100%; }
.nopadding{ padding:0; }
.uppercase{ text-transform:uppercase; }
.lowercase{ text-transform:lowercase; }
.no-lineheight{ line-height:0; }

h1,h2,h3,h4,h5,b,strong{ font-weight:normal; }

/* Fonts - Start */
.f-Prompt{ font-family: 'Prompt', sans-serif; }
h1{
	font-size:28px;
	line-height:28px;
}
h2{
	font-size:20px;
	line-height:20px;
}
h3{
	font-size:18px;
	line-height:18px;
}
h4{
	font-size:16px;
	line-height:16px;
}
h5{
	font-size:14px;
	line-height:14px;
}
p, li{
	font-size:14px;
    line-height:24px;
}
.texteditor h1,
.texteditor h1,
.texteditor h1,
.texteditor h1,
.texteditor h1,
.texteditor p,
.texteditor li{
	width:100%;
	display:inline-block;
	line-height:unset;
}
.texteditor p,
.texteditor li{
	margin:0.5rem 0;
	line-height:1.8rem;
}
.text-indent{
	text-indent:1rem;
}
/* Fonts - End */

/* Color Identity - Start */
.white{ color:#FFF; }
.black{ color:#000; }
.red{ color:#EB252A; }
.yellow{ color:#FEE131; }
.green{ color:#166030; }
/* Color Identity - End */

/* Background - Start */
.bg-transparent{ background-color:transparent; }
.bg-black{ background-color:#000; }
.bg-white{ background-color:#FFF; }
.bg-red{ background-color:#EB252A; }
.bg-yellow{ background-color:#FEE131; }
.bg-green{ background-color:#166030; }
.bg-lightgrey{ background-color:#F4F4F4; }
/* Background - End */

/* Border - Start */
.noborder{ border:none !important; }
.border{ border:1px solid; }
.border-top{ border-top:1px solid; }
.border-right{ border-right:1px solid; }
.border-bottom{ border-bottom:1px solid; }
.border-left{ border-left:1px solid; }
.border-radius{
    border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-o-border-radius:10px;
}

	/* Border Size - Start */
	.border-2px{ border-width:2px !important; }
	.border-3px{ border-width:3px !important; }
	.border-4px{ border-width:4px !important; }
	.border-5px{ border-width:5px !important; }
	.border-6px{ border-width:6px !important; }
	.border-7px{ border-width:7px !important; }
	.border-8px{ border-width:8px !important; }
	.border-9px{ border-width:9px !important; }
	.border-10px{ border-width:10px !important; }
	/* Border Size - End */

	/* Border Color - Start */
	.border-black{ border-color:#000 !important; }
    .border-white{ border-color:#FFF !important; }
    .border-red{ border-color:#EB252A !important; }
    .border-yellow{ border-color:#FEE131 !important; }
    .border-green{ border-color:#166030 !important; }
	/* Border Color - End */

/* Border - End */

/* Button - Start */
.btn{
	padding:0.5rem 1rem;

    transition:.2s background-color linear, .2s color linear;
    -webkit-transition:.2s background-color linear, .2s color linear;
    -moz-transition:.2s background-color linear, .2s color linear;
    -o-transition:.2s background-color linear, .2s color linear;
}
.btn-wide{ padding:0.5rem 2rem; }
.btn-medium{ font-size:26px; line-height:26px; }
.btn-small{ font-size:12px; line-height:12px; }
.btn-text{
    transition:.2s color linear;
    -webkit-transition:.2s color linear;
    -moz-transition:.2s color linear;
    -o-transition:.2s color linear;
}

	/* Color Button - Start */
    .btn-black{ border-color:#000; background-color:#000; color:#fff; }
    .btn-red{ border-color:#EB252A; background-color:#EB252A; color:#fff; }
    .btn-yellow{ border-color:#FEE131; background-color:#FEE131; color:#EB252A; }
    .btn-green{ border-color:#166030; background-color:#166030; color:#fff; }
    .btn-green-transparent{ background-color:#fff; border-color:#166030; color:#166030; }
	/* Color Button - End */

	/* On Hover - Start */
    .btn-black:hover{ background-color:#fff; color:#000; }
    .btn-red:hover{ background-color:#fff; color:#EB252A; }
    .btn-yellow:hover{ background-color:#EB252A; color:#FEE131; }
    .btn-green:hover{ background-color:#fff; color:#166030; }
    .btn-green-transparent:hover{ background-color:#166030; border-color:#166030; color:#fff; }
	/* On Hover - End */

/* Button - End */

/* Form - Start */
.form{
	position:relative;
	margin-bottom:3rem;
}
.form div.control-group{
    position:relative;
    margin-top:10px;
    margin-bottom:10px;
}
.form div.control-group .control-label{
	margin-bottom:0.25rem;
	font-size:18px;
    line-height:18px;
}
.form .symbol::after{
    content:'';
	margin-left:0.5rem;
}

.form .symbol.required::after{
    content:'*';
}
.form div.control-group .controls{
	margin:1rem 0;
}
.form div.control-group .controls p{
	font-size:14px;
}
.form div.control-group .controls input[type="text"],
.form div.control-group .controls input[type="tel"],
.form div.control-group .controls input[type="email"],
.form div.control-group .controls input[type="number"],
.form div.control-group .controls select,
.form div.control-group .controls textarea{
    width:100%;
    font-size:14px;
    line-height:24px;
	border-radius:0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	-o-border-radius:0;
}
.form div.control-group .controls input[type="text"],
.form div.control-group .controls input[type="tel"],
.form div.control-group .controls input[type="email"],
.form div.control-group .controls input[type="number"],
.form div.control-group .controls textarea{
    padding:0.5rem;
}
.form div.control-group .controls textarea{
	resize:none;
}
.form div.control-group .controls .select2{
	width:100% !important;
}
.form div.control-group .controls .select2-selection{
	padding:0.5rem;
    border-radius:0;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    -o-border-radius:0;
	background:#fff;
	font-size:14px;
	line-height:14px;
}
.select2-results__option{
    font-size:14px;
    line-height:14px;
}
.form div.control-group .controls .select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height:14px;
	font-size:14px;
	padding-left:0;
}
.form .select2-container--default .select2-selection--single .select2-selection__arrow{
	height:100%;
}
.form div.control-group.mk-trc i{
    height:22px;
}
.form div.control-group.mk-trc[data-style=radio] i,
.form div.control-group.mk-trc[data-style=check] i{
    width:22px;
    background:transparent;
}
.form div.control-group.mk-trc label{
    font-size:14px;
}

	/* .form-check-inline - Start */
	.form-check-inline{
		font-size:22px;
		line-height:22px;
		margin-right:1rem;
	}
	.form-check-inline .form-check-label{
		margin-top:0.5rem;
		margin-left:0.5rem;
	}
	/* .form-check-inline - End */

    /* MK TRC - Start */
    .form div.control-group.c-navy.mk-trc[data-style=check] i{
        border-color:#132947;
    }
    .form div.control-group.c-navy.mk-trc input:checked+label i{
        background:#132947;
    }
    .form div.control-group.c-gold.mk-trc[data-style=check] i{
        border-color:#846647;
    }
    .form div.control-group.c-gold.mk-trc input:checked+label i{
        background:#846647;
    }
    /* MK TRC - End */

    /* Messages - Start */
    .message{
		margin-top:0.25rem;
        font-size:14px;
        line-height:14px;
    }
    .message.error{
        color:#ff0000;
    }
	/* Messages - End */

	/* Custom Upload button - Start */
	.upload-btn-wrapper {
		position: relative;
		overflow: hidden;
		display:flex;
		flex-wrap:wrap;
	}
	.upload-btn-wrapper .fileName{
		border-right:none;
		font-size:20px;
	}
	.upload-btn-wrapper .upload-btn{
		cursor:pointer;
	}
	.upload-btn-wrapper input[type=file] {
		font-size: 100px;
		position: absolute;
		left: 0;
		top: 0;
		opacity: 0;
	}
	/* Custom Upload button - End */

/* Form - End */

/* Modals - Start */
.modal-content{
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-o-border-radius:10px;
}
.modal-content .modal-body{
	max-height:80vh;
	overflow-y:auto;
	overflow-x:hidden;
	position:relative;
}
.modal-content #btnCloseModal{
	font-size:36px;
	line-height:36px;
	width:38px;
	height:38px;
	text-align:center;
	position:absolute;
	top:15px;
	right:15px;
	z-index:1;

	transition:.2s color linear;
	-webkit-transition:.2s color linear;
	-moz-transition:.2s color linear;
	-o-transition:.2s color linear;
}

	/* Custom Style - Start */
	#thankyouModal .modal-content{
		padding:6rem 3rem;
	}
	/* Custom Style - End */

/* Modals - End */

/* .slick-slider - Start */
.slick-initialized .slick-slide{
	line-height:0;
}
.slick-slider .slick-arrow{
	width:36px;
	height:36px;

	position:absolute;
	top:calc( 50% - 13px );
	z-index:1;

	padding-top:2px;

	border-radius:50%;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	-o-border-radius:50%;

	background-color:#c4c7ca;

	transition:.2s opacity linear;
	-webkit-transition:.2s -webkit-opacity linear;
	-moz-transition:.2s -moz-opacity linear;
	-o-transition:.2s -o-opacity linear;

	opacity:0.7;
	-webkit-opacity:0.7;
	-moz-opacity:0.7;
	-o-opacity:0.7;
}
.slick-slider .slick-arrow:hover{
	opacity:1;
	-webkit-opacity:1;
	-moz-opacity:1;
	-o-opacity:1;
}
.slick-slider .slick-arrow i{
	font-size:12px;
	line-height:18px;
	color:#07102b;
}
.slick-slider .slick-arrow.slick-prev{
	left:30px;
}
.slick-slider .slick-arrow.slick-next{
	right:30px;
}
/* .slick-slider - End */

/* #loading - Start */
@keyframes ldio-elq6fehsehk {
    0% { transform: rotate(0) }
    100% { transform: rotate(360deg) }
}
#loading{
    width:100%;
    height:100vh;
    position:fixed;
    top:0;
    left:0;

    background-color:rgba(0,0,0, 0.6);

    display:none;
    z-index:999;
}
.ldio-elq6fehsehk div { box-sizing: border-box!important }
.ldio-elq6fehsehk > div {
    position: absolute;
    width: 160px;
    height: 160px;
    top: 20px;
    left: 20px;
    border-radius: 50%;
    border: 4px solid #fff;
    border-color: #a9060a transparent #a9060a transparent;
    animation: ldio-elq6fehsehk 2.564102564102564s linear infinite;
}

.ldio-elq6fehsehk > div:nth-child(2), .ldio-elq6fehsehk > div:nth-child(4) {
    width: 148px;
    height: 148px;
    top: 26px;
    left: 26px;
    animation: ldio-elq6fehsehk 2.564102564102564s linear infinite reverse;
}
.ldio-elq6fehsehk > div:nth-child(2) {
    border-color: transparent #fff transparent #fff;
}
.ldio-elq6fehsehk > div:nth-child(3) { border-color: transparent }
.ldio-elq6fehsehk > div:nth-child(3) div {
    position: absolute;
    width: 100%;
    height: 100%;
    transform: rotate(45deg);
}
.ldio-elq6fehsehk > div:nth-child(3) div:before, .ldio-elq6fehsehk > div:nth-child(3) div:after {
    content: "";
    display: block;
    position: absolute;
    width: 4px;
    height: 4px;
    top: -4px;
    left: 74px;
    background: #a9060a;
    border-radius: 50%;
    box-shadow: 0 156px 0 0 #a9060a;
}
.ldio-elq6fehsehk > div:nth-child(3) div:after {
    left: -4px;
    top: 74px;
    box-shadow: 156px 0 0 0 #a9060a;
}

.ldio-elq6fehsehk > div:nth-child(4) { border-color: transparent; }
.ldio-elq6fehsehk > div:nth-child(4) div {
    position: absolute;
    width: 100%;
    height: 100%;
    transform: rotate(45deg);
}
.ldio-elq6fehsehk > div:nth-child(4) div:before, .ldio-elq6fehsehk > div:nth-child(4) div:after {
    content: "";
    display: block;
    position: absolute;
    width: 4px;
    height: 4px;
    top: -4px;
    left: 68px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 144px 0 0 #fff;
}
.ldio-elq6fehsehk > div:nth-child(4) div:after {
    left: -4px;
    top: 68px;
    box-shadow: 144px 0 0 0 #fff;
}
.loadingio-spinner-double-ring-qvomtcu446i {
    width: 200px;
    height: 200px;
    display: inline-block;
    overflow: hidden;
    background: none;

    position:absolute;
    top:calc( 50% - 100px );
    left:calc( 50% - 100px );
}
.ldio-elq6fehsehk {
    width: 100%;
    height: 100%;
    position: relative;
    transform: translateZ(0) scale(1);
    backface-visibility: hidden;
    transform-origin: 0 0; /* see note above */
}
.ldio-elq6fehsehk div { box-sizing: content-box; }
/* #loading - End */

/* Default stylesheet - Start */
body{
    font-family: 'Prompt', sans-serif;
    font-weight:200;
}
.container{
    max-width:640px;
    position:relative;
	background-image:url('../img/background.png');
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
}
#content-wrapper{
	background-color:rgba(255,255,255,0.7);
	border-radius:15px;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	-o-border-radius:15px;
}
h1.page-header{
	margin:0;
	font-size:24px;
}
.box{
	margin:3rem 0;
}
ol{
	list-style:decimal;
}
ul{
	list-style:circle;
}
ol li,
ul:not(.select2-results__options) li{
	margin:5px 0 5px 15px;
}
.sharethis-inline-share-buttons{
	min-width:150px;
}
.page-title{
	position:relative;
	padding:9px 15px 15px 40px;
}
.page-title::before{
	content:'';
	width:257px;
	height:52px;
	background-image:url('../img/page_header_bg.png');
	background-repeat:no-repeat;
	background-size:cover;
	position:absolute;
	top:0;
	left:0;
}
#remark{
	font-size:10px;
	line-height:20px;
}
.not-loaded{
	opacity:0;
	-webkit-opacity:0;
	-moz-opacity:0;
	-o-opacity:0;
}
.content-box p,
.content-box div,
.content-box li{
	font-size:14px;
}
.content-box p a,
.content-box div a,
.content-box li a,
#content p a,
#content div a,
#content li a{
	transition:.2s color linear;
	-webkit-transition:.2s color linear;
	-moz-transition:.2s color linear;
	-o-transition:.2s color linear;
}
.item-controller a{
    font-size:26px;
}
.item-controller p{
    font-size:16px;
}
.item-controller a.btnAddToCart{
    font-size:16px;
}
/* Default stylesheet - End */

/* .sweetalert - Start */
.sweet-alert p.lead{
	margin:1rem 0;
}
/* .sweetalert - End */

/* Header - Start */
header #logo i{
    font-size:72px;
}
header i.fa-history{
    font-size:22px;
    line-height:22px;
}
/* Header - End */

/* #btnCart - Start */
#btnCart{
    width:64px;
    height:64px;

    padding:1rem 0.5rem;

    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -o-border-radius:50%;

    position:fixed;
    right:1rem;
    bottom:15vh;

    z-index:9;
}
/* #btnCart - End */

/* #partners - Start */
#partners i.icomoon{
    font-size:60px;
    margin:0 0.05rem;
}
/* #partners - End */

/* #receipt - Start */
#receipt{
    padding:2rem;
}
#receipt #partners i.icomoon{
    font-size:30px;
}
#receipt .blog{
    margin:1rem 0;
}
/* #receipt - End */

/* #assistant - Start */
#assistant{
    margin-top:2rem;
}
/* #assistant - End */

/* #payment-header - Start */
#payment-header ul#countdown li{
    font-size:16px;
    margin:0;
}
#payment-body{
    padding:2rem 1rem;
}
#payment-howto{
    padding:2rem 1rem;
}
/* #payment-header - End */

/* .mask - Start */
.mask{
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;

	background-color:rgba(0,0,0,0.7);

	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-o-border-radius:10px;
}
.mask span{
	font-size:16px;
	line-height:32px;
}
/* .mask - End */

/* Footer - Start */

/* Footer - End */

/* Navigation - Start */

	/* Navigation active by page - Start */

	/* Navigation active by page - End */

/* Navigation - End */