html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;

}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
a{
    text-decoration:none;
    outline: none;
    color: #7a7a7a;
}
a:hover{color: inherit;text-decoration: none;}

body{
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    color: #8d8d8d;
    background-color: #fff;;
    font-weight: 400;
}
::selection {
    color: #fff;
    background-color: #535353;
}
::-moz-selection {
    color: #fff;
    background-color: #535353;
}
.cus-flex{
    align-items: center;
    justify-content: center;
}
button{
    border: none;
    box-shadow: none;
}

/* #Primary
================================================== */

@font-face {
    font-family:Athelas;
    src: url(/font/Athelas-Regular.ttf);
}

/* #comman
================================================== */
.title{
    text-align: center;
    margin-bottom: 40px;
}
.title h4{
    font-size: 40px;
    line-height: 1.2;
    color: #033f58;
    font-family: Montserrat;
    padding-bottom: 10px;
}
.title p{
    font-size: 16px;
    line-height: 1.63;
    color: #8d8d8d;
}
.comman-header{
    background: url(/images/home/slider.png)no-repeat;
    background-size: cover;
    background-position: top center;
    height: 450px;
    position: relative;
    margin-bottom: 80px;
}
.comman-header .txt-box{
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -36px;
    margin-left: -131px;
}
.comman-header .txt-box h2{
    font-size: 48px;
    font-weight: 700;
    line-height: 1.5;
    color: #fff;
}
.comman-hero-sec{
    position: relative;
    background: url(/images/comman-header.png) top center no-repeat;
    height: 400px;
    background-size: cover;
    margin-bottom: 80px;
}
.comman-hero-sec .txt-box{
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -332px;
    margin-top: -50px;
}
.comman-hero-sec .txt-box h2{
    font-size: 30px;
    line-height: 1.17;
    color: #fff;
    font-weight: 300;
    text-align: center;
}
.comman-hero-sec .txt-box p{
    font-size: 16px;
    line-height: 2.5;
    color: #f07c00;
    font-weight: 500;
    text-align: center;
}







/* #header
================================================== */
.affix {
    padding: 10px 0;
    background-color: #D2F0F8;;
}
header .navbar .navbar-brand img{
    height: 100px;
}
.navbar{
    box-shadow: none;
    padding: 0;
}
.navbar .navbar-brand{
    text-align: center;
    margin: 0 auto;
}
.navbar .navbar-brand h6{
    font-size: 14px;
    color: #000;
    font-weight: 600;
    text-align: center;
    padding-top: 5px;
}
.navbar .navbar-brand h4{
    font-size: 22px;
    color: #000;
}
.navbar-light .navbar-nav .nav-link{
    font-size: 15px;
    color: #000;
    padding: 15px 0px 2px;
    line-height: 1.63;
    margin: 0 12px;
}
.navbar-light .navbar-nav .nav-link:hover{
    color: #f07c00;
    font-weight: 700;
}
.navbar-light .navbar-nav .nav-link.active{
    color: #f07c00;
    font-weight: 700;
}
.navbar-light .navbar-nav .nav-link.stay{
    background-color: #e42724;
    color: #fff;
    font-size: 17px;
    padding: 10px 20px;
    border-top-right-radius: 18px;
    margin-left: 20px;
}
.navbar-light .navbar-nav .nav-link.stay span{
    padding: 0 12px 0 0;
}
.navbar-toggler{
    background-color: #fff;
    border: 1px solid #fff;
}

/* #home
================================================== */

