/* ============================================================================================================================================================================== */
/*                                                                                                                                                                                */
/*                                                                   Frank's Theme Basis Layout                                                                                   */
/*                                                                                                                                                                                */
/* ============================================================================================================================================================================== */

/* ============================================================================================================================================================================== */
/* Wordpress Admin Bar: Manuell eingefügte Icons benötigen Abstand von oben                                                                                                       */
/* ============================================================================================================================================================================== */
.ab-icon.dashicons-before{
    top: 4px;
}
/* ============================================================================================================================================================================== */
/* ============================================================================================================================================================================== */
/* allgemeine globale Einstellungen: Zeichensatz (Font), Zeichenfarbe                                                                                                             */
/* ============================================================================================================================================================================== */

/* @import url('http://fonts.googleapis.com/css?family=Kalam'); */
body{
    margin: 0;
    padding: 0;
    font-family: Open Sans, Julius Sans One, Rubik One, Kalam, Arial;
    color: black;
    background-color: #EFEEEE;
    font-family: Arial, Helvetica, sans-serif, Comic Sans MS;
}
a, a:visited{
    text-decoration: none;
    color: black;
}
a:hover{
    text-decoration: underline;
}
ul, ol{
    padding-left: 20px;
}
/* ============================================================================================================================================================================== */
/*                                                                                          Wrapper                                                                               */
/* ============================================================================================================================================================================== */
#wrapper{
    position: relative;
    display: block;
    margin: 0 auto;
    box-sizing: border-box;
    width: 1200px;
}
#wrapper-header{
    position:relative;
    display: block;
    box-sizing: border-box;
}
#wrapper-content{
    position:relative;
    display: block;
    box-sizing: border-box;
}
/* ============================================================================================================================================================================== */
/*                                                                                     Header Bereich                                                                             */
/* ============================================================================================================================================================================== */
#header{
    position:relative;
    display: block;
    box-sizing: border-box;
}
/* ============================================================================================================================================================================== */
/*                                                                                     Main (Content)                                                                             */
/* ============================================================================================================================================================================== */
#main{
    position:relative;
    display: block;
    box-sizing: border-box;
}
/* ============================================================================================================================================================================== */
/*                                                                                    Sidebar oben                                                                                */
/* ============================================================================================================================================================================== */
#sidebar-top{
    position:relative;
    display: block;
    box-sizing: border-box;
}
/* ============================================================================================================================================================================== */
/*                                                                                    Sidebar links                                                                               */
/* ============================================================================================================================================================================== */
#sidebar-left{
    position:relative;
    float: left;
    width: 25%;
    display: block;
    box-sizing: border-box;
}
/* ============================================================================================================================================================================== */
/*                                                                                       Navigation                                                                               */
/* ============================================================================================================================================================================== */
.nav{
    position:relative;
    display: block;
    box-sizing: border-box;
}
/* brauch ma nimmer ???
.nav .menu{
    position:relative;
    display: block;
    box-sizing: border-box;
}
*/
/* ============================================================================================================================================================================== */
/*                                                                                       Content                                                                                  */
/* ============================================================================================================================================================================== */
#content-top{
    position:relative;
    display: block;
    box-sizing: border-box;
}
#content{
    position:relative;
    float: left;
    width: 50%;
    display: block;
    box-sizing: border-box;
}
#content-main{
    position:relative;
}
#content-bottom{
    position:relative;
    display: block;
    box-sizing: border-box;
}
/* ============================================================================================================================================================================== */
/*                                                                                    Sidebar rechts                                                                              */
/* ============================================================================================================================================================================== */
#sidebar-right{
    position:relative;
    float: right;
    width: 25%;
    display: block;
    box-sizing: border-box;
}
/* ============================================================================================================================================================================== */
/*                                                                                    Sidebar unten                                                                                 */
/* ============================================================================================================================================================================== */
#sidebar-bottom{
    position:relative;
    display: block;
    box-sizing: border-box;
}
/* ============================================================================================================================================================================== */
/*                                                                                     Footer                                                                                     */
/* ============================================================================================================================================================================== */
#footer{
    position:relative;
    display: block;
    box-sizing: border-box;
}
/* ============================================================================================================================================================================== */
/*                                                                                     clear                                                                                      */
/* ============================================================================================================================================================================== */
.clear{
    clear: both;
}
/* ============================================================================================================================================================================== */
/*                                                                                     sitemap											  */
/* ============================================================================================================================================================================== */
.sitemap ul{
    padding-left:0;
}
.sitemap ul ul{
    padding-left:20px;
}
.sitemap ul li{
    list-style:none;
}
.sitemap ul li a{
    padding: 2px 4px 2px 4px;
}
/* ============================================================================================================================================================================== */
/*                                                                                     Message Fesnter          								  */
/* ============================================================================================================================================================================== */
#message{
    display: none;
    position: absolute;
    background-color: white;
    text-align: center;
    width: 500px;
    height: 60px;
    line-height: 60px;
    font-size: 125%;
    top: 0px;
    left: 0px;
    box-sizing: border-box;
    border: 1px solid lightgray;
    border-radius: 4px;
    box-shadow: 2px 2px 1px 1px lightgray;
}
/* ============================================================================================================================================================================== */

