body {
	background-color:MediumSpringGreen;
}

h1 {
  color: black;
  text-align: center;
  overflow: hidden;
}

article {
  color: black;
  background-color: white;
  font-family: sans-serif;
  text-align: left;
  font-size: 14pt;
  border: 2px solid black;
  border-radius: 10px;
  width: auto;
  margin-top: 10px;
  margin-left: 100px;
  margin-right: 100px;
  padding: 50px;

}

footer {
  color: black;
  font-family: sans-serif;
  font-size: 14pt;
}

footer a:hover {
	background-color:antiquewhite;
}

.mainNavigation {
	list-style-type: none;
	justify-content: center;
	background-color: aquamarine;
	margin: 0;
	padding: 0;
    display: flex;
    width: 100%;	
	height: 110px;
}

.mainNavigation ul li {
	display: block;
	float: left;
	margin-top: -7px;
	padding: 20px;
	text-decoration: none;
}

.mainNavigation ul li:hover {
	background-color: antiquewhite;
	margin-top: -14px;
}

.active {
	background-color: mediumseagreen;
}

.dropdown {
  position: relative;
  top: 0;
  display: inline-block;
}

 .dropdown active {
	background-color: mediumseagreen;
	position: relative;
	top: 0;
    display: inline-block;
 }
 
