* {
    font-family: 'Carbona Test', sans-serif;
    position: relative;
    margin: 0;
    padding: 0;
}

@import url('https://fonts.cdnfonts.com/css/carbona-test');

body {
    overflow-x: hidden;
    height: 844px;
}

.topbar {
    position: fixed;
    height: 50px;
    top:0;
    left: 0;
    right: 0;
    z-index: 10;
    padding-left: 3.48%;
}

.logoart {
    width: 18.13%;
    height: 46%;
    margin-top: 3.5%;
    background-image: url(../img/artivalogotip.png);
    background-repeat: no-repeat;
    background-size: 90%;
}

.registre {
    width: 390px;
    height: 550px;
    margin: 0 auto;
    top: 110px;
}

h1 {
    font-size: 2.10rem;
    text-align: center;
    color: #282864;
    line-height: 2.3rem;
}

.formulari {
    width: 96%;
    height: 100%;
    margin: 0 auto;
    overflow: hidden;
    top: 20px;
}

input {
    width: 100%;
    height: 30px;
    border-radius: 10px;
    border: none;
    background: #E4E4EC;
}

#registre .correu input {
    width: 100%;
}

#registre .contrasenya input {
    width: 100%;
}

#registre .repetir input {
    width: 100%;
}

p {
    font-size: 1.063rem;
    margin-bottom: 7px;
}

.nom {
    height: 80px;
    outline: none;
    width: 45%;
    opacity: 70%;
    color: #282864;
    margin: 0 2.4%;
    float: left;
}

.cognoms {
    height: 80px;
    width: 45%;
    margin: 0 2.4%;
    opacity: 70%;
    color: #282864;
    float: left;
}

.data {
    height: 80px;
    outline: none;
    width: 45%;
    margin: 0 2.4%;
    opacity: 70%;
    color: #282864;
    float: left;
}

.genere {
    height: 80px;
    width: 45%;
    margin: 0 2.4%;
    opacity: 70%;
    color: #282864;
    float: left;
}

.correu {
    height: 80px;
    width: 95%;
    opacity: 70%;
    color: #282864;
    margin: 0 2.4%;
    float: left;
}

.contrasenya {
    height: 80px;
    width: 95%;
    opacity: 70%;
    color: #282864;
    margin: 0 2.4%;
    float: left;
}

.repetir {
    height: 80px;
    width: 95%;
    opacity: 70%;
    color: #282864;
    margin: 0 2.4%;
    float: left;
}

.checks {
    clear: both;
    font-size: 0.75rem;
    opacity: 70%;
    color: #282864;
    margin: 0 2.4%;
}

.checks p {
    font-size: 0.75rem;
    color: #282864;
    top: -17.5px;
    left: 21px;
}

.huma {
    width: 15px;
    height: 15px;
    border: 2px solid #555;
    border-radius: 4px;
    cursor: pointer;
    background-color: white;
}

.accepto {
    width: 15px;
    height: 15px;
    border: 2px solid #555;
    border-radius: 4px;
    cursor: pointer;
}

.condicions {
    top: -10px;
}

.botoRegis {
    width: 172px;
    height: 40px;
    background: #282864;
    top: 10px;
    text-align: center;
    line-height: 2.5rem;
    border-radius: 10px;
    color: white;
    font-weight: 410;
    left: 105px;
}

.botoRegis a {
    color: white;
    text-decoration: none;
    font-size: 1.063rem;
}

.inicia {
    text-align: center;
    line-height: 1rem;
}

.inicia p {
    font-size: 0.75rem;
    opacity: 70%;
    color: #282864;
    top: 17px;
}

.amb {
    top: 40px;
}

.amb p {
    opacity: 70%;
    text-align: center;
    font-size: 1rem;
    color: #282864;
}

.opcionsamb {
    top: 8px;
}

.google img {
    width: 7%;
    float: left;
    left: 40%;
}

