* {box-sizing: border-box}

/* Style the tab */
.tab {
  float: left;
  width: 30%;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  display: block;
  background-color: var(--Color-principal);
  color: rgb(255, 255, 255);
  width: 100%;
  border-radius: 5px;
  border: 2px solid var(--Color-principal);
  outline: none;
  text-align: left;
  cursor: pointer;
  transition: 0.3s;
  margin:  5px auto;
  padding: 5px;
  font-size: 1.7rem !important;
  font-family: var(--Fuente-principal);

}

/* Change background color of buttons on hover */
/* .tab button:hover {
  background-color: #ddd;
} */

/* Create an active/current "tab button" class */
.tab button.active {
  background-color: white;
  color: var(--Color-principal);
  outline: none;
}

/* Style the tab content */
.tabcontent {
  float: right;
  /* width: 70%; */
  border-left: none; 
  text-align: center;
  font-family: var(--Fuente-texto);
}