/*----- ESTILOS GENERALES -----*/


html, body {
    height: 100%;
}



html {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}

*, *:before, *:after {
    -webkit-box-sizing: inherit;
            box-sizing: inherit;
}


* {
    margin: 0;
    padding: 0;
}

body {
    overflow-x: hidden;
    font-family: 'Open Sans' , sans-serif;
}

.container {
    width: 90%;
    max-width: 1366px;
    margin: 0 auto;
}

/*estilos de los contenidos*
/*estilos del header*/
header {
    position: absolute;
    z-index: 900;
    -webkit-filter: none;
            filter: none;
    height: 50px;
    width: 100%;
}

.icono {
    z-index: 1000;
    position: absolute;
    float: left;
    -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
            transform: translateY(0%);
    background-size: contain;
    background-repeat: no-repeat;
    width: 10%;
    height: 63.5%;
    margin-top: 8px;
    left: 1%;
    top: 0;
}


#logo {
    padding: 1em 0;
    float: left;
}


#infoContacto {
    float: right;
    margin-top: 12px;
}

#infoContacto i {
    color: black;
    margin-right: 12px;
    font-size: 1.20rem;
}

/*----- 

SECCIÓN 1 - CABECERA

-----*/




article > section:nth-child(1) {
    position: relative;
    //background-color: #44A29F;
    background: -webkit-gradient(linear, left top, left bottom, from(#7cd1ce), to(#44A29F));
    background: -o-linear-gradient(top, #7cd1ce, #44A29F);
    background: linear-gradient(to bottom, #7cd1ce, #44A29F);
    background-size: cover;
    width: 100%;
    height: 100%;
}


.imagen_portada {
    -webkit-animation: manomove 10s infinite linear;
            animation: manomove 10s infinite linear;
    position: absolute;
    width: 30%; height: 90%;
    background-color: pink;
    background: url(../images/albums/mano.png);
    top: 0%;
    right: 20%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top;
}

@-webkit-keyframes manomove {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    50% {-webkit-transform: rotate(0deg) translateY(-20%);transform: rotate(0deg) translateY(-20%);}
    100% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
}

@keyframes manomove {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    50% {-webkit-transform: rotate(0deg) translateY(-20%);transform: rotate(0deg) translateY(-20%);}
    100% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
}

#intro {
    z-index: 20;
    padding: 0 0;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
}




#descripcion {
    position: absolute;
    z-index: 30;
    width: 100%;
    height: 70%;
    left: 0;
    -webkit-transition-duration:1000ms;
         -o-transition-duration:1000ms;
            transition-duration:1000ms;
    margin: 0px 0;
    -webkit-transform: translateY(50%);
        -ms-transform: translateY(50%);
            transform: translateY(50%);
    z-index: 20;
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    padding: 3em 3em;
    -webkit-box-flex: 2;
        -ms-flex-positive: 2;
            flex-grow: 2;
    color: #fff;
}


#logo-peekaboo {
    text-align: left;
    z-index: 30;
    margin: 0px 0;
    height: 8%;
    width: 100%;
    margin-bottom: 5%;
}

h1 {
    z-index: 20;
    text-align: left;
    font-size: 3.5rem;
    font-family: arial, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif ;
    margin-bottom: 25px;
}

#descripcion p {
    text-align: left;
    z-index: 20;
    margin-bottom: 30px;
    line-height: 1.35;
    font-style: italic;
    font-family: arial, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif ;
}


.infoContacto1, .infoContacto2, .infoContacto3 {
    z-index: 20;
    padding: 0 .5em;
    font-weight: 100;
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
    -webkit-transform-origin: center;
        -ms-transform-origin: center;
            transform-origin: center;
    -webkit-transition: all .1s ease;
    -o-transition: all .1s ease;
    transition: all .1s ease;  
    }
    
    .infoContacto1:hover {
        color: white;
        -webkit-transition: all .1s ease;
        -o-transition: all .1s ease;
        transition: all .1s ease;  
    }
    
    .infoContacto2:hover {
        color: white;
        -webkit-transition: all .1s ease;
        -o-transition: all .1s ease;
        transition: all .1s ease;  
    }
    
    .infoContacto3:hover {
        color: white;
        -webkit-transition: all .1s ease;
        -o-transition: all .1s ease;
        transition: all .1s ease;  
    }
    

#scroll1 {
    margin-bottom: -70px;
    z-index: 20;
    position: absolute;
    background-position: center;
    bottom: 0px;
    width: 100%;
    height: 10%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#scroll2 {
    margin-bottom: -70px;
    z-index: 20;
    -webkit-animation: upDown 400ms 1s infinite alternate linear;
            animation: upDown 400ms 1s infinite alternate linear;
    position: absolute;
    background-position: center;
    bottom:0px;
    width: 100%;
    height: 10%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

@-webkit-keyframes upDown {
    0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
    100% {-webkit-transform: translateY(5%);transform: translateY(5%);}
}

@keyframes upDown {
    0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
    100% {-webkit-transform: translateY(5%);transform: translateY(5%);}
}

//SECCION 2