.home .hero-sec{
    position: relative;
    background: url(/images/home/slider.png) top center no-repeat;
    background-size: cover;
    height: 750px;
    margin-bottom: 80px;
}
.home .hero-sec .txt-box{
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -285px;
    margin-top: -85px;
    text-align: center;
}
.home .hero-sec .txt-box h2{
    font-size: 50px;
    font-weight: 200;
    line-height: 1.1;
    color: #fff;
    padding-bottom: 15px;
}
.home .hero-sec .txt-box p{
    font-size: 16px;
    line-height: 1.63;
    color: #fff;
    max-width: 700px;
    margin: 0 auto;
    padding-bottom: 20px;
}
.home .hero-sec .txt-box button.contact-btn{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.44;
    color: #fff;
    border-radius: 10px;
    background-color: #f07c00;
    padding: 10px 20px;
}
.home .hero-sec .txt-box button.contact-btn:hover{
    background-color: #fff;
    color: #000;
}
.home .wlc-sec{
    margin-bottom: 50px;
}
.home .wlc-sec .box{
    height: 420px;
    text-align: center;
    margin-bottom: 30px;
    border-radius: 16px;
}
.home .wlc-sec .box .images{
    padding-bottom: 45px;
}
.home .wlc-sec .box .img-box{
    position: absolute;
    top: 40%;
    left: 50%;
    margin-left: -33px;
}
.home .wlc-sec .box h5{
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    color: #333;
    padding-bottom: 5px;
}
.home .wlc-sec .box p{
    font-size: 15px;
    line-height: 1.73;
    color: #494948;
    padding: 5px 5px 15px;
}
@media (min-width: 768px){
    .home .wlc-sec .col-md-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 28%;
        max-width: 28%;
    }
}
.home .wlc-sec .box:hover{
    background-color: #f07c00;
}
.home .wlc-sec .box:hover h5{
    color: #fff;
}
.home .wlc-sec .box:hover p{
    color: #fff;
}
.about-sec{
    margin-bottom: 80px;
}
.about-sec .txt-box h4{
    font-size: 40px;
    color: #033f58;
    font-family: Montserrat;
    padding-bottom: 15px;    
}
.about-sec .txt-box:after h4{
    border-right: 1px solid #033f58;
}
.about-sec .txt-box p{
    font-size: 16px;
    line-height: 1.63;
    color: #5a5b70;
    padding-bottom: 25px;
    max-width: 570px;
}
.about-sec .txt-box button.contact-btn{
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    border-radius: 10px;
    background-color: #f07c00;
    padding: 12px 20px;
}
.about-sec .txt-box button.contact-btn:hover{
    background-color: #033f58;
}
.director-sec{
    margin-bottom: 80px;
}
.director-sec .director-back-box{
    position: relative;
    z-index: 11111;
    border-radius: 16px;
    box-shadow: 0 2px 26px 0 rgba(0, 0, 0, 0.05);
    background-color: #fff;
    padding: 40px 60px 0px;
    margin: 0 80px;
    margin-top: -200px;
}
.director-sec .director-box{
    /*    position: relative;
        z-index: 11111;
        border-radius: 16px;
        box-shadow: 0 2px 26px 0 rgba(0, 0, 0, 0.05);
        background-color: #fff;
        padding: 40px 60px;
        margin: 0 80px;
        margin-top: -200px;*/
}
.director-sec .director-box .txt-box h4{
    font-size: 32px;
    color: #033f58;
    font-family: Montserrat;
    padding-bottom: 20px;  
}
.director-sec .director-box .txt-box h6{
    font-size: 20px;
    font-weight: 500;
    line-height: 1.3;
    color: #033f58;
    padding-bottom: 15px;  
}
.director-sec .director-box .txt-box p{
    font-size: 16px;
    line-height: 1.63;
    color: #595959;
    padding-bottom: 15px;
    max-width: 570px;
}
.director-sec .director-box .txt-box p span{
    font-weight: 700;
}
.director-sec .director-box .txt-box  p.collapse:not(.show) {
    height: 119px !important;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;  
}
.director-sec .director-box .txt-box p.collapsing {
    min-height: 42px !important;
}
.director-sec .director-box .txt-box  a.collapsed:after  {
    content: '+ Read More';
    font-size: 16px;
    color: #595959;
    text-decoration: underline;
}
.director-sec .director-box .txt-box  a:not(.collapsed):after {
    content: '- Read Less';
    font-size: 16px;
    color: #595959;
    text-decoration: underline;
}
.director-sec .owl-theme .owl-nav{
    margin-top: 25px;
}
.director-sec .owl-carousel .prev-slide{
    background: url(/images/home/left-arrow.png)no-repeat;
    height: 40px;
    width: 40px;
}
.director-sec .owl-carousel .next-slide{
    background: url(/images/home/right-arrow.png)no-repeat;
    height: 40px;
    width: 40px;
}
.service-sec{
    margin-bottom: 80px;
}
.service-sec .service-box h4{
    font-size: 48px;
    line-height: 1.5;
    color: #033f58;
}
.service-sec .service-box p{
    font-size: 18px;
    line-height: 1.67;
    color: #033f58;
    padding-bottom: 20px;
}
.service-sec .service-box .service{
    display: flex;
    align-items: start;
    margin-bottom: 18px;
}
.service-sec .service-box .service .txt{
    padding-left: 10px;
}
.service-sec .service-box .service .txt h6{
    font-size: 25px;
    line-height: 1.4;
    color: #033f58;
    font-family: Montserrat;
    font-weight: 700;
}
.service-sec .service-box .service .txt p{
    font-size: 14px;
    line-height: 1.71;
    color: #033f58;
    padding: 0;
}
.home .product-sec{
    background-color: #f07c00;
    padding: 80px 0;
    margin-bottom: 80px;
    text-align: center;
}
.home .product-sec .title h2{
    font-size: 40px;
    color: #fff;
    font-family: Montserrat;
}
.home .product-sec .pro-box{
    background-color: #e5f5ff;
    padding: 10px 10px 30px;
    border-radius: 16px;
    text-align: center;
}
.home .product-sec .pro-box p{
    font-size: 26px;
    color: #000;
    padding: 20px 0 35px;
}
.home .product-sec .pro-box a{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.44;
    color: #f07c00;
    text-decoration: underline;
    padding-bottom: 10px;
}
.home .product-sec .pro-box a:hover{
    color: #033f58;
}
.home .product-sec button{
    text-align: center;
    background-color: transparent;
    margin: 60px 0 20px;
}
.home .product-sec button.see-product a:hover{
    background-color: #033f58;
    border: none;
}

