body {
  font-family: "Titillium Web";

  font-weight: 400;
  font-size: 0.8em;
  margin: 0;
  padding: 0;
}

#header {
  position: fixed;
  box-sizing: border-box;
  z-index: 100;
  background-color: #1c0e52;
  border-bottom: 2px solid #64c3d5;
  top: 0;
  left: 0;
  right: 0;
  height: 4em;
  transition: all 400ms ease 0s;
}

/* BOF Hamburger-Button und -zeile: */
.collapse-button {
  /*
  float: right;

  margin-right: 1.5em;
  margin-top: 2em;
  height: 2em;
  */
  position: absolute;
  right:1.5em;
  top:2em;
  height: 2em;
  width: 2em;


  cursor: pointer;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.navicon,
.navicon::before,
.navicon::after {
  transition: all 150ms ease 0s;
  background: none repeat scroll 0 0 #64c3d5;
  height: 0.2em;
  width: 2em;
  /*position: relative;*/
    position: absolute;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;

}
.navicon{top:0;}

.navicon::before,
.navicon::after {
  content: "";
  display: block;

}
.navicon::before {
  top: 0.6em;
}
.navicon::after {
  top: -0.6em;
}

.collapse-button:hover .navicon,
.collapse-button:hover .navicon::before,
.collapse-button:hover .navicon::after {
  background: none repeat scroll 0 0 #fff;
}

.collapse-button:active .navicon,
.collapse-button:active .navicon::before,
.collapse-button:active .navicon::after {
  background: none repeat scroll 0 0 #ccc;
}

.collapse-button.open .navicon {
  background: none repeat scroll 0 0 transparent;
}
.collapse-button.open .navicon::before,
.collapse-button.open .navicon::after {
  top: 0;
}
.collapse-button.open .navicon::before {
  transform: rotate(-45deg);
  transform-origin: 50% 50% 0;
}
.collapse-button.open .navicon::after {
  transform: rotate(45deg);
  transform-origin: 50% 50% 0;
}

/* EOF Hamburger-Button und -zeile */

#mainnav {
  background-color: #1c0e52;
  list-style-type: none;
  margin: 0;
  padding: 0;
  position: absolute;
  z-index: 104;
  top: 4em;
  right: 0;
}

#mainnav li,
#mainnav li a {
  display: block;
}

#mainnav li {
  padding: 0 1.5em;
}
#mainnav li a {
  text-align: center;
  padding: 0.2em 2em;
  min-width: 200px;
  color: #64c3d5;
  text-transform: uppercase;
  text-decoration: none;
  font-size: 1.5em;
  border-top: 1px solid #32467b;
}
#mainnav li:hover,
#mainnav li.active {
  background-color: #160b42;
}
#mainnav li:hover a,
#mainnav li.active a {
  color: #fff;
}

#lang_select {
	/*
  float: right;
  margin-right: 2em;
  margin-top: 1.1em;
  width: 4em;
  height: 2em;
  */
  position: absolute;
  right:4.5em;
  top:1.25em;

  cursor: pointer;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #64c3d5;
  text-transform: uppercase;
}
#lang_select a {
  color: #64c3d5;
  text-decoration: none;
  display: inline-block;
}
#lang_select a:hover {
  color: #ccc;
}
#lang_select a.active {
  color: #fff;
  font-weight: bold;
}
#lang_select a:first-child::after {
  content: "|";
  display: inline-block;
  margin: 0 0.2em 0 0.5em;
  font-weight: normal;
  color: #64c3d5;
  font-size: 1.1em;
}
#wrapper {
  overflow: hidden;
  padding-top: 4em;
}

/* BOF section PANELS allgem. */
section {
  /*
	border-bottom:1px solid #ccc;
	*/
  min-height: 200px;
  margin-bottom: 10em;
  text-align: center;
}
/* EOF section PANELS allgem. */
.clear {
  clear: both;
}
h1,
h2 {
  color: #64c3d5;
  font-size: 6em;
  font-weight: 300;
  text-transform: uppercase;
  margin: 10px 0;
  padding: 0;
}

h3 {
  color: #1c0e52;
  font-size: 1.5em;
  font-style: italic;
  font-weight: 600;
  text-transform: uppercase;
  margin: 10px 0;
  padding: 0;
}

table {
  border-collapse: collapse;
  width: 100%;
  margin-top: 1.5em;
  margin-bottom: 2em;
}

th, td {
  padding: 8px;
  text-align: left;
  border-bottom: 1px solid #97a1ad;
}

tr:hover {background-color:#f5f5f5;}

.button {
  display: inline-block;
  background-color: #1c0e52;
  border-radius: 10px;
  color: #64c3d5;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 2em;
  border: 1px solid #64c3d5;
  margin: 30px 25px;
  padding: 4px 30px;
  min-width: 250px;
}
.button:hover {
  color: #fff;
  background-color: #64c3d5;

  -webkit-transition: background-color 200ms linear;
  -ms-transition: background-color 200ms linear;
  transition: background-color 200ms linear;
}
.button:active {
  color: #1c0e52;
  border: 1px solid #1c0e52;
  background-color: #64c3d5;
}

.content {
  text-align: left;
  color: #1c0e52;
  font-size: 1.5em;
  font-weight: 400;
  line-height: 1.3;
  margin: 0 auto;
  padding:0 2%;

	max-width:800px;
}
.content .cols p table{
  -webkit-column-count: 1;
  -webkit-column-gap: 40px;
  -moz-column-count: 1;
  -moz-column-gap: 40px;
  column-count: 1;
  column-gap: 40px;
}

#cookie-bar p{
  font-size: 1.5em;
  font-weight: 400;
  line-height: 1.6;
}
.content p {
  font-family: Verdana, arial, sans-serif;
}
.content blockquote {
  font-family: 'Titillium Web';
  font-style: italic;
  font-weight: 300;

  margin:0;
  padding:0;
}
.content h4 {
  font-weight: 700;
}

