/*
  ESTILOS PERSONALIZADOS COLEGIO TENOCH
 */


/*******************************************************************************/
/*  ICONOS  */
/*******************************************************************************/
@font-face {
    font-family: 'icons-tenoch';
    src: url('../fonts/icons-tenoch.eot?13165585');
    src: url('../fonts/icons-tenoch.eot?13165585#iefix') format('embedded-opentype'),
        url('../fonts/icons-tenoch.woff?13165585') format('woff'),
        url('../fonts/icons-tenoch.ttf?13165585') format('truetype'),
        url('../fonts/icons-tenoch.svg?13165585#icons-tenoch') format('svg');
    font-weight: normal;
    font-style: normal;
}

.demo-icon {
    font-family: "icons-tenoch";
    font-style: normal;
    font-weight: normal;
    speak: never;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    text-align: center;
    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;
    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;
}

/*******************************************************************************/
/*  MENU  */
/*******************************************************************************/
li .nav-link {
    font-size: 25px;
}

.nav-link:hover {
    color: #fff !important;
    background-color: #ff2524;
    border-radius: 30px;
    transition-duration: 1s;
}


/*******************************************************************************/
/*  INSCRIPCIONES  */
/*******************************************************************************/
.inscripciones {
    background-image: radial-gradient(circle, #429bff 15%, #59a0f1);
    color: #fff;
}

.inscripciones h3 {
    margin-bottom: 0;
    letter-spacing: 10px;
    font-weight: lighter,
}

.inscripciones h3 {
        font-size: 5vh;
        letter-spacing: 8px;
    }





/*******************************************************************************/
/*  PORTADA  */
/*******************************************************************************/
/*
.jumbotron {
    background-image: url(../img/portada-tenoch.jpg);
    background-size: contain;
    resize: both;
    height: 725px;
}
*/
.jumbotron {
    background-color: #85defc;
    padding: 0;
    margin: 0;
}
.jumbotron .container h2 {
        font-size: 4vw;
/*        letter-spacing: 8px;*/
    }
    .jumbotron h1 {
        font-size: 5vw;
/*        letter-spacing: 8px;*/
    }







/*******************************************************************************/
/*  PORTADA  */
/*******************************************************************************/
.page-banner {
    position: relative;
    margin-top: 16px;
    margin-bottom: 16px;
    height: 320px;
    background-color: #F6F5FC;
    color: #645F88;
    border-radius: 30px;
    z-index: 10;
}

.page-banner.home-banner {
    height: auto;
}

.page-banner.home-banner .img-fluid {
    max-width: 400px;
    margin: 0 auto;
}

.page-banner.home-banner .btn-scroll {
    position: absolute;
    bottom: -14px;
    left: 0;
    right: 0;
    margin: auto;
    width: 26px;
    height: 40px;
    line-height: 44px;
    background-color: #fff;
    color: #645F88;
    text-align: center;
    border-radius: 40px;
    box-shadow: 0 2px 6px rgba(100, 95, 136, 0.24);
    transition: all .2s ease;
}

.page-banner.home-banner .btn-scroll:hover {
    text-decoration: none;
    background-color: #6C55F9;
    color: #fff;
}

@media (min-width: 768px) {
    .page-banner.home-banner {
        height: 540px;
    }
}

.page-hero.overlay-dark::before,
.page-banner.overlay-dark::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(52, 53, 49, 0.7);
    z-index: 1;
}

.page-banner .breadcrumb-item,
.page-banner .breadcrumb-item a {
    font-size: 14px;
}

.home-banner .row > *:first-child {
    padding-left: 8%;
}



/*******************************************************************************/
/*  BOTONES PRINCIPALES  */
/*******************************************************************************/
.card-service {
    display: block;
    margin: 16px auto;
    padding: 32px 20px;
    max-width: 300px;
    text-align: center;
    color: #FFF;
    border-radius: 58px;
}

.card-service .header {
    margin-bottom: 35px;
}

.card-service .icon {
    font-size: 120px;
}

.card-service a {
    color: #FFF;
    text-decoration: none;
}
.card-service h3 {
    font-size: 35px;
    font-weight: bolder;
}

.calendario {
    background-color: #1b90ff;
}

.calendario:hover {
    background-color: #1274d1;
}

.tareas {
    background-color: #5D50C6;
}

.tareas:hover {
    background-color: #443aa5;
}

.circulares {
    background-color: #F0453D;
}

.circulares:hover {
    background-color: #c6342f;
}

.galeria {
    background-color: #f773b6;
}

.galeria:hover {
    background-color: #b95386;
}



/*******************************************************************************/
/*  NOSOTROS  */
/*******************************************************************************/
#about {
    background-image: url(../img/bg-squares.png);
    background-size: cover;
/*    background-color: #56BBC3;*/
    background-color: #8DC152;
    padding-bottom: 0px;
    background-attachment: fixed;
}
#about .container h2 {
    font-size: 45px;
    font-weight: bolder;
}