.home .product-sec button.see-product a{
    font-size: 16px;
    color: #fff;
    border-radius: 16px;
    border: solid 1px #fff;
    background-color: transparent;
    padding: 20px 35px;
}









.home .blog-sec{
    margin-bottom: 80px;
}
.home .blog-sec .title p{
    max-width: 500px;
    margin: 0 auto;
}
.home .blog-sec .blog-box img{
    padding-bottom: 15px;
}
.home .blog-sec .blog-box h4{
    font-size: 21px;
    line-height: 1.4;
    color: #033f58;
    font-family: Montserrat;
    padding-bottom: 8px;
}
.home .blog-sec .blog-box p{
    font-size: 16px;
    line-height: 1.8;
    color: #595959;
    padding-bottom: 20px;
}
.home .blog-sec .blog-box .blog-bottom a{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.44;
    color: #f07c00;
    text-decoration: underline;
}
.home .blog-sec .blog-box .blog-bottom a:hover{
    color: #033f58;
}


/* #about
================================================== */


.about .about-sec .txt-box p{
    color: #9f9fa2;
    padding-bottom: 15px;
}
.about .about-sec .txt-box h6{
    font-size: 16px;
    font-weight: 500;
    line-height: 1.63;
    color: #5a5b70;
    padding-bottom: 15px;
}
.about .quality-sec{
    padding: 40px 0;
    margin-bottom: 80px;
    background-color: #033f58;
}
.about .quality-sec .txt-box{
    text-align: center;
    border-right: 1px solid #fff;
}
.about .quality-sec .txt-box h4{
    font-size: 36px;
    line-height: 1.71;
    color: #fff;
}
.about .quality-sec .txt-box h4 span{
    padding: 0 10px;
}
.about .quality-sec .box{
    text-align: center;
    padding-bottom: 35px;
}
.about .quality-sec .box p{
    font-size: 20px;
    line-height: 1.2;
    color: #fff;
    padding: 10px 0 0;
}
.about .quality-sec .box .img-box{
    width: 88px;
    height: 65px;
    margin: 0 auto;
}
.about .vission-sec{
    margin-bottom: 80px;
}
.about .vission-sec .vission-box{
    background-color: #e8eceb;
}
.about .vission-sec .vission-box .box{
    height: 500px;
    padding: 50px 25px 50px 50px;
}
.about .vission-sec .vission-box .box.active{
    background-color: #033f58;
}
.about .vission-sec .vission-box .box.active h4{
    color: #f07c00;
}
.about .vission-sec .vission-box .box.active p{
    color: #fff;
}
.about .vission-sec .vission-box .box .img-box{
    height: 62px;
    width: 62px;
    margin-bottom: 15px;
}
.about .vission-sec .vission-box .box h4{
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
    color: #033f58;
    padding-bottom: 30px;
}
.about .vission-sec .vission-box .box p{
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    color: #525151;
}
.about .team-sec{
    margin-bottom: 60px;
}
.about .team-sec .team-box{
    height: 640px;
    border-radius: 20px;
    background-color: #f07c00;
    margin-bottom: 20px;
}
.about .team-sec .team-box .team-txt{
    padding: 30px 20px;
}
.about .team-sec .team-box .team-txt h4{
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    padding-bottom: 10px;
}
.about .team-sec .team-box .team-txt ul li{
    font-size: 16px;
    line-height: 1.5;
    color: #f5f6f6;
    display: flex;
}
.about .team-sec .team-box .team-txt ul li::before{
    content: "\2022";
    color: #f5f6f6;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: 0em;
}
.about .leader-sec{
    position: relative;
    margin-bottom: 60px;
}
.about .leader-sec .title{
    text-align: left;
}
.about .leader-sec .leader-box{
    border-radius: 20px;
    background-color: #f07c00;
    margin-bottom: 20px;
}
.about .leader-sec .leader-box .leader-txt{
    padding: 30px 20px 60px;
}
.about .leader-sec .leader-box .leader-txt h6{
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    padding-bottom: 10px;
}
.about .leader-sec .leader-box .leader-txt ul li{
    font-size: 16px;
    line-height: 1.5;
    color: #f5f6f6;
    display: flex;
}
.about .leader-sec .leader-box .leader-txt ul li::before{
    content: "\2022";
    color: #f5f6f6;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: 0em;
}
.about .leader-sec .owl-carousel .prev-slide{
    background: url(/images/home/left-arrow.png)no-repeat;
    height: 40px;
    width: 40px;
    position: absolute;
    right: 60px;
    top: -90px;
}
.about .leader-sec .owl-carousel .next-slide{
    background: url(/images/home/right-arrow.png)no-repeat;
    height: 40px;
    width: 40px;
    position: absolute;
    right: 8px;
    top: -90px;
}


/* #quality
================================================== */

