@charset "utf-8";

:root {
	--maincolor: #000000;
	--mainbgcolor1: #FFFFFF;
	--mainbgcolor2: #CCCCDD;
	--mainbgcolor3: #9999AA;
	
	--bc1t75		: #CCCCDDCC;
	--bcdk75		: #000033CC;	
	
	--colordark1: #000000;
	--colordark2: #112244;
	--colordark3: #0000FF;
	--colordarkgreen: #008800;
	--colordarkred: #720311;
	--colordarkblue: #000077;
	--colordarkmage: #880088;
	--colorgreen: #00FF00;
	--colorred: #cc061f;
	--colorblue: #FFFF00;
	--colormage: #FF00FF;
	--coloryellow: #FFFF00;
	--colorwhite: #FFFFFF;
}

/* elemente */

html, body {
	overflow-x:hidden;
	color: var(--colordark2);
	background-color: var(--mainbgcolor1);
}

/* Works on Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--colordark2) var(--mainbgcolor2);
}

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 12px;
}

*::-webkit-scrollbar-track {
  background: var(--mainbgcolor2);
}

*::-webkit-scrollbar-thumb {
  background-color: var(--colordark2);
  border-radius: 20px;
  border: 3px solid var(--mainbgcolor2);
}

a {
	text-decoration: none;
	color: var(--colordark1);
}
a:hover {
	text-decoration: underline;
	color: var(--colordark2);
}
a.kontent {
	text-decoration: none;
	color: var(--maincolor);
}
a.kontent:hover {
	text-decoration: underline;
	color: var(--colorblue);
}
a.altbg {
	text-decoration: none;
	color: var(--mainbgcolor1);
}
a.altbg:hover {
	text-decoration: underline;
	color: var(--mainbgcolor2);
}
.main {
	padding-left: 16px;
	padding-right: 16px;
	color: var(--maincolor);
}
.mainfod {
	padding-left: 24px;
	padding-right: 24px;
	color: var(--maincolor);
	z-index: 1000;
    background-color: var(--mainbgcolor1);
}
nav {
	background-color: var(--mainbgcolor1);	
}
.container {
}
.bgwtrn {
	padding: 12px;
	background: rgba(255,255,255,0.7);
}
.space {
	height: 20px;
}
.ninanav {
	border-bottom: 0px solid var(--maincolor);
}
.conbox {
	background-color: RGBA(255, 255, 255, 0.7);	
	padding: 8px;
	margin: 8px;
}
.note {
	background-color: var(--bc1t75);	
	border: 1px solid var(--maincolor);
	-webkit-box-shadow: 0px 0px 0px 2px #193e73, 0px 0px 0px 5px #3067af, 0px 0px 0px 7px #193e73;
	box-shadow: 0px 0px 0px 2px #193e73, 0px 0px 0px 5px #3067af, 0px 0px 0px 7px #193e73;
	border-radius: 8px;
	padding: 8px;
}
.fullkon {
    background: rgba(255,255,255,0.5);
	border: 1px solid var(--maincolor);
	color: var(--maincolor);
	margin-top: 20px;
	padding: 8px;
}
.headnav {
    margin: 0 auto; 
    position: relative;
}
.headnavlink {
	font-size: 16pt;
	font-weight: 600;
	margin: 18px;
	border-radius: 6px;
	-webkit-box-shadow: 0px 0px 0px 2px #193e73, 0px 0px 0px 5px #3067af, 0px 0px 0px 7px #193e73;
	box-shadow: 0px 0px 0px 2px #193e73, 0px 0px 0px 5px #3067af, 0px 0px 0px 7px #193e73;
	background: var(--mainbgcolor1);
	transition: 0.5s;
}
.headnavlink:hover {
	-webkit-box-shadow: 0px 0px 0px 3px #3067af, 0px 0px 0px 10px #193e73, 0px 0px 0px 13px #3067af;
	box-shadow: 0px 0px 0px 3px #3067af, 0px 0px 0px 10px #193e73, 0px 0px 0px 13px #3067af;
}
.pointernav {
	background: var(--mainbgcolor2);
	margin: 18px;
}
.fodnav {
    margin: 0 auto; 
    position: relative;
	color: var(--mainbgcolor1);
}
.fodnavlink {
	font-size: 11pt;
	font-weight: 600;
}
.fodnavlink:hover {
	background-color: var(--mainbgcolor2);
}
.tnavlink {
	font-size: 10pt;
	font-weight: 400;
	margin: -12px;
	padding: -12px;
}
.tnavlink:hover {
	font-weight: 600;
}
.floatleft {
	float: left;
}
.margin4 {
	margin: 4px;	
}
.imgcase {
	float: left;
	margin: 0px;
	padding: 8px;
	background-color: var(--mainbgcolor1);
	width: 100%;
}
.galimg {
	width: 100%;
}
.imgbgcase {
	background-image: url("media/dummy.gif");
    background-repeat:no-repeat;
    background-size:cover;
    background-position: center center;
	min-height: 300px;
	text-align: center;
}
.multicol {
	columns: 2 300px;
    column-gap: 2em;
    text-align: justify;
}
#refgallerie {
  line-height: 0;
   
  -webkit-column-count: 4;
  -webkit-column-gap:   0px;
  -moz-column-count:    4;
  -moz-column-gap:      0px;
  column-count:         4;
  column-gap:           0px;  
}

#refgallerie img {
  width: 100% !important;
  height: auto !important;
}
.conbox {
	background-color: RGBA(255, 255, 255, 0.7);	
	color: var(--colordark2);
	padding: 8px;
	margin: 8px;
}
#imgbgosmm {
	background-image: url(../media/net/map.webp);
    background-repeat:no-repeat;
    background-size:cover;
    background-position: center;
    height: 99%;
    min-height: 450px;
}
.bordercase {
	border: 1px solid var(--mainbgcolor1);
}
.sliderfull {
    background-color: var(--mainbgcolor2);  
}

/*   Bootstrapelemente - Overlay */

