/* @extend display-flex; */  
 
@font-face {
  font-family: DB Helvethaica X;
  src: url("../fonts/helvethaica_x/DB_Helvethaica_X.woff");
  font-weight: 800;
}

@font-face {
    font-family: UniversLTStd-Light;
    src: url("../fonts/UniversLTStd-Light/UniversLTStd-Light.woff") format("woff")
}

.no-padding{padding: 0;}
.no-margin{margin: 0;}
 
img {
  max-width: 100%;
  height: auto; }

figure {
  margin: 0; }
 
.clear { clear: both;} 

body {
  font-size: 19pt;
  line-height: 2.0;
  color: #fff!important; 
  font-weight: normal;
  font-family: 'DB Helvethaica X', serif;
  /*font-family: UniversLTStd-Light, Helvetica, Arial, sans-serif;*/
  margin: 0 auto; padding: 0; 
  background: #281D3C!important;
} 
.row-eq{
    display: flex;
}
.col-eq{
  flex: 1; 
}

.register-form{padding: 0; } 
.logo-cont{width:100%; text-align: center; padding: 50px 0 72px 0; }
.logo{width:400px; height:auto;}

 /*input*/
 form{padding: 30px 50px; margin: 0;} 
.form-group {position: relative;	padding-top: 5px!important;}
.form-control { 
  transition: .25s border ease-in-out;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent; 
  font-size:16pt;  
  border: 0;
  border-bottom: 1px solid #d2dae1; 
  margin-bottom: 30px;
  padding-left: 0; padding-right: 0; 
  color: #d2dae1;
}

.form-control:focus {
  border-bottom-color: #d2dae1;
}

.errorMessages {
  margin-top: 50px;
  padding: 25px;
  color: #A94442;
  background: #202020;
  border: 0 !important;
  text-shadow: none !important;
  box-shadow: 0 0 10px #151515;
  text-align: center;
}

.form-control:not(.touched)+.floater:before {/*text title*/
  display: block;
  position: absolute;
  top: -20px;
  font-size: 18pt;
  color: #d2dae1;
  pointer-events: none;
  transition: .25s all ease-in-out;
}

.form-control.touched+.floater:before,
#firstname:focus+.floater:before,
#firstname:not(:placeholder-shown)+.floater:before,
#lastname:focus+.floater:before,
#lastname:not(:placeholder-shown)+.floater:before,
#mobile:focus+.floater:before,
#mobile:not(:placeholder-shown)+.floater:before,
#email:focus+.floater:before,
#email:not(:placeholder-shown)+.floater:before,
#message:focus+.floater:before,
#message:not(:placeholder-shown)+.floater:before 
{
  position: absolute;
  top: -30px;
  font-size: 16pt;
  color: #b48e6000;; 
}
 
#firstname+.floater:before,
#firstname:focus+.floater:before {
  width:100%;
  content: "ชื่อ-นามสกุล*"; 
}

#lastname+.floater:before,
#lastname:focus+.floater:before {
  width:100%;
  content: "นามสกุล"; 
}
#line+.floater:before,
#line:focus+.floater:before {
  width:100%;
  content: "Line ID"; 
}

#mobile+.floater:before,
#mobile:focus+.floater:before {
width:100%;
  content: "เบอร์โทร*"; 
}
#email+.floater:before,
#email:focus+.floater:before {
 width:100%;
content: "อีเมล์*"; 
} 
#message+.floater:before,
#message:focus+.floater:before {
  width:100%;
  content: "ข้อความ"; 
}
 
/****/ 
.select {position: relative; padding: 0; margin: -30px 0 30px 0; cursor: pointer;}  
.not-show{display: none;}
.select-text {
	position: relative;
	font-family: inherit;
	background-color: transparent;
	width: 100%;
	padding: 8px 10px 12px 0; 
	border-radius: 0;
	border: none;
	border-bottom: 1px solid #d2dae1;
} 
/* Remove IE arrow */
select::-ms-expand {
  display: none;
}
/* Remove focus */
.select-text:focus {
	outline: none;
	border-bottom: 1px solid #d2dae1;
}

/* Use custom arrow */
.select .select-text {
	appearance: none;
	-webkit-appearance:none;
	/*margin-top: 10px; /*text info cus budget*/
	color: #c2c6cf;
	padding-left: 10px;
	font-family: UniversLTStd-Light, Helvetica, Arial, sans-serif;
    font-size: 13.5px;
}

.select:after {
	position: absolute;
	top: 40px;
	right:0;
	/* Styling the down arrow */
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid rgb(213 226 220);
	pointer-events: none;
 
	
} 
.select-style select {
    padding: 10px 8px;
    width: 100%;
    border: none;
    box-shadow: none; border-bottom: 1px #d2dae1 solid; 
    background-image: none;
    -webkit-appearance: none;
}