.quality .quality-sec{
    margin-bottom: 80px;
}
.quality .quality-sec .title{
    margin-bottom: 80px;
}
.quality .quality-sec .title h2{
    font-size: 40px;
    line-height: 1.25;
    color: #033f58;
    max-width: 750px;
    margin: 0 auto;
    padding-bottom: 20px;
}
.quality .quality-sec .txt-box h4{
    font-size: 40px;
    color: #033f58;
    padding-bottom: 15px;
}
.quality .quality-sec .txt-box p{
    font-size: 16px;
    line-height: 1.63;
    color: #595959;
    padding-bottom: 10px;
}
.quality .partner-sec{
    margin-bottom: 80px;
}
.quality .partner-sec .title{
    margin-bottom: 20px;
}
.quality .partner-sec .partner-back{
    background: url(/images/quality/quality-2.png)no-repeat;
    background-size: cover;
    padding: 100px 0;
}
.quality .partner-sec .partner-back .txt-box{
    max-width: 800px;
}
.quality .partner-sec .partner-back .txt-box h4{
    font-size: 40px;
    color: #fff;
    font-weight: 700;
    padding-bottom: 20px;
}
.quality .partner-sec .partner-back .txt-box p{
    font-size: 16px;
    line-height: 1.63;
    color: #fff;
    padding-bottom: 10px; 
}




/* #product
================================================== */
.product .our-product-sec{
    margin-bottom: 50px;
}
.product .our-product-sec .title h2{
    font-size: 40px;
    color: #033f58;
    font-family: Montserrat;
}
.product .our-product-sec .sub-product{
    margin-bottom: 50px;
}
.product .our-product-sec .sub-product .heading{
    display: flex;
    align-items: center;
    margin-bottom: 25px;
}
.product .our-product-sec .sub-product .heading .underline{
    border-bottom: 1px solid #033f58;
    margin-left: 25px;
    width: 79%;
}
.product .our-product-sec .sub-product .heading h4{
    font-size: 40px;
    color: #033f58;
    font-family: Montserrat;
}
.product .our-product-sec .pro-box{
    border-radius: 16px;
    background-color: #e5f5ff;
    padding: 10px 10px 30px;
    text-align: center;
    margin-bottom: 30px;
}
.product .our-product-sec .pro-box img{
    padding-bottom: 20px;
}
.product .our-product-sec .pro-box p{
    font-size: 26px;
    color: #000;
    padding-bottom: 30px;
}
.product .our-product-sec .pro-box a{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.44;
    color: #f07c00;
    text-decoration: underline;
    padding-bottom: 20px;
}
.product .our-product-sec .pro-box a:hover{
    color: #033f58;
}

/* #product-detail
================================================== */
.product-modal .detail-sec .pic img{
    border: 1px solid #045273;
    border-radius: 10px;
}
.product-modal .detail-sec .pic h4{
    font-size: 22px;
    line-height: 2.22;
    color: #033f58;
    text-align: center;
}
.product-modal .detail-sec .detail-box{
    border-radius: 16px;
    background-color: #e5f5ff;
    padding: 30px 40px;
}
.product-modal .detail-sec .detail-box .txt{
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #fff;
}
.product-modal .detail-sec .detail-box .txt.bottom{
    border-bottom: none;
}
.product-modal .detail-sec .detail-box .txt h6{
    font-size: 16px;
    line-height: 3;
    color: #595959;
}
.product-modal .detail-sec .detail-box .txt p{
    font-size: 16px;
    line-height: 3;
    color: #033f58;
}
.product-modal .modal-dialog .modal-content{
    border-radius: 10px;
}
.product-modal .modal-body{
    padding: 30px 20px 40px;
    border-radius: 10px;
}
.product-modal .modal-header{
    padding: 30px 30px 0 0;
    border-bottom: none;
}
.product-modal .modal-header .close{
    padding: 0;
}
.product-modal .detail-sec .detail-box .price{
    background-color: #045273;
    font-size: 24px;
    font-weight: 600;
    line-height: 2;
    color: #fff;
    padding: 5px 20px;
    text-align: end;
    margin: 15px 0 0 0;
}



