@font-face {
    font-family: 'spongeboytt1';
    src: url('../media/fonts/spongeboytt1-webfont.eot');
    src: url('../media/fonts/spongeboytt1-webfont.eot?#iefix') format('embedded-opentype'),
         url('../media/fonts/spongeboytt1-webfont.woff2') format('woff2'),
         url('../media/fonts/spongeboytt1-webfont.woff') format('woff'),
         url('../media/fonts/spongeboytt1-webfont.ttf') format('truetype'),
         url('../media/fonts/spongeboytt1-webfont.svg#spongeboytt1') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Font Awesome';
    src: url('../assets/fonts/fontawesome-webfont.woff');
    font-weight: normal;
}

@font-face {
    font-family: 'bahianaregular';
    src: url('../media/fonts/bahiana-regular-webfont.woff2') format('woff2'),
         url('../media/fonts/bahiana-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


/*--------------------------------------------------------------------------------------------*/

html{
    width:100%;
    height:100%;
    background-color:#000000;
}
body{
    width:100%;
    height:100%;
    padding:0px;
    margin:0px;
}

#main-game-holder{
   width:100%;
   height:100%;
   padding:0px;
   margin:0px;
}

#game-holder{
    overflow:hidden;
    position:absolute;
    left:0;
    top:0;
}

#ie-message-holder{
    width:100%;
    background-color:#fef1c2;
    padding:0;
    margin:0;
}

#ie-message{
    width:1024px;
    height:672px;
    margin:0px auto 0px auto;
    padding-top:20px;
}

#ie-message p{
    font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
    padding:20px 20px 20px 20px;
    text-align: center;
    font-size: 18px;
    padding:0;
}

#rotate-overlay{
    padding:0;
    margin:0;
    display:none;
}


#game-debug-info-area{
    position:absolute;
    z-index:2000;
    top:0;
    left:0;
    padding:5px;
    margin:0;
    font-family: Helvetica, Arial, Sans-Serif;
    font-size:8pt;
    display:block;
    cursor:pointer;
    text-align: left;
    color:#FFFFFF;
}

/*-------------------------------------------------------------------------------------------------------*/



span.gradient {
    content: "";
    height:70px;
    width: 280px;
    position: absolute;
    top: 10px;
    opacity: 0.1;
    transform: rotate(-10deg);
    left: 10px;
    z-index: -1;
    background: -webkit-radial-gradient(center, ellipse cover, rgba(224,28,226,1) 0%,rgba(171,113,229,0) 80%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
    border-radius: 70px;
    
}

.inputWrapper:hover span.gradient {
    opacity: 1;
    transition: 0.3s;
    transform: rotate(0deg);
}

i {
    -webkit-text-stroke: .5px #6e238e; 
}





#file-input:hover::after {
    content: " ";
    position: absolute;
    z-index: 11;


    left: 120%;
    background-color: rgba(255,255,255,.3);
    transition: all .8s;
    transform: rotate(-30deg);
}

i {
    transform: rotate(-10deg);
    transition: all 0.3s;
    text-shadow: -2px 2px #6e238e;
}



#file-input:hover {
    transform: rotate(0deg);

    transition: 0.3; 
    transform: translate(-50%,-50%) scale(1.2);
}

.upload {
    cursor: pointer;
    height: 100%;
    position:absolute;
    top: 0;
    right: 0;
    z-index: 99;
    font-size:50px;
    opacity: 0;
}

/*----------------------------------------------------------------------------------------------------*/

#upload-face-page{
    display:none;
    pointer-events: none;
}

#upload-face-page.active{
    display: block;
    pointer-events: none;   
}

/*----------------------------------------------------------------------------------------------------*/

#parental-approval-page{
    display:none;
    pointer-events: none;
}

#parental-approval-page.active{
    display: block;
    pointer-events: auto;   
    margin-left: 15%;
    margin-right: 15%;
    width: 70% !important;
}

/*----------------------------------------------------------------------------------------------------*/


#scroll-overlay.active{
    display:block;
    pointer-events: auto;
}

#scroll-overlay{
   display:none;
   pointer-events: none;
}