.blue-bg{
	background-color: #061452;
}
.red-bg{
	background-color: #A20000;
}
.red-text{
	color: #a20000;
}
.blue-text{
	color: #3e356f;
}
.blue-text-2{
  color: #9285D8;
}
.poco-gray{
	background-color: #E1DDDD;
}
.poco-gray-2{
  background-color: #E7E7E7;
}
.fondo{  
 background:url(../img/ccpv.png) no-repeat fixed center top;
 /*background-size*/
-webkit-background-size:/*@@prefixmycss->No equivalent*/;
   -moz-background-size:cover;
     -o-background-size:/*@@prefixmycss->No equivalent*/;
        background-size:cover;
        min-height: 50vh;
}
 .fill{
   width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
  min-height: 250px;
  padding-top: 20px;
  padding-bottom: 2px;
}
.fill-2{
   width: 100%;
    background-position: center;
  background-size: cover;
  padding-top: 20px;
  padding-bottom: 25px;
}
 .full{
   background:url(../img/vision.png) no-repeat fixed center top;
 /*background-size*/
-webkit-background-size:/*@@prefixmycss->No equivalent*/;
   -moz-background-size:cover;
     -o-background-size:/*@@prefixmycss->No equivalent*/;
        background-size:cover;
        padding-bottom: 400px;
 }
 .full-quienes{
   background:url(../img/bg-quienes.png) no-repeat fixed center top;
 /*background-size*/
-webkit-background-size:/*@@prefixmycss->No equivalent*/;
   -moz-background-size:cover;
     -o-background-size:/*@@prefixmycss->No equivalent*/;
        background-size:cover;
 }
 .full-toroid{
   background:url(../img/bg-quienes.png) no-repeat fixed center top;
 /*background-size*/
-webkit-background-size:/*@@prefixmycss->No equivalent*/;
   -moz-background-size:cover;
     -o-background-size:/*@@prefixmycss->No equivalent*/;
        background-size:cover;
 }
 .full-wm{
   background:url(../img/watermark.png) no-repeat fixed center top;
 /*background-size*/
-webkit-background-size:/*@@prefixmycss->No equivalent*/;
   -moz-background-size:cover;
     -o-background-size:/*@@prefixmycss->No equivalent*/;
        background-size:cover;
      
 }
 .full-obj{
   background:url(../img/bg-objetivos.png) no-repeat fixed center top;
 /*background-size*/
-webkit-background-size:/*@@prefixmycss->No equivalent*/;
   -moz-background-size:cover;
     -o-background-size:/*@@prefixmycss->No equivalent*/;
        background-size:cover;
      
 }
 .full-cta{
   background:url(../img/bg-cta.png) no-repeat fixed center top;
 /*background-size*/
-webkit-background-size:/*@@prefixmycss->No equivalent*/;
   -moz-background-size:cover;
     -o-background-size:/*@@prefixmycss->No equivalent*/;
        background-size:cover;
 }
#topnav .nav-link{
color: #fff;
font-size: 85%;
}
// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 100 to 1000

.dm-sans-200 {
  font-family: "DM Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
}

.dm-sans-800i {
  font-family: "DM Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 1000;
  font-style: italic;
}
.dm-sans-800 {
  font-family: "DM Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 800;
  font-style: italic;
}
.imageni{
  transform: scale(var(--escala, 1));
  transition: transform 0.25s;
}
.imageni:hover{
  --escala: 1.2;
  cursor:pointer;
}
.bg-grad{
    background-image: linear-gradient(#194968,#000000 )
  }
  .bg-darkest{
  background-color: #000000;
  columns: #fff;
  font-size: 80%;
}
#footer a{
  color: #fff;
  text-decoration:none;
}
#listed li{
 list-style-image: url(../img/line-dot.png);
}
#mmenu a{
  text-decoration: none;
  color: #fff;
}
#modaltel a{
  text-decoration: none;
  color: #000;
}

#listed-r li{
  list-style-image: url(../img/line-dot-red.png);
}
.rdots{
  list-stye-image: url(../img/line-dot-red.png);
}
.titulo{
  text-transform: uppercase;
  font-size: calc(1.325rem + 0.9vw) !important;
  color: #3e356f;
  font-weight: 700 !important; 

}
.subtitulo{
  text-transform: uppercase;
  font-size: calc(1.3rem + 0.6vw) !important;
  color: #a20000;
  font-weight: 600 !important; 
}
.sub-2{  
   font-size: calc(1.275rem + 0.3vw) !important;
  color: #a20000;
  font-weight: 600 !important; 
}

.wapp{
  width: 50px;
  height: 190px;
  position: fixed;  
  z-index: 1090;  
  top: 360px;
  right: 0;
}
.bg-lgray{
  background-color: #E8E4E4;
}
.bg-lgray-2{
  background-color: rgba(232, 228, 228, .7);
}
  

.blue-bg{
  background-color: #3E356F;
}
.blue-bg-2{
  background-color: #9285D8;
}
.footer-bg{
  background: linear-gradient(#222222, #3E356F);
}
.carouse-item {
  width: 100%; /* Asegura que el contenedor ocupe todo el ancho */
}

.imagen-desktop {
  display: block; /* Mostrar por defecto en pantallas grandes */
  width: 100%;
  height: auto; /* Mantiene la proporción */
}

.imagen-mobile {
  display: none; /* Oculto por defecto */
  width: 100%;
  height: auto; /* Mantiene la proporción */
}

/* Media query para dispositivos pequeños (ejemplo: hasta 767.98px, típico para móviles en Bootstrap) */
@media (max-width: 767.98px) {
  .imagen-desktop {
    display: none; /* Ocultar la imagen de escritorio */
  }
  .imagen-mobile {
    display: block; /* Mostrar la imagen móvil */
  }
}

/* Opcional: Puedes añadir otra media query para tabletas si lo necesitas */
@media (min-width: 768px) and (max-width: 991.98px) {
  /* Si tuvieras una imagen específica para tabletas, la mostrarías aquí y ocultarías las otras */
  /* .imagen-desktop { display: none; } */
  /* .imagen-mobile { display: none; } */
  /* .imagen-tablet { display: block; width: 100%; height: auto; } */
}
.captian {
  list-style-type: upper-alpha;
}
.uroman{
  list-style-type: upper-roman;
}
.tooltip {
  z-index: 1080 !important;
}
#comms .card{
  margin-top: 20px;
  margin-bottom: 20px;
}
/* Estilo para el punto de notificación */
.badge-new {
    /* Forma y color */
    display: inline-block;
    width: 8px;          /* Tamaño del punto */
    height: 8px;         /* Tamaño del punto */
    background-color: #CC0000; /* Color rojo brillante */
    border-radius: 50%;  /* Hace que sea un círculo perfecto */
    
    /* Posicionamiento y alineación */
    margin-left: 4px;    /* Espacio entre el texto y el punto */
    position: relative;
    top: -3px;           /* Ajusta la posición vertical ligeramente hacia arriba */
}


