@import url(https://fonts.googleapis.com/css2?family=Staatliches&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap);
﻿/*****************
Custom CSS
*****************/
body {
  border-color: #000000;
  background-color: #000000;
  
}
.ubuntu{
    font-family: Ubuntu,sans-serif;
}
.staatliche{
    font-family: Staatliches,cursive;
}
.small-xl {
  font-size: 90%;
}

.img-faded {
  opacity: .5;
}

.font-weight-medium {
  font-weight: 600;
}

.heading-black {
  font-weight: 800;
}

/* Box shadow */
.btn {
  text-transform: uppercase;
  font-size: 15px;
}

.btn.btn-primary {
  box-shadow: 0 8px 16px rgba(255, 23, 68, 0.3);
  transition: all .2s ease-out;
}

.btn.btn-primary:hover {
  box-shadow: 0 8px 20px rgba(255, 23, 68, 0.35);
}

.btn.btn-primary:active {
  box-shadow: none !important;
}

.btn.btn-secondary {
  box-shadow: 0 8px 16px rgba(255, 255, 255, 0.3);
  transition: all .2s ease-out;
}

.btn.btn-secondary:hover {
  box-shadow: 0 8px 20px rgba(255, 255, 255, 0.35);
}

.btn.btn-secondary:active {
  box-shadow: none !important;
}

.btn.btn-success {
  box-shadow: 0 8px 16px rgba(0, 230, 118, 0.3);
  transition: all .2s ease-out;
}

.btn.btn-success:hover {
  box-shadow: 0 8px 20px rgba(0, 230, 118, 0.35);
}

.btn.btn-success:active {
  box-shadow: none !important;
}

.btn.btn-info {
  box-shadow: 0 8px 16px rgba(0, 229, 255, 0.3);
  transition: all .2s ease-out;
}

.btn.btn-info:hover {
  box-shadow: 0 8px 20px rgba(0, 229, 255, 0.35);
}

.btn.btn-info:active {
  box-shadow: none !important;
}

.btn.btn-warning {
  box-shadow: 0 8px 16px rgba(255, 234, 0, 0.3);
  transition: all .2s ease-out;
}

.btn.btn-warning:hover {
  box-shadow: 0 8px 20px rgba(255, 234, 0, 0.35);
}

.btn.btn-warning:active {
  box-shadow: none !important;
}

.btn.btn-danger {
  box-shadow: 0 8px 16px rgba(255, 23, 68, 0.3);
  transition: all .2s ease-out;
}

.btn.btn-danger:hover {
  box-shadow: 0 8px 20px rgba(255, 23, 68, 0.35);
}

.btn.btn-danger:active {
  box-shadow: none !important;
}

.btn.btn-light {
  box-shadow: 0 8px 16px rgba(236, 239, 241, 0.3);
  transition: all .2s ease-out;
}

.btn.btn-light:hover {
  box-shadow: 0 8px 20px rgba(236, 239, 241, 0.35);
}

.btn.btn-light:active {
  box-shadow: none !important;
}

.btn.btn-dark {
  box-shadow: 0 8px 16px rgba(17, 23, 26, 0.3);
  transition: all .2s ease-out;
}

.btn.btn-dark:hover {
  box-shadow: 0 8px 20px rgba(17, 23, 26, 0.35);
}

.btn.btn-dark:active {
  box-shadow: none !important;
}

/*Navbar*/
.navbar.navbar-transparent {
  opacity: 0.98;
}

@media (max-width: 992px) {
  .navbar.navbar-transparent {
    background-color: rgba(0, 0, 0, 0.4);
  }
}

.navbar .navbar-brand {
  font-size: 1.5rem;
  font-weight: 900;
  color: #e6391b;
  text-transform: uppercase;
}

.navbar .navbar-nav .nav-item {
  margin: 0 .7rem;
}

.navbar .navbar-nav .nav-item .nav-link {
    font-family: Staatliches,cursive;
  font-weight: 600;
}

.section-angle {
  position: relative;
  border-color: inherit;
  background: #000000;
}

.section-angle:before,
.section-angle:after {
  width: 0;
  height: 0;
  position: absolute;
  content: "";
  left: 0;
  border: 0 solid transparent;
  z-index: 3;
}

.section-angle.top-left:before,
.section-angle.top-right:before {
  top: 0;
  border-left-width: 100vw;
}

.section-angle.bottom-left:after,
.section-angle.bottom-right:after {
  bottom: 0;
  border-right-width: 100vw;
}

.section-angle.bottom-left:after {
  border-right-color: inherit;
}

.section-angle.bottom-right:after {
  border-bottom-color: inherit;
}

.section-angle.top-left:before {
  border-top-color: inherit;
}

.section-angle.top-right:before {
  border-left-color: inherit;
}

@media (min-width: 992px) {

  .section-angle.bottom-right:after,
  .section-angle.top-right:before {
    border-bottom-width: 2rem;
  }

  .section-angle.bottom-left:after,
  .section-angle.top-left:before {
    border-top-width: 2rem;
  }
}

@media (max-width: 767.98px) {

  .section-angle.bottom-right:after,
  .section-angle.top-right:before {
    border-bottom-width: 1rem;
  }

  .section-angle.bottom-left:after,
  .section-angle.top-left:before {
    border-top-width: 1rem;
  }
}
@media (min-width: 576px) {
  .vh-sm-100 {
    height: 100vh;
  }
}

@media (min-width: 768px) {
  .vh-md-100 {
    height: 100vh;
  }
}

.bg-hero {
  background-color: #000000;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 800 800'%3E%3Cg %3E%3Ccircle fill='#000000' cx='400' cy='400' r='600'/%3E%3Ccircle fill='#4a000e' cx='400' cy='400' r='500'/%3E%3Ccircle fill='#7d0018' cx='400' cy='400' r='400'/%3E%3Ccircle fill='#b00022' cx='400' cy='400' r='300'/%3E%3Ccircle fill='#e3002c' cx='400' cy='400' r='200'/%3E%3Ccircle fill='#e6391b' cx='400' cy='400' r='100'/%3E%3C/g%3E%3C/svg%3E");
  /* background by SVGBackgrounds.com */
  background-attachment: fixed;
  background-size: cover;
  position: relative;
}

.bg-hero:before {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: block;
  left: 0;
  top: 0;
  content: "";
  background-color: rgba(0, 0, 0, 0.7);
}

.bg-hero .container {
  z-index: 2;
  position: relative;
}

/*features boxes*/
.feature-boxes {
  text-align: center;
}

.feature-boxes .box {
  padding: 3rem;
}

/*features-list */
.features-list {
  list-style: none;
}

.features-list li {
  float: left;
  width: 50%;
  margin-top: 0;
  margin-bottom: 1.75rem;
  font-size: 1.05rem;
  padding-left: 1.75rem;
  font-weight: 500;
}

.features-list li:before {
  position: relative;
  font-family: FontAwesome;
  font-size: 14px;
  content: "\f10c";
  color: #e6391b;
  margin: 0 .75rem 0 0;
}

/*Pricing tables*/
.pricing-table .pricing-list {
  margin-bottom: 3rem;
  margin-top: 2rem;
}

.pricing-table .pricing-list li {
  margin-bottom: 1rem;
  font-size: 1.05rem;
  font-weight: 500;
}

.pricing-table .card {
  transition: all .25s ease-out;
  text-align: center;
}

.pricing-table .card .card-body {
  padding: 5.2rem 1.5rem;
}

.pricing-table .card.active {
  color: white;
  background-color: transparent;
}

.pricing-table .card.active h2,
.pricing-table .card.active h3 {
  color: #ffffff;
}

/**slick slider */
.slick-dots {
  top: -4rem;
}

.slick-dots li button::before {
  font-size: .75rem !important;
  line-height: 3.5rem !important;
}

.slick-dots li button::before,
.slick-dots li.slick-active button:before {
  color: #e6391b !important;
}

.slick-next:before,
.slick-prev:before {
  color: rgba(255, 23, 68, 0.2);
}

.slick-next:hover:before,
.slick-prev:hover:before {
  color: #e6391b;
}

/*footer*/
footer ul>li {
  padding: 0.5rem 0;
}

footer a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-weight: 500;
  transition: all 0.25s ease-out;
}

