body {
  color: #fd7d57;
  background: #0A1951;
  font-family: 'Barlow', sans-serif;
  font-weight: 100; 
  padding: 0;
  margin: 0;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

article h1,h2,h3, p {
	width: 70%;
	-webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
}

article h1 {
	font-family: 'Fauna One', serif;
	font-weight: 400; 
	font-size: 3em;
	color: white;
	padding: 40px 0 0 120px;
	margin:  0;
}

article h2 {
	font-family: 'Barlow Semi Condensed', sans-serif;
	font-weight: 100; 
	font-size: 2.5em;
	color: #fd7d57;
	padding: 20px 0 0 120px;
	margin:  0;
}

article h3 {
	font-family: 'Barlow', sans-serif;
	font-weight: 100; 
	font-size: 2em;
	line-height: 1.3;
	color: white;
	padding: 30px 0 0 120px;
	margin:  0;
}

article p {
	font-family: 'Barlow', sans-serif;
	font-weight: 100; 
	font-size: 1.3em;
	line-height: 1.6;

	color: white;
	padding: 30px 0 0 120px;
	margin:  0;
}

.logowrapper {
	padding: 30px 30px 15px 30px;
	
}

.radixlogo {
	height: 100px;
	margin: 0 auto;
	background-image: url('RadixLogoColor.png');
    background-image: url('RadixLogoColor.svg');
	background-repeat: no-repeat;
	background-size: contain;
}

main {
	margin-left: 250px;
}

.bilder {
	width: 100%
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 8% 100%);
	clip-path: polygon(0 0, 100% 0, 100% 100%, 8% 100%);
}

.videowrapper {
	margin-left: 60px;
	position: relative;
  padding-bottom: 25%;
  height: 0; 
  overflow: hidden;
	
	display: inline-block;
  width: 100%
  height: 250px;
  cursor: pointer;
  clip-path: polygon(20% 0%, 80% 0%, 100% 100%, 0% 100%);
  animation: polygons 4s alternate infinite;
  
}

@keyframes polygons {
  25% {
    clip-path: polygon(20% 0%, 100% 38%, 70% 90%, 0% 100%);
   
  }
  50% {
    clip-path: polygon(0 46%, 100% 15%, 55% 74%, 0 100%);

  }
  75% {
    clip-path: polygon(100% 38%, 100% 38%, 66% 100%, 0 53%);

  }
}

.bilder img {
  width: 100%;
  
}

#team {
	color: #006699;
	padding-top: 70px;
	width: 70%;
	text-align: center;
	margin-left: 80px;
}

#team_tabelle {
	margin: 0 auto;
	text-align: center;
}

.personen {
	font-family: 'Fauna One', serif;
	font-weight: 400; 
	font-size: 1.5em;
	color: #fd7d57;
	margin:  0;
	text-align: center;

}

.positionen {
	font-family: 'Barlow', sans-serif;
	font-weight: 400; 
	font-size: 1.3em;
	line-height: 1.5;
	color: white;
	margin:  0;
	text-align: center;

}

.reihen {
	height: 50px;
}

.zellen {
	width: 33%;
	
}

.zellen img {
	width: 350px;
	margin: 0 auto;
	padding: 5px 30px;
	text-align: center;
}

@media only screen and (max-width: 1200px) {
	.zellen img {
	width: 250px;
	margin: 0 auto;
	padding: 5px 30px;
}
}

.sidebar-toggle {
  margin-left: -240px;
}
.sidebar {
  width: 240px;
  height: 100%;
  /* background: #293949; */
  position: absolute;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  z-index: 100;
}
.sidebar #leftside-navigation ul,
.sidebar #leftside-navigation ul ul {
  margin: -2px 0 0;
  padding: 0;
}
.sidebar #leftside-navigation ul li {
  list-style-type: none;
  border-bottom: 0px solid rgba(255, 255, 255, 0.2);
}
.sidebar #leftside-navigation ul li.active > a {
  color: #fd7d57;
}
.sidebar #leftside-navigation ul li.active ul {
  display: block;
}
.sidebar #leftside-navigation ul li a {
  color: #fd7d57;
  text-decoration: none;
  display: block;
  padding: 8px 0 8px 30px;
  font-size: 1.3em;
  outline: 0;
  -webkit-transition: all 200ms ease-in;
  -moz-transition: all 200ms ease-in;
  -o-transition: all 200ms ease-in;
  -ms-transition: all 200ms ease-in;
  transition: all 200ms ease-in;
}
.sidebar #leftside-navigation ul li a:hover {
  color: white;
}
.sidebar #leftside-navigation ul li a span {
  display: inline-block;
}
.sidebar #leftside-navigation ul li a i {
  width: 20px;
}
.sidebar #leftside-navigation ul li a i .fa-angle-left,
.sidebar #leftside-navigation ul li a i .fa-angle-right {
  padding-top: 3px;
}
.sidebar #leftside-navigation ul ul {
  display: none;
}
.sidebar #leftside-navigation ul ul li {
  /* background: #23313f; */
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  border-bottom: none;
}
.sidebar #leftside-navigation ul ul li a {
  font-size: 1.3em;
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 50px;
  color: #aeb2b7;
}


