body{font-family: "Montserrat", sans-serif;font-weight: 400;font-size: 14px;color:#282828;font-optical-sizing: auto;font-style: normal;}
a {text-decoration:none;-webkit-transition: all 0.3s linear;-o-transition: all 0.3s linear;transition: all 0.3s linear;}

.themeprime {background-color: #085463;}
.themelight {background-color: #e1e8ea;}
.boxshedow {box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);}
.rounded {border-radius: 8px;}

a.logo {display: inline-block;background-color: #fff;padding: 6px 12px 10px 12px;transition: all 0.3s linear;border-radius: 0px 0px 12px 12px;}
a.logo img{max-height:95px;transition: all 0.3s linear;}

.navvi .navbox {display: block;transition: all 0.5s linear;margin-top: 34px;}
.navvi .navbox a {display: inline-block;text-align: left;margin-left: 30px;color:#c9e4e9;font-weight:400;font-size: 13px;letter-spacing: 0.25px;position: relative;}
.navvi .navbox a::before {width: 0px;height: 2px;left: 0px;bottom:-6px;position: absolute;content: '';transition: all 0.3s linear;border-radius: 12px;background-color: #70b8c7;}
.navvi .navbox a:hover{color: #fff;}
.navvi .navbox a:hover::before {width: 100%;}

.navvi .navbox a.lang {position: relative;z-index: 0;padding: 0px 9px;font-weight: 500;font-size: 12px;color: #fff;transition: all 0.3s linear;}
.navvi .navbox a.lang::before {position: absolute;left: 0px;top:-35px;width: 100%;height: 6px;background-color:#fff;content: '';z-index: -1;border-radius: 0px 0px 5px 5px;transition: all 0.3s linear;}
.navvi .navbox a.lang:hover {color: #0a4753;}
.navvi .navbox a.lang:hover::before {background-color: #fff;height: 58px;}

.stickynav {box-shadow: 0px 1px 3px 2px rgba(0,0,0,0.1);background-color: #fff;}
.stickynav a.logo {padding: 6px 0px 5px 0px;border-radius: 0px;background-color: unset;}
.stickynav a.logo img{max-height:50px;}
.stickynav .navbox {margin-top: 20px;}
.stickynav .navbox a{margin-left: 20px;color:#103a43;}
.stickynav .navbox a:hover {color:#000}
.stickynav .navbox a::before {height: 1px;bottom: -3px;}
.stickynav .navbox a.lang {color:#103a43;}
.stickynav .navbox a.lang::before {top:-22px;}
.stickynav .navbox a.lang:hover::before {height: 50px;}


/**Hero*/
.hero {box-sizing:border-box;overflow:hidden;}
.hero .heroslide {display:block;height: 690px;padding-top:460px;}
.hero .heroslide h1 {font-size: 18px;font-weight:400;color: #e1e8ea;line-height:44px;text-shadow: 1px 1px 5px 8px rgba(0,0,0,0.8);position: relative;}
.hero .heroslide h1 span {font-family: "Kanit";font-size: 40px;font-weight:400;color: #e1e8ea;line-height:48px;display: block;
text-shadow:
        0 2px 4px rgba(0,0,0,0.8),
        0 8px 20px rgba(0,0,0,0.6);
}

.hero .one {background: url(../images/hero/1.jpg) no-repeat center center;background-size: cover;}
.hero .two {background: url(../images/hero/2.jpg) no-repeat left center;background-size: cover;}
.hero .tre {background: url(../images/hero/3.jpg) no-repeat left center;background-size: cover;}

.txcss h2  {font-family: "Kanit";color:#141617;font-size: 34px;font-weight:600;} 
.txcss h5  {font-family: "Kanit";color:#0b353e;font-size: 20px;font-weight:500;} 
.txcss p {color:#4d5557;font-size: 14px;font-weight: 500;line-height: 22px;letter-spacing: 0.25px;} 

.prodbg {background-color: #e1e8ea;padding:45px 0px 60px 0px;}
.prodbg h1 {font-family: "Kanit";color:#000;font-size: 44px;font-weight: 500;} 
.prodbg h2 {font-family: "Kanit";color:#000;font-size: 20px;font-weight: 500;} 
.prodbg p {color:#000;font-size: 14px;font-weight: 400} 
.prodbg p.make {font-family: "Kanit";letter-spacing: 0.5px;} 
.prodbg a {display: inline-block;padding:3px 15px 4px 15px;border-radius: 30px;border:solid 1px #103a43;color:#103a43;font-weight: 600;}
.prodbg a:hover {background-color: #103a43;color:#ffffff;}

.proditems {left:0px;width: 115%;padding: 8px 0px;}
.proditems .proditem {background-color: #fff;border-radius: 12px;margin-right: 30px;padding: 20px;overflow: hidden;margin: 16px 10px;box-shadow: 0 1px 12px rgba(0, 0, 0, 0.08);}
.proditems .proditem img {transition: all 0.3s linear;}
.proditems .proditem:hover img{transform: scale(1.15);} 

.brandbox {overflow: hidden;position: relative;display: block;border-top:solid 1px #c5d3d6;background-color: #e1e8ea;}
.brandslider {box-sizing:border-box;overflow:hidden;}
.brandslider .branditem {display:block;padding:0px 24px;margin:0px;transition: all 0.3s linear;border-right:solid 1px #c9d9dc;}
.brandslider .branditem img{display: block;width:100%;transition: all 0.3s linear;margin: auto;}
.brandslider .branditem:hover {background-color: #fff;}
.brandslider .branditem:hover img{transform: scale(1.2);}


.imgbox {position: relative;background-color: #fff;border:solid 1px #e8e8e8;border-radius: 12px;transition: all 0.3s linear;height: 100%;}
.imgbox .txcounter {position: absolute;left: -1px;top:0px;width: 40px;border-top-left-radius: 12px;height: 50px;padding-top:10px;background-color: #0b353e;transition: all 0.3s linear;overflow: hidden;color:#fff;font-size: 20px;font-weight: 400;text-align: center;z-index: 0;}
.imgbox .txstyle {padding:30px 20px 20px 60px;position: relative;z-index: 1;}
.imgbox .txstyle h5 {font-family: "Kanit";color:#0b353e;font-size: 20px;font-weight:500;} 
.imgbox:hover .txcounter {left: 0px;top:0px;height: 100%;padding-top: 10px;border-bottom-left-radius: 12px;}




.cta {background: url(../images/carbg.jpg) no-repeat center center;background-size: cover;padding:140px 0px 120px 0px;}
.cta h2 {font-family: "Kanit";color:#fff;font-size: 38px;font-weight: 400;line-height: 48px;letter-spacing: 0.25px;} 
.cta p {color:#98b4b7;font-size: 14px;font-weight: 400;line-height: 24px;} 

.shed  {padding:30px 30px 16px 40px;}
.shed p {font-size: 14px;font-weight: 450;letter-spacing: 0.25px;}
.shed p.head {font-family: "Kanit";font-size: 18px;font-weight: 400;}

.shed_00 {background-color: #F5FAFB;}
.shed_01 {background-color: #98b4b7;}
.shed_02 {background-color: #5E9199;}
.shed_03 {background-color: #0a4753;}

.shed_01 p, .shed_01 p.head {color:#fff}
.shed_02 p, .shed_02 p.head {color:#dbe9ec}
.shed_03 p {color:#8eb1b7}
.shed_03 p.head {color:#b5dce2}


.contact-section {background-color: #0a4753;}
.contact-section p {font-size: 14px;font-weight: 450;letter-spacing: 0.25px;color:#8eb1b7}
.contact-section p.head {font-family: "Kanit";font-size: 22px;font-weight: 300;color:#b5dce2}
.contact-section p.subhead{font-family: "Kanit";font-size: 18px;font-weight: 300;color:#b5dce2}
.contact-section a {display: block;font-size: 14px;font-weight: 450;letter-spacing: 0.25px;color:#8eb1b7;}
.contact-section a:hover {color:#fff;text-decoration: underline;}

.ftr {background-color: #0a4753;}
.ftr p {color:#afd3da;font-size: 12px;font-weight: 450;letter-spacing: 0.5px;margin: 20px 0px 18px 0px;}