/*Aqui son los efectos del slider de imagenes*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  @import url('https://fonts.cdnfonts.com/css/airstrike');

:root{
  --titulo:'airstrike', sans-serif;
  --texto:'Montserrat-Regular', sans-serif;

}


  body {
    align-items: center;
    justify-content: center;
    background: #343f4f;
  }


  .slider{
    display: flex;
    justify-content: center;
  }

  .wrapper {
    display: flex;
    max-width: 860px;
    width: 100%;
    height: 400px;
    align-items: center;
    justify-content: center;
    position: absolute;
    border-radius: 12px;
    top: 7rem;
  }
  .wrapper i.button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    height: 36px;
    width: 36px;
    background-color: #343f4f;
    border-radius: 50%;
    text-align: center;
    line-height: 36px;
    color: #fff;
    font-size: 15px;
    transition: all 0.3s linear;
    z-index: 5;
    cursor: pointer;
  }
  i.button:active {
    transform: scale(0.94) translateY(-150%);
  }
  i#prev {
    left: 25px;
  }
  i#next {
    right: 25px;
  }
  .image-container {
    height: 450px;
    max-width: 700px;
    width: 100%;
    overflow: hidden;
  }
  .image-container .carousel {
    display: flex;
    height: 100%;
    width: 100%;
    transition: all 0.4s ease;
  }
  .carousel img {
    height: 100%;
    width: 100%;
    border-radius: 18px;
    /*border: 5px solid #ffffff;*/
    object-fit: cover;

    border-style:outset;
    border-width: 5px;
    border-color: #000000;
  }


  /*aca empieza lo de los botones de incio y el texto gral*/
  
  /*Titulo*/
  .presentacion0{
    position: relative;
    top: 35rem;
    width: 100%;
    align-items: center;
    display: grid;
    background-image: url(/image/1.FONDOS/fondo_titulos4.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }

  #Logo_fuente{ 
    position: relative;
    display: grid;
    font-family:var(--titulo);
    font-weight: lighter;
    font-size: 45px;
    text-align: center;
    object-fit: contain;
  }

  .presentacion0 h1{
    justify-content: center;
    align-items: center;
    display: flex;
    text-align: justify;
    color: rgb(253, 253, 253);
    font-size: 2.5rem;
    padding-bottom: 1.5rem;
    font-family:var(--titulo);
  }

  /*texto y el boton*/

  .presentacion{
  position: relative;
  top: 36rem;
  margin: 20px 40px 20px 40px;
  justify-content: center;
  align-items: center;
  display: grid;

  border-radius: 30px;

  background-color: #0a0a0a83;


}

#Intro{
  text-align: center;
}

.presentacion p{
  padding: 20px 10px 5px 10px;
  color: rgb(255, 255, 255);
  font-size: 1.3rem;
  text-align: center;
  margin: 10px;
  object-fit: contain;

  /*text-shadow: 5px 5px 5px #787575;*/

  font-family:var(--texto);
}

.btn{
  border-radius: 10px;
  margin-top: 15px;
  padding: 10px 40px;
  border: 2px solid #380000;
  color: white;
  text-decoration: none;
  background-color: #350101;
  box-shadow: 0 5px 10px rgba(0,0,0,.5);
  
}

.btn:hover{
  background: #f92420;
  border: 2px solid #b02727;
  transition: 0.6s;
}

.btn-home{
  display: flex;
  justify-content: center;
  padding-bottom: 20px;
}

.btn-home a{
  margin: 0 10px;
}

/*todos los titulos y texto*/
h1{
  justify-content: center;
  align-items: center;
  display: flex;
  text-align: justify;
  color: rgb(255, 255, 255);
  font-size: 2.5rem;
  padding-bottom: 1.5rem;
  padding-top: 2rem;
  object-fit: contain;
  font-family:var(--titulo);
}


h2{
  justify-content: center;
  align-items: center;
  display: flex;
  text-align: center;
  color: rgb(255, 255, 255);
  font-size: 2rem;
  padding-bottom: 1.5rem;
  object-fit: contain;
  font-family:var(--titulo);
}



p{
  padding: 10px 15px 35px 15px;
  color: rgb(255, 255, 255);
  font-size: 17px;
  text-align: center;
  object-fit: contain;
  font-family:var(--texto);
}


/*Logros */
.achievements{
  position: relative;
  justify-content: center;
  padding: 0px;
  background-color: rgb(40, 38, 38);
 /* background: linear-gradient(90deg, rgb(107, 107, 107) 0%, rgba(255, 0, 0, 1)100%) ;*/
  top: 40rem;
  font-family: 'arstrike';
}
#logros{
  font-size:55px ;
  font-weight: lighter;
}

.column{
  justify-content: center;
  justify-items: center;
  display: grid;
  position: relative;

}

.column:hover{
  transform: scale(1.05);
  transition: all .7s ease;
}

.column img{
  max-width: 20rem;
  object-fit: contain;
}

