@font-face {
    font-family: 'sinkin_sans400_regular';
  
    src: url('SinkinSans-400Regular-webfont.woff'); 
    font-weight: normal;
    font-style: normal;
}   
* {
    margin: 0;
    padding: 0;
}
html {
  scroll-behavior: smooth;
}
header, nav, footer, aside, section {
    display: block;
}
body {
	font-family: 'sinkin_sans400_regular', Helvetica, Arial, sans-serif;
	max-width: 65em;
	margin: 0 auto;
	text-align: center;
	background-color:lightgrey;
}
p{ font-size: 1em;

}
.peng { 
    font-size: 0.8em;
     margin: 0 0.5em 0 0.5em;
     color:#777;
}

h2{
    color: white;
    font-size:2.2em;
    padding-top:2em;
	margin: 0 0.5em .5em 0.5em;
	text-align:left;
}
.h2eng{
	font-size:1.5em;
	margin: 1em 0px 0.8em 0;
}

.h2schwarz{
    color:black;
    font-size:2.5em;
    padding-top:1em;
	margin: 0 0.5em 1em 0;
	text-align:left;
}

h3{
	color: black;
	font-size:1.5em;
	margin: 0.8em 0 0.3em 0;
}
.h3weiss{
	color: white;
	font-size:1.5em;
	margin: 0px 0px 0.3em 0;
}

.h3eng{
	font-size:1.2em;
	margin: 1em 0px 0.8em 0;
}
.h3weit {
  font-size:1.2em;
  letter-spacing: 4px;
  color: #00BFAF;
}
h4{
	color: black;
	font-size:1.2em;
	margin: 0.3em 0 0.3em 0;
}
h5{
    font-size:1em;
	font-weight:bold;
	margin: 0.3em 0 0.3em 0;
}

a {
	color: #00A698;
	text-decoration: none;
	}
a:active, a:focus{outline: none;
}
a:hover {
	color: black
}
address {
	font-style:normal;
}

.btn {
	color:black;
	padding:0.3em;
	border:medium black solid;
}
.btn:hover {
	color:white;
	background-color:black;
	border:medium white solid;
}

/*___________________________________________________________________________*/
.header {
  background-color:darkmagenta ;
  box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1);
  /*position: fixed;*/
  width: 100%;
  z-index: 3;
  border-top: 1em solid #00BFAF;
  text-align:left;

}
.header ul {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
  background-color: #7FFFF4;
  text-align:right;
}
.header li a {
  display: block;
  padding: 15px 20px;
  color: black;
  background-color: #7FFFF4;
  opacity:0.9;
  border-right: 1px solid #7FFFF4;
  text-decoration: none;
  font-weight: bold;
}
.header li a:hover {
  /*background-color: #f4f4f4;*/
  color: white;
}
.header .logo {
  text-decoration: none;
  margin-left:1em;
}
.header .menu {
  clear: both;
  max-height: 0;
  transition: max-height .2s ease-out;
}
.header .menu-icon {
  cursor: pointer;
  display: inline-block;
  float: right;
  /*padding: 28px 20px;*/
  padding: 2em 1em;
  position: relative;
  user-select: none;
}
.header .menu-icon .navicon {
  background: #333;
  display: block;
  height: 2px;
  position: relative;
  transition: background .2s ease-out;
  width: 18px;
}
.header .menu-icon .navicon:before,
.header .menu-icon .navicon:after {
  background: #333;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  transition: all .2s ease-out;
  width: 100%;
}
.header .menu-icon .navicon:before {
  top: 5px;
}
.header .menu-icon .navicon:after {
  top: -5px;
}
.header .menu-btn {
  display: none;
}
.header .menu-btn:checked ~ .menu {
  max-height: 300px;
}
.header .menu-btn:checked ~ .menu-icon .navicon {
  background: transparent;
}
.header .menu-btn:checked ~ .menu-icon .navicon:before {
  transform: rotate(-45deg);
}
.header .menu-btn:checked ~ .menu-icon .navicon:after {
  transform: rotate(45deg);
}
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
  top: 0;
}

/*______________fürNavLeiste___________________________________*/

.rahi {
   background-color:   #7FFFF4;
   height: 5em;
}
.rahiweiss {
   background-color:white;
}
.rahiweiss p {
   color:#777;
}

.rahiweiss li {
   color:#777;
}
.rahiweiss td {
   color:#777;
}

 

