@import url('https://fonts.googleapis.com/css?family=Overpass:300,400,600,700&display=swap');

.container-imagen {
  position: relative;
  width: 100%;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay-imagen {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: rgba(0, 0, 0, 0.7);
}

.container-imagen:hover .overlay-imagen {
  opacity: 1;
}

.text-imagen {
  font-family: 'Overpass', sans-serif;
  color: white;
  font-size: 14px;
  position: absolute;
  top: 50%;
  left: 10%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-5%, -50%);
  text-align: justify;
}

.espaciado-imagen{
  padding-right: 0px !important;
  padding-left: 0px !important;
}

.imagen{
  background-image: url("ideas/pi_ville_99.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 85%;
  width: 100%;
  height: 100vh;
}

.imagen1{
  background-image: url("ideas/hotel_yu.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 60%;
  width: 100%;
  height: 100vh;
}

.imagen2{
  background-image: url("ideas/steelcraft.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 65%;  
  width: 100%;
  height: 100vh;
}

.imagen3{
  background-image: url(ideas/schmatz.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 65%;  
  width: 100%;
  height: 100vh;
}

.imagen4{
  background-image: url(ideas/workplace_bulgaria.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 65%;  
  width: 100%;
  height: 100vh;
}

.imagen5{
  background-image: url(ideas/kinzo_hostel.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 65%;  
  width: 100%;
  height: 100vh;
}

.imagen6{
  background-image: url(ideas/casa_construida_con_contenedores2.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 65%;  
  width: 100%;
  height: 100vh;
}

.imagen7{
  background-image: url(ideas/contenedor_utilizado_para_almacenamiento2.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 65%;  
  width: 100%;
  height: 100vh;
}

.imagen8{
  background-image: url(ideas/proceso_de_construccion_de_una_casa_con_contenedores2.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position-x: 65%;  
  width: 100%;
  height: 100vh;
}

.enlace{
color: #fff;
transition: .5s ease-in-out;
outline: none;
text-decoration: none;
}

.enlace:hover{
color: #d05e29;
transition: .5s ease-in-out;
outline: none;
text-decoration: none;
}


.bs-example {
  margin: 20px;
}

.modal-content iframe {
  margin: 0 auto;
  display: block;
}


.carousel-showmanymoveone .carousel-control {
  width: 4%;
  background-image: none;
}
.carousel-showmanymoveone .carousel-control.left {
  margin-left: 15px;
}
.carousel-showmanymoveone .carousel-control.right {
  margin-right: 15px;
}
.carousel-showmanymoveone .cloneditem-1,
.carousel-showmanymoveone .cloneditem-2,
.carousel-showmanymoveone .cloneditem-3 {
  display: none;
}
@media all and (min-width: 768px) {
  .carousel-showmanymoveone .carousel-inner > .active.left,
  .carousel-showmanymoveone .carousel-inner > .prev {
    left: -50%;
  }
  .carousel-showmanymoveone .carousel-inner > .active.right,
  .carousel-showmanymoveone .carousel-inner > .next {
    left: 50%;
  }
  .carousel-showmanymoveone .carousel-inner > .left,
  .carousel-showmanymoveone .carousel-inner > .prev.right,
  .carousel-showmanymoveone .carousel-inner > .active {
    left: 0;
  }
  .carousel-showmanymoveone .carousel-inner .cloneditem-1 {
    display: block;
  }
}
@media all and (min-width: 768px) and (transform-3d), all and (min-width: 768px) and (-webkit-transform-3d) {
  .carousel-showmanymoveone .carousel-inner > .item.active.right,
  .carousel-showmanymoveone .carousel-inner > .item.next {
    -webkit-transform: translate3d(50%, 0, 0);
            transform: translate3d(50%, 0, 0);
    left: 0;
  }
  .carousel-showmanymoveone .carousel-inner > .item.active.left,
  .carousel-showmanymoveone .carousel-inner > .item.prev {
    -webkit-transform: translate3d(-50%, 0, 0);
            transform: translate3d(-50%, 0, 0);
    left: 0;
  }
  .carousel-showmanymoveone .carousel-inner > .item.left,
  .carousel-showmanymoveone .carousel-inner > .item.prev.right,
  .carousel-showmanymoveone .carousel-inner > .item.active {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    left: 0;
  }
}
@media all and (min-width: 992px) {
  .carousel-showmanymoveone .carousel-inner > .active.left,
  .carousel-showmanymoveone .carousel-inner > .prev {
    left: -25%;
  }
  .carousel-showmanymoveone .carousel-inner > .active.right,
  .carousel-showmanymoveone .carousel-inner > .next {
    left: 25%;
  }
  .carousel-showmanymoveone .carousel-inner > .left,
  .carousel-showmanymoveone .carousel-inner > .prev.right,
  .carousel-showmanymoveone .carousel-inner > .active {
    left: 0;
  }
  .carousel-showmanymoveone .carousel-inner .cloneditem-2,
  .carousel-showmanymoveone .carousel-inner .cloneditem-3 {
    display: block;
  }
}
@media all and (min-width: 992px) and (transform-3d), all and (min-width: 992px) and (-webkit-transform-3d) {
  .carousel-showmanymoveone .carousel-inner > .item.active.right,
  .carousel-showmanymoveone .carousel-inner > .item.next {
    -webkit-transform: translate3d(25%, 0, 0);
            transform: translate3d(25%, 0, 0);
    left: 0;
  }
  .carousel-showmanymoveone .carousel-inner > .item.active.left,
  .carousel-showmanymoveone .carousel-inner > .item.prev {
    -webkit-transform: translate3d(-25%, 0, 0);
            transform: translate3d(-25%, 0, 0);
    left: 0;
  }
  .carousel-showmanymoveone .carousel-inner > .item.left,
  .carousel-showmanymoveone .carousel-inner > .item.prev.right,
  .carousel-showmanymoveone .carousel-inner > .item.active {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    left: 0;
  }
}
.container {
  margin-bottom: 50px;
}
body {
  font-family: 'Overpass', sans-serif;
  color: #E54A41;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: right top;
  background-size: 20%;
}
p {
  font-family: 'Overpass', sans-serif;
  color: #333;
  margin-bottom: 2em;
}
h2 {
  margin: 2em 0 1em;
}
.logo {
  margin: 20px auto;
  height: 100px;
}
@media only screen and (min-width: 768px) {
  .logo {
    margin: 28px;
    float: left;
  }
}
.title {
  padding: 28px;
  display: table-cell;
  position: relative;
  vertical-align: middle;
  text-align: center;
}