.tabs {
	display: flex;
	flex-wrap: wrap;
}

.tabs label {
  order: 1;
  flex: auto;
	cursor: pointer;
  color: #222733;
  background-color: #F3F3F3;
  font-weight: 700;
  text-transform: uppercase;
  text-align:center;
  transition: background ease 0.2s;
  font-size: clamp(1rem, 0.9rem + 0.5vw, 1.5rem);
  letter-spacing: 2.4px;
}

.tabs .tab {
  order: 99;
  flex-grow: 1;
	width: 100%;
	display: none;
  /*background: #fff;*/
}

.tabs input[type="radio"] {
	display: none;
}

.tabs input[type="radio"]:checked + label {
	color: #F3F3F3;
  background-color: #222733;
}

.tabs input[type="radio"]:checked + label + .tab {
	display: grid;
  grid-auto-rows: minmax(min-content, max-content);
  position: relative;
}

.tab h3{
  color: #000;
  font-size: clamp(1.25rem, 1.1rem + 0.75vw, 2rem);
  font-weight: 700;
  margin-bottom: 15px;
}

.tab-txt{
  color: #000;
  font-weight: 400;
  font-size: clamp(1rem, 0.925rem + 0.375vw, 1.375rem);
  letter-spacing: 0.66px;
}

.tab{
  padding-top: 4%;
}

.tabs-o{
  display: flex;
  flex-direction: column;
  flex: auto;
  background-image: url(../img/bk-bulex.jpg);
  background-size:auto;
  background-repeat: no-repeat;
  background-position: left bottom;
}

.bkfcfefd{
  background-color: #fcfefd;
}


/* media queries */
@media(min-width:768px){
  .tabs label {
    padding-top: 30px;
    padding-bottom: 30px;
    margin-left: 10px;
    margin-right: 10px;
  }
  .tabs label:nth-child(even){
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
  }
  .tabs label:nth-child(odd){
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px;
  }
  .tabs input[type="radio"]:checked + label + .tab {
    /*grid-template-columns: 2fr 2fr;*/
    grid-gap: 30px;
  }
  .tab-l{
    padding-left: 10%;
    padding-right: 10%;
    grid-column-start: 1;
    grid-column-end: 2;
  }
  .tab-r{
    grid-column-start: 2;
    grid-column-end: 4;
  }
  .endtab{
    grid-column-start: 1;
    grid-column-end: 4;
  }
}

@media (max-width:767px) {
  .tabs label {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .tabs .tab, .tabs label{
    order: initial;
  }
  .tabs label{
    width: 100%;
  }
  .tabs input[type="radio"]:checked + label + .tab {
    grid-template-columns: 1fr;
    grid-gap: 30px;
  }
}