@font-face {
    font-family: 'lexend' ;
    src: url(fonts/LexendZetta-VariableFont_wght.ttf);
}

body{
    background-color: rgb(29, 29, 29);
    margin: 0px;
}

.entrar{
    background-image: url('img/portada.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
}

.bt_entrar{
    position: absolute;
    bottom: 150px;
    left: 50%;
    transform: translateX(-50%);
}

.text_1{
    text-align: center;
    color: white;
    padding: 40px;
    padding-top: 200px;
    line-height: 1.5;
    font-family: 'lexend';
    font-size: 11px;
}

.vermell{
    color: red;
}

.pagina1{
    background-image: url('img/pag1.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.bt_començar{
    position: absolute;
    bottom: 150px;
    left: 50%;
}

.pagina2{
    background-image: url('img/pag2.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.bt_flecha{
    position: absolute;
    bottom: 150px;
    left: 50%;
}

.pagina3{
    background-image: url('img/pag3.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina4{
    background-image: url('img/pag4.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina5{
    background-image: url('img/pag5.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina6{
    background-image: url('img/pag6.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.bt_flecha_dobledreta{
    position: absolute;
    bottom: 150px;
    right: 20%;
}

.bt_flecha_doblerecte_esq{
    position: absolute;
    bottom: 150px;
    left: 20%;
}

.bt_flecha_doblerecte_dreta{
    position: absolute;
    bottom: 150px;
    right: 20%;
}

.bt_flecha_dobleesquerra{
    position: absolute;
    bottom: 150px;
    left: 20%;
}



.pagina7{
    background-image: url('img/pag7.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina8{
    background-image: url('img/pag8-restart-.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina9{
    background-image: url('img/pag8-restart-.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina10{
    background-image: url('img/pag6-1.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina11{
    background-image: url('img/pag6-2.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina12{
    background-image: url('img/pag6-3.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina13{
    background-image: url('img/pag6-3-1.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina14{
    background-image: url('img/pag6-3-3-restart.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina15{
    background-image: url('img/pag6-3-4.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina16{
    background-image: url('img/pag6-3-5.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina17{
    background-image: url('img/pag6-3-5-restart.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina18{
    background-image: url('img/pag6-3-6.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina19{
    background-image: url('img/pag6-3-7.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina20{
    background-image: url('img/pag6-3-7-sortida.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina21{
    background-image: url('img/pag7-1.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina22{
    background-image: url('img/pag7-2.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina23{
    background-image: url('img/pag7-3.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina24{
    background-image: url('img/pag7-4.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina25{
    background-image: url('img/pag7-5.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina26{
    background-image: url('img/pag7-6.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}

.pagina27{
    background-image: url('img/pag7-7.png');
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;

}