@font-face 
{
    font-family:Open_sans;
    src: url('../fonts/OpenSans-VariableFont_wdth\,wght.ttf') format('truetype');
}
@font-face 
{
    font-family:Painless;
    src: url('../fonts/Painless.otf') format('truetype');
}
*
{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}
:root
{
    --color_principal:rgb(33, 95, 61);
    --color_secundario:rgb(225, 225, 225);
    --color_textos_grises:rgb(55, 55, 55);
}
body
{
    font-family:"Open_sans";
}
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
/*primera parte*/
.contendor_primera_parte
{
    width: 100%;
    height: 100vh; 
    /*border: 1px solid red;*/
    background-image: url(../imagenes/img_1_pt1.jpg);
    background-position: bottom;
    background-size: cover;
}
.cont_filtro_1_pt1
{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content:flex-start;
}
.cont_info
{
    width: 50%;
    height: 100%;
    /*border: 1px solid blue;*/
    display: flex;
    align-items:flex-start;
    justify-content: center;
    flex-direction: column;
    padding-left: 50px;
}
.cont_info h1
{
    font-size: 80px;
    color: white;
    font-family:"Painless";
    font-weight: 400;
    padding-bottom: 10px;
}
.cont_info h2
{
    font-size:45px;
    color: white;
    font-family:"Painless";
    font-weight: 400;
    padding-bottom: 20px;
}
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
/*segunda parte*/
.contenedor_segunda_parte
{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.cont_filtro_pt2
{
    width: 100%;
    height: 100%;
    padding-top: 80px;
    padding-bottom: 50px;
    display: flex;
    align-items:flex-start;
    justify-content: center;
}
.cont_izq_pt2
{
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    /*border: 1px solid red;*/
}
.cont_izq_pt2 video
{
    width: 70%;
    height: 500px;
    border: 10px solid white;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    border-radius: 5px;
}
.cont_der_pt2
{
    width: 50%;
    display: flex;
    align-items:flex-start;
    justify-content: center;
    flex-direction: column;
    /*border: 1px solid green;*/
    padding: 20px;
}
.cont_der_pt2 h2
{
    font-size: 25px;
    font-weight: 500;
    color: var(--color_principal);
    padding-bottom: 10px;
}
.cont_der_pt2 h3
{
    font-size: 40px;
    font-weight: 500;
    color: var(--color_textos_grises);
    padding-bottom: 10px;
}
.cont_der_pt2 p
{
    font-size: 17px;
    font-weight: 500;
    color: var(--color_textos_grises);
    padding-bottom: 20px;
}
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
/*tercera parte*/
.contenedor_tercera_parte
{
    width: 100%;
    display: flex;
    align-content: center;
    justify-content: center;
    background-image: url(../imagenes/img_fondo_pt3.jpg);
    background-position: center;
    background-size: cover;
}
.filtro_1_pt3
{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 80px;
    padding-bottom: 50px;
}
.cont_izq_pt3
{
    width: 50%;
    display: flex;
    align-items:flex-start;
    justify-content: center;
    flex-direction: column;
    padding: 50px;
    /*border: 1px solid red;*/
}
.cont_izq_pt3 h2
{
    font-size: 30px;
    color: white;
    font-weight: 500;
    padding-bottom: 10px;
}
.cont_izq_pt3 p
{
    font-size: 17px;
    color: white;
    font-weight: 500;
}
.cont_der_pt3
{
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    /*border: 1px solid green;*/
}
.cont_cerveza_animacion
{
    width: 250px;
    height: 400px;
    /*border: 1px solid red;*/
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}
.botella
{
    background-image: url(../imagenes/leon_botella.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.lata
{
    background-image: url(../imagenes//Cerveza\ fiera.png);
    background-position:bottom;
    background-repeat: no-repeat;
    background-size: 65% 70%;
}
.cont_letras
{
    width: 100%;
    height: 100%;
    /*border: 1px solid red;*/
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.3s ease;
}
.cont_letras p
{
    width: 200px;
    height: 50px;
    border-top: 2px solid white;
    border-bottom: 2px solid white;
    background-color: rgba(33, 95, 61,0.9);;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: white;
    font-weight: 700;
}
.cont_cerveza_animacion:hover
{
    scale: 0.9;
}
.cont_cerveza_animacion:hover .cont_letras
{
    opacity: 1;
    background-color: rgba(33, 95, 61,0.2);
}
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
/*imagenes*/
.contenedor_imagenes
{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content:center;
    flex-wrap: wrap;
    background-color: var(--color_principal);
}
.cont_izq_img
{
    width: 25%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.cont_izq_img img
{
    width: 100%;
    height: 650px;
    object-fit: cover;
    border: 3px solid var(--color_principal);
}
.cont_der_img
{
    width: 75%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.cont_arriba_img
{
    width: 100%;
    /*border: 1px solid red;*/
    display: flex;
    align-items: center;
    justify-content: center;
}

#grande_img
{
    width: 50%;
    height: 325px;
    object-fit: cover;
    border: 3px solid var(--color_principal);
}
#medio_img
{
    width: 30%;
    height: 325px;
    object-fit: cover;
    border: 3px solid var(--color_principal);
}
#chica_img
{
    width: 20%;
    height: 325px;
    object-fit: cover;
    border: 3px solid var(--color_principal);
}
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
/*mayor de edad*/
.contenedor_mayor_edad
{
    z-index: 5;
    position: fixed;
    top:0px;
    width: 100%;
    height: 100vh;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.contenedor_mayor_edad img
{
    width: 150px;
    margin-bottom: 10px;
}
.contenedor_mayor_edad h2
{
    font-size: 35px;
    font-weight: 400;
    color: var(--color_principal);
    padding-bottom: 10px;
}
.contenedor_mayor_edad p
{
    width: 70%;
    font-size: 20px;
    color: var(--color_textos_grises);
    text-align: center;
}
.cont_campos_ingresar_fecha
{
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.cont_campos_ingresar_fecha input
{
    width: 150px;
    height: 50px;
    margin: 0 5px;
    border-radius: 5px;
    border: 2px solid var(--color_principal);
    text-align: center;
    font-size: 20px;
}  
button
{
    width: 250px;
    height: 50px;
    border: none;
    background-color: var(--color_principal);
    font-size: 20px;
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
} 
button:hover
{
    background-color: var(--color_secundario);
}

.borde_error
{
    border: 2px solid red !important;
}