@charset "utf-8";

/* CSS Document */

/*-----------main layout---------------*/


body {
	font-size:110%;
	color:#000000;
	padding:0px;
	border:0px;
	margin:0px;
	background-color:#ffffff;
}

h1 { margin: 0px;
  padding:0px; 
  text-align: left;
  display: block; font-size:1.9em;}

#header h1 { margin: 10px 20px 0px 20px; }

h2 { margin: 10px 0px;
  padding:0px; 
  text-align: left;
  display: block; font-size:1.3em;
 }

#header h2 {
  margin: 0px 20px 0px 20px;}

h3{ margin: 20px 0px 10px;
  padding:0px; 
  text-align: left;
  display: block; font-size:1em;}

h4{ margin: 0px;
	padding:0px; 
	text-align: left;
	display: block; font-size:1em;}

#header h3 {
  margin: 0px 20px 0px 20px;}

h5 { font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
  font-weight: bold;
  margin: 0px;
  padding:0px; 
  text-align: center; width: 100%;
  display: inline-block; font-size:1.5em; color: black;
}

#header {height:80px; position:fixed; z-index:500; background-color:#FFFFFF; width: 100%;  color:black;} 

#menu_button{opacity:0;}

p.header {
  font-family:Futura,Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", "sans-serif";
  font-size: 1.2em;
  font-weight: bold;
}

#left_col { 
	position:fixed;
	margin-left:0px;
	margin-top:120px;
	width:250px; /*********************/
	z-index:100;
}

/*------------ menu layout---------------*/


div.menu { z-index:25; width:210px; height:30px; display: block; margin: 20px 0px 0px 20px; padding:0px; }

ul.accordion { text-align:left; width:100%; height:100%; margin: 0px; padding:0px;}

.menu_div {
	text-align:left;
	vertical-align:middle;
	margin:0px;
	width:100%;
	height:100%;
	cursor:pointer;
}


.menu ul {
	top:180px;
	list-style-type:none; display: inline-block; background: #FFFFFF;
	z-index:20;
}

.li { list-style-type: none; }

.menu ul ul li {display:none;}

.menu.li a { color:#777777; }


.menu a {text-decoration: none;}

.menu ul :hover ul li { display:block; height:35px; width:100%;}


/* make the second level visible when hover on first level list OR link */

/* make the 2nd level visible when focus is on it */
.menu_focus ul ul {display:block;}




/* position relative so that you can position the sub levels */
.menu li { position:relative; }

/* get rid of the table */
table {
	position:absolute;
	top:0;
	left:0;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
	 /* display:none; */
	position:absolute;
	float:left; background: #FFFFFF;
	top:0px;
	margin-left:-40px; 
	margin-top:0px;
	padding-left:10px;
	width:100%; z-index: 100;
	/* box-shadow: 3px 3px 5px grey; */
}

p.menu1 {  
  font-size: 1.3em; font-weight:bold; vertical-align:middle;float:left; width:100%; height:100%; }

  .menu1 a { width:100%; height:100%; display: inline-block;}
  .menu1 a.grey:hover { width:100%; height:100%; display: inline-block; color:#561E50;}

.menu2 {
	font-weight:normal;font-size: 1.5em; 
	color:#666666;     /* <------------------------*/
	padding-left:10px;  /* <------------------------*/
}


A.menu1, A.menu1:visited {/*display:block; display:inline-block;*/
	float:left;
	padding-left:10px;
	z-index:1000;
  
}




.arrow_div { display:none; }

.menu_arrow { display:none; }




.show { display:block; }
.hide { display:none; }
.inner { display:none; width:300px;}

.show_sub { display:inline-block; }
.inner_sub { display:none;width:300px; }


.sticky {position: sticky; top: 80px; background-color: #FFF;}

#content {
	width:500px;
	margin:0px auto;
	text-align:left;/*
	padding:15px;
	border:1px dashed #333;
	background-color:#eee;*/
	}

#container {margin: 0px 40px 0px 20px; padding: 20px; position: relative;  }

/* style for right container, one page spread */
#main { 
	margin-top:-200px;
	margin-left: auto;
	margin-right: auto;
	padding-left:200px;
	padding-right:50px;
	background:#FFFFFF;
	border:0px solid #a49188;
	font-size:100%;
}

/* side layout */

#collap{display: none;}

#logo {
	position:fixed;
	left:30px;
	top:20px;
}
.hide {display:none;}


.image_bio { display: inline-block; text-align: center; margin: auto; width: 263px;}


/* frame for display content */
#pdf {
	position:relative;
	margin-top:100px; text-align:center; display:inline-block; float:none;
	
	z-index:1;
}

.pdf_scroll img{
	display:inline-block;
	width:80%;
	margin-top: 10px; margin-left:	0px;
}

#pdf div.venue { width:300px; margin:auto;}


#pdf_mobile { margin-top:100px; }

.mobile { display:none; opacity:0; visibility:hidden;}



#frame {
	position:fixed;
	top:30px;
	left:300px;
	z-index:20;
	}

/*--------- links --------*/

/* general */
A {
	color:#000;
	font-weight:bold;
	text-decoration:none;
}

A:link { color: black }
A:hover { color: gray }
A:active, A:focus { color: darkgray}


/* images without border, white background */
A.img {
	text-decoration:none;
	color:#FFFFFF;
}

A.img:link, A.img:hover, A.img:active  {
	text-decoration:none;
	color:#FFFFFF;
}


/* -------pharagraph-----------*/

p { 
	padding:0px;
	border:0px;
	margin:0px;
	background-color:#FFFFFF;
}
p span.left {text-align: left;}
p span.justify {text-align: justify;}
p.bold { font-weight:bold; }

p.title {
	margin-top:20px;
	font-weight:bold;
	font-size:150%;
	text-align:center;
}

.test { display:none; position:fixed; border: dashed #666666; margin-top:0px; margin-left:100px;}



h1.podcast{margin:0px;}

h2.podcast{margin:0px; height:28px; font-size: 1.3em; height: 30px;} 

h3.podcast{margin:0px; font-size: 18px;}

h4.podcast{margin:0px; font-size: 1em;  }

#podcast {width:100%; max-width:1000px;}
.podcast-container {width:100%; max-width:1000px; background-color: #FFF;}
.podcast-title {width:80%;}
.podcast-left{width:80%; float: left;}
.podcast-right{float:left; width:20%;}

p.podcast{margin:0px;}

#podcast p { text-align: justify;}
 .more p { text-align: justify;}

audio {width:100%;  text-align: center;}

#podcast-container {
	position: absolute;/*
	top: 155px;
	left: 20px;
	right: 20px;
	input {
	  width: 265px;
	  transition: width 0.2s;
	  -webkit-appearance: none;  Autoprefixer doesn't catch this */
	
  }
	.fix-container {
	  position: fixed;
	  top: 100px;
  }