.popIn {
  transition: opacity 2s ease 0.1s;
  opacity: 0;
}
.popIn.ready {
  opacity: 1;
}

.logo {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../img/logo_ol.png");
  margin: 2% 40%;
  min-height: 30px;
  padding-top: 20%;
}
#header .logo {
  float: left;
  display: block;
  margin: 0.5em 0 0 1em;
  padding: 0;
  height: 3.5em;
  width: 9em;
  background-image: url("../img/logoh_od.png");
  background-position: left top;
  box-sizing: border-box;
}

/* BOF VIDEO */

.logo.od {
  background-image: url("../img/logo_od.png");
  position: relative;
  padding-bottom: 20px;
  margin: auto;
  width: 30%;
  display: inline-block;
  box-sizing: border-box;
  background-position: right center;
}
#overlay {
}
#video h1 {
  font-size: 4em;
  line-height: 1;
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  width: 30%;
  text-align: left;
}
#video h1 strong {
  font-weight: 700;
  font-size: 1.1em;
}

/*
#play{
	display:inline-block;
	box-sizing:border-box;
	position:relative;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-image: url("../img/play.png");
	margin: 4% 20%;
	width:10%;
	padding-top: 10%;
	cursor:pointer;

}
#play:hover{background-position: center center;}
#play:active{background-position: center bottom;}
*/

#play {
  display: inline-block;
  box-sizing: border-box;
  position: relative;
  margin: 4% 20%;
  width: 120px;
  height: 120px;
  cursor: pointer;
  background-color: #64c3d5;
  border-radius: 50%;
  border: 3px solid #64c3d5;
}
#play span {
  display: inline-block;
  position: absolute;
  left: 38%;
  top: 24%;
  bottom: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 0 30px 45px;
  border-color: transparent transparent transparent #1c0e52;
}
#play:hover span {
  border-color: transparent transparent transparent #fff;
}
#play:active {
  background-color: #1c0e52;
  border-color: #64c3d5;
}
#play:active span {
  border-color: transparent transparent transparent #64c3d5;
}

/* BOF VIDEO-LOOK-A-LIKE */
.animated_bg {
  /*
	background-image:url("../img/movie_slide/slide_01.jpg") no-repeat center center;
	background-size: cover;

	transition: background 3s;
	position:relative;
	*/
  padding: 4% 5%;
}

.animated_bg:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #1c0e52;
  opacity: 0.6;
}

#videofull {
  display: none;
  width: 100%;
  height: auto;
}
#video .content.newsletter{
	text-align: center;
}
/* EOF VIDEO */

/* BOF ABOUT */
#about .content {
  margin-bottom: 2vh;
}
#about h2 {
  text-align: left;
  font-weight: 700;
  font-size: 2.5em;
  margin: 0 0 2vh 0;
  padding-bottom: 0;
  display: block;
  box-sizing: border-box;
  float: left;
  width: 75%;
}
#about .logo {
  width: 25%;
  box-sizing: border-box;
  margin: 0 0 3vh 0;
  padding: 25% 0 0 0;
  display: inline-block;
  float: right;
  background-position: right top;
}
#about p {
  display: inline-block;
  box-sizing: border-box;
  margin-top: 0;
  padding-top: 0;
}
#about .images.bottom {
  margin-bottom: 3vh;
}
#about .images.bottom img {
  width: 12%;
  margin: 10px;
  height: auto;
  display: inline-block;
}

#about p img {
  display: none;
}
/* EOF ABOUT */

/* BOF DATE TIME */
/*
#datetime .content {
  margin: 8vh 15%;
}
.c_left,
.c_right {
  display: inline-block;
  box-sizing: border-box;
}
.c_left {
  box-sizing: border-box;
  width: 24%;
  vertical-align: top;
  padding-right: 6%;
  text-align: center;
}
.c_right {
  box-sizing: border-box;
  width: 70%;
}

#datetime .logo {
  margin: 8vh 0;
  padding-top: 65%;
  margin-left: 15%;
}

#datetime .c_left h3 {
  font-style: normal;
}
#datetime .c_left a {
  text-decoration: none;
  color: #64c3d5;
  font-weight: 700;
  margin-top: 100px;
}
#datetime .c_left p {
  margin-top: 100px;
}

#datetime .c_right h5 {
  text-transform: uppercase;
  padding: 0;
  margin: 0;
}

*/
#datetime ul.names {
  list-style-type: none;
  box-sizing: border-box;
  text-align: left;
  padding: 0;
  margin: 0 auto;
  width: 100%;
}


#datetime ul.names li {
  display: block;
  box-sizing: border-box;
  width: 100%;
  vertical-align:middle;
  margin: 10px 0;
  clear: both;
}
#datetime ul.names li span {
  display: inline-block;
  box-sizing: border-box;
  vertical-align: middle;
}
#datetime ul.names li span.round {
  box-sizing: border-box;
  padding-top: calc(25% - 16px);
  width: 25%;
  border-radius: 50%;
  border: 8px solid #1c0e52;
  background-color: #eee;
  margin-top:3%;
  background-repeat:no-repeat;
  background-size:cover;
}

#datetime ul.names li span.round.seehofer {background-image:url(../img/zitat_seehofer.jpg);}
#datetime ul.names li span.round.hermann {background-image:url(../img/zitat_hermann.jpg);}
#datetime ul.names li span.round.reiter {background-image:url(../img/zitat_reiter.jpg);}

