/* cmsms stylesheet: Therapiehunde CSS modified: 29.12.2024 14:21:22 */
/* @import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600&display=swap'); */

/* dancing-script-600 - latin */
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 600;
  src: url('../../webfonts/dancing-script-v24-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../../webfonts/dancing-script-v24-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../../assets/webfonts/dancing-script-v24-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../webfonts/dancing-script-v24-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../../webfonts/dancing-script-v24-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../../webfonts/dancing-script-v24-latin-600.svg#DancingScript') format('svg'); /* Legacy iOS */
}


html,body {
	height:100%;
	font-family: Verdana,sans-serif;
	font-size: 1.0em;
}

body { 
	padding: 0;
	margin: 0; 
	background-color: #fefefe;
}
a {
	color: rgb(173,0,26);
	text-decoration: none;
}

#TestDiv {
	border: 5px solid yellow;
	height: 50px;
}

h1 {
	font-family: 'Dancing Script', cursive;
	font-size: 2em;
	color:black;
}

h2 {
	padding-bottom: 30px;
}

img.rund {
 object-fit: cover;
 object-position: 50% 0;
 border-radius: 50%;
 width: 15em;
 height: 15em;
}

.flr{
	float: right;
}

.fll{
	float: left;
}

.p25{
	padding: 25px;
}

.nice-text {
	font-family: 'Dancing Script', cursive;
	font-size: 2em;
}

a.nice-link {
	display: block;
	padding: 0 0 0 60%;
	font-family: 'Dancing Script', cursive;
	font-size: 2em;
}


.citationbox {
	display: block;
	border: 1px solid #5e5e5e;
	width: 50%;
	font-family: 'Dancing Script', cursive;
	font-size: 2.0em;
	color:black;
	padding: 30px;
	margin: 50px auto;

}

h1.intro {
	display:block;
	margin-top:30%;
	/*margin-top: 15%;*/
	margin-left:30%;
	min-height:1.5em;
	background-color: rgb(245,245,245,0.4);
	border:1px solid #f2f2f2;
	padding:25px;
	width: 50%;

}
div#menu_horiz {
	position: absolute;
	display: flex;
	top: 0px;
	z-index: 5;
/* insure full width */
	width: 100%;
/* set height */
	height: 70px;
	margin: 0;
}
div.menu_left_placeholder {
	width:50%;
}
div#menu_horiz_placeholder {
/* background color for the entire menu row */
	background-color: rgb(173,0,26);
/* insure full width */
	width: 100%;
/* set height */
	height: 70px;
	margin: 0;
}

.container {
	margin: 0px auto;
	width:100vw;
	padding-bottom: 80px;
	height:auto;
	min-height:100%;
	background-image: url("https://therapiehunde-osthessen.com/uploads/images/intro.webp");
	/*background-image: url("https://therapiehunde-osthessen.com/uploads/images/weihnachten_2023.jpg");*/
	background-repeat:  no-repeat;
	background-size: 100% auto;
}

.subcontainer{
	display:flex;
	justify-content: space-between;
	flex-direction: row;
	margin:0px auto;
	width:100%;
	height:auto;
	min-height:100%;
}

.content {
	position: relative;
	max-width:75%;
	width: 75%;
	/* height:auto; */
	/* min-height: 100%; */
	max-height: 100%;
	margin-right: 0px;
	margin-left: auto;
	overflow-y: scroll;
	overflow-x: hidden;
}

ul.list-in-content li {
	list-style-type: none;
	list-style-position: 
}

ul.list-in-content li::before {
	/*content: "<i class="fad fa-dog"></i>";*/
	content: "<i class="fa-thin fa-dog"></i>";
}

.fa-ul li {
	padding: 5px;
}

.w100-center{
	width: 100%;
	text-align: center;
}
.content.subpage {
	/* background-color: rgb(245,245,245,0.9); */
	/* border:1px solid #f2f2f2; */
	/* background-color: rgb(0,0,0,0.5); */
	
}

