/*   
Theme Name: Haus Weitblick
Author: Jonathan Schwartz
*/

#header{
background-image: url(./img/Logo_Titel.jpg);
width: 800px;
height: 100px;
background-repeat: no-repeat;
background-color: #000;
margin-left: auto;
margin-right: auto;
cursor: pointer;
box-shadow: 0 5px 5px #000, 0 -1px 0px #FFF;
font-family: 'Raleway', sans-serif;
}

#header-text{
	float: right;
	text-align: left;
	margin-top: 5px;
	margin-right: 5px;
}

#header-text a#active{
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #cccccc), color-stop(1, #8f8f8f) );
	background:-moz-linear-gradient( center top, #cccccc 5%, #8f8f8f 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#8f8f8f');
	background-color:#cccccc;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #9c9c9c;
	display:inline-block;
	color:#ffffff;
	font-family:arial;
	font-size:10px;
	font-weight:bold;
	padding:3px 3px;
	text-decoration:none;
}

#header-text a#active:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8f8f8f), color-stop(1, #cccccc) );
	background:-moz-linear-gradient( center top, #8f8f8f 5%, #cccccc 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8f8f8f', endColorstr='#cccccc');
	background-color:#8f8f8f;
}

#header-text a#active:active {
	position:relative;
	top:1px;
}


#header-text a{
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background-color:#ededed;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#777777;
	font-family:arial;
	font-size:10px;
	font-weight:bold;
	padding:3px 3px;
	text-decoration:none;
}

#header-text a:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background-color:#dfdfdf;
}

#header-text a:active {
	position:relative;
	top:1px;
}

#left-colum{
	float: left;
	margin-right: 20px;
	width: 200px;
	height: auto;
	text-align: center;
}

#navbar{
	border-radius: 3px;
	box-shadow: 0 5px 5px #000, 0 -1px 0px #FFF;
	overflow: hidden;
	font-size: 0.9em;
}

#navbar a{
text-decoration: none;
color: #e5e5e5;
}

#navbar a:visited{
	color: #e5e5e5;
}

#navbar ul > li > a:hover{
	letter-spacing: 0.3px;
	color: #fff;
	text-decoration:underline;
}

#navbar ul{
	list-style: none;
	margin: 0;
	padding: 0;
	color: #e5e5e5;
}

#navbar li.current-menu-item { background-color: #3d000c; }
#navbar li.current-menu-item > a { color: #0199AB; }

#navbar li{
	background-color: #008A31;
	font-weight: bold;
	padding: 5px;
	border-bottom: 1px solid grey;
}

#navbar li:last-child{
	border-bottom: none;
}

#navbar ul li ul > li{
	background-color: #005410; 
	font-style: italic;
	font-weight: normal;
	margin-top: 5px;
	margin-left: -5px;
	margin-right: -5px;
	margin-bottom: -5px;
}

#navbar li ul li#active{
	background-color: 8c0019;
}

#navbar li#active ul li a:hover{
	color: #;
}

/*NAVBAR 2 - START*/

#navbar2{
	margin-top: 20px;
	border-radius: 3px;
	box-shadow: 0 5px 5px #000, 0 -1px 0px #FFF;
	overflow: hidden;
	font-size: 0.9em;
}

#navbar2 a{
text-decoration: none;
color: #e5e5e5;
}

#navbar2 a:visited{
	color: #e5e5e5;
}

#navbar2 a:hover{
	color: #0199AB;
}


#navbar2 li:hover{
	letter-spacing: 0.3px;
	 color: #0199AB;
}

#navbar2 ul{
	list-style: none;
	margin: 0;
	padding: 0;
	color: #e5e5e5;
}

#navbar2 li:last-child{
	border-bottom: none;
}

#navbar2 li.current-menu-item { background-color: #3d000c; }
#navbar2 li.current-menu-item > a { color: #0199AB; }

#navbar2 li{
	background-color: #008A31;
	font-weight: bold;
	padding: 5px;
	border-bottom: 1px solid grey;
}

#navbar2 ul li ul li{
	margin-left: 10px;
	font-style: italic;
	font-weight: normal;
}

/*NAVBAR 2 - END*/

#content{
float: none;
color: white;
height: auto;
overflow: hidden;
max-width:100%;
}

#container{
margin-top: 40px;
margin-bottom: 20px;
}

.highlight{
border-radius: 5px;
background-color: #01626d;
border: 1px solid #00272b;
padding-left: 1px;
padding-right: 1px;
margin: 2px;
display: inline-block;
}

.price{
	margin: 0;
	padding: 0;
	border-bottom: 1px dotted #f2ea00;
	display: inline;
}

.highlight:hover{
	background-color: red;
}

.price:hover{
	border-bottom: 1px dotted #898500;
}

.important{
	color: #100055;
	font-size: 1.5em;
	font-family: 'Yesteryear', cursive;
}

.info{
	color: #8A0020;
	font-size: 1.3em;
	font-family: 'Yesteryear', cursive; 
	text-align: center;
}

#page{
	max-width: 960px;
    font-size:125%;
	min-height: 600px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 10px;
	background: linear-gradient(to bottom, rgba(1, 153, 171, 1) 0%, rgba(204, 226, 241, 1) 100%);
	border-radius: 5px;
	overflow: hidden;
	padding: 20px;
}

#small-contact{
color: white;
font-size: 0.8em;
float: left;
margin-top: 20px;
width: 100%;
}

#counter{
	float: left;
