/*
Theme Name: Kavariner 2.0
Description: Theme für kavariner.de
*/

/* =========================  Local Fonts (DSGVO-konform)  =========================  */
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/pt-sans-narrow-latin.woff2) format('woff2'),
       url(fonts/pt-sans-narrow-v19-latin.ttf) format('truetype');
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, strike, strong, 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, nav, output, ruby, section, summary, time, mark, audio, video {
	border: 0;	font-size: 100%; font: inherit; margin: 0; padding: 0; vertical-align: baseline; font-style:normal;}

html { height: 100%;}

html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
}

body { 
	background:url(images/body-noise.png) top left repeat; color: #4f4f4f; font-family:Tahoma, Geneva, sans-serif;
	font-size: 100%; line-height: 1.5em; text-rendering: optimizeLegibility; }





/* =========================  structure =========================  */ 

#wrapper {width:100%; margin:1.5% auto 0 auto; padding:0; text-align:center;  }
#header {margin:0 auto; padding:0 10px; max-width:840px; text-align:left;}
#logo { margin:0; padding:0; min-height:60px; width:100%; max-width:653px; }
#logo img { width:100%; height:auto;}

#logo-separator {width:100%; background:#901C3D; height:2px; margin:-23px 0 8px 0;}

#page {margin:0 auto; padding:0 10px; max-width:840px; text-align:left; }
#content {padding:20px 10px 20px 0; }
#sidebar {padding:10px 0 10px 20px; border-left:1px dotted #ddd; box-sizing:border-box; font-family: 'PT Sans Narrow', Tahoma, Geneva, sans-serif;}

