@font-face {
font-family: 'Helvetica Neue Italic';
font-style: normal;
font-weight: normal;
src: local('../fonts/Helvetica Neue Italic'), url('../fonts/HelveticaNeueItalic.woff') format('woff');
}

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/sanspro/source-sans-pro-v11-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
       url('../fonts/sanspro/source-sans-pro-v11-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/sanspro/source-sans-pro-v11-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/sanspro/source-sans-pro-v11-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/sanspro/source-sans-pro-v11-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/sanspro/source-sans-pro-v11-latin-regular.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}


.bg-color {
  background-color: rgba(0, 0, 0, 0.2);
  min-height: 500px;
}

.visibledevice {display:none;}
.visibledesktop {display:block;}

@media (max-width : 1000px) {
    .visibledevice {display:block;}
    .visibledesktop {display:none;}
}

body {
font-family: 'Source Sans Pro';
background: url("../img/cpr.jpg") no-repeat fixed top;
background-size: cover;
background-position: 50% calc(50% - 70px);
position: absolute;
width: 100%;
height: 100%;
min-width: 320px;
-webkit-appearance: none !important;
	}
	
 .wrapperbig {
overflow-x: hidden !important;	 
	 }	
	
.classbody {
width: 75vw;
min-width: 1353px;
margin: 5vw auto;	
	}	
	
.navbar-default {
  background-color: rgba(64, 75, 97, 0.9);
  border: 0px;
  padding: 0;
  margin: -8px 0 0 -10px;
  transition: all 0.3s;
  width: 100%;
  position: fixed;
  height: 70px;
  z-index: 1000;
}
.logo {
	transition: transform .3s;
}

.navbar-zoom {
	transition: transform .2s;
}

.strich {
width: 35px;
height:5px;
background-color: #fff;
margin: 6px 0;	
	}

#menubutton {
	border: 3px solid #fff;
	border-radius: 10px;
position: absolute;
top: 6px;
right: 30px;
width: 70px;
height: 50px;
padding: 7px 0 0 30px;
transtion: all 0.4s;
	-webkit-appearance: none;
	}
	
#menubutton:hover {
border-color: #808080;
cursor: pointer;
	}	
	
#mobilemenu {	

background: rgba(0,0,0,0.7);
height: 80vh;
transition: all 1s;
display: none;
	}
	
.phonemenu {
color: #fff;
list-style: none;
width: 80vw;
height: 7vh;
margin: -10px 0 20px 0;
text-align: center;
border: 1px solid #f57f17;
border-radius: 10px;
	}	


.phonemenu a {
display: inline-block;
padding-top: 2vh;
width: 100%;
height: 100%;	
text-decoration: none;
color: #fff;
text-transform: uppercase;

	}


.navbar-zoom:hover {
	-ms-transform: scale(1.1); /* IE 9 */
    -webkit-transform: scale(1.1); /* Safari 3-8 */
    transform: scale(1.1); 
}

.mobileelement {
display:none;	
	}

 .sehtestinfo {
 display: none;
 color: rgba(128, 128, 128, 0.7);
 cursor: pointer;
width: 170px;
margin: 2px auto -10px auto;
 } 

  .sehtestinfo:hover {
 color: rgba(128, 128, 128, 0.9);
 } 

.step-bar .line {
  background-color: #dcdcdc;
  width: 120px;
  height: 5px;
  position: absolute;
  top: 16px;
  right :57px;
  z-index: 0;
}

@media (min-width: 1001px) and (max-width: 1400px){

 .wrapperbig {
overflow-x: hidden !important;	 
	 }

body {
overflow-x: hidden !important;
background-position: 50% 50% !important;
	}	
	
.classbody {
margin: 6vw 5vw !important;	
	}
	
.navbar-zoom a {
font-size: 1vw !important;
margin: 0 -7px 0 -7px !important;
padding: 0 0 0 0 !important;	
	}

.navbar-right {
margin-left: 20vw !important;	
	}	
	
.class {
min-width: 90vw !important;
margin-left: 3vw !important;	
	}
	
.anmeldungright {
min-width: 0 !important;
width: calc(85vw - 450px) !important;
	}		
	
	.navbar-default {
		background: rgba(64, 75, 97, 0.9);
	}
	
.container {
min-width: 0 !important;	
	}	
	
	.infoclass {
font-size: calc(0.5em + 1.2vw) !important;		
		}	

.infotext {
font-size: calc(0.1em + 1.2vw) !important;
max-width: 25vw !important;
margin: 0 3vw 0 1vw;
	}	
	
.footer {
font-size: calc(0.2em + 0.7vw) !important;
line-height: 1.7 !important;
margin: 5px 0 0 -3vw !important;
width: 22vw !important;	
	}		
		
}

@media (min-width: 801px) and (max-width: 1000px){

.wrapperbig {
overflow-X: hidden !important;	
	}

body {
background-position: 50% 50% !important;
overflow-X: hidden !important;		
	}

.anmeldungright {
width: calc(95vw - 450px) !important;
	}		
	
.infotext {
font-size: calc(0.3em + 1.2vw) !important;
width: 97% !important;
margin: 0 0 0 1vw !important;
line-height: 1.1 !important;
	}	
	
.footer {
font-size: calc(0.4em + 0.7vw) !important;
margin: 10px 0 0 -2vw !important;
width: 97% !important;
line-height: 1.3 !important;
	}		
	 }


.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover {
  color: #002F2F;
}

.top-nav-collapse {
  padding: 0;
  background: rgba(64, 75, 97, 0.9);
}

.logo-dec {
  color: #f57f17;
}

.navbar-default .navbar-brand {
  color: #fff;
  font-family: 'Raleway', sans-serif;
  font-weight: 700;
}

.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
  color: #fff;
}

.navbar-brand {
  font-size: 24px;
  text-transform: uppercase;
  padding: 10px 0px;
  margin-top: 6px;
}

.navbar-default .navbar-nav>li>a {
  padding: 2px 5px;
  font-size: 14px;
  line-height: 54px;
  font-weight: 400;
  text-transform: uppercase;
  background: transparent;
  color: #fff;
  -webkit-transition: color 0.2s ease-out;
  transition: color 0.2s ease-out;
  text-shadow: 2px 2px 2px black;
  text-decoration: none;
  display: inline-block;
}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
  color: #f57f17;
  background-color: transparent;
}

.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
  background-color: transparent;
  color: #f57f17;
}



.classbody {
margin-top: 6%;	
	}

.anmeldungleft {
display: inline-block;	
vertical-align: top;
width: 25%;
min-width: 450px;
max-width: 450px;
min-height: 635px;	
height: 80%;
border: 2px solid orange;
	}
	
.anmeldungright {
display: inline-block;		
vertical-align: top;
width: calc(99% - 450px);
background: rgba(255,255,255, 0.9);
min-height: 520px;
height: 665px;
	}		

.infoboxes {
width: 100%;
margin: 20px 0 0 0;
}

.infoboxes div {
display: inline-block;
	}	


