*{
    font-family: "Roboto", sans-serif;
}



body{
    overflow-x: hidden;
}




.menu-contain{
    position: relative;
    display: flex;
    /* justify-content: center; */
    height: 5vw;
    width: 100%;
    /* border: 1px solid green; */
    box-shadow: 0.1vw 0.1vw 0.1vw rgb(182, 179, 179);
    /* background-color: rgb(0, 166, 47); */
}

.logo{
    position: relative;
    height: 7vw;
    width: 7vw;
    left: 1.5vw;
    top: -1vw;
}


.menu-bar{
    display: flex;
    position: relative;
    /* border: 1px solid blue; */
    left: 55vw;
    top: 0.5vw;
    height: 100%;
    padding-right: 1vw;
    font-family: garamond;
}


.menu-bar ul{
     display: flex;
    /* border: 2PX solid red; */
    padding-right: 1vw;
}


  .menuBar ul .liA a{
    position: relative;
    top: 0vw;
    padding: 0.3vw 1vw 0.8vw 1vw;
    /* transition: all 0.5s ease-in-out; */
    box-shadow: 0.08vw 0.08vw 0.2vw rgb(130, 130, 130);

  } 


 #lia{
    position: relative;
    top: 0vw;
    color: rgb(17, 209, 17);

  } 





.menu-bar ul li a{
    text-decoration: none;
    color: rgb(0, 0, 0);
    transition: all 0.4s ease-in-out;
    font-family: garamond;
    font-weight: 500;
    font-size: 1.2vw;
}



.menu-bar ul li{
    margin-right: 2vw;
    list-style: none;
    width: max-content;
}


.menu-bar ul li a:hover{
    color: rgb(17, 209, 17);
    padding-bottom: 1vw;
    border-bottom: 2px solid rgb(17, 209, 17);
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;

  }

.arrow-up{
    height: 2.5vw;
    width: 2.5vw;
    position: fixed;
    right: 0vw;
    top: 80%;
    display: none;
    transition: all 0.3s ease-in-out;
    animation: arrowUP 2s ease-in-out 0.1s infinite;

}


@keyframes arrowUP {
    0% {
      bottom: 7.5vh;
      scale: 1.2;
    }
  
    50% {
      bottom: 8vh;
      scale: 1;
    }
  
    100% {
      bottom: 8.2vh;
      scale: 1.2;
    }
  }

/*****************************************/
/*****************************************/
/*****************************************/
.big-body{
    /* border: 1px solid blue; */
    margin: 1vw;
    position: relative;
    left: 0vw;
    box-sizing: border-box;
}

.body1{
    margin: 1vw;
    position: relative;
    justify-content: center;
    align-items: center;
    /* background-color: rgba(255, 196, 3, 0.741); */
    padding: 1vw;

    background: -moz-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: -webkit-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: -o-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    

}

.body1 h1{
    font-size: 3.3vw;
    color: rgb(17, 110, 55);
    position: relative;
    left: 17%;
    letter-spacing: 0.07vw;
}


.body1 p:nth-child(2){
    font-size: 1.6vw;
    position: relative;
   text-align: center;
   color: rgb(49, 49, 49);
   line-height: 2vw;
   padding-bottom: 1vw;


}

.pp{
    font-family: fantasy;
}


.body1 p{
    font-size: 1.3vw;
    position: relative;
   text-align: center;
   color: rgb(61, 61, 61);
   line-height: 0.2vw;
}



/*****************************************/
/*****************************************/
/*****************************************/

.body2{
    position: relative;
    margin: 2vw 1vw;
    padding-top: 3vw;
    /* border: 2px solid black ; */
    box-shadow: 0.1vw 0.1vw 0.3vw black;
    padding-bottom: 6vw;




}

.div-p{
    /* border: 1px solid rgb(164, 0, 0); */
    width: 70%;
}