/*______________auswahl-grid___________________________________*/

#auswahl {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(15em, 1fr));
	
	gap: 2em;
	text-align: center;
	margin: 0 0 0 0;
	padding-bottom:1em;
	/*border-top: medium solid #7FFFF4;*/
	background-color:white;
	}
#auswahl figure {
	position: relative;
	color: black;
	background: white;
	margin-top:1.5em;
    text-align: center; 
}
# auswahl figure p {
	margin:0.5em 0 1em 0;
}
#auswahl figure p {
    padding-bottom: 1em;
	margin:0.5em 0 0.5em 0;
}
#auswahl figure a {
	color:black;
	padding:0.3em;
	margin-bottom:1em;
	border:medium black solid;
}
#auswahl figure a:hover {
	color:white;
	background-color:black;
	border:medium white solid;
}

#auswahl figure img {
	display: block;
    margin:0 auto 0.5em auto;
}
#auswahl > figure > figcaption {
 	/* ;*/  
}
#auswahl > figcaption {
	grid-column: 1 / -1;
	}
/*_________________auswahl grid nav unten_________________________________________________*/
#auswahlnavunten{
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 2rem;
    margin:0 0 0 0;
	text-align: left;
	background-color:white;
	padding-top:0.5em;	
}
	
#auswahlnavunten ul {
	list-style-type:none;
	padding:0 0 0.5em 1em;
	line-height: 1.8em;
}
#auswahlnavunten h3 {
	font-size:1em;
	font-weight:normal;
	margin: 0px 0px 0.3em 1em;
}
#auswahlnavunten figure {
	position: relative;
	color: black;
	
}

/*______nachoben___________________________________________*/

.ranachoben {
    display:flex;
  	flex-direction: row-reverse;
    justify-content:space-between;
    background-color:white;
    padding-top:0.5em;
    padding-left:4em;
}
.nachoben-link {
   color:black;
   font-size: 1em;
   border: medium black solid; 
   margin:0 1em 0.2em 2em;
   padding:0.2em;
}

/*______footer___________________________________________*/
.rafo {
	display: flex;
	background:#00BFAF;
	padding-bottom:1em;
}
.rafo1 {
    flex: auto;
	margin: 0;
	padding: 1em;
	text-align: left;

}
.rafo p {
     font-size:0.8em;
     color:#3c3c3c;
}
.rafo1 ul {
	list-style:none;
	text-align:right;
	 font-size:0.8em;
	
}
.rafo1 a {
	line-height:2.8em;
	color:#3c3c3c;
	text-align: right;
}
.rafo1 a:hover{
	color:white;
}
/*______rahmen_oben_hintergrund__________________________________________*/
.raoben {
	display: flex;
	flex-direction: column;
	background-color:#00BFAF;
	flex:auto;
	text-align:left;
}
.raoben h2{
	color:white;
	padding-left:0.5em;
}
.raoben p{
	color:white;
    padding:2em;
}

.raoben1 {
    /*flex: auto;*/
	margin: 0em;
	padding: 2em;
	background-color:white;
}

/*____Bild 100%_____________________*/
.rabi100 {
	max-width: 100%;
    height:auto;
    width: auto;
}

/*_______Trenner hellgrün__________________*/
.trhegr hr {
	
	text-align:center;
	color:#7FFFF4;
}
/*______nur text rechts___________________*/
.ratxre {
	display: flex;
	background: white;
}
.ratxrea {
	flex-grow: 1;
	text-align:left;
	margin-top:1em;
	padding:1em;
}
.ratxrea:nth-of-type(2) {
	flex-grow: 2;
	flex-basis: 30%;
}
/*______nur text rechts 70______________*/
.ratxre70{
	display: flex;
	background: white;
}
.ratxre70a {
	flex-grow: 1;
	text-align:left;
	margin-top:1em;
	padding:0.5em;
}
.ratxre70a:nth-of-type(2) {
	flex-grow: 2;
	flex-basis: 70%;
}


/*_________text links text rechts________________*/
.ratxtx {
	display: flex;
	flex-direction: column;
	/*flex:auto;*/
	text-align:left;
	/*background: white;*/
		
	justify-content:flex-end; 
}
.ratxtx h3 {
  text-align:center;
}
.ratxtx p {
  margin-bottom:2em;
}