#about .container h3 {
    color: black;
    font-size: 33px;
    font-weight: bolder;
}

#about .container p {
    color: white;
    font-size: 24px;
}

#about .divider {
    background-color: #FFF;
}



/*******************************************************************************/
/*  SERVICIOS  */
/*******************************************************************************/
#services p {
    font-size: 24px;
}

#services strong {
    color: crimson;
}

#services h2 {
    font-size: 45px;
    font-weight: bolder;
}

.features {
    text-align: center;
/*    background-color: aquamarine;*/
}

/* Icono del Servicio */
.features .header {
    display: inline-block;
    width: 130px;
    height: 130px;
    font-size: 95px;
    line-height: 110px;
    border-radius: 50%;
    text-align: center;
    color: #FFF;
    padding: 10px;
    background-color: red;
}

.features h5 {
    /*    color: #2D2B3A;*/
    font-size: 30px;
}

.features h5 a {
    text-decoration: none;
    color: #2D2B3A;
}

.features p {
    font-size: 13px;
    /*    color: #898798;*/
}

.features .iconIngles {
    background-color: #EF453C;
}

.features .iconEducacionFisica {
    background-color: #9FBE40;
}

.features .iconDanza {
    background-color: #DD26FF;
}

.features .iconMusica {
    background-color: #fdb7c1;
}

.features .iconTaekwondo {
    background-color: #FEB402;
}

.features .iconAreaJuegos {
    background-color: #0031f7;
}

.features .iconCCTV {
    background-color: #787878;
}

.features .iconComputacion {
    background-color: #c7cc00;
}

.features .iconSpinning {
    background-color: #8601b0;
}

.features .iconEscuelaPadres {
    background-color: #a6024f;
}

.features .iconBiblioteca {
    background-color: #00365c;
}

.features .iconProgramaSalud {
    background-color: #0094f7;
}

.features .iconEnfermeria {
    background-color: #f70000;
}

.features .iconPsicologia {
    background-color: #f3b2ff;
}

.features .iconCooperativa {
    background-color: #50c0cc;
}

.features .iconCafeteria {
    background-color: #ab8433;
}

.features .iconTransporte {
    background-color: #381c83;
}

.features .iconAreaFiestas {
    background-color: #f6e200;
}

.features .iconNepohualtzintzin {
    background-color: #0040b0;
}

.features .iconRobotica {
    background-color: #9FBE40;
}




/*******************************************************************************/
/*  SECCION AGENDAR CITA  */
/*******************************************************************************/
#meeting {
    background-image: url(../img/bg-school.png);
    background-size: cover;
    background-color: #ffa800;
    padding-bottom: 0px;
    background-attachment: fixed;
    color: #fff;
    padding: 20px 0;
}

#meeting h2 {
    font-size: 45px;
}

#meeting span {
    /* tamaño del icono */
    font-size: 33px;
}

#meeting a {
    border-radius: 54px;
}

#meeting .btn-success:hover {
    color: #fff;
    background-color: #278C5A;
    border-color: transparent;
}

#meeting span.label {
    font-size: 35px;
}



/*******************************************************************************/
/*  CONTACTO  */
/*******************************************************************************/
#contact {
    padding-bottom: 0px;
}
#contact h2 {
    font-size: 45px;
    font-weight: bolder;
}

#contact .iconContact {
    text-align: center;
/*    background-color: aquamarine;*/
}

.iconContact .header {
    display: inline-block;
    width: 130px;
    height: 130px;
    font-size: 95px;
    line-height: 110px;
    border-radius: 50%;
    text-align: center;
    color: #FFF;
    padding: 10px;
    background-color: red;
}

.iconContact .iconHorario {
    background-color: #6350F8;
}

.iconContact .iconTelefono {
    background-color: #9FBE3B;
}

.iconContact .iconUbicacion {
    background-color: #54B5BC;
}

.iconContact .iconEmail {
    background-color: #FDA90D;
}

#contact a {
color: #898798;
}
#contact a:hover {
    text-decoration: none;
color: #121212;
}



/*******************************************************************************/
/*  SECCION SUGERENCIAS  */
/*******************************************************************************/
#suggestions {
    background-image: url(../img/bg-wirls.png);
    background-size: cover;
    background-color: #429BFF;
    padding-bottom: 0px;
    background-attachment: fixed;
    color: #fff;
    padding: 20px 0;
}

#suggestions h2 {
    font-size: 50px;
}

#suggestions i {
    /* tamaño del icono */
    font-size: 50px;
}

#suggestions a {
    border-radius: 54px;
}

#suggestions .btn {
    color: #429BFF;
    background-color: #fff;
    border-color: transparent;
}

#suggestions .btn:hover {
    color: #fff;
    background-color: #3273BE;
    border-color: transparent;
}

#suggestions span {
    font-size: 50px;
}



/*******************************************************************************/
/*  PIE DE PAGINA  */
/*******************************************************************************/