.body2 p{
    font-size: 1.2vw;
    line-height: 2vw;
    letter-spacing: 0.05vw;
    position: relative;
    margin-left: 2vw;
    margin-bottom: 3vw;
    /* border: 2px solid blue; */
    color: rgb(43, 42, 42);
    z-index: 50;
    font-weight: 300;

}

.postuler{
    background-color: rgb(17, 110, 55);
    border: 1px solid black;
    text-decoration: none;
    padding: 0.5vw 1vw;
    color: white;
    position: relative;
    top: 2vw;
    font-size: 1.5vw;
    left: -0.8vw;
    transition: all 0.5s ease-in-out;
    box-shadow: 0.1vw 0.1vw 0.3vw black;

}


.postuler:hover{
    background-color: rgb(35, 33, 33);
    color: aliceblue;
    font-size: 1.6vw;
}


.img-body2{
    height: 20vw;
    width: 37vw;
    position: absolute;
    top: 3.5vw;
    right: 0vw;
    /* filter: brightness(25%); */
    z-index: 20;
}



/*****************************************/
/*****************************************/
/*****************************************/

.body3{
    /* border: 2px solid red; */
    margin: 1vw;
    padding-top: 2vw ;
    padding-bottom: 6vw;
}

.body3 h2{
    font-size: 1.8vw;
    font-weight: 200;
    margin-left: 1vw;

    
  animation: appearMap linear;
  animation-timeline: view();
  animation-range: entry 0%;
}

@keyframes appearMap {
    from {
      opacity: 0;
      scale: 0.5;
    }
  
    to {
      opacity: 1;
      scale: 1;
    }
  }



.div2-body3, .div1-body3, .div3-body3{
    position: relative;
    left: 5vw;
    margin: 5vw 0vw 5vw 0vw;

    animation: appearMap linear;
    animation-timeline: view();
    animation-range: entry 0%;

}

h3{
    font-size: 1.4vw;
}


.div1-body3 ul li{
width: 80vw;
line-height: 2.2vw;
letter-spacing: 0.05vw;
font-weight: 300;
list-style: url(../PIC/circle9.png);
font-size: 1.2vw;

}

.div2-body3 ul li{
    width: 80vw;
    line-height: 2.2vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
    list-style: url(../PIC/circle10.png);
    font-size: 1.2vw;
    
    }


    .div3-body3 ul li{
        width: 80vw;
        line-height: 2.2vw;
        letter-spacing: 0.05vw;
        font-weight: 300;
        list-style: url(../PIC/circle11.png);
        font-size: 1.2vw;
        
        }



 /*****************************************/
/*****************************************/
/*****************************************/
.body4{
    /* border: 2px solid purple; */
    margin: 2vw 1vw;
    /* background-color: rgb(108, 107, 106); */
    padding-top: 5vw;
    padding-bottom: 3vw;
    position: relative;


    background: -moz-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: -webkit-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: -o-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    
}


.body4 h2{
    font-size: 1.8vw;
    font-weight: 400;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    margin-left: 1vw;
    color: rgb(0, 0, 0);
}



.body4 > ul{
    position: relative;
    left: 2vw;
    box-shadow: 0.1vw 0.1vw 0.3vw rgb(80, 76, 76);
    width: 60%;
    padding: 2vw 0vw;
    padding-left: 3vw;
    margin-bottom: 2vw;

    
   
}

.body4 > ul li{
    width: 80vw;
    line-height: 2.2vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
    list-style: url(../PIC/circle9.png);
    font-size: 1.2vw;
    padding-left: 1.3vw;
    width: 55vw;
}

.body4-right{
    position: absolute;
    top: 1vw;
    /* border: 2px solid blueviolet; */
    width: 33%;
    left: 62.3vw;
    padding-bottom: 5vw;
    box-shadow: 0.1vw 0.1vw 0.3vw rgb(80, 76, 76);

}

.div1-body4 ul li{
    list-style: none;
    line-height: 0.5vw;
    margin-bottom: 2vw;
}

