:root {
    ---color_1: #004875;
    ---color_2: #727272;
    ---color_3: #C1D6EC;
    ---color_4: #E26C77;
    ---color_5: #E9E9E9;
    ---color_6: #F6F6F6; 
}

@font-face {
    font-family: MuseoSans100;
    src: url(../../fonts/MuseoSans-100.otf);
}

@font-face {
    font-family: MuseoSans300;
    src: url(../../fonts/MuseoSans-300.otf);
}

@font-face {
    font-family: MuseoSans500;
    src: url(../../fonts/MuseoSans-500.otf);
}

@font-face {
    font-family: MuseoSans700;
    src: url(../../fonts/MuseoSans-700.otf);
}

@font-face {
    font-family: MuseoSans900;
    src: url(../../fonts/MuseoSans-900.otf);
}

.wp-paginate.wpp-modern-grey a {
    background: none !important;
    color: #E94860 !important;
    border: none !important;
}

.wp-paginate.wpp-modern-grey .current {
    opacity: 1 !important;
    color: var(---color_1) !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0%;
}

/* Reemplaza el icono de flecha hacia abajo por defecto de Bootstrap 4 con un icono personalizado */
.dropdown-toggle::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    background-image: url(../img/arrow-circulo-dropdown.svg);
    /* background-image: url(https://convivenciaparaciudadania-desa.mineduc.cl/wp-content/themes/convivencia-ciudadania-2023/assets/custom/img/arrow-circulo-dropdown.svg); */
    width: 19px;
    height: 19px;
    border: none;
    /* Elimina los bordes del triángulo */
}
.claves{
    height: 93px;
    max-height: 93px;
}
.claves:hover{
    background-color: white;
    color: var(---color_1);
    
}
.text-end {
    text-align: end;
}

.text_1 {
    color: var(---color_1)!important;
}

.bg_1 {
    background-color: var(---color_1);
}

.bb_1 {
    border-bottom: var(---color_1) solid 3px;
}

.bg_5 {
    background-color: var(---color_5);

}

.bg_6 {
    background-color: var(---color_6);

}

.text_2 {
    color: var(---color_2);
}

.bg_2 {
    background-color: var(---color_2);
}

.text_3 {
    color: var(---color_3);
}

.bg_3 {
    background-color: var(---color_3);
}

.text_4 {
    color: var(---color_4);
}

.bg_4 {
    background-color: var(---color_4);
}

.fms100 {
    font-family: MuseoSans100;
}

.fms300 {
    font-family: MuseoSans300;
}

.fms500 {
    font-family: MuseoSans500;
}

.fms700 {
    font-family: MuseoSans700;
}

.fms900 {
    font-family: MuseoSans900;
    font-weight: 900;
}

.fs19 {
    font-size: 19px;
}

.fs50 {
    font-size: 50px;
}
.fs36{
    font-size: 36px;
}
.fs31{
    font-size: 31px;
}
.fs30 {
    font-size: 30px;
}
.fs27{
    font-size: 27px;
}
.fs26 {
    font-size: 26px;
}
.fs25{
    font-size: 25px;
}

.fs20 {
    font-size: 20px;
}

.op40 {
    opacity: 40% !important;
}

.op100 {
    opacity: 100% !important;
}

.dropdown-item {
    border-bottom: 1px solid #C1D6EC;
}

.bg-fondo {
    background-color: #C1D6EC;
}

strong {
    font-family: MuseoSans900;
}

.logo-mineduc-footer {
    max-width: 260px;
    background: url(../img/Barra_web.jpeg) no-repeat bottom;
    background-size: contain;
    height: 13px;
}

.logo-mineduc {
    max-width: 280px;
    background: url(../img/Barra_web.jpeg) no-repeat;
    background-size: contain;
}
.logo-mineduc a{
    display: block;
}

.logo {
    width: 250px;
}

.relativo {
    position: relative !important;
    min-height: 15rem;
}

.relativo img {
    position: absolute;
    bottom: .5rem;
}

.relativo2 {
    position: relative !important;
    min-height: 17rem;
}

.relativo2 img {
    position: absolute;
    bottom: .5rem;
}

a.text-white.nav-link.enlace:hover {
    color: #fff !important;
    background-color: #004875;
}

