@charset "utf-8";
:root {
  --color-negro         : #222222FF;
  --color-gris          : #616261FF;
  /*
  --color-celeste-light : #105094;
  --color-celeste       : #105094;
  --color-azul          : #105094FF;
  --color-azulo-scuro   : #082749;
  */
  --color-celeste-light : #5BA0C6;
  --color-celeste       : #51a1ca;
  --color-azul          : #51a1ca;
  --color-azulo-scuro   : #32779C;
  
  
  --color-humo          : #F0F0F0;
  --color-blanco        : #F5F5F5;
  --color-white         : #FFF;
  --fuente-arimo        : "Noto Sans", sans-serif;
  --bs-body-font-size   : 16px;
  --bs-heading-color    : var(--color-azulo-scuro);
}

.color-white {color : var(--color-white) !important;}

.bg-white {background-color : var(--color-white) !important;}

.border-white {border-color : var(--color-white) !important;}

.color-humo {color : var(--color-humo) !important;}

.bg-humo {background-color : var(--color-humo) !important;}

.border-humo {border-color : var(--color-humo) !important;}

.color-blanco {color : var(--color-blanco) !important;}

.bg-blanco {background-color : var(--color-blanco) !important;}

.border-blanco {border-color : var(--color-blanco) !important;}

.color-azul {color : var(--color-azul) !important;}

.bg-azul {background-color : var(--color-azul) !important;}

.border-azul {border-color : var(--color-azul) !important;}

.color-celeste {color : var(--color-celeste) !important;}

.bg-celeste {background-color : var(--color-celeste) !important;}

.border-celeste {border-color : var(--color-celeste) !important;}

.color-celeste-light {color : var(--color-celeste-light) !important;}

.bg-celeste-light {background-color : var(--color-celeste-light) !important;}

.border-celeste-light {border-color : var(--color-celeste-light) !important;}

.color-gris {color : var(--color-gris) !important;}

.bg-gris {background-color : var(--color-gris) !important;}

.border-gris {border-color : var(--color-gris) !important;}

.color-negro {color : var(--color-negro) !important;}

.bg-negro {background-color : var(--color-negro) !important;}

.border-negro {border-color : var(--color-negro) !important;}

.border-top-left {
  border-top  : 1px solid;
  border-left : 1px solid;
}

.border-top-right {
  border-top   : 1px solid;
  border-right : 1px solid;
}

.border-bottom-left {
  border-bottom : 1px solid;
  border-left   : 1px solid;
}

.border-bottom-right {
  border-bottom : 1px solid;
  border-right  : 1px solid;
}

body, html {
  color       : var(--color-negro);
  font-family : var(--fuente-arimo);
}

body {
  background-image    : none;
  background-size     : 100%;
  background-repeat   : repeat-y;
  background-position : top left;
}

textarea {
  resize      : none;
  form-sizing : content;
  min-height  : 1em;
}

/** ajustes solo para ios **/
@supports (-webkit-overflow-scrolling: touch) {
  /*
    Al seleccionar un campo de ingreso de texto, o un select, en browser realiza un zoom. (iphone)
    http://stackoverflow.com/questions/2989263/disable-auto-zoom-in-input-text-tag-safari-on-iphone 
  */
  select, textarea, input {
    font-size : 16px !important;
  }

  /** reseteo apariencia de botones ios **/
  input[type="button"],
  input[type="submit"] {
    -webkit-appearance : none;
  }
}

.videoWrapper {
  position       : relative;
  /* 16:9 */
  padding-bottom : 56.25%;
  /* 4:3 */
  /*padding-bottom : 75%; */
  padding-top    : 0;
  height         : 0;
}

.videoWrapper iframe {
  position : absolute;
  top      : 0;
  left     : 0;
  width    : 100%;
  height   : 100%;
}

/*---- aspectRatios ----*/
.aspectRatio43,
.aspectRatio1,
.aspectRatio169,
.aspectRatio168,
.aspectRatio167,
.aspectRatio166,
.aspectRatio165,
.aspectRatio164 {
  position : relative;
}

