@font-face {
    font-family: Roboto-Condensed;
    src: url('../vendor/fontroboto/Roboto-Condensed.woff');
}

@font-face {
    font-family: Roboto-Light;
    src: url('../vendor/fontroboto/Roboto-Light.woff');
}

@font-face {
    font-family: Comix-Loud;
    src: url('../vendor/fontcomic/Comix_Loud.woff');
}

@font-face {
    font-family: Avenir-Regular;
    src: url('../vendor/fontavenir/AvenirNextCondensed-Regular-08.woff');
}
@font-face {
    font-family: Din-Bold;
    src: url('../vendor/fontdin/DIN_Condensed_Bold.woff');
}

/*----*/
body {
    font-family: Roboto-Light;
    letter-spacing: .0625em;
    font-size: 0.8rem;
}
/*SECCIONES*/
.about-section{
	position: relative;
    width: 100%;
    height: auto;
    min-height: 35rem;
    padding: 0rem 0;
    background-image: url(../img/bg-about.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
}

.about-section .titu{
	padding-top: 3rem;
}
.about-section .item_cont{
	background-color: #fff;
    flex: 0 0 calc(50% - 120px) !important;
    margin: 0px 60px !important;
    border-radius: 10px;
    margin: 20px auto 12rem auto !important;
}
.about-section .item_titu{
	margin-bottom: 1rem!important;
}
.about-section .item_text{
	padding: 0px 25px;
	margin-bottom: 3rem;
}
.about-section .ico{
	margin: 15px 0px;
}
.about-section p {
    margin-bottom: 1rem;
}

.about-section{
	position: relative;
    width: 100%;
    height: auto;
    min-height: 35rem;
    padding: 0rem 0;
    background-image: url(../img/bg-about.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
}

.servicio-section .titu{
	padding-top: 3rem;
	padding-bottom: 2rem;
}
.servicio-section .item_cont{
	background-color: #fff;
    flex: 0 0 calc(50% - 140px) !important;
    margin: 0px 60px !important;
    border-radius: 10px;
    margin: 20px auto 70px auto !important;
}
.servicio-section .item_titu{
	margin-bottom: 1rem!important;
}
.servicio-section .item_text{
	padding: 0px 35px;
	margin-bottom: 1rem;
	text-align: left;
}
.servicio-section .ico{
	margin: -45px 0px 15px 0px;
}
.servicio-section p {
    margin-bottom: 1rem;
}
.servicio-section{
	position: relative;
    width: 100%;
    height: auto;
    min-height: 35rem;
    padding: 0rem 0;
    background-image: url(../img/bg-servicio.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
}

.servicio-section .titu{
    padding-top: 3rem;
    padding-bottom: 2rem;
}
.servicio-section .item_cont{
    background-color: #fff;
    flex: 0 0 calc(50% - 110px) !important;
    margin: 0px 60px !important;
    border-radius: 10px;
    margin: 20px auto 70px auto !important;
}

.servicio-section .item_cont ul{
    text-align: left;
    margin-left: 10px;
}
.servicio-section .item_cont.item_final{
    margin-bottom: 8rem !important;
}
.contacto-section .item_titu{
    margin-bottom: 1rem!important;
}
.contacto-section .item_text{
    padding: 0px 35px;
    margin-bottom: 1rem;
    text-align: left;
}
.contacto-section .ico{
    margin: -45px 0px 15px 0px;
}
.contacto-section p {
    margin-bottom: 1rem;
}
.contacto-section{
    position: relative;
    width: 100%;
    height: auto;
    min-height: 35rem;
    padding: 0rem 0;
    background-color: #23396f;
    background-attachment: scroll;
    background-size: cover;
}

.redes-section {
    padding: 1rem 0 0;
}

.flecha_seccion{
    z-index: 50;
    margin: -80px;
    margin-bottom: 30px;
}
.flecha_seccion_about{
    z-index: 50;
    margin: -80px;
    margin-bottom: 30px;
}
.flecha_seccion_servicio{
    z-index: 50;
    margin: -80px;
    margin-bottom: 30px;
}
/*TEXTOS*/
.masthead h1 {
	font-family: "Din-Bold";
	font-size: 3rem;
	letter-spacing: .1rem;
	line-height: 2.8rem;
	-webkit-text-fill-color: #23396f;

}
.masthead h2 {
	font-family: "Din-Bold";
	font-size: 2.2rem;
	letter-spacing: .1rem;
	line-height: 2.2rem;
}
.masthead .cont_izq {
	padding: 0px 5rem 0px 0px;
}
.masthead .cont_der{
	padding: 0px 0px 0px 5rem;
}
.masthead .text_alin_der{
	text-align: right;
}
.masthead .bot_alin_der{
	margin-left: calc(100% - 170px);
}

.about-section  h1 {
	font-family: "Din-Bold";
	font-size: 3rem;
	letter-spacing: .1rem;
	line-height: 2.8rem;
	-webkit-text-fill-color: #23396f;


    position: relative;
    width: 100%;
    height: 60px;
    /* min-height: 35rem; */
    /* padding: 15rem 0; */
    background-image: url(../img/back_text_about.png);
    background-position-y: -20px;
    padding-top: 15px;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;

}
.about-section  h2 {
	font-family: "Din-Bold";
	font-size: 2.2rem;
	letter-spacing: .1rem;
	line-height: 2.2rem;
}

.servicio-section  h1 {
	font-family: "Din-Bold";
	font-size: 3rem;
	letter-spacing: .1rem;
	line-height: 2.8rem;
	-webkit-text-fill-color: #fff;

    background-image: url(../img/back_text_servicio.png);
    background-position-y: -20px;
    padding-top: 15px;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;

}
.servicio-section  h2 {
	font-family: "Din-Bold";
	font-size: 1.9rem;
	letter-spacing: .1rem;
	line-height: 2.2rem;
    padding: 0px 35px;
}

.contacto-section .titu{
    padding-top: 5rem;
    padding-bottom: 2rem;
}
.contacto-section  h1 {
    font-family: "Din-Bold";
    font-size: 3rem;
    letter-spacing: .1rem;
    line-height: 2.8rem;
    -webkit-text-fill-color: #fff;

    background-image: url(../img/back_text_contacto.png);
    background-position-y: -20px;
    padding-top: 15px;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;

}
.contacto-section  h2 {
    font-family: "Din-Bold";
    font-size: 1.9rem;
    letter-spacing: .1rem;
    line-height: 2.2rem;
    padding: 0px 35px;
}

.trabaje-section .titu{
    padding-top: 5rem;
    padding-bottom: 2rem;
}
.trabaje-section  h1 {
    font-family: "Din-Bold";
    font-size: 3rem;
    letter-spacing: .1rem;
    line-height: 2.8rem;
    -webkit-text-fill-color: #23396f;

    background-image: url(../img/back_text_about.png);
    background-position-y: -20px;
    padding-top: 15px;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;

}
.trabaje-section  h2 {
    font-family: "Din-Bold";
    font-size: 2.2rem;
    letter-spacing: .1rem;
    line-height: 2.2rem;
}

.text-whiteblue{
	color: #1ba5de !important;
}
.text-whiteblue2{
	color: #77cbf3 !important;
	-webkit-text-fill-color: #77cbf3 !important;
}
.text-blue{
	color: #23396f !important;
}
.text-plomo{
	color: #797979 !important;
}
.text-plomo-50{
	color: #4e4e4e !important;
}

/*NAV BAR*/
#mainNav.navbar-shrink {
    background: linear-gradient(to top,rgba(255,255,255,0.8),rgba(255,255,2555,0.95)40%,#fff 85%) !important;
    height: 95px;
}
#mainNav.navbar-shrink .nav-link.active {
    border-bottom: .25rem solid #1ba5de;
}

.navbar-nav.nav-icons{
    margin-left: 20px;
}
.navbar-nav li a{
    font-family: "Avenir-Regular";
    font-size: 14px;
    color: #23396f !important;
    padding: 0.2rem 0.7rem !important;
    text-align: right;
}
.navbar.navbar-shrink{
    display: inherit;
}
.navbar.navbar-shrink .navbar-nav li a{
    font-size: 14px;
    color: #23396f;
}
.img-logo{
	padding-top: 5px;
}

.logo-small{
    display: none;
}
.navbar-shrink .logo-big{
    display: none;
}
.navbar-shrink .logo-small{
    display: block;
}

.navbar-nav.nav-icons li a {
    padding: 0.2rem 0.25rem !important;
}

#mainNav .navbar-toggler {
    font-size: 100%;
    padding: .75rem;
    color: #243970 !important;
    border: 1px solid #243970;
    font-family: "Avenir-Regular";
}
.navbar-toggler {
    border-radius: 0rem;
}
.fas {
    margin-left: 5px;
}

/*FORM*/
.input-space {
    margin-top:20px;
}
.form-div input.error,
.form-div-1 textarea.error {
    border-bottom-color: #ffe97b !important;
    border-left-color: #ffe97b !important;
    border-right-color: #ffe97b !important;
    border-top-color: #ffe97b !important;
}

.form-div-1 label,
.form-div label {
    color: #bbe7f9;
    font-size: 15px;
    margin-bottom: 0;
    font-family: Avenir-Regular;
    margin-bottom: 5px;
}
.form-div-1 label.error, .form-div label.error {
    color: #ffe97b;
}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 20px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #215a91;
    background-image: none;
    border: 1px solid #215a91;
    border-radius: 0px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.contacto-section .form-control::placeholder {
  color: #23396f;
}

.trabaje-section .form-div input.error,
.trabaje-section .form-div-1 textarea.error {
    border-bottom-color: #1ba5de !important;
    border-left-color: #1ba5de !important;
    border-right-color: #1ba5de !important;
    border-top-color: #1ba5de !important;
}

.trabaje-section .form-div-1 label,
.trabaje-section .form-div label {
    color: #23396f;
    font-size: 15px;
    margin-bottom: 0;
    font-family: Avenir-Regular;
    margin-bottom: 5px;
    width: 100%;
}
.trabaje-section .form-div-1 label.error, .trabaje-section .form-div label.error {
    color: #1ba5de;
}

.trabaje-section .form-control {
    display: block;
    width: 100%;
    padding: 20px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #f5f5f5;
    background-image: none;
    border: 1px solid #f5f5f5;
    border-radius: 0px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.0);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.0);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}