/* ============================================================================================================================================================================== */
/*                                                                                     Erzeugen Template                                                                          */
/* ============================================================================================================================================================================== */
/*
#header{
    border: 1px solid black;
}
#header:before{
    content: "header";
}
#sidebar-top{
    border: 1px solid black;
}
#sidebar-left{
    border: 1px solid black;
}
#sidebar-left:before{
    content: "sidebar-left";
}
#content{
    border: 1px solid black;
}
#content:before{
    content: "content";
}
#sidebar-right{
    border: 1px solid black;
}
#sidebar-right:before{
    content: "sidebar-right";
}
#sidebar-top:before{
    content: "sidebar-top";
}
#sidebar-bottom{
    border: 1px solid black;
}
#sidebar-bottom:before{
    content: "sidebar-bottom";
}
#footer{
    border: 1px solid black;
}
#footer:before{
}
#footer .left{
    float: left;
    border: 1px solid black;
}
#footer .left:before{
    content: "footer left";
}
#footer .middle{
    float: left;
    border: 1px solid black;
}
#footer .middle:before{
    content: "footer middle";
}
#footer .right{
    float: right;
    border: 1px solid black;
}
#footer .right:before{
    content: "footer right";
}
.nav.horizontal, .nav.vertical{
    display: none;
}
#wrapper{
    margin-top: 10px;
    margin-bottom: 10px;
}
#wrapper-header{
    margin-bottom: 10px;
}
*/


/* ============================================================================================================================================================================== */
/* Blockformate																					  */
/* ============================================================================================================================================================================== */
.left{
    text-align: left;
}
.center{
    text-align: center;
}
.right{
    text-align: right;
}
.justify{
    text-align: justify;
}
.block{
    position: relative;
}
.float-left{
    float: left;
}
.float-right{
    float: right;
}
/* ============================================================================================================================================================================== */
/*                                                                                  Rand                                                                                          */
/* ============================================================================================================================================================================== */
.margin-0{
    margin: 0;    
}
/* ============================================================================================================================================================================== */
/*                                                                                  Rand oben                                                                                     */
/* ============================================================================================================================================================================== */
.mt0{
    margin-top: 0;    
}
.mt5{
    margin-top: 5px;    
}
.mt10{
    margin-top: 10px;    
}
.mt20{
    margin-top: 20px;    
}
.mt30{
    margin-top: 30px;    
}
.mt40{
    margin-top: 40px;    
}
.mt50{
    margin-top: 50px;    
}
.mt60{
    margin-top: 60px;    
}
.mt70{
    margin-top: 70px;    
}
.mt80{
    margin-top: 80px;    
}
.mt90{
    margin-top: 90px;    
}
.mt100{
    margin-top: 100px;    
}
.margin-top-0{
    margin-top: 0;    
}
.margin-top-5{
    margin-top: 5px;    
}
.margin-top-10{
    margin-top: 10px;    
}
.margin-top-20{
    margin-top: 20px;    
}
.margin-top-30{
    margin-top: 30px;    
}
.margin-top-40{
    margin-top: 40px;    
}
.margin-top-50{
    margin-top: 50px;    
}
.margin-top-60{
    margin-top: 60px;    
}
.margin-top-70{
    margin-top: 70px;    
}
.margin-top-80{
    margin-top: 80px;    
}
.margin-top-90{
    margin-top: 90px;    
}
.margin-top-100{
    margin-top: 100px;    
}

