@media screen {

    html, body {
        min-height: 100%;
    }
  
    body {
        margin: 0;
        font-size: 0.9em;
        /* font-family: 'PT Sans', Verdana, sans-serif; */
        font-family: 'Manrope', sans-serif;
        background: #ffffff;
        line-height: 1.4;
        /* transition: all 1s ease-in; */
    }
  
    body.is-fullscreen {
        overflow: hidden;
    }
  
    /*** layout ***/
  
    /* .flex-wrapper {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: flexbox;
        display: -moz-flex;
        display: -o-flex;
        display: -webkit-flex;
        display: -ms-flex;
        display: flex;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        -o-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }
  
    #page-wrap {
        position: relative;
    }
  
    /*** canvas ***/
  
    /* #canvas {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 100vw;
        z-index: 20;
        opacity: 0;
        transition: opacity 0.5s ease-in;
        pointer-events: none;
    }
  
    .planes-loaded #canvas {
        opacity: 1;
    } */ 
  
    /* #back-to-lib-link {
        display: inline-block;
        position: fixed;
        top: 0;
        right: 0;
        padding: 0.25em 0.5em;
        background: #ee6557;
        color: white;
        text-decoration: none;
        z-index: 20;
        font-size: 0.85em;
    }
  
    #back-to-lib-link:hover {
        background: black;
    }
  
    #source-code-link {
        display: inline-block;
        position: fixed;
        bottom: 2em;
        right: 1em;
        padding: 0.25em 0.5em;
        background: #ee6557;
        color: white;
        text-decoration: none;
        z-index: 50;
    }
  
    #source-code-link:hover {
        background: black;
    }
   */
    /*** close button ***/
  
    /* #close-button {
        position: fixed;
        top: 0;
        right: 0;
        -webkit-appearance: none;
        border: 0;
        background: #ee6557;
        font: inherit;
        font-size: 0.85em;
        color: white;
        cursor: pointer;
        z-index: 50;
  
        display: none;
    } */
  
    /*** content ***/
  
    /* #content {
        position: relative;
        z-index: 15;
        max-width: 1440px;
        margin: 0 auto;
        padding: 40px 0 0 0;
    }
  
    #planes {
        overflow: hidden;
        display: flex;
        flex-wrap: wrap;
        opacity: 0;
        margin: 15vh 0;
  
        transition: opacity 0.5s ease-in;
    }
  
    .planes-loaded #planes {
        opacity: 1;
    }
  
    .plane-wrapper {
        position: relative;
  
        width: 45%;
        height: 60vh;
        margin: 0 5% 0 0;
    }
  
    .plane-wrapper:nth-child(even) {
        margin: 15vh 0 0 5%;
    }
  
    .plane {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        cursor: pointer;
    }
  
    body.is-fullscreen .plane {
        cursor: auto;
    }
  
    .plane img {
        display: none;
    } */
  
  
    /*** handling errors ***/
  
    /* .no-curtains .plane-title {
        z-index: 1;
    }
  
    .no-curtains .plane {
        display: flex;
        overflow: hidden;
    }
  
    .no-curtains .plane img {
        display: block;
        min-width: 100%;
        min-height: 100%;
        object-fit: cover;
    } */


.body-home{
    background-color:rgb(255, 255, 255);
    /* font-family: 'Raleway', sans-serif; */
    font-style:normal;
    width: 100%;
    margin:0;
    overflow: hidden;
    /* background-image: url('../img/4.jpg'); */
    background-position: 50% 104%;
    background-repeat: no-repeat;
    background-size: contain;
    background-size: 120vh;
}
/* HOLABONDIA TITULO */
header{
    width:98%;
    /* top: 0;
    left: 0; */
    line-height: 1.3333333333;
    margin: 0 auto;
    /* padding:0 3%; */
}

.titulo{
    background-color: rgb(255, 255, 255) transparent;
    margin-top:3vh;
}


h1{
    font-size:15.4vw;
    font-weight: 400;
    color: black;
    margin-top: 3px;
    margin-left: 0px;
    margin-bottom: 0;
    width: auto;
    padding: 0;
    line-height:0.8;
    position:relative;
    z-index: -1;
}

#holabondia::before{
    position: absolute;
    bottom: -50px;
    width: 300px;
    content: "['ola bon dee-ah']";
    font-size: 17px;
    left: 1%;
}

 /* MENU PORTFOLIO */
