@charset "UTF-8";

/* ---------- FONTS------------------- */


/*google Fonts für Schriften*/
@import url("fonts.css"); 

/* ---------- FARBEN ------------------- */

/* Hausfarbe 1(blau): #135198 */
/* Hausfarbe 2(gelb): #EFAA3C */
/* helleres blau: #4475AD */
/* Schwarz: #313131 */
/* Weiß: #ffffff */


/* ---------- GENERIC -------------------*/
html {
	font-size: 16px;
}
body {
	font-family: "Montserrat", sans-serif;
  	color: #313131;
	background-color: #ffffff;
	font-weight: 300;
}
main {
	padding: 90px 0;
}

/* ---------- ELEMENTS -------------------*/

/* .............. headlines ...... */

h1, h2, h3 {
	font-family: "Kanit", sans-serif;
	font-weight: 600;
	color: #135198;
	text-transform: uppercase;
}
h1, h2 {
	margin-bottom: 2.5rem;
}
h1 {
	font-size: 3rem;
}
h2 {
	font-size: 2.5rem;
}
header + .ce-textpic > .ce-bodytext > h3 {
	font-size: 1.2rem;
	margin-top: -2rem;
    margin-bottom: 1.25rem;
    text-transform: none;
    font-weight: 500;
    font-family: inherit;
}
h1 + h2, h2 + h3 {
	font-family: "Montserrat", sans-serif;
	font-size: 1.25rem;
	margin-top: -2.5rem;
	margin-bottom: 1.5rem;
	text-transform: none;
}
h2 + h3 {
	margin-top: -1.5rem;
}

/* .............. text ...... */
p {
	font-size: 1.1rem;

}
/* .............. links ...... */
a {
	color: #135198;
	font-size: 1.1rem;
}
a:hover {
	color: #4475AD;
	text-decoration: none;
}
/* .............. buttons ...... */
.button, .btn {
	color: #fff;
	background-color: #EFAA3C;
	padding:  0.5rem 1.5rem;
	border-radius: 0;
}
.button:hover, .button:focus, .btn:hover, .btn:focus {
	box-shadow: none; 
	background-color: #135198;
	color: #fff;
}
button:focus {
	outline:none;
}
.btn-primary {
	border:none;
}

/* .............. table ...... */
table {
	width: 100%
}
tr {
	border-bottom: 2px solid #fff;
}
tr:hover th {
	background: #EFAA3C;
}
tr:hover td {
	background: #E0E0E0E0;
}
th, td {
	padding: 10px 20px;
}
th {
	background: rgba(19,81,152,0.8);
	color: #fff;
	width: 220px;
}
td {
	background: #e6e6e6;
}
table + p.small {
	text-align: right;
}
/* .............. other ...... */
img {
  	max-width: 100%;
  	height: auto; 
}
.ce-textpic {
	overflow: inherit;
}
/* ---------- COMPONENTS -------------------*/

/* .............. basic styles ...... */
.frame {
	margin-bottom: 60px;
}
.frame:last-child {
	margin-bottom: 0;
}
.frame:first-child {
	margin-bottom: 60px;
}
.frame.frame-type-header {
	margin-bottom: 0;
}
.frame-fullsize {
	max-width: 100vw !important;
    width: 100vw !important;
    margin-right: calc(50% - 50vw) !important;
	margin-left: calc(50% - 50vw) !important;
	background: #f8f8f8;
	padding: 30px 0;
}

.frame-space-before-small {
	margin-top: -40px;
	margin-bottom: 100px;
}
@media(min-width: 575px){
	.frame {
		margin-bottom: 100px;
	}
	.frame:last-child {
		margin-bottom: 0;
	}
	.frame:first-child {
		margin-bottom: 100px;
	}
	.frame.frame-type-header {
		margin-bottom: 0;
	}
}
/* Gallery */
.ce-gallery figure {
	margin-bottom: 5px;
}
/* Basic grid */
.grid {
	display:grid;
	gap: 1rem;
	margin-bottom: 2.25rem;
	justify-items:center;
}	
/* .............. navigation ...... */
.navbar {
	justify-content: space-between;
	align-items:flex-end;
	padding: 45px 0 15px;
}

