﻿/*   CSS für Home Einigkeit Palsweis Priel   */

/* @import url("reset.css"); */

body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    color:#333
}

#wrapper {
    margin: 0 auto;
    width:100%;
}


@media only screen and (min-width: 1920px) {
	#navigation {float: left; width:100%; background: white;}

	#content {float: left; width: 60%; background: #FFFFFF;}
	#content_textbox1 {float: left; width: 100%; background-color: #B7D3EE; border-radius: 0px 0px 8px 8px; text-align: center;}
	#content_textbox1 h1 {margin: 2px; font-size: 24px; font-style: italic;}
	#content_textbox1 h2 {margin: 1px; font-size: 20px; font-style: italic; color:#FFFFFF}

	#content_textbox2 { float: left; width: 100%; background-color: white; border: thin #B7D3EE solid; border-radius: 8px 8px 8px 8px; text-align: center;}
	#content_textbox2 h3 {font-size: 20px;font-style: italic; margin: 4px;}
	#content_textbox2 p { font-size: 20px;  font-style: italic; margin: 4px;}

	#content_table {float: left; width: 100%; margin-top: 5px; background-color: white; text-align: center;}
	#content_table table{ margin-left: auto; margin-right: auto;}
	#content_table table td {border-bottom: medium black solid; font-size:20px;}
	#content_table table thead tr th { font-size:22px; font-style: italic; border-bottom: medium black double; }
	#content_table table tr:nth-child(even) {background-color: #DDDDDD;}
	#content_table table tr:nth-child(odd) {background-color: #fff;}

	#leftcolumn {float: left; margin-right: 2px; background: whit; width: 18%; text-align: center;}
	#leftcolumn h3 {margin: 1px;}
	#leftcolumn img{height: 50%; width: 50%;}

	#rightcolumn {float: left; margin-left: 2px; background: white; width: 18%; text-align: center;}
	#rightcolumn h3 {margin: 1px;}
	#rightcolumn img{height: 50%; width: 50%;}
	
}

@media only screen and (max-width: 1920px) {
	/* green */
	#navigation {float: left; width:100%;}

	#content {float: left; width: 60%;}
	#content_textbox1 {float: left; width: 100%; background-color: #B7D3EE; border-radius: 0px 0px 8px 8px; text-align: center;}
	#content_textbox1 h1 {margin: 2px; font-size: 24px; font-style: italic;}
	#content_textbox1 h2 {margin: 1px; font-size: 20px; font-style: italic; color:#FFFFFF}

	#content_textbox2{float: left; width: 100%; margin-top: 10px; background-color: white; border: thin #B7D3EE solid; border-radius: 8px 8px 8px 8px; text-align: center;}
	#content_textbox2 h3 { font-size: 20px; font-style: italic; margin: 2px;}
	#content_textbox2 p { font-size: 20px;  font-style: italic; margin: 10px;}

	#content_table {float: left; width: 100%; margin-top: 10px; background-color: white; text-align: center;}
	#content_table table { margin-left:auto; margin-right:auto;}
	#content_table table td { font-size: 20px; border-bottom: medium black solid; }
	#content_table table thead tr th { font-size: 20px; font-style: italic; border-bottom: medium black double; }
	#content_table table tr:nth-child(even) {background-color: #DDDDDD;}
	#content_table table tr:nth-child(odd) {background-color: #fff;}

	#leftcolumn {float: left; margin-right: 2px ; background: white; width: 18%; text-align: center;}
	#leftcolumn h3 {margin: 1px;}
	#leftcolumn img{height: 50%; width: 50%;}

	#rightcolumn {float: left; margin-left: 2px ; background: white; width: 18%; text-align: center;}
	#rightcolumn h3 {margin: 1px;}
	#rightcolumn img{height: 50%; width: 50%;}
}

	
@media only screen and (max-width: 1024px) {
	/* aqua */
	#navigation {float: left; width:100%;}

	#content {float: left; width: 60%;}
	#content_textbox1 { float: left; width: 100%; background-color: #B7D3EE; border-radius: 0px 0px 8px 8px; text-align: center;}
	#content_textbox1 h1 {margin-top: 2px; font-size: 20px; font-style: italic;}
	#content_textbox1 h2 {margin-top: 2px; margin-bottom: 2px; font-size: 18px; font-style: italic; color:#FFFFFF}

	#content_textbox2{ float: left; width: 100%; margin-top: 2px; background-color: white; border: thin #B7D3EE solid; border-radius: 8px 8px 8px 8px; text-align: center;}
	#content_textbox2 h3 {font-size: 18px; font-style: italic;}
	#content_textbox2 p { font-size: 18px; font-style: italic;}

	#content_table {float: left; width: 100%; margin-top: 3px; background-color: white; text-align: center;}
	#content_table table { margin-left:auto; margin-right:auto;}
	#content_table table td { font-size: 16px; border-bottom: medium black solid;}
	#content_table table thead tr th { font-size:18px; font-style: italic; border-bottom: medium black double; }
	
	#leftcolumn {float: left; margin-right: 2px ; background: white; width: 18%; text-align: center;}
	#leftcolumn h2 {font-size: 16px; padding: 0px;}
	#leftcolumn img{height: 40%; width: 40%;}
	
	#rightcolumn {float: left; margin-left: 2px; background: white; width: 18%; text-align: center;}
	#rightcolumn h2 {font-size: 16px; padding: 0px;}
	#rightcolumn img{height: 40%; width: 40%;}
}