.contentbox {
	padding-left: 50px;
	padding-right: 25px;
	padding-top: 25px;

}

.contentbox.subpage {
	margin: 50px;

	/* background-color: rgb(0,0,0,0.1); */
	border-radius: 10px;
	background-color: rgb(245,245,245,0.9);
	border:1px solid #f2f2f2;
}

.logowrapper{
	z-index:10;
	margin-top: -50px;
	margin-left: 20px;
	width: 350px;
	height: 182px;
	background-color: rgb(245,245,245,0.4);
	border-radius: 25px;
	padding: 25px;
	position: absolute;
}

.logowrapper img {
	margin: auto;
	width: 95%;
}

.sidebar-left {
	position:relative;
	margin-top: 100px;
	/*height:auto !important;*/
	height: 650px;
	max-width: 200px;
	width:200px;
	padding: 25px;
	background-color: rgb(173,0,26,0.75);
	z-index: 1;
	/*float:left;*/
}

#sidebar-left-600 {
	display: none;
	position:absolute;
	margin-top: 100px;
	margin-left: -180px;
	/*height:auto !important;*/
	height: 650px;
	max-width: 200px;
	width:200px;
	padding: 5px;
	background-color: rgb(173,0,26,0.75);
	z-index: 500;
}
#sidebar-left-600 a.icon-left {
		margin-left: 0px;
		display: none;
} 
.footer {
	position: fixed;
	bottom: 0;
	z-index: 100;
	background-color: rgb(245,245,245,0.4);
	width: 100%;
	height: 80px;
	/*margin-top: -80px;*/
	display: flex;
	flex-wrap: wrap;
}

.bottomnav {
	flex: 30%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.bottomnav a {
	color: #333;
	text-decoration: none;
	display: block;
	padding: 0px 24px;
	margin-top: 24px;
	/*float: left;*/
}

.corporate {
	flex: 30%;
	padding-left: 25px;
	margin-top: 24px;
}
/******************************************/
/* Formatierungen für die Teams */
/******************************************/
.flexslider_wrapper {
	padding:0px 16% 0px 16%;
}

.flex-caption {
  width: 96%;
  padding: 2%;
  left: 0;
  bottom: 0;
  background-color: rgba(0,0,0,.5);
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0,0,0,.3);
  font-size: 14px;
  line-height: 18px;
}

.pagenavigation a {
	color: rgb(173,0,26);
	text-decoration: none;
}
.pagenavigation a:hover {
	font-size: 1.1em;
}
#parentlink a {
	color: rgb(173,0,26);
	text-decoration: none;
}
.flex-description{
	position: relative; 
	display: none;
	margin-top: 10px;
	padding: 2%;
	/*background-color: rgb(245,245,245);*/
	color: #000;
}
.morelink {
	/*text-decoration: underline;*/
	border-bottom: 1px solid #f2f2f2;
}


/******************************************/
/* Formatierungen für die Termine (News-Modul) */
/******************************************/

li.firstnewscat, div.NewsSummaryCategory, div.NewsSummaryAuthor, div.NewsSummaryField {
	display:none;
}

div.NewsSummary, #NewsPostDetailReturnLink{
	padding-top: 20px;
	padding-bottom: 20px;
	border-bottom: solid 1px rgb(173,0,26);
}

div.NewsSummary a, #NewsPostDetailReturnLink a{
	color: rgb(173,0,26);
	text-decoration: none;
}
div.NewsSummary a:hover, #NewsPostDetailReturnLink a:hover{
	/*font-weight: bold;*/
	font-size: 1.1em;
}
div.NewsSummary a:visited, #NewsPostDetailReturnLink a:visited{
	color: rgb(173,0,26);
}
div.NewsSummaryLink a {
	font-weight: bold;
}
div.NewsSummaryLink a:hover {
	font-size: 1.1em;
}
#NewsPostDetailDate, #NewsPostDetailSummary{
	color: rgb(173,0,26);		
}
hr {
	background-color: rgb(173,0,26); 
	height: 1px; 
	border: 0; 
}
/******************************************/
/* Formatierungen für das Kontaktformular */
/******************************************/
fieldset {
	border: 1px solid #5e5e5e;
	border-radius: 5px;
	/*background: rgb(94,94,94,0.3);*/
	display: block;
	width: 50%;
}