.navbar .header-flex {
	display:flex;
	flex-direction: column-reverse;
}
@media(min-width: 991px) {
	.navbar {
		align-items: center;
	}
	.navbar .collapse {
		justify-content: flex-end;
	}
	.navbar .header-flex {
		flex-direction: column;
		align-items: flex-end;
	}
}

/* Links */

.navbar-nav li a{
	font-size: 1.25rem;
	font-weight: 500;
	text-transform: uppercase;
	display: block;
	padding: 15px 20px !important;
	color: #313131;
}
.navbar-nav li:last-child a {
	padding-right: 0 !important;
}
.navbar-nav .nav-item:hover .nav-link,
.navbar-nav .nav-item:focus .nav-link,
.navbar-nav .nav-item.active .nav-link  {
	color: #135198;
}

/* 1. Dropdown Ebene */

.navbar-nav .dropdown-menu {
	border:none;
	border-top: 2px solid #135198;
	border-radius: 0;
	margin: 0;
	padding: 0;
	background: #F8F8F8;
	margin-left: 20px;
}
.navbar-nav .dropdown-menu li a {
	border-bottom: solid 1px #135198;
	padding: 12px 20px;
	font-size: 1rem;
	text-transform: none;
}
.navbar-nav .dropdown-menu li:hover a,
.navbar-nav .dropdown-menu li:focus a,
.navbar-nav .dropdown-menu li.active a {
	color: #135198;
}
.navbar-nav .dropdown-menu li:last-child a {
	border-bottom: none;
}
@media(min-width: 991px) {
	.navbar .dropdown-toggle {
		display:none;
	}
	.navbar .dropdown:hover .dropdown-menu{
		display:block
	}
	
}


/* Mobil Button */

.navbar-toggler {
	padding-bottom: 15px;
	font-size: 1.5rem;
}

/* Mobil */
@media(max-width: 991px) {
	.navbar-collapse {
		margin-top: 25px;
	}
	.dropdown-toggle {
		position: absolute;
		top: 20px;
		right: 15px;
	}
	.dropdown-toggle::after {
		border-top: .5em solid;
		border-right: .5em solid transparent;
		border-left: .5em solid transparent;
	}
	
}

/* TopNavi */
.topnavi a {
	color: #313131;
	margin-left: 30px;
}
.topnavi a:first-child {
	margin-left: 20px;
}
.topnavi a:hover {
	color: #EFAA3C;
}
.topnavi i {
	color: #EFAA3C;
	margin-right: 5px;
}
@media(max-width: 500px){
	.topnavi {
		display:flex;
		flex-direction: column;
	}
	.topnavi a {
		margin-left: 20px;
	}
}
/* Logo */
.navbar-brand {
	padding-bottom: 15px;
}
@media(max-width: 500px){
	.navbar-brand {
		width: 75%;
	}
}
@media(min-width: 991px) AND (max-width: 1200px) {
	.navbar-brand {
		width: 40%;
	}
}
/* .............. footer ...... */

footer {
	background: #F0F0F0;
	text-align:center;
	padding-top: 40px;
}
footer h3 {
	padding: 0 30px 15px;
	border-bottom: solid 2px #fff;
    margin: 0 auto;
}
footer .text {
	display: flex;
	justify-content: center;
	flex-direction: column;
	margin-top: 23px;
	margin-bottom: 40px;
}
footer .text a {
	color: #313131;
}
footer .text a:hover {
	color: #EFAA3C;
}
footer .text p {
	display:inline;
	margin-right: 20px;
}
footer .text a i {
	margin-right: 5px;
	color: #EFAA3C;
}
footer .text a:last-child,
footer .text p:last-child {
	margin-right: 0;
}
@media(min-width: 400px){
	footer h3 {
		width: max-content;
	}
}
@media(min-width: 991px) {
	footer .text {
		flex-direction: row;
	}
	footer .text a {
		margin-right: 40px;
	}
}

