*, div{
    /* border: #686caa solid 1px; */
}
body{
    font-family: 'Montserrat', sans-serif;
}
.navMenu{
    padding:8px 25px;
    box-shadow: 20px 5px 10px rgba(0, 0, .4)!important;
    z-index: 100;
}
.nav-link{
    color:#686caa;
    font-weight: 500;
    font-size: .8em;
}

.nav-link:hover,
.nav-link:active,
.nav-link:focus{
    color:#f4b8c2; 
}

img.imgLogo{
    width: 85px;
    padding: 7px 7px 7px;
}

label{
    display: block;
}
.menuHamburgesa{
  text-align: right!important;
  text-decoration: none;
  color: #686caa;
}
.menuHamburgesa:hover{
color: #f4b8c2;
}

.hamburger{
    position:fixed;
    background-color:transparent;
    right:0;
    top:0;
    height:30px;
    width:30px;
    padding:20px 20px;
    margin: right 10px;
    -webkit-transform:translate3d(0, 0, 0);
    transform:translate3d(0, 0, 0);
    -webkit-transition:-webkit-transform 0.25s cubic-bezier(0.05, 1.04, 0.72, 0.98);
    transition:transform 0.25s cubic-bezier(0.05, 1.04, 0.72, 0.98);
    z-index:1003;
    cursor:pointer;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
._layer{
    background:#686caa;
    margin-bottom:4px;
    border-radius:2px;
    width:28px;
    height:4px;
    opacity:1;
    -webkit-transform:translate3d(0, 0, 0);
    transform:translate3d(0, 0, 0);
    -webkit-transition:all 0.25s cubic-bezier(0.05, 1.04, 0.72, 0.98);
    transition:all 0.25s cubic-bezier(0.05, 1.04, 0.72, 0.98);
}

#menuH:checked ~ .hamburger .-top{
    -webkit-transform:translateY(200%) rotate(45deg) !important;
    -ms-transform:translateY(200%) rotate(45deg) !important;
    transform:translateY(200%) rotate(45deg) !important;
}
#menuH:checked ~ .hamburger .-mid{
    opacity:0;
}
#menuH:checked ~ .hamburger  .-bottom{
    -webkit-transform:translateY(-200%) rotate(135deg) !important;
    -ms-transform:translateY(-200%) rotate(135deg) !important;
    transform:translateY(-200%) rotate(135deg) !important;
}
.menuHamburgesa{
  text-align: right!important;
  line-height: 2.2em;
  text-decoration: none;
  color: #686caa;

}

#menuH:checked ~ .menuppal{
    transform: translate3d(0px, 0px, 0px);
}
ul {
    list-style: none;
}
.menuppal{
    text-align: center;
    background: white;
    bottom: 0;
    height: 210px;
    right: 0;
    overflow-y: scroll;
    position: fixed;
    top: 30px;
    transform: translate3d(0px, -450%, 0px);
    transition: transform 0.35s cubic-bezier(0.05, 1.04, 0.72, 0.98) 0s;
    width: 45%;
    z-index: 1001;
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);
}


/*.menuppal:after {
    position: absolute;
    top: 2px;
    right: -10px;
    content: "";
    display: block;
    border-left: 20px solid black;
    border-right: 15px solid black;
    border-bottom: 15px solid black;
    z-index: 1002;

  }*/

  /*---- ESTILOS SECCION Quienes somos ------*/
.quienesSomos{
    background-image:url("/img/rosaIzq.svg")!important;
    height: 100% auto;
    background-position: left;
    background-repeat: no-repeat;
    background-size: contain;    
 
}
.cont-titulo{
  width: 25%;
}
.tituloUno{
  color: #686caa;
  font-size: 2em;
  line-height: 2.5em;
}

.tituloUno span{
padding: -10;
  font-size: 2.5em;
}

.tituloDos{
  color: #686caa;
  font-size: 2.5em;
}

.logoGris{
  width: 10%;
}
@media screen and (max-width: 767px) {
  .tituloUno{
    color: #686caa;
    font-size: 1em;
    line-height: 1.9em;
  }
  .tituloUno span{
    padding: -10;
      font-size: 2.em;
    }
    .logoGris{
      width: 22%;
    } 
}

