- needed to position the dropdown content */
.dropdown {
position: relative;
display: inline-block;
margin: 0 0 200px 0;
width: 100%;
}
/* Dropdown Content (Hidden by Default) */
.dropdown-content {
display: block;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.2);
z-index: 1;
box-sizing: border-box;
width: 100%;
}
/* Links inside the dropdown */
.dropdown-content a {
display: block;
box-sizing: border-box;
float: left;
width: 20.0%;
height: 140px;
color: #333333;
padding: 25px 0;
text-decoration: none;
text-align: center;
border-right: 1px solid #E6E6E6;
overflow: hidden;
}
.dropdown-content a:last-child {
border-right: 0;
}
.dropdown-content a i {
font-family: fontawesome;
display: block;
width: 100%;
color: #333333;
font-size: 1.500em;
padding: 15px 0;
text-shadow: none;
}
/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}
.dropdown-content a span {
display: none;
position: absolute;
margin: 0;
padding: 25px;
top: 0;
background: #3e8e41;
color: #fff;
width: 20%;
height: 140px;
box-sizing: border-box;
}
.dropdown-content a:hover span {
display: block;
border-top: 1px solid #fff ;
padding: 50px 15px;
}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
display: block;
}
/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
background: #3e8e41;
}
#anfahrt {
display: block;
margin: 0px;
padding: 0px;
width: 100%;
position: relative;
left: 0px;
top: 0px;
}
#owlcarousel {
display: block;
float: left;
width: 100%;
height: auto;
/* min-height: 520px;*/
margin: 0;
padding: 0;
}
#youtube {
padding: 25px 0 50px 0;
background: #fff;
}
#youtube h1 {
text-align: center;
padding: 25px 0;
}
#youtube iframe {
display: block;
margin: 0 auto;
width: 700px;
height: 395px;
}
#interior {
padding: 25px 0 50px 0;
background: #f6f6f6;
}
#interior h1 {
text-align: center;
padding: 25px 0;
}
#interior article {
width: 90%;
margin: 0 5% 0 5%;
padding: 0;
box-sizing: border-box;
}
#interior article > div {
display: block;
float: left;
background: #ffffff;
padding: 0;
box-sizing: border-box;
border: 1px solid #E6E6E6;
border-top: 0;
}
#interior article > div {
margin: 1% 0 1% 0;
width: 32%;
border-radius: 4px;
}
#interior article > div:first-child {
margin: 1% 2% 1% 0;
}
#interior article > div:last-child {
margin: 1% 0 1% 2%;
}
#interior article > div h2 {
display: block;
box-sizing: border-box;
width: 100%;
height: auto;
padding: 15px 0 15px 25px;
margin: 0;
}
#interior article > div img {
display: block;
width: 100%;
height: auto;
padding: 0;
margin: 0;
}
#interior article .list {
height: 840px;
padding-bottom: 25px;
}
#interior article .list ul {
list-style-type: none;
margin: 0;
padding: 25px;
display: block;
height: auto;
}
#interior article .pic {
display: none;
padding: 0;
overflow: hidden;
position: relative;
text-align: center;
cursor: pointer;
}
#interior article .pic img {
display: block;
width: 100%;
height: auto;
padding: 0;
margin: 0;
}
#interior article .pic ul {
list-style-type: none;
margin: 0;
padding: 0 25px;
display: block;
height: auto;
}
#interior article .pic .info {
text-align: left;
padding: 0;
cursor: default;
height: 350px;
}
#interior article .pic a,
#interior article .pic li {
font-size: 1.000em;
line-height: 1.250em;
}
#interior article .more {
display: block;
box-sizing: border-box;
text-decoration: none;
background: #F07D00;
color: #fff;
margin: 0;
padding: 15px 0 0 25px;
height: 50px;
width: 100%;
line-height: 50px;
position: absolute;
bottom: 0;
}
#interior article .more::before {
font-family: fontawesome;
color: #fff;
content: "\f138";
padding: 0 10px 0 0;
margin: 0;
}
#interior article .more:hover {
color: #000;
}
#interior article ul li {
color: #333333;
margin: 0 0 10px 0;
}
#interior article ul li::before {
font-family: fontawesome;
color: #F07D00; /*orange*/
content: "\f138";
padding: 0 10px 0 0;
}
#interior article ul li a {
text-decoration: none;
font-weight: 600;
color: #F07D00; /*orange*/
}
#interior article ul li a:hover {
color: #5f5f5f;
}
#hotelrating {
background:#fff;
padding: 25px 0 50px 0;
}
#hotelrating h1 {
text-align: center;
padding: 25px;
}
#hotelrating .center {
width: 600px;
margin: 0 auto;
padding: 0 0 50px 0;
}
#hotelratingmobil {
padding: 25px 0 50px 0;
}
#hotelratingmobil h1 {
text-align: center;
padding: 25px;
}
#hotelratingmobil .center {
width: 300px;
margin: 0 auto;
padding: 0 0 50px 0;
}
#why {
padding: 50px 0 25px 0;
background: #f6f6f6;
}
#map {
background: #f6f6f6;
padding: 25px 0 0 0;
}
#map h1 {
text-align: center;
padding: 25px;
}
#map_canvas {
display: block;
width:100%;
margin:0;
float: left;
}
#map_canvas,
#map .col1,
#map .col2 {
height: 700px;
}
#map .col1 {
display: block;
float: left;
margin: 0;
padding: 0;
width: 70%;
}
#map .col2 {
display: block;
float: left;
margin: 0;
padding: 0;
width: 30%;
background: #030C02;
color: #fff;
/*box-sizing: border-box;*/
}
#map .list {
padding: 15px 25px 0 25px;
}
#map ul {
list-style-type: none;
list-style-position: inside;
margin: 0;
padding: 0;
}
#map ul li {
color: #fff;
font-size: 0.875em;
margin: 0 0 10px 0;
padding: 0;
}
#map ul li:last-child {
margin: 0 0 25px 0;
}
#map ul li::before {
font-family: fontawesome;
color: #00602b; /*green*/
content: "\f138";
padding: 0 10px 0 0;
}
#map .route {
padding: 0 0 0 25px;
}
#map .route a {
display: block;
color: #FB9400; /*orange*/
color: #00602b; /*green*/
color: #3e8e41; /*lightgreen*/
color: #fff; /*white*/
font-weight: 600;
text-decoration: underline;
margin: 0;
}
#map .route a:hover {
color: #fff;
color: #3e8e41; /*lightgreen*/
text-decoration: none;
}
#map .route a i {
padding: 0 15px 0 0;
color: #00602b; /*green*/
}
.bestprice {
background: #EF7C08;
color: #ffffff;
width: 190px;
padding: 10px 10px 5px 10px;
font-family: 'Roboto', sans-serif;
font-weight: 300;
text-align: center;
border-radius: 10px 10px 0 0;
border-bottom: 1px #fff solid;
}
.bestprice {
background: #EF7C08;
color: #ffffff;
width: 190px;
padding: 10px 10px 5px 10px;
font-family: 'Roboto', sans-serif;
font-weight: 300;
text-align: center;
border-radius: 10px 10px 0 0;
border-bottom: 1px #fff solid;
}
.floating {
display: block;
position: absolute;
width: auto;
top: 190px;
left: 25px;
z-index: 8000;
}
.mobil-tools {
/*display: none;*/
width: 100%;
height: 50px;
z-index: 9999;
}
.mobil-tools ul {
display: block;
margin: 0;
padding: 0;
}
.mobil-tools ul li {
list-style: none;
}
.mobil-tools .call {
display: block;
position: absolute;
left: 0;
border-right: 1px solid #fff;
width: 50px;
height: 50px;
background: #F07D00;
}
.mobil-tools .call i {
font-family: fontawesome;
height: 50px;
width: 50px;
font-size: 1.500em;
line-height: 50px;
text-align: center;
padding: 0;
margin: 0;
color: #fff;
}
.mobil-tools .booknow {
display: block;
height: 50px;
color: #fff;
background: #F07D00;
font-size: 1.000em;
line-height: 50px;
text-align: center;
text-transform: uppercase;
text-decoration: none;
}
.mobil-tools .booknow i {
padding: 0 15px 0 0;
}
.inclusive {
float: left;
width: 25%;
position: relative;
padding: 0px;
margin-top: 0px;
margin-right: 1.5%;
margin-bottom: 0px;
margin-left: 1.5%;
}
.inclusive ul {
padding: 0;
margin: 0;
list-style: none;
width: 100%;
width: 250px;
}
.inclusive ul li {
border-radius: 10px 10px 10px 10px;
margin-bottom: 5px;
background: rgba(239,124,8);
opacity: 1.0;
filter:alpha(opacity=100); /* For IE8 and earlier */
-ms-filter: "alpha(opacity = 100)"; /* ab IE 8 zusätzlich möglich */
background: rgba(239,124,8,1.0);
}
.inclusive ul li:hover {
background: rgba(239,124,8);
opacity: 0.7;
filter:alpha(opacity=70); /* For IE8 and earlier */
-ms-filter: "alpha(opacity = 70)"; /* ab IE 8 zusätzlich möglich */
background: rgba(239,124,8,0.7);
}
.inclusive ul li a {
font-family: 'Roboto', sans-serif;
font-size: 14px;
border-bottom: none;
text-decoration: none;
font-weight: lighter;
color: #FFFFFF;
line-height: 40px;
padding-top: 5px;
padding-left: 5px;
}
.inclusive ul li a i {
text-align: center;
padding-top: 5px;
padding-left: 10px;
width: 30px;
}
/*GOOGLE MAPS=============================================================================*/
/*google maps*/
.responsiveContainer {
position: relative;
height: auto;
overflow: hidden;
margin-bottom: 20px;
}
.responsiveContainer iframe,
.responsiveContainer object,
.responsiveContainer embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.gm-style-iw {
width: 160px;
height: 120px;
}
.responsiveContainer b {
color: #00602b;
font-weight: bold;
font-size: 18px;
}
.col-1-1-3 {
width: 30%;
min-width: 300px;
float: left;
padding: 0px;
position: relative;
left: 0px;
top: 0px;
display: block;
margin-top: 0px;
margin-right: 5%;
margin-bottom: 30px;
margin-left: 0px;
background-color: #FF0000;
}
.col-2-2-3 {
float: left;
width: 60%;
position: relative;
left: 0px;
top: 0px;
display: block;
padding: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 15px;
margin-left: 0px;
background-color: #FF00FF;
}
.col50 {
width: 50%;
float: left;
padding: 0px;
position: relative;
left: 0px;
top: 0px;
display: block;
margin-top: 0px;
margin-right: 5%;
margin-bottom: 30px;
margin-left: 0px;
}
.col40 {
float: left;
width: 40%;
position: relative;
left: 0px;
top: 0px;
display: block;
padding: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 15px;
margin-left: 0px;
}
.logo {
display: block;
float: left;
position: relative;
height: 120px;
margin: 0;
padding: 0;
}
.logo img {
max-width: 170px;
height: auto;
width: auto\9; /* ie8 */
margin: 0;
padding: 0;
}
.kontakt {
display: block;
float: left;
height: 120px;
margin: 0 0 0 4%;
padding: 0;
}
.kontakt h2 {
font-size: 1.500em;
font-weight: 600;
line-height: 1.500em;
display: block;
float: left;
padding: 15px 15px 0 0;
margin: 0;
}
.kontakt span {
font-size: 0.850em;
font-weight: 600;
line-height: 0.850em;
display: block;
padding: 28px 0 0 0;
margin: 0;
color: #FB9400; /*orange*/
}
.kontakt p {
font-size: 0.875em;
font-weight: 300;
color: #5f5f5f;
display: block;
float: left;
padding: 10px 0;
}
.kontakt a {
text-decoration: none;
font-weight: 600;
color: #5f5f5f;
}
.kontakt a:hover {
color: #FB9400; /*orange*/
}
.rating {
display: block;
float: left;
position: relative;
top: 0;
/* width: 80%;*/
height: 120px;
margin: 0 0 0 4%;
padding: 0;
}
.booking {
display: block;
float: left;
position: relative;
top: 0;
/* width: 80%;*/
height: 120px;
margin: 0 0 0 4%;
padding: 0;
}
.opacity { position:absolute; left:5px; height:272px; width:167px; top:0px; background:url(../images/opacity.png) repeat
}
.opacity_r { position:absolute; left:348px; height:272px; width:167px; top:0px; background:url(../images/opacity.png) repeat
}
/*NAVIGATION=============================================================================*/
#navi {
font-family: 'Roboto', sans-serif;
text-decoration: none;
text-align: left;
top: 0px;
bottom: 0px;
line-height: 40px;
height: 40px;
padding-left: 14px;
}
.navigation {
-webkit-border-radius: 3px; /* Safari, Chrome */
-khtml-border-radius: 3px; /* KHTML */
border-radius: 3px;
font-family: 'Roboto', sans-serif;
font-size:14px;
color:#000000;
border-top-width: 0px;
border-right-width: 1px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-right-color: #FFFFFF;
text-decoration: none;
text-align: left;
font-weight: bolder;
letter-spacing: 5px;
height: 40px;
padding-right: 15px;
text-transform: uppercase;
}
.navigation a {
-webkit-border-radius: 3px; /* Safari, Chrome */
-khtml-border-radius: 3px; /* KHTML */
border-radius: 3px;
font-family: 'Roboto', sans-serif;
font-size:14px;
color:#00602B;
border-top-width: 0px;
border-right-width: 1px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-right-color: #FFFFFF;
text-decoration: none;
text-align: left;
font-weight: bolder;
letter-spacing: 5px;
height: 40px;
padding-right: 15px;
text-transform: uppercase;
}
.menu_bg {
background-color: #00602B;
/* height: 30px;
width: auto;*/
position: relative;
max-width: 100%;
height: auto;
width: auto\9; /* ie8 */
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
float: left;
display: block;
}
.menu_bg_fest {
background-color: #00602B;
height: 30px;
position: relative;
top: 150px;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #FFFFFF;
}
/*PAGES=============================================================================*/
.date { color:#000000;
}
.text {
padding-left:0px
}
.datum {
font-size:14px;
text-transform:uppercase;
font-family: 'Roboto', sans-serif;
font-weight: bold;
color: #000000;
padding-top: 5px;
padding-right: 0px;
padding-bottom: 3px;
padding-left: 0px;
border-bottom-width: 1px;
border-bottom-style: dotted;
border-bottom-color: #999999;
}
.gallery {
list-style-type: none;
padding: 1%;
}
.gallery li {
margin-right: 10px;
margin-bottom: 10px;
list-style-type: none;
position: relative;
float: left;
padding: 0;
left: 0px;
top: 0px;
display: block;
}
.gallery li a img{
display: block;
padding: 2px;
float: left;
position: relative;
left: 0px;
top: 0px;
width: 260px;
margin: 0px;
border-radius: 5px 5px 5px 5px;
background-color: #fcc852;
}
.ausstattung {
padding: 0;
margin: 0;
}
.ausstattung article {
width: 100%;
padding: 2.5% 0 2.5% 0;
margin: 0;
}
.ausstattung img {
display: block;
float: left;
padding: 0;
margin: 0;
width: 23.5%;
height: auto;
margin-right: 2.5%;
padding: 2px;
border-radius: 5px 5px 5px 5px;
background-color: #fcc852;
}
.ausstattung h2 {
display: block;
float: left;
width: 70%;
margin: 0;
padding: 0 0 15px 0;
line-height: 1.250em;
}
.ausstattung ul {
display: block;
float: left;
width: 70%;
margin: 0;
padding: 0 0 25px 0;
list-style-type: none;
}
.ausstattung ul li {
color: #333333;
margin: 0 0 5px 0;
font-size: 1.125em;
line-height: 1.500em;
}
.ausstattung ul li::before {
font-family: fontawesome;
color: #F07D00; /*orange*/
content: "\f138";
padding: 0 10px 0 0;
}
.ausstattung p {
color: #333333;
margin: 0 0 5px 0;
padding: 0 0 0 25pX;
font-size: 0.850em;
line-height: 1.000em;
}
.hotel {
padding: 0;
margin: 0;
}
.hotel ul {
display: block;
float: left;
width: 100%;
margin: 0;
padding: 0 0 25px 0;
list-style-type: none;
}
.hotel ul li {
color: #333333;
margin: 0 0 5px 0;
font-size: 1.125em;
line-height: 1.500em;
}
.hotel ul li::before {
font-family: fontawesome;
color: #F07D00; /*orange*/
content: "\f138";
padding: 0 10px 0 0;
}
#bistro {
padding: 0;
margin: 0;
color: #333333;
font-size: 14px;
text-decoration: none;
font-weight: normal;
font-family: 'Roboto', sans-serif;
}
#bistro p{
float: left;
vertical-align: baseline;
font-size: 1.125em;
line-height: 1.375em;
margin-left: 0px;
margin-bottom: 20px;
color: #00602B;
width: 100%;
}
#bistro .titel{
float: left;
width: 31.5%;
vertical-align: baseline;
font-size: 1.125em;
line-height: 1.375em;
margin-left: 0px;
margin-bottom: 10px;
padding: 0px;
margin-top: 0px;
clear: left;
margin-right: 2%;
}
#bistro .info{
float: left;
width: 40%;
vertical-align: baseline;
font-size: 1.125em;
line-height: 1.375em;
margin-left: 15px;
margin-bottom: 10px;
padding: 0px;
margin-top: 0px;
margin-right: 2%;
padding-left: 1.5%;
}
#bistro .preis{
float: left;
width: 12%;
vertical-align: baseline;
font-size: 1.125em;
line-height: 1.375em;
margin-left: 15px;
margin-bottom: 10px;
padding: 0px;
clear: right;
margin-top: 0px;
margin-right: auto;
padding-left: 0;
padding-right: 1.5%;
text-align: right;
}
#bistro .space{
float: left;
width: 100%;
vertical-align: baseline;
font-size: 1.125em;
line-height: 1.375em;
margin-left: 0px;
margin-bottom: 30px;
padding: 0px;
clear: right;
margin-top: 0px;
margin-right: 0px;
}
.col_740 {
float: left;
width: 740px;
vertical-align: baseline;
line-height: 20px;
background-color: #FFFEEC;
}
/*.col {
float: left;
width: 200px;
vertical-align: baseline;
margin-left: 26px;
}*/
.col_gallerie_first {
float: left;
width: 220px;
vertical-align: baseline;
line-height: 20px;
margin-bottom: 5px;
}
.col_gallerie {
float: left;
width: 220px;
vertical-align: baseline;
line-height: 20px;
margin-left: 0px;
margin-bottom: 5px;
margin-right: 20px;
}
.col_list {
line-height: 20px;
background-color: #FFFEEC;
padding-bottom: 20px;
color: #333333;
font-family: 'Roboto', sans-serif;
}
col_ul {
}
col_li {
width: 100%;
text-decoration: none;
list-style-type: none;
display: block;
height: 170px;
padding-bottom: 10px;
padding-top: 10px;
border-bottom-width: 1px;
border-bottom-style: dotted;
border-bottom-color: #006633;
}
#widget {
height: auto;
width: auto;
float: left;
margin-top: 0px;
margin-bottom: 0px;
background-color: #CCC;
}
#gallerie {
font-size:12px;
background-color: #FFFEEC;
padding-top: 6px;
padding-right: 14;
padding-bottom: 6px;
padding-left: 14;
font-family: 'Roboto', sans-serif;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #FFFFFF;
text-decoration: none;
font-weight: normal;
color: #FFFFFF;
height: 500px;
}
.paket {
height: auto;
width: auto;
margin: 0px;
padding: 0px;
}
.paket .col1{
float: left;
width: 100%;
vertical-align: baseline;
margin-left: 0px;
border: 1px none #FFFFFF;
margin-top: 0px;
margin-bottom: 20px;
height: auto;
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
padding: 0px;
}
.paket .col2{
float: left;
width: 350px;
margin-left: 0px;
border: 1px none #FFFFFF;
margin-bottom: 0px;
height: auto;
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
padding: 0px;
}
.paket .col3{
float: left;
width: 225px;
margin-left: 10px;
border: 1px none #FFFFFF;
margin-bottom: 20px;
height: auto;
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
background-image: url(../images/bg/form_bg.png);
background-repeat: repeat;
padding: 5px;
}
.paket .col4{
float: left;
width: 225px;
margin-left: 10px;
border: 1px none #FFFFFF;
margin-bottom: 20px;
height: auto;
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
background-image: url(../images/bg/form_bg.png);
background-repeat: repeat;
padding: 5px;
}
.paket h1 {
font-size: 22px;
letter-spacing: 5px;
color: #00602b;
font-weight: lighter;
text-transform: uppercase;
line-height: 150px;
height: 150px;
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
margin-bottom: 0px;
display: block;
box-shadow: 0px 2px 2px #000000;
background-color: #EF7F01;
margin-top: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 15px;
}
.paket img {
height: 150px;
width: 150px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
display: block;
padding: 0px;
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;
float: right;
position: relative;
top: 0px;
right: 0px;
margin-bottom: 0px;
}
.paket a {
background-color: #EF7F01;
padding-top: 0px;
text-transform: uppercase;
line-height: 25px;
height: 25px;
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
margin-bottom: 20px;
display: block;
box-shadow: 0px 2px 2px #000000;
color: #FFF;
text-align: center;
margin-top: 20px;
font-weight: bold;
}
.paket a:hover {
background-color: #EF7F01;
padding-top: 0px;
text-transform: uppercase;
line-height: 25px;
height: 25px;
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
margin-bottom: 20px;
display: block;
box-shadow: 0px 2px 2px #000000;
color: #000;
}
.paket p {
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
display: block;
margin: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 14px;
}
.paket .box{
height: auto;
float: left;
margin-top: 10px;
margin-bottom: 10px;
width: 100%;
border-bottom-width: 1px;
border-bottom-style: dashed;
border-bottom-color: #00602b;
}
.col_zimmer_first {
float: left;
width: 400px;
vertical-align: baseline;
line-height: 20px;
margin-left: 14px;
border: 1px dotted #FFFFFF;
margin-top: 10px;
}
.paket li{
display: list-item;
font-size: 14px;
line-height: 20px;
list-style-position: outside;
}
.paket ul {
color: #333333;
list-style-position: inside;
list-style-type: disc;
margin-bottom: 20px;
}
.col_zimmer {
float: left;
width: 552px;
vertical-align: baseline;
line-height: 20px;
margin-left: 24px;
border: 1px dotted #FFFFFF;
margin-top: 10px;
}
.link_hotel_de {
width: 88px;
height: 20px;
float: right;
line-height: 20px;
display: block;
position: relative;
}
/*KONTAKT=============================================================================*/
#contactform {
display: block;
margin: 0;
padding: 0;
}
.col_contact-area {
display: block;
width: 62%;
float: left;
padding: 0px;
position: relative;
left: 0px;
top: 0px;
margin: 0 3% 0 0;
}
.col_contact-area p{
font-family: 'Roboto', sans-serif;
font-size: 0.950em;
margin-bottom: 0px;
color: #333;
padding-left: 0;
}
.col_contact-area h2{
padding-left: 0;
}
.col_contact-area select {
display: block;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;
font-size: 1.000em;
border: 1px solid #fff;
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;
background: rgba(239,124,8);
opacity: 1.0;
filter:alpha(opacity=100); /* For IE8 and earlier */
-ms-filter: "alpha(opacity = 100)"; /* ab IE 8 zusätzlich möglich */
background: rgba(239,124,8,1.0);
color: #fff;
line-height: 30px;
margin-bottom: 10px;
float: left;
width: 100%;
height: 30px;
}
.col_contact-area select option {
width: 100%;
min-height: 50px;
height: 50px;
line-height: 50px;
font-family: 'Roboto', sans-serif;
font-size: 1.000em;
}
.col_contact-area input:required {
background-color:#ef7f01;
color: #FFF;
}
.col_contact-area input {
display: block;
box-sizing: border-box;
padding: 5px;
font-family: 'Roboto', sans-serif;
font-size: 1.000em;
margin: 0 0 10px 0;
border-style: none;
float: left;
opacity: 1.0;
filter:alpha(opacity=100); /* For IE8 and earlier */
-ms-filter: "alpha(opacity = 100)"; /* ab IE 8 zusätzlich möglich */
background: rgba(239,124,8,1.0);
color: #FFF;
}
.col_contact-area input.fillout {
display: block;
box-sizing: border-box;
width: 100%;
height: 30px;
}
.col_contact-area textarea {
display: block;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;
font-size: 1.000em;
height: 200px;
width: 100%;
padding: 5px;
margin: 0 0 25px 0;
border-style: none;
opacity: 1.0;
filter:alpha(opacity=100); /* For IE8 and earlier */
-ms-filter: "alpha(opacity = 100)"; /* ab IE 8 zusätzlich möglich */
background: rgba(239,124,8,1.0);
color: #fff;
}
.col_contact-area textarea:focus,
.col_contact-area input:focus {
opacity: 0.3;
filter:alpha(opacity=30); /* For IE8 and earlier */
-ms-filter: "alpha(opacity = 30)"; /* ab IE 8 zusätzlich möglich */
background: rgba(239,124,8,0.3);
color: #000;
}
.col_contact-area input.submit-button {
font-family: 'Roboto', sans-serif;
font-size: 1.000em;
font-weight: 600;
width: 200px;
height: 40px;
border-radius: 5px 5px 5px 5px;
float: left;
margin-right: 10px;
padding: 5px;
margin-left: 0px;
}
.col_contact-area input.reset-button {
font-family: 'Roboto', sans-serif;
font-size: 1.000em;
font-weight: 600;
width: 200px;
height: 40px;
border-radius: 5px 5px 5px 5px;
float: left;
margin-right: 10px;
padding: 5px;
margin-left: 0px;
}
.col_contact-data {
float: left;
width: 32%;
position: relative;
left: 0px;
top: 0px;
display: block;
padding: 0px;
margin-top: 0px;
margin-right: 1.5%;
margin-bottom: 15px;
margin-left: 1.5%;
}
.col_contact-data h2{
padding-left: 0;
}
.col_contact-data p{
font-family: 'Roboto', sans-serif;
margin: 0px;
padding: 0px;
}
.col_contact-data i{
text-decoration: none;
}
.col_contact-data img{
margin-left: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
background-image: none;
margin-right: 10px;
margin-top: 2px;
}
.submit-button:hover{
color: #FFF;
background-color: #00602B;
}
.reset-button:hover {
color: #FFF;
background-color: #00602B;
}
.bewertung_lesen {
width: 88px;
height: 23px;
line-height: 20px;
display: block;
top: 90px;
position: relative;
float: right;
left: 85px;
}
.map {
float: left;
width: auto;
height: auto;
margin-top: 14px;
margin-bottom: 14px;
padding: 5px;
background-image: url(../images/bg/form_bg.png);
border-radius: 5px 5px 5px 5px;
}
.mapinfo {
float: left;
width: auto;
height: 250px;
margin-top: 14px;
margin-left: 50px;
}
.facebookOuter {
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
.facebookInner {
overflow: hidden;
color: #FFFFFF;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
.fan_box .connections {
color: #FFFFFF;
}
.fan_box .connections_grid .grid_item .name {
color: #FFFFFF;
}
.fbConnectWidgetFooter {
background-color: none;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
.anfrage a{
background-color: #EF7F01;
line-height: 25px;
height: auto;
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
margin-bottom: 20px;
display: block;
box-shadow: 0px 2px 2px #000000;
color: #FFF;
text-align: center;
margin-top: 20px;
text-decoration: none;
width: auto;
padding: 5px;
text-transform: uppercase;
margin-right: 15px;
margin-left: 0px;
}
.anfrage a:hover {
background-color: #EF7F01;
text-transform: uppercase;
line-height: 25px;
height: auto;
border-radius: 5px 5px 5px 5px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
margin-bottom: 20px;
display: block;
box-shadow: 0px 2px 2px #000000;
color: #000;
}
#stream {
padding-left: 1.5%;
padding-right: 1.5%;
margin: 20px 0 20px 0;
}
.fb-page, .fb_iframe_widget, .fb_iframe_widget[style], .fb_iframe_widget iframe[style], .fb-page span, .fb-page.fb_iframe_widget span iframe, fb-page iframe[style] {
width: 100% !important;
}
/*FOOTER=============================================================================*/
#footer {
}
#footer .col_first{
float: left;
min-width: 300px;
vertical-align: baseline;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
width: 30%;
display: block;
height: 230px;
z-index: 9999;
margin: 30px 3% 0 0;
padding: 0;
}
#footer .col {
float: left;
width: 20.33%;
vertical-align: baseline;
margin: 10px 3% 0 0;
padding: 0;
}
#footer .col_last{
float: left;
width: 20.33%;
vertical-align: baseline;
padding: 0;
margin: 10px 0 0 0;
}
#footer h3 {
display: block;
font-family: 'Roboto', sans-serif;
font-size: 16px;
line-height: 16px;
margin: 0;
padding: 20px 0 20px 0;
border-style: none;
}
#footer ul {
list-style: none;
margin: 0;
padding: 0;
}
#footer ul li {
padding: 0 0 10px 0;
margin: 0;
color: #fff;
}
#footer ul li a,
#footer ul li p {
display: block;
font-family: 'Roboto', sans-serif;
font-size: 12px;
line-height: 20px;
text-transform: none;
color:#fff;
text-decoration: none;
letter-spacing: 0.5px;
padding: 0;
}
#footer ul li a i,
#footer ul li p i {
display: block;
float: left;
font-family: fontawesome;
margin: 0;
padding: 4px 10px 0 0;
}
#footer ul li a:hover {
color:#EF7F01;
}
#footer p {
display: block;
font-family: 'Roboto', sans-serif;
color: #fff;
font-size: 12px;
line-height: 20px;
text-transform: none;
text-decoration: none;
letter-spacing: 0.5px;
padding: 0 0 10px 0;
}
#footer .foot {
font-family: 'Roboto', sans-serif;
display: block;
color: #fff;
text-align: left;
font-size: 12px;
border-top: 1px solid #006633;
float: left;
width: 100%;
position: relative;
margin: 0;
padding: 10px 0;
left: 0;
top: 0;
}
#footer .foot p {
text-align: left;
float: left;
letter-spacing: 2px;
}
#footer .foot a {
text-align: right;
float: right;
text-decoration: none;
letter-spacing: 2px;
color: #fff;
padding-left: 10px;
}
#footer .foot a:hover {
color:#EF7F01;
}
#totop {
display: block;
position: relative;
left: 0;
top: 0;
padding: 0;
margin: 0;
width: 100%;
height: 20px;
}
.tt-wrapper{
padding: 0;
width: 68px;
height: 70px;
display: block;
margin-top: 20px;
margin-right: 20px;
margin-bottom: 0px;
margin-left: auto;
}
.tt-wrapper li{
float: left;
list-style-type: none;
}
.tt-wrapper li a{
display: block;
width: 68px;
height: 70px;
margin: 0 2px;
outline: none;
text-indent: -9000px;
position: relative;
}
.tt-wrapper li .tt-totop{
background-image: url(../images/totop.png);
background-repeat: no-repeat;
}
.tt-wrapper li a span{
width: 100px;
height: auto;
line-height: 20px;
padding: 10px;
left: 50%;
margin-left: -60px;
font-family: 'Roboto', sans-serif;
font-weight: normal;
font-size: 14px;
color: #ffffff; /*#00602B;*/
text-align: center;
text-indent: 0px;
position: absolute;
pointer-events: none;
bottom: 10px;
opacity: 0;
-webkit-transition: all 1.0s ease-in-out;
-moz-transition: all 1.0s ease-in-out;
-o-transition: all 1.0s ease-in-out;
-ms-transition: all 1.0s ease-in-out;
transition: all 1.0s ease-in-out;
}
.tt-wrapper li a:hover span{
opacity: 0.9;
bottom: 60px;
}
#top {
position: relative;
float: left;
top: 0;
left: 0;
width: 100%;
padding: 0;
background: #00602b;
z-index: 9999;
}
#top a,
#top p {
font-family: 'Roboto', sans-serif;
font-size: 0.875em;
color: #fff;
text-decoration: none;
padding: 0 0 0 20px;
}
#top a:hover {
color: #EF7F01;
}
#top i {
font-size: 0.875em;
padding: 0 5px 0 25px;
}
.desktop-only {
display: block;
}
.mobil-only {
display: none;
}
/* ======================================================================================================
MEDIA QUERIES
=======================================================================================================*/
@media screen and (max-width: 1340px) {
.floating {
top: 190px;
left: 25px;
}
}
/*=======================================================================================================*/
@media screen and (max-width: 1280px) {
#map_canvas,
#map .col1,
#map .col2 {
height: 700px;
}
#map .col1 {
width: 65%;
}
#map .col2 {
width: 35%;
}
.floating {
display: block;
position: absolute;
width: auto;
top: 190px;
left: 25px;
z-index: 8000;
}
}
/*=======================================================================================================*/
@media screen and (max-width: 1024px) {
.container {
width: 100%;
}
.content {
width: 90%;
margin: 0 5%;
}
h1 {
font-size: 1.500em;
line-height: 1.500em;
}
#interior article {
width: 100%;
margin: 0 auto;
}
#interior article .list {
display: none;
}
#interior article .pic {
display: block;
}
#map_canvas,
#map .col1,
#map .col2 {
height: 700px;
}
#map .col1 {
width: 60%;
}
#map .col2 {
width: 40%;
}
.grid2 .col1-2-3{
width: 70%;
}
footer {
background-color: #00602B;
}
#footer .col_first{
float: none;
min-width: 300px;
}
#footer .col{
float: none;
width: 100%;
padding: 0 0 0 50px;
}
#footer .col_last{
float: none;
width: 100%;
padding: 0 0 0 50px;
}
.col_contact-area input.fillout {
height: 50px;
}
.col_contact-area input.submit-button,
.col_contact-area input.reset-button {
height: 50px;
}
.col_contact-area select {
line-height: 50px;
height: 50px;
}
.col_contact-area select option {
line-height: 50px;
height: 50px;
font-size: 1.000em;
}
.floating {
top: 180px;
left: 20px;
}
}
/*=======================================================================================================*/
@media screen and (max-width: 768px) {
.container {
width: 100%;
height: auto;
}
.kontakt {
width: 65%;
margin: 0 0 0 5%;
}
.floating {
display: none;
}
ul#navigation {
display: none;
}
.hide {
display: block;
}
.col_contact-area {
width: 100%;
margin-bottom: 100px;
display: block;
}
.col_contact-data {
width: 100%;
margin-bottom: 100px;
display: block;
}
.grid4 .col1-1-4{
display: none;
}
.grid4 .col2-3-4{
float: none;
width: 100%;
margin-bottom: 100px;
display: block;
}
.grid2 .col1-2-3{
float: none;
width: 100%;
margin-bottom: 100px;
display: block;
}
.grid2 .col2-1-3{
float: left;
width: 100%;
margin-bottom: 100px;
display: block;
}
.paketmenu div.silverheader a {
font-size: 14px;
line-height: normal;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 0px;
}
#interior article .pic a {
font-size: 1.000em;
line-height: 1.250em;
}
#map_canvas,
#map .col1,
#map .col2 {
height: 700px;
}
#map .col1 {
width: 60%;
}
#map .col2 {
width: 40%;
}
/* Links inside the dropdown */
.dropdown-content a {
height: 150px;
}
.dropdown-content a span {
height: 150px;
word-wrap: break-word;
}
.ausstattung img {
display: block;
float: left;
margin: 0;
width: 43.5%;
height: auto;
margin-right: 2.5%;
padding: 2px;
border-radius: 5px 5px 5px 5px;
background-color: #fcc852;
}
.ausstattung h2 {
display: block;
float: left;
width: 50%;
margin: 0;
padding: 0 0 25px 0;
padding-left: 2%;
line-height: 1.250em;
}
.ausstattung ul {
display: block;
float: left;
width: 50%;
margin: 0;
padding: 0;
padding-left: 2%;
}
.mobil-tools {
display: block;
position: fixed;
bottom: 0;
left: 0;
}
}
/*=======================================================================================================*/
@media screen and (max-width: 614px) {
.logo {
display: block;
float: left;
position: relative;
height: 100px;
margin: 0;
padding: 0;
}
.logo img {
max-width: 130px;
height: auto;
width: auto\9; /* ie8 */
margin: 0;
padding: 0;
}
.kontakt {
width: 60%;
margin: 0 0 0 5%;
}
.kontakt p {
font-size: 0.750em;
}
.kontakt h2 {
font-size: 1.250em;
line-height: 1.250em;
padding: 20px 15px 0 0;
}
.kontakt span {
font-size: 0.875em;
line-height: 0.875em;
}
#interior article > div,
#interior article > div:first-child,
#interior article > div:last-child {
margin: 0 0 25px 0;
width: 100%;
border-radius: 4px;
}
#map_canvas,
#map .col1,
#map .col2 {
}
#map .col1 {
display: block;
float: left;
width: 100%;
height: 700px;
}
#map .col2 {
display: block;
float: left;
width: 100%;
height: auto;
padding-bottom: 50px;
}
.dropdown-content a {
height: 130px;
padding: 10px 0;
}
.dropdown-content a:hover span {
display: block;
border-top: 1px solid #fff ;
padding: 20px 5px 0 5px;
}
.dropdown-content a span {
height: 130px;
word-wrap: break-word;
}
#interior article .pic .info {
text-align: left;
padding: 0;
cursor: default;
height: 300px;
}
#youtube iframe {
width: 100%;
height: 100%;
}
.desktop-only {
display: none;
}
.mobil-only {
display: block;
}
}
/*=======================================================================================================*/
@media screen and (max-width: 480px) {
.content {
width: 90%;
margin: 0 5%;
}
.logo {
width: 100%;
height: 100px;
}
.logo img {
display: block;
max-width: 130px;
text-align: center;
margin: 0 auto;
padding: 0;
}
h1 {
font-size: 1.250em;
line-height: 1.250em;
}
p {
font-size: 1.000em;
line-height: 1.500em;
}
#map .col1 {
width: 100%;
}
#map .col2 {
height: auto;
}
.kontakt {
display: none;
}
.grid2 .col1-2-3 img{
max-width: 100%;
}
.gallery li a img{
width: 100%;
}
#footer .col_first{
float: none;
min-width: 300px;
margin: 25px auto;
}
#footer .col{
float: none;
width: 100%;
}
#footer .col_last{
float: none;
width: 100%;
padding-bottom: 25px;
}
#footer .copy {
margin: 0 0 50px 0;
}
#interior article .pic .info {
height: 320px;
}
/* Dropdown Content (Hidden by Default) */
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.2);
z-index: 1;
box-sizing: border-box;
width: 100%;
}
/* Links inside the dropdown */
.dropdown-content a {
box-sizing: border-box;
width: 100%;
height: 100px;
padding: 0;
}
.dropdown-content a i {
font-family: fontawesome;
display: block;
float: left;
color: #333333;
font-size: 1.500em;
padding: 15px 0;
margin: 0;
text-shadow: none;
}
.dropdown-content a:hover span {
display: block;
height: 100px;
width: 100%;
padding: 0;
word-wrap: break-word;
top: -75px;
}
.dropdown-content a span {
display: none;
position: relative;
margin: 0;
padding: 50px;
line-height: 100px;
top: 0;
width: 100%;
height: 100px;
box-sizing: border-box;
}
.ausstattung img {
display: block;
float: left;
padding: 0;
margin: 0;
width: 100%;
margin-right: 0;
margin-bottom: 5%;
padding: 2px;
border-radius: 5px 5px 5px 5px;
background-color: #fcc852;
}
.ausstattung h2 {
display: block;
width: 100%;
margin: 0;
padding: 0 0 25px 0;
padding-left: 0;
line-height: 1.250em;
}
.ausstattung ul {
display: block;
float: left;
width: 100%;
margin: 0;
padding: 0;
padding-left: 0;
}
.ausstattung ul li {
font-size: 1.000em;
}
.hotel ul li {
font-size: 1.000em;
}
/* The container
- needed to position the dropdown content */
.dropdown {
min-height: 370px;
}
}
/*=======================================================================================================*/
@media screen and (max-width: 320px) {
.logo {
width: 100%;
height: 75px;
}
.logo img {
max-width: 100px;
}
#interior article .pic .info {
height: 360px;
}
}