/* .row, .col {
	border: 1px solid black !important;
} */

*, .button {
    font-family: 'Roboto';
	text-transform: none !important;
}

.calculator .form-group{
	margin-bottom: .5rem !important;
}

.dropdown-divider{
	margin: .3rem 0 !important;
}

.calculator .form-check.checkbox{
	padding-left: 30px !important;
}

.form-check.checkbox{
	padding-left: 22px !important;
}

.navbar-expand-sm{
	z-index: 2 !important;
}

.parallax {
  /* Set a specific height */
  height: 650px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}


.bgContainer{
	height: 100% !important;
}


/* Debugs */
	
	/* Darkmode stuff */
	/* Add darkmode just for me and other informed users */
	body.darkmode{
		background-color: var(--deepdark) !important;
		background: var(--deepdark) !important;
	}
	
	.darkmode p,
	.darkmode h5,
	.darkmode h4,
	.darkmode h3,
	.darkmode h2,
	.darkmode td
	{
		color: var(--light);
	}
	
	.darkmode .tag-item a,
	.darkmode .article-box a,
	.darkmode .hoverTrigger:hover,
	.darkmode .hoverTrigger .drop-down a:hover
	{
		color: var(--light) !important;
	}
	
	.darkmodeTrigger{
		position: absolute;
		top: 0px;
		left: 0px;
		width: 2px;
		height: 5px;
		cursor: pointer;
		background-color: transparent !important;
		z-index: 1000 !important;
	}
	
	.tariffCardContainer{
		background-color: var(--light);
	}
	
	.darkmode .border-area{
		background: var(--deepdark) !important;
	}
	
	.darkmode .tariffCardContainer p,
	.darkmode .tariffCardContainer td,
	.darkmode .dataInputContainer p{
		color: var(--dark) !important;
	}
	
	.darkmode .drop-down li:focus, .drop-down li:hover {
		background-color: transparent !important;
		color: var(--primary) !important;
	}
	
	.darkmode ol li{
		color: var(--light) !important;
	}
	
/* Darkmode stuff */

/* Debugs */


.social-icons ul{
	margin-bottom: 0 !important;
}

.feature-icon i{
	transition: all .2s !important;
}

ul a
{
	transition: all .3s !important;
}

#headImageContainer{
	position: absolute;
	top: 16rem;
	left: 0%;
	z-index: 0;
}

#headImageContainer p{
	color: var(--light);
	text-shadow: 1px 1px 2px rgba(0,0,0, 0.85);
}

ul{
	padding-inline-start: 5px !important;
}


.dropdown-menu {
    min-width: 250px !important;
	background-color: var(--secondary);
    border: 1px solid rgba(255,255,255,.75);
    border-radius: .1rem;
}

.dropdown-menu a{
	color: var(--light) !important;
	padding: 0 0 0 15px;
}

.dropdown-menu a:hover{
	color: var(--secondary) !important;
	font-weight: bold !important;
}


/* TariffCard Tablist */
.tariffCardContainer .nav.nav-tabs li{
	background-color: var(--darkgray);
	margin-right: 5px;
	margin-bottom: -1px !important;
	border: 1px solid transparent;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

.tariffCardContainer .nav.nav-tabs li{
	background-color: var(--darkgray);
}

/* TariffCard Tablist */

/* TariffCard Tabitems */
.tariffCardContainer .nav.nav-tabs li a{
	transition: all .3s !important;
	font-size: 14px !important;
	color: var(--deepdark);
}

.tariffCardContainer .nav.nav-tabs li a:hover,
.tariffCardContainer .nav.nav-tabs li a.active{
	color: var(--primary);
	background: var(--light) !important;
}

.tariffCardContainer .nav.nav-tabs li a.active{ 
	font-weight: bold !important;}

/* TariffCard Tabitems */


#Mittelpunkt .button.button-border:hover, 
#Mittelpunkt .button.button-border:focus,
#fullCalcContainer .button.button-border:hover, 
#fullCalcContainer .button.button-border:focus{
	background-color: var(--primary) !important;
	color: var(--light) !important;
}