/* #stockist
================================================== */
.stockist .comman-hero-sec .txt-box{
    margin-left: -435px;
}
.stockist .stock-list{
    margin-bottom: 80px;
}
.stockist .stock-list .title{
    padding-bottom: 30px;
}
.stockist .stock-list .title h2{
    font-size: 40px;
    color: #033f58;
    font-family: Montserrat;
    padding-bottom: 8px;
}
.stockist .stock-list .title p{
    font-size: 20px;
    line-height: 1.4;
    color: #6f6d71;
    max-width: 1020px;
    margin: 0 auto;
}
.stockist .stock-list .heading h2{
    font-size: 40px;
    color: #033f58;
    font-family: Montserrat;
    margin-bottom: 25px;
    text-align: center;
}
.stockist .stock-list .accordion .point{
    margin-bottom: 25px;
}
.stockist .stock-list .accordion .header{
    background-color: rgba(231, 235, 237, 0.5);
    padding: 10px 20px;
}
.stockist .stock-list .accordion .header a.title{
    font-size: 32px;
    line-height: 1.72;
    color: #033f58;
}
.stockist .stock-list .accordion .header.collapsed:after {
    margin: 20px 10px 0 0;
    content: url(/images/down-arrow.png);
}
.stockist .stock-list .accordion .header:after {
    margin: 20px 10px 0 0;
    content: url(/images/up-arrow.png);
    float: right;
}
.stockist .stock-list .accordion .body .list-box{
    padding: 10px 20px;
    margin-bottom: 10px;
}
.stockist .stock-list .accordion .body .line{
    border-bottom: 1px solid #D1D1D1;
    margin: 0 20px 10px;
}
.stockist .stock-list .accordion .body .list-box:last-child{
    border-bottom: none;
}
.stockist .stock-list .accordion .body .list-box h4{
    font-size: 22px;
    font-weight: 600;
    line-height: 2.29;
    color: #033f58;
}
.stockist .stock-list .accordion .body .list-box h5{
    font-size: 22px;
    font-weight: 600;
    line-height: 1.75;
    color: #000000;
}
.stockist .stock-list .accordion .body .list-box p{
    font-size: 18px;
    line-height: 1.75;
    color: #0c0d0e;
}

/* #blog
================================================== */

.blog .comman-hero-sec .txt-box {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -279px;
    margin-top: -55px;
}
.blog .our-blog-sec{
    margin-bottom: 80px;
}
.blog .our-blog-sec .title h2{
    font-size: 40px;
    color: #033f58;
    font-family: Montserrat;
    padding-bottom: 8px;
}
.blog .our-blog-sec .title p{
    font-size: 20px;
    line-height: 1.4;
    color: #6f6d71;
    max-width: 700px;
    margin: 0 auto;
}
.blog .our-blog-sec .blog-box{
    margin-bottom: 40px;
}
.blog .our-blog-sec .blog-box .txt-box h4{
    font-size: 26px;
    line-height: 1.17;
    color: #033f58;
    font-family: Montserrat;
    padding-bottom: 10px;
    /*    font-weight: 600;*/
}
.blog .our-blog-sec .blog-box .txt-box p{
    font-size: 16px;
    line-height: 1.7;
    color: #595959;
    padding-bottom: 10px;
}
.blog .our-blog-sec .blog-box .txt-box button.more-btn{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.44;
    color: #fff;
    border-radius: 10px;
    background-color: #f07c00;
    padding: 10px 20px;
    margin: 20px 0;
}
.blog .our-blog-sec .blog-box .txt-box button.more-btn:hover{
    background-color: #033f58;
}
.blog .our-blog-sec .blog-box .txt-box button.more-btn a{
    color: #fff;    
}
.blog .our-blog-sec .blog-box .txt-box .txt-line{
    border-top: 1px solid #ebe9ed;
    font-size: 18px;
    line-height: 1.67;
    color: #6f6d71;
    padding: 10px 0;
    max-width: 550px;
}

/* #blog-detail
================================================== */

.blog-detail .comman-hero-sec .txt-box {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -279px;
    margin-top: -55px;
}
.blog-detail .detail{
    margin-bottom: 80px;
}
.blog-detail .detail .txt-box h4{
    font-size: 30px;
    line-height: 1.17;
    color: #033f58;
    font-family: Montserrat;
    padding-bottom: 15px;
} 
.blog-detail .detail .txt-box h6{
    font-size: 24px;
    line-height: 1.17;
    color: #000;;
    font-family: Montserrat;
    padding-bottom: 10px;
}  
.blog-detail .detail .txt-box p{
    font-size: 16px;
    line-height: 1.7;
    color: #595959;
    padding-bottom: 20px;
} 
.blog-detail .detail .txt-box .txt-line{
    border-top: 2px solid #ebe9ed;
    font-size: 18px;
    line-height: 1.67;
    color: #6f6d71;
    padding: 10px 0;
    max-width: 550px; 
}
@media (min-width: 992px){
    .blog-detail .detail .txt-box .bottom-pic{
        position: absolute;
        bottom: 0px;
    }
}

/* #career
================================================== */

.career .comman-hero-sec .txt-box{
    margin-left: -420px;
    margin-top: -72px;
}
.career .career-detail{
    margin-bottom: 80px;
}
.career .career-detail .txt-box h4{
    font-size: 44px;
    font-weight: 700;
    line-height: 1.2;
    color: #595959;
    padding-bottom: 20px;
}
.career .career-detail .txt-box p{
    font-size: 16px;
    line-height: 1.63;
    color: #595959;
    padding-bottom: 10px;
    max-width: 590px;
}
.career .career-form{
    margin-bottom: 80px;
}
.career .career-form .floating-form{
    border-radius: 16px;
    background-color: #e5f5ff;
    padding: 80px 120px 50px;
}
.career .career-form .floating-form button.submit-btn{
    font-size: 18px;
    font-weight: 500;
    line-height: 1.44;
    color: #fff;
    border-radius: 10px;
    background-color: #f07c00;
    padding: 10px 20px;
    width: 100%;
}
.career .career-form .floating-form button.submit-btn:hover{
    background-color: #033f58;
}
@media (min-width: 768px){
    .career .career-form .floating-form .col-md-5 {
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 45.666667%;
        max-width: 45.666667%;
    }
}
.career .career-form .floating-form .form-control{
    font-size: 18px;
    font-weight: 500;
    color: #f07c00;
    border-radius: 10px;
    border: solid 1px #000;
    background-color: #fff;
    text-align: center;
}
.career .career-form .floating-form .form-control:hover{
    background-color: #f07c00;
    color: #fff;
    border: none;
}
.career button input[type=file]::-webkit-file-upload-button {
    display: none;
}

