/* 
  keep over revisions -- 
  add ons by johannes 
*/
@import url('https://fonts.googleapis.com/css?family=Archivo+Black');
#presse img { width:inherit; }
.linkback { margin-top:0; position:relative; top:-6px; }
#left #shoutbox { height:auto; padding-bottom:0; }
#left #shoutboxmore { height:auto; }
#left #shoutboxmore a { font-size:16px; }
#left #shoutboxmore div:first-child { margin-bottom:16px; }
#shoutboxmore {
padding-bottom:14px !important;
}
#left #shoutboxmore div:first-child { 
position:relative; top:-5px; 
}
body #wrapper { 
  opacity:1; 
  filter;none;
  transition:all 0.3s ease-in; /* 0.4s ease; */
}
body.bw #wrapper { 
  opacity:0.1; 
  filter:grayscale(50%);
  transition:all 0.5s ease-out; /* 0.1s ease; */
}

@media screen and (min-width: 501px) {
.hidemobile { display:block; }
.hidemobile strong::after {
display: block;
margin-bottom: 1.5em;
content: "";
}
.hidedesk { display:none; }
#centerfold img {
background:none !important;
}
#main .inside {
margin-bottom:0;
}
.mod_navigationMain {
top: 362px;
}
#header .mod_customnav {
border: solid #d8d0c4 2px;
border-top-width:4px;
left:368px;
}
#header .inside {
background-position: 10px 42px !important;
}
#centerfold { top:103px; }
.lunderama p:not(#amaryllis) {
width: 458px; margin: 0 auto 1em; text-align: left; position: relative; left: -8px;
}
.lunderama div p:last-child { 
margin-bottom:0 !important;
}
}

@media screen and (max-width: 500px) {
#footer {
position:absolute;
bottom:0;
}
.hidemobile { display:none; }
.hidedesk { display:block; }
.hidedesk strong::after {
display: block;
margin-bottom: 0.8em;
margin-bottom: 3px; /* 27.11.2017 */
content: "";
}
.napresse .hidedesk strong::after {
margin-bottom: 0.8em;
content: "";
}
.naaktuelles .hidedesk:first-child strong {
margin-left:20px; /* 28.01.2018 */
}

.drivedown { height:8em; height:0; }
.drivedown.d15 { height:12em; height:0; }
.drivedown.d20 { height:16em; height:0; }
.natheaterstuecke .drivedown,
.nalesenhoeren .drivedown { display:none; }

