/* bySam */

/* ============================================================ */
/* Bootstrap 5													*/
/* ============================================================ */

:root {
--bs-blue:#0d6efd;
--bs-indigo:#6610f2;
--bs-purple:#6f42c1;
--bs-pink:#d63384;
--bs-red:#dc3545;
--bs-orange:#fd7e14;
--bs-yellow:#ffc107;
--bs-green:#198754;
--bs-teal:#20c997;
--bs-cyan:#0dcaf0;
--bs-white:#fff;
--bs-gray:#6c757d;
--bs-gray-dark:#343a40;
--bs-gray-100:#f8f9fa;
--bs-gray-200:#e9ecef;
--bs-gray-300:#dee2e6;
--bs-gray-400:#ced4da;
--bs-gray-500:#adb5bd;
--bs-gray-600:#6c757d;
--bs-gray-700:#495057;
--bs-gray-800:#343a40;
--bs-gray-900:#212529;
--bs-primary:#bb0000;
--bs-secondary:#6c757d;
--bs-success:#198754;
--bs-info:#0dcaf0;
--bs-warning:#ffc107;
--bs-danger:#dc3545;
--bs-light:#f8f9fa;
--bs-dark:#212529;
--bs-primary-rgb:187, 0, 0;
--bs-secondary-rgb:108, 117, 125;
--bs-success-rgb:25, 135, 84;
--bs-info-rgb:13, 202, 240;
--bs-warning-rgb:255, 193, 7;
--bs-danger-rgb:220, 53, 69;
--bs-light-rgb:248, 249, 250;
--bs-dark-rgb:33, 37, 41;
--bs-white-rgb:255, 255, 255;
--bs-black-rgb:0, 0, 0;
--bs-body-color-rgb:33, 37, 41;
--bs-body-bg-rgb:255, 255, 255;
--bs-font-sans-serif:Aptos, sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", 'Open Sans', "Liberation Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--bs-font-monospace:SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--bs-gradient:linear-gradient(180deg, hsla(0,0%,100%,.15), hsla(0,0%,100%,0));
--bs-body-font-family:var(--bs-font-sans-serif);
--bs-body-font-size:18px;
--bs-body-font-weight:400;
--bs-body-line-height:1.5;
--bs-body-color:#000000;
--bs-body-bg:#FFFFFF;
}

/* ============================================================ */
/* Custom Project Classes										*/
/* ============================================================ */

.color-white {
	color:#FFFFFF;
}

.color-red {
	color:#D20233;
}

.color-gray {
	color:#808080;
}

.bgcolor-red {
	background-color:#BB0000;
}

.kellner {
	margin-top:-20px;
	height:auto;
}
@media (min-width: 768px) {
	.kellner {
		margin-top:-50px;
	}
}



/* ============================================================ */
/* Support / Service											*/
/* ============================================================ */

/* Float Classes */
.public .left {
	float:left !important;
}
.public .right {
	float:right !important;
}
.public .clear {
	clear:both !important;
}

.public .flex-center {
	display:flex;
	justify-content:center;
	align-items:center;
}


/* Text-Decoration Classes */
.public .tdu {
	text-decoration:underline !important;
}
.public .tdn {
	text-decoration:none !important;
}

.disnone {
	display:none;
}

/* Only Small Big Classes */
.public .only-small {
	display:block !important;
}
.public .only-big {
	display:none !important;
}
@media (min-width: 768px) {
	.public .only-small {
		display:none !important;
	}
	.public .only-big {
		display:block !important;
	}
}

/* Rundunge Ecken */
.rounded { 
	 -webkit-border-radius: 8px;
		-moz-border-radius: 8px;
			 border-radius: 8px;
}

/* Shadow */
.shadow	{
	/*
				  Vertikaler  Farbe des 
				  Versatz     Schatten
					  |           |
	box-shadow: 10px 10px 15px silver inset;
				 |          |           |
		 Horizontaler       |           |
		 Versatz       Größe des     optional:
					   Schatten      Schatten nach innen
	*/
	-webkit-box-shadow: 8px 8px 6px rgba(0, 0, 0, 0.3);
	   -moz-box-shadow: 8px 8px 6px rgba(0, 0, 0, 0.3);
			box-shadow: 8px 8px 6px rgba(0, 0, 0, 0.3);
}