.facebook img {
    width: 7%;
    float: left;
    left: 45%;
}

.benvinguda {
    width: 390px;
    margin: 0 auto;
    top: 200px;
}

#benvingut h2 {
    width: 370px;
    font-size: 0.75rem;
    color: #282864;
    opacity: 70%;
    text-align: justify;
    margin: 0 auto;
    line-height: 0.9rem;
    font-weight: 540;
    top: 20px;
}

#benvingut .formulari {
    width: 96%;
    height: 600px;
    padding-top: 25px;
    overflow: hidden;
}

#benvingut input {
    width: 100%;
    height: 30px;
    border-radius: 10px;
    border: none;
    background: #E4E4EC;
}

#benvingut .usuari {
    width: 95%;
    height: 80px;
    opacity: 70%;
    color: #282864;
    margin: 0 auto;
}

#benvingut .perfil {
    width: 95%;
    height: 80px;
    opacity: 70%;
    color: #282864;
    margin: 0 auto;
}

#benvingut .usuari input {
    width: 100%;
}

#benvingut .perfil input {
    width: 100%;
}

#benvingut .botoConti {
    width: 172px;
    height: 40px;
    background: #282864;
    font-size: 1.063rem;
    text-align: center;
    line-height: 2.5rem;
    border-radius: 10px;
    font-weight: 410;
    margin: 0 auto;
    top: 25px;
}

#benvingut .botoConti a {
    text-decoration: none;
    color: white;
}

#benvingut .enrere {
    margin-top: 60px;
}

#benvingut .enrere p {
    text-align: center;
    font-size: 1rem;
    margin-top: 40px;
    color: #F03C82;
    font-weight: 500;
}

#benvingut .enrere a {
    text-decoration: none;
}

#benvingut .xarxes {
    width: 235px;
    height: 55px;
    margin: 0 auto;
    top: 60px;
}

#benvingut .xarxes .tiktok {
    width: 30px;
    height: 34px;
    background-image: url(../img/tiktok.png);
    background-size: 80%;
    background-repeat: no-repeat;
    background-position: center;
    float: left;
    margin-left: 22.5px;
}

#benvingut .xarxes .twitter {
    width: 30px;
    height: 34px;
    background-image: url(../img/twitter.png);
    background-size: 90%;
    background-repeat: no-repeat;
    background-position: center;
    float: left;
    margin-left: 20px;
}

#benvingut .xarxes .instagram {
    width: 30px;
    height: 34px;
    background-image: url(../img/instagram.png);
    background-size: 90%;
    background-repeat: no-repeat;
    background-position: center;
    float: left;
    margin-left: 20px;
}

#benvingut .xarxes .youtube {
    width: 30px;
    height: 34px;
    background-image: url(../img/youtube.png);
    background-size: 95%;
    background-repeat: no-repeat;
    background-position: center;
    float: left;
    margin-left: 20px;
}

#destaca .destacar {
    height: 600px;
    top: 200px;
}

#destaca .destacar h1 {
    font-size: 2.25rem;
}

#destaca h2 {
    width: 370px;
    font-size: 0.75rem;
    color: #282864;
    opacity: 70%;
    text-align: justify;
    margin: 0 auto;
    line-height: 0.9rem;
    font-weight: 540;
    top: 20px;
}

.fotopuja {
    width: 140px;
    height: 140px;
    background-image: url(../img/pujafoto.png);
    background-size: 100%;
    margin: 0 auto;
    margin-top: 70px;
    background-repeat: no-repeat;
}

.pujafoto {
    text-align: center;
}

#destaca .destacar a {
    text-decoration: none;
}

.pujafoto p {
    margin-top: 25px;
    color: #282864;
    font-weight: 540;
    margin-bottom: 40px;
}

#destaca .botoConti {
    width: 172px;
    height: 40px;
    background: #282864;
    font-size: 1.063rem;
    text-align: center;
    line-height: 2.5rem;
    border-radius: 10px;
    color: white;
    font-weight: 410;
    margin: 0 auto;
    opacity: 50%;
}

