/*Header*/
.logo_header{
    background-color:#c3decf;
    margin:0;
    max-height:87dvh;
    min-height:87dvh;
}
.logo_header .container{
    height: 87dvh;
}
.logo_header .logo_h1{
    font-size:40px;
}
.logo_header .container{
    display: flex;
    flex-direction: column;
}
.logo_h1_title{
    font-size: 250px;
    text-align: center;
}
.logo_h1_title .logo_1{
    animation-name: change_logo;
    animation-duration: 4s;
    animation-iteration-count:infinite;
}
@keyframes change_logo{
    0%  {color: #172e94; opacity: 0.7;}
    50% {color: #247a36; opacity: 0.5;}
    100%{color: #172e94; opacity: 0.7;}
}
.logo_div{
    margin:auto;
    text-align: center;
    align-content: center;
}
.mission_div{
    text-align: center;
    padding-bottom: 5dvh;
}
/*Developers*/
.developers .container{
    background-color: white;
    padding: 10px 20px;
    padding-right: 35px;
    margin-bottom:0px;
}
.div_developers{
    display: flex;
    flex-flow:row wrap;  
    align-items: center;
    font-size: 20px;
    text-align:center;
    gap:20px;
}
.div_developers .developer{
    color: black;
    margin: 20px 10px;
    padding: 15px 20px;
    align-self: stretch;
    width:30%;
    min-width:240px;
    background-color:#FFFFFF;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    display: flex;
    flex-direction: column;
}
.div_developers .developer h3{
    text-align: center;
}
.div_developers .developer p{
    text-align:justify;
}
.div_btn{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 0px 0px;
    margin: 0px 0px;;

    align-self: center;
}
.div_btn a{
    padding: 10px 10px;
    margin: 10px;
    color: #fff;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bolder;
    font-size: 18px;
    background-color: #264cb2;
    border: 2px solid  #c5c8d9;
    float:inline-end;
}
  
.div_btn a:hover{
    background-color: #172e94;
}

.img_developer{
    filter: grayscale(100%);
    max-width: 300px;
    max-height:300px;
    width: 100%;
    height: auto;
    object-fit:scale-down;
    z-index: 1;
    position: relative;
}
.img_developer:hover{
    filter:none;  
}
/*
.img_devloper:hover{
    animation-name: change_developer;
    animation-duration: 4s;
    animation-iteration-count: 1;
}
@keyframes change_developer{
    0%  {filter:grayscale(100%); }
    100%{filter:none; }
}
*/

.section_navbar{
    z-index: 2;   
}


@media(max-width:768px){
    .div_developers .developer{
        width:100%;
    }
    .logo_div{
        height: 13dvh;
        min-width: 100dvw;
    }
    .navbar .logo_h1{
        padding-top: 2dvh;
    }

    .navbar{
        flex-direction: row;
    }
    .nav_div{
        width:100%;
    }
}

.register_success{
    background-color: #264cb2;
    border:#172e94;
}