/* Desaturate-Effect (Everything in shades of gray and on hover in color) */
.desaturate {
    filter: grayscale(100%); /* Standard */
    -webkit-filter: grayscale(100%); /* Webkit */
/*    filter: url(/elements/grayscale.svg#desaturate); /* Firefox 4-34 */
    filter: gray;  /* IE6-9 */
    -webkit-filter: grayscale(1); /* Old WebKit */
}

.desaturate:hover {
    filter: grayscale(0%);
    filter: none;
    -webkit-filter: grayscale(0); /* Old WebKit */
}

/* No Selection Class */
.public .deselect {
    -ms-user-select:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    user-select:none;
}
.public .deselect ::selection,
.public .deselect ::-moz-selection {
    background:transparent !important;
    color:inherit !important;
}

/* No Outline */
.public .nool { 
	outline:none !important; 
}

/* Bild in original Größe anzeigen, aber nicht über 100% des Bereichs, 
   d.h. keine Scroller, auch nicht wenn das Bild grösser ist als der Viewport (einfach im Editor diese Klasse beim Bild mit angeben) */
.max-width-100p {
	width:auto !important;
	max-width:100% !important;
}

/* Bei Bookmarks Header mitrechnen, vor allem für Fixed-Header sinnvoll (jedem Anker diese Klasse mitgeben) und natürlich den Top-Wert auf die Header Größe(n) anpassen */
.anchor { 
	display:block;
	position:relative;
	top:-80px;
	visibility:hidden;
}
@media (min-width: 768px) {
	.anchor { 
		top:-165px;
	}
}





/* [1] The container */
.img-hover-zoom {
	height: 300px; /* [1.1] Set it as per your need */
	height:auto; /* [1.1] Set it as per your need */

	overflow: hidden; /* [1.2] Hide the overflowing of child elements */
}

/* [2] Transition property for smooth transformation of images */
.img-hover-zoom img {
	transition: transform 1.2s ease;
}

/* [3] Finally, transforming the image when container gets hovered */
.img-hover-zoom:hover img {
	transform: scale(1.2);
}






/* ============================================================ */
/* Global 														*/
/* ============================================================ */

