/*:root {
  color-scheme: light dark;
}*/

html,
body {
  position: relative;
  height: 100%;
}

body {
  /*background: #eee;*/
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  font-size: 1em;
  /*color: #000;*/
  margin: 0;
  padding: 0;
}


.texto-header-1 {
  text-shadow: 0px 0px 1px white, 0 0 1em blue, 0 0 1em purple;
  -webkit-background-clip: text;
  color: transparent;  
}

.texto-header-2 {
  text-shadow: 0px 0px 1px white, 0 0 1em blue, 0 0 2em purple;
  -webkit-background-clip: text;
  color: transparent;  
}

.texto-caracteristicas-1 {
  background: linear-gradient(lightskyblue, white);
  -webkit-background-clip: text;
  color: transparent;  
}

.texto-caracteristicas-2 {
  text-shadow: 0px 0px 1px white, 0 0 1em blue, 0 0 2em purple;
  -webkit-background-clip: text;
  color: transparent;  
}

.texto-precios-1 {
  background: linear-gradient(white, lightskyblue);
  -webkit-background-clip: text;
  color: transparent;  
}

.texto-precios-2 {
  text-shadow: 0px 0px 0px white, 0 0 2em blue, 0 0 3em purple;
  -webkit-background-clip: text;
  color: transparent;
}

.texto-testimonios-1 {
  text-shadow: 0px 0px 0px white, 0 0 2em blue, 0 0 3em purple;
  -webkit-background-clip: text;
  color: transparent;
}

.texto-testimonios-2 {
  background: linear-gradient(lightskyblue, white);
  -webkit-background-clip: text;
  color: transparent;  
}

.texto-contacto-1 {
  background: linear-gradient(lightskyblue, lightpink);
  -webkit-background-clip: text;
  color: transparent;
}

.texto-contacto-2 {
  background: linear-gradient(green, black);
  -webkit-background-clip: text;
  color: transparent;  
}

.texto-content-a-1 {
  background: linear-gradient(to right, lightgoldenrodyellow, purple);
  -webkit-background-clip: text;
  color: transparent;
}

.texto-content-a-2 {
  background: linear-gradient(to right, lightskyblue, blue);
  -webkit-background-clip: text;
  color: transparent;  
}

.texto-content-p-1 {
  background: linear-gradient(to right, lightgoldenrodyellow, purple);
  -webkit-background-clip: text;
  color: transparent;
}

.texto-content-p-2 {
  background: linear-gradient(to right, lightgoldenrodyellow, purple);
  -webkit-background-clip: text;
  color: transparent;  
}

a {

  /*color: #188cd2!important;*/
  text-decoration: none;

}

section {

  overflow: hidden;
  position: absolute;
  width: 100%;
  top: 10em;
  bottom: 100%;
  opacity: 0;
  transition: ease-in-out 0.5s;
  /*z-index: 2;*/

}

section.section-show {

  top: 100px;
  left: 0px;
  bottom: auto;
  opacity: 1;
  padding-bottom: 45px;

}

section.container {

  padding: 5em;

}

#header {

  transition: ease-in-out 0.5s;
  position: relative;
  height: 100vh;
  align-items: center;
  /*z-index: 997;*/
  overflow: scroll;

}

#header.header-top {

  height: 9em;
  left: 0;
  top: 0;
  right: 0;
  overflow: scroll;
  

}

#header.header-top .nombre {

  display: none;

}

.navbar .nav-link {

  color: rgba(255, 255, 255, .5);
  border-bottom: .25rem solid transparent;

}

.navbar .nav-link:hover,
.navbar .nav-link:focus {

  border-bottom-color: #aaa;

}

.navbar .active {

  border-bottom-color: #188cd2;

}

@media (min-width: 1024px) {

  body::before {
    background-attachment: fixed;
  }

}

@media (max-width: 768px) {

  section {
    top: 10em;
  }

  section.section-show {
    top: 10em;
  }

}

@media only screen and (max-width: 368px) {

    html,body{
        font-size: 0.9em!important;
    }

}

@media only screen and (max-width: 768px) {

    html,body{
        font-size: 0.9em!important;
    }
    
}

@media only screen and (max-width: 850px) {

    html,body{
        font-size: 0.9em!important;
    }
    
}

