/* body * {
    font-family: 'Noto Sans ', sans-serif;
} */
 body *{
    font-family: 'Noto Sans HK', sans-serif;
}  

label {
    font-family: 'Noto Sans ', sans-serif;
    margin-top: 5px;
}

.form-check-input {
    position: absolute;
    margin-top: 0.6rem;
    margin-left: -1.25rem;
    
}


/* header */
.logoCol{
    padding: 15px;
}
.bg-dark {
    background-color: #ac023a!important;
}
.followus{
    color:rgba(255,255,255,.5);
    padding-bottom: 15px;
}

a.socialLink {
    /*width: 30%;*/
    display: inline-block;
}


@media screen and (max-width: 767px){
    a.socialLink img {
        width: 100%;
    }

    a.socialLink {
        width: 25%;
        display: inline-block;
    }
}
.languageWrapper{
    padding-top: 20%;
    padding-bottom: 20%;
}

.languageWrapper a{
    display: inline-block;
    font-size: 13px;
    text-decoration: underline;
    color: #000;
    padding-left: 7.5px;
    padding-right: 7.5px;
}

@media screen and (max-width: 768px){
       .languageWrapper a{
        display: inline-block;
        font-size: 0.80em;
        text-decoration: underline;
        color: #000;
        padding-left: unset;
        padding-right: unset;
    }
    .languageWrapper{
        padding-top: 40%;
        padding-bottom: 20%;
    }
    h2 {
        font-size: 1.5em;
    }
}


.socialLink{
   /* padding-left: 7.5px;
    padding-right: 7.5px;*/
}

/* body */
/*#main{
    padding-top: 15px;

}*/

h2 a{
    color:#000;
    text-decoration: underline;
}


#prehome{
    background-image: url('../img/prehome.jpg');
    padding-bottom: 200%;
}

.prehome_lang{
    margin-top: 25vh;
    padding: 30px;
    background-color: #fff;
    opacity: 0.8;
    /*height: 32vh;*/
}

.langselector{
    width: 100%;
}
#dropdownMenuButton{
    width: 100%
}
.dropdown-menu.show{
    width: 100%
}


.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle {
    color: #fff;
    background-color: #000!important;
    border-color: #000!important;
}

.btn-secondary {
    color: #fff;
    background-color: #000;
    border-color: #000;
}

@media screen and (min-width: 630px){
    .prehome_lang{
        /*height: 33vh;*/
    }

    .langselector{
        width: 50%;
        margin-left: 25%;
    }
    #dropdownMenuButton{
        width: 50%;
        margin-left: 25%;
    }
    .dropdown-menu.show{
        width: 50%;
        margin-left: 25%;
    }
}



h2{
    text-transform: uppercase;
}
.seoArea{
    padding-bottom: 15px;
}
.seoArea img{
    width: 100%;
}

.btn-primary{
    background-color: #ac023a;
}

@media screen and (max-width: 576px){
    .btn-primary{
        width: 100%;
    }
}

@media screen and (min-width: 577px){
    .btn-primary{
        min-width: 50%;
    }
}

/*.grey{
    background-color: #f8f9fa;
}*/

#q1{
    background-image: url('../img/perroverde.jpg');
}

#q2{
    background-image: url('../img/platillos.jpg');
}
#q3{
    background-image: url('../img/vins.jpg');
}
.quadrat{
    background-size: cover;
    background-repeat: no-repeat;
    padding-bottom: 100%;
}

/* footer */
footer .red{
   background-color: #ac023a;
   padding-top: 15px;
   color: #ffffff;
}

footer a{
    text-decoration: underline;
    /*color: #ffffff;*/
}
.footerlist{
    padding-left: 0;
}
.footerlist li{
    list-style-type: none;
}

.map{
    padding-bottom: 15px;
}

@media screen and (min-width: 768px){
    footer iframe{
        height: 22vw;
    }
}


/* POLITICA DE COOKIES START */

.cookies-container{
    width: 90%;
    margin: auto;
    margin-bottom: 100px;
}
  

.cookies-container > p{
    word-break: break-all;    
}



/* POLITICA DE COOKIES ENDS */

/* COMIENZA FORMULARIO DE CONTACTO */
.contact-form-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: auto;
    width: 100%;
    max-width: 1140px;
    background-color: aquamarine;
}

.contact-form-section > .contact-form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: auto;
    width: 100%;
    background-color: white;
}

.contact-form-section > .contact-form > form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: auto;
    width: 100%;
}

#submitForm{
    background-color: black;
    margin-top: 10px;
    
}

#botonContacto{
    height: 50px;
    position: fixed !important;
    bottom: 0.5rem !important;
    right: 0.5rem !important;
    -webkit-border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px;
    background-color: white;    
    box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%);
}

