.contimagen {
  position: relative;
  width: 100%;
  height: calc(100vh - 51px);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at center, #0a0a5a, #000025);
  background-size: cover;
}


.contimagen h1 {
  font-size: 5vw;
  filter: drop-shadow(-15px 20px 35px rgba(0, 0, 0, 0.9));
  font-family: 'Monument';
  font-weight:bold;
  letter-spacing: 5px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.contimagen .inner {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: t1 7s ease infinite;
}

.contimagen .inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

@keyframes t1 {
  0% {
    transform: scale(1) ;
  }
  50% {
    transform: scale(1.04);
  }
  100% {
    transform: scale(1);
  }
}




.mainn{
  background: #fff;
  padding-top: 80px;
}


.fondodescontent{
  padding: 90px 0 90px;
  background-color: rgb(222, 244, 255);  
}


.descContent{
  display: flex;
  width:80%;
  margin: auto;
}

.imgDesc{
  display: flex;
  width: 50%;
}
.imgDesc img{
  max-width: 90%;
  max-height: auto;
  margin: auto;
  border-radius: 12px;
}
.videodev{
  display: flex;
  width: 50%;
}
.videodev video{
  max-width: 90%;
  max-height: auto;
  margin: auto;
  border-radius: 4px;
}

.esimS{
  display:none;
}


.context{
  width: 50%;
  margin: auto;
  >h4{
    width: 90%;
    margin: auto;
    font-family: 'Monument';
    font-size: x-large;
    color: #202020;
    letter-spacing: 2px;
  }
  >p{
    font-weight: 400;
    font-size:medium;
    width: 90%;
    margin: auto;
    color: #202020;
  }
}


.truenos3 {
  min-height: 76vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  background: linear-gradient(to bottom,
  rgb(209, 240, 255)20%,
  rgb(58, 153, 226)75%);
  padding-top: 50px;
  padding-bottom: 160px;
}


.titleservices h2 {
  font-size: 38px;
  font-family: 'Monument';
  letter-spacing: 2px;
}

/* *** desplegables  desplegables desplegables desplegables */
/* *** desplegables  desplegables desplegables desplegables */


.miaccordion {
  width: 70%;
  margin:50px auto 100px;
  
  >h2{
    font-size: 38px;
    font-family: 'Monument';
    letter-spacing: 2px;
    padding-top: 30px;
    margin-bottom: 50px;
  }
}
.miaccordion-content{
  >p{
    font-weight: 400;
    font-size:medium;
    color: #000;
  }
}


.miaccordion-item {
  margin: 35px auto;
  border-radius: 4px;
}

.miaccordion-title {
  border-radius: 4px;
  display: flex;
  justify-content: space-between;
  background-color: #101010;
  align-items: center;
  padding: 10px 20px;
  cursor: pointer;
  >h3{
    color: whitesmoke;
    margin-bottom: 0;
  }
}


.miaccordion-title .icon {
  width: 28px;
  height: 28px;
  transition: transform 0.3s ease-in-out;
  background-color: #000;
  border-radius: 50%;
  padding: 4px 0 1px;
}

.miaccordion-content {
  max-height: 0;
  overflow: hidden;
  padding: 5px 20px; 
  transition: all 0.3s ease-in-out;
  font-weight: 400;
  >p{
    color: #202020;
  }
  >p b{
    color: #000;
    font-weight: bold;
  }
  >ul li{
    font-size: medium;
  }
  >ul li::marker{
    color: #000; 
  }
}

.miaccordion-content.activado {
  max-height: 1000px;
  background-color: rgb(222, 244, 255);
  border-radius: 4px;
}



/* *** ICONOS CARDS PORTAFOLIO ***  */

.iconosleng {
  display: flex;
  margin-top: 15px;
  width: 100px;
  align-content: flex-start;
  gap: .4em;
}

.iconosleng img {
  height: 30px;
  transition: all .1s ease;
}
.iconosleng  img:hover{
  transform: scale(1.3);
}

.tooltips {
  position: relative;
  display: inline-block;
}

.tooltips .tooltiptexts {
  visibility: hidden;
  border-radius: 4px;
  background-color: #000;
  border: 1px solid #Fff;
  color: #Fff;
  text-align: center;
  padding: 2px 5px;
  position: absolute;
  z-index: 1;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  transition: opacity 0.1s;
  margin-bottom: 5px;
  font-weight: 300;
  font-size: small;

}

.tooltips:hover .tooltiptexts {
  visibility: visible;
  opacity: 1;
}



/* ********* *** DDDAAAAARRRKKK MMOOOODDDEEEE *** ******** */
/* ********* *** DDDAAAAARRRKKK MMOOOODDDEEEE *** ******** */

@media (prefers-color-scheme: dark){


  .modo-oscuro .mainn{
    background: radial-gradient(circle, #06003a, #000);
  }
  .modo-oscuro .fondodescontent{
    background-color: transparent;
  }
  .modo-oscuro .context{
    >h4{
      color: #fff;
    }
    >p{
      color: whitesmoke;
    }
  }
  .modo-oscuro .miaccordion{
    >h2{
      color: white;
    }
  }
  
  .modo-oscuro .miaccordion-content{
    >p{
      color: rgb(255, 255, 255);
    }
    >p b{
      color: #fcdc00;
    }
    >ul li{
      color: whitesmoke;
    }
    >ul li::marker{
      color: #fcdc00; 
    }
  }
  
  .modo-oscuro .truenos3{  
    background: transparent;
  }
  .modo-oscuro .miaccordion-title{
    background-color: #000;
  }
  .modo-oscuro .miaccordion-content.activado{
    background-color: #0a0a5a;
  }  
}



.modo-oscuro .mainn{
  background: radial-gradient(circle, #06003a, #000);
}
.modo-oscuro .fondodescontent{
  background-color: transparent;
}
.modo-oscuro .context{
  >h4{
    color: #fff;
  }
  >p{
    color: whitesmoke;
  }
}
.modo-oscuro .miaccordion{
  >h2{
    color: white;
  }
}

.modo-oscuro .miaccordion-content{
  >p{
    color: rgb(255, 255, 255);
  }
  >p b{
    color: #fcdc00;
  }
  >ul li{
    color: whitesmoke;
  }
  >ul li::marker{
    color: #fcdc00; 
  }
}

.modo-oscuro .truenos3{  
  background: transparent;
}
.modo-oscuro .miaccordion-title{
  background-color: #000;
}
.modo-oscuro .miaccordion-content.activado{
  background-color: #0a0a5a;
}


/* *** 1300 1300 1300 1300 1300 1300 1300 1300 ***  */
@media (max-width:1300px) {
  .contimagen{
    height: 80vh;
  }
  .esimL{
    display: none;
  }
  .descContent{
    flex-direction: column;
  }
  .videodev{
    display: flex;
    width: 100%;
    margin: auto;
  }
  .videodev video{
    max-width: 90%;
    margin-bottom: 50px;
  }
  .context{
    width: 100%;
  }
}

/* *** 992 992 992 992 992 992 992 992 992 992  992 ***  */
@media (max-width:992px) {
  .contimagen{
    height: 60vh;
  }
}

/* *** 768 768 768 768 768 768 768 768 768 768 768 768 ***  */
@media (max-width:768px) {
  .miaccordion h2{
    font-size: 28px;

  }
  .titleservices h2 {
    font-size: 28px;
  }

  .esimL{
    display: block;
    width: 100%;
  }

  .descContent{
    flex-direction: column;
    width: 100%;
    padding: 0;
  }
  .imgDesc{
    display: flex;
    width: 100%;
    margin: auto;
  }
  .imgDesc img{
    max-width: 100%;
  }


  .context{
    width: 85%;
    margin: auto;
    margin-top: 40px;

    >h4{
      width: 100%;
      margin: auto;
    }
    >p{
      width: 100%;
      margin: auto;
    }
  }

  .miaccordion{
    width: 85%;
  }

}

/* *** 576 576 576 576 576 576 576 576 576 ***  */

@media (max-width:576px) {

  .miaccordion-title{
    >h3{
      font-size: larger;
    }
  }

  .miaccordion-item{
    margin: 15px auto;
  }
}


/* *** 372 372 372 372 372 372 372 372 372 ***  */

@media (max-width:372px){
  .descContent{
    width:100%;
    padding-top: 10px;
  }

  .titleservices{
    margin-top: 0;
  }

}