article > section:nth-child(2) {
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e6e5e3));
    background: -o-linear-gradient(#fff, #e6e5e3);
    background: linear-gradient(#fff, #e6e5e3);
    width: 100%;
    height: 1400px;
    background-size: cover;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 50px 0px 0px;
}

h2 {
    color: #fff;
    margin-top: 10%;
}

.s2{
    position: relative;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left bottom;
    height: 67%;
    width: 100%;
    bottom: 10%;
}

.s2_cara_a{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/cara_a.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left bottom;
    height: 100%;
    width: 100%;
    bottom: 3%;
}

@-webkit-keyframes floating3 {
    0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
    100% {-webkit-transform: translateY(2%);transform: translateY(2%);}
}
@keyframes floating3 {
    0% {-webkit-transform: translateX(0%);transform: translateX(0%);}
    100% {-webkit-transform: translateY(2%);transform: translateY(2%);}
}

.s2_cd{
    position: absolute;
    -webkit-animation: cdmove 5s infinite alternate linear;
            animation: cdmove 5s infinite alternate linear;
    z-index: 200;
    background-image: url(../images/albums/disco_a.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
    bottom: 19%;
    left: 12%;
}

@-webkit-keyframes cdmove {
    0% { -webkit-transform: translateX(0%) rotate(0); transform: translateX(0%) rotate(0);}
    100% {-webkit-transform: translateX(180%) rotate(360deg);transform: translateX(180%) rotate(360deg);}
}

@keyframes cdmove {
    0% { -webkit-transform: translateX(0%) rotate(0); transform: translateX(0%) rotate(0);}
    100% {-webkit-transform: translateX(180%) rotate(360deg);transform: translateX(180%) rotate(360deg);}
}

@-webkit-keyframes sombramove {
    0% { -webkit-transform: translateX(0%) rotate(0); transform: translateX(0%) rotate(0);}
    100% {-webkit-transform: translateX(180%) rotate(0deg);transform: translateX(180%) rotate(0deg);}
}

@keyframes sombramove {
    0% { -webkit-transform: translateX(0%) rotate(0); transform: translateX(0%) rotate(0);}
    100% {-webkit-transform: translateX(180%) rotate(0deg);transform: translateX(180%) rotate(0deg);}
}

.s2_cd_sombra{
    -webkit-animation: sombramove 5s infinite alternate linear;
            animation: sombramove 5s infinite alternate linear;
    position: absolute;
    z-index: 180;
    background-image: url(../images/albums/sombradisco.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
    bottom: 14%;
    left: 12%;
}

.s2_sign{
    position: absolute;
    z-index: 20;
    background-image: url(../images/albums/sign.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left bottom;
    height: 520px;
    width: 520px;
    bottom: 15%;
    left: 65%;
}

.s2_titular {
    color: #d2cdd7; 
}

.s2_copy {
    position: absolute;
    padding: 2em 2em;
    height: 20%;
    width: 100%;
    bottom: 0%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
            color: #d2cdd7; 
    text-align: center;
}

.s2_copy2 {
    position: absolute;
    padding: 2em 2em;
    height: 20%;
    width: 100%;
    bottom: -10%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
            color: #d2cdd7; 
    text-align: center;
}
  
//SECCION 3

article > section:nth-child(3) {
    background-image: url(../images/albums/background.svg);
   // -webkit-animation: backgroundchange 10s infinite linear;
    //        animation: backgroundchange 10s infinite linear;
    background-color: #f8fee4;
    width: 100%;
    height: 1400px;
    background-size: cover;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 50px 0px 0px;
}

@-webkit-keyframes backgroundchange {
    0% {background-color:#514438 ;}
    33% {background-color: #3c6f29;}
    66% {background-color: #8f7a6d;}
    100% {background-color: #514438;}
}

@keyframes backgroundchange {
    0% {background-color:#514438 ;}
    33% {background-color: #3c6f29;}
    66% {background-color: #8f7a6d;}
    100% {background-color: #514438;}
}

article > section:nth-child(3) h2 {
    color: #3c6f29;
}

.s3_copy {
    position: absolute;
    padding: 2em 2em;
    height: 20%;
    width: 100%;
    bottom: 0%;
    color: #3c6f29;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.s3{
    position: relative;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left bottom;
    height: 67%;
    width: 100%;
    bottom: 0%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.s3_emeli1{
    -webkit-animation: emeli1 5s infinite alternate linear;
            animation: emeli1 5s infinite alternate linear;
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/emeli1.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right bottom;
    height: 100%;
    width: 70%;
    bottom: 0%;
    left: 20%;
}

@-webkit-keyframes emeli1 {
    0% {-webkit-transform: translateX(0%);transform: translateX(0%);}
    100% {-webkit-transform: translateX(2%) rotate(0deg);transform: translateX(2%) rotate(0deg);}
}

@keyframes emeli1 {
    0% {-webkit-transform: translateX(0%);transform: translateX(0%);}
    100% {-webkit-transform: translateX(2%) rotate(0deg);transform: translateX(2%) rotate(0deg);}
}

.s3_emeli2{
    -webkit-animation: emeli2 5s infinite alternate linear;
            animation: emeli2 5s infinite alternate linear;
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/emeli2.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right bottom;
    height: 100%;
    width: 70%;
    bottom: 0%;
    left: 20%;
}

@-webkit-keyframes emeli2 {
    0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
    100% {-webkit-transform: translateY(-5%);transform: translateY(-5%);}
}

@keyframes emeli2 {
    0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
    100% {-webkit-transform: translateY(-5%);transform: translateY(-5%);}
}

.s3_emeli3{
    -webkit-animation: emeli3 5s infinite alternate linear;
            animation: emeli3 5s infinite alternate linear;
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/emeli3.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right bottom;
    height: 100%;
    width: 70%;
    bottom: 0%;
    left: 20%;
}

@-webkit-keyframes emeli3 {
    0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
    100% {-webkit-transform: translateY(-10%);transform: translateY(-10%);}
}

@-webkit-keyframes emeli5 {
    0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
    100% {-webkit-transform: translateY(10%);transform: translateY(10%);}
}

@keyframes emeli3 {
    0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
    100% {-webkit-transform: translateY(-10%);transform: translateY(-10%);}
}

@keyframes emeli5 {
    0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
    100% {-webkit-transform: translateY(10%);transform: translateY(10%);}
}

.s3_emeli_pendiente{
    -webkit-animation: emeli4 5s infinite alternate linear;
            animation: emeli4 5s infinite alternate linear;
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/emeli_pendiente.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right bottom;
    height: 100%;
    width: 70%;
    bottom: 0%;
    left: 20%;
}

@-webkit-keyframes emeli4 {
    0% {-webkit-transform: translateX(0%);transform: translateX(0%);}
    100% {-webkit-transform: translateX(0%) translateY(0%) rotate(3deg);transform: translateX(0%) translateY(0%) rotate(3deg);}
}

@keyframes emeli4 {
    0% {-webkit-transform: translateX(0%);transform: translateX(0%);}
    100% {-webkit-transform: translateX(0%) translateY(0%) rotate(3deg);transform: translateX(0%) translateY(0%) rotate(3deg);}
}

.s3_album_em1{
    -webkit-animation: emeli3 10s infinite alternate linear;
            animation: emeli3 10s infinite alternate linear;
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/album_es1.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left bottom;
    height: 100%;
    width: 70%;
    bottom: 0%;
    left: 0;
}

.s3_album_em2{
    -webkit-animation: emeli1 10s infinite alternate linear;
            animation: emeli1 10s infinite alternate linear;
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/album_es2.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left bottom;
    height: 100%;
    width: 70%;
    bottom: 0%;
    left: 0;
}

/*SECCION 4*/

article > section:nth-child(4) {
    background-color: #b21d44;
    -webkit-animation: backgroundchange2 2s infinite alternate linear;
            animation: backgroundchange2 2s infinite alternate linear;
    width: 100%;
    height: 1400px;
    background-size: cover;
    padding: 50px 0px 0px;
}


@-webkit-keyframes backgroundchange2 {
    0% {background-color:#b21d44 ;}
    35% {background-color:#b21d44 ;}
    65% {background-color: #77c1c6;}
    100% {background-color: #77c1c6;}
}

@keyframes backgroundchange2 {
    0% {background-color:#b21d44 ;}
    35% {background-color:#b21d44 ;}
    65% {background-color: #77c1c6;}
    100% {background-color: #77c1c6;}
}


article > section:nth-child(4) h2 {
    bottom: 20%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.s4{
    position: absolute;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%; 
    display: -webkit-box; 
    display: -ms-flexbox; 
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
}

.s4_1{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
    top: 0%;
}

.s4_1_bg{
    position: absolute;
    background-color: #77c1c6;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_1_avion{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_1_avion.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_1_isla{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_1_isla.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_1_nube1{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_1_nube1.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_1_nube2{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_1_nube2.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}


.s4_1_nube3{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_1_nube3.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_1_logo{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_1_logo.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

/*2*/


.s4_2{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_2_bg{
    position: absolute;
    z-index: 220;
    background-color: #b21d44;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_2_mano1{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_2_mano1.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_2_mano2{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_2_mano2.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_2_logo{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_2_logo.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

/*3*/


.s4_3{
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_3_bg{
    position: absolute;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_3_mar{
    background-image: url(../images/albums/sa4_3_mar.svg);
    position: absolute;
    z-index: 200;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_3_tierra{
    background-image: url(../images/albums/sa4_3_tierra.svg);
    position: absolute;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_3_rio{
    background-image: url(../images/albums/sa4_3_rio.svg);
    position: absolute;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}


.s4_3_islas{
    background-image: url(../images/albums/sa4_3_islas.svg);
    position: absolute;
    z-index: 210;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}


.s4_3_logo{
    background-image: url(../images/albums/sa4_3_logo.svg);
    position: absolute;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

/*4*/

.s4_4{
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_4_bg{
    position: absolute;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_4_base{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_4_base.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_4_i{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_4_i.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_4_love{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_4_love.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}

.s4_4_ibiza{
    position: absolute;
    z-index: 220;
    background-image: url(../images/albums/sa4_4_ibiza.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 400px;
    width: 400px;
}


.s4_copy {
    position: relative;
    padding: 2em 2em;
    height: 20%;
    width: 100%;
    top: 50%;
    color: #fff;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
}


/*SECCIÓN 5*/

article > section:nth-child(5) {
    z-index: 2000000;
    background: -webkit-gradient(linear, left top, right top, from(#fbf1d6),color-stop(#f6dad6), to(#cde4f4));
    background: -o-linear-gradient(left, #fbf1d6,#f6dad6, #cde4f4);
    background: linear-gradient(to right, #fbf1d6,#f6dad6, #cde4f4);
    width: 100%;
    height: 1400px;
    background-size: cover;
    padding: 50px 0px 0px;
}


#disneyo_icono {
    -webkit-animation:disneyomove 10s infinite linear;
            animation:disneyomove 10s infinite linear;
    background-image: url(../images/albums/disneyo_icono.svg);  
    position: absolute;
    background-repeat: repeat;
    background-position: center;
    background-size: contain;
    width: 100%;
    height: 100%;
    opacity: .05;
}

@-webkit-keyframes disneyomove {
    0% {background-position-x: 0;}
    100% {background-position-x: -100%;}
}

@keyframes disneyomove {
    0% {background-position-x: 0;}
    100% {background-position-x: -100%;}
}

#disneyo {
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url(../images/albums/disneyo.svg);
    width: 100%;
    height: 50px;

}
.s5{
    top: 10%;
    position: relative;
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%; 
    display: -webkit-box; 
    display: -ms-flexbox; 
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
}

.s5_cartel1{
    -webkit-animation: emeli3 10s infinite alternate linear;
            animation: emeli3 10s infinite alternate linear;
    background-image: url(../images/albums/cartel1.png);
    -webkit-filter: drop-shadow(0px 30px 10px rgba(0, 0, 0, 0.13));
            filter: drop-shadow(0px 30px 10px rgba(0, 0, 0, 0.13));
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%; height: 500px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
}

.s5_cartel2{
    -webkit-animation: emeli5 10s infinite alternate linear;
            animation: emeli5 10s infinite alternate linear;
    background-image: url(../images/albums/cartel2.png);
    -webkit-filter: drop-shadow(0px 30px 10px rgba(0, 0, 0, 0.13));
            filter: drop-shadow(0px 30px 10px rgba(0, 0, 0, 0.13));
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%; height: 500px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
}

.s5_cartel3{
    -webkit-animation: emeli3 10s infinite alternate linear;
            animation: emeli3 10s infinite alternate linear;
    background-image: url(../images/albums/cartel3.png);
    -webkit-filter: drop-shadow(0px 30px 10px rgba(0, 0, 0, 0.13));
            filter: drop-shadow(0px 30px 10px rgba(0, 0, 0, 0.13));
    z-index: 220;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%; height: 500px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
}


.s5_copy {
    position: relative;
    padding: 2em 2em;
    height: 3%;
    width: 100%;
    top: 20%;
    color: #163b50;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
}


.s5_copy2 {
    position: relative;
    padding: 2em 2em;
    height: 5%;
    width: 100%;
    top: 20%;
    color: #163b50;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
}

/*----- 

SECCIÓN 6 MÁS PROYECTOS


-----*/


.container-section {
    position: absolute !important;
    z-index: 1000 !important;
    width: 100%;
}



a {
    text-decoration: none;
    width: 100%;
}

article > section:nth-child(6){
    cursor: pointer;
            animation: backgroundcolor 10s infinite alternate linear;
    -webkit-animation: backgroundcolor 10s infinite alternate linear;
    background-image: url(../images/ui/userinterface.png);
    height: 300px;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    background-position: 150px 50% !important;
    -webkit-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;
}

@-webkit-keyframes backgroundcolor {
    0% {background-color:#b21d44 ;}
    35% {background-color:#5b1db2 ;}
    65% {background-color: #77c1c6;}
    100% {background-color: #77c697;}
}

@keyframes backgroundcolor {
    0% {background-color:#b21d44 ;}
    35% {background-color:#5b1db2 ;}
    65% {background-color: #77c1c6;}
    100% {background-color: #77c697;}
}




article > section:nth-child(6):hover {
    -webkit-transition: 1s ease;
    -o-transition: 1s ease;
    transition: 1s ease;
    height: 300px;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    background-position: 150px 50% !important;
    filter: grayscale(100%);

}

@-webkit-keyframes seedtagrotate {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}

@keyframes seedtagrotate {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}

#seccionSeis {
    height: 300px;
    padding: 50px 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-flow: row wrap;
            flex-flow: row wrap;
}

#seccionSeis div {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    padding-right: 1.2rem;
}

h2 {
    margin-bottom: 20px;
}

#seccionSeis h2 {
   margin-top: 3%;
    font-size: 2.5rem;
    color: white;
}


#seccionSeis p {
    color: white;
    line-height: 2;
}


/*----- FOOTER -----*/



footer {
    z-index: 100;
    bottom: 0;
    z-index: 50;
    background-color: #F0EFEF;
    padding: 20px 0;
}

#icons {
    width: 100%;
    display:flex;
    text-align: center;
    align-items: center;
    justify-content: space-between;
    margin: .5em 0 .5em 0;
}

.mail, .telefono, .linkedin2, .cv, .instagram {color: black;}

.copyright {
    text-align: center;
    float: right;
    color:  #181C2B;
    padding-top: 8px;
}

.nav {
    float: left;
}

#pieDePagina {
    overflow: hidden;
}

.nav li {
    display: inline-block;
    font-size: 0.80rem;
    padding: 12px 0 0;
}

.nav li a {
    color:  #181C2B;
    text-decoration: none;
    padding-right: 1.5rem;    
}

.nav li a:hover {
    text-decoration: underline; 
}

#developed {
    font-size: .6rem;
    opacity: .5;}

/*------ 

MEDIA QUERIES 

---------*/



@media screen and (max-width: 3840px){ 
    .container {
        width: 91%;
        max-width: 3840px;
    }

    article > section:nth-child(2),article > section:nth-child(3), article > section:nth-child(4) {
        height: 1400px;
    }
}


@media screen and (max-width: 1920px){ 
    .container {
        max-width: 1920px;
    }
    #intro {
        height: 950px !important;
    }
    #descripcion {
        width: 90%;
        -webkit-transform: translateY(20%);
            -ms-transform: translateY(20%);
                transform: translateY(20%);
    }

    article > section:nth-child(2),article > section:nth-child(3), article > section:nth-child(4), article > section:nth-child(5) {
        height: 1000px;
    }


    
    .s2_cara_a{
        height: 70%;
        width: 100%;
        bottom: 20%;
    }

    
    .s2_cd{
        height: 280px;
        width: 280px;
        bottom: 31%;
        left: 12%;
    }

    
    .s2_cd_sombra{
        height: 280px;
        width: 280px;
        bottom: 27.5%;
        left: 12%;
    }
    
    .s2_sign{
        height: 320px;
        width: 320px;
        bottom: 27%;
        left: 65%;
    }

    .s4_1, .s4_1_bg,.s4_1_avion, .s4_1_isla, .s4_1_nube1, .s4_1_nube2, .s4_1_nube3, .s4_1_logo, .s4_2, .s4_2_bg,.s4_2_mano1, .s4_2_mano2, .s4_2_logo,     .s4_3, .s4_3_bg,.s4_3_mar, .s4_3_tierra, .s4_3_rio, .s4_3_islas, .s4_3_logo, .s4_4, .s4_4_bg,.s4_4_base, .s4_4_i, .s4_4_love, .s4_4_ibiza {
        height: 300px;
        width: 300px;
    }


    #amarillo {
        position: absolute;
        width: 60%;
        height: 250px;
        bottom: 0;
        left: 40%;
    }
}

@media screen and (min-width: 960px) and (max-width: 1300px){
    .col h3 {
        font-size: 1.05rem;
    }

    h1 {
        font-size: 2.3rem;
    }
    h2 {
        font-size: 1.43rem;
    }

    p {text-align: center;}

    #scroll1, #scroll2 {
        height: 80px;
        width: 80px;
        margin-left: -30px;
        margin-bottom: 100px !important;
    }

    article > section:nth-child(1){
        height: 700px !important;
    }


    article > section:nth-child(3),  article > section:nth-child(5) {
        height: 1000px;
    }

    article > section:nth-child(4) {
        height: 2200px !important;
    }

    article > section:nth-child(4) h2 {
        padding-bottom: 100px;
    }

    article > section:nth-child(4) p {
        margin-top: 50%;
    }

    #descripcion {
        -webkit-transform: translateY(30%);
            -ms-transform: translateY(30%);
                transform: translateY(30%);
    }

    
    .part1 {
        height: 2000px;
    }

.s4 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

    .s4_1, .s4_1_bg,.s4_1_avion, .s4_1_isla, .s4_1_nube1, .s4_1_nube2, .s4_1_nube3, .s4_1_logo, .s4_2, .s4_2_bg,.s4_2_mano1, .s4_2_mano2, .s4_2_logo,     .s4_3, .s4_3_bg,.s4_3_mar, .s4_3_tierra, .s4_3_rio, .s4_3_islas, .s4_3_logo, .s4_4, .s4_4_bg,.s4_4_base, .s4_4_i, .s4_4_love, .s4_4_ibiza {
        height: 400px;
        width: 400px;
    }
    #amarillo {
        position: absolute;
        width: 60%;
        height: 250px;
        bottom: 0;
        left: 40%;
    }
}

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

    #logo-peekaboo, h1, #descripcion p {text-align: center;}

    article > section:nth-child(1) { padding: 0; margin: 0;}

    .container {
        width: 80%;
    }

    header {
        width: 100%;
    }
    #intro{
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-flow: column wrap;
               flex-flow: column wrap;
    }

    .imagen_portada {
        opacity: .5;
        width: 50%;
    }

    h1 {
        font-size: 3.3rem;
    }
    #descripcion {
        -webkit-transition-duration: 1000ms;
             -o-transition-duration: 1000ms;
                transition-duration: 1000ms;
        z-index: 20;
        width: 100%;
        -webkit-transform: translateY(10%);
            -ms-transform: translateY(10%);
                transform: translateY(10%);
        padding: 2em 2em;
        left: 0;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

    #descripcion p {
        font-size: .8em;
    }

    #logo-peekaboo {
        position: relative;
        width: 70%;
    }


    h1 {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        font-size: 2.2rem;
    }
    
    article > section:nth-child(2),article > section:nth-child(3), article > section:nth-child(4), article > section:nth-child(5) {
        height: 1000px;
    }

    article > section:nth-child(4) {
        height: 2000px;
    }


    article > section:nth-child(6):hover {
        -webkit-transition: .3s ease;
        -o-transition: .3s ease;
        transition: .3s ease;
    }
    
    .s2_cara_a {
        width: 80%;
        height: 500px;
        left: 0%;
        background-position: center;
        background-size: contain;
    }

    .s2_cd {
        -webkit-animation: cdmovesmall 5s infinite linear;
                animation: cdmovesmall 5s infinite linear;
        z-index: 400;
        width: 250px;
        height: 250px;
        left: 40%;
        bottom: -2%;
        background-position: center;
        background-size: contain;
    }

    @-webkit-keyframes cdmovesmall {
        0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
        100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
    }

    @keyframes cdmovesmall {
        0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
        100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
    }
    .s2_cd_sombra {
        -webkit-animation: none;
                animation: none;
        z-index: 300;
        width: 250px;
        height: 250px;
        left: 40%;
        bottom: -5%;
        background-position: center;
        background-size: contain;
    }

    .s2_sign {
        width: 30%;
        height:250px;
        left: 55%;
        bottom: 40%;
    }

    .s2_copy {bottom: -30%;}

    .s3_emeli1, .s3_emeli2, .s3_emeli3, .s3_emeli_pendiente {
        margin-bottom: 20%;
    }
    .s3_album_em1, .s3_album_em2 {
        margin-bottom: 10%;
    }

    .s4 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
    
        .s4_1, .s4_1_bg,.s4_1_avion, .s4_1_isla, .s4_1_nube1, .s4_1_nube2, .s4_1_nube3, .s4_1_logo, .s4_2, .s4_2_bg,.s4_2_mano1, .s4_2_mano2, .s4_2_logo,     .s4_3, .s4_3_bg,.s4_3_mar, .s4_3_tierra, .s4_3_rio, .s4_3_islas, .s4_3_logo, .s4_4, .s4_4_bg,.s4_4_base, .s4_4_i, .s4_4_love, .s4_4_ibiza {
            height: 400px;
            width: 400px;
        }

        .s2_copy2 {
            position: absolute;
            padding: 2em 2em;
            height: 20%;
            width: 100%;
            bottom: -38%;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            color: #ccc6d2;
        }

        article > section:nth-child(4) h2 {margin-bottom: 10%;}

        .s4_copy {position: relative;top: 80%;}

        .s5_copy2 {
            position: relative;
            padding: 2em 2em;
            height: 5%;
            width: 100%;
            top: 20%;
            color: #163b50;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center !important;
                -ms-flex-align: center !important;
                    align-items: center !important;
            -webkit-box-pack: center !important;
                -ms-flex-pack: center !important;
                    justify-content: center !important;
        }

        #logoseedtag {
            width: 300px;
            height: 100%;
            top: 0%;
            left: 5%;
        }

        #amarillo {
            position: absolute;
            width: 60%;
            height: 250px;
            bottom: 0%;
            left: 40%;
        }
}

@media screen and (max-width: 659px){
  
    section {
        width: 100%;
        -ms-flex-preferred-size: 100%;
            flex-basis: 100%;
    }

    header {
        width: 100%;
        height: 100px;
    }
     #infoContacto {
         top: 40%;
         position: absolute;
        width: 100%;
        text-align: center;
        left: 50%;
        -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
                transform: translateX(-50%);
    }

    .icono {
        height: 32.5%;
        top: 5%;
        -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
                transform: translateX(-50%);
        left: 50%;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        position: absolute;
        float: center;
        width: 30px;
    }

    article > section:nth-child(1) {
        height: 700px;
    }


    /*SECCION 1*/

    article > section:nth-child(1) {
        height: 100%;
    }

    article > section:nth-child(2) {
        z-index: 1000;
    }

    #descripcion {
        left: 0;
        -webkit-transition-duration:1000ms;
             -o-transition-duration:1000ms;
                transition-duration:1000ms;
        margin: 0px 0;
        -webkit-transform: translateY(15%);
            -ms-transform: translateY(15%);
                transform: translateY(15%);
        z-index: 20;
        -ms-flex-preferred-size: 100%;
            flex-basis: 100%;
        padding: 2em 3em;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
    

    .imagen_portada {
        opacity: .4;
        -webkit-animation: mano1 5s infinite alternate linear;
                animation: mano1 5s infinite alternate linear;
        background-repeat: no-repeat;
        background-position: top center;
        background-size: contain;
        padding: 0 0;
        margin: 0 0;
        top: 0;
        height: 100%;
        width: 50%;
        z-index: 1;
    }

    @-webkit-keyframes mano1 {
        0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
        100% {-webkit-transform: translateY(-5%);transform: translateY(-5%);}
    }

    @keyframes mano1 {
        0% {-webkit-transform: translateY(0%);transform: translateY(0%);}
        100% {-webkit-transform: translateY(-5%);transform: translateY(-5%);}
    }

    #intro {
        height: 930px !important;
    }

 
    
    h1 {
        -webkit-transition-duration:2000ms !important;
             -o-transition-duration:2000ms !important;
                transition-duration:2000ms !important;
        z-index: 20;
        text-align: center;
        font-size: 1.7rem;
        font-family: arial, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif ;
        margin-bottom: 25px;
        margin-top: 20px;
    }
    

    
    #descripcion p {
        font-weight: 50;
        text-align: center;
        z-index: 20;
        font-size: .8rem;
        margin-bottom: 30px;
        line-height: 1.5;
        font-style: italic;
        font-family: arial, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif ;
    }


    article > section:nth-child(2) { height: 560px;}
  

  

    #scroll1, #scroll2 {
        z-index: 20;
        position: absolute;
        background-position: center;
        height: 10%;
        width: 100%;
        margin-bottom: -10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        left: 0;
        }


    article > section:nth-child(2) h2 {margin-top: 0%;}

    article > section:nth-child(2) p {bottom: -30%;}


    .s2 { height: 700px; }

    .s2_cara_a {
        width: 80%;
        height: 300px;
        left: 0%;
        background-position: center;
        background-size: contain;
    }

    .s2_cd {
        -webkit-animation: cdmovesmall 5s infinite linear;
                animation: cdmovesmall 5s infinite linear;
        z-index: 400;
        width: 250px;
        height: 250px;
        left: 40%;
        bottom: -2%;
        background-position: center;
        background-size: contain;
    }

    @-webkit-keyframes cdmovesmall {
        0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
        100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
    }

    @keyframes cdmovesmall {
        0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
        100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
    }
    .s2_cd_sombra {
        -webkit-animation: none;
                animation: none;
        z-index: 300;
        width: 250px;
        height: 250px;
       
        left: 40%;
        bottom: -5%;
        background-position: center;
        background-size: contain;
    }

    .s2_sign {
        width: 50%;
        height:300px;
        left: 45%;
        bottom: 30%;
    }



    p {
        background-position: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
 
    #seccionTres {
        text-align: center
    }
    article > section:nth-child(2),article > section:nth-child(3), article > section:nth-child(5) {
        height: 1000px;
    }

    article > section:nth-child(4) {
        height: 2000px;
    }

    .s3_album_em1,  .s3_album_em2{
        bottom: 5%;
        width: 100%;
    }
    
    .s3_emeli1, .s3_emeli2, .s3_emeli3, .s3_emeli_pendiente {
        margin-bottom: 60%;
    }

    .s4 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
    
        .s4_1, .s4_1_bg,.s4_1_avion, .s4_1_isla, .s4_1_nube1, .s4_1_nube2, .s4_1_nube3, .s4_1_logo, .s4_2, .s4_2_bg,.s4_2_mano1, .s4_2_mano2, .s4_2_logo,     .s4_3, .s4_3_bg,.s4_3_mar, .s4_3_tierra, .s4_3_rio, .s4_3_islas, .s4_3_logo, .s4_4, .s4_4_bg,.s4_4_base, .s4_4_i, .s4_4_love, .s4_4_ibiza {
            height: 400px;
            width: 400px;
        }

        article > section:nth-child(4) h2 {margin-bottom: 10%;}

        .s4_copy {position: relative;top: 80%;}


    #logoseedtag {
        width: 250px;
        height: 100%;
        top: -10%;
        left: 50%;
        -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
                transform: translateX(-50%);
    }

    #amarillo {
        position: absolute;
        width: 60%;
        height: 150px;
        bottom: 0%;
        left: 40%;
    }


  /*pie de pagina*/

  #pieDePagina {
    text-align: center;
}

.nav {
    float: none;
}

.nav li {
    display: block;
    margin: 20px 0;
}

.nav li a {padding-right: 0rem;}

.copyright {
    float: none;
    border-top: 1px solid #3e3e3e;
    margin-top: 30px;
}

#developed {
    font-size: .6rem;
    opacity: .5;}

#intro {height: 850px !important;}
#descripcion {top: 52%;}
#scroll1, #scroll2 {top: 40%;}

.s2_cara_a {
    -webkit-animation: leftright 3s infinite cubic-bezier(0.175, 0.885, 0.32, 1.275);
            animation: leftright 3s infinite cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.s2_copy, .s3_copy {top: 110%;}
.s2_copy2 {top: 114%;}

.s2_copy,.s2_copy2, .s3_copy, .s4_copy, .s5_copy, .s5_copy2 {text-align: center;}

#icons {
    display:flex;
    text-align: center;
    align-items: center;
    justify-content: space-around;
    margin: 1em 0 1em 0;
}

}


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


    article > section:nth-child(1) {
        height: 750px !important;
    }

    .imagen_portada {
        bottom: -60%;
        opacity: .7;
    }

    #descripcion {top: 56%; padding: 0 0;}

    #descripcion p {padding: 0 0 !important;margin-top: -3%;}

    #scroll1, #scroll2 {top: 26%;}

    #intro {height: 670px !important;}

    .s2_cara_a, .s2_sign {margin-bottom: 20%;}
    .s2_cd, .s2_cd_sombra {left: 22%; margin-bottom: -50%;}

    .s2_sign {    left: 16%;
        top: 20%;
        width: 100%;
        margin-bottom: 0%;
        background-size: contain;
        position: relative;}
    .s2_cara_a {
        -webkit-animation: leftright 3s infinite cubic-bezier(0.175, 0.885, 0.32, 1.275);
                animation: leftright 3s infinite cubic-bezier(0.175, 0.885, 0.32, 1.275);
        width: 100%; left: 10%; margin-bottom: -30%;
    }



    .s2_copy, .s2_copy2, .s3_copy, .s4_copy, .s5_copy, .s5_copy2 {font-size: .9em;}

    .s2_copy {top: 140%;}
    .s2_copy2 {top: 144%;}
    .s3_copy {top: 114%;}

    .s2_copy,.s2_copy2, .s3_copy, .s4_copy, .s5_copy, .s5_copy2 {text-align: center;}
    .s3_album_em1 {
        background-image: url(../images/albums/album_es1_m.png);
        background-position: center;
        margin-bottom: -20% !important;
    }
    .s3_album_em2 {
        -webkit-animation: emeli3 10s infinite alternate linear;
                animation: emeli3 10s infinite alternate linear;
        background-image: url(../images/albums/album_es2_m.png);
        position: relative;
        bottom: -80%;
        width: 90%;
        height: 200px;
        left: 5;
        padding: 0 0;
        background-position: center;
    }
    .s3_emeli1, .s3_emeli2, .s3_emeli3,.s3_emeli_pendiente {margin-bottom: 100%;} 
    .s3_album_em1 {margin-bottom: 30%;}

    .s3_album_em2 {width: 100%;}

    article > section:nth-child(2) {
        height: 1150px; 
    }

     article > section:nth-child(5) {
        height: 1500px;
    }

    #disneyo_icono {
        background-size: cover;
        width: 100%;
        height: 100%;
        background-position: center;
        margin-top: 100%;
    }

    article > section:nth-child(5) {
        background: -webkit-gradient(linear, left top, left bottom, from(#fbf1d6),color-stop(#f6dad6), to(#cde4f4));
        background: -o-linear-gradient(top, #fbf1d6,#f6dad6, #cde4f4);
        background: linear-gradient(to bottom, #fbf1d6,#f6dad6, #cde4f4);
    }

    .s5 {
        width: 100%;
        height: 1000px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: column !important;
        justify-content: center;
        align-items: center;
        
    }

    .s5_cartel1, .s5_cartel2, .s5_cartel3 {
        -webkit-animation: emeli3 10s infinite alternate linear;
        animation: emeli3 10s infinite alternate linear;
    }

    .s5_copy2, .s5_copy {top: 14%;}


    #logoseedtag {
        top: -20%;
    }
  /*pie de pagina*/

  #pieDePagina {
    text-align: center;
}

.nav {
    float: none;
}

.nav li {
    display: block;
    margin: 20px 0;
}

.nav li a {padding-right: 0rem;}

.copyright {
    float: none;
    border-top: 1px solid #3e3e3e;
    margin-top: 30px;
}

#developed {
    font-size: .6rem;
    opacity: .5;}

    #icons {
        display:flex;
        text-align: center;
        align-items: center;
        justify-content: space-around;
        margin: 1em 0 1em 0;
    }
}

/* -----ANIMATIONS----- */

@-webkit-keyframes leftRight {
    0% {-webkit-transform: translateX(-40%);transform: translateX(-40%); opacity: 0;}
    100% {-webkit-transform: translateX(0%);transform: translateX(0%); opacity: 1;}
}

@keyframes leftRight {
    0% {-webkit-transform: translateX(-40%);transform: translateX(-40%); opacity: 0;}
    100% {-webkit-transform: translateX(0%);transform: translateX(0%); opacity: 1;}
}

@-webkit-keyframes color {
    0% {background-color: white;}
    100% {background-color: rgba(255, 255, 255, 0.699);}
}

@keyframes color {
    0% {background-color: white;}
    100% {background-color: rgba(255, 255, 255, 0.699);}
}

@-webkit-keyframes leftright {
    0% {transform: translate(0);}
    50% {transform: translate(5%);}
    100% {transform: translate(-5%);}
}

@keyframes leftright {
    0% {transform: translate(0);}
    50% {transform: translate(3%);}
    100% {transform: translate(-3%);}
}