@import url("https://fonts.googleapis.com/css?family=Raleway:300,400,600");
@charset "UTF-8";
@font-face {
    font-family: "Panton-Bold";
    src: url("../itsav-fonts/Panton-Bold.otf") format("truetype");
}

@font-face {
    font-family: "Montserrat-Bold";
    src: url("../itsav-fonts/Montserrat-Bold.ttf") format("opentype");
}

@font-face {
    font-family: "Panton-Bold";
    src: url("../itsav-fonts/Panton-Bold.otf") format("truetype");
}

::-webkit-scrollbar {
    width: 7px;
}

::-webkit-scrollbar-track {
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 30px;
}

::-webkit-scrollbar-button {
    background-color: transparent;
}

::-webkit-scrollbar-corner {
    background-color: transparent;
}

body {
    padding: 0;
    margin: 0;
    width: 100%;
    background: white;
}

body h1 {
    font-size: 1.8em;
    border-bottom: 1px solid lightgray;
    margin-bottom: 1em;
    font-family: Montserrat-Bold;
    margin-top: 1em;
    color: #333;
}

body h2 {
    font-family: Montserrat-Bold;
    font-size: 1.4em;
    margin-bottom: 1em;
}

body p {
    text-align: justify;
    font-family: "Panton-Bold";
    font-size: 16px;
}

body div {
    font-family: Panton-Bold;
}

body div strong {
    font-family: Panton-Bold;
}

body div p a {
    display: block;
    color: #333;
    cursor: pointer;
    text-decoration: none;
}

body div p a:hover {
    text-decoration: none;
}

body p span {
    display: block;
    padding-left: 1em;
}

body div h3 {
    font-family: Panton-Bold;
    font-size: 15px;
}

body .sec-noticias,
.sec-conv {
    margin-bottom: 0em;
    padding-top: 0em;

}

body .sec-noticias a {
    text-decoration: none;
    color: #333;
}

body .sec-noticias div {
    margin-bottom: 2em;
}

body .sec-noticias img {
    width: 100%;
    height: auto;
}

body .sec-noticias h3 {
    text-align: left;
}

body .sec-noticias p {
    text-align: left;
    font-size: 12px;
}

body .subtitulo {
    font-family: Montserrat-Bold;
    text-align: left;
}

#lista3 {
    counter-reset: li;
    list-style: none;
    *list-style: decimal;
    font: 15px 'Panton-Bold', 'Panton-Bold';
    padding: 0;
    margin-bottom: 4em;
    text-shadow: 0 1px 0 rgba(217, 195, 160, .5);
    padding-left: 0;
}

#lista3 ol {
    margin: 0 0 0 2em;
}

#lista3 li {
    position: relative;
    display: block;
    padding: .4em .4em .4em .8em;
    *padding: .4em;
    margin: .5em 0 .5em 2.5em;
    background: transparent;
    border: 1px solid #ddd;
    color: #444;
    text-decoration: none;
    transition: all .3s ease-out;
    cursor: pointer;
}

#lista3 li:hover {
    background: #D9C3A0;
}

#lista3 li:before {
    content: counter(li);
    counter-increment: li;
    position: absolute;
    left: -2.5em;
    top: 50%;
    margin-top: -1em;
    background: #1B396A;
    height: 2em;
    width: 2em;
    line-height: 2em;
    text-align: center;
    font-weight: bold;
}

#lista3 li:after {
    position: absolute;
    content: '';
    border: .5em solid transparent;
    left: -1em;
    top: 50%;
    margin-top: -.5em;
    transition: all .3s ease-out;
}

#lista3 li:hover:after {
    left: -.5em;
    border-left-color: #215A4D;
}

body .carreras {
    height: auto;
    padding-top: 3em;
    padding-bottom: 1em;
    /** Codigo para poner de fondo la img en noticias*/
    background-image:  url("https://alvarado.tecnm.mx/portada.fa601b3c4d4c72025ef7.jpg");
    background-size: cover;
    background-repeat:no-repeat;
    background-position: center center;
}

body .carreras h2 {
    margin-bottom: 2em;
    text-align: center;
}

body .carreras a {
    text-decoration: none;
    color: #333;
}

body .carreras .carrera {
    font-family: Montserrat-Bold;
    font-size: 14px;
   /** background-color: white; */

    margin-bottom: 3em;
}

body .carreras .carrera a {
    margin-bottom: 0;
}

body .carreras div h4 {
    font-family: Montserrat-Bold;
    font-size: 16px;
    text-align: center;
    height: 35px;
    padding-bottom: 1.5em;
}

body .carreras div img {
    width: 160px;
    height: 160px;
    margin-bottom: 1em;
}