#main > .inside > .hidedesk { padding-top:0 !important; top:-6px; }
html {
  background-color:white;
}
.mdeta div#main {
margin-top:-15px !important;
}
body, html body#top {
  box-sizing:border-box;
  min-height:100vh;
  background:white !important;
  padding-bottom:38px !important;
}
#wrapper #main .inside {
  padding-top:0 !important;
}
body:not(.naautor) #left {
  display:none;
}
#wrapper > img {
  display:none;
}
#header  {
    padding-bottom: 10px !important;
    padding-top: 15px !important;
}
#header .inside {
    background-size: 343px 104px;
    margin-top:23px;
    margin-bottom:26px;
}
#amaryllis a.desktop { display:none; }
#amaryllis a.mobile {display:inline !important; }
#amaryllis a.mobile img { margin-bottom:-18px; margin-top:14px }
#menuToggle input {
  width:36px !important;
  height:36px !important;
  top:7px !important;
  left:10px !important;
}
#menu > a > li {
  font-family: 'Archivo Black', sans-serif !important;
  text-transform:uppercase;
  font-size:18px !important;
  padding:6px 0 !important;
}
#menu > a:first-child > li {
  padding-top:0 !important;
}
#menu {
/* height:calc(100vh - 48px); */
border-bottom:none !important;
padding-top:40px !important;
}
input.text, input.captcha, input.submit, .submit_container input, textarea {
  width:100%;
}
p, form, h1, .linkback {
  padding-left:10px !important;
  padding-right:10px !important;
}
div#header { padding-top:10px; }
#left #shoutbox, #left #shoutboxmore {
  width:auto !important;
  padding:0 !important;
  margin:0 10px !important;
}
#left #shoutboxmore {
border:none !important;
color:#000;
padding-left:10px !important;
text-align:left !important;
}
#presse img { width:46%; margin-left:10px; }
#menuToggle span { background-color:#666 /* important! */; }
body > .mod_navigation.block { 
  background-color: #eaf2fa; 
  box-shadow: inset 0px -10px 5px -10px #CACED2;
  -webkit-box-shadow: inset 0px -10px 5px -10px #CACED2;
  -moz-box-shadow: inset 0px -10px 5px -10px #CACED2;
  -o-box-shadow: inset 0px -10px 5px -10px #CACED2;
}
.linkback { top:-1em; margin-bottom:-1em; }
/*
#left #shoutbox {
height:290px !important;
}
*/
#shoutbox h1 {
margin-top:10px;
}
#shoutbox .ce_text {
margin-bottom:0 !important;
}
#shoutboxmore .block {
padding-bottom:5px !important;
}
#left #shoutboxmore div:first-child { position:relative; top:-5px; }
/*
#left #shoutboxmore a {
font-size:136% !important;
}
*/
#footer,#footer .inside { height:auto; }
#footer p { display:none; }
.naaktuelles #main > .inside > div {
padding: 10px;
margin: 10px;
margin-top: 0px;
}
.naaktuelles #main > .inside > div .ce_text {
margin-bottom:0 !important;
}
.lunderama {
margin-bottom:-10px;
}
.lunderama p:not(#amaryllis) {
width: 458px; margin: 0 auto; text-align: left; position: relative; left: -8px;
}
.lunderama div p:nth-child(2) {
    margin-top: 10px !important;
}
.lunderama div p:last-child {
    margin-bottom: 15px !important;
}
}
@media screen and (max-width:322px) {
#menu { padding-top:30px !important; }
#menu > a > li {
padding:4.6px 0 !important;
}
#menuToggle {
padding-top:10px !important;
padding-left:10px !important;
padding-bottom:10px !important;
}
}

/* done revisions */

/* start revisions after june 1, 17 */
.naaktuelles #main > .inside > div .ce_headline, 
.naaktuelles #main > .inside > div .ce_text p,
#left #shoutbox .ce_headline, 
#left #shoutbox .ce_text p, 
#left #shoutbox .mod_downloadarchiv,
.naaktuelles #main > .inside > div .ce_text a,
.mod_article a, .linkback a {
    font-size: inherit;
    font-size: 16.1px;
}
strong {
font-size:106%; /* 17px */
}
body, p, ul, td, input, select, textarea {
line-height:26px;
}


/*
 * Start Ermin
 */

nav.hide-on-desktop {
  display:none;
}

/*
 * Mobile styles
 */
@media screen and (max-width: 500px) {
img {
    max-width: 100%!important;
    left: 0!important;
    z-index: 1!important;
}
#header .inside {
    width: 995px;
    height: 400px;
    background-image: url(/tl_files/elements/jan-kamikaze-bd.png);
    background-repeat: no-repeat;
    background-position: 7px -3px!important;
}
div#wrapper {
    max-width: 100%!important;
    display: block;
    margin: 0;
}
div#header {
    max-width: 100%!important;
    clear: both;
    height: auto!important;
    left: 0!Important;
}
body#top {
    max-width: 100%!important;
    width: 100%!important;
    top: 0!important;
    padding: 0!important;
}
div#container {
    max-width: 100%;
    left: 0!important;
}
.mod_randomImage.block#centerfold {
    max-width: 100%;
    position: relative!important;
    clear: both;
    width: 100%!important;
    left: 0!important;
}
.image_container {
    max-width: 100%;
}
.mod_navigation.mod_navigationMain.block {
    max-width: 100%;
}
ul.level_1 {
    max-width: 100%;
    display: none;
}
li.active.naautor.first {
    max-width: 100%;
    display: inline-block;
}
span.active.naautor.first {
    max-width: 100%;
    padding: 0!important;
}

.inside {
    max-width: 100%;
    padding: 0!important;
}
.level_1 li {
    clear: both;
    height: auto;
}
.mod_navigation.mod_navigationMain.block {
    height: auto!important;
}
.mod_customnav.block {
    width: auto!important;
    position: relative!Important;
    max-width: 100%;
    left: 0!important;
}

