html, body {
  margin: 0px;
  padding: 0;
	width: 100%;
	height: 100%;
  

}


body {
	color: #333333;
	box-sizing: border-box;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica", sans-serif;
background-color: #ffffff;
}

/* INDEX HTML */
#background-video {
  height: 100vh;
  width: 100vw;
  object-fit: cover;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
}

#background-video2 {
  position: absolute;
  top: 0;
  left: 0;
  height: 200%;
  width: 100%;
  object-fit: cover;
  z-index: -1;
  opacity: 1;
}

.Capacitaciones {
  overflow: hidden;
  background-color: rgb(54, 67, 77);
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  margin: 0;
  width: 100%;
  height: 120vh;
  background-size: cover;
  background-position: center;
}

.Capacitaciones h3 {
  position: absolute;
  margin-top: 380px;
  color: white;
  
  
  opacity: .9;
  
}
.certext{
  font-size: 15px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}


.buyButton1, .buyButton2, .buyButton3 {
  font-size: 18px;
  background-color: rgba(86, 136, 12, 0.434);
  font-family: Trebuchet MS;
  font-weight:200;
  text-align: center;
  color: rgb(255, 255, 255);
  border-radius: 8%;
  border: 2px solid rgba(52, 64, 72, 0);
  padding: 10px 40px;
  /* cursor: url('/assets/cursor.png'), auto; */
  cursor: pointer;
  box-shadow: 2px 2px 4px 1px rgba(0, 49, 4, 0.755);
}

.buyButton4 {
  font-size: 18px;
  background-color: #ffffff2f  ;
  font-family: Trebuchet MS;
  font-weight:200;
  text-align: center;
  color: rgb(255, 255, 255);
  border-radius: 3%;
  border: 2px solid rgba(52, 64, 72, 0);
  padding: 10px 40px;
  /* cursor: url('/assets/cursor.png'), auto; */
  cursor: pointer;
  box-shadow: 0px 2px 4px rgba(0, 3, 32, 0.621);
}

.buyButton1:hover, .buyButton2:hover, .buyButton3:hover {
  background-color: rgba(3, 65, 17, 0.598);

}

.buyButton4:hover {
  background-color: rgba(255, 255, 255, 0.598);

}

.buyButton1:active, .buyButton2:active, .buyButton3:active, .buyButton4:active{
  box-shadow: 0 0 2px rgb(0, 0, 0);
  transform: translateY(2px);
 }
.cambio{
  margin-top: 19em;
}
.cambio1, .cambio2, .cambio3,.cambio4,.cambio5,.cambio6 {
  background-color: #fcfcfcf3;
  border-radius: 50%;
  border: none;
  padding: 5px;
  margin:3px;
  height: 15px;
  width: 15px;
  box-shadow: 0 2px 4px rgb(0, 0, 0);
  cursor: pointer;
  transition: all 0.1s ease;
}

.cambio1 {
  background-color: rgb(48, 48, 48);
  border-radius: 50%;
  border: none;
  padding: 5px;
  margin:3px;
  height: 15px;
  width: 15px;
  box-shadow: 0 2px 4px rgb(0, 0, 0);
  cursor: pointer;
  transition: all 0.1s ease;
}
 
.cambio1:hover , .cambio2:hover, .cambio3:hover,.cambio4:hover,.cambio5:hover,.cambio6:hover{
  box-shadow: 0 0 2px rgb(0, 0, 0);
  transform: translateY(2px);
 }



.Capacitaciones h3 {
  position: absolute;
  margin-top: 380px;
  color: white;
  
  
  opacity: .9;
  
}

#capahelp{
  padding: 30px;
  
}

.capatexto {
  display: flex;
  position: relative;
  flex-direction: row;
  justify-content: space-between;
  color: #ffffff;
  text-align: center;
  margin-bottom: 150px;
  margin-top: 50px;
  gap: 70px; /* Adjust the gap between columns */
  width: 80%; /* Center the content */
}


#capatit {
  cursor:pointer;
  font-family: Trebuchet MS;
  text-decoration: underline;
  transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.6s;
}

.Certificaciones h3{
  font-size: 20px;
}

