/*-------------------------------------------------------------------
   |    ###    ###                                                      |
   |   #   #  #                                                         |
   |   #   #  #   #                                                     |
   |    ####   ####                                     andreas gross   |
    -------------------------------------------------------------------*/

body{
background-color:#fff;
/*background: url(../img/layout/bg.gif) repeat-x;*/
color:#444;
padding-top:2.5rem;
}

/*
img{
max-width:100%;
height:auto;
}
*/
header{
padding:0.75rem;
font-family: 'Karma', serif;
font-weight:300;
font-size:2rem;
flex:1 1 auto;
}
header a:link, header a:visited, header a:active{
text-decoration:none;
color:#444;
}
header a:hover{
text-decoration:none;
color:#c51919;
}


nav{
padding-top:1.5rem;
font-family: 'Karma', serif;
flex:1 1 auto;
}

main{
padding-top:1.1875rem;
font-family: 'Raleway', sans-serif;
flex:1 1 100%;
text-align: left;
}

.wrapper{
display:flex;
}




nav ul{
  list-style-type:none;
  display:flex;
  flex-direction:column;
  padding-left:0;
  }

nav ul ul{
  padding-left:0.9375rem;
  }

nav li{
  text-align:left;
  padding:0.3125rem 0.3125rem 0.3125rem 0.3125rem;
  margin:0.0625rem;
  }

nav li.active-page-1{
  color:#c51919;
  cursor:default;
}

nav li:hover.active-page-1{
  background-color:none
  cursor:default;
}

nav li:hover.active-page-0{
  background-color:#000000;
  color:#fff;
}



nav li li{
  line-height:0.9375rem;
  margin-bottom:0.3125rem;
  }

nav a:link, nav a:visited, nav a:active{
text-decoration:none;
color:inherit;
}

nav a:hover{
text-decoration:none;
}



/* "rem" mit fallback "px"; Browserdefault in der Regel 16px */
html{
font-size:100%; 
}
h1{
font-size:26px;
font-size:1.625rem;

font-family: 'Karma', serif;
font-weight:300;
font-size:2rem;
}
h2{
font-size:22px;
font-size:1.375rem;
}
body{
font-size:14px;
font-size:0.875rem;
}


@media screen and (min-width:577px) and (max-width:768px)
{
header{flex:0 0 100%;}
nav{flex:1 1 auto;}
main{flex: 1 1 70%;}
.wrapper{flex-wrap:wrap;}
}

@media screen and (max-width:576px)
{
.wrapper{flex-direction:column;}
}



.kolumnen-preview{
margin-bottom:0.9375rem;
}

.kolumnen-preview-img{
width:110px;
}

.left-line{
border-left: 2px dotted #c51919;
padding-left: 0.625rem;
padding-right: 0.625rem;
padding-bottom:0.75rem;
}

.pointer{
cursor:pointer;
}

.hypertext{
text-decoration: underline;
font-weight:bold;
color:#c41615;
cursor:pointer;
}

.striped{
background: repeating-linear-gradient(
  135deg,
  #eee,
  #eee 2px,
  #fff 2px,
  #fff 10px
);
}

/* ++++ Bootstrap +++++++++++++++++++++++++++++ */
.card{
margin-bottom:2px;
}

.card-header{
padding: 0.625rem;
border-bottom: none;
}

/* **** LINKS ********************************* */
a:link,	a:active, a:visited	{text-decoration:underline; color:#444; font-style:normal;}
a:hover	{text-decoration:underline; color:#c41615; font-style:normal;}


/*
   ,
_,,)\.~,,._
(()`  ``)\))),,_
 |     \ ''((\)))),,_          ____
 |6`   |   ''((\())) "-.____.-"    `-.-,
 |    .'\    ''))))'                  \)))
 |   |   `.     ''                     ((((
 \, _)     \/                          |))))
  `'        |                          (((((
            \                  |       ))))))
             `|    |           ,\     /((((((
              |   / `-.______.<  \   |  )))))
              |   |  /         `. \  \  ((((
              |  / \ |           `.\  | (((
              \  | | |             )| |  ))
               | | | |             || |  '*/

/*
See the lightbox documentation http://ashleydw.github.io/lightbox
*/