/* MZ Styles */
html, body {
	font-size: 18px;
    height: 100%;
    font-family: "Calibri", Geneva, sans-serif;
    line-height: 1.4;
    color: #2C2731; 

}

/* FARBRAUM GRÖße ROOT */
:root {	--mrot: #7f1621; --mgrau: #8A817C; --mblau: #195B94; --mgruen:#007A52; } /* Add base colors to root*/




h1 {
	font-size: 2rem; 
	font-weight: bold;
	color: #262626;
}
h1.rot { color: var(--mrot); font-size: 2rem; font-weight: bold; }

h2 {
	font-size: 1.5rem;
	font-weight: bold;

}
h2.big {
	font-size: 2rem;
	font-weight: bold;
		
}
h3 {
	font-size: 1.3rem;
	font-weight: bold;
    color: inherit;			
}
h4 {
	font-size: 1.1rem;
	font-weight: bold;
    color: inherit;			
}

.txt-big { font-size: 1.5em; }
.txt-bold { font-weight: 800; }
.font-11 { font-size: 1.1em; }
.font-12 { font-size: 1.2em; }
.font-13 { font-size: 1.3em; }
.txt-red { color: --mrot; }
.colorRed { color: var(--mrot); }
.bgColorRed { background-color:  var(--mrot) }
/* boxen */
.alert-box { background-color: var(--mrot); color: white; border: 2px solid black; padding: 0.5em;}
.box-text-grey { background-color: #BEBEBE; }
.box-text-grey h5 { font-size: 1.2em; font-weight: bold; }

/* LINK PREC */
a:link, a:visited, a:hover { color: #212529; text-decoration: none; }


a.wh:link { color: white; font-size: 1.2em; font-weight: bold; text-decoration: none; }
a.wh:hover { color: #cccccc; font-size: 1.2em; font-weight: bold; }
a.wh:visited { color: white; font-size: 1.2em; font-weight: bold; text-decoration: none; }
a.bl:link { color: #212529; font-size: 1.2em; font-weight: bold; text-decoration: none; }
a.bl:hover { color: #cccccc; font-size: 1.2em; font-weight: bold; }
a.bl:visited { color: #212529; font-size: 1.2em; font-weight: bold; text-decoration: none; }
a.box:link { color: #212529; text-decoration: none; }
a.box:hover { color: #cccccc;  animation: bgs 1s linear; animation-fill-mode: forwards; }
a.box:visited { color: #212529; text-decoration: none; }
a.blank:link { color: inherit; text-decoration: none; }
a.blank:hover { color: inherit; }
a.blank:visited { color: inherit; text-decoration: none; }
a.dropdown-item:hover { background-color: inherit; color; inherit; }



/* slider */
.slide-news {
	min-width: 300px; 
	max-height: 200px; 
	background-color: var(--mrot);
	color: white;
	padding: 1em;
}
.slide-news .head {
	border-bottom: 1px solid white;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	margin-bottom: 10px;
}
.slide-news .foot {
	border-top: 1px solid #B4777D;
	font-size: 1.2em;
	font-weight: bold;
	color: #B4777D; 
	font-size: 8pt;
	margin-top: 1em;
}

.slide-news-white {
	min-width: 300px; 
	max-height: 200px; 
	background-color: white;
	color: black;
	padding: 1em;
}
.slide-news-white .head {
	border-bottom: 1px solid white;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	margin-bottom: 10px;
}
.slide-new-white .foot {
	border-top: 1px solid #B4777D;
	font-size: 1.2em;
	font-weight: bold;
	color: #B4777D; 
	font-size: 8pt;
	margin-top: 1em;
}




.mitarbeiterStart .swiper-wrapper .swiper-slide,.mitarbeiterStart .swiper-wrapper, .mitarbeiterStart { background-color: rgba(255,255,255,1); text-align: center; }
.bgimage-cover-center { background-repeat: no-repeat; background-position: center center; background-size: cover; } 
.bgimage-full-height-center { background-repeat: no-repeat; background-position: center center; background-size: auto 100%; } 

/* Buttons */
.krema-send {
	background-color: var(--mrot);
	color: white;
	font-weight: bold;
	font-size: 1.3em;
}

.color-white {
	color: white; 
}

@keyframes example {
  from {opacity: red;}
  to {background-color: blue;}
}
@keyframes bgs {
  from {background-color: white;}
  to {background-color: #9a9893;}
}

a.submenu2020 {
	font-variant: small-caps;
	color: white; 
	font-size: 1.2em; 
	font-weight: bold;
	text-decoration: none;
}
a.submenu2020:hover {
	color: #A3A3A3; 
	-webkit-transition: color 1.5s linear;
    -moz-transition: color 1.5s linear;
    -o-transition: color 1.5s linear;
    -ms-transition: color 1.5s linear;
    transition: color 1.5s linear;
    padding-left: 2px;
}
a.submenu2020-sub {
	font-variant: small-caps;
	color: white; 
	font-size: 1.2em; 
	font-weight: bold;
	text-decoration: none;
}
a.submenu2020-sub:hover {
	color: #A3A3A3; 
	-webkit-transition: color .5s linear; 
    -moz-transition: color .5s linear;
    -o-transition: color .5s linear;
    -ms-transition: color .5s linear;
    transition: color .5s linear;
	background-color: inherit;
}

.bg-top-wrapper {
	background-image: url(/otterfing/img/bg/linden_top.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
	
ul.list-submenu {
 list-style-type: none; 
 display: block;
}

a.nav-link:link
a.lnk-submenu:link { color: white; font-size: 1.2em; font-weight: bold; text-decoration: none; }
a.lnk-submenu:hover { color: #cccccc; font-size: 1.2em; font-weight: bold; }
a.lnk-submenu:visited { color: white; font-size: 1.2em; font-weight: bold; }
.max-w-600 { max-width: 600px } 

/* Farbraum Schrift */

.bg-mrot { background-color: var(--mrot); }
.bg-blau { background-color: var(--mblau); }
.bg-gruen { background-color: var(--mgruen); }


.sticky-top { z-index: 1200 !important; }
.modal {z-index: 9999 !important; }

/** DESIGN MENU **/
.navbar-expand-lg .navbar-nav .nav-link {
	padding-left: 1rem; padding-right: 1rem; 
}

.navbar-light .navbar-nav .nav-link {
   color: white;
   font-weight: bold; 
   font-size: 1.2em;
   font-variant: small-caps;
}
.dropdown-item {
  color: white;
}

.team-flex { max-width: 500px; }





@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.dropdown-menu {
    border: 0px;
    border-radius: 0rem;
	background-color: var(--mrot);
	color: white;
}

.dropdown-menu.show {
  -webkit-animation: fadeIn 0.3s alternate;
  /* Safari 4.0 - 8.0 */
  animation: fadeIn 0.3s alternate;
}

.nav-item.dropdown.dropdown-mega {
  position: static;
}
.nav-item.dropdown.dropdown-mega .dropdown-menu {
  width: 90%;
  top: auto;
  left: 5%;
}

.navbar-toggler {
  border: none;
  padding: 0;
  outline: none;
}
.navbar-toggler:focus {
  box-shadow: none;
}
.navbar-toggler .hamburger-toggle {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 60px;
  z-index: 11;
  float: right; color: white;
}
.navbar-toggler .hamburger-toggle .hamburger {
  position: absolute;
  transform: translate(-50%, -50%) rotate(0deg);
  left: 50%;
  top: 50%;
  width: 50%;
  height: 50%;
  pointer-events: none;
}
.navbar-toggler .hamburger-toggle .hamburger span {
  width: 100%;
  height: 4px;
  position: absolute;
  background: #fff;
  border-radius: 2px;
  z-index: 1;
  transition: transform 0.2s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.2s cubic-bezier(0.77, 0.2, 0.05, 1), all 0.2s ease-in-out;
  left: 0px;
}
.navbar-toggler .hamburger-toggle .hamburger span:first-child {
  top: 10%;
  transform-origin: 50% 50%;
  transform: translate(0% -50%) !important;
}
.navbar-toggler .hamburger-toggle .hamburger span:nth-child(2) {
  top: 50%;
  transform: translate(0, -50%);
}
.navbar-toggler .hamburger-toggle .hamburger span:last-child {
  left: 0px;
  top: auto;
  bottom: 10%;
  transform-origin: 50% 50%;
}
.navbar-toggler .hamburger-toggle .hamburger.active span {
  position: absolute;
  margin: 0;
}
.navbar-toggler .hamburger-toggle .hamburger.active span:first-child {
  top: 45%;
  transform: rotate(45deg);
}
.navbar-toggler .hamburger-toggle .hamburger.active span:nth-child(2) {
  left: 50%;
  width: 0px;
}
.navbar-toggler .hamburger-toggle .hamburger.active span:last-child {
  top: 45%;
  transform: rotate(-45deg);
}

.icons {
  display: inline-flex;
  margin-left: auto;
}
.icons a {
  transition: all 0.2s ease-in-out;
  padding: 0.2rem 0.4rem;
  color: #ccc !important;
  text-decoration: none;
}
.icons a:hover {
  color: white;
  text-shadow: 0 0 30px white;
}

/* OVRITE */
.accordion-collapse,.modal-header {
	border: none; 
}
a.nav-link-bt:link {
    display: block;
    padding: .5rem 1rem;
    text-decoration: none;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
	background-color: white;
}

/* Special Button */
.btn-sv-red {
    --bs-btn-color: #fff;
    --bs-btn-bg: #7F1621;
    --bs-btn-border-color: #8A817C;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #8A817C;
    --bs-btn-hover-border-color: #7F1621;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #7F1621;
    --bs-btn-active-border-color: #7F1621;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	border-radius: 0px; font-weight: bold; min-width: 200px; min-height: 3em; 
}
.btn-sv-red-big {
    --bs-btn-color: #fff;
    --bs-btn-bg: #7F1621;
    --bs-btn-border-color: #8A817C;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #8A817C;
    --bs-btn-hover-border-color: #7F1621;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #7F1621;
    --bs-btn-active-border-color: #7F1621;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #8A817C;
    --bs-btn-disabled-border-color: #8A817C;
	border-radius: 0px; font-weight: bold; min-width: 200px; min-height: 200px; 
}
.btn-sv-red-big-flex {
    --bs-btn-color: #fff;
    --bs-btn-bg: #7F1621;
    --bs-btn-border-color: #8A817C;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #8A817C;
    --bs-btn-hover-border-color: #7F1621;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #7F1621;
    --bs-btn-active-border-color: #7F1621;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #8A817C;
    --bs-btn-disabled-border-color: #8A817C;
	border-radius: 0px; font-weight: bold; min-width: 200px; 
}

/* MODAL Modification */
.modal-model-1 {
	
	border-radius: 0px;
	background-color: #7F1621;
	color: white;
}

/* FLEX */
.flex-w-300 { max-width: 300px; background-color: #D6C8C1; }
.flex-w-soft { background-color: #C4B8B1; }
.milon-flex { max-width: 400px; background-color: rgba( 190, 190, 190,0.9); border: 1px solid var(--mrot); }
.milon-flex h5 { font-size: 1.3rem; font-weight: bold; }

/* TRAINING */
.flex-training-small { width: 250px; font-weight: bold; color: white; background-color: rgba(127,22,33,0.9); border: 1px solid #2C2730 }
.flex-training-small-full { width: 250px; font-weight: bold; color: white; background-color: rgba(127,22,33,1); border: 1px solid #2C2730 }
.btn-front-big { --bs-btn-color: #fff;
    --bs-btn-bg: #2C2730;
    --bs-btn-border-color: #8A817C;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #8A817C;
    --bs-btn-hover-border-color: #8A817C;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #7F1621;
    --bs-btn-active-border-color: #7F1621;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #8A817C;
    --bs-btn-disabled-border-color: #8A817C;
	border-radius: 0px; font-weight: bold;  font-size: 1.3em; width: 250px; font-weight: bold; color: white; }