/* Link Colors */
a,
a:link,
a:visited,
a:active { color:#000000; outline:none; text-decoration:none; }
a:focus,
a:hover  { color:#000000; background:none; text-decoration:underline; }

a, a:visited { outline:none !important; } /* Safari Fix */

/* Select Colors */
::selection {
	background:#808080;
	color:#FFFFFF;
}
::-moz-selection {
	background:#808080;
	color:#FFFFFF;
}
::-webkit-selection {
	background:#808080;
	color:#FFFFFF;
}

/* Body, Header, Footer, Main, ... */
body {
	font-family: Aptos, Helvetica, Arial, sans-serif;
	font-weight:400;
	font-size:18px;
	line-height:28px;
}

.public header {
	width:100% !important;
	background-color:rgba(0,0,0,0.6);
}
.public .navbar-inner {
	height:67px !important;
	width:100% !important;
	/*border-bottom:3px solid #D20233;*/
}
@media (min-width: 992px) {
	.public .navbar-inner {
		border-bottom:none;
	}
}


.public main {
	padding-top:67px;

padding-top:0px;

}
/*
@media (min-width: 992px) {
	.public main {
		padding-top:139px;

padding-top:0px;

	}
}
*/
.public h1 {
	/*text-transform:uppercase;*/
}
.public h2 {
	font-size:1.6rem;
}
.public h3 {
	font-size:1.4rem;
}


.public main .main-content-wrapper {
	padding-top:30px;
}

.public footer .footer-wrapper {
	background-color:#FFFFFF;
}
.public footer a {
	text-decoration:none;
}

.public footer a:hover,
.public footer a:focus {
	text-decoration:underline;
}


.public .footer-top {
	font-size:14px;
	line-height:24px;
}

.public .footer-col-1,
.public .footer-col-2,
.public .footer-col-3,
.public .footer-col-4 {
	font-size:14px;
	line-height:24px;
}
.public .footer-col-1 h4,
.public .footer-col-2 h4,
.public .footer-col-3 h4,
.public .footer-col-4 h4 {
	font-size:14px;
	line-height:24px;
	font-weight:bold;
	margin:0px;
	padding:0px;
}

.public .footer-copyright {
	padding:15px;
}

/*
@media (min-width: 992px) {
	.public .navbar-inner {
		height:100px !important;
	}
}
*/

.public hr {
    background-color:#000000;
    border: 0;
    color: inherit;
    margin: 1rem 0;
    opacity:1;
}

/* ============================================================ */
/* Header Navigation 											*/
/* ============================================================ */

.public header {
	z-index:1000;
}


/* Navbar */
.public .navbar {
	padding-top:0px;
	padding-bottom:0px;
}

.public .navbar > .container, 
.public .navbar > .container-fluid, 
.public .navbar > .container-lg, 
.public .navbar > .container-md, 
.public .navbar > .container-sm, 
.public .navbar > .container-xl, 
.public .navbar > .container-xxl {
	 display:block;
}

.public .navbar-nav {
	position:absolute;
	left:0px; right:0px;
	top:67px;
	padding-top:5px;
	padding-bottom:5px;
	background-color:rgba(0,0,0,0.6);
	border-bottom:1px solid #000000;
}

.public .navi-headline {
	position:absolute;
	top:12px;
	left:15px;
	right:auto;

	display:flex;
	justify-content:left;
	align-items:center;

	font-size:18px;
}

@media (min-width: 576px) {
	.public .navi-headline {
		font-size:inherit;
	}
}


@media (min-width: 992px) {
/*
	.public .navbar-header {
		position:absolute;
		left:0px; right:0px;
		top:15px;
	}
*/
	.public #navbar-topnavi-1 {
		display:flex;
		justify-content:center;
		align-items:center;
/*
		border-top:3px solid #D20233;
		border-bottom:1px solid #D20233;
*/
	}

	.public .navbar-nav {
		position:relative;
		top:0px;

		border-top:none;
		border-bottom:none;
		background-color:transparent;
	}

	.public .navi-headline {
		position:absolute;
		top:-50px;
		left:0px;
		right:0px;

		display:flex;
		justify-content:center;
		align-items:center;
		
		font-size:32px;
		line-height:42px;
	}
}

/* Navbar Custom Logo */
.navbar-custom .navbar-brand {
	position:absolute;
	left:15px; top:15px;
	padding:0px !important;
	margin:0px !important;
	letter-spacing:1px;
	font-size:28px;
	line-height:18px !important;
}
.navbar-custom .navbar-brand, 
.navbar-custom .navbar-brand:focus, 
.navbar-custom .navbar-brand:hover {
	color:#FFFFFF;
}
.navbar-custom .navbar-brand img {
	height:44px;
	width:auto;
}
.navbar-custom .navbar-brand p {
	margin:0px;
	padding:0px;
}
.navbar-custom a.navbar-brand {
	text-decoration:none;
}
.navbar-custom .navbar-brand span {
	font-size:12px;
	line-height:12px;
}


@media (min-width: 992px) {
	.navbar-custom .navbar-brand {
		top:13px;
		font-size:32px;
	}
	.navbar-custom .navbar-brand img {
		height:auto;
	}
	.navbar-custom .navbar-brand span {
		font-size:14px;
		line-height:14px;
	}

}

/* Navbar Custom Burgermenu */
.navbar-custom .navbar-toggler {
	border-color:#FFFFFF;
	color:#FFFFFF;
	position:absolute;
	right:15px; top:13px;
}
.navbar-toggler:focus {
	box-shadow: none;
}


.navbar-toggler:hover {
	border-color:#000000;
}


.navbar-toggler[aria-expanded=true] {
	border-color:#000000;
}


.navbar-custom .navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(255, 255, 255, 0.55)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")
}

/* Navbar Custom Text */
.navbar-custom .navbar-text {
	color:#FFFFFF;
}
.navbar-custom .navbar-text a {
	color:#FFFFFF;
}
.navbar-custom .navbar-text a:focus, 
.navbar-custom .navbar-text a:hover {
	color:#FFFFFF;
	text-decoration:underline;
}

/* Navbar Custom Links */
.navbar-custom .navbar-nav .nav-link {
	margin-top:9px;
	padding:6px 15px 6px 15px;
	color:#FFFFFF;
	text-decoration:none;
	text-transform:uppercase;
}
.navbar-custom .navbar-nav .nav-link:focus, 
.navbar-custom .navbar-nav .nav-link:hover {
	color:#FFFFFF;
	text-decoration:underline;
}
.navbar-custom .navbar-nav .nav-link.disabled {
	color:#8B8B8B;
}
.navbar-custom .navbar-nav .nav-link.active, 
.navbar-custom .navbar-nav .show>.nav-link {
	color:#FFFFFF;
}