.clearfix:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  height: 0;
}

.form_wrapper {
  background: rgba(255,255,255, 0.9);
  width: 450px;
  max-width: 450px;
  height: 60%;
  min-height: 665px;
  /* box-sizing: border-box; 
  padding: 6% 10% 10% 10%; */
  z-index: 1;
  border-top: 5px solid #f57f17;
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
  -webkit-transform-origin: 50% 0%;
  transform-origin: 50% 0%;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  -webkit-transition: none;
  transition: none;
  -webkit-animation: expand 0.8s 0.6s ease-out forwards;
  animation: expand 0.8s 0.6s ease-out forwards;
  opacity: 0;
}

.form_wrapper h2 {
font-family: arial, sans-serif;
  font-size: 125%;
  line-height: 1.3em;
  margin: 0;
}
.form_wrapper .title_container {
  text-align: center;
}
.title_container {
margin: 0px 0 0px 0px;
padding: 0 0 8px 0;	
width: 100%;
height: 50px;
background-color: rgba(245, 127, 23, 0.8);
font-family: 'Source Sans Pro';
font-size: 25px;
color: #fff;
text-shadow: 1px 1px 2px #404040;
border-bottom: 1px solid #000;	
	}
	
.form_container {
height: 600px;
width: 100%;
max-width: 450px;
	}
	
.title_container {
width: 100%;
margin: 0 auto; 
  }   

/*.data-insertion {
width: 80%;
	}		*/
	
.data-insertion form {

width: 85%;
text-align: left;
margin: 0 auto;
}

  
.form_wrapper h3 {
  font-size: 1.1em;
  font-weight: normal;
  line-height: 1.5em;
  margin: 0;
}
.form_wrapper label {
  font-size: 13px
}

.form_wrapper .row {
  margin: 0;
  width: 100%;
}


.validation1, .validation2, .validation6 {
margin-top: -5px !important;	
	}
	
.validation4 {
margin-top: -15px !important;
margin-left: 3em;	
	}	

.col_half {	
display: inline-block;
width: 48%;
margin-right: 3%;
	}

.col_half2 {
display: inline-block;
width: 48%;  
}		

.row .clearfix {
text-align: center;

}

.form_wrapper .row > div {
  padding: 0;
  box-sizing: border-box;
}


.form_wrapper .input_field {
  margin: 25px 0 10px 0;
  -webkit-animation: bounce 0.6s ease-out;
  animation: bounce 0.6s ease-out;
}

.form_wrapper .input_field:nth-of-type(1) {
  margin: 10px 0 12px 0;
}

.form_wrapper .input_field:nth-of-type(2), .form_wrapper .input_field:nth-of-type(3) {
  margin: 15px 0 -10px 0;
}

.form_wrapper .input_field:nth-of-type(4) {
margin: 25px 0 -10px 0;

}

.form_wrapper .input_field > span > i {
  padding-top: 10px;
}

.input_field > input {
font-size: 16px;    
    
}

.form_wrapper input[type="text"], .form_wrapper input[type="email"], .form_wrapper input[type="date"] {
  width: 100%;
  padding: 3px 0 0 5px;
  height: 35px;
  border: 1px solid #cccccc;
  box-sizing: border-box;
  outline: none;
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  transition: all 0.30s ease-in-out;
}

.form_wrapper input[type="email"] {
width: 100% !important;
margin: 0 auto;
	}

.form_wrapper input[type="text"]:hover, .form_wrapper input[type="email"]:hover, .form_wrapper input[type="date"]:hover {
  background: #fafafa;
}
.form_wrapper input[type="text"]:focus, .form_wrapper input[type="email"]:focus, .form_wrapper input[type="date"]:focus {
  -webkit-box-shadow: 0 0 2px 1px rgba(255, 169, 0, 0.5);
  -moz-box-shadow: 0 0 2px 1px rgba(255, 169, 0, 0.5);
  box-shadow: 0 0 2px 1px rgba(255, 169, 0, 0.5);
  border: 1px solid #f57f17;
  background: #fafafa;
}
.button {
  background-color: #f57f17;
  height: 35px;
  line-height: 35px;
  width: 100%;
  position: relative;
text-align: center;
  border: none;
  outline: none;
  cursor: pointer;
  color: #fff;
  font-size: 1.1em;
  margin: 10px 0 10px 0;
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  transition: all 0.30s ease-in-out;
  z-index: 2;
	-webkit-appearance: none;
}

.smallbutton {
 background-color: #f57f17;
  position: relative;
text-align: center;
padding: 10px;
  border: none;
  border-radius: 4px;
  outline: none;
  cursor: pointer;
  color: #fff;
  font-size: 1em;
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  transition: all 0.30s ease-in-out;
  z-index: 2;
  -webkit-appearance: none;
}

.smallbutton:hover {
 background-color: #c46512;

}

.mobilebutton:nth-of-type(1) {
  width: 60%;
  border-radius: 8px;
  background-color: rgba(64, 75, 97, 0.9);
  font-size: 1em;
  padding: 0;
  line-height: 1.1;
	color: #fff;

}

.mobilebutton:nth-of-type(2) {
  width: 30%;
  border-radius: 8px;
  background-color: rgba(64, 75, 97, 0.9);
  font-size: 1em;
  padding: 0;
  line-height: 1.1;
	color: #fff;

}

.mobilebutton:nth-of-type(1) {

margin : 0 0 0 0;  
}

.step-bar .line {
  right :60px !important;
}

.secondNext, .firstBack {
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 3px 10px 0 rgba(0,0,0,0.19) !important;	
	}

.secondNext:hover, .firstBack:hover {
box-shadow: 0 6px 8px 0 rgba(0,0,0,0.28), 0 9px 25px 0 rgba(0,0,0,0.19) !important;	
	}

.firstNext:hover, .secondNext:hover {
  background: #c46008;
  box-shadow: 1px 1px 4px #000;
}
.firstNext:focus, .secondNext:hover {
  background: #c46008;
  box-shadow: 1px 1px 4px #000;
}
.form_wrapper input[type="checkbox"], .form_wrapper input[type="radio"] {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.form_container .row .col_half.last {
  border-left: 1px solid #cccccc;
}

#phpmysqlresult {
z-index: 0;
display:none;	
	}

.checkbox_option label {
  margin-right: 0;
  position: relative;
}
.checkbox_option label:before {
  content: "";
  display: inline-block;
  width: 0.5em;
  height: 0.5em;
  margin-right: 0.5em;
  vertical-align: -2px;
  border: 2px solid #cccccc;
  padding: 0.12em;
  background-color: transparent;
  background-clip: content-box;
  transition: all 0.2s ease;
  zoom: 1.3;
}
.checkbox_option label:after {
  border-right: 2px solid #000000;
  border-top: 2px solid #000000;
  content: "";
  height: 20px;
  left: 2px;
  position: absolute;
  top: 7px;
  transform: scaleX(-1) rotate(135deg);
  transform-origin: left top;
  width: 7px;
  display: none;
  zoom: 1.3;
}
.checkbox_option input:hover + label:before {
  border-color: #000000;
}
.checkbox_option input:checked + label:before {
  border-color: #000000;
}
.checkbox_option input:checked + label:after {
  -moz-animation: check 0.8s ease 0s running;
  -webkit-animation: check 0.8s ease 0s running;
  animation: check 0.8s ease 0s running;
  display: block;
  width: 7px;
  height: 20px;
  border-color: #000000;
}

