.tabs {
 position: relative;
 width: 100%;
 overflow: hidden;
 margin: 1em 0 2em;
 font-weight: 300;
}

/* Nav */
.tabs nav {
 text-align: center;
}

.tabs nav ul {
 padding: 0;
 margin: 0;
 list-style: none;
 display: inline-block;
}

.tabs nav ul li {
 /* border: 1px solid #becbd2; */
 border-bottom: none;
 margin: 0 0.25em;
 display: block;
 float: left;
 position: relative;
 border-radius: 16px 16px 0 0;
 background: #327EC2;
  box-shadow: 2px 0 2px #cccccc;
}

.tabs nav ul li a {
 color: #FFFFFF;
 
}

.tabs nav li.tab-current {
 /* border: 1px solid #47a3da;
 box-shadow: inset 0 2px #47a3da; */
 border-bottom: none;
 z-index: 100;
 background: #ECB31E;
}

.tabs nav li.tab-current:before,
.tabs nav li.tab-current:after {
 content: '';
 position: absolute;
 height: 1px;
 right: 100%;
 bottom: 0;
 width: 1000px;
 background: #47a3da;
}

.tabs nav li.tab-current:after {
 right: auto;
 left: 100%;
 width: 4000px;
}

.tabs nav a {
 color: #becbd2;
 display: block;
 font-size: 1.45em;
 line-height: 2.5;
 padding: 0 1.25em;
 /*white-space: nowrap;*/
}

.tabs nav a:hover {
 color: #000;
 box-shadow: 1px 0 2px #666666;
 border-radius: 16px 16px 0 0;

}

.tabs nav li.tab-current a {
 color: #58585B;
}

/* Icons */
.tabs nav a:before {
 display: inline-block;
 vertical-align: middle;
 text-transform: none;
 font-weight: normal;
 font-variant: normal;
 font-family: 'icomoon';
 line-height: 1;
 speak: none;
 -webkit-font-smoothing: antialiased;
 margin: -0.25em 0.4em 0 0;
}

.icon-food:before {
 content: "\e600";
}

.icon-lab:before {
 content: "\e601";
}

.icon-cup:before {
 content: "\e602";
}

.icon-truck:before {
 content: "\e603";
}

.icon-shop:before {
 content: "\e604";
}

/* Content */
.content section {
 display: none;

}

.content section:before,
.content section:after {
 content: '';
 display: table;
}

.content section:after {
 clear: both;
}

/* Fallback example */
.no-js .content section {
 display: block;
 padding-bottom: 2em;
 border-bottom: 1px solid #47a3da;
}

.content section.content-current {
 display: block;
}

.mediabox {
 float: left;
 width: 33%;
 padding: 0 25px;
}

.mediabox img {
 max-width: 100%;
 display: block;
 margin: 0 auto;
}

.mediabox h3 {
 margin: 0.75em 0 0.5em;
}

.mediabox p {
 padding: 0 0 1em 0;
 margin: 0;
 line-height: 1.3;
}


/* Example media queries */

@media screen and (max-width: 52.375em) {
 .tabs nav a span {
  /*display: none;*/
  font-size: 12px;
  word-wrap:break-word;
 }
 .tabs nav a {
  line-height: 2;
	 
 }
 .tabs nav a:before {
  margin-right: 0;
  
 }

 .mediabox {
  float: none;
  width: auto;
  padding: 0 0 35px 0;
  font-size: 90%;
 }

 .mediabox img {
  float: left;
  margin: 0 25px 10px 0;
  max-width: 40%;
 }

 .mediabox h3 {
  margin-top: 0;
 }

 .mediabox p {
  margin-left: 40%;
  margin-left: calc(40% + 25px);
 }

 .mediabox:before,
 .mediabox:after {
  content: '';
  display: table;
 }

 .mediabox:after {
  clear: both;
 }
}

@media screen and (max-width: 32em) {

 .tabs nav ul {display: block;}

 .tabs nav ul,
 .tabs nav ul li a {
  width: 100%;
  padding: 0;
  height: 50px;
 }

 .tabs nav ul li a span{
  content: "";
 }
 
 .tabs nav ul li {
  width: 20%;
  width: calc(32%);
  margin: 1px 0 1px 3px;
  z-index: 9;
 }

 .tabs nav ul li:last-child {
  border-right: none;
 }

 .mediabox {
  text-align: center;
 }

 .mediabox img {
  float: none;
  margin: 0 auto;
  max-width: 80%;
 }

 .mediabox h3 {
  margin: 1.25em 0 1em;
 }

 .mediabox p {
  margin: 0;
 }
}