#myTab .tab .nav.nav-tabs li a{
	background: var(--light);
}

.hoverTrigger a{
	color: var(--dark) !important;
}

/* Actual content starts here!  */



b, strong{
	font-weight: bold !important;
}

body{
	overflow-x: hidden !important;
}

.hidden{
	display: none !important;
}

/* Campaign pages stuff */

	.campaignContent .nav-center .nav.nav-tabs{
		display: grid !important;
	}
	
	.campaignContent .nav-center .nav.nav-tabs li{
		max-width: 275px;
		min-width: 200px !important;
	}
		
		
		
	.campaignContent .custom-control {
		min-height: 1.5rem !important;
		padding-left: .5rem !important;
	}

	.campaignContent{
		width: 75%;
	}
	
	@media only screen and (max-width: 993px){
		
		.campaignContent{
			width: 95% !important;
			margin: 0px auto !important;
		}
		
		.carousel-inner{
			overflow: visible !important;
		}
		
	}
	
	@media only screen and (max-width: 580px){
		
		.reverseHeadline{
			margin-top: 50px !important;
		}
		
		.reverseOnMobile{
			display: flex;
			flex-direction: column-reverse;
		}
		
		.calculator{
			min-width: 350px;
			max-width: 375px;
		}
	}
/* Campaign pages stuff */




/* Needed for now! */

.calculator .invalid-feedback{
	margin-top: 0px !important;
	padding: 4px 0px !important;
	border-left: 1px solid var(--danger) !important;
	border-right: 1px solid var(--danger) !important;
	border-bottom: 1px solid var(--danger) !important;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	font-size: 12px !important;
	font-weight: bold !important;
	color: var(--light) !important;
}

.invalid-feedback{
	margin-top: 0px;
	padding: 4px 0px;
	border-left: 1px solid var(--danger);
	border-right: 1px solid var(--danger);
	border-bottom: 1px solid var(--danger);
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	font-size: 12px;
	font-weight: bold;
	text-align: center; 
	color: var(--dark);
}

/* More custom checkbox shiat - prefix for tariff-overview only */ 


.remember-checkbox label:before, 
.remember-checkbox label:after {
	font-family: 'Font Awesome 5 Free' !important;
	font-weight: 700 !important;
	color: var(--primary) !important;
	font-size: 22px;
	position: absolute;
	top: -5px;
	left: 0px;
	padding-left: 2px;
	border-radius: 3px;
}

.remember-checkbox label:before {
	border-color: var(--primary) !important;
	border: 2px solid rgba(0, 0, 0, 0.1);
	content: "";
	height: 25px;
	margin-top: 4px;
	width: 25px;
}

.remember-checkbox label:after {
	color: var(--primary) !important;
	overflow: hidden;
	opacity: 0.5;
	transition: all 0.35s !important;
	-webkit-transition: all 0.35s !important;
	-ms-transition: all 0.35s !important;
	-ms-transition: all 0.35s !important;
	-o-transition: all 0.35s !important;
}


/* More custom checkbox shiat - prefix for tariff search only */ 


.stepwizard-row:before {
    top: 24px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 1px;
    background-color: #ccc;
}



.shake{
	-webkit-animation: shuckle 3s ease-out;
    animation: shuckle 3s ease-out;
    transform-origin-x: 50%;
    transform-origin-y: 0px;
    transform-origin-z: initial;
}

