/*!
 * Start Bootstrap - Modern Business (https://startbootstrap.com/template-overviews/modern-business)
 * Copyright 2013-2019 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-logomodern-business-nav/blob/master/LICENSE)
 */
body {
  padding-top: 56px;
}


/* MENU */
.navbar-custom {
  background: rgb(11, 83, 96);

text-transform: uppercase;
font-weight: bold;

}

/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
    color: rgba(255,255,255,.8);

}
/* change the link color */
.navbar-custom .navbar-nav .nav-link {
    color: rgba(240, 216, 1, 1);
}

/* change the color of active or hovered links */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
    color: #545454;
}




   /* VIDEO */


   .text   {
     color: rgb(255, 255, 255);
     font-size: 80px;
       font-family: 'Teko', sans-serif;

   }

   .subti   {
     color: rgb(255, 255, 255);
     font-size: 40px;
       /* font-family: 'Teko', sans-serif; */

   }

   header {
     position: relative;
     background-color: black;
     height: 80vh;
     min-height: 25rem;
     width: 100%;
     overflow: hidden;
     /* animation: <name> <duration> <timing-function> <delay>
              <iteration-count> <direction> <fill-mode> <play-state> */
animation: changeColor 5s linear 0.5s 4 normal forwards running;
   }

   header video {
     position: absolute;
     top: 50%;
     left: 50%;
     min-width: 100%;
     min-height: 100%;
     width: auto;
     height: auto;
     z-index: 0;
     -ms-transform: translateX(-50%) translateY(-50%);
     -moz-transform: translateX(-50%) translateY(-50%);
     -webkit-transform: translateX(-50%) translateY(-50%);
     transform: translateX(-50%) translateY(-50%);
   }

   header .container {
     position: relative;
     z-index: 2;
   }

   header .overlay {
     position: absolute;
     top: 0;
     left: 0;
     height: 100%;
     width: 100%;
     background-color: black;
     opacity: 0.5;
     z-index: 1;
   }

   @media (pointer: coarse) and (hover: none) {
     header {
       background: url('https://images.unsplash.com/photo-1474631245212-32dc3c8310c6?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1981&q=80/1600x900') black no-repeat center center scroll;
     }
     header video {
       display: none;
     }
   }


/* QUIENES SOMOS */



#quienes  {
font-size: 15px;
/* padding-top: 40px;
padding-bottom: 40px; */
background: rgb(34, 152, 184);
color: rgb(121, 121, 121);



}




#quienes h4   {
  color: rgb(235, 255, 0);
  font-size: 60px;
    font-family: 'Teko', sans-serif;
    padding-left: 100px;
    padding-right: 40px;
      padding-top: 120px;


}

#quienes p   {
  color: rgb(214, 214, 214);
  text-align: justify;
  padding-left: 100px;
  padding-right: 40px;
  font-size: 20px;
  padding-top: 50px;
}



/* BANNER 1 */

.image-bg-fixed-height-trabajamos{

    background: url(../images/full9.jpg);
    background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
height: 650px;


}

.txlanding {
    font-size: 70px;
    font-weight: 700;
    color: #ffffff;
padding-top: 20%;
    vertical-align: bottom;
    text-align: center;
    font-family: 'Teko', sans-serif;

}



#servicios  {

padding-bottom: 30px;
background: rgb(55, 55, 55);
color: rgb(121, 121, 121);

    padding-left: 100px;
    padding-right: 100px;
    padding-bottom: 160px;
    padding-top: 160px;



}


#servicios p   {
  color: rgb(159, 159, 159);

  font-size: 17px;

}





#servicios h2   {
  color: rgb(245, 223, 29);
  font-size: 60px;
    font-family: 'Teko', sans-serif;
    }



#servicios h4  {
  color: rgb(235, 157, 93);
  font-size: 26px;

    color:rgb(255, 255, 255);
    padding-top: 10px;


}


.identidad  {
  color: rgb(235, 157, 93);
  font-size: 22px;
  text-align: left;
  background:rgb(125, 134, 62);
  border-radius: 0px 30px 30px 0px;
  margin-left: -15px
  }


.webs {
  color: rgb(235, 157, 93);
  font-size: 22px;
  text-align: left;
  background-color: rgb(29, 153, 170);
  border-radius: 0px 30px 30px 0px;
  margin-left: -15px
}


.grafico {
  color: rgb(235, 157, 93);
  font-size: 22px;
  text-align: left;
  background-color: rgb(228, 104, 14);
  border-radius: 0px 50px 50px 0px;
  margin-left: -15px
}


.google {
  color: rgb(235, 157, 93);
  font-size: 22px;
  text-align: left;
  background-color: rgb(48, 111, 107);
  border-radius: 35px 0px 0px 35px;
  margin-right: -15px
}

.redes {
  color: rgb(235, 157, 93);
  font-size: 22px;
  text-align: left;
  background-color: rgb(161, 21, 151);
  border-radius: 35px 0px 0px 35px;
  margin-right: -15px
}


.estrategia {
  color: rgb(235, 157, 93);
  font-size: 22px;
  text-align: left;
  background-color: rgb(250, 1, 1);
  border-radius: 35px 0px 0px 35px;
  margin-right: -15px
}