/*
#datetime ul.names li span.round.cycling{	border-color:#d52b1e;}
#datetime ul.names li span.round.athletics{ border-color:#ff7900;}
#datetime ul.names li span.round.triathlon{ border-color:#f9e300;}
#datetime ul.names li span.round.golf{	  	border-color:#69be28;}
#datetime ul.names li span.round.rowing{	border-color:#00b2a9;}
#datetime ul.names li span.round.gymnastics{border-color:#ca005d;}
*/

#datetime ul.names li span.text {
  width: 69%;
  margin: 10px 0 10px 4%;
  box-sizing: border-box;
}

#datetime ul.names li:nth-child(even) span.round {
  float:right;
  margin-top:7%;
}
#datetime ul.names li:nth-child(even) span.text {
  margin: 10px 4% 10px 0;
}
/* EOF DATE TIME */

/* BOF DISCIPLINES */
#disciplines {
}
#disciplines .logo {
  margin: 2% 37% 2% 40%;
}
#disciplines ul.cb {
  list-style-type: none;
  text-align: center;
  padding: 0;
  margin: 30px 15%;
}
#disciplines ul.cb li {
  display: inline-block;
  width: 13%;
  background-color: #1c0e52;
  border-radius: 50%;
  padding: 13% 0 0 0;
  margin: 0 2% 0 0;

  background-position: center center;
  background-repeat: no-repeat;
  background-size: 57%;
  cursor: pointer;

  -webkit-transition: background-color 200ms linear,
    background-size 200ms ease-out, background-position 200ms ease-out,
    opacity 2s ease 0.1s;
  -ms-transition: background-color 200ms linear, background-size 200ms ease-out,
    background-position 200ms ease-out, opacity 2s ease 0.1s;
  transition: background-color 200ms linear, background-size 200ms ease-out,
    background-position 200ms ease-out, opacity 2s ease 0.1s;
}

#disciplines ul.cb li:hover {
  background-size: 62%;
}

/* BOF eigene Größen */
#disciplines ul li.triathlon {
  background-size: 70%;
}
#disciplines ul li.triathlon:hover {
  background-size: 75%;
}

#disciplines ul li.golf {
  background-size: auto 60%;
}
#disciplines ul li.golf:hover {
  background-size: auto 65%;
}

#disciplines ul li.rowing {
  background-size: 63% auto;
  background-position: center 55%;
}
#disciplines ul li.rowing:hover {
  background-size: 68% auto;
}

#disciplines ul li.gymnastics {
  background-size: 42%;
}
#disciplines ul li.gymnastics:hover {
  background-size: 45%;
}
/* EOF eigene Größen */

#disciplines ul li.cycling {
  background-image: url("../img/discip/cycling_c_od.svg");
}
#disciplines ul li.athletics {
  background-image: url("../img/discip/athletics_c_od.svg");
}
#disciplines ul li.triathlon {
  background-image: url("../img/discip/triathlon_c_od.svg");
}
#disciplines ul li.golf {
  background-image: url("../img/discip/golf_c_od.svg");
}
#disciplines ul li.rowing {
  background-image: url("../img/discip/rowing_c_od.svg");
}
#disciplines ul li.gymnastics {
  background-image: url("../img/discip/gymnastics_c_od.svg");
}

#disciplines ul li.cycling:hover {
  background-image: url("../img/discip/cycling_t_od.svg");
}
#disciplines ul li.athletics:hover {
  background-image: url("../img/discip/athletics_t_od.svg");
}
#disciplines ul li.triathlon:hover {
  background-image: url("../img/discip/triathlon_t_od.svg");
  background-position: 53% center;
}
#disciplines ul li.golf:hover {
  background-image: url("../img/discip/golf_t_od.svg");
}
#disciplines ul li.rowing:hover {
  background-image: url("../img/discip/rowing_t_od.svg");
}
#disciplines ul li.gymnastics:hover {
  background-image: url("../img/discip/gymnastics_t_od.svg");
}

#disciplines ul li.cycling:active {
  background-color: #d52b1e;
  background-image: url("../img/discip/cycling_t_ol.svg");
}
#disciplines ul li.athletics:active {
  background-color: #ff7900;
  background-image: url("../img/discip/athletics_t_ol.svg");
}
#disciplines ul li.triathlon:active {
  background-color: #f9e300;
  background-image: url("../img/discip/triathlon_t_ol.svg");
}
#disciplines ul li.golf:active {
  background-color: #69be28;
  background-image: url("../img/discip/golf_t_ol.svg");
}
#disciplines ul li.rowing:active {
  background-color: #00b2a9;
  background-image: url("../img/discip/rowing_t_ol.svg");
}
#disciplines ul li.gymnastics:active {
  background-color: #ca005d;
  background-image: url("../img/discip/gymnastics_t_ol.svg");
}

/* BOF DISCIPLINES sub */

.slick-prev:before,
.slick-next:before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
}
.slick-prev {
  z-index: 90;
}
.slick-prev:before {
  border-width: 25px 25px 25px 0;
  border-color: transparent #cccccc transparent transparent;
  z-index: 91;
  overflow:hidden;
}
.slick-next {
  z-index: 92;
}
.slick-next:before {
  border-width: 25px 0 25px 25px;
  border-color: transparent transparent transparent #cccccc;
  z-index: 93;
  overflow:hidden;
}

.hpanel {
  border-top: 5vh solid #1c0e52;
  border-bottom: 5vh solid #1c0e52;
  box-sizing: border-box;
  min-height: 100vh;

  position: relative;
}

.hpanel.h_start {
}
.hpanel.h_cycling {
  border-color: #d52b1e;
}
.hpanel.h_athletics {
  border-color: #ff7900;
}
.hpanel.h_triathlon {
  border-color: #f9e300;
}
.hpanel.h_golf {
  border-color: #69be28;
}
.hpanel.h_rowing {
  border-color: #00b2a9;
}
.hpanel.h_gymnastics {
  border-color: #ca005d;
}