div#centerfold {
    height: auto!important;
}

.image_container img {
    height: auto;
    width: 100%;
}
#header .inside {
    display: inline-block;
    height: auto;
    position: relative;
}

div#container {
    clear: both!important;
}

.mod_navigation.mod_navigationMain.block {
    position: relative!Important;
    top: inherit!important;
    padding: 0!Important;
}
div#left {
    width: 100%;
}

div#shoutbox {
    max-width: 100%!Important;
    padding: 0px!important;
    margin: 0 auto!Important;
}
div#main {
    margin: 0!important;
    display: inline-block;
    width: 100%;
}

#main .inside {
    margin: 0!important;
    padding: 10px 0px!important;
}
p {
    max-width: 100%;
    padding: 10px!important;
    left: 0!important;
}

div#footer {
    max-width: 100%!important;
    left: 0!important;
}

div#fusszeile {
    max-width: 100%;
    height: auto!important;
    padding: 5px 0px!Important;
    width: 100%!Important;
    margin: 0 auto;
    bottom: 0!Important;
    text-align: center;
    position: relative;
}
div#shoutboxmore {
    text-align:center!important;
    display:block!important;
    margin:0 auto!important
}
#left #shoutboxmore div:first-child { 
margin-bottom:5px; 
}
/*
 * Made by Erik Terwan
 * 24th of November 2015
 * All rights reserved
 *
 *
 * If you are thinking of using this in
 * production code, beware of the browser
 * prefixes.
 */

body
{
  margin: 0;
  padding: 0;
  
  /* make it look decent enough */
  background: #232323;
  color: #cdcdcd;
  font-family: "Avenir Next", "Avenir", sans-serif;
}

#menu a
{
  text-decoration: none;
  color: #424242;
  transition: color 0.3s ease;
}

a:hover
{
  color: tomato;
}

#menuToggle
{
  display: block;
  position: relative;
  z-index: 1;
  -webkit-user-select: none;
  user-select: none;
  padding-top: 15px;
  padding-left: 15px;
  padding-bottom: 15px;
}

#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}
              
            
/*
 * Just a quick hamburger
 */
#menuToggle span
{
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;
  
  background: #cdcdcd;
  border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

/* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  /* background: #ffffff; */
}

/*
 * But let's hide the middle one.
 */
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * Ohyeah and the last one should go the other direction
 */
#menuToggle input:checked ~ span:nth-last-child(2)
{
  opacity: 1;
  transform: rotate(-45deg) translate(0, -1px);
}

/*
 * Make this absolute positioned
 * at the top left of the screen
 */
#menu
{
  position: absolute;
  width: 100%;
  margin: 0;
  left: 0;
  padding-top: 49px;
  background: #ebe5da;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  /* to stop flickering of text in safari */
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  /* transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0); */
  transition: transform 0.3s linear;
  border-bottom: 2px solid Black;
}

#menu li
{
  padding: 10px 0;
  font-size: 22px;
  text-align: center;
  padding-bottom: 11px!important;
  border-bottom: 1px solid #8a8787;
  font-family: 'Anton', sans-serif;
  color: #652e00!important;
}

/*
 * And let's fade it in from the left
 */
#menuToggle input:checked ~ ul
{
  transform: scale(1.0, 1.0);
  opacity: 1;
}
nav.hide-on-desktop {
  display: block;
}
a#egg {
    display: none!Important;
}
.mod_customnav.block {
    display: none;
}
div#centerfold {
    margin-bottom: 99px!important;
}

map {
    /* display: none!important; */
}

#left #shoutbox .ce_headline, #left #shoutbox .ce_text p, #left #shoutbox .mod_downloadarchiv {
    font-size: 100%!important;
    color:#333;
}

div#shoutboxmore {
    margin: 0!important;
    width: 330px!important;
    padding: 14px 0px!important;
    border-top: 1px solid black;
    height: auto!important;
    background-color: #ebe5da!important;
    margin: 0 auto!Important;
    display: block;
    max-width: 100%!Important;
}

.mod_randomImage .image_container {
    display: none;
}
.mod_navigation.block {
    overflow: visible;
}
}

