@media all and (max-width: 1114px) {
    .kois div {
        padding: unset;
        margin: unset;
    }
    .project {
        margin: unset;
        padding: unset;
    }
    .projectResume {
        padding-left: 30px;
    }
}

@media all and (max-width: 1054px) {
    .kois {
        display: none;
    }
    #content {
        width: 85%;
    }
}

@media all and (max-width: 920px) {

    #content, body, html, .root {
        margin: unset;
        padding: unset;
        width: 100%;
    }
}

@media all and (max-width: 707px) {
    .kois {
        display: none;
    }

    html {
        background-color: #3E3E40;
    }

    .root {
        display: block;
    }

    #content, body, html, .root {
        margin: unset;
        padding: unset;
        width: 100%;
    }

    .principalText {
        display: block;
        text-align: center;
    }

    .principalTitle, .principalPhrase {
        display: block;
    }

    .principalPhrase {
        font-size: 25.4295px;
        line-height: normal;
    }

    .profilePictureContainer, .resumenText, .projectImg {
        border: 10px solid #3E3E40;
    }

    article, .resumen, .articles, .projectResume {
        margin: unset;
        padding: unset;
    }

    .presentation {
        display: block;
    }

    .profilePictureContainer, .projectImg {
        text-align: center;
    }

    .project {
        display: block;
    }

    .projectImgContainer {
        padding-top: 40px;
    }
}

@media all and (max-width: 635px) {
    .footerContent {
        flex-direction: column;
    }

    .contactIconContainer {
        justify-content: right;
    }

    .contactInfoContainer {
        text-align: right;
    }
}

@media all and (max-width: 569px) {
    .skills div div {
        padding: unset;
        margin: unset;
    }
}

@media all and (max-width: 505px) {
    .kois {
        display: none;
    }

    html {
        background-color: #3E3E40;
    }

    .root {
        display: block;
    }

    #content, body, html, .root {
        margin: unset;
        padding: unset;
        width: 100%;
    }

    .principalText {
        display: block;
        text-align: center;
    }

    .principalTitle, .principalPhrase {
        display: block;
    }

    .principalTitle {
        font-size: 37.4295px;;
    }

    .principalPhrase {
        font-size: 25.4295px;
        line-height: normal;
    }

    article, .profilePictureContainer, .resumen, .resumenText, .articles, .projectImg, .projectResume, .skills div {
        margin: unset;
        padding: unset;
    }

    .presentation {
        display: block;
    }

    .profilePictureContainer, .projectImg {
        text-align: center;
    }

    .project {
        display: block;
    }
}

@media all and (max-width: 400px) {
    .contactIconContainer {
        text-align: right;
    }

    .contactInfoContainer p:nth-child(2) {
        display: none;
    }
    .contactIconContainer .contactIcon:nth-child(4) {
        display: block;
    }
}