#disciplines ul.subnav {
  padding: 5vh 10vw 0 10vw;
  margin: 0;
  list-style-type: none;
}
#disciplines ul.subnav li {
  display: inline-block;
  box-sizing: border-box;
  margin: 0;
  padding: 3% 0;
  width: 16%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  cursor: pointer;

  -webkit-transition: all 200ms ease-out;
  -ms-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}

#disciplines ul.subnav li.sub_cycling {
  background-image: url("../img/discip/cycling_t_ol.svg");
}
#disciplines ul.subnav li.sub_athletics {
  background-image: url("../img/discip/athletics_t_ol.svg");
}
#disciplines ul.subnav li.sub_triathlon {
  background-image: url("../img/discip/triathlon_t_ol.svg");
}
#disciplines ul.subnav li.sub_golf {
  background-image: url("../img/discip/golf_t_ol.svg");
}
#disciplines ul.subnav li.sub_rowing {
  background-image: url("../img/discip/rowing_t_ol.svg");
}
#disciplines ul.subnav li.sub_gymnastics {
  background-image: url("../img/discip/gymnastics_t_ol.svg");
}

/*
#disciplines ul.subnav li.sub_cycling:hover{	background-image: url("../img/discip/cycling_t_od.svg");}
#disciplines ul.subnav li.sub_athletics:hover{	background-image: url("../img/discip/athletics_t_od.svg");}
#disciplines ul.subnav li.sub_triathlon:hover{	background-image: url("../img/discip/triathlon_t_od.svg");}
#disciplines ul.subnav li.sub_golf:hover{		background-image: url("../img/discip/golf_t_od.svg");}
#disciplines ul.subnav li.sub_rowing:hover{	background-image: url("../img/discip/rowing_t_od.svg");}
#disciplines ul.subnav li.sub_gymnastics:hover{ background-image: url("../img/discip/gymnastics_t_od.svg");}
*/

/*
#disciplines ul.subnav li.sub_cycling:hover {
  background-image: url("../img/discip/cycling_c_od.svg");
}
#disciplines ul.subnav li.sub_athletics:hover {
  background-image: url("../img/discip/athletics_c_od.svg");
}
#disciplines ul.subnav li.sub_triathlon:hover {
  background-image: url("../img/discip/triathlon_c_od.svg");
  background-position: 53% center;
}
#disciplines ul.subnav li.sub_golf:hover {
  background-image: url("../img/discip/golf_c_od.svg");
}
#disciplines ul.subnav li.sub_rowing:hover {
  background-image: url("../img/discip/rowing_c_od.svg");
}
#disciplines ul.subnav li.sub_gymnastics:hover {
  background-image: url("../img/discip/gymnastics_c_od.svg");
}

#disciplines ul.subnav li.sub_cycling.active {
  background-image: url("../img/discip/cycling_c_od.svg");
}
#disciplines ul.subnav li.sub_athletics.active {
  background-image: url("../img/discip/athletics_c_od.svg");
}
#disciplines ul.subnav li.sub_triathlon.active {
  background-image: url("../img/discip/triathlon_c_od.svg");
}
#disciplines ul.subnav li.sub_golf.active {
  background-image: url("../img/discip/golf_c_od.svg");
}
#disciplines ul.subnav li.sub_rowing.active {
  background-image: url("../img/discip/rowing_c_od.svg");
}
#disciplines ul.subnav li.sub_gymnastics.active {
  background-image: url("../img/discip/gymnastics_c_od.svg");
}
*/
h2.rotated {
  display: block;
  position: absolute;
  box-sizing: border-box;
  right: 10vw;
  bottom: 6vh;
  width: 50px;
  height: 50px;

  text-align: left;
  padding: 0;
  margin: 0;
}
h2.rotated span {
  display: block;
  transform: rotate(-90deg);
  font-weight: 700;
}
.hpanel.h_cycling h2.rotated span {
  color: #d52b1e;
}
.hpanel.h_athletics h2.rotated span {
  color: #ff7900;
}
.hpanel.h_triathlon h2.rotated span {
  color: #f9e300;
}
.hpanel.h_golf h2.rotated span {
  color: #69be28;
}
.hpanel.h_rowing h2.rotated span {
  color: #00b2a9;
}
.hpanel.h_gymnastics h2.rotated span {
  color: #ca005d;
}

.hpanel .copy {
	box-sizing: border-box;
	text-align: left;
	padding: 5vh 15vw;
	font-family: Verdana, arial, sans-serif;
}

.hpanel .copy p {
	display: inline-block;
	box-sizing: border-box;
	color: #1c0e52;
	font-size: 1.5em;
	font-weight: 400;
	line-height: 1.3;
}
p.note {
  font-size: 1.6em;
}

.hpanel .copy img {
  background-color: #ccc;
  box-sizing: border-box;
  display: inline-block;
}
.hpanel .copy a {
  text-decoration: none;
  color: #666;
}
.hpanel .copy a:hover {
  text-decoration: underline;
}

.hpanel .copy img.big {
  width: 33%;
  height: auto;
}
.hpanel .copy img.small {
  width: 18%;
  height: auto;
  margin-bottom: 0;
}

.hpanel .copy img.left {
  float: left;
  margin: 0 1vw 1vw 0;
}
.hpanel .copy img.right {
  float: right;
  margin: 0 0 1vw 1vw;
}

.hpanel.h_cycling .copy img.big {width: 35%;}
.hpanel.h_cycling .copy img.small {width: 15%;}
/* EOF DISCIPLINES sub */
/* EOF DISCIPLINES */

#social {
  margin: 50px 15%;
}
.metapage #social {
  margin: 50px auto;
  text-align:center;
}