@-webkit-keyframes shuckle {
    0% {
        -webkit-transform: rotate(-8deg);
        transform: rotate(-8deg)
    }

    2% {
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg)
    }

    4% {
        -webkit-transform: rotate(-12deg);
        transform: rotate(-12deg)
    }

    6% {
        -webkit-transform: rotate(12deg);
        transform: rotate(12deg)
    }

    8% {
        -webkit-transform: rotate(-14deg);
        transform: rotate(-14deg)
    }

    10% {
        -webkit-transform: rotate(14deg);
        transform: rotate(14deg)
    }

    12% {
        -webkit-transform: rotate(-12deg);
        transform: rotate(-12deg)
    }

    14% {
        -webkit-transform: rotate(12deg);
        transform: rotate(12deg)
    }

    16% {
        -webkit-transform: rotate(-8deg);
        transform: rotate(-8deg)
    }

    18% {
        -webkit-transform: rotate(8deg);
        transform: rotate(8deg)
    }

    20% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes shuckle {
    0% {
        -webkit-transform: rotate(-8deg);
        transform: rotate(-8deg)
    }

    2% {
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg)
    }

    4% {
        -webkit-transform: rotate(-12deg);
        transform: rotate(-12deg)
    }

    6% {
        -webkit-transform: rotate(12deg);
        transform: rotate(12deg)
    }

    8% {
        -webkit-transform: rotate(-14deg);
        transform: rotate(-14deg)
    }

    10% {
        -webkit-transform: rotate(14deg);
        transform: rotate(14deg)
    }

    12% {
        -webkit-transform: rotate(-12deg);
        transform: rotate(-12deg)
    }

    14% {
        -webkit-transform: rotate(12deg);
        transform: rotate(12deg)
    }

    16% {
        -webkit-transform: rotate(-8deg);
        transform: rotate(-8deg)
    }

    18% {
        -webkit-transform: rotate(8deg);
        transform: rotate(8deg)
    }

    20% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}


.hide-on-med-and-up{
	display: none;
}

.hide-on-small-only{
	display: block;
}

.userInformationCard{
	border: 1px solid var(--dark);
	padding: 5px 10px !important;
	background-color: var(--lightgray);
}

.userInformationCard ul{
	list-style: none !important;
}


/* Accordion */

.fa, .fas, .far, .accordion .acd-group .acd-heading:before{
	font-family: 'Font Awesome 5 Free' !important;
	font-weight: 450;
}

.fa, .fas, .accordion .acd-group .acd-heading:before{
	font-weight: 600 !important;
}

.accordion .acd-group {
	box-shadow: 0 0 10px rgba(0, 0, 0, .1);
}

.accordion.accordion-border .acd-group.acd-active .acd-heading, .accordion.accordion-border .acd-group .acd-heading:hover{
	background-color: var(--primary) !important;
}

.accordion .acd-group .acd-des{
	height: 52px;
	display: block !important;
	overflow: hidden !important;
}


.accordion .acd-group.acd-active .acd-des{
	height: inherit !important;
}

/* Accordion */

.process.left .process-step{
	z-index: 100 !important;
}

.process .process-step strong{
	z-index: 3 !important;
}


.grecaptcha-badge{
	z-index: 1000 !important;
}


.mega-menu .menu-mobile-collapse-trigger span,
.mega-menu .menu-mobile-collapse-trigger:before,
.mega-menu .menu-mobile-collapse-trigger:after{
	background: var(--dark) !important;
}



#sealHeadline{
	text-shadow: 2px 1px 3px #f1f1f8;
	color: var(--primary);
}

/* Needed for now! */ 





/* Debugs */


/* FONTS */
h1, h2, h3, h4, h5, h6{
	font-weight: 300 !important;
}
p, span, a, label{
	font-weight: 100 !important;
}

::selection{
	background: var(--primary) !important;
	color: var(--light) !important;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: var(--darkgray) !important;
}
::-moz-placeholder { /* Firefox 19+ */
  color: var(--darkgray) !important;
}
:-ms-input-placeholder { /* IE 10+ */
  color: var(--darkgray) !important;
}
:-moz-placeholder {
	color: var(--darkgray) !important;
}

input[type=text]{
	color: black;
}


/* FONTS */

/* Elements */


/* Effects */

.grayscale{
	-webkit-filter: grayscale(80%);
	filter: grayscale(80%);
	opacity: .8;
}

/* Effects */


