/*reset de margins y paddings*/

*{margin:0; padding:0;}


/*FUENTEs*/

@font-face { 
    font-family: FiraSans; 
    src: url('Font/FiraSans-Regular.otf'); 
}
@font-face { 
    font-family: FiraSans; 
    font-weight: bold;
    src: url('Font/FiraSans-Bold.otf'); 
}
@font-face { 
    font-family: FiraSans; 
    font-style: italic;
    src: url('Font/FiraSans-Italic.otf'); 
}
@font-face { 
    font-family: FiraSans;
    font-weight: bold;
    font-style: italic;
    src: url('Font/FiraSans-BoldItalic.otf'); 
}
@font-face { 
    font-family: FiraSans; 
    font-weight: 800;
    src: url('Font/FiraSans-Ultra.otf'); 
}


/*body*/

body{
    background-color: #f26f63
}

p {
    font-family: 'FiraSans';
    color: #f2c490
}

a {
    color: #f2c490;
    font-size: 12pt;
    font-family: 'firasans';
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
    color: #f26f63
}

#carilla {
    width: 960px;
    margin:auto
}

h1 {
    color: #f2c490;
    font-family: FiraSans;
    font-weight: 800;
    font-size: 47pt;
}

h2{
    color: #f2c490;
    font-family: FiraSans;
    font-style: italic;
    font-size: 27pt;    
}

h3 {
    color: #f26f63;
    font-family: 'firasans';
    font-style: italic;
    font-weight: bold;
}

ul {
    list-style: none
}




/*NAVEGACION*/

nav {
    background-color: #8c3f71;
}

nav ul,ol  {
    list-style: none;
    overflow: hidden;
}

nav ul li {
    float:left;
    width:120px;
    height:40px;
    padding-top: 20px;
    text-align: center;
}

nav li a{
text-decoration: none;
    font-family: firasans;
/*    color: #f26f63;*/
    padding-top: 10px;}

nav a:hover {
/*    color: #f2c490;*/
    text-decoration: underline
}

nav ul li ul {
    display:none;
    position:absolute;
    min-width: 120px;
}

nav ul li:hover ul {
    display: block;
    background-color: #8c3f71;    
}

.desple {
    float: none;
}

/*HEADER*/

#titulointro {
    width:470px;
    padding-top: 2em
}


/*TRABAJOS Y PROXIMA CLASE*/
.trabajosproximaclase div {
    float: left;
    width: 270px;
    height: 100px;
    margin: 10px;
    padding: 15px;
    background-color: #8c3f71;
    text-align: center
}


/*APUNTES Y MUESTRAS*/
.apuntesmuestras {
    clear: both
}

.apuntesmuestras #apuntes {
    float: left;
    width: 270px;
    margin: 10px;
    padding: 15px;
    background-color: #8c3f71;
    text-align: center
}

#teoricas {
    width: 590px;
    float: left;
    margin: 10px;
    background-color: #f2c490;
    text-align: center;
    padding-top: 10px
}


/*INTRODUCCION A LA MATERIA*/

.roldandice {
    clear: both
}

#imgintro {
    width:470px;
    float:left;
}

#textointro {
    width:440px;
    height: 330px;
    float: left;
    margin-left: 20px;  
    padding-left: 30px;
    padding-top: 80px
}

#textointro p {
    font-size: 24pt;
    font-style: italic;
    color: #8c3f71
}

#textointro a {
    margin-left: 240px;
/*    color: #8c3f71*/;

}

#textointro a:hover {
        background-color: #8c3f71; 
}


#legalintro{
    clear:both;
    padding-top: 2em;
}

#legalintro p{
    color: #8c3f71;
    font-style: italic;
    font-size: 9pt
}


/*FOOTER*/

footer p {
    font-style: italic;
    font-size: 9pt;
    color: #f26f63
}

footer a {
    font-size: 9pt
}

footer {
    clear: both;
    background-color: #8c3f71;
    padding: 20px 20px 10px 20px;
    overflow: hidden;
}

#logofooter,#textofooter {
    float: left
}

#textofooter {
    width:300px;
    margin-left: 20px
}

#socialfooter {
    float: right;
    margin-left: 20px;
    margin-right: 10px;
    text-align: center;
}

#socialfooter h3 {
    padding: 10px;
}

#socialfooter img {
    padding: 5px
}

/*SOBRA LA CATEDRA*/

/*CATEDRA INFO*/
#catedrainfo {
    width: 610px;
    padding:15px;
    margin-top: 60px;
    float: left
}

/*CATEDRA SIDE*/
#sidecatedra {
    float: right;
    margin-top: 130px
}

#sidecatedra ul {
    list-style: none
}

#sidecatedra li {
    padding: 15px;
    background-color: #8c3f71;
    text-align: center
}

/*DOCENTES TOP*/

#topdocentes {
margin-top: 30px
}

#topdocentes ul {
    list-style: none;
}

#topdocentes li {
    display: inline-block;
    padding: 15px;
    background-color: #8c3f71;
    text-align: center
}

/*DOCENTES*/
#docentesimg {
    margin-top: 30px
}

#docentesimg .img {
    width: 270px;
    height: 270px;
    background-color: #f2c490;
    border-radius: 500px;
    margin: 15px;
    float: left
}

#docentesimg .img img{
    max-width: 100%;
    height: auto;
}

#docentesimg .nombre {
    float: left;
    width: 270px;
    text-align: center;
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 20px
}

/*APUNTES*/

#apuntescarilla {
    margin-top: 30px;
    margin-bottom: 60px
}

#apuntescarilla a {
    background-color: #8c3f71;
    padding: 5px
}