.div1-body4 ul li span{
    font-weight: 800;
}

.div1-body4 ul li p{
    position: relative;
    left: 3.3vw;
    line-height: 0vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
}

.div1-body4 ul li img{
    position: relative;
    top: 0.4vw;
    padding-right: 1vw;
    height: 2vw;
    width: 2vw;
}


.div2-body4 p{
    line-height: 1.5vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
    padding: 0vw 2vw;
}

.div2-body4 h3{

    position: relative;
    left: 1vw;
}


.div2-body4 ul li{
    line-height: 2.2vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
    list-style: url(../PIC/circle11.png);
    width: 25vw;

}

.impo{
    color: rgb(173, 77, 197);
    margin: 2vw;
    font-weight: 400;
    font-family: monospace;
}


.body5{
    position: relative;
    margin-bottom: 8vw;
    top: 2vw;
    width: 59vw;
    margin-left: 2vw;
}


.body5 p{
    line-height: 1.3vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
    font-size: 0.9vw; 
    color: rgb(21, 20, 20);
    font-family: monospace;
}

.body5 strong{
    color: black;
}






 /*****************************************/
/*****************************************/
/*****************************************/

.foot{
    background-color: rgb(17, 110, 55);
    position: relative;
}

.rights{
    width: 30vw;
    position: relative;
    left: 4vw;
    top: 1vw;
}

.rights img{
    height: 1vw;
    width: 1vw;
    border-radius: 50%;
    position: absolute;
    top: 0vw;
}

.rights p{
    position: relative;
    left: 1.3vw;
    top: 0.2vw;
    color: white ;
    font-size: 1.3vw;
    font-weight: 600;
}


.screenpic{
    position: relative;
    top: 2vw;
}


.foot ul{
    display: flex;
    list-style: none;
    justify-content: center;
    align-items: center;
}

.foot ul li{
    position: relative;
    top: -1.8vw;
    left: 37vw;
    margin-left: 2vw;
    border: 2px solid white;
    border-radius: 50%;
    height: 2.1vw;
}


.foot ul li a img{
    height: 2.1vw;
    width: 2.1vw;
}




/**************************************************************************************************/
/*******************************************************************************************/
/***************************************************************************************/
/*****************************************************************************/

