@charset"UTF-8";

@font-face {
    font-family: 'playfair_displayblack';
    src: url('fuentes/playfairdisplay-black-webfont.eot');
    src: url('fuentes/playfairdisplay-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('fuentes/playfairdisplay-black-webfont.woff2') format('woff2'),
         url('fuentes/playfairdisplay-black-webfont.woff') format('woff'),
         url('fuentes/playfairdisplay-black-webfont.ttf') format('truetype'),
         url('fuentes/playfairdisplay-black-webfont.svg#playfair_displayblack') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'playfair_displaybold';
    src: url('fuentes/playfairdisplay-bold-webfont.eot');
    src: url('fuentes/playfairdisplay-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fuentes/playfairdisplay-bold-webfont.woff2') format('woff2'),
         url('fuentes/playfairdisplay-bold-webfont.woff') format('woff'),
         url('fuentes/playfairdisplay-bold-webfont.ttf') format('truetype'),
         url('fuentes/playfairdisplay-bold-webfont.svg#playfair_displaybold') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'playfair_displayregular';
    src: url('fuentes/playfairdisplay-regular-webfont.eot');
    src: url('fuentes/playfairdisplay-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fuentes/playfairdisplay-regular-webfont.woff2') format('woff2'),
         url('fuentes/playfairdisplay-regular-webfont.woff') format('woff'),
         url('fuentes/playfairdisplay-regular-webfont.ttf') format('truetype'),
         url('fuentes/playfairdisplay-regular-webfont.svg#playfair_displayregular') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'ralewaybold';
    src: url('fuentes/raleway-bold-webfont.eot');
    src: url('fuentes/raleway-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fuentes/raleway-bold-webfont.woff2') format('woff2'),
         url('fuentes/raleway-bold-webfont.woff') format('woff'),
         url('fuentes/raleway-bold-webfont.ttf') format('truetype'),
         url('fuentes/raleway-bold-webfont.svg#ralewaybold') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'ralewaylight';
    src: url('fuentes/raleway-light-webfont.eot');
    src: url('fuentes/raleway-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fuentes/raleway-light-webfont.woff2') format('woff2'),
         url('fuentes/raleway-light-webfont.woff') format('woff'),
         url('fuentes/raleway-light-webfont.ttf') format('truetype'),
         url('fuentes/raleway-light-webfont.svg#ralewaylight') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'ralewayregular';
    src: url('fuentes/raleway-regular-webfont.eot');
    src: url('fuentes/raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fuentes/raleway-regular-webfont.woff2') format('woff2'),
         url('fuentes/raleway-regular-webfont.woff') format('woff'),
         url('fuentes/raleway-regular-webfont.ttf') format('truetype'),
         url('fuentes/raleway-regular-webfont.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
*{
    box-sizing: border-box;
}

html{
    height: vh100;
    font-size: 90%;
    font-family: 'ralewayregular';
    }

body {
    margin: 5%  40%;
    align-content: center;
    background-color: #2C2C2C;
}
    

/* Colores:
Negro: #2C2C2C
Gris: #EDEDED
*/

main {
    display: flex;
    flex-direction: column;
    text-align:center;
    color: #EDEDED;
    width: 200px;
    height: auto;
    
}

img{
    display: block;
    margin: 10% auto 0 auto;
    width: 200px;
    height: auto;
}

div a{
    color: #EDEDED;
    text-decoration:none;
}

div {
    display: block;
    text-align-last:left;
    width:200px;
    height: auto;
}

main input{
    margin:0%;
    width: 200px;
    height: 40px;
    background-color: #EDEDED;
}

@media screen and (max-width: 30em){
    body{
    margin: 20%  20%;
    align-content: center;
    background-color: #2C2C2C;
        }
}