body {
	min-width:840px;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	background: #DDDDDF;
	font-family: Tahoma, Geneva, sans-serif;
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
	font-size: 1em;
	counter-reset: searchpos;
}

.mythgen-link {
	color: #576363;
	font-weight: bold;
	text-decoration: none;
}
.small-link {
	color: #576363;
}
.mythgen-mail-link {
	color: #576363;
	font-weight: bold;
}


.heading-par {
	/* font-size: 16px; */
	font-weight: bold;
	text-align: left !important;
	
}

.small-heading {
	/* font-size: 15px; */
	font-weight: bold;
}


.link-line {
	padding-bottom: 1em;
	margin-left: auto;
	margin-right: auto;
	width: 60%;
}

.big-link-icon {
	height: 3em;
	margin-right: 1em;
	margin-bottom: -1em;
	
}
.icon-height-fix {
	margin-bottom: 1em;
}

.linear-layout-div {
	width: 80%;
	background: #879b9b;
	text-align: center;
	padding: 2em;
	padding-left: 10%;
	padding-right: 10%;
}

#content-left {
	display: block;
	float:left;
	width: 70%;
	background: white;
}

#content-sidebar {
	display: block;
	float:left;
	width: 29%;
	height: 100%;
	background: white;
	margin-left: 1%;
	padding-bottom: auto;
	margin-bottom: auto;
}

#content-sidebar .verthumbed-link {
	width: 80%;
	margin: 0.8em;
	padding: 0.5em;
	margin-left:auto;
	margin-right:auto;
	text-align: center;
	background: #dbe1e0;
}

#content-sidebar .verthumbed-link-thumb {
	width: 90%;
	margin-left:auto;
	margin-right:auto;
}
#content-sidebar img
{
	width:100%;
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
}
#content-sidebar .verthumbed-link-text {
	padding: 0.3em;
}
#content-sidebar a
{
	text-decoration: underline;
}

#content-with-sidebar {
	display: block;
	height: auto;
	overflow:auto;
	width: 100%;
}
#content-with-sidebar::after {
	clear:both;
}




/***********************************************************/
/**** Header **********************************************/
/***********************************************************/

#header {
	background: #bec6c5;
	padding:10px;
	text-align: center;
	font-stretch: expanded;
	padding-top: 2em;
	padding-bottom: 1.6em;
}

#main-heading {
	background: #bec6c5;
	font-weight: bold;
	font-size: 1.4em;
}

#main-sub-heading {
	background: #bec6c5;
	font-size: 1.1em;
}

#main-sub-heading span::before {
	content: "• ";
}
#main-sub-heading span::after {
	content: " •";
}





/***********************************************************/
/**** Menubar **********************************************/
/***********************************************************/

#menu
{
	background: #879b9b;
	width: 100%;
	height: 2em;
}


#menu ul {
	background: #879b9b;
    list-style-type: none;
	min-width: 800px;
	width: 85%;
    margin: 0;
	margin-left: auto;
	margin-right: auto;
}

.first-link-item {
	margin-left: 5px !important;
}

#menu li {
    display: block;
	float:left;
	padding-top: 5px;
	margin-left: 5vw;
	height: 1.6em;
}


#menu li a {
	padding: 0px;
	padding-left:3px;
	padding-right:3px;
    text-decoration: none;
	color: white;
}
#menu li:hover {
	background: #AAAAAA;
}
#menu .selected {
    color: #576363 !important;
	text-decoration: underline;
	font-weight: bold;
}



/***********************************************************/
/**** Banner **********************************************/
/***********************************************************/



#banner-image-div {
	background: #879b9b;
}
#banner-image {
	width: 100%;
	padding-bottom: 1.2em;
}


/***********************************************************/
/**** Main-Content *****************************************/
/***********************************************************/

#content {
	display: block;
	width: 100%;
	background: #879b9b;
	margin:0px;
	/* font-size: 14px; */

}


/***********************************************************/
/**** home-Content *****************************************/
/***********************************************************/



#home-content-text {
	width: 84%;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
}


#home-text-image {
	width: 90%;
	margin-left: 5%;
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);

}

/***********************************************************/
/**** Entstehung Content ***********************************/
/***********************************************************/

#entstehung-image {
	display: block;
	float: left;
	width: 20%;
	margin-right: 1em;
	margin-bottom: 0.5em;
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
}

#entstehung-content {
	background: white;
	width: 86%;
	padding: 1em;
	padding-right: 7%;
	padding-left: 7%;
	
}
#entstehung-content p {
	text-align: justify;
}


