body, form , h1, h2, p, input, label{
    margin: 0; padding: 0;
    font-family: 'Advent Pro', sans-serif;
    color: #fff;
}

#wrapper{
    width: 100%;
    height: 418px;
    /*background: url('images1/Bg_Page2.jpg');*/
    overflow: hidden;
    position: relative;
    z-index: 9;
    display: none;
}

.inner-wrapper{
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/*Banner*/

#banner{
    background: url('images1/Bg_Page1.jpg'); 
    position: absolute; 
    top: 0;
    left: 0; 
    z-index: 999; 
    width: 100%; 
    height: 100%;
    background-size: 100% 100%;
}

#banner #play{
    position: absolute;
    right: 40px; 
    bottom: 50px; 
    cursor: pointer; 
    z-index: 999;
    background: url('images1/_0000_StartBT.png') no-repeat left;
    width: 230px;
    height: 112px;
}

#banner #play:hover{
    background-position:-229px 0px;
}

#banner .main-title{
    position: absolute;
    top: 0;
    left: 165px;
}

#banner .base-blue{
    position: absolute;   
    bottom: 0;
    left: 0;
}

#banner #explore:hover{
    opacity: 0.8;
}

/* main */

#main{
    background: url('images1/Bg_Page2b.jpg'); 
    position: absolute;
    top: 0;
    left: 0;    
    width: 100%;
    height: 100%;
    display: none;
    background-size: 100% 100%;
}

#main .base-grey{
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 9;
}

#quiz h2{
    line-height: 66px;
    width: 72%;
    margin: 0 auto;
}

#quiz{
    position: relative;
    z-index: 99;
    width: 100%;
    margin: 35px auto;
}
#quiz p{
    font-size: 20px;
}

h2 label{
    font-size: 1em;
    display: block;
}
#quiz p.first {
    top: 115px;
    left: 175px;
}
#quiz p.second{
    left:175px;
    top: 195px;
    display: block;
}
#quiz p.third{
    left: 175px;
    top: 275px;
}
label{
    cursor: pointer;
    font-size: 1.2em;
}
#side {
    position: absolute;
    top: 175px;
    right: 17px;
}

.quiz{
    display: none;
    /* margin-left: 151px; */
    text-align: center;
    margin-top: 0px;
    position: relative;
}

.image{
    display: none;
}


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

#nav{    
    z-index: 999;
}

#nav span{
    width: 170px;
    height: 115px;
    display: inline-block;    
    cursor: pointer; 
    opacity: 0.8;
    bottom: 0px;
    height: 117px;
    position: absolute;
}

#nav .back{    
    float:left;
    background-position:0 0;
    background: url(images1/previous.png);    
    left: 0px;
}

#nav .next{    
    float:right;
    background: url(images1/next.png);
    right: 0px;    
}

#nav .back:hover{
    opacity: 1;
}

#nav .next:hover{
    opacity: 1;
}

/*************************/
/*Radio*/
/************************/

#quiz p{
    position: relative;
    position: absolute;
}

input[type="radio"]+label{
    background: url('images/uncheck.png') left center no-repeat;    
}
input[type="radio"]:checked+label{
    background: url('images/check.png') left center no-repeat;    
    padding-left: 45px;
}
input[type="radio"]{
    opacity: 0;
    position:absolute;
}


/*Fixes*/

/*Result*/

#result{background: url('images/main-bg.jpg'); width: 100%; height: 100%; z-index:999;position: absolute; top: 0; left: 0;text-align: center; display: none;}
#result h2{
    font-size: 60px;
    padding-top: 115px;
    color: red;
    font-weight: bold;
    width: 50%;
    margin: 0 auto;
}
#result h3{
    font-size: 25px;
}

#result1, #result2, #result3{
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;    
    background-size: 100% 100% !important;
}

#result1{
    background: url(images1/Ironman_LastPG.jpg);
}

#result2{
    background: url(images1/Wolverine_LastPG.jpg);
}

#result3{
    background: url(images1/Batman_LastPG.jpg);
}


#result .base{
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 99;
}

#result .emotion{
    position: absolute;
    right: 50px;
    top: 800px;
}


/*Other*/

h2 label{
    color: #fff;
}

#main p label{
    color: #fff;
    display: inline-block;
    line-height: 46px;
    padding: 0 50px;
}

#main p label.selected{
}

.lastImage {
    float: right;
    margin-right: 15px;
    margin-top: 147px;
    text-align: center;
}

.lastImage img{
    display: inline-block;
    max-width: 100%;
    width: 5%;
}
.lastImage_left{
    float: left;
    margin-top: 146px;
    margin-left: 11%;    
}

#result2 .lastImage_left{
    margin-left: 7%;
}
#result3 .lastImage_left{
    margin-left: 8%;
    margin-top: 169px;
}
#quiz .quiz6 h2 label {
    font-size: 1.4em;
}

/*fixes*/
.youaremostlike {
    position: absolute;
    top: 40px;
    left: 58px;
}

.options_div{
    margin-top: 140px;

    position: relative;
}

#share_button{
    position: absolute;
    z-index: 99999;
    left: 3%;
    bottom: 5%;
    border-radius: 14px;
    width: 197px;
    height: 49px;
    color: transparent;
    font-weight: bold;
    background: url(images1/facebook-share.jpg) rgb(43, 43, 211);
}
