
.res__h1-title {
    font-size: var(--size-h1-title-extrabold-mobile);
    font-weight: var(--weight-extrabold);
    line-height: var(--line-height-h1-mobile);
    margin-bottom: 1em;
}
.tele__h2-title {
    font-size: var(--size-h2-title-bold-mobile);
    font-weight: var(--weight-bold);
    line-height: var(--line-height-h2-mobile);
    margin-bottom: .3em;
}
.tele__h3-title {
    font-size: var(--size-h3-title-bold-desktop);
    font-weight: var(--weight-bold);
    line-height: var(--line-height-h3-mobile);
}
/* ***************** */
/* Estilos generales */
/* ***************** */
.res__lists {
    /* margin-left: 1em; */
    width: 100%;
    list-style: none;
    transition: all .3s;
}
.res__link {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    text-decoration: none;
    font-weight: var(--weight-bold);
    padding: 1em;
    margin-top: .8em;
    width: 100%;
    max-width: 100%;
    border-radius: .5em;
    color: var(--color-link-button);
    box-shadow: 0 3px 19px 0 hsla(217, 32%, 81%, 0.6);    
}
.res__link:hover {
    background-color: rgba(230, 242, 248, .7);
}
.res__link:hover .res__icon-svg{
    background-color: var(--color-white);
}
.res__icon-svg {
    display: block;
    width: 2.5em;
    height: 2.5em;
    padding: .75em;
    margin-right: 1.25em;
    border-radius: 50%;
    background-color: rgba(191, 203, 222, .6);    
}
.res__text {
    text-decoration: underline;
    flex: 1 1;
    font-size: 1.2rem;
    /* background-color: pink; */
}
.res__icon-chevron-right {
    display: block; 
    font-size: 1rem;
    font-weight: bold;
    /* margin-right: auto;
    margin-left: .5em;
    margin-left: auto;
    margin-right: .5em; */
}



.tele__section {
    margin-bottom: .5em;
    padding: 1em;
}
.tele__bg {
    background-color: var(--background-section-body);
}
.tele__paragraph {
    line-height: 1.2em;
}
.tele__paragraph--bold {
    font-weight: var(--weight-bold);
}
.tele__paragraph--margin-top-bottom {
    margin-top: 1em;
    margin-bottom: .5em;
}
.tele__paragraph--size {
    font-size: 1.3rem;
}
.tele__h2-title--center {
    text-align: center;
}
.tele__img {
    max-width: 40em;
    margin-left: auto;
    margin-right: auto;
}
.tele__img--max-width {
    max-width: 55em;
}
.tele__img--max-width img {
    padding: 0 1em;
    border: 1px solid #000;
}
.tele__img--figcaption {
    margin-top: .2em;
    text-align: center;
    font-size: .9rem;
    font-style: italic;
}

.tele__list {
    margin-bottom: .7em;
}
.tele__list--border {
    background-color: #fff;
    padding: .7em;
    border-radius: .30em;
}

.tele__link,
.tele__list a {
    color: var(--color-link-button);
    font-weight: var(--weight-medium);
}
.tele__link:hover,
.tele__list a:hover {
    color: var(--color-black);
    background-color: var(--color-item-selected);
    box-shadow: 0 0 2px 4px var(--color-item-selected);
}
.tele__lists--type {
    list-style-type: square;    
}
.tele__video {
    max-width: 25em;
    border-bottom: 3px solid var(--color-black);
    background-color: var(--background-white);
}
.tele__iframe iframe{
    object-fit: cover;
    object-position: center;
    width: 100%;
    border: 0;
    height: 12em;
}
.tele__h3-title--padding {
    padding: 1.5em 1em 4em;
}
.tele__h3-title--padding a {
    color: var(--color-link-button);
}
.tele__video:hover a {
    /* font-weight: 300; */
    color: var(--color-black);
    background-color: var(--color-item-selected);
    /* box-shadow: 0 0 2px 4px var(--color-item-selected); */
}
.tele__lists--ul {
    list-style-type: disc;
}
.tele__social-network {
    list-style-type: none;
    display: flex;
    justify-content: space-between;
    max-width: 15em;
    margin-top: 1.5em;
    /* margin-left: .3em; */
}
.tele__social-network .tele__list a:hover {
    background-color: transparent;
    box-shadow: none;
}
.tele__social-networks {
    font-size: 3.5em;
    padding: 0 .3em .3em 0;
}
.tele__social-networks:hover {
    transform: scale(1.1);
}
.tele__social-networks--face {
    color: rgb(0, 0, 255);
}
.tele__social-networks--face:hover {
    color: rgba(0, 0, 255, .5);
}
.tele__social-networks--yt {
    color: rgb(255, 0, 0);
}
.tele__social-networks--yt:hover {
    color: rgba(255, 0, 0, .6);
}
.tele__social-networks--email {
    color: rgb(217, 153, 153);
}
.tele__social-networks--email:hover {
    color: rgba(217, 153, 153, .7);
}
/* ************************************ */
/* *******  ESTILOS RESPONISVE  ******* */
/* ************************************ */

/* ********************* */
/* ***  WIDTH: 576px *** */
/* ********************* */
@media screen and (min-width: 576px) {  
    .res__list {
        max-width: 350px;        
    }
}

/* ********************* */
/* ***  WIDTH: 768px *** */
/* ********************* */
@media screen and (min-width: 768px) {
    .res__lists {
        display: flex;
        flex-wrap: wrap;
        gap: 2em;
        margin-bottom: 6em;
    }
    .res__list {
        width: 350px;        
    }
}

/* ********************* */
/* ***  WIDTH: 992px *** */
/* ********************* */
@media screen and (min-width: 992px) {
    /* ************************************************ */
    /* Estilos del menu (cambiando el menu-link-active) */
    /* ************************************************ */
    .main-menu__link--active {
        /* text-decoration: none; */
        font-weight: var(--weight-regular);
        color: var(--color-black);
        background-color: var(--background-menu);
    }
    /* Agregando el menu-link-active a la opcion tramite y servicio */
    /* ************************************************************ */
    #informacion-institucional {
        color: var(--color-active);
        background-color: var(--background-white);
    }
    #informacion-institucional span:first-child {
        font-weight: var(--weight-bold);
    }
    /* Estilos generales */
    /* ***************** */
    
}

/* ********************** */
/* ***  WIDTH: 1024px *** */
/* ********************** */
@media screen and (min-width: 1024px) {
    /* Estilos generales */
    /* ***************** */
    .res__h1-title {
        font-size: var(--size-h1-title-extrabold-desktop);
        line-height: var(--line-height-h1-desktop);
    }
    .tele__h2-title {
        font-size: var(--size-h2-title-bold-desktop);
        line-height: var(--line-height-h2-desktop);
    }
    .tele__h3-title {
        font-size: var(--size-h3-title-bold-desktop);
        line-height: var(--line-height-h3-desktop);
    }    
}

/* ********************** */
/* ***  WIDTH: 1200px *** */
/* ********************** */
@media screen and (min-width: 1200px) {

    .res__lists {
        /* display: flex; */
        /* flex-wrap: wrap; */
        gap: 3em;
        margin-bottom: 12em;
    }
}