header {
  background-color: black;
}

p {
  padding: 0.5rem;
  letter-spacing: 2px;
  line-height: 1.5rem;
  font-size: 1rem;
  font-weight: 500;
  text-align: start;
}

/***************************************************/
/* SCHOOL*/
.section_school {
  /* background-color: aqua; */
  min-height: 90vh;
  padding-top: 6rem;
  margin-bottom: 3%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.left {
  width: 40%;
  padding: 1rem 3rem;
  .info {
    h2{
      text-align:start;
      margin-top:1rem
    };
    .trigger{
      text-decoration: underline;
    }
    .trigger:hover{
      color:rgb(65, 65, 128);
      font-weight: bold;
    }

    .course_detail{
      margin-top: 0.7rem;
      background-color: rgb(250, 241, 197);
      padding: 1rem;
      display:none;
    } 
  }
}
.right {
  width: 55%;
  margin: auto;
}
.gallery_school{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-areas: 
  "container__slider1 container__slider1 container__slider2"
  "container__slider3 container__slider4 container__slider4";
  grid-template-rows: 350px ;
  grid-gap: 20px;
}
.container__slider1{
  grid-area: container__slider1 ;
  overflow:hidden;
}
.container__slider2{
  grid-area: container__slider2 ;
  overflow:hidden;
}
.container__slider3{
  grid-area: container__slider3 ;
  overflow:hidden;
}
.container__slider4{
  grid-area: container__slider4 ;
  overflow:hidden;
}
.slider{
  min-height: 100%;
  display:flex;  
  width: 200%;/*100% por imagen*/
  margin-left: -100%;
}
.slider__section1, .slider__section2 ,.slider__section3, .slider__section4{
  width: 100%;
}
.slider img{  
  width: 100%;
  height: 100%;
  object-fit: cover;/*IMPROTANTE!para que no se estiren deformadas las imágenes*/
  }
  .inmobile{
    display: none;
      }


/**********************************************/
/*PARALAX SERVICES*/
.parallax-servicios {
  height: auto;
  background-image: url(../img/servicios.jpg);
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.text_block_in_parallax {
  padding: 3rem;
  background: rgb(49, 77, 152, 0.3);
  color: aliceblue;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  h2 {
    margin: auto;
    line-height: 3rem;
    font-weight: 600;
    font-size: 1.5rem;
    padding-bottom: 0.5rem;
  }
}
/**********************************************/
/*EVENTS*/
.section_events {
  position: relative;
  width: 100%;
  overflow: hidden;
  h1{
    padding: 3rem;
         width: 100%;
  }
}

.div_cards{
  display:flex;
  height: fit-content;
  justify-content: center;

  align-self: flex-start;
  padding: 2rem;

  gap:20px
}
.info_card{
  width: 30%;
  min-height: 600px;
 
  padding:1rem;
  margin: auto;
  text-align: center;

}
/**********************************************/

/**********************************************/
/*RESPONSIVE*/
.slider__sectionMobile{
   animation-name: show;
  animation-duration: 15s;
  animation-iteration-count: infinite; 
  height: 300px;
  display:none;
}

@keyframes show {
  0%   {background-image:url('../img/esc1.jpg');
    background-size: cover; 
  }
  15%  {background-image:url('../img/esc2.jpg');
    background-size: cover; 
  }
  30%  {background-image:url('../img/esc3.jpg');
    background-size: cover; 
  }
  45%  {background-image:url('../img/esc4.jpg');
    background-size: cover; 
  }
  60% {background-image:url('../img/esc5.jpg');
    background-size: cover; 
  }
  75% {background-image:url('../img/esc6.jpg');
    background-size: cover; 
  }
  90% {background-image:url('../img/esc7.jpg');
    background-size: cover; 
  }
  100% {background-image:url('../img/esc1.jpg');
    background-size: cover; 
  }
}
 @media (max-width: 1269px) {
  .left,
  .right {
    padding: 1rem;
  }
  .info {
    margin-bottom: 0.5rem;
  }
} 
@media (max-width: 900px) {
  .left, .right {
    min-width: 90%;
    margin-bottom: 2%;
  }
}
@media (max-width:800px) {
  .div_cards {
   flex-direction: column;
  }
  .section_events h1{
    padding:2rem
  }
.info_card{
  width: 90%;
  min-height: 300px;
}
}
@media (max-width: 500px) {

  h1{
    font-size: 6rem;
  }
  .left {
    margin-bottom: 2%;
  }
   .gallery_school  {
  display:none
} 
.slider__sectionMobile{
  display:block;
}

}
@media (min-width: 3000px) {
.gallery_school{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-areas: 
  "container__slider1 container__slider1 container__slider2"
  "container__slider3 container__slider4 container__slider4";
  grid-template-rows: 700px ;
  grid-gap: 20px;
}
}