/*.form-control::-webkit-input-placeholder { 
  color: #bbe7f9;
}

.form-control::-ms-input-placeholder {
  color: #bbe7f9;
}*/

.trabaje-section .form-control::placeholder {
  color: #c9c9c9;
}

.trabaje-section input[type="file"] {
    height: 45px;
    padding-top: 9px;
    display: none;
}

.trabaje-section .upload-btn-wrapper {
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.trabaje-section .btn {
  /*border: 2px solid gray;
  color: gray;*/
  background-color: white;
  padding: 8px 20px;
  border-radius: 8px;
  font-size: 20px;
  font-weight: bold;
}

.trabaje-section .upload-btn-wrapper input[type=file] {
  font-size: 100px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}

/*BOTONS*/

.btn {
    font-family: 'Din-Bold';
    font-size: 130%;
    padding: 0.9rem 2rem 0.55rem 2rem;
}
.btn-primary {
    background-color: #fff;
    color: #23396f;
}
.btn-primary.white {
    background-color: #fff;
    color:#ea7dc9;
}

.btn-primary:hover{background-color:#1ba5de}
.btn-primary:focus{background-color:#1ba5de;color:#fff}
.btn-primary:active{background-color:#1ba5de!important;color:#fff!important}

.btn.white {
    -webkit-box-shadow: 0 .1875rem .1875rem 0 rgba(0,0,0,.1)!important;
    box-shadow: 0 .1875rem .1875rem 0 rgba(0,0,0,.1)!important;
    padding: 1.25rem 5rem 0.8rem 5rem;
    font-family: 'Comix-Loud';
    font-size: 80%;
    text-transform: uppercase;
    letter-spacing: .15rem;
    border: 0;
}
.btn-primary.white:hover{background-color:#f9d9f3}
.btn-primary.white:focus{background-color:#fff;color:#ea7dc9}
.btn-primary.white:active{background-color:#fff!important;color:#ea7dc9!important}

.servicio-section .item_cont .btn-primary{
    background-color: #77cbf3;
    color: #fff;
    margin-bottom: 2rem;
}
.contacto-section .contact-btn input{
    background-color: #77cbf3;
    color: #23396f;
    font-size: 25px;
    margin-top: 3rem;
    margin-bottom: 9rem;
    width: 100%;
    border-radius: .5rem;
    padding: 0.7rem 2rem 0.15rem 2rem;
}
.contacto-section .contact-btn input:hover {
    color: #fff;
}

.trabaje-section .contact-btn input{
    background-color: #77cbf3;
    color: #23396f;
    font-size: 25px;
    margin-top: 3rem;
    margin-bottom: 2rem;
    width: 100%;
    border-radius: .5rem;
    padding: 0.7rem 2rem 0.15rem 2rem;
}
.trabaje-section .contact-btn input:hover {
    color: #fff;
}

/*MARGENES*/
.mt-4, .mx-4 {
    margin-top: 200px!important;
}
.mb_it_1{
	margin: 20px auto 12rem auto !important;
}
/*CORTES*/
.masthead:before {
    /*background: #fff none repeat scroll 0 0;*/
    background: linear-gradient(to top,rgba(255,255,255,0.1),rgba(255,255,255,1)40%,#fff 100%) !important;
    content: "";
    height: 160px;
    left: 0;
    position: absolute;
    top: 92%;
    -webkit-transform: skewY(176deg);
    transform: skewY(176deg);
    width: 100%;
    z-index: 1;
}
.about-section:before {
    /*background: #fff none repeat scroll 0 0;*/
    background: linear-gradient(to top,rgba(27,165,222,0.1),rgba(27,165,222,1)40%,#1ba5de 100%) !important;
    content: "";
    height: 170px;
    left: 0;
    position: absolute;
    top: 92%;
    -webkit-transform: skewY(176deg);
    transform: skewY(176deg);
    width: 100%;
    z-index: 1;
}
.servicio-section:before {
    /*background: #fff none repeat scroll 0 0;*/
    background: linear-gradient(to top,rgba(35,57,111,0.1),rgba(35,57,111,1)40%,#23396f 100%) !important;
    content: "";
    height: 200px;
    left: 0;
    position: absolute;
    top: 93%;
    -webkit-transform: skewY(176deg);
    transform: skewY(4deg);
    width: 100%;
    z-index: 1;
    margin-top: 70px;
}
.contacto-section:before {
    /*background: #fff none repeat scroll 0 0;*/
    background: linear-gradient(to top,rgba(255,255,255,0.1),rgba(255,255,255,1)40%,#fff 100%) !important;
    content: "";
    height: 160px;
    left: 0;
    position: absolute;
    top: 95%;
    -webkit-transform: skewY(176deg);
    transform: skewY(176deg);
    width: 100%;
    z-index: 1;
}
/*LEVELS*/
.about-section .contenido{
	z-index: 2;
}
.servicio-section .contenido{
	z-index: 3;
}
.contacto-section .contenido{
    z-index: 3;
}
.trabaje-section .contenido{
    z-index: 4;
}

.at-share-btn-elements{
   text-align: center; 
}

.mensaje_mail{
  padding-left: 0px;
  text-align: left;
  margin-bottom: 5px;
}
.mensaje_mail span{
  padding-left: 0px;
  color: #bbe7f9;
  font-size: 15px;
  text-align: left;
  font-family: 'Avenir-Regular';
}
.mensaje_mail_work{
  padding-left: 0px;
  text-align: left;
  margin-bottom: 5px;
}
.mensaje_mail_work span{
  padding-left: 0px;
  color: #1ba5de;
  font-size: 15px;
  text-align: left;
  font-family: 'Avenir-Regular';
}

#contact-form .form-control {
    color: #bbe7f9;
}
#contact-form input:focus {
  color: #555;
}
#contact-form textarea:focus {
  color: #555;
}

@media (min-width: 992px){
	#mainNav .nav-link {
	    -webkit-transition: none;
	    transition: none;
	    padding: 2rem 1.5rem;
	    color: rgba(35,57,111,1);
	}
}

@media (max-width: 992px){
    
    .navbar-nav li a {
        text-align: center;
    }
    .navbar-nav.nav-icons {
        margin-left: 0px;
        padding-bottom: 20px;
    }
    .navbar-shrink .logo-big{
        display: none !important;
    }
    .navbar-shrink .logo-small{
        display: block !important;
    }
    .logo-big{
        display: none !important;
    }
    .logo-small{
        display: block !important;
    }

    .masthead {
        padding: 4rem 0px 6rem 0px;
    }

    .masthead h1{
        margin-top: 20px !important;
        font-size: 2.4rem;
        line-height: 2.2rem;
    }
    .masthead h2{
        margin-top: 75px;
    }

    #mainNav.navbar-shrink {
        background: linear-gradient(to top,rgba(255,255,255,1),rgba(255,255,2555,1)100%,#fff 100%) !important;
        height: auto;s
    }
    #mainNav.navbar-shrink .nav-link.active {
        border-bottom: .2rem solid #1ba5de;
        width: 90px;
        margin-left: auto;
        margin-right: auto;
        color: rgba(26, 165, 222, 1) !important;
    }

    .servicio-section .item_cont.item_final.item_final_cero {
        margin-bottom: 5rem !important;
    }
    /*CHAT BOT*/
    #hubspot-messages-iframe-contasiner .shadow.active {
        width: 0px;
        height: 0px;
    }

}

@media (max-width: 470px){
    .masthead {
            background-position: -1500px top;
        }
    }
@media (max-width: 692px){
    .masthead .d-flex {
        display: -ms-flexbox!important;
        display: inherit !important;
    }
    .masthead .cont_der {
        padding: 0px 5rem 0px 0px;
    }
    .masthead .text_alin_der {
        text-align: left;
    }
    .masthead h1 {
        margin-top: 90px !important;
    }
    .masthead h2 {
        margin-top: 25px;
    }
    .masthead .bot_alin_der {
        margin-left: 0px;
    }

    .about-section .item_cont {
        flex: 0 0 calc(100%) !important;
        margin: 0px 60px !important;
        border-radius: 10px;
        margin: 20px auto 1rem auto !important;
    }
    .about-section .item_cont.item_final {
        margin-bottom: 150px !important;
    }

    .servicio-section .item_cont {
        flex: 0 0 calc(100% - 30px) !important;
    }
    
    .trabaje-section h1 {
        font-size: 2.6rem;
    }
    /*.masthead {
        background-position: -1500px top;
    }*/
    .masthead h1 {
        font-size: 3.5rem;
        line-height: 3.2rem;
    }
    .masthead .text-plomo-50 {
    color: rgba(0,0,0,1)!important;
}
    .masthead:before {
        top: 97%;
    }
    .about-section:before {
        top: 97%;
    }
    .servicio-section:before {
        top: 97%;
    }
    .contacto-section:before {
        top: 97%;
    }

}
@media (max-width: 992px) and (min-width: 690px) {
  .masthead {
      padding: 9rem 0px 6rem 0px !important;
  }
}
@media (max-width: 1090px){
    .servicio-section .item_cont {
        flex: 0 0 calc(50% - 30px);
    }
}