.swiper-container {
      width: 100%;
      padding-top: 50px;
      padding-bottom: 50px;
      background: #F7F7F7;
      grid-area: swiper-container;
    }
    .swiper-slide {
      background-position: center;
      background-size: cover;
      width: 300px;
      float: right;
      height: 400px;
      background: #FFF;
    }
    .swiper-slide .imgBx{
      width: 100%;
      height: 300px;
      overflow: hidden;
    }
    .swiper-slide .imgBx img{
      width: 100%;
      height: 300px;
      overflow: hidden;
    }
    .swiper-slide .detalles{
     box-sizing: border-box;
     font-size: 24px;
     margin-top: 10px;
    }
    .swiper-slide .detalles h3{
     margin: 0;
     padding: 0;
     font-size: 24px;
     text-align: center;
     line-height: 24px;

    }
    .swiper-slide .detalles h3 span{
     font-size: 20px;
    color:  #1D447D;  
  }

@media screen and (max-width: 313px){
  .swiper-container {
    width: 100%;
  }
  .swiper-slide {
      background-position: center;
      background-size: cover;
      width: 200px;
      float: right;
      height: 450px;
      background: #FFF;
    }
  
}