@charset "UTF-8";
body {;
	margin: 0;
	padding: 0;
	color: #000;
	text-align: center;
	font-weight: 400;
	font-family: 'Roboto', sans-serif;
}

::-webkit-scrollbar {
 width: 12px;  /* for vertical scrollbars */
 height: 0px; /* for horizontal scrollbars */
}
::-webkit-scrollbar-track {
 background: transparent;
}
::-webkit-scrollbar-thumb {
 background: Silver;
}
html {
	overflow: -moz-scrollbars-vertical;
	overflow-y: scroll;
}
/* ~~ Element-/Tag-Selektoren ~~ */
ul, ol, dl { /* Aufgrund von Abweichungen zwischen verschiedenen Browsern empfiehlt es sich, die Auffüllung und den Rand in Listen auf 0 einzustellen. Zu Konsistenzzwecken können Sie die gewünschten Werte entweder hier oder in den enthaltenen Listenelementen (LI, DT, DD) eingeben. Beachten Sie, dass die hier eingegebenen Werte hierarchisch auf die .nav-Liste angewendet werden, sofern Sie keinen spezifischeren Selektor festlegen. */
	padding: 0;
	margin: 0;
}
#navcontainer ul {
	margin: 0;
	padding: 10px 0;
	list-style-type: none;
	text-align: center;
	font-size: 15px;
	font-weight: lighter;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-style: italic;
	color: #666;
}
#navcontainer ul li {
	display: inline;
}
#navcontainer ul li a {
	text-decoration: none;
	padding: 0px 10px;
	color: #666;
}
#navcontainer ul li a:hover {
	color: #666;
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #666;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* Durch Verschieben des oberen Rands wird das Problem behoben, dass Ränder aus dem zugehörigen div-Tag geraten können. Der übrig gebliebene untere Rand hält ihn getrennt von allen folgenden Elementen. */
	padding-right: 0px;
	padding-left: 0px; /* Durch Hinzufügen der Auffüllung zu den Seiten der Elemente innerhalb der div-Tags anstelle der div-Tags selbst entfallen jegliche Box-Modell-Berechnungen. Alternativ kann auch ein verschachteltes div-Tag mit seitlicher Auffüllung verwendet werden. */
}
p {
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	font-weight: 300;
	line-height: 17px;
	color: #333
}
h1 {
	font-size: large;
	color: #000;
	font-family: 'Roboto', sans-serif;
	text-align: center;
	font-weight: 300;
	line-height: 17px;
}
h2 {
	font-size: large;
	color: #666;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-style: italic;
	text-align: center;
	line-height: 17px;
	font-weight: lighter;
}
.column h2 a {
	color: #666;
}
h3 {
	font-size: 15px;
	color: #333;
	font-family: 'Roboto', sans-serif;
	text-align: center;
	font-style: normal;
	font-weight: 300;
	line-height: 17px;
}
h3 span, h4 span {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #B8B8B8;
}
h4 {
	font-size: 15px;
	color: #666;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-style: italic;
	text-align: center;
	line-height: 15px;
	font-weight: lighter;
}
img {
	padding-bottom: 4px;
}
a img { /* Dieser Selektor entfernt den standardmäßigen blauen Rahmen, der in einigen Browsern um ein Bild angezeigt wird, wenn es von einem Hyperlink umschlossen ist. */
	border: none;
}
/* ~~ Die Reihenfolge der Stildefinitionen für die Hyperlinks der Site, einschließlich der Gruppe der Selektoren zum Erzeugen des Hover-Effekts, muss erhalten bleiben. ~~ */
a:link {
	color: #666;
	text-decoration: none;
}
a:visited {
	color: #666;
	text-decoration: none;
}
a:hover, a:active, a:focus { /* Durch diese Gruppe von Selektoren wird bei Verwendung der Tastatur der gleiche Hover-Effekt wie beim Verwenden der Maus erzielt. */
	text-decoration: none;
}
/* ~~ Dieser Container mit fester Breite umschließt die anderen div-Tags. ~~ */
.container {
	width: 1000px;
	margin: 0 auto;
	height: 0%;
	min-height: 110%;
}

.header {
	height: 74px;
	text-align: center;
	padding-top: 20px;
	text-decoration: none;
	font-size: medium;
	font-weight: 400;
	background-attachment: scroll;
	background-image: url(../IMG/bg.png);
	background-repeat: repeat-x;
	background-position: center -7px;
	background-color: #FFF;
	position: fixed;
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
}
.header a {
	text-decoration: none;
	color: #333;
}


.content {
	padding: 0px 10px 10px 10px;
	z-index: 1000;
	min-height: 660px;
}
/* ~~ Fußzeile ~~ */
.footer {
	padding: 10px 0 40px 0;
	font-size: 11px;
	font-weight: 300;
	width: 1000px;
	margin: 0 auto;
	position: fixed;
	bottom: 0px;
	background-color: #FFF;
}
.column {
	height: auto;
	width: 450px;
	min-height: 240px;
	text-align: justify;
	margin-top: 30px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
.column_french {
	line-height: 17px;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size: 14px;
	font-style: italic;
	font-weight: lighter;
	color: #666;
	text-decoration: none;
	height: auto;
	width: 450px;
	min-height: 240px;
	text-align: justify;
	margin-top: 30px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#photo {
	line-height: 17px;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size: 13px;
	font-style: italic;
	font-weight: lighter;
	color: #666;
	text-decoration: none;
	text-align: center;
	margin: 0 auto;
}

.space {
	height: 94px;
	width: 100%;
}
.select {
	height: 26px;
	width: 200px;
	position: absolute;
	margin-left: -100px;
	padding-top: 3px;
	padding-top: -15px;
	top: 45%;
	left: 50%;
	bottom: 55%;
	right: 50%;
	font-size: 19px;
	color: #fff;
	font-family: 'Roboto', sans-serif;
	text-align: center;
	font-style: normal;
	font-weight: 300;
	line-height: 1.2;
	border: 2px solid #FFFFFF;
	z-index: 200000;
	background-color: rgba(179,179,179,0.39);
}