body .sec-conv {
    background-color: #a51c30;
    color: white;
    margin-bottom: 0;
    padding-bottom: 1em;
    padding-top: 1em;
}

body .n-imagenes {
    margin-top: 1em;
    margin-bottom: 1em;
}

body .n-imagenes img {
    width: 140px;
    margin: 5px;
}

body .sec-conv h2 {
    margin-bottom: 1em;
}

body .sec-conv div {
    margin-bottom: 2em;
}

body .sec-conv div div {
    background-color: white;
    border: 1px solid lightgray;
    margin-bottom: 2em;
    border-top: 5px solid #304661;
    border-left: 2px solid lightgray;
    border-right: 2px solid lightgray;
    border-bottom: 2px solid lightgray;
    padding-bottom: 1em;
}

body .sec-conv div div img {
    width: 100%;
}

body .sec-conv div div h4 {
    color: #414141;
    font-family: Montserrat-Bold;
    font-size: 15px;
}

body .sec-conv div div span {
    color: #414141;
    font-family: Montserrat-Bold;
    font-size: 15px;
}

body .sec-conv div div p {
    color: #414141;
    font-family: Montserrat-Bold;
    font-size: 15px;
    text-align: center;
}

body .campus {
    background-color: #1B396A;
    color: white;
    height: auto;
    padding-top: 2em;
    padding-bottom: 2em;
}

body .campus h2 {
    font-family: Montserrat-Bold;
    text-align: center;
    margin-top: .5em;
    margin-bottom: 1.5em;
}

body .campus div {
    margin-bottom: 2em;
}

body .campus p {
    text-align: center;
    font-size: 15px;
}

body .campus h3 {
    font-family: Montserrat-Bold;
    font-size: 20px;
    margin: 0;
    margin-bottom: .4em;
    text-align: center;
}

body .campus div img {
    width: 100%;
    margin-bottom: 1em;
}

body .contraloria {
    background-color: #FFFFFF;
    color: white;
    height: auto;
    padding-top: 2em;
    padding-bottom: 2em;
}

body .contraloria h2 {
    font-family: Montserrat-Bold;
    text-align: center;
    margin-top: .5em;
    margin-bottom: 1.5em;
}

body .contraloria div {
    margin-bottom: 2em;
}

body .contraloria {
    text-align: center;
    font-size: 15px;
}

body .contraloria h3 {
    color: #000000;
    font-family: Montserrat-Bold;
    font-size: 20px;
    margin: 0;
    margin-bottom: .4em;
    text-align: center;
}

body .contraloria div img {
    width: 100%;
    margin-bottom: 1em;
}


/** sitios de interes */

body .interes {
    background-color: #eeeeee;
}

body .redesocial {
    background-color: #eeeeee;
}


/**pie del tec nm */

body .pieazul {
    background-color: #1B396A;
}


/**  pie gobierno */

.main-footer {
    background-color: #13322B;
    min-height: 56px;
    color: #FFF;
    padding: 0px 0 0px;
    text-align: left;
    font-weight: 300
}