/* Navbar Custom Dropdown */
.navbar-custom .dropdown-menu {
	padding:0px 0px 0px 15px;
	border:none;
	background-color: transparent;
}
@media (min-width: 992px) {
	/* Navbar Custom Links */
	.navbar-custom .navbar-nav .nav-link {
		white-space:nowrap;
		padding-left:20px;
		padding-right:20px;
		letter-spacing:1px;
	}

	/* Navbar Custom Dropdown */
	.navbar-custom .dropdown-menu {
		min-width: 300px;
		padding:0px 0px 10px 0px;
		margin-top:5px;

		background-color:rgba(0,0,0,0.6);

		border:none;
		border-left:1px solid #000000;
		border-right:1px solid #000000;
		border-bottom:1px solid #000000;
	}
}

/* Navbar Custom Path Colors */
.navbar-custom .nav-selected,
.navbar-custom .nav-path-selected {
	color:#FFFFFF !important;
}

/* Service Area */
.public .header-service {
	position:absolute;
	top:20px;
	right:30px;
}

/* Language Area */
.public .header-language {
	position:absolute;
	top:11px;
	right:100px;
}


/* -xs- */
@media (min-width: 576px) {
}
/* -md- */
@media (min-width: 768px) {
}
/* -lg- */
@media (min-width: 992px) {
	/* Service Area 
	.public .header-service {
		position:absolute;
		top:35px;
		right:30px;
	}
	*/
}
/* -xl- */
@media (min-width: 1200px) {
}
/* -xxl- */
@media (min-width: 1400px) {
}

/* ============================================================ */
/* Navi horizontal (footer)										*/
/* ============================================================ */

.public ul.navi-horizontal {
	padding:0px 0px 5px 0px;
	margin:0px;
	list-style:none;
}

.public ul.navi-horizontal li {
}