.select-style select:focus {
    outline: none;
}
/* LABEL ======================================= */
.select-label {
	color: #d2dae1;
	font-size: 13.5pt; /*text title*/
	font-weight: normal;
	position: absolute;
	pointer-events: none;
	left: 0;
	top: 10px; 
	transition: 0.2s ease all; 
	 
}

/* active state */
.select-text:focus ~ .select-label, .select-text:valid ~ .select-label {
	color: #b48e60;
	top: 0;
	transition: 0.2s ease all;
	font-size: 16pt;  /*text title hover*/
}

/* BOTTOM BARS ================================= */
.select-bar {
	position: relative;
	display: block;
	width: 100%; 
}

.select-bar:before, .select-bar:after {
	content: '';
	height: 1px;
	width: 0;
	bottom: 1px;
	position: absolute;
	background: #b48e60;
	transition: 0.2s ease all;
}

.select-bar:before {
	left: 50%;
}

.select-bar:after {
	right: 50%;
}

/* active state */
.select-text:focus ~ .select-bar:before, .select-text:focus ~ .select-bar:after {
	width: 50%;
} 
/*****/
.select select { 
        display: inline-block;
        width: 100%;
        cursor: pointer;
        padding: 15px;
        outline: 0; 
        border-radius: 0px; 
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;  
 
}
.select select option{
		padding: 15px; 
		line-height: 2.5; 
		background: #bfa9ce; 
		color:#000; 
		font-family: UniversLTStd-Light, Helvetica, Arial, sans-serif;
	    font-size: 15px;
	} 