/* musthave */

.musthavecopy {
	background: #135198;
	color: #fff;
	padding: 10px 0;
}

.musthavecopy a {
	color: #fff;
	font-size: 1rem;
}
.musthave {
	list-style: none;
	padding: 0;
	margin:0;
	display: flex;
	justify-content: center;
}
.musthave li {
	margin-right: 26px
}
.musthave li:last-child {
	margin-right: 0;
}
@media(min-width: 768px ) {
	.musthavecopy .container {
		display: flex;
		justify-content: space-between;
	}
	.musthave {
		justify-content: flex-end;
	}
}
/* ---------- EXTENTIONS -------------------*/

/* .............. dce ...... */

/* dce-keyvisual */
.dce-keyvisual {
	border-top: solid 7px #135198;
}
.dce-keyvisual .textbox {
    width: 360px;
}
.dce-keyvisual .text {
	background-color: #EFAA3C;
	color: #fff;
	text-align:center;
	padding: 20px 20px 25px;
}
.dce-keyvisual p {
	font-size: 1.3rem
}
.dce-keyvisual .text a.btn {
	background-color:#135198;
	border-color: #135198;
}
.dce-keyvisual .text a.btn:hover {
	color: #EFAA3C;
}
@media (max-width: 767px) {
	.dce-keyvisual .textbox {
		display: block;
		width: 100%;
		
	}
	.dce-keyvisual > .d-flex {
		position: inherit;
	}
	.dce-keyvisual .container {
		max-width: 100%;
		padding: 0;
	}
}

/* dce-image-tiles */

.dce-image-tiles h2 {
	text-align: center;
}
@media(min-width: 768px){
	.dce-image-tiles .tile .text-wrap {
		background: rgba(19, 81, 152, .4);
	}
	
}
@media(max-width: 768px) {
	.dce-image-tiles .tile .hover-content {
		max-height: 100%;
    	opacity: 1;
	}
}


/* kontaktstörer fullwidth */
.frame-fullsize + .angebot {
	margin-top: -100px;
}
.angebot {
	max-width: 100vw !important;
    width: 100vw !important;
    margin-right: calc(50% - 50vw) !important;
	margin-left: calc(50% - 50vw) !important;
	background: #4475AD;
	padding: 30px 0;
	margin-bottom: -90px;
	margin-top: 50px;
}
.angebot .angebot-text {
	display:flex; 
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.angebot h3 {
	color: #fff;
	text-align: center;
}
.angebot .btn {
	border-radius: 0;
	border: #fff solid 2px;
	background: none;
	
}
@media(min-width: 769px){
	.angebot .angebot-text {
		flex-direction: row;
	}
	.angebot h3 {
		margin-bottom: 0;
		margin-right: 30px;
		text-align: right;
	}
}

/* dce accordion */

.dce-accordion .card-header h5 button {
	background-color: #135198;
	color: #fff;
}
.dce-accordion .card-header h5 button:hover, .dce-accordion .card-header h5 button:focus, .dce-accordion .card-header h5 button[aria-expanded="true"] {
	background-color: #EFAA3C;
	color: #fff;
}
.dce-accordion .card-body p:last-child {
	margin-bottom: 0;
}

/* .............. powermail ...... */

.tx-powermail h3,
.tx-powermail legend{
	display:none;
}
.tx-powermail .container-fluid {
	padding: 0;
}
@media(max-width: 500px) {
	.tx-powermail .powermail_fieldwrap {
		flex-direction: column;
	}
	main .powermail_fieldwrap > .col-sm-2 {
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		max-width: 50%;
	}
	main .powermail_fieldwrap > .col-sm-10 {
		-ms-flex: 0 0 75%;
		flex: 0 0 100%;
		max-width: 100%;
	}
}