:root{
    --color-blue-primary: #1C97BB; /*rgba(28, 151, 187, 1)*/
    --color-blue-primary-light: #83CCD9;
    --color-green-primary: #77B747; /*rgba(119, 183, 71, 1)*/
    --color-dark-primary: #231F20;

    --color-grey-dark: #A1A1A1;
    --color-grey-light: #828282;

    --color-white:#ffffff;
    --color-grey-text: #fafafa;
    --color-grey-text-2: #f2f2f2;

    --color-blue-light: #E6F0F2;
    --color-blue-dark: #344A53;

    --color-mauve: #985193;
    --color-accent-green:#1EC77E;
    --color-blue:#006D9D;

    --font-text:'Quicksand', sans-serif;
    --font-heading:'Raleway', sans-serif;

}

*,
*::before,
*::after{
    padding: 0;
    margin: 0;
    box-sizing: inherit;
}
html{
    font-size: 62.5%;
    box-sizing: border-box;
    scroll-behavior: smooth;
}

body{
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.6;
    color: var(--color-grey-text);
    font-family: var(--font-text);
}

/*Utilities*/
.py-main{
    padding: 8rem 0 !important;
}
.pb-main{
    padding-bottom: 8rem !important;
}
.mt-medium{
    margin-top: 6rem !important;
}
.mt-y{
    margin: 6rem 0 !important;
}
.mt-small{
    margin-top: 3rem !important;
}
.color-blue {
    color: var(--color-blue-primary) !important;
}
.color-dark {
    color: var(--color-blue-dark) !important ;
}
.color-grey-1{
    color: var(--color-grey-text) !important;
}
.color-grey-2{
    color: var(--color-grey-text-2) !important;
}
.bg-primary{
    background-color: var(--color-blue-primary);
}

/*Header*/
.navbar.bg-color-scroll{
    background-color: var(--color-white);
    transition: background-color .3s linear;
    box-shadow: 0 .6rem 1rem rgba(130, 130, 130, .15)
}
.navbar.bg-color-scroll .nav-link{
    color: var(--color-blue-primary) !important;
}
.navbar .navbar-brand img{
    height: 5rem;
    margin: 2rem 0;
    /* background-color: red; */
}
.navbar .nav-item .nav-link{
    padding-left: 2rem;
    padding-right: .7rem;
    font-size: 1.5rem;
    color: var(--color-grey-text);
    font-family: var(--font-text);
    font-weight: 500;

}
.navbar .nav-item .nav-link:hover{
    color: var(--color-grey-text);
}
.navbar .nav-item .nav-link::after{
    content: "";
    height: .3rem;
    width: 0;
    background-color: var(--color-green-primary);
    border-radius: 1rem;
    display: block;
    transition: all .3s ease-in;
    transform: scale(0);
    transform-origin: left;
}
.navbar .nav-item .nav-link:hover::after{
    width: 70%;
    transform: scale(1);
}
.navbar-light .navbar-nav .active>.nav-link{
    color: var(--color-grey-text);
}

.navbar-light .navbar-nav .active>.nav-link::after{
    content: "";
    height: .3rem;
    width: 70%;
    background-color: var(--color-green-primary);
    border-radius: 1rem;
    display: block;

}


.header{
    /* background-image:linear-gradient(to right bottom,rgba(52, 74, 83, .65),rgba(52, 74, 83, .65)), url(../img/header.JPG);
    background-size: cover;
    background-position: top;
    height: 95vh;
    position: relative; */
    /* background-color:rgba(52, 74, 83, .8);
    height: 90vh;
    position: relative; */
}