.radio_option label {
  margin-right: 0em;
}
/* .radio_option label:before {
  content: "";
  display: inline-block;
  width: 0.6em;
  height: 0.6em;
  margin: 0 0.2em 0 2.5em;
  border-radius: 100%;
  vertical-align: -6px;
  border: 2px solid #cccccc;
  padding: 0.50em;
  background-color: transparent;
  background-clip: content-box;
  transition: all 0.2s ease;    
} 
.radio_option input:hover + label:before {
  border-color: #000000;
}
.radio_option input:checked + label:before {
  background-color: #000000;
  border-color: #000000;
}
*/

.datum, .datum2 { 
font-size: 1.1em;
display: inline-block;
}

.datum {	
margin: 0em 1.5em 0em 0;	
	}

 .datum2 {

 margin-right: 6%; 
 } 

 .sexfield label {
    border: 1px solid #f57f17;
    display: inline-block;
    padding: 0px 13% 0px 13%;
    position: relative;
    text-align: center;
    transition: background 600ms ease, color 600ms ease;
    font-size: 1.35em;
 } 
	
 .sexfield label:nth-of-type(1) {
 border-radius: 15px 0px 0px 15px;
 }

  .sexfield label:nth-of-type(2) {
 border-radius: 0px 15px 15px 0px; 
}


.sexfield input[type="radio"].toggle {
   display: none;
}
 .sexfield input[type="radio"].toggle + label {
   cursor: pointer;

}
 .sexfield input[type="radio"]:hover {
   background: none;
   color: #1a1a1a;
}


 .sexfield input[type="radio"]:checked + label:after {
   background: rgba(245,127,23, 0.7) !important;
   content: "";
   height: 100%;
   position: absolute;
   top: 0;
   transition: left 200ms cubic-bezier(0.77, 0, 0.175, 1);
   width: 100%;
   z-index: -5;
}

.sexfield input[type="radio"].toggle + label {
background: transparent;
 }

 .sexfield input[type="radio"]:hover + label:hover {
background: rgba(245,127,23, 0.2);
color: #404040;
 }

 .sexfield input[type="radio"].toggle.toggle-left + label {
   border-right: 0;
}
 .sexfield input[type="radio"].toggle.toggle-left + label:after {
   left: 100%;
  border-radius: 15px 0px 0px 15px;  
}
 .sexfield input[type="radio"].toggle.toggle-right + label {
   margin-left: -4px;
}
 .sexfield input[type="radio"].toggle.toggle-right + label:after {
   left: -100%;
border-radius: 0 15px 15px 0;  
   
}
 .sexfield input[type="radio"].toggle:checked + label {
   cursor: default;
   color: #fff;
text-shadow: 1px 1px 2px #404040; 
transition: color 200ms;
}
 .sexfield input[type="radio"].toggle:checked + label:after {
   left: 0;
   background: transparent;
}


  .datumfield {
margin-top: -15px;  
  }	

.input_field .radio_option .sexfield {
width: 100%;
	}

.select_option select {
  display: inline-block;
  margin: 25px 0 0 0;
  width: 100%;
  height: 35px;
  padding: 0px 14px;
  cursor: pointer;
  color: #7b7b7b;
  border: 1px solid #cccccc;
  border-radius: 0;
  background: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  transition: all 0.2s ease;
}

.select_option_tag select {   
  margin: 0 1% 10px 1%;    
  width: 24%;
  height: 35px;
  padding: 0 0 0 0;
  cursor: pointer;
   color: #000000;
  border: 1px solid #cccccc;
  border-radius: 0;
  background: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  transition: all 0.2s ease;
  z-index: 10;
}

.select_option select::-ms-expand, .select_option_tag select::-ms-expand {
  display: none;
}
.select_option select:hover, .select_option select:focus, .select_option_tag select:hover, .select_option_tag select:focus  {
  color: #000000;
  background: #fafafa;
  border-color: #f57f17;
  outline: none;
}


.select_arrow1 {
  position: relative;
  display: inline-block;
  margin: 0 5px 0 -20px !important;
  pointer-events: none;
  border-width: 8px 5px 0 5px;
  border-style: solid;
  border-color: #7b7b7b transparent transparent transparent;
}

select {
font-size: 15px;  
width: 100%;    
padding: 0 0 0 0;
}

.select_arrow2 {
  position: relative;
  display: inline-block;
  margin: 0 8px 0 -23px;
  pointer-events: none;
  border-width: 8px 5px 0 5px;
  border-style: solid;
  border-color: #7b7b7b transparent transparent transparent;
}

.select_arrow3 {
  position: relative;
  display: inline-block;
  margin: 0 0 0 -23px;
  pointer-events: none;
  border-width: 8px 5px 0 5px;
  border-style: solid;
  border-color: #7b7b7b transparent transparent transparent;
}

.select_option_tag select:hover + .select_arrow1, .select_option_tag select:focus + .select_arrow1 {
  border-top-color: #000000;
}

.select_option_tag select:hover + .select_arrow2, .select_option select:focus + .select_arrow2 {
  border-top-color: #000000;
}

.select_option select:hover + .select_arrow3, .select_option select:focus + .select_arrow3 {
  border-top-color: #000000;
}
.select_option_tag select:hover + .select_arrow, .select_option_tag select:focus + .select_arrow {
  border-top-color: #000000;
}

.credit {
display: inline-block;    
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 15px;
  color: #f57f17;
}
.credit a {
  color: #f57f17;
}


.sehtestfield label {
    border: 1px solid #f57f17;
    display: inline-block;
    padding: 8px 8% 12px 8%;
    position: relative;
    text-align: center;
    transition: background 600ms ease, color 600ms ease;
    font-size: 1.35em;
 } 
  
 .sehtestfield label:nth-of-type(1) {
 border-radius: 15px 0px 0px 15px;
 }

  .sehtestfield label:nth-of-type(2) {
 border-radius: 0px 15px 15px 0px; 
}


.sehtestfield input[type="radio"].toggle {
   display: none;
}
 .setestfield input[type="radio"].toggle + label {
   cursor: pointer;

}
 .sehtestfield input[type="radio"]:hover {
   background: none;
   color: #1a1a1a;
}


 .sehtestfield input[type="radio"]:nth-of-type(1):checked + label:after {
   background: rgba(0,128,0, 0.7) !important;
   content: "";
   height: 100%;
   position: absolute;
   top: 0;
   transition: left 200ms cubic-bezier(0.77, 0, 0.175, 1);
   width: 100%;
   z-index: -5;
}

 .sehtestfield input[type="radio"]:nth-of-type(2):checked + label:after {
   background: rgba(245,0,0, 0.7) !important;
   content: "";
   height: 100%;
   position: absolute;
   top: 0;
   transition: left 200ms cubic-bezier(0.77, 0, 0.175, 1);
   width: 100%;
   z-index: -5;
}