.career button input[type=file]::file-selector-button {
    display: none;
}











/* #submit-form
========================================== */

input {
    border-top-style: hidden;
    border-right-style: hidden;
    border-left-style: hidden;
    border-bottom: 1px solid #bbbbbb;
    width: 100%;
}
textarea{
    border-top-style: hidden;
    border-right-style: hidden;
    border-left-style: hidden;
    border-bottom: 1px solid #bbbbbb;
    width: 100%;
}
.floating-label {
    position: relative;
    margin-bottom: 30px;
}
.floating-input, .floating-select {
    font-size: 24px;
    padding: 20px 17px 2px 0px;
    display: block;
    width: 100%;
    height: 48px;
    background: transparent; 
    color: #0d0e0c;
    font-weight: 600;
}
.floating-input:focus, .floating-select:focus {
    outline: none;
}
.floating-input:disabled{
    background-color: #fff6bd;
}
.floating-form .floating-label label {
    color: #5a524c;
    font-size: 22px;
    position: absolute;
    pointer-events: none;
    top: 13px;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}
.floating-input:focus ~ label, .floating-input:not(:placeholder-shown) ~ label {
    top: -5px;
    font-size: 18px;
    color: #5a524c;
    margin-top: 0; 
}
.floating-select:focus ~ label, .floating-select:not([value=""]):valid ~ label {
    top: -5px;
    font-size: 18px;
    color: #5a524c;
}
/* active state */
.floating-input:focus ~ .bar:before, .floating-input:focus ~ .bar:after, .floating-select:focus ~ .bar:before, .floating-select:focus ~ .bar:after {
    width: 50%; 
}
.floating-textarea {
    min-height: 150px;
    max-height: 260px;
    overflow: hidden;
    overflow-x: hidden;
    padding-top: 20px;
    line-height: 20px;
    margin-bottom: 50px;
}
/* highlighter */
.highlight {
    position: absolute;
    height: 50%;
    width: 100%;
    top: 15%;
    left: 0;
    pointer-events: none;
    opacity: 0.5; 
}
/* active state */
.floating-input:focus ~ .highlight, .floating-select:focus ~ .highlight {
    -webkit-animation: inputHighlighter 0.3s ease;
    -moz-animation: inputHighlighter 0.3s ease;
    animation: inputHighlighter 0.3s ease; 
}
.calendly-badge-widget{
    display: inline-table !important;
}


/* #contact
================================================== */

.contact .contact-detail{
    margin-bottom: 80px;
}
.contact .contact-detail .txt-box h6{
    font-size: 22px;
    line-height: 1.59;
    color: #595959;
    padding-bottom: 50px;
    max-width: 425px;
}
.contact .contact-detail .txt-box .txt{
    padding-bottom: 25px;
}
.contact .contact-detail .txt-box .txt h4{
    font-size: 35px;
    line-height: 0.8;
    color: #033f58;
    padding-bottom: 10px;
}
.contact .contact-detail .txt-box .txt h6{
    font-size: 20px;
    font-weight: 700;
    line-height: 1.75;
    color: #f07c00;
    padding-bottom: 0;
}
.contact .contact-detail .txt-box .txt p{
    font-size: 20px;
    line-height: 1.5;
    color: #595959;
    padding-bottom: 5px;
}
.contact .contact-detail .txt-box .txt a{
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    color: #033f58;
    text-decoration: underline;
}
.contact .contact-detail .txt-box .txt a:hover{
    color: #f07c00;
}
.contact .contact-detail .txt-box .txt h5{
    font-size: 20px;
    font-weight: 600;
    line-height: 1.05;
    color: #595959;
    padding: 10px 0 10px 0;
}

.contact .contact-form{
    background-color: #f07c00;
    padding: 80px 0 110px;
}
.contact .contact-form .txt-box h4{
    font-size: 44px;
    font-weight: 700;
    line-height: 1.14;
    color: #fff;
    padding-bottom: 10px;
}
.contact .contact-form .txt-box p{
    font-size: 22px;
    line-height: 1.60;
    color: #fff;
}
.contact .contact-form .floating-form button.submit-btn{
    position: absolute;
    right: 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.44;
    color: #000;
    border-radius: 10px;
    background-color: #fff;
    padding: 10px 20px;
}
.contact .contact-form .floating-form button.submit-btn:hover{
    background-color: #033f58;
    color: #fff;
}