.ometre {
    top: 8px;
    text-align: center;
    line-height: 1rem;
}

.ometre p {
    font-size: 0.75rem;
    opacity: 70%;
    color: #282864;
}

#destaca .enrere {
    margin-top: 50px;
}

#destaca .enrere p {
    text-align: center;
    font-size: 1rem;
    margin-top: 40px;
    color: #F03C82;
    font-weight: 500;
}

.tornar {
    width: 41px;
    height: 25px;
    background-image: url(../img/retorn.png);
    background-size: 75%;
    background-repeat: no-repeat;
    margin-top: 15px;
    opacity: 80%;
}

.opcions {
    width: 390px;
    height: 65px;
    background: transparent;
    margin: 0 auto;
    position: relative;
    top: 70px;
}

.opcions div {
    width: 120px;
    height: 27px;
    background: #282864;
    display: inline-block;
    margin-left: 5px;
    margin-bottom: 11px;
    border-radius: 17px;
    opacity: 62%;
}

.opcions .tots {
    opacity: 100%;
}

.centrar {
    position: relative;
    left: 65px;
}

.opcions p {
    text-align: center;
    margin: 0 auto;
    line-height: 1.7rem;
    font-size: 1rem;
    font-weight: 600;
    color: white;
}

.fotogaleria img {
    width: 124px;
    height: 124px;
    border-radius: 3.5px;
    top: 95px;
    float: left;
    margin: 5px;
    left: 15px;
}

#ajusta body {
    height: 100%;
}

.ajustarfoto {
    top: 190px;
    font-size: 2.25rem;
}

.ajustant {
    width: 328px;
    height: 305px;
    background-image: url(../img/ajusta.png);
    background-size: 100%;
    margin: 0 auto;
    position: relative;
    top: 10px;
    margin-bottom: 50px;
}

#ajusta .botoConti {
    width: 172px;
    height: 40px;
    background: #282864;
    font-size: 1.063rem;
    text-align: center;
    line-height: 2.5rem;
    border-radius: 10px;
    font-weight: 410;
    margin: 0 auto;
}

#ajusta .botoConti a {
    text-decoration: none;
    color: white;
}

#ajusta .enrere {
    margin-top: 50px;
}

#ajusta .enrere p {
    text-align: center;
    font-size: 1rem;
    margin-top: 40px;
    color: #F03C82;
    font-weight: 500;
}

#ajusta .enrere a {
    text-decoration: none;
}

#perfecte h1 {
    margin: 0 auto;
    position: relative;
    top: 120px;
    font-size: 2.25rem;
    margin-top: 100px;
}

#perfecte h2 {
    width: 370px;
    font-size: 0.75rem;
    color: #282864;
    opacity: 70%;
    text-align: justify;
    margin: 0 auto;
    line-height: 0.9rem;
    font-weight: 540;
    margin-top: 125px;
}

.fotoperfecte {
    width: 140px;
    height: 140px;
    background-image: url(../img/perfecte.png);
    background-size: 100%;
    margin: 0 auto;
    position: relative;
    top: 30px;
}

.perfefoto p {
    margin-top: 55px;
    color: #282864;
    font-weight: 540;
    text-align: center;
    margin-bottom: 41px;
}

a {
    text-decoration: none;
}

#perfecte .botoConti {
    width: 172px;
    height: 40px;
    background: #282864;
    font-size: 1.063rem;
    text-align: center;
    line-height: 2.5rem;
    border-radius: 10px;
    font-weight: 410;
    margin: 0 auto;
}

#perfecte .botoConti a {
    color: white;
}

#perfecte .enrere {
    margin-top: 66px;
}

#perfecte .enrere p {
    text-align: center;
    font-size: 1rem;
    margin-top: 40px;
    color: #F03C82;
    font-weight: 500;
}