#FilterSection input[type=checkbox].form-control{
	height: 13px !important;
}




/* Breads */

.page-breadcrumb li a span{
	color: var(--breads) !important;
	font-size: 16px !important;
}

.page-breadcrumb li a span:hover{
	color: var(--dark) !important;
}

.page-breadcrumb li i{
	color: var(--breads) !important;
	font-size: 12px !important;
}

/* Breads */




#Mittelpunkt .card,
.nav-tabs .nav-item a{
	border-radius: .25rem !important;
}

#Mittelpunkt img{
	border-top-left-radius: .3rem !important;
	border-top-right-radius: .3rem !important;
}

#Mittelpunkt .button-border:hover{
	background-color: transparent !important;
}


/* Step wizard */
	.stepwizard{
		margin: 0px auto !important;
		text-align: center !important;
	}

	.stepwizard-step button{
		width: 50px;
		height: 50px;
	}
		
		
	.stepwizard-step{
		display: table;
		text-align: center;
		position: relative;
		margin: 0px auto;
	}
	
	.stepwizard-row{
		display: inherit !important;
	}
	
/* Step wizard */


.menu-list-items{
	padding: 0px !important;
}

.desktopTopFixed .menu-list-items{
	min-height: 90px !important;
}

.desktopTopFixed li{
	padding: 0px !important;
}

.mega-menu{
	min-height: 72px !important;
}

.serviceItemBox > .portfolio-item{
	max-height: 350px !important;
}

.portfolio-item img{
	max-height: 180px !important;
	min-height: 180px !important;
}

.portfolio-item > .portfolio-overlay{
	max-height: 100px !important;
	min-height: 100px !important;
	overflow: hidden !Important;
}

.drop-down li a{
	color: var(--dark) !important;
	padding: 5px 10px !important;
}

.drop-down li:focus,
.drop-down li:hover{
	background-color: var(--gray);
	color: var(--primary);
}

.drop-down{
	background-color: var(--lightgray) !important;
}


#awardsContainer .card-image{
	margin: 0px auto !important;
}

#awardsContainer img{
	padding-top: 10px !important;
	max-width: 350px !important;
	margin-bottom: 25px !important;
	
}

#myTab{
	padding: 0 !important;
	margin-bottom: -20px !important;
	border: 0 !important;
}


.tab-border .tab-content {
	border: 0px !important;
}

#myTabContent{
	border-radius: .25rem;
}

#myTabContent label{
	color: var(--light) !important;
}

#myTabContent .custom-control-label{
	margin-left: 20px !important;
}

.tab .nav.nav-tabs li a{
	padding: 8px 12px !important;
}


.table.table-hover.small td{
	padding: 5px !important;
}

.button.button-border-er {
	background: var(--lightblue) !important;
	border: 1px solid transparent !important;
	border-radius: 4px !important;
	width: 46px !important;
	height: 46px !important;
}

.button.button-border-er:hover,
.button.button-border-er:focus {
	background: var(--primary)  !important;
	color: #ffffff  !important;
	border-color: transparent  !important;
}

.header.text-dark .mega-menu .menu-links > li.active > a {
	font-weight: bold !important; 
}

.hoverTrigger .drop-down{
	background: var(--secondary) !important;
	border-bottom-left-radius: 4px !important;
	border-bottom-right-radius: 4px !important;
	padding: 0 !important;
}

.hoverTrigger .drop-down li{
	line-height: 25px !important;
	padding: 2px 4px;
}

.hoverTrigger a{
	color: var(--light) !important;
}

.hoverTrigger .drop-down li > a{
	color: var(--light) !important;
	font-size: 14px !important;
	padding: 5px 10px !important;
}


.drop-down li > a:hover{
	font-weight: bold !important;
}

.mega-menu .menu-links > li > a{
	margin-top: 10px;
	color: #323232;
}

.card-body{
	padding: .75rem !important;
}

.calculator input[type=text]{
	max-height: 40px !important;
    max-width: 123px !important;
	margin: 0px auto;
}

