@font-face {
  font-family: "smfont";
  src: url("banksia.regular.otf");
}  
  
@font-face {
  font-family: "smbold";
  src: url("banksia.bold.otf"); 
}

html, body {
font-family:smfont, sans;
}

b {
	font-family: smbold, sans;
}

/* testen, ob Grenze fuer Mobile-Layout besser schon ab 800 gesetzt sein sollte */

@media only screen and (max-width: 600px) {
	.abstand {
	/*	margin-left:200px;*/
	}
	.bg-schulen, .bg-kg {
	background-image:none;
	}

	.logo {
		display: none;
	}
}

@media only screen and (min-width: 601px) {
	html, body {
		height:100%;
	}
	body {
		position: relative;
		margin: 0;
		font-family:smfont, sans;
		max-width:1800px;
		min-height:100%;
		overflow-x: hidden;
	}
	h1, h2, h3, h4 {
		font-family:smbold, sans;
	}
	
	a {
		text-decoration: none;
		color:#990000;
	}


footer {
	margin-left:196px;
	margin-top:25px;
	width:calc(100% - 196px);
	height:120px;
	background-color:#FFD12C;

	background-color:#F2F083;
	border-top:2px solid #C55317;
/* top right bottom left */
	font-size:0.8em;
	padding: 13px 0 0 0;

	text-align:center;	
	vertical-align:bottom;
}

#fbottom {
	padding-top:10px;
	margin:0;
	margin: 10px 0 0 0;
/*	background-color:#F2F083;*/
	font-size:0.7em;
	text-align:center;
	vertical-align:bottom;
}

#wrapper {
	min-height:calc(100% - 120px);
}


	#portfolio td {
		height:3em;
	}

	.abstand {
		width:calc(100% - 230px);
		margin-left:230px;
	}

	.form-dim {
		width:85%;
	}

	.bg-kg {
		background-image:url(../img/Tiere.png), url(../img/bg31.png);
		background-repeat: no-repeat, repeat-y;
		/*background-position:-3px 100px, 0 0;*/
		background-position:-3px 300px, 0 0;
	}
	
	.bg-schulen {
		background-image:url(../img/git_gelb.png), url(../img/bg31.png);
		background-repeat: no-repeat, repeat-y;
		background-position:-3px 300px, 0 0;
	}
	

	.mybox {
		margin:10px;
		padding:10px;
		background-color:#EEF8BF;
		border:1px solid #bababa;
/*		width:calc(50% - 150px);*/
		width:calc(50% - 50px);
	}

	.sc-color1 {
		background-color:#dfdfc9;
	}
	
	.sc-color2 {
		background-color:#ddcfcf;
	}
	.sc-color3 {
		background-color:#cddfc9;
	}
	
	.sc-color4 {
		background-color:#c9dedf;
	}

}


.unsichtbar {
	border:none;
	background-color:white;
	padding:0;
}


.card {
	background-color:transparent;
	border: none;
}


.card-header {
	background-color:transparent;
	border-bottom:none;
	font-weight:bold;
}

.card-header:before {
	content: "";
    position: absolute;
    left: 25px;
    bottom: 0;
    height: 15px;
    width: 80%;
    border-bottom: 1px solid #999;
}


.card-header a:focus {
	border:none;
	box-shadow: 0 0 0;
}

.card-header a {
	font-weight:bold;
}

.card-header a:focus::before {
	/*content: '\2796';*/
}

.card-header:hover {
}

.card:last-of-type {
	margin-bottom:20px;
}

.card-body {
/*	background-color:white;*/
	opacity:85%;
}

.collapsed::before {
	content: '\02795';
}

.active, .card:hover {
/*	background-color: #ccc;*/
}


.active::before {
}


.bg-navbar {
	background-color:#FFD12C;
	border-bottom: 1px solid #C55317!important;
}

.bg-footer {
	background-color:#FFD12C;
	border-top: 1px solid #C55317!important;
	height:40px;
}

.btn-footer {
	background-color:gray;
	border: 1px solid red;
}

.sc-farbe {
	background-color:#FCDD0B;
}