.select select::-ms-expand {
            display: none;
}
.select select:hover,
.select select:focus {
       color: #d2dae1;
	
}
.select select:disabled {
       opacity: 0;
       pointer-events: none; 
 
}  
.select select option:checked,
.select select option:hover {
   color:#d2dae1; 
}
/* HIGHLIGHTER ================================== */
.select-highlight {
	position: absolute;
	height: 60%;
	width: 100px;
	top: 20%;
	left: 0; 
	pointer-events: none;
	opacity: 0.5;

}
 select.sloption{background: #d2dae1; color: #fff;}
/******/
/*end input*/ 
 
.submit {
	  /*width: auto;
	  background: #00514b;
	  color: #fff;
	  font-weight: 800; 
	  font-size: 22pt;
	  padding: 0px; 
	  width: 200px;
	  cursor: pointer; 
	  border: 0;
	  -moz-transition: all 0.3s;
	  -webkit-transition: all 0.3s;
	  -o-transition: all 0.3s;
	  -ms-transition: all 0.3s;*/
	 width: auto;
	 background: #ffffff;
	 padding: 0 110px;
     cursor: pointer;
     border: 0;
     -webkit-transition: all 0.3s;
	 
 	font-weight: bold;
    font-size: 30px;
    /*background-image: url(images/btn-2.jpg);*/
    background-position: revert;
    background-repeat: no-repeat;
    background-size: cover;
    color: #361f5c;
  }
.submit:hover {
	color: #ffffff;
    background: #cea1f4;
	text-decoration: none;
}

  
.form-submit{padding: 30px 0 30px 0; text-align: center;} 

.visit-website{width: 100%; text-align: center; padding: 50px 0 50px 0;}
.visit-website a{ 
 width: auto; 
 font-weight: 800;
 font-family: 'DB Helvethaica X', serif;
 font-size: 20pt;  
 color: #43715a; transition: all 0.3s;
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  -ms-transition: all 0.3s;
 padding: 10px 50px;
 border: 1px solid #43715a;
background: #ebe8e1;
} 
.visit-website a:hover {background: #43715a; text-decoration: none; color: #ffffff;border: 1px solid #ffffff;}
.msg{padding-top: 10px;}
.footer{min-height: 70px; max-height: 70px; background: #6f6d72; padding:0; position: absolute; bottom: 0;}
.footer .estarpcl{ border-right: 1px #fff solid;  text-align: center; padding: 0; background: #43715a; min-height: 70px; max-height: 70px;}
.footer .estarpcl img{width: 200px; height: auto; margin: 10px 0; }
.footer .foresto{ border-right: 1px #fff solid;  text-align: center; padding: 0; background: #579374; min-height: 70px; max-height: 70px;}
.footer .foresto img{width:auto; height: 56px; margin: 7px 0; }
.footer .contact{background: #50876b; text-align: center; float: left; padding: 0; margin: 0; min-height: 70px; max-height: 70px;}
.footer .contact a{color: #ffffff; text-decoration: none; font-weight: 600; font-size: 27pt; letter-spacing: 2.5pt; line-height: 2;} 

.form-text-ty {text-align: center; padding-top: 50px; font-size:23.5pt; line-height: 27pt; color:#333;}
.logo-cont{width:100%; text-align: center; padding: 80px 0 72px 0; }
.logo-cont img{width:200px; height: auto;}

/*ThanksYou*/

.logo-cont-ty{width:100%; text-align: center; padding: 80px 0 72px 0; }
.logo-cont-ty img{width:200px; height: auto;}
.visit-website-ty{width: 100%; text-align: center; padding: 50px 0 50px 0;}
.visit-website-ty a{ 
 width: auto; 
 font-weight: 800;
 font-family: 'DB Helvethaica X', serif;
 font-size: 20pt;  
 color: #43715a; transition: all 0.3s;
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  -ms-transition: all 0.3s;
 padding: 10px 50px;
 border: 1px solid #43715a;
background: #ebe8e1;
} 
.visit-website-ty a:hover {background: #43715a; text-decoration: none; color: #fff;border: 1px solid #ffffff;}
 
@media screen and (max-width: 2260px) {  
 	.logo-cont{padding: 0px 0 52px 0;} 
	.visit-website{padding: 10px 0 50px 0;} 
    .logo-cont-ty img{width:200px; height: auto;}
}
@media screen and (max-width: 1987px) {  
 	.logo-cont{
 		/*padding: 0px 0 50px 0;*/
 		padding-top: 8%;
        padding-bottom: 10%;
 	} 
 	
	.logo-cont img{width: 300px; height: auto;}
	.visit-website a{ font-size: 16pt;}
	.form-submit{
		/*padding: 10px 0 10px 0;*/ 
		padding-top: 10%;
    	padding-bottom: 10%;
	} 
	.form-submit button {font-size: 22pt;font-weight: bold;}
}
@media screen and (max-width: 1780px) {  
	.logo-cont{ padding: 0 0 22px 0;}    
	.logo-cont img{width: 350px;}
	.visit-website{padding: 10px 0 50px 0; margin-top: 10px;}
	.visit-website a{ font-size: 18pt;}
	.form-submit{padding: 0; text-align: center;} 
	.form-submit button {font-size: 20pt;} 
}
 
  @media screen and (max-width: 1500px) {  
	form {padding: 30px;}
	.logo-cont{ padding: 0 0 25px 0;}  
	   
	.visit-website{padding: 5px 0 0 0; margin-top: 5px;}
	.visit-website a{font-size: 14pt;}
	.form-submit{
		padding: 0; 
		text-align: center;
		padding-top: 3%;
    	padding-bottom: 10%;
	} 
	.form-submit button {font-size: 16pt;}
	  
	.footer{ min-height: 50px; max-height: 50px;}
	.footer .estarpcl{min-height: 50px; max-height: 50px;}
	.footer .estarpcl img{width: 160px; height: auto; margin:0; }
	.footer .foresto{min-height: 50px; max-height: 50px;}
    .footer .foresto img{width:auto; height: 40px; margin: 5px 0; } 
	.footer .contact{padding: 0; margin: 0; min-height: 50px; max-height: 50px;}
	.footer .contact a{color: #ffffff; text-decoration: none; font-weight: 600; font-size: 20pt; letter-spacing: 2pt; line-height: 2.3; }  
	
	.register-form-info {
        border: 2px solid #ad5934;
        margin: 1%;
        padding: 0;
        border-image: linear-gradient(to right, #c95a29 0%, #d6ccad 100%) 1;
    } 
    
    
	.textline{
		font-size: 25px;
	}
	
	.footline-r{
		padding-right: 15px;
	}
}
 @media screen and (max-width: 1370px) {  
	form {padding: 10px;}
	.logo-cont{ 
		/*padding: 0 0 25px 0;*/
		padding-top: 2%;
    	padding-bottom: 8%;
	}   
	.logo-cont img{width: 250px; height: auto;}
}
 @media screen and (max-width: 1270px) {  
	form {padding: 10px;}
	.logo-cont{ padding: 0 0 15px 0;}  
	
	.form-submit button {font-size: 16pt;}  
	.visit-website a{font-size: 14pt;}  
	
	.set-text {padding-left: 25%!important;}
}
@media screen and (max-width: 1199px) { 
	.row-eq{
        display: block;
    }
    .col-eq{
      flex: unset;
    }   
  .logo-cont{margin: 30px 0 30px 0;}
  .logo-cont img{width: 180px;}
  .tb-pt{padding-top: 20px;}
  .footer {position: relative;}
  .footer .contact a{line-height: 2;} 
  .form-submit button {font-size: 20pt;}
	
  .visit-website{padding: 50px 0;}
  .visit-website a{ font-size: 18pt;}
  .register-logo {width:100%; text-align: center; padding: 50px 0 50px 0;}
  .logo{width:30%; height: auto;}  
  .logo-cont{ padding: 0 0 50px 0;} 
	
 /*thankyou*/
.ty-form { 
  background-repeat: repeat-x;
  background-position: center bottom; 
}
.ico-qtr {text-align: center;}
.ico-qtr img{width: 123px; height: 69px;}
.form-text-ty {text-align: center; padding-top: 50px; font-size:22pt;}
 
.logo-cont-ty img{width:180px; height: auto;}  

.visit-website-ty{padding: 50px 0 100px 0;}
 
.set-text {padding-left: 5%!important;}
	
}
@media screen and (max-width: 992px) {   
	.footer{ min-height: 70px; max-height: 70px;}
	.footer .estarpcl{min-height: 70px; max-height: 7px;}
	.footer .estarpcl img{width: 180px; height: auto; margin:10px 0; }
	.footer .foresto{min-height: 70px; max-height: 70px; border-right: 0;}
    .footer .foresto img{width:auto; height: 56px; margin: 7px 0; } 
	.footer .contact{padding: 0; margin: 0; min-height: 70px; max-height: 70px; border-top: 1px #fff solid;}
	.footer .contact a{color: #ffffff; text-decoration: none; font-weight: 600; font-size: 30pt; letter-spacing: 2pt; line-height: 1.8; }  
	.set-text {padding-left: 5%!important;} 
	
	.sepadding-r {
	    padding: 15px !important;
	}
	
	.textline{
		font-size: 16px;
	}
	
	.footline-r{
		padding-right: 0px;
	}
}
@media screen and (max-width: 767px) { 
.register-logo {width:100%; text-align: center; padding: 35px 0;}
.logo{width:40%; height: auto;} 
.logo-cont img{width: 150px;}	 
.logo-cont-ty {padding: 50px 0 22px 0;}	 
.visit-website-ty a{font-size: 18pt;} 	

.set-text {padding-left: 5%!important;}
 }	
 

@media screen and (max-width: 480px) {  
form { padding:30px 0; margin: 0;}  
.logo-cont{margin: 0;}  
.logo-cont img{width:130px; height: auto;} 
.footer{ min-height: 50px; max-height: 50px;}
.footer .estarpcl{min-height: 50px; max-height:50px;}
.footer .estarpcl img{width: auto; height: 40px; margin:5px 0; }
.footer .foresto{min-height: 50px; max-height: 50px; border-right: 0;}
.footer .foresto img{width:auto; height: 44px; margin: 3px 0; } 
.footer .contact{padding: 0; margin: 0; min-height: 50px; max-height: 50px; border-top: 1px #fff solid;}
.footer .contact a{color: #ffffff; text-decoration: none; font-weight: 600; font-size: 26pt; letter-spacing: 2pt; line-height: 1.4; }   
	
.logo-cont-ty img{width:130px; height: auto;}	
.form-text-ty {font-size: 20pt; padding-bottom: 50px; text-align: center;}
.form-text-ty img{width: 270px; height: auto;}

.set-text {padding-left: 5%!important;}
} 


 .b-select {
    margin: 10px 15px;
    background-color: white;
    border: 0;
    outline: none;
    font-size: 18px;
	border-bottom: 1px #fff solid;
    -webkit-appearance: none; /* for webkit browsers */
    -moz-appearance: none; /* for firefox */
    appearance: none; /* for modern browsers */
	 line-height: 3.5em;
}

/* remove default caret for ie */
.b-select::-ms-expand {
   display:none;
	}
	/*cookie warning*/
.cookiealert {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0 !important;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    border-radius: 0;
    transform: translateY(100%);
    transition: all 500ms ease-out;
    color: #fff;
        background: #0d0c2a;
        font-size: 14pt; 
        line-height: 16pt;
}

.cookiealert.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0%);
    transition-delay: 1000ms;
}

.cookiealert a {
    text-decoration: underline; color: #fad09a;
}

.cookiealert .acceptcookies {
    margin-left: 10px;
    vertical-align: baseline;
        font-size: 14pt; background: #cea36f;border-color: #cea36f;
}
@media screen and (max-width: 1199px) { 
        .cookiealert {font-size: 12pt; line-height: 14pt;}
        .cookiealert .acceptcookies {font-size: 14pt;}

}