/* ============================================================================================================================================================================== */
/*                                                                                  Rand unten                                                                                    */
/* ============================================================================================================================================================================== */
.margin-bottom-0{
    margin-bottom: 0;    
}
.margin-bottom-5{
    margin-bottom: 5px;    
}
.margin-bottom-10{
    margin-bottom: 10px;    
}
.margin-bottom-20{
    margin-bottom: 20px;    
}
.margin-bottom-30{
    margin-bottom: 30px;    
}
.margin-bottom-40{
    margin-bottom: 40px;    
}
.margin-bottom-50{
    margin-bottom: 50px;    
}
.margin-bottom-60{
    margin-bottom: 60px;    
}
.margin-bottom-70{
    margin-bottom: 70px;    
}
.margin-bottom-80{
    margin-bottom: 80px;    
}
.margin-bottom-90{
    margin-bottom: 90px;    
}
.margin-bottom-100{
    margin-bottom: 100px;    
}

.mb0{
    margin-bottom: 0;    
}
.mb5{
    margin-bottom: 5px;    
}
.mb10{
    margin-bottom: 10px;    
}
.mb20{
    margin-bottom: 20px;    
}
.mb30{
    margin-bottom: 30px;    
}
.mb40{
    margin-bottom: 40px;    
}
.mb50{
    margin-bottom: 50px;    
}
.mb60{
    margin-bottom: 60px;    
}
.mb70{
    margin-bottom: 70px;    
}
.mb80{
    margin-bottom: 80px;    
}
.mb90{
    margin-bottom: 90px;    
}
.mb100{
    margin-bottom: 100px;    
}

/* ============================================================================================================================================================================== */
/*                                                                                  Breite                                                                                        */
/* ============================================================================================================================================================================== */
.width-0{
    width:0px;
}
.width-5{
    width:5px;
}
.width-10{
    width:10px;
}
.width-20{
    width:20px;
}
.width-30{
    width:30px;
}
.width-40{
    width:40px;
}
.width-50{
    width:50px;
}
.width-60{
    width:60px;
}
.width-70{
    width:70px;
}
.width-80{
    width:80px;
}
.width-90{
    width:90px;
}
.width-100{
    width:100px;
}
.width-110{
    width:110px;
}
.width-120{
    width:120px;
}
.width-130{
    width:130px;
}
.width-140{
    width:140px;
}
.width-150{
    width:150px;
}
.width-160{
    width:160px;
}
.width-170{
    width:170px;
}
.width-180{
    width:180px;
}
.width-190{
    width:190px;
}
.width-200{
    width:200px;
}
.width-210{
    width:210px;
}
.width-220{
    width:220px;
}
.width-230{
    width:230px;
}
.width-240{
    width:240px;
}
.width-250{
    width:250px;
}
.width-260{
    width:260px;
}
.width-270{
    width:270px;
}
.width-280{
    width:280px;
}
.width-290{
    width:290px;
}
.width-300{
    width:300px;
}
.width-310{
    width:310px;
}
.width-320{
    width:320px;
}
.width-330{
    width:330px;
}
.width-340{
    width:340px;
}
.width-350{
    width:350px;
}
.width-360{
    width:360px;
}
.width-370{
    width:370px;
}
.width-380{
    width:380px;
}
.width-390{
    width:390px;
}
.width-400{
    width:400px;
}
.width-410{
    width:410px;
}
.width-420{
    width:420px;
}
.width-430{
    width:430px;
}
.width-440{
    width:440px;
}
.width-450{
    width:450px;
}
.width-460{
    width:460px;
}
.width-470{
    width:470px;
}
.width-480{
    width:480px;
}
.width-490{
    width:490px;
}
.width-500{
    width:500px;
}
.width-p5{
    width:5%;
}
.width-p10{
    width:10%;
}
.width-p15{
    width:15%;
}
.width-p20{
    width:20%;
}
.width-p25{
    width:25%;
}
.width-p30{
    width:30%;
}
.width-p35{
    width:35%;
}
.width-p40{
    width:40%;
}
.width-p45{
    width:45%;
}
.width-p50{
    width:50%;
}
.width-p55{
    width:55%;
}
.width-p60{
    width:60%;
}
.width-p65{
    width:65%;
}
.width-p70{
    width:70%;
}
.width-p75{
    width:75%;
}
.width-p80{
    width:80%;
}
.width-p85{
    width:85%;
}
.width-p90{
    width:90%;
}
.width-p95{
    width:95%;
}
.width-p100{
    width:100%;
}

