@import url(http://fonts.googleapis.com/css?family=Permanent+Marker);
/**
 * Template+Stylesheet (c) 2014 svasti@svasti.de
 *
 * Please don't remove this copyright notice.
 *
 * When you build on this template, you may add
 * your own copyright notice.
 * If you sell your modified version, you have to
 * pay 50% of your revenue or at least 25� to svasti
 * per domain.
 *
 * Notice: Content Styles should be shown automatically
 * by TinyMCE Editor. However CKEditor may not show them
 * as long as the stylesheet has "@import url..." in it
 * (CKEditor bug)
 *
 *
 */
/**************************/
/*     Content Styles     */
/**************************/

img.left {
    margin: 0 15px 15px 0;
    float: left;
    clear: left;
}

img.right {
    margin: 0 0 15px 15px;
    float: right;
    clear: right;
}

p.small {
    font-size:80%;
}

p.big {
    font-size:140%;
}
p.narrow {
    margin 0;
    line-height:1.1;
}

div.important, .important {
    clear: both;
    background: rgba(255,255,255,.3);
    padding: 1em 2em;
    border: .3em solid #457;
    margin: 1em 0;
}

div.warning, .warning {
    clear: both;
    background: rgba(255,255,255,.3);
    padding: 1em 2em;
    border: .3em solid #a45;
    margin: 1em 0;
}


.important p:first-child,
.warning p:first-child {
    margin-top: 0;
}
.important p, .warning p {
    margin: 1em 0 0;
}

span.highlight {
    font-weight: bold;
    letter-spacing: .06em;
    color:red;
}

._-_-_-_-_-_-_{}



/*******************/
/*      Start      */
/*******************/

#body {
  background: url(images/wurzeln.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

body {
	font: 16px/1.6 Verdana, Geneva, Arial, Helvetica;
    margin:0;
    padding:0;
}

body.print  {  /* Hintergrund Druckansicht */
    margin:10px;
    background:white;
}
/* Alle Spalteninhalte sollen oben beginnen */
table tr td {
    vertical-align: top;
} 
img {
	border: 0;
}


/*******************/
/*   Seitenkopf    */
/*******************/

.head h1  {
    font: normal normal 0px/0.8 'Permanent Marker', cursive;
	text-align:center;
    color:rgba(255,255,240,.8);
    text-shadow: -4px 4px 0px #000;
    margin:20px 0 30px;
}


/*******************/
/*    Navigation   */
/*******************/

.nav {
    width:100%;
    margin:0 auto 0;
}
.nav ul {
    list-style-type: none;
    margin:0;
    padding:0;
    float:right;
    position:relative;
    right:50%;
}
.nav ul li {
    font-size:11px;
font-weight:bold
    line-height:2.6;
    margin: 0;
    padding: 0 2px;
    background: PaleGoldenrod;
}
.nav ul li span {
    background:#EECCFF;
    padding:8px 14px;
    margin:-9px -14px;
}
.nav ul.menulevel2 li span {
    background:#fec;
    color:#000;
    margin: -7px 0;
    padding: 7px 0;
    display:block;
}

.nav ul li a {
    display:block;
    color:black;
    text-decoration: none;
    border:none;
    margin: 0 -.3em;
    padding: 0 .3em;
}
.nav ul.menulevel1 li a:hover {
    background:#ddd;
    padding:0 14px;
    margin:0 -14px;
}
.nav ul.menulevel1 > li {
	letter-spacing: .1em;
	color: #055;
    border-left:1px solid black;
    border-right:1px solid black;
    float:left;
    margin:4px 0 4px -1px;
    padding: 0 15px;
    white-space: nowrap;
    float:left;
    position:relative;
    left:50%;

}
.nav ul.menulevel1 li > a {
	color: #055;
}
.nav ul.menulevel1 li.sdocs a {
    text-decoration: underline;
}
.nav ul.menulevel1 li ul.menulevel2 li a {
    text-decoration: none;
}
.nav ul.menulevel1 li.sdocs ul.menulevel2 li.sdocs a {
    text-decoration: underline;
}
.nav ul.menulevel1 li.sdocs ul.menulevel2 li.sdocs ul.menulevel3 li a {
    text-decoration: none;
}

.nav ul ul {
    position:absolute;
    visibility: hidden;
    width:180px;
    padding: 1px 0 0;
    margin-top:-1px;
    background:white;
    right:calc(50% - 90px);
}
.nav ul.menulevel1 li ul.menulevel2 {
    z-index:15;
    border:1px solid #aaa;
    border-top:none;
}
.nav ul.menulevel1 li.a ul.menulevel2 {
    left:0;
}
.nav ul.menulevel1 li.b ul.menulevel2 {
    right:0;
}
.nav ul.menulevel1 li ul.menulevel2 li {
    line-height: 1.2;
    border:none;
    width:160px;
    white-space: normal;
    margin: 0;
    padding: 8px 5px 8px 15px;
    position:relative;
}
.nav ul.menulevel1 li ul.menulevel2 li a{
    margin: -8px -5px -8px -15px;
    padding: 8px 5px 8px 15px;
}
.nav ul.menulevel2 li span {
    background:#fec;
    margin: -8px -5px -8px -15px;
    padding: 8px 5px 8px 15px;
    display:block;
}
.nav ul ul ul,
.nav ul .a ul ul {
    top:0;
    left:180px;
    border:1px solid #aaa;
    border-left:none;
}
.nav ul.menulevel1 li.b ul ul {
    left:auto;
    right:180px;
    border:1px solid #aaa;
    border-right:none;
}

.nav ul ul > ul {
    visibility:hidden;
}
.nav li:hover > ul {
    visibility: visible;
}

@media screen and (min-width: 400px) and (max-width: 600px) {
.nav ul.menulevel1 li ul.menulevel2 {
    width:140px;
}
.nav ul.menulevel1 li ul.menulevel2 li {
    width:120px;
}
.nav ul ul ul,
.nav ul .a ul ul {
    left:140px;
    width:140px;
}
.nav ul.menulevel1 li.b ul ul {
    left:auto;
    right:140px !important;
    width:140px;
}
}
 
@media screen and (max-width: 400px) {
.nav ul .a ul ul,
.nav ul.menulevel1 li.b ul ul,
.nav ul ul ul {
    top:0;
    right:auto;
    left:5px;
    z-index:16;
    position:relative;
    margin:8px 0;
    width:180px;
    border:none;
}
.nav ul.menulevel1 li ul.menulevel2 li ul.menulevel3 li {
    position:relative;
    width:145px;
    white-space: normal;
    margin: 0;
    padding: 2px 10px 2px 25px;
}
.nav ul.menulevel1 li ul.menulevel2 li ul.menulevel3 li a{
    margin: -2px -10px -2px -15px;
    padding: 2px 10px 2px 15px;
}
.nav ul.menulevel2 li ul.menulevel3 li span {
    background:#fec;
    margin: -2px -10px -2px -15px;
    padding: 2px 10px 2px 15px;
    display:block;
}
.nav li:hover  ul {
    visibility: visible;
}

} 


/*******************/
/*     Wrapper     */
/*******************/

.wrapper {
    max-width:1500px;
    margin:0 auto;
    text-align: justify;
}


/*******************/
/*      Inhalt     */
/*******************/

#content  {
    max-width:562px;
    background:rgba(255,255,240,.8);
    margin:0 auto;
    padding:10px 30px;
    border-radius: 40px;
    border: 25px solid rgba(0,0,0,0.3);
    -moz-background-clip: padding;
	-webkit-background-clip: padding;
	background-clip: padding-box;
    display:inline-block;
    text-align:left;
    word-spacing:normal;
}
#languagemenu a img.flag{
    text-align:right;
    float:right;
    border:5px solid transparent;
}
#languagemenu a img.flag:hover {
    border-radius: 1em;
    border:5px solid #ffa;
}
p  {
    margin:0 0 1em;
}