:is(
  .aspectRatio43,
   .aspectRatio1,
   .aspectRatio169,
   .aspectRatio168,
   .aspectRatio167,
   .aspectRatio166,
   .aspectRatio165,
   .aspectRatio164):before {
  display : block;
  content : " ";
  width   : 100%;
}

.aspectRatio1:before {
  padding-top : 100%;
}

.aspectRatio43:before {
  padding-top : calc((3 / 4) * 100%);
  /*padding-top : 75%;*/
}

.aspectRatio169:before {
  padding-top : calc((9 / 16) * 100%);
}

.aspectRatio168:before {
  padding-top : calc((8 / 16) * 100%);
}

.aspectRatio167:before {
  padding-top : calc((7 / 16) * 100%);
}

.aspectRatio166:before {
  padding-top : calc((6 / 16) * 100%);
}

.aspectRatio165:before {
  padding-top : calc((5 / 16) * 100%);
}

.aspectRatio164:before {
  padding-top : calc((4 / 16) * 100%);
}

.backCover {
  background-position : center;
  background-size     : cover;
  background-repeat   : no-repeat;
}

:is(input[type=password],input[type=text]).verificado {
  border     : none;
  box-shadow : 0 0 7px green;
}

:is(input[type=password],input[type=text]).incorrecto {
  border        : 1px solid red;
  border-radius : 2px;
  box-shadow    : 0 0 7px red
}

.mid-articulos .list a span.thumbnail {
  background-size     : cover;
  background-position : center;
  background-repeat   : no-repeat;
  display             : block;
}

.bodymask {
  background-color : #FFF;
  display          : none;
  position         : fixed;
  top              : 0;
  left             : 0;
  z-index          : 1000;
  opacity          : .7;
}

.paginacion span,
.paginacion a {
  color            : #FFF;
  text-decoration  : none;
  margin           : 5px;
  background-color : #658582;
  padding          : 5px 10px;
  transition       : .5s;
}

.paginacion a:hover,
.paginacion span {
  background-color : #FFF !important;
  color            : #658582;
  transition       : .5s;
}

.paginacion span {
  border : 1px solid #658582;
}

.owl-nav {
  position : absolute;
  bottom   : 29px;
  left     : 0;
}

.owl-prev, .owl-next {
  background-color : #333 !important;
}

.owl-dots {
  position : absolute;
  bottom   : 0;
}

#cboxTitle {
  position   : absolute;
  top        : -22px;
  left       : 0;
  color      : #EEE;
  background : #FFF;
  padding    : 0 5px 0 5px;
  font-size  : 14px;
}

#cboxTitle .btnGoFullScreen {
  color : #333;
}

:is(textarea,select,input)[data-validation-engine^="validate[required"] {
  /*background-color : #FFE8E8;*/
}

.navbar-toggler {
  border : none;
}

.navbar-toggler:focus {
  box-shadow : none !important;
}

.navbar-toggler[aria-expanded=false] {
  transform  : rotate(0);
  transition : .5s;
}

.navbar-toggler[aria-expanded=true] {
  transform  : rotate(-90deg);
  transition : .5s;
}

.nav-item {
  text-align : center;
}

.nav-item.social a {
  color      : var(--color-negro);
  opacity    : .8;
  transition : .5s;
}

.nav-item.social a:hover {
  opacity    : 1;
  transition : .5s;
}

.navbar-brand img {
  max-width : 10em;
  filter    : grayscale(1) brightness(4);
}

footer .logo-footer {
  filter : grayscale(1) brightness(250%);
}

.hero {
  height     : 40vh;
  min-height : 350px;
  padding    : 0;
  margin     : 0;
}

.mid-portada .hero {
  height              : 87vh;
  /* min-height: 600px; */
  background-image    : url(/imagenes/freepik/architectural-blueprints.jpg);
  background-size     : cover;
  background-position : bottom;
}

.cont-formContacto {
  background-color : #FAFAFAD9 !important;
}

.cont-heroSection {
  margin-top : 75px;
}

.cont-heroSection .heroSection {
  background-position : center;
  background-size     : cover;
  background-repeat   : no-repeat;
  position            : relative;
}