.certext > p {
  background: linear-gradient(
    to right,
    rgb(241, 241, 241) 50%,
    rgba(37, 37, 37, 0.18) 50%
  );
  background-size: 200% 100%;
  background-position-x: 100%;
  color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
  text-align: center;
  font-weight: 700;
  padding: 3px 100px;
  font-family: Helvetica;
  
/*   outline: 6px dotted teal; */
}

.placeholder {
  display: block;
  height: 5px;
  

}


#text1 {
  transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.6s;
  font-family: Helvetica;
  font-size: 15px;
}

#col1, #col2, #col3 {
  font-size: 18px;
  flex: 1; /* Ensure equal column width */
}

#col1{
  color: white;
}
#col2, #col3 {
  color: #727272;
}

.container {
	max-width: 1050px;
	margin: auto;
  }

  .Certificaciones {
    position: relative;
    height: 120vh;
    width: 100vw;
    overflow: hidden;
      background: url(/assets3/iSolenum_imagen_01.jpg) no-repeat;
      background-size: cover;
      opacity: 0.;
  }
  

  .Certificaciones h3{
    position: relative;
    margin-top: 10px;
    color: #ffffff;
    font-size: 23px;
    font-weight: 900;
    
  }
  .certf1 {
    position: relative;
    z-index: 1;
    background-image: url("/assets3/f3.png");
    padding: 40px 40px;
    color: white; /* Adjust text color for visibility */
    text-align: center;
    overflow: hidden;
    opacity: 1;
  }

 

.Ecotecnias{
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 160px 0px;
  margin: 0;
  width: 100%;
  height: 35vh;
  z-index: 1;
  background-image: url('/assets3/ecotecnia1.jpg');
  background-size:cover;
  background-position: top;
  background-repeat: no-repeat;
  transition: background-image 0.4s;
}

#Ecotecnia1{
  color:rgb(255, 255, 255);
}

h1, h2 {
  color: rgb(246, 251, 255);
  font-family: Trebuchet MS;
  font-weight: bold;
  text-align: center;
}

h1 {
  font-size: 6rem;
  margin-top: 30vh; 
}

h2 { font-size: 3rem; }

h3{
  color:#333333;
  font-family: Trebuchet MS;
  font-weight: bold;
  text-align: center;
  font-size: x-large;
}
/* cursor: url(https://innovacionsustentable.mx/wp-content/uploads/2019/06/Solenum_cursorv4.png) 25 25, auto; */

.Inicio{


  
  
}


.logo {
  position: fixed;
  top: 5px;
  right: 15px;

}



.Mision {
  display: relative;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 20px 150px;
  margin-top: 8em;
  background-color: #ffffff;
  overflow: hidden;

}

.footer {
  width: 100%;
  box-shadow: 0 2px 50px rgb(0, 0, 0);
  background-color: #0f2b46;  position: relative;
  bottom: 0;

}

.footer2 {
  width: 100%;
  box-shadow: 0 2px 50px rgb(0, 0, 0);
  background-color: #033c75;
  position: relative;
  bottom: 0;

}
.foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 90px;
}

.footerLeft, .footerCenter, .footerRight, .aviso {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #e4e4e4;
}

.footerLeft p, .footerCenter span, .aviso {
  margin: 0;
  font-size: 12px;
  font-weight: 300;
}

.footerLeft{
  padding-left: 40px;
}


.footerRight{
  padding-right: 40px;
}

.aviso{
  text-decoration: underline;
}
.footerCenter {
  text-align: center;

}

.footerRight img {
  width: 80px;
  height: 40px;
}



.nav{
  overflow: hidden;
}

.navbottom {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 20px;
  
}

.navTop{
    display: flex;
    align-items: center;
    justify-content: space-between;

}


.navbar {
  width: 100%;
  box-shadow: 0 1px 4px rgba(20, 81, 142, 0.323);
  
}  



.nav-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 62px;
  
}




nav {
  position: fixed; /* Fixes the navigation bar */
  top: 0; /* Aligns it to the top */
  width: 100%; /* Ensures it spans the full width of the screen */
  z-index: 1000; /* Keeps it above other elements */
  background-color: #45545f8f; /* Add a background color if needed */

}

.navbar .menu-items {
  display: flex;
}

.navbar .nav-container li {
  list-style: none;
}

