:root {
    --black:#000000;
    --white:#ffffff;
    --dark-purple:#024092;
    --light-pink:#0074c77a;
    --green:#024092;
    --background-gray:#eee;
}

.btn-enviar{    
    padding: 5px;
    font-size: 16px;
    border: none;
    outline: 0px;
    background: #024092;
    color: white;
    border-radius: 3px;
    cursor: pointer;
    transition: all 300ms ease;
}

/* 6.2 Section */

.section-heading {
  margin-bottom: 3.25rem;
  max-width: 850px;
}

.section-heading {
  margin-bottom: 3.25rem;
  max-width: 850px;
}

.section-heading h1, .section-heading h2, .section-heading h3 {
  position: relative;
  font-size: 2.5rem;
  margin: 0;
}

.section-heading.shm-none {
  margin-bottom: 0;
}

.section-heading .btn-group {
  margin-top: 2rem;
}

.heading-center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.heading-center .section-desc {
  margin-left: auto;
  margin-right: auto;
}

/*tabs*/
.tabs {
  position: relative;
}

.tabs-nav {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--border-color);
  color: var(--text-primary);
}

.tabs-nav li {
  padding: 0.625rem 0;
  margin-right: 2.5rem;
  cursor: pointer;
  position: relative;
  transition: all 0.2s;
}

.tabs-nav li:last-child {
  margin-right: 0;
}

.tabs-nav li::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -1px;
  width: 0;
  height: 2px;
  background-color: var(--accent-color);
  transform: translateX(-50%);
  transition: all 0.2s;
}

.tabs-nav li.active, .tabs-nav li:hover {
  color: var(--accent-color);
}

.tabs-nav li.active::after, .tabs-nav li:hover::after {
  width: 100%;
}

.tabs-item {
  display: none;
  padding-top: 2rem;
}

.tabs-item.active {
  display: block;
}

.tabs-vertical {
  display: flex;
  align-items: flex-start;
}

.tabs-vertical .tabs-nav {
  display: block;
  border: none;
  width: 16rem;
  min-width: 16rem;
  border-radius: var(--el-border-radius);
  overflow: hidden;
}

.tabs-vertical .tabs-nav li {
  width: 100%;
  margin: 0;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border-color);
}

.tabs-vertical .tabs-nav li:last-child {
  border: none;
}

.tabs-vertical .tabs-nav li::after {
  content: none;
}

.tabs-vertical .tabs-nav li:hover {
  color: var(--accent-color);
}

.tabs-vertical .tabs-nav li.active {
  background-color: var(--accent-color);
  color: var(--background-color);
}

.tabs-vertical .tabs-item {
  padding-top: 0;
}

.tabs-vertical .tabs-container {
  padding-left: 2rem;
}

.tabs-container {
  width: 100%;
}

.acordeon {
  position: relative;
  margin: 0;
  padding: 0;
  min-height: 100vh;
  height: 100%;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  opacity: 1;
  box-shadow: var(--el-box-shadow);
  visibility: hidden;
  opacity: 0;
}
.acordeon {
  visibility: visible;
  opacity: 1;
}

/* 3.1 Accordion */
.accordion {
  color: var(--text-secondary);
}

.accordion.accordion-clear {
  margin-bottom: -1rem;
}

.accordion-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.section-bgc .accordion-item {
  background-color: var(--background-color);
}

.accordion-item {
  display: block;
  border-radius: var(--el-border-radius);
  background-color: var(--background-secondary-color);
  overflow: hidden;
  margin-bottom: 1rem;
}

.accordion-item.active .accordion-trigger::before {
  transform: rotate(0);
}

.accordion-trigger {
  position: relative;
  cursor: pointer;
  padding: 1.25rem 3.125rem 1.25rem 1.25rem;
  color: var(--text-primary);
  line-height: 1.2;
}

.accordion-trigger::after, .accordion-trigger::before {
  content: "";
  position: absolute;
  right: 1.25rem;
  top: 50%;
  width: 0.875rem;
  height: 2px;
  background-color: var(--accent-color);
  margin-top: -1px;
  transition: all 0.3s;
}

