body {
     background-color: #F8F7F0;
    font-family: 'Titillium Web', sans-serif;
}
.fondocrema {
    background-color: #F8F7F0;
}
.fondonav {
background-color: #2E373C;

}
.nav-link{
    display: block;
    padding: .2rem 1rem;
}
.navbar-light .navbar-nav .nav-link{
    color: whitesmoke;
}
.nav-item a:hover {
    color: grey !important;
    cursor: pointer;
}
.modal-content {
    max-width: 90%;
    margin: auto;
}
/* titulos*/
.titulos {
    color: #61B7F0;
    font-size: 2rem;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700;
    
}
.subtitulos{
    color: #61B7F0;
    font-size: 2rem;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700 !important;
}
.subtitulos2{
    color: #61B7F0;
    font-size: 1.2rem;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 300 !important;
}
.circuloscursos {
    display:inline-block;
    line-height:0px;
    background-color: #3E61A2;
    border-radius:50%;
    border:5px solid;
    border-color: #D0D6DD;
    color: whitesmoke;
    font-size:3.25rem;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700 !important;
    margin: 0.5rem;
}
.circuloscursos span {
    display:inline-block;
    
    padding-top:50%;
    padding-bottom:50%;
    
    margin-left:20px;
    margin-right:20px;
}
.circuloscursos2 {
    display:inline-block;
    line-height:0px;
    background-color: #69BAF0;
    border-radius:50%;
    border:5px solid;
    border-color: #D0D6DD;
    color: whitesmoke;
    font-size:3.25rem;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700 !important;
    margin: 0.5rem;
}
.circuloscursos2 span {
    display:inline-block;
    
    padding-top:50%;
    padding-bottom:50%;
    
    margin-left:20px;
    margin-right:20px;
}

.fondopie{
    background-color: #EE2655;

}
.list-group-flush .list-group-item {
    background-color: transparent;
}
.cuadroactividad {
    width: 260px;
    height: 260px;
    border: 0;
    margin: 0;
    padding: 0;
    float: left;
}
.cuadroactividad .titulo {
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700 !important;
    font-size: 2rem;
    color: white;
    line-height: 2rem;
    margin-top: 10px;
}
.cuadroactividad p {
    margin-top: 5px;
    line-height: 1.2rem;
    font-size: 0.7rem;
}
.profesores {
    width: 25%;
    text-align: center;
    padding: 10px;

}
.profesores img {
    width: 50%;
}
.profesornombre {
    font-family: 'Titillium Web', sans-serif;
    text-align: center;
    font-weight: 300;
    font-size: 1rem;
    color: #3E61A2;
}
.profesorasig {
    font-size: 0.9rem;
    text-align: center;
    line-height: 1rem;

}
.subtitulo-galeria{
    font-family: 'Titillium Web', sans-serif;
    font-weight: 300;
    font-size: 1.5rem;
    color: #69BAF0;
}
.subtitulo-galeria span {
    font-family: 'Titillium Web', sans-serif;
    font-weight: 300;
    font-size: 0.7rem;
}
.actividad1{
    background-color: #CF018C;
}
.actividad2{
    background-color: #FFA10B;
}
.actividad3{
    background-color:#8C21AD;
}
.actividad4{
    background-color: #FF313E;
}
.logotipoadmision {
    position:absolute;
    top: 0;
    right: 0;
    z-index: 900;
    float: right;
}
.logotipoadmision a img{
    width: 100%;
    display: block;
    right: 0;
    float: right;
}
.listautiles {
    background-color: #EE2655;
    padding: 5px;
    width: 250px;
    height: auto;
    display: block;
    z-index: 99;
    position: fixed;
    max-width: 1140px;
    bottom:0px;
    right: 0;
    border-radius: 10px 0px 0px 0px;
    
}
.archivopdf {
    font-size: 1.5rem;
}
.listautiles div div span i {
    font-size: 3rem;
    color: #F8F7F0;
    margin-right: 5px;
}
a:hover > fa-file-pdf {
    color: red;
}
#unoslides{
    color: gray;
    margin-bottom: 50%
}

/* media queries */
@media (max-width: 575px) {
    .modal-content {
        max-width: 100%;
        margin: auto;
    }

   
    .navbar-collapse {
        height: 100vh;
    }
    .fotocelular img {
        width: 50%;
    }
    .logotipoadmision a img{
     width: 50%;
     display: block;
     right: 0;
     float: right;
    }
    #unoslides{
        color: gray;
        position: relative;
        top:0;
        left: 0;
    }
    .circuloscursos {
        display:inline-block;
        line-height:0px;
        background-color: #3E61A2;
        border-radius:50%;
        border:5px solid;
        border-color: #D0D6DD;
        color: whitesmoke;
        font-size:1rem;
        font-family: 'Titillium Web', sans-serif;
        font-weight: 700 !important;
        margin: 0.5rem;
    }
    .fondopie{
        text-align: center;
    }
    .circuloscursos2 {
        display:inline-block;
        line-height:0px;
        background-color: #69BAF0;
        border-radius:50%;
        border:5px solid;
        border-color: #D0D6DD;
        color: whitesmoke;
        font-size:1rem;
        font-family: 'Titillium Web', sans-serif;
        font-weight: 700 !important;
        margin: 0.5rem;
    }
    .circuloscursos2 span {
        display:inline-block;
        
        padding-top:50%;
        padding-bottom:50%;
        
        margin-left:20px;
        margin-right:20px;
    }
}
@media (min-width: 576px) {
   
    .circuloscursos {
        display:inline-block;
        line-height:0px;
        background-color: #3E61A2;
        border-radius:50%;
        border:5px solid;
        border-color: #D0D6DD;
        color: whitesmoke;
        font-size:1.5rem;
        font-family: 'Titillium Web', sans-serif;
        font-weight: 700 !important;
        margin: 0.5rem;
    }
    .circuloscursos2 {
        display:inline-block;
        line-height:0px;
        background-color: #69BAF0;
        border-radius:50%;
        border:5px solid;
        border-color: #D0D6DD;
        color: whitesmoke;
        font-size:1.5rem;
        font-family: 'Titillium Web', sans-serif;
        font-weight: 700 !important;
        margin: 0.5rem;
    }
    .circuloscursos2 span {
        display:inline-block;
        
        padding-top:50%;
        padding-bottom:50%;
        
        margin-left:20px;
        margin-right:20px;
    }
    .logotipoadmision a img{
        width: 50%;
        display: block;
        right: 0;
    }
   
    
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .modal-dialog {
        max-width:70% !important; /* New width for default modal */
    }

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    
 }

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    
 }
}