.navbar .nav-container a {
  text-decoration: none;
  color: rgba(246, 251, 255, 0.738);;
  font-weight: 500;
  font-size: 0.8rem;
  padding: 0.7rem;
}

.navbar .nav-container a:hover{
    font-weight: bolder;
}

.nav-container {
  display: block;
  position: relative;
  height: 60px;
}

.nav-container .checkbox {
  position: absolute;
  display: block;
  height: 32px;
  width: 32px;
  top: 20px;
  left: 20px;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}

#CONSULTA{
  
  font-size: 16px;
  background-color: rgb(255, 255, 255); /* Transparent background */
  font-family: Trebuchet MS;
  box-shadow: #a1a1a1;
  text-align: center;
  color: rgb(0, 0, 0);
  box-shadow: 0 2px 6px rgb(255, 255, 255);
  border-radius: 3%;
  border: 2px solid rgba(255, 255, 255, 0);
  padding: 10px;
  cursor: pointer;
  overflow: hidden; /* Ensure the pseudo-element stays within the button */
  
}
.nav-container .hamburger-lines {
  display: block;
  height: 26px;
  width: 32px;
  position: absolute;
  top: 17px;
  left: 20px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.nav-container .hamburger-lines .line {
  display: block;
  height: 4px;
  width: 100%;
  border-radius: 10px;
  background: rgb(246, 251, 255);;
}

.nav-container .hamburger-lines .line1 {
  transform-origin: 0% 0%;
  transition: transform 0.4s ease-in-out;
}

.nav-container .hamburger-lines .line2 {
  transition: transform 0.2s ease-in-out;
}

.nav-container .hamburger-lines .line3 {
  transform-origin: 0% 100%;
  transition: transform 0.4s ease-in-out;
}

.navbar .menu-items {
  padding-top: 22px;
  padding-left: 50px;
  height: 20vh;
  width: 15%;
  transform: translate(-450%);
  display: flex;
  flex-direction: row;

  transition: transform 0.5s ease-in-out;
  text-align: left;

}

.navbar .menu-items li {
  margin-bottom: 0.5rem;
  font-size: 0.8rem;
  font-weight: 100;
  
  
}


.nav-container input[type="checkbox"]:checked ~ .menu-items {
  transform: translateX(0);
}

.nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line1 {
  transform: rotate(45deg);
}

.nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line2 {
  transform: scaleY(0);
}

.nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line3 {
  transform: rotate(-45deg);
}

.nav-container input[type="checkbox"]:checked ~ .logo{
  display: none;
  
}

#proyectos{
  color: #ffffff;
}

.proy360{
  position: relative;
  height: 100vh;
  width: 100vw;
  overflow: hidden;
  background-image: url('/assets3/360.jpg');
  background-size: cover;
  background-position: top;


}

.Servicios {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  align-items: center;
  padding: 100px 0px;
  margin: 0;
  width: 100%;
  height: 35vh;
  z-index: 1;
  background-image: url('/assets3/iSolenum_imagen_07.jpg');
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
}




#ser1, #ser2, #ser3, #ser4 {
  position: relative;
  font-size: 18px;
  background-color: rgba(0, 0, 0, 0.051); /* Transparent background */
  font-family: Helvetica;
  box-shadow: #000000;
  text-align: center;
  color: rgb(255, 255, 255);
  box-shadow: 0 2px 4px rgb(0, 0, 0);
  border-radius: 8%;
  border: 2px solid rgba(4, 41, 69, 0);
  margin:25px;
  cursor: pointer;
  overflow: hidden; /* Ensure the pseudo-element stays within the button */
}


#ser1:hover, #ser2:hover, #ser3:hover, #ser4:hover {
  background-color: rgba(0, 0, 0, 0.204); /* Transparent background */
 }
 
 #ser1:active, #ser2:active, #ser3:active, #ser4:active{
  box-shadow: 0 0 2px rgb(0, 0, 0);
  transform: translateY(2px);
 }
#ser1{
  padding: 30px 50px;

}
#ser2{
  padding: 30px 30px;
  
}

#ser3{
  padding: 30px 35px;

}
#ser4{
  padding: 30px 30px;

}
.Servicios .content {
  position: flex;
  text-align: center;
 /* Adjust to move the content down */

}