.app-response{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: auto;
    width: 80%;
    margin-top: 20px;
    
}



/* TERMINA FORMULARIO DE CONTACTO */

#botonAmodal:hover{
    background-color: #000000;
    color: white;
}

/* COMIENZA BOTON A MODEL NAVBAR */
#botonAmodal{
    background-color: white;
    color: black;
    /* NORMAL */
    /* width: 60%; */
    /* ESPAÑOL */
    width: 62%;
    /* FRANCES */
    width: 75%;
    max-width: 75%;
    /* En vista ipad pro pasar a 3 lineas 80% en @media */
    /* --- */
    min-height: 50px;
    border: 1px solid #000000;
    padding: 5px 12px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    transition-duration: 0.4s;
    cursor: pointer;
    margin-bottom: 0px;
    /* margin-top: 150px; */
    line-height: 18px;

}

div#divBotonAmodal {
    display: flex;
    flex-direction: row;
    justify-content: left;
    align-items: flex-end;
}

@media screen and (max-width: 1182px){

    #botonAmodal{
        /* background-color: green;  */
        /* margin-top: 110px; */
        width: 80%;
        max-width: 80%;
    
    }
}

@media screen and (max-width: 974px){

    #botonAmodal{
        /* background-color:coral;  */
        /* margin-top: 60px; */
        width: 80%;
        max-width: 80%;
        
    
    }
}

@media screen and (max-width: 834px){

    #botonAmodal{
        /* background-color:coral; */
        width: 85%;
        max-width: 85%;
    
    }
}



@media screen and (max-width: 767px){
    #botonAmodal{
        /* background-color: green; */
        
        width: 100%;
        max-width: 100%;
        /* margin-bottom: 00px; */
        
    
    }
}

@media screen and (max-width: 751px){

    #botonAmodal{
        /* background-color: violet;  */
        /* margin-top: 68px; */
        width: 100%;
        max-width: 100%;
    
    }
}


@media screen and (max-width: 550px){
    #botonAmodal{
        /* background-color: red; */
        margin: auto;
        width: 100%;
        max-width: 100%;
        min-height: 30px;
        height: auto;
        font-size: 0.8em;
        /* margin-top: 20px; */
    
    }

    #divTop {

        display: flex;
        flex-direction: column;
        justify-content: center;

    }

    /* LOGO */
    #divlogo {
        order: 0;
        display: flex;
    }
    #divlogo > img {
        width: 80%;
        margin: auto;
        margin-top: 20px;
        order: 3;
    }

    /* REDES */
    #divRedes{
        order: 2;
    }

    div#divBotonAmodal {
        order: 3;
        margin-top: 10px;
    }

    .languageWrapper {
        padding-top: 0%;
        padding-bottom: 2%;
    }

    a.socialLink {
        width: 10%;
        display: inline-block;
    }

    /* BOTON A MODAL */

}


/* TERMINA BOTON A MODEL NAVBAR */


/* COMIENZA CAPTCHA  */
.form-group {
    margin-bottom: 1rem;
    padding-right: 15px;
    padding-left: 15px;
    width: 80%;
}

/* TERMINA CAPTCHA  */


/* COMIENZA FORM 2 */

/* #form2{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#hide{
    display: flex;
    flex-direction: column;
    justify-content: center;
    display: none;
}
#hide2{
    display: flex;
    flex-direction: column;
    justify-content: center;
    display: none;
}
#hide3{
    display: flex;
    flex-direction: column;
    justify-content: center;
    display: none;
}
#hide4{
    display: flex;
    flex-direction: column;
    justify-content: center;
    display: none;
}
#hide5{
    display: flex;
    flex-direction: column;
    justify-content: center;
    display: none;
}

#validationCustomUsername {
    font-size: 12px;
} */

/* TERMINA FORM 2 */


/* COMIENZA LOGIN */

.login-title-section{
    justify-content: center;
    margin: auto;
    width: 30%;
}

#LoginForm{
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 30%;
    margin: auto;
}



.title-datos-section{
    width: 80%;
    margin: auto;
}


/* TERMINA LOGIN */


/* COMIENZA TABLA ADMIN */
#tablaSubs_wrapper{
    width: 80%;
    margin: auto;
}

#tablaSubs{
    width: 100%;
    margin: auto;
}

#footerSpacer {
    height: 200px;
}

#exampleModal > div > div > div.modal-body > div > form{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: auto;
    width: 80%;
}

#exampleModal > div > div > div.modal-body > div > form > button {
    margin-top: 20px;
}
/* TERMINA TABLA ADMIN */




@media screen and (max-width: 1181px){
    #saltoLinea{
        display: none;
    }
}
