@media (max-width:1440px) {
    #content-nav #foto-header {
        margin-top: 5.3%;
        height: 89%;
    }
}

@media (max-width:1366px) {
    #content-nav #foto-header {
        margin-top: 7.9%;
        height: 83%;
    }
}




@media (max-width:1280px) {
    #content-nav #foto-header {
        margin-top: 5.3%;
        height: 64%;
    }

}

@media (max-width:1200px) {
    #text-presentation {
        margin-top: -63.6%;
        margin-left: 45.1%;
    }

}

@media (max-width:1060px) {

    #texto-sobre-mi p {
        font-size: 22px;
    }

}




@media (max-width:1024px) {
    #content-sobre-mi #texto-sobre-mi {
        margin-top: 9%;
    }

    #texto-sobre-mi p {
        font-size: 22px;
    }

    #content-nav #foto-header {
        margin-top: 6.5%;
    }

    #logos-contacto {
        margin-top: 130%;
    }

    #formulario {
        width: 45%;
    }

}


@media (max-width:992px) {}

@media (max-width:885px) {
    #text-presentation {
        margin-top: -69.6%;
    }

    #content-sobre-mi #texto-sobre-mi {
        margin-top: 22%;
        width: 90%;
    }

}


@media (max-width:800px) {

    #header-inicio {
        height: 550px;
    }

    #header-inicio #content-logo {
        height: 550px;
    }

    #logos-contacto {
        margin-top: 145%;
    }

    #header-inicio #content-nav {
        height: 550px;
    }

    #content-nav #foto-header {
        margin-top: 7.3%;
        height: 55%;
    }

    #content-nav #menu-navegacion {
        width: 96%;
    }

    #menu-navegacion #ul-menu li a {
        font-size: 20px;
    }

    #menu-navegacion #ul-menu li a:hover {
        font-size: 21px;
    }

    #text-presentation {
        margin-top: -88.6%;
    }

    .saludo-header {
        font-size: 22px;
        margin-bottom: -8%;
    }

    .nombre-header {
        font-size: 35px;
        margin-bottom: -20%;
    }

    .profesion-header {
        font-size: 18px;
    }


    #fotografia-dev #marco-foto {
        height: 413px;

    }

    #fotografia-dev #content-photo {
        height: 400px;
    }

    #content-sobre-mi #fotografia-dev {
        height: 500px;
        margin-top: 17%;
        margin-left: 18%;
    }

    #content-sobre-mi #texto-sobre-mi {
        height: 500px;
    }

    #texto-sobre-mi p {
        font-size: 18px;
        text-align: initial;
        margin-top: 28%;
    }

    #texto-sobre-mi #btn-contacto {
        margin-left: 10%;
    }


    #formulario {
        width: 65%;
    }

    #content-logo-footer a img {
        width: 100%;
    }

    #logos-footer #content-logo-footer {
        margin-top: 5%;
    }

    #logos-footer #content-contact {
        margin-top: 13%;
        margin-left: -10%;
    }

}



@media (max-width:768px) {
    #content-logo a #logo-header {
        width: 30%;
        margin-left: 3%;
    }
}


@media (max-width:710px) {
    #content-nav #menu-navegacion {
        width: 85%;
        margin-left: 0%;
    }

    #content-sobre-mi #texto-sobre-mi {
        width: 65%;
        margin-top: 5%;
    }
}


@media (max-width:650px) {
    #menu-navegacion #ul-menu li a {
        font-size: 17px;
    }
    
    #text-presentation {
        margin-top: -76%;
    }
    .saludo-header {
        margin-bottom: -10%;
    }
    .profesion-title {
        margin-top: -9%;
    }
    

}


@media (max-width:600px) {
    #header-inicio {
        display: flex;
        flex-wrap: wrap;
    }

    #header-inicio #content-logo {
        display: block;
        width: 100%;
        height: 150px;
        position: absolute;
        background: url("../img/content-logoHorozontal.webp");

    }

    #logos-contacto {
        display: none;
    }

    #content-logo a {
        display: block;
        margin-left: 10%;
    }

    #content-logo a #logo-header {
        width: 35%;
        margin-left: 24%;
    }

    #header-inicio #content-nav {

        margin-top: 20%;
        width: 100%;
        height: 450px;
    }

    #content-nav #foto-header {
        margin-top: 0%;
        width: 90%;
    }

    #content-nav #menu-navegacion {
        display: none;
        width: 40%;
        height: 50%;
        background: rgba(255, 255, 255, 0.3);
        margin-right: 9%;
    }

    #menu-navegacion #ul-menu {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: repeat(4, 1fr);
    }

    /* ver boton */
    #box-menu-desplegable {
        display: block;
        width: 40px;
        height: 38px;
        margin-left: 85%;
        margin-top: 19%;
    }

    #box-menu-desplegable i {
        font-size: 35px;
        color: white;
        cursor: pointer;
        margin-left: 9%;
        width: 100%;
        height: 100%;
    }

    #box-menu-desplegable i:hover {
        font-size: 37px;
        color: rgb(255, 217, 0);
    }

    #text-presentation {
        margin-top: -15%;
        margin-left: 5%;
    }

    .profesion-title {
        display: none;
    }

    #content-sobre-mi #fotografia-dev {
        display: none;
    }

    #content-sections #sobre-mi {
        height: 400px;
    }

    #content-sobre-mi {
        width: 100%;
        height: 400px;
    }

    #sobre-mi img {
        height: 400px;
    }

    #content-sobre-mi #texto-sobre-mi {
        width: 200%;
        margin-left: 38%;
        height: 300px;
        margin-top: -17%;
    }

    #texto-sobre-mi #btn-contacto {
        margin-left: 27%;
    }


    #logos-footer #content-contact {
        display: flex;
        margin-left: -25%;
        margin-top: 16%;
        padding-left: 18%;
    }

}