.Servicios h3 {
  color: aliceblue;
  margin: 0; /* Adjust margin as needed */
  padding: 0px 0; /* Adjust padding as needed */
}

.Servicios p {
  font-size: 1.2em;
  color: aliceblue; /* Change color to match the h3 */
  margin: 10px 0; /* Adjust margin as needed */
  padding: 0px 0; /* Adjust padding as needed */
}

.sistemasfoto{
  background-color: rgb(25, 69, 128);
  text-align: center;
  font-family: Helvetica;
  padding: 2px 10px;
}

.titulos {
  display: flex; /* Enable Flexbox */
  flex-direction: row; /* Arrange items in a row */
  justify-content: space-between; /* Add space between items */
  background-color: rgb(25, 69, 128);
  text-align: center;
  font-family: Helvetica;
  padding: 0px 100px;
  gap: 100px;
}

/* Add transition to the text elements */
.sistemasfoto h4, .sistemasfoto p {
  transition: opacity 0.5s ease-in-out;
}

.sistemasfoto p {
  color:rgb(234, 234, 234);
  font-size: 16px;
  
}

.Specs {
  background-image: url('/assets3/prueba1.jpg');
  width: 100%;
  height: 100vh;
  align-items: center;
  background-size: cover;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  opacity:0.9;


}

#certificaciones{
  color: #ffffff;
  transform: translateY(-10px);
}

.teacher {
  background-image: url('/assets3/servicebox3.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  padding: 190px 600px;
  margin-bottom: 40px;
}
.titlebox{
  background-color: rgb(25, 69, 128);
  height:10%;
  padding-top: 1px;
  overflow: hidden;
  color: #ffffff;


}


.titlebox2{
  background-color: rgb(25, 69, 128);
  height:20%;
  padding-top: 1px;
  overflow: hidden;


}

.titlebox3{
  background-color: rgb(86, 136, 12);
  height:10%;
  padding-top: 1px;
  overflow: hidden;
  color: #ffffff;

}
#titlesistema{
  font-size: 20px;
  color:#ffffff;
  height:10%;

}


table{
  width:100%;
  table-layout: fixed;
 
  
}



.tbl-header{
  background-color: rgba(255, 255, 255, 0.7);
  transform: translateY(420px);
  border: 1px solid rgba(0, 0, 0, 0.3);
  box-shadow: 0px 1px 20px rgb(0, 3, 32);
  font-family: Trebuchet MS;
  width: 100%;


 }

 .tbl-content{
  overflow-x:hidden;
  margin-top: 0px;
  transform: translateY(420px);
  background-color: rgba(206, 206, 206, 0.5);
  font-family: Helvetica;
  height: 40vh;
  border: 1px solid rgba(0, 0, 0, 0.3);
  


  
}

th{
  padding: 20px 15px;
  font-weight: 600;

  color: #000000;
  font-family: Helvetica; 
  /* CAMBIAR */
}

td{
  padding: 20px 15px;
  vertical-align:middle;
  font-weight: 400;
  font-size: 14px;
  color: #000000;
  

 
}

.tbl-content th{
  text-align: center;
}

.tbl-content td{
  text-align: center;
}

.table-specs {
  width: 100%;
  
}

#titi{
  font-weight: 600;
  font-size: 15px;

}
.spec-header{
  /* background-color: rgba(0, 0, 0, 0.701); */
  background-color: rgb(86, 136, 12);
  transform: translateY(40px);
  border: 1.4px solid #000007;
  box-shadow: 0px 1px 20px rgba(0, 0, 0, 0.982);
  font-family: Trebuchet MS;
  margin: 0px 10px;
  
  

 }

 .spec-content{
  background-color: #0000007b;
  
  align-items: center;
  margin: 0px 10px;
  margin-bottom: 310px;
  transform: translateY(40px);
  font-family:Helvetica;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  border-bottom: 1px solid #000000;
  border-radius: 0px 0px 15px 15px;
  
}

.spec-content td{
  color: #ffffffcf;
  font-weight:lighter;
  text-align: center;
  

  

}
.spec-header th{
  color: #ffffff;
  font-weight: bold;
  text-align: center;
  font-size: 26px;
  
  



}