#descripcio h1 {
    margin: 0 auto;
    position: relative;
    top: 160px;
    font-size: 2.25rem;
}

#descripcio h2 {
    width: 370px;
    font-size: 0.75rem;
    color: #282864;
    opacity: 70%;
    text-align: justify;
    margin: 0 auto;
    line-height: 0.9rem;
    font-weight: 540;
    margin-top: 165px;
}

#descripcio .formulari {
    width: 390px;
    height: 400px;
    padding-top: 15px;
    margin: 0 auto;
}

#descripcio input {
    width: 372px;
    height: 30px;
    border-radius: 10px;
    border: none;
    background: #E4E4EC;
}

#descripcio .puntsforts {
    height: 80px;
    outline: none;
    width: 180px;
    opacity: 70%;
    color: #282864;
    margin-bottom: -10px;
}

#descripcio .breudescripcio {
    color: #282864;
    opacity: 70%;
}

#descripcio p {
    font-size: 0.75rem;
    width: 372px;
}

#descripcio textarea {
    height: 84px;
    outline: none;
    width: 372px;
    opacity: 70%;
    color: #282864;
    border-radius: 10px;
    border: none;
    background: #E4E4EC;
}

#descripcio .botoConti {
    width: 172px;
    height: 40px;
    background: #282864;
    border-radius: 10px;
    font-weight: 410;
    margin: 0 auto;
    position: relative;
    top: 50px;
}

#descripcio .botoConti a {
    color: white;
}

#descripcio .botoConti p {
    width: 172px;
    font-size: 1.063rem;
    line-height: 2.5rem;
    text-align: center;
}

#descripcio .ometre {
    text-align: center;
    line-height: 1rem;
    margin-top: 50px;
}

#descripcio .ometre p {
    font-size: 0.75rem;
    opacity: 70%;
    color: #282864;
    margin-left: 5px;
}

#descripcio .enrere p {
    text-align: center;
    font-size: 1rem;
    margin-top: 40px;
    color: #F03C82;
    font-weight: 500;
}

#genial .preview {
    overflow: hidden;
}

#genial h1 {
    margin: 0 auto;
    position: relative;
    top: 100px;
    font-size: 2.25rem;
    margin-top: 120px;
}

#genial h2 {
    width: 370px;
    font-size: 0.75rem;
    color: #282864;
    opacity: 70%;
    text-align: justify;
    margin: 0 auto;
    line-height: 0.9rem;
    font-weight: 540;
    margin-top: 107px;
    margin-bottom: 30px;
}

#genial .previperfil {
    width: 390px;
    height: 130px;
    margin: 0 auto;
    top: 10px;
    left: 20px;
}

.fotoprev {
    width: 92px;
    height: 92px;
    background-image: url(../img/fotopreview.png);
    background-size: 100%;
}

.previperfil h3 {
    top: -90px;
    left: 105px;
    font-size: 1.313rem;
    color: #282864;
}

.previperfil p {
    font-size: 0.938rem;
    color: #282864;
    opacity: 30%;
    top: -92px;
    left: 116px;
}

.previperfil h4 {
    width: 248px;
    font-size: 0.938rem;
    color: #282864;
    top: -98px;
    left: 116px;
    font-weight: 400;
}

#genial .botoVeure {
    width: 220px;
    height: 40px;
    background: #282864;
    border-radius: 10px;
    font-weight: 410;
    margin: 0 auto;
    top: 50px;
}

#genial .botoVeure p {
    width: 200px;
    font-size: 1.063rem;
    line-height: 2.5rem;
    text-align: center;
    margin: 0 auto;
    margin-top: -30px;
}

#genial .botoVeure a {
    color: white;
}

#genial .enrere p {
    text-align: center;
    font-size: 1rem;
    margin-top: 90px;
    color: #F03C82;
    font-weight: 500;
}

