body { font-family: "Noto Sans Thai","Poppins"; font-weight: 400; }
nav { font-family: "inter","Noto Sans Thai","Poppins"; font-weight: 600; }
h1 { font-size: 30px; font-weight: 600; }
h2 { font-size: 36px; font-weight: 600; }
h3 { font-size: 30px; font-weight: 600; }
h4 { font-size: 25px; font-weight: 600; }
.single-products h2 { font-size: 30px;}
.single-products h3 { font-size: 20px;}
.our_service-list h3{ font-size: 24px;}
.underline:before,.underline_full:before { 
background: #EC1C24; 
}
.borderbottom {
border-bottom:3px solid #EC1C24;
}
a:hover { color: #EC1C24; } .breadcrumbs span > strong.breadcrumb_last , 
.breadcrumbs span > a:hover
{ 
color:#EC1C24; 
} .archive.post-type-archive-products main .the_content .sidebar ul li:hover,
.archive.post-type-archive-products main .the_content .sidebar ul li:hover a,
.archive.post-type-archive-products main .the_content .sidebar ul li.current-menu-item ,
.archive.post-type-archive-products main .the_content .sidebar ul li.current-menu-item a,
.archive.tax-products_category main .the_content .sidebar ul li:hover,
.archive.tax-products_category main .the_content .sidebar ul li:hover a,
.archive.tax-products_category main .the_content .sidebar ul li.current-menu-item ,
.archive.tax-products_category main .the_content .sidebar ul li.current-menu-item a
{
font-family: "Noto Sans Thai","Poppins"; 
font-weight: 500;
color: #EC1C24;
}
.about-top-list {
position: relative;
background: #D93731;
border-radius: 30px;
height: 100%;
}
.about-top-list > div{
top: -10px;
right: 25px;
}
.about-top-list .img-about-top .img-about-top-box{
display: inline-block;
background: #fff;
padding: 10px;
border-radius: 50%;
margin-bottom: 20px;
overflow: hidden;
}
.about-top-list .img-about-top .img-about-top-box img{
padding:10px;
} .product-type {
background: linear-gradient(to right, #EC1C24 50%, #000  50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .5s ease-out;
color: #fff;
padding: 10px 40px;
border-radius: 20px;
font-size:1.3rem;
}
.product-type:hover {
background-position: left bottom;
}
.product_top { display: flex; flex-direction: column; align-items: center; }
.product_top .product_list 
{
max-width: 950px;
width: 100%;
border:3px solid #EC1C24;
border-radius: 20px;
background:#fff;
margin-bottom: 20px;
}
.product_top .product_list h3 { color:#EC1C24; }
.ourwork-top-img 
{
background-image:url(//debuild-thanasourcing.com/wp-content/uploads/2022/06/ourwork-banner.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
width: 100%;
height:300px;
}
.bg-sign {
margin-top: -50px;
background-image: url(//debuild-thanasourcing.com/wp-content/uploads/2022/06/bg-sign2.jpg);
background-color: white;
z-index: 1;
height: 230px;
background-repeat: repeat;
background-position: bottom;
background-size: 1188px 230px;
}
@media (min-width: 768px) {
.ourwork-top-img 
{
height:100%;
}
nav.nav_header .navbar-collapse ul > li > a:before {
background-color:#EC1C24;
}
nav.nav_header .navbar-collapse ul > li > a:hover:before {
background-color:#EC1C24; 
}
}
@media (max-width:768px) {
.product_top .product_list .btn { display: block; text-align: center; }
.widget-title { text-align: center; }
} .product-header .price {
font-size: 33px;
}
.product-contact {
border-top: 1px solid;
padding-top: 1.5rem;
}
.product-onlineshop {
display: flex;
align-items: center;
}
.shop-link a:hover {
transform: scale(1.15);
transition: transform 1.2s;
}
@media(max-width:768px) {
.product-onlineshop.icon span{
display: none;
}
}
.txt-about-top {
text-align: center;
} .btn-top {
color: #fff;
font-weight: bold;
border: 2px solid;
min-width: 250px;
padding: 15px;
border-radius: 20px;
background: linear-gradient(to right,#D93731 50%,#000 50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .5s;
}
.btn-top:hover {
color: #fff;
background-color: #D93731;
background-position: left bottom;
}
.btn-sm {
padding: 0;
display: flex;
justify-content: center;
}
.btn.btn_main_1,input.wpcf7-form-control.has-spinner.wpcf7-submit{
color: #fff;
font-size: 14px !important;
font-weight: bold !important;
background-color: #000 !important;
min-width: 200px;
padding: 15px;
border-radius: 20px;
border: none;
background: linear-gradient(to right,#D93731 50%,transparent 50%);
background-size: 200% 100%;
background-position: right bottom;
transition: all .5s;
}
.btn.btn_main_1:hover,input.wpcf7-form-control.has-spinner.wpcf7-submit:hover{
color: #fff;
background-color: #D93731;
background-position: left bottom;
} .contact-form_detail .title{
position: relative;
display: flex;
justify-content: center;
background: #dededa;
padding: 15px;
border-radius: 20px;
}
.contact-form_detail .title::before {
content: '';
position: absolute;
left: 100%;
width: 0;
height: 0;
top: 30%;
z-index: 1;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 30px solid #dededa;
} .text_underline {
padding-right:10px;
padding-left:10px;
border-bottom:2px solid #000;
}
#our_service .our_service-list {
background: #D93731;
padding:20px;
border-radius:20px;
margin:0;
height: 100%;
}
#our_service .our_service-list .img .box {
padding:10px;
border-radius:50%;
background:#fff;
max-width: 150px;
max-height: 150px;
margin: 0 auto;
}
#our_service .our_service-list .img .box img{
padding:15px;
}
#our_service .our_service-list .txt{
text-align:center;
justify-content: center;
display: flex;
flex-direction: column;
}
#missing_build {
background: #F5F4F1;
}
#managine_director .managing_director-message {
position:relative; background:#D93731; border-radius:20px; color:#fff;margin-bottom:25px; padding-top:4rem; padding-bottom:4rem; font-size:1.3rem;
}
#managine_director .managing_director-message:after {
position:absolute;
content: '';
left: 50px;
bottom: -18px;
border-top: solid 20px #D93731;
border-left: solid 20px transparent;
border-right: solid 20px transparent;
}
@media (max-width:768px){
#managine_director .managing_director-message {
padding-top:3rem; padding-bottom:3rem;
font-size:1rem;
}
} .content-blog1 {
position: relative;
background: #D93731;
border-radius: 30px;
}
.blog1-img {
background: #fff;
border-radius: 50%;
padding: 12% 17% 0% 17%;
max-width: 70%;
height: 156px;
margin: 0 auto;
}
.total {
padding: 10% 15%;
max-width: 100%;
height: 450px;
}
.container.about-top {
text-align: center;
}
.row.content-top {
justify-content: center;
}
.col-12.col-md-4.mb-6.cont1 {
padding: 20px;
}
.head-ab {
text-align: center;
margin-bottom: 3%;
}
div#metaslider_38 {
margin-bottom:7%;
}
span.brder {
border-bottom: 2px solid #D93731;
padding: 0.4% 2%;
}
h2.head-of2 {
margin: 50px 0px 25px 0px;
}
iframe.paperclip {
position: absolute;
top: -10px;
left: 76%;
}
.product-top {
background: #F5F4F1;
padding: 5% 15%;
}
.row.pd1-rowtop {
justify-content: center;
padding: 1%;
}
.col-12.col-md-4.mb-6.pd-top {
padding: 0% 5%;
}
img.img-1p {
border-radius: 50%;
border: 2px solid #D93731;
}
.blogproducttop-img {
max-width: 320px;
margin: 0 auto;
}
.col-6.col-md-6.mb-6.pd-top {
padding: 0% 5%;
}
p.subtext-pd1 {
margin: 10px 20px;
text-align: center;
}
span.brder-pd {
border-bottom: 2px solid;
padding: 0.4% 2%;
} .col-8.osv-text {
padding: 0;
}
img.img-os-1.img-fluid {
padding: 17%;
}
p.text-ab-1 {
margin: 10% 0%;
}
h3.head3-ab {
margin: 5% 0%;
}
.topblog-about-r {
position: relative;
text-align: center;
background: #D93731;
border-radius: 30px;
padding: 15%;
}
.topblog-about-r::before {
content: '';
position: absolute;
left: 10%;
width: 0;
height: 0;
border-left: 36px solid transparent;
border-right: 68px solid transparent;
transform: skew(273deg, 240deg);
clear: both;
top: 81%;
border-bottom: 7px solid #D93731;
z-index: -1;
}
.wp-container-3.wp-block-columns.row-blog-ab1 {
margin-top: 7%;
}
p.text-name1,p.text-name2 {
margin: 0;
}
.text-name {
margin: 10% 5% 5% 5%;
}
p.text-name1 {
font-weight: bold;
}
.about-1{
margin: 6% 0%;
}
.nv-page-title {
display: none;
}
.about-2 {
background: #F5F4F1;
padding: 5% 0%;
}
p.text-mb1 {
margin: 0;
font-weight: bold;
font-size: 18px;
}
.col-12.col-md-6.blog-text-ab {
padding: 0% 4% 0% 5%;
}
p.text-mb2 {
margin-bottom: 6%;
}
.about-4 {
margin: 7% 0% 2% 0%;
}
.about-4 {
text-align: center;
}
.row.inner {
background: #D93731;
border-radius: 20px;
padding: 35px 20px;
text-align: center;
}
.col-12.col-md-6.inner-color {
padding: 1% 2%;
}
.os-blog-img {
background: #fff;
border-radius: 50%;
}
img.img-os {
padding: 10%;
}
.about6 {
text-align: center;
margin: 5% 0% 4% 0%;
}
.row.pr1 {
display: flex;
align-items: center;
border-bottom: 1px solid #dedede;
} .btn-sm {
margin: 10% 0%;
}
p.sb-b {
margin: 0;
}
.container.contact-form-main {
position: relative;
}
.text-e {
width: 100%;
background: #D93731;
box-shadow: 4px 5px 10px 5px #ccc;
padding: 10%;
margin: 0 auto;
border-radius: 20px;
z-index: 10;
margin-bottom: 10%;
}
.text-c {
position: relative;
overflow: hidden;
right: 0;
width: 100%;
border-radius: 20px;
box-shadow: 4px 5px 10px 5px #ccc;
display: flex;
justify-content: center;
margin-right: 0;
margin: auto;
z-index: 1;
}
h3.head-addresst {
text-align: center;
color: white;
}
.col-1.icon-address {
padding: 0;
}
i.fas.fa-map-marker-alt {
font-size: 28px;
}
.form-cont-m1 {
position: relative;
overflow: hidden;
width: 80%;
padding: 3% 0%;
}
input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required,textarea.wpcf7-form-control.wpcf7-textarea  {
border: none;
height: 40px;
border-radius: 5px;
margin-top: 5px;
}
textarea.wpcf7-form-control.wpcf7-textarea {
height: 150px;
}
.col-9.text-i1 {
display: flex;
justify-content: center;
align-items: center;
}
label {
width: 100%;
margin: 1.5% 0%;
}
span.wpcf7-spinner { }
p.bt-sm {
text-align: center;
}
.head-cont1-page {
text-align: center;
margin-bottom: 50px;
}
.head-cont2-page {
text-align: center;
margin: 80px 0px 50px 0px;
}
iframe.map {
width: 100%;
height: 400px;
}
span.bars {
color: #000;
}
button.navbar-toggle {
justify-content: end;
} @media screen and (max-width: 991px){
.product-top {
padding: 5%;
}
p.text-ab-1 {
font-size: 14px;
}
h3.head3-ab {
font-size: 24px;
}
.col-12.col-md-6.inner-color {
padding: 1% 3%;
} }
@media screen and (max-width: 767px){ .container.contact-form-main,.container.map {
max-width: 1140px;
}
.col-12.col-md-6.imgs {
display: flex;
justify-content: center;
}
p.text-ab-1 {
font-size: 14px;
}
.col-12.col-md-6.inner-color {
padding: 1% 3%;
}
.container.about-5 {
max-width: 1140px;
}
.col-4.osv {
padding: 0;
}
.col-8.osv-text {
padding: 0px 0px 0px 10px;
}
h3.head3-ab {
font-size: 22px;
}
.product-top {
padding: 5% 5%;
}
h3.hewd-topab {
font-size: 22px;
}
.blog1-img {
padding: 15% 20% 15% 20%;
height: 100px;
}
.row.inner {
padding: 5%;
}
.order-res-first {
order:-1;
}
.total {
padding: 10% 15%;
height: 100%;
}
.topblog-about-l,.blog2-about-l {
display: flex;
justify-content: center;
}
.row.b1 {
margin: 0;
}
.topblog-about-l{
margin-bottom: 3rem;
}
}
@media screen and (max-width: 575px){
.col-12.col-md-4.mb-6.cont1 {
padding: 20px 50px;
}
.blog1-img {
padding: 6% 10% 8% 10%;
height: 150px;
max-width: 50%;
}
}
@media screen and (max-width: 512px){
h3.head3-ab {
font-size: 20px;
}
.blog1-img {
padding: 6% 10% 6% 10%;
height: 130px;
max-width: 40%;
}
.order-res-first {
order:-1;
}
.container.head-ab {
margin-top: 15%;
}
.col-12.col-md-4.mb-6.cont1 {
padding: 10px 50px;
}
.total {
padding: 9% 5%;
height: 365px;
}
button.green {
margin: 20px 0px 0px 0px;
font-size: 14px;
}
.product-top {
padding: 40px 15px;
margin-top: 10%;
}
p.subtext-pd1 {
margin: 10px 0px 20px 0px;
}
.topblog-about-r::before {
content: '';
position: absolute;
left: 11%;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 44px solid transparent;
transform: skew(92deg, 60deg);
clear: both;
top: 92%;
border-bottom: 3px solid #D93731;
z-index: -1;
}
.text-name {
margin: 10% 2% 5% 2%;
}
.about-2 {
margin-top: 10%;
padding: 8% 0%;
}
h2.blog2-about-r1 {
text-align: center;
}
.row.b1 {
padding: 0px 5px;
}
.col-12.col-md-6.inner-color {
padding: 2% 2.5%;
}
.row.inner {
text-align: left;
} }
@media (min-width: 320px) and (max-width: 400px){
.row.b1 {
padding: 5px;
}
.col-4.osv {
padding: 0;
}
.col-8.osv-text {
padding: 0px 0px 0px 20px;
}
h3.head3-ab {
font-size: 22px;
}
h2.head-two-abus {
font-size: 24px;
}
h3.head-three-abus {
font-size: 22px;
}
h2.blog2-about-r1 {
font-size: 24px;
margin-bottom: 20px;
}
p.text-mb1 {
font-size: 16px;
}
.text-name {
margin: 12% 2% 5% 2%;
}
.topblog-about-r {
padding: 10%;
}
h1.headtop-abus {
font-size: 26px;
}
.topblog-about-r::before {
content: '';
position: absolute;
left: 15%;
width: 0;
height: 0;
border-left: 0px solid transparent;
border-right: 44px solid transparent;
transform: skew(92deg, 60deg);
clear: both;
top: 92%;
border-bottom: 3px solid #D93731;
z-index: -1;
}
a.btn.btn_main_1.mt-3{
min-width: 50px !important;
font-size: 12px !important;
padding: 15px 10px;
}
.product-top {
padding: 40px 15px;
}
h2.head-of2 {
margin: 20px 0px 25px 0px;
}
h1.headone-top {
margin-top: 70px;
}
h1.headone-top {
font-size: 26px;
}
h2.head-of2 {
font-size: 24px;
}
.col-12.col-md-4.mb-6.cont1 {
padding: 10px 30px;
}
.blog1-img {
padding: 7% 10% 6% 10%;
height: 100px;
max-width: 40%;
}
.total {
height: 300px;
}
h3.hewd-topab {
font-size: 20px;
}
}
@media screen and (min-width: 767px){ .head-cont1-page {
text-align: center;
margin-bottom: 80px;
}
.head-cont2-page {
text-align: center;
margin: 100px 0px 50px 0px;
}
.topblog-about-r::before {
content: '';
position: absolute;
left: 12%;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 44px solid transparent;
transform: skew(92deg, 60deg);
clear: both;
top: 92%;
border-bottom: 3px solid #D93731;
z-index: -1;
}
}
@media screen and (min-width: 992px){
.topblog-about-r::before {
content: '';
position: absolute;
left: 12%;
width: 0;
height: 0;
border-left: 12px solid transparent;
border-right: 65px solid transparent;
transform: skew(273deg, 240deg);
clear: both;
top: 85%;
border-bottom: 7px solid #D93731;
z-index: -1;
}
.btn.btn_main_1,input.wpcf7-form-control.has-spinner.wpcf7-submit {
font-size: 20px !important;
}
.container.contact-form-main {
position: relative;
width: 1140px;
}
.text-e {
position: absolute;
top: 12%;
left: 0;
width: 400px;
background: #D93731;
box-shadow: 4px 5px 10px 5px #ccc;
padding: 5%;
border-radius: 20px;
z-index: 10;
}
.text-c {
position: relative;
overflow: hidden;
right: 0;
width: 72%;
border-radius: 20px;
box-shadow: 4px 5px 10px 5px #ccc;
display: flex;
justify-content: center;
margin-right: 0;
margin-left: auto;
z-index: 1;
}
.form-cont-m1 {
position: relative;
overflow: hidden;
width: 65%;
left: 50px;
padding: 3% 0%;
}
}