@import "main.css";

/*Seccion 1 Banner */
.seccion-rg {
  margin-top: 78px;
  width: 100vw;
}

.banner1-rg {
  display: flex;
  flex-direction: row;
}

/* .img-banner-rg {
  transform: translateX(-56px);
} */

.img-banner-rg img {
  max-width: 100vw;
}

.titulo-alka {
  background: #F6E100;
  color: black;
  font-size: 30px;
  width: 17em;
  text-align: center;
  transform: translate(60px, -60px);
}

.subtitulo-seccion {
  margin-top: -80px;
  padding: 20px;
}

@media screen and (max-width:1227px) {
  .img-banner-rg {
    transform: translate(0, -16px);
  }

  .titulo-alka {
    width: 15em;
    font-size: 20px;
    transform: translate(10px, -60px);
  }
}

/* Seccion 2 Modelos */

.modelos {
  width: 100%;
  display: flex;
}

.img-modelos {
  padding: 10px;
  width: 50%;
}

.img-modelos img {
  max-width: 95%;
}

.info-modelos {
  text-align: justify;
  padding: 10px 40px;
  width: 50%;
}

@media screen and (max-width:1225px) {
  .modelos {
    display: flex;
    flex-direction: column;
  }

  .img-modelos,
  .info-modelos {
    width: 100%;
    padding: 0 15px;
  }
}

/* Seccion 3 Rieles */

.seccion-rieles {
  height: 100%;
  width: auto;
  max-width: 1240px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}

.bg-sr {
  width: 100vw;
  /*position: relative;
  left: 50%;
  right: 50%;
  z-index: 10;
  margin-left: -50vw;
  margin-right: -50vw;*/
  background-color: white;
}

.subtitulo-r {
  padding: 0 10px;
  font-weight: 600;
  font-size: 30px;
}

/* Grid */

.grid-rieles {
  padding: 8rem 7rem 10rem 7rem;
  align-items: center;
  justify-content: center;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  column-gap: 3rem;
  row-gap: 4rem;
  background-color: transparent;
  margin-top: -140px;
}

.box-sr {
  padding: 55px 20px;
  min-width: 2em;
  max-height: 68em;
  background-color: #f8f8f8;
  text-align: center;
  border: 2px solid rgb(228, 228, 228);
  border-radius: 1.5rem;
  /* box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.1),
    -6px -6px 20px #fff; */
  transition: .4s;
  margin-top: 70px;
}

.box-sr:hover {
  padding: 55px 20px;
  background-color: #ececec;
  text-align: center;
  border-radius: 1.5rem;
  /* box-shadow: 18px 18px 25px rgba(0, 0, 0, 0.1),
    -18px -18px 25px #fff; */
}

.inner-grid-r {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.inner-grid-r>img {
  max-height: 270px;
}

@media screen and (max-width: 1227px) {
  .grid-rieles {
    display: flex;
    flex-direction: column;
  }

  .box-sr {
    max-height: 28em;
    margin-top: 60px;
  }
}

/* Seccion 4 Tabla */

.tabla-c {
  display: flex;
  margin-top: -130px;
  z-index: 400;
}

.tabla-capacidades {
  padding: 30px;
}

.caracteristicas-rieles {
  padding-left: 30px 40px;
}

.caracteristicas-rieles li {
  font-size: 18px
}

#tabla-cap table,
th,
td {
  padding: .3em;
  text-align: center;
  font-size: .85em;
  border: solid 1px #F6E100;
}

#tabla-cap th {
  background: #F6E100;
}

.stripe {
  background: #f8ec69;
}

@media screen and (max-width:1227px) {
  .tabla-c {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .caracteristicas-rieles {
    padding: 0 15px;
  }
}

/* Seccion 5 Info gruas*/

.cont-infogruas {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  color: black;
  font-size: 30px;
  text-align: center;
  background: #F6E100;
  padding: 30px 20px;
}

@media screen and (max-width:1227px) {
  .cont-infogruas {
    margin-top: 80px;
    padding: 25px;
    font-size: 25px;
  }
}

/* Seccion 6 Descripciones */

.descripciones {
  width: 100vw;
  display: flex;
  flex-direction: column;
  margin-top: 50px;
  padding: 0 60px;
}

.info-descripciones {
  text-align: justify;
  display: grid;
  grid-template-columns: 1fr 1fr;
}


.img-descripciones img {
  margin-top: -50px;
  max-width: 95%;
}

.img-mod-gruas {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  text-align: center;
  margin-left: -50px;
}

.grua-mod img {
  max-width: 300px;
  transition: 0.3s;
}

.grua-mod img:hover {
  transform: scale(1.2);
}

.thumbnail img {
  transition: 0.3s;
}

.thumbnail img:hover {
  transform: scale(1.2);
}

.gruas-thumbnails {
  display: flex;
  flex-direction: column;
  width: 100vw;
  margin: 0 10%;
}

@media screen and (min-width:1920px) {
  .info-descripciones {
    max-width: 1920px;
  }

  .img-mod-gruas {
    width: 2000px;
  }
}

.thumbs {
  display: flex;
  text-align: center;
}

@media screen and (max-width: 1227px) {
  .descripciones {
    padding: 0 20px;
  }

  .info-descripciones {
    display: flex;
    flex-direction: column;
    padding: 0 25px;
  }

  .img-descripciones img {
    margin-top: 0;
  }

  .img-mod-gruas {
    display: flex;
    flex-direction: column;
    margin-left: 0;
  }

  .gruas-thumbnails{
    margin: 0 20%;
  }
  
  .thumbs {
    display: flex;
    flex-direction: column;
    margin-left: -70px;
  }
}

@media screen and (max-width:700px) {
  .gruas-thumbnails{
    margin: 0 5%;
  }  
}
/* Seccion 7 Slider */

.slider-gruas {
  z-index: 300;
}

.slider-logos {
  margin-top: 400px;
}

.slick-slide {
  margin: 0px 20px;
}

.slick-slide img {
  width: 100%;
}

.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: '';
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

[dir='rtl'] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/* Seccion 8 Call to Action */

.cont-calltoaction {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  color: black;
  font-size: 30px;
  text-align: center;
  background: #909090;
  padding: 30px 20px;
  margin-top: -100px;
  margin-bottom: 80px;
}

.btn-contacto {
  color: black;
  background-color: #F6E100;
  padding: .6em .6em;
  border: none;
  text-decoration: none;
  font-size: 35px;
  font-weight: 600;
  cursor: pointer;
  transition: .4s;
}

.btn-contacto:hover {
  background: #d3c207;
}

@media screen and (max-width:1227px) {
  .cont-calltoaction {
    margin-top: -80px;
    padding: 25px;
  }
}