#nouperfil .contingut {
    overflow: hidden;
}

#nouperfil .topbar {
    width: 430px;
    height: 50px;
    background: #282864;
    position: fixed;
}

#nouperfil .topbar p {
    color: white;
    font-size: 0.938rem;
    top: 17px;
}

#nouperfil .topbar .configuracio {
    width: 34px;
    height: 36px;
    background-image: url(../img/configuració.png);
    background-size: 100%;
    top: -17px;
    left: 374px;
}

#nouperfil .perfilnou {
    margin-top: 85px;
    margin-left: 20px;
}

#nouperfil .fotoprev {
    width: 92px;
    height: 92px;
    background-image: url(../img/fotopreview.png);
    background-size: 100%;
}

#nouperfil .perfilnou h3 {
    top: -75px;
    left: 105px;
    font-size: 1.313rem;
    color: #282864;
}

#nouperfil .perfilnou p {
    font-size: 0.938rem;
    color: #282864;
    opacity: 30%;
    position: relative;
    top: -75px;
    left: 116px;
}

#nouperfil .perfilnou h4 {
    width: 248px;
    font-size: 0.938rem;
    color: #282864;
    top: -80px;
    left: 116px;
    font-weight: 400;
}

.seguidors {
    width: 80px;
    height: 60px;
    margin-top: -60px;
    margin-left: 20px;
}

.seguidors h1 {
    font-size: 0.938rem;
    top: -10px;
}

.seguidors h2 {
    font-size: 0.938rem;
    top: -20px;
    color: #282864;
}

.seguits {
    width: 80px;
    height: 60px;
    margin-top: -62px;
    margin-left: 183px;
}

.seguits h1 {
    font-size: 0.938rem;
    position: relative;
    left: -10px;
    top: -7px;
}

.seguits h2 {
    font-size: 0.938rem;
    position: relative;
    top: -20px;
    color: #282864;
}

.agrada {
    width: 80px;
    height: 60px;
    margin-top: -60px;
    margin-left: 335px;
}

.agrada h1 {
    font-size: 0.938rem;
    position: relative;
    left: -5px;
    top: -7px;
}

.agrada h2 {
    font-size: 0.938rem;
    position: relative;
    top: -20px;
    color: #282864;
}

.editar {
    width: 100px;
    height: 30px;
    background: #00C8A0;
    border-radius: 4px;
    margin-left: 260px;
}

.editar p {
    color: white;
    font-size: 0.938rem;
    text-align: center;
    line-height: 2rem;
    margin-top: 5px;
}

.accions {
    width: 35px;
    height: 30px;
    background: #00C8A0;
    border-radius: 4px;
    margin-top: -35px;
    margin-left: 370px;
}

.accions p {
    color: white;
    font-size: 0.938rem;
    text-align: center;
    line-height: 1.5rem;
    margin-top: 5px;
}

.perfilinteract {
    width: 390px;
    height: 400px;
    top: 60px;
}

#nouperfil .publicacions {
    width: 100px;
    height: 30px;
    top: -41px;
    left: 20px;
    background: #282864;
    border-radius: 4px;
    margin-left: 5px;
}

#nouperfil .publicacions p {
    color: white;
    font-size: 0.875rem;
    text-align: center;
    line-height: 1.8rem;
    top: 1px;
}

#nouperfil .llistes {
    width: 58px;
    height: 30px;
    margin-left: 140px;
    border-radius: 4px;
    margin-top: -44px;
    top: -26px;
}

#nouperfil .llistes p {
    color: #282864;
    font-size: 0.875rem;
    text-align: center;
    line-height: 1.8rem;
}

#nouperfil .coleccions {
    width: 93px;
    height: 30px;
    margin-left: 210px;
    border-radius: 4px;
    margin-top: -44px;
    top: -12px;
}

#nouperfil .coleccions p {
    color: #282864;
    font-size: 0.875rem;
    text-align: center;
    line-height: 1.8rem;
}

