@import url("fuentes.css");

/* IMAGEN FONDO */
body {
    background-color: rgb(0, 0, 0);
}

#contenedor {
    width: 1900px;
}

main{
    width:1800px;
    position: absolute;
}

/* LOGO */

header {
    width: 1900px;
}


header img {
    width: 87.5%;
    margin-left: 6%;
    margin-right: 6.5%;
    margin-top: 2%;
}

/* NAVEGACION */
nav {
    width: 90%;
    float: left;
    margin-top: 0px;
    margin-right: 4%;
    margin-left: 4%;
}

nav ul li {
    float: left;
    list-style: none;
}

nav ul li a {
    text-decoration: none;
    width: 273px;
    display: block;
    font-size: 12pt;
    font-family: 'fishmongerkxcond_light';
    text-align: center;
    border-bottom-style: solid;
    border-right-style: solid;
    padding-bottom: 5px;
    padding-top: 5px;
    color: rgb(255, 255, 255);
    background-color: rgb(0, 0, 0);
}

nav ul li a:hover {
    color: rgb(0, 0, 0);
    background-color: rgb(255, 255, 255);
}

/* TITULOS MATERIAS */

#titulos ul {
    float:left;
    width: 1800px;
    margin-left: 2.5%;
}

#titulos ul li {
    width: 29%;
    float: left;
    list-style: none;
    margin-top: 5%;
    margin: 28.5px;
    text-align: center;
}

#titulos ul li a {
    width: 523px;
    height: 600px;
    text-decoration: none;
    background-color: rgba(0, 0, 0, 0.85);
    font-size: 50pt;
    text-align: center;
    font-family: 'fishmongerkmedium_light';
    border-bottom: solid;
    padding-top: 20px;
    float:left;
}

#titulos ul li.mg a {
    color: rgb(120, 155, 237);
}

#titulos ul li.ma a {
    color: rgb(203, 48, 120);
}

#titulos ul li.mu a {
    color: rgb(42,208,176);
}

/* FONDO MATERIAS - IMAGENES */
#titulos ul li.mg {
    background-image: url(imagenes/f_general.jpg);
    background-size: 600px;
    height: 620px;
}

#titulos ul li.ma {
    background-image: url(imagenes/f_arquitectonica.jpg);
    background-size: 630px;
    height: 620px;
}

#titulos ul li.mu {
    background-image: url(imagenes/f_urbana.jpg);
    background-size: 630px;
    height: 620px;
}

/* H OVER MATERIAS */
#titulos ul li.mg a:hover {
    color: rgb(255, 255, 255);
    background-color: rgba(120, 155, 237, 0.7);
    height: 600px;
}

#titulos ul li.ma a:hover {
    color: rgb(255, 255, 255);
    background-color: rgba(203, 48, 120, 0.7);
    height: 600px;
}

#titulos ul li.mu a:hover {
    color: rgb(255, 255, 255);
    background-color: rgba(42,208,176,0.7);
    height: 600px;
}

/* PARRAFOS MATERIAS */
.item {
    position: relative;
}

.item p {
    color: #ffffff;
    font-size: 14pt;
    font-family: 'fishmongerkxcond_light';
    position: absolute;
    text-align: justify;
    top: 250px;
    margin-left: 27px;
    width: 473px;

}

footer {
    clear: both;
    width: 50%;
    margin-left: 25%;
    margin-right: 25%;
    font-size: 10pt;
    font-family: 'fishmongerkxcond_light';
    text-align: center;
    color: rgb(255, 255, 255);
}