/*
Theme Name: DSGVO REDL 2.0
Theme URI:https://graphiks.info/
Author:www.graphiks.info
*/

@font-face {
  font-family: "Lato-Regular";
  src: url("./fonts/Lato-Regular.eot"); /* IE9 Compat Modes */
  src: url("./fonts/Lato-Regular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("./fonts/Lato-Regular.otf") format("opentype"), /* Open Type Font */
    url("./fonts/Lato-Regular.svg") format("svg"), /* Legacy iOS */
    url("./fonts/Lato-Regular.ttf") format("truetype"), /* Safari, Android, iOS */
    url("./fonts/Lato-Regular.woff") format("woff"), /* Modern Browsers */
    url("./fonts/Lato-Regular.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}


/*Reset ------------------------------------------------------------------------------------*/
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, small, 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 {margin: 0;padding: 0;border: 0;font-size: 100%;vertical-align: baseline;}body {line-height: 1;}ol,ul {list-style: none;}blockquote,q {quotes: none;}blockquote:before,blockquote:after,q:before,q:after {content: '';content: none;}table {border-collapse: collapse;border-spacing: 0;}caption,th,td {font-weight: normal;text-align: left;}article,aside,details,figcaption,figure,footer,header,hgroup,nav,section {display: block;}audio,canvas,video {display: inline-block;}audio:not([controls]) {display: none;}del {color: #333;}ins {background: #fff9c0;text-decoration: none;}sub,sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}sup {top: -0.5em;}sub {bottom: -0.25em;}small {font-size: smaller;}img {border: 0;-ms-interpolation-mode: bicubic;}

/*HTML Elements
------------------------------------------------------------------------------------*/
* { box-sizing: border-box; outline:none;-webkit-transition:all 500ms ease;-moz-transition:all 500ms ease;-ms-transition:all 500ms ease;-o-transition:all 500ms ease;transition:all 500ms ease;}
html {overflow-y: scroll;}
body {background-color: #212121; font-family:'Lato-Regular', Arial, Helvetica, sans-serif  ;   color: #444; line-height: 1.6em; font-size: 17px; font-weight: 200; }
h2, h3, h4  {font-size:1.3em;line-height:1.4em; text-transform: uppercase; margin-bottom: 15px;  }
.page-title { border-bottom: 2px solid #212121; padding-bottom: 7px; margin-bottom: 25px;}

i {color:#999;}
i.fas, i.fab, i.far  { color:  #37404d; width: 25px;  }
p {margin-bottom:1.3em;}
small	{font-size:0.8em ; } 
hr { background:0;border:1px dotted #ccc; border-width:0 0 2px 0;height: 1px;width:100%;margin:15px 0;}

/*Links*/
a, a:visited {color:#444;text-decoration:underline;} 
a:hover, a:active {color:#999; }
.storycontent a[href*=".pdf"], .storycontent a.external[href*=".pdf"] {background-image:url(pics/PDF.png); background-repeat: no-repeat; background-position: left center;padding:0 0 0 32px;display:block; line-height: 28px;} 
a[href*="tel"] { text-decoration: none;}

/*Layout 
------------------------------------------------------------------------------------*/
.skiplink {position:absolute;left:0;top:-20em;}

#header, #navi, #content {position:relative;width:100%; background: #fff; margin: 0;  }
#headercontent,  #navicontent, #post, #footercontent {position:relative;width:94%;margin:0 auto; min-width:260px;max-width:1300px; }	

/*Header 
------------------------------------------------------------------------------------*/
#header {background: #212121;  height: 75px; color: #fff;   }
#header a, #navi a   { text-decoration: none; }
#headercontent {}

h1 {position:absolute;  z-index: 20;  width: 140px; float: left;}
h1 a {position:absolute;left:0;top:0;width:100%;height:100%;display:block; text-indent:-99999px;z-index:2; }

/*Navigation*/
#navi   {  padding: 0 0 0 175px;background: #212121; font-size: 1.2em;}
#navi, #navi ul   {  }
#navi  li {position:relative; display: inline-block; text-transform: uppercase;  height: 75px; line-height: 75px;   }
#navi a, #navi li a:visited {  text-decoration:none;  color: #fff; border-left: 2px solid #fff; padding: 0 7px;} 
#navi  li:first-child a { border: 0 !important;}
#navi a:hover, änavi a:focus, #navi li a:active  { text-decoration: underline;}
#navi .current-menu-item a, #navi .sub-menu .current-menu-item a {text-decoration: underline;cursor:default; }
#navi .current-menu-item .sub-menu a { cursor: pointer; color: #333 ;}
#navi .current-menu-parent a { color: #666;}
#navi .current-menu-parent a:hover, #navi .current-menu-item .sub-menu a:hover { color: #999;}

#navi ul.sub-menu li { height: auto; line-height: 1.4em; }
#navi ul.sub-menu a, #navi .current-menu-item ul a,#navi .current_page_ancestor ul a { color: #333 ; text-transform: none; letter-spacing: normal;}
#navi ul.sub-menu a:hover, #navi .current-menu-item ul a:hover,#navi .current_page_ancestor ul a:hover { color: #999 ;}
#navi .sub-menu .current-menu-item a {color:#666 !important;cursor:default; }

#navi ul.sub-menu {  position:absolute;   top:40px;   text-align: left; height: 0; overflow: hidden; visibility: hidden; opacity: 0; margin: -20px 0 0 -15px;  }
#navi li:hover ul.sub-menu { height: auto;  visibility: visible; opacity: 1;  -webkit-border-radius: 0 0 3px 3px;border-radius:  0 0 3px 3px;   min-width: 110%; width: auto;  margin:0 0 0 -15px;  }

#navi .sub-menu	li, #navi .menu_item_has_children:hover .sub-menu .menu_item_has_children  {border-width:0 0 1px 0 ; border-bottom-color:  #fff;float:none;font-size: .8em; text-transform: none; margin: 0; padding: 0  15px; -webkit-border-radius:0;border-radius: 0; display: block; height: auto;  line-height: 1.6em; border-bottom: 1px dotted #fff; white-space: nowrap; }
#navi .sub-menu	li:last-child   {-webkit-border-radius: 0 0 5px 5px;border-radius: 0 0 5px 5px; border-bottom: 0;}

#navi .menu_item_has_children .sub-menu a {height: auto;}

.language-switcher { z-index: 30; position: absolute; right: 0; top: 0; height: 75px; line-height: 75px;  }

/*Content 
------------------------------------------------------------------------------------*/
#post {padding:70px 0 30px 0;   }
.storycontent {position: relative; padding: 50px 0; } 

/*Bilder, Videos, Objects, iframes, Captions*/
#post img, .wp-caption, h1 img	{max-width:100%;height:auto;-webkit-border-radius:3px;border-radius:3px;} 
.alignright {margin:0 0 15px 20px;display:inline;float:right;} .alignleft {margin:0 20px 15px 0;display:inline;float:left;} #post .alignleft, #post .alignright	{ max-width:45%;} 
.storycontent a img	{opacity:1;} .storycontent a:hover img	{opacity:.85;}
.centered { text-align: center;}

.video-wrapper { max-width: 650px;}
.video-container { position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden; margin-bottom:10px; border:1px solid #ccc;} .video-container iframe, .video-container object, .video-container embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;} 

/*Listen*/
#post ul  {margin:0;padding:0 0 10px 0;}	
#post ul li {margin:0 0 5px 20px; list-style: disc;} 
#post ol li {margin:0 0 5px 20px;list-style:decimal;}

/*Tabellen*/
table {border:0 none;border-spacing:0;margin:15px 0;} 
table p, table ul { margin-bottom: 3px; padding: 0 !important;}
td, th {padding:2px 25px 2px 0;vertical-align:top;text-align:left;} 
th {font-weight:bold;}


/*sidebar 
-------------------------------------------------------------------*/
#sidebar {position:relative; padding-bottom: 20px; }

/*Footer 
------------------------------------------------------------------------------------*/
#footer { padding:15px 0; margin-bottom: 25px;  color: #fff;}
#footer a,#footer a:visited   { color: #fff;}
#footer a:hover,#footer a:active { color: #ddd;}
.footer-navigation li { display: inline-block; margin:0 7px 12px 0;  }
.footer-navigation li:first-of-type a { padding-left: 0; border: 0;}

/*.Clear*/
#navi ul:after, .wp-pagenavi:before, #header:after, #navi:after, .clear, h1:before, .storycontent .subseiten:before, .storycontent .subseiten:after, hr:before {content: " "; height: 0; clear: both; visibility: hidden;font-size: 0; display:block;}

/*Responsive
-------------------------------------------------------------------------------------------------------*/

@media screen and (min-width:650px) {
    
   
    .storycontent { padding-top: 30px;}
    
}

@media screen and (min-width:900px) {    
    
   
   
    h2 { font-size: 2.5em;}
    #navi a, #navi li a:visited { padding: 0 15px; font-size: 1.1em;}
}