h1, h2, h3, h4 {
	font-size: 24px;
	font-weight: normal;
	margin: 10px 0 15px ;
	color:#b33;
    font-family: 'Permanent Marker', cursive;
    letter-spacing: .05em;
    line-height:1;
}
h4 {
    color:#333;
}

h5  {
    font-size: 18px;
    font-weight:bold;
    margin:1.5em 0 .5em;
    color:#050;
    letter-spacing: .05em;
    font-family: Tahoma, sans-serif;
}
h6  {
    font-size: 15px;
    font-weight:bold;
    letter-spacing: .05em;
    margin:12px 0 6px;
	color:#620;
}


/* ========================= */
/* Vorherige / n�chste Seite */
/* ========================= */

#pagenav  {
    width:100%;
}
#pagenav td  {
    padding:0;
    margin:0;
    width:49%;
}
#pagenav td a  {
    display:block;
    text-decoration:none;
    color:#DF0101;
}
#pagenav td a:hover  {
    color:blue;
    background:tansparent;
}
#pagenav .previous {
    text-align:left;
}
#pagenav .next {
    text-align:right;
}
#pagenav .top {
    text-align:center;
}


/* ========================= */
/*          Submen�          */
/* ========================= */

#submenu h4 {
	font: 16px/1.6 Verdana, Geneva, Arial, Helvetica;
    margin:0;
    padding:0;
    color:#666;
}
#submenu ul {
    list-style-type: none;
    margin:0;
    padding:0;
}
#submenu ul li {
    display: inline-block;
    padding-right:-5em;
}
#submenu ul li a {
    text-decoration:none;
    color:#DF0101;
}
#submenu ul li a:hover  {
    color:blue;
    background:transparent;
}


/* ========================= */
/*       Letzte Zeile        */
/* ========================= */

#copyright {
    display:inline-block;
    width:100%;
    word-spacing:normal;
}

#copyright p {
    text-align:center;
    font-size:7pt;
    letter-spacing: 1px;
    margin:0 0 4em;
}
#copyright a  {
    text-decoration:none;
    color:#aaa;
}
#copyright a:hover  {
    color:blue;
    background-color:white;
}


/*******************/
/*     Newsbox     */
/*******************/

.newsbox  {
    max-width:80px;
    background:rgba(0,0,0,.3);
    box-shadow:0px 0px 18px 18px rgba(0,0,0,.3);
    padding:10px 30px;
    border-radius: 40px;
    color:white;
    display:inline-block;
    text-align:left;
    word-spacing:normal;
    vertical-align: top;
}
.newsbox h4,
.newsbox h5,
.newsbox h5 {
    color:#ccc;
}
.bottomleft {
    display:none;
}


/* ========================= */
/*       Responsiveness      */
/* ========================= */

@media screen and (max-width: 1280px) {
#copyright,
#content {
    display:block;
    margin:0 auto;
}
.topleft {
    display:none;
}
.bottomleft {
    display:inline-block;
}
.wrapper {
    text-align:center;
}
}
@media screen and (max-width: 1000px) {
body #content {
    font-size:15px;
}
}@media screen and (max-width: 800px) {
body #content {
    font-size:14px;
}
}
@media screen and (max-width: 500px) {
body {
    font-size:14px;
}
}
@media screen and (max-width: 400px) {
body #content {
    font-size:13px;
}
}