/* #submit-form
========================================== */

.contact input {
    border-top-style: hidden;
    border-right-style: hidden;
    border-left-style: hidden;
    border-bottom: 1px solid #ebe5db;
    width: 100%;
}
.contact textarea{
    border-top-style: hidden;
    border-right-style: hidden;
    border-left-style: hidden;
    border-bottom: 1px solid #ebe5db;
    width: 100%;
}
.contact .floating-label {
    position: relative;
    margin-bottom: 30px;
}
.contact .floating-input, .floating-select {
    font-size: 24px;
    padding: 20px 17px 2px 0px;
    display: block;
    width: 100%;
    height: 48px;
    background: transparent; 
    color: #fff;
    font-weight: 600;
}
.contact .floating-input:focus, .floating-select:focus {
    outline: none;
}
.contact .floating-input:disabled{
    background-color: #fff6bd;
}
.contact .floating-form .floating-label label {
    color: #fff;
    font-size: 18px;
    position: absolute;
    pointer-events: none;
    /*    top: 13px;*/
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}
.contact .floating-input:focus ~ label, .floating-input:not(:placeholder-shown) ~ label {
    top: -5px;
    font-size: 16px;
    color: #5a524c;
    margin-top: 0; 
}
.contact .floating-select:focus ~ label, .floating-select:not([value=""]):valid ~ label {
    top: -5px;
    font-size: 16px;
    color: #5a524c;
}
/* active state */
.contact .floating-input:focus ~ .bar:before, .floating-input:focus ~ .bar:after, .floating-select:focus ~ .bar:before, .floating-select:focus ~ .bar:after {
    width: 50%; 
}
.contact .floating-textarea {
    min-height: 150px;
    max-height: 260px;
    overflow: hidden;
    overflow-x: hidden;
    padding-top: 20px;
    line-height: 20px;
    margin-bottom: 50px;
}
/* highlighter */
.contact .highlight {
    position: absolute;
    height: 50%;
    width: 100%;
    top: 15%;
    left: 0;
    pointer-events: none;
    opacity: 0.5; 
}
/* active state */
.contact .floating-input:focus ~ .highlight, .floating-select:focus ~ .highlight {
    -webkit-animation: inputHighlighter 0.3s ease;
    -moz-animation: inputHighlighter 0.3s ease;
    animation: inputHighlighter 0.3s ease; 
}
.contact .calendly-badge-widget{
    display: inline-table !important;
}



/* #footer
================================================== */

.footer-sec{
    background-color: #033f58;
    padding: 80px 0 0;
}
.footer-sec .logo img{
    height: 130px;
}
.footer-sec .box h4{
    font-size: 22px;
    font-weight: 700;
    line-height: 1.5;
    color: #f07c00;
    padding-bottom: 10px;
}
.footer-sec .box ul li.location{
    background: url(/images/location.png)no-repeat;
    padding-left: 30px;
}
.footer-sec .box ul li.mail{
    background: url(/images/mail.png)no-repeat;
    padding-left: 30px;
}
.footer-sec .box ul li.call{
    background: url(/images/call.png)no-repeat;
    padding-left: 30px;
}
.footer-sec .box ul li{
    font-size: 16px;
    line-height: 1.5;
    color: #cfd3d7;
    padding-bottom: 10px;
    display: flex;
}
.footer-sec .box ul li:hover{
    font-weight: 600;
}
.footer-sec .box ul li a{
    color: #fff;
}
.footer-sec .box.link{
    max-width: 180px;
    margin: 0 auto;
}
.footer-sec .box.link ul li::before{
    content: "\2022";
    color: #f07c00;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: 0em;
}
.footer-sec .boxes ul{
    display: flex;
}
.footer-sec .boxes ul li{
    padding-right: 15px;
    padding-bottom: 20px;
}
.footer-sec .boxes p{
    font-size: 16px;
    line-height: 1.5;
    color: #cfd3d7;
    padding-bottom: 20px;
}
.footer-sec .box h2{
    font-size: 46px;
    line-height: 1.5;
    color: #fff;
    font-family: Montserrat;
}
.footer-sec .box p{
    font-size: 16px;
    line-height: 1.5;
    color: #cfd3d7;
    padding-bottom: 10px;
}
.footer-sec .box input{
    background-color: #045273;
    font-size: 16px;
    line-height: 1.5;
    color: #cfd3d7;
    border: none;
    padding: 8px 10px 8px 20px;
    width: 100%;
    margin-bottom: 15px;
}
.footer-sec .box input:focus{
    outline: none;
}
.footer-sec .box input::placeholder{
    color: #77808b;
    opacity: 1;
}
.footer-sec .box.social ul li.fb{
    background: url(/images/fb.png)no-repeat;
    padding: 0 0 10px 42px;
    margin-bottom: 10px;
}
.footer-sec .box.social ul li.ig{
    background: url(/images/ig.png)no-repeat;
    padding: 0 0 10px 42px;
    margin-bottom: 10px;
}
.footer-sec .box.social ul li.in{
    background: url(/images/in.png)no-repeat;
    padding: 0 0 10px 42px;
    margin-bottom: 10px;
}
.footer-sec .box.social ul li.tw{
    background: url(/images/tw.png)no-repeat;
    padding: 0 0 10px 42px;
    margin-bottom: 10px;
}
.footer-sec .box.social ul li.ws{
    background: url(/images/ws.png)no-repeat;
    padding: 0 0 10px 42px;
    margin-bottom: 10px;
}
.footer-sec .box.social ul li.ut{
    background: url(/images/ut.png)no-repeat;
    padding: 0 0 10px 42px;
    margin-bottom: 10px;
}
.footer-sec .box button.sub-btn{
    font-size: 14px;
    line-height: 1.5;
    color: #fff;
    border-radius: 8px;
    background-color: #f07c00;
    padding: 10px 20px;
}
.footer-sec .footer-bottom {
    font-size: 16px;
    line-height: 1.5;
    color: #cfd3d7;
    border-top: 1px solid #035f85;
    text-align: center;
    padding: 8px 0;
}
.footer-sec .footer-bottom a{
    color: #cfd3d7;
}