#nouperfil .favorits {
    width: 93px;
    height: 30px;
    margin-left: 305px;
    border-radius: 4px;
    margin-top: -43.6px;
}

#nouperfil .favorits p {
    color: #282864;
    font-size: 0.875rem;
    text-align: center;
    line-height: 1.8rem;
    top: 1px;
}

#nouperfil hr {
    border-top: 1px solid #282864;
    border-bottom: 0;
    width: 400px;
    margin-left: 15px;
    margin-top: 0px;
}

#nouperfil .pujar {
    width: 390px;
    height: 300px;
    margin-top: 40px;
    margin-left: 20px;
}

#nouperfil .encara p {
    font-size: 1.125rem;
    text-align: center;
    color: #282864;
    opacity: 50%;
}

#nouperfil .pujarpubli {
    width: 220px;
    height: 40px;
    background: #282864;
    border-radius: 10px;
    color: white;
    font-weight: 410;
    margin: 0 auto;
    position: relative;
    top: 60px;
}

#nouperfil .pujarpubli p {
    width: 200px;
    font-size: 1.063rem;
    line-height: 2.5rem;
    text-align: center;
    margin: 0 auto;
    margin-top: -30px;
}

.botbar {
    position: fixed;
    height: 60px;
    bottom:0;
    left: 0;
    right: 0;
    z-index: 100;
    background-repeat: no-repeat;
    background-size: 100%;
    }
  
.icona {
    width: 7vw;
    height: 7vw;
    background-repeat: no-repeat;
    background-size: 100%;
    float: left;
    background-position: center;
    margin: 5.3vw 6.5vw 0 6.5vw;
    }

.PaginaPerfil {
    background-image: url(../img/Botbar/Botbar_Perfil.png);
}

.home {
    background-image: url(../img/Icones/Icona_Home.png);
}

.reptes {
    background-image: url(../img/Icones/Icona_Reptes.png);
}

.invisible {
    background: transparent;
}

.comunitat {
    background-image: url(../img/Icones/Icona_Comunitat.png);
}

.perfilClicada {
    background-image: url(../img/Icones/Clicades/Icona_Perfil_Clicada.png);
    margin-top: 14px;
} 

/* -------------- publicar ---------------- */

.publicar {
    position: relative;
    top: -20vw;
    left: 50%;
    transform: translateX(-50%);
    width: 7vw;
    height: 7vw;
    background-image: url(../img/Icones/Icona_Publicar.png);
    background-position: center;
    z-index: 99999999999999999999;
    margin: 4vw -15px;
    transform: scale(140%);
    transform-origin: center;
}

#alterna{
    visibility:hidden;
  }
  
  #alternador{
    z-index: -9999999;
  }
  
  #alternador label{
    width:7vw;
    height:7vw;
    border-radius:0.5rem;
    transition:all .5s ease;
    cursor:pointer;
    opacity:1;
  }
  
  #alternador input[type=checkbox]:checked+label{
    opacity:1;
  }
  
  #alternador input[type=checkbox]:checked+label~.quadreElegir{
    left:0rem;
  }

  .quadreElegir {
    width: 100%;
    height: 900px;
    margin: 0px;
    position: absolute;
    left:-500px;
    top: -800px;
    opacity: 1;
    background-color: rgba(255, 255, 255, 0.4);
}

.Opcions {
    width: 91%;
    height: 160px;
    background-color: #282C63;
    border-radius: 25px;
    margin: 0 auto;
    position: absolute;
    top: 560px;
    left: 20px;
}

.Tancar {
    width: 15px;
    height: 15px;
    background-image: url(../img/Publicar_Publicacio/Icona_Creu_Blanca.png);
    background-size: 100%;
    background-repeat: no-repeat;
    margin-top: 15px;
    margin-left: 15px;
}