/***********************************************************/
/**** Lexikon Content ***********************************/
/***********************************************************/


#lexikon-content-form {
	background: #bec6c5;
	padding-top: 1em;
	text-align: center;
}

#lexikon-content-form p
{
	margin-bottom: 0px;
}

#lexikon-content-form input:nth-child(3)
{
	margin-top: 1.5em;
}


#lexikon-content-form input:nth-child(4)
{
	border: none;
	outline: 1 px solid black;
	background: #495254;
	color: white;
	text-align: center;
	padding: 3px;
	width: 15%;
	padding-left: 1%;
	cursor: pointer;
	
}

#lexikon-content-seealso {
	background: #bec6c5;
	padding-top: 1em;
	padding-bottom: 1em;
	text-align: center;
		
}
#lexikon-content-seealso ul {
	width: 50%;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
}
#lexikon-content-seealso ul li {
		list-style-type: disc;
}
#lexikon-content-seealso ul li a {
		color: black;
}

#lexikon-content-desc {
		background: white;
		width: 80%;
		padding-top: 1em;
		padding-bottom: 1em;
		padding-left: 10%;
		padding-right: 10%;
		text-align: justify;
}


#short-disclaimer {
	font-size: 14px;
	width: 100%;
	text-align: center;
}

#short-disclaimer a {
	padding: 0px !important;
}


/***********************************************************/
/**** Suchergebnis/Liste ***********************************/
/***********************************************************/


#search-list-content {
		background: white;
		width: 70%;
		padding-top: 1em;
		padding-bottom: 1em;
		padding-left: 15%;
		padding-right: 15%;
}
#search-list-content table {
		
		margin-left: auto;
		margin-right: auto;
}

#search-list-content a {
	color: black;
	padding: 10px;
}

#search-list-content thead th  {
	padding-top: 1em;
	padding-bottom: 1em;
}

#search-list-content tbody tr {
	display: block;
	padding: 10px;
	background: linear-gradient(to left, #f7f7f7 , white);
}
#search-list-content tbody tr:nth-child(2n+1) {
	background: linear-gradient(to right, #f1f1f1 , white);
}



#search-list-content tr h1 {
	display: inline;
	font-size: 1em;
	font-weight: bold;
}

#search-list-content tr h1:nth-child(n+1)::before {
	content: "• ";
	/* counter-increment: searchpos; */
    /* content: counter(searchpos) ". ";  */
}

/***********************************************************/
/**** Result ***********************************/
/***********************************************************/

#title-div {
	text-align: center;
	font-weight: bold;
	font-size: 1.6em;
	padding-top: 1em;
	padding-bottom: 1em;
	text-decoration: underline;
}


#mythtext p {
	text-align: justify;
}


/***********************************************************/
/**** Gallery Content ***********************************/
/***********************************************************/

#gallery-iframe {
	width: 100%;
	height: auto;
}


/***********************************************************/
/**** Genealogie Content ***********************************/
/***********************************************************/

#genealogie-desc-div {
	background: #bec6c5;
	/* font-size: 14px; */
}
#genealogie-seadragon-div {
	background: white;
}
#genealogie-download-div {
	margin-top:1em;
	background: white;
	/* font-size: 14px; */
}
#demoarea {
	padding: 1em;
	background: #879b9b; 
}
#seadragon-output-div {
	color: #272727;
}
.openseadragon {
	width: 67vw;
	height: 38vw;
	min-width: 640px;
	min-height: 364px;
	margin-left: auto;
	margin-right: auto;
}

#viewport-selector {
	border: none;
	outline: none;
	background: #495254;
	width: 40%;
	color: white;
	text-align: center;
	padding: 3px;
	font-size: 1em;
	
}

.openseadragon-container > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) {
	background: rgba(6,6,6,0.76) !important;
}


#seadragon-myge-index {
	height: auto;
	overflow: auto;
	
}

.index-links-div {
	background: #879b9b;
	
}
.index-links-div a {
	margin-left: 1vw;
	color: #576363;
	
}

.index-column {
	height: auto;
	overflow: auto;
	float:left;
	width: 31.3%;
	padding: 0.5%;
	margin: 0.5%;
}


.index-entry {
	background: #cdcdcd;
	width: 98%;
	min-height: 94px;
	height: auto;
	padding: 0.5%;
	margin: 0.5%;
	margin-bottom: 2%;
	display: block;
}
.index-entry a {
	color: #272727;
}

.index-entry form {
	display: inline;
}

