/*--------------------------------------------------------------

# General

--------------------------------------------------------------*/

@font-face {

    font-family: 'Akira Expanded' , sans-serif;

    src:url('assets/fonts/Akira Super Bold.otf'),

        url('assets/fonts/Akira Outline.otf');

}



body {

   font-family: 'Akira Expanded', sans-serif;

  color: #444444;

}



a {

  text-decoration: none;

}





h1, h2, h3, h4, h5, h6,li {

font-family: 'Akira Expanded', sans-serif;

}



/*--------------------------------------------------------------

# Preloader

--------------------------------------------------------------*/

#preloader {

  position: fixed;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 9999;

  overflow: hidden;

  background: #00993e;

}



#preloader:before {

  content: "";

  position: fixed;

  top: calc(50% - 30px);

  left: calc(50% - 30px);

  border: 6px solid #000;

  border-top-color: #fff;

  border-bottom-color: #fff;

  border-radius: 50%;

  width: 60px;

  height: 60px;

  -webkit-animation: animate-preloader 1s linear infinite;

  animation: animate-preloader 1s linear infinite;

}



@-webkit-keyframes animate-preloader {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}



@keyframes animate-preloader {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}

/*--------------------------------------------------------------

# Back to top button

--------------------------------------------------------------*/

.back-to-top {

  position: fixed;

  visibility: hidden;

  opacity: 0;

  right: 15px;

  bottom: 15px;

  z-index: 996;

  background: #fff;

  width: 40px;

  height: 40px;

  border-radius: 50px;

  transition: all 0.4s;

}

.back-to-top i {

  font-size: 24px;

  color: #000;

  line-height: 0;

}

.back-to-top:hover {

  background: #00993e;

  color: #00993e;

}

.back-to-top.active {

  visibility: visible;

  opacity: 1;

}



/*--------------------------------------------------------------

# Header

--------------------------------------------------------------*/

#header {

  background:#00993e;

  transition: all 0.5s;

  z-index: 997;

}

#header.header-scrolled, #header.header-inner-pages {

  background: #00993e;

}

#header .logo {

  font-size: 30px;

  margin: 0;

  padding: 0;

  line-height: 1;

  font-weight: 500;

  letter-spacing: 2px;

  text-transform: uppercase;

}

#header .logo a {

  color: #fff;

}

#header .logo img {

  max-height: 50px;

}



/*--------------------------------------------------------------

# Menu

--------------------------------------------------------------*/

.navbar {

  padding: 0;

}

.navbar ul {

  margin: 0;

  padding: 0;

  display: flex;

  list-style: none;

  align-items: center;

}

.navbar li {

  position: relative;

  padding: 10px 5px 10px 5px;

}

.navbar a, .navbar a:focus {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 10px 10px 10px 15px;

  font-size: 15px;

  font-weight: 600;

  color: #fff;

  white-space: nowrap;

  transition: 0.3s;

  border-radius: 10px;

}

.navbar a i, .navbar a:focus i {

  font-size: 12px;

  line-height: 0;

  margin-left: 5px;

}

.navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a {

  color: #fff;

  background:#009957;



}

.navbar .getstarted, .navbar .getstarted:focus {

  padding: 8px 20px;

  margin-left: 30px;

  border-radius: 50px;

  color: #fff;

  font-size: 14px;

  border: 2px solid #47b2e4;

  font-weight: 600;

}

.navbar .getstarted:hover, .navbar .getstarted:focus:hover {

  color: #fff;

  /*background: #31a9e1;*/
  background: #000000;

}

.navbar .dropdown ul {

  display: block;

  position: absolute;

  left: 14px;

  top: calc(100% + 30px);

  margin: 0;

  padding: 10px 0;

  z-index: 99;

  opacity: 0;

  visibility: hidden;

  background: #fff;

  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);

  transition: 0.3s;

  border-radius: 4px;

}

.navbar .dropdown ul li {

  min-width: 200px;

}

.navbar .dropdown ul a {

  padding: 10px 20px;

  font-size: 14px;

  text-transform: none;

  font-weight: 500;

  color: #0c3c53;

}

.navbar .dropdown ul a i {

  font-size: 12px;

}

.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {

  color: #47b2e4;

}

.navbar .dropdown:hover > ul {

  opacity: 1;

  top: 100%;

  visibility: visible;

}

.navbar .dropdown .dropdown ul {

  top: 0;

  left: calc(100% - 30px);

  visibility: hidden;

}

.navbar .dropdown .dropdown:hover > ul {

  opacity: 1;

  top: 0;

  left: 100%;

  visibility: visible;

}