.cont-heroSection .heroSection:before {
  display     : block;
  content     : " ";
  width       : 100%;
  padding-top : calc((3 / 4) * 100%);
}

.mid-html-servicios .contHeroSection .heroSection {
  background-image : url('/imagenes/freepik/2148242953.jpg');
}

.cont-heroSection .heroSection .claim {
  bottom                  : 0;
  left                    : 50%;
  transform               : translate(-50%, 54%);
  padding                 : 0 2em;
  background-color        : #F5F5F5;
  border-top-right-radius : 7px;
  border-top-left-radius  : 7px;
}

.mid-portada .card-body .img-fluid {
  max-width : 152px;
}

/*-------------*/
@media (min-width : 576px) {
  .cont-ico-servicios > .cont-img img {
    top : -2em;
  }

  .mid-portada .hero {
    height : 50vh;
  }

  .mid-portada .hero-content h1 {
    font-size : 1.6em !important;
  }

  .mid-portada .hero-content h2 {
    font-size : 1.3em !important;
  }

  .aspectRatio-sm-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }

  .hero {
    height     : 40vh;
    min-height : 350px;
    padding    : 0;
    margin     : 0;
  }

  .mid-portada .hero {
    /*height     : 100vh;*/
    /*min-height : 600px;*/
  }
}

.backlayer {
  position         : absolute;
  top              : 0;
  left             : 0;
  width            : 100%;
  height           : 100%;
  background-color : rgba(255, 255, 255, 0.5);
}

.hero-content {
  position  : absolute;
  top       : 50%;
  left      : 50%;
  transform : translate(-50%, -13%);
}

@media (min-width : 768px) {
  .cont-ico-servicios > .cont-img img {
    top : 0;
  }

  body {
    /*background-image : url(/imagenes/home_accountant3_slider_pic1-4.png);*/
  }

  .cont-btnMobile {
    display : none !important;
  }

  .cont-btnDesktop {
    display : block !important;
  }

  .bg-md-transparent {
    background-color : transparent !important;
  }

  .mid-portada .hero {
    height : 60vh;
  }

  .mid-portada .hero-content h1 {
    font-size : 1.7em !important;
  }

  .mid-portada .hero-content h2 {
    font-size : 1.4em !important;
  }

  .heroSection:before {
    padding-top : calc((3 / 16) * 100%) !important;
  }

  .aspectRatio-md-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }
}

@media (min-width : 992px) {
  .mid-portada {
    margin-top : 86px !important;
  }

  .mid-portada .hero-content h1 {
    font-size : 1.8em !important;
  }

  .mid-portada .hero-content h2 {
    font-size : 1.5em !important;
  }

  .nav-item {
    text-align : revert;
  }

  .navbar-brand img {
    max-width  : unset;
    max-height : 3em;
  }

  .aspectRatio-lg-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }
}

@media (min-width : 1200px) {
  .mid-portada .hero-content h1 {
    font-size : 1.9em !important;
  }

  .mid-portada .hero-content h2 {
    font-size : 1.6em !important;
  }

  .aspectRatio-xl-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }
}

@media (min-width : 1400px) {
  .mid-portada .hero-content h1 {
    font-size : 2em !important;
  }

  .mid-portada .hero-content h2 {
    font-size : 1.7em !important;
  }

  .aspectRatio-xxl-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }
}

:is(h1,h2,h3,h4,h5) span {
  color       : var(--color-celeste);
  white-space : nowrap;
}

div.separator {
  width         : 80%;
  margin        : 0 auto;
  height        : 1em;
  border-bottom : 1px solid var(--color-celeste-light)
}

#servicios .text-columns {
  column-count         : 3;
  -webkit-column-count : 3;
  -moz-column-count    : 3;
  column-gap           : 25px;
  -webkit-column-gap   : 25px;
  -moz-column-gap      : 25px;
  column-rule          : 2px solid #000;
  -webkit-column-rule  : 2px solid #000;
  -moz-column-rule     : 2px solid #000;
  column-fill          : balance;
  -moz-column-fill     : balance;
}

