#intro {
  background: url("../img/panorama-3094696_1920.jpg") no-repeat center center;
  background-size: cover;
}

#top{
  background: url("../img/panorama-3094696_1920.jpg") no-repeat center center;
  background-size: cover;
}

.top-nav-collapse {
  background-color: #3949ab !important;
}

.navbar:not(.top-nav-collapse) {
  background: transparent !important;
}

@media (max-width: 768px) {
  .navbar:not(.top-nav-collapse) {
    background: #3949ab !important;
  }
}

#intro .h6 {
  font-weight: 300;
  line-height: 1.7;
}

.hm-gradient .full-bg-img {
  background: rgba(42, 27, 161, 0.7);
  background: linear-gradient(45deg, rgba(42, 27, 161, 0.7), rgba(29, 210, 177, 0.7) 100%);
}

@media (max-width: 450px) {
  .margins {
    margin-right: 1rem;
    margin-left: 1rem;
  }
}

#pricing .lead {
  opacity: 0.7;
}

#pricing .card-image {
  background: url("../img/architecture.jpg") no-repeat center center;
}

#pricing ul li {
  font-size: 1.1em;
}

/* carrusel */

.content-all{
  width: 150px;
  margin: auto;
  perspective: 1000px;
  position: relative;
  margin-top: 50px;
}

.content-carrousel{
  width: 100%;
  position: absolute;
  animation: rotar 30s infinite linear;
  transform-style: preserve-3d;
}

.content-carrousel:hover{
  animation-play-state: paused;
  cursor: pointer;
}


.content-carrousel figure{
  width: 100%;
  height: 120px;
  overflow: hidden;
  position: absolute;
  box-shadow: 0px 0px 20px 0px black;
  transition: all 300ms;
  
}

.content-carrousel figure:hover{
  box-shadow: 0px 0px 0px 0px black;
  transition: all 300ms;
}

.content-carrousel figure:nth-child(1){transform: rotateY(0deg) translateZ(400px);}
.content-carrousel figure:nth-child(2){transform: rotateY(36deg) translateZ(400px);}
.content-carrousel figure:nth-child(3){transform: rotateY(72deg) translateZ(400px);}
.content-carrousel figure:nth-child(4){transform: rotateY(108deg) translateZ(400px);}
.content-carrousel figure:nth-child(5){transform: rotateY(144deg) translateZ(400px);}
.content-carrousel figure:nth-child(6){transform: rotateY(180deg) translateZ(400px);}
.content-carrousel figure:nth-child(7){transform: rotateY(216deg) translateZ(400px);}
.content-carrousel figure:nth-child(8){transform: rotateY(252deg) translateZ(400px);}
.content-carrousel figure:nth-child(9){transform: rotateY(288deg) translateZ(400px);}
.content-carrousel figure:nth-child(10){transform: rotateY(324deg) translateZ(400px);}
.content-carrousel figure:nth-child(11){transform: rotateY(0deg) translateZ(200px);}
.content-carrousel figure:nth-child(12){transform: rotateY(120deg) translateZ(200px);}
.content-carrousel figure:nth-child(13){transform: rotateY(240deg) translateZ(200px);}


.content-carrousel img{
  width: 100%;
  transition: all 300ms;
}

.content-carrousel img:hover{
  transform: scale(1.2);
  transition: all 300ms;
}


@keyframes rotar{
  from{
      transform: rotateY(0deg);
  }to{
      transform: rotateY(360deg);
  }
}