/* BERUFE */
/* tabs */
#berufe .inhalte {
 list-style: none;
min-height: 400px;
}

#berufe .spalte {
 box-sizing: border-box;
 display: inline-block;
 margin-right: -.25em;
 min-height: 1px;
 vertical-align: top;
}

#berufe .links {
 width: 15%;
}

#berufe .rechts {
 width: 85%;
}

#berufe .tabs {
 position: relative;
 margin: 0px auto;
}

#berufe .tabs .menu div {
display: inline-block;
border: 3px solid #eae7e2;
outline: 1px solid #afafaf;
text-transform: uppercase;
letter-spacing: 1px;
padding: 8px 20px;
width: 128px;
font-family: Calibri;
font-size: 9px;
margin-bottom: 8px;
cursor: pointer;
position: relative;
vertical-align: middle;
transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);
background-color: #dddad6;
}

#berufe .tabs .menu div.active {
 color: #eae7e2;
background-image: url(http://gtbt.fabulousworld.de/images/meadow/kategorien.png);
}

#berufe .content {
margin-left: 40px;
margin-top: -1px;
}

ul.tab {
 position: relative;
 height: 0px;
 list-style: none;
 margin: 0;
 padding: 0;
 transition: .3s all cubic-bezier(0.075, 0.82, 0.165, 1);
}

ul.tab li {
 opacity: 0;
position: fixed;
 transform: translateX(50px);
 list-style: none;
}

ul.tab li.active {
 opacity: 1;
 transform: translateX(0px);
 position: relative;
}

ul.tab li p {
 margin: 0;
}

#berufe .inhalt_scroll {
}

/* inhalt */

#berufe .box {
width: 229px;
height: 300px;
float: left;
background-color: #dddad6;
border: 3px solid #eae7e2;
outline: 1px solid #afafaf;
margin: 1px 0px 5px 6px;
padding: 1px;
}

#berufe .box .top {
box-sizing: border-box;
padding: 10px;
background-color: #eae7e2;
outline: 1px solid #afafaf;
margin-top: 5px;
margin-right: 1px;
text-align: justify;
line-height: 120%;
}

#berufe #beschreibung {
	height: 80px;
    line-height: 120%;
}

#berufe .pic {
box-sizing: border-box;
padding: 5px;
background-color: #eae7e2;
outline: 1px solid #afafaf;
margin-top: 5px;
margin-right: 1px;
text-align: justify;
line-height: 120%;
width: 50px;
margin-left: -3px;
height: 100px;
}