footer a:hover {
  color: rgba(255, 255, 255, 0.9);
  text-decoration: underline;
}

footer h5 {
  font-size: 1rem;
  text-transform: uppercase;
}

/*social icons*/
.social a {
  width: 45px;
  height: 45px;
  background: transparent;
  display: block;
  text-align: center;
  color: gray-100;
  border-radius: 4px;
  font-size: 18px;
  line-height: 45px;
}

.social a:hover {
  color: #000000;
  transition: all .4s ease-in-out;
}

.social.social-sm a {
  width: 35px;
  height: 35px;
  font-size: 16px;
  line-height: 35px;
}

.social.social-rounded a {
  border-radius: 50%;
}

/*scroll to top */
.scroll-top {
  bottom: 20px;
  font-size: 20px;
  height: 40px;
  position: fixed;
  text-align: center;
  width: 40px;
  z-index: 10;
  cursor: pointer;
  transition: .3s;
  border-radius: 50%;
  line-height: 40px;
  right: -100px;
  color: #000000;
  background-color: #49f0f1;
}

.scroll-top:hover {
  /* background-color: #e6391b; */
  background-color: #49f0f1;
  transition: all .4s ease-in-out;
}

.scroll-top.active {
  right: 20px;
}

/* Icon Boxes */
.icon-box {
  position: relative;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  background-color: #ffffff;
  margin: 1rem;
}