/*------ANIMACIÓN TITULOS -------*/
.fade-in-top {
	-webkit-animation: fade-in-top 2.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in-top 2.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
/* ----------------------------------------------
 * Generated by Animista on 2023-5-23 10:10:8
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation fade-in-top
 * ----------------------------------------
 */
 @-webkit-keyframes fade-in-top {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-top {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}









.rallita{
  top:0;
  width: 20%;
}
.titulos{
    color: #fff;
    padding-left: 3px;
    border: 0 0 2px 0 solid #fff;
}

.bordeMorado{
  border: #686caa 3.5px solid;
}
.bordeRosa{
  border: #f4b8c2 3.5px solid;
}
.textInstitucionalidad{
  font-weight: 600;
  text-align: center;
  color: #686caa;
}

.textos{
    color:#fff;
}

.textKeyword{
    font-weight: 600!important;
}



/*ESTILOS PARA VALORES*/
.valores{
  background-image:url("/img/valoresback.jpg")!important;
width: 100vw;
background-position: top;
    background-repeat: no-repeat;
    background-size: contain; 
    background-color: #8f91c1;
}



.contValores{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: end;
}
@media screen and (max-width: 767px) {
  .contValores{
    font-size: .8em;
    display: flex;
    flex-direction:row;
    align-items:center;
  }
  .btnValores{
    font-size: 1.8em;
    color:#fff;
    border-color: #8f91c1;
    padding: 10px!important ;
    }
    
}


.btnValores{
font-size: 1.8em;
color:#fff;
border-color: #8f91c1;
}


.nav-link:hover{
  background-color: none!important;
  color:#f4b8c2;
  border-color: #8f91c1!important;
  }
  .nav-tabs{
    border: none;
  }
.nav-link.active{
  background-color: #8f91c1!important;
  color:#f4b8c2!important;
  border-color: #8f91c1!important;
  }
  .card{
    background-color: #8f91c1;
    border:none;
    color: #fff;
  }

  .titleValores{
    color: #f4b8c2;
    font-size: 1.5em;
    font-weight: 700;
  }


.tituloUnoBlanco{
  color: #fff;
  font-size: 1.5em;
  line-height: 1.9em;
}
.tituloUnoBlanco span{
  padding: -10;
    font-size: 2.5em;
  
  }
.subProyectos{
  font-family: 'Solitreo', cursive;
  font-size: 2em;
  color: #686caa;
}

.ProyectoActual{
  font-size: 1.8em;
  color: #686caa;
}

.cuenta{
  font-size: 2em;
  color: #686caa;
  font-weight: bold;
}









.cardValores{
    box-shadow: 5px 5px 5px rgba(00, 00, 00, .3);
}
.imgValores{
    width: 35%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
   
}
.textValores{
    color:#686caa;
}
/*Styling scrollable elements*/

.js-scroll {
    opacity: 0;
    transition: opacity 500ms;
  }
  
  .js-scroll.scrolled {
    opacity: 1;
  }


  /* ESTILOS PATA PROYECTOS*/

  
  .proyectos{
    background-image:url("/img/moradoDer.svg")!important;
    height: 100% auto;
    background-position: right;
    background-repeat: no-repeat;
    background-size: contain;  
  }
/*rosa-morado*/
  .contentA{
    width: 252px;
    height: 252px;
    border-radius: 50%;
    background-color: #f4b8c2;
    padding: 4px;
  }
.content{
  width: 250px;
  height: 250px;
  border-radius: 50%;
  background-color: #fff;
  padding: 5px;
}
.contenTImagenMorado{
  width: 245px;
  height: 245px;
  border-radius: 50%;
  background-color: #686caa;
  padding: 1px;
}
/*morado-rosa*/
.contentB{
  width: 257px;
  height: 257px;
  border-radius: 50%;
  background-color: #686caa;
  padding: 4px;
}
.contentBdos{
width: 255px;
height: 255px;
border-radius: 50%;
background-color: #fff;
padding: 5px;
}
.contenTImagenRosa{
width: 250px;
height: 250px;
border-radius: 50%;
background-color: #f4b8c2;
padding: 1px;
}



/*------ FOOTER ------*/

.pie{
  background-image: linear-gradient(to top, #686cab, #7b7eb6, #8f91c1, #a2a4cb, #b6b8d6);
  color: #fff;
}
.tituloFooter{
  font-size: 2em;
  font-family: 'Solitreo', cursive;
  text-align: center;
  color: #fff;
}
.btnAyudar{
  background-color: #686caa;
  border: none;
}
.btnAyudar:hover{
  background-color: #f4b8c2;
  border: none;
}
.logoBlanco{
  width: 70%;
}
.imgDireccion{
  color: #fff;
  width: 30%;
}
@media screen and (max-width: 767px){
  .logoBlanco{
    color: #fff;
    width: 35%!important;
  }
}

.menuFooter{
  color: #fff;
  text-decoration: none;
}
.menuFooter:hover{
  color: #f4b8c2;
  text-decoration: none;
}

.imgProyectos{
  height: 100%;
  width: 100%;
  background-size: contain;
  border-radius: 50%;
  padding: 2px;
}


  /* Animaciones cards*/

  /* fade in right*/
  .scrolled.fade-in-right {
	-webkit-animation: fade-in-right 1.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in-right 1.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

 @-webkit-keyframes fade-in-right {
    0% {
      -webkit-transform: translateX(50px);
              transform: translateX(50px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
      opacity: 1;
    }
  }
  @keyframes fade-in-right {
    0% {
      -webkit-transform: translateX(50px);
            transform: translateX(50px);
            opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0);
            transform: translateX(0);
            opacity: 1;
    }
  }

  /* fade in left*/
  .scrolled.fade-in-left {
	-webkit-animation: fade-in-left 1.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in-left 1.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

 @-webkit-keyframes fade-in-left {
    0% {
      -webkit-transform: translateX(-50px);
              transform: translateX(-50px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
      opacity: 1;
    }
  }
  @keyframes fade-in-left {
    0% {
      -webkit-transform: translateX(-50px);
              transform: translateX(-50px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
      opacity: 1;
    }
  }
  

  /* fade in bottom*/ 
  .scrolled.fade-in-bottom {
    animation: fade-in-bottom 1.5s ease-in-out both;
  }

  @keyframes fade-in-bottom {
    0% {
      -webkit-transform: translateY(50px);
      transform: translateY(50px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1;
    }
  }
  
/* ---- Animaciones titulos cards -----*/

.text-blur-out {
	-webkit-animation: text-blur-out 4.7s ease-in alternate-reverse backwards;
	        animation: text-blur-out 4.7s ease-in alternate-reverse backwards;
}


@-webkit-keyframes text-blur-out {
    0% {
      -webkit-filter: blur(0.01);
              filter: blur(0.01);
    }
    100% {
      -webkit-filter: blur(12px) opacity(0%);
              filter: blur(12px) opacity(0%);
    }
  }
  @keyframes text-blur-out {
    0% {
      -webkit-filter: blur(0.01);
              filter: blur(0.01);
    }
    100% {
      -webkit-filter: blur(12px) opacity(0%);
              filter: blur(12px) opacity(0%);
    }
  }

  /* ------ Estilos seccion CENDI ------ */
  .cendi{
    background-image:url("/img/ba-rosacompleto.svg")!important;
    width: 100% auto;
    background-position:top;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .h1cendi{
    color: #686caa;
    font-size: 1.6em;
  }

  .imgCendi{
    width: 100%;
  }
  .bordemoradoA{
    border: #686caa solid 4px; 
  }
  .borderRosa{
    border:#f4b8c2 solid 4px;
  }

   /* ------ Estilos seccion CENDI ------ */
   .lupita{
    background-image:url("/img/bgMoradoCompleto.svg")!important;
    width: 100% auto;
    background-position:top;
    background-repeat: no-repeat;
    background-size: cover;
  }
  


  .labelEmail{
    padding: 7px;
    border: none;
  }

  .labelEmail:hover,
  .labelEmail:active,
  .labelEmail:focus  {
background-color: rgba(255, 255, 255, 0.7);
border: none;
  }

  input.labelEmail:focus{
    border:none!important;
  }
  input.labelEmail:focus::-moz-placeholder {
    color: #bbb5af;
  }
  .btnEnviar{
    background-color: #f4b8c2;
    color:#686caa;
    padding: 7px;
  }