/* basic */
@font-face {
	font-family: 'Quick';
	src: url('font/quick/Quick.eot');
	src: local('☺'), url('font/quick/Quick.woff') format('woff'), url('font/quick/Quick.ttf') format('truetype'), url('font/quick/Quick.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'Cera';
	src: url('font/cera/Cera Pro Regular.eot');
	src: local('☺'), url('font/cera/Cera Pro Regular.woff') format('woff'), url('font/cera/Cera Pro Regular.ttf') format('truetype'), url('font/cera/Cera Pro Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Cera Bold';
	src: url('font/cera/Cera Pro Bold.eot');
	src: local('☺'), url('font/cera/Cera Pro Bold.woff') format('woff'), url('font/cera/Cera Pro Bold.ttf') format('truetype'), url('font/cera/Cera Pro Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Cera Light';
	src: url('font/cera/Cera Pro Light.eot');
	src: local('☺'), url('font/cera/Cera Pro Light.woff') format('woff'), url('font/cera/Cera Pro Light.ttf') format('truetype'), url('font/cera/Cera Pro Light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'Sukhumvit';
	src: url('font/sukhumvit/SukhumvitSet-Text.eot');
	src: local('☺'), url('font/sukhumvit/SukhumvitSet-Text.woff') format('woff'), url('font/sukhumvit/SukhumvitSet-Text.ttf') format('truetype'), url('font/sukhumvit/SukhumvitSet-Text.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Sukhumvit Bold';
	src: url('font/sukhumvit/SukhumvitSet-Bold.eot');
	src: local('☺'), url('font/sukhumvit/SukhumvitSet-Bold.woff') format('woff'), url('font/sukhumvit/SukhumvitSet-Bold.ttf') format('truetype'), url('font/sukhumvit/SukhumvitSet-Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Sukhumvit Light';
	src: url('font/sukhumvit/SukhumvitSet-Light.eot');
	src: local('☺'), url('font/sukhumvit/SukhumvitSet-Light.woff') format('woff'), url('font/sukhumvit/SukhumvitSet-Light.ttf') format('truetype'), url('font/sukhumvit/SukhumvitSet-Light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


body {
	color: #939393;
	font-family: 'Cera Light';
	font-size: 14px;
	background: #F3F7F8;
	min-height: 100vh;
}
body.th {
	font-family: 'Sukhumvit';

}
.main-pad{
	padding-left: 10px;
	padding-right: 10px;
}
.main-pad2{
	padding-left: 25px;
	padding-right: 25px;
}
.container1 {
	max-width: 360px;
	min-width: 320px;
	/*padding-bottom: 20px;*/
	margin: 0 auto;
}

.package-container {
    background-color: rgba(2,78,43, 0.1);
    border-radius: 10px;
    padding: 15px 0px 5px 15px;
}

.new-badge {
	background-color: #cb181f;
    color: #ffffffff;
    border-radius: 5px;
    padding: 0px 6px 0px 6px;
    position: absolute;
    right: 18px;
    top: 18px;
}

@media (max-width: 320px ) {
	.container1 {
		max-width: 310px;
		min-width: 300px;
	}
}
.stop-scrolling {
	height: 100%;
	overflow: hidden;
}
/* end basic */

/* start nav bar */
.bar, .back {
	margin-top: 2px;
	cursor: pointer;
}
.brand-logo{
	margin-top: 10px;
}
.logo{
	height: 25px;
}
nav, .navbar, .navbar-fixed {
	background-color: none;
    border: none;
}
.small-nav .navbar {
	min-height: 60px;
}
.nav-head {
	border-radius: 0px;
	background: #55986B;
	/*padding-top: 7px;*/
}
.nav-head.trans{
	background: transparent;
}
.nav-head.fixed-head {
	position: fixed;
	width: 100%;
}
/*.container-fluid{
	padding-right: 0;
  padding-left: 0;
}*/
@media (min-width: 321px) {
	.container-fluid{
		padding-right: 7.5px;
		padding-left: 7.5px;
	}
}
.pad-l0 {
	padding-left: 0;
}
.lang{
	font-family: 'Cera';
	text-align: right;
	list-style: none;
	padding: 0;
	height: 20px;
	margin-top: 9px;
}
.lang li {
	display: inline-block;
	height: 25px;
	line-height: 25px;
	padding-left: 4px;
	font-size: 15px;
}
.lang li:first-child {
	border-right: 1px solid #fff;
	padding-right: 10px;
}
.lang, .lang a{
	font-family: 'Cera';
	color: #fff;
	cursor: pointer;
	font-weight: lighter;
}
.lang a.active {
	color: #004426;
	text-decoration: underline;
}
.lang.hasnews a.active {
	color: #004426;
	text-decoration: underline;
}
/* end nav bar */


/* start backgrounds */
.bg-clr1 {
	background-color: #55986B;
}
.bg1 {
	/*background-color: #55986B;*/
	background-image: url("../images/bg/bg1.svg");
	background-size: cover;
	/*background-repeat: repeat space;
  background-repeat: repeat repeat;
  background-repeat: round space;*/
  background-repeat: no-repeat;
  background-position-y: bottom;
}
/*.bg4 {
	background-image: url("../images/bg/bg4.png");
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: bottom;
	background-size: cover;
}*/
.bg5 {
	background: url("../images/bg/bg5.png") repeat-x top;
	background-size: cover;
}
.bg2{
  background: url("../images/bg/bg2.svg") no-repeat top;
  background-size: cover;
}
.bg3 {
	background: url("../images/bg/bg3.png") no-repeat top;
 	background-size: cover;
}
.bg4 {
	background-image: url("../images/bg/reg.svg");

 	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: bottom;
	background-size: cover;
}

.bg-green {
	background-color: #55986B;
	width: 100%;
	height: 210px;
	border-bottom-left-radius: 9px;
	border-bottom-right-radius: 9px;
}
.bg-gray1 {
	background: #E5E5E5;
}
.bg-gray2 {
	background: #F3F7F8;
}
.bg-white {
	background-color: #FFFFFF;
}
/* end backgrounds */

/* outline */
.outline1 {
	outline: 1px solid #ccc;
}
/* outline */

/* colors */
.clr1{
	color: #55986B;
}
.m-vh {
	min-height: 100vh;
}
.bg33 {
	background: #2E2E2E;
}
.clr-g1 {
	background: #E7D79D;
	background: -webkit-linear-gradient(to bottom, #E7D79D 0%, #B69044 100%);
	background: -moz-linear-gradient(to bottom, #E7D79D 0%, #B69044 100%);
	background: linear-gradient(to bottom, #E7D79D 0%, #B69044 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.clr-s1 {
	background: #FFFFFF;
	background: -webkit-linear-gradient(to bottom, #FFFFFF 0%, #CFCFCF 100%);
	background: -moz-linear-gradient(to bottom, #FFFFFF 0%, #CFCFCF 100%);
	background: linear-gradient(to bottom, #FFFFFF 0%, #CFCFCF 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.clr-b1 {
	background: #E79D78;
	background: -webkit-linear-gradient(to bottom, #E79D78 0%, #D96A33 100%);
	background: -moz-linear-gradient(to bottom, #E79D78 0%, #D96A33 100%);
	background: linear-gradient(to bottom, #E79D78 0%, #D96A33 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.clr2{
	color: #E7D79D;
}
.clr3{color: #AA090D;}
.clr4 {color: #ABC1DB;}
.clr5 {color: #FF5B60;}
.clr-white, .clr-white:hover {
	color: #fff;
}
.clr-err {
	color: #CB181E;
}
.clr-black {
	color: #000;
}
.clr-gray {
	color: #E5E5E5;
}
.clr-gray7 {
	color: #323232;
}
.clr-gray8 {
	color: #7C7C7C;
}
.clr-gray5 {
	color: #D8D8D8;
}
.clr-gray4 {
	color: rgba(120,122,134, 0.7);
}
.clr-gray3 {
	color: #787A86;
}
.clr-gray8 {
	color: #888888;
}
.clr-gray2 {color: #939393;}
.clr-gray6 {
	color: #8C8C8C;
}
.clr-success {
	color: #00913E;
}
.clr4 {
	color: #E79D78;
}
.clr-black {
	color: #000000;
}
.clr-yellow {
	color: #FAB244;
}
.clr-green {
	color: #004426;
}
.clr-green1 {
	color: #014E29;
}
.clr-green2 {
	color: #004426;
}
.clr-green3 {
	color: #1A603E;
}
.clr-diamond {
	color: #53585C;
}
.clr-diamond1 {
	color: #696B6C;
}
.clr-gold {
	color: #805D18;
}
.clr-red {
	color: #D50000;
}

/* end colors */

/* miscellaneous */
[v-cloak] { display:none; }
.txt-xl{
	font-size: 96px;
	line-height: 56px;
	font-weight: bold;
}
.txt-xl span {display: block;}
.txt-s {
	font-size: 22px;
}
.txt-xs {
	font-size: 18px;
}
.txt-xxs {
	font-size: 12px;
}
.txt-xxs1 {
	font-size: 14px;
}
.txt-bold {
	font-weight: bold;
}
.alert-gray {
	margin: 0;
	background: #F0F2F5;
	padding: 7px;
	letter-spacing: 0.01em;
}

.desc {

}
.h-fix{
	min-height: 517px; 
}
.h-fix-otp{
	min-height: 445px;
}
.h-v100{
	min-height: 100vh;
}
.h-v80{
	min-height: 80vh;
}
.p20{
	padding-top: 20px;
	padding-bottom: 20px;
}
.p15{
	padding-top: 15px;
	padding-bottom: 15px;
}
.pb50 { padding-bottom: 50px; }
.pb100 { padding-bottom: 100px;}
.pb200 { padding-bottom: 200px;}
.pb5 {padding-bottom: 5px;}
.m0 { margin: 0; }
.m-0auto{
	margin: 0 auto;
}
.mt-8{margin-top: 8px;}
.mt-6{
	margin-top: 6px;
}
.mt-10{
	margin-top: 10px;
}
.mt-15{
	margin-top: 15px;
}
.m-t20, .mt-20{
	margin-top: 20px;
}
.mt-25{margin-top: 25px}
.m-t30, .mt-30{
	margin-top: 30px;
}
.mt-40{margin-top: 40px;}
.mt-55{margin-top: 55px;}
.mt-70{margin-top: 70px;}
.mt-45{
	margin-top: 45px;
}
.mt50{margin-top: 50px;}
.mt100{margin-top: 100px;}
.mt-140{
	margin-top: 140px;
}
.mb-10{margin-bottom: 10px;}
.mb-20{
	margin-bottom: 20px;
}
.mb-30{
	margin-bottom: 30px;
}
.m-t150{
	margin-top: 150px;
}
.m-t200{
	margin-top: 200px;
}
.p-t{
	padding-top: 16px;
}
.p0 {
	padding: 0;
}
.pt5{padding-top: 5px;}
.pt15{padding-top: 15px;}
.ptb5{padding-top: 5px; padding-bottom: 5px;}
.pl-0{
	padding-left: 0;
}
.pr-0{
	padding-right: 0;
}
.d-f {
	display: inline-flex;
}
.bl-gray {
	border-left: 1px solid #EFEFEF;
}
.w-full {
	width: 100%;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{
	border: 1px solid #000;
}
/* end miscellaneous */

/*modal */


.dq-modal-body {
	min-height: 100px;
	border-radius: 10px;
	padding: 0 0 20px 0;
	float: left;
	width: 100%;
	color: #323232;
}
.dq-modal-body .news-div {
	word-break: break-word;
}
.dq-modal-body img.img-fluid {
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
}
.close-modal{
	/* border-radius: 50%; */
	padding: 0;
	width: 35px;
	height: 35px;
	background: none;
	border: 0;
	position: absolute;
	top: 15px;
	right: 10px;
	vertical-align: middle;
	text-align: center;
	z-index: 1051;
}
.close-modal img{
	width: 20px;
	height: 20px;
}
.close-modal:hover, .close-modal:focus{
	outline: none;
	background: none;
}

.dq-modal{
	max-width: 345px;
	min-width: 325px;
	margin-left: auto;
	margin-right: auto;
}
.dq-modal .modal-content {
	max-width: 328px;
	min-width: 328px;
	box-shadow: none;
	border: none;
	/*background: linear-gradient(180deg, #2E2E2E 0%, #000000 100%);*/
	/*border: 1px solid #E7D79D;*/
}
@media (max-width: 320px) {
	.dq-modal .modal-content {
		max-width: 305px;
		min-width: 305px;
	}
}

.modal-dialog-centered {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    min-height: calc(100% - (.5rem * 2));
}

@media (min-width: 576px) {
	.modal-dialog-centered {
	    min-height: calc(90% - (1.75rem * 2));
	}
}

.dq-modal .d-f button:first-child {
	margin-right: 7px;
}
.dq-modal .d-f button:last-child {
	margin-left: 7px;
}
.dq-modal .modal-content {
	border-radius: 15px;
}
.dq-modal .modal-content.green {
	background-image: url('/images/bg/home/green.png');
	background-repeat: no-repeat;
	background-position: top;
	background-size: cover;
	background-color: #55986B;
	height: 345px;
}
.dq-modal .modal-content.green1 {
	background-image: url('/images/bg/home/green1.png');
	background-repeat: no-repeat;
	background-position: top;
	background-size: cover;
	background-color: #55986B;
	height: 578px;
}
.dq-modal .modal-content.gold {
	background-image: url('/images/bg/home/gold.png');
	background-repeat: no-repeat;
	background-position: top;
	background-size: cover;
	background-color: #DAB46B;
	height: 578px;
}
.dq-modal .modal-content.diamond {
	background-image: url('/images/bg/home/diamond.png');
	background-repeat: no-repeat;
	background-position: top;
	background-size: cover;
	background-color: #DAB46B;
	height: 578px;
}
.dq-modal .modal-btn {
	position: absolute;
	bottom: 25px;
}