margin-top: 20px;
width: 100%;
}


.divline_v{
	float: left;
	margin-right: 20px;
	margin-left: 20px;
	background-color: #000;
	box-shadow: 0 5px 5px #000, 0 -1px 0px #FFF;
}

a{
	color: #09267B;
}

p {
	color: white;
	margin-top: 0;
	margin-bottom: 10px;
}

p ~ ul{
	margin-top: -10px;
}

h1, h2, h3,h4,h5,h6{
	text-align: left;
	margin-bottom: 10px;
	margin-top: 0;
	color: white;
	font-family: 'Open Sans', sans-serif;
}

h1{
	font-size: 1.9em;
	text-decoration: underline;
}

h2{
	font-size: 1.5em;
}

h2.important{
	color: #3d000c;
}

h3{
	font-size: 1.4em;
}

h3.important{
	color: #3d000c;
}

h4{
	font-size: 1.1em;
}

h5{
	font-size: 1.05em;
}

h6{
	font-size: 0.9em;
}

strong, b {
}

.image-container{
	width: auto;
	height: auto;
	display: inline-block;
}


.right{
	float: right;
	border-collapse: collapse;
	padding-right: 2px;
	margin-left: 10px;
	margin-bottom: 10px;
}

.left{
	float: left;
	border-collapse: collapse;
	padding: 0;
	margin-right: 10px;
	margin-bottom: 10px;
}

img{
	max-width: 100%;
	max-height: 100%;
}

img.border{
	border-radius: 5px;
	border: 1px solid white;
}

img.border.right{
	border-radius: 5px;
	border: 1px solid white;
	margin-left: -2px;
}

img.border.left{
	border-radius: 5px;
	border: 1px solid white;
	margin-right: 2px;
}
.imagecaption{
	font-size: 0.9em;
}

p.caption{
	text-align: center;
	font-size: 0.7em;
	margin:0;
	margin-bottom: 20px;
	padding: 0;
}


body{
	font-family: 'Raleway', sans-serif;
	padding: 0;
	margin: 0;
	height: 100%;
	background-color: #CCE2F1;
}

html{
	height: 100%;
}

/*OUTSTANDING BUTTON - START*/
a.outstanding {
	-moz-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	-webkit-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	box-shadow:inset 0px 1px 0px 0px #bee2f9;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #63b8ee), color-stop(1, #468ccf) );
	background:-moz-linear-gradient( center top, #63b8ee 5%, #468ccf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#63b8ee', endColorstr='#468ccf');
	background-color:#63b8ee;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #3866a3;
	display:inline-block;
	color:#14396a;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	margin-left: 5px;
	margin-right: 5px;
}a.outstanding:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #468ccf), color-stop(1, #63b8ee) );
	background:-moz-linear-gradient( center top, #468ccf 5%, #63b8ee 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#468ccf', endColorstr='#63b8ee');
	background-color:#468ccf;
}a.outstanding:active {
	position:relative;
	top:1px;
}

/*OUTSTANDING BUTTON - END*/

iframe{
/*
	border-radius: 5px;
	box-shadow: 0 5px 5px #000, 0 -1px 0px #FFF;
	margin: 10px;
	padding: 5px;
*/
	overflow: hidden;
}

#dsq1{
	width: 650px !important;
	box-shadow: none;
}

.center {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

/*INLINE BUTTON - START*/
a.inline {
	-moz-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	-webkit-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	box-shadow:inset 0px 1px 0px 0px #bee2f9;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #63b8ee), color-stop(1, #468ccf) );
	background:-moz-linear-gradient( center top, #63b8ee 5%, #468ccf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#63b8ee', endColorstr='#468ccf');
	background-color:#63b8ee;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #3866a3;
	display:inline-block;
	color:#14396a;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:1px 1px;
	text-decoration:none;
	margin:0;
}a.inline:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #468ccf), color-stop(1, #63b8ee) );
	background:-moz-linear-gradient( center top, #468ccf 5%, #63b8ee 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#468ccf', endColorstr='#63b8ee');
	background-color:#468ccf;
}a.inline:active {
	position:relative;
	top:1px;
}

/*END BUTTON - START*/


@media (max-width: 700px){
	#left-colum{
		float:none;
		width:auto;
		margin-right:0;
		display:block;
		overflow:auto;
		padding:1em;
	}
    #content{
    	margin-top:50px;
    	display:block;
    	overflow:auto;
    	clear: both;
    }
	
}

/* 1. Verstecke standardmäßig alle Untermenüs (in WordPress haben diese die Klasse .sub-menu) */
#navbar ul.sub-menu,
#navbar2 ul.sub-menu {
    display: none;
}

/* 2. Zeige das Untermenü an, wenn:
   - der Hauptpunkt selbst aktiv ist (.current-menu-item)
   - ODER ein Unterpunkt aktiv ist (.current-menu-parent / .current-menu-ancestor) */
#navbar li.current-menu-item > ul.sub-menu,
#navbar li.current-menu-parent > ul.sub-menu,
#navbar li.current-menu-ancestor > ul.sub-menu,
#navbar2 li.current-menu-item > ul.sub-menu,
#navbar2 li.current-menu-parent > ul.sub-menu,
#navbar2 li.current-menu-ancestor > ul.sub-menu {
    display: block;
}

body img {
	border: 2px solid white;
    padding: 0px 0px;
}

figure{
	margin-bottom:0.5em
}

#content ul > li {
	margin-bottom: 10px
}