@media (min-width: 1000px) {
  .teacher {

    padding: 240px 100%;
    margin-bottom: 70px;
    }
    .Capacitaciones h3{
      margin-top: 500px;
    }

    .sistemasfoto p {

      font-size: 17px;
      
    }
}
@media (max-width: 958px) {
  


  .Servicios .content {
    align-items:center;
    /* margin-top: 200px; Adjust to move the content down */


   }

  #ser1{
    padding: 30px 50px;
    margin-left: 100px;
    
  
  }
  #ser2{
    padding: 30px 34px;
    margin-right: 100px;
    
  }
  
  #ser3{
    padding: 30px 34px;
    margin-left: 100px;
    

  }
  #ser4{
    padding: 30px 40px;
    margin-right: 100px;
  
  }
  }

@media (max-width: 650px) {
    #background-video { display: none; }
    .Inicio {
      position: relative;
      background: url(/assets3/pexels-pixabay-433308.jpg) no-repeat;
      background-size: cover;
      height: 120%;
      overflow: hidden;
    }
  
    .Mision{
      margin-top: 10px;

    }

    #background-video2 { display: none; }
    .Certificaciones {
      background-size: cover;
      height: 120vh;

    }


	h1, h2 {
		color: rgb(225, 242, 248);
		font-family: Trebuchet MS;
		font-weight: bold;
		text-align: center;
	  }



	.navbar .nav-container a {
		text-decoration: none;
		color: rgb(225, 242, 248);
		font-weight: 500;
		font-size: 0.8rem;
		padding: 0.7rem;
	}
	
	.nav-container .hamburger-lines .line {
		display: block;
		height: 4px;
		width: 100%;
		border-radius: 10px;
		background:  rgb(225, 242, 248);
	  }

    .buyButton1, .buyButton2, .buyButton3, .buyButton4 {
      width: 80%;
      padding: 6px 0px;
      font-size: 15px;
      background-color: rgba(12, 121, 136, 0.434);
      box-shadow: 2px 2px 4px 1px rgba(1, 47, 74, 0.755);


      
  }
  .buyButton1:hover, .buyButton2:hover, .buyButton3:hover {
    background-color: rgba(17, 48, 183, 0.598);
  
  }

}



@media (max-width: 700px) {


  .Ecotecnias{
   
    padding: 120px 0px;
   
  }
  
.titulos {
  display: flex; /* Enable Flexbox */
  flex-direction: column; /* Arrange items in a row */
  justify-content: space-between; /* Add space between items */

  gap: 20px;
}


  .Capacitaciones {
    height: 140vh;

  }

  .capatexto {
    flex-direction: column;
    gap: 0px;
    margin-bottom: 100px;
    align-items: center;
    margin-left: 0px;
  }

  #col1, #col2, #col3 {
    text-align: center; /* Keep text alignment left within the columns */
  }



  #ser1{
    padding: 30px 50px;
    margin-left: 40px;
    font-size: 16px;
  
  }
  #ser2{
    padding: 30px 34px;
    margin-right: 40px;
    font-size: 16px;
    
  }
  
  #ser3{
    padding: 30px 34px;
    margin-left: 40px;
    font-size: 16px;
    

  }
  #ser4{
    padding: 30px 40px;
    margin-right: 40px;
    font-size: 16px;
  
  }

  .certext{
    font-size: 14px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  }

  /* IPHONE */
@media (max-width: 545px) {
  .Mision{
    margin-top: 10px;
    padding: 20px 10px;
  }
  
  .sistemasfoto p {

    font-size: 14px;
    
  }
  .Certificaciones p{
    font-size: 14px;
  }
  .Inicio h1{
    font-size: 70px;
  }
  .Inicio h2{
    font-size: 45px;
  }
  .navbottom {
      flex-direction: column;
      align-items: center;
      gap: 10px;
      
  }

 
  /* .Mision {
    display: relative;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 20px;
    margin-top: 5em;
  } */
 

#ser1, #ser2, #ser3, #ser4 {
  position: relative;
  font-size: 16px;
  background-color: rgba(0, 0, 0, 0.051); /* Transparent background */
  font-family: Trebuchet MS;
  box-shadow: #000000;
  text-align: center;
  color: rgb(255, 255, 255);
  box-shadow: 0 2px 4px rgb(0, 0, 0);
  border-radius: 8%;
  border: 2px solid rgba(4, 41, 69, 0);
  margin:15px;
  cursor: pointer;
  overflow: hidden; /* Ensure the pseudo-element stays within the button */
  
}




}

