@charset "utf-8";
/* CSS Document */

body{
	  font-family: 'db_helvethaicaais_x55_regular';
	  overflow-x: hidden;
	  color:#614e48;
	  font-size:22px;
	  line-height:22px;
	  margin:0px;
	  padding:0px;
}

img {
    height: auto;
    max-width: 100%;
    vertical-align: middle;
    border: 0;
}

.green{color:#6e9900}
.green-light{color:#83b12b;}
.orange{color:#fe7043}
.yellow{color:#f9b900;}

.font20{font-size:20px;}
.font22{font-size:22px;}
.font24{font-size:24x;}
.font26{font-size:26px;}
.font28{font-size:28px;}
.font30{font-size:30px;}

h2{font-size:30px; margin-top:20px}

.margin-30{ margin:30px 0;}
.margin-top30{margin-top:30px;}
.margin-50{}


.intro{
	background:url(../img/bg-intro.jpg) no-repeat top center;
	/*background-size:cover;*/
}

.bg-inside{
	background:url(../img/bg-main.jpg) no-repeat ;
	/*background-size:cover;*/
}

.bg-thank{
	background:url(../img/bg-thank.jpg) no-repeat top left;
background-size:cover;
}

.intro-warp{
	margin-top:10%; 
	text-align:center;
	padding:0 20px;
}

.logo-inside{
	margin-top:20px;
	text-align:right; 
}

.intro-warp img{margin-bottom:20px;}


.lang{margin:0 0;}

.title{
	margin-bottom:20px; 
	font-size:36px;
	background:url(../img/title-flag.png) no-repeat;
	line-height:36px;
}
.title .selection{
	color:#fff;
	min-width:116px;
	margin-right:20px;
	}



.question{line-height:normal; margin:10px 0; }

hr{ margin:10px 0; border-bottom:dashed 1px  #CCC;}
.bt{text-align:right;}
	
.bt-th {
  display: inline-block;
  background:url(../img/bt-th.png) no-repeat center;
  width: 220px;
  height: 67px;
  padding:0px;
  margin:10px 0px;
}

.bt-th:hover {
  display: inline-block;
  background:url(../img/bt-th-act.png) no-repeat center;
  cursor:pointer;
}

.bt-en {
  display: inline-block;
  background:url(../img/bt-en.png) no-repeat center;
  width: 220px;
  height: 67px;
  margin:10px 0px;

}

.bt-en:hover {
  display: inline-block;
  background:url(../img/bt-en-act.png) no-repeat center;
  cursor:pointer;
}

.bt-next {
  margin-top:30px;
  margin-left:5px;
  display: inline-block;
  background:url(../img/bt-next.png) no-repeat center;
  width: 169px;
  height: 53px;
}

.bt-next:hover {
  display: inline-block;
  background:url(../img/bt-next-act.png) no-repeat center;
  cursor:pointer;
  background-size:100% 100%;
}

.bt-next-en {
  margin-top:30px;
  margin-left:5px;
  display: inline-block;
  background:url(../img/bt-next-en.png) no-repeat center;
  width: 169px;
  height: 53px;
}

.bt-next-en:hover {
  display: inline-block;
  background:url(../img/bt-next-act-en.png) no-repeat center;
  cursor:pointer;
  background-size:100% 100%;
}

.bt-back {
  margin-top:30px;
  margin-left:5px;
  display: inline-block;
  background:url(../img/bt-back.png) no-repeat center;
  width: 169px;
  height: 53px;
}

.bt-back:hover {
  display: inline-block;
  background:url(../img/bt-back-act.png) no-repeat center;
  cursor:pointer;
  background-size:100% 100%;
}

.bt-back-en {
  margin-top:30px;
  margin-left:5px;
  display: inline-block;
  background:url(../img/bt-back-en.png) no-repeat center;
  width: 169px;
  height: 53px;
}

.bt-back-en:hover {
  display: inline-block;
  background:url(../img/bt-back-act-en.png) no-repeat center;
  cursor:pointer;
  background-size:100% 100%;
}

.bt-confirm {
  margin-top:30px;
  margin-left:5px;
  display: inline-block;
  background:url(../img/bt-confirm.png) no-repeat center;
  width: 169px;
  height: 53px;
}

.bt-confirm:hover {
  display: inline-block;
  background:url(../img/bt-confirm-act.png) no-repeat center;
  cursor:pointer;
  background-size:100% 100%;
}

.bt-confirm-en {
  margin-top:30px;
  margin-left:5px;
  display: inline-block;
  background:url(../img/bt-confirm-en.png) no-repeat center;
  width: 169px;
  height: 53px;
}

.bt-confirm-en:hover {
  display: inline-block;
  background:url(../img/bt-confirm-act-en.png) no-repeat center;
  cursor:pointer;
  background-size:100% 100%;
}


.content-warp{margin:5% 0;}

.bg-gray{
  margin-top: -2%;
  background-color: #eeeeee;
  width: 100%;
  min-height: 200px;
  display: inline-block;
  margin-bottom: 0;
  text-shadow: 0 10px 10px rgba(255, 255, 255, 0.3);
  background-color: rgba(250, 250, 250, 1);
  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  -webkit-box-shadow: 0px 0px 16px 0px rgba(50, 50, 50, 0.2);
  -moz-box-shadow: 0px 0px 16px 0px rgba(50, 50, 50, 0.2);
  box-shadow: 0px 0px 16px 0px rgba(50, 50, 50, 0.2);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
  filter: alpha(opacity=20);
  border: 1px solid #dfdfdf\0/;
  padding:5px;
 /* behavior:url(css3pie/PIE.htc);*/
}

.bg-white{
  background-color: #ffffff;
  width: 100%;
  min-height: 200px;
  display: inline-block;
  margin-bottom: 0;
  padding: 40px 20px;
  /*text-shadow: 0 5px 5px rgba(255, 255, 255, 0.5);*/
  background-color: rgba(255, 255, 255, 01);
  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  -webkit-box-shadow: 0px 0px 6px 0px rgba(50, 50, 50, 0.3);
  -moz-box-shadow: 0px 0px 6px 0px rgba(50, 50, 50, 0.3);
  box-shadow: 0px 0px 6px 0px rgba(50, 50, 50, 0.3);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  filter: alpha(opacity=30);
  border: 1px solid #dfdfdf\0/;
  /* behavior:url(css3pie/PIE.htc);*/

}

.form-control{
	border-radius: 30px;
	font-size:22px;
	/*margin-top:10px;*/
}

.form-contact label{
	font-size:22px;
	font-weight:200;
}
/*------------------------------Select Option----------------------------------*/

select{
    padding-top:0px; 
 
    appearance: none;  
    -moz-appearance: none;

    -webkit-appearance: none;
    background: -webkit-gradient(linear, left top, left bottom, from(#4EB4F8), to(#4198DE));
    background: -webkit-linear-gradient(#4EB4F8, #4198DE);
    background: -moz-linear-gradient(top, #4EB4F8, #4198DE);
    background: -ms-linear-gradient(#4EB4F8, #4198DE);
    background: -o-linear-gradient(#4EB4F8, #4198DE);
    background: linear-gradient(#4EB4F8, #4198DE);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4EB4F8', endColorstr='#4198DE');
    zoom: 1;

}


.arrow{
    background: url(../img/select-arrow.png) right center no-repeat;
	}
	
select::-ms-expand {
    display: none;
}

select, textarea,
input[type="text"], 
input[type="password"], 
input[type="datetime"], 
input[type="datetime-local"], 
input[type="date"], 
input[type="month"], 
input[type="time"], 
input[type="week"], 
input[type="number"], 
input[type="email"], 
input[type="url"], 
input[type="search"], 
input[type="tel"], 
input[type="color"], 
.uneditable-input {
	font-family: 'db_helvethaicaais_x55_regular';
	font-size:22px;
	}

select:focus,
textarea:focus,
textarea.input_width:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
  border-color: rgba(82, 168, 236, 0.8);
  -webkit-border-radius: 20px;
     -moz-border-radius: 20px;
          border-radius: 20px;
  outline: none !important;
  outline: thin dotted \9;
  /* IE6-9 */

  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
		  /* behavior:url(css3pie/PIE.htc);*/

}
input[type="text"]{
	max-width:400px; 
	padding: 4px 20px; 
	margin-bottom: 0px;
  	margin-top: 6px;
  	height: 32px;
  	width:90%;
}

/*------------------------------Select Option----------------------------------*/

.content h1{font-size:36px;}
.content h2{font-size:30px; color:#6e9900;}

.content .flag{float:left; color:#FFF; background:url(../img/title-flag.png) no-repeat; padding:0; width:100%;}
.content .num{color:#FFF; margin-right:40px; padding-left:10px;}
.content .title{color:#614e48;}
.content .question{width:100%;}
.content{
	text-align:left;
	font-size:24px;
	}
	
/*------------------------------Radio Option----------------------------------*/
input[type=radio] + label.test{
display:inline-block;
cursor: pointer;
outline: 0; 
width: 160px;
height: 75px;
background-image: url(../img/test.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.test{background-position: 0 -77px;}

input[type=radio]{display:none;}

/*input[type=checkbox]{display:none;}*/

input[type=radio] + label.excellent{
display:inline-block;
cursor: pointer;
outline: 0; 
width: 160px;
height: 75px;
background-image: url(../img/excellent.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.excellent{background-position: 0 -77px;}

input[type=radio] + label.good{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 75px;
background-image: url(../img/good.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.good{background-position: 0 -77px;}

input[type=radio] + label.fair{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 75px;
background-image: url(../img/fair.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.fair{background-position: 0 -77px;}

input[type=radio] + label.poor{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 75px;
background-image: url(../img/poor.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.poor{background-position: 0 -77px;}

input[type=radio] + label.terrible{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 75px;
background-image: url(../img/terrible.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.terrible{background-position: 0 -77px;}

/*-----------------------------*/
input[type=radio] + label.excellentEN{
display:inline-block;
cursor: pointer;
outline: 0; 
width: 160px;
height: 75px;
background-image: url(../img/excellent_eng.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.excellentEN{background-position: 0 -77px;}

input[type=radio] + label.goodEN{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 75px;
background-image: url(../img/good_eng.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.goodEN{background-position: 0 -77px;}

input[type=radio] + label.fairEN{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 75px;
background-image: url(../img/fair_eng.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.fairEN{background-position: 0 -77px;}

input[type=radio] + label.poorEN{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 75px;
background-image: url(../img/poor_eng.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.poorEN{background-position: 0 -77px;}

input[type=radio] + label.terribleEN{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 75px;
background-image: url(../img/terrible_eng.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}
input[type=radio]:checked + label.terribleEN{background-position: 0 -77px;}

/*-----------------------------*/


input[type=radio] + label.yes{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 100px;
background-image: url(../img/yes.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}

input[type=radio]:checked + label.yes{background-position: 0 -100px;}

input[type=radio] + label.no{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 100px;
background-image: url(../img/no.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}

input[type=radio]:checked + label.no{background-position: 0 -100px;}

/*-----------------------------*/


input[type=radio] + label.yesEN{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 100px;
background-image: url(../img/yes-en.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}

input[type=radio]:checked + label.yesEN{background-position: 0 -100px;}

input[type=radio] + label.noEN{
display:inline-block;
cursor: pointer;
outline: 0;	
width: 160px;
height: 100px;
background-image: url(../img/no-en.png);
background-repeat: no-repeat;
background-position: 0 0px;
text-indent: -99999px;
}

input[type=radio]:checked + label.noEN{background-position: 0 -100px;}


/*------------------------------Radio Option----------------------------------*/

.slider{text-align:center;}
.slider-detail{ padding-top:10%; padding-left:2%;}



textarea.suggestion {
  width: 95%;
  margin-bottom: 10px;
  padding:10px 15px;
}
textarea.suggestion2 {
  width: 80%;
  margin-bottom: 10px;
  padding:10px 15px;
}

.mininum{font-size:22px; color:#aaaaaa;}

.bloc-bggray{
	padding:20px;
	margin-bottom:20px;
	
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	background: #e5e5e5;
	 /* behavior:url(css3pie/PIE.htc);*/

	}
	
.bloc-bggreen{
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	padding:20px;
	background-color:#dfedbc;
	margin-bottom:20px;
	 /* behavior:url(css3pie/PIE.htc);*/

	}
.text-thank{
	padding-top:15%;
	text-align:center;
	}

.footer{
	font-size:18px;
	margin:20px;
	text-align:center;
	width:100%;
}

.footer-main{
	font-size:18px;
	text-align:center;
	color:#000;
	background:url(../img/footer-town.jpg) no-repeat top center #7dad00;
	background-size: 100%;
	padding: 230px 0 0 10px;
}

@media (min-width: 1200px) 
{
	.col-md-2-Satisfaction
	{
		float: left;
	}
  
    .col-md-2-Satisfaction
    {
		width: 16.66666667%;
	}
}