.firstSectionDiv {

    width: 100%;

}



.imgDiv {

    margin: auto;

    position: relative;

    text-align: center;

}



.firstSectionImg {

    width: 100%;

    opacity: 0.9; 



}



.imgText {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    color: white;

    font-size: 5rem;

}



.imgButton {

    position: absolute;

    top: 68%;

    left: 50%;

    transform: translate(-50%, -50%);

    color: white;

    background-color:  	rgba(0,0,0, 0.3);

    border: 1px solid white;

    font-size: 20px;

    padding: 10px;

    border-radius: 10px;

    font-weight: 500;

    cursor: pointer;

}



.secondSection {

    width: 100%;

}



.secondSectionInside {

    width: 75%;

    height: 100%;

    display: flex;

    justify-content: space-between;

    margin: auto;

    padding: 20px;

}



.secondSectionCard {

    width: 23%;

    height: 100%;

    border-radius: 10px;

    margin:10px;

}



.cardImgDiv {

    height: 75%;

}



.cardImg {

    width: 100%;

    border-radius: 10px;

}



.title {

    color: black;

    text-align: center;

    font-size: 20px;

}



.cardDescription {

    text-align: center;

}



.buttonDiv {

    width: 100%;

    display: flex;

    justify-content: center;

}



.btnProduct {

    color: white;

    background-color: #1F87BC;

    border: 0;

    padding: 6px;

    border-radius: 10px;

    width: 50%;

    font-size: 16px;

}



.btnProduct:hover {

    cursor: pointer;

}





.textDiv {

    border-right: 1px gray solid;

    border-left: 1px gray solid;

    border-bottom: 1px gray solid;

    padding: 10px;

    border-bottom-left-radius: 10px;

    border-bottom-right-radius: 10px;

}



.secondSectionTitle {

    font-size: 40px;

    margin-top: 20px;

    text-align: center;

}



.secondSectionTitle-2 {

    font-size: 30px;

    margin-top: 20px;

    text-align: center;

}



.thirdSectionDiv {

    margin-top: 30px;

    width: 100%;

}



.thirdSectionInside {

    width: 75%;

    margin: auto;

    display: flex;

    flex-direction: column;

}



.thirdSectionTitle {

    font-size: 35px;

    font-weight: 500;

}



.certificateDivBg{

    display: flex;

    justify-content:space-between;

    margin-top: 20px;

}



.cetificateDiv {

    display: flex;

    flex-direction: column;

    width: 25%;

    border: 1px black solid;

    padding: 20px;

}



.certificate {

    width: 100%;

}



.certificateDescription {

    font-size: 25px;

    margin-left: 1.6rem;

}



.btnCertificate {

    color: white;

    background-color: #1F87BC;

    border: 0;

    padding: 8px;

    border-radius: 10px;

    width: 30%;

    font-size: 18px;

}



.btnCertificate:hover {

    cursor: pointer;

}



.btnCertificateDiv {

    width: 100%;

    display: flex;

    justify-content: center;

}


.section4DivBg {

    margin-top: 30px;

    width: 100%;

    margin-bottom: 30px;

}



.section4DivInside {

    width: 75%;

    margin: auto;

    display: flex;

}



.section4Div {

 width: 100%;

}



.section4Title{

    font-size: 35px;

    font-weight: 500;

}



.section4Images {

    width: 100%;

    display: flex;

}



.galleryImg {

    width: 100%;

    height: 200px;

    padding: 10px;

    transition: ease-in 0.3s;

    border-radius: 50px;

}



.galleryImg-2 {

    width: 100%;

    height: 200px;

    padding: 10px;

    transition: ease-in 0.3s;

    border-radius: 50px;

    border: 1px black solid;

    margin: 10px;

}



.galleryImg:hover {

    transform: scale(2);

    cursor: pointer;

    border-radius: 25px;

}



.galleryImg-2:hover {

    transform: scale(2);

    cursor: pointer;

    border-radius: 25px;

}



.section5DivBg {

    margin-top: 30px;

    width: 100%;

}



.section5DivInside {

    width: 75%;

    margin: auto;

    display: flex;

}



.section5Div {

    width: 100%;

   }



.section5Title{

    font-size: 35px;

    font-weight: 500;

    margin-bottom: 20px;

    width: 50%;

    

}



.section5DescriptionDiv {

    width: 100%;

    display: flex;

}



.section5Description {

    font-size: 18px;

    width: 100%;

    display: flex;



    line-height: 1.4;



    text-align: justify;

}



.section5ImgDiv {

    height: 700px;

    width: 50%;

}





.section5Img {

    height: 100%;

    width: 100%;

}



.section5DescriptionTitleDiv {

    display: flex;

    flex-direction: column;

    width: 50%;

    justify-content: center;

    padding-right: 50px;



}


.icon {

    display: flex;

    align-items: center;

}



.right {

    display: flex;

    float: right;

}

.topBarBg {

    background-color: #1F87BC;

    width: 100%;

    height: 30px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 1px black solid;

}



.topBarInside {

    width: 75%;

    margin: auto;

    display: flex;

    color:white;

}



.topBarContact {

    width: 50%;

    display: flex;



}

.topBarSocial {

    width: 50%;

}

.mobileTopBarBg {

    display: none;

}



@media screen and (max-width: 600px){

    .thirdSectionTitle {

        text-align: center;

    }



    .certificateDivBg {

        flex-direction: column;

    }



    .cetificateDiv {

        width: 80%;

        margin: auto;

        margin-bottom: 20px;    

    }



    .certificateDescription {

        font-size: 20px;

        text-align: center;

        margin-left: 0;

    }



    .btnCertificate {

        width: 50%;

    }

    

    .topBarBg {

        display: none;

    }

    .mobileTopBarBg {

        width: 100%;

        background-color: #1F87BC;

        height: 30px;

        align-items: center ;

        display: flex;
    }



    .mobileTopBarInside {

        width: 90%;

        height: 100%;

        margin: auto;

    }



    .mobileTopBarContactDiv {

        display: flex;
        
        font-size: 12px;

        justify-content: space-between;

        height: 100%;

    }



    .mobileTopBarContact {

        display: flex;

        align-items: center;

        color: white;

    }



}







@media screen and (max-width: 600px){  

    .section5DescriptionDiv {

        flex-direction: column;

    }



    .section5ImgDiv {

        width: 100%;

    }



    .section5DescriptionTitleDiv {

        width: 100%;

    }



    .section5Title {

        text-align: center;

        width: 100%;

    }

}



@media screen and (max-width: 600px){ 



.section4Title {

    text-align: center;

}



.section4Images {

    flex-direction: column;

}



.galleryImg-2 {

    margin: 0;

    margin-bottom: 20px;

    

    width: 90%;

}



.section4Title {

    margin-bottom: 20px;

}

}









@media screen and (max-width:600px) {

    .secondSectionInside {

        flex-direction: column;

    }



    .secondSectionCard {

        width: 100%;

        margin: auto;

        margin-bottom: 20px;

    }



    .btnProduct {

        width: 50%;

    }

}



@media screen and (min-width: 600px) {

    .mobileFirstSectionDiv {

        display: none;

    }

  }





@media screen and (max-width: 600px) {

    .firstSectionDiv {

        display: none;

    }

    .mobileFirstSectionDiv {

        width: 100%;

    }

    .mobileMainImg {

        width: 100%;

    }

}