.column img{
  width: 85%;
  transition: all .6s ease;
  border-radius: 20px;

  border-style:outset;
  border-width: 5px;
  border-color: #f92420;
}

#ReconReg{
  padding-bottom: 3rem;
}

.galeria_i{
  display: grid;
  gap: 1rem;
  grid-template-columns:  repeat(auto-fit, minmax(200px, 1fr));

}

.galeria_i img{
  max-width: 70rem;

}

/*segunda parte_regionales de logros*/

.galeria_i2{
  display: grid;
  gap: 1rem;
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));

}



.equipo5 {
  position:relative;
  gap: 1rem;
  grid-column: span 1;
  grid-auto-rows: 26rem;
  grid-template-columns: repeat( minmax(25rem,1fr));


  margin-top: 570px;
  margin-bottom: -350px;
}





.equipo5 img{
  width: 100%;
  height: 230%;
  object-fit: contain;
}



/*Cargos*/
.charges{
  position: relative;
  justify-content: center;
  padding: 30px;
  background-color: #3f3f3f;
  top: 21rem;
}

.charges h1{
  justify-content: center;
  align-items: center;
  display: flex;
  text-align: justify;
  color: rgb(255, 255, 255);
  font-size: 2.5rem;
  padding-bottom: 1.5rem;
  font-family:var(--titulo);
}

.charges p{
  padding: 20px 15px 35px 15px;
  color: rgb(255, 255, 255);
  font-size: 1.1rem;
  text-align: center;

  object-fit: contain;

  font-family: 'Montserrat-Regular.ttf';
  src: url('fuentes/MONTSERRAT - TEXTO EN GENERAL/Montserrat-Regular.ttf');

}

/*Formato de cajas*/
.box-container{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;

}

.box:hover{
  transform: scale(1.1);
  cursor: pointer;
  transition: all .7s ease;
  }


.box-container .box{
  height: 25rem;
  background-color: #101010;
  text-align: center;
  border-radius: 2rem;
  box-shadow: 0 0.3rem 5rem rgba( 0, 0, 0, alpha);
  margin: 2rem;
  display: grid;
  justify-items: center;

  border-style:outset;
  border-width: 5px;
  border-color: #f92420;
 
}

.box-container .box img{
  height: 19rem;
  width: 14rem;
  line-height: 4rem;
  text-align: center;
  border-radius: 10%;
  color: white;
  /*background-color: #830d0d;*/
  font-size: 2rem;
  margin: 1rem;

  
}



.box-container .box h3{
  font-size: 20px;
  color: #f8f1f1;

  font-family: 'arstrike.ttf';
      src: url('/fuentes/AIRSTRIKE-LOGO/airstrike.ttf');
}
 


#gordito{
  font-size:17px ;
}
/*.box-container .box p{
  font-size: 16px;
  padding: 4px 25px;
  text-align: center;

  font-family: 'Montserrat-Regular.ttf';
  src: url('fuentes/MONTSERRAT - TEXTO EN GENERAL/Montserrat-Regular.ttf');
}
*/


/*empieza sección de videos*/
.Videos {
  position: relative;
  justify-content: center;
  padding: 0px;
  /*background-color: #141414;*/
  top: 24rem;

  background-color: #0a0a0a83;
  border-radius: 30px;

  margin-left: 50px;
  margin-right: 50px;
  padding-bottom: 3rem;

  
}

.title{
  font-size: 30px;
  text-align: center;
  font-weight: lighter;
}

.column2{
  justify-content: center;
  justify-items: center;
  display: grid;
  position: relative;
  

}


.column2 video{
  max-width: 70%;
  object-fit: contain;
}

.column2 video{
 /* width: 85%;
  transition: all .6s ease;*/
  border-radius: 20px;

  border-style:outset;
  border-width: 5px;
  border-color: #f92420;
}




/*pie de la pagina*/
.final{
  background-color: #141414;
  position: relative;
  top: 27rem;
  
  
}

.finaldiv{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
}

.finalp{
  color: white;
  font-size: 1.1rem;
  object-fit: contain;

  font-family: 'Montserrat-Regular.ttf';
  src: url('fuentes/MONTSERRAT - TEXTO EN GENERAL/Montserrat-Regular.ttf');
}

.finaldiv .finalp{
  padding: 30px;
}

.final ul {
	padding: 25px;
	margin: 0;
}

.final ul li {
	list-style: none;
	display: inline-block;
	margin-right: 5px;
	margin-top: 1px;
}

.final ul li a {
	display: block;
	width: 30px;
	height: 30px;
	text-align: center;
	background: #f8f8f8;
	border-radius: 50px;
}

.final ul li a:hover{
	transform: scale(1.2);
  	cursor: pointer;
  	transition: all .7s ease;

	background-color: #f92420;

}

.final ul li a i {
	font-size: 14px;
	line-height: 30px;
	color: #000;
}