html,body{
    background-color: white;
    color:black;
    padding: 0px;
    font-size:20px;
    height:100%;
    margin:0;
    overflow: auto;
    scrollbar-width: thin; 
    scrollbar-color: gray black;/* scroll colors Firefox */
}  
    /*scroll colors others browsers*/
    body::-webkit-scrollbar {width: 12px;}
    body::-webkit-scrollbar-track {background: black;}
    body::-webkit-scrollbar-thumb {background-color: gray;border: 3px solid black;}

div.scroll{margin:0;max-height:500px;overflow: auto!important;scrollbar-width: thin; scrollbar-color: gray black;}  /* scroll colors Firefox */
    /*scroll colors others browsers*/
    div.scroll::-webkit-scrollbar {width: 12px;height:12px}
    div.scroll::-webkit-scrollbar-track {background: black;}
    div.scroll::-webkit-scrollbar-thumb {background-color: gray;border: 3px solid black;}

div.loading{position:absolute;display:block;top:0;left:0;width:100%;height:100%;background-color:rgba(255, 255, 255, 0.5);}

a:link{color:inherit;text-decoration: inherit;}
a:active{color:inherit;text-decoration: inherit;}
a:visited{color:inherit;text-decoration: inherit;}
a:hover{color:inherit;text-decoration: inherit;}
a.text{color:blue;text-decoration: initial;}

h1{font-size:2.2vw;font-family: 'Roboto', sans-serif;}
h2{font-size:2vw;font-family: 'Roboto', sans-serif;}
h3{font-size:1.8vw;font-family: 'Roboto', sans-serif;}

li{list-style:none}

.noMargins{margin:0;padding:0}
.noMarginsTop{margin-top: 0;padding-top: 0;}
.noMarginsBottom{margin-bottom: 0;padding-bottom: 0;}
.centerVertical{margin-top:auto;margin-bottom:auto;}
.centerHorizontal{margin-left:auto;margin-right:auto;}
.hidden{display:none!important;}
.show{display:initial!important}
.alert{color:red}
.information{color:green}

.selectable{border-bottom: transparent solid 3px;margin:3px}
.selectable:hover{background-color: lightgray;cursor: pointer;}
.selectable.selected{border-bottom: red solid 3px;}
.selectable.selectedBox{border: black solid 1px;border-bottom: red solid 3px;}

.arrow {background-image: url('../img/down.gif');background-repeat: no-repeat;background-size: auto 100%;background-position:bottom left;}
.arrow.up{background-image: url('../img/up.gif');background-position:top left;}


form-title{font-weight: bold;width:20vw;display:inline-block}
form-value::after{content:'\A'; white-space:pre}
form-terms{display:block}

#logo{
    z-index:1000;
    position:fixed;
    display:block;
    top:1vh;
    left:0;
    width:13vw;
    height:10vw;
    min-width:120px;
    content: url('../img/logo.svg' );
    cursor: pointer;
}


#mobile{
    z-index:900;
    position:fixed;
    display:none;
    right:2%;
    top:0px;
    width:48px;
    height:48px;
    overflow: hidden;
}
    #mobile img{width:auto;height:85%;float:right;margin-top:auto;margin-bottom: auto;}
    #mobile img:hover{cursor: pointer;}

div.menu{
    z-index:900;
    position:fixed;
    display:block;   
    left:1%;
    top:12vw;
    width:12vw;
    height:80vh;
    font-family: 'Roboto', sans-serif;
    font-size: 1vw;
    overflow:auto;
}
div.menu li{position:relative;margin:0;}
div.menu ul{margin:0; padding-left:15px; display:none;}
div.menu .languages{margin-left:1%;width:50%}
div.menu .language{width:33%}
        
section{position: relative;display:block;min-height:100%;width:90vw;margin-left:auto;margin-right:0;font-family: 'Assistant', sans-serif;}


#head{position:relative;display:block;width:90%;display:block;margin-left:auto;margin-right:auto;height:auto;}
    #head img{width:100%;height:100%}
    #head div.legend {position:absolute;top:0;left:0;width:100%;height:100%;font-family: 'Roboto', sans-serif;}
        #head div.legend div.title {position:absolute;bottom:1vh;left:54vw}
            #head div.legend div.title h1{color:white;font-size:2.5vw;font-weight: bold ; padding:0;margin:0}
                #head div.legend div.title h1 > sup{font-size:1vw;}
        #head div.legend div.text{position:absolute;display:block;width:20vw;height:auto;top:20vh;right:8vw;color:black;text-align:justify;font-size: 1.2vw;}
    /*section img{width:90%;display:block;margin-left:auto;margin-right:auto;height:auto;opacity:1;}
        section div.legend.box{filter: blur(5px);background-color:rgba(128,128,128,0.6);border-radius:5px;}   
        section div.legend.text{margin-left:auto;margin-right:auto;color:black;text-align:justify;font-size: 1.2vw;}
            section div.legend.text h1{color:red;font-size:2vw}*/