#social a {
  display: inline-block;
  width: 10%;
  background-color: #1c0e52;
  border-radius: 50%;
  padding: 0;
  margin: 0 5% 0 0;
}
#social a:last-child{margin-right: 0;}
#social a .ico {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 75% auto;
  display: block;
  padding-top: 100%;
  filter: invert(100%) sepia(100%) saturate(2%) hue-rotate(309deg)
    brightness(101%) contrast(101%);
  -webkit-filter: invert(100%) sepia(100%) saturate(2%) hue-rotate(309deg)
    brightness(101%) contrast(101%);
}
/*
#social a.fb .ico{ background-image: url("../img/social/fb.svg");}
#social a.ig .ico{ background-image: url("../img/social/ig.svg");}
#social a.tw .ico{ background-image: url("../img/social/tw.svg"); background-size:65% auto;}
#social a.yt .ico{ background-image: url("../img/social/yt.svg"); background-size:65% auto;}
*/

#social a.fb .ico {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50' enable-background='new 0 0 50 50'%3E%3Cpath d='M26 20v-3c0-1.3.3-2 2.4-2H31v-5h-4c-5 0-7 3.3-7 7v3h-4v5h4v15h6V25h4.4l.6-5h-5z'/%3E%3C/svg%3E");
}
#social a.ig .ico {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 54 54' style='enable-background:new 0 0 54 54;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E.st0%7Bfill:none;%7D%3C/style%3E%3Crect x='-0.2' y='0.1' class='st0' width='53.8' height='53.4'/%3E%3Cpath d='M48.1,26.3c0,4.3,0,7.2-0.1,8.8c-0.2,3.9-1.3,6.9-3.5,9s-5.1,3.3-9,3.5c-1.6,0.1-4.6,0.1-8.8,0.1c-4.3,0-7.2,0-8.8-0.1%0Ac-3.9-0.2-6.9-1.3-9-3.5c-2.1-2.1-3.3-5.1-3.5-9c-0.1-1.6-0.1-4.6-0.1-8.8s0-7.2,0.1-8.8c0.2-3.9,1.3-6.9,3.5-9%0Ac2.1-2.1,5.1-3.3,9-3.5c1.6-0.1,4.6-0.1,8.8-0.1c4.3,0,7.2,0,8.8,0.1c3.9,0.2,6.9,1.3,9,3.5s3.3,5.1,3.5,9%0AC48,19.1,48.1,22,48.1,26.3z M28.8,8.7c-1.3,0-2,0-2.1,0c-0.1,0-0.8,0-2.1,0c-1.3,0-2.3,0-2.9,0c-0.7,0-1.6,0-2.7,0.1%0Ac-1.1,0-2.1,0.1-2.9,0.3c-0.8,0.1-1.5,0.3-2,0.5c-0.9,0.4-1.7,0.9-2.5,1.6c-0.7,0.7-1.2,1.5-1.6,2.5c-0.2,0.5-0.4,1.2-0.5,2%0As-0.2,1.7-0.3,2.9c0,1.1-0.1,2-0.1,2.7c0,0.7,0,1.7,0,2.9c0,1.3,0,2,0,2.1s0,0.8,0,2.1c0,1.3,0,2.3,0,2.9c0,0.7,0,1.6,0.1,2.7%0Ac0,1.1,0.1,2.1,0.3,2.9s0.3,1.5,0.5,2c0.4,0.9,0.9,1.7,1.6,2.5c0.7,0.7,1.5,1.2,2.5,1.6c0.5,0.2,1.2,0.4,2,0.5%0Ac0.8,0.1,1.7,0.2,2.9,0.3s2,0.1,2.7,0.1c0.7,0,1.7,0,2.9,0c1.3,0,2,0,2.1,0c0.1,0,0.8,0,2.1,0c1.3,0,2.3,0,2.9,0%0Ac0.7,0,1.6,0,2.7-0.1c1.1,0,2.1-0.1,2.9-0.3c0.8-0.1,1.5-0.3,2-0.5c0.9-0.4,1.7-0.9,2.5-1.6c0.7-0.7,1.2-1.5,1.6-2.5%0Ac0.2-0.5,0.4-1.2,0.5-2c0.1-0.8,0.2-1.7,0.3-2.9c0-1.1,0.1-2,0.1-2.7c0-0.7,0-1.7,0-2.9c0-1.3,0-2,0-2.1s0-0.8,0-2.1%0Ac0-1.3,0-2.3,0-2.9c0-0.7,0-1.6-0.1-2.7c0-1.1-0.1-2.1-0.3-2.9c-0.1-0.8-0.3-1.5-0.5-2c-0.4-0.9-0.9-1.7-1.6-2.5%0Ac-0.7-0.7-1.5-1.2-2.5-1.6c-0.5-0.2-1.2-0.4-2-0.5c-0.8-0.1-1.7-0.2-2.9-0.3c-1.1,0-2-0.1-2.7-0.1C31.1,8.7,30.1,8.7,28.8,8.7z%0AM34.4,18.5c2.1,2.1,3.2,4.7,3.2,7.8s-1.1,5.6-3.2,7.8c-2.1,2.1-4.7,3.2-7.8,3.2c-3.1,0-5.6-1.1-7.8-3.2c-2.1-2.1-3.2-4.7-3.2-7.8%0As1.1-5.6,3.2-7.8c2.1-2.1,4.7-3.2,7.8-3.2C29.7,15.3,32.3,16.3,34.4,18.5z M31.7,31.3c1.4-1.4,2.1-3.1,2.1-5s-0.7-3.7-2.1-5.1%0Ac-1.4-1.4-3.1-2.1-5.1-2.1c-2,0-3.7,0.7-5.1,2.1s-2.1,3.1-2.1,5.1s0.7,3.7,2.1,5c1.4,1.4,3.1,2.1,5.1,2.1%0AC28.6,33.4,30.3,32.7,31.7,31.3z M39.9,13c0.5,0.5,0.8,1.1,0.8,1.8c0,0.7-0.3,1.3-0.8,1.8c-0.5,0.5-1.1,0.8-1.8,0.8%0As-1.3-0.3-1.8-0.8c-0.5-0.5-0.8-1.1-0.8-1.8c0-0.7,0.3-1.3,0.8-1.8c0.5-0.5,1.1-0.8,1.8-0.8S39.4,12.5,39.9,13z'/%3E%3C/svg%3E%0A");
}
#social a.tw .ico {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z'/%3E%3C/svg%3E");
  background-size: 65% auto;
}
#social a.yt .ico {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M4.652 0h1.44l.988 3.702.916-3.702h1.454l-1.665 5.505v3.757h-1.431v-3.757l-1.702-5.505zm6.594 2.373c-1.119 0-1.861.74-1.861 1.835v3.349c0 1.204.629 1.831 1.861 1.831 1.022 0 1.826-.683 1.826-1.831v-3.349c0-1.069-.797-1.835-1.826-1.835zm.531 5.127c0 .372-.19.646-.532.646-.351 0-.554-.287-.554-.646v-3.179c0-.374.172-.651.529-.651.39 0 .557.269.557.651v3.179zm4.729-5.07v5.186c-.155.194-.5.512-.747.512-.271 0-.338-.186-.338-.46v-5.238h-1.27v5.71c0 .675.206 1.22.887 1.22.384 0 .918-.2 1.468-.853v.754h1.27v-6.831h-1.27zm2.203 13.858c-.448 0-.541.315-.541.763v.659h1.069v-.66c.001-.44-.092-.762-.528-.762zm-4.703.04c-.084.043-.167.109-.25.198v4.055c.099.106.194.182.287.229.197.1.485.107.619-.067.07-.092.105-.241.105-.449v-3.359c0-.22-.043-.386-.129-.5-.147-.193-.42-.214-.632-.107zm4.827-5.195c-2.604-.177-11.066-.177-13.666 0-2.814.192-3.146 1.892-3.167 6.367.021 4.467.35 6.175 3.167 6.367 2.6.177 11.062.177 13.666 0 2.814-.192 3.146-1.893 3.167-6.367-.021-4.467-.35-6.175-3.167-6.367zm-12.324 10.686h-1.363v-7.54h-1.41v-1.28h4.182v1.28h-1.41v7.54zm4.846 0h-1.21v-.718c-.223.265-.455.467-.696.605-.652.374-1.547.365-1.547-.955v-5.438h1.209v4.988c0 .262.063.438.322.438.236 0 .564-.303.711-.487v-4.939h1.21v6.506zm4.657-1.348c0 .805-.301 1.431-1.106 1.431-.443 0-.812-.162-1.149-.583v.5h-1.221v-8.82h1.221v2.84c.273-.333.644-.608 1.076-.608.886 0 1.18.749 1.18 1.631v3.609zm4.471-1.752h-2.314v1.228c0 .488.042.91.528.91.511 0 .541-.344.541-.91v-.452h1.245v.489c0 1.253-.538 2.013-1.813 2.013-1.155 0-1.746-.842-1.746-2.013v-2.921c0-1.129.746-1.914 1.837-1.914 1.161 0 1.721.738 1.721 1.914v1.656z'/%3E%3C/svg%3E");
  background-size: 65% auto;
}
#social a.in .ico {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' enable-background='new 0 0 24 24'%3E%3Cpath d='M4.98 3.5c0 1.381-1.11 2.5-2.48 2.5s-2.48-1.119-2.48-2.5c0-1.38 1.11-2.5 2.48-2.5s2.48 1.12 2.48 2.5zm.02 4.5h-5v16h5v-16zm7.982 0h-4.968v16h4.969v-8.399c0-4.67 6.029-5.052 6.029 0v8.399h4.988v-10.131c0-7.88-8.922-7.593-11.018-3.714v-2.155z'/%3E%3C/svg%3E");
  background-size: 55% auto;
}