#menu{
    background-color: transparent;
    width: 100%;
    margin: 1vh 0;
    justify-content: space-between;
    /* transition: all 0.7s ease-in; */
    padding: 0 0.5%;
    font-weight: 400;
}
#menu-idioma{
    text-align: right;
    width: 98%;
    margin: 34px auto 0;
}

#menu-idioma a{
    text-decoration: none;
    border-radius: 20px;
    width:40px;
    padding:0 11px;
    color: black;
    background-color: white;
    border:1px solid black;
}
#menu-idioma a.dark{
    text-decoration: none;
    border-radius: 20px;
    width:40px;
    padding:0 11px;
    color: white;
    background-color: black;
    border:1px solid white;
}
#menu-idioma a:first-of-type{
    margin-right: 10px;
}

.menu-idioma-seleccionado{
    background-color: black !important;
    color: white !important;
    border-color: black !important;
}
.menu-idioma-seleccionadodark{
    background-color: white !important;
    color: black !important;
    border-color: white !important;
}


#darkmode{
    position:relative;
    top:2px;
    margin-left:10px;
    display: inline-block;
    position:relative;
    /* top:2px; */
}
#darkmode2{
    position:relative;
    top:8px;
    margin-left:10px;
    display: inline-block;
    position:relative;
    /* top:2px; */
}

#darkmode .bright{
    cursor: pointer;
    display:inline-block;
    width: 13px;
    height: 13px;
    border-radius: 13px;
    border:1.5px solid black;
    background-color: white;
}
#darkmode .dark{
    /* margin-left: 3px; */
    cursor: pointer;
    display:inline-block;
    width: 13px;
    height: 13px;
    border-radius: 13px;
    border:1.5px solid black;
    background-color: black;
}
#darkmode2 .bright{
    cursor: pointer;
    display:inline-block;
    width: 30px;
    height: 30px;
    border-radius: 30px;
    border:1.5px solid black;
    background-color: white;
}
#darkmode2 .dark{
    /* margin-left: 3px; */
    cursor: pointer;
    display:inline-block;
    width: 30px;
    height: 30px;
    border-radius: 30px;
    border:1.5px solid black;
    background-color: black;
}
#darkmode2{
    display:none;
}

/* MENU ANIMACION */
nav{
    display: block;
    width: 100%;
    box-sizing: border-box;
    outline: none;
    height: auto; 
}

#menu ul{
    display: flex;
    list-style-type: none;
    padding: 0; 
    margin: 0;
    justify-content: space-between;
}

#menu li{
    display: inline;
}

/* #menu li a{
    padding: 10px; 
} */



#menu li > a, #menu2 a, #menuClose, .cv a{
    display: inline-block;
    text-decoration: none;
    /* margin: 25px; */
    color:black;
    position: relative;
    color: inherit;
    text-decoration: none;
    text-align:left;
    display: inline-block;
    transition: 0.5s;
    border: 1px solid transparent;
    padding:0px 15px 0px;
    border-radius: 15px;
  }
#back-top{
    display: inline-block;
    text-decoration: none;
    /* margin: 25px; */
    color:black;
    position: relative;
    color: inherit;
    text-decoration: none;
    text-align:left;
    display: inline-block;
    transition: 0.5s;
    border: 1px solid transparent;
    padding:2px 15px 2px;
    border-radius: 25px;
  }

  #back-top{
      display:none;
  }
  
/* #menu a::after {
    content: '';
    position: absolute;
    top:-3px;
    /* transform:translateY(100%); 
    width: 0%;
    left: 0;
    height: 10%;
    background: currentColor;
    transition:width 0.5s ease;
  } */
  
/* #menu a:hover::after {
    width: 100%;
  } */

/* #menu li > a:hover,#menu2 a:hover, #menuClose:hover, #back-top:hover,.cv a:hover{ */
#menu li > a:hover,#menu2 a:hover, #menuClose:hover{
    cursor:pointer;
    color:#999;
    border: 1px solid;
}
.cv a:hover{
    color:#999;
}
#back-top:hover{
    /* color: #999; */
    border: 1px solid;
    opacity: 0.5;
    /* filter:brightness(0.2); */
}
.cv{
    position:relative;
    left:-15px;
}