@media (max-width: 1366px) {

  #top-section {
    
      width: 100%;
    
      max-height: 100%;
    
      text-align: center; 
    
    }

  .navbar .dropdown .dropdown ul {

    left: -90%;

  }

  .navbar .dropdown .dropdown:hover > ul {

    left: -100%;

  }

}



#btn-sp{

  height: 62px;

  /*background-color: #00993e;*/

  background-color: #000000;
  
  color: #fff;

  margin-top: -20px;

  padding: 37px 5px 20px 5px;

}



/**

* Mobile Navigation 

*/

.mobile-nav-toggle {

  color: #fff;

  font-size: 28px;

  cursor: pointer;

  display: none;

  line-height: 0;

  transition: 0.5s;

}

.mobile-nav-toggle.bi-x {

  color: #fff;

}



@media (max-width: 991px) {

  .mobile-nav-toggle {

    display: block;

  }



  .navbar ul {

    display: none;

  }

}

.navbar-mobile {

  position: fixed;

  overflow: hidden;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

  background: rgba(0, 153, 90, 0.9);

  transition: 0.3s;

  z-index: 999;

}

.navbar-mobile .mobile-nav-toggle {

  position: absolute;

  top: 15px;

  right: 15px;

}

.navbar-mobile ul {

  display: block;

  position: absolute;

  top: 55px;

  right: 15px;

  bottom: 15px;

  left: 15px;

  padding: 10px 0;

  border-radius: 10px;

  background-color: #fff;

  overflow-y: auto;

  transition: 0.3s;

}

.navbar-mobile a, .navbar-mobile a:focus {

  padding: 10px 20px;

  font-size: 15px;

  color: #000;

}

.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a {

  color: #000;

}

.navbar-mobile .getstarted, .navbar-mobile .getstarted:focus {

  margin: 15px;

  color: #37517e;

}

.navbar-mobile .dropdown ul {

  position: static;

  display: none;

  margin: 10px 20px;

  padding: 10px 0;

  z-index: 99;

  opacity: 1;

  visibility: visible;

  background: #fff;

  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);

}

.navbar-mobile .dropdown ul li {

  min-width: 200px;

}

.navbar-mobile .dropdown ul a {

  padding: 10px 20px;

}

.navbar-mobile .dropdown ul a i {

  font-size: 12px;

}

.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a {

  color: #47b2e4;

}

.navbar-mobile .dropdown > .dropdown-active {

  display: block;

}



/*--------------------------------------------------------------

# Hero Section

--------------------------------------------------------------*/

#top-section {

  width: 100%;

  max-height: 100%;

  background-image: url("../img/fondoNuevo.jpeg");

  background-size: cover; 

  background-repeat: no-repeat;

}

#top-section .container {

  padding-top: 20px;

}

#top-section h1 {

  margin: 0 0 10px 0;

  font-size: 55px;

  font-weight: 700;

  line-height: 56px;

  color: #fff;

}

#top-section h2 {

  color: rgba(255, 255, 255, 0.6);

  margin-bottom: 50px;

  font-size: 50px;

}

#top-section .btn-offer{

  font-family: 'Akira Expanded', sans-serif;

  font-weight: 500;

  font-size: 16px;

  letter-spacing: 1px;

  display: inline-block;

  padding: 10px 10px 11px 10px;

   border: 1px solid #fff;

  border-radius: 10px;

  transition: 0.5s;

  margin: 10px 20px 0 0;

  color: #000;

  

}

#top-section .btn-offer:hover {

  background: #fff;

}



#top-section .btn-porta{

  font-family: 'Akira Expanded', sans-serif;

  font-weight: 500;

  font-size: 16px;

  letter-spacing: 1px;

  display: inline-block;

  padding: 10px 28px 11px 28px;

  border: 1px solid #fff;

  border-radius: 10px;

  transition: 0.5s;

  margin: 10px 0 0 0;

  color: #000;

  background:#fff;

  

}

#top-section .btn-porta:hover {

  background: transparent;

}

#top-section .animated {

  animation: up-down 2s ease-in-out infinite alternate-reverse both;

}

#img-header {

    width: 300px;

    margin-left: auto;

    margin-right: auto;

    display: block;

  }

@media (max-width: 991px) {

  #top-section {
    
      width: 100%;
    
      max-height: 100%;
    
      text-align: center; 
    
    }

  #top-section .animated {

    -webkit-animation: none;

    animation: none;

  }

  #top-section .img-top {

    text-align: center;

  }

  

}

@media (max-width: 768px) {

  #top-section {
    
      width: 100%;
    
      max-height: 100%;
    
      text-align: center; 
    
    }

  #top-section h1 {

    font-size: 28px;

    line-height: 36px;

  }

  #top-section h2 {

    font-size: 18px;

    line-height: 24px;

    margin-bottom: 30px;

  }

  #top-section .img-top img {

    width: 70%;

  }

}

