/**
 * The tablist
 */
[role="tablist"] {
  /*border-bottom: 1px solid lightgray;*/
  list-style: none;
  margin: 0;
  padding: 0;
  padding-bottom:3%;
  text-align:center;
}

#bajnoksagok [role="tablist"] {
	display:flex;
	width:100%;
	padding-bottom:0;
}

[role="tablist"] * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

#bajnoksagok [role="tablist"] * {
	width:100%;
}

/**
 * The tablist item
 */
@media (min-width: 30em) {
  [role="tablist"] li {
    display: inline-block;
	width:33%;
  }
  #bajnoksagok [role="tablist"] li {
    display: inline-block;
	width:50%;
  }
  #bajnoksagok [role="tablist"] li:nth-child(odd) {
	margin-right:0.2%;
  }
  #bajnoksagok [role="tablist"] li:nth-child(even) {
	margin-left:0.2%;
  }
}
#bajnoksagok [role="tablist"] li:nth-child(2) {
    margin-right: 0.4%;
}
:focus {
	outline:none;
}

/**
 * The tabs
 */
[role="tab"] {
  /*border: 1px solid transparent;
  border-top-color: lightgray;*/
  display: block;
  padding: 0.7em 1em;
  text-decoration: none;
  width:100%;
  background-color: #00c8fa;
  /**
	 * Active tab styling
	 */
  /**
	 * Tabs on hover
	 */
}

#bajnoksagok [role="tab"] {
	background-color: #ebebeb;
  }

@media (min-width: 30em) {
  [role="tab"] {
   /* border-top-color: transparent;
    border-top-left-radius: 0.5em;
    border-top-right-radius: 0.5em;*/
    display: inline-block;
    /*margin-bottom: -1px;*/
	background-color: #00c8fa;
  }
  #bajnoksagok [role="tab"] {
	background-color: #ebebeb;
  }
}

[role="tab"][aria-selected="true"] {
  /*background-color: lightgray;*/
  background-color: #052c73;
}

#bajnoksagok [role="tab"][aria-selected="true"] {
  background-color: #00c8fa;
  color:#052d73;
}

@media (min-width: 30em) {
  [role="tab"][aria-selected="true"] {
    /*background-color: transparent;
    border: 1px solid lightgray;
    border-bottom-color: #ffffff;*/
	background-color: #052c73;
  }
  #bajnoksagok [role="tab"][aria-selected="true"] {
	background-color: #00c8fa;
	color:#052d73;
  }
}

[role="tab"]:hover:not([aria-selected="true"]) {
  /*background-color: #f7f7f7;*/
}

@media (min-width: 30em) {
  [role="tab"]:hover:not([aria-selected="true"]) {
    /*border: 1px solid lightgray;*/
  }
}

/**
 * [hidden] fallback for IE10 and lower
 */
[hidden] {
  display: none;
}
@media (max-width:750px) {
	#bajnoksagok [role="tablist"] {
		display: block;
	}
	#bajnoksagok [role="tablist"] li {
		display: inline-block;
		width: 99%;
		margin-top: 1%;
	}
}