
:root {
  --gray: #363c42;
  --orange: #ec6726;
}

html {
}

body {
	font-family: museo-sans, sans-serif;
	font-weight: 300;
	font-style: normal;
	color: var(--gray);
	background-color: var(--gray);
}

.bg-white {
	background-color: #FFFFFF;
}

.bg-test {
	background-color: #e2cbcb !important;
}

.bg-gray {
	background-color: var(--gray);
}

.bg-orange {
	background-color: var(--orange);
}

.bg-lg-white {
	@media only screen and (min-width: 1200px) {
		background-color: #FFFFFF !important;
	}	
}

.text-lg-gray {
	@media only screen and (min-width: 1200px) {
		color: var(--gray) !important;
	}
}


/* Texte & Links _______________________________ */

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {
	font-weight: 900;
}

.d-5 {
	@media only screen and (min-width: 1200px) {
		font-size: calc(1.375rem + 0.25vw);
	}
}

.d-6 {
	@media only screen and (min-width: 1200px) {
		font-size: calc(1.375rem + 0.1vw);
	}
}

b, strong, .b, .strong, .bold {
	font-weight: 700;

}


.small, small {
	font-size: .75em !important;
	line-height: normal !important;
}

a, a:hover, a:active {
	color: var(--gray);
	text-decoration: none !important;
}

.content a {
	text-decoration: underline !important;
}

.news a {
	color: #ffffff;
}

.table {
	font-size: 1.25em;
	margin-top: 2rem;
}

.table-striped tr:first-child td {
	color: white;
	background-color: var(--gray);
}

.info {
	font-weight: 700;
font-size: 1.25em;
}


/* Buttons _______________________________ */

.btn-orange, .btn-orange:hover, .btn-orange:active {
	color: #ffffff;
	background-color: var(--orange);
	border-color: var(--orange);
}

/* Accordion _______________________________ */

.accordion-header {
	font-weight: 700;

}

.accordion-button {
	font-size: 1.25em;
	font-weight: 700;
}

.accordion-button:not(.collapsed) {
	color:  var(--gray);
	background-color: white !important;
}


/* MODAL JOBS ------------------------------------------------------------ */

/* .modal-content {
	@media only screen and (min-width: 1200px) {
		background-image: url("../img/modal-bg.png") !important;
		background-size: contain !important;
		background-repeat: repeat !important;
	}
} */

.button-close {
	position: absolute;
	top: 15px;
	right: 15px;
}


/* Formular _______________________________ */

.form-control {
	width: 100% !important;
}

::placeholder {
	color:navy;
	opacity:1;
	transition: opacity 1s;
}

:focus::placeholder { opacity:0  }


/* img-box & max-row _______________________________ */

.img-box {
	background-image: url("../img/test2.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	@media only screen and (max-width: 1199px) {
		min-height: 56vw !important;
	}	
}


@media only screen and (min-width: 1200px) {
	.max-row {
	width: 90vw;
	max-width: 1500px !important;
	}
}


/* Contentbox border on mobile view _______________________________ */

.border-mobil-0 {
	@media only screen and (max-width: 1199px) {
		border: none !important;
		border-width: 0px !important;
	}	
}

/* Header _______________________________ */

.header {
	/*background-image: url("../img/test3.jpg"); */
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
	@media only screen and (min-width: 1200px) {
		background-attachment: fixed;
	}	
}

.header-content {
	height: 45vh;
	min-height: 350px;
	max-height: 500px;
}


.header-content h2 {
	font-size: 7rem;
	font-weight: 900;
	text-transform: uppercase;
	color: white;
	text-shadow: 0px 0px 7px rgba(0,0,0,0.3););
	@media only screen and (max-width: 1199px) {
		font-size: 3rem;
	}	
}

.wetter {
	font-size: 1.25rem;
	@media only screen and (max-width: 1199px) {
		font-size: 1rem;
	}
	color: #ffffff;
	text-shadow: 0px 0px 5px rgba(0,0,0,0.3););
}
.wetter a, .wetter a:hover .wetter a:active {
	color: white;
	
}


/* Navigation _______________________________ */

.navbar  {
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: -0.05rem;
}

.navbar a, .navbar a:hover .navbar a:active {
	color: white;
}

.nav-link {
	text-shadow: 0px 0px 5px rgba(0,0,0,0.3););
	}

.nav-link {
	font-size: 2rem;
	color: white;
	text-shadow: 0px 0px 5px rgba(0,0,0,0.3););
}

.nav-link:hover {
	color: white;
}


.level-2 {
	font-size: 1rem;
	font-weight: 300;
}

.nav-level-2-hidden {
	display: none;
}

.offcanvas {
	width: 100vw !important;
	color: pink !important;
}

.navbar-toggler {
	color: #ffffff !important;
	text-shadow: 0px 0px 5px rgba(0,0,0,0.3););
}

.navbar-toggler:focus {
	box-shadow: none !important;
}

.btn-close {
	background-image: none !important;
	opacity: 1 !important;
}

.open {
	color: #10d119;
}

.closed {
	color: #dd0a0a;
}

.hinweis {
	color: #f3cd0b;
}

/* Footer _______________________________ */

.footer-logo {
	max-height: 7.5rem;
	width: auto;	
}

.footer-at {
	font-weight: 300 !important;
}

.footer-a, .footer-a:hover, footer-a:active {
	color: #FFFFFF;;
}

.footer-icon {
	height: 5rem;
	width: 5rem;
	margin-top: -0.25rem;
	background-color: pink !;
	@media only screen and (max-width: 1199px) {
			height: 3rem;
			width: 3rem;
	}		
}


/* WIRD NICHT MEHR BENÖTIGT .square {
	@media only screen and (min-width: 1200px) {
	    width: 100%;
		padding-bottom: 100%;
	    background-size: cover;
	    background-position: center;
	}
} */