article{
    position:relative;
    display:block;
    width:80vw;
    text-align: justify;
    margin-left:auto;
    margin-right:auto;
    text-overflow: inherit;
}

div.auto{width:auto}
div.width1_1{width:100%;}
div.width2_3{width:75%}
div.width1_2{width:50%}
div.width1_3{width:33%}
div.width1_4{width:25%}
div.width1_5{width:20%}

div.width80_20{width:80%}
div.width20_80{width:20%}

div.block{display:block;overflow:hidden;padding:1%;}
    div.block img{width:100%;height:auto;pointer-events: none;user-select: none;}       
    div.block p{margin:0;text-align: center;color:black;pointer-events: none;user-select: none;}
        div.block.grid{width:10%}

div.blocks{
    display:flex;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: auto;
    width:100%;
    height:auto;
    overflow: hidden;
}
    div.blocks.form{display:block}
    div.blocks.alignLeft{display:flex;flex-wrap:wrap;justify-content:left;}
    div.blocks.imagesAndText {display:inline-block}
        div.blocks.imagesAndText img{width:40vw;height:auto;padding:2%;float:left;}

ul.tabs{margin-left:0;padding:0;}
    ul.tabs li{display: inline; margin-left: 10px;padding:5px;border-bottom:none}


footer{position:relative;display:flex;bottom:0;color:white;background-color: black;padding-top:5px;margin-top:10px;font-family: 'Roboto', sans-serif;}
    footer .blocks{width:auto;}
        footer .block.corporate{width:12vw;height:auto;font-size:0.4rem;text-align: center;}
            footer .block.corporate .logo{width:auto;height:90%;background-image:url('../img/logo.svg');background-size: 90% 90%;background-repeat: no-repeat;background-color: white;background-position-x: center;background-position-y:center;margin-left:auto;margin-right:auto;margin-bottom:5px}      
        footer .block.line{width:1px;height:10vw;background-color: white;padding:0;margin:5px}
        footer .block.info{display:block;overflow: visible;margin:auto;font-size:0.9rem;text-align:left;}
        footer .block.social{display:block;margin-top:auto;margin-bottom:auto;width:50px}
        footer .block.legal{font-size:0.6rem}


.cookiesAdvise{z-index:1000;position:fixed;display:block;bottom:0;width:100%;height:auto;border-top:1px solid black;background-color:white ;color:black;font-size: 0.8rem;padding-bottom:20px;}
    .cookiesAdvise .blocks{margin-top:20px;width:50%}
    .cookiesAdvise .block{margin-left:auto;margin-right:auto;text-align: center;}

button{border: transparent solid 3px;min-height:20px;min-width: 150px;}
button:hover{background-color: lightgray;cursor: pointer;border-bottom: red solid 3px;}

iframe.maps{border:0;width:80vw;height:450px;}
.mapOpenLayers{width: 40vw;height:70vh;overflow: auto}

/*
    AJUSTES PARA DISPOSITIVOS MOVILES
*/
@media only screen and (max-width: 800px) {
    html{font-size:18px;}

    h1{font-size:2rem}
    h2{font-size:1.5rem}
    h3{font-size:1.2rem}

    form-title{display:block;width:100%}

    body::-webkit-scrollbar {width: 0;} /*evita el que se desplace logo y icono menu*/

    #logo{min-width:100px;content: url('../img/logo_land.svg')}
    #mobile{width:100%;display:block;background-color: white;padding:5px} /*fondo blanco para cubrir logo y icono menu*/

    div.menu{
        left:auto;
        right:0;
        top:45px;
        width:80vw;
        background-color:rgba(214, 214, 214,0.7);
        font-size: 1rem;
        display:none;
    }
    div.menu li{margin:10px}
    div.menu .language{width:25%}
    

    section{width:100vw;margin:0;top:48px}

    #head div.legend div.title {left:56vw}
    #head div.legend div.title h1{font-size: 3.5vw;}
    #head div.legend div.text{display:none;}

    article{width:90%}
    
    div.block {margin:2%;width:95%}
        div.block.grid{width:25%}

    div.blocks{display:block}
        div.blocks.imagesAndText img{width:100%;height:auto;float:none}
   

    ul.tabs li{display:block}

    footer{top:50px}
    footer .blocks{display:block;}
    footer .block{width:100%;margin-right: auto;margin-left: auto;}
        footer .block.corporate {width:40vw;height: 40vw;}
        footer .block.line{width:90vw;height:1px}
        footer .block.social{display:flex;width:120px}
    
    /* mantiene las vistas en movil*/
    #samplesFinishes div.blocks{display:flex;width:80vw;}        
    #textFinishes{font-size: 0.9rem;}

    button{min-height:50px}

    iframe.maps{width:100%;height:450px;}
    .mapOpenLayers{position:relative;width: 100vw;height:60vh}
 }