.header-bg-video{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;

}
.header-bg-content{
    width: 100%;
    height: 100%;
    object-fit: cover;

}
.header-textbox{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.header-text{
    text-align: center;
}
.header-text-primary{
    font-size: 3.662rem;
    font-weight: 100;
    font-family: var(--font-text);
    color: var(--color-grey-text);
    line-height: 2;
    display: block;
}
.header-text-secondary{
    font-size: 5.493rem;
    font-weight: 700;
    font-family: var(--font-heading);
    display: block;
    text-transform: uppercase;

}
.header-text-small{
    font-size: 2.344rem;
    font-family: var(--font-text);
    font-weight: 500;
    color: var(--color-grey-text-2);
    display: block;
    letter-spacing: 1px;
    /* text-transform: capitalize; */
}


.header .carousel-inner{
    height: 95vh;
    z-index: -1;
    background-position: center center;

}
.header .carousel-item::after{
    content:"";
    display:block;
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    background:rgba(52, 74, 83, .8);

}
.header .carousel-caption{
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 75%;

}
.header .carousel-indicators{
    position: absolute;
    bottom: 10%;
    left: 35%;
    transform: translate(-50%, -50%);
}
.header .carousel-indicators:hover{
    background-color: unset;
}
.carousel-header{
    font-size: 3.4rem;
    font-weight: 700;
    font-family: var(--font-heading);
    display: block;
}

.carousel-text{
    font-size: 1.875rem;
    font-family: var(--font-text);
    font-weight: 400;
    color: var(--color-grey-text-2);
    display: block;
    letter-spacing: 1px;
    width: 97%;
}


/*fact*/
.fact{
    margin-bottom: -5rem;
}
.no-gutter > [class*='col-'] {
    padding-right:0;
    padding-left:0;
}
.fact-row{
    align-items: center;

    transform: translateY(-25%);

}
.fact-card{
    text-align:center;
    padding: 2rem 2.5rem;
    border-radius: 3px;
    transition: all .3s ease-in;
    z-index: 10;
}
.fact-card:hover{
    transform: translateY(-5px);
}
.fact-card-1,
.fact-card-3{
    background-color: var(--color-blue-primary);
    box-shadow: 0 1rem 2rem rgba(28, 151, 187, .15);
    transition: all .3s;
}
.fact-card-1:hover,
.fact-card-3:hover{
    background-color: rgba(0, 109, 157, 1);
    box-shadow: 0 1.5rem 3rem rgba(0, 109, 157, .17);
}

.fact-card-2{
    background-color: var(--color-green-primary);
    box-shadow: 0 1rem 2rem rgba(119, 183, 71, .15);
    height: 28rem;
    transition: all .3s;
}
.fact-card-2:hover{
    background-color:rgba(30, 199, 126, 1);
    box-shadow: 0 1.5rem 3rem rgba(30, 199, 126,.17);
}
.fact-card-1{
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.fact-card-3{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.fact-icon{
    height: 4rem;
    width: 4rem;
    fill: rgba(250,250,250,.95);
}
.fact-heading{
    font-size: 1.740rem;
    text-transform: capitalize;
    font-family: var(--font-heading);
    font-weight: 600;
}
.fact-text{
    color: rgba(242, 242, 242, .9);
    font-size: 1.5rem;
}

/*Typography and button*/
.headings{
}
.heading-small{
    font-size: 1.6rem;
    font-weight: 600;
    display: block;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-family: var(--font-text);
    margin-bottom: 1.5rem;
}
.heading-big{
    font-size: 2.662rem;
    font-weight: 700;
    display: block;
    letter-spacing: 3px;
    /* text-transform: capitalize; */
    font-family: var(--font-heading);
    margin-bottom: 1.5rem;
}
.btn-primary{
    padding: 1rem 2rem;
    font-size: 1.5rem;
    font-weight: 500;
    font-family: var(--font-text);
    letter-spacing: 1px;
    color: var(--color-grey-text);
    background-color: var(--color-green-primary);
    border-radius: 3px;
    border-color: transparent;
    box-shadow: 0 .5rem 1rem rgba(119, 183, 71, .15);
    /* background-size: 200%; */
}
.btn-primary:hover{
    background-color:rgba(119, 183, 71,.9);
    border-color: transparent;
    /* background-color: transparent; */

}
.btn-join{
    background-color: var(--color-blue-primary);
    box-shadow: 0 .5rem 1rem rgba(28, 151, 187, .15);
}
.btn-join:hover{
    background-color: rgba(28, 151, 187, .9);
}
.btn-join-us{
    font-size: 1.875rem;
    background-color: var(--color-white);
    color: var(--color-blue-primary);
    transition: all .3s;
}
.btn-join-us:hover{
    background-color:var(--color-grey-text-2);
    color: var(--color-blue-primary);
    box-shadow: 0 .5rem 1rem rgba(130, 130, 130, .2);
    transform: translateY(-3px);
}

/*About */
.about{
    /* background-color: rgba(230, 240, 242, .1); */
}
.about-link {
    display: block;
    margin-top: 7px;
}
.about-mission{
    margin-bottom: 2rem; 
    text-align: center;
    background-color: rgba(230, 240, 242, .5);
}
.about-mission-box{
    width: 70%;
}
.about-mission-header{
    text-transform: uppercase;
    /* font-size: 2.93rem; */
    font-weight: 700;
    font-family: var(--font-heading);
}
.about-mission-text{
    /* font-size: 2rem; */
    font-weight: 500;
    margin-top: 2rem;
}
.about-textbox{
    /* padding-right: 5rem; */
}
.about-text{
    color:#555555;
    letter-spacing: 1px;
    margin-bottom: 1.5rem;

}

.about-imgbox{
    /*padding-left: 4rem;*/
    height: 45rem;
}
.about-img{
    border-radius: .6rem;
    box-shadow: 0 2rem 4rem rgba(119, 183, 71, .15) ;
    /* box-shadow: 0 2rem 4rem rgba(28, 151, 187, .1) ; */
    height: 100%;
    object-fit: cover;

}

/*Stand*/
.stand{
    background-color: var(--color-blue-primary);
}
.stand-card{
    text-align: center;
    border: 1px solid rgba(230, 240, 242, .3);
    padding: 2rem 2rem;
    height: 30rem;
}
.stand-heading{
    text-transform: capitalize;
    font-size: 2rem;
    margin-bottom: 1.7rem;
    font-family: var(--font-heading);
    font-weight: 700;
    width: 80%;
}
.stand-icon{
    margin-bottom: 2rem;
    height: 5rem;
}
.stand-text{
    color: var(--color-blue-light);
    font-size:1.650rem;
    /* font-family: var(--font-text); */
}

/*Statistics*/
.statistics{
    background-color: rgba(230, 240, 242, .1);
}
.statistics-card{
    background-color:var(--color-white) ;
    box-shadow: 0 .3rem 1rem rgba(130, 130, 130, .15);
    text-align: center;
    padding: 2.5rem 2rem;
    border-radius: .4rem;
}
.statistics-content{
    /* width: 90%; */
}
.statistics-card-1,
.statistics-card-2,
.statistics-card-3{
    position: relative;
}
.statistics-card-1::before,
.statistics-card-2::before,
.statistics-card-3::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: .4rem;
    display: block;

    border-top-left-radius: .4rem;
    border-bottom-left-radius: .4rem;
    transition: all .3s ease-in;
    transform: scaleY(1);
    transform-origin: top;
}
.statistics-card-1::before{
    background-color: var(--color-blue-primary);
}
.statistics-card-2::before{background-color: var(--color-mauve);}
.statistics-card-3::before{background-color: var(--color-green-primary);}

.statistics-card-1:hover::before,
.statistics-card-2:hover::before,
.statistics-card-3:hover::before{
    height: 0;
    transform: scaleY(0);
}
.statistics-iconbox{
    height: 10rem;
    width: 10rem;
    border-radius: 100rem;
}
.statistics-iconbox-1,
.statistics-iconbox-2,
.statistics-iconbox-3{
    position: relative;
}
.statistics-icon-1,
.statistics-icon-2,
.statistics-icon-3{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

}
.statistics-iconbox-1{ background-color:rgba(28, 151, 187, .1) ;}
.statistics-iconbox-2{ background-color:rgba(152, 81, 147, .1) ;}
.statistics-iconbox-3{ background-color:rgba(119, 183, 71, .1) ;}

.statistics-num{
    color: var(--color-dark-primary);
    font-family: var(--font-text);
    font-weight: 600;
    font-size: 5rem;
}
.statistics-text{
    font-size: 2.344rem;
    color: #555555;
    text-transform: capitalize;
    font-weight: 500;
}


/*Testimonial*/
.testimonial{
    background-color: var(--color-blue-primary);
    /* min-height: 40vw; */
}
.testimonial-content{
    max-height: 30vw;
    min-height: 20vw;
}
.testimonial-box{
    position: relative;

}
.testimonial-icon{
    height: 3rem;
    width: 3rem;
    fill:rgba(250, 250, 250, .2);
}
.testimonial-icon-1{
    position: absolute;
    top: 5%;
    left: 10%;
}
.testimonial-icon-2{
    position: absolute;
    bottom: 0;
    right:0;
}
.testimonial-name{
    font-size: 2.344rem;
    color: var(--color-grey-text);
    font-family: var(--font-heading);
    font-weight: 600;
}
.testimonial-loc{
    font-size: 2.344rem;
    color: rgba(242,242,242,.9);
    font-family: var(--font-text);
    font-weight: 600;
    letter-spacing: 2px;
}
.testimonial-text{
    font-size: 1.5rem;
    color: var(--color-blue-light);
    width: 70%;
}

.testimonial-imgbox{
    height: 6.6rem;
    width: 6.6rem;
    overflow: hidden;
    border-radius: 50%;
    margin-bottom: 5rem;
    background-color: var(--color-white);


    position: relative;
}

.testimonial-img{
    height: auto;
    width: 75%;

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

}
.testimonial-dot{
    height: .5rem;
    width: .5rem;
    border-radius: 50%;
    /* background-color: var(--color-blue-light); */
    margin-top: 2rem;

    position: absolute;
    top: 85%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.carousel-indicators li{
    height: 1rem;
    width: 1rem;
    border-radius: 50%;
}
.carousel-indicators{
    /*background-color: rgba(0, 109, 157, .5);*/
    width: max-content;
    border-radius: 10rem;
    padding: .25rem .5rem;
    transition: all .3s;

    position: absolute;
    bottom: 0;
}
.carousel-indicators:hover{
    background-color: rgba(0, 109, 157, .6);
}
.controls-icon{
    height: 2rem;
    width: 2rem;
    fill: rgba(250,250,250,1);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.controls-icon-box{
    height: 4rem;
    width: 4rem;
    border-radius: 100%;
    background-color:var(--color-blue);

    position: relative;
}

/*Partner*/
.partners-img,
.partner-img-2{
    max-height: 7rem;
}

.join-us{
    background-image: linear-gradient(rgba(28, 151, 187, .85),rgba(28, 151, 187, .85)),url(../img/become-partner.JPG);
    background-size: cover;
    background-position: top;
    background-attachment: fixed;
}

/*Form*/
.contact-form{
    background-color: rgba(230, 240, 242, .5);
}
.form-box{
    width: 80%;
}
.contact-form .form-control{
    padding: 1.5rem 2rem;
    border: none;
    border-radius: .3rem;
    box-shadow: 0 .1rem .2rem rgba(130, 130, 130, .1);
    height: 5rem;
    border-bottom: .2rem solid transparent;
    font-size: 1.5rem;
    color: var(--color-dark-primary);
    transition: all .3s;
}
.contact-form .form-control::-webkit-input-placeholder{
    color: var(--color-grey-dark);
    font-size: 1.4rem;
}
.contact-form .form-group{
}
.contact-form .form-control:focus{
    border-bottom: .2rem solid var(--color-green-primary); ;
    box-shadow: 0 .3rem .6rem rgba(130, 130, 130, .1);
}
.contact-form .form-control:focus:invalid{
    border-bottom: .2rem solid #FC6404;
}
.contact-form textarea.form-control{
    height: unset;
}


.footer{
    background-color: var(--color-blue-dark);
    color: rgba(242, 242, 242, .6);
}
.footer .logo{
    height: 5.5rem;
    margin-bottom: 2rem;
}
.footer-text{
    color: rgba(242, 242, 242, .6);;
    font-weight: 500;
}
.footer-heading{
    font-size: 1.875rem;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--color-grey-text);
    margin-bottom: 2.5rem;
}
.footer-link{
    text-decoration: none;
    /* margin-bottom: 4rem; */
    font-weight: 500;
    color: rgba(242, 242, 242, .6);
}
.footer-link:hover{
    color: var(--color-grey-text-2);
    text-decoration: none;
}
.footer-icon{
    height: 1.5rem;
    width: 1.5rem;
    fill: rgba(250, 250, 250, .9);
    cursor: pointer;
}
.footer-icon:hover{
    transform: scale(1.08);
}
.footer-icon:not(:last-child){
    margin-right: 2rem;
}

.copyright__text{
    font-size: 1.2rem;
    letter-spacing: 1px;
    color: rgba(230, 240, 242, .4);
}
.copyright-divider{
    background-color: rgba(230, 240, 242, .1);
}




/*Media Queries*/

@media (max-width: 1199.98px) { 
    
.header .carousel-inner{
    height: 80vh;
}
.header .carousel-caption{
    top: 50%;
    width: 80%;
}
.carousel-header{
    font-size: 2.93rem;
    margin-bottom: 2rem;
}
.about-mission-box{
    width: 80%;
}
 }


 @media (max-width: 991.98px) { 
     /*Navbar*/
     .navbar{
        background-color: #fff;
     }
     .navbar .navbar-brand img{
        height: 4rem;
    }
    .navbar .nav-item .nav-link{
        padding-left: 2rem;
        padding-right: .7rem;
        font-size: 1.5rem;
        color: var(--color-blue-primary);
    
    }
    .navbar .nav-item .nav-link:hover{
        color: var(--color-grey-text) !important;
        background-color: var(--color-blue-primary);
    }
    .navbar .nav-item .nav-link::after{
        background-color: transparent;
    }
    .navbar .nav-item .nav-link:hover::after{
        width:0;
    }
    .navbar-light .navbar-nav .active>.nav-link{
        color: var(--color-blue-primary);
    }
    
    .navbar-light .navbar-nav .active>.nav-link::after{
        background-color: transparent;
    
    }
    .navbar .nav-item .nav-link{
        font-size: 1.75rem;
    }

     /*header*/
    .carousel-header{
        font-size: 2.5rem;
        margin-bottom: 2rem;
    }
    .carousel-text{
        font-size: 1.7rem;
    }
    .header .carousel-indicators{
        bottom: 18%;
    }
    .header .carousel-caption{
        top: 55%;
        width: 75%;
    
    }

    /*Fact*/
    .fact{
        margin-bottom: -6rem;
    }
    .fact-card{
        padding: 2.5rem 2rem;
    }
    .fact-card-2{
        box-shadow: 0 1rem 2rem rgba(119, 183, 71, .15);
        height: auto;
    }
    .fact-icon{
        /* display: none; */
        height: 2.8rem;
        width: 2.5rem;
        /* fill: rgba(250,250,250,.95); */
    }
    .fact-heading{
        font-size: 1.740rem;
        text-transform: capitalize;
        font-family: var(--font-heading);
        font-weight: 600;
    }
    .fact-text{
        color: rgba(242, 242, 242, .9);
        font-size: 1.5rem;
    }
    /*About*/
    .about-mission-box{
        width: 90%;
    }
    
    /*Typography*/
    .heading-small{
        font-size: 1.75rem;
        margin-bottom: 1rem;
    }
    .heading-big{
        font-size: 2.5rem;
        /* margin-bottom: 1rem; */
    }
    .about-textbox{
        margin-bottom: 4rem;
    }

    /*Stand*/
    .stand-card{
        border: 2px solid rgba(230, 240, 242, .3);
        /* padding: 2rem 2rem; */
        height: auto;
    }
    .stand-heading{
        font-size: 1.8rem;
        margin-bottom: 1.7rem;
        width: 100%;
    }
    .stand-icon{
        margin-bottom: 2rem;
        height: 5rem;
    }
    .stand-text{
        color: var(--color-grey-text);
        font-size:1.650rem;
        /* font-family: var(--font-text); */
    }

    /*Statistics*/
    .statistics-card{
        height: 30rem;
    }
    .statistics-iconbox{
        height: 8rem;
        width: 8rem;
        border-radius: 100rem;
    }
    .statistics-icon-1,
    .statistics-icon-2,
    .statistics-icon-3{
        height: 4rem;
    }
    .statistics-num{
        font-weight: 600;
    }
    .statistics-text{
        font-size: 2rem;
    }
    
    /*Testimonial*/
    .testimonial .carousel-indicators{
        display: none;
    }
    .testimonial-text{
        font-size: 1.7rem;
        color: var(--color-grey-text);
        width: 70%;
    }
  }

@media (max-width: 767.98px) { 
    
.header .carousel-inner{
    height: 70vh;

}
.header .carousel-caption{
    top: 60%;
    width: 75%;

    display: block !important;
}
.header .carousel-indicators{
    bottom: 5%;
}
.header .carousel-item{
    height: 100%;
}
.header .carousel-item img{
    height: 100%;
    object-fit: cover;
}
.carousel-header{
    font-size: 2rem;
    font-weight: 600;
}

.carousel-text{
    display: block;
    font-size: 1.6rem;
}

.fact-row{
    transform: translateY(-5%);
}

    .statistics-iconbox{
        height: 7rem;
        width: 7rem;
    }
    
    .statistics-num{
        font-size: 5rem;
    }
    .statistics-text{
        font-size: 2.7rem;
    }
 }
@media (max-width: 575.98px) { 
    .navbar{
        padding: 0 5rem;
    }
    .navbar .navbar-brand img{
        height: 3.5rem;
    }
    .header .carousel-inner{
        height: 50vh;
    
    }
    .header .carousel-item{
        height: 100%;
    }
    .header .carousel-item img{
        height: 100%;
        object-fit: cover;
    }
    .header .carousel-indicators{
        bottom: 20%;
    }
    .carousel-header{
        font-size: 1.875rem;
        font-weight: 500;
    }
    
    .carousel-text{
        display: none;
        width: 97%;
    }
    .fact-row{
        margin: 0 2rem;
        transform: translateY(-8%);
    }
    .fact-card{
        /* margin-bottom: 2rem; */
    }
    .about-textbox{
        margin: 0 2rem;
        margin-bottom: 4rem;
    }
    .stand-card{
        margin: 0 2rem;
        margin-bottom: 1.5rem;
    }
    .statistics-card{
        /*margin: 0 2rem;*/
        margin-bottom: 1.5rem;
    }
    .footer{
        padding: 8rem 4rem !important;
    }
    .partners .partners-carousel {
        /*padding: 0 5rem;*/
    }
    .partners-img{
        margin-bottom: 2.5rem;
    }
 }

 @media (min-width: 1400px) {
    .carousel-header{
        font-size: 4rem;
    }
    
    .carousel-text{
        font-size: 2.344rem;
    }
    .header .carousel-caption{
        top: 55%;
        width: 80%;
    } 
    .navbar .nav-item .nav-link{
        font-size: 1.75rem;
    }
    
 }
/*Alert*/
.alert-success, .alert-error, .alert-danger {
    padding: 1rem;
    text-align: center;
}