:root{
    --color-primary: #0092CC;
    --color-secondary: #E6227F;
    --color-complementary: #FBFDFC;
    --color-text:#351224;
    --bg-fondo:#FDF2F8;
}
body{
font-family: "Noto Sans", serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-variation-settings:"wdth" 100;
background-color: var(--bg-fondo);
color: var(--color-text);
}

h1, .text-titulo{
    font-size: 40px;
    font-weight: 600;
}
header{
    height: 240px;
}
.logo-convocatoria{
    width: 100%;
    max-width: 558px;
    padding-left: 40px;
}
.des{
    font-size: 20px;
    font-weight: 300;
    position: relative;
    top: -120px;
    left: 320px;
    width: 100%;
    padding: 40px 0;
}

.bottom-play{
    color: #919191;
    font-size: 20px;
    font-weight: 500;    
}
.bottom-play:hover{
    color:var(--color-secondary) ;
    transition: all .4s ease-out;
}
.bottom-play i{
    transition: all .4s ease-out;
}
.bottom-play:hover i{
    transform: rotate(360deg);
    transition: all .4s ease-out;   
}

.bg-cta{
    background-image: url(../img/bg-cta-83.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    
}
.bg-pausa{
    background-image: url(../img/bg-pausa.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    
}
.bg-pausa img{
    filter: grayscale(100%);
}
.prox{
    font-size: 48px;
    color: var(--color-primary);
    font-weight: 700;
    line-height: 48px;
}
.n{
    font-size: 60px!important;
}
.btn-cta{
    transition: all .4s ease-out; 
}
.btn-cta:hover{
    transform: scale(1.07);
    filter: saturate(1.5);
}
.fecha{
    font-size: 24px;
    font-weight: 500;
    text-align: center;
}
.btn-estatus{
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
    font-weight: 500;
    font-size: 18px;
}

.btn-estatus:hover{
    border: 1px solid var(--color-secondary);
    color: var(--color-secondary);
}

.btn-estatus i{
    transition: all .4s ease-out;
}
.btn-estatus:hover i{
    margin-left: 10px;
    transform: rotateX(360deg);
}

.btn-opciones{
    color: var(--color-primary);
}
.btn-opciones:hover{
    color: var(--color-secondary);
}

.btn-opciones i{
    transition: all .4s ease-out;
    margin-right: 8px;
}
.btn-opciones:hover i{
    transform: rotateY(360deg);  
}
.parrafo-s{
    font-size: 16px;
    color: #3E3D4C;
    font-weight: 400;
    
}
.parrafo{
    font-size: 20px;
    font-weight: 300;
}
.parrafo-m{
    font-size: 22px;
    font-weight: 500;
}
.parrafo-ml{
    font-size: 22px;
    font-weight: 400;
}
.parrafo-ml span{
    color: var(--color-primary);
    font-style: italic;
}

.card-convo{
    text-align: center;
}

hr.convo{
    color: var(--color-secondary);
    opacity: 1;
}

 .btn-label {
	position: relative;
    background-color: var(--color-primary);
    color: #fff;
	display: inline-block;
	padding: 6px 12px;
	border-radius: 5px 0 0 5px;
    left: -12px;
}

.btn-labeled {
	padding-top: 0;
	padding-bottom: 0;
    border: 2px solid var(--color-primary);
    color: var(--color-primary); 
    border-radius: 8px;
    font-size: 18px;
}

.text-bottom{
    display: inline-block;
    margin: 0 20px;
    width: 220px;
}
.modal .text-bottom{
    width: 185px;
}

.btn-labeled:hover{
    border: 2px solid var(--color-secondary);
    color: var(--color-secondary);
    transition: all .4s ease-out; 
}

.btn-labeled:hover .btn-label{
    background-color: var(--color-secondary);
    transition: all .4s ease-out;
}
.btn-labeled .iconol{
    transition: all .4s ease-out;
}

.btn-labeled:hover .iconol{
    transform: rotateY(360deg);  
}

.btn {
	margin-bottom: 10px;
}

.modal-title {
    margin: 0 auto;
    color: var(--color-primary)!important;
    font-weight: 700;
    font-size: 40px!important;
}

.modal-header .btn-close {
    margin: 0;
}
.modal-content{
    border: 4px solid var(--color-primary);
}


ul.timeline {
    list-style-type: none;
    position: relative;
}

ul.timeline::before {
    content: ' ';
    background: var(--color-secondary);
    display: inline-block;
    position: absolute;
    left: 29px;
    width: 2px;
    height: 100%;
    z-index: 400;
}


#sigueprocesoA ul.timeline:last-child::after{
    content: ' ';
    background:#fff;
    display: inline-block;
    position: absolute;
    left: 29px;
    width: 2px;
    height: 90px;
    z-index: 400;
    bottom: 0px;
}
#sigueprocesoB ul.timeline:last-child::after{
    content: ' ';
    background:#fff;
    display: inline-block;
    position: absolute;
    left: 29px;
    width: 2px;
    height: 90px;
    z-index: 400;
    bottom: 0px;                                                        
}
#sigueprocesoC ul.timeline:last-child::after{
    content: ' ';
    background:#fff;
    display: inline-block;
    position: absolute;
    left: 29px;
    width: 2px;
    height: 90px;
    z-index: 400;
    bottom: -13px;
}