.accordion-trigger::before {
  transform: rotate(90deg);
}

.accordion-content {
  display: none;
  padding: 1.25rem;
  border-top: 1px solid var(--border-color);
}

body,input {
    font-family: 'Nunito', sans-serif;
    background-color: var(--background-gray);
    
}

.ins{  
  border-radius: 20px;
  width: 100%;
  align-items: center;  
  background-color: #024092; 
  padding: 1rem;
}
.link{  
  border-radius: 5px;   
  background-color: #00AFEF; 
  padding: .5rem;  
  color: #eee;
}
.slide-pri{
  float: left;
  width: 20rem;
  margin: .1rem; 
  border-radius: 10px;
}
.slide-insc{
  float: left;
  width: 20rem;
  margin: .1rem; 
  border-radius: 10px;
}

h2{
  color: #024092;
  background-color: white;
}
.ins img{  
  float: left;
  width: 15rem;
  margin: 2rem; 
  border-radius: 10px;
}
.ins p{   
  text-align: justify;
  color: #eee;
  margin: 2rem;
  min-width: 15rem;
  
}

.ins a {
    text-decoration: none;
    color: #000000;
}

.container {
    max-width: 1000px;
    padding: 0 5px;
    justify-content: center;
    align-items: center;  

}

.button {
    font-size: 1.1rem;
    padding: 10px 20px;
    font-weight: 700;    
    cursor: pointer;
    border-radius: 5px;
}

.button-primary {
    color: #ffff;
    background-color:#024092;
}

.button-primary:hover {
    background-color: #0074C7;
    transition: background-color 0.3s;
}

.button-secondary {
    color: var(--white);
    background-color: var(--dark-purple);
}

.button-secondary:hover {
    background-color: var(--pink);
    color: var(--dark-purple);
    transition: background-color 0.3s;
}

.input {
    border: none;
    font-size: 1.1rem;
    background-color: var(--white);
    padding: 10px;
    outline: none;
    color: var(--dark-purple);
    border-radius: 5px;
}

/* termina style general y empieza seccion nosotros*/

.services-section {
    background-color: var(--white);
    display: flex;
    justify-content: center;
    padding: 0px 0;
      
  }
  
  .services__cards {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .services__cards-info {
    max-width: 900px;
    
  }
 
  
  .services__cards-info h2 {
    
    font-size: 2rem;
    font-weight: 900;
    color: #024092;
    margin-bottom: 1rem;
    
  }
  
  .services__cards-info p {
    font-size: 1.1rem;
    color: var(--dark);
    margin-bottom: 1rem;
  }
  
  .services__cards-card {
    display: flex;
    justify-content: center;
  }
  
  .service__card {
    width: 200px;
    height: 100px;
    max-width: 25%;
    border: 1px solid var(--green);
    margin: 1rem .5rem;
    padding: 1rem 1rem;
    border-radius: 20px;
    transition: background-color 0.5s;
  }
  
  .service__card:hover {
    background-color: var(--light-pink);
  }
  
  .service__card i {
    font-size: 56px;
    color: var(--medium-purple);
  }
  
  .service__card h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--dark-purple);
  }
  
  .service__card p {
    font-size: 1.1rem;
    color: var(--dark);
    margin-top: 1rem;
  }
  .service__card img {
   border-radius: 50%;
   width: 100%;
  }
  .services__cards-card-auto{
    display: flex;
    justify-content: center;
  }
  .service__card-auto{
    width: 15rem;
    max-width: 25%;
    border: 1px solid var(--green);
    margin: 1rem .5rem;
    padding: 1rem 1rem;
    border-radius: 20px;
    transition: background-color 0.5s;
  }
  
  @media only screen and (max-width: 800px) {
    .services__cards-card {
      flex-direction: column;
      align-items: center;
      max-width: 500px;
    }
  
    .service__card {
      max-width: 100%;
      margin: 1rem 1rem;
    }
   
    .service__card-auto{
      max-width: 100%;
        margin: 1rem 1rem;
    }
    .services__cards .button {
      margin-top: 2rem;
    }
  } 
  @media only screen and (max-width: 700px){
  .ins{
    display: block;
  }

 
}