.icon-box.box-primary {
  color: #e6391b;
  background-color: rgba(255, 23, 68, 0.1);
}

.icon-box.box-secondary {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.1);
}

.icon-box.box-success {
  color: #00e676;
  background-color: rgba(0, 230, 118, 0.1);
}

.icon-box.box-info {
  color: #00e5ff;
  background-color: rgba(0, 229, 255, 0.1);
}

.icon-box.box-warning {
  color: #ffea00;
  background-color: rgba(255, 234, 0, 0.1);
}

.icon-box.box-danger {
  color: #e6391b;
  background-color: rgba(255, 23, 68, 0.1);
}

.icon-box.box-light {
  color: #ECEFF1;
  background-color: rgba(236, 239, 241, 0.1);
}

.icon-box.box-dark {
  color: #11171a;
  background-color: rgba(17, 23, 26, 0.1);
}

.icon-box .icon-box-inner {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
  align-items: center;
  padding: 1.5rem;
}

.icon-box .icon-box-inner.small {
  padding: 1.25rem;
}

.icon-box .icon-box-inner.small-xs {
  padding: 1rem;
}

/*all themes colors*/
.bg-black {
  background-color: #000000;
}

.bg-blue {
  background-color: #2979ff;
}

.bg-indigo {
  background-color: #3d5afe;
}

.bg-purple {
  background-color: #d500f9;
}

.bg-pink {
  background-color: #f50057;
}

.bg-red {
  background-color: #e6391b;
}

.bg-orange {
  background-color: #ff9100;
}

.bg-yellow {
  background-color: #ffea00;
}

.bg-green {
  background-color: #00e676;
}

.bg-teal {
  background-color: #1de9b6;
}

.bg-cyan {
  background-color: #00e5ff;
}

/*theme switcher*/
.switcher-wrap {
  position: fixed;
  top: 250px;
  width: 250px;
  background: #263238;
  color: #CFD8DC;
  z-index: 100;
  padding: 20px;
  left: -250px;
  transition: .3s;
}

.switcher-wrap.active {
  left: 0;
}

.switcher-wrap ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.switcher-wrap ul li {
  margin-bottom: .5rem;
}

.switcher-wrap ul li a {
  color: #CFD8DC;
}

.switcher-wrap ul li a:hover {
  color: #e6391b;
}

.switcher-wrap .color-switcher ul li {
  width: 28px;
  height: 28px;
  float: left;
  margin: 3px;
  margin-bottom: 10px;
  cursor: pointer;
  transition: .3s;
}

.switcher-wrap .color-switcher ul li.active {
  border: 3px solid #455A64;
}

.switcher-wrap .switcher-trigger {
  position: absolute;
  left: 100%;
  width: 40px;
  height: 40px;
  background: #263238;
  top: 0;
  font-size: 20px;
  text-align: center;
  color: rgba(255, 23, 68, 0.5);
  cursor: pointer;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 0 2px 2px 0;
}

.switcher-wrap .switcher-trigger:hover {
  color: #e6391b;
}

@media screen and (max-width: 768px) {
  .switcher-wrap {
    display: none;
  }
}
.related-tags {
  border-radius: 5px;
  border: 1px solid #000;
  width: 146px;
  height: 38px;
  margin: 2px;
  padding: 8px 10px;
  font-size: small;
}

.related-logos {
  margin: 10px;
  width: 10rem;
}
.related-logos-container{
  width: 100%;
}

.escritorio {
  width: 100%;
}

.movil {
  width: 100%;
}

.compartirlink {
  text-align: center;
  width: 30px;
  height: 90px;
  position: absolute;
  bottom: 120px;
  right: 40px;
}

.compartirlinkm {
  text-align: center;
  width: 30px;
  height: 90px;
  position: absolute;
  bottom: -320px;
  right: 40px;
}