#menuClose{
    display:none !important;
}
#menu2{
    display: none;
    background-color: transparent;
    width: 100%;
    font-size: 20px;
    margin: 1vh 0;
    justify-content: space-between;
    /* transition: all 0.7s ease-in; */
    font-weight: 200;
    right:0;
}
.activo{ 
    border: 1px solid !important;
}

    /* .activo::after{ 
        content: '';
        position: absolute;
        top:-3px;
        /* transform:translateY(100%); 
        width: 100% !important;
        left: 0;
        height: 10%;
        background: currentColor;
        /* transition:width 0.5s ease; 

    } */



.p{
    margin:0;
}

/* HOME WORK */
.proyecto{
    width:100%;
    margin:0 auto;
}
#proyectos{
    margin: 7vh auto 0;
    font-size: 40px;
    color:#999;
    text-align: left;
    display:inline-block;
}

#proyectos a span:hover{
    position:relative;
    text-align: center;
    /*z-index: 5;*/
    height:0%;
    /* color:red; */
    box-sizing: border-box;
    justify-content: normal;
}
#proyectos li{
    margin:0 0 5vh 0;
}
#proyectos li a{
    font-size: 1.4em;
    font-weight: 100;
}
#proyectos li a:hover{
    color:black;
}
#proyectos li a span{
    font-size: 0.45em;
}
.column-name{
    width:80%;
    margin:0 auto;
}
.proyecto-contenido{
    width:92%;
    margin:55px auto 0;
}
.proyecto-imagen-g{
    margin-top:20px;
}
.proyecto-info{
    width:100%;
    margin: 0 0 55px 0;
}
.proyecto-text{
    width:47%;
    margin-right:5%;
    display: inline-block;
    vertical-align: top;

}
.proyecto-tags{
    width:47%;
    display: inline-block;
    border-top: 1px solid #999;
    vertical-align: top;
    margin: 6px 0 0 0;
}
.proyecto-tags p{
    display: inline-block;
    color:white;
    background-color: #000;
    padding: 5px 15px;
    border-radius: 15px;
    margin: 15px 10px 0 0;
}
.proyecto-contenido .imagenes{
    width:100%;
}
/* .proyecto-contenido .imagenes .imagen:nth-child(odd){
    width: 47%;
    margin-right: 5%;
    margin-bottom: 50px;
    display: inline-block;
    vertical-align: top;
}
.proyecto-contenido .imagenes .imagen:nth-child(even){
    width: 47%;
    margin-bottom: 50px;
    display: inline-block;
    vertical-align: top;
} */

.proyecto-contenido .imagenes .imagen.ancho{
    width: 100%;
    margin-right: 5%;
    margin-bottom: 50px;
    display: inline-block;
    vertical-align: top;
}
.proyecto-contenido .imagenes .imagen.impar{
    width: 47%;
    margin-right: 5%;
    margin-bottom: 50px;
    display: inline-block;
    vertical-align: top;
}
.proyecto-contenido .imagenes .imagen.par{
    width: 47%;
    margin-bottom: 50px;
    display: inline-block;
    vertical-align: top;
}

.proyecto-contenido .imagenes iframe{
    width: 100%;
}


.proyecto-contenido .imagenes .imagen img{
    width: 100%;
}
.proyecto-nav{
    width: 94%;
    height: 100px;
    margin:50px auto 0;
}
.proyecto-nav p{
    font-size: 1.3em;
}
.a-proyecto-sig{
    text-decoration: none;
    color:#000;
}
.a-proyecto-prev{
    text-decoration: none;
    color:#000;
}
.a-proyecto-sig p{
    display:inline-block;
}
.a-proyecto-prev p{
    display:inline-block;
}
.img-proyecto-next{
    width:150px;
    position:relative;
    vertical-align: middle;
    left:-10px;
    top:-4px;
    opacity: 0;
}
.img-proyecto-prev{
    opacity: 0;
    width:150px;
    position:relative;
    vertical-align: middle;
    left:10px;
    top:-4px;
}
.proyecto-prev{
    width:250px;
    height:250px;
    float:left;
}
.proyecto-next{
    width:250px;
    height:250px;
    float:right;
    text-align:right;
}


.column-name.centrado{
    text-align: center;
}
.column-name ul{
    list-style-type: none;
    padding: 0; 
    margin: 0;
}

.column-name a{
    color: inherit;
    text-decoration: none;
}

.column-imagen{
    width:66%;
    background-color:rgb(255, 255, 255)transparent;
}