.skyline { background:url(images/skyline.png) bottom center no-repeat; display:block; height:129px; margin:30px 0 0 0; padding:0;}
#footer { width:100%; margin:1px 0 0 0; padding:0; background:#f6f6f6; border-top:2px solid #363636;}
#footer-content { margin:0 auto; padding:0 10px; max-width:840px; text-align:left;}
.bottomline { font-family: 'PT Sans Narrow', sans-serif; text-align:center; font-size:.9em; line-height:1.3em; border-top:1px dotted #ddd; padding:1% 0;}


/* =========================  grid =========================  */ 

.col-940 { width:100%; margin:1% 0;}
.col-ttc { width:65.85744680851%; margin:1.5% 0;}
.col-otc { width:31.714893617021%; margin:1.5% 0;}
.col-ofc { width:23.179255319148%; margin:1.5% 0;}
.col-ohc {width:48.786170212699%; margin:1.5% 0;}

.col-ttc, .col-otc, .col-ofc, .col-ohc, .col-ttc2 {margin-right:2.427659574468%; display: inline; float:left;}

.col-ttc2 { width:62.85744680851%; margin:1.5% 0; }
.col-otc2 { width:34.714893617021%; margin:1.5% 0; display: inline; float:right;}

.cr {margin-right:0 !important;}
.ct {margin-top: 0 !important;}
.cb {margin-bottom: 0 !important;}

.clearfix:before,  
.clearfix:after {content: " "; display: table; }  
.clearfix:after {clear: both; }  
.clearfix {*zoom: 1;}  
.clear { clear:both;}

.separator { width:100%; border-bottom:1px dotted #ddd; height:10px;}
.listing {width:45% !important; }


/* ============= menu ========================== */


#topmenu {width:100%; margin:0; padding:0; background:#901c3d;}

.toggleMenu { display:  none; width:100%;  text-align:left; text-indent:10px; height:32px; line-height:32px; color:#fff; font-size:1.1em; text-transform:uppercase; text-decoration:none;  margin:5px 0 10px 0; background:url(images/nav-icon.png) right no-repeat;}  

.navwrapper { max-width:840px; margin:0 auto; padding:0 10px; }
.nav { width:100%;  font-size: 1em; font-family: 'PT Sans', Arial, sans-serif; text-transform:uppercase; list-style: none; background:url(images/horizontal-line.png) center repeat-x; margin:0; padding:0;
      }
.nav:before,
.nav:after {content: ""; display: table; }
.nav:after {clear: both;}

.nav li {display:inline; float:left; margin:2px 5px; padding:5px 8px; height:36px; background:#901c3d;  }
.nav li a {width:auto; padding:0 10px; display:inline-block; margin:0; color:#fff; line-height:36px;}
.nav li a:hover {text-decoration:none; color:#fff;}
.nav li a:hover {background:#751431; border-radius:3px; box-shadow:0 0 5px #601027 inset; color:#fff;}
.nav li.current-menu-item a, .nav li.current-menu-parent a, .nav li.current_page_parent a {background:#751431; border-radius:3px; box-shadow:0 0 5px #601027 inset; color:#fff;}







/* =========================  font =========================  */ 

a {color:#901c3d; text-decoration:none;}
a:hover {text-decoration:underline;}
p {font-size:1em; margin:0; padding:6px 0 6px 0; }
ul li { font-size:1em;}
h1, h2, h3, h4 { font-family: 'PT Sans Narrow', sans-serif; line-height:1.6em;}
h1 {font-size:1.655em;}
h2 {font-size:1.355em; line-height:1.4em; margin-top:5px; padding:5px 0 0 0;}
h3 {font-size:1.2em; line-height:1.3em; margin-top:5px;}
h4 {font-size:1.1em; line-height:1.3em; margin-top:5px;}
h5 {font-size:1em; font-weight:bold;}
strong {font-weight:bold;}
em {font-style:italic;}

h1.logotitle { font-size:1.8em; line-height:1.1em; margin:0; padding:0;}
h1.logotitle a { color:#4f4f4f;}
h2.logosubtitle {font-size:.9em; line-height:1.2em; margin-left:2px;}
h1.post-title { margin:5px 0 15px 0; border-bottom:1px dotted #ccc;}




/* =========================  page content   =========================  */ 

#homepage-box { padding:10px; margin:0; border:3px double #e2e2e2; background:#fff;}
#homepage-box img {width:100%; height:auto; display:block; }


.headerimage {border:3px double #e2e2e2; padding:0; margin:0; border-radius:2px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.headerimage img {width:100%; height:auto; display:block;}

.gallery {margin:0; padding:10px 0; }
.gallery-item { float:left; margin:5px 15px 10px 0; text-align:center; border-radius:3px; border:2px solid #fff; outline:1px solid #e2e2e2; box-sizing:border-box;}
.gallery img {width:100%; height:100%;}
.gallery-caption {font-size:12px; color:#777; text-align:center; margin:0; padding:0;}


#content table { width:100%; background:#fff; margin:5px 0 25px 0; padding:0; border:1px solid #e5e5e5;  border-radius:2px;  -moz-border-radius:2px; -webkit-border-radius:2px; box-sizing:border-box;}
#content table td { color:#777; border-bottom:1px solid #e5e5e5; font-size:1em; border-top:1px solid #fff; border-right:1px solid #ccc; border-left:1px solid #fff; padding:6px; margin:0;}
#content table td:last-child { border-right:none;}
#content table td:first-child { border-left:none;}
#content table th {padding:6px; font-size:1.1em; line-height:24px; color:#4f4f4f; font-weight:normal; border-bottom:1px solid #e5e5e5; text-align:left; }
#content table tr:last-child td { border-bottom:none;}
#content table tr:nth-child(even) { background:#f5f5f5;}


#content ul { margin:10px 0 15px 15px; padding:0; list-style:none; }
#content ul li { line-height:1.5em;  padding-left:5px; margin:5px 0;  list-style-image:url(images/listbullet.png);}

#content ul.checklist { margin:15px 0 15px 22px; padding:0; list-style:none;}
#content ul.checklist li { line-height:1.5em; padding-left:7px; margin:7px 0;  list-style-image:url(images/listbullet-check.png) ;}


blockquote { background:url(images/quotes.png) top left no-repeat; padding:0 0 0 40px; margin:25px 30px 25px 20px;}
blockquote p { padding:0; margin:0; line-height:1.7em; font-style: italic;}

.alignleft {float:left; margin:7px 25px 10px 0; width:auto; height:auto; }
.alignright {float:right; margin:5px 0 10px 25px; width:auto; height:auto;}
.alignnone {margin:0; padding:0; height:auto;}
p.wp-caption-text {font-size:.85em; font-style:italic;}

img.alignleft {float:left; margin:7px 25px 10px 0; width:auto; height:auto; }
img.alignright {float:right; margin:5px 0 10px 25px; width:auto; height:auto;}
img.alignnone {margin:0; padding:0; height:auto;}

img.alignright, img.alignleft {padding:2px; background:#f6f6f6; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border:2px solid #fff; outline:1px solid #e2e2e2;}

#infoboxen img.alignright {float:right; margin:0 5px 0 10px; width:auto; height:auto; background:none; border:none; outline:none;}



/* =========================  blog page content   =========================  */ 


.post-nav { margin:30px 0 20px 0; padding:3px 0; border-top:1px dotted #ccc; font-size:.85em;}
.nav-previous, .nav-overview { float:left; width:32%; display:block; border:1px solid transparent;}
.nav-next { float:right; width:32%; display:inline-block; text-align:right; border:1px solid transparent;}

.nav-overview { text-align:center;}



.meta-category {margin-top:15px; font-size:.85em; padding:3px 5px; background:#f6f6f6; border-radius:3px;}
.meta-category a {color:#c30000; text-decoration:none;}

.blog-teaser { margin:10px 0 25px 0; padding:0; }
.blog-teaser h2 {font-size:1.2em; margin:0; padding:10px 0 5px 0;}
.blog-teaser h2 a {color:#454545;}
.blog-teaser h2 a:hover {color:#c30000;}
.blog-teaser p {margin:0; padding:0;}
.blog-teaser a.more {font-size:13px; font-style:italic; color:#c00; text-decoration:none;}

.blog-thb { max-width:250px; max-height:165px; float:right; margin:10px 0 6px 15px; padding:3px; background:#f6f6f6; border-radius:3px; box-shadow:#ccc 0px 0px 2px; -moz-border-radius:3px; -moz-box-shadow:#ccc 0px 0px 2px; -webkit-border-radius:3px; -webkit-box-shadow:#ccc 0px 0px 2px; border:2px solid #fff;}
.blog-thb img { width:100%; height:auto;}

.meta {font-size:1em;  }
.meta-single {font-size:.85em; color:#777; margin:0; padding:0 0 3px 0; border-bottom:1px dotted #e2e2e2; }


.archive-meta {margin:5px 0 10px 0; padding-bottom:10px; border-bottom:1px dotted #ccc; font-size:.9em; line-height:1.4em;}

.searchlist-entry {border-bottom:1px solid #ccc; padding:10px 0; margin:10px 0; width:100%;}
.searchlist-entry a { text-decoration:underline;}



/* ======================== comments  ============================ */



#comments {  margin:60px 10px 25px 0; width:100%; padding:20px 0; border-top:1px dotted #ddd;}

ol.commentlist { margin:15px 0 0 0; list-style:none; padding:0; }
ol.commentlist li a { color:#454545; text-decoration:none;}
ol.commentlist li { color:#303030; font-size:1em; line-height:1.6em; border:1px solid #f1f1f1; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;  padding:5px 8px 0 8px; margin:9px 0;}
ol.commentlist li:nth-child(even) { background:#f6f6f6;}
ol.commentlist .commentmetadata { font-size:.9em; }
ol.commentlist .reply { text-align:right; width:100%; font-size:.85em; }
ol.commentlist .reply a {color:#c30000;}
.commentlist .says { display:none;}
.commentlist cite { font-style:normal;}
ol.commentlist li img { float:left; clear:left; border:3px solid #e5e5e5; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; margin:0 25px 5px 0;}
.commentlist ul.children { margin:5px 0 5px 30px;}
.commentlist ul.children li { border:3px solid #e3e3e3; padding:5px 10px 0 10px;}


#respond { margin:35px 0 0 0; padding:0 0 15px 0; background:url(images/icons/pencil.png) top left no-repeat; }
#respond h4 { font-size:1.1em; margin:0px 0 5px 55px; padding:0; font-weight:normal;}
#respond .memberbox { padding:5px 0 0 55px;}
#respond .inputbox { padding:10px 0 0 0;}
#respond .textbox {margin:5px 10px 5px 0;}
#respond label { }
#respond input {  width:240px; padding:3px; margin:2px 0 0 0; border:1px solid #e0e0e0; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; }
#respond textarea {  padding:5px; height:130px; width:100%; margin:0; border:1px solid #e0e0e0; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; box-sizing:border-box;}
#respond #submit {cursor:pointer;font-size:14px;  width:auto; padding:5px 12px; color:#000; border:1px solid #e0e0e0;  background: #f8f8f8;
background: -moz-linear-gradient(top, #f8f8f8 0%, #e0e0e0 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(100%,#e0e0e0));
background: -webkit-linear-gradient(top, #f8f8f8 0%,#e0e0e0 100%);
background: -o-linear-gradient(top, #f8f8f8 0%,#e0e0e0 100%);
background: -ms-linear-gradient(top, #f8f8f8 0%,#e0e0e0 100%);
background: linear-gradient(to bottom, #f8f8f8 0%,#e0e0e0 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#e0e0e0',GradientType=0 ); }
#respond a { color:#454545; text-decoration:underline;}
#respond a:hover { color:#000; text-decoration:underline;}
#respond .memberbox { font-size:1em; margin:5px 0;}

#cancel-comment-reply {float:right; width:100px; margin:-35px 0 0 0; line-height:1.2em; }





/* ======================== store data ============== */


.datatable { border:1px solid #ebebeb; background:#f6f6f6; font-size:.85em;  padding:0; border-radius:4px; margin-top:20px; }
.datatable table { margin:0; padding:0; line-height:1.6em; width:100%; border-spacing:0; }
.datatable table td { padding:7px; border-bottom:1px solid #e1e1e1; border-top:1px solid #fff; vertical-align:top; }
.datatable table td.storevalue { }
.datatable table tr:first-child td { border-top:none !important; }
.datatable table tr:last-child td { border-bottom:none !important; }
.datatable .storelogo {max-width:245px;}
.datatable .storelogo img { width:100%; height:auto; }

.datatable .gallery { width:100%; max-width:245px;  }
.datatable .gallery img { width:100%; height: auto;  }


.tooglestyle {float:right; margin-top:-15px;}
.tooglestyle div {width:29px; height:29px; display:inline-block; margin:0 5px 0 0; cursor:pointer;}

.list-style { background:url(images/icons/list-style.png) top left no-repeat; }
.list-style:hover { background:url(images/icons/list-style2.png) top left no-repeat; }
.box-style { background:url(images/icons/box-style.png) top left no-repeat; }
.box-style:hover { background:url(images/icons/box-style2.png) top left no-repeat; }



.storelist { border-bottom:1px dotted #ccc; border-top:1px dotted #ccc; padding:10px 0;}

.storebox { border:1px solid #ebebeb; padding:7px; border-radius:3px; background:#f6f6f6;
min-height:145px;}
.storebox:hover { border:1px solid #fff; box-shadow:0 0 4px #ddd; cursor:pointer;}
.storebox .storeaddress { border-bottom:1px dotted #ccc; padding-bottom:2px; margin-bottom:3px;}
.storebox p.phone { background:url(images/phone.png) left no-repeat; padding:3px 0 3px 35px; font-size:1em;} 
.storebox h3 { margin:0 0 5px 0; padding:0; font-size:1.2em; line-height:1.15em;}
.storebox a {color:#454545;}
.storebox a:hover {text-decoration:none;}
.storebox:hover h3 {color:#901c3d;}

.listing .storebox {border:none; border-bottom:1px dotted #ebebeb; padding:0 0 3px 0; background:none; min-height:20px;}
.listing .storebox:hover {border:none; border-bottom:1px solid #ccc; box-shadow:none; cursor:pointer;}
.listing .storebox .storeaddress { display:none;}
.listing .storebox p.phone { display:none;} 
.listing .storebox h3 { margin:0; padding:0; line-height:1.1em; font-size:1em;}
.listing .storebox a {color:#454545;}



#content table.timetable { width:100%; background:none; margin:0 0 25px 0; padding:0; border:1px dotted #e5e5e5;  border-radius:2px;  -moz-border-radius:2px; -webkit-border-radius:2px; box-sizing:border-box;}
#content table.timetable td {color:#454545; border-bottom:1px dotted #e5e5e5; font-size:1em; border-right:1px dotted #e5e5e5; padding:6px; margin:0;}
#content table.timetable td:last-child { border-right:none;}
#content table.timetable td.keys { width:35%;}
#content table.timetable td:first-child { border-left:none;}
#content table.timetable tr:last-child td { border-bottom:none;}
#content table.timetable tr:nth-child(even) { background:none !important;}



.swh { margin-bottom:60px;}
#streetview { width:100%; max-width:840px; overflow:auto; height:340px; padding:1px; background:#fff; border:1px solid #ccc; border-radius:3px; }
.images_container{overflow:hidden;} 
.images_container img {max-width:none; margin:0; display:inline-block; float:left;}


#per-slide-template {}
.store-pager { margin-top:110px; padding:0 0 0 30px; }
.store-pager a { margin:0; padding-left:15px; display:inline-block; float:left;  font-size:.7em; color:#444; width:1.25em; white-space:nowrap; line-height:1em; text-align:left; 
-moz-transform:rotate(-50deg);
-webkit-transform:rotate(-50deg);
-ms-transform:rotate(-50deg);
-o-transform:rotate(-50deg);
transform:rotate(-50deg); 
text-align:left; cursor:pointer;}
.store-pager a { background:url(images/bullg.png) top left no-repeat;}
.store-pager a:hover {background:url(images/bull.png) top left no-repeat; text-decoration:none; color:#901c3d;}
.store-pager a.active {color:#901c3d;}
.store-pager span { display:none;}
.cycle-item {  height:320px;  }






.cycle-pager {  }


.cycle-next, .cycle-prev  { height:23px; margin:5px 2px 0 2px; border-radius:3px;  cursor:pointer; }
.cycle-next { padding:7px 0 0 11px; width:19px; float:right;}
.cycle-prev { padding:7px 0 0 8px; width:22px; float:left;}

.cycle-next .narr {margin:0; width: 0px; height: 0px; border-style: solid; border-width: 8.5px 0 8.5px 9px; border-color: transparent transparent transparent #900;}
.cycle-prev .parr {margin:0; width: 0px; height: 0px; border-style: solid; border-width: 8.5px 9px 8.5px 0; border-color: transparent #900 transparent transparent;}

.cycle-prev:hover, .cycle-next:hover {background:#ccc; transition: background 300ms ease-out 0s;}

.changestreet { width:100%; text-align:center; font-size:1em; background:#f6f6f6; border:1px solid #ebebeb; border-radius:3px; padding:3px 0;}
.changestreet a { color:#454545;}
.changestreet a:hover {color:#901c3d;}
.changestreet:hover { box-shadow:0 0 2px #ccc; border:1px solid #fff;}










/* =========================  contactform   =========================  */ 

.contactform { margin:10px 0; padding:0;  }
.contactform label { font-size:.85em; display:block; margin:7px 0 0 0;}
.contactform input {width:100%; border:1px solid #e3e3e3; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; padding:4px 3px; margin:0 0 10px 0; font-family:Verdana, Arial, sans-serif; font-size:1em; box-sizing:border-box;}
.contactform select {width:100%; border:1px solid #e3e3e3; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; padding:4px 3px; margin:0 0 10px 0; box-sizing:border-box;}
.contactform textarea { width:97%; border:1px solid #e3e3e3; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; padding:4px 3px; font-size:1em; box-sizing:border-box;}
.contactform input:focus, .contactform textarea:focus { border:1px solid #999;}

.contactform button { cursor:pointer; color:#fff; margin-top:15px; border:none; font-size:1em;  padding:6px 10px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; background:#901c3d; }


.formcolumn {width:47%; margin-right:3%; float:left;}
.contactForm .error { position:relative;}
.contactform .error {display:block; color:#c00;}


/* =========================  shortcodes   =========================  */ 

.map { width:100%; margin:15px 0; border:2px solid #fff; outline:1px solid #e2e2e2; box-sizing:border-box; border-radius:3px; overflow:hidden;}
.map iframe {width:100%; height:auto }
.map small { font-size:.85em; padding-left:5px;}





/* =========================  sidebar search   =========================  */ 

.searchbox form#searchform { margin:0; padding:0; }
.searchbox input#searchinput {font-family: Verdana, Geneva, sans-serif; border:1px solid #eee; font-size:14px; padding:8px 4px; margin:4px 0 0 0; font-style:italic; width:185px; float:left;  color:#333; border-radius:5px; }
.searchbox .searchbutton { float:right; width:40px; height:40px; padding:0; margin:0; border-radius:40px; background:#ccc url(images/zoom.png); text-align:center; }
.searchbox .searchbutton:hover { background:#901c3d url(images/zoom.png); }
.searchbox input#searchsubmit {border:none; width:40px; height:40px; display:block; padding:0; margin:0;  cursor:pointer; background: none;}









#calendar_wrap {margin:0; position:relative;  }
#wp-calendar {empty-cells: show; margin:0; width: 100%; padding:0; font-size:1em;}
#wp-calendar #next a {text-align: right; background:none; }
#wp-calendar #prev a {text-align: left; background:none;}
#wp-calendar a {display: block; }
#wp-calendar caption {display:none;}

#wp-calendar th {padding: 3px 0; text-align: center;  border:1px solid #ddd; background-color: #f6f6f6; color:#7a7a7c; }
#wp-calendar td {padding:3px; text-align: center; border:1px solid #ddd;	}
#wp-calendar td.pad:hover { background-color: #eee; }




.footer-box { padding-top:10px; color:#363636;  border-right:1px dotted rgba(255,255,255,0.25); }
.nb { border-right:none;}

.footer-box h3.footerboxtitle { margin:0; padding:0 0 10px 0; line-height:1.2em;}

.footer-box ul { margin:5px 0 25px 15px; color:#666; }
.footer-box ul li { font-size:1em; line-height:1.5em; list-style-type:square;}
.footer-box a { color:#666; text-decoration:none;}
.footer-box li a:hover {text-decoration:none; color:#901c3d;}
.footer-box p { margin:0; padding:5px 0; font-size:1em; line-height:1.4em;}
.footer-box p a { text-decoration:underline;}




@media screen and (max-width: 640px)  {
    .active {display: block;}
	.nav { box-shadow:none;}
	.nav > li {float: none; border-bottom:1px solid #ccc; border-right:none; padding:3px 0;}
	.nav li:hover { background:#f6f6f6; }
	.nav > li > a:hover {color:#333 !important;}
	.nav li a:hover, .nav li a:active {color:#333 !important; background:none !important; border:1px solid transparent !important;}
	   
}




/* =========================  media queries   =========================  */ 


@media screen and (max-device-width: 768px) and (orientation: portrait) {
#page {margin:0 auto; padding:0 10px; max-width:800px; text-align:left; }
#header {margin:0 auto; padding:0 10px; max-width:800px; text-align:left;}
.navwrapper { max-width:800px; margin:0 auto; padding:0 10px; }
#footer-content { margin:0 auto; padding:0 10px; max-width:800px; text-align:left;}
.nav li {margin:2px 5px; padding:5px 8px;  }

}

@media screen and (max-width: 800px) {
#page {margin:0 auto; padding:0 10px; max-width:800px; text-align:left; }
#header {margin:0 auto; padding:0 10px; max-width:800px; text-align:left;}
.navwrapper { max-width:800px; margin:0 auto; padding:0 10px; }
#footer-content { margin:0 auto; padding:0 10px; max-width:800px; text-align:left;}
.nav li {margin:2px 5px; padding:5px 8px;  }


}  

/* =========================  */

@media screen and (max-width: 600px) { 

.col-940 { width:100%; margin:1% 0;}
.col-ttc { width:100%; margin:1.5% 0;}
.col-otc { width:100%; margin:1.5% 0;}
.col-ofc { width:100%; margin:1.5% 0;}
.col-ohc {width:100%; margin:1.5% 0;}

.nav {background:none; text-align:left;}
.nav li {display:block; margin:0; padding:5px 0; background:#901c3d; border-bottom:1px solid #751431; text-align:left; }
.nav li a {padding:0; display:block; margin:0; color:#fff; }
.nav li a:hover, .nav li:hover a {text-decoration:none; color:#fff !important; background:none; box-shadow:none; }
.nav li a:hover, .nav li a:active, .nav li a:focus {color:#fff; background:#751431; border-radius:none; box-shadow:0 0 5px #601027 inset; padding-left:10px;}
.nav li:hover {background:#901c3d;}
.nav li.current-menu-item a, .nav li.current-menu-parent a, .nav li.current_page_parent a {background:#751431; border-radius:none; box-shadow:0 0 5px #601027 inset;  padding-left:10px;}

.storebox h3 {font-size:1em;}
.storebox p {font-size:.755em;}
} 

/* =========================  */	

@media screen and (max-width: 480px) { 

.col-940 { width:100%; margin:1% 0;}
.col-ttc { width:100%; margin:1.5% 0;}
.col-otc { width:100%; margin:1.5% 0;}
.col-ofc { width:100%; margin:1.5% 0;}
.col-ohc {width:100%; margin:1.5% 0;}

.col-ttc, .col-otc, .col-ofc, .col-ohc {margin-right:0; display: inline; float:left;}
.listing .storebox h3 {font-size:.855em;}
    
.nav {background:none; text-align:left;}
.nav li {display:block; margin:0; padding:5px 0; background:#901c3d; border-bottom:1px solid #751431; text-align:left; }
.nav li a {padding:0; display:block; margin:0; color:#fff; }
.nav li a:hover {text-decoration:none;}
.nav li a:hover, .nav li a:active, .nav li a:focus {background:#751431;color:#fff; border-radius:none; box-shadow:0 0 5px #601027 inset; padding-left:10px;}
.nav li:hover {background:#901c3d;}
.nav li.current-menu-item a, .nav li.current-menu-parent a, .nav li.current_page_parent a {background:#751431; border-radius:none; box-shadow:0 0 5px #601027 inset;  padding-left:10px;}


.store-pager { margin-top:15px; padding:0 5px;}
.store-pager a { margin:0 15px 0 0; padding-left:15px; float:left;  font-size:.7em; color:#444; width:auto; white-space:nowrap; line-height:1.4em; text-align:left; 
-moz-transform:none;
-webkit-transform:none;
transform:none; text-align:left; cursor:pointer;}
.store-pager a { background:url(images/bull.png) top left no-repeat;}
.store-pager a:hover {text-decoration:none; color:#901c3d;}
.store-pager a.active {color:#901c3d;}

.alignleft {float:none !important; margin:0 0 0 0; max-width:300px;  }
.alignright {float:none !important; margin:0 0 0 0; max-width:300px; }
.alignleft img {width:100%; height:auto; }
.alignright img {width:100%; height:auto;}

  
}  

/* =========================  */

@media screen and (max-width: 320px)  {



.formcolumn {width:100%; margin-right:0; float:none;}



}


/* =========================  Accessibility / Barrierefreiheit  =========================  */

/* Skip-Link */
.skip-link {
  position: absolute;
  top: -100%;
  left: 0;
  background: #901c3d;
  color: #fff;
  padding: 8px 16px;
  z-index: 100000;
  font-size: 1em;
  text-decoration: none;
  border-radius: 0 0 3px 0;
}
.skip-link:focus {
  top: 0;
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* Screen-Reader-Text (visuell versteckt, fuer Screenreader sichtbar) */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  width: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  word-wrap: normal !important;
}
.screen-reader-text:focus {
  clip: auto !important;
  clip-path: none;
  display: block;
  height: auto;
  width: auto;
  position: static !important;
  z-index: 100000;
  background: #fff;
  color: #901c3d;
  padding: 8px 12px;
  font-size: 1em;
}

/* Focus-Styles fuer alle interaktiven Elemente */
a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
.nav li a:focus,
.toggleMenu:focus,
.boxbutton:focus,
.button-red:focus,
#searchsubmit:focus,
.cycle-next:focus,
.cycle-prev:focus {
  outline: 2px solid #901c3d;
  outline-offset: 2px;
}

/* Navigation Focus-Styles */
.nav li a:focus {
  background: #751431;
  border-radius: 3px;
  box-shadow: 0 0 5px #601027 inset;
  color: #fff;
  text-decoration: none;
}

/* Toggle-Buttons (Box/List) Focus */
.tooglestyle button {
  border: none;
  padding: 0;
  cursor: pointer;
}
.tooglestyle button:focus {
  outline: 2px solid #901c3d;
  outline-offset: 2px;
}

/* Timetable th-Styling (jetzt th statt td fuer scope) */
#content table.timetable th.keys {
  width: 35%;
  color: #454545;
  border-bottom: 1px dotted #e5e5e5;
  font-size: 1em;
  font-weight: normal;
  border-right: 1px dotted #e5e5e5;
  padding: 6px;
  margin: 0;
  text-align: left;
}

/* Datatable th-Styling */
.datatable table th {
  padding: 7px;
  border-bottom: 1px solid #e1e1e1;
  border-top: 1px solid #fff;
  vertical-align: top;
  font-weight: normal;
  text-align: left;
  font-size: inherit;
  color: inherit;
}
.datatable table tr:first-child th { border-top: none !important; }
.datatable table tr:last-child th { border-bottom: none !important; }

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}