/**
 * Additional to bootstrap
 *
 */

/* 	dunkelblau: #465a82
*	blau		#4b6eaa
*	divider:	#afcdd7 (türkis hell)
*	bestseller:	#64a0b4 (türkis)
*	grau:		#505a64
*	container bg #edeff3
 */ 
 

@import url(/common/css/yaml/fonts/font-awesome/css/font-awesome.css);

@media all {
	html {font-size: 15px;line-height:21px;}
		
	body { 
		font-family: 'Open Sans', sans-serif;
		font-weight: 400;
		font-size: 1rem;
		background: #fff bottom; 
		*overflow: hidden;
		line-height: 1.4rem;
		color: #465a82;
	}
	
	h1, h2, h3, h4, h5, h5 {font-family: 'Open Sans', sans-serif;font-weight:800;}
	h1 {font-size: 2rem;}
	h2 {font-size:1.8rem;}
	h3 {font-size:1.3rem; font-weight:700; line-height: 2rem;}
	h4 {font-size:1.1rem; font-weight:600; line-height: 1.3rem;}
	
	em,.subHeading {
		font-weight: 700;
		font-size: 1.1rem;
		margin: 0;
		font-style:normal;
	}
	
	.mod-heading { font-size: 1.3rem; font-weight:700; line-height: 1.5rem; margin-top:1.5rem;}
	.mod-heading:first-child {margin-top:0;}
	header {
		padding: 0; 
		min-height: 70px; 
	}
	header .navbar-brand img {max-height:60px; padding: 0 1rem;}
	header .navbar {
		padding:0;
		background-color: #4b6eaa; 
	}
	header .navbar a.nav-link {
		color: #fff;
		padding: 3rem 0.5rem 0.25rem 0.5rem;
		text-transform:uppercase;
		cursor:pointer;
	}
	#navbarCollapse a.nav-link { padding-top: 0.25rem; }
	header .navbar a:hover, header .navbar a:focus,header .navbar a.active {
		background-color: #465a82;
		color: #fff;
	}
	header .navbar .dropdown-menu a {text-transform:none;display: inherit;background-color: #edeff3;color: #465a82; text-decoration:none;padding: 0.25rem 0.5rem; border: 1px solid transparent;}
	header .navbar .dropdown-menu a:hover, header .navbar .dropdown-menu a:focus, header .navbar .dropdown-menu a.active {background-color:#b7becf; color: #fff; border-bottom:1px solid #fff;}
	header .navbar .dropdown-menu {
		background-color: transparent;
		border-color: transparent;
		border-radius:0;
		padding-top:0;
		margin-top:0;
		width: 15em;
	}
	header .navbar .fa {color:#fff;}
	
	#headerSlid {border-top: 1px solid #fff;}
	#headerSlid .carousel-item{
		height: 430px;
		background-attachment: inherit;
		background-position: bottom;
		background-repeat: no-repeat;
		background-size: cover;
		/*background-position-y: 71px;*/
	}
	#headerSlid .carousel-caption { bottom: 30%; }
	
	/*#headerSlid .carousel-inner > .carousel-item > p > img, #headerSlid .carousel-inner > .carousel-item > a > p > img {
	    display: block;
	    height: auto;
	    line-height: 1;
	    margin: 0 auto;
	    max-width: 100%;
	}
	*/
	footer {
		background-color: #303030;
		color: #fff;
		padding:0;
	}
	
	footer a{
		color:inherit;
		text-decoration:underline;
	}
	footer a:hover, footer a:focus {
		color:rgb(255, 225, 0);
	}
	
	footer .bg-dark {color:#a4aec3;}
	
	.clsdatenschutz {
		position:fixed;
		bottom:0;
		/*height:39px;*/
		padding:25px 20px;
		color:#FFF;
		text-align:center;
		width:100%;
		z-index: 2;
		border-top:1px solid #FFF;
		background-color:#000;
		display:none;
		line-height:30px;
	}
	
	.clsdatenschutz a {
		text-decoration:underline;
	}
	#verstandenbutton {
		padding: 0px 15px;
		max-width: 200px;
		text-align: center;
		color: #000;
		border: 1px solid rgb(255, 225, 0);
		text-transform: uppercase;
		background-color: rgb(255, 225, 0);
		text-decoration:none;
		margin-left:40px;
		
	}
	#verstandenbutton:hover, #verstandenbutton:focus {
		color: rgb(255, 225, 0);
		border: 1px solid rgb(255, 225, 0);
		background-color: #000;
	}

	
	
	.shopIcon {
		height: 20px;
		top:25px;
		position:relative;
		border: 0px solid black; 
		text-align: right;
	}
	.shopIcon a {color: #fff; padding: 10px;}
	.shopIcon a:hover, .shopIcon a:focus { background-color: #fff; color: #4B6EA9;}
	.shopIcon .basket-full {
		background-color: #fff;
		color: #4B6EA9;
	}
	.shopIcon .marked {
		background-color: #fff;
		color: #4B6EA9;
	}
	.service-nav ul li.basket-full a {
		color: #fff;
	}
	
	#logo { 
		position: relative; 
		width: 20%;
		float:left;
	}
/*buttons*/
	.btn {
		text-transform:uppercase;
		border-radius: 2rem;
		font-weight:600;
	}
	.btn-check:focus + .btn, .btn:focus { outline: 0;
	    box-shadow: none;
	}
	.product .card-footer a {
		border-radius:2rem; 
		width:100%; 
		max-width:100%;
		background-color:#fff;
		font-weight:700;
		font-size:1rem;
		text-transform: uppercase;
		display: inline-block;
		line-height: 1.5;
		text-align: center;
		text-decoration: none;
		vertical-align: middle;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		user-select: none;
		border: 1px solid transparent;
		padding: 0.375rem 0.75rem;
	}
	.product a:hover, .product a:focus {
		color: #fff;
		background-color: #000;
		border-color: #000;
	}
	#headerSlid .carousel-item a { 
		border-radius:2rem; 
		font-weight:700;
		font-size:1rem;
		text-transform: uppercase;
		display: inline-block;
		line-height: 1.5;
		text-align: center;
		text-decoration: none;
		vertical-align: middle;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		user-select: none;
		border: 1px solid transparent;
		padding: 0.375rem 1rem;
		background-color: #64a0b4;border-color:transparent;
		color: #fff;
	}
	#headerSlid .carousel-item a:hover, #headerSlid .carousel-item a:focus {
		border-color: #64a0b4;
		background-color: #fff;
		color: #64a0b4;
	}
	
	.btn_dark-blue,.btn_dark-blue_inherit,
	.btn_blue,.btn_blue_inherit,
	.btn_turk, .btn_turk_inherit,
	.btn_grey, .btn_grey_inherit {
		border-radius:2rem; 
		font-weight:700;
		font-size:1rem;
		text-transform: uppercase;
		display: inline-block;
		line-height: 1.5;
		text-align: center;
		text-decoration: none;
		vertical-align: middle;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		user-select: none;
		border: 1px solid transparent;
		padding: 0.375rem 1rem;
		margin: 0.5rem 0.25rem;
	}
	
	
	.btn-primary {
	    color: #fff;
	    background-color: #64a0b4;
	    border-color: transparent;
	}
	.btn-primary:hover, .btn-primary:focus {
	    color: #64a0b4;
	    background-color: #fff;
	    border-color: #64a0b4;
	    box-shadow:none;
	}
	.btn-success {
	    color: #fff;
	    background-color: #465a82;
	    border-color: transparent;
	}
	.btn-success:hover, .btn-success:focus {
	    color: #465a82;
	    background-color: #fff;
	    border-color: #465a82;
	    box-shadow:none;
	}
	.btn-check:checked + .btn-success, 
	.btn-check:active + .btn-success, 
	.btn-success:active, .btn-success.active, 
	.show > .btn-success.dropdown-toggle {
	    color: inherit;
	    background-color: inherit;
	    border-color: inherit;
	}
	.btn-check:checked + .btn-success:focus, 
	.btn-check:active + .btn-success:focus, 
	.btn-success:active:focus, 
	.btn-success.active:focus, 
	.show > .btn-success.dropdown-toggle:focus,
	.btn-check:checked + .btn-primary:focus, .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus, .show > .btn-primary.dropdown-toggle:focus,
	.btn-check:checked + .btn-secondary:focus, .btn-check:active + .btn-secondary:focus, .btn-secondary:active:focus, .btn-secondary.active:focus, .show > .btn-secondary.dropdown-toggle:focus{
	    box-shadow: none;
	}
	
	a,#breadcrumb .pfadinactive {
		color: #64a0b4;
	}
	a:hover, a:focus {
		color: #000;
	}
	a.clRed {
		color: red;
		text-decoration:underline;
	}
	
	a.clRed:hover, a.clRed:focus {
		color: #fff;
		text-decoration:none;
		background-color: red;
	}
	