.avatar{
    z-index: -1;
    width: 300px;
    /* left: 45%; */
    /* top: 3%; */
    /*visibility:hidden;*/
    /* width:30%; */
    display:none;
    position: absolute;
}

#a02 .avatar{
    /* width: 10%; */
    /* left: 45%; */
    /* top: 3%; */
    /*visibility:hidden;*/
    /* width:30%; */
    display:none;
    /* position: absolute; */
}

.body-work{
    background-color:rgb(255, 255, 255);
    /* font-family: 'Raleway', sans-serif; */
    font-style:normal;
    width: 100%;
    margin:0;
}


/* INFO PAGE */
#info{
    width: 98%;
    margin:0 auto;
    margin-top:9vh;
    font-size: 1.2em;
    
}
#info .text-left{
    width:25%;
    float:left;
    position: relative;
}

#info .text-left h1{
    font-size: 7.5vw;
    font-weight: 300;
    margin-left: 3vw;
}
#info .text-left h1::before{
    position: absolute;
    bottom: -50px;
    width: 300px;
    content: "['Mar-juh-ree']";
    font-size: 17px;
    font-weight: 400;
    left: 1%;
}
.pie-foto {
    font-size: 0.7em;
    font-style: italic;
    font-weight: 100;
    color: #999;
}
.marjorie{
    width:100%;
    height:100%;
    cursor:pointer;
}

#marchu{
    width:400px;
    position:absolute;
    top:0;
    left:0;
    display:none;
    pointer-events: none;
}
#marchu img{
    width:100%;
}

#info .info-image{
    width:30vw;
    margin-left:3%;
    float:left;
}
#info .info-image img{
    width:100%;
}
#info .text-right{
    width:30%;
    margin-left:5%;
    float:left;
    font-weight:400;
    margin-bottom: 50px;
}
#info .text-right h2{
    margin:0;
}
#info-flecha{
    /* display: none; */
    width:60px;
    height: 95px;
    position: absolute;
    bottom:10vh;
    left:60px;
    margin: -20px 0 0 0;
    cursor:pointer;
    background-image: url('/img/flecha.png');
    background-size: 100%;
    background-position: center;
}
#info-flecha img{
    width:100%;
}
/* #back-top:hover{
    /* filter: invert(100%); */
    /* filter: brightness(0.01); 
} */
#info-top{
    /* display: flex; */
    /* overflow:auto; */
    height:85vh;
}
#info-bottom{
    clear:both;
    margin: 0 auto;
    width:94%;
    height:100vh;    
    text-align:center;
}

#info-bottom .ready{
    height: 8vh;
    padding-top: 3vh;
    text-align: left;
}
#info-bottom .flex{
    display: flex;
    justify-content: space-between;
    font-size: 0.9em;
    height: 65vh;
    text-align: left;
}
figure{
    margin:0;
}
#info-bottom #contact{
    width:30%;
    float:left;
    margin:0 3% 0 0;
}
.sayhello{
    position: relative;

}
.sayhello p{
    display:inline-block;
    margin-right: 30px;
}
.sayhello p.espacio{
    width:8px;
}
#info-bottom .es,#info-bottom .pt,#info-bottom .en{
    /* left:48px; */
    position: absolute;
    /* top:1px; */
    display:inline-block;
    transform-style: preserve-3d;
}
#info-bottom .pt,#info-bottom .en{
    transform: rotateX(90deg);
}
  
/* #info-bottom .pt,#info-bottom .en{ */
    /* display: none; */
/* } */
#info-bottom #languages{
    width:26%;
    float:left;
    margin:0 3% 0 0;

}
#info-bottom #focus{
    width:15%;
    float:left;
    margin:0 0 0 0;
}



#info-bottom  p{
    margin:0;
}
#info-bottom .sayhello,#info-bottom .writeme,#info-bottom .focused{
    font-size: 1.5em;
    font-weight: 600;
    margin-bottom: 6vh;
}
#info-bottom  .contacto{
    margin-top:5vh;
}
#info-bottom  .socialmedia{
    margin-top:5vh;
}
#back-top{
    margin-bottom: 11vh;
    margin-left: -1%;
    cursor:pointer;
}
#copyright {
    position: relative;
    display: flex;
    color: #999;
    justify-content: space-between;
    /* heig ht: 5vh; */
    text-align: left;
}
#contact a{
    color:black;
}
#contact a:hover{
    color: #999;
}
#copyright p:first-of-type{
    text-decoration: underline;
    cursor:pointer;
}
#copynote{
    pointer-events: none;
    display:none;
    font-size: 0.8em;
    padding: 15px 20px 15px 0;
    position:absolute;
    max-width: 600px;
    width:70%;
    /* colorblack; */
    top:2vh;
    left:0;
}