.public ul.navi-horizontal li a,
.public ul.navi-horizontal li a:link,
.public ul.navi-horizontal li a:visited,
.public ul.navi-horizontal li a:active { color:#5B5B5B; outline:none; text-decoration:none; }
.public ul.navi-horizontal li a:focus,
.public ul.navi-horizontal li a:hover  { color:#000000; background:none; text-decoration:underline; }

/* Navbar Custom Path Colors */
.public ul.navi-horizontal a.nav-selected,
.public ul.navi-horizontal a.nav-path-selected {
	color:#000000 !important;
}

/* ============================================================ */
/* Breadcrumb													*/
/* ============================================================ */

.public ol.breadcrumb {
	margin-top:0px;

	font-size:14px;
	line-height:18px;
	color:#808080;
}

.public ol.breadcrumb .active {
	color:#5B5B5B;
}

.public ol.breadcrumb a {
	color: #000000;
}
.public ol.breadcrumb a:hover {
	text-decoration:underline !important;
}

.public .breadcrumb>li+li:before {
    padding: 0 5px;
    color: #5B5B5B;
    content: "/\00a0";
}

/* ============================================================ */
/* Social Links													*/
/* ============================================================ */

.public .ccm-block-social-links {
}
.public .ccm-block-social-links ul {
}
.public .ccm-block-social-links ul li {
	display:block;
	padding-bottom:15px;
	font-size:36px;
}

/* ============================================================ */
/* Hero Image													*/
/* ============================================================ */

.public .default-block-hero-image .neu-button {
	position:absolute;
	left:-10px; top:-15px;
	z-index:999;
	width:95px; height:70px;
	background:url(/images/neu-button.png) left top no-repeat;
	background-size:95px 70px;
}

.public .default-block-hero-image .new-button {
	position:absolute;
	left:-10px; top:-15px;
	z-index:999;
	width:95px; height:70px;
	background:url(/images/new-button.png) left top no-repeat;
	background-size:95px 70px;
}

/* default-block-hero-image */
.public .default-block-hero-image {
	padding:15px;
	margin-bottom:0px;
}
.public .default-block-hero-image-image {
	width:100%;
	text-align:center;
	margin-bottom:15px;
}
.public .default-block-hero-image-image img {
	width:100%;
}
.public .default-block-hero-image-text {
	position:static !important;
	width:100% !important;
	overflow: hidden;
}
.public .default-block-hero-image-text h1,
.public .default-block-hero-image-text h2,
.public .default-block-hero-image-text h3,
.public .default-block-hero-image-text h4,
.public .default-block-hero-image-text h5,
.public .default-block-hero-image-text h6 {
	font-size:18px;
	font-weight:bold;
}
.public .default-block-hero-image-button {
}

/* border-block-hero-image */
.public .border-block-hero-image {
	padding:15px 15px 0px 15px;
	border:1px solid #000000;
	 -webkit-border-radius: 8px;
		-moz-border-radius: 8px;
			 border-radius: 8px;
			 margin-bottom:0px;
}
.public .border-block-hero-image-image {
	width:100%;
	text-align:center;
	margin-bottom:15px;
}
.public .border-block-hero-image-image img {
	width:100%;
}
.public .border-block-hero-image-text {
	position:static !important;
	width:100% !important;
	overflow: hidden;
}
.public .border-block-hero-image-text h1,
.public .border-block-hero-image-text h2,
.public .border-block-hero-image-text h3,
.public .border-block-hero-image-text h4,
.public .border-block-hero-image-text h5,
.public .border-block-hero-image-text h6 {
	font-size:18px;
	font-weight:bold;
}
.public .border-block-hero-image-button {
	margin:-8px 0px 30px 0px;
}

/* ============================================================ */
/* Switch language												*/
/* ============================================================ */

.public .ccm-region-flag {
	width:24px;
	height:auto;
	margin-right:4px;
}

/* ============================================================ */
/* Video														*/
/* ============================================================ */

.public .ccm-video {
	text-align:center;
}
.public .ccm-video h1 {
	display:block; 
	position:absolute; 
	left:0px; right:0px; top:0px; 
	padding:15px;
	font-size:16px;
	text-align:center; 
	color:#5B5B5B;
	background:url(/images/bg/transparent-white-50.png) left top repeat;
}
.public .ccm-video-outside {
	padding:0px 15px 0px 15px;
}
.public .ccm-video-outside h1 {
	text-align:center;
}
/* -lg- */
@media (min-width: 992px) {
	.public .ccm-video h1 {
		font-size:22px !important;
		line-height:30px;
	}
}
/* -xl- */
@media (min-width: 1200px) {
	.public .ccm-video h1 {
		font-size:26px !important;
		line-height:34px;
	}
}
/* -xxl- */
@media (min-width: 1400px) {
	.public .ccm-video h1 {
		font-size:32px !important;
		line-height:40px;
	}
}
@media (min-width: 1600px) {
	.public .ccm-video h1 {
		font-size:36px !important;
		line-height:40px;
	}
}

/* ============================================================ */
/* exsys Contact Form											*/
/* ============================================================ */

.public .captcha-view {
	display:inline-block;
	padding-right:10px;
	font-size:24px;
}


/* ============================================================ */
/* Forms														*/
/* ============================================================ */

/* Valid / Invalid Darstellung */
.form-control:required:invalid {
	border:1px solid #E00000;
}
.form-control:required:valid {
	border:1px solid #B4CC1E;
}

input[type="checkbox"]:required:invalid + label { 
	color:#E00000; 
}
input[type="checkbox"]:required:valid + label { 
	color:#869A16; 
}

/* Alternative Darstellung mit Label halb im Formfeld */
.form-group {
	position:relative;
	padding-bottom:1.25rem;
}

.form-group .form-label {
	font-size:14px;
	line-height:14px;
	position:absolute;
	left:10px; top:-8px;
	background-color:#FFFFFF;
	padding:0px 5px 0px 5px;
}

.form-control::not(textarea),
select.form-control,
select.form-control[multiple], 
select.form-control[size] {
	height: calc(1.6em + .75rem + 2px);
	padding: .475rem .75rem .375rem .75rem;
}

/* ============================================================ */
/* Bootstrap 5 override: ;										*/
/* ============================================================ */

/* Buttons */

.public .btn {
	font-size:20px;
	line-height:20px;
	padding-top:15px;
	padding-bottom:13px;
}

.public .btn:focus,
.public .btn:active,
.public .btn-primary:active,
.public .btn-primary:focus {
	box-shadow: 0 0 0 .25rem rgba(176,139,25,.5);
}

.public .btn-primary {
	background-color:#B08B19;
	color:#FFFFFF !important;
	text-decoration:none !important;
	width:100%;
	border-color:#FFFFFF;
}

.public .btn-primary a {
	color:#FFFFFF !important;
	text-decoration:none;
}


.public .btn-outline-primary {
	width:100%;
}

.form-control:focus {
	border-color: #B08B19;
	box-shadow: 0 0 0 .25rem rgba(176,139,25,.25);
}



/* Start (s) und Ende (e) sind keine Richtungsangaben, daher werden Sie wieder durch Left (l) und Right (r) erweitert. */
.pl-0 {
	padding-left: 0!important
}
.pl-1 {
	padding-left: .25rem!important
}
.pl-2 {
	padding-left: .5rem!important
}
.pl-3 {
	padding-left: 1rem!important
}
.pl-4 {
	padding-left: 1.5rem!important
}
.pl-5 {
	padding-left: 3rem!important
}

.pr-0 {
	padding-right: 0!important
}
.pr-1 {
	padding-right: .25rem!important
}
.pr-2 {
	padding-right: .5rem!important
}
.pr-3 {
	padding-right: 1rem!important
}
.pr-4 {
	padding-right: 1.5rem!important
}
.pr-5 {
	padding-right: 3rem!important
}

.ml-0 {
	margin-left: 0!important
}
.ml-1 {
	margin-left: .25rem!important
}
.ml-2 {
	margin-left: .5rem!important
}
.ml-3 {
	margin-left: 1rem!important
}
.ml-4 {
	margin-left: 1.5rem!important
}
.ml-5 {
	margin-left: 3rem!important
}
.ml-auto {
	margin-left: auto!important
}

.mr-0 {
	margin-right: 0!important
}
.mr-1 {
	margin-right: .25rem!important
}
.mr-2 {
	margin-right: .5rem!important
}
.mr-3 {
	margin-right: 1rem!important
}
.mr-4 {
	margin-right: 1.5rem!important
}
.mr-5 {
	margin-right: 3rem!important
}
.mr-auto {
	margin-right: auto!important
}

/* -sm- */
@media (min-width:576px) {
	.pl-sm-0 {
		padding-left: 0!important
	}
	.pl-sm-1 {
		padding-left: .25rem!important
	}
	.pl-sm-2 {
		padding-left: .5rem!important
	}
	.pl-sm-3 {
		padding-left: 1rem!important
	}
	.pl-sm-4 {
		padding-left: 1.5rem!important
	}
	.pl-sm-5 {
		padding-left: 3rem!important
	}

	.pr-sm-0 {
		padding-right: 0!important
	}
	.pr-sm-1 {
		padding-right: .25rem!important
	}
	.pr-sm-2 {
		padding-right: .5rem!important
	}
	.pr-sm-3 {
		padding-right: 1rem!important
	}
	.pr-sm-4 {
		padding-right: 1.5rem!important
	}
	.pr-sm-5 {
		padding-right: 3rem!important
	}

	.ml-sm-0 {
		margin-left: 0!important
	}
	.ml-sm-1 {
		margin-left: .25rem!important
	}
	.ml-sm-2 {
		margin-left: .5rem!important
	}
	.ml-sm-3 {
		margin-left: 1rem!important
	}
	.ml-sm-4 {
		margin-left: 1.5rem!important
	}
	.ml-sm-5 {
		margin-left: 3rem!important
	}
	.ml-sm-auto {
		margin-left: auto!important
	}

	.mr-sm-0 {
		margin-right: 0!important
	}
	.mr-sm-1 {
		margin-right: .25rem!important
	}
	.mr-sm-2 {
		margin-right: .5rem!important
	}
	.mr-sm-3 {
		margin-right: 1rem!important
	}
	.mr-sm-4 {
		margin-right: 1.5rem!important
	}
	.mr-sm-5 {
		margin-right: 3rem!important
	}
	.mr-sm-auto {
		margin-right: auto!important
	}
}

/* -md- */
@media (min-width:768px) {
	.pl-md-0 {
		padding-left: 0!important
	}
	.pl-md-1 {
		padding-left: .25rem!important
	}
	.pl-md-2 {
		padding-left: .5rem!important
	}
	.pl-md-3 {
		padding-left: 1rem!important
	}
	.pl-md-4 {
		padding-left: 1.5rem!important
	}
	.pl-md-5 {
		padding-left: 3rem!important
	}

	.pr-md-0 {
		padding-right: 0!important
	}
	.pr-md-1 {
		padding-right: .25rem!important
	}
	.pr-md-2 {
		padding-right: .5rem!important
	}
	.pr-md-3 {
		padding-right: 1rem!important
	}
	.pr-md-4 {
		padding-right: 1.5rem!important
	}
	.pr-md-5 {
		padding-right: 3rem!important
	}

	.ml-md-0 {
		margin-left: 0!important
	}
	.ml-md-1 {
		margin-left: .25rem!important
	}
	.ml-md-2 {
		margin-left: .5rem!important
	}
	.ml-md-3 {
		margin-left: 1rem!important
	}
	.ml-md-4 {
		margin-left: 1.5rem!important
	}
	.ml-md-5 {
		margin-left: 3rem!important
	}
	.ml-md-auto {
		margin-left: auto!important
	}

	.mr-md-0 {
		margin-right: 0!important
	}
	.mr-md-1 {
		margin-right: .25rem!important
	}
	.mr-md-2 {
		margin-right: .5rem!important
	}
	.mr-md-3 {
		margin-right: 1rem!important
	}
	.mr-md-4 {
		margin-right: 1.5rem!important
	}
	.mr-md-5 {
		margin-right: 3rem!important
	}
	.mr-md-auto {
		margin-right: auto!important
	}
}

/* -lg- */
@media (min-width:992px) {
	.pl-lg-0 {
		padding-left: 0!important
	}
	.pl-lg-1 {
		padding-left: .25rem!important
	}
	.pl-lg-2 {
		padding-left: .5rem!important
	}
	.pl-lg-3 {
		padding-left: 1rem!important
	}
	.pl-lg-4 {
		padding-left: 1.5rem!important
	}
	.pl-lg-5 {
		padding-left: 3rem!important
	}

	.pr-lg-0 {
		padding-right: 0!important
	}
	.pr-lg-1 {
		padding-right: .25rem!important
	}
	.pr-lg-2 {
		padding-right: .5rem!important
	}
	.pr-lg-3 {
		padding-right: 1rem!important
	}
	.pr-lg-4 {
		padding-right: 1.5rem!important
	}
	.pr-lg-5 {
		padding-right: 3rem!important
	}

	.ml-lg-0 {
		margin-left: 0!important
	}
	.ml-lg-1 {
		margin-left: .25rem!important
	}
	.ml-lg-2 {
		margin-left: .5rem!important
	}
	.ml-lg-3 {
		margin-left: 1rem!important
	}
	.ml-lg-4 {
		margin-left: 1.5rem!important
	}
	.ml-lg-5 {
		margin-left: 3rem!important
	}
	.ml-lg-auto {
		margin-left: auto!important
	}

	.mr-lg-0 {
		margin-right: 0!important
	}
	.mr-lg-1 {
		margin-right: .25rem!important
	}
	.mr-lg-2 {
		margin-right: .5rem!important
	}
	.mr-lg-3 {
		margin-right: 1rem!important
	}
	.mr-lg-4 {
		margin-right: 1.5rem!important
	}
	.mr-lg-5 {
		margin-right: 3rem!important
	}
	.mr-lg-auto {
		margin-right: auto!important
	}
}

/* -xl- */
@media (min-width:1200px) {
	.pl-xl-0 {
		padding-left: 0!important
	}
	.pl-xl-1 {
		padding-left: .25rem!important
	}
	.pl-xl-2 {
		padding-left: .5rem!important
	}
	.pl-xl-3 {
		padding-left: 1rem!important
	}
	.pl-xl-4 {
		padding-left: 1.5rem!important
	}
	.pl-xl-5 {
		padding-left: 3rem!important
	}

	.pr-xl-0 {
		padding-right: 0!important
	}
	.pr-xl-1 {
		padding-right: .25rem!important
	}
	.pr-xl-2 {
		padding-right: .5rem!important
	}
	.pr-xl-3 {
		padding-right: 1rem!important
	}
	.pr-xl-4 {
		padding-right: 1.5rem!important
	}
	.pr-xl-5 {
		padding-right: 3rem!important
	}

	.ml-xl-0 {
		margin-left: 0!important
	}
	.ml-xl-1 {
		margin-left: .25rem!important
	}
	.ml-xl-2 {
		margin-left: .5rem!important
	}
	.ml-xl-3 {
		margin-left: 1rem!important
	}
	.ml-xl-4 {
		margin-left: 1.5rem!important
	}
	.ml-xl-5 {
		margin-left: 3rem!important
	}
	.ml-xl-auto {
		margin-left: auto!important
	}

	.mr-xl-0 {
		margin-right: 0!important
	}
	.mr-xl-1 {
		margin-right: .25rem!important
	}
	.mr-xl-2 {
		margin-right: .5rem!important
	}
	.mr-xl-3 {
		margin-right: 1rem!important
	}
	.mr-xl-4 {
		margin-right: 1.5rem!important
	}
	.mr-xl-5 {
		margin-right: 3rem!important
	}
	.mr-xl-auto {
		margin-right: auto!important
	}
}

/* -xxl- */
@media (min-width:1400px) {
	.pl-xxl-0 {
		padding-left: 0!important
	}
	.pl-xxl-1 {
		padding-left: .25rem!important
	}
	.pl-xxl-2 {
		padding-left: .5rem!important
	}
	.pl-xxl-3 {
		padding-left: 1rem!important
	}
	.pl-xxl-4 {
		padding-left: 1.5rem!important
	}
	.pl-xxl-5 {
		padding-left: 3rem!important
	}

	.pr-xxl-0 {
		padding-right: 0!important
	}
	.pr-xxl-1 {
		padding-right: .25rem!important
	}
	.pr-xxl-2 {
		padding-right: .5rem!important
	}
	.pr-xxl-3 {
		padding-right: 1rem!important
	}
	.pr-xxl-4 {
		padding-right: 1.5rem!important
	}
	.pr-xxl-5 {
		padding-right: 3rem!important
	}

	.ml-xxl-0 {
		margin-left: 0!important
	}
	.ml-xxl-1 {
		margin-left: .25rem!important
	}
	.ml-xxl-2 {
		margin-left: .5rem!important
	}
	.ml-xxl-3 {
		margin-left: 1rem!important
	}
	.ml-xxl-4 {
		margin-left: 1.5rem!important
	}
	.ml-xxl-5 {
		margin-left: 3rem!important
	}
	.ml-xxl-auto {
		margin-left: auto!important
	}

	.mr-xxl-0 {
		margin-right: 0!important
	}
	.mr-xxl-1 {
		margin-right: .25rem!important
	}
	.mr-xxl-2 {
		margin-right: .5rem!important
	}
	.mr-xxl-3 {
		margin-right: 1rem!important
	}
	.mr-xxl-4 {
		margin-right: 1.5rem!important
	}
	.mr-xxl-5 {
		margin-right: 3rem!important
	}
	.mr-xxl-auto {
		margin-right: auto!important
	}
}

/* ============================================================ */
/* Developement Helper											*/
/* ============================================================ */

/* Screensize Helper 
body::after {
	position:fixed;
	right:0px; bottom:0px;
	background-color:#FFFFFF;
	color:#000000;
	content:"- | <576px (XS)";
	z-index:999999;
	padding:0px 5px 0px 5px;
}
@media (min-width: 576px) {
	body::after { content:"-SM- | >=576px"; }
}
@media (min-width: 768px) {
	body::after { content:"-MD- | >=768px"; }
}
@media (min-width: 992px) {
	body::after { content:"-LG- | >=992px"; }
}
@media (min-width: 1200px) {
	body::after { content:"-XL- | >=1200px"; }
}
@media (min-width: 1400px) {
	body::after { content:"-XXL- | >=1400px"; }
}
*/
/* Container Helper
.container { background-color:#E0E0E0 !important; }
@media (max-width: 320px) {
}
@media (min-width: 576px) {
	.container { background-color:#FFC1FC !important; }
}
@media (min-width: 768px) {
	.container { background-color:#FCB1B3 !important; }
}
@media (min-width: 992px) {
	.container { background-color:#FFFE9B !important; }
}
@media (min-width: 1200px) {
	.container { background-color:#BCFBF8 !important; }
}
*/