body,div,span,button,select,img,label {
    -webkit-user-select: none;
    -webkit-user-drag:  none;
    -moz-user-select: none;
    -moz-user-drag:  none;
    outline:0;
}

body
{
    background-color: #2F2727;
}

.all
{
    position: absolute;
    width:  1250px;
    height: 820px;
    top: 0px;
    left: 0px;
    overflow: auto;
    visibility: visible;
    background-color: #BCFB3F;
     /* Safari 4-5, Chrome 1-9 */ /* Can't specify a percentage size? Laaaaaame. */ 
     background: -webkit-gradient(radial, center center, 0, center center, 400, from(#1a82f7), to(#2F2727)); 
     /* Safari 5.1+, Chrome 10+ */ 
     background: -webkit-radial-gradient(circle, #1a82f7, #2F2727); 
     /* Firefox 3.6+ */ 
     background: -moz-radial-gradient(circle, #1a82f7, #2F2727); 
     /* IE 10 */ 
     background: -ms-radial-gradient(circle, #1a82f7, #2F2727);
}

.antwort, .joker{
    position: absolute;
    height: 70px;
    width: 400px;
    border: 2px solid transparent;
    font-size: 24px;
    color: #000000;
    text-align: center;
    padding-top: 10px;
    visibility: visible;
}

.frage{
    position: absolute;
    height: 110px;
    width: 750px;
    border: 2px solid transparent;
    font-size: 28px;
    color: #000000;
    text-align: center;
    padding-top: 20px;
}

.antBgUnten{
    position: absolute;
    height: 0px;
    width: 400px;
    border-left: 20px solid transparent; 
    border-right: 20px solid transparent;
    border-top-width: 40px;
    border-top-style: solid;
    border-top-color: #4b3efa;
    visibility: visible;
}
.antBgOben{
    position: absolute;
    height: 0px;
    width: 400px;
    border-left: 20px solid transparent; 
    border-right: 20px solid transparent;
    border-bottom-width: 40px;
    border-bottom-style: solid;
    border-bottom-color: #4b3efa;
    visibility: visible;
}

.antBgUnten1{
    position: absolute;
    height: 0px;
    width: 400px;
    border-left: 20px solid transparent; 
    border-right: 20px solid transparent;
    border-top-width: 40px;
    border-top-style: solid;
    border-top-color: #000;
    visibility: visible;
    opacity:0.4;
    filter:alpha(opacity=40);
}
.antBgOben1{
    position: absolute;
    height: 0px;
    width: 400px;
    border-left: 20px solid transparent; 
    border-right: 20px solid transparent;
    border-bottom-width: 40px;
    border-bottom-style: solid;
    border-bottom-color: #000;
    visibility: visible;
    opacity:0.4;
    filter:alpha(opacity=40);
}

.frageBgOben1{
    position: absolute;
    height: 0px;
    width: 750px;
    border-left: 24px solid transparent; 
    border-right: 24px solid transparent;
    border-bottom-width: 60px;
    border-bottom-style: solid;
    border-bottom-color: #000;
    opacity:0.4;
    filter:alpha(opacity=40);
}
.frageBgUnten1{
    position: absolute;
    height: 0px;
    width: 750px;
    border-left: 24px solid transparent; 
    border-right: 24px solid transparent;
    border-top-width: 60px;
    border-top-style: solid;
    border-top-color: #000;
    opacity:0.4;
    filter:alpha(opacity=40);
}

.stufeBgUnten1{
    position: absolute;
    height: 0px;
    width: 200px;
    left: 1005px;
    border-left: 10px solid transparent; 
    border-right: 10px solid transparent;
    border-top-width: 20px;
    border-top-style: solid;
    border-top-color: #000;
    visibility: visible;
    opacity:0.4;
    filter:alpha(opacity=40);
}
.stufeBgOben1{
    position: absolute;
    height: 0px;
    width: 200px;
    left: 1005px;
    border-left: 10px solid transparent; 
    border-right: 10px solid transparent;
    border-bottom-width: 20px;
    border-bottom-style: solid;
    border-bottom-color: #000;
    visibility: visible;
    opacity:0.4;
    filter:alpha(opacity=40);
}

.frageBgOben{
    position: absolute;
    height: 0px;
    width: 750px;
    border-left: 24px solid transparent; 
    border-right: 24px solid transparent;
    border-bottom-width: 60px;
    border-bottom-style: solid;
    border-bottom-color: #4b3efa;
}
.frageBgUnten{
    position: absolute;
    height: 0px;
    width: 750px;
    border-left: 24px solid transparent; 
    border-right: 24px solid transparent;
    border-top-width: 60px;
    border-top-style: solid;
    border-top-color: #4b3efa;
}

.eingelockta{
    border-bottom-color: #fea60c;
}

.eingelocktb{
    border-top-color: #fea60c;
}

.falscha{
    border-bottom-color: #fe161b;
}

.falschb{
    border-top-color: #fe161b;
}

.richtiga{
    border-bottom-color: #06fe63;
}

.richtigb{
    border-top-color: #06fe63;
}

.fivtyfivty{
    visibility: hidden;
}

.stufeBgUnten{
    position: absolute;
    height: 0px;
    width: 200px;
    border-left: 10px solid transparent; 
    border-right: 10px solid transparent;
    border-top-width: 20px;
    border-top-style: solid;
    border-top-color: #4b3efa;
    visibility: visible;
}
.stufeBgOben{
    position: absolute;
    height: 0px;
    width: 200px;
    border-left: 10px solid transparent; 
    border-right: 10px solid transparent;
    border-bottom-width: 20px;
    border-bottom-style: solid;
    border-bottom-color: #4b3efa;
    visibility: visible;
}

.stufeOben{
    position: absolute;
    height: 0px;
    width: 200px;
    border-left: 10px solid transparent; 
    border-right: 10px solid transparent;
    border-bottom-width: 20px;
    border-bottom-style: solid;
    visibility: visible;
    border-bottom-color: #fea60c;
}

.stufeUnten{
    position: absolute;
    height: 0px;
    width: 200px;
    border-left: 10px solid transparent; 
    border-right: 10px solid transparent;
    border-top-width: 20px;
    border-top-style: solid;
    visibility: visible;
    border-top-color: #fea60c;
}

.stufe{
    position: absolute;
    height: 10px;
    width: 200px;
    border: 2px solid transparent;
    font-size: 24px;
    color: #000000;
    text-align: center;
    padding-top: 5px;
    visibility: visible;
}

.jokerBg{
    position: absolute;
    height:90px;
    width:180px;
    border-radius: 90px / 45px;
    -moz-border-radius:90px / 45px;
    -webkit-border-radius: 90px / 45px;
    border: 5px solid #fea60c;
    background: #4b3efa;
}

.jokerBg1{
    position: absolute;
    height:90px;
    width:180px;
    border-radius: 90px / 45px;
    -moz-border-radius:90px / 45px;
    -webkit-border-radius: 90px / 45px;
    border: 5px solid #000;
    background: #000;
    opacity:0.4;
    filter:alpha(opacity=40);
}

.kreis {
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #000
}

.dreieck {
    position: absolute;
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-bottom-width: 40px;
    border-bottom-style: solid;
    visibility: visible;
    border-bottom-color: #000;
}

.dialog{    
    position: absolute;
    height: 110px;
    width: 778px;
    border: 15px solid gray;
    font-size: 28px;
    color: #000000;
    text-align: center;
    padding-top: 20px;
    border-radius: 10px;
    background: -webkit-radial-gradient(#E6E6E6, #FAFAFA); /* Safari */
    background: -o-radial-gradient(#E6E6E6, #FAFAFA); /* For Opera 11.1 to 12.0 */
    background: -moz-radial-gradient(#E6E6E6, #FAFAFA); /* For Firefox 3.6 to 15 */
    background: radial-gradient(#E6E6E6, #FAFAFA); /* Standard syntax */
}

nav {
    width: 960px;
    position: absolute;
    top: 200px;
}
nav ul {
    padding: 0px;
    margin: 0px;
}
nav ul:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
}
    nav ul,nav ul li{
    background-color: #FAFAFA;
}
    nav ul li {
    list-style: none;
    float:left;
}
nav ul li a {
    text-decoration: none;
    display: block;
    color: #333;
    padding: 14px 34px 14px 34px;
}
nav ul li:hover > ul {
    visibility: visible;
}
nav ul li ul{
    display: inline;
    visibility: hidden;
    position: absolute;
    padding:0px;
}
nav ul li ul li{
    float: none;
}
nav ul li ul li a:hover{
    color: #333;
}