@media (max-width:576px) {




    #formulario {
        margin-top: 10%;
    }

    #content-logo-footer a img {
        margin-top: 26%;
    }

    #logos-footer #content-contact {
        margin-top: 33%;
    }
}
@media (max-width:470px) {

}


@media (max-width:480px) {
    #header-inicio {
        height: 470px;
      }

    #content-logo a #logo-header {
        width: 46%;
        margin-left: 17%;
    }
    #box-menu-desplegable {
        margin-top: 24%;
    }
    #header-inicio #content-nav {
        height: 400px;
      }
    #content-nav #menu-navegacion {
        margin-top: 12%;
        height: 58%;
    }
    #content-nav #foto-header {
        height: 47%;
    }
    #text-presentation {
        margin-top: -25%;
    }

    #formulario {
        width: 90%;
    }
}
@media (max-width:425px) {
    #content-nav #menu-navegacion {
        margin-top: 15%;
        height: 58%;
        margin-left: 45%;
    }


}

@media (max-width:405px) {
    .saludo-header {
        margin-bottom: -14%;
    }
    #parrafo-footer p {
        font-size: 18px;
    }

}
@media (max-width:395px) {
    #content-nav #foto-header {
        height: 44%;
        margin-top: 10%;
    }
    #texto-sobre-mi #btn-contacto {
        margin-left: 19%;
    }

}
@media (max-width:375px) and (max-height:812px){
    #content-nav #foto-header {
        margin-top: 13%;
        height: 47%;
    }

}
@media (max-width:375px) {

    #box-menu-desplegable {
        margin-top: 31%;
    }
    #content-nav #menu-navegacion {
        margin-top: 20%;
    }
    #content-nav #foto-header {
        margin-top: 14%;
        height: 57%;
      }
    

}

@media (max-width:360px) {
    #content-logo a #logo-header {
        width: 62%;
        margin-left: 10%;
    }
    #box-menu-desplegable {
        margin-top: 33%;
    }
    #content-nav #menu-navegacion {
        margin-top: 22%;
    }
    #parrafo-footer p {
        font-size: 20px;
        text-align: center;
        line-height: normal;
    }
}







@media (max-width:320px) {
    #header-inicio {
        height: 400px;
    }

    #content-logo a #logo-header {
        width: 70%;
        margin-left: 6%;
    }

    #box-menu-desplegable {
        margin-top: 37%;
    }
    #content-nav #menu-navegacion {
        margin-top: 27%;
        height: 55%;
        width: 50%;
    }

    #content-nav #foto-header {
        height: 33%;
        margin-top: 23%;
    }
    #text-presentation {
        margin-top: -47%;
    }
    .saludo-header {
        font-size: 15px;
        margin-bottom: -16%;
    }
    .nombre-header {
        font-size: 20px;
    }
    #texto-sobre-mi p {
        font-size: 15px;
        margin-top: 33%;
    }

    #texto-sobre-mi #btn-contacto {
        margin-left: 18%;
    }

    #all-cards{
        margin-top: 13%;
    }

    #formulario {
        height: 400px;
        margin-top: 20%;
    }

    #footer #logos-footer {
        display: grid;
        grid-template-columns: 200px;
        grid-template-rows:60% 40%;
    }
    #logos-footer #content-logo-footer {
        width: 100%;
        height: 100%;
        margin-left: 30%;
    }
    #logos-footer #content-logo-footer {
        margin-top: 0;
        width: 100%;
      }
    #content-logo-footer a img {
        margin-top: -5%;
    }

    #logos-footer #content-contact {
        margin-top: 2%;
        margin-left: 20%;
    }

    #parrafo-footer p {
        font-size: 24px;
        text-align: center;
        line-height: normal;
    }
   
}