
/* eigene einstellungen */
@font-face {
  font-family: 'Roboto-Regular';
  src: url('../../wp-content/uploads/et-fonts/roboto-v20-latin-regular.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
	font-family: 'Roboto-500';
	src: url('../../wp-content/uploads/et-fonts/roboto-v20-latin-500.ttf') format('truetype');
	font-weight: 500;
	font-style: normal;
  }

  @font-face {
	font-family: 'Roboto-700';
	src: url('../../wp-content/uploads/et-fonts/roboto-v20-latin-700.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
  }


/* Datei aus THEORG 15.00.4 */

/*
 Version 11.06
 12.07.2013
*/
/* https://www.gzm-physio.com/wp-content/themes/gzmphysio/dist//fonts/Klavika-Regular.eot */
/* @font-face {
    font-family: Klavika-Regular;
    src: url(../../wp-content/themes/gzmphysio/dist/fonts/Klavika-Regular.eot);
    src: local(" real Klavika-Regular "), url(../../wp-content/themes/gzmphysio/dist/fonts/Klavika-Regular.otf) format("truetype")
} */

/* @font-face {
    font-family: Klavika-Medium;
    src: url(../../wp-content/themes/gzmphysio/dist/fonts/Klavika-Medium.eot);
    src: local(" real Klavika-Medium "), url(../../wp-content/themes/gzmphysio/dist/fonts/Klavika-Medium.otf) format("truetype")
} */


body {
        color: #555555;
        font-family: Roboto-Regular, sans-serif;
        font-size: 16px !important
	}
	

html {
		background-color: black;
	}

body
{
	font-family: Roboto-Regular, arial, verdana, helvetica, sans-serif !important;
	font-size: 16px!important;
    text-align : left;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	line-height: normal;
	width: 100%;
	
	background-color: black !important;
    min-height: 100vh;
}

/* Verhindert Zoom bei Fokus auf Eingabefelder */
input, 
select, 
textarea, 
button {
    font-size: 16px !important;
    touch-action: manipulation; /* Verhindert Zoom bei Doppeltipp auf mobilen Geräten */
}

@media (max-width: 992px){
    body, html{
        width: 100vw; 
    }
}
@media only screen and (max-width: 767px){
	body, html{
        width: 100vw;
    }
} 

@media (min-width: 768px){
	body{
	   border: 0px solid #BCCF00;
	   padding:20px;
    }
}

.onlinereservation-text{
		-webkit-column-count: 2;
  	 -moz-column-count: 2;
		column-count: 2;
		margin-top: 30px;
		margin-bottom: 30px;
		font-family: Roboto-Regular, arial, verdana, helvetica, sans-serif !important;
}
@media only screen and (max-width: 767px){
	.onlinereservation-text{
		width: 96%; 
		-webkit-column-count: 1;
  	 -moz-column-count: 1;
		column-count: 1;
    }
}

p, .catalogspacer{
		font-size: 16px;
		line-height: 1.5em;
		margin: 0 0 1em;
		padding: 0;
}
.zoi{
	color: #A3C521;
	font-size: 21px;
}

h1.sectiontitle
{
	border-bottom: 1px solid #4B4B4B;
    font-size: 160%;
    padding: 0;
    margin: 0 0 20px 0;
}

div.sectiontitle {
	clear: both;
	color: #000000;
	line-height: 100%;
	font-size: 18px;
	margin: 0 0 .8em;
	font-family: Roboto-700;
}
@media (max-width: 992px){
    .otrs-content div.sectiontitle {
		font-size: 20px;
	}
}

div.login
{
	margin-bottom: 7px;
}
@media (max-width: 992px){
	.otrs-content div.login{
		margin-bottom: 0px;
	}
}

rd
{
    padding: 3px 4px;
    margin: 0 0 5px 0;
}

input
{
    border: 1px solid #a3a3a3;
    padding: 1px 4px;
}

input.ed, form p input, input.date
{
    width: 97%;
	padding: 12px 20px;
	margin: 8px 0;
	box-sizing: border-box;
}
@media (max-width: 991px) {
    body.site {
        width: 100%;
        padding: 0 20px;
    }
}

.inputbox a{
	padding: 0;
    font-size: inherit;
    height: auto;
    text-align: center;
    line-height: 57px;
    background-color: transparent;
    color: #BCCF00;
    text-decoration: underline;
    cursor: pointer;
}

.inputbox a::after{
	content:' und AGBs';
}

form .inputbox select[name=title] {
	width: 97%;
    padding: 12px 20px;
    margin: 8px 0;
	box-sizing: border-box;
	
    -webkit-appearance: none;
    appearance: none;
    border:  1px solid #000000;
    height: 40px;
    /*background: url(fff-0-2.png) repeat;*/
    color: inherit;
    font-weight: bold;
    font-family: Roboto-Regular, 'Open Sans', sans-serif;
    font-size: inherit;
    box-shadow: none;
    border-radius: none;
    outline: none;
}
/* input.date
{
    width: 80px;
} */

/*input.subbtn
{
	padding: 1px 15px 1px 15px;
	background: -webkit-gradient(linear, 0% 0%, 0% 112%, from(#F8F3F3), to(#D6D6D6));
	background-color: #E7E7E7;
	border-radius: 3px;
	font-size: 13px;
	font-family: Arial;
	font-weight: bold;
	margin: 2px 0 0 0;
	border: 1px solid #8D8D8D;
	vertical-align: top;
	cursor: pointer;
} */

select
{
	margin: 0;
}

label.lbltxtext
{
	float: left;
    width: 100%;
    font-size: 14px;
    /* line-height: 20px; */
    /* margin-top: 30px; */
    /* margin-bottom: 30px; */
    font-family: Roboto-Regular, arial, verdana, helvetica, sans-serif !important;
	
}

label.lbltxt
{
	float: left;
	width: 100%;
	font-size: 14px;
	margin-bottom: 7px; 
	font-family: Roboto-Regular, arial, verdana, helvetica, sans-serif !important;
		line-height: 20px;
	margin-top: 10px;
	margin-bottom: 7px;
	font-family: Roboto-Regular, arial, verdana, helvetica, sans-serif !important;
	margin-right: 9px;
}

label.lbltxtreg
{
	display: block;
	float: left;
	width: 150px;
	line-height: 17px;
	font-size:16px;
}

label.lbltxtl
{
	display: block;
	float: left;
	/* width: 160px; */
	width:100%;
	line-height: 17px;
}

label.lbltxttleft
{
	display: block;
	float: left;
	width: 85px;
	line-height: 17px;
}

label.lbltxttright
{
	display: block;
	float: left;
	width: 180px;
	line-height: 17px;
}

li.overview
{
	list-style-type: none;
	background-repeat: no-repeat;
	background-position: 0 6px;
	padding: 3px 0 0 0;
	line-height: 200%;
	margin: 20px 0 36px;
	clear: both;
	color: #000000;
	line-height: 100%;
	font-size: 14px;
	font-weight: bold;
}
@media (max-width: 991px){
		li.overview{
		font-size: 16px;
    }
}

@media (max-width: 767px){
li.overview {
    border-bottom: 1px solid #BCCF00;}
}
@media (max-width: 991px){
 td.catalogspacer {
    border-bottom: 1px solid #BCCF00;}
}
@media (max-width: 767px){table {width:500px;}}
@media (max-width: 550px){table {width:400px;}}
@media (max-width: 400px){table {width:300px;}}
@media (max-width: 350px){table {width:280px;}}
@media (max-width: 300px){table {width:250px;}}

li.overview a{
	line-height: 105px;
}
a{
	padding: 10px 12px;
    font-size: 14px;
    height: 48px;
    text-align: center;
    line-height: 57px;
    background-color: #BCCF00;
    color: #000000;
    text-decoration: none;
    cursor: pointer;
}
input.subbtn{
	padding: 10px 12px;
	font-size: 16px;
	height: 36px;
    text-align: center;
    background-color: #BCCF00;
    color: #000000;
    text-decoration: none;
    cursor: pointer;
	border: none;
}
@media (max-width: 500px){
a, input.subbtn{
    padding: 10px 8px;
	font-size: 14px;
}	}

.nav a {
	padding: 5px;
	font-family: Roboto-500;
    font-size: 16px;
    height: auto;
    text-align: left;
    line-height: normal;
    background-color: white;
    color:  #000000;;
    text-decoration: none;
    cursor: pointer;
	text-decoration: underline;
}
/* .nav a::after {
	content: "»";
    color: #A3C521;
    padding-left: 6px;
    font-size: 14px;
}

.nav a:last-child::after {
  content: '';
} */
.catalogspacer li::before {
  /* content:'·'; */
  content:'-';
  padding-right: 5px;
  color: #BCCF00;
}
.catalogspacer ul {
  margin-bottom:-15px;
}
.catalogspacer li {
  margin-bottom: 4px;
}

li.bookedevents
{
	background-repeat: no-repeat;
	margin: 0;
	padding: 0;
}

ul, menu, dir 
{
	display: block;
	list-style-type: none;
	margin-before: 1em;
	margin-after: 1em;
	margin-start: 0px;
	margin-end: 0px;
	padding-start: 40px;
}
ul{
	padding-left: 0;
}
img.cntimg 
{
	float: left;
	/* border: 1px solid #898989; */
	width: 200px;
	margin-right: 20px;
}
@media (max-width: 500px){
	img.cntimg {
           width: 100%;
    	margin-bottom: 20px;    }
}
@media (max-width: 500px){
.overview strong {
    font-size: 16px;
}}

img.indicator
{
	float: left;
	margin: 1px 5px 0 0;
}

table
{
  font-size: 16px;
}

table.events
{
	width: 100%; 
	padding: 0;
	margin: 0;
}

table.events b
{
	font-size:16px;
}
@media (max-width: 991px){
	table.events b {
		font-size: 16px;
	}
}

table.header
{
	border-bottom: 1px solid #898989;
	width: 100%; 
	padding: 0;
	margin: 0;
}

tr.catalog
{
	/* background-color: #A3C521; */
	height: 40px;
}
/* td.catalog::before{
	content: "»";
    padding: 5px;
    color: red;
    font-size: 24px;
    padding-left: 20px;
} */
/* -----------catalog: Link ------------ */
@media (min-width: 767px){
	.catalog a{
		line-height: normal;
		padding: 12px 15px 10px 47px;
		height: auto;
		display: block;
		text-align: left;
		position: relative;
	}
}
@media (max-width: 767px){
	.catalog a{
		display: table;
		
	}
}
@media (max-width: 767px){
	.catalog a{
    width: 250px;
    line-height: 41px;
	body.site {
        padding: 0 10px;
    }
}
}
@media (min-width: 767px){
	.catalog a:hover{
		color: black;
		/*color: #BCCF00;*/
	}
}	
@media (min-width: 767px){
.catalog a::before{
	content: url(img/pfeil_white.png);
	padding: 5px;
    padding-right: 25px;
    margin-top: 9px;
    position: absolute;
    width: 200px;
    height: 50px;
    left: 4px;
	top: -6px;
}
	
}
@media (min-width: 767px){
	.catalog a:hover::before{
		content: url(img/pfeil_gruen.png);
		transform: scale(0.5,0.5);
		transition: 1s 
	}
}

/* -----------catalog: Link ------------ */

.catalog .price{
	font-size: 36px;
	padding-top: 17px;
	color:#BCCF00;
}
@media (min-width: 767px){
.catalog .price{
    padding-bottom: 18px;
    padding-left: 15px;
    padding-top: 17px;
	
	}
}
@media (max-width: 767px){
.catalog .price{
    	font-size: 28px;
padding-top: 4px;
	}
}
/* .catalog .price::before{
	content: '» für nur ';
	font-size: 13px;
	color:grey;
} */

tr.events
{
	font: 81.25% Verdana, Arial, Helvetica, sans-serif;
}

tr.eventsaltered
{
	font: 81.25% Verdana, Arial, Helvetica, sans-serif;
  background-color: #F7F7F7;
}

td.events
{   
    padding: 4px 10px 4px 10px;
	margin: 0;
	width: 20%!important;
}
@media only screen and (max-width: 767px){
	td.events
	{   
		padding: 2px 5px 4px 5px;
		width: 30%!important;
	}
}
@media (max-width: 991px){
	td.events{
		width: 30%!important;
	}	
}



td.events:nth-child(3) a:after{
	/*content: url(img/rechts.png);*/
    padding-right: 0px;
	cursor: pointer;
	margin-left: -50px;
}
	

.eventstime + td.events a:after{
 content: ''!important;
margin-left: 0;
}

td.events:nth-child(1) a:before{
	/*content: url(img/links.png);*/
    padding-right: 0px;
	/* position: absolute; */
	cursor: pointer;
}



@media only screen and (max-width: 767px){
	td.events:nth-child(3) a:after{
	}
	td.events:nth-child(1) a:before{
	}
}

td.events:nth-child(1) {
	width: 74%;
}

td.events a{
	background:white;

}
td.events:first-of-type a{
	line-height: inherit!important;
}
p table td.events>a{
	background:#BCCF00;
}


.penelino ul li:before{
    content: ".";
    margin-right: 10px;
    font-weight: bold;
	color: #BCCF00;
	font-size: 30px;
}
.penelino {
	color: #BCCF00;
}
.penelino ul{
	color: #4B4B4B
}
.expire{
	margin-top: 50px;
	color: #4B4B4B;
}

td.eventstime
{
    text-align: center;
    padding: 4px 10px 4px 10px;
    margin: 0;
}

td.catalog
{
  width: 400px;
}
@media (max-width: 991px){
	td.catalog {
		height: 93px;
		width: 250px;
	}
}


td.catalogspacer
{
  padding: 10px 20px 20px 2px;
  width: 400px;
}
@media (max-width: 767px){
	td.catalogspacer
	{
	padding: 10px 20px 40px 0px;
    /* display: grid; */
    width: 121px;	}
}

td.header
{   
    font: 81.25% Verdana, Arial, Helvetica, sans-serif;
    padding: 0;
    margin: 0;
}



th 
{    
    font: 100% Verdana, Arial, Helvetica, sans-serif;
    background-color: #d2d2d2;
    border: 0;
    padding: 7px 10px 7px 10px;
    margin: 0;
    color: #575757;
}

textarea
{
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	border: 1px solid #A3A3A3;
	margin: 0px;
	width: 95vw;
}

div.inputbox
{
	margin: 16px 0 5px 0;
	padding: 0 0 0 0;
}
.inputbox select {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	border: none;
	width: 94%;
	height: 40px;
	padding-left: 10px;
	/*background: url(fff-0-2.png) repeat;*/
	color: #000000;
	font-weight: bold;
	font-family: Roboto-Regular, sans-serif;
	font-size: 16px;
	box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.3);
	border-radius: 3px;
	outline: none;
}
.inputbox {
	position: relative;
}
  
  input[type="checkbox"] {
	width: 20px !important;
    height: 20px !important;
    padding: 0 !important;
    margin: 0 15px 0 0 !important;
    border: 1px solid #a3a3a3 !important;
    box-sizing: content-box !important;
    display: inline-block !important;
    vertical-align: middle !important;
    position: relative !important;
    z-index: 1000 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    appearance: auto !important;
    -webkit-appearance: checkbox !important;
	
}
form .inputbox input[type="checkbox"]{
	height: 20px;
	width: 20px; 

	-ms-transform: scale(1.5); /* IE */
	-moz-transform: scale(1.5); /* FF */
	-webkit-transform: scale(1.5); /* Safari and Chrome */
	-o-transform: scale(1.5); /* Opera */
	transform: scale(1.5);
    padding-top: 20px;
    top: -11px;
    margin-right: 15px;
}
form .inputbox{
	font-size: 16px!important;
	width: 100%;
}
 input[name=firstname] {
	color:black;
  }

select::-ms-expand {
	display: none;
  }
  select option {
	color: #666;
  }
  select:focus::-ms-value {
	background-color: transparent;
  }

div.cleanup
{
    clear : both;   
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	line-height: 0px;
}

.inputbox .tcalInput {
	height: 35px !important;
	margin: 0 auto;
	width: 181px !important;
	font-family: Roboto-regular, arial, sans-serif;
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
	background-color: lighten(#BCCF00,40%) !important;
	outline: none;
	border: 0;
	border-radius: 3px;
	padding: 0 3px;
	color: #000000 !important;
}
/* .inputbox .tcalInput::-webkit-datetime-edit-month-field {
    color: red;
  }
  .inputbox .tcalInput ::-webkit-datetime-edit-day-field {
    color: white;
  }
  .inputbox .tcalInput ::-webkit-datetime-edit-year-field {
    color: blue;
  }
  
  .inputbox .tcalInput ::-webkit-clear-button {
    font-size: 18px;
    height: 30px;
    position: relative;
    right: 5px;
    margin-right: 4px;
  }
  .inputbox .tcalInput ::-webkit-inner-spin-button {
    height: 30px;
  }
  .inputbox .tcalInput ::-webkit-calendar-picker-indicator {
    font-size: 18px;
  }
        
  .inputbox .tcalInput ::-webkit-calendar-picker-indicator  :hover {
      background-color: lighten(#2f2f2f,40%);
      color: darken(#fff, 10%);
      cursor: pointer;
    }
    .inputbox .tcalInput ::-webkit-calendar-picker-indicator  :active {
      color: blue;
    } */
  



div.nav
{
  margin-bottom: 13px;
}

ul.errorbox
{
  list-style-type: circle;
  margin-left:1.5em; 
  padding-left:0px;
}

div.errorbox
{
  color: #AE1917;
  background-color: #FFFFDD;
  border-radius: 3px;
  border: 1px solid #AE1917;
  width: 80vw;
  padding: 10px;
}
.header  strong {
	color:#BCCF00;
	font-size:16px;
}


/* Anpassungen, damit in den header Tabellen die Spalten immer untereinander angezeigt werden */

@media (max-width: 500px){
	a, input.subbtn{
		padding: 10px 8px;
		font-size: 14px;
	}	}
	
	/* Tabellenspalten immer untereinander darstellen */
	table.header {
		width: 100%;
	}
	
	table.header tr {
		display: flex;
		flex-direction: column;
	}
	
	table.header td {
		display: block;
		width: 100% !important;
		text-align: left;
		padding: 2px 0;
	}
	
	/* Rechts ausgerichtete Zelle anpassen */
	table.header td[align="right"] {
		text-align: left;
	}
	
	/* Login-Div anpassen */
	table.header div.login {
		margin-top: 10px;
		margin-bottom: 15px;
	}
	
	.nav a {
		padding: 5px;
		font-family: Roboto-500;
	}