.Opcions p {
    margin-top: 0px;
    color: white;
    font-size: 1.30rem;
    text-align: center;
    font-weight: bolder;
    font-family: 'Carbona Test', sans-serif;
}

.Apartats {
    width: 30%;
    height: 120px;
    text-align: center;
    float: left;
    margin-left: 9.86%;
    margin-right: 9.86%;
}

.Individual {
    width: 100%;
    height: 70px;
    background-color: white;
    border-radius: 20px;
    margin-bottom: 10px;
}

.Grupal {
    width: 100%;
    height: 70px;
    background-color: white;
    border-radius: 20px;
    margin-bottom: 10px;
}

.Individual img {
    margin-top: 6px;
    width: 70%;
    height: 90%;
    text-align: center;
}

.Grupal img {
    margin-top: 8px;
    width: 100%;
    height: 90%;
    position: center;
}

.Icona {
    width: 64px;
    height: 64px;
    margin-bottom: 3px;
    margin: 0 auto;
    border-radius: 100%;
    text-align: center;
}

#iniciar .contingut {
    width: 390px;
    height: 550px;
    margin: 0 auto;
    top: 210px;
}

#iniciar .formulari {
    width: 96%;
    height: 100%;
    margin: 0 auto;
    overflow: hidden;
    top: 20px;
}

#iniciar input {
    width: 100%;
    height: 30px;
    border-radius: 10px;
    border: none;
    background: #E4E4EC;
}

#iniciar .correu {
    height: 80px;
    width: 95%;
    opacity: 70%;
    color: #282864;
    margin: 0 2.4%;
    float: left;
}

#iniciar .contrasenya {
    height: 80px;
    width: 95%;
    opacity: 100%;
    color: #282864;
    margin: 0 2.4%;
    float: left;
}

#iniciar .contrasenya p {
    opacity: 70%;
}

#iniciar .correu input {
    width: 100%;
}

#iniciar .contrasenya input {
    width: 100%;
    opacity: 70%;
}

#iniciar .oblidat {
    width: 355px;
    height: 20px;
    top: 5px;
}

#iniciar .oblidat p {
    font-size: 0.625rem;
    text-align: right;
    color: #00C8FF;
    line-height: 1.2rem;
    font-weight: 500;
    opacity: 100%;
}

#iniciar .checks {
    clear: both;
    font-size: 0.75rem;
    opacity: 70%;
    color: #282864;
    margin: 0 2.4%;
    top: 10px;
}

#iniciar .checks p {
    font-size: 0.75rem;
    color: #282864;
    top: -17.5px;
    left: 21px;
}

#iniciar .huma {
    width: 15px;
    height: 15px;
    border: 2px solid #555;
    border-radius: 4px;
    cursor: pointer;
    background-color: yellow;
}

#iniciar .accepto {
    width: 15px;
    height: 15px;
    border: 2px solid #555;
    border-radius: 4px;
    cursor: pointer;
}

#iniciar .condicions {
    top: -10px;
}

#iniciar .botoInicia {
    width: 172px;
    height: 40px;
    background: #282864;
    top: 10px;
    text-align: center;
    line-height: 2.5rem;
    border-radius: 10px;
    color: white;
    font-weight: 410;
    left: 105px;
}

#iniciar .botoInicia a {
    color: white;
    text-decoration: none;
    font-size: 1.063rem;
}

#iniciar .inicia {
    text-align: center;
    line-height: 1rem;
}

#iniciar .inicia p {
    font-size: 0.75rem;
    opacity: 70%;
    color: #282864;
    top: 17px;
}

#iniciar .amb {
    top: 50px;
}

#iniciar .amb p {
    opacity: 70%;
    text-align: center;
    font-size: 1rem;
    color: #282864;
}

#iniciar .opcionsamb {
    top: 8px;
}

#iniciar .google img {
    width: 7%;
    float: left;
    left: 40%;
}

#iniciar .facebook img {
    width: 7%;
    float: left;
    left: 45%;
}