@charset "UTF-8";
/*!
 * Atomic Web Design v2.1 (https://atomic-webdesign.com/)
 * Developed by: L.D.G. Jose Luis Quintana Trejo - Author.
 * Copyright each time you see this message - Atomic Web Design.
 */

body {
  font-family: 'OpenSans-Regular';
}

.clr_01 {background-color: #49d313;}
.clr_02 {background-color: #fd0da9;}
.clr_03 {background-color: #ead024;}

hr {
  color: white;
  background-color: white;
  margin: 0;
  border: 0;
  border-top: var(--bs-border-width) solid;
  opacity: 0.25;
}

.fixpm {
  margin-left: -15px;
  margin-right: -15px;
}

.content_atomic {
  margin-top: 10rem;
  margin-left: 0;
}

.footer_atomic {
  height: 35px;
}

.pdd_cmdn_01 {
  margin-top: 69px;
}

.menu_side {
  background-color: #1A1A1A;
  width: 70px;
  height: 100%;
  color: white;
}

.scrollable_menuside {
  height: calc(100% - 0.5rem * 2);
}

.scrollable_menuside_ul {
  height:auto;
  padding-bottom: 100px;
}

.ul_menu_side {
  padding-top: 0;
  list-style: none;
}

.ul_menu_side li:first-child {
  padding-top: 1rem;
}

.ul_menu_side li {
  margin-left: -0.420rem;
  padding-top: 3rem;
}

.btn-action {
  background-color: transparent;
  border: none;
}

/* ---- FOR GLOBAL ---- */

.justify {
  text-align: justify;
}

.white {
  color: #ffffff;
}

.blue {
  color: #3E4095;
}

.bigger {
  font-size: 3rem;
}

.bolder {
  font-family: 'Heebo-Black';
  font-weight: bolder;
  font-size: 3.8rem;
}

.svg-container svg {
    width: 12rem;
    height: auto;
    color: #3E4095;
  }
  
  .svg1 {
    animation: animate 3s infinite alternate; /* Adjust animation duration and timing as needed */
  }
  
  @keyframes animate {
    0% {
      transform: scale(1);
    }
    50% {
      transform: scale(1.1);
    }
    100% {
      transform: scale(1);
    }
  }


/* ---- SECTION WELCOME ---- */

.section_welcome {
  padding-bottom: 20rem;
  position: relative;
  overflow: hidden;
}

.background_image {
  background-image: url('../images/imp-13.png');
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}

.container {
  position: relative;
  z-index: 1;
}

.welcome_container {
  margin-top: 35rem;
  padding: 2rem;
  text-align: center;
  background-color: rgba(237, 50, 55, 0.50);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-radius: 4rem;
}

.main_title {
  font-family: 'Heebo-Black';
  font-size: 2.80rem;
  text-align: center;
  text-transform: uppercase;
  color: #ffffff;
  letter-spacing: 1px;
  padding-top: 1rem;
}

.main_subtitle {
  font-family: 'Heebo-Black';
  font-size: 1rem;
  text-transform: uppercase;
  color: #ffffff;
}

.main_img img {
  padding-top: 1rem;
  width: 16rem;
  height: auto;
}

.main_text {
  font-family:'OpenSans-Medium';
  font-size: 1.05rem;
  padding: 1rem;
  color: white;
}

.main_subtext {
  font-family: 'Roboto-Italic';
  font-size: 1.80rem;
  line-height: 2rem;
}


/* ---- SECTION IMPRENTA ---- */

.section_imprenta {
  padding-top: 20rem;
  padding-bottom: 20rem;
}

.main_title_imp {
  font-family: 'Heebo-Black';
  font-size: 2.80rem;
  text-transform: uppercase;
  color: #ED3237;
}

.main_img_imp svg {
  padding-top: 2rem;
  width: 12rem;
  height: auto;
}

.main_text_imp {
  font-family: 'Heebo-Light';
  font-size: 1.05rem;
  padding: 0;
  color: #000000;
}

.main_subtext_imp {
  font-family: 'Roboto-ThinItalic';
  font-size: 1rem;
  color: #ffffff;
  margin-top: 1rem;
  background-color: rgba(237, 50, 55, 1);
  padding: 2rem;
  border-radius: 4rem;
}

/* ---- SECTION PAPELERIA ---- */

.section_papeleria {
  background: #3E4095;
  padding-top: 20rem;
  padding-bottom: 20rem;
}

.main_title_pape {
  font-family: 'Heebo-Black';
  font-size: 2.80rem;
  text-transform: uppercase;
  color: #ffffff;
}

.main_subtitle_pape {
  font-family: 'Heebo-Black';
  font-size: 2rem;
  text-transform: uppercase;
  color: #3E4095;
}

.main_img_pape svg {
  padding-top: 2rem;
  width: 12rem;
  height: auto;
}

.main_text_pape {
  font-family: 'Heebo-Light';
  font-size: 1.05rem;
  padding: 0;
  color: #ffffff;
}

.main_subtext_pape {
  font-family: 'Roboto-ThinItalic';
  font-size: 1rem;
  color: #ffffff;
  margin-top: 1rem;
  background-color: rgba(237, 50, 55, 1);
  padding: 2rem;
  border-radius: 4rem;
}


/* ---- SECTION GYM ---- */

.section_gym {
  background: #ffffff;
  padding-top: 20rem;
  padding-bottom: 20rem;
}

.main_title_gym {
  font-family: 'Heebo-Black';
  font-size: 2.80rem;
  text-transform: uppercase;
  color: #ED3237;
}

.main_subtitle_gym {
  font-family: 'Heebo-Black';
  font-size: 2rem;
  text-transform: uppercase;
  color: #ffffff;
}

.main_img_gym svg {
  width: 12rem;
  height: auto;
}

.main_text_gym {
  font-family: 'Heebo-Light';
  font-size: 1.05rem;
  padding: 0;
  color: black;
}

.main_subtext_gym {
  font-family: 'Roboto-Italic';
  font-size: 1.5rem;
  color: #3E4095;
  margin-top: 5rem;
}

.gym_title {
  font-family: 'Quicksand-Bold';
  font-size: 1.20rem;
  line-height: 2rem;
  color: black;
}

.ubi_title {
  font-family: 'Quicksand-Bold';
  font-size: 1.20rem;
  color: #ffffff;
}

.ubi_address {
  font-family: 'Quicksand-Regular';
  font-size: 1rem;
  color: #ffffff;
  padding-top: 5px;
  padding-bottom: 5px;
}

.ubi_link a {
  text-decoration: underline;
  color: #ffffff;
  font-size: 0.75rem;
}

.ubi_pdd {
  padding-left: 1px;
}

.gym_intro {
  background: #ED3237;
  color: white;
  padding: 1rem 1rem;
}

.gym_horario {
  color: black;
  border-radius: 8rem;
  padding: 1rem 1rem;
}

.gym_ubicaciones {
  background: #ED3237;
  color: white;
  border-radius: 4rem;
  padding: 1rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

/* ---- SECTION FOOTER ---- */

.section_footer {
  padding-top: 12rem;
  padding-bottom: 12rem;
  background-color: #3E4095;
  color: white;
}

.footer_text {
  font-family: 'Quicksand-Medium';
  font-size: 1rem;
}

.footer_subtext {
  font-family: 'Quicksand-Light';
  font-size: 0.80rem;
}

/* ---- SM = SMALL ---- */
@media (min-width: 576px) and (max-width: 767.98px) {

}

/* ---- MD = MEDIUM ---- */
@media (min-width: 768px) and (max-width: 991.98px) {
 
}

/* ---- LG = LARGE ---- */
@media (min-width: 992px) and (max-width: 1199.98px) {
  

}

/* ---- XL = EXTRA LARGE ---- */
@media (min-width: 1200px) and (max-width: 1399.98px) {


}

/* ---- XXL = EXTRA EXTRA LARGE ---- */
@media (min-width: 1400px)  {
 

}