.calculator .nav-item {
	max-width: 150px !important;
	min-width: 150px;
}

.nav-tabs{
	padding: 5px 0px 0px 0px !important;
}

.btn-toolbar .btn-group{
	max-width: 200px;
}

.btn-group > .btn{
	min-width: 48px !important;
	padding: 2px !important;
	/* border-radius: 0 !important; */
}

#myTab > .nav-item a{
	transition: all .3s !important;
	border: 0;
	background-color: var(--light);
}


#myTab > .nav-item a.active,
#myTab > .nav-item a:hover
{
	color: var(--light) !important;
	background: var(--darkTab) !important;
	border: 0 !important;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25) !important;
}

.calcIcon{
	max-width: 53px !important;
	min-height: 46px !important;
	cursor: pointer;
}

.calcIcon.guenstig{
	background: url('/img/icons/icon-guenstig.png');
}

.calcIcon.guenstig:hover,
.calcIcon.guenstig.active{
	background: url('/img/icons/icon-guenstig-active.png') !important;
}

.calcIcon.fair{
	background: url('/img/icons/icon-fair.png');
}

.calcIcon.fair:hover,
.calcIcon.fair.active{
	background: url('/img/icons/icon-fair-active.png') !important;
}


#calcBenefitsRow{
	text-align: center;
}

#indexRebellContainer li{
	background-image: url("/img/icons/check-gruen.png");
	background-repeat: no-repeat;
	line-height: 28px;
	padding-left: 30px;
}

#secCalculator li{
	background-image: none !important;
	padding-left: 0px !important;
}

#secCalculator li a{
	min-width: 110px;
}

#indexRebellContainer{
	text-align: left;
}

#indexRebellContainer i {
	padding-right: 0.3rem;
}

#indexRebellContainer ul li p{
	line-height: 1.5;
}

.spacingContainer{
	padding: 6rem 50px 0;
}

.spacingContainer h2{
	font-size: 48px !important;
}

.spacingContainer.trap{
	text-align: right;
}




.checklistBox{
	padding-left: 15px;
	text-align: left;
}








.col.col-12.col-sm-4 .grid-item{
	margin: 20px auto;
	min-width: 175px !important;
	max-width: 350px;
	max-height: 450px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.col.col-4 .grid-item img{
	max-width: 350px !important;
    max-height: 180px;
    margin: 0px auto !important;
}

.tab-pane button{
	background-color: var(--lightblue) !important;
}

.tab-pane button:hover{
	background-color: var(--primary) !important;
}

.menu-links .nav-tabs .nav-item{
	width: 100%;
	margin: 0px auto 2px !important;
}


.kontaktBox{
	background-color: var(--lightgray);
	padding: 5px !important;
	min-height: 180px !important;
}

.kontaktBox:hover{
	background-color: var(--gray) !important;
}

#KontaktBoxes{
	margin-top: 50px !important;
}

.spaeter{
	position: absolute;
	bottom: 0px !important;
    font-size: 13px !important;
}

.custom-checkbox .custom-control-input:checked~.custom-control-label::before {
    background-color: var(--primary) !important;
}


.back-to-top {
    position: fixed;
    bottom: 20px;
    right: 80px;
	border-color: var(--secondary);
    display: none;
	z-index: 10 !important;
}
/* Elements */


/* Color overrides */
:root{
	--primary: #2b9037 !important;
	--primary-light: #f6fff6 !important;
	--secondary: #185ca5 !important;
	--secondary-trans: #185ca5E0 !important;
	--gray: #F2F2F2 !important;
	--lightgray: #F7F7F7 !important;
	--darkgray: #DDDDDD !important;
	--deepdark: #232323 !important;
	--dark: #757575 !important;
	--darkTab: #909090 !important;
	--breads: #BDBDBD !important;
	--lightblue: #85A7CA !important;
	--light: #FFFFFF !important;
}