.sehtestfield input[type="radio"].toggle + label {
background: transparent;
 }

 .sehtestfield input[type="radio"]:nth-of-type(1):hover + label:hover {
background: rgba(0,128,0, 0.2);
cursor: pointer;
 }

  .sehtestfield input[type="radio"]:nth-of-type(2):hover + label:hover {
background: rgba(255,0,0, 0.2);
cursor: pointer;
 }

 .sehtestfield input[type="radio"].toggle.toggle-left + label {
   border-right: 0;
}
 .sehtestfield input[type="radio"].toggle.toggle-left + label:after {
   left: 100%;
  border-radius: 15px 0px 0px 15px;  
}

 .sehtestfield input[type="radio"].toggle.toggle-right + label {
   margin-left: -4px;
}
 .sehtestfield input[type="radio"].toggle.toggle-right + label:after {
   left: -100%;
border-radius: 0 15px 15px 0;  
   
}

 .sehtestfield input[type="radio"].toggle:checked + label {
   cursor: default;
   color: #fff;
text-shadow: 1px 1px 2px #404040; 
transition: color 200ms;
}
 .sehtestfield input[type="radio"].toggle:checked + label:after {
   left: 0;
   background: transparent;
}

#sehtestpreis {
line-height: 1.0;
color: #808080; 
font-size: 0.8em; 
margin: -16px 0 0 70px;
display: block;
}