#social a:hover {
  background-color: #64c3d5;
  -webkit-transition: background-color 200ms linear;
  -ms-transition: background-color 200ms linear;
  transition: background-color 200ms linear;
}
#social a:hover .ico {
}
#social a:active .ico {
  filter: none;
}

#map {
  background-image: url("../img/ec2022_map.jpg");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #1c1348;
  height: 100vh;

}

#jobs ul {list-style: none; margin-block-start: 1em; margin-block-end: 1em;}
#jobs li  {text-align: left; border-top: 1px solid #97a1ad;}
#jobs li h2  {font-size: 1.2em;}
#jobs li p {margin-block-end: 0em; padding-block-end: 1em;}
#jobs li:hover {background-color:#f5f5f5;}

@media (min-width: 1800px) and (orientation:landscape) {
	#map {
		min-height: 110vw;
	}
}
/*
.de #map {
  background-image: url("../img/map_de.png");
}
*/

#footer {
  color: #fff;
  text-align: center;
}
#footer ul {
  list-style-type: none;
  margin: 0 0 40px 0;
  padding: 0;
}
#footer li {
  display: inline-block;
  margin: 0 0 10px 10px;
}
#footer a {
  display: inline-block;
  text-decoration: none;
  text-transform: uppercase;
  color: #fff;
}
#footer a:hover,
#footer li.active a,
.metapage a:hover {
  color: #64c3d5;
}
#footer li::after {
  content: "|";
  margin: 0 0 0 10px;
}

#footer li:last-child::after {
  content: "";
  margin: 0 0 0 20px;
}
#circle_bg {
  overflow: hidden;
  height: 10vh;
  background-color: #fff;
  box-sizing: border-box;
}