.page-footer {
/*    background-image: url(../img/bg-circles.png);*/
/*    background-size: cover;*/
/*    background-color: #ABABAB;*/
/*    background-attachment: fixed;*/
    color: #fff;
    padding-top: 20px;
}

.page-footer h3 {
    margin-top: 10px;
    color: #303030;
}
.page-footer h5 {
    margin-top: 10px;
    color: #303030;
}

.page-footer li {
    font-size: 22px;
    margin-bottom: 12px;
}
.page-footer li a {
    font-size: 22px;
    color: #898798;
}
.page-footer li a:hover {
    color: #303030;
    text-decoration: none;
}

.footer-menu {
    position: relative;
    padding-left: 0;
    list-style: none;
}


.social-media-button a {
    display: inline-block;
    width: 70px;
    height: 70px;
    line-height: 44px;
    text-align: center;
    border-radius: 50%;
    background-color: #898798;
    color: #fff;
    padding: 10px;
    transition: all .2s linear;
}
.social-media-button a svg {
    vertical-align: baseline;
}



.social-media-button span {
    font-size: 50px;
/*    line-height: px;*/
}

.social-media-button a:hover {
    background-color: #FA2135;
    color: #fff;
    text-decoration: none;
    transform: rotate(360deg);
}



.derechos {
    background-color: #FA2135;
}

.derechos p {
    font-size: 20px;
    color: white;
    margin-bottom: 0;
/*    letter-spacing: 10px;*/
}



.titleCirculares {
    background-image: radial-gradient(circle, #F0453D 15%, #dd0c00);
    color: white;
}


.titleCirculares h3 {
    font-size: 10vw;

}

#circulares {
    background-color: #F6F5FC;
    padding-bottom: 150px;
/*    background-image: url(../img/bg-circles.png);*/
    background-size: cover;
    background-color: #e0e0e0;
    background-attachment: fixed;
}






.titleTareas {
    background-image: radial-gradient(circle, #7d5eff 15%, #5D50C6);
/*    background-color: #5D50C6;*/
    color: white;
}


.titleTareas h3 {
    font-size: 10vw;
}



.titleGaleria {
    background-image: radial-gradient(circle, #f773b6 15%, #ff349b);
/*    background-color: #5D50C6;*/
    color: white;
}


.titleGaleria h3 {
    font-size: 10vw;
}


.titleCalendario {
    background-image: radial-gradient(circle, #1b90ff 15%, #1274d1);
/*    background-color: #5D50C6;*/
    color: white;
}


.titleCalendario h3 {
    font-size: 10vw;
}




.features p {
    font-size: 20px;
    /*    color: #898798;*/
}





#circulares .imgGaleria img {
width: 400px;
    height: 300px;
    margin: 20px;

}





.btnRutaTransporte .btn {
    color: #ffffff;
    background-color: #ff9900;
    border-color: transparent;
    margin: 20px;
}

.btnRutaTransporte span {
    /* tamaño del icono */
    font-size: 50px;
}

.btnRutaTransporte a {
    font-size: 50px;
    border-radius: 10px;
}

.btnRutaTransporte .btn:hover {
    background-color: #ad6800;
}



.btnPagos2 .btn {
    color: #fff;
    background-color: #8d54d6;
    border-color: transparent;
    margin: 20px;
}

.btnPagos2 span {
    /* tamaño del icono */
    font-size: 50px;
}

.btnPagos2 a {
    font-size: 50px;
    border-radius: 10px;
}

.btnPagos2 .btn:hover {
    background-color: #3f1a6e;
}









.btnPagos .btn {
    color: #fff;
    background-color: #9fbe40;
    border-color: transparent;
    margin: 20px;
}

.btnPagos span {
    /* tamaño del icono */
    font-size: 50px;
}

.btnPagos a {
    font-size: 50px;
    border-radius: 10px;
}

.btnPagos .btn:hover {
    background-color: #749314;
}



.btnUtiles .btn {
    color: #fff;
    background-color: #429bff;
    border-color: transparent;
    margin: 20px;
}

.btnUtiles span {
    /* tamaño del icono */
    font-size: 50px;
}

.btnUtiles a {
    font-size: 50px;
    border-radius: 10px;
}

.btnUtiles .btn:hover {
    background-color: #0f5aad;
}




.btnRequisitos .btn {
    color: #fff;
    background-color: #f773b6;
    border-color: transparent;
    margin: 20px;
}

.btnRequisitos span {
    /* tamaño del icono */
    font-size: 50px;
}

.btnRequisitos a {
    font-size: 50px;
    border-radius: 10px;
}

.btnRequisitos .btn:hover {
    background-color: #b95386;
}








#tareas .container h2 {
    font-size: 45px;
    font-weight: bolder;
    color: #000;
}

#tareas .btn-lg {
    font-size: 35px;
}


/* modal */
.modal-content strong {
    color: #000 !important;
}

.modal-body ul li {
    font-size: 25px;
}