/*----------------------------------------------------------------
[ Cuerpo de la presentacion ]*/
.hero-area {
      position:relative;
      padding-top: 80px;
      padding-bottom: 80px;
    }

    #presentacion.hero-area {
      height:calc(100vh - 190px);
      padding-top: 0px;
      padding-bottom: 0px;
    }


/*----------------------------------------------------------------
[ Estilo de imagen de presentacion ]*/
.bg-image {
      position:absolute;
      left:0;
      right:0;
      top:0;
      bottom:0;
      background-position:bottom;
      background-size:contain;
      background-repeat: no-repeat;
    }

    .bg-image.bg-parallax {
      background-attachment:fixed;
    }

    .bg-image.overlay:after {
      content:"";
      position:absolute;
      left:0;
      right:0;
      top:0;
      bottom:0;
      background-image: -webkit-gradient(linear, left top, left bottom, from(#374050), to(#798696));
      background-image: linear-gradient(to bottom, #374050 0%, #798696 100%);
      opacity: 0.1;
    }



/*----------------------------------------------------------------
[ Texto presentacion ]*/
.texto-presentacion {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
}


/*----------------------------------------------------------------
[ Estilo de caja de texto, services]*/
.card-body {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 1.25rem;
  height: 200px;
}

.padding-card-row{
  padding-bottom: 2%;
}


/*----------------------------------------------------------------
[ estilo de ul de navbar ]*/
  ul li {
    display: -webkit-inline-box;
     padding-right: 3%;
   }

   ul i{
    padding-top: 12px;
  }

/*-------------------------------------------------------------------
[ Boton de contacto ]*/
.btn-primary-fixin:hover {
        color: #fff;
        background-color: #5f6062;
        border-color: #a2a3a5;
    }

    .btn-primary-fixin{
        color: #fff;
        background-color: #663c88;
        border-color: #8e67af;
    }

/*------------------------------------------------------------------
[ Responsive ]*/

/*   // Hasta smartphones de 480px */
@media (max-width: 480px) {
  .prueba{
    background-color: yellow !important;
  }
}
 
/*   // de Smartphones a Tablets */
@media (min-width: 480px) and (max-width: 768px) { 
  .prueba{
    background-color: red !important;
  }
}
 
/*   // de Tablets a pantallas de desktops */
@media (min-width: 768px) and (max-width: 980px) { 

} 
/*   // Pantallas anchas (desktops) */
@media (min-width: 980px){ 

}