.et-hero-tabs,
.et-slide {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height:106px;
  position: relative;
  background: #FFFFFF;
  text-align: center;
  padding: 0 2em;
}

.et-slide {

  height:auto;
display:block;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height:auto;
  position: relative;
  background: #ffffff;
  text-align:left;
  padding: 0;

}
.et-hero-tabs h1,
.et-slide h1 {
  font-size: 2rem;
  margin: 0;

}
.et-hero-tabs h3,
.et-slide h3 {
  font-size: 1rem;
  letter-spacing: 0.3rem;
  opacity: 0.6;
}

.et-hero-tabs-container {
  display: flex;
  flex-direction: row;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
  background: #fff;
  z-index: 10;
}
.et-hero-tabs-container--top {
  position: fixed;
  top: 0;
}

.et-hero-tab {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
  color: #000;
  letter-spacing: 0;
  transition: all 0.5s ease;
  font-size: 0.8rem;
}
.et-hero-tab:hover {
  color: white;
  background: #0c3a4c;
  transition: all 0.5s ease;
}


.et-hero-tab-slider {
  position: absolute;
  bottom: 0;
  width: 0;
  height: 6px;
  background: #182d3e;
  transition: left 0.3s ease;
}



@media (min-width: 800px) {
  .et-hero-tabs h1,
.et-slide h1 {
    font-size: 3rem;
  }
  .et-hero-tabs h3,
.et-slide h3 {
    font-size: 0.6rem;
  }

  .et-hero-tab {
    font-size: 0.8rem;
	FONT-WEIGHT: 500;
  }
	
}


@media (max-width: 800px) {

	.et-hero-tabs-container {
  display: none;
}
}

/*-----SDGS------*/
.sdg1-tab{
  color: #E5243B;

}
.sdg1-tab:hover {
  color: #FFFFFF;
  background: #E5243B;
  transition: all 0.5s ease;
}



.sdg2-tab{
  color: #d5a84f;

}
.sdg2-tab:hover {
  color: #FFFFFF;
  background: #d5a84f;
  transition: all 0.5s ease;
}


.sdg2-tab{
  color: #d5a84f;

}
.sdg2-tab:hover {
  color: #FFFFFF;
  background: #d5a84f;
  transition: all 0.5s ease;
}



.sdg3-tab{
  color: #4C9F38;

}
.sdg3-tab:hover {
  color: #FFFFFF;
  background: #4C9F38;
  transition: all 0.5s ease;
}



.sdg4-tab{
  color: #C5192D;

}
.sdg4-tab:hover {
  color: #FFFFFF;
  background: #C5192D;
  transition: all 0.5s ease;
}



.sdg5-tab{
  color: #FF3A21;

}
.sdg5-tab:hover {
  color: #FFFFFF;
  background: #FF3A21;
  transition: all 0.5s ease;
}



.sdg6-tab{
  color: #26BDE2;

}
.sdg6-tab:hover {
  color: #FFFFFF;
  background: #26BDE2;
  transition: all 0.5s ease;
}



.sdg7-tab{
  color: #FCC30B;

}
.sdg7-tab:hover {
  color: #FFFFFF;
  background: #FCC30B;
  transition: all 0.5s ease;
}



.sdg8-tab{
  color: #A21942;

}
.sdg8-tab:hover {
  color: #FFFFFF;
  background: #A21942;
  transition: all 0.5s ease;
}



.sdg9-tab{
  color: #FD6925;

}
.sdg9-tab:hover {
  color: #FFFFFF;
  background: #FD6925;
  transition: all 0.5s ease;
}



.sdg10-tab{
  color: #DD1367;

}
.sdg10-tab:hover {
  color: #FFFFFF;
  background: #DD1367;
  transition: all 0.5s ease;
}



.sdg11-tab{
  color: #FD9D24;

}
.sdg11-tab:hover {
  color: #FFFFFF;
  background: #FD9D24;
  transition: all 0.5s ease;
}



.sdg12-tab{
  color: #BF8B2E;

}
.sdg12-tab:hover {
  color: #FFFFFF;
  background: #BF8B2E;
  transition: all 0.5s ease;
}



.sdg13-tab{
  color: #3F7E44;

}
.sdg13-tab:hover {
  color: #FFFFFF;
  background: #3F7E44;
  transition: all 0.5s ease;
}



.sdg14-tab{
  color: #0A97D9;

}
.sdg14-tab:hover {
  color: #FFFFFF;
  background: #0A97D9;
  transition: all 0.5s ease;
}



.sdg15-tab{
  color: #56C02B;

}
.sdg15-tab:hover {
  color: #FFFFFF;
  background: #56C02B;
  transition: all 0.5s ease;
}



.sdg16-tab{
  color: #00689D;

}
.sdg16-tab:hover {
  color: #FFFFFF;
  background: #00689D;
  transition: all 0.5s ease;
}

.sdg17-tab{
  color: #19486A;

}
.sdg17-tab:hover {
  color: #FFFFFF;
  background: #19486A;
  transition: all 0.5s ease;
}