@font-face {
    font-family: 'capture_it_2regular';
    src: url('capture_it-webfont.woff2') format('woff2'),
         url('capture_it-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'oswaldbold';
    src: url('oswald-bold-webfont.woff2') format('woff2'),
         url('oswald-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'oswaldlight';
    src: url('oswald-light-webfont.woff2') format('woff2'),
         url('oswald-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'oswaldregular';
    src: url('oswald-regular-webfont.woff2') format('woff2'),
         url('oswald-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




* {
    margin: 0 0 0 0;
    text-decoration: none;
    box-sizing: border-box;
    font-family: "oswaldregular", Verdana, sans-serif;
}

body {
    background-color: black;
}


/*HEADER*/


#logo {
    display: flex;
    justify-content: center;
    flex: 1 1 1;
    margin: 7em 0 4em 1em;
}

#pagina {
    max-width: 480px;
    text-decoration: none;
    display: flex;
    flex: 1 1;
    flex-wrap: wrap;
    margin: auto;
}


#registro {
    margin-bottom: 4em;
}

#centrarinicio {
    /*padding-left: 1.5em;*/
    margin-left: auto;
    margin-right: auto;
    width: 15em;
}

/*MAIN*/

main{
    width: 30em;
}

h3 {
    font-family: "oswaldlight", Arial, sans-serif;
    color: white;
    font-size: 1em;
    margin: 2em 0em 0em 0em;
    line-height: 0.9em;
}

nav {
    margin: auto;
    width: 15em;
}

main nav ul {
    width: auto;
    margin-left: 0;
    padding-left: 0;
}

main nav ul li {
    text-align: center;
    line-height: 2em;
    margin-bottom: 1em;
    list-style: none;
    background-color: #F3175F;
    width: auto;
    font-family: "oswaldbold", Verdana, sans-serif;
}

main nav ul li a{
    width: auto;
    
}

.fondoamarillo {
    background-color: #FEF000;
}

.fondoturquesa {
    background-color: #099AAE;    
}

main nav ul li a {
    font-family: "oswaldregular", Arial, sans-serif;
    color: black;
    font-size: 1em;
    text-decoration: none;
}

/*main nav ul li a {
    display: block;
}*/

a:hover {
    color: white;
}

/*FIN MAIN*/

p {
    font-family: 'oswaldlight', Arial, sans-serif;
    color:white;
    padding: 1em 0.5em 1em 0.5em;
    font-size: 1em;
}

footer {
    margin: 0em 0.5em 1em 0.5em;
}




/*PAGINA2*/


header nav {
   margin: 0.5em 0 2.5em 0;
    padding: 0;
    width: auto;
}


header nav ul {
    display: flex;
    justify-content: space-between;
    padding: 0;
    margin: 0.5em 0.5em;
    width: 29em;
    /*flex-wrap: wrap;*/
    /*align-items:stretch;*/
}


header nav ul li {
    display: flex;
    flex-direction: column;
    list-style: none;
}

#cuadrados2 {
    height: 495px;
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content:space-between;
    align-items: stretch;
    margin-bottom: 3em;
    flex: 1;
}

.alicuadrado {
    display: flex;
    align-items: flex-end;
}


/*PAGINA 3*/

h1 {
    font-family: 'capture_it_2regular', Verdana, sans-serif;
    color: #FEF000;
    width: 5em;
    height: auto;
    line-height: 0,5em;
    font-size: 3em;
}


.boton1 {
    margin: 6em 0 2em 0;
    width: 30em;
    background-color: #F3175F
}

.boton2 {
    width: 30em;
    background-color: #099AAE;
    margin-bottom: 7em;
}

.botcenter {
    color: white;
    font-size: 2em;
    text-decoration: none;
    margin: 0 auto;
    text-align: center;
}

.botcenter:hover {
    color: black;
}


/*PAGINA 4*/
.button {
    color: darkgrey;
    font-family: 'oswaldlight', Verdana, sans-serif;
    font-size: 1.7em;
    width: 10em;
}

#center {
    text-align: center;
}

#right {
    text-align: right;
}

.imgrelativa {
    position: relative;
}

.botonfoto {
    position: absolute;
    left: 45%;
    bottom: 3%;
}

.botonrayo {
    position: absolute;
    left: 90%;
    bottom: 3%;
}

#tresbotones {
    display: flex;
    justify-content: space-around;
    width: 30em;
    margin-bottom: 2em;
    padding: 1em;
}



/*PAGINA 5*/

#fotito {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 2em;
    width: 20em;
    box-sizing: content-box;
    margin-left: auto;
    margin-right: auto;
    
}

#datos {
    width: 28em;
    margin-left: auto;
    margin-right: auto;
}

.flexiflexi {
    display: flex;
    margin-top: 0.5em;
    width: auto;

}

.item1 {
    margin-bottom: 2em;
}

.item2 {
    margin-bottom: 4em;
}

.item3 {
    margin-bottom: 2em;
}

.tipoblanca {
    font-family: 'oswaldlight', Verdana, sans-serif;
    color: white;
    size: 0.5em;
    margin-left: 0.5em;
}

.marginin {
    margin-left: 1em;
}


@media screen and (max-width: 30em) {
  
    #cuadrados2 {
    height: auto;
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    margin-bottom: 3em;
    flex: 1;
}
    
    .alicuadrado {
        display: flex;
        flex: 50%;
        align-items: baseline;
    }
    
    .achicarse {
    max-width: 100%;
    height: auto;
}
}