/****************   style-specific properties   ******************/
.DS-1-Style {
	font-family: Verdana, sans-serif;
	font-size: 18pt;
	color: rgb(0,0,0);
}
.DS-2-Style {
	font-family: Verdana, sans-serif;
	font-size: 11pt;
	color: rgb(0,0,0);
}
.DS-3-Style {
	font-family: Verdana, sans-serif;
	font-size: 11pt;
	color: rgb(120,120,120);
}
.DS-main-Style {
	font-family: Verdana, sans-serif;
	font-size: 18pt;
	color: rgb(120,120,120);
}
span{
    margin-left: 1em;
    margin-right: 1em;
}
form{
   display:inline;
}


/*****************   tag-specific properties   *******************/
header{
	font-family: Verdana, sans-serif;
	font-size: 11pt;
	color: rgb(120,120,120);
}
body{
	font-family: Verdana, sans-serif;
	font-size: 11pt;
	color: rgb(120,120,120);
}

h1 {
	font-family: Verdana, sans-serif;
	font-size: 18pt;
	color: rgb(72,72,72);
}

h2 {
	font-family: Verdana, sans-serif;
	font-size: 11pt;
	color: rgb(120,120,120);
}

div {
	background: blank;
	padding: 0.5em;
	border: 1px solid #000000;
}

nav {
	float: right;
}

p {
    width: 80%;
}

li {
list-style-type: none;
/*list-style-type: disc; */
display: inline;
/*
list-style-type: circle;
list-style-image: disc;
list-style-image: square; */
line-height: 150%;
/* 
list-style-image: url(../images/arrowSmall.gif); */
}

hr.style1 {
	height: 2px;
	border: 0;
	box-shadow: 0 1px 1px -1px #8c8b8b inset;
}

/* automatically resize images to screensize */
img {
/*  width: auto; */
/*  width: 100vw; */
  max-width: 100%; 
  height: auto; 
/*  height: 100vh; */
/*  max-height: 100%; */
}

footer{
	font-family: Verdana, sans-serif;
	font-size: 11pt;
	color: rgb(120,120,120);
}

/****************   Pseudo class properties   *******************/
/* roll-over code 
   Note: the order "link-visited-hover-active" matters in some browsers */

/*
:link { color: rgb(0,0,0) }		/* for unvisited links */
*/
/*
:visited { color: rgb(0,0,0) }	/* for visited links */
*/
:hover { color: rgb(0,0,0) }	/* when mouse is over link */
/*
:active { color: rgb(0,0,0) }	/* when link is clicked */
*/

a {
color: rgb(120,120,120);
text-decoration: none;
font-weight: bold;
}

a:link {
color: rgb(120,120,120);
text-decoration: none;
font-weight: bold;
}

li a:link {
color: rgb(120,120,120);
text-decoration: none;
font-weight: bold;
}

a:visited {
color: rgb(120,120,120);
text-decoration: none;
font-weight: bold;
}

li a:visited {
color: rgb(120,120,120);
text-decoration: none;
font-weight: bold;
}

a:hover {
color: rgb(0,0,0);
padding-bottom: 5px;
font-weight: bold;
}

li a:hover {
display: block;
color: rgb(0,0,0);
padding-bottom: 5px;
font-weight: bold;
border-bottom-width: 1px;
border-bottom-style: solid;
/*border-bottom-color: #C6EC8C;*/
}

a:active {
color: rgb(0,0,0);
font-weight: bold;
}


/********************   ID-properties   *********************/
/* Box model: position -> margin -> border -> padding -> content  */ 
#navigation-left {
position: absolute;
z-index: 10;
width: 210px;
height: 600px;
margin-top: 0px;
border-right: 5px solid #C6EC8C;
font-weight: normal;
}

#centerDoc {
position: absolute;
z-index: 15;
padding: 0px 0px 20px 20px; /*top right bottom left*/
margin-top: 50px;
margin-left: 235px;
}


/* expand / collapse */
/* source: http://jsfiddle.net/thurstanh/emtAm/2/ */
summary::-webkit-details-marker {
 color: #00ACF3;
 font-size: 100%;
 margin-right: 2px;
}
summary:focus {
	outline-style: none;
}
article > details > summary {
	font-size: 11pt;
	margin-left: 45px;
}
details > p {
	margin-left: 60px;
}
details details {
	margin-left: 75px;
}
details details summary {
	font-size: 11pt;
}