@media (max-width: 575px) {

  #top-section {
    
      width: 100%;
    
      max-height: 100%;
    
      text-align: center; 
    
    }

  #top-section .img-top img {

    width: 80%;

    text-align: center;

  }

  #top-section .btn-get-started {

    font-size: 16px;

    padding: 10px 24px 11px 24px;

  }

}



@-webkit-keyframes up-down {

  0% {

    transform: translateY(10px);

  }

  100% {

    transform: translateY(-10px);

  }

}



@keyframes up-down {

  0% {

    transform: translateY(10px);

  }

  100% {

    transform: translateY(-10px);

  }

}

/*--------------------------------------------------------------

# General

--------------------------------------------------------------*/

section {

  padding: 60px 0;

  overflow: hidden;

}





/*--------------------------------------------------------------

# Beneficios

--------------------------------------------------------------*/

.card-group{

  padding-top: 20px;

}

#title-bft{

  color: #00993e;

  text-align: center;

  text-decoration: underline solid #000 5px;



}



#card-bft {

  width: 18rem;

  border: none;

  color: #000;

  font-size: 13px;

  text-align: center;

  margin-left: auto;

  margin-right: auto;

}

.card-title{

  font-size: 14px;

}

#card-bft img{

  width: 70%;

  display: block;

  margin-left: auto;

  margin-right: auto;

}



/*--------------------------------------------------------------

# Telefonía, Hogar, MIFI  y IOT

--------------------------------------------------------------*/

.card-group{

  padding: 10px 30px 10px 30px;

}

.card-group .card{

  margin: 10px;

}

.tlphny-section {

  background-image: url("../img/bg-2.png");

}

#title-group{

  color: #fff;

  text-align: center;

  text-decoration: underline solid #00993e 5px;

}

#card-section{

  background-color: #00993e;

  color: #fff;

  font-size: 15px;

  text-align: center;

  padding: 15px 0px 10px 0px;

  border-top-right-radius: 20px;

  border-top-left-radius: 20px;

}

.list-group-item{

  border: none;



}

#table-bnf{

  margin-left: 25px;

}



#itm-one{

  font-size: 45px;

  text-align: center;

}

#itm-two{

  font-family: 'Open Sans', sans-serif;

  font-size: 10px;

  font-weight: 600;

  text-align: center;

  margin-top: -25px;

}

#itm-three{

  background:#00993e;

  padding: 10px 15px 0px 15px;

  border-top-left-radius: 20px;

  border-top-right-radius:20px;

}

#itm-three b{

  font-family: 'Akira Expanded', sans-serif;

  font-size: 26px;

  color: #fff;

}

#itm-three p{

  font-family: 'Open Sans', sans-serif;

  font-size: 15px;

  font-weight: bold;

  color: #000;

  text-align: center;



}

#itm-four{

  background:#00993e;

  text-align: left;

  font-size: 9px;

  color: #000;

  padding: 10px 10px 10px 20px;

  margin-top: -30px;

  border-bottom-right-radius: 20px;

  border-bottom-left-radius: 20px;

}



#bnf-item{

   font-family: 'Open Sans', sans-serif;

   font-size: 15px;

   font-weight: 600;

   text-align: center;

}

.btn-green{

  background:#00993e;

  color: #fff;

  border-radius: 15px;

  padding: 10px 40px 10px 40px;

}



.btn-green:hover{

  color:#00993e;

  background:#fff;

  border: 1px solid #00993e;

  border-radius: 15px;

}

.btn-white{

  background:#fff;

  color: #00993e;

  border:1px solid #00993e;

  border-radius: 15px;

  padding: 10px 15px 10px 15px;

}

.btn-white:hover{

  color:#fff;

  background:#00993e;

  border-radius: 15px;

}

.btn-cont{

  text-align: center;

}



#text-folio{

  font-family: 'Open Sans', sans-serif;

  font-size: 12px;

  text-align: right;

  

}

.hm-section {

  background-image: url("../img/bg-3.png");

}



#itm-five{

  background:#00993e;

  text-align: center;

  font-size: 10px;

  color: #000;

  margin-top: -30px;

  border-bottom-right-radius: 20px;

  border-bottom-left-radius: 20px;

}

#itm-five b{

  font-family: 'Akira Expanded', sans-serif;

  font-size: 30px;

  color: #fff;

}

#itm-five p{

  font-family: 'Open Sans', sans-serif;

  font-size: 30px;

  font-weight: bold;

  color: #000;

  text-align: center;



}

#itm-six{

  color: #00993e;

  font-size: 20px;

  text-align: center;



}

.btn-ofertas{

  color: #000;

  background:#fff;

  border-radius: 15px;

  padding: 10px 30px;

  display: inline-block;

  transition: 0.5s;

}