@-webkit-keyframes check {
  0% {
    height: 0;
    width: 0;
  }
  25% {
    height: 0;
    width: 7px;
  }
  50% {
    height: 20px;
    width: 7px;
  }
}
@keyframes check {
  0% {
    height: 0;
    width: 0;
  }
  25% {
    height: 0;
    width: 7px;
  }
  50% {
    height: 20px;
    width: 7px;
  }
}
@-webkit-keyframes expand {
  0% {
    -webkit-transform: scale3d(1, 0, 1);
    opacity: 0;
  }
  25% {
    -webkit-transform: scale3d(1, 1.2, 1);
  }
  50% {
    -webkit-transform: scale3d(1, 0.85, 1);
  }
  75% {
    -webkit-transform: scale3d(1, 1.05, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    opacity: 1;
  }
}
@keyframes expand {
  0% {
    -webkit-transform: scale3d(1, 0, 1);
    transform: scale3d(1, 0, 1);
    opacity: 0;
  }
  25% {
    -webkit-transform: scale3d(1, 1.2, 1);
    transform: scale3d(1, 1.2, 1);
  }
  50% {
    -webkit-transform: scale3d(1, 0.85, 1);
    transform: scale3d(1, 0.85, 1);
  }
  75% {
    -webkit-transform: scale3d(1, 1.05, 1);
    transform: scale3d(1, 1.05, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    opacity: 1;
  }
}
@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translate3d(0, -25px, 0);
    opacity: 0;
  }
  25% {
    -webkit-transform: translate3d(0, 10px, 0);
  }
  50% {
    -webkit-transform: translate3d(0, -6px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 2px, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes bounce {
  0% {
    -webkit-transform: translate3d(0, -25px, 0);
    transform: translate3d(0, -25px, 0);
    opacity: 0;
  }
  25% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  50% {
    -webkit-transform: translate3d(0, -6px, 0);
    transform: translate3d(0, -6px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 2px, 0);
    transform: translate3d(0, 2px, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }




}

@media (min-width: 451px) and (max-width: 800px) {
	
 .wrapperbig {
overflow-x: hidden !important;	 
	 }

body {
overflow-x: hidden !important;
background-position: 50% 50% !important;
	}	
	
.classbody {
width: 100vw !important;
max-width: 450px !important;
min-width: 350px;	
	}	

.anmeldungleft {
display: block !important;
margin: 70px auto !important;
min-height: 575px !important;	
height: 575px !important;	
	}
	
.form_wrapper {
min-height: 575px !important;	
height: 575px !important;	
	}	
	
.anmeldungright {
display: block !important;
margin: 70px auto !important;
width: 450px;
height: 1400px !important;
	}
	
.infotext {
font-size: calc(0.6em + 1.2vw) !important;
width: 92% !important;
margin: 0 0 0 4vw !important;
line-height: 1.2 !important;
	}	
	
.footer {
font-size: calc(0.7em + 0.7vw) !important;
margin: 30px 0 0 0 !important;
width: 93% !important;
line-height: 1.7 !important;
	}	
	
.mobileelement {
display:block !important;	
margin: 3px 0 0 0;
font-size: 0.9em;
	}	

.mobilebutton:nth-of-type(1) {
  width: 60%;
  border-radius: 4px;
  background-color: rgba(64, 75, 97, 0.9);
  font-size: 1em;
  padding: 0;
  line-height: 1.3;
    color: #fff;
    margin: 0 5% 0 2%;

}

.mobilebutton:nth-of-type(2) {
  width: 30%;
  border-radius: 4px;
  background-color: rgba(64, 75, 97, 0.9);
  font-size: 1em;
  padding: 0;
  line-height: 1.3;
    color: #fff;
}  
	

.form_wrapper .input_field:nth-of-type(1) {
margin: 5px 0 10px 0 !important;
}

.form_wrapper .input_field:nth-of-type(3) {
margin: 5px 0 -10px 0 !important;
}
	
.form_wrapper .input_field:nth-of-type(4) {
margin: 17px 0 0px 0 !important;
}
	
.form_wrapper .input_field:nth-of-type(5) {
margin: 10px 0 -10px 0 !important;
}

.form_wrapper .input_field:nth-of-type(7) {
margin: 5px 0 0px 0 !important;
}

.form_wrapper .input_field:nth-of-type(8) {
 margin: 5px 0 0px 0 !important; 
}

.form_wrapper .input_field:nth-of-type(9) {
 margin: 10px 0 0px 0 !important; 
}
	
.step-bar {
margin: -110px 0 0 0;
	}
	
.questions {
display: none !important;	
	}

.failure {
width: 90% !important;
}	

.termintable tbody tr td:nth-of-type(1) {
max-width: 50px;
}


.termintable tbody tr td:nth-of-type(2) {
min-width: 100px;
}	

 .freeseats, .nofreeseats, .lowfreeseats, .toolate, .kursvorbei {
width: calc(60px + 8vw) !important;
  } 			
	}

@media (min-width: 361px) and (max-width: 450px) {
	
	
  .form_wrapper .col_half {
    width: 85%;
  }
  
 #menubutton {
top: 8px;
right: 15px;
width: 40px;
height: 30px;
padding: 5px 15px 14px 20px;	
	} 
	
.logo {
margin: 2px 0 0 10px;	
	}	
  
  .col_half2 {
margin: 0 0 0 0 !important;	  
	  }

 .wrapperbig {
overflow-x: hidden !important;	 
min-width: 300px !important;
	 }

body {
overflow-x: hidden !important;
background-position: 50% 50% !important;
min-width: 300px !important;
width: 95vw !important;
	}	
	
.classbody {
width: 100% !important;
max-width: 450px !important;
min-width: 300px !important;		
	}

.form_wrapper {
width: 93% !important;
max-width: 450px !important;
min-width: 300px !important;	
	}	
	
.title_container {	
font-size: 1.4em;
height: 45px;
width: 100%;	
	}


.mobileelement2 {display:none;}
	
.mobileelement2 div:nth-of-type(1) {
font-size: 16px !important;
margin: -20px 0 0 2%;
cursor: pointer; 
text-decoration: underline; 
width: 170px; 
padding: 20px 0 10px 0;
	}	

.mobileelement2 div:nth-of-type(2) {
font-size: 16px !important;
margin: -50px 5% 0 0 !important;
float: right; 
cursor: pointer; 
text-decoration: underline; 
width: 200px; 
text-align: right; 
padding: 20px 0 10px 0;
}	
			

.anmeldungleft {
width: 100% !important;
max-width: 450px !important;
min-width: 300px !important;	
margin: 12% auto !important;
min-height: 670px !important;	
height: 670px !important;	
border: 0px !important;
	}
	
.form_wrapper {
width: 100% !important;
max-width: 450px !important;
min-width: 300px !important;	
min-height: 670px !important;	
height: 670px !important;	
	}	
	
.anmeldungright {
display: block !important;
margin: 0 auto !important;
width: 100%;
height: 1000px !important;
float: left !important;
	}
	
.step-bar ul{
 margin: -25px 0 0 0px !important;
}
	
.maps {
width: 95% !important;
margin-left: 0 !important;
	}	
	
.infotext {
font-size: calc(0.6em + 1.2vw) !important;
width: 92% !important;
margin: 0 0 0 4vw !important;
line-height: 1.2 !important;
	}	
	
.footer {
font-size: calc(0.7em + 0.7vw) !important;
margin: 30px 0 0 0 !important;
width: 93% !important;
line-height: 1.7 !important;
	}	
	
.mobileelement {
display:block !important;	
margin: 10px auto;
text-align: center;
	}	
	
.mobileelement div:nth-of-type(1) {
margin: -75px 0 0 5%;
cursor: pointer; 
text-decoration: underline; 
width: 200px; 
padding: 20px 0 10px 0;
	}	

.mobileelement div:nth-of-type(2) {
margin: -49px 5% 0 0;
float: right; 
cursor: pointer; 
text-decoration: underline; 
width: 200px; 
text-align: right; 
padding: 20px 0 10px 0;
}
	
.form_wrapper .row {
margin: 0px auto 0 auto;
width: 100%;
	}	
	
.row .clearfix div {
margin: 0 auto !important;
width: 100%;
	}

  .sexfield label {
    padding: 6px 10% 6px 10% !important;
 } 
			
	.form_wrapper .input_field:nth-of-type(1) {
margin: 5px 0 5px 0 !important;
}

  .form_wrapper .input_field:nth-of-type(2) {
margin: -10px 0 0 0 !important;
}

.form_wrapper .input_field:nth-of-type(3) {
margin: 10px 0 0px 0 !important;
font-size: 0.95em;
width: 100%;
}
  
.form_wrapper .input_field:nth-of-type(4) {
margin: 15px 0 0px 0 !important;
}
  
.form_wrapper .input_field:nth-of-type(5) {
margin: 10px 0 -10px 0 !important;
text-align: center;
}

.form_wrapper .input_field:nth-of-type(7) {
margin: 5px 0 0px 0 !important;
}

.form_wrapper .input_field:nth-of-type(8) {
 margin: 5px 0 0px 0 !important; 
}

.form_wrapper .input_field:nth-of-type(9) {
 margin: 10px 0 0px 0 !important; 
}
	
.select_option_tag select {   
  margin: 0 0.1% 10px 0.1%; 

}


.sehtestfield label {
    padding: 8px 2.9% 12px 2.9% !important;
    text-align: center;
}	
	
#sehtestpreis {
margin: -15px 150px 0 0 !important;

}

.form_wrapper .input_field {
  margin-bottom: 12px;
}	



.checkbox_option label {
font-size: 0.73em;
max-width: 300px !important;
margin: 0 0 0 0; 
}	

	
.step-bar {
bottom: 5.5em !important;
left: 0;
	}	
	

.mobileelement div:nth-of-type(1) {
margin: -85px 0 0 5%;
cursor: pointer; 
text-decoration: underline; 
width: 180px; 
padding: 20px 0 10px 0;
	}	

.mobileelement div:nth-of-type(2) {
margin: -50px 10% 0 0;
float: right; 
cursor: pointer; 
text-decoration: underline; 
width: 150px; 
text-align: right; 
padding: 20px 0 10px 0;
} 

.confirmation table {
font-size: 0.9em;
line-height: 1.1 !important;	
	}

.confirmation table tr th:first-child {
width: 43% !important;	
	}

.loading {
width: 100% !important;
	}
	
.container3 {

  margin: 60px 7% 30px 1% !important;
  width: calc(100% - 40px);
  font-size: 16px;
  line-height: 1.4 !important;
}

.loadingtext {
background-color: #f57f17;	
font-weight: bold;
	position: absolute;
width: 280px;
left: -15%;
color: #fff !important;
z-index: 1000;
opacity: 1;	
	}

.mailsent {	
width: 95% !important;
margin: 0 0 0 -45px;	
	}
	
.mailsent div:nth-of-type(2) {	
margin-top: -15px !important;
	}	

.success div:nth-of-type(2) {
margin-top: -5px !important;
	}	

.success div:nth-of-type(4) {
margin-top: -35px !important;
	}	

.questions {
display: none !important;	
	}

.failure {
width: 90% !important;
}

.termintable thead tr th {
font-size: 1em !important;
}		
.termintable tbody tr td:nth-of-type(1) {
font-size: 0.9em !important;
max-width: 50px
}	
	

}


@media (min-width: 1px) and (max-width: 360px) {
	
	
  .form_wrapper .col_half {
    width: 85%;
  }
  
 #menubutton {
top: 8px;
right: 15px;
width: 40px;
height: 30px;
padding: 5px 15px 14px 20px;	
	} 
	
.logo {
margin: 2px 0 0 10px;	
	}	
  
  .col_half2 {
margin: 0 0 0 0 !important;	  
	  }

 .wrapperbig {
overflow-x: hidden !important;	 
min-width: 300px !important;
	 }

body {
overflow-x: hidden !important;
background-position: 50% 50% !important;
min-width: 300px !important;
width: 95vw !important;
	}	
	
.classbody {
width: 100% !important;
max-width: 450px !important;
min-width: 300px !important;		
	}

.form_wrapper {
width: 100% !important;
max-width: 450px !important;
min-width: 300px !important;	
	}	
	
.title_container {	
padding-top: 0;
font-size: calc(0.8em + 1.2vw);
height: 40px;
width: 100%;	
	}

 .data-insertion form {
    width: 95%;
    text-align: left;
    margin: 0 auto;
} 
		

.anmeldungleft {
display: block !important;
width: 100% !important;
max-width: 450px !important;
min-width: 300px !important;	
margin: 70px auto !important;
min-height: 680px !important;	
height: 680px !important;	
border: 0px !important;
	}
	
.form_wrapper {
width: 100% !important;
max-width: 450px !important;
min-width: 300px !important;	
min-height: 680px !important;	
height: 680px !important;	
	}	
	
.anmeldungright {
display: block !important;
margin: 70px auto !important;
width: 100%;
height: 1000px !important;
	}
	
.infotext {
font-size: calc(0.6em + 1.2vw) !important;
width: 92% !important;
margin: 0 0 0 4vw !important;
line-height: 1.2 !important;
	}	
	
.footer {
font-size: calc(0.7em + 0.7vw) !important;
margin: 30px 0 0 0 !important;
width: 93% !important;
line-height: 1.7 !important;
	}	
	
.mobileelement {
display:block !important;	
margin: 70px -15px 0 -10px;
	}	
	
.mobileelement div:nth-of-type(1) {
margin: -75px 0 0 5%;
cursor: pointer; 
text-decoration: underline; 
width: 200px; 
padding: 20px 0 10px 0;
	}	

.mobileelement div:nth-of-type(2) {
margin: -49px 5% 0 0;
float: right; 
cursor: pointer; 
text-decoration: underline; 
width: 200px; 
text-align: right; 
padding: 20px 0 10px 0;
}
	
.form_wrapper .row {
margin: 0px auto 10px auto !important;
width: 95%;
	}	
	
.row .clearfix div {
margin: 4px 0 0 0 !important;
width: 100%;
	}
			
		
.datum {
font-size: 0.8em !important;
text-align: center;
margin: 37px 0px 0px 0;	
	}

.anrede {
display: none;

}

.datum2 {
font-size: 0.8em !important;
width: 10%;
text-align: center;
margin: 29px -18px 2px 15px !important;	
	}

#tag {
margin-left: 20% !important;	
	}	
	
.form_wrapper input[type="email"] {
margin-top: 7px;
width: 85% !important;
margin-left: 8%;
	}
	
.form_wrapper .input_field {
  margin-bottom: 12px;
}	

.checkbox_option label {
font-size: 0.73em;
max-width: 300px !important;
margin: 0 0 0 3%; 
}	

.button {
margin-left: 4.5vw;	
	}
	
.step-bar {
margin: 25px 0 0 35px;
	}	
	
.step-bar ul {
margin-left: -80px !important;	
	}			

.mobileelement div:nth-of-type(1) {
margin: -85px 0 0 5%;
cursor: pointer; 
text-decoration: underline; 
width: 180px; 
padding: 20px 0 10px 0;
	}	

.mobileelement div:nth-of-type(2) {
margin: -49px 10% 0 0;
float: right; 
cursor: pointer; 
text-decoration: underline; 
width: 110px; 
text-align: right; 
padding: 20px 0 10px 0;
}

.confirmation table {
font-size: 0.9em;
line-height: 1.1 !important;	
	}

.confirmation table tr th:first-child {
width: 43% !important;	
	}

.loading {
width: 100% !important;
	}
	
.container3 {

  margin: 60px 7% 30px 1% !important;
  width: calc(100% - 40px);
  font-size: 16px;
  line-height: 1.4 !important;
}

.loadingtext {
background-color: #f57f17;	
font-weight: bold;
	position: absolute;
width: 280px;
left: -15%;
color: #fff !important;
z-index: 1000;
opacity: 1;	
	}

.mailsent {	
width: 95% !important;
margin: 0 0 0 -45px;	
	}
	
.mailsent div:nth-of-type(2) {	
margin-top: -15px !important;
font-size: 0.9em !important;
	}
	
.mailsent div:nth-of-type(3), .mailsent div:nth-of-type(4) {	
font-size: 0.8em !important;
	}	
	
.mailsent h2 {	
font-size: 1em !important;
	}
	
.questions {
display: none !important;	
	}

.failure {
width: 90% !important;
}	

  .sexfield label {
    padding: 6px 10% 6px 10% !important;
 } 
      
  .form_wrapper .input_field:nth-of-type(1) {
text-align: center;
margin: 5px 0 5px 0 !important;
}

  .form_wrapper .input_field:nth-of-type(2) {
margin: -10px 0 0 0 !important;
}

.form_wrapper .input_field:nth-of-type(3) {
margin: -20px 0 -10px 0 !important;
}
  
.form_wrapper .input_field:nth-of-type(4) {
margin: 5px 0 0px 0 !important;
font-size: 0.85em;
}
  
.form_wrapper .input_field:nth-of-type(5) {
margin: 10px 0 -20px 0 !important;
text-align: center;
}

.form_wrapper .input_field:nth-of-type(7) {
margin: 0px 0 0px 0 !important;
}

.form_wrapper .input_field:nth-of-type(8) {
 margin: 5px 0 0px 0 !important; 
}

.form_wrapper .input_field:nth-of-type(9) {
 margin: 10px 0 0px 0 !important; 
}
	
.select_option_tag select {
    margin: 0 0.1% 10px 0.1%;
}


.sehtestfield label {
    padding: 8px 0 12px 0 !important;
    text-align: center;
} 
  
#sehtestpreis {
margin: -15px 150px 0 0 !important;

}	