.gradient-celeste-azul {
  background : rgb(16, 80, 148);
  background : -moz-linear-gradient(0deg, rgba(16, 80, 148, 1) 0%, rgba(40, 139, 190, 1) 82%);
  background : -webkit-linear-gradient(0deg, rgba(16, 80, 148, 1) 0%, rgba(40, 139, 190, 1) 82%);
  background : linear-gradient(0deg, rgba(16, 80, 148, 1) 0%, rgba(40, 139, 190, 1) 82%);
  filter     : progid:DXImageTransform.Microsoft.gradient(startColorstr="#105094", endColorstr="#288bbe", GradientType=1);
}

.gradient-azul-celeste {
  background : rgb(40, 139, 190);
  background : -moz-linear-gradient(319deg, rgba(40, 139, 190, 1) 0%, rgba(16, 80, 148, 1) 82%);
  background : -webkit-linear-gradient(319deg, rgba(40, 139, 190, 1) 0%, rgba(16, 80, 148, 1) 82%);
  background : linear-gradient(319deg, rgba(40, 139, 190, 1) 0%, rgba(16, 80, 148, 1) 82%);
  filter     : progid:DXImageTransform.Microsoft.gradient(startColorstr="#288bbe", endColorstr="#105094", GradientType=1);
}

.gradiente-celeste-light-celeste {
  background : rgb(89, 173, 213);
  background : -moz-linear-gradient(117deg, rgba(89, 173, 213, 1) 0%, rgba(40, 139, 190, 1) 56%);
  background : -webkit-linear-gradient(117deg, rgba(89, 173, 213, 1) 0%, rgba(40, 139, 190, 1) 56%);
  background : linear-gradient(117deg, rgba(89, 173, 213, 1) 0%, rgba(40, 139, 190, 1) 56%);
  filter     : progid:DXImageTransform.Microsoft.gradient(startColorstr="#59add5", endColorstr="#288bbe", GradientType=1);
}

#clientes {
  background-color : #FFFFFFD9;
  padding          : 1em 0;
}

.mid-portada {
  /*backdrop-filter : blur(2px);*/
  margin-top : 75px;
}

.backFixed {
  background-attachment : fixed;
}

@supports (-webkit-overflow-scrolling: touch) {
  .backCover.backFixed {
    background-size       : cover !important;
    background-attachment : unset;
  }
}

.mid-html h2 {
  text-align     : center;
  border-bottom  : 1px solid var(--color-celeste-light);
  padding-bottom : 10px;
}

.mid-html :is(h3,h4) {
  display        : inline-block;
  border-bottom  : 1px solid var(--color-humo);
  padding-right  : 2em;
  padding-bottom : 10px;
  margin-bottom  : 1em;
}

.mid-html h3:before {
  content : "› ";
}

.mid-portada .card {
  border-color : var(--color-humo);
}

.mid-portada .card .card-body a {
  font-weight : bold;
  color       : var(--color-celeste)
}

.mid-portada .card .card-body a::before,
.mid-html h4::before {
  content : "» ";
}

.mid-portada .card .card-header h5 {
  font-size      : initial;
  color          : var(--color-blanco);
  margin-bottom  : 0;
  text-align     : center;
  text-transform : uppercase;
}

.mid-portada .card {border-radius : 0;}

.mid-portada .card .card-header {
  color            : var(--color-blanco);
  background-color : var(--color-celeste);
  border-radius    : 0;
}

.mid-portada .hero-content {
  width : 100%;
}

.mid-portada .hero-content :is(h1, h2) {
  text-transform : uppercase;
}

.mid-portada .hero-content h1 {
  font-size : 1.5em;
}

.mid-portada .hero-content h2 {
  font-size : 1.2em;
}

.mid-portada .hero-content :is(h1, h2) span {
  padding-left     : 1em;
  padding-right    : 1em;
  color            : var(--color-blanco);
  background-color : var(--color-celeste);
}

.text-justify {text-align : justify;}