.small-submit-button-img img {
	display: inline;
	width: 20px;
	margin-bottom: -3px;
}
.small-submit-button-img img:hover {
	background: #acacac;
}

#lexikon-link-div {
	min-height: 1.2em;
	margin: 0.5em;
}

#lexikon-link-div a {
	color: #272727;
}


/***********************************************************/
/**** Infos Content ***********************************/
/***********************************************************/

#infos-content {
	text-align: center;
	background: white;
	width: 84%;
	padding-top: 2em;
	padding-bottom: 2em;
	padding-left: 8%;
	padding-right: 8%;
	
}

#infos-content .small-heading {
	padding-top:2em;
}



.link-box-div {
	text-align: left;
	width: 90%;
	margin-left:8%;
	margin-right:auto;
}

/***********************************************************/
/**** Kontakt Content ***********************************/
/***********************************************************/


#kontakt-content {
	text-align: center;
	background: white;
	width: 70%;
	padding-top: 2em;
	padding-bottom: 2em;
	padding-left: 15%;
	padding-right: 15%;
	
}


/***********************************************************/
/**** Footer *****************************************/
/***********************************************************/

#footer {
	background: #879b9b;
	width: 100%;
	height: 1.5em;
	font-size: 0.7em !important; 
	color: white;
	border-top: 3px solid #bec6c5;
}

.footer-left {
	float:left;
	width: 20%;
	height: 100%;
	padding: 2px;
	padding-left: 20px;
}
.footer-left a {
	color: white;
    text-decoration: none;
}

.footer-right {
	float:right;
	min-width: 500px;
	width: 50%;
}
#footer ul {
    list-style-type: none;
	width: 95%;
    margin: 0;
	margin-left: auto;
	margin-right: auto;
}

.first-link-item {
	margin-left: 5px !important;
}
.first-link-item a::before {
	margin-left: 5px !important;
	content: "" !important;
}

#footer li {
    display: block;
	float:left;
	padding-top: 2px;
}


#footer li a {
	padding: 0px;
	padding-left:3px;
	padding-right:3px;
    text-decoration: none;
	color: white;
}
#footer li a::before {
	content: "| ";
}

#footer .selected {
    color: #576363 !important;
}



/**********************************************************************************************/
/********** Handy classes/narrow window classes ************************************************/
/**********************************************************************************************/
 
@media only screen and (max-device-width:640px) 
{
	body {
		font-size: 2em;
	}	

	li {
		font-size: 2em;
	}

	
	#menu {
		overflow: auto;	
		height: auto;
	}
	
	#menu ul {
		padding:0px;
		margin: 0px;
		width: 100%;
	}
	
	#menu li {
		padding:0px;
		margin: 0px;
		border-top: 1px solid white;
		display: block;
		float: none;
		padding-top: 5px;
		margin-left: 0px;
		text-align: center;
	}
	.first-link-item {
		margin-left: 0px !important;
	}

	#main-sub-heading span::before {
		content: "";
	}
	#main-sub-heading span::after {
		content: "";
	}

	.footer-right {
		display: none;
	}
	.footer-left {
		width:95%;
		text-align: center;
	}
	
	#home-content-left, #home-content-sidebar {
		margin: 0px;
		float: none;
		width: 100%;
		padding-top: 1.2em;
		padding-bottom: 1.2em;
	}
	#content-left, #content-sidebar {
		margin: 0px;
		float: none;
		width: 100%;
		padding-top: 1.2em;
		padding-bottom: 1.2em;
	}

	#viewport-selector {
		width: 60%;
	}
	
	.openseadragon {
		width: 100%;
		height: 12em;	
	}
	
	#genealogie-seadragon-div {
		padding: 0px;
		width: 100%;
	}

	.index-entry {
		background: #cdcdcd;
		width: 70%;
		min-height: 94px;
		height: auto;
		padding: 0.5em;
		margin: 0.5em;
		margin-left: 15%;
		margin-right: auto;
		display: block;
	}

	
	.openseadragon-container > div:nth-child(2)  {
		text-align: right;
		right: 50%;
		/* border: 2px solid red !important; */
	}
	.openseadragon-container > div:nth-child(2) img {
		width: 2em;
	}

	.openseadragon-container > div:nth-child(3)  {
		left: 50%;
		/* border: 2px solid green !important; */
	}

	.index-links-div a {
		margin-left: 1vw;
		color: #576363;
		
	}

	.index-column {
		height: auto;
		overflow: auto;
		width: 98%;
		padding: 0.5%;
		margin: 0.5%;
	}

	
}