fieldset legend {
	font-weight: bold;
}

fieldset div {
	width: 100%;
	font-size: 0.8em;
}

fieldset label {
	display: block;
	width: 90%;
}

fieldset input, textarea {
	width: 90%;
	border-radius: 3px;
	border: 1px solid grey;
}
div.submit input{
	margin-top: 20px;
	border: 1px solid #5e5e5e;
	border-radius: 5px;	
	background: rgb(94,94,94,0.2);
}
div.submit input:hover{
	background: rgb(94,94,94,1.0);
	color: #f2f2f2;
}
div.submit input:active{
	/*background: rgb(94,94,94,1.0);*/
	/*color: #f2f2f2;*/
	color: black;
	background: #f2f2f2;
	border-style: inset;
}
/******************************************/

/******************************************/
/* Formatierungen für Listendarstellung auf Tabellenbasis */
/******************************************/
div.table_wrapper > table {
	border: 1px solid none;
}

div.table_wrapper > table tr {
	height: 150px;
	border-bottom: 1px solid rgb(173,0,26);
}
div.table_wrapper > table a{
	text-decoration: none;
	color: rgb(173,0,26);
}
div.table_wrapper > table a:hover{
	font-size: 1.1em; 
}
div.table_wrapper > table a:visited{
	color: rgb(173,0,26);
}
div.table_wrapper img {
	max-width: 150px;
	padding: 25px;
}
#press-table tr {
	height: auto;
}
#press-table th {
	border-spacing: collapse;
	vertical-align: top;
	font-family: 'Dancing Script', cursive;
	font-size: 200%;
	color:black;
}
#press-table td {
	border-spacing: collapse;
	border-right: 1px solid #5e5e5e;
	width: 33%;
	vertical-align: top;
	padding: 2%;
}
#press-table td:last-of-type {
	border-right: none;
}
/******************************************/
/* Formatierungen für Kontaktformular */
/******************************************/

#MailFrom {
		visibility:hidden;
}

/******************************************/

@media screen and (max-width: 800px) {
	.logowrapper {margin-top: 0px;}
	.footer div {flex: 100%;margin-top:0;text-align:center;vertical-align:middle;}
	.footer div.corporate {height:24px;}
	.footer div.bottomnav a {height:20px;margin-top:0;}*/
	.footer div.bottomnav_placeholder {display:none;}
	.contentbox.subpage {margin: 200px 10px 0px 10px; padding: 0px;}
	div.table_wrapper img {max-width: 50%;}
	.flexslider_wrapper {padding:0px;}
	#carousel {display: none;}
}

@media screen and (max-width: 600px) {
	body {font-size: 0.8em;}
	.logowrapper {position:static;margin:5% auto;width:60%;height:60%;z-index:0;}
	.logowrapper img {width:80%;} 
	.sidebar-left {display:none;}
	.content {margin-top:20px;margin-left:0;overflow-y:visible;}
	.content {max-width:100%;width:100%;}
	.subcontainer {flex-direction: column;}
	.footer div {flex: 100%;margin-top:0;text-align:center;vertical-align:middle;}
	.footer div.corporate {height:24px;}
	.footer div.bottomnav a {height:20px;margin-top:0;}
	.footer div.bottomnav_placeholder {display:none;}
	.contentbox.subpage {margin: 0px 0px 0px 30px; padding-left: 10px; padding-right: 10px;}
	.footer {position: relative;}
	.content::-webkit-scrollbar { width: 0 !important }
	.content { overflow: -moz-scrollbars-none; }
	.content { -ms-overflow-style: none; }
	h1.intro {margin: 10% auto;}
	#carousel {display: none;}
	#sidebar-left-600 { display: block;}
	#sidebar-left-600.responsive { margin-left: 0px;}
	#sidebar-left-600 a.icon-left {
		float: right;
		display: block;
		font-size: 2em;
		color: #f2f2f2;
	} 
}
}