a.text-white.nav-link.enlace:active {
    color: #fff !important;
    background-color: #004875;
}

.dropdown-menu {
    background-color: #E9E9E9;
    color: #183A68;
}

.dropdown-item {
    color: #183A68;
    line-height: 1.8rem;
}

.social-network .btn {
    width: 40px;
    height: 40px;
    color: #272252;
    border: none;
    font-size: 1.8rem;
}

.social-network .btn:hover {
    color: #272252;
}

h3 {
    font-weight: bold;
}

.border-bottom {
    border-bottom: 2px solid #4922ff !important;
}

.border-right-azul {
    border-right: 2px solid #4922ff !important;
}

.border-right-blanco {
    border-right: 2px solid #fff !important;
}

.caja {
    padding: 1rem;
    background-color: #4922ff;
    color: #fff;
}

.circulo {
    min-width: 9rem;
    height: 7rem;
}

.cajapp {
    border: 1px solid #4922ff;
    padding: 1rem;
    background-color: #fff;

}

.cajapp h4 {
    margin: -1rem;
    font-size: 108;

}

.flecha {
    width: 14rem;
    height: 5rem;
    margin-left: -4rem;
    background: url(https://abrirlasescuelaspasoapaso-desa.mineduc.cl/wp-content/uploads/2020/08/flecha.svg) top right no-repeat;
}

.w-20 {
    width: 20%;
}

hr {
    background-color: white;
    border-color: #0071C0;
    padding-top: 1rem;
    padding-bottom: 1rem;
    margin-top: 0rem;
    margin-bottom: 0rem;
}

.border-1{
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;
}
.seperador {
    height: 1.1rem;
    padding: 0rem;
    margin: 0rem;
    border: 0rem;
}

.text-pretty {
    text-wrap: pretty;
}

/* opacidad*/
.opci-1 {
    background-color: rgba(0, 0, 0, 0.0);
}

.opci-2 {
    background-color: rgba(0, 0, 0, 0.2);
}

.opci-3 {
    background-color: rgba(0, 0, 0, 0.4);
}

.opci-4 {
    background-color: rgba(0, 0, 0, 0.6);
}

.opci-5 {
    background-color: rgba(0, 0, 0, 0.6);
}

.opci-6 {
    background-color: rgba(0, 0, 0, 0.6);
}

/*   Colores de fondo */

.bg-celeste {
    background-color: #C1D6EC;
}

.bg-celeste2 {
    background-color: #00B4DE;
}

.bg-azul {
    background-color: #004875;
}

.bg-verde {
    background-color: #CEF5E3;
}

.bg-verde2 {
    background-color: #9DC44D;
}

.bg-verde3 {
    background-color: #02A89B;
}

.bg-rojo {
    background-color: #E74A60;
}

.bg-rojo2 {
    background-color: #B41B59;
}

.bg-amarillo {
    background-color: #F7D326;
}

.bg-naranjo {
    background-color: #EC9026;
}

.bg-gris {
    background-color: #E9E9E9;
}

/*color de texto*/
.text-gris {
    color: #4C4C4C;
}

.text-azul {
    color: #004874 !important;
}

.text-rojo {
    color: #E74A60;
}

.text-celeste2 {
    color: #00B4DE;
}

.text-height {
    line-height: 0.78;
}

/*color de borde */
.borde-azul {
    border-color: #4922ff !important;
}

.borde-white {
    border-color: #fff;
}

.hovereffect {
    width: 100%;
    height: auto;
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;
}

.hovereffect .overlay {
    width: 100%;
    height: 90px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    padding: 0px 15px;
}

.hovereffect .btn-encargados {
    height: 90px;
    white-space: normal;
    display: block;
    position: relative;
    max-width: none;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.hovereffect:hover .btn-encargados {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.hovereffect:hover .btn-encargados span {
    opacity: 0;
}

.hovereffect a,
.hovereffect p {
    color: #FFF;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
}

.hovereffect:hover a,
.hovereffect:hover p {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.bb-3 {
    border-bottom: #E94860 solid 3px;
}
.bb-4 {
    border-bottom: var(---color_3) solid 3px;
}
.wrapper{
    grid-gap: 10px;
    display: grid !important;
}
.box-dest:nth-child(1){
    grid-column: 1 / span 2;
    grid-row: 1 / span 2;
}
.box-dest:nth-child(2){
    grid-column: 3;
    grid-row: 2;
}
.box-dest{
    position: relative;
}
.cajaGuia{
    max-width: 536px; 
    max-height: 292px; 
    height:292px; 
    width: 536px;
}
.cajaVideoViolencia{
    max-width: 443px;
}
/* Smartphones (horizontal) ----------- */
@media only screen and (min-width : 321px) {
    .font-controls {

        width: 20%;
    }

    /* Styles */
}

.font-style-81 {
    font-size: calc(var(--font-size) * 2.5625em);
}

.img-rev-princ {
    max-width: 100%;
    height: auto;
}

.caja_interna {
    max-width: 100%;

}

.font-style-57 {
    font-size: calc(var(--font-size) * 2.2625em);
}

.box_write {
    max-width: 100%;
    height: auto;
}

.img-box-write {
    max-width: 100%;
    height: auto;
}

.img_box_2 {
    max-width: 100%;
    height: auto;
}

header .row div h1{
	display: none;
}
.alt_header {

    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: scroll;
    background-position: center center;
    width: 100%;
    margin: 0 auto;
    aspect-ratio: 1921 / 401;
}
.btn-outline-light:hover{
    color: var(---color_1);
    background-color: var(---color_1);
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: var(---color_4)
}

a {
    color: var(---color_1);
}

.border-primary {
    border-color: #707070 !important;
}

@media (min-width: 1400px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 1640px;

    }
}

/* Desktops and laptops ----------- */
@media only screen and (max-width : 1920px) {
  

    header>img {
        max-height: 287px;
    }
}

/* Desktops and laptops ----------- */
@media only screen and (max-width : 1620px) {


    header>img {
        max-height: 272px;
    }
    .cajaVideoViolencia{
        max-width: 390px;
    }
    .cajaGuia{
        max-width: 370px; 
  
    height:292px; 
    
    }
    .fs31{
        font-size: 26px;
    }

}

/* Desktops and laptops ----------- */
@media only screen and (max-width : 1399px) {
   
    .cajaVideoViolencia{
        max-width: 325px;
    }
    .cajaGuia{
        max-width: 370px; 
  
    height:292px; 
    
    }
    .fs31{
        font-size: 25px;
    }

}

/* Desktops and laptops ----------- */
@media only screen and (max-width : 1280px) {
 
    header>img {
        max-height: 222px;
    }

}
/* Desktops and laptops ----------- */
@media only screen and (max-width : 1199px) {
    .cajaVideoViolencia{
        max-width: 275px;
    }
    .fs25{
        font-size: 21px;
    }
    .cajaGuia{
        max-width: 310px; 
        height:270px; 
    }
    .fs31{
        font-size: 21px;
    }

}

/* Desktops and laptops ----------- */
@media only screen and (max-width : 1024px) {
  
    header>img {
        max-height: 167px;
    }

}

/* Desktops and laptops ----------- */
@media only screen and (max-width : 991px) {
        .alt_header{
            min-height: 28vh
        }
       .logo-mineduc{
        text-align: left!important;
    }
    .cajaVideoViolencia{
        max-width: 320px;
    }
    .cajaGuia{
        max-width: 235px; 
        height:260px; 
    }
    .fs31{
        font-size: 18px;
    }

}

/* Smartphones (vertical) ----------- */
@media only screen and (max-width : 767px) {

     

    header>img {
        max-height: 120px;
    }
    .wrapper{
        grid-gap: 10px;
        display: block !important;
    }
    .claves{
        height: 100px;
        max-height: 100px;
    }
    .cajaGuia{
        max-width: 380px; 
        height:280px; 
    }
    .fs31{
        font-size: 23px;
    }
    /* Styles */
}

/* Smartphones (vertical) ----------- */
@media only screen and (max-width : 500px) {
  
    .fs50{
        font-size: 31px;
    }
    header>img {
        max-height: 82px;
    }
    .h-75{
        height: max-content!important;
    }

    
}




/* iPads (portrait) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) {


    /* Styles */
}

/* iPads (landscape) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : landscape) {
   
    /* Styles */
}