.card {
	border: 1px solid var(--maincolor);
}
.card-header {
	background-color: var(--mainbgcolor1);
}
.card-body {
	background-color: var(--mainbgcolor2);
}

button {
	cursor: pointer;
	border-radius: 5px;
}

/*   farben und markierungen          */

.err {
	color: var(--colorred);
	background-color: var(--mainbgcolor2);
	border-bottom: 1px solid var(--colorred);
}
.clstd {
	color: var(--colordark);
	background-color: var(--mainbgcolor2);
	border: 1px solid var(--colordark2);
}
.clerr {
	color: var(--colordarkred);
	background-color: var(--mainbgcolor2);
	border: 1px solid var(--colordarkred);
}
.tcstd {
	color: var(--colordark);
}
.tcerr {
	color: var(--colordarkred);
}
.tcgreen {
	color: var(--colorgreen);
}
.tcred {
	color: var(--colorred);
}
.tcblue {
	color: var(--colorblue);
}
.tcmage {
	color: var(--colormage);
}
.tcyellow {
	color: var(--coloryellow);
}
.tcwhite {
	color: var(--colorwhite);
}
.txmark {
	color: var(--colordark2);
	font-weight: 600;
	text-decoration: underline;
}
.txbold {
	font-weight: 600;
}

/*   formulare          */

input, select, textarea {
	color: var(--colordark1);
	background-color: var(--mainbgcolor1);
	border: 1px solid var(--colordark2);
	border-radius: 5px;
}
input:focus, select:focus, textarea:focus {
	color: var(--colordark1);
	background-color: var(--mainbgcolor1);
	border: 1px solid var(--colordark2);
	border-radius: 5px;
}
option {
	color: var(--colordark1);
	background-color: var(--mainbgcolor1);
	border: 0px solid var(--colordark2);
	border-radius: 5px;
}
.ipsend {
	color: var(--colordarkgreen);
	font-weight: 600;
	background-color: var(--mainbgcolor1);
	border: 1px solid var(--colordark2);
}
.ipbutton {
	color: var(--colordarkblue);
	font-weight: 600;
	background-color: var(--mainbgcolor1);
	border: 1px solid var(--colordark2);
}
.ipstop {
	color: var(--colordarkred);
	font-weight: 600;
	background-color: var(--mainbgcolor1);
	border: 1px solid var(--colordark2);
}
.clstd {
	color: var(--colordark);
	background-color: var(--mainbgcolor1);
	border: 1px solid var(--colordark2);
}
.clerr {
	color: var(--colordarkred);
	background-color: var(--mainbgcolor2);
	border: 1px solid var(--colordarkred);
}
.tcstd {
	color: var(--colordark);
}
.tcerr {
	color: var(--colordarkred);
}

/*   tabellen             */

.tbborder {
	border: 1px solid var(--maincolor);
}
.tbhover {
}
.tbhover:hover {
	background-color: var(--mainbgcolor1);
}
.pointer {
	font-weight: 600;
}
.dispointer {
	font-weight: 200;
}
.task {
	background-color: var(--mainbgcolor1);
}
.left {
	text-align: left;
}
.center {
	text-align: center;
}
.right {
	text-align: right;
}
table.fullwidth, .fullwidth {
	width: 100%;
}
.col7 {
	width: 14%;
}
.disttop {
	margin-top: 16px;
}
.disttop2 {
	padding-top: 16px;
}
.distbottom {
	margin-bottom: 16px;
}