/* Galleria */


#galeria {

  background: rgb(255, 255, 255);


  }



.gallery-block{
  background: rgb(119, 106, 122);
  padding-bottom: 60px;
  padding-top: 60px;
  padding-left: 200px;
  padding-right: 200px
}

.gallery-block .heading{
    margin-bottom: 50px;
    text-align: center;
}

.gallery-block .heading h2{
  color: rgb(245, 223, 29);
  font-size: 60px;
    font-family: 'Teko', sans-serif;
}


.gallery-block.compact-gallery .item{
  overflow: hidden;
  margin-bottom: 0;
  background: black;
  opacity: 1;
}

.gallery-block.compact-gallery .item .image{
  transition: 0.8s ease;
}

.gallery-block.compact-gallery .item .info{
  position: relative;
    display: inline-block;
}

.gallery-block.compact-gallery .item .description{
  display: grid;
    position: absolute;
    bottom: 0;
    left: 0;
    color: #fff;
    padding: 10px;
    font-size: 17px;
    line-height: 18px;
    width: 100%;
    padding-top: 15px;
    padding-bottom: 15px;
    opacity: 1;
    color: #fff;
    transition: 0.8s ease;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
    background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.6));
}

.gallery-block.compact-gallery .item .description .description-heading{
  font-size: 2em;
  font-weight: bold;
}

.gallery-block.compact-gallery .item .description .description-body{
  font-size: 0.8em;
  margin-top: 10px;
  font-weight: 300;
}

@media (min-width: 576px) {

  .gallery-block.compact-gallery .item .description {
    opacity: 0;
  }

  .gallery-block.compact-gallery .item a:hover .description {
    opacity: 1;
  }

  .gallery-block .zoom-on-hover:hover .image {
    transform: scale(1.3);
    opacity: 0.7;
  }
}




/*------------------------
    Portfolio Section
--------------------------*/



/* BANNER 2 */

.image-bg-fixed-height-convert {

    background: url(../images/full8.jpg);
    background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

    height: 650px;
}












/* BANNER 3 */



#contact {
  padding-top: 30px;
  padding-bottom: 30px;
  background: rgb(35, 63, 110);


  }



  #contact p {
  color: rgb(5, 134, 190)

    }


      #contact H2 {

      color: rgb(235, 255, 0);
      font-size: 60px;
        font-family: 'Teko', sans-serif;

          padding-top: 50px;

        }






    .controls {
      padding-top: 30px;
      border-radius: 10px;
  }



      .label{
    color: rgb(252, 253, 254);
    text-transform: uppercase;

    }








.fondo {
  padding-top: 30px;
  padding-bottom: 30px;
  background: rgb(231, 190, 17);
  font-size: 15px;

  border-radius: 15px;


  }





  .fondo h3 {

    background: rgb(231, 190, 17);
    margin-top: 50px;
    border-radius: 10px;
    font-size: 50px;
    color: rgb(255, 255, 255);
    font-family: 'Teko', sans-serif;


    }



/* BANNER 3 */

.image-bg-fixed-height-estrategias {
  background: url(../images/full7.jpg);
  background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;

  height: 650px;
}














/* BANNER 3 */

.image-bg-fixed-height-banner2 {
  background: url(../images/full6.jpg);
  background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;

  height: 650px;
}






.footer {
  padding-top:20px;
  padding-bottom:20px;
  background-color: #e7b633;
  color: #fff;
}

.copyright {
  background-color: #18b3cf;
  font-size: 25px
}


.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-float{
	margin-top:16px;
}
--------------------------------------*/





/***Modal***/

.modal-header{
  background-color: #0c74d4;
  color: #ffffff;
  text-align: center;
}



.modal-content{
  background-color: #3e3e3e;
  text-align: center;
}


.modal-title{


  font-size: 25px;
  font-family: sans-serif;
  color: rgb(255, 255, 255);

}


.modal-body {
  color: #f9f9f9;
  background-color: rgb(103, 103, 103);
  font-size: 14px;
padding-top: 10px;



}

.modaltext {

  font-size: 16px;
  font-weight: 200;



}



.modal-footer{
  background-color: #5e5e5e;
	text-align: center;
	color: #000;
	font-size: 18px;
  padding:10px;

}


.featurette-divider {
    margin: 1px 0;
}

.featurette {
    overflow: hidden;

}

.featurette-image.pull-left {
    margin-right: 10px;
    margin-left: 10px;
}

.featurette-image.pull-right {
    margin-left: 5px;
}

.featurette-heading {
    font-size: 15px;
    text-align: left;
}

.featurette-heading2 {
    font-size: 14px;
    text-align: justify;
    line-height: 16px;
}





.textos {
  color: #000;
font-size: 13px;
text-align: center;
line-height: normal;
}


.textos2 {
  color: #ffffff;
font-size: 15px;
text-align: justify;
padding-top: 10px;


}




.claims {


  text-align: center;
  color: #FFF;
  font-size: 18px;
  font-weight: 400;



}






.zoom {

  transition: transform .2s; /* Animation */

  margin: 0 auto;
}

.zoom:hover {
  transform: scale(1.2);
   /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}