ul.timeline > li {
    margin: 20px 0;
    padding-left: 20px;
}
ul.timeline > li:before {
    content: ' ';
    background: var(--bg-fondo);
    display: inline-block;
    position: absolute;
    border-radius: 50%;
    border: 3px solid var(--color-primary);
    left: 20px;
    width: 20px;
    height: 20px;
    z-index: 401;
}

ul.timeline > li.enproceso:before{
    background-color: var(--color-primary);
    content: ' ';
    display: inline-block;
}

.btn-timeline{
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
    font-weight: 500;
    font-size: 18px;
    width: 240px;
}

.btn-timeline:hover{
    border: 1px solid var(--color-secondary);
    color: var(--color-secondary);
}

.btn-timeline.activo{
    background-color: var(--color-primary);
    color: #FAFAFA;
}

.btn-timeline.activo:hover{
    background-color: var(--color-secondary);
    color: #FAFAFA;
}

.recursos .rc{
    margin: 14px 10px;
    vertical-align: top;
}

.card-copy-text{
    width: 330px;
    border: 2px solid var(--color-primary);
    color: var(--color-primary);
    border-radius: 8px;
    font-size: 18px;
    padding: 10px ;
    display: inline-block;
  
}

.bottom-copy{
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 400; 
    float: right;
}

.bottom-play{
    color: #919191;
    font-size: 18px;
    font-weight: 500;    
}
.bottom-copy:hover{
    color:var(--color-secondary) ;
    transition: all .4s ease-out;
}
.bottom-copy i{
    transition: all .4s ease-out;
}
.bottom-copy:hover i{
    transform: rotateY(360deg);
    transition: all .4s ease-out;   
}


.infog{
    width: 400px;
}

.modal-body iframe.short{
    width: 370px;
    height: 600px;
}

iframe.shortv{
    height: 348px;
    width: 100%;
}
iframe.pdf{
    width: 900px;
    height: 600px;
}

.btn-sesiones{
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
}
.btn-sesiones:hover svg path{
    fill: var(--color-secondary);

}

.btn-sesiones svg{
    vertical-align: baseline;
}

.btn-sesiones svg:last-child{
 vertical-align: super;
}
.btn-sesiones span.name{
    display: inline-block;
    color: var(--color-primary);
    font-size: 18px;
}
.btn-sesiones:hover span.name{
    color: var(--color-secondary);
}

 .btn-sesiones span.date{
    color: #3E3D4C;
    font-size: 14px;
    border-top: 1px solid var(--color-primary);
 }
@media (max-width: 575.98px) { 
    header{
        height: auto;
    }
    .logo{
        padding-left: 0;
    }
    .des{
        top: 20px;
        left: 0px;
        text-align: center;
    }
    .text-bottom {
        width: 200px;
    }
    .modal .text-bottom{
        width: 155px;
    }
    .modal h1.modal-title{
        font-size: 22px!important;
    }
    .slick-dots{
        position: static;
    }
    .slick-slide {
        margin-left: 20px;
    }
    .slick-list img{
        width: 100%;
    }
    .modal-body iframe.short{
        width: 250px;
        height: 390px;
    }
 
    iframe.shortv{
        width: 225px!important;
        height:400px;
    }
    iframe.pdf{
        width: 320px;
        height: 430px;
    }
    .infog{
        width: 100%;
    }
    .n{
        font-size: 44px!important;
        line-height: 38px!important;
    }
 }

 .slick-prev:before, .slick-next:before {
    color: #6c757d;
}