/* Primary(green) bg/text/border color */
.bg-primary{
	background-color: var(--primary) !important;
}
.text-primary{
	color: var(--primary) !important;
}
.border-primary{
	border-color: var(--primary) !important;
}

/* Primary-Light(green) bg/text/border color */
.bg-primary-light{
	background-color: var(--primary-light) !important;
}
.text-primary-light{
	color: var(--primary-light) !important;
}
.border-primary-light{
	border-color: var(--primary-light) !important;
}


/* Secondary(blue) bg/text color */
.bg-secondary{
	background-color: var(--secondary) !important;
}

.border-secondary{
	border-color: var(--secondary) !important;
}

.bg-secondary-trans{
	background-color: var(--secondary-trans) !important;
}


.text-secondary{
	color: var(--secondary) !important;
}

.bg-lightgray{
	background-color: var(--lightgray) !important;
}
.text-lightgray{
	color: var(--lightgray) !important;
}

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


.bg-darkgray{
	background-color: var(--breads) !important;
}
.text-darkgray{
	color: var(--breads) !important;
}
.border-darkgray{
	border-color: var(--breads) !important;
}


/* Dark bg/text color */
.bg-regular{
	background-color: var(--dark) !important;
}
.text-regular{
	color: var(--dark) !important;
}

/* Light bg/text color */
.bg-light{
	background-color: var(--light) !important;
}
.text-light{
	color: var(--light) !important;
}

/* Transparent bg color */
.bg-transparent{
	background-color: transparent !important;
}

.bg-lightblue{
	background-color: var(--lightblue) !important;
}

.text-lightblue{
	color: var(--lightblue) !important;
}

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

.text-deepdark{
	color: var(--deepdark) !important;
}


/* Color overrides */
/* FOOTER STUFF BELOW! */
footer{
	position: relative;
	min-height: 250px;
}

.footerTopBar{
	position: relative;
	margin-top: -10px;
}

.footerTopBar img{
	max-width: 100% !important;
	z-index: 2;
}

footer a{
	color: var(--lightgray);
	line-height: 30px;
}

footer i{
	color: var(--light);
}

.windraeder{
	position: absolute;
	top: 0;
	left: 10%;
	z-index: 5;
}

.windraeder img{
	margin-top: -110px !important;
	filter: opacity(.6) !important;
}

.baum{
	position: absolute;
	top: -25%;
	right: 10%;
	z-index: 5;
}

.baum img{
	margin-top: -200px !important;
}

.white-box{
	width: inherit;
	margin: 0px auto 10px;
	text-align: center;
	background-color: var(--light);
	border-radius: 10px;
}

.white-box img{
	max-width: 180px;
}

footer hr{
	border-top-color: var(--lightgray) !important;
}

/* FOOTER STUFF Above! */

/* Media queries */

@media only screen and (min-width: 580px){
	
	.hidden-sm-up{
		display: none !important;
	}
	
	.calculator{
		min-width: 400px;
		max-width: 425px;
	}
	
}


@media only screen and (min-width: 993px) and (max-width: 1200px){
	
	.spacingContainer h2{
		font-size: 38px !important;
	}

}

@media only screen and (min-width: 1200px){
	
	#headImageContainer{
		left: 10%;
		top: 16rem;
	}
	
}
	
	
	
@media only screen and (min-width: 993px){
	
	#indexRebellContainer{
		width: 100% !important;
		margin: 0px auto !important;
	}
	
	.campaignImage{
		margin-top: -12rem !important;
	}
	
	#headImageContainer{
		top: 16rem;
	}
	
	.smallHeadLine{
		font-size: 18px;
	}
	
	.bigHeadLine{
		font-size: 50px;
	}
	
	.hidden-md-up{
		display: none !important;
	}
	
	#indexHeadlineContainer p{
		letter-spacing: 1px;
	}
	
	#indexHeadlineContainer{
		margin-top: 50px;
		margin-left: 80px;
	}
}