.ratxtxa {
    display: table-cell; /* Fallback IE<9 */
	margin:0.5em 0 0.5em 0;
    padding:0.5em;
	flex-grow: 1;
	flex-basis: 30%;
	
		
}
.ratxtxa img {
   max-width:100%;
   left:auto;
   right:auto;
}


/*_________bild links text rechts________________*/
.rabitx {
	display: flex;
	flex-direction: column;
	/*flex:auto;*/
	text-align:left;
	/*background: white;*/
}
.rabitxa {
    display: table-cell; /* Fallback IE<9 */
	margin:0.5em 0 0.5em 0;
	padding: 0;
	flex-grow: 1;
	flex-basis: 30%;
}
.rabitxa:nth-of-type(1) {
	text-align:center;
}
.rabitxa:nth-of-type(2) {
	padding: 2em;
	margin:0;
}
.rabitxa img {
	max-width:100%;	
}
/*________text links bild rechts_________________*/

.ratxbi {
	display: flex;
	flex-direction: column;
	flex:auto;
	text-align:left;
	/*background: white;*/
}
.ratxbia {
    display: table-cell; /* Fallback IE<9 */
	margin:0.5em 0 0.5em 0;
	padding: 0;
	flex-grow: 1;
	flex-basis: 30%;
}
.ratxbia:nth-of-type(1) {
	text-align:left;
	padding: 2em;
	margin:0;
}
.ratxbia:nth-of-type(2) {
	text-align:center;
	padding:0;
}
.ratxbia img {
	max-width:100%;	
}
/*________bild links text mitte bild rechts_________________*/

.rabitxbi {
	display: flex;
	flex-direction: column;
	flex:auto;
	text-align:left;
	/*background: white;*/
}
.rabitxbia {
    display: table-cell;/* Fallback IE<9 */
	margin:0.5em 0 0.5em 0;
	padding: 0;
	flex-grow: 1;
	flex-basis: 30%;
}
.rabitxbia:nth-of-type(1) {
	text-align:center;
	margin:0;
}
.rabitxbia:nth-of-type(2) {
	text-align:left;
	padding: 2em;
}
.rabitxbia:nth-of-type(3) {
	text-align:center;
	margin:0;
}

.rabitxbia img {
	max-width:100%;	
}


	/*___________________________Startseite________________________________ */
	
