/* Reset */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, cite, code,del, dfn, img, ins, kbd, q, s, samp, strike, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, .main-nav, output, ruby, section, summary,time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline;line-height: 100%;}
body {line-height: 1;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table { border-collapse: collapse;border-spacing: 0;}
/* ----------------------------- */
/* ------- HTML Elements ------- */
/* ----------------------------- */
body {font-family: "PT Sans", Helvetica, Arial, sans-serif;color: #7f7d7d;background-color: #FFFFFF;border-top:10px solid #b61926;}
a {color: #b61926;text-decoration: none;outline: none;}
a:focus, a:hover, a:active {text-decoration: underline;}
a.lb {cursor: url('../images/lupe.png'), pointer;}
h1 {margin: 0;font-size: 20px;line-height: 125%;font-weight: 700;color: #000000;}
h2 {margin: 10px 0 0 0;font-size: 16px;color: #000000;font-weight: 400;}
h3 {margin: 20px 0 0 0;font-size: 16px;color: #7f7d7d;font-weight: 400;}
/* ----------------------------- */
/* ------- Basic Classes ------- */
/* ----------------------------- */
.floatleft {float: left;}
.floatright {float: right;}
.clearfloat {clear: both;}
.hidden {display:none;}
/* ----------------------------- */
/* ---- Document Structure ----- */
/* ----------------------------- */
#site-header, #main, footer {width:100%;max-width:1000px;margin:0 auto;}
/* ----------------------------- */
/* ---------- Header ----------- */
/* ----------------------------- */
#logo {width: 306px;height: 114px;margin:20px auto;}
#logo img {width: 100%;height: auto;}
/* ------- Mobile Navigation Toggle ------- */
.off-canvas-nav ul {list-style: none;z-index: 10000;width: 100%;text-align: center;}
.off-canvas-nav ul li a {display: inline-block;font-size: 22px;color: #000;padding: 10px 10px 10px 40px;margin: 20px 0;background: url(../images/menu.png) 5px 7px no-repeat #fff;}
.off-canvas-nav ul li a:hover {text-decoration: none;}
/* ---------- .main-navigation ----------- */
.main-nav ul {display: none;}
.active-nav .main-nav ul {display: block;width: 100%;list-style: none;margin-bottom: 40px;}
.active-nav .main-nav ul li a {font-family: Times, "Times New Roman", serif;display: block;font-size: 24px;background-color: #fff;color: #000;padding: 10px 20px;text-decoration: none;border-bottom: solid 1px #d8d8d8;}
.active-nav .main-nav ul li a:focus,.active-nav .main-nav ul li a:hover,.active-nav .main-nav ul li a:active {background-color: #fff;color: #bf172e;}
.active-nav .main-nav ul ul {margin-bottom: 0;}
.active-nav .main-nav ul ul li a {padding-left: 40px;font-size: 20px;}
/* ----------------------------- */
/* ---------- Content ---------- */
/* ----------------------------- */
article {padding: 20px 20px 40px 10px;}
article p {
margin: 26px 0 0 0;
line-height: 150%;
font-size: 15px;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
font-style:normal;
text-align:justify;
}
article p.intro {font-size:16px;font-weight:700;color:#797878;margin-bottom:30px;}
article a.lb {
cursor: url('../images/lupe.png'), pointer;
}
.content ul,
.content ol {
margin: 26px 0 0 20px;
overflow:hidden;
padding-left: 1.2em;
}
.content ul li,
.content ol li {
font-size: 15px;
line-height: 150%;
margin-top: 7px;
font-style:normal;
}
/* ----------------------------- */
/* ---------- Sidebar ---------- */
/* ----------------------------- */
#sidebar {padding: 20px;margin:30px auto;text-align:center;}
#sidebar h3 {width:232px;background:#cccccc;border-left:solid 4px #b61826;color:#000;font-size:18px;padding:8px 0 10px 14px;font-weight:700;font-family: Times, "Times New Roman", serif;margin:0 auto 14px auto;}
#sidebar p {font-family: Times, "Times New Roman", serif;font-size:16px;line-height:130%;margin-top:8px;color:#000;font-weight:400;}
#sidebar a {color:#000;}
#sidebar a:hover {color:#b61826;text-decoration:underline;}
/* ----------------------------- */
/* ----------- Footer ---------- */
/* ----------------------------- */
footer {clear:both;font-style:normal;padding:7px 10px 40px 10px;margin-top:30px;border-top:solid 1px #b8b8b8;font-family:Verdana, "Trebuchet MS", Segoe, "Segoe UI", "DejaVu Sans", sans-serif;color:#000;}
footer p {text-align:center;margin-top:16px;font-size:16px;}
footer a {color:#000;}
footer a:hover {color:#b61826;text-decoration:underline;}
/* ----------------------------- */
/* --------- Specials ---------- */
/* ----------------------------- */
/* ---------- Google Map ----------- */
.map {
position: relative;
padding-bottom: 50%;
height: 0;
overflow: hidden;
margin-top:0;
}
.map iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* ---------- Slider ----------- */
#slider-container-top {position:relative;width: 100%;}
#slider-container-top .sliderbild {width: 100%;height:314px;display: block;background-size:cover;background-position: 50% 0;}
#slider-container-top .slidertext span {font-family:Times, "Times New Roman", serif; font-size:30px; color:#fff;background: rgba(182,25,39,.7);padding:5px;line-height:200%;box-shadow: 5px 0 0 rgba(182,25,39,0.7), -5px 0 0 rgba(182,25,39,0.7);}
#slider-container-bottom {padding: 0 20px;text-align:center;}
#slider-container-bottom h3 {font-family: Times, "Times New Roman", serif; font-size:18px;color:#000;font-weight:700;margin-bottom:14px;}
#slider-container-bottom img {width:100%; max-width:218px;padding:4px;border:solid 1px #c4c4c4;}
/* ---------- Kontaktformular ----------- */
#kontaktformular {margin-top:20px;}
#kontaktformular label {width:100%;display:block;margin:20px 0 5px 0;}
#kontaktformular input[type="text"] {padding:5px;width:100%;max-width:400px;border-radius:3px;}
#kontaktformular textarea {width:100%;max-width:410px;border-radius:5px;min-height:150px;}
#kontaktformular input[type="submit"] {display:block;width:240px;color:#fff;border:0;padding: 5px 10px;margin:20px 0;font-size:18px;border-radius:5px;background: #b61926;cursor:pointer;font-weight:bold;}
#kontaktformular input[type="button"] {display:block;width:240px;color:#fff;border:0;padding: 5px 10px;margin:20px 0;font-size:18px;border-radius:5px;background: #c4c4c4;cursor:pointer;font-weight:bold;}
#kontaktformular input[type="submit"]:hover {background:#c4c4c4;color:#b61926;}
#kontaktformular input[type="button"]:hover {background:#666666;color:#c4c4c4;}
#kontaktformular p {color:#fff;}
/* ----------------------------- */
/* ------- Media Queries ------- */
/* ----------------------------- */
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 1023px) {
.desktop-only {display:none;}
article img.floatleft {float: none;margin: 20px auto;display: block;}
article img.floatright {float: none;margin: 20px auto;display: block;}
}
@media screen and (min-width: 1024px) {
.mobile-only {display:none;}
article {width:634px;float:left;padding: 36px 100px 40px 10px;}
#sidebar {width:246px;float:right;padding: 40px 10px 40px 0;margin:0;text-align:left;}
#sidebar h3 {margin:0 0 14px 0;}
.off-canvas-nav ul {display:none;}
.main-nav {width: calc(100% - 24px);margin:0 auto 24px auto;border-top:solid 1px #d8d8d8;border-bottom:solid 1px #d8d8d8;text-align:center;}
.main-nav ul {display:block;list-style:none;}
.main-nav li {display:inline;position: relative;}
.main-nav li a {font-family: Times, "Times New Roman", serif; display:inline-block;height:12px;font-size:18px;color:#000;padding:16px 0 20px 0;margin:-1px 16px -1px 16px;border-top:solid 1px #d8d8d8;border-bottom:solid 1px #d8d8d8;}
.main-nav li:last-child a {margin-right:0;}
.main-nav li:hover a {text-decoration:none;border-top:solid 1px #bf172e;border-bottom:solid 1px #bf172e;}
.main-nav li:hover a.white {text-decoration:none;border-bottom:solid 2px #fff;}
.main-nav ul ul {position: absolute;width: 120px; left: 15px; top: 100%; display:none;padding: 0; z-index: 1000;background-color: rgba(0,0,0,.9);margin: 0;padding: 10px 0;}
.main-nav li:hover > ul {display: block;}
.main-nav li:hover li a {display:block;border:none;padding:7px 10px;color:#fff;margin:0;font-size:16px;}
.main-nav li li:hover a {background:#fff;color:#000;}
article img.floatleft {margin: 0 20px 20px 0;}
article img.floatright {margin: 0 0 20px 20px;}
footer p {text-align:left;margin-top:0;font-size:11px;}
.copy {width:50%;float:left;}
.credit {width:50%;float:right;text-align:right;}
#slider-container-top img {width:100%;height:314px;}
#slider-container-top .slidertext {width:490px;position:absolute;bottom:60px;left:calc(50% - 490px);padding:10px;}
#kontaktformular {width: 300px;float:left;}
#kontaktformular input[type="submit"] {clear:both;width:auto;margin:20px 10px;font-size:16px;float:left;}
#kontaktformular input[type="button"] {width:auto;margin:20px 10px;float:right;font-size:16px;}
.map {padding-bottom: 16.35%;}
}