﻿html, body {
    height: 100%;
    width:100%;
    margin:0;
    padding:0;
    background:#fff;

    font-family:'helvetica neue', 'helvetica', Arial, sans-serif;
    font-size:11pt;
    font-weight:300;
}

body {
    overscroll-behavior-y: none;
    position: fixed;
    overflow: hidden;
}


*, *::after, *::before {
    -webkit-user-select: none;
    -webkit-user-drag: none;
    user-select: none;
    user-drag: none;
}

input {
    -webkit-user-select: auto;
    user-select: auto;
}

h1, h2, h3 {
    font-family: 'helvetica neue', 'helvetica', Arial, sans-serif;
}

body.interface-light {
    color: #000;
}

body.interface-dark {
    color: #fff;
}

#PageFrame {
    position:relative;
    height: 100%;
}

#PageHeader, #PageFooter {
    position:absolute;
    height:50px;
    width:100%;
    margin:0;
    padding:0;

    z-index:9000;
}

#PageHeader {
    display: table;
    top:0px;
}

#PageFooter {
    bottom:0px;
    line-height:44px;
    vertical-align:middle;
    padding:2px 0 2px 0;
}

.interface-light #PageHeader, .interface-light #PageFooter, body.interface-light {
    background:#fafaff;
}

.interface-light #PageHeader {
    border-bottom:solid 1px #bebecd;
}

.interface-light #PageFooter {
    border-top:solid 1px #bebecd;
}

.interface-dark #PageHeader, .interface-dark #PageFooter, body.interface-dark  {
    background:#051423;
}

.interface-dark #PageHeader {
    border-bottom:solid 1px #373758;
}

.interface-dark #PageFooter {
    border-top:solid 1px #373758;
}

#SlideFrame 
{
    display:block;
    position:absolute;
    top:50px;
    bottom:50px;
    left:0px;
    right:0px;
    overflow:hidden;
    -webkit-transform: translateZ(0px);
}

.interface-light #SlideFrame {
    background: #dcdce1;
}

.interface-dark #SlideFrame {
    background: #030b13;
}

.titlebar_info, .titlebar_customitems, .titlebar_menu {
    display: table-cell;
    height: 100%;
    margin:0;
    padding:0;
    list-style-type: none;
}

.titlebar_info {
    width: auto;
    white-space: nowrap;
}

.titlebar_customitems {
    width: auto;
    white-space: nowrap;
}

.titlebar_menu {
    width: 1px;
    white-space: nowrap;
}

.titlebar_info li {
    display:block;
    float:left;
    height:100%;
    margin-right:20px;
    list-style-type:none;
    
    cursor:pointer;
}

.titlebar_customitems li, .titlebar_menu li { 
    display:block;
    float:right;
    height:100%;
    margin-right:20px;
    list-style-type:none;
    
    cursor:pointer;
}

.titlebar_menu li {
    margin-left: 30px;
}

.titlebar_info li, .titlebar_menu li {
    width:38px;
    line-height: 48px;
}

.titlebar_info li.titlebar-misctext {
    width: auto;
    padding-top: 13px;
    font-size: 18px;
    font-weight: bold;
    line-height: normal;
}

    .titlebar_customitems li {
        height:42px;
        margin:4px 10px 4px 0;
        padding:0;
    }

        .titlebar_customitems li > * {    
            height:100%;
            width:55px;
        }

.titlebar_info span, .titlebar_buttons span, .titlebar_menu span {
    display:none;
}

.SlideContent
{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    
    overflow:hidden;
}

.interface-light .SlideContent {
    background: #fff;
}

.interface-dark .SlideContent {
    background: #051423;
}

.nav_buttons, .misc_nav_buttons {
    margin:0 10px 0 0;
    padding:0;
    list-style-type:none;
    float:right;

    cursor:pointer;
}

    .nav_buttons li, .misc_nav_buttons li {
        display:block;
        float:left;
        height:44px;
        margin:0 0 0 20px;
        padding:0 20px 0 20px;
        
        font-size:12pt;
        font-weight:bold;
        font-weight:900;
        text-decoration:none;

        list-style-type:none;
        
        color:#fff;

        border-radius:3px;
        background-color: #2f93f7;
    }

    .nav_buttons li.hide, .misc_nav_buttons li.hide {
        display:none;
    }

    .nav_buttons li.press, .misc_nav_buttons li.press {
        background-color: #277ed4;
    }