/* ============================================================================================================================================================================== */
/*                                                                                  Höhe                                                                                          */
/* ============================================================================================================================================================================== */
.height-0{
    height: 0px;    
}
.height-5{
    height:5px;
}
.height-10{
    height:10px;
}
.height-20{
    height:20px;
}
.height-30{
    height:30px;
}
.height-40{
    height:40px;
}
.height-50{
    height:50px;
}
.height-60{
    height:60px;
}
.height-70{
    height:70px;
}
.height-80{
    height:80px;
}
.height-90{
    height:90px;
}
.height-100{
    height:100px;
}
.height-110{
    height:110px;
}
.height-120{
    height:120px;
}
.height-130{
    height:130px;
}
.height-140{
    height:140px;
}
.height-150{
    height:150px;
}
.height-160{
    height:160px;
}
.height-170{
    height:170px;
}
.height-180{
    height:180px;
}
.height-190{
    height:190px;
}
.height-200{
    height:200px;
}
.height-210{
    height:210px;
}
.height-220{
    height:220px;
}
.height-230{
    height:230px;
}
.height-240{
    height:240px;
}
.height-250{
    height:250px;
}
.height-260{
    height:260px;
}
.height-270{
    height:270px;
}
.height-280{
    height:280px;
}
.height-290{
    height:290px;
}
.height-300{
    height:300px;
}
.height-310{
    height:310px;
}
.height-320{
    height:320px;
}
.height-330{
    height:330px;
}
.height-340{
    height:340px;
}
.height-350{
    height:350px;
}
.height-360{
    height:360px;
}
.height-370{
    height:370px;
}
.height-380{
    height:380px;
}
.height-390{
    height:390px;
}
.height-400{
    height:400px;
}
.height-410{
    height:410px;
}
.height-420{
    height:420px;
}
.height-430{
    height:430px;
}
.height-440{
    height:440px;
}
.height-450{
    height:450px;
}
.height-460{
    height:460px;
}
.height-470{
    height:470px;
}
.height-480{
    height:480px;
}
.height-490{
    height:490px;
}
.height-500{
    height:500px;
}
.height-p5{
    height:5%;
}
.height-p10{
    height:10%;
}
.height-p15{
    height:15%;
}
.height-p20{
    height:20%;
}
.height-p25{
    height:25%;
}
.height-p30{
    height:30%;
}
.height-p35{
    height:35%;
}
.height-p40{
    height:40%;
}
.height-p45{
    height:45%;
}
.height-p50{
    height:50%;
}
.height-p55{
    height:55%;
}
.height-p60{
    height:60%;
}
.height-p65{
    height:65%;
}
.height-p70{
    height:70%;
}
.height-p75{
    height:75%;
}
.height-p80{
    height:80%;
}
.height-p85{
    height:85%;
}
.height-p90{
    height:90%;
}
.height-p95{
    height:95%;
}
.height-p100{
    height:100%;
}
/* ============================================================================================================================================================================== */
/*                                                                                  Bildabmessungen                                                                               */
/* ============================================================================================================================================================================== */
.img-size-p5{
    width:  5%;
    height: 5%;
}
.img-size-p10{
    width:  10%;
    height: 10%;
}
.img-size-p15{
    width:  15%;
    height: 15%;
}
.img-size-p20{
    width:  20%;
    height: 20%;
}
.img-size-p25{
    width:  25%;
    height: 25%;
}
.img-size-p30{
    width:  30%;
    height: 30%;
}
.img-size-p35{
    width:  35%;
    height: 35%;
}
.img-size-p40{
    width:  40%;
    height: 40%;
}
.img-size-p45{
    width:  45%;
    height: 45%;
}
.img-size-p50{
    width:  50%;
    height: 50%;
}
.img-size-p55{
    width:  55%;
    height: 55%;
}
.img-size-p60{
    width:  60%;
    height: 60%;
}
.img-size-p65{
    width:  65%;
    height: 65%;
}
.img-size-p70{
    width:  75%;
    height: 70%;
}
.img-size-p75{
    width:  75%;
    height: 75%;
}
.img-size-p80{
    width:  80%;
    height: 80%;
}
.img-size-p85{
    width:  85%;
    height: 85%;
}
.img-size-p90{
    width:  90%;
    height: 90%;
}
.img-size-p95{
    width:  95%;
    height: 95%;
}
.img-size-p100{
    width:  100%;
    height: 100%;
}
/* ============================================================================================================================================================================== */
/*                                                                                  Fontgröße                                                                                     */
/* ============================================================================================================================================================================== */
.fs50{
    font-size: 50%;
}
.fs60{
    font-size: 60%;
}
.fs70{
    font-size: 70%;
}
.fs80{
    font-size: 80%;
}
.fs90{
    font-size: 90%;
}
.fs100{
    font-size: 100%;
}
.fs110{
    font-size: 110%;
}
.fs120{
    font-size: 120%;
}
.fs130{
    font-size: 130%;
}
.fs140{
    font-size: 140%;
}
.fs150{
    font-size: 150%;
}
.fs160{
    font-size: 160%;
}
.fs170{
    font-size: 170%;
}
.fs180{
    font-size: 180%;
}
.fs190{
    font-size: 190%;
}
.fs200{
    font-size: 200%;
}
.font-size-10,
.font-size-p10{
    font-size: 10%;
}
.font-size-20,
.font-size-p20{
    font-size: 20%;
}
.font-size-30,
.font-size-p30{
    font-size: 30%;
}
.font-size-40,
.font-size-p40{
    font-size: 40%;
}
.font-size-50,
.font-size-p50{
    font-size: 50%;
}
.font-size-60,
.font-size-p60{
    font-size: 60%;
}
.font-size-70,
.font-size-p70{
    font-size: 70%;
}
.font-size-80,
.font-size-p80{
    font-size: 80%;
}
.font-size-90,
.font-size-p90{
    font-size: 90%;
}
.font-size-100
.font-size-p100{
    font-size: 100%;
}
.font-size-110,
.font-size-p110{
    font-size: 110%;
}
.font-size-120,
.font-size-p120{
    font-size: 120%;
}
.font-size-130,
.font-size-p130{
    font-size: 130%;
}
.font-size-140,
.font-size-p140{
    font-size: 140%;
}
.font-size-150,
.font-size-p150{
    font-size: 150%;
}
.font-size-160,
.font-size-p160{
    font-size: 160%;
}
.font-size-170,
.font-size-p170{
    font-size: 170%;
}
.font-size-180,
.font-size-p180{
    font-size: 180%;
}
.font-size-190,
.font-size-p190{
    font-size: 190%;
}
.font-size-200,
.font-size-p200{
    font-size: 200%;
}
.font-size-300,
.font-size-p300{
    font-size: 300%;
}
.font-size-400,
.font-size-p400{
    font-size: 400%;
}
.font-size-500
.font-size-p500{
    font-size: 500%;
}
/* ============================================================================================================================================================================== */
/*                                                                                  Transparenz											  */
/* ============================================================================================================================================================================== */
.opacity-10{
    opacity: 0.10;
}
.opacity-20{
    opacity: 0.20;
}
.opacity-30{
    opacity: 0.30;
}
.opacity-40{
    opacity: 0.40;
}
.opacity-50{
    opacity: 0.50;
}
.opacity-60{
    opacity: 0.60;
}
.opacity-70{
    opacity: 0.70;
}
.opacity-80{
    opacity: 0.80;
}
.opacity-90{
    opacity: 0.90;
}
.opacity{
    opacity: 1.00;
}
/* ============================================================================================================================================================================== */
/*                                                                                  Tabellen											  */
/* ============================================================================================================================================================================== */
/* allgemein */
table{
    border-collapse: collapse;
    width: 100%;    
}
table.w100{
    width: 100%;    
}
table.w90{
    width: 90%;    
}
table.w80{
    width: 80%;    
}
table.w70{
    width: 70%;    
}
table.w60{
    width: 60%;    
}
table.w50{
    width: 50%;    
}
table.w-auto{
    width: auto;    
}
table.center{
    margin: 0 auto;    
}



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