.swipper_sidebar {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  /*text-align: center;*/
  font-size: 1em;
  /*background: #fff;*/
  /*display: flex;*/
  justify-content: center;
  align-items: center;

  height: auto;
}

.menu {
  min-width: 4em;
  width: 70%;
  max-width: 10em;

  background-color: #1068EB;
  /*color: #fff;

  z-index: 1000;*/
  height: auto;
}

.menu a{
  color: #fff!important;
}

.content {
  width: 100%;
}

.menu-button {
  position: static;
  top: 0em;
  left: 0em;

  padding: 1em;

  cursor: pointer;

  -webkit-transition: 0.3s;
  transition: 0.3s;

  background-color: #1068EB;

  margin: 1em;
  border-radius: 0.5em;

  width: 4em;
  height: 4em;
}

.menu-button .bar:nth-of-type(1) {
  margin-top: 0em;
}

.menu-button .bar:nth-of-type(3) {
  margin-bottom: 0px;
}

.bar {
  position: relative;
  display: block;

  width: 2em;
  height: 0.3em;

  margin: 0.5em auto;
  background-color: #fff;

  border-radius: 10px;

  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.menu-button:hover .bar:nth-of-type(1) {
  -webkit-transform: translateY(2emem) rotate(-4.5deg);
  -ms-transform: translateY(2em) rotate(-4.5deg);
  transform: translateY(2em) rotate(-4.5deg);
}

.menu-button:hover .bar:nth-of-type(2) {
  opacity: 0.9;
}

.menu-button:hover .bar:nth-of-type(3) {
  -webkit-transform: translateY(-1em) rotate(4.5deg);
  -ms-transform: translateY(-1em) rotate(4.5deg);
  transform: translateY(-1em) rotate(4.5deg);
}

.cross .bar:nth-of-type(1) {
  -webkit-transform: translateY(5em) rotate(-45deg);
  -ms-transform: translateY(5em) rotate(-45deg);
  transform: translateY(5em) rotate(-45deg);
}

.cross .bar:nth-of-type(2) {
  opacity: 0;
}

.cross .bar:nth-of-type(3) {
  -webkit-transform: translateY(-5em) rotate(45deg);
  -ms-transform: translateY(-5) rotate(45deg);
  transform: translateY(-5em) rotate(45deg);
}

.cross:hover .bar:nth-of-type(1) {
  -webkit-transform: translateY(5em) rotate(-40.5deg);
  -ms-transform: translateY(5em) rotate(-40.5deg);
  transform: translateY(5em) rotate(-40.5deg);
}

.cross:hover .bar:nth-of-type(2) {
  opacity: 0.1;
}

.cross:hover .bar:nth-of-type(3) {
  -webkit-transform: translateY(-5em) rotate(40.5deg);
  -ms-transform: translateY(-5em) rotate(40.5deg);
  transform: translateY(-5em) rotate(40.5deg);
}

.autoplay-progress {
  position: absolute;
  right: 16px;
  bottom: 16px;
  z-index: 10;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  color: var(--swiper-theme-color);
}

.autoplay-progress svg {
  --progress: 0;
  position: absolute;
  left: 0;
  top: 0px;
  z-index: 10;
  width: 100%;
  height: 100%;
  stroke-width: 4px;
  stroke: var(--swiper-theme-color);
  fill: none;
  stroke-dashoffset: calc(125.6px * (1 - var(--progress)));
  stroke-dasharray: 125.6;
  transform: rotate(-90deg);
}


/*
@media (prefers-color-scheme: light) {
   :root {
       --body-bg: #FFFFFF;
       --body-color: #000000;
   }
}

@media (prefers-color-scheme: dark) {
   :root {
       --body-bg: #000000;
       --body-color: #FFFFFF;
   }
}

.default-bg{
   background: var(--body-bg);
   color: var(--body-color);
}


footer.default-bg{
   height: 10em;
   font-size: 0.8em;
}


@mixin color-scheme($name) {
  @media (prefers-color-scheme: #{$name}) {
    @content;
  }
}
*/


@media (prefers-color-scheme: dark) {
  .default-bg {
    color: white;
    background-color: black;
    opacity: 0.7;
  }
}

@media (prefers-color-scheme: light) {
  .default-bg {
    color: black;
    background-color: white;
    opacity: 0.7;
  }
}


.card-img .card-img-top { object-fit: cover; height: 100%; }