.kurstitle {
font-size: 1em !important;
}		
}


.confirmation { 
width: 80%;
left: 1600px;
display: none;
opacity: 0;
}

.success {
text-align:center;
width: 100%;
margin: 0 0 0 -45px;	
left: 45px;
	}		

.mailsent {	
text-align:center;
width: 100%;
margin: 0 0 0 -45px;	
left: 1600px;	
display: none;
opacity:0;
	}
	
.failure {
text-align:center;
width: 100%;
margin: 0 0 0 -45px;	
left: 1600px;	
display: none;
opacity:0;
	}	

.confirmation table {
font-family: 'Source Sans Pro';
border-collapse: collapse;
line-height: 1.1; 
	}
	
.confirmation table td, .confirmation table th {
text-align: left;
border: 1px solid black;
padding: 4px 3px 4px 5px;		
	}	
	
.confirmation table tr:nth-child(even) {
background-color: #fde4ce;	
	}	

.confirmation table tr th:first-child {
width: 40%;	
	}	

/* Step Bar */

.data-insertion, .success, .confirmation, .mailsent, .failure {
  transition: 1s all ease-in-out;
  position: absolute;
  display: inline-block;
}


.finish-step, .user-details {
  left: 1400px;
}

.line {
  transition: all 1s ease-in-out;
  background: linear-gradient(to right, #f57f17 50%, white 50%);
  background-size: 200% 100%;
  background-position: right bottom;
}

.line-active {
  background-position: left bottom;
}
.step-bar {	
  text-transform: uppercase;
  color: #484848;
  font-size: 12px;
width: 100%;
}

.datum2 {
    margin-right: 0 !important;
}

.stepbartext {
font-size: 13px; 
    text-align: center;
	margin-left: -5px;
}

.step-bar ul{
 margin: -35px 0 0 0px;
}

.step-bar li{
  display: inline-block;
  position: relative;
  width: 30%; 
}

.step-bar .number{
  transition: background-color 0.1s linear, color 0.1s linear;
  position: relative;
  color: #000;
  background-color: #f5f5f5; 
  width: 38px;
  padding: 10px 0 10px 0px;
  margin: 0 0 4px 34px;
  font-weight: 700;
  z-index: 1;
  border: 1px solid #000;
    border-radius: 100%; 
}
    
.number {
text-align: center;        
            
    }    
.step-bar .line {
  background-color: #dcdcdc;
    width: calc(40px + 60%);
  height: 5px;
  position: absolute;
  top: 16px;
  right :40px;
  z-index: 0;
}

.step-bar .active {
  background-color: #f7933b;
  color: #fff;
}

.secondNext {
margin-top: 25px;
width: 40%; 
float: right;
border-radius: 5px;
border: 1px solid #000;
height: 45px !important;
	}
	
.firstBack {
	height: 45px !important;
margin-top: 25px;
border-radius: 5px;
width: 40%;
 float: left; 
 background: #fff; 
 border: 1px solid #000; 
 color: #000;
 transition: all 0.2s;
	}

.firstBack:hover {
background-color: #fcd6b6;
box-shadow: 1px 1px 4px #000;	
	}	
	

/* END Step-Bar */


.termintable {
border-collapse: collapse;
border: 2px solid #000;
width: 100%;
max-width: 100% !important;
}

.termintable th {
font-size: 1.2em;
background: -moz-linear-gradient(top, #F57F17 0%, #F9A825 66%, #FBC02D 100%);
  background: -webkit-linear-gradient(top, #F57F17 0%, #F9A825 66%, #FBC02D 100%);
  background: linear-gradient(to bottom, #F57F17 0%, #F9A825 66%, #FBC02D 100%);

}

.maps {
height: 60%;
width: 100%;
margin: 0 auto;
	}
	
.infobox {
border:1px solid #000;
border-bottom: 4px solid #000;
border-right: 3px solid #000;
height: 40%;
	}	
	
.infoclass {
font-size: 24px;	
padding: 10px 0 0 0;
text-align: center;
margin: 0 0 -10px 0;
	}	
	
.infotext {
line-height: 1.3;
font-size: 1.1em;	
width: 40%;
margin: 0 2vw 0 2vw;
	}

.infotext a {
font-size: 0.9em;  
}  

.infotext ul, infotext ul li, .footer ul, .footer ul li  {
margin: 0 0 0 0;
padding: 0 0 0 0;	
	}		
	
.tooltip {
cursor: pointer;
display: inline-block;	
	}	
	
.tooltip .tooltiptext {
visibility: hidden;	
position: absolute;
z-index: 1;
border-radius: 12px;
text-align: center;
background-color: #f57f17;
color: #fff;
padding: 4px;
border: 1px solid #000;
margin: -95px 0 0 -3px;
width: 170px;
font-size: 14px;
opacity: 0;
transition: 0.5s;
	}	
	
.tooltip .tooltiptextfragen {
visibility: hidden;	
position: absolute;
z-index: 999;
border-radius: 12px;
text-align: center;
background-color: #f57f17;
color: #fff;
padding: 4px;
border: 1px solid #000;
min-width: 280px;
font-size: 14px;
transition: 0.3s;
opacity: 0
	}		

    .tooltip .bubble1 {
width: 250px;		
margin: -180px 0 0 -240px;		
	}	
	.tooltip .bubble2 {
width: 250px;	
margin: -210px 0 0 -240px;		
	}	
	.tooltip .bubble3 {
width: 250px;		
margin: -85px 0 0 -240px;		
	}	
	.tooltip .bubble4 {
width: 250px;			
margin: -109px 0 0 -240px;
	}	
	.tooltip .bubble5 {
width: 250px;		
margin: -110px 0 0 -240px;		
	}	
	
	.tooltip:hover .tooltiptext {
	visibility: visible;
	opacity: 1;	
		}	
	.tooltip:hover .tooltiptextfragen {
	visibility: visible;
	opacity: 1;	
		}			
		
	.tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%; /* At the bottom of the tooltip */
  right: 90%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

	.tooltip .tooltiptextfragen::after {
  content: " ";
  position: absolute;
  top: 100%; /* At the bottom of the tooltip */
  right: 13%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

.footer {
font-size: 0.9em;
float: right;
line-height: 1.5;
margin: 0 0 0 0;
vertical-align: top;	
width: 45%;
height: 100%;
	}
	
	/* Bootstrap */
	
.navbar-zoom {
display: inline-block;
text-align: center;  line-height: 1.4;
  font-family: 'Candara', sans-serif;
  color: black;
  font-weight: 300;
  letter-spacing: 0.4px;
  margin: 0 20px 0 0;
	}	
	
.navbar-right {
margin: -60px 0 0 25%;
width: 80%	
	}
	
.navbar-header {
width: 15%;;	
	}
	
.container {
width: 69%;
min-width:1252px;
margin: 0 auto;		
	}
	
#checkedvorname {
text-transform: capitalize;	
	}
	
#checkednachname {
text-transform: capitalize;	
	}	

.faquestion {
font-weight: bold;
font-size: 20px;
position: relative;	
margin: 0 auto 30px auto;
width: 80%;	
	}	

.faquestiona {
transition: all 0.1s;
width: auto;
cursor: pointer;
text-decoration: underline;
	}

.faquestiona:hover {
color: #dc6c09;
	}
	
.faqswer {
display:none;
font-family: 'Helvetica Neue Italic';
color: #000;
position: relative;
font-size: 18px;
font-weight: 800;
list-style: none;
padding: 10px 15px 15px 15px;
border: 1px solid #000;
border-radius: 0px 40px 40px 40px;
background-color: rgba(220, 108, 9, 0.9);
width: 60%;	
margin: 0 auto;
transition: all 1s;
left: 0;
	}		
	
/* Loading Bar */	
.loading {
position: absolute;
background-color: rgba(128, 128, 128, 0.6);
width: 450px;
left: 0;
top: 0;
height: 100%;
display: none;	
	}
.container3 {
  margin: 180px 20px 20px 20px;
  width: calc(100% - 40px);
  height: auto;
  font-size: 18px;
  text-align: center;
  line-height: 3.0;
}

.loadingtext {
font-weight: bold;
	position: absolute;
width: 280px;
left: -15%;
color: #000;
z-index: 1000;
opacity: 1;	
	}

.loading-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0);
  transition: background-color .2s ease-out;
}

.loading-anim {
  position: relative;
  width: 200px;
  height: 200px;
  margin: auto;
  perspective: 800px;
  transform-style: preserve-3d;
  transform: translateZ(-100px) rotateY(-90deg) rotateX(90deg) rotateZ(90deg) scale(0.5);
  opacity: 0;
  transition: all .2s ease-out;
}
.loading-anim .circle {
  width: 100%;
  height: 100%;
  animation: spin 5s linear infinite;
}
.loading-anim .border {
  position: absolute;
  border-radius: 50%;
  border: 3px solid #f57f17;
}
.loading-anim .out {
  top: 15%;
  left: 15%;
  width: 70%;
  height: 70%;
  border-left-color: transparent;
  border-right-color: transparent;
  animation: spin 2s linear reverse infinite;
}
.loading-anim .in {
  top: 18%;
  left: 18%;
  width: 64%;
  height: 64%;
  border-top-color: transparent;
  border-bottom-color: transparent;
  animation: spin 2s linear infinite;
}
.loading-anim .mid {
  top: 40%;
  left: 40%;
  width: 20%;
  height: 20%;
  border-left-color: transparent;
  border-right-color: transparent;
  animation: spin 1s linear infinite;
}

.loading .loading-anim {
  transform: translateZ(0) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(1);
  opacity: 1;
}

.loading .loading-overlay {
  background: rgba(255, 255, 255, 0.5);
}

.dot {
  position: absolute;
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #f57f17;
  animation: jitter 5s ease-in-out infinite, fade-in-out 5s linear infinite;
}

.dot:nth-child(1) {
  top: 90px;
  left: 180px;
  animation-delay: 0s;
}

.dot:nth-child(2) {
  top: 135px;
  left: 168px;
  animation-delay: 0.41667s;
}

.dot:nth-child(3) {
  top: 168px;
  left: 135px;
  animation-delay: 0.83333s;
}

.dot:nth-child(4) {
  top: 180px;
  left: 90px;
  animation-delay: 1.25s;
}

.dot:nth-child(5) {
  top: 168px;
  left: 45px;
  animation-delay: 1.66667s;
}

.dot:nth-child(6) {
  top: 135px;
  left: 12px;
  animation-delay: 2.08333s;
}

.dot:nth-child(7) {
  top: 90px;
  left: 0px;
  animation-delay: 2.5s;
}

.dot:nth-child(8) {
  top: 45px;
  left: 12px;
  animation-delay: 2.91667s;
}

.dot:nth-child(9) {
  top: 12px;
  left: 45px;
  animation-delay: 3.33333s;
}

.dot:nth-child(10) {
  top: 0px;
  left: 90px;
  animation-delay: 3.75s;
}

.dot:nth-child(11) {
  top: 12px;
  left: 135px;
  animation-delay: 4.16667s;
}

.dot:nth-child(12) {
  top: 45px;
  left: 168px;
  animation-delay: 4.58333s;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes jitter {
  0% {
    transform: scale(1, 1);
  }
  25% {
    transform: scale(0.7, 0.7);
  }
  50% {
    transform: scale(1, 1);
  }
  75% {
    transform: scale(1.3, 1.3);
  }
  100% {
    transform: scale(1, 1);
  }
}
@keyframes fade-in-out {
  0% {
    opacity: 0.8;
  }
  25% {
    opacity: 0.2;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0.8;
  }
}

.termintable tbody tr td {
height: 50px;
max-height: 50px;
font-size: calc(0.65em + 0.4vw);
}

.termintable tbody tr td:nth-of-type(4) {
min-width: 125px;
}

.termintable, table.termintable th, table.termintable tr {
text-align: center;
color: black;
}

.freeseats {
padding: 0 0 0 0;
font-weight: 500; 
border-radius: 20px;
border: 1px solid #000;
width: 50px;
height: 50%;
margin: 0 auto;
background-color: rgba(0,128,0,1);
color: #fff;
white-space: nowrap;
  }

 .statusimage {
 margin-top: 3%;  
 } 

 .statustext {
vertical-align: top;
margin-top: 5px;  
 }
  
.lowfreeseats {
padding: 2% 0 0 0;
font-weight: 500; 
border-radius: 20px;
border: 1px solid #000;
width: 95%;
height: 50%;
margin: 0 auto;
background-color: rgba(255,128,0, 0.8);
color: #fff;
white-space: nowrap;  
  }
  
.nofreeseats {
padding: 4% 0 0 0;
font-weight: 500; 
border-radius: 20px;
border: 1px solid #000;
width: 95%;
height: 50%;
margin: 0 auto;
background-color: rgba(179,0,0, 0.8);
color: #fff;  
width: 100%;
  } 
 
 .freeseats, .nofreeseats, .lowfreeseats, .toolate, .kursvorbei {
width: calc(60px + 5vw);
  } 

 .lowfreeseats div {
margin: 0 0 0 0 !important; 
  } 

 .freeseats div {
margin: 3% 0 0 0 !important; 
  } 

 .nofreeseats div {
margin: -2% 0 0 0 !important; 
  }   

 .toolate div {
margin: -2% 0 0 0 !important; 
  }    

 .statustext {
font-size: 1em !important;
}  

.nofreeseats div {
display: inline-block;
margin: -2% 0 0 0;
} 

.freeseats div, .toolate div, .kursvorbei div {
display: inline-block;  
}

.statustext {
font-size: calc(0.3em + 0.7vw);
} 

.lowseatstext {
font-size: calc(0.3em + 0.5vw);
}

.noseatstext {
font-size: calc(0.3em + 0.5vw);
}
  
.lowfreeseats div {
display: inline-block;
margin: 0 0 0 0;  
}

.toolate {
padding: 0 0 0 0;
font-weight: 500; 
border-radius: 20px;
border: 1px solid #000;
width: 95%;
height: 80%;
margin: 0 auto;
background-color: rgba(255,128,0, 0.8);
color: #fff;  
  }         

.kursvorbei {
padding: 0 0 0 0;
font-weight: 500; 
border-radius: 20px;
border: 1px solid #000;
width: 95%;
height: 50%;
margin: 0 auto;
background-color: rgba(255,128,0, 0.8);
color: #fff;
  } 
    
.actual {
display: block !important;
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);  
  } 
    
.reservationbutton  {
font-size: 1em;
  background: #ab5407;
border-radius: 20px;
width: 90%;
margin: 0 auto !important;
cursor: pointer;
border: 1px solid black;
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
  } 

  
.inactive {
display: none;  
  }
  
.reservationbutton a {
display: inline-block;
font-weight: 100;
height: 95%;
border-radius: 20px;
padding: 5px;
color: #e6e6e6; 
transition: all 0.2s; 
width: 95%;
  } 
  
.reservationbutton:hover > a  { 
background-color: #7a3c05;
text-decoration: none;
color: #fff !important;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19)
}

.price {
display: block;
}

.pricemerged {
display: none;  
}

.kurstitle {
font-size: 0.85em;
}