@media (max-width: 505px) {

 
  .spec-content{

    margin-bottom: 250px;

  }

}

@media (max-width: 425px) {

 
  .spec-content{

    margin-bottom: 250px;

  }
  .Servicios{
    height: 55vh;

  }
}

/* NOSOTROS */

/* MAIN */

.mision-we {
  display: relative;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 20px;
  transform:translateY(-80px);


}

.mision-we h3{
  font-size: 20px;
}

.mision-we p{
  font-size: 14px;
}

.Inicio-we{
  overflow: hidden;
  height: 90%;
  
  
}

#background-video-we {
  height: 100vh;
  
  width: 100vw;
  object-fit: cover;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
  opacity: 0.9;
  overflow: hidden;
}


#nosotros-title{
  color: #000000;
  font-size: 60px;
  padding:80px 0px 0px 0px;
  margin:0;
  
  

}

#nosotros-subtitle{
  color: #000000b9;
  font-size: 20px;
  padding:0;
  margin:0;
  margin-bottom:200px;
  



}
.we-info{
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  align-items: center;
  padding: 120px 0px;
  margin: 0;
  width: 100%;
  height: 90vh;
  z-index: 1;
  background-image: url('/assets3/nosotros-2.jpg');
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
  overflow: hidden;
}

.we-capatexto {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  justify-items: center;
  align-items: start;
  color: #ffffff;
  text-align: center;
  gap: 50px; /* Adjust the gap as needed */
  margin-top: 300px;
  
}


.we-capatexto2 {
  display: grid;
  grid-template-rows: 1fr auto 1fr;
  justify-items: center;
  align-items: start;
  color: #ffffff;
  text-align: center;
  gap: 50px; /* Adjust the gap as needed */
  
  margin-top: 0px;
}
#capatitwe2 {
  text-shadow: 1px 3px 2px rgb(0, 0, 0);
  font-size: 18px;
  margin-bottom:20px; 
  color: #ffffff;
  
}

#titwe {
  background-color: #7b7b7b44;
  font-size: 24px;
  font-family:Trebuchet MS;
  margin: 0;
  transform: translateY(-0px);

  position: relative;
  text-shadow: 0px 1px 3px rgb(0, 0, 0);
  padding: 20px 20px;
  text-align: center;
  overflow: hidden;

  z-index: 1;
  color: #ffffffe6;
  
}



#colwe{
  position: relative;
   /* Needed for absolute positioning of bla text */
}

#capatitwe {
  text-shadow: 0 2px 2px rgb(0, 0, 0);
  font-size: 18px;
  margin-bottom:20px; 
  /* Adjust as needed to create space for bla text */
}

#bla {
  position: absolute;
  bottom: -20px; /* Adjust this value to position the bla text correctly */
  text-shadow: 0 2px 1px rgba(0, 0, 0, 0.654);
  font-weight: 400;
  font-size: 14px;
  white-space: nowrap; /* Prevent text from wrapping */
  left: 50%;
  transform: translateX(-50%);
  
}

#bla2{
  
  text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.654);
  font-weight: 400;
  white-space: nowrap; /* Prevent text from wrapping */
  font-size: 14px;
  
}
/* NAV BAR */


#awe {
  text-decoration: none;
  color: rgba(255, 255, 255, 0.738);;
  font-weight: 500;
  font-size: 0.8rem;
  padding: 0.7rem;
}

#awe:hover{
    font-weight: bolder;
}

