html,
body {
    height: 100%;
    border: 0px;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.principal {
    text-align: center;
}

.bottom-right {
    position: absolute;
    height: 4%;
    right: 1.5%;
    bottom: 3%;
    z-index: 111;
}

.top-left {
    position: absolute;
    height: 2%;
    left: 1.5%;
    top: 3%;
    z-index: 111;
}

@media only screen and (min-width: 320px) and (max-height: 820px) {
    .centered-element-pc {
        position: absolute;
        height: 20%;
        left: 30%;
        top: 39%;
        z-index: 9999;
    }
}

@media only screen and (min-width: 320px) {
    .centered-element-pc {
        position: absolute;
        height: 20%;
        left: 33%;
        top: 39%;
        z-index: 9999;
    }
}

@media only screen and (min-width: 1000px) {
    .centered-element-pc {
        position: absolute;
        height: 20%;
        left: 50%;
        margin-left: -100px;
        top: 39%;
        z-index: 9999;
    }
    .seguridad:hover {
        background-image: url("includes/Estrella-portada-grupo-paredes-amarilla-01.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        /*background-position: center -80px;*/
        clip-path: polygon(46% 0, 100% 0, 100% 100%, 31% 100%, 0 100%);
        transition: 0.5s;
        z-index: 98;
    }
    .moda:hover {
        background-image: url("includes/Estrella-portada-grupo-paredes-roja-01.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        /*background-position: center -80px;*/
        clip-path: polygon(100% 0, 100% 64%, 59% 100%, 0 100%, 0 0);
        transition: 0.5s;
        z-index: 78;
    }
    .bottom-right {
        position: absolute;
        height: 4%;
        right: 1.5%;
        bottom: 3%;
        z-index: 99;
    }
    .top-left {
        position: absolute;
        height: 2%;
        left: 1.5%;
        top: 3%;
        z-index: 79;
    }
}

.titulo {
    text-align: center;
}

.seguridad {
    position: absolute;
    background-image: url("includes/Estrella-portada-grupo-paredes-001.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 65%;
    height: 100%;
    right: 0px;
    text-align: center;
    z-index: 100;
    clip-path: polygon(46% 0, 100% 0, 100% 100%, 31% 100%, 0 100%);
}

.moda {
    position: absolute;
    background-image: url("includes/Estrella-portada-grupo-paredes-2.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    float: left;
    clear: none;
    width: 71%;
    height: 100%;
    text-align: center;
    z-index: 80;
    clip-path: polygon(100% 0, 100% 64%, 59% 100%, 0 100%, 0 0);
}

.izquierda {
    margin-top: 50%;
}

.derecha {
    margin-top: 50%;
}