.gallery__container .gallery-img-01 {
  position: relative;
  max-width: 90%;
}

.gallery__container img {
  border: 0;
  max-width: 92%;
  vertical-align: middle;
  display: inline-block;
}

.gallery__container img.image {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media screen and (min-width: 778px) {
  .paddin_medium_screen {
      padding-bottom: 50rem;
      padding-top: 9rem;
  }
}

@media screen and (max-width: 778px) {
  .paddin_medium_screen {
      padding-bottom: 5rem;
      padding-top: 9rem;
  }
}

.contenido {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  /*  grid-gap: 440px; */
  grid-gap: 0px;
}

#tel {
  width: 100%;
}


@media screen and (max-width: 768px) {
  .escritorio {
      width: 100%;
  }

  .contenido {
      grid-template-columns: 1fr;
      grid-template-columns: 1fr;
      /* color: red; */
  }


  .parallax__with__text__txt .color {
      color: #ffffff;
      /* font-size: 8.2rem; */
      font-size: calc(1rem + 6vw);
      font-weight: 750;
      text-align: left;
  }

  .parallax__with__text__txt .no_color {
      color: #49f0f1;
      font-size: 4.2rem;
      font-weight: 750;
      text-align: left;
  }

  .parallax__with__text__txt .noo_color {
      color: #ff3300;
      font-size: 2rem;
      font-weight: 750;
      text-align: left;
  }

  .parallax__with__text__txt span {
      line-height: 1.15;
  }

.parallax__with__text__txt span:nth-child(1) {
  padding-left: calc(0.1rem + 25vw);
  font-size: calc(1rem + 6vw);
}

.parallax__with__text__txt span:nth-child(2) {
  padding-left: calc(0.1rem + 26vw);
  font-size: calc(1rem + 6vw);
}

.parallax__with__text__txt span:nth-child(3) {
  padding-left: calc(0.1rem + 35vw);
  font-size: calc(1rem + 6vw)
}

/*de las*/
.parallax__with__text__txt span:nth-child(4) {
  padding-left: calc(0.1rem + 10vw);
  font-size: calc(1rem + 6vw);
}

.parallax__with__text__txt span:nth-child(5) {
  padding-left: calc(1rem + 29vw);
  font-size: calc(1rem + 5vw)
}

.parallax__with__text__txt span:nth-child(6) {
  padding-left: calc(0.1rem + 25vw);
  padding-top: -3rem;
  font-size: calc(1rem + 5vw);
}
  .entrenador {
      font-weight: 800;
      color: #ff3300;
      display: inline-block;
      font-size: 2.09rem;
  }

}
@media screen and (max-width: 768px) {
  .tag_visibility {
      display: none;
  }
}

@media screen and (min-width: 768px) {
  .tag_visibility_responsive {
      display: block;
  }
  .parallax__with__text__txt .color {
      color: #ffffff;
      /* font-size: 8.2rem; */
      font-size: calc(1rem + 6vw);
      font-weight: 750;
      text-align: left;
  }

  .parallax__with__text__txt .no_color {
      color: #49f0f1;
      font-size: 4.2rem;
      font-weight: 750;
      text-align: left;
  }

  .parallax__with__text__txt .noo_color {
      color: #ff3300;
      font-size: 2rem;
      font-weight: 750;
      text-align: left;
  }

  .parallax__with__text__txt span {
      line-height: 1.15;
  }

.parallax__with__text__txt span:nth-child(1) {
  padding-left: calc(0.1rem + 25vw);
  font-size: calc(1rem + 6vw);
}

.parallax__with__text__txt span:nth-child(2) {
  padding-left: calc(0.1rem + 26vw);
  font-size: calc(1rem + 6vw);
}

.parallax__with__text__txt span:nth-child(3) {
  padding-left: calc(0.1rem + 35vw);
  font-size: calc(1rem + 6vw)
}

/*de las*/
.parallax__with__text__txt span:nth-child(4) {
  padding-left: calc(0.1rem + 10vw);
  font-size: calc(1rem + 6vw);
}

.parallax__with__text__txt span:nth-child(5) {
  padding-left: calc(1rem + 29vw);
  font-size: calc(1rem + 5vw)
}

.parallax__with__text__txt span:nth-child(6) {
  padding-left: calc(0.1rem + 25vw);
  padding-top: -3rem;
  font-size: calc(1rem + 5vw);
}
}

@media screen and (max-width: 480px) {
  .contenido {
      grid-template-columns: 1fr;
      grid-template-columns: 1fr;
      /* color: red; */
  }

  #tel {
      width: 100%;
  }

}

