/*==================================*
*GENERAL*
*==================================*/

*{

    margin:0;

    padding:0;

    box-sizing:border-box;

    font-family:'Poppins',sans-serif;

}

body{

    height:100vh;

    background:#F5F6F8;

}

.contenedor{

    display:flex;

    height:100vh;

}


/*==================================*
*LADO IZQUIERDO*
*==================================*/

.izquierda{

    width:40%;

    background:url("img/FONDO.png") center/cover no-repeat;

}

.overlay{

    width:100%;

    height:100%;

    background:rgba(14,70,27,.78);

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    padding:30px;

}

.logo{

    width:180px;

    margin-bottom:20px;

}

.overlay h1{

    color:#FFFFFF;

    font-size:26px;

    font-weight:400;

}

.overlay h2{

    color:#FFFFFF;

    font-size:50px;

    font-weight:700;

    margin-top:5px;

}


/*==================================*
*LADO DERECHO*
*==================================*/

.derecha{

    width:60%;

    background:#FFFFFF;

    display:flex;

    justify-content:center;

    align-items:center;

}

.login{

    width:430px;

}


/*==================================*
*TÍTULOS*
*==================================*/

.login h3{

    text-align:center;

    letter-spacing:5px;

    color:#155724;

    font-size:14px;

    font-weight:600;

    margin-bottom:8px;

}

.login h1{

    text-align:center;

    color:#155724;

    font-size:38px;

    font-weight:700;

}

.login p{

    text-align:center;

    color:#777;

    font-size:12px;

    margin:12px 0 30px;

}


/*==================================*
*CAMPOS*
*==================================*/

.campo{

    margin-bottom:18px;

}

.campo label{

    display:block;

    margin-bottom:6px;

    font-size:12px;

    font-weight:600;

    color:#444;

}

.input{

    display:flex;

    align-items:center;

    height:42px;

    border:1px solid #D9D9D9;

    border-radius:10px;

    overflow:hidden;

    background:#FFFFFF;

}

.input i{

    width:42px;

    text-align:center;

    color:#155724;

    font-size:14px;

}

.input input{

    flex:1;

    height:100%;

    border:none;

    outline:none;

    font-size:12px;

    padding-right:12px;

}


/*==================================*
*EXTRAS*
*==================================*/

.extra{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin:18px 0 25px;

    font-size:12px;

}

.extra a{

    color:#155724;

    text-decoration:none;

    transition:.3s;

}

.extra a:hover{

    text-decoration:underline;

}


/*==================================*
*BOTÓN*
*==================================*/

button{

    width:100%;

    height:42px;

    border:none;

    border-radius:10px;

    background:#155724;

    color:#FFFFFF;

    font-size:12px;

    font-weight:600;

    cursor:pointer;

    transition:.3s;

}

button:hover{

    background:#0E461B;

}


/*==================================*
*DECORACIÓN*
*==================================*/

.decoracion{

    display:flex;

    justify-content:center;

    align-items:center;

    margin-top:25px;

}

.linea{

    width:80px;

    height:2px;

    background:#D4AF37;

    margin:0 10px;

}

.punto{

    width:8px;

    height:8px;

    border-radius:50%;

    background:#D4AF37;

    margin:0 4px;

}