@media only screen and (max-width: 768px) {	
    /*maroon */	
	#navigation {float: left; width:100%;}

	#content {float: left; background: #FFFFFF; width: 100%;}
	#content_textbox1 {float: left; width: 100%; background-color: #B7D3EE; border-radius: 0px 0px 8px 8px; text-align: center; font-size: 12px;}
	#content_textbox1 h1 {margin-top: 2px; font-size: 18px; font-style: italic;}
	#content_textbox1 h2 {margin-top: 2px; margin-bottom: 2px; font-size: 16px; font-style: italic; color:#FFFFFF}

	#content_textbox2 {float: left; width: 100%; margin-top: 2px; background-color: white; border: thin #B7D3EE solid; border-radius: 8px 8px 8px 8px; text-align: center;}
	#content_textbox2 h3 {margin-top: 3px; margin-bottom: 3px; font-size: 18px; font-style: italic; text-decoration: underline;}
	#content_textbox2 p {font-size: 18px; font-style: italic; margin-top: 2px; margin-bottom: 2px; }

	#content_table {float: left; width: 100%; margin-top: 3px; background-color: white; text-align: center;}
	#content_table table {margin-left:auto; margin-right:auto;}
	#content_table table td {border-bottom: medium black solid; font-size: 16px;}
	#content_table table thead tr th { font-size:16px; font-style: italic; border-bottom: medium black double; }

	#leftcolumn {display:none;}
	#rightcolumn {display:none;}
}

@media only screen and (max-width: 680px) {	
	/* orange */	
	#navigation {float: left; width:100%;}

	#content {float:left; background: #FFFFFF; width: 100%;}
	#content_textbox1 {float: left; width: 100%; background-color: #B7D3EE; border-radius: 0px 0px 8px 8px; text-align: center;}
	#content_textbox1 h1 {margin-top: 2px; font-size: 16px; font-style: italic;}
	#content_textbox1 h2 {margin-top: 2px; margin-bottom: 2px; font-size: 16px; font-style: italic; color:#FFFFFF}
		
	#content_textbox2 {float: left; width: 100%; margin-top: 2px; background-color: white; border: thin #B7D3EE solid; border-radius: 8px 8px 8px 8px; text-align: center;}
	#content_textbox2 h3 {margin-top: 3px; margin-bottom: 3px; font-size: 16px; font-style: italic; text-decoration: underline;}
	#content_textbox2 p {font-size: 16px; font-style: italic;margin-top: 2px; margin-bottom: 2px; }

	#content_table {float: left; width: 100%; margin-top: 2px; text-align: center;}
	#content_table table {border: 1px solid white;border-collapse: collapse; margin-left:auto; margin-right:auto; padding: 0px; table-layout: fixed; min-width: 90%;}
	#content_table table td{padding: 1px; border: 1px solid gray; display: block; text-align:center; width: 100%\9; float: left\9;}
	#content_table table tr th{background-color: #f4f1f1; color:#000000; text-align:right; margin:0} /*2px*/

	#content_table table tr{display: block;}
	#content_table table td:not(:first-child){border-top:0px;}
	/* #content_table table .mobile-head{font-weight:bold;color:#000000;float:left;text-align:left;display:block} */
	
	#leftcolumn {display:none;}
	#rightcolumn {display:none;}
}