.dropdown-content {
  display: none;
  position: absolute;
  background-color: aquamarine;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown:hover .dropdown-content {display: block;}

.dropdown-content a:hover {background-color: antiquewhite;}

.slideshow-frame{
    width: 800px;
    position: static;
    overflow: hidden;
    margin: auto;
}

.slideshow-frame2{
    width: 800px;
    position: static;
    overflow: hidden;
    margin: auto;
}

.slideshow-image{
    width: 800px;
}

.slideshow-image2{
    width: 800px;
}

.slideshow-wrapper{
    width: 800px;
    display: flex;
    animation: slide 65s infinite;
}

.slideshow-wrapper2{
    width: 800px;
    display: flex;
    animation: slide2 25s infinite;
}

.pvvideo{
	width: 800px;
	height: 600px;
}

@media screen and (max-width: 1906px) {

  .mainNavigation {
    margin: 0px;
    padding: 0px;
    width: 480px;	
    height: 100%;
    float: left;
 }

  .mainNavigation ul li {
    margin-top: 0px;
    float: none;
 }
 
 .mainNavigation ul li:hover {
	width: 400px;
}

 .active {
	background-color: mediumseagreen;
	width: 400px;
}

  .dropdown-content {
    display: none;
    position: absolute;
    background-color: aquamarine;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    top: 0;
    left: 100%;
	max-width: 100%;
 }
 
  .dropdown-content a {
    padding: 12px 16px;
 }
 
 .dropdown active {
    float: none;
 }

  h1 {
    width: 100%;
 }

  article {
	width: 1200px;
	padding: 50px;
	margin-top: 0px;
	margin-left: 500px;
	margin-right: 500px;
  }

}

@media screen and (max-width: 1810px) {

  article {
	width: 1000px;
	padding: 100px;
	margin-top: 0px;
	margin-left: 500px;
	margin-right: 500px;
  }
  
  .pvvideo{
	width: 700px;
	height: 525px;
  }
  
 .slideshow-wrapper{
    width: 700px;
}

 .slideshow-wrapper2{
    width: 700px;
}
  
  .slideshow-frame{
    width: 700px;
 }
 
  .slideshow-frame2{
    width: 700px;
 }
  
  .slideshow-image{
    width: 700px;
}

  .slideshow-image2{
    width: 700px;
}

}

@media screen and (max-width: 1710px) {

  article {
	width: 900px;
	padding: 100px;
	margin-top: 0px;
	margin-left: 500px;
	margin-right: 500px;
  }

}

@media screen and (max-width: 1615px) {

  article {
	width: 800px;
	padding: 100px;
	margin-top: 0px;
	margin-left: 500px;
	margin-right: 500px;
  }
  
  .pvvideo{
	width: 600px;
	height: 450px;
}

 .slideshow-wrapper{
    width: 600px;
}

 .slideshow-wrapper2{
    width: 600px;
}

  .slideshow-frame{
    width: 600px;
 }
 
  .slideshow-frame2{
    width: 600px;
 }

  .slideshow-image{
    width: 600px;
}

  .slideshow-image2{
    width: 600px;
}

}

@media screen and (max-width: 1510px) {

  article {
	width: 700px;
	padding: 100px;
	margin-top: 0px;
	margin-left: 500px;
	margin-right: 500px;
  }
  
  .pvvideo{
	width: 400px;
	height: 300px;
}

 .slideshow-wrapper{
    width: 400px;
}

 .slideshow-wrapper2{
    width: 400px;
}

  .slideshow-frame{
    width: 400px;
 }
 
  .slideshow-frame2{
    width: 400px;
 }

  .slideshow-image{
    width: 400px;
}

  .slideshow-image2{
    width: 400px;
}

}

@media screen and (max-width: 1400px) {

  article {
	width: 600px;
	padding: 100px;
	margin-top: 0px;
	margin-left: 500px;
	margin-right: 500px;
  }
  
  .pvvideo{
	width: 400px;
	height: 300px;
}

 .slideshow-wrapper{
    width: 400px;
}

 .slideshow-wrapper2{
    width: 400px;
}

  .slideshow-frame{
    width: 400px;
 }
 
  .slideshow-frame2{
    width: 400px;
 }

  .slideshow-image{
    width: 400px;
}

  .slideshow-image2{
    width: 400px;
}

}

@media screen and (max-width: 1310px) {

  .mainNavigation {
    margin: 0px;
    padding: 0px;
    width: 100%;	
    height: 100%;
    float: none;
 }

  .mainNavigation ul li {
    margin-top: 0px;
    float: none;
 }
 
 .mainNavigation ul li:hover {
	width: 400px;
}

 .active {
	background-color: mediumseagreen;
	width: 400px;
}

  .dropdown-content {
    display: none;
    position: absolute;
    background-color: aquamarine;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
	left: 0;
	max-width: 100%;
 }
 
  .dropdown-content a {
    padding: 12px 16px;
 }
 
 .dropdown active {
    float: none;
 }

  h1 {
    width: 100%;
 }

  article {
	width: auto;
    margin-top: 10px;
    margin-left: 0px;
    margin-right: 0px;
    padding: 0px;
  }

}

@media screen and (max-width: 1100px) {

  .mainNavigation {
    display: none;
 }

  h1 {
    width: 100%;
 }

  article {
	width: auto;
    margin-top: 10px;
    margin-left: 0px;
    margin-right: 0px;
    padding: 0px;
  }

}

h2 {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
  font-size: 2.0em;
  font-weight: bold;
  text-align: center;
  color: black;
  font-family: sans-serif;
}

h3 {
  color: black;
  font-family: sans-serif;
  text-align: center;
  font-size: 14pt;
  font-weight:normal;
}

h4 {
  color: black;
  font-family: sans-serif;
  text-align: center;
  font-size: 22pt;
  font-weight:bold;
}

details {
  user-select: none;
}

details>summary span.icon {
  width: 24px;
  height: 24px;
  transition: all 0.3s;
  margin-left: auto;
}

details[open] summary span.icon {
  transform: rotate(180deg);
}

summary {
  display: flex;
  cursor: pointer;
  font-weight: bold;
  background-color: #ccffcc;
  font-size: 1.2em;
}

summary::-webkit-details-marker {
  display: none;
}

#pub1 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub1 a{font-weight: bold; color: #09434e;}
#pub1 name{font-weight: bold; color: #09434e;}

#pub2 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub2 a{font-weight: bold; color: #09434e;}
#pub2 name{font-weight: bold; color: #09434e;}

#pub3 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub3 a{font-weight: bold; color: #09434e;}
#pub3 name{font-weight: bold; color: #09434e;}

#pub4 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub4 a{font-weight: bold; color: #09434e;}
#pub4 name{font-weight: bold; color: #09434e;}

#pub5 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub5 a{font-weight: bold; color: #09434e;}
#pub5 name{font-weight: bold; color: #09434e;}

#pub6 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub6 a{font-weight: bold; color: #09434e;}
#pub6 name{font-weight: bold; color: #09434e;}

#pub7 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub7 a{font-weight: bold; color: #09434e;}
#pub7 name{font-weight: bold; color: #09434e;}

#pub8 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub8 a{font-weight: bold; color: #09434e;}
#pub8 name{font-weight: bold; color: #09434e;}

#pub9 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub9 a{font-weight: bold; color: #09434e;}
#pub9 name{font-weight: bold; color: #09434e;}

#pub10 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub10 a{font-weight: bold; color: #09434e;}
#pub10 name{font-weight: bold; color: #09434e;}

#pub11 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub11 a{font-weight: bold; color: #09434e;}
#pub11 name{font-weight: bold; color: #09434e;}

#pub12 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub12 a{font-weight: bold; color: #09434e;}
#pub12 name{font-weight: bold; color: #09434e;}

#pub13 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub13 a{font-weight: bold; color: #09434e;}
#pub13 name{font-weight: bold; color: #09434e;}

#pub14 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub14 a{font-weight: bold; color: #09434e;}
#pub14 name{font-weight: bold; color: #09434e;}

#pub15 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub15 a{font-weight: bold; color: #09434e;}
#pub15 name{font-weight: bold; color: #09434e;}

#pub16 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub16 a{font-weight: bold; color: #09434e;}
#pub16 name{font-weight: bold; color: #09434e;}

#pub17 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub17 a{font-weight: bold; color: #09434e;}
#pub17 name{font-weight: bold; color: #09434e;}

#pub18 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub18 a{font-weight: bold; color: #09434e;}
#pub18 name{font-weight: bold; color: #09434e;}

#pub19 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub19 a{font-weight: bold; color: #09434e;}
#pub19 name{font-weight: bold; color: #09434e;}

#pub20 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub20 a{font-weight: bold; color: #09434e;}
#pub20 name{font-weight: bold; color: #09434e;}

#pub21 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub21 a{font-weight: bold; color: #09434e;}
#pub21 name{font-weight: bold; color: #09434e;}

#pub22 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub22 a{font-weight: bold; color: #09434e;}
#pub22 name{font-weight: bold; color: #09434e;}

#pub23 {padding: 5px; border-width: 2px; border-style: none; background-color: #ccffcc; font-size: 1.2em; margin-top: 20px; margin-bottom: 20px;}
#pub23 a{font-weight: bold; color: #09434e;}
#pub23 name{font-weight: bold; color: #09434e;}

.pub-journal {
	font-style: italic;
}

@keyframes slide{
    0%{
        transform: translateX(0);
    }
    4%{
        transform: translateX(0);
    }
    8%{
        transform: translateX(-100%);
    }
    12%{
        transform: translateX(-100%);
    }
    16%{
        transform: translateX(-200%);
    }
    20%{
        transform: translateX(-200%);
    }
    24%{
        transform: translateX(-300%);
    }
    28%{
        transform: translateX(-300%);
    }
    32%{
        transform: translateX(-400%);
    }
    36%{
        transform: translateX(-400%);
    }
    40%{
        transform: translateX(-500%);
    }
    44%{
        transform: translateX(-500%);
    }
    48%{
        transform: translateX(-600%);
    }
    52%{
        transform: translateX(-600%);
    }
    56%{
        transform: translateX(-700%);
    }
    60%{
        transform: translateX(-700%);
    }
    64%{
        transform: translateX(-800%);
    }
    68%{
        transform: translateX(-800%);
    }
    72%{
        transform: translateX(-900%);
    }
    76%{
        transform: translateX(-900%);
    }
    80%{
        transform: translateX(-1000%);
    }
    84%{
        transform: translateX(-1000%);
    }
    88%{
        transform: translateX(-1100%);
    }
    92%{
        transform: translateX(-1100%);
    }
    96%{
        transform: translateX(-1200%);
    }
    100%{
        transform: translateX(-1200%);
    }
}

@keyframes slide2{
    0%{
        transform: translateX(0);
    }
    11%{
        transform: translateX(0);
    }
    22%{
        transform: translateX(-100%);
    }
    33%{
        transform: translateX(-100%);
    }
    44%{
        transform: translateX(-200%);
    }
    55%{
        transform: translateX(-200%);
    }
    66%{
        transform: translateX(-300%);
    }
    77%{
        transform: translateX(-300%);
    }
    88%{
        transform: translateX(-400%);
    }
    100%{
        transform: translateX(-400%);
    }
 
}