/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
  color: var(--bs-secondary);
  font-size: 1em;
  line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
  background: var(--bs-blue);
  color: var(--bs-white);
  text-shadow: none;
}

::selection {
  background: var(--bs-blue);
  color: var(--bs-white);
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio, canvas, iframe, img, svg, video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
  resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

:root {
  --azul-primario: #4f87fb;
  --azul-secundario: #00366d;
  --azul-terciario: #f8faff;
}

html {
  font-family: 'Poppins', sans-serif;
}

body {
  background-color: var(--bs-white);
  color: var(--bs-secondary) !important;
}

/* globales **/

a {
  text-decoration: none;
}

a:hover {
  color: var(--bs-secondary) !important;
}

.btn:hover {
  color: white!important;
}


li {
  list-style: none;
}

h1, h2, h3 {
  color: var(--bs-primary) !important;
  font-weight: bold;
}

.integralis-logo {
  width: 180px;
  height: auto;
  transition: all .4s ease;
}

@media (max-width: 768px) {
  .integralis-logo {
    width: 100px;
    height: auto;
  }

  .carousel-control-prev, .carousel-control-next {
    display: none !important;
  }
}

.integralis-logo-fixed {
  width: 80px;
  height: auto;
  transition: all .4s ease;
}

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

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

.t-shadow {
  text-shadow: 1px 5px 5px rgba(0, 0, 0, 1);
}

canvas {
  max-width: 100% !important;
}

.skew {
  -ms-transform: skewY(8deg);
  transform: skewY(8deg);
}

.skew-inv {
  -ms-transform: skewY(-8deg);
  transform: skewY(-8deg);
}

.shadow-custom {
  box-shadow: 0 5px 27px rgba(79, 135, 251, .39) !important;
}

.shadow-custom-2 {
  box-shadow: 0 0 3rem rgba(0, 0, 0, .75) !important;
}

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

.text-blue-2 {
  color: var(--azul-primario) !important;
}

.bg-azul-primario {
  background: var(--azul-primario);
}

.bg-azul-terciario {
  background: var(--azul-terciario);
}

.bg-azul-pre-footer {
  background: var(--azul-terciario) url(img/footer-back.png) no-repeat top center;
  background-size: contain;
}

.border-blue {
  border-bottom: 1px solid var(--azul-secundario) !important;
  width: fit-content !important;
}

.rounded-xxl {
  border-radius: 200px !important;
}

.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link {
  color: var(--azul-primario) !important;
}

.navbar-light .navbar-nav .nav-link {
  color: var(--azul-secundario) !important;
}

.bg-light {
  transition: all .4s ease;
  background-color: #ffffff !important;
}

.bg-none {
  transition: all .4s ease;
  background-color: none !important;
}

.mt-fix-nav {
  margin-top: 200px;
}

@media (max-width: 768px) {
  .mt-fix-nav {
    margin-top: 0px;
  }
}

.movil-h {
  height: auto;
}

@media (max-width: 768px) {
  .movil-h {
    height: 75vh;
  }
}

.navbar-light .navbar-toggler-icon {
  background-image: url(img/ham-menu.svg) !important;
}

.navbar-light .navbar-toggler {
  color: var(--azul-primario) !important;
  border-color: var(--azul-primario) !important;
  background: #ffffff !important;
}

input[type="text"],input[type="email"],input[type="tel"], textarea{
width:100%;
}


.card {
  border: none !important;
  transition: all .3s ease;
}

.card:hover {
  transform: scale(1.05);
}

.same-size {
  min-height: 430px;
}

/* hero */

.hero-area {
  height: fit-content;
}

@media (max-width: 768px) {
  .hero-area {
    height: auto;
  }
}

.hero-back-side {
  background: url(https://integraliscolombiasas.com/wp-content/uploads/2021/09/hero-bg.jpg) no-repeat top right;
  background-size: contain;
}

.page-back-side {
  background: url(https://integraliscolombiasas.com/wp-content/uploads/2021/09/page-bg.jpg) no-repeat top right;
  background-size: contain;
  min-height: 300px;
}

.arrow-btn {
  width: fit-content;
  padding: 12px 10px;
  text-align: center;
  color: var(--azul-primario);
  background: #ffffff !important;
  border: 1px solid var(--azul-primario);
  cursor: pointer;
}

/* secciones */

.carousel-indicators {
  margin-bottom: 0 !important;
  margin-top: 2rem !important;
}

.btn-call-container {
  width: 120px;
  height: 120px;
  text-align: center;
  border-radius: 120px;
  border: 1px solid var(--bs-dark);
  cursor: pointer;
}

.btn-call-action {
  width: 100px;
  height: 100px;
  text-align: center;
  border-radius: 100px;
  color: white;
}

a.bread-link, #tsh_breadcrumbs>li.item-cat>a {
  color: var(--azul-primario) !important;
}

#tsh_breadcrumbs .separator {
  font-size: 20px;
  color: rgba(0, 0, 0, .75) !important;
  font-weight: 100;
}

#tsh_breadcrumbs {
  text-transform: uppercase;
  overflow: hidden;
  text-align: left;
  list-style: none;
  margin: 11px 0;
}

/* @media (max-width: 768px) {
  #tsh_breadcrumbs {
    text-align: center;
  }
} */

#tsh_breadcrumbs li {
  margin-right: 14px;
  display: inline-block;
  vertical-align: middle;
  color: rgba(0, 0, 0, .75) !important;
}

/*//Whastsapp btn//*/

.wa_floating_button {
  left: 20px;
  position: fixed !important;
  width: 60px !important;
  height: 60px !important;
  bottom: 20px !important;
  background-color: #25D366 !important;
  color: #ffffff !important;
  border-radius: 50px !important;
  text-align: center !important;
  box-shadow: 0 8px 25px -5px rgba(45, 62, 79, .3) !important;
  z-index: 9999999 !important;
}

.wa_floating_button img {
  width: 30px;
  margin-top: 14px;
}

a.wa_floating_button:hover+div.label-container {
  visibility: visible !important;
  opacity: 1;
}

a.floating_button+div.label-container {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.5s ease;
}

.hidden {
  opacity: 0;
}

.fade-in {
  -webkit-animation: fade-in .5s cubic-bezier(.39, .575, .565, 1.000) both;
  animation: fade-in .5s cubic-bezier(.39, .575, .565, 1.000) both
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

@keyframes fade-in {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

.fade-out {
  -webkit-animation: fade-out .5s cubic-bezier(.39, .575, .565, 1.000) both;
  animation: fade-out .5s cubic-bezier(.39, .575, .565, 1.000) both
}

@-webkit-keyframes fade-out {
  0% {
    opacity: 1
  }

  100% {
    opacity: 0
  }
}

@keyframes fade-out {
  0% {
    opacity: 1
  }

  100% {
    opacity: 0
  }
}