/* ================
 * TV Screen col-12
   ================ */

#banner {
	background: #1b222a;
	position: relative;
}
/* ================
 * TV Screen col-12
   ================ */
/* .tv-image-bg.USDT-col-12 {
	background: #1b222a url('_1440x500-Template-bg.jpg') top center no-repeat;
} */

.body{
	font-family: Noto Sans Thai, Lato;
	font-weight:bold;
}
.USDT-col-12 .copy-title {
	font-family: Noto Sans Thai, Lato;
	color: white;
	font-size: 3em;
	text-align: center;
	line-height: 1.2em;
	background: #ff9200;
	padding: 5px;
	padding-right: 25px;
	padding-left: 25px;
	border-radius: 0.3em;
	text-shadow: 2px 2px 3px rgba(0,0,0,0.44);
}

.USDT-col-12 .copy-title-gray {
	font-family: Noto Sans Thai, Lato;
	color: white;
	font-size: 2em;
	text-align: center;
	line-height: 1.2em;
	background: #454545;
	padding: 5px;
	padding-right: 25px;
	padding-left: 25px;
	border-radius: 0.3em;
	text-shadow: 2px 2px 3px rgba(0,0,0,0.44);
}




/* .tv-image-bg.USDT-col-12 .copy-title {
	color: white;
	font-size: 4em;
	text-align: center;
	line-height: 1.2em;
} */

.tv-image-bg.USDT-col-12 .copy-sub-title {
	color: white;
	font-weight: 600;
	line-height: 1;
	font-size: 5em;
	text-align: center;
}
.tv-image-bg.USDT-col-12 .copy-desc {
	color: white;
	font-size: 2.5em;
	text-align: center;
	line-height: 1;
}

.button1 {
	font-family: Noto Sans Thai;
	background-color: #ff9200;
	font-size: 25px;
	text-decoration: none;
	border-radius: 30px;
	font-weight: 700;
	margin-right: 10px;

}

.button2 {
	font-family: Noto Sans Thai;
	background-color: #262626;
	font-size: 25px;
	text-decoration: none;
	border-radius: 30px;
	font-weight: 700;

}

.button1:hover{

	background-color: #262626;
	color: #fff!important;
    border: 1px solid #262626;
}

.button2:hover{

	background-color: #ff9200!important;
	color: #fff!important;
    border: 1px solid #ff9200;

}

