
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@font-face {
    font-family: Mont-Light;
    src: url(../fonts/Mont-Light.ttf);
}
@font-face {
    font-family: Mont-Regular;
    src: url(../fonts/Mont-Regular.ttf);
}
@font-face {
    font-family: Mont-Bold;
    src: url(../fonts/Mont-Bold.ttf);
}


body{ padding: 0; font-family: Mont-Regular !important; color: #000; }
p{ font-size: 19px;}
.header{background: #1E1E1E; position: relative;}
.navbar{ padding: 15px 25px; background: none;     z-index: 2;}
.header::after{ content:'' ; position:absolute; width: 50%; right: 0; top: 0; height: 100%; background-color: #1B8D20 ; }
.nav-link{ font-size: 17px; color: #fff; text-transform: uppercase; padding: 5px 12px !important; border: 2px solid transparent; line-height: normal !important;}
.nav-link:hover{ color: #fff;}
.nav-link.active{ border: 2px solid #fff; color: #fff !important;}
.navbar-nav{ margin: 0 auto;}
.header .form-control{ background-color: transparent; border: 2px solid #000; border-radius: inherit; font-weight: 800; padding: .375rem .75rem;}
.header .form-control::placeholder{ color: #000;}
.banner{ background: #000;}
.text-block{ margin-left: 36%;}
.banner-text{ font-family: 'Montserrat', sans-serif; text-transform: uppercase; font-size: 90px; letter-spacing: 20px; color: #fff;     z-index: 1; position: relative; line-height: initial;}
.first-text{ font-weight: bolder; border-bottom: 2px solid #1B8D20;}
.middle-text{ font-weight: 300;}
.third-text{ font-weight: 300;color: #00FF0B;}
.vector{ background: #fff; height: 1px; width: 25px;}
.vector1{ background: #ffffff; height: 1px; width: 25px;}
.banner-para{ color: #fff; font-size: 26px; margin-top: 20px;}
.bg-gray{ background: #1E1E1E;}
.bg-green{ background: #1B8D20;}
.text-padding{ padding: 0 25px;}
.btn-border{ color: #fff; border-bottom: 2px solid #BB0B0B; text-decoration: none; text-transform: uppercase; padding-bottom: 15px; font-size: 24px; }
.social{ display:block; margin-top: 7%;}
.social a{ color: #8E8E8E; text-decoration: none; margin-right: 35px; font-size: 24px;}
.m-left30{ margin-left: 30%;}
.border1{ width: 45px; height: 100%; background: #0A600E; position: absolute; left: -45px; top: 0;}
.border2{ width: 45px; height: 100%; background: #063E09; position: absolute; left: -90px; top: 0;}
.overview-section{ padding-top: 100px; background: #1E1E1E; position: relative; color: #fff;}
.overview-border1{ position: absolute; height: 100%; width: 145px; background: #545454; left: 0; top: 0;}
.overview-border2{ position: absolute; height: 100%; width: 145px; background: #3F3F3F; left: 145px; top: 0;}
.overview-border3{ position: absolute; height: 100%; width: 145px; background: #2C2C2C; left: 290px; top: 0;}
.overview-border4{position: absolute; height: 50%; width: 45px; background: #0A600E; right: 0; top: 0;}
.overview-border5{position: absolute; height: 50%; width: 45px; background: #1B8D20; right: 0; bottom: 0;}
.overview-border6{ position: absolute; height: 100%; width: 145px; background: #1B8D20; right: 0; top: 0;}
.overview-border7{ position: absolute; height: 100%; width: 145px; background: #0A600E; right: 145px; top: 0;}
.overview-border8{ position: absolute; height: 100%; width: 145px; background: #063E09; right: 290px; top: 0;}
.overview-section img{ position: relative; z-index: 2;}
.title-text{ font-family: 'Montserrat', sans-serif; text-transform: uppercase; font-size: 59px; letter-spacing: 20px; color: #fff; line-height: initial;}
.t-first-text{ font-weight: bolder; border-bottom: 2px solid #1B8D20;}
.t-middle-text{ font-weight: 300; color: #00FF0B;}
.overview-section h3{ font-weight: bold;}
.plr-25{ padding-left: 70px; padding-right: 70px;}
.quality-section{ background-color: #1B8D20;}
.quality-section img{ width: 100%;}
.quality-top{ background-color: #1E1E1E; padding: 80px 100px;}
.quality-border1{ height: 45px; width: 100%; background-color: #2C2C2C;}
.quality-border2{ height: 45px; width: 100%; background-color: #3F3F3F;}
.quality-border3{ height: 45px; width: 100%; background-color: #545454;}
.quality-bottom{padding: 80px 100px;}
.quality-bottom p {
    color: #fff;
}
.belt-section{ padding: 100px 0; background: #1E1E1E;}
.belt-section h1{ font-family: 'Montserrat', sans-serif; text-transform: uppercase; letter-spacing: 15px; color: #1B8D20; line-height: initial; font-weight: bolder;}
.belt-section h1 span{ color: #fff;}
.m-left7{ margin-left: 7%;}
.belt-section p{ color: #8E8E8E; font-size: 28px;}
.belt-color{ background-color: #545454;}
.tags{ text-align: center;}
.tags p{ font-size: 28px; color: #fff; text-transform: uppercase;}
.green-belt{ background: #1B8D20; padding:50px; }
.green-belt h1{ font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 15px;
    color: #fff;
    line-height: initial;
    font-weight: bolder;}
    .green-belt h1 span{ color: #000;}
.dark-green{height: 45px; width: 100%; background-color: #063E09;}
.light-green{height: 45px; width: 100%; background-color: #0A600E;}
.bottom-green{ height: 45px; width: 100%; background-color: #1B8D20}
.pt-100{ padding-top: 100px;}
.pb-100{ padding-bottom: 100px;}
.box{ display: flex; align-items: center;}
.box p{ margin-bottom: 0; padding-left: 15px; color: #fff;}
.grey-border{ position: absolute; height: 100%; width: 125px; background: #3F3F3F; right: 0; top: 0;}
.img-belt{ background: url(../images/bg-img.jpg); background-size: cover; padding: 100px 0;}
.img-belt h1{ font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 15px;
    color: #fff;
    line-height: initial;
    font-weight: bolder;}
.img-belt p{ color: #fff; font-size: 27px; margin-bottom: 0;}
.form-section{ padding: 0 120px;}
.form-section h1 {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 20px;
    color: #fff;
    line-height: initial;
    font-weight: bolder;
    text-align: center;
}
.form-section h3{ font-weight: bold; color: #fff;}
.form-control{ background: transparent; border-radius: inherit; border-color: #1B8D20; padding: 12px;}
.form-control::placeholder{ color: #fff;}
.form-control:focus{ outline: none; background-color: transparent; box-shadow: none; border-color: #fff;}
.logo-img{ position: absolute; bottom: 20%; left: 15%;}

.footer{ background: #1B8D20; padding: 70px 0; position: relative;}
.footer h1{  color: #1E1E1E; margin-bottom: 70px; font-family: Mont-Bold; }
.footer h1 span{ font-family: Mont-Regular; color: #fff;}
.footer p a{ color: #000;}
.footer .social { text-align: right; }
.footer .social a{ color: #1E1E1E;}
.back-top{ background-color: #1E1E1E; border-radius: 5px; padding: 10px; width: 50px; height: 50px; position: absolute; top: 0; right: 20%;}
.back-top i{ font-size: 40px; color: #fff; line-height: 30px;}
.contact .title-text{ font-size: 90px;}
.color-white{ color: #fff !important;}

.grey-border1 { position: absolute; height: 100%; width: 30px; background: #545454; right: 0; top: 0;}
.grey-border2 { position: absolute; height: 100%; width: 30px; background: #3F3F3F; right:30px; top: 0;}
.grey-border3 { position: absolute; height: 100%; width: 30px; background: #2C2C2C; right: 60px; top: 0;}
.icon-text{display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 2px solid #1E1E1E;}
.icon-text h1{ letter-spacing: inherit; color: #1E1E1E; margin-bottom: 0;}
.icon-box{ margin-bottom: 50px;}
.icon-box h3{ font-weight: bold; color: #fff;}
.icon-box p{ font-size: 17px;}
.mlr-0{ margin-right: 0; margin-left: 0;}
.product-page img{ width: 100%;}
.font-weight-bold{ font-weight: bold;}
.mont-bold{ font-family: Mont-Bold;}
.faq-border1 {  height: 45px; width: 100%; background: #545454; }
.faq-border2 {height: 45px; width: 100%; background: #3F3F3F; }
.faq-border3 { height: 45px; width: 100%; background: #2C2C2C; }
.faq-title h1 {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 15px;
    color: #fff;
    line-height: initial;
    font-weight: bolder;
}

.accordion-button::after {
    background-image: url("../images/plus.svg");
    transform: scale(1) !important;
  }
.accordion-button:not(.collapsed)::after {
    background-image: url("../images/minus.svg");
}
.accordion-item{ border-radius: inherit !important; border: none; margin-bottom: 30px; }
.accordion-button{  background: #1E1E1E !important; border-radius: inherit !important; border: none; color: #fff !important; padding:20px 50px; font-size: 19px; box-shadow: none !important;}
.card-body p{ margin-bottom: 0; color: #fff;}
.card-body{ padding: 50px;  background: #1E1E1E !important;}
.accordion-button:focus{ box-shadow: none; border: none; outline: none;}
.search{ position: absolute; right: 10px; top: 10px;}
.z-index3{ z-index: 3; position: relative;}
.plr-45 {
    padding-left: 45px;
    padding-right: 45px;
}
.color-gray{ color:#1E1E1E !important;}
.border-color-green{ border-color: #1AB721;}
.quality-section-grey{ background-color: #1E1E1E !important;}
.quality-section-grey .quality-bottom{ background-color: #1B8D20;}
.source-section{ position: relative;}
.border-top-green{ border-top: 135px solid #1B8D20;}
.pr-100{ padding-right: 100px;}
.mb-80{ margin-bottom: 80px;}
.source-border1{ position: absolute; height: 100%; width: 145px; background: #063E09; left: 0; top: 0;}
.source-border2{ position: absolute; height: 100%; width: 145px; background: #0A600E; left: 145px; top: 0;}
.source-border3{ position: absolute; height: 100%; width: 145px; background: #1B8D20; left: 290px; top: 0;}
.source-section img{ position: relative; z-index:2;}
.title-event{ width: max-content;}


@media only screen and (max-width:1600px) {
    .h3, h3 { font-size: 25px;}
    p{ font-size: 18px;}
    .title-text{ font-size: 40px;}
    .quality-bottom { padding: 40px 100px;}
    .quality-border1,.quality-border2,.quality-border3{ height: 30px;}
    .form-section { padding: 0 70px; }
    .back-top{ right: 15%;}
    .banner-text, .contact .title-text{ font-size: 70px;}
    .banner-para{ font-size: 22px;}
}

@media only screen and (max-width:1440px) {
    .banner-text{ font-size: 60px;}
    .title-text{ font-size: 45px; letter-spacing: 15px;}
    p{ font-size: 16px;}
    h3{ font-size: 20px;}
    .quality-top{ padding: 65px 50px;}
    
    .quality-bottom{ padding: 50px 50px;}
    .belt-section h1, .green-belt h1, .img-belt h1, .form-section h1, .faq-title h1{ letter-spacing: 10px; font-size: 35px;}
    .img-belt p, .belt-section p, .tags p{ font-size: 22px;}
    .plr-25 { padding-left: 35px; padding-right: 50px; }
    .quality-section .title-text.mb-5{ margin-bottom: 0 !important;}
    .grey-border{ width: 90px;}
    .form-section { padding: 0 100px; }
    .back-top{ right: 11%;}
   .title-text.title-event { width: auto; font-size: 28px; }
   .border-top-green {    border-top: 15px solid #1B8D20;}
   

    
}
@media only screen and (max-width:1366px) {
    .back-top{ right: 15%;}
    .banner-para { font-size: 20px;  }
    .text-block{ margin-left: 20%;}
    .title-text{ font-size: 40px;}
    .quality-top { padding: 50px 50px; }
    .plr-45{ padding-left: 0;}
    .contact .title-text{ font-size: 60px;}

}

@media only screen and (max-width:767px) {
.belt-section h1, .green-belt h1, .img-belt h1, .form-section h1, .faq-title h1 {
    letter-spacing: 10px;
    font-size: 25px;
}
.text-block{ margin-left: 0; padding: 15px;}
.banner-text, .contact .title-text{ font-size: 30px; letter-spacing: 10px;}
.offset-1{ margin-left: 0;}
.quality-top { padding: 50px 20px;}
.title-text { font-size: 28px; letter-spacing: 10px;}
.p20{ padding: 20px;}
.m-left30{ margin-left: 0;}
.text-padding { padding: 20px 10px;}
.overview-border1, .overview-border2, .overview-border3, .overview-border4, .overview-border5, .grey-border, .grey-border1, .grey-border2, .grey-border3, .border1, .border2, .overview-border6, .overview-border7, .overview-border8, .source-border1, .source-border2, .source-border3{ display: none;}
.green-belt{ padding: 20px;}
.plr-25 { padding-left: 10px; padding-right: 10px;}
.btn-border{ font-size: 18px;}
.quality-bottom { padding: 20px;}
.belt-section{ padding: 20px 0;}
.belt-section img{ width: 100%;}
.margin-top5{ margin-top: 3rem!important;}
.form-section { padding: 0 20px 30px;}
.overview-section{ padding-top: 50px;}
.pt-100{ padding-top: 50px;}
.pb-100{ padding-bottom: 50px;}
.footer h1 span{ display: block;}
.footer h1{ margin-bottom: 30px;}
.back-top { right: 10%;}
.dark-green, .light-green, .bottom-green{ height: 30px;}
.contact{ padding-top: 20px;}
.img-belt p, .belt-section p, .tags p{ font-size: 20px;}
.offset-2{ margin-left: 0;}
.accordion-button, .card-body{ padding: 20px;}
.navbar-nav { margin-left: 0; padding-top: 20px;}
.plr-45{ padding-left: 0; padding-right: 0;}
   .pr-100{ padding-right: 0;}
   .pt-100 {
    padding-top: 50px;
    padding-bottom: 50px;
}


}