@media screen and (min-width:200px) and (max-width:920px){

    .menu-contain{
        position: relative;
        display: flex;
        /* justify-content: center; */
        height: 10vw;
        width: 100%;
        /* border: 1px solid green; */
        box-shadow: 0.1vw 0.1vw 0.1vw rgb(182, 179, 179);
        /* background-color: rgb(0, 166, 47); */
    }

    .logo{
        position: relative;
        height: 11vw;
        width: 11vw;
        left: 1.5vw;
        top: -1vw;
    }


    .arrow-up{
        height: 4vw;
        width: 4vw;
        position: fixed;
        right: 1vw;
        top: 80%;
        display: none;
        transition: all 0.3s ease-in-out;
        animation: arrowUP 2s ease-in-out 0.1s infinite;
    
    }


    .menu-bar{
        display: flex;
        position: relative;
        /* border: 1px solid blue; */
        left: 50vw;
        height: 100%;
        padding-right: 1vw;
        top: -1vw;
    }

    .menu-bar ul li a{
        font-size: 3.3vw;
    }


  




    
/*****************************************/
/*****************************************/
/*****************************************/
.big-body{
    /* border: 1px solid blue; */
    margin: 1vw;
    position: relative;
    left: 0vw;
    box-sizing: border-box;
}

.body1{
    margin: 1vw;
    position: relative;
    justify-content: center;
    align-items: center;
    /* background-color: rgba(255, 196, 3, 0.741); */
    padding: 1vw;
    padding-bottom: 20vw;

    background: -moz-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: -webkit-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: -o-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    

}

.body1 h1{
    font-size: 6vw;
    color: rgb(17, 110, 55);
    position: relative;
    left: 5%;
    width: 80vw;
    top: 3vw;
    letter-spacing: 0.07vw;
}


.body1 p:nth-child(2){
    font-size: 3.3vw;
    position: relative;
   text-align: center;
   color: rgb(49, 49, 49);
   line-height: 4vw;
   padding-bottom: 1vw;
   top: 5vw;


}

.pp{
    font-family: fantasy;
}


.body1 p{
    font-size: 3vw;
    position: relative;
   text-align: center;
   color: rgb(61, 61, 61);
   line-height: 1vw;
   top: 8vw;
}



/*****************************************/
/*****************************************/
/*****************************************/

.body2{
    position: relative;
    margin: 2vw 1vw;
    padding-top: 3vw;
    /* border: 2px solid black ; */
    box-shadow: 0.1vw 0.1vw 0.3vw black;
    padding-bottom: 6vw;
}

.div-p{
    /* border: 1px solid rgb(164, 0, 0); */
    width: 90%;
}


.body2 p{
    font-size: 3.3vw;
    line-height: 5.3vw;
    letter-spacing: 0.09vw;
    position: relative;
    margin-left: 4vw;
    margin-bottom: 40vw;
    /* border: 2px solid blue; */
    color: rgb(43, 42, 42);
    z-index: 50;
    font-weight: 300;

}

.postuler{
    background-color: rgb(17, 110, 55);
    border: 1px solid black;
    text-decoration: none;
    padding: 0.5vw 1vw;
    color: white;
    position: relative;
    top: -4vw;
    font-size: 4vw;
    left: -0.8vw;
    transition: all 0.5s ease-in-out;
    box-shadow: 0.1vw 0.1vw 0.3vw black;

}


.postuler:hover{
    background-color: rgb(35, 33, 33);
    color: aliceblue;
    font-size: 1.6vw;
}


.img-body2{
    height: 25vw;
    width: 47vw;
    position: absolute;
    top: 70vw;
    left: 20vw;
    /* filter: brightness(25%); */
    z-index: 20;
}



/*****************************************/
/*****************************************/
/*****************************************/

.body3{
    /* border: 2px solid red; */
    margin: 1vw;
    padding-top: 2vw ;
    padding-bottom: 6vw;
}

.body3 h2{
    font-size: 4vw;
    font-weight: 200;
    margin-left: 1vw;

    
  animation: appearMap linear;
  animation-timeline: view();
  animation-range: entry 0%;
}

@keyframes appearMap {
    from {
      opacity: 0;
      scale: 0.5;
    }
  
    to {
      opacity: 1;
      scale: 1;
    }
  }



.div2-body3, .div1-body3, .div3-body3{
    position: relative;
    left: 1vw;
    margin: 5vw 0vw 5vw 0vw;

    animation: appearMap linear;
    animation-timeline: view();
    animation-range: entry 0%;

}

h3{
    font-size: 3.6vw;
}


.div1-body3 ul li{
width: 80vw;
line-height: 6vw;
letter-spacing: 0.07vw;
font-weight: 300;
list-style: url(../PIC/circle9.png);
font-size: 3.3vw;

}

.div2-body3 ul li{
    width: 80vw;
    line-height: 6vw;
    letter-spacing: 0.07vw;
    font-weight: 300;
    list-style: url(../PIC/circle10.png);
    font-size: 3.3vw;
    
    }


    .div3-body3 ul li{
        width: 80vw;
        line-height: 6vw;
        letter-spacing: 0.07vw;
        font-weight: 300;
        list-style: url(../PIC/circle11.png);
        font-size: 3.3vw;
        
        }




        

 /*****************************************/
/*****************************************/
/*****************************************/
.body4{
    /* border: 2px solid purple; */
    margin: 2vw 1vw;
    /* background-color: rgb(108, 107, 106); */
    padding-top: 5vw;
    padding-bottom: 3vw;
    position: relative;


    background: -moz-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: -webkit-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: -o-linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    background: linear-gradient(90deg, rgba(255, 196, 3, 0.573), rgba(255, 196, 3, 0.741), rgba(255, 196, 3, 0.573));
    
}


.body4 h2{
    font-size: 4vw;
    font-weight: 400;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    margin-left: 1vw;
    color: rgb(0, 0, 0);
}



.body4 > ul{
    position: relative;
    left: 3vw;
    box-shadow: 0.1vw 0.1vw 0.3vw rgb(80, 76, 76);
    width: 90%;
    padding: 2vw 0vw;
    padding-left: 3vw;
    margin-bottom: 2vw;


    animation: appearMap linear;
    animation-timeline: view();
    animation-range: entry 0%;

    
   
}

.body4 > ul li{
    width: 80vw;
    line-height: 6vw;
    letter-spacing: 0.07vw;
    font-weight: 300;
    list-style: url(../PIC/circle9.png);
    font-size: 3vw;
    padding-left: 1.3vw;
    width: 80vw;
}

.body4-right{
    position: relative;
    top: 3vw;
    /* border: 2px solid blueviolet; */
    width: 93%;
    left: 3vw;
    padding-bottom: 20vw;
    box-shadow: 0.1vw 0.1vw 0.3vw rgb(80, 76, 76);

    animation: appearMap linear;
    animation-timeline: view();
    animation-range: entry 0%;

}

.div1-body4 ul li{
    list-style: none;
    line-height: 0.5vw;
    margin-bottom: 2vw;
}

.div1-body4 ul li span{
    font-weight: 800;
}


.div1-body4 h2{
    position: relative;
    padding-top: 5vw;
    padding-bottom: 3vw;
}

.div1-body4 ul li p{
    position: relative;
    left: 3.3vw;
    line-height: 0vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
}

.div1-body4 ul li img{
    position: relative;
    top: 0.4vw;
    padding-right: 1vw;
    height: 4vw;
    width: 4vw;
}


.div2-body4 p{
    line-height: 4vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
    padding: 0vw 2vw;
    position: relative;
    top: -2vw;
}

.div2-body4 h2{
    position: relative;
    padding-top: 5vw;
    padding-bottom: 3vw;
}

.div2-body4 h3{

    position: relative;
    left: 1vw;

}


.div2-body4 ul li{
    line-height: 5vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
    list-style: url(../PIC/circle11.png);
    width: 80vw;

}

.impo{
    color: rgb(173, 77, 197);
    margin: 2vw;
    position: relative;
    top: 3vw;
    font-weight: 400;
    font-family: monospace;
    font-size: 3vw;
}


.body5{
    position: relative;
    margin-bottom: 20vw;
    top: 10vw;
    width: 70vw;
    margin-left: 2vw;
}


.body5 p{
    line-height: 6vw;
    letter-spacing: 0.05vw;
    font-weight: 300;
    font-size: 3vw; 
    position: relative;
    left: 4vw;
    color: rgb(21, 20, 20);
    font-family: monospace;
}

.body5 strong{
    color: black;
}






 /*****************************************/
/*****************************************/
/*****************************************/

.foot{
    background-color: rgb(17, 110, 55);
    position: relative;
}

.rights{
    width: 60vw;
    position: relative;
    left: 4vw;
    top: 1vw;
}

.rights img{
    height: 3vw;
    width: 3vw;
    border-radius: 50%;
    position: absolute;
    top: 1vw;
}

.rights p{
    position: relative;
    left: 3.3vw;
    top: 1vw;
    color: white ;
    font-size: 3.3vw;
    font-weight: 600;
}



.foot ul{
    display: flex;
    list-style: none;
    justify-content: center;
    align-items: center;
}

.foot ul li{
    position: relative;
    top: -3.6vw;
    left: 30vw;
    margin-left: 2vw;
    border: 2px solid white;
    border-radius: 50%;
    height: 5vw;
}


.foot ul li a img{
    height: 5vw;
    width: 5vw;
}






    


    
}