/* FOOTER */

footer{
    font-weight: 500;
    background-color:white;
    position:fixed;
    bottom:0px;
    height: 35px;
    color: rgb(0, 0, 0);
    width: 100%;
}
.footer-padding{
    padding-top:10px;
}

footer a {
    display: inline-block;
    text-decoration: none;
    /* margin: 25px; */
    color:black;
    position: relative;
    color: inherit;
    text-decoration: none;
    text-align:left;
    display: inline-block;
    transition: 0.5s;
    border: 1px solid transparent;
    padding:0 12px 2px;
    border-radius: 15px;
    
  }
  
/* footer a::after {
    content: '';
    position: absolute;
    bottom:-3px;
    /* transform:translateY(100%); 
    width: 0%;
    left: 0;
    height: 10%;
    background: currentColor;
    transition:width 0.5s ease;
  } */
  
/* footer a:hover::after {
    width: 100%;
  } */

footer a:hover{
    cursor:pointer;
    color:#999;
    border: 1px solid;
}

.footer-content{
    display: flex;
    justify-content: space-between;
    padding: 0 1%;
}
.copy{
    display: inline;
}

.mail{
    display: inline;
    text-align: center;
    /* padding:0; */
    margin:0;
}
.copy{
    padding:0;
    margin:0;
}

.telf{
    display: inline;
}

/* NOSTALGIA */
.texto-linea {
    position: absolute;
    top: 0;
    z-index: -1;
    font-size: 28vw;
    line-height: 1;
    /* position: absolute; */
    text-align: center;
    left: 13vw;
    /* top: 93vh; */
    color: white;
    text-shadow: -3px -3px 0 #000, 3px -3px 0 #000, -3px 3px 0 #000, 3px 3px 0 #000;
}

.texto-linea2 {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    z-index: -1;
    font-size: 8vw;
    margin: -75px 0 0 -24% !important;
    line-height: 1;
    /* position: absolute; */
    text-align: center;
    /* top: 93vh; */
    color: black;
    visibility: hidden;
    /* text-shadow: -3px -3px 0 #000, 3px -3px 0 #000, -3px 3px 0 #000, 3px 3px 0 #000; */
}

#nostalgia-holabondia{
    transition: initial;
}
#nostalgia-texto{
    /* background-color: white; */
    width:93%;
    margin:70px auto 25px;
    padding: 0 0 35px 0;
    border-bottom: 1px solid black;
}
#nostalgia-texto h1{
    font-size: 6.5em;
    font-weight: 600;
}
#nostalgia-texto h1::before{
    position: absolute;
    bottom: -50px;
    width: 300px;
    content: "['nos-tal-gee-ah']";
    font-size: 17px;
    font-weight: 400;
    left: 0;
}

#nostalgia-texto .texto{
    margin: 90px 0 0 0;
    font-size: 0.95em;
}

#nostalgia-texto .texto p{
    display: inline-block;
    vertical-align: top;
}
#nostalgia-texto .texto p:first-of-type{
    width: 34%;
    margin: 0 10% 0 0;
}
#nostalgia-texto .texto p:nth-of-type(2){
    width: 22%;
    margin: 0 10% 0 0;
}
#nostalgia-texto .texto p:nth-of-type(3){
    width: 20%;
    margin: 0 0 0 0;
}