/* cmsms stylesheet: Scrollbars CSS modified: 01.04.2022 16:48:51 */
/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}
/* cmsms stylesheet: CSS Menu Generator CSS Portal modified: 10.12.2022 12:53:07 */
#menu {
	background: #AD001A;
	color: #FFF;
	height: 40px;
	padding-top: 15px;
	padding-left: 18px;
	border-radius: 0px;
}
#menu ul, #menu li {
	margin: 0 auto;
	padding: 0;
	list-style: none
}
#menu ul {
	width: 100%;
}
#menu li {
	float: left;
	display: inline;
	position: relative;
}
#menu a {
	display: block;
	line-height: 40px;
	padding: 0 14px;
	text-decoration: none;
	color: #F2F2F2;
	/*font-size: 16px;*/
	width: auto;
}
#menu ul.sub-menus a {
	/*font-size: 0.4em;*/

}
#menu a.dropdown-arrow:after {
	content: "\25BE";
	margin-left: 5px;
}
#menu li a:hover {
	color: #000000;
	background: #F2F2F2;
}
#menu input {
	display: none;
	margin: 0;
	padding: 0;
	height: 40px;
	width: 100%;
	opacity: 0;
	cursor: pointer
}
#menu label {
	display: none;
	line-height: 40px;
	text-align: center;
	position: absolute;
	left: 35px
}
#menu label:before {
	font-size: 1.6em;
	content: "\2261"; 
	margin-left: 20px;
}
/* Hide the link that should open and close the nav-top on small screens */
#menu a.icon {
  display: none;
}
#menu ul.sub-menus{
	height: auto;
	overflow: hidden;
	width: 300px;
	background: #5e5e5e;
	color: #F2F2F2;
	position: absolute;
	z-index: 99;
	display: none;
}
#menu ul.sub-menus li {
	display: block;
	width: 100%;
}
#menu ul.sub-menus a {
	color: #f2f2f2;
	/*font-size: 16px;*/
}
#menu li:hover ul.sub-menus {
	display: block
}
#menu ul.sub-menus a:hover{
	background: #f2f2f2;
	color: #000000;
}

@media screen and (max-width: 1050px){
	.menu_left_placeholder {display:none;} 
}

@media screen and (max-width: 800px){
	/* #menu input, #menu label {position:absolute;top:0;left:0;display:block} */
	/* #menu input {z-index:4} */
	/* #menu input:checked + label {color:white} */
	/* #menu input:checked + label:before {content:"\00d7"} */
	/* #menu input:checked ~ ul {display:block} */
}

@media screen and (max-width: 800px) {
  /*#menu li {float:none; display: none;}*/
  #menu {
	  width: 100%;
  }
}


/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the nav-top (.icon) */
@media screen and (max-width: 600px) {
	#menu {position:relative}
	#menu ul {background:#5e5e5e;position:absolute;top:100%;right:0;left:0;z-index:15;height:auto;display:none}
	#menu ul.sub-menus {width:100%;position:static;}
	#menu ul.sub-menus a {padding-left:30px;}
	#menu li {display:block;float:none;width:auto;}
    #menu a:not(:nth-child(1)) {display: none;}
    #menu a.icon {
		float: right;
		display: block;
		font-size: 2em;
  } 
  #menu_horiz div.menu_left_placeholder {
	  display: none;
  }
}

/* The "responsive" class is added to the nav-top with JavaScript when the user clicks on the icon. This class makes the nav-top look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {
  #menu.responsive {position: relative;height:auto;}
  #menu.responsive a.icon {
    position: absolute;
    right: 0;
  }
  #menu.responsive ul {
    display: block;
  }
  #menu.responsive ul li {
    float: none;
    text-align: left;
  }
  #menu.responsive a {
    display: block;
  }
}