.btn-primary {
  --bs-btn-color                 : #FFF;
  --bs-btn-bg                    : var(--color-celeste);
  --bs-btn-border-color          : var(--color-celeste);
  --bs-btn-hover-color           : #FFF;
  --bs-btn-hover-bg              : #0B5ED7;
  --bs-btn-hover-border-color    : #0A58CA;
  --bs-btn-focus-shadow-rgb      : 49, 132, 253;
  --bs-btn-active-color          : #FFF;
  --bs-btn-active-bg             : #0A58CA;
  --bs-btn-active-border-color   : #0A53BE;
  --bs-btn-active-shadow         : inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color        : #FFF;
  --bs-btn-disabled-bg           : var(--color-celeste);
  --bs-btn-disabled-border-color : var(--color-celeste);
}

/* Underline Reveal */
.hvr-underline-reveal {
  display           : inline-block;
  vertical-align    : middle;
  -webkit-transform : perspective(1px) translateZ(0);
  transform         : perspective(1px) translateZ(0);
  box-shadow        : 0 0 1px rgba(0, 0, 0, 0);
  position          : relative;
  overflow          : hidden;
}

.hvr-underline-reveal:before {
  content                            : "";
  position                           : absolute;
  z-index                            : -1;
  left                               : 0;
  right                              : 0;
  bottom                             : 0;
  background                         : #2098D1;
  height                             : 4px;
  -webkit-transform                  : translateY(4px);
  transform                          : translateY(4px);
  -webkit-transition-property        : transform;
  transition-property                : transform;
  -webkit-transition-duration        : 0.3s;
  transition-duration                : 0.3s;
  -webkit-transition-timing-function : ease-out;
  transition-timing-function         : ease-out;
}

.hvr-underline-reveal:hover:before, .hvr-underline-reveal:focus:before, .hvr-underline-reveal:active:before {
  -webkit-transform : translateY(0);
  transform         : translateY(0);
}

.ms-view {
  background-color : transparent !important;
}

.ms-slide .ms-slide-bgcont {
  transition : 1s;
  filter     : blur(2px);
  transform  : translate3d(-14px, -16px, 59px);
}

.ms-slide.ms-sl-selected .ms-slide-bgcont {
  transition : 1s;
  filter     : blur(0);
  transform  : translate3d(0, 0, 0);
}

.cont-ico-servicios .cont-img {
  max-width        : 114px;
  margin-left      : auto;
  margin-right     : auto;
  border-radius    : 200px;
  border           : 8px solid whitesmoke;
  overflow         : hidden;
  padding          : 20px;
  background-color : #FFF;
}

.cont-ico-servicios .cont-img img {
  position : relative;
  top      : 0;
  display  : block;
  margin   : 0 auto;
  width    : 100%;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  font-weight : 700;
}

#servicios + .container {
  position : relative;
  bottom   : -3em;
}

.cont-btnDesktop {
  display : none;
}

.cont-btnMobile {
  display : block;
}

div#contDownArrow {
  display         : flex;
  justify-content : center;
  align-items     : center;
}

ul#downArrow {
  position     : relative;
  width        : 40px;
  display      : flex;
  align-items  : center;
  flex-flow    : column;
  padding-left : 0;
}

ul#downArrow li {
  list-style       : none;
  width            : 8px;
  height           : 8px;
  background-color : #288BBE;
  border-radius    : 100%;
  margin-bottom    : 10px;
  animation        : ani 0.8s infinite ease-in-out;
  animation-delay  : calc(0.2s * var(--i));
}

ul#downArrow::before,
ul#downArrow::after {
  position         : absolute;
  content          : '';
  background-color : #288BBE;
  width            : 30px;
  height           : 3px;
  bottom           : 0;
}

ul#downArrow::before {
  right            : 0;
  transform        : rotate(-45deg);
  transform-origin : center right;
}

ul#downArrow::after {
  left             : 0;
  transform        : rotate(45deg);
  transform-origin : center left;
}

@keyframes ani {
  0% {
    opacity   : 0;
    transform : scale(0.5) translateY(-5px);
  }
  50% {
    opacity   : 1;
    transform : scale(1) translateY(20px);
  }
  100% {
    opacity   : 0;
    transform : scale(0.5) translateY(40px);
  }
}
.negative-top {
  position: relative;
  top: -58px;
}