h1 {
  color: #c4d676 !important;
}

.justificado {
  text-align: justify;
  text-justify: inter-word;
}


header {
  background-image: url(../img/headerbg.jpg);
  background-size: cover;
  background-position: center;
  min-height: 900px;
}
header h1 {
  position:absolute;
  top: 400px;
  left: 100px;
  font-size: 100px;
}
.navbar {
  padding: 0px 30px;
  background-color: black !important;
  transition: all 1s;
}
.sidenav-title {
  padding-left:10px;
}

.logo {
  position: relative;
  width: 50px;
  margin: 10px 0;
}

.logo-texto {

  min-height: 900px;
}

.img-logo-texto {
  margin-left: 80px;
  width: 450px;
}

.logo-mobile {
  width:200px;
  margin-top: 30px;
  margin-left: 20px;
}



.parallax-container {
  height: 300px;
}
#diseño-web {
  background-color: #212121;
}
 #diseño-web h1 {
  margin-top: 0px;
  position: relative;
  top: -30px
}

.collection .collection-item.avatar {
  min-height: 60px;
}



/* scrollmagic classes */
.navbar.whitebg {
  background-color: white !important;
}

.blacktext {
  color: black;
 }
 

 /* servicios */

#servicios {
  background-image: url(../img/servicios-bg.jpg);
  background-size: cover;
  background-position: center;

  
  /* min-height: 900px; */
}
.img-servicios-1, img-servicios-2 {
  position:relative;
}

 /* tabs */
 .tab-img {
   float: left;
   margin-right: 20px;
   width: 200px;
   height: auto;
 }
 .carousel.carousel-slider {
   height:250px !important;
 }

 /* video */

.video-info {
  background-image: url(../img/video_bg.png);
  background-size: cover;
  background-position: center;
}

 #video .video-text {
  margin-top: 0px;
  position: relative;
  top: -40px;
  left: -50px;
}
 
/* portfolio images */


/* lightbox */
.lightbox {
  z-index: 2;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: none;
}
.lightbox[data-state="visible"] {
  display: block;
}

.lightbox-container {
  position: absolute;
  left: 15px;
  right: 15px;
  top: 75px;
  bottom: 15px;
  background-color: #292929;
}
.close-lightbox {
  z-index: 3;
  position: absolute;
  color: #c4d676;
  left: 90%;
  top: -15px;
  cursor: pointer;

}

.lightbox-video {
  display: block;
  position: absolute;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
  width: 100%;

 
}



.img-video {
  position: relative;
}
.title-portfolio {
  position: absolute;
  top: -90px;
  right: 30px;
  z-index: 1;
}
.row-portfolio-video, .col-portfolio-video {
  margin: 0px !important;
  padding: 0px !important;
  position: relative;
}
.portfolio-container {
  min-height: 170px;
}

.fullscreen {
  position: absolute;
  left: 10px;
  top: 10px;
}

/* Quienes somos */


#about .foto {

  background-image: url(../img/placeholder.png);
  background-size: cover;
  background-position: center;
  min-height: 500px;

}


/* RRSS */
.RRSS {
  height:50px;
}
.facebook {
  background-color: #3B5998;
}
.whatsapp {
  background-color: #26a69a;
}
.instagram {
  height: 50px;

  background: #f09433; 
  background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);   
  background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
  background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
}
.instagram img {
  height: 40px;
  margin: 0 auto;
}



/* media querys */
@media screen and (min-width: 600px) and (max-width: 992px) {
  header{
    min-height: 600px;
  }
  header h1 {
    position:absolute;
    top: 210px;
    left: 40px;
    font-size: 50px;
  }

  .logo-texto {
    min-height: 650px;
  }
  
  .img-logo-texto {
    margin-left: 30px;
    width: 300px;
  }
  .logo {
    position: relative;
    width: 45px;
    margin-left: 600%;
  }
  .logo-about{
    height: 300px;
  }
  .portfolio-container {
    min-height: 170px;
  }
  .reproductor-video {
    position: relative;
  }


}
@media screen and (max-width: 600px) {
  header{
    min-height: 250px;
  }
  .brand-logo {
    font-size: 10px;
  }
  .logo-texto {
    min-height: 250px;
  }
  
  .img-logo-texto {
    margin-left: 30px;
    width: 200px;
  }
  .logo {
    position: relative;
    width: 36px;
    left: 130px;
  }

  .parallax-container {
    height: 100px;
  }
  header h1 {
    position:absolute;
    top: 80px;
    left: 20px;
    font-size: 20px;
  }

  img-servicios-1, .img-servicios-2 {
    left:0px !important;
  }
  .tab-img {
    width: 120px;
  }
  .carousel.carousel-slider {
    height:350px !important;
  }

  #video h1 {
    margin-top: 0px;
    position: relative;
    top: -40px;
    left: 0px;
  }
  .col-title-portfolio {
    background-color: #fff;
  }
  .title-portfolio {
    position: relative;
    top: 0px;
    left: 0px;
    margin-top: 0px;
  }

  .video-text {
    left: 0px !important;
  }

  .logo-about{
    height: 260px;
    margin-bottom: 30px;
  }

  .brand {
    margin: 15px !important;
  }
    
}