.nav-container .hamburger-lines-we {
  display: block;
  height: 26px;
  width: 32px;
  position: absolute;
  top: 17px;
  left: 20px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.nav-container .hamburger-lines-we .line-we {
  display: block;
  height: 4px;
  width: 100%;
  border-radius: 10px;
  background: rgb(255, 255, 255);;
}

.nav-container .hamburger-lines-we .line1 {
  transform-origin: 0% 0%;
  transition: transform 0.4s ease-in-out;
}

.nav-container .hamburger-lines-we .line2 {
  transition: transform 0.2s ease-in-out;
}

.nav-container .hamburger-lines-we .line3 {
  transform-origin: 0% 100%;
  transition: transform 0.4s ease-in-out;
}



.nav-container input[type="checkbox"]:checked ~ .hamburger-lines-we .line1 {
  transform: rotate(45deg);
}

.nav-container input[type="checkbox"]:checked ~ .hamburger-lines-we .line2 {
  transform: scaleY(0);
}

.nav-container input[type="checkbox"]:checked ~ .hamburger-lines-we .line3 {
  transform: rotate(-45deg);
}

/* MAPPP */
.map {
  height: 90%;
  width: 100%;
  overflow: hidden; /* Hide overflow */
  position: relative; /* Allow for absolute positioning within */
  position: relative;
  align-items: center;
}


.omg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -45%) scale(0.6); /* Adjust the scale value to make the map bigger/smaller */
  min-width: 100%;
  min-height: 100%;
  z-index: 1;
  fill: rgba(139, 139, 139, 0.843);

}


.Canada, #DE, #CR{
  cursor: pointer;
  fill: rgba(8, 100, 20, 0.843);
}

#US, #HN, .United{
  cursor: pointer;
  fill: rgba(51, 117, 59, 0.843);
}

.France, #MX, #BO{
  cursor: pointer;
  fill: rgba(12, 150, 30, 0.843);
}

.Canada, #DE, #CR{
  cursor: pointer;
  fill: rgba(8, 100, 20, 0.843);
}

#US:hover, #HN:hover, .United:hover{
  cursor: pointer;
  fill: rgba(24, 37, 92, 0.843);
  
}

.France:hover, #MX:hover, #BO:hover{
  cursor: pointer;
  fill: rgba(12, 21, 150, 0.843);
}

.Canada:hover, #DE:hover, #CR:hover{
  cursor: pointer;
  fill: rgba(31, 8, 100, 0.843);
}


.tooltip {
  position: absolute;
  background-color: rgba(0, 0, 0, 0.074);
  color: white;
  padding: 8px;
  width: 50%;
  border-radius: 5px;
  pointer-events: none;
  display: none;
  z-index: 1;
  font-family: Helvetica;
  box-shadow: 0 2px 4px rgb(0, 3, 32);
  transform: translate(50%, 500%);

  text-align: center;
  text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.654);

}
.certf2 {
  position: relative;
  background-image: url("/assets3/f2.png");
  padding: 40px 40px;
  text-align: center;
  overflow: hidden;

  z-index: 1;

}

#background-video-we2 {
  height: 120vh;
  z-index: 1;
  transform: translateY(-100px);
  width: 100vw;
  object-fit: cover;
  position: flex;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
  opacity: 0.7;
  overflow: hidden;
}


@media (max-width: 650px) {

.map {
  height: 100%;
  width: 100%;
  overflow: hidden; /* Hide overflow */
  position: relative; /* Allow for absolute positioning within */
  background-image: url(/assets3/cielo.jpg);
  background-size: cover;
  background-color: #5391e2;
}

#background-video-we2 { display: none; }

.omg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-47%, -50%) scale(0.5); /* Adjust the scale value to make the map bigger/smaller */
  min-width: 100%;
  min-height: 100%;
}

  .mision-we{
    margin-top: 10px;
    overflow: hidden;
  }
  .nav-container .hamburger-lines-we .line-we {
    background: rgb(255, 255, 255);;
  }

  #awe {
    
    color: rgba(255, 255, 255, 0.738);;

  }
  

#nosotros-title{
  color: #ffffff;
  font-size: 60px;
  padding:80px 0px 0px 0px;
  margin:0;
  
  

}

#nosotros-subtitle{
  color: #ffffffc6;
  font-size: 18px;
  padding:0;
  margin:0;
  margin-bottom:200px;
  



}

  #background-video-we { display: none; }
  .Inicio-we {
    position: relative;
    background: url(/assets3/nosotros.jpg) no-repeat;
    background-size: cover;
    height: 100%;
  }

  


.nav-container .hamburger-lines-we .line-we {
  display: block;
  height: 4px;
  width: 100%;
  border-radius: 10px;
 
  }



}
@media (max-width: 500px) {
.omg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-43%, -50%) scale(0.5); /* Adjust the scale value to make the map bigger/smaller */
  min-width: 100%;
  min-height: 100%;
}
}