.contianer-content {
    padding: 0 10%;
}
.wp-content .block-content {
	width: 100%;
    float: left;
    margin: 5% 0 80px;
    position: relative;
}
.wp-content .block-content>.block-content{
    margin-top: 0;
}
.wp-content .breadcrumb-block{
    background-color: #000;
    float: right;
    display: table;
}
.wp-content .breadcrumb-block span{
	font-family: 'AmnestyTradeGothicBoldCd','PromptRegular';
}
.wp-content .breadcrumb-block span a{color: #FFF;}
.wp-title-filter li{padding-right: 5vw;}
.wp-title-filter li:last-child{padding-right: 0;}
.wp-title-filter li:before, .wp-title-filter li.active:before{display: none;}
.wp-title-filter li a{
	text-transform: uppercase;
    font-size: 22px;
    color: #999999;
    padding: 10px 0;
	-webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    position: relative;
}
.wp-title-filter li a:before {
    content: '';
    width: 60px;
    height: 60px;
    display: block;
    background-color: #feed01;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    margin-top: -30px;
    margin-left: -30px;
    opacity: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    -webkit-transform: scale(.5,.5);
    -moz-transform: scale(.5,.5);
    -ms-transform: scale(.5,.5);
    transform: scale(.5,.5);
}
.wp-title-filter li.active a:before,.wp-title-filter li a:hover:before {
	opacity: 1;
	-webkit-transform: scale(1,1);
    -moz-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1);
}
.wp-title-filter li a:hover,.wp-title-filter li.active a {
	color: #000;
}
.block-type, .block-language{float: right;}
.block-type{width: 100%; margin-bottom: 5%;margin-top: 3%;}
.block-language{width: 15%;}
.block-language ul{width: 100%; float: left; list-style: none; padding: 0; margin: 0; text-align: right;}
.block-language ul li{display: inline-block; float: right;}
.block-language ul li span{
	display: inline-block;
	text-transform: uppercase;
    font-size: 22px;
    color: #999999;
    padding: 0 15px;
    cursor: pointer;
    position: relative;
}
.block-language ul li span:before{
	content: '';
	display: block;
	position: absolute;
	top: -10px;
	right: 0;
	left: 0;
	bottom: -10px;
	z-index: -1;
}
.block-language ul li span:hover, .block-language ul li span.active{color: #000;}
.block-language ul li span:hover:before, .block-language ul li span.active:before{background-color: #feed01;}

.block-jobs{
	width: 100%;
	float: left;
	margin-bottom: 30px;
}
.title-jobs{
	width: 100%;
	float: left;
	padding: 15px 60px 15px 30px;
	background-color: #fafafa;
	border: 1px solid #cccccc;
	position: relative;
	cursor: pointer;
}
.block-jobs.active .title-jobs{
	background-color: #000;
	border: 1px solid #000;
}
.title-jobs:after{
	display: inline-block;
	content: '\f107';
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    right: 30px;
    top: 50%;
    margin-top: -12px;
    font-size: 24px;
    line-height: 24px;
    color: #666;
}
.block-jobs.active .title-jobs:after{
	content: '\f106';
	color: #feed01;
}
.title-jobs h3{
    font-size: 22px;
    color: #000;
    margin: 0;
}
.block-jobs.active .title-jobs h3{
	color: #feed01;
}
.block-jobs .content-jobs{
    font-size: 14px;
    color: #333;
    width: 100%;
    float: left;
    padding: 30px 0 0;
    display: none;
}
.btn-apply{
    background: #feed01;
    color: #000;
    font-size: 14px;
    padding: 10px;
    min-width: 200px;
    text-align: center;
    margin-top: 10px;
    text-transform: uppercase;
    border: none;
}
.btn-apply.active, .btn-apply:hover{
	background: #000;
	color: #feed01;
}
.block-form{
	width: 100%;
	float: left;
    display: none;
}

.block-form h3{
	margin: 15px 0 30px;
}
.block-form form{
	width: 100%;
	float: left;
}
.block-form form ul{list-style: none; padding: 0; margin: 0; margin-left: -15px; }
.block-form form ul li{display: inline-block; width: 33.33%; float: left; padding-left: 15px; margin-bottom: 20px;}
.block-form form ul li:last-child{float: right;}
.block-form form ul li input, .contianer-content form ul li .lebal-position{width: 100%; padding: 10px 20px; border: 1px solid #ccc; outline: none;}
.block-form form ul li .lebal-position{margin-bottom: 0;}
.block-form form ul li input.btn{border: none; background-color: #000; color: #FFF; font-family: 'AmnestyTradeGothicBold','PromptSemiBold'; font-size: 16px; padding: 10px 30px; border-radius: 0; text-transform: uppercase; outline: none;}
.block-form form ul li input.btn:hover{background-color: #feed01; color: #000;}
.block-form form .required_text{display: none;}

.block-form form ::-webkit-input-placeholder{color: #ccc;}
.block-form form ::-moz-placeholder{color: #ccc;}
.block-form form :-ms-input-placeholder{color: #ccc;}
.block-form form :-moz-placeholder{color: #ccc;}

.page_th .block-form form ::-webkit-input-placeholder{font-family: 'PromptRegular';}
.page_th .block-form form ::-moz-placeholder{font-family: 'PromptRegular';}
.page_th .block-form form :-ms-input-placeholder{font-family: 'PromptRegular';}
.page_th .block-form form :-moz-placeholder{font-family: 'PromptRegular';}

.page_en .block-form form ::-webkit-input-placeholder{font-family: 'AmnestyTradeGothic';}
.page_en .block-form form ::-moz-placeholder{font-family: 'AmnestyTradeGothic';}
.page_en .block-form form :-ms-input-placeholder{font-family: 'AmnestyTradeGothic';}
.page_en .block-form form :-moz-placeholder{font-family: 'AmnestyTradeGothic';}



.block-form form .block-fileupload label{
	width: 145px; 
	height: auto; 
	padding: 10px 0;
	text-align: center;
	font-family: 'AmnestyTradeGothicBold','PromptSemiBold';
	color: #000; 
	text-transform: uppercase; 
	background-color: transparent; 
	border: 1px solid #feed01;
	background-color: #feed01;
	position: relative; 
	cursor: pointer;
    float: right;
    margin-top: -1px;
    margin-right: -1px;
    z-index: 0;
}
.block-form form .block-fileupload label:hover{background-color: #000; color: #feed01; border-color: #000;}
.block-form form input[type="file"]{position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0; cursor: pointer; z-index: 2;}
.block-form form .block-fileupload{position: relative; width: auto; float: left; cursor: pointer; width: 100%; height: 42px; border: 1px solid #ccc;}
.block-form form .block-fileupload .fileupload-name{    
    position: absolute;
    top: 0;
    right: 143px;
    left: 0;
    bottom: 0;
    line-height: 40px;
    padding: 0 15px;
    font-family: 'AmnestyTradeGothic','PromptRegular';
    opacity: 0;
}
.block-form form .block-fileupload.active .fileupload-name{opacity: 1;}
.form-clone{}
.form-clone .block-form{display: none; margin-top: 45px;}
.form-clone form{margin-bottom: 0;}

body.edit .block-form,
body.edit .block-jobs .content-jobs,
body.edit .wp-content .block-content.th .block-jobs.en,
body.edit .wp-content .block-content.th .block-jobs.en{
    display: block !important;
}

.spinner{
  width: 40px;
  height: 40px;
  background-color: #feed01;
  margin: 100px auto;
  opacity: 0;
}
.block-loading{
    width: 100%;
    float: left;
    padding: 0;
}
.block-loading.active{
    padding: 30vh 0;
}
.block-loading, .block-loading.active{
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.block-loading.active .spinner{
    opacity: 1;
    -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
    animation: sk-rotateplane 1.2s infinite ease-in-out;
}

@-webkit-keyframes sk-rotateplane {
    0% { -webkit-transform: perspective(120px) }
    25% { background-color: #feed01; }
    50% { -webkit-transform: perspective(120px) rotateY(180deg) }
    75% { background-color: #000; }
    100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
}

@keyframes sk-rotateplane {
    0%{ 
        transform: perspective(120px) rotateX(0deg) rotateY(0deg);
        -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg) 
    } 
    25%{ 
        background-color: #feed01;
    }
    50%{ 
        transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) 
    } 
    75%{ 
        background-color: #000;
    }
    100%{ 
        transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
        -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    }
}
.block-clone{
    width: 100%;
    float: left;
}
.block-clone .block-content{
    margin: 0;
}
.block-clone .block-content{
    display: none;
}
.block-clone .block-content.active{
    display: block;
}
.block-clone.en .block-jobs.th,
.block-clone.th .block-jobs.en{
    display: none;
}
.block-clone.th .block-jobs.th,
.block-clone.en .block-jobs.en{
    display: block;
}
/* Responsive */
@media(max-width: 1440px){
    .right-side .top-section {
        padding: 10px 40px;
    }
}
@media(max-width: 1366px){
    .no-edit .block-top .title-page {
        left: 5%;
    }
    .contianer-content {
        padding: 0 5%;
    }
    .work-list .img-list {
        padding-right: 0;
    }
    .work-list .title-list {
        padding-left: 30px;
    }
    .work-list .title-list h3{
        font-size: 16px;
    }
}
@media(max-width: 1200px){
    .right-side .top-section h1, .right-side .top-section h2 {
        font-size: 40px;
    }
    .right-side .top-section h1{
        margin: 0 0 20px;
    }
    .right-side .top-section p {
        margin: 0 0 30px;
    }
}
@media(max-width: 1024px){
    .wp-content .block-content .left-side,
    .wp-content .block-content .right-side{
        width: 100%;
        padding: 0;
    }
    .wp-content .block-content .left-side,
    .left-side .wp-content-left {
        margin-bottom: 40px;
    }
    .work-list .title-list h3 {
        font-size: 24px;
    }
    .contianer-content form ul li{width: 50%;}
    .wp-content .breadcrumb-block{margin: 7% 0 30px;}

}
@media(max-width: 1023px){
    .block-type, .block-language{float: left; width: 100%;}
    .block-language{margin-bottom: 45px;}
    .wp-title-filter li{margin-bottom: 45px;}
    .wp-content .block-content, .wp-content .block-content{margin-top: 0;}
}
@media(max-width: 767px){
    .contianer-content form ul li{width: 100%;}
}
@media(max-width: 550px){
    .no-edit .block-top .title-page {
        left: 0;
    }
}
@media(max-width: 480px){
    .work-list .title-list {
        padding-left: 10px;
    }
    .work-list .title-list h3 {
        font-size: 16px;
    }
    .social-block {
        width: 100%;
    }
    .social-block ul {
        margin: 20px 0;
        display: block;
    }
    .social-block span {
        margin-right: 0;
        width: 100%;
        display: block;
    }
	.wp-title-filter li {
		width: 100%;
		padding: 0;
		text-align: center;
	}
	.btn-apply{
		width: 100%;
		display: block;
	}
	.title-jobs h3 {
		font-size: 16px;
	}
}