/* NAVIGATION */

nav ul li a,
nav ul li a:after,
nav ul li a:before {
  transition: all .5s;
}
nav ul li a:hover {
  color: #555;
}

nav.stroke ul li a,
nav.fill ul li a {
  position: relative;
}

nav.stroke ul li a:after,
nav.fill ul li a:after {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 0%;
  content: '.';
  color: transparent;
  background: #aaa;
  height: 1px;
}
nav.stroke ul li a:hover:after {
  width: 100%;
}

nav.fill ul li a {
  transition: all 2s;
}

nav.fill ul li a:after {
  text-align: left;
  content: '.';
  margin: 0;
  opacity: 0;
}
nav.fill ul li a:hover {
  color: #fff;
  z-index: 1;
}
nav.fill ul li a:hover:after {
  z-index: -10;
  animation: fill 1s forwards;
  -webkit-animation: fill 1s forwards;
  -moz-animation: fill 1s forwards;
  opacity: 1;
}

/* Circle */
nav.circle ul li a {
  position: relative;
  overflow: hidden;
  z-index: 1;
}
nav.circle ul li a:after {
  display: block;
  position: absolute;
  margin: 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  content: '.';
  color: transparent;
  width: 1px;
  height: 1px;
  border-radius: 50%;
  background: transparent;
}
nav.circle ul li a:hover:after {
  -webkit-animation: circle 1.5s ease-in forwards;
}

nav.shift ul li a {
  position:relative;
  z-index: 1;
}
nav.shift ul li a:hover {
  color: #91640F;
}
nav.shift ul li a:after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 1px;
  content: '.';
  color: transparent;
  background: #F1C40F;
  visibility: none;
  opacity: 0;
  z-index: -1;
}
nav.shift ul li a:hover:after {
  opacity: 1;
  visibility: visible;
  height: 100%;
}


@-webkit-keyframes fill {
  0% {
    width: 0%;
    height: 1px;
  }
  50% {
    width: 100%;
    height: 1px;
  }
  100% {
    width: 100%;
    height: 100%;
    background: #333;
  }
}

@-webkit-keyframes circle {
  0% {
    width: 1px;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    height: 1px;
    z-index: -1;
    background: #eee;
    border-radius: 100%;
  }
  100% {
    background: #aaa;
    height: 5000%;
    width: 5000%;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-radius: 0;
  }
}

@media only screen and (max-width: 900px) {
	article h1,h2,h3, p {
	width: auto;
	padding: 20px !important;
	}
	
	article {
	z-index: auto;
	width: 100%;
	}
	
	.sidebar {
	width: 100%;
	z-index: auto;
	position: static;
	}
	
	main {
	padding: 20px 0;
	margin: 0;
	z-index: auto;
	}
	
	.radixlogo {
	background-position: center;
	}
	
	.sidebar #leftside-navigation  {
		text-align: center;
	}
	
	.sidebar #leftside-navigation ul li a {
		padding: 15px;
	}
	
	.sidebar #leftside-navigation ul ul li a {
		padding: 10px;
	}
	
	.videowrapper {
	margin-left: 0;
	}
	
	.zellen img {
	width: 100%
	margin: 0 auto;
	padding: 5px 30px;
	
	}
	
	.zellen {
	margin: 0 auto;
	text-align: center;
	width: 100%;
	}
	
	table{
        width:100%;
		text-align: center;
    }

    td{
        display:block;
        width:100%;
		text-align: center;
		
    }
	
	#team {
		padding: 0;
		margin: 0;
		width: 100%;
	
	}

}