/****/
.main-footer {
    line-height: auto;
    /*background-color: #12322B;*/
    background-image: url(https://framework-gb.cdn.gob.mx/landing/img/fondofooter.jpg);
    color: white;
    background-size: cover;
    background-position: bottom;
    padding: 30px 10px 10px;
    /*margin-bottom: 30px*/
}

.main-footer {
    font-size: 14px
}

.main-footer h5 {
    font-weight: 300;
    margin-bottom: 20px
}

.main-footer a {
    color: #FFF;
    font-size: 14px;
    text-decoration: none;
}

.main-footer {
    color: #fff;
    font-size: 14px
}

.main-footer p {
    margin-bottom: 15px
}

.main-footer ul {
    margin: 0 0 60px;
    padding: 0
}

.main-footer ul li {
    list-style-type: none;
    margin: 0 0 2px;
    padding: 0;
    line-height: 110%
}

.main-footer .row>div {
    margin-bottom: 15px
}

.main-footer p {
    margin: 0;
    font-size: 14px;
    line-height: 136%;
    height: auto;
    position: static
}

@media (min-width:768px) {
    .main-footer {
        text-align: left
    }
    .main-footer form .form-group-icon {
        max-width: 300px
    }
    .main-footer .row>div {
        margin-bottom: 0
    }
}


/** terminacion del pie gobierno */

body .tramites {
     background-image:  url("https://alvarado.tecnm.mx/portada.fa601b3c4d4c72025ef7.jpg");
    background-size: cover;
    background-repeat:no-repeat;
    background-position: center center;
    /**background-color: #ffc08c;**/
    padding-top: 2em;
    padding-bottom: 2em;
}

body .tramites div {
    margin-bottom: 1em;
}

body .tramites h2 {
    font-family: Montserrat-Bold;
    text-align: center;
    margin-bottom: 2em;
    color: #333;
}

body .tramites a {
    font-family: Montserrat-Bold;
    text-align: center;
    margin-bottom: 2em;
    color: #333;
}




body .newsletter {
    background-color: #424242;
    padding-top: 2em;
    padding-bottom: 4em;
}

body .newsletter h2 {
    font-family: Montserrat-Bold;
    text-align: center;
    margin-bottom: 1em;
    color: white;
}

body .newsletter input {
    width: 600px;
    height: 50px;
    margin: auto;
    padding-top: 10px;
    padding-bottom: 10px;
}

body .multimedia video {
    width: 100%;
    margin-bottom: 2em;
}

body .multimedia {
    background-image:  url("https://alvarado.tecnm.mx/portada.fa601b3c4d4c72025ef7.jpg");
    background-size: cover;
    background-repeat:no-repeat;
    background-position: center center;
    margin-bottom: 2em;
}

body .wrapper {
    margin-bottom: 2em;
}

body .wrapper p {
    margin-bottom: 1em;
    display: inline-block;
}

body .wrapper .actualizacion {
    margin-bottom: 2em;
}

body .wrapper table {
    width: 100%;
    margin-bottom: 2em;
    margin-top: 2em;
}

body .wrapper table th {
    font-family: Montserrat-Bold;
    font-size: 15px;
}

body .wrapper table tbody td {
    font-size: 14px;
}

body .wrapper table tbody td img {
    width: 150px;
    border-radius: 10px;
}

body .wrapper table tbody td strong {
    font-family: Montserrat-Bold;
    display: block;
    font-size: 14px;
    text-align: justify;
}

body .wrapper table tbody td p {
    font-size: 15px;
    display: block;
}

body .wrapper .residencias {
    background-color: transparent;
}

body .wrapper .residencias div {
    margin-bottom: 2em;
}

body .wrapper .residencias div i {
    margin-bottom: 10px;
}

body .wrapper .residencias a {
    text-decoration: none;
}

header {
    width: 100%;
    text-align: center;
    box-shadow: 1px 1px 2px lightgray;
    margin-bottom: 1px;
    padding-top: 0em;
    /* .5em; */
    padding-bottom: 0em;
    /* 1em; */
}

header>img {
    display: block;
    margin: auto;
    width: 100%;
    /* 80%; */
    display: inline-block
}

.row {
    margin-bottom: 1em;
}

.btn-color {
    background-color: transparent;
    border: 1px solid white;
    color: white;
}

.btn-color:hover {
    background-color: transparent;
    color: white;
}

.titulo {
    font-size: 2.2em;
    margin-bottom: 1em;
}

.titulo strong {
    display: block;
    font-size: 14px;
}

.section {
    width: 100%;
    margin-bottom: 2em;
}


/** Slider */

body .slider {
    width: 100%;
    margin-bottom: 2em;
}

body .slider img {
    width: 100%;
}

body .vmodal {
    padding-top: 3em;
    padding-bottom: 2em;
    background: #1B396A;
}

body .vmodal h2 {
    margin-bottom: 2em;
    color: #FAFAFA;
}

body .modal-title {
    font-family: Montserrat-Bold;
    text-align: center;
}

body .filosofia {
    font-size: 16px;
    color: #FAFAFA;
    cursor: pointer;
}

body .integral {
    margin-bottom: 3em;
}

body .filosofia:hover {
    text-decoration: none;
}

body .filosofia i {
    font-size: 100px;
    margin-bottom: 10px;
}



/** Footer **/

footer {
    padding-top: 1em;
    background-color: #EAEAEA;
    color: black;
    padding-bottom: 1em;
}

footer strong,
footer span {
    font-size: 11px;
    margin: 0;
    padding: 0;
    display: block;
    font-family: Montserrat-Bold;
}

footer strong {
    font-family: Montserrat-Bold;
}


/**Interfaz fluida */

.second,
.third,
.fourth,
.fifth,
.last {
    display: none;
}


/** Animaciones */

.giro:hover {
    animation: 1.5s giroX infinite;
    backface-visibility: visible;
    transform: perspective(200px);
    opacity: 0.5;
    margin: auto;
}

body .files .file {
    margin-bottom: 1em;
    padding-bottom: 1em;
}

@keyframes giroX {
    0% {
        opacity: 0.5;
        transform: perspective(2000px) rotateX(150deg);
    }
    40% {
        opacity: 0.5;
        transform: perspective(200px) rotateX(-20deg);
    }
    70% {
        opacity: 0.5;
        transform: perspective(200px) rotateX(20deg);
    }
}