li.slidenav_hidden {
    display:none;
}

li.course_exit {
    margin-right: 20px;
    background-image: url(../images/bold_fs/interface/icon-chevron-left@1x.png);
    background-size: auto 52%;
    background-position:center center;
    background-repeat:no-repeat;
}

li.course_mainmenu {
    background-image:url(../images/bold_fs/interface/icon-menu@1x.png);
    background-size: auto 52%;
    background-position:center center;
    background-repeat:no-repeat;
}

li.app_nocloud {
    display:none;
    background-image:url(../images/bold_fs/interface/sync_off.png);
    background-size: 100% 52%;
    background-position:center center;
    background-repeat:no-repeat;
}

.offline li.app_nocloud {
    display:block;
}

li.course_title {
    display:none;
}

@media (-webkit-min-device-pixel-ratio:1.5), (-moz-min-device-pixel-ratio:1.5), (-min-device-pixel-ratio:1.5) {

    li.course_exit {
        background-image:url(../images/bold_fs/interface/icon-chevron-left@2x.png);
    }
    li.course_mainmenu {
        background-image:url(../images/bold_fs/interface/icon-menu@2x.png);
    }
    li.app_nocloud {
        background-image: url(../images/bold_fs/interface/sync_off_2x.png);
    }
}

@media (-webkit-min-device-pixel-ratio:2.5), (-moz-min-device-pixel-ratio:2.5), (-min-device-pixel-ratio:2.5) {

    li.course_exit {
        background-image:url(../images/bold_fs/interface/icon-chevron-left@3x.png);
    }
    li.course_mainmenu {
        background-image:url(../images/bold_fs/interface/icon-menu@3x.png);
    }
}

@media (orientation:landscape) and (max-height:600px), (orientation:portrait) and (max-height:800px) {
    
    #PageHeader, #PageFooter {
        height:40px;
    }

    #PageFooter {
        line-height:31px;
    }

    #SlideFrame {
        top:35px;
        bottom:35px;
    }

    .titlebar_info {
        margin-left:5px;
    }

        .titlebar_info li.titlebar-misctext {
            padding-top: 10px;
            font-size: 14px;
            font-weight: bold;
        }

        .titlebar_info li, .titlebar_customitems li, .app_cacheprogress {
            margin-right: 10px;
        }

    .titlebar_customitems li {
        height:31px;
        margin:2px 10px 2px 0;
        padding:0;
    }

        .titlebar_customitems li > * {    
            height:100%;
            width:41px;
        }

    .titlebar_info li, .titlebar_menu li {
        width:27px;
    }

    .titlebar_info li.titlebar-misctext {
        width: auto;
    }

    .nav_buttons li, .misc_nav_buttons li {
        height:31px;
        font-size:11pt;
    }
}

#sys_loadscreen {
    position:absolute;
    top:0px;
    bottom:0px;
    width:100%;
    
    background-color:#fff;
    background-image:-webkit-linear-gradient(top, #f9f9fb 0%, #f2f2f5 100%);
    background-image:-moz-linear-gradient(top, #f9f9fb 0%, #f2f2f5 100%);
    background-image:-ms-linear-gradient(top, #f9f9fb 0%, #f2f2f5 100%);
    background-image:-o-linear-gradient(top, #f9f9fb 0%, #f2f2f5 100%);
    background-image:linear-gradient(top, #f9f9fb 0%, #f2f2f5 100%);

    z-index:10000;
}

    #sys_loadscreen h1 {
        font-size:30pt;
        font-weight:bold;

        text-align:center;
    }

.fy_loadscreen_ctr {
    position:absolute;
    top:30%;
    left:20%;
    width:60%;
}

.fy_loadscreen_large, .fy_loadscreen_small {
    width:100%;
    height:auto;
}

.fy_loadscreen_small {
    display:none;
}

@media (orientation:portrait) and (max-height:600px) {
    .iphone_hidebar #SlideFrame, .iphone_hidebar #sys_loadscreen {
        bottom:-60px;
    }
}

@media (max-width:500px) {
    .fy_loadscreen_large {
        display:none;
    }

    .fy_loadscreen_small {
        display:block;
    }
    #sys_loadscreen h1 {
        font-size:15pt;
    }
}

@media (orientation:portrait) {
    .fy_loadscreen_ctr {
        top:40%;
    }
}

img.preload {
    position:absolute;
    top:-10000px;
    left:0px;
    width:100px;
    height:100px;
}