/*==================================================
 * CREDITS
 * ===============================================*/
#credits_wrap {
position: absolute;
top:0;
right:0;
bottom:0;
left:0;
display: none;
opacity:0;
transition: all .5s ease-in;
background-size:cover;
z-index:0;
background: linear-gradient(to top, #5c308c, #e88f32);
}

#credits_left {
position:absolute;
top:1px;
left:30px;
padding: 5px 2px 0 3px;
width:34%;
height:375px;
opacity:0;
transition: all .5s ease-in;
}

#credits_middle {
position:absolute;
top:1px;
padding: 5px 2px 0 3px;
left:295px;
width:25%;
height:375px;
opacity:0;
transition: all .5s ease-in;
}

#credits_right {
position:absolute;
top:1px;
padding: 5px 2px 0 3px;
left:530px;
width:25%;
height:375px;
opacity:0;
transition: all .5s ease-in;
}

.credits_title {
position:relative;
float:left;
padding:5px 0 5px 0;
font-family: 'Oleo Script', cursive;
font-size:32px;
color:rgb(62, 209, 43);
text-shadow: 0 0 2px #999;
-webkit-font-smoothing: antialiased;
}

#credits_screen p {
position:relative;
float:left;
/*padding:10px;*/

font-family: 'Overpass Mono', monospace;
font-size: 13px;
color:rgb(209, 137, 43);
font-weight:500;
-webkit-font-smoothing: antialiased;
}

.credits_text {
color:rgb(62, 209, 43) !important;
margin-top:-10px !important;
}


#credits_screen {
position: absolute;
top: 50px;
left:50vw;
width: 700px;
height: 375px;
margin: 0 0 30px -430px;
padding: 18px;
border: 45px inset #9e929e;
border-radius: 10px 10px 10px 10px;
background-color: #242226;
z-index: 222;
}



/* FACEPLATE ANIMATIONS */

#credits_faceplate {
position: absolute;
top: 70px;
left:50vw;
width: 960px;
height: 690px;
margin-top: -90px;
margin-left: -505px;
border: 20px solid #111;
border-radius: 10px 10px 10px 10px;
background-color: #777;
box-shadow: 1px -1px 6px 2px #fff,
            -1px -1px 6px 2px #fff;
z-index: 111;
}


#credits_faceplate_buttons {
position: absolute;
top: 590px;
left: 638px;
width: 300px;
height: 100px;
}

#faceplate_light_panel {
position: absolute;
top: 32px;
left: 232px;
width: 51px;
height: 23px;
border: 4px inset #666;
box-shadow: -1px -1px 1px 0px rgb(0, 0, 0);
}

#faceplate_light {
position: absolute;
top: 0px;
left:0px;
width: 51px;
height: 23px;
background-color: rgb(224, 32, 32);
box-shadow: 1px -1px 2px 2px rgb(224, 32, 32)
}


#facleplate_circle_light0 {
top:42px;
left:122px;
}

#facleplate_circle_light1 {
top:42px;
left:140px;
}

#facleplate_circle_light2 {
top:42px;
left:158px;
}

#facleplate_circle_light3 {
top:42px;
left:176px;
}

.faceplate_circle_light {
position:absolute;
width:10px;
height:10px;
background-color:#a83030;
border: 2px inset #bdaebd;
border-radius:50%;
}


.faceplate_circle_light_on {
background-color: #15d615;
box-shadow: 0 0 4px #15d615, 0 0 5px #fff, 0 0 6px #fff;  
}






#credits_screen:before {
content: " ";
position: absolute;
top: -23px;
left: -23px;
right: -23px;
bottom: -23px;
border: 10px double #232323;
border-radius: 10px 10px 10px 10px;
z-index:222;
}

#credits_screen:after {
content: " ";
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
border: 10px inset #444;
z-index:222;
}

#scanlines {
position:absolute;
top:106px;
left:50vw;
margin: 0 auto 0 -376px;
width:716px;
height:388px;
z-index: 1666;
background: linear-gradient(#444 50%, #000 50%);
background-size: 200% 4px;
background-repeat: repeat-y;
opacity: .14;
box-shadow : inset 0px 0px 1px 1px rgba(0, 0, 0, .8);
animation: pulse 5s linear infinite;
}

@keyframes pulse {
  0%   {transform: scale(1.001);  opacity: .14; }
  8%   {transform: scale(1.000);  opacity: .13; }
  15%  {transform: scale(1.004);  opacity: .14; }
  30%  {transform: scale(1.002);  opacity: .11; }
  100% {transform: scale(1.000);  opacity: .14; }
}

.bg_credits {
background-size:cover;
z-index:0;
background:url(../../img/bg/bg_stars_dark.png);
background-color: #000;
}

.letter_credits {
font-family: 'Overpass Mono', monospace;
font-size: 18px;
color:#F1EFF7;
font-weight:500;
-webkit-font-smoothing: antialiased;
}


/* FLICKER THIS WITH THE ZALGO EFFECT

#terminal0_cover_bground {
position:absolute;
background-color: #323232;
top:23px;
width:900px;
height:479px;
z-index:222;
}

#terminal0_cover_shadow{
position:absolute;
top:23px;
width:900px;
height:479px;
box-shadow:inset 0px 0px 20px 0px rgba(0,0,0,1);
z-index:444;
}
*/