/* ende buttons */

/* team */
	.team img {max-width:100%;border-radius: 50%;}
	section.team:nth-child(odd) {background: #edeff3}
	.team .space-y {padding: 2.5rem 0;}
	.team .featurette-heading {margin-top: 2rem;font-weight:600;}
/* Ende team */	
	
/* Barrierefreiheit */
	.invisible, .sr-only {
		position: absolute;
		left: -1000px;
		font-size: 0px;
	}
	.ym-skiplinks a.ym-skip:focus, .ym-skiplinks a.ym-skip:active {
		background: none repeat scroll 0 0 #285468;
		border: none;
		opacity: 0.9;
		color: #FFFFFF;
		font-weight: bold;
	}
	
	.statusmsg {
	    display: none;
	    width: 100%;
	    position: fixed;
	    background-color: #C9EA60;
	    text-align: center;
	    padding: 10px 0;
	    z-index:2000;
	    color:#000;
	}
	/* 15.08.2022: Formatierung der Status-Buttons */
	.status_btn {
		background: #fff;
		margin: 0.5rem;
	}
	
/* Barrierefreiheit ENDE */

	
		
		
/* Diverses */
	
	#warnings {
		z-index: 100;
		position:absolute;
		left: 0;
		background-color: #CC6600;
		padding: 4px;
		visibility: hidden;
		color: #000;
	}
	#warnings .visible {
		visibility: visible;
	}

	#breadcrumb {
		margin: 2rem 0;		
	}

	.tbl_formated {
		border: 2px solid #d1d1d1;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		padding: 10px 25px;
		background: #f8f8f8;
		font-size: 12px;
	}
	.tbl_formated tr, .tbl_formated td, .tbl_formated table {border: 0; padding: 0; margin: 0;}
	.tbl_formated table{border: none; width: 100%}
	.tbl_formated tr {border-bottom: 1px solid #d1d1d1 !important;}
	.tbl_formated tr:last-child {border: none !important;}
	.tbl_formated td{ padding: 10px 0;}
	.tbl_formated td:nth-child(1){font-weight: 700;}
	.tbl_formated td:nth-child(2), .tbl_formated td:nth-child(3){
		text-align: center;
	}
	.tbl_formated .cellTitle {color: #4b6ea9; font-size: 18px;}
	
	.contact_viewTbl {
		max-width: 70%;
		width: 100%;
	}
	.contact_viewTbl th:first-child {
	    width: 110px;
	}
	
	
/* ENDE Diverses */
	
/* BS Klassen */
	.w-30 { width: 30% !important; }
	.w-25 { width: 25% !important; }
	.w-40 { width: 40% !important; }
	section .container {padding-top: 1.5rem;padding-bottom: 1.5rem;}
	.cont-bg {background-color: #edeff3;}
	.basket-ico-text {
		position:relative;
		top:-3px;
		color:#fff;
		font-size:0.8rem;
	}
	
	.kurs {
		width:100%;
		max-width:48%;
		margin:0.5rem 0;
		padding: 1.2rem 1rem;
		background-color: transparent;
	}
	
	.angebot {
		background-color:#edeff3;
		text-align:center;
		padding: 2rem 1rem;
	}
	.product {
		color: #fff;
		margin: 1rem 1%;
		border-radius: 0 0 0.5rem 0.5rem;
		max-width: 300px;
		width:100%;
	}
	.product .card-header img {
		position: relative;
		top: 2px;
		border-radius: 0;
	}
	.product .card-header .product-price {
		position:absolute;
		top:0;
		left:0;
		padding: 0.15rem 0.5rem 0.15rem 0.5rem;
		border-bottom-right-radius: 0.5rem;
		width:70%;
		text-align:left;
	}
	.product .card-title a {color:inherit !important;text-decoration:none;border:1px solid transparent;}
	.product .card-title a:hover, .product .card-title a:focus {background-color:transparent;}
	.product .card-header {padding:0;}
	.product .card-footer, .product .card-header {border-color:transparent;background-color:transparent;}
	
	.kurs .card-title{
		font-size:1rem;
		line-height:1.2rem;
		font-weight:700;
		/*white-space: nowrap !important;*/
	}

/* filter */
	.filter_selectbox select{
	  -moz-appearance: none;
	  -webkit-appearance: none;
	  appearance: none;
	  border: 1px solid transparent;
	  border-color:transparent;
	}
	.tagFilter {
	    background-color: #fff;
	    padding: 5px 18px 5px 10px;
	    border: 1px solid rgb(255, 225, 0);
	    -moz-border-radius: 100px;
	    -webkit-border-radius: 100px;
	    -khtml-border-radius: 100px;
	    border-radius: 100px;
	    behavior: url(border-radius.htc);
	    margin-right: 10px;
	    text-decoration: none !important;
	    color: inherit;
	    position: relative;
	}
	.tagFilter::after {
	    position: absolute;
	    content: url('/design/layout/close-button.png');
	    background-image: url('/design/layout/close-button.png');
	    background-size: 10px;
	    background-repeat: no-repeat;
	    display: inline-block;
	    content: "";
	    width: 20px;
	    height: 20px;
	    right: -3px;
	    top: -3px;
	    border: 1px solid rgb(255, 225, 0);
	    border-radius: 10px;
	    background-color: rgb(255, 225, 0);
	    background-position: 4px;
	}

/* ende Filter */
/*modal*/	
	.modal-dialog {max-width: 95%;}
	.modal-dialog .card-price{
		position:absolute;
		top:1rem;right:1rem;
		font-weight:400;
	}
	.modal-dialog .card-title {
		font-size: 1.25rem;
		font-family: 'Open Sans', sans-serif;
		font-weight: 800;
	}
	/*.modal-dialog .card{min-width:235px;}*/
	.modal-dialog .card-footer {
	    padding: 0.5rem 1rem;
	    background-color: transparent;
	    border: none;
	}
	.modal-dialog .card-footer a.btn{color:#fff;font-weight:600;}
	.modal-dialog .modal-body .card-group:last-child {margin-right:auto;margin-left:auto;}
	.modal-dialog .modal-body ul {padding-left:1rem;}
/* end modal */	
	
	.tx-color_turk-light {color: #afcdd7;}
	.brd_turk-light {border-color:#afcdd7;}
	.pd-turk-light {background-color: #afcdd7;border-color:transparent;}
	a.pd-turk-light:hover, a.pd-turk-light:focus,
	button.pd-turk-light:hover, button.pd-turk-light:focus{
		border-color: #afcdd7;
		color:#afcdd7;
		background-color:transparent;
	}
	
	.tx-color_turk {color: #64a0b4;}
	a.tx-color_turk:hover, a.tx-color_turk:focus,
	button.tx-color_turk:hover, button.tx-color_turk:focus{
		border-color: #64a0b4;
		color:#fff !important;
		background-color:#64a0b4 !important;
	}
	.pd-turk {background-color: #64a0b4;border-color:transparent;}
	.brd-turk {border-color:#64a0b4 !important;}
	a.pd-turk:hover, a.pd-turk:focus,
	button.pd-turk:hover, button.pd-turk:focus,
	select.pd-turk:hover, select.pd-turk:focus {
		border-color: #64a0b4;
		color:#64a0b4 !important;
		background-color:transparent;}
	select.pd-turk:hover, select.pd-turk:focus {
		border-color: #64a0b4 !important;
	}
	.btn_turk {
		background-color: #64a0b4;border-color:transparent;color: #fff;
	}
	.btn_turk:hover, btn_turk:focus,
	a.open > span.btn_turk, a.open >span.btn_turk {
		background-color: #fff;border-color:#64a0b4;color: #64a0b4;
	}
	.btn_turk_inherit {
		background-color: #fff;border-color:#64a0b4;color: #64a0b4;
	}
	.btn_turk_inherit:hover, .btn_turk_inherit:focus,
	.head1.open .btn_turk_inherit,
	.head1.open + .head2 .btn_turk_inherit{
		background-color: #64a0b4;border-color:transparent;color: #fff;
	}
		
	.tx-color_blue {color: #4b6eaa;}
	.pd-blue {background-color: #4b6eaa;border-color:transparent;}
	.pd-blue a {color: #4b6eaa;}
	.btn_blue {
		background-color: #4b6eaa;border-color:transparent;color: #fff;
	}
	.brd_blue {
		border-color: #4b6eaa;
	}
	.btn_blue:hover, .btn_blue:focus,
	span.btn_blue:hover, span.btn_blue:focus {
		background-color: #fff;border-color:#4b6eaa;color: #4b6eaa;
	}
	.btn_blue_inherit {
		background-color: #fff;border-color:#4b6eaa;color: #4b6eaa;
	}
	.btn_blue_inherit:hover, .btn_blue_inherit:focus,
	.head1.open .btn_blue_inherit,
	.head1.open + .head2 .btn_blue_inherit {
		background-color: #4b6eaa;border-color:transparent;color: #fff;
	}
	
	.tx-color_darkblue {color: #465a82;}
	.pd-dark-blue {background-color: #465a82;border-color:transparent;}
	.pd-dark-blue a {color: #465a82;}
	.brd_dark-blue {border-color: #465a82 !important;}
	.btn_dark-blue {
		background-color: #465a82;border-color:transparent;color: #fff;
	}
	.btn_dark-blue:hover, .btn_dark-blue:focus {
		background-color: #fff;border-color:#465a82;color: #465a82;
	}
	.btn_dark-blue_inherit {
		background-color: #fff;border-color:#465a82;color: #465a82;
	}
	.btn_dark-blue_inherit:hover, .btn_dark-blue_inherit:focus,
	.head1.open .btn_dark-blue_inherit,
	.head1.open + .head2 .btn_dark-blue_inherit {
		background-color: #465a82;border-color:transparent;color: #fff;
	}
	
	.tx-color_grey {color: #505a64;}
	a.tx-color_grey:hover, a.tx-color_grey:focus,
	button.tx-color_grey:hover, button.tx-color_grey:focus{
		border-color: #fff;
		color:#fff !important;
		background-color:#505a64 !important;
	}
	.pd-grey {background-color: #505a64;border-color:transparent;}
	.pd-grey a {color: #505a64; }
	.brd_grey {border-color: #505a64; }
	.btn_grey {
		background-color: #505a64;border-color:transparent;color: #fff;
	}
	.btn_grey:hover, btn_grey:focus {
		background-color: #fff;border-color:#505a64;color: #505a64;
	}
	.btn_grey_inherit {
		background-color: #fff;border-color:#505a64;color: #505a64;
	}
	.btn_grey_inherit:hover, .btn_grey_inherit:focus,
	.head1.open .btn_grey_inherit,
	.head1.open + .head2 .btn_grey_inherit,
	.btn_grey_inherit.active {
		background-color: #505a64;border-color:transparent;color: #fff;
	}
	.modal-card-bg {background-color:#e1edf1;}
	.modal-card-brd {border-color:#e1edf1;}
	
	.isInactive {
		background-color: #e6e6e6;
		color: #9b9b9b;
		border-color:#e6e6e6;
	}
	.isInactive .fa, .isInactive button {color:#9b9b9b !important;}

/* 	dunkelblau: #465a82
*	blau		#4B6EAA
*	divider:	#afcdd7 (türkis hell)
*	bestseller:	#64a0b4 (türkis)
*	grau:		#505a64
*	container bg #edeff3
*	modal-card	#e1edf1;
 */ 
 	/*05.08.2022 uo: Ergänzungen für die Accordion-Funktionen in den FAQs*/
	.accordion-item .accordion-header .accordion-button {
		font-size: 1.1rem;
		font-weight: 600;
		line-height: 1.3rem;
		color: #465a82;
	}
}


@media screen and (max-width: 940px){ 
	#headerSlid .carousel-caption { top: 20%; bottom:auto;}
	#headerSlid .carousel-item {
		height: 300px;
		background-image: var(--img-medium) !important;
	}
}
@media screen and (max-width: 768px){ /* Tablet */
	.kurs {max-width:100%;}
	.kurs .btn {margin-top:1rem;}
	.icon-bar{
		text-align:center;
		margin: 1.5rem 0 1rem 0;
	}
	header .navbar .dropdown-menu {width:100%;}
	header .navbar a.nav-link { padding: 0.25rem 0.5rem 0.25rem 0.5rem; }
	.team .space-y {padding:0;}
	.team .featurette-heading {margin-top:1rem;}
	.team img {max-width: 50%;}
}


@media screen and (max-width: 740px){ 
	#headerSlid .carousel-caption { top: 8%;}
	#headerSlid .carousel-item { 
		height: 300px;
	}
}

@media (max-width: 600px) {

	h1 { font-size: 1.5rem; }
	h2 { font-size: 1.2rem; }
	h3, h4 { font-size: 1.1rem; }
	#headerSlid .carousel-item { 
		height: 270px;
		background-image: var(--img-small) !important;
	}
	.carousel-caption p,
	#headerSlidh1 { font-size:90%; }
	#headerSlid h2,
	#headerSlid .carousel-item a{font-size:1rem;line-height:1rem;}
}

@media (max-width: 450px) {
	#headerSlid .carousel-item { 
		height: 210px;
	}
}
@media (min-width: 2300px) {

	#headerSlid .carousel-item{
		height: 860px; }
}

@media (min-width: 400) {
	.col-xs-4 {
		flex: 0 0 auto;
		width: 33.33333333% !important;
	}
}

@media print {

}