:root{
	--HeaderAccentColour: #fc8805;
	--HeaderTextColour: #fc8805;
	--HeaderBackColour: lightblue;

	--GradientColour: #4bf3fc;
	--linkColour: #259c1f;
	
}
	
html{
	margin:0;
	padding:0;
	width:100%;
	min-height:100%;
	font-size:16px;
}

body{
	margin:0;
	padding:0;
	width:100%;
	min-height:100%;
	
	/*background: linear-gradient(red, #ebfff7);*/
}

button:focus, input:focus {
	outline:0;
}

header{
	width:100%;
	margin:0 0 0 0;
	padding:0;

	background-color:var(--HeaderBackColour);
	
	!background: linear-gradient(var(--GradientColour), white);

	position: sticky;
	position: -webkit-sticky;
	position: -moz-sticky;
	position: -ms-sticky;
	position: -o-sticky;
	top:0px;
	z-index:100;
/********
	top:-250px;
	to get the image in the right place -> Task: get the page to load from very top
********/
}

/****************
General
****************/

a{
}

a:visited {
	color: blue;
}

/*	not working (needed for DualCoxeterFiles in Research)	*/
.NoVisitedChange a{
	colour:red;
}



/****************
Top
****************/

/****************
Navigation
****************/

#Top {
	
}
#Top h1{
	float:left;
	text-align:center;
	font-size:1.3em;
	padding:0.99em 0em 0 1em;
	margin:0;
}

#Navigation {
}


#Navigation img{
	position:relative;
	margin-left:60px;
}

#Navigation ul{
	list-style-type: none;
	margin-left: 0px;
	padding: 0;
	margin:0;
	padding-bottom:0.3em;
	position:relative;
	text-align:right;
}	

#Navigation ul li{
	font-size:1.25em;	
	padding:0.7em 0 0.7em 0;
	display:inline-block;
	border: 2px solid transparent;
	margin:0.3em 0.2em 0 0.2em;
	text-align:center;

}

/*	Padding for Nav Items has to be same here and in Navigation ul li	*/
#Navigation ul li a{
	padding:0.7em 0.8em 0.7em 0.8em;

}

#MultiLine{
	display:inline-block;
	padding:0;
	margin:0;
}

#Navigation ul li a, visited {
	text-decoration: none;
	color: black;
}


#Navigation ul li:hover{
	border: 2px dashed var(--HeaderAccentColour);
	border-radius: 15px;

}

#Navigation ul li:hover a{
	color: var(--HeaderTextColour);
}

/****************
Content
****************/

#SecondTop{
	padding:0 0 1em 0;
	margin:0;
	background-color:var(--HeaderBackColour);
	text-align:center;
}

#SecondTop strong{
	margin-top:0;
	font-size:1.8em;
}


#Middle {
}

#Middle a{
	color:#40c65a;
}

#WrapSpeakers{
	font-size:1.2em;
	text-align:left;
	width:100%;

}

#WrapSpeakers table{
	border:none;
	border-spacing:0;
	width:100%;
	padding-bottom:3em;
}

#WrapSpeakers table td{
	padding:0.3em 0 0 0;
	margin:0;
	font-size:1em;
	vertical-align:top;

	background-image: url("../res/img/DotBackgr.png");
	background-repeat: repeat-x;
	background-position: right top; 
}
#WrapSpeakers table td:last-child{
		background-image: none;
}

#WrapSpeakers .noBack{
	background-image:none;
	background-color:white;
	color:black;
	margin:0;
	padding-right:0.2em;
}
.name {
  min-width:50%;
  	vertical-align:top;
	overflow: hidden;
	white-space:nowrap;
}

/* #WrapSpeakers .name:after {
 	content:" ................................................ ......................................................";
	padding:0;
	margin:0;
}
*/

#WrapSpeakers .noBack:before {
  content: "\25e6";
 margin: 0 0.1em 0 0;
  padding:0;
 font-size:1em;
  vertical-align:center;
  background-color:white;
}

.anchor{
	display: block;
    position: relative;
    top: -6em;
	    visibility: hidden;
}

#Images{
	padding:3em 0 2em 0;
}

#Images img{
	width:24%;
	max-height:11em;
}

.Text{
	padding:2em 20% 5em 20%;
	text-align:justify;
	font-size:1.05em;
}

.Text ul{
	list-style:circle;
}

#Organizers{
	text-align:center;
	padding:0.5em 0 0 0;
	margin:0;
}

#Organizers h3{
	padding:0;
	margin:0 0 0.1em 0;

	color:var(--HeaderTextColour)
}
#Organizers strong{
	font-size:1.5em;
}

a{
	text-decoration:none;
	color:var(--linkColour);
}

a:hover{
}

/* use 	
text-align:justify; 
for longer texts
*/

h2{
	margin-top:0;
	text-align: center;
	font-size:3em;
	padding:0.5em 1em 0 1em; 

}

h3{
	text-align: center;
	font-size: 2em;
	margin:1.2em 0 0.8em 0;
	color: var(--HeaderTextColour);

}

h5{
	color: var(--HeaderTextColour);
	font-size: 1.5em;
	text-align:center;
	padding:0;
	margin:0;
	margin-bottom:0.5em;
}

#iframeWrapper{
	position:relative;
	text-align:center;
}
#iframeWrapper iframe{
	border:none;
	width:70%;
	height:440px;
}
#iframeWrapper iframe#Poster{
	border:none;
	width:70%;
	height:45%;
}
#iframeWrapper small{
	font-size:0.7em;
	padding:0;
	margin:0;
}


#MapWrapper{
	display:inline-block;
	margin-left:25%;
	width:50%;
	height:500px;
}
*/
.CenterWrapperWrap {
   position: relative;
   left: 50%;
   float: left;
}
.CenterWrapper {
   position: relative;
   left: -50%;
   float: left;
}

#AttentionLink{
	border:2px dashed;
	border-radius:8px;
	padding:0.8em;
	margin:0.8em;
	margin-left:25%;
	width:50%;
	text-align:center;
}


.centerDiv{
	text-align:center;

}
.centerDiv img{
	width:90%;
	height:30%;
	text-align:center;
	}

#centered{
	text-align:center;
}

#Logos{
	display:inline-block;
	padding:0;
	margin:0;
	margin-top:3em;
	text-align:center;
}
#Logos img{
		margin:0 10% 0 10% ;

}

/****************
Footer
****************/

#Bottom {
	padding-top:10px;
	border-top:1px dotted grey;
	font-size:0.8em;
	font-family:Liberation Mono;
	text-align:center;
	clear:both;


}