.btn-ofertas:hover{

  color:#00993e;

  background:#fff;

  border: 1px solid #00993e;

  border-radius: 15px;

}

.mifi-section {

  background-image: url("../img/bg-4.png");

}

#itm-seven {

  line-height: 30px;

  background:#00993e;

  padding: 10px 15px 0px 15px;

  border-radius: 20px;

}

#itm-seven b{

  font-family: 'Akira Expanded', sans-serif;

  font-size: 40px;

  color: #fff;

}

#itm-seven p{

  font-family: 'Open Sans', sans-serif;

  font-size: 20px;

  font-weight: bold;

  color: #000;

  text-align: center;

}

.iot-section {

  background-image: url("../img/bg-5.png");

}

#txt-wt{

  color: #fff;

}

/*--------------------------------------------------------------

# PROMOS

--------------------------------------------------------------*/

#prom-section{

  background:#1d1d1b;

}

#prom-section img{

  width: 400px;

  }





/*--------------------------------------------------------------

# Footer

--------------------------------------------------------------*/

#footer {

  font-size: 14px;

  background: #1d1d1b;

  border-top: 1px solid #fff;

  padding-top: 50px;

}



#footer .footer-top h4 {

  font-family: 'Open Sans', sans-serif;

  font-size: 16px;

  font-weight: bold;

  color: #00993e;

  position: relative;

  padding-bottom: 12px;

}

#footer .footer-top .footer-links {

  margin-bottom: 30px;

}

#footer .footer-top .footer-links ul {

  list-style: none;

  padding: 0;

  margin: 0;

}

#footer .footer-top .footer-links ul i {

  padding-right: 2px;

  color: #00993e;

  font-size: 18px;

  line-height: 1;

}

#footer .footer-top .footer-links ul li {

  font-family: 'Open Sans', sans-serif;

  padding: 10px 0;

  display: flex;

  align-items: center;

}

#footer .footer-top .footer-links ul li:first-child {

  padding-top: 0;

}

#footer .footer-top .footer-links ul a {

  color: #fff;

  transition: 0.3s;

  display: inline-block;

  line-height: 1;

}

#footer .footer-top .footer-links ul a:hover {

  text-decoration: none;

  color: #47b2e4;

}

#footer .footer-top .social-links a {

  font-size: 25px;

  display: inline-block;

  color: #fff;

  line-height: 1;

  padding: 8px 0;

  margin-right: 4px;

  text-align: center;

  width: 36px;

  height: 36px;

  transition: 0.3s;

}



.copy-footer{

  background:#00993e;

  height: 40px;

  font-family: 'Open Sans', sans-serif;

  color: #fff;

  font-size: 15px;

  text-align: center;

  padding:10px;



}

#footer .footer-bottom {

  padding-top: 30px;

  padding-bottom: 30px;

  color: #fff;

}

#footer .copyright {

  float: left;

}

#footer .credits {

  float: right;

  font-size: 13px;

}

#footer .credits a {

  transition: 0.3s;

}

@media (max-width: 768px) {

  #top-section {
    
      width: 100%;
    
      max-height: 100%;
    
      text-align: center; 
    
    }
    
  #footer .footer-bottom {

    padding-top: 20px;

    padding-bottom: 20px;

  }

  #footer .copyright, #footer .credits {

    text-align: center;

    float: none;

  }

  #footer .credits {

    padding-top: 4px;

  }

}

.top-section-arc {
  height: 98% !important;
}

.form-header-arc {
  color:  #000000 !important;
  font-size: 22px !important;
  margin-bottom:  20px !important;
}

.form-line-arc {
  margin-top: 6px !important;
  margin-bottom: 6px !important;  
  padding-top: 6px !important;
  padding-bottom: 6px !important;    
}

.form-section-arc {
  height: 90vh !important;
}

.form-all-arc {
    opacity:  .9;
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important;
    margin: 10px auto !important;
    max-width: 95% !important;
}

.header-large-arc {
  padding: .8em 40px !important;
}

#map { 
  widh: 50px;
  height: 600px; 
}

.playcell-card {
    background-color: transparent !important;
}

.playcell-itm-four {
    font-family: 'Open Sans', sans-serif;
    font-size: 26px !important;
    font-weight: bold;
    color: #fff !important;
    text-align: center !important;
}

.playcell-menu-bar {
    height: 50px !important;
}

.playcell-carousel-item {
    color: white;
}

.playcell-carousel-caption {
    color: white !important;
}

span.carousel-control-next-icon {
    filter: invert(0) grayscale(50) !important;
}

span.carousel-control-prev-icon {
    filter: invert(0) grayscale(50) !important;
}