#circle_bg div {
  background-color: #1c0e52;
  width: 200%;
  height: 75vh;
  border-radius: 50%;
  margin-left: -50%;
  border: 0px solid #fff;
}
#circle_content {
  background-color: #1c0e52;
  padding-bottom: 50px;
}

#footer h4 {
  padding: 0;
  margin: 0;
  font-size: 2em;
  font-weight: 200;
  line-height: 1.2;
  color: #ccc;
}

#jobs .content{text-align: center;}
#jobs h3{font-style:normal; margin: 6vh auto; text-transform:none;}
#jobs .header{font-weight:600; text-transform:uppercase; color:#64c3d5; font-style:italic;}
#jobs a{text-decoration:none; color:#1c0e52; font-weight:bold;}
#jobs a:hover{text-decoration:underline; color:#64c3d5;}

#jobs .images.bottom { margin: 3vh 0;}
#jobs .images.bottom img { width: 23%;  margin: 10px;  height: auto;  display: inline-block;}

/* BOF META-PAGES */
.metapage {
  min-height: 77vh;
	padding-top: 4vh;
}
.metapage h1{font-size:2.3em; padding-bottom: 2vh;}
.metapage a {
  text-decoration: none;
  color: #1c0e52;
}
/* EOF META-PAGES */

/* BOF RESPONSIVE */

@media only screen and (min-device-width: 320px) and (max-device-width: 400px) {
  #header,
  #footer {
    font-size: 3em;
  }
  /*#play, #play span{ transform: scale(0.8);}*/
  #mainnav {
    left: 0;
  }
  #mainnav li {
    padding: 0;
    width: 100%;
  }
  #mainnav li a {
    min-width: inherit;
    padding: 0.4em 0;
    width: 100%;
  }
  #wrapper {
    padding-top: 24em;
    font-size: 0.5em;
  }
  .button {
    font-size: 8em;
    margin: 30px 0;
  }
  #footer h4 {
    font-size: 1em;
    padding: 0;
    margin: 0;
  }

  #disciplines h2 {
    font-size: 14em;
    font-weight: 700;
  }
  #disciplines ul.cb {
    margin: 0 5vw 0 6vw;
  }
  #disciplines ul.cb li {
    width: 26%;
    padding: 26% 0 0 0;
    margin: 2% 2% 2% 0;
  }
  .slick-dots {
    transform: scale(1.8);
    bottom: 2.2vh;
  }

  .hpanel .copy,
  .content {
    font-size: 4em;
    line-height: 1.4;
    font-weight: 500;
  }
  .content,
  #datetime .content {
    margin: 0 8%;
  }

  h2.rotated {
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    text-align: center;
    width: 100%;
    height: auto;
    margin-top: 5vh;
  }
  h2.rotated span {
    transform: rotate(0deg);
    /*font-size:0.7em;*/
  }

  #disciplines ul.subnav {
    padding-top: 2vh;
  }
  #disciplines ul.subnav li {
    display: none;
  }
  #disciplines ul.subnav li.active {
    display: block;
    width: 100%;
    padding: 25% 0 0 0;
  }
	#disciplines ul.subnav li.active span {font-size: 5em;}

  .hpanel .copy {
    padding-top: 0;
  }

  .slick-prev,
  .slick-next {
    transform: scale(2.5);
  }

  .m_clear {
    clear: both;
    height: 40px;
  }

  /*.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before{display:none;}*/

  .hpanel .copy img.big,
  .hpanel .copy img.small,
	.hpanel.h_cycling .copy img.big,
	.hpanel.h_cycling .copy img.small{
    width: 100%;
    height: auto;
  }
  .hpanel .copy img.left,
  .hpanel .copy img.right {
    float: none;
    margin: 0 0 1vw 0;
  }

  #video .logo.od {
    width: 40%;
    padding-top: 30%;
  }
  #video h1 {
    width: 45%;
    font-size: 10em;
    vertical-align: top;
    padding-top: 11%;
  }

  #about h2 {
    width: 65%;
    float: left;
    font-size: 3em;
  }
  #about .logo {
    width: 25%;
    background-position: right bottom;
  }
  #about .images.bottom {
    display: none;
  }
  #about p {
    display: block;
    width: 100%;
	  clear: both;
  }
  #about p img {
    display: block;
    width: 100%;
    margin: 40px 0;
  }

  #datetime .c_left,
  #datetime .c_right {
    width: 100%;
    padding: 0;
  }
  #datetime .logo,
  #datetime .c_left p {
    display: none;
  }
  #datetime .c_left h3 {
    font-size: 2.8em;
    line-height: 1.2;
    margin-bottom: 5vh;
  }
  #datetime .c_right h5 {
    font-size: 1.5em;
    line-height: 1.1;
  }
  #datetime ul.names li {
    text-align: center;
    margin: 8vh 0 8vh 0;
    font-size: 1.5em;
  }
  #datetime ul.names li:nth-child(even) span.text {
    margin: 0;
  }
  #datetime ul.names li span.round {
    margin: 0 0 2vh 0;
    width: 43%;
    padding-top: 40%;
    border-width: 16px;
  }
  #datetime ul.names li:nth-child(even) span.round {
    float: none;
  }
  #datetime ul.names li span.text {
    clear: both;
    width: 100%;
    margin: 0;
  }
  p.note {
    font-size: 2em;
  }
  #press h2, #jobs h2 {
    font-size: 16em;
    margin-top: 10vh;
  }
  #social a,
	#social a:last-child{
    width: 26%;
    margin: 5% 3%;
  }
  #cookie-bar p{
    font-size: 3.2em;
	line-height:1.6em;
  }
  #jobs .images.bottom img { width: 55%; margin: 2% 5%;}
}