.ra-st0 {
    background-color:#00BFAF;
    background-image: url('bilder/gehenm.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	color: white;
	margin:0;
	padding-bottom:2em;
}
.ra-st0 h2 {
   margin:0em 0 4em 1em;
   padding-top:4em;
}

.ra-stco {
  text-align:left;
  margin-left: 0.5em;
  margin-right:0.5em;
  
}
.ra-stco p {
  color:red;
}

.bgimg-1, .bgimg-2, .bgimg-3 {
  position: relative;
  opacity:1;
  background-attachment:fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
/*.bgimg-1 {
  background-image: url("./bilder/gehenm.jpg");
  min-height:500px;
}*/

.bgimg-2 {
  background-image: url("./bilder/einl20g.jpg");
  min-height: 400px;
}

.bgimg-3 {
  background-image: url("./bilder/laufen20g.jpg");
  min-height: 400px;
}
.parcap {
  position: absolute;
  left: 0;
  top: 30%;
  width: 100%;
  text-align: center;
  color: #000; 
}
.parcap h2 {
  color: #fff;
  padding: 0;
  font-size: 3em;
  font-weight:bold;
  letter-spacing: 10px; 
}

.parcap span.border {
  color: #fff;
  padding: 0;
  font-size: 3em;
  font-weight:bold;
  letter-spacing: 10px; 
}
.parcap span.border1 {
  background-color: #111;
  padding: 0;
  font-size: 2em;
  letter-spacing: 10px;
  background-color:transparent;
  font-size:3em;
  color:white;
}
.par-st2 {
 position:relative;
 background-color:white;
 color:#777;
 padding:50px 80px;
 text-align: left;
 }
.par-st2 p {
margin-bottom: 1em;
 }

/* Turn off parallax scrolling for tablets and phones sieheunten */

	
	
/*_________Was________________________________________*/
.ra-wa1 {
	background-color:#00BFAF;
    background-image: url('bilder/werk01.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	color: white;
	margin: 0;
	padding-bottom: 0em;
}
.ra-wa2 {
	display:flex;
	flex-direction: row;
	justify-content:space-around;
	padding:0.5;
	background-color:white;
	
}
.ra-wa2a img {
	max-width: 100%;
    height:auto;
    width: auto;
}
/*_________Wer________________________________________*/
.ra-we1 {
	background-color:#00BFAF;
    background-image: url('bilder/handarbeit01.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;
	color: white;
	margin: 0;
	padding-bottom: 1em;
}
.ra-we2 {
	background-color:#00BFAF;
    background-image: url('bilder/chucksbunt01.jpg');
	background-size:cover;
		background-repeat: no-repeat;
	background-position:center;
	color: white;
	margin: 0;
	padding-bottom: 1em;
}
.ra-we2 h3 {
	margin: 2;
	padding: 5em 2em 1em 2em;
}

/*_________Wie________________________________________*/
.ra-wi1 {
	background-color:#00BFAF;
    background-image: url('bilder/werk05.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	color: white;
	margin: 0;
	padding-bottom: 2em;
}
/*_________Wo________________________________________*/
.ra-wo1 {
	background-color:#00BFAF;
    background-image: url('bilder/aussen.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;
	color: pink;
	margin: 0;
	padding-bottom: 2em;
}
.ra-wo2 {
	/*display:flex;
	flex-direction: row;
	justify-content:space-around;
	padding:0.5em;*/
	padding: 1em 0 2em 0;
	background-color: white;
	text-align:center;
}
.ra-wo2 iframe {
		
	width:90%;
	height:300px;
	frameborder:1px;
	scrolling:=no;
	marginheight:0;
	marginwidth:0;
	border: 1px solid black;
}


.ra-wo3 {
	padding: 0 0 2em 2em;
	text-align:left;
	background-color: white;
}
.ra-wota{
	/*width: 400px;
	
	font-size: 1em;
	margin: 0px 0px 20px 50px;*/
	border-spacing: 0.5em;
	empty-cells: show;
	color: black;
}

	/*Kontakt_________; */		
.ra-ko1 {
    background-color:#00BFAF;
	background-image: url('bilder/logogruen.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;
	color: white;
	margin: 0;
	padding-bottom: 1em;
}
.ra-ko1 a{
    color:white;
    padding: 0 0 1em 0;
    font-size:1em;
    text-decoration:underline;
}
.ra-ko1 a:hover{
    color:grey;
}
.ra-ko1 p{
    color:white;
    padding:0 0 0.4em 5em;
}
.ra-ko2{
    color:black;
    background-color:white;
    text-align:left;
}
.ra-ko2 p{
    color:black;
    margin-left:1em;
}

/*_________Orth-Schuhe________________________________________*/
.ra-os1 {
	background-color:#00BFAF;
    background-image: url('bilder/werk13.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	color: white;
	margin: 0;
	padding-bottom: 4em;
}

/*_________Anpassungen________________________________________*/

.ra-zu1 {
	background-color:#00BFAF;
    background-image: url('bilder/zurigruen.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	color: white;
	margin: 0;
	padding-bottom: 4em;

}
/*_________3D Druck_______________________________________*/

.ra-3d1 {
	background-color:#00BFAF;
    background-image: url('bilder/scangruen01.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	color: red;
	margin: 0;
	padding-bottom: 4em;
}
.ra-3d1 p{
	color: white;
}
.ra-3d2 figcaption {
    text-align:left;
    color:white;
	margin: -2em 0 0 2em;
}

/*_________Einlagen________________________________________*/

.ra-ei1 {
    background-color:#00BFAF;
    background-image: url('bilder/material01.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	color:white;
	margin: 0;
	padding-bottom: 4em;

	
}
.ra-ei1 h2{
   padding: 0.5em 0 0 1em;
}
.ra-ei1 p{
   text-align:left;
   padding: 0.5em 1em 0.5em 1em;
   color:white;
}

/*_________bild  Einla links text rechts________________*/
.ra-eibitx {
	display: flex;
	flex-direction: column;
	/*flex:auto;*/
	text-align:left;
	
}
.ra-eibitxa {
    display: table-cell;/* Fallback IE<9 */
	margin:0.5em 0 0.5em 0;
	padding: 0;
	flex-grow: 1;
	flex-basis: 30%;
}
.ra-eibitxa:nth-of-type(1) {
	text-align:center;
}
.ra-eibitxa:nth-of-type(2) {
	padding: 2em;
	margin:0;
}
.ra-eibitxa img {
	max-width:100%;	
}


/* Slider */
/* Slideshow container */
#slide-container {
   position: relative;
   max-width: 50vw; /* responsiveness */
   padding-left:3em;
}
/* First element to be in block mode for responsiveness */
#slide-first-element {
   display: block; /* to get the dimensions set */
   width: 100%;
   height: auto;
}
/* Other element to be in absolute position */
#slide-element-2,
#slide-element-3,
#slide-element-4 {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 2em;
   bottom: 0;
   left: 3em;
   right: 0;
}
.slide-image {
   width: 100%;
   border-radius: 20px;
}
/*.slide-text {
 position: absolute;
 bottom: 10px;
 background-color: #0042b1bb;
 color: white;
 width: 100%;
 text-align: center;
 font-size: 1.5rem;
}*/
#slide-first-element {
 animation: fade-1 10s infinite;
 -webkit-animation: fade-1 10s infinite;
}
#slide-element-2 {
 animation: fade-2 10s infinite;
 -webkit-animation: fade-2 10s infinite;
}
#slide-element-3 {
 animation: fade-3 10s infinite;
 -webkit-animation: fade-3 10s infinite;
}
#slide-element-4 {
 animation: fade-4 10s infinite;
 -webkit-animation: fade-4 10s infinite;
}
@keyframes fade-1 {
 0% { opacity: 1; }
 25% { opacity: 0; }
 50% { opacity: 0; }
 75% { opacity: 0; }
 100% { opacity: 1; }
}@keyframes fade-2 {
 0% { opacity: 0; }
 25% { opacity: 1; }
 50% { opacity: 0; }
 75% { opacity: 0; }
 100% { opacity: 0; }
}@keyframes fade-3 {
 0% { opacity: 0; }
 25% { opacity: 0; }
 50% { opacity: 1; }
 75% { opacity: 0; }
 100% { opacity: 0; }
}/* example for a 4th slide */
@keyframes fade-4 {
 0% { opacity: 0; }
 25% { opacity: 0; }
 50% { opacity: 0; }
 75% { opacity: 1; }
 100% { opacity: 0; }
}

/*_________Verbandschuhe_______________________________________*/
.ra-vs1 {
	background-color:#00BFAF;
    background-image: url('bilder/antik04.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;

	color: white;
	margin: 0;
	padding-bottom: 4em;
}

/*_________Diab-Schuhe_______________________________________*/

.ra-di1 {
	background-color:#00BFAF;
    background-image: url('bilder/diabgruen.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;

	color: white;
	margin: 0;
	padding-bottom: 4em;
}
	
.ra-di1 h3{
	color: white;
	margin: 0;
	padding: 2em;
}
/*________Pedo______________________________________*/

.ra-pe1 {
	background-color:#00BFAF;
    background-image: url('bilder/antik01.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;
	color: white;
	margin: 0;
	padding-bottom: 4em;
}
.ra-pe2 {
	background-color:black;
}
.ra-pe2 img{
	background-color:#00BFAF;
    width:90%;
}
/*________Leisten____________________________________*/

.ra-le1 {
	background-color:#00BFAF;
    background-image: url('bilder/leisten14.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:right;
	color: white;
	margin: 0;
	padding-bottom: 4em;
}

/*________QM______________________________________*/

.ra-qm1 {
	background-color:#00BFAF;
    background-image: url('bilder/fu01.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;
	color: white;
	margin: 0;
	padding-bottom: 4em;
}
.ra-qm1 h3{
	color:white;
	padding-left:2em;
}


/*_________Silikon_______________________________________*/

.ra-sl1 {
	background-color:#00BFAF;
    background-image: url('bilder/antik03.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	
	color: white;
	margin: 0;
	padding-bottom: 4em;
}

/*_________FlipFlops_______________________________________*/
.ra-ff0 {
	 background-color: #004B41;
}

.ra-ff1 {
	background-color:#00BFAF;
    background-image: url('bilder/werk01.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;

	color: white;
	margin: 0;
	
	padding:0 1em 0 1em;
}

.ra-ff2 {
	display:flex;
	flex-direction: row;
	margin-left:2em;
}

.ra-ff2 img {
	max-width: 100%;
    height:auto;
    width: auto;
}
.ra-ff3 {
	display:flex;
	flex-direction: row-reverse;
    margin:1em;
}
.ra-ff4 {
    background-color:white;
    padding:0.5em;    
} 
.ra-ff4 img {
   	max-width:100%;
    height:auto;
    width: auto;
} 


.ra-ff5 {
    background-color:red;
}
.ra-ff5 img {
   	max-width:100%;
    height:auto;
    width: auto;
} 

/*_________Referenzen_____________________________________*/
.ra-re1 {
	background-color:#004B41;
    background-image: url('bilder/ref.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;
	color: white;
	margin: 0;
	padding-bottom: 4em;
}
.ra-re1 p{
	padding-left:0.3em;
}

.ra-reta{
	border-spacing: 0.5em;
}
.ra-reta td{
	color:white;
}
/*_________Sicherheitsschuhe_______________________________________*/

.ra-si1 {
	background-color:#00BFAF;
    background-image: url('bilder/asssohle04.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	color: white;
	margin: 0;
	padding-bottom: 4em;

}
/*_________Berufsschuhe_______________________________________*/

.ra-be1 {
	background-color:#00BFAF;
    background-image: url('bilder/berufgruen02.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;
	color: white;
	margin: 0;
	padding-bottom: 4em;
}
/*_________Orthoflex______________________________________*/
.ra-of1{
	color:black;
	margin: 0, 0, 0, 1em;
	padding-bottom: 2em;
}

.ra-of1 h3{
	color:black;
	margin: 0, 0, 0, 1em;
	padding-bottom: 0;
}



/*_________Sport_______________________________________*/
.ra-sp1 {
	background-color:#00BFAF;
    background-image: url('bilder/laufen03.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;
	color: white;
	margin: 0;
	padding-bottom: 3em;
}
.ra-sp1 h3{
	color: white;
	margin: 0;
	padding: 2em;
}
.ra-sp2 {
	background-color:#00BFAF;
    background-image: url('bilder/laufen04.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position:center;
	color: white;
	margin: 0;
	padding: 3em 1em 3em 3em;
	text-align:left;
}
.ra-sp2 p{
	color: white;
	margin: 0;
	padding: 2em;
}

.ra-sp2 h3{
	color: white;
	margin: 0;
	padding: 2em;
}
.btn-sp  {
	color:black;
	padding:0.3em;
	border:medium black solid;
}
.btn-sp:hover {
	color:white;
	background-color:black;
	border:medium white solid;
}

/*_______________________________________________________*/
@media only screen and (min-width: 50em) {
/*__________________header_*/

h2{
    color: white;
    font-size:2.5em;
    padding-top:2em;
	margin: 0 1em 1em 2em;
	text-align:left;
}
  .header li {
    float: left;
}
  .header li a {
   /*padding: 25px 20px;*/
   padding: 1em 1.5em;
}
  .header .menu {
    clear: none;
    float: right;
    max-height: none;
}
  .header .menu-icon {
    display: none;
}
  
  /*__________________navunten___*/
    #auswahlnavunten{
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
	text-align: left;
	margin:  0 0 0 0;
	padding-top:0.5em;
 }
 	

 }
 	

@media all and (min-width: 35em) {
.ratxtx {
	flex-direction: row;
}

 /*__________________rabitx___*/
.rabitx {
	flex-direction: row;
}
 /*__________________rabitx___*/
.ratxbi {
	flex-direction: row;
}
 /*__________________rabitxbi___*/
.rabitxbi {
	flex-direction: row;
}
 /*__________________ra-eibitx___*/
.ra-eibitx {
	flex-direction: row;
}
 /*__________________OS ra-os-02a___*/
	.ra-os2 {
		flex-direction: row;
}
	
}

 
@media only screen and (min-width: 25) { 
    /*__________________navunten___*/
    #auswahlnavunten{
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
	text-align: left;
	margin: 0 0 0 0;
	padding-top:0.5em;	
	}
	 /*__________________OS ra-os-02a___*/

   .ra-os2a{
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin:0 0 0 0;
    color:red;
	text-align: left;
	border-top: medium solid #7FFFF4;
	background-color:white;
}
}
/* Abschalt parallax scroll bei fon usw */

@media only screen and (max-device-width: 1024px) {
   .bgimg-1, .bgimg-2, .bgimg-3 {
    background-attachment: scroll;
  }
  /*.bgimg-1 {
    background-image: url("./bilder/gehenm.jpg"); 
}*/
  .bgimg-2 {
    background-image: url("./bilder/einl20k.jpg"); 
}
  .bgimg-3 {
    background-image: url("./bilder/laufen20k.jpg"); 
}