.section > p, .section > .container > p, .section > .container > .cols > p{display: none;}
/* TABS */
@media screen and ( min-width: 1101px ) {
	.case-family_tabs { max-width: 850px; }
	.case-family_tabs { max-height: 64px; }
}
@media screen and ( min-width: 1117px ) {
   
	.case-family_tabs li:hover, .case-family_tabs li:active { background : #6a9ad1; border-radius: 16px; color: white; }
 	.case-family_tabs .active:hover, .case-family_tabs .active:active { background: #004494!important; }
}
@media screen and ( min-width: 611px ) {
	#bg-about-us_nd { display: none; }
}
@media screen and ( max-width: 374px ) {
	.case-family_tabs { flex-direction: column; }
}
@media screen and ( max-width: 610px ) {
	.case-family_tabs a { flex-direction: column; gap: 2px!important; line-height: 24px!important; text-align: center!important; white-space: pre; }
	.case-family_tabs li { height: 74px!important; padding: 12px 24px!important; }
}
@media screen and ( max-width: 1100px ) {   
	.case-family_tabs li { width: 100%; padding-left: 40px; }
	.active { width: 100%;  }
}
.tabs-container { padding-left: 16px; padding-right: 16px; padding-bottom: 40px; position: relative; z-index: 2; } 
.case-family_tabs { margin-bottom: 0rem!important; }
.case-family_tabs ul { list-style: none;}
.case-family_tabs li {display: flex; align-items: center; justify-content: center; list-style: none; cursor: pointer; padding-right: 24px; padding-left: 24px; height: 48px; }
.case-family_tabs li:first-child { padding-left: 40px; padding-right: 40px; }
.case-family_tabs li:last-child { padding-right: 24px; }
.case-family_tabs a { text-decoration: none; color: black; text-align: left; line-height: 1;}
.case-family_tabs { display: flex; justify-content: space-between; align-items: center; padding: 8px; border-radius: 20px; list-style: none; background: #E6ECF4; width: 100%; }
.case-family_tabs .active {background: #004494; display: flex; align-items: center; border-radius: 16px; color: white; padding-top: 12px; padding-bottom: 12px; }
.case-family_tabs a { display: flex; align-items: center; gap: 12px; }  
.case-family_tabs a img { max-width: 24px; max-height: 24px; width: 24px; height: 24px; }
.num-active { display: none; }  
/* Page Style */
@media screen and ( max-width: 550px ) {  
#eu-expert-group-on-blockchain-ethics-container { padding-left: 0; padding-right: 0; }
	.EGBE-member { max-width: 166px; margin-bottom: 42px; }
	.EGBE-member > div { margin-bottom: 0!important; }
}
@media screen and ( max-width: 610px ) { 
	#eu-expert-section { flex-direction: column; min-height: unset!important; height: 536px!important; padding-top: 40px; background-position: center!important; }
	.section-info_nd { position: unset!important; margin-bottom: 32px; }
	#eu-expert-section .col-12 { display: flex!important; flex-direction: column; justify-content: center; align-items: center; text-align: center; } 
	#eu-expert-section .col-12 h1+p { max-width: 282px; }
	#bg-about-us { right: -421px!important; width: 210%!important; }
	.section-about-us_nd img { margin-left: 0!important; }
	.members-info-container { gap: 12px!important; }
	.EGBE-member { max-width: 157.5px!important;  margin-bottom: 30px!important; text-align: center; }
    .EGBE-member > img { max-height: 157.5px!important; height: 157.5px!important; }
    #bg-about-us_nd { display: unset; position: absolute; top:-50px; right: -421px; z-index: 1; width: 210%important; max-width: unset!important; }
   	.section-about-us_nd { background: unset!important; margin-top: 0!important; position: relative; }
}
@media screen and ( max-width: 700px ) {
	.members-info-container { justify-content: center; }
}
@media screen and ( max-width: 768px ) {
	#main-content h2 { font-size: 32px!important; }
	#main-content h3 { font-size: 32px!important; } 
	.section-about-us_nd a, .about-us-buttons-container a { max-width: 100%; width: 100%; }
	#eu-expert-section h1 { font-size: 40px!important; }
	.section-info_nd { left: 24px!important;  }

    .official-guidelines-section .left-col .illu{display: none !important;}
    .official-guidelines-section .right-col .illu{display: flex !important;}
}
@media screen and ( max-width: 1100px ) {
   #bg-about-us { top: -230px!important; }
} 
@media screen and ( max-with: 1138px ) {
	.section-about-us_nd { background-position: top right!important; }
}

.hierarchy-first { display: flex; justify-content: center; align-items: center; }  
#eu-expert-section { display: flex; align-items: center; position: relative; background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/674507497/cover.png"); background-position: top left; background-repeat: no-repeat; background-size: cover; text-align: center; height: 568px; min-height: 568px; z-index: 2; }
#eu-expert-section .container { position: relative; z-index: 10; }
#eu-expert-section .cols img { width: 282px; max-width: 282px; }
#section-wrapper_nd { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #004494; opacity: 0.8; }
#section-wrapper_nd p { margin-bottom: 0; }
#eu-expert-section h1 { color: white; margin-bottom: 4px; font-size: 48px!important;}
#about-us-introduction h1 { font-size: 48px!important; }
#eu-expert-section p { color: white; opacity: 0.8; margin-bottom: 40px; }
.section-info_nd { position: absolute; top: 40px; z-index: 10; left: 108px; background: rgba(255, 255, 255, 0.2); border-radius: 16px; padding: 16px 24px;  }
.section-info_nd > p:first-child, .section-info_nd > p:last-child { display: none; }
.section-info_nd p { margin-bottom: 0!important; opacity: 1!important; }
.section-info_nd > div { display: flex; justify-content: center; align-items: center; gap: 8px; }
.section-info_nd > div img { width: 24px; max-width: 24px; }
.section-about-us_nd img { max-width: 92.5%!important; }
.section-about-us_nd { background: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/447687044/bg-home-introducing-ebsi.png") no-repeat;
background-position: top right; background-size: contain; margin-top: -3rem; }
.section .ico-arrow-south { background: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/674507497/ico-download-white.svg") left no-repeat!important; }
.section-about-us_nd .btn { margin-top: 40px; }
#main-content .container { max-width: 1226px!important; position: relative; z-index: 2; }
.members-info-container { display: flex; gap: 6.2%; flex-wrap: wrap; }
.EGBE-member { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 184px; gap: 18px; text-align: center; }
.EGBE-member > div { display: flex; gap: 10px; margin-bottom: 42px; flex-grow: 1; }
.EGBE-member > div > img { width: 24px; height: 24px; max-width:24px; }
#eu-expert-group-on-blockchain-ethics-container { padding-top: 0; padding-left: 0; padding-right: 0; } 
.EGBE-member > img { width: 100%; max-height: 184px; height: 184px; object-fit: cover; border-radius: 16px; }

.official-guidelines-section p.no-mrg{margin: 0;}
.official-guidelines-section .illu{width: 100%; max-width: 480px; display: flex; margin: auto;}
.official-guidelines-section .right-col .illu{display: none;}
.official-guidelines-section ul:not(:last-child){margin-bottom: 24px;}
.official-guidelines-section .dash-list{list-style: none; padding-left: 12px;}
.official-guidelines-section .dash-list > li{display: flex; align-items: center; gap: 8px;}
.official-guidelines-section .dash-list > li::before{content: ''; width: 8px; height: 1px; background: black;}

<script>

const mediaQuery2 = window.matchMedia("(max-width: 1070px)")

const structureNav = () => {
	const mediaQuery = window.matchMedia("(max-width: 1070px)")
	const tabs = document.querySelectorAll(".case-family_tabs li")
	tabs.forEach( tab => {
	if( mediaQuery.matches ) {
			tab.getAttribute("id") === 'about-us' ? tab.querySelector("a > span").textContent = "About us" : tab.querySelector("a > span").textContent
			tab.getAttribute("id") === 'eu-expert' ? tab.querySelector("a > span").textContent = "EGBE" : tab.querySelector("a > span").textContent
			tab.getAttribute("id") === 'eu-bc-sb' ? tab.querySelector("a > span").textContent = "Sandbox" : tab.querySelector("a > span").textContent
		} else {
			tab.getAttribute("id") === 'about-us' ? tab.querySelector("a > span").textContent = "About us" : tab.querySelector("a > span").textContent
			tab.getAttribute("id") === 'eu-expert' ? tab.querySelector("a > span").textContent = "EU Expert Group on Blockchain Ethics" : tab.querySelector("a > span").textContent
			tab.getAttribute("id") === 'eu-bc-sb' ? tab.querySelector("a > span").textContent = "European Blockchain Sandbox" : tab.querySelector("a > span").textContent
		}
	})
}
structureNav()

mediaQuery2.addEventListener("change", structureNav)








const setImageInActive = (that) => {
    if (
      that.getAttribute("data-index") == 0 ||
      that.getAttribute("id") == "about-us"
    ) {
      $(that.children[0].children[0]).css("display", "none")
      $(that.children[0].children[1]).css("display","block")
        $(that.children[0].children[2]).css("color","black")
		
     }
    if (
      that.getAttribute("data-index") == 1 ||
      that.getAttribute("id") == "eu-expert"
    ) {
      $(that.children[0].children[0]).css("display", "none")
      $(that.children[0].children[1]).css("display","block")
      $(that.children[0].children[2]).css("color","black")
	  $(that.children[0].children[2]).css("fontWeight", "600")
       }
     if (
      that.getAttribute("data-index") == 2 ||
      that.getAttribute("id") == "eu-bc-sb"
    ) {
      $(that.children[0].children[0]).css("display", "none")
      $(that.children[0].children[1]).css("display","block")
         $(that.children[0].children[2]).css("color","black")
	
     } 
   }
  const setImageActive = (that) => {
    if (
      that.getAttribute("data-index") == 0 ||
      that.getAttribute("id") == "about-us"
    ) {
      $(that.children[0].children[0]).css("display", "block")
      $(that.children[0].children[1]).css("display","none")
        $(that.children[0].children[2]).css("color","white")
		
     }
    if (
      that.getAttribute("data-index") == 1 ||
      that.getAttribute("id") == "eu-expert"
    ) {
      $(that.children[0].children[0]).css("display", "block")
      $(that.children[0].children[1]).css("display","none")
      $(that.children[0].children[2]).css("color","white")
	  $(that.children[0].children[2]).css("fontWeight", "600")
        }
     if (
      that.getAttribute("data-index") == 2 ||
      that.getAttribute("id") == "eu-bc-sb"
    ) {
      $(that.children[0].children[0]).css("display", "block")
      $(that.children[0].children[1]).css("display","none")
         $(that.children[0].children[2]).css("color","white")
	
    } 
   }      


  const tabs = document.querySelectorAll(".case-family_tabs li");    

tabs.forEach((tab) => {
  if (
    tab.getAttribute("data-index") == 1 ||
    tab.getAttribute("id") == "eu-expert"
  ) {
    $(tab).addClass("active")
    setImageActive(tab)
  }
  $(tab).on("click", function (e) {
    e.stopPropagation()
    tabs.forEach((tab) => {
      $(tab).removeClass("active")
      setImageInActive(tab)
    })
    this.classList.toggle("active")
    setImageActive(this)

    if (this.getAttribute("data-index") == 0) {
      window.location.href = "https://ec.europa.eu/digital-building-blocks/sites/display/EBSI/About+us"
      }

    if (this.getAttribute("data-index") == 2) {
      window.location.href ="https://ec.europa.eu/digital-building-blocks/sites/display/EBSI/Sandbox+Project"
     }

    e.preventDefault()
  })
})

    </script>