body { background-color:#000 !important; margin:0 !important; padding:0 !important; overflow:hidden;}

#view-load                  { width:98%;height:1px;display:table;margin:35vh auto 50vh auto;position:absolute;top:0;right:0;bottom:0;left:0;text-align:center;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;}
#view-load > .banner         { width:1280px; max-width: 98%; }
#view-load > .bannerTutorial { width:1280px; max-width: 98%; }
#view-load > .messages      { width:100%; height:16px; margin:10px auto; line-height:16px; display:block; color:#fff; font-style:italic; }
#view-load > .logo          { margin:8px auto; max-height:100px; border: 0px; width:calc(32*(1vw + 1vh - 1vmin)); max-width:35%; }

#view-load #progress        { width: 65%; height:8px; margin:10px auto 10px auto; padding:0; -webkit-border-radius:16px; -moz-border-radius:16px; border-radius:16px; font-size: 14px; }
#view-load #progress_button        { width: 65%; height:8px; margin:10px auto 10px auto; padding:0; -webkit-border-radius:16px; -moz-border-radius:16px; border-radius:16px; font-size: 14px; }
#view-load #progressLevel   {             height:8px; margin:0; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px; }

#view-load #footer             { width:98%; margin:0px; padding:0px; position:fixed; text-align:center; overflow:hidden; bottom:0; height:58px; margin-top:-58px; }
#view-load #footer .powered-by { font-weight:bold; font-style:italic; font-size:80%; text-align:center; }
#view-load #footer .logo       { height:48px; margin:5px 5px; vertical-align:middle; display:inline-block; }

/** CSS - Default */
#view-load.default                               { background-color:#000; color:#fff; }
#view-load.predownload #progressLevel            { width:100%; background-color:#92b3d3; filter:drop-shadow(1px 1px 10px #92b3d3);
                                                  -webkit-animation-name: blink;              /* Safari 4.0 - 8.0 */
                                                  -webkit-animation-duration:1.5s;            /* Safari 4.0 - 8.0 */
                                                  -webkit-animation-iteration-count:infinite; /* Safari 4.0 - 8.0 */
                                                  animation-name: blink;
                                                  animation-duration:1.5s;
                                                  animation-iteration-count: infinite; }
#view-load.default     #progress                 { background-color:#000; border: 1px solid #999; }
#view-load.download    #progressLevel            { background-color:#47a; filter:drop-shadow(1px 1px 10px #47a); }
/* style for a button with background color #47a , filter: drop-shadow(1px 1px 10px #47a); white text and rounded corners*/
#view-load.default     #startButton > button     { background-color:#47a; border: 1px solid #999; filter: drop-shadow(1px 1px 10px #47a); color:#fff; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
#view-load.default     #footer                   { background-color:#000; border-top:1px solid #666; display:block; }
#view-load.default     #footer .powered-by       { color:#999; }
#view-load.default     #footer .powered-by > img { width:auto; max-width:calc(13*(1vw + 1vh - 1vmin)); }

@media only screen and (orientation: portrait) {
    #view-load #footer       { height:52px; margin-top:-52px; }
    #view-load #footer .logo { height:40px; margin:5px 5px; }
    #view-load > .logo       { max-width:60%; }
}
@media only screen and (orientation: landscape) and (max-height:425px) {
    #view-load #footer       { height:52px; margin-top:-52px; }
    #view-load #footer .logo { height:40px; margin:5px 5px; }
    #view-load               { margin-top:0; }
}
@media only screen and (min-width:1280px) {
    #view-load > .logo { max-width:320px; }
}

@-webkit-keyframes blink {
    from   { opacity: 1; }
    to     { opacity: 0; }
}

@keyframes blink {
    from   { opacity: 1; }
    to     { opacity: 0; }
}