#container {
	max-width:1200px;
	margin-left:auto;
	margin-right:auto;
}
/*  COLUMNS  */
@media screen and (max-width:29.99rem) {.columns432 {display:grid; grid-template-columns:repeat(2, 1fr);}}
@media screen and (min-width:30rem) and (max-width:49.99rem) {.columns432 {display:grid; grid-template-columns:repeat(3, 1fr);}}
@media screen and (min-width:50rem) {.columns432 {display:grid; grid-template-columns:repeat(4, 1fr);}}

@media screen and (max-width:29.99rem) {.columns332 {display:grid; grid-template-columns:repeat(2, 1fr);}}
@media screen and (min-width:30rem) and (max-width:49.99rem) {.columns332 {display:grid; grid-template-columns:repeat(3, 1fr);}}
@media screen and (min-width:50rem) {.columns332 {display:grid; grid-template-columns:repeat(3, 1fr);}}

@media screen and (max-width:29.99rem) {.columns321 {display:grid; grid-template-columns:repeat(1, 1fr);}}
@media screen and (min-width:30rem) and (max-width:49.99rem) {.columns321 {display:grid; grid-template-columns:repeat(2, 1fr);}}
@media screen and (min-width:50rem) {.columns321 {display:grid; grid-template-columns:repeat(3, 1fr);}}

@media screen and (max-width:29.99rem) {.columns221 {display:grid; grid-template-columns:repeat(1, 1fr);}}
@media screen and (min-width:30rem) and (max-width:49.99rem) {.columns221 {display:grid; grid-template-columns:repeat(2, 1fr);}}
@media screen and (min-width:50rem) {.columns221 {display:grid; grid-template-columns:repeat(2, 1fr);}}

@media screen and (max-width:29.99rem) {.columns211 {display:grid; grid-template-columns:repeat(1, 1fr);}}
@media screen and (min-width:30rem) and (max-width:49.99rem) {.columns211 {display:grid; grid-template-columns:repeat(1, 1fr);}}
@media screen and (min-width:50rem) {.columns211 {display:grid; grid-template-columns:repeat(2, 1fr);}}

@media screen and (max-width:29.99rem) {.columns_borderleft {display:grid; grid-template-columns:1fr;}}
@media screen and (min-width:30rem) and (max-width:49.99rem) {.columns_borderleft {display:grid; grid-template-columns:1fr;}}
@media screen and (min-width:50rem) {.columns_borderleft {display:grid; grid-template-columns: 1fr 3fr;}}

/*Variante mit Grid, hier muss das Grid unterhalb einer Minimalweite des Bildschirms ausgeschaltet werden, damit die Elemente als "block" untereinander zu liegen kommen, Daher das Media-Query */
/*
@media screen and (min-width:550px) {
.special_slider {
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
	gap:2rem;
} 
.special_slider .sliderpic {
    grid-column: 1 / span 5;
}
.special_slider .slidertext {
    grid-column: -1 / span 1;
}}
*/



/* Andere Gridvariante - noch nicht voll getestet, aber simpel und straight forward und die children benötigen keine eigene Klasse */
/*
@media screen and (min-width:550px) {
.special_slider {
	display:grid;
	grid-template-columns: minmax(350px,3fr) minmax(200px,1fr);
	gap:2rem;
} 
}
*/



/*Variante mit Flex */

.special_slider {
	display:flex;
	flex-flow:row wrap;
	justify-content:flex-start;
	gap:2rem;
}

.special_slider .sliderpic {
    flex-basis: 560px;
    flex-grow: 3;
  /*  flex-grow:1;  */
}
.special_slider .slidertext {
    flex-basis: 300px;
    flex-grow: initial;
}










/* Padding, damit es bei allen drei obigen Varianten nicht Scheisse aussieht mit Inhalt bis zum Rand beidseits auf kleinen Bildschirmen */
.special_slider {
    	padding:0 1rem;
}



@media screen and (max-width:39.9999rem) {
.special_slider {
  padding: 1rem;
}}

.rsts-skin-light .rsts-prev:after, .rsts-skin-light .rsts-next:after, .rsts-skin-light .rsts-thumbs-prev:after, .rsts-skin-light .rsts-thumbs-next:after {
    content: "\2022";
    position: absolute;
    top: 3px;
    left: 14px;
   font: normal 60px / 1 "Tahoma", sans-serif;
    color: red;
    text-indent: 0;
    font-weight: 600;
    opacity: 1;
    -webkit-transition: none;
} 




.rsts-next, .rsts-prev {
    background:none!important;
    background-image: none!important;
    box-shadow:none!important;
}


.rsts-skin-light .rsts-view {
    border-radius: 0;
    box-shadow: none;
}

.rsts-nav-bullets {
    display:none;
}

.rsts-skin-light .rsts-prev, .rsts-skin-light .rsts-next, .rsts-skin-light .rsts-thumbs-prev, .rsts-skin-light .rsts-thumbs-next {
    width: 60px;
    height: 60px;
    right: 10px;
}

.rsts-skin-light .rsts-prev, .rsts-skin-light .rsts-thumbs-prev {
    left: 10px;
}

#container {
    min-height:calc(100vh - 132px);
}
.footer {
    height:30px;
}