/* CSS von Webdesign Hotte - für Harambe Afrika */

@import url(https://fonts.googleapis.com/css?family=Cinzel+Decorative:400,700);

body {
	max-width: 750px;
	font-family: Verdana, sans-serif;
	color: #4d1203 !important;
  	background-color: #4D1203;
	margin: 0 auto;
	hyphens: auto;
	background-image: url(../pic/bg2.png);
	background-size: cover;
		background-attachment: fixed;
        background-position: center center;
        background-repeat: no-repeat;
}

.text-hari {
	color: #8e2415;
}
	
@media only screen and (max-width: 750px) {  
body {background-image: none;}
}

.bg-stroh {
	background-image: url(../pic/bg-stroh.jpg);
  background-repeat: repeat-y;
  background-size: contain;
}

ul {
	list-style-image: url('../pic/li.png');
}

i.versteckt {
  visibility: hidden;
}

button[type="button"] {
    outline: none !important;
    box-shadow: none !important;
}

input.form-control, select.form-control {
	background-color: #ffc107 !important;
	font-weight: 700;
}

input[type=radio] + label {
	color: #8e2415 !important;
	background-color: #f5aa1a !important;
} 

input[type=radio]:checked + label {
	color: #000 !important;
	background-color: #ffc107 !important;
	font-weight: 700 !important;
}

/*
.offcanvas {
  background-color: rgba(0, 0, 0, 0.4);
}
*/
.offcanvas-backdrop::before {
  background-color: rgba(0, 0, 0, 0.1);
}

#inhalt {
  transition: 1.5s;
}

.header {
	background-image: url(../pic/kl-logo.jpg);
	background-repeat: no-repeat; 
	background-position: center center;
	background-size: cover;
	opacity: 0;
	transition: opacity .6s linear;
	background-color: #ffc107;
	margin-top: -80px;
}
.sticky {
	background-image: url(../pic/kl-logo.jpg);
	background-repeat: no-repeat; 
	background-position: center center;
	background-size: cover;
	opacity: 1;
	transition: opacity .6s linear;
}
@media only screen and (max-width: 750px) {  
.sticky {background-image: url(../pic/h-logo.jpg);}
}

.shadow-unten {
-webkit-box-shadow: 0px 10px 10px -7px #2C2C2C; 
box-shadow: 0px 10px 10px -7px #2C2C2C;
}

.card-bg {
	background-color: rgba(255, 180, 28, 0.9);
	border: 1.5px solid #861c01;
	border-radius: 12px;
}

.blocktext {
  text-align: justify;
  text-justify: inter-word;
}

.headline {
	font-family: 'Cinzel Decorative', cursive;
	color: #9D1300;
	font-size: 26px;
	text-shadow: -2px -1px 0px #ffffffc9;
	font-weight: 700;
	text-align: center;
}
.headline {
	font-family: 'Cinzel Decorative', cursive;
	color: #fcf2dc   ;
	font-size: 26px;
	text-shadow: 2px 2px 3px #4d111a;
	font-weight: 700;
	text-align: center;
}

.headline-klein {
	font-family: 'Cinzel Decorative', cursive;
	color: #9D1300;
	font-size: 20px;
	font-weight: 700;
}

.text-lime {
	color: #1dad1d;
}

.text-danger2 {
color: #CF1813;
}

.orna {
	width: 150px;
	opacity: 1;
		filter: drop-shadow(1px 0 0 white) 
			drop-shadow(0 1px 0 white)
			drop-shadow(-1px 0 0 white) 
			drop-shadow(0 -1px 0 white)
			drop-shadow(0 0 2px white);
}
	
.icons {
	width: 40px;
	opacity: 1;
}

.hidden {display:none;}
.visible {display:block;}

a.link { color: #F7D6A7; text-decoration: none; }
a.link:visited { color: #F7D6A7; }
a.link:active { color: #7F1A09; }
a.link:hover { color: #ffc107; }
a.link1 { color: #62B42C; text-decoration: none; }
a.link1:hover { color: red; }
a.link2 { color: #C00000; text-decoration: none; }
a.link2:hover { color: red; }
a.link3 { color: #C00000; text-decoration: underline; padding-right: 15px; background: url(../pic/external-link.png) right no-repeat;}
  
.visible-mobile { display:none;}
.visible-desktop{ display:inline-block;}

@media only screen and (max-width: 750px) {
.visible-mobile { display:inline-block;}
.visible-desktop{ display:none;}
}