@import url('../../font/font.css');
@import url('../../font/fontawesome-free-7.1.0-web/css/all.css');

@media screen and (-webkit-min-device-pixel-ratio:0) { html {-webkit-font-smoothing: antialiased;}} /* -- none, antialiased oder subpixel_antialiased möglich -- */

:root {
	--primary-color: #00668f;
	--secondary-color:#C8E0EF;
	--text-color: #000;
	--primary-bg-color: #fff;
	--secondary-bg-color: #ededed;
	--hover-link-color: #be2c13;
}

html, body{
	width:100%;
	margin:0px;
	padding:0px;
	font-size:0.96em;
	font-family:Source Sans, Arial, Helvetica, sans-serif;
}

#iframe{
		width:900px;
		border:none;
		height:1000px;
		z-index: 1;
}

ul { list-style:none; padding:0; margin:0; }

#foot {
	text-align:left;
	width:800px;
	margin-left:235px;
	margin-right:40px;
	font-size:0.9em;
	padding-top:8px;
}

#container{
	background-image:url("../grafik/head.png");
	background-repeat:no-repeat;
	margin:0 auto;
	width:1200px;
}

a { text-decoration:none; color:var(--primary-color); }
a:hover { color:var(--hover-link-color); }
h1 {
	font-weight:300;
	font-size: 2em;
	color:var(--primary-color);
	text-transform: uppercase;
	letter-spacing: 0.02em;
}
h2 {
	font-size: 1.5em;
	font-weight: 600;
}
h3 {
	font-size: 1.1em;
	font-weight: 600;
}

img { border:none; }

.veroeffentl {
	width: 525px; 
	height: auto;
	float:left;
	margin:0px 0px 10px 3px;
	outline: 2px solid var(--secondary-color);
	color:var(--text-color);
}

.veroeffentl:hover {
	outline: 3px dashed var(--hover-link-color);
	color:var(--text-color);
}

.veroeffentl_pic {
	padding:5px; 
	float: left; 
	padding-right: 10px;
}

.veroeffentl_text {
	padding-right: 10px;
	padding-top: 40px;

}


/* KOPF BEREICH */

#kopf { 
	width:200px;
	background-repeat:no-repeat;
	height:114px;	
	margin-bottom:10px;
	color:var(--primary-bg-color);
	vertical-align:bottom;
	}

/* NAVIGATION */
.menu	{position: relative; display: flex; align-items: center; overflow: hidden;}
.menu ul {padding: 0; margin: 0; position: relative; display: flex; column-gap: 10px; }
.menu li {position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 0.85em; letter-spacing: -0.01em; text-decoration: none; color:var(--primary-color); width: 65px; height: 45px; padding: 6px 0px 0px;}
.menu i {font-size: 1.9em;}
.menu li:hover {outline: 3px dashed var(--hover-link-color); outline-offset: -3px;}

#navigation{
	float:left;
	width:220px;
}
#navigation ul{
	padding:0px; margin:0px; list-style:none;margin-top:10px;	
}
#navigation .top{
	width:200px;
	font-size:1.4em;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	text-align:left;
	font-weight:400;
	color: var(--primary-color);
	margin-top: 15px;
}

#navigation .link{
	float:left;	
	width:220px;
	border-bottom:2px solid var(--secondary-bg-color);
}
#navigation .link a{
	color:var(--text-color); 
	display:block; 
	padding:2px 2px 3px 5px;  
	font-weight:normal; 
	font-size:1em;
}
#navigation .link a:hover{
	outline: 3px dashed var(--hover-link-color);
}

/* CONTENT */
#content { 
	background-image:none;
	position:relative;
	float:left;
	width:910px;
	padding:20px;
	text-align:left;
	margin-top:16px;
	margin-bottom: 0px;
	margin-left: 5px;
}
#content img { max-width:950px; text-align:center; }
#content ul{
	margin:0px;
	padding:0px;
	list-style:none;
	text-align:left;
}
/*#content ul li { padding:0px; margin:0px; }*/

/* THEMEN */

.themen_kopf{
	width:888px;
	font-weight:300;
	font-size: 2em;
	color:var(--primary-color);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	padding:2px;
	margin-bottom:5px;
}

.themen_punkt1{background-color:var(--secondary-bg-color);}
.themen_punkt1, .themen_punkt2{ padding:5px; padding-left:10px; width:885px;}
.themen_punkt1:hover, .themen_punkt2:hover{outline: 3px dashed var(--hover-link-color);}

/* OBERE NAVIGATION */
.top_navi { 
	text-align:right; 
	float: right;
	z-index:2;
}
.icn {
	-webkit-filter: sepia(1) hue-rotate(160deg) brightness(0.8);
    filter: sepia(1) hue-rotate(160deg) brightness(0.8);
}
.icn:hover {
	-webkit-filter: sepia(0);
    filter: sepia(0);
}


/* TABELLEN */
.h1 {
	font-weight:300;
	font-size: 2em;
	color:var(--primary-color);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin-bottom: -15px;
	margin-top:-5px;
}
.h2 {
	font-size: 1.3em;
	font-weight: 600;
}
.th {
	background-color:#9FB9C6;
	padding: 0px 10px 0px 10px;
	min-width: 30px;
	line-height: 0px;
	border: solid 1px #fafafa;
	font-weight: 600;
}
.tr {
	background-color:#DBE5E9;
	padding: 0px 10px 0px 10px;
	line-height: 0px;
	border:  solid #fafafa 1px;
	border-bottom: none;
	border-top: none;
	empty-cells: show;
}
.p_rand {
	text-align: left;
}
.p_inh {
	text-align: right;
}

.p_head {
	text-align: center;
}
.p_fussnote {
	font-size: 0.8em;
	line-height: 0.8em;
}

/* GEMEINDEPROFILE */

summary {padding-bottom:5px; font-size:1.2em; font-weight:600; color:var(--primary-color);}
summary:hover{cursor: pointer; outline: 3px dashed var(--hover-link-color);
	color:var(--primary-color);}

details li {
	width: 880px; 
	height: auto;
	float:left;
  	padding: 2px 8px 3px;
	margin-left: 12px;
}

details li:hover {
	outline: 3px dashed var(--hover-link-color);
	outline-offset: -3px;
}

.gp1{ background-color:var(--secondary-bg-color);}

/* SOCIAL MEDIA */
    .social-btn {
                font-size: 2.5em;
				color: var(--primary-color);
                                display:flex;
                                align-items: center;
                                justify-content: center;
                                height: 50px;
                                width: 50px;
                border-radius: 0px;
                                margin-right: 8px;
				outline: 2px solid var(--secondary-color);
        }
.social-btn:hover {
			outline: 3px dashed var(--hover-link-color);
}

/* COPYRIGHT */
.copyright {margin-right:30px; font-size:1.2em; text-decoration: underline;}