#movimiento, #primera-foto{
    width:93%;
    margin: 0 auto;
    position: relative;
}
.nostalgia-fila{
    width: 100%;
    /* clear:both; */
    display: block;
    /* height:auto; */
    /* overflow:auto;   */
}



    /* Minimum aspect ratio */
    @media (max-aspect-ratio: 1/1) and (max-width: 1024px){
        #info-top{
            height:auto;
        }
        #info-bottom{
            /* height:auto;     */
        }
        #info #copyright{
            /* margin-bottom:5vh; */
        }
        #info-flecha{
            display:none;
        }
        /* INFO PAGE */
        #info .text-left{
            width: 42%;
            float: left;
            height: 195px;
        }
        #info .text-left h1{
            font-size: 100px;
        }
        #info .text-left h1::before{
            font-size: 15px;
        }

        #info .info-image{
            width: 53%;
            float: left;
            height: auto;
            margin: 0;
            /* overflow: hidden; */
        }
        #info .info-image img{
            width:100%;
            position: static;
            top:0;
        }
        #info .text-right{
            width:94%;
            padding-top:30px;
            margin: 0 3% 60px;
            float:none;
            clear: both;
        }
    }

    /* Minimum aspect ratio */
   
    @media (max-aspect-ratio: 6/7) {
        /* div {
        background: #9af;
        } */
        .body-home{
            background-position: 55% 70%;
            background-size: 130%;
        }
        .titulo{
            margin-top: 5vh;
        }
        #menu-idioma{
            position:absolute;
            bottom:65px;
            /* right: 0; */
            /* text-align: right; */
            padding-left: 83%;
        }
        #menu-idioma a:first-of-type {
            margin-bottom: 7px;
        }
        #menu-idioma a {
            display: block;
            text-align: center;
            width: max-content;
        }
        #menu-idioma a{
            width:19px;
        }
        #menu-idioma a.dark{
            width:19px;
        }
        /* #copynote{
            width:79%
        } */
        
    }

    @media (max-aspect-ratio: 6/10) {
        .body-home{
            background-position: 55% 60%;
            background-size: 130%;
        }
    }


    /* Super apaisado, moviles*/
    @media (min-aspect-ratio: 1.7/1) and (max-width: 1485px) {
        #info-top{
            /* height:auto; */
        }
        #info-bottom{
            /* height:auto; */
            margin: 9vh auto 0;
        }
        #info #copyright{
            /* margin-bottom:5vh; */
        }

        #info-bottom .ready{
            /* height:auto; */
            margin-bottom: 8vh;
            padding-top: 3vh;
        }
        #info-bottom .flex{
            /* margin-bottom: 10vh; */
            height:60vh;
        }
        #info-bottom #contact{
            margin:0 3% 5vh 0;
        }
        #info-bottom #languages{
            margin:0 3% 5vh 0;
        }
        #info-bottom #focus{
            margin:0 0 5vh 0;
        }
        
        /* #info-bottom .sayhello,#info-bottom .writeme,#info-bottom .focused{
            font-size: 1.5em;
            font-weight: 600;
            margin-bottom: 6vh;
        } */
        #info-bottom  .contacto{
            margin-top:5vh;
        }
        #info-bottom  .socialmedia{
            margin-top:5vh;
        }
        #back-top{
            height: auto;
            margin-bottom: 6vh;
        }
        #info #copyright {
            height: auto;
            /* margin-bottom: 15vh; */
        }
        /* #info-flecha{
            display:none;
        } */












        
    }

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

        #content {
            margin: 0 20px;
        }

    }
  

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

        #info-bottom #contact{
            width:30%;
        }
        #info-bottom #languages{
            width:26%;
        }
        #info-bottom #focus{
            width:23%;
        }

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

        #copynote{
            width:100%;
        }

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


        /* INFO PAGE */
        #info-top{
            height: auto;
        }
        #info .text-left{
            width: 100%;
            float: none;
            height: 195px;
        }
        #info .text-left h1{
            font-size: 100px;
        }
        #info .text-left h1::before{
            font-size: 20px;
        }

        #info .info-image{
            width: 95%;
            float: none;
            height: auto;
            margin:55px auto 0;
            /* overflow: hidden; */
        }
        #info .info-image img{
            width:100%;
            position: static;
            top:0;
        }
        #info .text-right{
            width:95%;
            margin:0 auto;
            padding-top:30px;
            float:none;
            clear: both;
        }
        #proyectos li a{
            font-size:1.1em;
        }

        .proyecto-text{
            width:99%;
            margin-right:0;
        }
        .proyecto-tags{
            width:99%;
            display: inline-block;
            border-top: 1px solid #999;
            vertical-align: top;
            margin: 56px 0 0 0;
        }
        .proyecto-contenido .imagenes{
            width:100%;
        }
        .proyecto-contenido .imagenes .imagen:nth-child(odd){
            width: 99%;
            margin-right: 0;
        }
        .proyecto-contenido .imagenes .imagen:nth-child(even){
            width: 99%;
            margin-bottom: 50px;
        }
    }

    @media screen and (max-width: 720px) {
    
        #content {
            margin: 0 10px;
        }
        .plane-wrapper {
            height: 75vh;
            width: 80%;
            margin: 7.5vh 10%;
        }
    
        .plane-wrapper:nth-child(even) {
            margin: 7.5vh 10%;
        }
    }

    @media screen and (max-width: 656px) {
        #info-bottom .flex{
            display:block;
        }
        #info-bottom #contact{
            width:60%;
            /* float:none; */
        }
        #info-bottom #languages{
            width:30%;
            /* float:none; */
        }
        #info-bottom #focus{
            /* width:100%; */
            /* float:none; */
            display:none;
        }
        #proyectos li a{
            font-size:0.9em;
        }
    }
    


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

        .copy{
            display:none;
        }
    }

    @media screen and (max-width: 550px) {
        #info-bottom .flex{
            height:52vh;
        }
        #back-top{
            margin-bottom: 14vh;
        }
        #info-bottom .ready {
            /* height: 8vh; */
            padding-top: 2vh;
            /* text-align: left; */
            padding-bottom: 4vh;
        }
        .no-responsive{
            display: none;
        }
        .text-left{
            pointer-events: none;
            /* display: none; */
        }
        #marchu{
            display:none;
            visibility: hidden;
            width:0;
            height:0;
        }
        #copynote{
            top:-10vh;
        }
        #menu{
            display:none;
            position: relative;
            margin-top:0;
            top:0;
            left:0;
            position: absolute;
            width: 100vw;
            height: 100vh;
            background-color: rgba(255, 255, 255, 1);
            text-align: center;
            font-size: 3em;
            font-weight: 200;
            z-index: 1000;
        }
        #menu li a{
            border-radius:1.5em;
            padding: 0 0.8em;
        }
        #menu2{
            display: block;
            position: relative;
            text-align: right;
        }
        #menu ul{
            display:block;
            position: relative;
            top:50%;
            margin-top: -190px;
        }
        #menu li{
            display:block;
            margin-bottom: 20px;
        }
        #menuClose{
            display:inline-block !important;
            position: absolute !important;
            top:1vh;
            right:3%;
            font-size: 20px;
        }
        li#nostalgia{
            display: none;
        }
        #darkmode{
            display: none;
        }
        #darkmode2{
            display:inline-block;
            position: absolute;
            /* top:1.9vh; */
            margin-left:1%;
        }
        #darkmode2 .bright{
            border-color:white;
        }
        #copyright p:first-of-type{
            display:none;
        }
        #back-top{
            display:inline-block;
            margin-bottom:10vh;
        }

        .proyecto-tags p{
            padding: 4px 13px;
            border-radius: 15px;
            margin: 15px 8px 0 0;
            font-size: 0.9em;
        }
        .proyecto-contenido .imagenes .imagen.impar,.proyecto-contenido .imagenes .imagen:nth-child(2n),.proyecto-contenido .imagenes .imagen:nth-child(2n+1),.proyecto-contenido .imagenes .imagen.par{
            margin-bottom: 30px;
        }

        .proyecto-next,.proyecto-prev {
            height: 125px;
            width:auto;
        }
        .proyecto-nav {
            height: 100px;
            margin: 0 auto;
            width:90%;
        } 
        .img-proyecto-next,.img-proyecto-prev{
            display:none;
        }
        
    }

    

    @media screen and (max-width: 470px) {
        #info-bottom #contact{
            width: 100%;
        }
        #languages{
            display:none;
        }
        #proyectos li a{
            font-size:0.75em;
        }
    }
    @media screen and (max-width: 450px) {
        /* .body-home{
            background-position: 50% 25%;
            background-size: 120%;
        } */

        .footer-content{
            line-height: 23px;
            display: flex;
        }
        .footer-content p{
            margin:0;
            text-align: center;
            display: block;
        }



        .img-proyecto-next,.img-proyecto-prev{
            display:none;
        }
        .proyecto-prev{
            width:85px;
        }
        .proyecto-next{
            width:85px;
        }

  
    }

    @media screen and (max-width: 380px) {
        #proyectos li a{
            font-size:0.65em;
        }
  
    }
    @media screen and (max-width: 365px) {
        /* .body-home{
            background-position: 50% 25%;
            background-size: 120%;
        } */
  
    }
  


}