.blog .pagination {
    display: block;
    width: 75%;
    margin: 4em auto;
    text-align: center;
}
.blog .pagination:after{
    content: '';
    clear: both;
}
.blog .pagination-button{
    font-size: 18px;
    font-weight: 700;
    color: #595959;
    margin: 0 30px;
    cursor: pointer;
}
.blog .pagination-button.page-num{
    background-color: #e0f6ff;
    padding: 6px 15px;
    margin: 0 6px;
    border-radius: 50%;
}
.blog .pagination-button img{
    padding: 0 8px;
}
.blog .pagination-button.page-num:hover{
    background-color: #033f58;
    border-radius: 50%;
    color: #fdfdfd;
}
.blog .pagination-button.page-num.active{
    background-color: #033f58;
    border-radius: 50%;
    color: #fdfdfd;
}












@media (min-width: 768px){
    .home .blog-sec .col-md-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 31.333333%;
        max-width: 31.333333%;
    }
}
@media (max-width: 768px){
    .navbar .navbar-brand{
        margin: 0;
    }
    header .navbar .navbar-brand img{
        height: 80px;
    }
    .navbar-light .navbar-nav .nav-link {
        text-align: left;
    }
    .comman-hero-sec .txt-box {
        margin-left: -191px;
    }
    .comman-hero-sec .txt-box h2 {
        font-size: 24px;
    }
    .home .hero-sec .txt-box{
        margin-left: -196px;
        margin-top: -91px;
    }
    .home .hero-sec .txt-box h2{
        font-size: 40px;
    }
    .home .hero-sec .txt-box button.contact-btn{
        font-size: 14px;
        padding: 8px 15px;
    }
    .home .wlc-sec .box .img-box{
        top: 47%;
    }
    .director-sec .director-back-box {
        padding: 40px 22px;
        margin: 0px 20px;
        margin-top: -71px;
    }
    .quality .quality-sec .title h2 {
        font-size: 26px;
    }
    .quality .quality-sec .box h4 {
        font-size: 30px;
    }
    .about .leader-sec .owl-carousel .prev-slide {
        right: 58%;
        margin-right: -20px;
        bottom: -15px;
        top: auto;
    }
    .about .leader-sec .owl-carousel .next-slide {
        right: 42%;
        margin-right: -20px;
        bottom: -15px;
        top: auto;
    }
    .blog .comman-hero-sec .txt-box {
        margin-left: -191px;
    }
    .career .career-form .floating-form {
        padding: 20px;
    }
    .blog .pagination{
        width: 100%;
    }
    .blog .pagination-button img {
        padding: 0 8px;
        display: none;
    }
    .product-modal .detail-sec .detail-box .txt h6{
        font-size: 12px;
    }
    .product-modal .detail-sec .detail-box .txt p{
        font-size: 12px;
    }
    .footer-sec .box.link{
        margin: 0;
    }
    .menu-container{
        padding-bottom: 25px;
    }
}
@media (min-width: 767px) and (max-width: 1050px){
    .navbar-light .navbar-nav .nav-link{
        font-size: 10px;
        margin: 0 8px;
    }
    .home .hero-sec .txt-box {
        margin-left: -290px;
        margin-top: -105px;
    }
    .home .wlc-sec .box .img-box {
        top: 23%;
    }
    .service-sec .service-box .service .txt h6 {
        font-size: 18px;
    }
    .footer-sec .logo img {
        height: 110px;
    }
    .footer-sec .box ul li {
        font-size: 12px;
    }
    .about .vission-sec .vission-box .box{
        height: 635px;
    }
    .career .career-form .floating-form .form-control{
        height: 66px;
    }
    .footer-sec .box.link{
        margin: 0;
    }

}