@media screen and (max-width: 600px) {
  .m_clear {
    clear: both;
    height: 40px;
  }
  .content .cols p table {
    -webkit-column-count: 1;
    -webkit-column-gap: 0;
    -moz-column-count: 1;
    -moz-column-gap: 0;
    column-count: 1;
    column-gap: 0;
  }
  .button {
    width: calc(100% - 60px);
    margin: 15px 0;
  }
  #video .logo.od {
    width: 40%;
    padding-top: 30%;
  }
  #video h1 {
    width: 45%;
    font-size: 2em;
    vertical-align: top;
    padding-top: 11%;
  }

  #about h2 {
    clear: both;
    width: 100%;
    float: none;
    font-size: 1.7em;
    margin: 0 0 0.5vh 0;
  }
  #about .logo {
    width: 100%;
    background-position: center bottom;
    float: none;
  }
  #about .images.bottom {
    display: none;
  }
  #about p {
    display: block;
    width: 100%;
  }
  #about p img {
    display: block;
    width: 100%;
    margin: 40px 0;
  }

  #datetime .c_left,
  #datetime .c_right {
    width: 100%;
    padding: 0;
  }
  #datetime .logo,
  #datetime .c_left p {
    display: none;
  }
  #datetime .c_left h3 {
    font-size: 2.8em;
    line-height: 1.2;
    margin-bottom: 5vh;
  }
  #datetime .c_right h5{
    font-size: 1.5em;
    line-height: 1.1;
  }
  #datetime ul.names li {
    text-align: center;
    margin: 8vh 0 8vh 0;
  }
  #datetime ul.names li:nth-child(even) span.text {
    margin: 0;
  }
  #datetime ul.names li span.round {
    margin: 0 0 2vh 0;
    width: 60%;
	padding-top: calc(60% - 16px);

  }
  #datetime ul.names li:nth-child(even) span.round {
    float: none;
  }
  #datetime ul.names li span.text {
    clear: both;
    width: 100%;
    margin: 0;
  }

.slick-dots {
    bottom: 1vh;
}
  #disciplines ul.cb {
    margin: 0 5vw 0 6vw;
  }
  #disciplines ul.cb li {
    width: 26%;
    padding: 26% 0 0 0;
    margin: 2% 2% 2% 0;
  }
  h2.rotated {
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    text-align: center;
    width: 100%;
    height: auto;
    margin-top: 5vh;
  }
  h2.rotated span {
    transform: rotate(0deg);
    font-size: 0.5em;
  }
  .hpanel .copy img.big,
  .hpanel .copy img.small {
    width: 100%;
    height: auto;
  }

  .hpanel .copy img.left,
  .hpanel .copy img.right {
    float: none;
    margin: 0 0 1vw 0;
  }

  #disciplines ul.subnav {
    padding-top: 2vh;
  }
  #disciplines ul.subnav li {
    display: none;
  }
  #disciplines ul.subnav li.active {
    display: block;
    width: 100%;
    padding: 15% 0 0 0;
  }

  #social a,
	#social a:last-child{
    width: 26%;
    margin: 5% 3%;
  }
}
/* EOF RESPONSIVE */

/* BOF NEW DICIPLINES 10.06.2020: */
.msg_box{
	position: absolute;
	z-index:101;
	top: -10px;
	left: 35%;
	box-sizing: border-box;
	margin-left: -100px;
	border:1px solid #000;
	background-color: #64c3d5;
	border-radius: 8px;
	padding: 20px 10px 10px 10px;
	margin: 0;
	width: 20%;
	min-width: 120px;
	max-width: 200px;
	transition: all 400ms ease 0s;
}
.msg_box.login{text-align: center;}
.msg_box.login input{ width: 100%; box-sizing: border-box; margin: 2px 0; padding: 2px; border-radius: 8px; border: none; text-align: center; font-size: 10px;}

.msg_box.login.closed{top: -90px;}
.msg_box a{ font-weight: bold; text-decoration: none; color: #1c0e52;}
.msg_box .error{ font-weight: bold;}

/* EOF NEW DICIPLINES 10.06.2020 */

/* BOF LIVE STREAMING 03.08.2020 */
.livestreaming{margin:40px 0; white-space: nowrap;}
.livestreaming a{display: inline-block; box-sizing: border-box;width: 50%; padding: 0;}
.livestreaming a:nth-child(odd) {padding-right: 10px;}
.livestreaming a:nth-child(even) {padding-left: 10px;}
@media screen and (max-width: 400px) {
	.livestreaming{white-space: normal;}
	.livestreaming a:nth-child(odd),
	.livestreaming a:nth-child(even){width: 100%; padding: 0;}
}
/* EOF LIVE STREAMING 03.08.2020 */

/* BOF CLASSof22 12.10.2020 */
.classof22 h1{font-size: 4em;}
.classof22 h2{font-size: 3em;}
.classof22athletes{margin:40px 0;}
.classof22athletes a, .classof22athletes span{display: inline-block; box-sizing: border-box;width: 24%; padding: 0 1% 0 0; vertical-align: top; margin-bottom: 40px; overflow: hidden;}
.classof22athletes a img, .classof22athletes span img{transition: all 400ms ease 0s; width: 100%; height: auto;}
.classof22athletes a:hover img, .classof22athletes span:hover img{ opacity: .9;}
@media screen and (max-width: 750px) {
	.classof22athletes a, .classof22athletes span{width: 49%;}

}
@media screen and (max-width: 400px) {
	.classof22athletes a, .classof22athletes span{width: 99%;}
	.classof22 h2{font-size: 3em;}

}
/* EOF CLASSof22 12.10.2020 */


/* BOF honoraryboard 28.10.2020 */
.honoraryboard h1{font-size: 4em;}
.honoraryboard h2{font-size: 3em;}
.metapage.honoraryboard table tr td:first-child{ color: #64c3d5;}
/* EOF honoraryboard 28.10.2020 */