.entrenador {
  font-weight: 800;
  color: #ff3300;
  display: inline-block;
  font-size: 2.60rem;
}

.social_buttons {
  position: fixed;
  z-index: 7;
  top: 50%;
  left: calc(100% - 3.5rem);
}

@media screen and (min-width: 768px) {
  .tag_visibility_responsive {
      display: none;
  }
}
@media screen and (min-width: 768px) {
  .contact-container {
      text-align: left;
  }
}

@media screen and (max-width: 768px) {
  .contact-container {
      text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .tag_visibility {
      display: none;
  }
}

@media screen and (min-width: 768px) {
  .tag_visibility_responsive {
      display: none;
  }
}
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover{
    color: #ff3300;
}
.smart-scroll{
    position:fixed;
    top:0;
    z-index:1020;
    width:100%;
    transition:.3s
    ease-out
}
.smart-scroll.scrolling{background-color:rgba(0,0,0,.9)}
.tag_container_responsive{
  justify-content:center;
  width: 100%;
  margin-left: 0px;
  margin-right: 0px;
}
.full_width {
  width: 100%;
}
.mx_none{
  margin-left: 0px;
  margin-right: 0px;
}
.brand_container {
  background-color: #ff3300;
  color:#000
}
.justify_between {
  justify-content:space-between;
}
.justify_center {
  justify-content:center;
}
.background-home {
    background-image: url("../img/home.png");
    width: 100%;
    background-position: center; 
    background-repeat: no-repeat;
    background-size: cover; 
    position: relative;
}
.btn__send__mail {
    cursor: pointer;
    border: 1px solid #e6391b;;
    background-color: transparent;
    height: 45px;
    width: 100%;
    color: #ffffff;
    font-size: 1.0em;
    box-shadow: 0 6px 6px rgba(0, 0, 0, 0.6);
    text-align: center;
}
.btn__send__mail:hover{
  transition: 0.5;
  background-color: #ff3300;
  color:black
}
.section__form__social__form__title {
  color: #ff3300;
  font-family: Staatliches,cursive;
  font-size: 20px;
}
.section__form__social__form form {
    color: #ffffff;
  font-family: Ubuntu,sans-serif;
}
.section__form__social__form {
    padding-right: 2.5rem;
  padding-top: 7rem;
  max-width: 30rem;
  padding-left: 2.5rem;
  padding-bottom: 1.5rem;
}
.image-parallax {
    background-image: url("../img/letras.webp");
    width: 100%;
    background-position: center; 
    background-repeat: no-repeat;
    background-size: cover; 
    position: relative;
}
.red-title {
  color: #ff3300;
  font-family: Staatliches,cursive;
}
.white-body {
  color: #ffffff;
}
.our-service {
    width: 49%;
    margin: auto;
}
.how-works{
    font-weight: 800;
    color: #49f0f1;
    display: inline-block;
    font-size: 3.60rem;
    font-family: Staatliches,cursive;
}
.title-works{
    font-weight: 800;
    color: #ff3300;
    display: inline-block;
    font-size: 2.60rem;
    font-family: Staatliches,cursive;
}
.parallax-img{
  background-color: #000;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../img/letras_t.png");
}
.parallax-container{
    font-family: Staatliches,cursive;
    background-attachment: fixed;
    position: relative;
    left: 0;
    top: 50%;
    width: 100%;
    color: #000;
    overflow: hidden;
}
.text-parallax-1 {
  padding-left: calc(0.1rem + 42vw);
  font-size: calc(1rem + 5vw);
  color: #ffffff;
}
.text-parallax-2 {
  padding-left: calc(0.1rem + 42vw);
  font-size: calc(1rem + 3vw);
  color:#49f0f1;
  
}
.text-parallax-3 {
  padding-left: calc(0.1rem + 51vw);
  font-size: calc(1rem + 2vw);
  color:#ff3300;
}
.text-parallax-4 {
  padding-left: calc(0.1rem + 18vw);
  font-size: calc(1rem + 5vw);
   color: #ffffff;
}
.text-parallax-5 {
  padding-left: calc(0.1rem + 57vw);
  font-size: calc(1rem + 2vw);
  color:#ff3300;
}
.text-parallax-6 {
  padding-left: calc(0.1rem + 27vw);
  font-size: calc(1rem + 4.5vw);
   color:#49f0f1;
}

.footer{
    width: 100%;
    font-family: Staatliches,cursive;
    color: #ffffff;
}