.under-shadow{
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  	-webkit-box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  	-moz-box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.dashing {
    animation: dashing 2s ease-out;
    animation-iteration-count: 1;
    position: relative;
}

.dashing-1{
    animation: dashing 2s ease-out .2s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-2{
    animation: dashing 2s ease-out .5s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}
.dashing-3{
    animation: dashing 2s ease-out .8s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}
.dashing-4{
    animation: dashing 2s ease-out 1s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-5{
    animation: dashing 2s ease-out 1.3s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-6{
    animation: dashing 2s ease-out 1.7s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-7{
    animation: dashing 2s ease-out 2s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-8{
    animation: dashing 2s ease-out 2.2s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-9{
    animation: dashing 2s ease-out 2.5s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-10{
    animation: dashing 2s ease-out 2.8s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-11{
    animation: dashing 2s ease-out 3s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-12{
    animation: dashing 2s ease-out 3.3s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-13{
    animation: dashing 2s ease-out 3.6s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-14{
    animation: dashing 2s ease-out 4s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-15{
    animation: dashing 2s ease-out 4.3s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}

.dashing-16{
    animation: dashing 2s ease-out 4.5s;
    animation-iteration-count: 1;
    opacity: 0;
    animation-fill-mode: forwards;
    position: relative;
}


.microsite-footer{
	font-family: Noto Sans Thai, Lato;
}

.footer-address-bg{
	font-family: Noto Sans Thai, Lato;
}


@keyframes dashing {
    0%   {transform: translateX(-100px); opacity: 0}
    30%   {transform: translateX(-100px); opacity: 0}
    100%   {transform: translateX(0px); opacity: 1}
}

.mobile-screen{

	display: none;
}

/* ================
 * /TV Screen col-12
   ================ */

@media (max-width: 1440px) {

.USDT-col-12 .copy-title {
		font-size: 2.8em;
	}

.USDT-col-12 .copy-title-gray {
		font-size: 1.8em;
	}
    
    

.tv-image-bg.USDT-col-12 .copy-sub-title {
	font-size: 4.3em;
}
}

@media (max-width: 1350px) {
.USDT-col-12 .copy-title {
	font-size: 2.4em;
}
    
.USDT-col-12 .copy-title-gray {
	font-size: 1.4em;
}

/* .tv-image-bg.USDT-col-12 .copy-title {
	font-size: 3.5em;
} */
.tv-image-bg.USDT-col-12 .copy-sub-title {
	font-size: 4.0em;
}
.tv-image-bg.USDT-col-12 .copy-desc {
	font-size: 2.2em;
}

}

@media (max-width: 1300px) {
.USDT-col-12 .copy-title {
	font-size: 2em;
	/* background: rgba(0, 0, 0, 0.68); */
	/* padding: 5px; */
}
    
.USDT-col-12 .copy-title-gray {
	font-size: 1em;
}
    

/* .tv-image-bg.USDT-col-12 .copy-title {
	font-size: 3em;
	/* background: rgba(0, 0, 0, 0.68); */
	/* padding: 5px; */
 */
.tv-image-bg.USDT-col-12 .copy-sub-title {
	/* background: rgba(0, 0, 0, 0.68); */
	font-size: 3.5em;
	padding: 5px;
}
.tv-image-bg.USDT-col-12 .copy-desc {
	/* background: rgba(0, 0, 0, 0.68); */
	/* padding: 5px; */
	font-size: 2.2em;
}
.tv-image-bg.USDT-col-12 {
	background-position-x: -208px;
}
}

@media (max-width: 1200px) {
.USDT-col-12 .copy-title {
		font-size: 2.3em;
	}
    
.USDT-col-12 .copy-title-gray {
		font-size: 1.3em;
	}
    
/* .tv-image-bg.USDT-col-12 .copy-title {
	font-size: 2.5em;
} */
.tv-image-bg.USDT-col-12 .copy-sub-title {
	font-size: 3.2em;
}
.tv-image-bg.USDT-col-12 .copy-desc {
	font-size: 1.5em;
}
}

@media (max-width: 720px) {

	.USDT-col-12 .copy-title {
		font-size: 1.4em;
	}
    
	.USDT-col-12 .copy-title-gray {
		font-size: 1em;
	}

	.copy-mobile {
		margin-top:120px;

	}

	.desktop-screen {

		display: none;
	}

	.mobile-screen .button1{

		margin-bottom: 10px;
	}

	.mobile-screen{

		display: contents;
	}


}

@media (max-width: 560px) {

	.USDT-col-12 .copy-title {
		font-size: 1.4em;
	}
    
	.USDT-col-12 .copy-title-gray {
		font-size: 1em;
	}

	.copy-mobile {
		margin-top:120px;

	}

	.desktop-screen {

		display: none;
	}

	.mobile-screen .button1{

		margin-bottom: 10px;
	}

	.mobile-screen{

		display: contents;
	}


}

@media (max-width: 465px) {

	.USDT-col-12 .copy-title {
		font-size: 1.2em;
	}
    
	.USDT-col-12 .copy-title-gray {
		font-size: 1em;
	}

	.copy-mobile {
		margin-top:120px;

	}

	.desktop-screen {

		display: none;
	}

	.mobile-screen .button1{

		margin-bottom: 10px;
	}

	.mobile-screen{

		display: contents;
	}

}

@media (max-width: 415px) {

	.USDT-col-12 .copy-title {
		font-size: 1.2em;
	}

	.USDT-col-12 .copy-title-gray {
		font-size: 1em;
	}
    
	.copy-mobile {
		margin-top:120px;

	}

	.desktop-screen {

		display: none;
	}

	.mobile-screen .button1{

		margin-bottom: 10px;
	}

	.mobile-screen{

		display: contents;
	}

}

@media (max-width: 340px) {

	.USDT-col-12 .copy-title {
		font-size: 1.2em;
	}
    
	.USDT-col-12 .copy-title-gray {
		font-size: 1em;
	}

	.copy-mobile {
		margin-top:120px;

	}

	.desktop-screen {

		display: none;
	}

	.mobile-screen .button1{

		margin-bottom: 10px;
	}

	.mobile-screen{

		display: contents;
	}

}