@media only screen and (max-width: 993px){
	
	.border-left-md-0{
		border-left: none !important;
	}
	
	.hidden-md-down {
		display: none !important;
	  }
	
	.contentContainer .col-12 > .row:nth-child(even){
		display: flex !important;
		flex-direction: column-reverse !important;
		
	}
	
	.header.text-dark .mega-menu > section.menu-list-items .menu-links{
		background: var(--lightgray) !important;
	}
	
	.white-box img{
		max-width: 130px !important;
	}
	
	.footerTopBar{
		margin: 0px !important;
	}
	
	.footerTopBar img{
		margin-top: 25px !important;
	}
	
	.baum img{
		margin-top: -170px !important;
	}
	
	.windraeder img{
		margin-top: -90px !important;
	}
	
	.windraeder{
		left: 2%;
		top: 18%;
	}
	.baum{
		right: 3%;
	}
	
	#fullCalcContainer{
		width: 100% !important;
	}
	
	#calcBenefitsRow{
		text-align: left !important;
	}
	
	#calcBenefitContainer{
		padding-left: 10%;
	}
	
	
	#headImageContainer{
		left: 6%;
		top: 37% !important;
	}
	
	#headImageContainer > .row{
		flex-direction: column-reverse !important;
	}
	
	.smallHeadLine{
		font-size: 12px;
	}
	
	.bigHeadLine{
		font-size: 45px;
		letter-spacing: 0px;
	}
	
	.spacingContainer{
		padding: 0px 50px;
		margin-top: 2rem;
	}
	
	.spacingContainer h2{
		font-size: 48px !important;
		text-align: center !important;
	}
	
	.checklistBox{
		padding-left: 15px;
		text-align: center;
		margin-bottom: 10px;
	}
	
	.spacingContainer.trap{
		text-align: center !important;
	}
	
	#reverseOnMobile{
		display: flex;
		flex-direction: column-reverse;
	}
	
}

@media only screen and (max-width: 500px){
	.baum{
		display: none !important;
	}
	
	.windraeder{
		left: 10%;
	}
	
	#headImageContainer{
		left: 5% !important;
		top: 17% !important;
		width: 90% !important;
		background-color: #ffffffB0;
		padding-bottom: 4px;
		border-radius: 4px;
	}
	
	#headImageContainer p{
		color: var(--secondary) !important;
		text-shadow: 1px 1px 2px rgba(0,0,0, 0.01) !important;
	}
	
	.bigHeadLine{
		font-size: 30px;
		letter-spacing: 0px;
	}
	
	#indexHeadlineContainer{
		padding-left: 5%
	}
	
	.spacingContainer{
		padding: 0px 20px;
		margin-top: 1.5rem;
	}
	
	.spacingContainer h2{
		font-size: 30px !important;
	}
	
}

@media only screen and (min-width: 500px) and (max-width: 580px){
	.nav-tabs .nav-item a{
		font-size: 14px;
	}
	
	.spacingContainer{
		padding: 0px 30px;
		margin-top: 2rem;
	}
	
}

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

@media only screen and (min-width: 768px){
	
	#navbarSupportedContent{
		float: right !important;
	}
	
}

@media only screen and (max-width: 575px){
	
	#myTab{
		background-color: transparent !important;
	}
	
	.hide-on-med-and-up,
	.hidden-sm-up{
		display: block !important;
	}
	
	nav .nav-link,nav .nav-item{
		min-width: 125px !important;
	}
		
	.nav-link, .nav-item{
		background-image: none !important;
		min-width: 110px !important;
		text-align: center !important;
	}
	
	.nav-item a i{
		padding-left: 10px !important;
	}
	
	.nav-tabs{
		display: flex !important;
		flex-direction: row;
	}
	
	.nav-tabs .nav-item a{
		font-size: 14px;
	}
	
	.hide-on-small-only{
		display: none !important;
	}
	
	#calcBenefitContainer{
		padding-left: 20%;
		line-height: 1.8rem;
	}
	
}

/* Media queries */