/* Minification failed. Returning unminified contents.
(2,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(48,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(49,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1899,14): run-time error CSS1062: Expected semicolon or closing curly-brace, found ':'
(5639,21): run-time error CSS1062: Expected semicolon or closing curly-brace, found ':'
(6109,1): run-time error CSS1019: Unexpected token, found '}'
(6779,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(6780,14): run-time error CSS1035: Expected colon, found '{'
(7200,28): run-time error CSS1039: Token not allowed after unary operator: '-embibe-blue'
 */
:root {
  --embibe-blue: #50B7E8;
  --Lato-font-name:'Lato';
}

html{
    background-color: #ffffff;
}

@font-face {
    font-family: 'Lato';
    font-weight: 100;
    font-style: normal;
    font-display: swap;
    src: local('Lato'), url(/funtoot/app/ext/fonts/Lato/Lato-Black.ttf) format('truetype');
}
@font-face {
    font-family: 'Lato';
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: url(/funtoot/app/ext/fonts/Lato/Lato-Regular.ttf) format('truetype');
}
@font-face {
    font-family: 'Lato';
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url(/funtoot/app/ext/fonts/Lato/Lato-Regular.ttf) format('truetype');
}
@font-face {
    font-family: 'Lato';
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url(/funtoot/app/ext/fonts/Lato/Lato-Bold.ttf) format('truetype');
}
@font-face {
    font-family: 'Lato';
    font-weight: 900;
    font-style: normal;
    font-display: swap;
    src: url(/funtoot/app/ext/fonts/Lato/Lato-Black.ttf) format('truetype');
}


:root {
  --embibe-blue: #50B7E8;
  --Lato-font-name:Lato;
}

html{
    background-color: #ffffff;
}


 














 



 

@function get-vw($target) {
  $vw-context: (1440 * 0.01) * 1px;
  @return ($target / $vw-context) * 1vw;
}
div{
    -webkit-print-color-adjust: exact !important; 
}
html, body {
    -webkit-print-color-adjust: exact !important;
    color-adjust: exact !important;
    height: 100%;
    color: #5F5F5F;
    font-family: Lato;
    margin:0;
    padding:0;
}

#login-page-loading{
    position: absolute;
    display: flex;
    z-index: 10000;
    top:0;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background: white;
    font-size: 50px;
}
.modal {
    display: block;
}

/*.modal-dialog {
    display: block;
    width:90%;
}*/

.login_header {
    color: black !important;
    font-weight:bold;
    font-family: Lato
}

.login_footer {
    color:#000000 !important;
}

.dexaedge_login_footer {
    color:#FFF ;
}

.dexaedge_login_footer a {
    color: #82e2fb;
}

.login_links {
    color:#ffffff !important;
}

.version {
    font-size: 80%;
    padding-right: 10px;
    position:fixed;
    bottom: 0;
    right:0;
    color:transparent;
}

    .version:hover {
        color: inherit;
    }

.hide {
    display: none;
}

.scrollable-table {
    overflow: auto;
}

input:focus:required:invalid, textarea:focus:required:invalid, select:focus:required:invalid {
    border-color: #EE5F5B;
    color: #B94A48;
}

    input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, select:focus:required:invalid:focus {
        border-color: #E9322D;
        box-shadow: 0 0 6px #F8B9B7;
        -webkit-box-shadow: 0 0 6px #F8B9B7;
    }

.container {
    width: 100%;
    /*padding-left: 0;
    padding-right: 0;*/
    height: 100%;
    min-height:inherit;
    margin: 0 auto;
}

.wrapper {
    height: 100%;
}

.no-gutter {
    padding-left: 0px;
    padding-right: 0px;
}

.student-home-pr {
    font-family: 'Lato', Lato;
}

.student-home-md {
    font-family: Lato
}

.student-home .menubar, .teacher-home .menubar, .parent-home .menubar {
    height: 56px;
    background-color: white;
    position: relative;
    z-index: 12;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.04);
}

    .student-home .menubar .nav-menu, .teacher-home .menubar .nav-menu, .parent-home .menubar .nav-menu {
        display: table;
        vertical-align: middle;
        height: 100%;
        width: auto;
    }

        .student-home .menubar .nav-menu .logo, .teacher-home .menubar .nav-menu .logo, .parent-home .menubar .nav-menu .logo {
        }

            .student-home .menubar .nav-menu .logo:after, .teacher-home .menubar .nav-menu .logo:after, .parent-home .menubar .nav-menu .logo:after {
                content: "";
                display: inline-block;
                width: 40px;
            }

            .student-home .menubar .nav-menu .logo > img, .teacher-home .menubar .nav-menu .logo > img, .parent-home .menubar .nav-menu .logo > img {
                width: 118px;
                margin-left: 20px;
            }

        .student-home .menubar .nav-menu .menu-item, .teacher-home .menubar .nav-menu .menu-item, .parent-home .menubar .nav-menu .menu-item {
            text-transform: uppercase;
            font-size: 1.05em;
            font-weight: 600;
            color: #666666;
            display: table-cell;
            vertical-align: middle;
            height: 100%;
            cursor: pointer;
            border-bottom:3px solid white;
        }

        .profile-menu .menu-item{
            vertical-align: top !important;
        }

        .profile-menu .menu-item .profile-image{
            padding-top:10px;
        }

        .student-home .menubar .nav-menu .menu-item-active, .teacher-home .menubar .nav-menu .menu-item-active, .parent-home .menubar .nav-menu .menu-item-active {
            border-bottom:2px solid ;
            color: #209AF7;
            font-size: 16px;
            font-weight: 600;
            line-height: 19px;          
            text-decoration: none;
            border-bottom:3px solid #209AF7;
        }

        .student-home .menubar .nav-menu .menu-item-separator, .teacher-home .menubar .nav-menu .menu-item-separator, .parent-home .menubar .nav-menu .menu-item-separator {
            width: 30px;
        }

    .student-home .menubar .profile-menu, .teacher-home .menubar .profile-menu, .parent-home .menubar .profile-menu {
        display: table;
        float: right;
        height: 100%;
        width: auto;
    }

        .student-home .menubar .profile-menu .menu-text, .teacher-home .menubar .profile-menu .menu-text, .parent-home .menubar .profile-menu .menu-text {
            color: #999999;
            display: table-cell;
            font-size: 0.9287em;
            list-style: none outside none;
            margin: 0;
            font-size:16px;
            font-weight: 600;
            /*padding: 0;*/
            vertical-align: middle;
        }
        .student-home .menubar .profile-menu .menu-text li, .teacher-home .menubar .profile-menu .menu-text li, .parent-home .menubar .profile-menu .menu-text li{
            display:flex;
        }

            .student-home .menubar .profile-menu .menu-text .user-name, 
            .teacher-home .menubar .profile-menu .menu-text .user-name, 
            .parent-home .menubar .profile-menu .menu-text .user-name {
                min-width: 68px;
                text-overflow: ellipsis;
                overflow-x: hidden;
                white-space: nowrap;
                max-width: 100px;
                /*display: inline-block;*/
            }
            .student-home .menubar .profile-menu .menu-text .board-grade {
                display:inline-flex;
                font-size:0.9rem;
                background:gray;
                color:white;
                padding:0px 4px;
                border-radius:4px;
                font-style:italic;
                display:inline-flex;
            }

.menubar .profile-menu .menu-text .dropdown.open .dropdown-menu {
    left: initial;
    right: 0px;
}

.student-home .menubar .profile-menu .menu-item, .teacher-home .menubar .profile-menu .menu-item, .parent-home .menubar .profile-menu .menu-item {
    color: #5F5F5F;
    display: table-cell;
    font-size: 1.28571em;
    vertical-align: middle;
}

.student-home .menubar .profile-menu .profile-image > img, .teacher-home .menubar .profile-menu .profile-image > img, .parent-home .menubar .profile-menu .profile-image > img {
    max-height: 40px;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    background-color: #CCCCCC;
}

.student-home .menubar .profile-menu .profile-image .letter-based-profile-image {
    border-radius: 50%;
    height: 32px;
    width: 32px;
    text-align: center;
    font-size: 14px;
    line-height: 32px;
    color: #009DE6;
    background-color: rgba(191, 235, 255, 0.3);

}
.student-home .menubar .profile-menu .menu-text-separator, .teacher-home .menubar .profile-menu .menu-text-separator, .parent-home .menubar .profile-menu .menu-text-separator {
    width: 10px;
}

.student-home .menubar .profile-menu .menu-group-separator, .teacher-home .menubar .profile-menu .menu-group-separator, .parent-home .menubar .profile-menu .menu-group-separator {
    width: 30px;
}


.parent-home .menubar .profile-menu .profile-name-cntr {
    /*border: 1px dashed #D3D3D3;*/
    display: table-cell;
    vertical-align: middle;
    padding-right: 5% !important;
}

.parent-home .menubar .profile-menu .profile-name-cntr .dropdown .dropdown-toggle .menu-text{
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 8em;
    font-size:16px;
    font-weight: 600;
}

.student-home .content {
}

.problem-page-nav-pane {
    position: absolute;
    bottom: 0px;
}

    .problem-page-nav-pane .nav-btn-back {
        color: #5F5F5F;
        background-color: #DFEDF3;
        border-radius: 20px;
        margin-bottom: 5%;
        font-size: 12px;
    }

    .problem-page-nav-pane .nav-topic-name {
        border-bottom: 2px solid #D5D5D5;
        padding-bottom: 5px;
        padding-top: 5px;
        font-size: 13px;
        color: #3F3F3F;
    }

.nav-subtopic-item {
    margin-left: -7%;
    margin-right: -7%;
    padding-bottom: 8px;
    padding-left: 10px;
    padding-top: 8px;
    color: #9F9F9F;
    font-size: 13px;
}

    .nav-subtopic-item a {
        color: #9F9F9F;
    }

.nav-subtopic-item-active {
    background-color: #F9F4CE;
    color: #9F9F9F;
}

.problem-page-nav-subtopics {
    /*position:absolute;*/
    float: left;
}

.problem-page-breadcrumb {
    position: absolute;
    top: 20%;
}

    .problem-page-breadcrumb .parent-name {
        color: #CFCFCF;
    }

    .problem-page-breadcrumb .active-name {
        color: #9F9F9F;
    }

.problem-page-main-content {
    /*position:absolute;*/
    float: left;
}

.problem-page-footer {
    position: fixed;
    bottom: 0;
}

    .problem-page-footer .button-panel {
        /*padding-top: 50%;*/
    }

.tutor-panel {
    position: fixed;
    bottom: 5px;
    right: 5px;
    z-index: 15;
}

    .tutor-panel .ask-me {
        position: absolute;
        left: -120%;
        bottom: 25%;
    }

.submit-button-panel {
    text-align: center;
}
.problem-page-footer-panel {
    bottom: 0;
    background-color: #e7e7e7;
    position: fixed;
    left: 0;
    z-index: 100;
    text-align: right;
    line-height: 5.25rem;
    padding-right: 3rem;
}

.btn-submit {
    background-color: #60bcf1;
    color: #FFFFFF;
    border-radius: 20px;
    font-weight: bold;
    font-size: 1.7143em;
    position: relative;
    /*bottom: 5px;*/
    /*width: 14%;*/
    /*left: 43%;*/
    top: 10px;
    min-width:13%;
}

.problem-page-footer-btn {
    background-color: #5cb85c;
    color: #FFFFFF;
    border-radius: 20px;
    font-size: 1.15em;
    position: relative;
    min-width: 16%;
    border-color: #4cae4c;
    text-transform: uppercase;
}
.problem-page-footer-btn:hover{
     box-shadow: 0 .2rem .2rem rgba(0,0,0,.2);
     color:#ffffff;
}
.problem-page-footer .btn-skip {
    background-color: #DFEDF3;
    border-radius: 20px;
    color: #5F5F5F;
    margin-top: 50px; /* about half of the tutor image height*/
}



.assistance-pane {
    /*background-color: #FFFFFF;
    border: 1px solid #8DE67E;
    border-radius: 30px 0 0 30px;
    box-shadow: 0 0 7px 0 #AAAAAA;
    -webkit-box-shadow: 0 0 7px 0 #AAAAAA;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
    position: fixed;
    right: -90px;
    top: 70px;
    border-right: none;
    transition: 1s;
    z-index: 14;*/
}

.assistance-pane-visible {
    right: 0;
}

.assistance-backdrop {
    display:none;/* don't show backdrop for assistance, as micro-hint now has the backdrop */
    background-color: transparent; /*transparent is as good as backdrop not being there */
    bottom: 0;
    left: 0;
    opacity: 0.5;
    position: fixed;
    right: 0;
    top: 0;
    transition: all 1s ease 0s;
    z-index: 12;
}

.assistance-pane .icon-container{
    float:left;
    margin-right:10px;
}

.assistance-pane .icon {
    /*border-radius: 50%;*/
    /*height: 44px;*/
    /*width: 44px;*/
    margin-top: 6px;
    margin-bottom: 6px;
    background-color: #FFFFFF;
}

    .assistance-pane .icon > div {
    background-image: url(/funtoot/Content/images/assistance-icons.png);
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
}

.assistance-pane .icon-default {
    border-radius: 50%;
    background-color: transparent;
}

.assistance-pane .icon-active {
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    z-index: 15;
    background-color: rgba(255, 255, 255, 0.7);
}

    .assistance-pane .icon-active:hover {
    border-radius: 50%;
    cursor:pointer;
}

.assistance-pane .tutorial {
    background-position: 0px 0px;
}

.assistance-pane .icon-default .tutorial {
    background-position: -5px -5px;
    height: 0px;
}

.assistance-pane .icon-active .tutorial {
    background-position: -5px -5px;
}

.assistance-pane .icon-default .hint {
    background-position: -62px -5px;
    height: 0px;
}

.assistance-pane .icon-active .hint {
    background-position: -62px -3px;
}

.assistance-pane .icon-default .solution {
    background-position: -117px -5px;
    height: 0px;
}

.assistance-pane .icon-active .solution {
    background-position: -118px -4px;
}

.assistance-pane .icon-default .microhint {
    background-position: -173px -5px;
    height: 0px;
}

.assistance-pane .icon-active .microhint {
    background-position: -173px -4px;
}

.problem-page-content .attempts {
    position: relative;
    float: right;
    display: table;
    width: 100%;
    height: 44px;
    font-size: 12px;
}

    .problem-page-content .attempts > div {
        display: table-cell;
        vertical-align: middle;
    }

    .problem-page-content .attempts .attempts-count {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #75E511;
    padding:3px;
    position: relative;
    color: #FFFFFF;
    text-align: center;
    font-weight: 700;
    margin-left: 3px;
}

.assistance-modal {
    padding: 0;
    position: absolute;
    right: 90px;
    top: 70px;
}

    .assistance-modal .modal-header {
        border-bottom-color: #51b9e8;
        color: #51b9e8;
    }

        .assistance-modal .modal-header .modal-title {
            display: inline-block;
            font-size: 2.142857rem;
        }


.hint-modal {
    height: 221px;
}

.solution-modal {
    width: 83.33%; /*(10/12)*/
}

.solution-block {
    padding-bottom: 10px;
}

.recommendations-modal {
    width: 50%;
}

.break-clock {
    border-radius: 10px;
    color: #ffffff;
    display: table;
    font-size: 9.64286em;
    vertical-align: middle;
    z-index: 15;
}

    .break-clock > div {
        display: table-cell;
        text-align: center;
        vertical-align: middle;
    }

.break-clock-text {
    color: #ffffff;
    display: table;
    font-size: 15px;
    text-align: center;
    width: 100%;
}

.next-btn-pane {
    display: table;
    position: fixed;
    right: 16px;
    top: 50%;
    cursor: pointer;
    border-right: none;
    /*transition: .5s;*/
    z-index: 4;
    visibility: hidden;
    padding: 5px;
}

.next-btn-pane-visible {
    visibility: visible;
}

.next-btn-pane > div {
    display: table-cell;
    vertical-align: middle;
}

    .next-btn-pane > div > div {
        background-image: url(/funtoot/Content/images/next-arrow.png);
        height: 64px;
        width: 64px;
    }

.next-btn-pane:hover > div > div {
    background-image: url(/funtoot/Content/images/next-arrow-hover.png);
    height: 64px;
    width: 64px;
}

.tutor-message-container {
    background-color: #EEEE00;
    bottom: 154px;
    padding: 10px 10px 20px;
    position: fixed;
    right: 15px;
    width: 320px;
    z-index: 100;
}

.tutor-message-img {
    bottom: 0;
    position: fixed;
    right: 0;
    z-index: 200;
}

.progress-indicator {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1000;
}

.tutor-callout {
    border-radius: 10px;
    bottom: 10px;
    padding: 10px 12px 10px 12px;
    position: absolute;
    right: 115%;
    width: 337px;
    color: #3F3F3F;
    font-weight: bold;
    background-color: #FFFFFF;
    padding-bottom: 20px;
    box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.22);
}

.tutor-callout-error {
    background-color: #FEE4E4;
    border: 1px solid #FFC6C6;
}

.tutor-callout-success {
    /*background-color: #E0FFB2;*/
    border: 1px solid #80b559;
}

.tutor-callout-microhint {
    border: 1px solid #FF9900;
}

.tutor-callout-hint {
    border: 1px solid #4DCC00;
}

.tutor-callout-tutorial {
    border: 1px solid #0094E1;
}

.tutor-callout-solution {
    border: 1px solid #FF3366;
}

.tutor-callout-forwardSCLock {
    border: 1px solid #f39a8e;
}

.tutor-callout-OopsError {
    border: 1px solid #f39a8e;
}

.tutor-callout-plzSolveProblem {
    border: 1px solid #f39a8e;
}

    .tutor-callout-plzSolveProblem .close-btn > div {
    color: #f39a8e;
}

.tutor-callout-success .close-btn > div {
    color: #80b559;
}

.tutor-callout-OopsError .close-btn > div {
    color: #f39a8e;
}

.tutor-callout-forwardSCLock .close-btn > div {
    color: #f39a8e;
}

.tutor-callout .notch {
    height: 10px;
    position: absolute;
    right: -6px;
    bottom: 15px;
    width: 10px;
    background-color: #FFFFFF;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
}

.tutor-callout .close-btn {
    content: "";
    display: table;
    height: 44px;
    position: absolute;
    right: 0;
    top: 0;
    width: 44px;
    cursor: pointer;
}

    .tutor-callout .close-btn > div {
        display: table-cell;
        font-weight: bold;
        text-align: center;
        vertical-align: middle;
    }

.tutor-callout-success .notch {
    border-top: 1px solid #80b559;
    border-right: 1px solid #80b559;
}

.tutor-callout-error .notch {
    background-color: #FEE4E4;
    border-top: 1px solid #FFC6C6;
    border-right: 1px solid #FFC6C6;
}

.tutor-callout-microhint .notch {
    border-top: 1px solid #FF9900;
    border-right: 1px solid #FF9900;
}

.tutor-callout-hint .notch {
    border-top: 1px solid #4DCC00;
    border-right: 1px solid #4DCC00;
}

.tutor-callout-tutorial .notch {
    border-top: 1px solid #0094E1;
    border-right: 1px solid #0094E1;
}

.tutor-callout-solution .notch {
    border-top: 1px solid #FF3366;
    border-right: 1px solid #FF3366;
}

.tutor-callout-OopsError .notch {
    border-top: 1px solid #f39a8e;
    border-right: 1px solid #f39a8e;
}

.tutor-callout-forwardSCLock .notch {
    border-top: 1px solid #f39a8e;
    border-right: 1px solid #f39a8e;
}

.tutor-callout-plzSolveProblem .notch {
    border-top: 1px solid #f39a8e;
    border-right: 1px solid #f39a8e;
}

.tutor-message-title {
    display: table;
    width: 100%;
    font-size: 18px;
    color: #333333;
    font-weight: bold;
}

.tutor-message-title-text {
    display: table-cell;
    /*padding-left: 5px;*/
    vertical-align: middle;
}

.tutor-message-title-icon {
    background-color: #DEF6FD;
    border-radius: 50%;
    background-image: url(/funtoot/Content/images/assistance-icons.png);
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
    display: table-cell;
    vertical-align: middle;
}

    .tutor-message-title-icon.tutor-message-icon-microhint {
        background-position: -173px -4px;
    }

    .tutor-message-title-icon.tutor-message-icon-tutorial {
        background-position: -5px -5px;
    }

    .tutor-message-title-icon.tutor-message-icon-hint {
        background-position: -62px -3px;
    }

    .tutor-message-title-icon.tutor-message-icon-solution {
        background-position: -118px -4px;
    }

.tutor-message-body {
    color: #333333;
}

.btn-reattempt {
    background-color: #60BCF1;
    border-radius: 20px;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    left: 20%;
    margin-bottom: 15px;
    margin-top: 15px;
    position: relative;
    width: 60%;
}

.fundaas-text {
    position: absolute;
    width: 100%;
    left: 3px;
    top: 11px;
    text-align: center;
    font-size: 24px;
}

.fundaas-glow {
    color: #666666;
    font-weight: 800;
    cursor: pointer;
}

.fundaas-container {
    position: relative;
    cursor: pointer;
}

    .fundaas-container > img {
        position: relative;
        bottom: -2px;
        float: left;
    }
.fundaas-container .fundaas-index{
    position: absolute;
    top: 27px;
    bottom: 0;
    right:0;
    left:0;
    justify-content: center;
    display: flex;
    align-items: center;
    font-weight: 600;
}

.fundaas-container .fundaas-index img{
    margin-left: 5px;
    width: 26px;
    margin-top: 2px;
    height: 2x;
}

/* new stuff ends*/

/* new tablet stuff starts */

.problem-page-content {
    /*background-image: url(/funtoot/Content/images/horizontal-line.png);*/
    height: 1px;
    height: auto !important; /* safari hack */
}

.problem-page-content-in-iframe {
    background-image: none !important;
}
    

        .problem-page-content .nav-button-left {
            top:223px;
            position: absolute;
            opacity:0.5;
            transform: rotate(180deg);
            -webkit-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            left: 2%;
            cursor: pointer;
            z-index: 1;
        }
        .problem-page-content .nav-button-left:hover{
            opacity:1;
        }

        .problem-page-content .nav-button-right {
            position: absolute;
            top:223px;
            right: 2%;
            cursor: pointer;
            z-index: 1;
            opacity:0.5;
        }   
        .problem-page-content .nav-button-right:hover {
            opacity:1;
        }


.problem-page-body .problem-btlo-dl {
    position: absolute;
    top: 25%;
}

.problem-page-body .problem-pager {
    position: absolute;
    top: 25%;
    right: 0px;
}

.problem-solution-button {
    position: absolute;
    top: 100px;
    border-radius: 50%;
    height: 44px;
    width: 44px;
    margin-top: 5px;
    margin-bottom: 5px;
    border: 2px solid #B1E511;
    right: 35px;
}

    .problem-solution-button:hover {
        background-color:#B1E511;
    }

    .problem-solution-button .solution-icon {
        background-image: url(/funtoot/Content/images/assistance-icons.png);
        background-repeat: no-repeat;
        height: 44px;
        width: 44px;
        background-position: -114px -1px;
        cursor: pointer;
    }

.problem-hint-button {
    position: absolute;
    top: 45px;
    border-radius: 50%;
    height: 44px;
    width: 44px;
    margin-top: 5px;
    margin-bottom: 5px;
    border: 2px solid #B1E511;
    right: 35px;
}

    .problem-hint-button:hover {
        background-color:#B1E511;
    }

    .problem-hint-button.disabled {
        opacity: 0.5;
    }

    .problem-hint-button .hint-icon {
        background-image: url(/funtoot/Content/images/assistance-icons.png);
        background-repeat: no-repeat;
        height: 44px;
        width: 44px;
        background-position: -58px -1px;
        cursor: pointer;
    }

    .problem-hint-button.disabled .hint-icon {
        cursor: default;
    }

.problem-page-header {
        display: table;
    font-size: 14px;
    height: 44px;
    margin: 0 auto;
}

    .problem-page-header canvas {
        margin-top: 0.5em;
    }

    .problem-page-header .problem-title {
        display: table-cell;
        vertical-align: middle;
        padding-left: 10px;
    }

    .problem-page-header .problem-attempts {
        position: absolute;
        right: 0;
        top: 25%;
        color: #9394C6;
    }

    .problem-page-header .problem-attempts-highlight {
        color: #E99191;
    }

.problem-info {
    display: table;
    height: 44px;
    margin: 0 auto;
}

    .problem-info select {
        margin-top: -5px;
        font-size: .9em;
        color: black;
        background-color: rgba(38, 34, 49, 0.1);
        font-weight: 500;
    }

    .problem-info > div {
        display: table-cell;
        vertical-align: middle;
    }

    .problem-info .problem-info-lo-lable {
        text-align: right;
        font-size: .9em;
        margin-top: 2px;
    }

    .problem-info .problem-info-ssc {
        display: table-cell;
        vertical-align: middle;
        text-align: right;
    }

    .problem-info .problem-info-btlo {
        display: table-cell;
        vertical-align: middle;
        text-align: left;
    }

    .problem-info .problem-info-dropdown {
        transition: 0.5s;
        -webkit-transition: 0.5s;
        -ms-transition: 0.5s;
        -o-transition: 0.5s;
    }

        .problem-info .problem-info-dropdown.changed {
            background-color: #D3F1CE;
            color: #49953C;
        }

.problem-page-nav-left {
    height: 100%;
    /*min-height: inherit;*/ /* safari hack */
}

.problem-page-body {
}

.header-strip {
    background-color: #f8f8f8;
    margin-top: 2px;
    height: 40px;
}

.problem-content {
    margin-top: 20px;
    /* text-align: center; commenting as part mcq options are not proper as it was */
}

.problem-content-pr {
    font-family: 'Lato', Lato;
}

.problem-content-md {
}

.problem-content.problem-content-readonly:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 100;
    cursor: not-allowed;
}

.syllabus-menu-container {
    background-color: #FFFFFF;
    height: 83px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    margin-top: 2px;
}

    .syllabus-menu-container > div {
        display: table;
        width: 100%;
        height: 100%;
    }

        .syllabus-menu-container > div > div {
            display: table-cell;
            vertical-align: middle;
        }

.syllabus-button {
    border-radius: 10px;
    display: table;
    height: 44px;
    margin: 0 auto;
    position: relative;
    width: 48px;
    z-index: 12;
}

.syllabus-button-default {
    background-color: #F6F6F6;
    border: 1px solid #EEEEEE;
}

.syllabus-button-pressed {
    background-color: #EEEEEE;
    border-color: #BFBFBF;
    border-image: none;
    border-style: solid;
    border-width: 1px 0 0 1px;
}

.syllabus-button .grip-container {
    display: table-cell;
    vertical-align: middle;
    cursor: pointer;
}

    .syllabus-button .grip-container > div {
        border: 2px solid #6ED15D;
        border-radius: 10px;
        width: 28px;
        margin: 4px auto;
    }

.syllabus-button-default .grip-container > div {
    border: 2px solid #6ED15D;
}

.syllabus-button-pressed .grip-container > div {
    border: 2px solid #5CB14E;
}

.syllabus-menu-pane {
    position: absolute;
    left: 0;
    height: 100%;
    right: 0;
    z-index: 10;
    visibility: hidden;
    /*margin-top: 2px;*/
}

.syllabus-menu-pane-visible {
    visibility: visible;
}

/*.syllabus-menu-pane:before
{
    background-color: #FFFFFF;
    border-right: 1px solid #B6E8AE;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    width: 8.3333%;
}*/

.syllabus-menu-pane:after {
    background-color: #000000;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.5;
    position: absolute;
    right: 0;
}

.syllabus-menu {
    background-color: #FFFFFF;
    position: absolute;
    height: 94%;
    z-index: 1;
    overflow-x: hidden;
    overflow-y: auto;
    /*-webkit-box-shadow: 2px 0px 2px 1px rgba(0,0,0,.2);*/
    top: 44px;
    border-right: 1px solid #DDDDDD;
    margin-bottom: -44px;
}

    .syllabus-menu::-webkit-scrollbar {
        width: 5px;
    }

    .syllabus-menu::-webkit-scrollbar-thumb {
        background-color: #CCCCCC;
        border-radius: 2px;
    }

    .syllabus-menu:nth-child(1) {
        left: 0; /* hidden initially*/
        width: 16.6666%;
        z-index: 2;
        /*transition: .5s;*/
    }

    .syllabus-menu:nth-child(2) {
        left: 16.6666%; /* hidden initially*/
        width: 33.3333%;
        /*transition: .8s;*/
        background-color: #F8F8F8;
    }

    .syllabus-menu:nth-child(3) {
        left: 58.3333%;
        width: 33.3333%;
    }

    .syllabus-menu:nth-child(4) {
        left: 83.3333%;
        width: 33.3333%;
    }

.syllabus-item {
    display: table;
    padding-left: 10px;
    /*color: #3F3F3F;*/
    height: 40px;
    width: 100%;
    padding-top: 1.5%;
    padding-bottom: 1.5%;
    padding-left: 35px;
    cursor: pointer;
}

.syllabus-item-active {
    /*padding-left: 7px;*/
    font-weight: bold;
    background-color: #F8F8F8;
    color: #00AAF1;
}

.syllabus-menu:nth-child(2) .syllabus-item-active {
    background-color:#FCFCFC;
}

.syllabus-item:hover {
    /*background-color: #FDEECC;*/
    color: #00AAF1;
}

.syllabus-progress {
    display: table-cell;
    vertical-align: middle;
}

    .syllabus-progress > canvas {
        top: 4px;
        position: relative;
    }

.syllabus-name {
    display: table-cell;
    width: 100%;
    vertical-align: middle;
    padding-left: 10px;
}

    .syllabus-name.locked {
        color: #CCCCCC;
    }

.syllabus-status {
    display: table-cell;
    height: 40px;
    width: 40px;
    vertical-align: middle;
}

    .syllabus-status > div {
        background-image: url(/funtoot/Content/images/tick-lock-new.png);
        background-repeat: no-repeat;
        height: 40px;
        width: 20px;
    }

.syllabus-complete {
    background-position: -3px 6px;
}

.syllabus-locked {
    background-position: -3px -30px;
}

.subtopic-status {
    display: table-cell;
    height: 40px;
    width: 40px;
    vertical-align: middle;
}

    .subtopic-status > div {
        background-image: url(/funtoot/Content/images/tick-lock.png);
        background-repeat: no-repeat;
        height: 100%;
        width: 100%;
    }

.subtopic-complete {
    background-position: 0 6px;
	max-height: 40px;
}

.subtopic-locked {
    background-position: 0 -30px;
}

.solution-modal-body {
    padding-left: 0;
    padding-right: 0;
}

.read-only-solution:before {
    content: "";
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 10;
}

.solution-block {
    padding-bottom: 45px;
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
}

.solution-block-active {
    background-color: rgba(38, 34, 49, 0.1);
    border: 1px solid #979797;
}

.btn-next-block {
    float: right;
    height: 40px;
    display: table;
    cursor: pointer;
}

    .btn-next-block > i {
        display: table-cell;
        vertical-align: middle;
    }

/* new tablet stuff ends */
.problem-page-topic-list {
    padding-right: 0px;
    height: 100%;
    /*background-image: url(/funtoot/app/Content/Images/notepad-1.png);*/
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right center;
}

.problem-page-topic-list-bottom {
    padding-right: 0px;
    height: 100%;
    background-repeat: repeat-y;
    background-size: contain;
    background-position: right center;
}

.problem-page-topic-list-bottom-pr {
    background-image: url(/funtoot/app/Content/Images/notepad-pr-4.png);
}

.problem-page-topic-list-bottom-md {
    background-image: url(/funtoot/app/Content/Images/notepad-md-4.png);
}

.problem-page-topic-list-pr {
    background-image: url(/funtoot/app/Content/Images/notepad-pr-1.png);
}

.problem-page-topic-list-md {
    background-image: url(/funtoot/app/Content/Images/notepad-md-1.png);
}

.problem-page-topic-list .topic-name {
    padding-top: 20%;
}

.problem-page-subtopics-header {
    list-style: none;
}

.problem-page-subtopics-container {
    height: 68%;
}

.problem-page-subtopics {
    list-style: none;
    overflow-y: scroll;
    overflow-x: hidden;
    height: 95%;
}

    .problem-page-subtopics li {
        margin: 0 0 5px 0;
    }

.problem-page-learnometer-background {
    height: 4px;
    width: 100%;
    background-color: yellow;
    float: left;
}

.problem-page-learnometer-progress {
    height: 100%;
    /*width: 40%;*/
    background-color: green;
    float: left;
}

.problem-page-main-content-bg {
    padding-left: 0px;
    padding-right: 0px;
    background-image: url(/funtoot/Content/Images/notepad-2.png);
    background-repeat: repeat-x;
    background-size: contain;
}

.problem-page-main-header {
    text-align: center;
    position: relative;
    margin-top: 2%;
    padding-bottom: 2%;
    padding-top: 2%;
}

.problem-page-main-footer {
    position: absolute;
    top: 87%;
}

.problem-page-content-right {
    background-image: url(/funtoot/Content/Images/notepad-3.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.problem-page-help-area {
    background-image: url(/funtoot/Content/Images/hint-tutorial-solution-icons.png);
    background-size: contain;
    background-repeat: no-repeat;
}

/* Student Dashboard */
.dashboard-curriculum-progress {
    border-right: 1px solid #efefef;
}

    .dashboard-curriculum-progress > div {
        background-color: #ffffff;
        border-bottom: 1px solid #efefef;
    }

    .dashboard-curriculum-progress .dashboard-title {
        font-size: 2.1428em;
        /*padding-top: 10px;
        padding-bottom: 10px;*/
        font-weight: 300;
        /*opacity: 0.5;*/
        color: #919191;
    }

    .dashboard-curriculum-progress .dashboard-syllabus-loader {
        text-align: center;
        font-size: 2.1428em;
        margin: auto;
        display: table;
    }

    .dashboard-curriculum-progress .dashboard-subject-accordion {
        border-top: 1px solid #efefef;
        border-bottom: 1px solid #efefef;
    }

.dashboard-subject-accordion-inactive {
    background-color: #ffffff !important;
}
    .dashboard-curriculum-progress .dashboard-subject-container {
        background-color: #51b9e8;
        /*padding-bottom: 10px;
        padding-top: 10px;*/
    }

        .dashboard-curriculum-progress .dashboard-subject-container:after {
            background-color: #51b9e8;
            bottom: -10px;
            content: "";
            height: 20px;
            left: 48%;
            position: absolute;
            transform: rotate(45deg);
            -webkit-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            width: 20px;
        }

    .dashboard-curriculum-progress a {
        color: inherit;
        text-decoration: none;
    }

        .dashboard-curriculum-progress a:hover, .dashboard-curriculum-progress a:focus {
            color: inherit;
            text-decoration: none;
        }

.dashboard-subject-progress {
    cursor: pointer;
    display: table;
    padding-bottom: 5px;
    padding-top: 5px;
}

    .dashboard-subject-progress > canvas {
        display: table-cell;
    }

    .dashboard-subject-progress .dashboard-subject-Name-panel {
        display: table-cell;
        padding-left: 10px;
        vertical-align: middle;
    }

        .dashboard-subject-progress .dashboard-subject-Name-panel .subject-name {
            font-size: 2.571428em;
            color: #FFFFFF;
            font-weight: 300;
        }

        .dashboard-subject-progress .dashboard-subject-Name-panel .view-curriculum-button {
            font-size: 0.8571em;
            color: #FFFFFF;
            border: 1px solid #FFFFFF;
            border-radius: 5px;
            padding: 5px;
            text-align: center;
        }

.dashboard-subject-inactive-container {
    background-color: #51b9e8;
    cursor: pointer;
    padding-top: 10px;
    padding-bottom: 10px;
}

    .dashboard-subject-inactive-container .dashboard-subject-inactive {
        display: table;
    }

.dashboard-subject-inactive > canvas {
    display: table-cell;
    vertical-align: middle;
}

.dashboard-subject-inactive .subject-name {
    display: table-cell;
    vertical-align: middle;
    padding-left: 10px;
}

.dashboard-curriculum-progress .subtopic-items {
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #efefef;
}

.dashboard-curriculum-progress .subtopics-finished > div {
    max-height: 130px;
    overflow-y: auto;
}

.dashboard-curriculum-progress .subtopic-items:last-child {
    border-bottom: medium none;
}

.dashboard-curriculum-progress .subtopic-items .section-title {
    font-size: 1.42857em;
    padding-bottom: 10px;
    font-weight: 300;
}

.dashboard-curriculum-progress .subtopic-items .subtopic-entry {
    display: table;
    width: 100%;
    cursor: pointer;
}

.dashboard-curriculum-progress .subtopic-items .subtopic-entry-locked {
    opacity: 0.5;
}

.dashboard-curriculum-progress .subtopic-items .subtopic-entry .subtopic-progress {
    display: table-cell;
    vertical-align: middle;
    width: 2.0em;
}

.dashboard-curriculum-progress .subtopic-items .subtopic-entry .subtopic-name {
    display: table-cell;
    vertical-align: middle;
}

    .dashboard-curriculum-progress .subtopic-items .subtopic-entry .subtopic-name .subtopic-details {
        display: table;
        color: #9F9F9F;
        font-size: 0.85714em; /*12px*/
        /*width: 100%;*/
    }

        .dashboard-curriculum-progress .subtopic-items .subtopic-entry .subtopic-name .subtopic-details > div {
            /*display: table-cell;*/
        }

/*.dashboard-curriculum-progress .subtopic-items .subtopic-entry .subtopic-name .subtopic-details > div:not(:first-child):before
                {
                    content: "|";
                    padding-left: 5px;
                    padding-right: 5px;
                }*/

.dashboard-section {
    /*padding-top: 20px;*/
    padding-bottom: 10px;
    border-bottom: 1px solid #efefef;
}

.dashboard-session-highlights {
    /*background-color: #FFEAC9;*/
}

.dashboard-session-highlights-row {
    padding-bottom:20px;
}

    .dashboard-session-highlights .section-heading {
        font-size: 2em;
        padding-bottom: 10px;
        font-weight: 300;
        /*opacity: 0.5;*/
        color:#919191;
    }

    .dashboard-session-highlights .row1 {
        display: table;
        padding-left: 15px;
        height: 40px;
        width: 100%;
    }

    .dashboard-session-highlights .data-circle {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        color: #FFFFFF;
        font-weight: bold;
        width: 40px;
        height: 40px;
        border-radius: 20px;
    }

    .dashboard-session-highlights .data-circle-text {
        display: table-cell;
        vertical-align: middle;
        font-size: .857148em;
        padding-left: 4px;
    }

    .dashboard-session-highlights .data-circle-attempted {
        background-color: #74D4D3;
    }

    .dashboard-session-highlights .data-circle-solved {
        background-color: #52b9e8;
    }

    .dashboard-session-highlights .data-circle-errors {
        background-color: #EF8E8E;
    }

    .dashboard-session-highlights .data-circle-ld-resolved {
        background-color: #EAC74C;
    }

    .dashboard-session-highlights .data-circle-fundaas {
        background-color: #EBB173;
    }

    .dashboard-session-highlights .data-circle-time-spent {
        background-color: #D6A3CC;
    }

    .dashboard-session-highlights .row2 {
        display: table;
        padding-left: 55px;
        height: 40px;
        width: 100%;
    }

.dashboard-my-progress {
    /*background-color: #E7FFFB;*/
}

    .dashboard-my-progress .section-heading {
        font-size: 2em;
        /*padding-bottom: 15px;*/
        font-weight: 300;
        /*opacity: 0.5;*/
        color: #919191;
    }

    .dashboard-my-progress .my-progress-chart {
        font-size: 0.85714em;
        font-family: Lato !important;
        width: 100%;
        /*height: 200px;*/
    }

.dashboard-my-usage {
    /*background-color: #B8EDFE;*/
}

    .dashboard-my-usage .section-heading {
        font-size: 2em;
        /*padding-bottom: 15px;*/
        font-weight: 300;
        /*opacity: 0.5;*/
        color: #919191;
    }

    .dashboard-my-usage .my-usage-chart {
        font-size: 0.85714em;
        font-family: Lato
        width: 100%;
        /*height: 200px;*/
    }

/* override the bootstrap drop-down for cursor style */
.dropdown {
    cursor: pointer;
}


.tooltip-inner {
    background-color: #FFEBEB;
    border: 1px solid #CF8C79;
    border-radius: 6px;
    box-shadow: 1px 3px 3px 0 rgba(0, 0, 0, 0.2);
    color: #5F5F5F;
    font-size: 1em;
    min-width: 300px;
    text-align: center;
    padding-right: 25px;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

    .tooltip-inner .error-tooltip-title {
        display: none;
        font-weight: normal;
    }

    .tooltip-inner .error-tooltip-body {
        font-weight: bold;
        white-space: normal;
        text-align: left;
    }

    .tooltip-inner .error-tooltip-close-btn {
        cursor: pointer;
        color: #CF8C79;
        margin-left: 0px;
        margin-right: -21px;
        margin-top: -4px;
    }

.error-icon {
    cursor: pointer;
    display: inline-block;
    position: absolute;
    background-color: transparent;
    border: none;
    padding: 0;
}

    .error-icon:focus {
        outline: none;
    }

.tooltip.top .tooltip-arrow {
    background-image: url(/funtoot/Content/Images/notch.png);
    background-repeat: no-repeat;
    background-size: contain;
    border-style: none;
    border-top: 0 none rgba(0, 0, 0, 0);
    border-width: 0;
    bottom: -2px;
    height: 8px;
    left: 48%;
    width: 16px;
}

.tooltip.bottom .tooltip-arrow {
    background-image: url(/funtoot/Content/Images/notch.png);
    background-repeat: no-repeat;
    background-size: contain;
    border-style: none;
    border-top: 0 none rgba(0, 0, 0, 0);
    border-width: 0;
    bottom: -2px;
    height: 8px;
    left: 48%;
    transform: rotate(180deg) translateY(2px);
    -webkit-transform: rotate(180deg) translateY(2px);
    -o-transform: rotate(180deg) translateY(2px);
    -moz-transform: rotate(180deg) translateY(2px);
    width: 16px;
}

.tooltip.left {
    min-width: 300px;
}

    .tooltip.left .tooltip-arrow {
        background-image: url(/funtoot/Content/Images/notch.png);
        background-repeat: no-repeat;
        background-size: contain;
        border-style: none;
        border-top: 0 none rgba(0, 0, 0, 0);
        border-width: 0;
        height: 8px;
        transform: rotate(270deg) translateY(6px);
        -webkit-transform: rotate(270deg) translateY(11px);
        -o-transform: rotate(270deg) translateY(6px);
        -moz-transform: rotate(270deg) translateY(6px);
        width: 16px;
    }

.tooltip.right .tooltip-arrow {
    background-image: url(/funtoot/Content/Images/notch.png);
    background-repeat: no-repeat;
    background-size: contain;
    border-style: none;
    border-top: 0 none rgba(0, 0, 0, 0);
    border-width: 0;
    height: 8px;
    transform: rotate(90deg) translateY(6px);
    -webkit-transform: rotate(90deg) translateY(6px);
    -o-transform: rotate(90deg) translateY(6px);
    -moz-transform: rotate(90deg) translateY(6px);
    width: 16px;
}

.tooltip.in {
    opacity: 01;
}

.tooltip {
    z-index: 1040;
}

.FTHeading4 {
    font-style: italic;
}

.FTHeading3 {
    font-weight: bold;
}
/*.error-icon:hover {
    opacity:0.5;
}*/

.recommended-subtopic-entry {
    display: table;
    width: 100%;
    cursor: pointer;
}

    .recommended-subtopic-entry .subtopic-name {
        display: table-cell;
        vertical-align: middle;
    }

/* Hiding the small clear button displayed by IE on input fields so it does not steal space */
input::-ms-clear {
    display: none;
}

/* Teacher dashboard related styles */
.teacher-class {
    border: 1px solid #000000;
    display: table;
    height: 100px;
    text-align: center;
    width: 100px;
    cursor: pointer;
}

    .teacher-class .teacher-section-title {
        display: table-row;
        font-size: 2em;
        vertical-align: top;
        width: 100%;
    }

.teacher-class-handled {
    background-color: darkorange;
}

.teacher-subjects {
    text-align: left;
}

.teacher-home, .parent-home {
    color: #5F5F5F;
}

    .teacher-home .teacher-dashboard, .teacher-home .teacher-reports, .parent-home .teacher-reports {
        background-color: #E3E3E3;
    }

        .teacher-home .teacher-dashboard, .teacher-home .teacher-reports .teacher-report-body, .parent-home .teacher-reports .teacher-report-body {
            color: #3F3F3F;
            font-size: 0.928571em; /*13px*/
        }

    .parent-home .tool-bar {
        line-height: 54px;
        background-color: #F6F6F6;
    }

    .teacher-home .tool-bar {
        background-color: #F8F8F8;
        margin-top: 2px;
        font-size: 14px;
        height: 54px;
        border-bottom: 1px solid #eaeaea;
    }

.tool-bar {
    background-color: #F8F8F8;
    margin-top: 2px;
    font-size: 14px;
    height: 54px;
    border-bottom: 1px solid #eaeaea;
}

.teacher-home .class-subject-selection-pane{
    background-color: #9EE292;
}

.teacher-home .toolbar-button {
    text-align: right;
    cursor: pointer;
    float: left;
}

.toolbar-button {
    display: table;
    cursor: pointer;
}

.toolbar-button {
    display: table;
    cursor: pointer;
}

.teacher-home .tool-bar .toolbar-item {
    height: 54px;
    text-align: left;
    display: table-cell;
    vertical-align: middle;
}


.tool-bar select {
    background-color: rgba(0, 0, 0, 0);
    font-weight: 600;
    color:#262331;
    border: none;
    /*text-indent: 1px;*/
    text-overflow: '';
    font-weight: bold;
    /*text-align: center;*/
    width: 100%;
}

.tool-bar .class-subject-selection-pane select{
    background-color: rgba(0, 0, 0, 0);
    font-weight: 600;
    color: #262331;
    border: none;
    /* text-indent: 1px; */
    text-overflow: '';
    font-weight: bold;
    text-align: center;
    width: 100%;
    border: 1px solid silver;
    padding: 9px;
    border-radius: 4px;
}


.teacher-home .tool-bar .report-selection-pane {
}

.teacher-home .tool-bar .toolbar-btn-active {
    font-weight: bold;
}

.parent-home .tool-bar .toolbar-btn-active {
    font-weight: bold;
    color: #209AF7 !important;
}

.teacher-home .tool-bar .toolbar-btn-active:after {
    border: 8px solid transparent;
    border-bottom: 8px solid #E3E3E3;
    border-width: 8px;
    bottom: 0px;
    content: "";
    height: 5%;
    left: 47%;
    position: absolute;
    width: 5%;
}

.parent-home .tool-bar .toolbar-btn-active:after {
    border: 8px solid transparent;
    border-bottom: 8px solid #E3E3E3;
    border-width: 8px;
    bottom: 0px;
    content: "";
    height: 5%;
    left: 47%;
    position: absolute;
    width: 5%;
}

.teacher-home .tool-bar .toolbar-btn-inactive {
    font-weight: normal;
}

.parent-home .tool-bar .toolbar-btn-inactive {
    font-weight: 600;
}

.teacher-home .curriculum-progress, .parent-home .curriculum-progress {
    background-color: #EEEEEE;
}

    .teacher-home .curriculum-progress .progress-chart, parent-home .curriculum-progress .progress-chart {
        font-size: 0.8571428em; /* 12px */
    }

    .teacher-home .curriculum-progress .progress-title, .parent-home .curriculum-progress .progress-title {
        font-weight: 600;
        padding-top: 40px;
        font-size: 1.1428571em;
    }

    .teacher-home .curriculum-progress .topic-progress-entry, .parent-home .curriculum-progress .topic-progress-entry {
    }

        .teacher-home .curriculum-progress .topic-progress-entry .topic-name, .parent-home .curriculum-progress .topic-progress-entry .topic-name {
            display: table;
            width: 100%;
            font-size: 0.8571428em; /* 12px */
            text-align: right;
        }

            .teacher-home .curriculum-progress .topic-progress-entry .topic-name > span, .parent-home .curriculum-progress .topic-progress-entry .topic-name > span {
                display: table-cell;
                vertical-align: middle;
            }

.teacher-home .class-performance, .parent-home .class-performance {
    background-color: #EEEEEE;
}

    .teacher-home .class-performance .chart-container, .parent-home .class-performance .chart-container {
        display: table;
    }

        .teacher-home .class-performance .chart-container .chart-info, .parent-home .class-performance .chart-container .chart-info {
            color: #3F3F3F;
            display: table;
            left: 36%;
            position: absolute;
            text-align: center;
            top: 38%;
            width: 30%;
        }

            .teacher-home .class-performance .chart-container .chart-info .chart-info-value, .parent-home .class-performance .chart-container .chart-info .chart-info-value {
                display: table-row;
                font-size: 1.7rem;
            }

            .teacher-home .class-performance .chart-container .chart-info .chart-info-title, .parent-home .class-performance .chart-container .chart-info .chart-info-title {
                display: table-caption;
                font-size: 1rem;
                font-weight: 600;
            }

    .teacher-home .class-performance .chart-container, .parent-home .class-performance .chart-container {
        display: table-cell;
        vertical-align: middle;
    }


    .teacher-home .class-performance .chart-legends-container, .parent-home .class-performance .chart-legends-container {
        display: table;
        width: 100%;
    }

        .teacher-home .class-performance .chart-legends-container > div, .parent-home .class-performance .chart-legends-container > div {
            display: table-cell;
            vertical-align: middle;
        }

        .teacher-home .class-performance .chart-legends-container .chart-title-legends, .parent-home .class-performance .chart-legends-container .chart-title-legends {
            display: inline;
            width: 100%;
        }

    .teacher-home .class-performance .chart-title-legends .chart-title, .parent-home .class-performance .chart-title-legends .chart-title {
        font-weight: 600;
        margin-bottom: 10px;
        font-size: 1.1428571em;
    }

    .teacher-home .class-performance .chart-title-legends .attention-needed, .parent-home .class-performance .chart-title-legends .attention-needed {
        font-size: 0.8571428em; /* 12px */
    }

        .teacher-home .class-performance .chart-title-legends .attention-needed .title, .parent-home .class-performance .chart-title-legends .attention-needed .title {
            color: #5F5F5F;
        }

        .teacher-home .class-performance .chart-title-legends .attention-needed .list, .parent-home .class-performance .chart-title-legends .attention-needed .list {
            color: #D06583;
            margin-bottom: 10px;
            font-weight: bold;
        }

            .teacher-home .class-performance .chart-title-legends .attention-needed .list .attention-needed-student:not(:last-child):after,
            .parent-home .class-performance .chart-title-legends .attention-needed .list .attention-needed-student:not(:last-child):after {
                border-right: 1px inset #000000;
                content: "";
                margin-left: 5px;
                margin-right: 5px;
            }

    .teacher-home .class-performance .chart-title-legends .chart-legends, .parent-home .class-performance .chart-title-legends .chart-legends {
        display: table;
    }

        .teacher-home .class-performance .chart-title-legends .chart-legends .chart-legends-row, .parent-home .class-performance .chart-title-legends .chart-legends .chart-legends-row {
            display: table-row;
            font-size: 0.8571428em; /* 12px */
        }

            .teacher-home .class-performance .chart-title-legends .chart-legends .chart-legends-row .chart-legend-entry,
            .parent-home .class-performance .chart-title-legends .chart-legends .chart-legends-row .chart-legend-entry {
                display: table-cell;
            }

                .teacher-home .class-performance .chart-title-legends .chart-legends .chart-legends-row .chart-legend-entry .chart-legend-icon,
                .parent-home .class-performance .chart-title-legends .chart-legends .chart-legends-row .chart-legend-entry .chart-legend-icon {
                    display: inline-block;
                    height: 0.8571428em;
                    width: 0.8571428em;
                    border-radius: 50%;
                    margin-right: 2px;
                }

                .teacher-home .class-performance .chart-title-legends .chart-legends .chart-legends-row .chart-legend-entry .chart-legend-text,
                .parent-home .class-performance .chart-title-legends .chart-legends .chart-legends-row .chart-legend-entry .chart-legend-text {
                    display: inline-block;
                    color: #262331;
                    font-weight: 600;
                    opacity: 0.9000000357627869;
                    line-height: 24px;
                    margin-right: 10px;
                }

.teacher-reports .teacher-reports-header {
    background-color: #E3E3E3;
}

.teacher-reports .teacher-report-content .teacher-reports-header .header-cell {
    border-bottom: 1px solid #D7D7D7;
    /*display: table;
      vertical-align: middle;*/
    font-weight: 600;
    height: 4.5em; /* so that the text won't push the row down in tablet layout */
    position: relative;
}

.teacher-reports .teacher-report-content .teacher-reports-header .header-cell {
        border-right: 1px solid #D7D7D7;
    }

    .teacher-reports .teacher-report-content .teacher-reports-header .header-cell .view-combo {
        background-color: rgba(0, 0, 0, 0);
        border: medium none;
        font-weight: bold;
    }

    .teacher-reports .teacher-report-content .teacher-reports-header .header-cell > div {
        /*display: table-cell;
          vertical-align: middle;*/
        text-align: center;
        position: absolute;
        margin: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: 50%;
    }

    .teacher-reports .teacher-report-content .teacher-reports-header .header-cell:first-child > div > span {
        cursor: pointer;
    }

        .teacher-reports .teacher-report-content .teacher-reports-header .header-cell:first-child > div > span:not(:last-child):after {
            border-right: 1px solid #A5A5A5;
            content: "";
            margin-left: 1em;
            margin-right: 1em;
        }

.teacher-reports .teacher-report-content .report-item {
}

    .teacher-reports .teacher-report-content .report-item .report-item-expanded .report-item-name {
        font-weight: bold;
    }

    .teacher-reports .teacher-report-content .report-item .report-item-cell .btn-chart {
        text-align: center;
        width: 4em;
        cursor: pointer;
    }

        .teacher-reports .teacher-report-content .report-item .report-item-cell .btn-chart:hover {
            background-color: #9F9F9F;
        }

        .teacher-reports .teacher-report-content .report-item .report-item-cell .btn-chart > i {
            transform: rotate(45deg);
            -webkit-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -o-transform: rotate(45deg);
        }

    .teacher-reports .teacher-report-content .report-item .report-item-cell {
        border-bottom: 1px solid #D7D7D7;
    }

.teacher-reports .teacher-report-content .report-item-curriculum-progress .report-item-cell {
    height: 3em;
}

.teacher-reports .teacher-report-content .report-item-learning-outcome .report-item-cell {
    height: 3.3em;
}

.teacher-reports .teacher-report-content .report-item-learning-gaps .report-item-cell {
    height: 4em;
}

.teacher-reports .teacher-report-content .report-item-topic-progress .report-item-cell {
    height: 3em;
}

.teacher-reports .teacher-report-content .report-item .report-item-cell > div {
    display: table;
    height: 100%;
    margin: 0 auto;
}

.teacher-reports .teacher-report-content .report-item-topic-progress .report-item-cell.progress-cell > div {
    width: 100%;
}

.teacher-reports .teacher-report-content .report-item-topic-progress .report-item-cell.progress-cell:not(:last-child) {
    border-right: none;
}

.teacher-reports .teacher-report-content .report-item-learning-outcome .report-item-cell.la-cell:not(:last-child) {
    border-right: none;
}

.teacher-reports .teacher-report-content .report-item .report-item-data > div {
    text-align: center;
}

.teacher-reports .teacher-report-content .report-item .la-cell > div {
    text-align: left;
}

.teacher-reports .teacher-report-content .report-item .report-item-cell .report-item-with-chart {
    width: 100%;
}

    .teacher-reports .teacher-report-content .report-item .report-item-cell .report-item-with-chart .report-item-chart {
        padding-right: 5px;
        text-align: right;
        width: 50%;
    }

.teacher-reports .teacher-report-content .report-item-learning-outcome .report-item-cell .report-item-with-chart .report-item-chart {
        padding-right: 7px;
        text-align: right;
        width: 40%;
        padding-left:30px;
        padding-top:6px;
    }

.teacher-reports .teacher-report-content .report-item .report-item-cell .report-item-with-chart .report-item-stacked-chart {
        padding-left: 20px;
        text-align: left;
        width: 100%;
    }

.teacher-reports .teacher-report-content .report-item .report-item-cell .report-item-with-chart .report-item-chart-data {
        width: 50%;
    }

    .teacher-reports .teacher-report-content .report-item .report-item-cell .report-item-with-chart .report-item-chart-data .report-item-chart-data-text {
        border-right: 1px solid #B9B0B0;
    }

.teacher-reports .teacher-report-content .report-item .report-item-name > div {
    margin: inherit;
}

    .teacher-reports .teacher-report-content .report-item .report-item-name > div > div:last-child {
        padding-left: 5px;
    }

.teacher-reports .teacher-report-content .report-item .report-item-cell > div > * {
    display: table-cell;
    vertical-align: middle;
    margin-right: 5px;
}

.teacher-reports .teacher-report-content .report-item-topic-progress .report-item-cell.progress-cell > div > * {
    width: 100%;
}

.teacher-reports .teacher-report-content .report-item .report-item-cell:not(:last-child) {
    border-right: 1px solid #D7D7D7;
}

.teacher-reports .teacher-report-content .report-item-topic-progress .report-item-cell {
    border-right: 1px solid #D7D7D7;
}

.teacher-reports .teacher-report-content .report-item-learning-outcome .report-item-cell {
    border-right: none;
}

.teacher-reports .teacher-report-content .report-item .report-item-progress-chart:after {
    background-color: #EEEEEE;
    content: "";
    height: 98%;
    left: 0;
    position: absolute;
    width: 100%;
}

.teacher-reports .teacher-report-content .report-item .report-item-progress-chart .progress-bar-chart {
    height: 98%;
    position: absolute;
    left: 0;
    z-index: 1;
}

.teacher-reports .teacher-report-content .report-item .report-item-cell .expand-collapse-toggle {
    padding-right: 5px;
}

.teacher-reports .teacher-report-content .report-item .report-item-cell .hidden-caret {
    color:transparent;
}

.teacher-reports .teacher-report-content .report-item .report-item-progress-chart {
    text-align: right;
}

    .teacher-reports .teacher-report-content .report-item .report-item-progress-chart .progress-text {
        position: relative;
        z-index: 1;
    }

.teacher-reports .teacher-report-content .report-item-cell:first-child {
    cursor: pointer;
}

.teacher-reports .teacher-report-content .report-item-level-1 {
    background-color: #EEEEEE;
}

    .teacher-reports .teacher-report-content .report-item-level-1 .report-item-name {
        padding-left: 1em;
    }

        .teacher-reports .teacher-report-content .report-item-level-1 .report-item-name .student-proficiency-indicator {
            display: inline-block;
            height: 0.8571428em;
            width: 0.8571428em;
            border-radius: 50%;
        }

.teacher-reports .teacher-report-content .report-item-level-2 {
    background-color: #F8F8F8;
}

    .teacher-reports .teacher-report-content .report-item-level-2 .report-item-name {
        padding-left: 2em;
    }

.teacher-reports .teacher-report-content .report-item-learning-outcome .report-item-level-2 .report-item-name {
        padding-left: 5em;
    }
   

.teacher-reports .teacher-report-content .report-item-level-3 {
    background-color: #FDFDFD;
}

    .teacher-reports .teacher-report-content .report-item-level-3 .report-item-name {
        padding-left: 4em;
    }

.teacher-reports .teacher-report-content .report-item-learning-gaps .report-item-top-lgs {
    padding-left: 1em;
}

    .teacher-reports .teacher-report-content .report-item-learning-gaps .report-item-top-lgs li {
        font-size: .857142em;
    }

        .teacher-reports .teacher-report-content .report-item-learning-gaps .report-item-top-lgs li:hover {
            font-weight: bold;
            cursor: pointer;
        }

    .teacher-reports .teacher-report-content .report-item-learning-gaps .report-item-top-lgs > div {
        width: 100%;
    }


.teacher-home .topic-subtopic-usage {
    background-color: #E4E4E4;
    color: #3F3F3F;
}

    .teacher-home .topic-subtopic-usage .section-title {
        font-size: 1.428571em; /*20px*/
        font-weight: 600;
        color: #3F3F3F;
        padding-top: 80px;
        padding-bottom: 30px; /* check with Nitin */
        cursor: pointer;
    }

    .teacher-home .topic-subtopic-usage .topic-subtopic-entry {
        padding-bottom: 30px;
    }

        .teacher-home .topic-subtopic-usage .topic-subtopic-entry .subtopic-entry {
            cursor: pointer;
        }

        .teacher-home .topic-subtopic-usage .topic-subtopic-entry .subtopic-active {
            background-color: #FAFAFA;
            height: 36px;
        }

            .teacher-home .topic-subtopic-usage .topic-subtopic-entry .subtopic-active:after {
                content: "";
                height: 36px;
                width: 36px;
                position: absolute;
                left: 100%;
                z-index: 10;
                border: 18px solid transparent;
                border-left: 18px solid #FAFAFA;
            }

        .teacher-home .topic-subtopic-usage .topic-subtopic-entry .item-name {
            display: table;
            height: 35px;
        }

            .teacher-home .topic-subtopic-usage .topic-subtopic-entry .item-name > div {
                display: table-cell;
                vertical-align: middle;
            }

        .teacher-home .topic-subtopic-usage .topic-subtopic-entry .topic-name {
            background-color: #D8D8D8;
            font-weight: bold;
            margin-bottom: 20px;
        }

        .teacher-home .topic-subtopic-usage .topic-subtopic-entry .subtopic-name .subtopic-performance-icon {
            display: inline-block;
            height: 0.8571428em;
            width: 0.8571428em;
            border-radius: 50%;
            margin-right: 10px;
        }

.teacher-reports .teacher-report-date-filter {
    height: 80px;
}

    .teacher-reports .teacher-report-date-filter .filter-pane {
        height: 100%;
    }

        .teacher-reports .teacher-report-date-filter .filter-pane .k-datepicker {
            width: 100%;
        }

        .teacher-reports .teacher-report-date-filter .filter-pane input {
            background-color: #F5F5F5;
            border-radius: 0px;
            height: 30px;
        }

        .teacher-reports .teacher-report-date-filter .filter-pane button {
            background-color: #489EFE;
            border-radius: 0;
            color: #FFFFFF;
            height: 35px;
        }

        .teacher-reports .teacher-report-date-filter .filter-pane > div {
            height: 100%;
            display: table;
            width: 100%;
        }

            .teacher-reports .teacher-report-date-filter .filter-pane > div > div {
                /*margin-top:2em;*/
                display: table-cell;
                padding-top: 1.5em; /* just a hack, the vertical-align:middle is not working for some reason */
                vertical-align: middle;
            }

    .teacher-reports .teacher-report-date-filter .print-email-pane {
        height: 100%;
    }

        .teacher-reports .teacher-report-date-filter .print-email-pane > div {
            display: table;
            height: 100%;
            float: right;
        }

            .teacher-reports .teacher-report-date-filter .print-email-pane > div > div {
                display: table-cell;
                vertical-align: middle;
                padding-right: 10px;
                padding-left: 10px;
                cursor: pointer;
            }

.teacher-reports .topic-progress-selection-pane .print-email-pane {
        height: 100%;
    }

    .teacher-reports .topic-progress-selection-pane .print-email-pane > div {
            display: table;
            height: 100%;
            float: right;
        }

        .teacher-reports .topic-progress-selection-pane .print-email-pane > div > div {
                display: table-cell;
                vertical-align: middle;
                padding-right: 10px;
                padding-left: 10px;
                cursor: pointer;
            }

.lg-chart-modal {
    top: 30px;
    width: 100%;
}

    .lg-chart-modal .modal-content {
        border-radius: 0px;
        border: 15px solid rgba(0, 0, 0, 0.5);
        -webkit-background-clip: padding-box; /* for Safari */
        background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
        background-color: #F9F9F9;
    }

        .lg-chart-modal .modal-content .lg-chart-header {
            margin-top: 15px;
            margin-bottom: 20px;
        }

            .lg-chart-modal .modal-content .lg-chart-header .lg-chart-title {
                color: #AFAFAF;
                padding-left: 30px;
            }

                .lg-chart-modal .modal-content .lg-chart-header .lg-chart-title > span:not(:last-child):after {
                    content: ">";
                    padding-left: 10px;
                    padding-right: 10px;
                }

                .lg-chart-modal .modal-content .lg-chart-header .lg-chart-title span.lg-info-for {
                    color: #3F3F3F;
                    font-size: 1.28571em; /*18px*/
                }

                    .lg-chart-modal .modal-content .lg-chart-header .lg-chart-title span.lg-info-for:after {
                        content: "";
                    }

            .lg-chart-modal .modal-content .lg-chart-header .lg-chart-lg-info {
                text-align: center;
            }

                .lg-chart-modal .modal-content .lg-chart-header .lg-chart-lg-info .lg-info-data {
                    font-size: 2.142857em; /* 30px */
                    font-weight: 300;
                }

                .lg-chart-modal .modal-content .lg-chart-header .lg-chart-lg-info .lg-info:first-child {
                    color: #D06583;
                }

                .lg-chart-modal .modal-content .lg-chart-header .lg-chart-lg-info .lg-info:not(:first-child) {
                    color: #4BC75D;
                }

                .lg-chart-modal .modal-content .lg-chart-header .lg-chart-lg-info .lg-info-text {
                    color: #5F5F5F;
                    font-size: 0.857em; /* 12px */
                }

        .lg-chart-modal .modal-content .close {
            width: 40px;
            height: 40px;
            position: relative;
            top: 0px;
            right: 0px;
            z-index: 10;
        }

        .lg-chart-modal .modal-content .lg-chart-body {
            margin-bottom: 15px;
            padding-top: 15px;
        }

            .lg-chart-modal .modal-content .lg-chart-body .lg-chart-container {
                color: #5F5F5F;
                font-size: 0.857em; /* 12px */
            }

            .lg-chart-modal .modal-content .lg-chart-body .lg-chart-legends {
                color: #AFAFAF;
                font-size: 0.857em; /* 12px */
            }

                .lg-chart-modal .modal-content .lg-chart-body .lg-chart-legends .lg-legends-icon:before {
                    content: "";
                    position: absolute;
                    width: 1em;
                    height: 1em;
                    top: 0.2em;
                    left: 0;
                }

                .lg-chart-modal .modal-content .lg-chart-body .lg-chart-legends .lg-legends-resolved:before {
                    background-color: #4BC75D;
                }

                .lg-chart-modal .modal-content .lg-chart-body .lg-chart-legends .lg-legends-unresolved:before {
                    background-color: #D06583;
                }
/*for IQ quotions*/
.allign-contents-center {
    display: table;
    margin: 0 auto;
}

.parent-page {
    background-image: url(/funtoot/app/parent/bg-repeat.jpg);
}

.no-access-modal {
    margin-top: 200px;
    position: static;
    width: 600px;
}

.no-access-modal-content {
    padding-bottom: 50px;
    padding-top: 40px;
}

.no-access-message {
    margin-left: 60px;
    margin-right: 60px;
}

.no-access-user-name { /*display: table;*/
    font-weight: 300;
    font-size: 24px;
    color: rgb(247, 140, 3);
    padding-bottom: 10px;
}


/* print reports styles */
.teacher-reports-header .header-cell {
    border-bottom: 1px solid #D7D7D7;
    /*display: table;
      vertical-align: middle;*/
    font-weight: bold;
    height: 4.5em; /* so that the text won't push the row down in tablet layout */
    position: relative;
}

    .teacher-reports-header .header-cell:not(:last-child) {
        border-right: 1px solid #D7D7D7;
    }

.teacher-reports-header .header-cell {
    border-right: 1px solid #D7D7D7;
}

.print-form-modal {
    margin-top:100px;
    width: 100%;
}

.print-form-title{
    padding:10px;
}


.print-form {
    font-size: 12px;
}


    .print-form .fetchdata-busy {
        opacity: 0.5;
    }

    .print-form .teacher-reports-header .header-cell .view-combo {
        background-color: rgba(0, 0, 0, 0);
        border: medium none;
        font-weight: bold;
    }

    .print-form .teacher-reports-header .header-cell > div {
        /*display: table-cell;
          vertical-align: middle;*/
        text-align: center;
        position: absolute;
        margin: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: 50%;
    }

    .print-form .teacher-reports-header .header-cell:first-child > div > span {
        cursor: pointer;
    }

        .print-form .teacher-reports-header .header-cell:first-child > div > span:not(:last-child):after {
            border-right: 1px solid #A5A5A5;
            content: "";
            margin-left: 1em;
            margin-right: 1em;
        }

    .print-form .teacher-reports-header .header-cell .print-form-selection-title {
        font-weight: normal;
    }

    .print-form .report-item {
    }

        .print-form .report-item .report-item-expanded .report-item-name {
            font-weight: bold;
        }



        .print-form .report-item .report-item-cell {
            border-bottom: 1px solid #D7D7D7;
        }

    .print-form .report-item-curriculum-progress .report-item-cell {
        height: 3em;
    }

    .print-form .report-item-learning-gaps .report-item-cell {
        height: 4em;
    }

    .print-form .report-item .report-item-cell > div {
        display: table;
        height: 100%;
        margin: 0 auto;
    }

    .print-form .report-item .report-item-data > div {
        text-align: center;
    }


    .print-form .report-item .report-item-name > div {
        margin: inherit;
    }

        .print-form .report-item .report-item-name > div > div:last-child {
            padding-left: 5px;
        }

    .print-form .report-item .report-item-cell > div > * {
        display: table-cell;
        vertical-align: middle;
        margin-right: 5px;
    }

    .print-form .report-item .report-item-cell:not(:last-child) {
        border-right: 1px solid #D7D7D7;
    }



    .print-form .report-item .report-item-cell .expand-collapse-toggle {
        padding-right: 5px;
    }


    .print-form .report-item-cell:first-child, .print-form .print-controls > i {
        cursor: pointer;
    }


    .print-form .report-item-level-1 .report-item-name, .print-preview .print-form .report-item-level-1 .report-item-name {
        padding-left: 2em;
        color: #1F1F1F;
    }

    .print-form .report-item-level-2 .report-item-name, .print-preview .print-form .report-item-level-2 .report-item-name {
        padding-left: 3em;
        color: #6F6F6F;
    }

    .print-form .report-item-level-2:first-child {
        border-top: 1px solid #3F3F3F;
    }

    .print-form .report-item-level-2:last-child {
        border-bottom: 1px solid #3F3F3F;
    }

    .print-form .report-item-level-3 .report-item-name, .print-preview .print-form .report-item-level-3 .report-item-name {
        padding-left: 4em;
        color: #8F8F8F;
    }

    .print-form .report-item-level-3:first-child {
        border-top: 1px solid #AFAFAF;
    }

    .print-form .report-item-level-3:last-child {
        border-bottom: 1px solid #AFAFAF;
    }

    .print-form .report-item-learning-gaps .report-item-top-lgs {
        padding-left: 1em;
    }

        .print-form .report-item-learning-gaps .report-item-top-lgs li {
            font-size: .857142em;
        }

        .print-form .report-item-learning-gaps .report-item-top-lgs > div {
            width: 100%;
        }


    .print-form .checkbox-selection {
        border-color: #D7D7D7;
        border-width: 0 1px 1px 0;
        border-style: solid;
        font-weight: normal;
        height: 4.5em;
    }

.print-preview {
    font-size: 11px;
}

    .print-preview .print-selection-controls {
        display: none;
    }

.print-form .header-row {
    border-bottom: 1px solid #8F8F8F;
}

.print-form .print-controls {
    display: table;
    padding: 2%;
}

    .print-form .print-controls > * {
        display: table-cell;
        width: 10%;
        vertical-align: middle;
    }

    .print-form .print-controls > div {
        font-size: 1.5em;
        font-weight: bold;
    }

.parent-home .parent-dashboard {
    background-color: #EEEEEE;
    color: #5F5F5F;
}

    .parent-home .parent-dashboard > div {
        padding-left: 2%;
        padding-right: 2%;
    }

    .parent-home .parent-dashboard .parent-dashboard-content {
        margin-top: 10px;
        margin-bottom: 27px;
    }

    .parent-home .parent-dashboard .section-title {
        font-size: 1.4285714em; /* 20 px*/
        font-weight: 300;
    }

.parent-home .subject-selection{
    margin-bottom:10px;
}

.parent-home .subject-selection select {
    background-color: rgba(0, 0, 0, 0);
    border: none;
    text-indent: 1px;
    text-overflow: '';
    font-weight: bold;
    color: #5f5f5f;
    margin-top: 10px;
    font-size: 1.28571em;
    padding: 3px 5px;
    border: 1px solid silver;
    border-radius: 3px;
}

.parent-home .parent-dashboard .progress-section {
    padding-right: 30px;
}

.parent-home .parent-dashboard .percentile-progressbar > div {
    width: 100%;
    background-color: #D7D7D7;
}

    .parent-home .parent-dashboard .percentile-progressbar > div > div {
        height: 100%;
    }

.parent-home .parent-dashboard .topic-performance {
    margin-top: 30px;
}

    .parent-home .parent-dashboard .topic-performance .topic-item {
        margin-bottom: 10px;
    }

    .parent-home .parent-dashboard .topic-performance .topic-name {
        font-size: 0.8571em;
        color: #5F5F5F;
    }

.parent-home .parent-dashboard .performance-section .null-usage {
    display: table;
    height: 400px;
    margin-top: 2em;
    background-color: #FFFFFF;
    width: 100%;
}

    .parent-home .parent-dashboard .performance-section .null-usage > div {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
    }

.parent-home .parent-dashboard .performance-section .null-usage-msg1 {
    color: #ffa21e;
    font-size: 35px;
}

.parent-home .parent-dashboard .performance-section .null-usage-msg2 {
    color: #5f5f5f;
    font-size: 18px;
}

.parent-home .parent-dashboard .performance-section .hero-unit {
    /*height: 120px;*/
    font-size: 4.28571em; /* 60px*/
    color: #FFFDE8;
    font-weight: 300;
    margin-top: 34px;
    /*margin-bottom: 15px;*/
    padding-top: .15em;
    padding-bottom: .15em;
    text-align: center;
}

    .parent-home .parent-dashboard .performance-section .hero-unit .percentile-score {
        font-weight: bold;
    }

    .parent-home .parent-dashboard .performance-section .hero-unit .percentile-ordinal-suffix {
        font-size: 40px;
        font-weight: normal;
        vertical-align: super;
        position: relative;
        left: -.3em;
    }

    .parent-home .parent-dashboard .performance-section .hero-unit .percentile-text {
    }

.parent-home .parent-dashboard .performance-section .performance-trend-chart {
    font-size: 0.78571em; /* 11px */
    background-color: #FFFFFF;
}

.parent-home .parent-dashboard .performance-section .performance-trend-chart-legends {
    margin-top: 20px;
    font-size: 11px;
}

.parent-home .parent-dashboard .performance-section .legend-item {
    width: auto;
    padding-right: 0px;
}

.parent-home .parent-dashboard .performance-section .performance-trend-chart-legends .chart-legend-icon {
    display: inline-block;
    height: 1em;
    width: 1em;
    border-radius: 50%;
    margin-right: 2px;
}

.parent-home .parent-dashboard .performance-section .performance-trend-chart-legends .chart-legend-text {
    display: inline-block;
    margin-right: 10px;
}

.parent-home .parent-dashboard .performance-section .performance-details-chart {
    margin-top: 6px;
    font-size: 0.78571em; /* 11px */
    background-color: #FAFAFA;
}

    .parent-home .parent-dashboard .performance-section .performance-details-chart .close {
        position: relative;
        z-index: 10;
    }

    .parent-home .parent-dashboard .performance-section .performance-details-chart .chart-legends {
        margin-top: 10px;
    }

    .parent-home .parent-dashboard .performance-section .performance-details-chart .chart-legend-icon {
        display: inline-block;
        height: 1em;
        width: 1.5em;
        margin-right: 2px;
    }

    .parent-home .parent-dashboard .performance-section .performance-details-chart .chart-legend-text {
        display: inline-block;
        margin-right: 10px;
    }

.question-trail-modal {
    width: 83.33%;
    color: #8F8F8F;
    margin-top:20px;
}

    .question-trail-modal .modal-content {
        border-radius: 0px;
    }

        .question-trail-modal .modal-content .modal-header .close {
            position: absolute;
            top: 0px;
            right: 0px;
            width: 46px;
            height: 50px;
            margin-top: 0px;
        }

        .question-trail-modal .modal-content .modal-header .modal-title .title {
            font-weight: bold;
        }

        .question-trail-modal .modal.content .modal-header .modal-title .title .trail-count{
            padding-left:5px;
        }

        .question-trail-modal .modal-content .modal-header .modal-title .topic-subtopic {
            margin-left: 15px;
            font-weight: normal;
        }

    .question-trail-modal .question-trail-modal-body {
        padding-left: 15px;
        padding-right: 15px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

        .question-trail-modal .question-trail-modal-body .nav-button {
            position: relative;
            top: 175px;
        }

        .question-trail-modal .question-trail-modal-body .nav-controls {
            margin: 0 auto;
            max-width: 100%;
            text-align: center;
            opacity: 0.8;
        }

            .question-trail-modal .question-trail-modal-body .nav-controls > i {
                margin-right: 2px;
                margin-left: 2px;
                cursor: pointer;
            }

        .question-trail-modal .question-trail-modal-body .nav-button .nav-button-left {
            transform: rotate(180deg);
            -webkit-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            position: relative;
            left: 15px;
            cursor: pointer;
        }

        .question-trail-modal .question-trail-modal-body .nav-button .nav-button-right {
            position: relative;
            right: 15px;
            cursor: pointer;
        }

        .question-trail-modal .question-trail-modal-body .question-status {
            display: table;
        }

            .question-trail-modal .question-trail-modal-body .question-status > div {
                display: table-cell;
                vertical-align: middle;
                /*padding: 1px;*/
            }

                .question-trail-modal .question-trail-modal-body .question-status > div:last-child {
                    padding-left: 5px;
                }

            .question-trail-modal .question-trail-modal-body .question-status .question-status-text {
                font-size: 1.28571em; /* 18px */
                font-weight: bold;
            }

            .question-trail-modal .question-trail-modal-body .question-status .question-status-attempts {
                font-size: 0.928571em; /* 13px */
            }

        .question-trail-modal .question-trail-modal-body .question-time {
            float: right;
            text-align: right;
        }

        .question-trail-modal .question-trail-modal-body .question-trail-problem-container {
            min-height: 500px;
        }

        .question-trail-modal .question-trail-modal-body .question-time .time {
            font-size: 0.928571em; /* 13px */
        }

        .question-trail-modal .question-trail-modal-body .question-time .date {
            font-size: 1.28571em; /* 18px */
            font-weight: bold;
        }

.btn-question-trail {
    position: absolute;
    right: -5px;
    width: 3em;
    height: 3em;
}

    .btn-question-trail > i {
        position: relative;
        top: 20%;
        left: 20%;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -o-transform: rotate(45deg);
    }

.question-trail-disabled {
    color: #CFCFCF;
}

.question-trail-enabled {
    color: #000000;
}

    .question-trail-enabled:hover {
        background-color: #AAAAAA;
    }



.report-item-learning-gaps .tooltip-inner {
    background-color: #FFFFFF !important;
    border: 1px solid #aaaaaa !important;
    border-radius: 6px !important;
    box-shadow: 1px 3px 3px 0 rgba(0, 0, 0, 0.2) !important;
    color: #5F5F5F !important;
    font-size: 1em !important;
    min-width: 300px !important;
    text-align: center !important;
    padding-right: 25px !important;
    padding-left: 10px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.report-item-learning-gaps .tooltip.top .tooltip-arrow {
    background-image: url(/funtoot/Content/Images/notch-grey.png);
    background-repeat: no-repeat;
    background-size: contain;
    border-style: none;
    border-top: 0 none rgba(0, 0, 0, 0);
    border-width: 0;
    bottom: -2px;
    height: 8px;
    left: 48%;
    width: 16px;
}

.report-item-learning-gaps .tooltip.bottom .tooltip-arrow {
    background-image: url(/funtoot/Content/Images/notch-grey.png);
    background-repeat: no-repeat;
    background-size: contain;
    border-style: none;
    border-top: 0 none rgba(0, 0, 0, 0);
    border-width: 0;
    bottom: -2px;
    height: 8px;
    left: 48%;
    transform: rotate(180deg) translateY(2px);
    -webkit-transform: rotate(180deg) translateY(2px);
    -o-transform: rotate(180deg) translateY(2px);
    -moz-transform: rotate(180deg) translateY(2px);
    width: 16px;
}

.report-item-learning-gaps .tooltip.left .tooltip-arrow {
    background-image: url(/funtoot/Content/Images/notch-grey.png);
    background-repeat: no-repeat;
    background-size: contain;
    border-style: none;
    border-top: 0 none rgba(0, 0, 0, 0);
    border-width: 0;
    height: 8px;
    transform: rotate(270deg) translateY(6px);
    -webkit-transform: rotate(270deg) translateY(11px);
    -o-transform: rotate(270deg) translateY(6px);
    -moz-transform: rotate(270deg) translateY(6px);
    width: 16px;
}

.report-item-learning-gaps .tooltip.right .tooltip-arrow {
    background-image: url(/funtoot/Content/Images/notch-grey.png);
    background-repeat: no-repeat;
    background-size: contain;
    border-style: none;
    border-top: 0 none rgba(0, 0, 0, 0);
    border-width: 0;
    height: 8px;
    transform: rotate(90deg) translateY(6px);
    -webkit-transform: rotate(90deg) translateY(6px);
    -o-transform: rotate(90deg) translateY(6px);
    -moz-transform: rotate(90deg) translateY(6px);
    width: 16px;
}

.report-item-learning-gaps .tooltip-inner .error-tooltip-body {
    font-weight: bold;
    white-space: normal;
    text-align: left;
}

.report-item-learning-gaps .tooltip-inner .error-tooltip-close-btn {
    cursor: pointer;
    color: #d7d7d7;
    margin-left: 0px;
    margin-right: -21px;
    margin-top: -4px;
}

.report-item-learning-gaps .tooltip.in {
    opacity: 01;
}

.report-item-learning-gaps .tooltip {
    z-index: 4;
}

    .report-item-learning-gaps .tooltip.left {
        min-width: 300px;
    }

.lg-chart-modal .k-tooltip {
    background-color: #FFFFFF !important;
    border: 1px solid #aaaaaa !important;
    border-radius: 6px !important;
    box-shadow: 1px 3px 3px 0 rgba(0, 0, 0, 0.2) !important;
    color: #5F5F5F !important;
    font-size: 1em !important;
    min-width: 100px !important;
    max-width: 300px !important;
    text-align: center !important;
    padding-right: 25px !important;
    padding-left: 10px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}


.Revise_again {
    font-size: 29.849px;
    font-family: Lato;
    text-align: center;
    z-index: 7;
    margin-top: 30px;
}

.Solved_incorrectly_top {
    font-family: Lato;
    color: rgb(255, 255, 255);
    z-index: 15;
    vertical-align: middle;
}

.Solved_incorrectly_bottom {
    font-family: Lato;
    color: rgb(255, 255, 255);
    z-index: 15;
    vertical-align: middle;
}

.text_messages {
    font-family: Lato;
    color: rgb(95, 95, 95);
    text-align: center;
    z-index: 10;
}

.Solved_Correctly_top {
    font-size: 24.422px;
    font-family: Lato;
    color: rgb(255, 255, 255);
    float: bottom;
    float: top;
    vertical-align: top;
    z-index: 22;
}

.Solved_correctly_bottom {
    font-size: 24.422px;
    font-family: Lato;
    color: rgb(255, 255, 255);
    float: bottom;
    vertical-align: bottom;
    z-index: 20;
}

.REVISION_NAME {
    font-size: 21.709px;
    font-family: Lato;
    color: rgb(95, 95, 95);
    line-height: 0.921;
    z-index: 30;
}

.btn-Revision {
 color: #ffffff;
    font-family: inherit;
    font-size: 0.9em;
    height: 30px;
    padding-left: 30px;
    position: absolute;
    top: 6px;
    font-style: italic;
    text-decoration: underline;
    z-index: 4;
}

.problem-history {
    position: absolute;
    top: 25%;
    right: 90px;
    color: orange;
    cursor: pointer;
}

.end-of-sc-card {
    width: 100%;
    padding: 0;
    color: #eeeeee;
    margin-top:56px;
}

    .end-of-sc-card .modal-content {
        border-radius: 0px;
        background-color: #777777;
    }

        .end-of-sc-card .modal-content .modal-body {
            padding: 0px;
        }

    .end-of-sc-card .close {
        position: absolute;
        margin-top: 30px;
        right: 30px;
        opacity: 0.5;
    }

        .end-of-sc-card .close:hover {
            opacity: 1;
        }

    .end-of-sc-card .card-header {
        margin-top: 46px;
        color: #cccccc;
        font-size: 1.28571em;
    }

        .end-of-sc-card .card-header > span:last-child {
            color: #eeeeee;
        }

        .end-of-sc-card .card-header > span:not(:last-child)::after {
            content: ">";
            margin-left: 5px;
            margin-right: 5px;
            font-size: smaller;
        }

        .end-of-sc-card .card-header .completed-text {
            font-size: 14px;
            color: #B1E511;
            font-style: italic;
        }

    .end-of-sc-card .card-fundaas {
        height: 95px;
        color: #ffffff;
        font-size: 1.28571em;
        background-color: #1cd0d7;
        display: table;
        width: 100%;
        font-weight: 300;
        margin-top: 46px;
    }

        .end-of-sc-card .card-fundaas > div {
            display: table-cell;
            vertical-align: middle;
            text-align: center;
        }

        .end-of-sc-card .card-fundaas .fundaas-score {
            font-size: 50px;
        }

    .end-of-sc-card .card-performance {
        margin-top: 30px;
    }

        .end-of-sc-card .card-performance .questions-attempted {
            line-height:.85;
        }

        .end-of-sc-card .card-performance .attempted-count {
            font-size: 2.3571428571em;
            color: #ffae46;
        }

        .end-of-sc-card .card-performance .attempted-text {
            font-size: 1.1428571em;
            color: #EEEEEE;
        }

        .end-of-sc-card .card-performance .performance {
            margin-top: 12px;
            height: 130px;
            display: block;
            width: 100%;
            font-size: 1.1428571em;
        }

            .end-of-sc-card .card-performance .performance .performance-bar {
                display: inline-block;
                text-align: center;
                vertical-align: middle;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                height: 100%;
                float: left;
                font-size: 18px;
                line-height: 1px;
                padding:10px;
            }

                .end-of-sc-card .card-performance .performance .performance-bar.solved-bar {
                    background-color: #B1E511;
                }

                .end-of-sc-card .card-performance .performance .performance-bar .count {
                    font-size: 75px;
                    font-weight: 300;
                    line-height: 1.2;
                }

                    .end-of-sc-card .card-performance .performance .performance-bar .count.all-questions-solved {
                    font-size: 50px;
                }

                .end-of-sc-card .card-performance .performance .performance-bar.unsolved-bar {
                    background-color: #FA8384;
                }

                .end-of-sc-card .card-performance .performance .performance-bar.zerosolved-bar {
                    background-color: #CCCCCC;
                }

    .end-of-sc-card .card-recommendation {
        margin-top: 20px;
    }

        .end-of-sc-card .card-recommendation .card-reco-header {
            font-size: 16px;
            color: #EEEEEE;
        }

        .end-of-sc-card .card-recommendation .recommendations {
            background-color: #EEEEEE;
            box-shadow: rgba(0, 0, 0, 0.2) 2px 2px 2px 2px;
            margin-top: 12px;
            display: table;
            width: 100%;
        }

            .end-of-sc-card .card-recommendation .recommendations > div {
                display:table-row;
                width:100%;
                cursor:pointer;
            }

            .end-of-sc-card .card-recommendation .recommendations .recommended-item {
                font-size: 16px;
                color: #4386F8;
                display: table-cell;
                width: 100%;
                text-align: center;
                vertical-align: middle;
                line-height: 2;
            }


    .end-of-sc-card .card-reattempt {
        height: 60px;
        margin-top: 20px;
        color: #ffffff;
        font-size: 1.57142em;
        background-color: #4386f8;
        text-align: center;
        box-shadow: rgba(0, 0, 0, 0.2) 2px 2px 2px 2px;
        display:table;
        width:100%;
        cursor:pointer;
    }

        .end-of-sc-card .card-reattempt > div {
            display: table-cell;
            vertical-align: middle;
        }

    .end-of-sc-card .locked-text {
        font-size: 14px;
        color: #FA8384;
        font-style: italic;
    }

    .end-of-sc-card .username-div {
        padding-bottom: 10px;
    }

        .end-of-sc-card .username-div > div {
            vertical-align: middle;
            margin-top: 70px;
        }

    .end-of-sc-card .unpwdfield {
        margin-top: 0px;
        font-size: 17px;
        height: 60px;
    }

    .end-of-sc-card .unlock-button {
        border: none;
    }

    .end-of-sc-card .card-lock {
        background-color: #fa8384;
        display: table;
        height: 292px;
        width: 100%;
        margin-top: 46px;
    }

        .end-of-sc-card .card-lock .lock-icon {
            display: table-cell;
            text-align: center;
            vertical-align: middle;
        }

        .end-of-sc-card .card-lock .lock-text {
            font-size: 14px;
            color: #ffffff;
            padding-top: 20px;
            display: table;
            width: 100%;
        }

            .end-of-sc-card .card-lock .lock-text > span {
                display: table-row;
            }

            .end-of-sc-card .card-lock .lock-text .time {
                font-weight:bold;
            }

        

.revision-status-card {
    width: 100%;
    padding: 0;
    color: #eeeeee;
    margin-top:25px;
}

    .revision-status-card .modal-content {
        border-radius: 0px;
        background-color: #777777;
    }

    .revision-status-card .close {
        position: absolute;
        top: 10px;
        right: 30px;
    }

    .revision-status-card .card-header {
        margin-top: 20px;
        color: #cccccc;
        font-size: 1.28571em;
    }

        .revision-status-card .card-header > span:last-child {
            color: #eeeeee;
        }

        .revision-status-card .card-header > span:not(:last-child)::after {
            content: ">";
            margin-left: 5px;
            margin-right: 5px;
            font-size: smaller;
        }

        .revision-status-card .card-header .status-text {
            font-size: 14px;
            font-style: italic;
        }

        .revision-status-card .card-header .completed-text {
                color: #B1E511;
            }

        .revision-status-card .card-header .inprogress-text {
                color: #50A6F0;
            }

        .revision-status-card .card-header .incomplete-text {
                color: #FA8384;
            }

    .revision-status-card .revision-progress {
        margin-top: 46px;
        margin-bottom:60px;
    }

        .revision-status-card .revision-progress .progress-percent {
            color: #FFAE46;
            font-size: 33px;
        }

        .revision-status-card .revision-progress .progress-message {
            font-size: 16px;
        }

        .revision-status-card .revision-progress .progress-bar {
            background-color: #CCCCCC;
            margin-top: 5px;
            width: 100%;
        }

            .revision-status-card .revision-progress .progress-bar .progress-fill {
                float: left;
                background-color:#FFAE46;
                height: 40px;
            }

    .revision-status-card .attempted-count {
            font-size: 2.3571428571em;
            color: #ffae46;
        }

    .revision-status-card .total-count {
            font-size: 2.3571428571em;
            color: #EEEEEE;
        }

    .revision-status-card .attempted-text {
            font-size: 1.1428571em;
            color: #EEEEEE;
        }

    .revision-status-card .performance {
            margin-top: 12px;
            height: 130px;
            display: block;
            width: 100%;
            font-size: 1.1428571em;
        }

        .revision-status-card .performance .performance-bar {
                display: inline-block;
                text-align: center;
                vertical-align: middle;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                height: 100%;
                float: left;
                font-size: 18px;
                padding:10px;
                line-height: 1px;
            }

            .revision-status-card .performance .performance-bar.solved-bar {
                    background-color: #B1E511;
                }

            .revision-status-card .performance .performance-bar .count {
                    font-size: 75px;
                    font-weight: 300;
                    line-height: 1.2;
                }

                .revision-status-card .performance .performance-bar .count.all-questions-solved {
                        font-size: 50px;
                    }

            .revision-status-card .performance .performance-bar.unsolved-bar {
                    background-color: #FA8384;
                }

            .revision-status-card .performance .performance-bar.zerosolved-bar {
                    background-color: #CCCCCC;
                }

    .revision-status-card .revision-comment {
        font-size: 12px;
        margin-top:20px;
    }

        .revision-status-card .revision-comment > div {
            display: table;
            width: 100%;
        }

        .revision-status-card .revision-comment .revision-comment-text {
            display: table-cell;
            vertical-align: middle;
            text-align: center;
            font-size: 1.12em;
        }

    .revision-status-card .revise-again-button {
        background-color: #4386F8;
        box-shadow: rgba(0, 0, 0, 0.4) 2px 2px 2px 2px;
        width: 100%;
        margin-top:20px;
    }

        .revision-status-card .revise-again-button > div {
            display: table;
            width: 100%;
        }

            .revision-status-card .revise-again-button > div > div {
                display: table-cell;
                width: 100%;
                vertical-align: middle;
                text-align: center;
                font-size: 22px;
                color: #FFFFFF;
                height:60px;
            }

    .revision-status-card .revision-performance .questions-attempted {
        line-height: .85;
    }

.teacher-home .sub-header-strip {
        background-color: #f8f8f8;
        margin-top: 2px;
        font-size: 14px;
        height: 54px;
        border-bottom: 1px solid #eaeaea;
}

.teacher-home .tool-bar .sub-header-strip-btn-active {
    color: #209AF7 !important;
    font-weight: 600;
}

.teacher-home .tool-bar .sub-header-strip-btn-inactive {
    color: #262331;
    font-weight: 600;
}

.teacher-home .tool-bar select {
        background-color: rgba(0, 0, 0, 0);
        border: 1px solid #d9d9d9;
        color: black;
        border-radius: 4px;
        height: 38px;
        font-weight: 600;
background: url(/funtoot/Content/Images/dropDown_new.png) no-repeat scroll 100% center transparent;
    text-indent: 0.01px;
    text-overflow: "";
   -webkit-appearance: none;
   -moz-appearance: none;
padding-right: 25px;
padding-left:10px;
text-transform: capitalize;
    }
.teacher-home .tool-bar select::-ms-expand {
    display: none;
}

    .teacher-home .tool-bar select option {
        color: #999999;
    }

.toolbar-btn-space {
    padding-left: 20px;
    }

.subheader-toolbar {
        float:right;
        margin-top: 6px;
    }

.studycontrol-syllabus-tree {
    margin-top: 2%;
}



.toolbar-link-space {
        padding-left:30px;
    }

    @media only screen and (max-width: 1025px) {

        .parent-home .print-email-pane{
            margin-top:-21px;
        }

        .parent-home .assignment-page{
            margin-top:50px;
        }

        .toolbar-link-space {
            padding-left:10px;
        }
        .toolbar-btn-space{
            padding-left:5px;
        }
        .teacher-home .tool-bar select {
            padding-right:18px;
            padding-left:5px;
        }
    }

.subheader-toolbar-links {
        float:left;
        margin-top: 16px;
    }

.autorevision-modal {
    padding: 0;
    position: absolute;
    top: 53px;
    width: 100%;
}

    .autorevision-modal .autorevision-modal-content {
        border-radius: 0px;
        border: none;
    }

.modal-content .nav-button {
        position: absolute;
        top: 223px;
    }

    .modal-content .nav-button .nav-button-left {
            transform: rotate(180deg);
            -webkit-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            position: relative;
            left: 0px;
            cursor: pointer;
        }

    .modal-content .nav-button .nav-button-right {
            position: relative;
            right: 0px;
            cursor: pointer;
        }


.at-view-slide-in-left.ng-enter {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    -o-transition-property: -o-transform, opacity;
    transition-property: transform, opacity;
    -webkit-transition-duration: 0.75s;
    -moz-transition-duration: 0.75s;
    -o-transition-duration: 0.75s;
    transition-duration: 0.75s;
    -webkit-transform: translate(-100%, 0px);
    -moz-transform: translate(-100%, 0px);
    -ms-transform: translate(-100%, 0px);
    -o-transform: translate(-100%, 0px);
    transform: translate(-100%, 0px);
    opacity: 0;
    z-index: 1;
    position: absolute;
}

.at-view-slide-in-left.ng-enter-active {
    -webkit-transform: translate(0px, 0px);
    -moz-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    -o-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
    opacity: 1;
    position: absolute;
}

.at-view-slide-out-right.ng-leave {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    -o-transition-property: -o-transform, opacity;
    transition-property: transform, opacity;
    -webkit-transition-duration: 0.75s;
    -moz-transition-duration: 0.75s;
    -o-transition-duration: 0.75s;
    transition-duration: 0.75s;
    -webkit-transform: translate(0px, 0px);
    -moz-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    -o-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
    opacity: 1;
    z-index: 3;
    position: absolute;
}

.at-view-slide-out-right.ng-leave-active {
    -webkit-transform: translate(100%, 0px);
    -moz-transform: translate(100%, 0px);
    -ms-transform: translate(100%, 0px);
    -o-transform: translate(100%, 0px);
    transform: translate(100%, 0px);
    opacity: 0;
}


        .at-view-slide-in-left.ng-enter {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    -o-transition-property: -o-transform, opacity;
    transition-property: transform, opacity;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transform: translate(-100%, 0px);
    -moz-transform: translate(-100%, 0px);
    -ms-transform: translate(-100%, 0px);
    -o-transform: translate(-100%, 0px);
    transform: translate(-100%, 0px);
    opacity: 0;
    z-index: 1;
    position: absolute;
}

.at-view-slide-in-left.ng-enter-active {
    -webkit-transform: translate(0px, 0px);
    -moz-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    -o-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
    opacity: 1;
    position: absolute;
}

.at-view-flip-out-right-opposite.ng-leave {
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    -o-transition-property: -o-transform, opacity;
    transition-property: transform, opacity;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transform-origin: 100% 50%;
    -moz-transform-origin: 100% 50%;
    -ms-transform-origin: 100% 50%;
    -o-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 1;
}

.at-view-flip-out-right-opposite.ng-leave-active {
    -webkit-transform: rotateY(-90deg);
    -moz-transform: rotateY(-90deg);
    -ms-transform: rotateY(-90deg);
    -o-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
    opacity: 0;
}

.syllabus-menu-header {
    display: table;
    width: 50%;
    height: 44px;
    position:absolute;
    z-index:11;
    background-color:#00AAF1;
    -webkit-box-shadow: 2px 1px 1px 1px rgba(0,0,0,.2);
    box-shadow:2px 1px 1px 1px rgba(0,0,0,.2);
}

    .syllabus-menu-header > div {
        display: table-cell;
        vertical-align: middle;
    }

        .syllabus-menu-header > div:last-child {
            width: 100%;
        }

    .syllabus-menu-header .syllabus-hamburger {
            width: 44px;
            height: 44px;
            margin-left: 30px;
            display:table;
        }

        .syllabus-menu-header .syllabus-hamburger .grip-container {
            display: table-cell;
            vertical-align: middle;
            cursor: pointer;
        }

            .syllabus-menu-header .syllabus-hamburger .grip-container > div {
                border: 1px solid #FFFFFF;
                border-radius: 5px;
                width: 22px;
                margin: 4px auto;
            }

    .syllabus-menu-header .syllabus-topic-subtopic {
            color:#FFFFFF;
        }

        .syllabus-menu-header .syllabus-topic-subtopic .syllabus-topic-name {
            }

        .syllabus-menu-header .syllabus-topic-subtopic .syllabus-subtopic-name {
            }

            .syllabus-menu-header .syllabus-topic-subtopic .syllabus-subtopic-name::before {
                content:" - ";
            }
/* ------------------------------------------- */
.problem-page-tool-bar {
    height: 44px;
    background-color: #50B7E8;
    /*position: relative;
    z-index: 11;*/
}
.problem-page-tool-bar-color {
    background-color: #52b9e8;
}

    .problem-page-tool-bar .tool-bar-container, .problem-page-tool-bar .assistance-pane {
        display: table;
        /*width: 100%;*/
        height:44px;
    }

        .problem-page-tool-bar .tool-bar-container canvas {
            margin-top: 2px;
            margin-left: 10px;
            margin-right: 10px;
        }

        .problem-page-tool-bar .tool-bar-container > div, .problem-page-tool-bar .assistance-pane > div {
            display: table-cell;
            vertical-align: middle;
            padding-right: 10px;
            cursor: pointer;
        }

        .problem-page-tool-bar .tool-bar-container .syllabus-hamburger {
            width: 32px;
            height: 32px;
            border-radius: 50px;
            background-color: #ffffff;
            margin-left: 20px;
            display:table;
        }

            .problem-page-tool-bar .tool-bar-container .syllabus-hamburger .grip-container {
            display: table-cell;
            vertical-align: middle;
            cursor: pointer;
        }

                .problem-page-tool-bar .tool-bar-container .syllabus-hamburger .grip-container > div {
                border: 1px solid #00AAF1;
                border-radius: 5px;
                width: 18px;
                margin: 3px auto;
            }

        .problem-page-tool-bar .tool-bar-container .syllabus-topic-subtopic {
            color:white;
        }
.syllabus-topic-subtopic-font-color {
    color:#ffffff;
}
            .problem-page-tool-bar .tool-bar-container .syllabus-topic-subtopic .syllabus-topic-name {
            }

            .problem-page-tool-bar .tool-bar-container .syllabus-topic-subtopic .syllabus-subtopic-name::after {
                
            }

                .problem-page-tool-bar .tool-bar-container .syllabus-topic-subtopic .syllabus-subtopic-name::before {
                content:" - ";
            }

    .problem-page-tool-bar .topic-subtopic {
        display: inline-block;
        margin-top: 5px;
        float: left;
    }

.video-modal {
    width:80%;
    height:30%;
}

.tutorial-playlist-container {
    /*min-height: inherit;*/
    background-color: #F8F8F8;
    position: absolute;
    right: 0;
    z-index: 8;
    height: 86%;
    /*box-shadow: -2px 3px 5px -1px #CCCCCC;*/
    overflow-y: auto;
    overflow-x: hidden;
}

    .tutorial-playlist-container::-webkit-scrollbar {
        width: 5px;
    }

    .tutorial-playlist-container::-webkit-scrollbar-thumb {
        background-color: #CCCCCC;
        border-radius: 2px;
    }

.tutorial-pane {
    height: 100%;
    min-height: inherit;
    /*transition: 1s;*/
}

    .tutorial-pane.visible {
        text-align: center;
    }

    .tutorial-pane.maximized {
        min-height: inherit;
    }

    .tutorial-pane .heading {
        height: 44px;
        color: #AAAAAA;
        font-size: 16px;
        display: table;
        width: 100%;
        cursor: pointer;
    }

    .tutorial-pane.visible .heading {
        padding-top: 10px;
    }

    .tutorial-pane .heading .handle {
        display:table-cell;
        vertical-align:middle;
    }

    .tutorial-pane.maximized .heading .heading-text {
        display: table-cell;
        vertical-align: middle;
        padding-left: 5px;
    }

    .tutorial-pane .heading .heading-close-btn {
        cursor: pointer;
        padding: 10px;
    }

    .tutorial-pane.maximized .heading .heading-close-btn {
        float: right;
    }

    .tutorial-pane.visible .heading .heading-text {
        display: none;
    }

    .tutorial-pane .playlist {
    }

        .tutorial-pane .playlist .icon {
            width: 30px;
        }

            .tutorial-pane .playlist .icon.playlist-icon:not(:first-child):after {
        content: "";
        position: absolute;
        border-right: 1px solid #CCCCCC;
        height: 100%;
        z-index:-1;
        bottom: 50%;
    }

    .tutorial-pane.visible .playlist .icon.playlist-icon:not(:first-child):after {
        left: 49%;
    }

    .tutorial-pane.maximized .playlist .icon.playlist-icon:not(:first-child):after {
        left: 30%;
    }

    .tutorial-pane .playlist .icon.video-icon:after {
        content: "";
        position: absolute;
        border-right: 1px solid #CCCCCC;
        height: 100%;
        z-index:-1;
        bottom: 70%;
    }

    .tutorial-pane.visible .playlist .icon.video-icon:after {
        left: 49%;
    }

    .tutorial-pane.maximized .playlist .icon.video-icon:after {
        left: 30%;
    }

    .tutorial-pane .playlist .icon.video-icon:before {
        content: "";
        position: absolute;
        z-index: 0;
        background-color: #F8F8F8;
        width: 17px;
        height: 17px;
        border-radius: 50%;
        margin-left:1px;
    }

    .tutorial-pane.visible .playlist .icon.video-icon:before {
        left: 37%;
    }

    .tutorial-pane .playlist .playlist-item {
        display: table;
        width: 100%;
        height: 44px;
        cursor: pointer;
    }

        .tutorial-pane .playlist .playlist-item > div {
        display: table-cell;
        width: 100%;
        height: 100%;
        vertical-align: middle;
    }

            .tutorial-pane .playlist .playlist-item > div > div {
            display: table;
            width: 100%;
            height: 100%;
        }

        .tutorial-pane .playlist .playlist-item .playlist-icon {
            color: #CCCCCC;
            display: table-cell;
            vertical-align: middle;
            position: relative;
            z-index: 1;
        }

    .tutorial-pane .playlist.current .playlist-item .playlist-icon {
        color: #00AAF1;
    }

    .tutorial-pane.visible .playlist .playlist-item .playlist-label {
        display: none;
    }

    .tutorial-pane.maximized .playlist .playlist-item .playlist-label {
        display: table-cell;
        vertical-align: middle;
        font-size: 14px;
        font-weight: 700;
    }

    .tutorial-pane.maximized .playlist.current .playlist-item .playlist-label {
        color: #00AAF1;
    }

    .tutorial-pane .playlist .video {
        height: 44px;
        display: table;
        width: 100%;
        cursor: pointer;
        padding-top: 3px;
        padding-bottom: 3px;
    }

        .tutorial-pane .playlist .video > div {
            display: table-cell;
            width: 100%;
            height: 100%;
            vertical-align: middle;
        }

            .tutorial-pane .playlist .video > div > div {
                display: table;
                width: 100%;
                height: 100%;
            }

    .tutorial-pane.visible .playlist .video .video-label {
        display: none;
    }

    .tutorial-pane.maximized .playlist .video .video-label {
        display: table-cell;
        vertical-align: middle;
        font-size: 13px;
    }

    .tutorial-pane.maximized .playlist.current .video.playing .video-label {
        color: #00AAF1;
    }

    .tutorial-pane .playlist .video .video-icon {
        display: table-cell;
        vertical-align: middle;
        position: relative;
    }

    .tutorial-pane .playlist .icon.video-icon > div {
        background-image: url(/funtoot/Content/Images/video-pdf-play_icon.svg);
        background-repeat: no-repeat;
        height: 20px;
        width: 20px;
        margin: auto;
        position: relative;
        z-index: 2;
        background-position: -9px -9px;
    }

    .tutorial-pane.maximized .playlist .icon.video-icon > div {
        margin: 0;
    }

    .tutorial-pane .playlist.current .video.playing .icon.video-icon > div {
        background-position: -117px -9px;
    }

    .tutorial-pane .playlist .video .pdf-icon {
        display: table-cell;
        vertical-align: middle;
        position: relative;
    }

    .tutorial-pane .playlist .icon.pdf-icon > div {
        background-image: url(/funtoot/Content/Images/youtube-icon.svg);
        background-repeat: no-repeat;
        height: 20px;
        width: 20px;
        margin: auto;
        position: relative;
        z-index: 2;
        background-position: -9px -35px;
    }

    .tutorial-pane.maximized .playlist .icon.pdf-icon > div {
        margin: 0;
    }

    .tutorial-pane .playlist.current .video.playing .icon.pdf-icon > div {
        background-position: -117px -35px;
    }

.tutorial-video-backdrop {
}

.tutorial-video-pane {
    min-height: inherit;
    position: absolute;
    width: 100%;
    z-index: 7;
    background-color: rgba(248,248,248,.55);
}

.back-to-question {
    min-height: inherit;
    background-color: rgba(238,238,238,.9);
    position: absolute;
    width: 16.6666%;
    height: 100%;
    cursor: pointer;
}

    .back-to-question > div {
        display: table;
        height: 20%;
        width: 100%;
        top: 30%;
        position: relative;
    }

        .back-to-question > div > div {
            display: table-row;
        }

            .back-to-question > div > div > div {
            display: table-cell;
            vertical-align: middle;
            text-align: center;
            color: #AAAAAA;
        }


.tutorial-video-container {
    position: absolute;
    width: 58.33%;
    min-height: inherit;
    background-color: #F8F8F8;
    /* z-index: 0; */
    display: table;
    padding: 20px;
    /*transition: 1s;*/
    /*top: 56px;*/
}

    .tutorial-video-container.tutorial-panel-minimized {
    right: 8.33%;
}

    .tutorial-video-container.tutorial-panel-maximized {
    right: 25%;
}

    .tutorial-video-container .tutorial-video-player-container {
    display: table-cell;
    /*background-color: white;*/
    height: 360px;
    width:640px;
}

    .tutorial-video-container .tutorial-video-player-container .playlist-title {
        background-color: #F8f8f8;
        padding-bottom: 10px;
        font-size: 16px;
        color: #00AAF1;
        font-weight: 700;
    }

    .tutorial-video-container .tutorial-video-player-container .video-player-container {
    }

        .tutorial-video-container .tutorial-video-player-container .video-player-container .ft-video-player {
            background-color: #FFFFFF;
        }

            .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist {
            margin-top: 15px;
            display: none; /* hiding the playlist with thumbnails for now. Will be re-enabled once the UI is redesigned post 5.0 */
        }

                .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist > div {
                height: 100px;
                padding-left: 15px;
                padding-right: 15px;
            }

                    .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist > div > div {
                    height: 100%;
                }

                .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist .video-playlist-item {
                /*display: table;*/
                text-align: center;
                height: 100%;
                /*padding-top: 15px;*/
                /*padding-bottom: 15px;*/
                cursor: pointer;
                position: relative;
            }

                .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist .video-playlist-item {
                    /*background-color: #00AAF1;*/
                }

                    .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist .video-playlist-item.playing {
                        border: 1px solid #00AAF1;
                    }

                    .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist .video-playlist-item > div {
                        /*display: table-cell;*/
                        /*height: 100%;*/
                        /*vertical-align: middle;*/
                        /*background-color: #00AAF1;*/
                        /*opacity: .9;*/
                    }

                    .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist .video-playlist-item .video-foreground {
                        position: absolute;
                        left: 0;
                        top: 0;
                        width: 100%;
                        height: 100%;
                        background-color: #00AAF1;
                        opacity: .9;
                        color: #333333;
                        padding-top: 16%;
                        font-size: 13px;
                        overflow: hidden;
                    }

                    .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist .video-playlist-item.playing .video-foreground {
                        opacity:0;
                    }

                        .tutorial-video-container .tutorial-video-player-container .video-player-container .video-playlist .video-playlist-item.playing .video-foreground > span {
                            display: none;
                        }

    .tutorial-video-container .video-tutorial-desc {
        margin-top: 45px;
        font-size: 13px;
        color: #333333;
    }

    /* video js override styles so the controls show up at all times. */
.vjs-default-skin.vjs-has-started .vjs-control-bar {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    bottom: -3.4em !important;
    background-color: rgba(7, 20, 30, 1) !important;
}


.tutorial-video-backdrop {
    position:relative;
    min-height:inherit;
    z-index:0;
}

    .tutorial-video-backdrop:before {
        content: "";
        position: absolute;
        min-height: inherit;
        width: 100%;
        background-color: #000000;
        opacity: 0.5;
        left: 0;
    }

.tutorial-video-containerAnim0 {
    -webkit-transition: 0.2s ease-out;
    transition: 0.2s ease-out;
    right: 0;
}

    .tutorial-video-containerAnim0.ng-hide-remove {
        -webkit-transition: right 0.2s ease-out;
        transition: right 0.2s ease-out;
        right: -1000px;
    }

.back-to-problem {
    font-size: 13px;
    margin-left: 5px;
}

.back-to-problem-icon {
    position:relative;
    top:5px;
}

.back-to-problem-msg {
    font-size: 14px;
    padding: 20px;
}

.video-playlist-item .video-thumbnail {
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    padding-bottom: 64.68%;
}

@-webkit-keyframes shake {
    0% {
        -webkit-transform: translate(2px, 2px) rotate(10deg);
}

    20% {
        -webkit-transform: translate(-4px, -4px) rotate(-10deg);
    }

    40% {
        -webkit-transform: translate(2px, 2px) rotate(10deg);
    }

    60% {
        -webkit-transform: translate(-2px, 2px) rotate(-10deg);
    }

    80% {
        -webkit-transform: translate(4px, -4px) rotate(10deg);
    }

    100% {
        -webkit-transform: translate(-2px, 2px) rotate(-10deg);
    }
}

.shake {
    -webkit-animation-name: shake;
    -webkit-animation-duration: 0.6s;
    -webkit-transform-origin: 50% 50%;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  30% {
    -webkit-transform: translate3d(15%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(15%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-10%, 0, 0) rotate3d(0, 0, 1, -2deg);
    transform: translate3d(-10%, 0, 0) rotate3d(0, 0, 1, -2deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  100% {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  30% {
    -webkit-transform: translate3d(15%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(15%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-10%, 0, 0) rotate3d(0, 0, 1, -2deg);
    transform: translate3d(-10%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  100% {
    -webkit-transform: none;
    transform: none;
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

.pre-post-test-modal {
    margin-top: 10%;
    padding: 0;
  position: relative;
    width: 50%;
}

@-webkit-keyframes bounceInDown {
  0%, 60%, 75%, 90%, 100% {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  100% {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInDown {
  0%, 60%, 75%, 90%, 100% {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  100% {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInUp {
  0%, 60%, 75%, 90%, 100% {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  0%, 60%, 75%, 90%, 100% {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes rubberBand {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

.hvr-grow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
  background-color:lightseagreen;
}

.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.hvr-icon-fade {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  padding-right: 2.2em;
  margin-left: 5px;
}

.hvr-icon-fade:before {
  content: "\f00c";
  position: absolute;
  right: 1em;
  padding: 0 1px;
  font-family: FontAwesome;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-property: color;
  transition-property: color;
}

.hvr-icon-fade:hover:before, .hvr-icon-fade:focus:before, .hvr-icon-fade:active:before {
  color: #0F9E5E;
}

.hvr-icon-bounce {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  padding-right: 2.2em;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

    .hvr-icon-bounce:before {
        content: "\f00c";
        position: absolute;
        right: 0em;
        padding: 0 1px;
        font-family: FontAwesome;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
    }

    .hvr-icon-bounce:hover:before, .hvr-icon-bounce:focus:before, .hvr-icon-bounce:active:before {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
        transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
        color: #0F9E5E;
    }




.pre-post-test-modal .modal-content {
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 39.6%;
    position: relative;
    border-radius: 0;
}

.hvr-icon-bounce:hover:before, .hvr-icon-bounce:focus:before, .hvr-icon-bounce:active:before {
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
  -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
  color: #0F9E5E;
}




    .pre-post-test-modal .modal-content.post-test.exit {
        background-image: url(/funtoot/Content/Images/checkpoint-2-exit.png);
    }

    .pre-post-test-modal .modal-content .modal-body {
        left: 33%;
        position: absolute;
        top: 15%;
        width: 66%;
        color: #FFFFFF;
        font-size: 16px;
    }

        .pre-post-test-modal .modal-content .modal-body .continue-btn {
            border-radius: 0;
            font-size: 20px;
            font-weight: 700;
            height: 44px;
            margin-top: 15%;
        }

    .pre-post-test-modal .modal-content.entry .modal-body .continue-btn {
        color: #00AAF1;
    }

    .pre-post-test-modal .modal-content.exit .modal-body .continue-btn {
        color: #00C164;
    }

.subscribed-modal {
}

    .subscribed-modal .subscribed-content-modal {
        padding: 20px;
    }

.subscription-next-btn {
    background-color: #008ed8;
    border-radius: 0;
    color: #ffffff;
    font-weight: 700;
    height: 44px;
    width: 100%;
}

.subscribed-modal .subscribed-content-modal .login-box {
    padding-top:40px;
}

    .subscribed-modal .subscribed-content-modal .login-box .login-btn {
    background-color: #008ED8;
    height: 44px;
    border-radius: 0px;
    width: 100%;
    color: #FFFFFF;
    font-weight: 700;
    font-size: 18px;
    }

.subscribed-modal .subscribed-content-modal .modal-txt {
    font-size: 24px;
    color: #666666;
    font-weight: bold;
}

.subscribed-modal .modal-msg {
    font-size:20px;
    color:#666666;
    font-weight:bold;
    padding-top:20px;
}

.points-container {
}


.points-container .play_btn, .points-container .points {
    display:table-cell;
}


.points-container .play_btn div, .points-container .points div{
     background-color: #90e2f7;
    font-weight: bold;
}

.confirmation-modal {
    position: fixed;
    top: 20%;
    left: 20%;
    width: 50%;
    font-family:Lato;
}

.redeemable fundaas {
    font-weight:bold;
    color: #666666;
}


.games_bg {
    background-image: url(/funtoot/app/student/games/Images/game-bg.png);
    background-color: #d7f2f9;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    min-height: inherit;
}

.fundaas-scoreboard-container {
    position: relative;
}

.student-home .menubar1 {
    background-color: #90e2f7;
    position: relative; 
    z-index: 12;
}

.redeemable-fundaas-text {
    color: #ffffff;
    font-family: Lato;
    letter-spacing: 2px;
    position: absolute;
    width: 100%;
    left: 5px;
    top: 0px;
    text-align: center;
    font-size: 24px;
}

.games-container .fundaas-description {
    background-color: #d7f2f9;
}


.games-container .fundaas-desc-container {
    font-family: Lato
    background-color: #ffffff;
    color: #00AAF1;
    font-style: italic;
    font-weight: bold;
    text-align: center;
    font-size: 12px;
    letter-spacing: 1px;
}

.games-container .games-tool-bar {
    background-color:#90e2f7;
}

.fundaas_bg {
    background-image: url(/funtoot/app/student/games/Images/back.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    height: 0;
    padding-top: 2%; /* (img-height / img-width * width) */
    /* (853 / 1280 * 100) */
}


.wrapper1 {
    /*display: inline-block;*/
    position: relative;
}

    .wrapper1 img {
        display: block;
        max-width: 100%;
    }

    .wrapper1 .overlay1 {
        position: absolute;
        top: 0;
        width: 100%;
        height: 50px;
        display: table;
        color: #000000;
        padding-left: 5%;
    }

        .wrapper1 .overlay1 > div {
            display: table-cell;
            vertical-align: middle;
            font-weight: bold;
            font-family: Lato;
        }


.games_submit_btn {
    background-color: #90E2F7;
    border: 1px solid #00AAF1;
    color: #00AAF1;
}

.games_cancel_btn {
    background-color: #d7f2f9;
    border: 1px solid #00AAF1;
    color: #00AAF1;
}

.games-modal {
    width: 83.33%; /*(10/12)*/
    margin-top: 2%;
}

.games-modal-header {
    border:none;
}

.games-modal-body-content{
    margin: 4%;
    padding: 0;
}

.games-modal-iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.games-modal-closebtn {
    margin-top:auto !important;
}

.redeemablefundaas-container {
    background-color: #90e2f7;
    position: relative;
    z-index: 12;
}

.games-modal-closebtn {
    border-radius: 66%;
    font-weight: bolder;
}

.vjs-default-skin .vjs-big-play-button {
      left: 40%;
      top: 40%;
}

.subscriptions-expire-modal {
    width: 100%;
    height: 100%;
    padding: 0;
    color: #FFFFFF;
    opacity: .95;
    color: black;
}

    .subscriptions-expire-modal .subscriptions-modal-content {
        display:table;
        width:100%;
        height: 100%;
        border-radius: 0;
    }

    .subscriptions-expire-modal .subscriptions-modal-content > div{
        display:table-cell;
        vertical-align:middle;
    }

    .subscriptions-expire-modal .subscriptions-expire-modal-content {
        padding: 4%;
        background-color: #F8F8F8;
    }

        .subscriptions-expire-modal .subscriptions-expire-modal-content span {
            padding-right: 7px;
        }

        .subscriptions-expire-modal .subscriptions-expire-modal-content div {
            margin-top: 2%;
        }

        .subscriptions-expire-modal .subscriptions-expire-modal-content .upgrade_btn {
            height: 44px;
            background-color: #008ed8;
            color: #ffffff;
            border-radius:0;
            width:100%;
        }

           .subscriptions-expire-modal .subscriptions-expire-modal-content .back_btn {
            height: 44px;
            border-radius:0;
            width:100%;
        }

.sub-expiration-band {
    background-color: #9d1ede;
    height: 25px;
    display: table;
    cursor:pointer;
}


    .sub-expiration-band div {
        display: table-cell;
        vertical-align:middle;
        height: 25px;
        text-align: center; 
        color: #dddddd;
    }
        
     .sub-expiration-band a {
       color: #ffffff;
       font-weight: 800;
    }

.sub-expiration-band .limited-access-subscription {
        color:#ffffff;
        font-weight:bold;
    }


.completion-progress-bar .progress-percent {
    color: #FFAE46;
    font-size: 33px;
}

.progress-message {
    font-size: 16px;
}

.completion-progress-bar .progress-bar {
    background-color: #CCCCCC;
    margin-top: 5px;
    width: 100%;
}

.completion-progress-bar .progress-fill {
    float: left;
    background-color: #FFAE46;
    height: 40px;
}


.migration-status-dialog {
    width: 50%;
    top: 35%;
    position: fixed;
    left: 25%;
}

    .migration-status-dialog > div {
        height: 150px;
        border-radius: 0;
        display: table;
        width: 100%;
    }

        .migration-status-dialog > div > div {
            display: table-cell;
            vertical-align: middle;
        }

.update-parent-contact-modal {
    margin-top:5%;
    position: static;
}

.update-parent-contact-modal-content {
    padding-bottom: 25px;
}

.update-parent-contact-modal-header {
       font-size: 17px;
       margin-left: 17px;
	   padding-top: 10px;
       padding-left: 50px;
       padding-bottom: 5px;
       padding-right: 10px;
}

.update-parent-contact-submit-btn {
    background-color: #008ED8;
    height: 44px;
    width: 100%;
    color: #FFFFFF;
}

.update-parent-contact-not-now-btn {
    background-color: #ccc;
    height: 44px;
    width: 100%;
    color: #666;
}

.update-parent-contact-text-box-height {
     height: 44px;
}

.update-parent-contact-modal-footer-msg {
    padding-top: 8px;
    text-align: center;
    font-size: 13px;
	padding-left: 43px;
}

.update-parent-contact-modal-title {
    margin-top: 25px;
}

.update-parent-contact-modal-close {
    margin-right: 10px;
    margin-top: 10px;
}
/*.update-parent-contact-modal-body {
    margin-left:10px;
}*/
.update-parent-contact-modal-tick {
    color: #22C332;
    margin-left: -30px;
	height: 44px;
    margin-top: 8px;
    padding-left: 23px;
}

.update-parent-contact-modal-country-code {
    font-size: 15px;
    padding-left: 15px;
}


.content-migration-modalwindow { 
            z-index: 5000 !important; 
        }


.btn-social {
    position: relative;
    padding-left: 44px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
        }

    .btn-social :first-child {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 32px;
        line-height: 34px;
        font-size: 1.6em;
        text-align: center;
        border-right: 1px solid rgba(0,0,0,0.2);
    }

    .btn-social.btn-lg {
        padding-left: 61px;
    }

        .btn-social.btn-lg :first-child {
            line-height: 45px;
            width: 45px;
            font-size: 1.8em;
        }

    .btn-social.btn-sm {
        padding-left: 38px;
    }

        .btn-social.btn-sm :first-child {
            line-height: 28px;
            width: 28px;
            font-size: 1.4em;
        }

    .btn-social.btn-xs {
        padding-left: 30px;
    }

        .btn-social.btn-xs :first-child {
            line-height: 20px;
            width: 20px;
            font-size: 1.2em;
        }

.btn-social-icon {
    position: relative;
    padding-left: 44px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 34px;
    width: 34px;
    padding-left: 0;
    padding-right: 0;
}

    .btn-social-icon :first-child {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 32px;
        line-height: 34px;
        font-size: 1.6em;
        text-align: center;
        border-right: 1px solid rgba(0,0,0,0.2);
    }

    .btn-social-icon.btn-lg {
        padding-left: 61px;
    }

        .btn-social-icon.btn-lg :first-child {
            line-height: 45px;
            width: 45px;
            font-size: 1.8em;
        }

    .btn-social-icon.btn-sm {
        padding-left: 38px;
    }

        .btn-social-icon.btn-sm :first-child {
            line-height: 28px;
            width: 28px;
            font-size: 1.4em;
        }

    .btn-social-icon.btn-xs {
        padding-left: 30px;
    }

        .btn-social-icon.btn-xs :first-child {
            line-height: 20px;
            width: 20px;
            font-size: 1.2em;
        }

    .btn-social-icon :first-child {
        border: none;
        text-align: center;
        width: 100% !important;
    }

    .btn-social-icon.btn-lg {
        height: 45px;
        width: 45px;
        padding-left: 0;
        padding-right: 0;
    }

    .btn-social-icon.btn-sm {
        height: 30px;
        width: 30px;
        padding-left: 0;
        padding-right: 0;
    }

    .btn-social-icon.btn-xs {
        height: 22px;
        width: 22px;
        padding-left: 0;
        padding-right: 0;
    }

.btn-facebook {
    color: #fff;
    background-color: #3b5998;
    border-color: rgba(0,0,0,0.2);
}

    .btn-facebook:hover, .btn-facebook:focus, .btn-facebook:active, .btn-facebook.active, .open .dropdown-toggle.btn-facebook {
        color: #fff;
        background-color: #30487b;
        border-color: rgba(0,0,0,0.2);
    }

    .btn-facebook:active, .btn-facebook.active, .open .dropdown-toggle.btn-facebook {
        background-image: none;
    }

    .btn-facebook.disabled, .btn-facebook[disabled], fieldset[disabled] .btn-facebook, .btn-facebook.disabled:hover, .btn-facebook[disabled]:hover, fieldset[disabled] .btn-facebook:hover, .btn-facebook.disabled:focus, .btn-facebook[disabled]:focus, fieldset[disabled] .btn-facebook:focus, .btn-facebook.disabled:active, .btn-facebook[disabled]:active, fieldset[disabled] .btn-facebook:active, .btn-facebook.disabled.active, .btn-facebook[disabled].active, fieldset[disabled] .btn-facebook.active {
        background-color: #3b5998;
        border-color: rgba(0,0,0,0.2);
    }

.btn-google-plus {
    color: #fff;
    background-color: #dd4b39;
    border-color: rgba(0,0,0,0.2);
}

    .btn-google-plus:hover, .btn-google-plus:focus, .btn-google-plus:active, .btn-google-plus.active, .open .dropdown-toggle.btn-google-plus {
        color: #fff;
        background-color: #ca3523;
        border-color: rgba(0,0,0,0.2);
    }

    .btn-google-plus:active, .btn-google-plus.active, .open .dropdown-toggle.btn-google-plus {
        background-image: none;
    }

    .btn-google-plus.disabled, .btn-google-plus[disabled], fieldset[disabled] .btn-google-plus, .btn-google-plus.disabled:hover, .btn-google-plus[disabled]:hover, fieldset[disabled] .btn-google-plus:hover, .btn-google-plus.disabled:focus, .btn-google-plus[disabled]:focus, fieldset[disabled] .btn-google-plus:focus, .btn-google-plus.disabled:active, .btn-google-plus[disabled]:active, fieldset[disabled] .btn-google-plus:active, .btn-google-plus.disabled.active, .btn-google-plus[disabled].active, fieldset[disabled] .btn-google-plus.active {
        background-color: #dd4b39;
        border-color: rgba(0,0,0,0.2);
    }

}


.teacher-report-content .assignments-combo {
    background-color: rgb(248, 248, 248);
    border: 1px solid #d9d9d9;
    color: black;
    border-radius: 4px;
    height: 38px;
    font-weight: normal;
    text-indent: 0.01px;
    text-overflow: "";
    -moz-appearance: none;
    padding-right: 25px;
    padding-left: 10px;
    text-transform: none;
    min-width: 210px;
}

.teacher-report-content .select-revision-pane, .teacher-report-content .topic-selection-pane {
    height: 100%;
    display: table;
}

    .teacher-report-content .topic-selection-pane > div {
        display: table-cell;
        height: 100%;
        vertical-align: middle;
    }

.teacher-report-content .revision-info {
    padding-top : 20px;
    padding-bottom : 20px;
    padding-left: 41px;
    background-color : rgb(248, 248, 248);
}


.teacher-reports .revision-report-content .print-email-pane {
    height: 100%;
}

.teacher-reports .revision-report-content .print-email-pane > div {
    display: table;
    height: 100%;
    float: right;
}

.teacher-reports .revision-report-content .print-email-pane > div > div {
    display: table-cell;
    vertical-align: middle;
    padding-right: 10px;
    padding-left: 10px;
    cursor: pointer;
}

.teacher-report-body .assignment-select-pane .btn-default {
    background-color: #209AF7;
    border-radius: 4px;
    color: #FFFFFF;
    height: 35px;
    margin-left: 10px;
}

.assignment-select-pane > div, topic-progress-select-pane > div {
    padding-top : 10px;
    padding-bottom : 10px;
}

.revision-report-content .header-cell {
    border-right: 1px solid #D7D7D7;
}

.revision-report-content .report-item-cell{
    border-right: 1px solid #D7D7D7;
}

.teacher-reports .test-report  .header-sub-cell {
    border-bottom: 1px solid #D7D7D7;
    font-weight: bold;
    position: relative;
    border-right: 1px solid #D7D7D7;
    text-align: center;
}

.teacher-reports .test-report .report-item .report-item-cell .expand-collapse-toggle {
    padding-right: 5px;
    padding-left:5px;
}

.teacher-reports .revision-report .report-item .report-item-cell .expand-collapse-toggle {
    padding-right: 5px;
    padding-left:5px;
}



.btn-social {
    position: relative;
    padding-left: 44px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .btn-social :first-child {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 32px;
        line-height: 34px;
        font-size: 1.6em;
        text-align: center;
        border-right: 1px solid rgba(0,0,0,0.2);
    }

    .btn-social.btn-lg {
        padding-left: 61px;
    }

        .btn-social.btn-lg :first-child {
            line-height: 45px;
            width: 45px;
            font-size: 1.8em;
        }

    .btn-social.btn-sm {
        padding-left: 38px;
    }

        .btn-social.btn-sm :first-child {
            line-height: 28px;
            width: 28px;
            font-size: 1.4em;
        }

    .btn-social.btn-xs {
        padding-left: 30px;
    }

        .btn-social.btn-xs :first-child {
            line-height: 20px;
            width: 20px;
            font-size: 1.2em;
        }

.btn-social-icon {
    position: relative;
    padding-left: 44px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 34px;
    width: 34px;
    padding-left: 0;
    padding-right: 0;
}

    .btn-social-icon :first-child {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 32px;
        line-height: 34px;
        font-size: 1.6em;
        text-align: center;
        border-right: 1px solid rgba(0,0,0,0.2);
    }

    .btn-social-icon.btn-lg {
        padding-left: 61px;
    }

        .btn-social-icon.btn-lg :first-child {
            line-height: 45px;
            width: 45px;
            font-size: 1.8em;
        }

    .btn-social-icon.btn-sm {
        padding-left: 38px;
    }

        .btn-social-icon.btn-sm :first-child {
            line-height: 28px;
            width: 28px;
            font-size: 1.4em;
        }

    .btn-social-icon.btn-xs {
        padding-left: 30px;
    }

        .btn-social-icon.btn-xs :first-child {
            line-height: 20px;
            width: 20px;
            font-size: 1.2em;
        }

    .btn-social-icon :first-child {
        border: none;
        text-align: center;
        width: 100% !important;
    }

    .btn-social-icon.btn-lg {
        height: 45px;
        width: 45px;
        padding-left: 0;
        padding-right: 0;
    }

    .btn-social-icon.btn-sm {
        height: 30px;
        width: 30px;
        padding-left: 0;
        padding-right: 0;
    }

    .btn-social-icon.btn-xs {
        height: 22px;
        width: 22px;
        padding-left: 0;
        padding-right: 0;
    }

.btn-facebook {
    color: #fff;
    background-color: #3b5998;
    border-color: rgba(0,0,0,0.2);
}

    .btn-facebook:hover, .btn-facebook:focus, .btn-facebook:active, .btn-facebook.active, .open .dropdown-toggle.btn-facebook {
        color: #fff;
        background-color: #30487b;
        border-color: rgba(0,0,0,0.2);
    }

    .btn-facebook:active, .btn-facebook.active, .open .dropdown-toggle.btn-facebook {
        background-image: none;
    }

    .btn-facebook.disabled, .btn-facebook[disabled], fieldset[disabled] .btn-facebook, .btn-facebook.disabled:hover, .btn-facebook[disabled]:hover, fieldset[disabled] .btn-facebook:hover, .btn-facebook.disabled:focus, .btn-facebook[disabled]:focus, fieldset[disabled] .btn-facebook:focus, .btn-facebook.disabled:active, .btn-facebook[disabled]:active, fieldset[disabled] .btn-facebook:active, .btn-facebook.disabled.active, .btn-facebook[disabled].active, fieldset[disabled] .btn-facebook.active {
        background-color: #3b5998;
        border-color: rgba(0,0,0,0.2);
    }

.btn-google-plus {
    color: #fff;
    background-color: #dd4b39;
    border-color: rgba(0,0,0,0.2);
}

    .btn-google-plus:hover, .btn-google-plus:focus, .btn-google-plus:active, .btn-google-plus.active, .open .dropdown-toggle.btn-google-plus {
        color: #fff;
        background-color: #ca3523;
        border-color: rgba(0,0,0,0.2);
    }

    .btn-google-plus:active, .btn-google-plus.active, .open .dropdown-toggle.btn-google-plus {
        background-image: none;
    }

    .btn-google-plus.disabled, .btn-google-plus[disabled], fieldset[disabled] .btn-google-plus, .btn-google-plus.disabled:hover, .btn-google-plus[disabled]:hover, fieldset[disabled] .btn-google-plus:hover, .btn-google-plus.disabled:focus, .btn-google-plus[disabled]:focus, fieldset[disabled] .btn-google-plus:focus, .btn-google-plus.disabled:active, .btn-google-plus[disabled]:active, fieldset[disabled] .btn-google-plus:active, .btn-google-plus.disabled.active, .btn-google-plus[disabled].active, fieldset[disabled] .btn-google-plus.active {
        background-color: #dd4b39;
        border-color: rgba(0,0,0,0.2);
    }

    .parent-home .tool-bar.parent-revision-tool-bar{
        line-height: 23px; 
    }

.parent-revision-tool-bar .toolbar-button {
    float: left;
    color:black;
    font-weight: 600;
}

.parent-revision-tool-bar .sub-header-strip-btn-active {
    color: #209AF7 !important;
    font-weight: 600;
}

.parent-revision .assignment-syllabus-tree {
    padding-top : 0;
}


.parent-home .menubar .btn-parent-upgrade {
    display: none;
    margin-left: 10px;
    color: white;
    background-color: #f8981d;
    box-shadow: none;
    border: none;
    border-radius: 0px;
    font-size: 15px;
    font-weight: bold;
}

input[name=showNumberSpinner]::-webkit-inner-spin-button {
    opacity: 1;
}

.disable-next-step {
  pointer-events: none;
  opacity: 0.5;
}

.backgroundgreen {
    background-color: #5cb85c;
}

.backgroundred {
    background-color: black;
}

li.active {
    margin:2px 0px;
    background-color: #ffffff;
    font-weight: 600;
    border-right: 0px;
}

.nav-tabs{
    border-bottom:0px !important;
}

li.active > a {
    border:0px;
    }

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    background-color:#ffffff;
    color:#428bca;
    border-right: 0px;
    border:0px;
    width: 101%;
    z-index: 1000;
}

li.inactive {
background-color: #ffffff;
margin:2px 0px;
}

li.inactive > a {
    background-color: #E8F4FE;
    font-weight: 600;
    color: #262331;
    font-size:16px;
}

.nav > li > a:hover, .nav > li > a:focus {
    background-color: #d9efef;
    font-size:16px;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    color: black;
    font-size:16px;
}

nav-pills > li > a {
    border-radius:0px;
    font-size:16px;
}

.nav-tabs > li > a {
    border-radius: 0px;
    margin-right:0px;
    font-size:16px;
}

.nav-buttons {
    color: black;
    width: 100px;
    padding: 6px;
    cursor: pointer;
    border: 2px solid #d9d9d9;
}

.nav-buttons:active {
   box-shadow: none;
}

.band-color-icon {
    display: inline-block;
    height: 0.8571428em;
    width: 0.8571428em;
    border-radius: 50%;
    margin-right: 2px;
}

.test-problem-pane {
    /*border-bottom: 1px solid #6B608B;*/
    /*border-top: 1px solid #6B608B;*/
    /*border-left: 1px solid #6B608B;*/
    /*border-right: 1px solid #6B608B;*/
    page-break-inside: avoid;
}

    .test-problem-pane .problem_control {
        /*background-color: #E3E3E3;*/
    }

        .test-problem-pane .problem_control .table {
            /*display: table;*/
        }

        .test-problem-pane .problem_control .table_cell {
            /*display: table-cell;*/
            vertical-align: middle;
            padding-top: 14px;
        }


        .test-problem-pane .problem_control .value_display {
            padding-right: 20px;
            display: table;
        }

        .test-problem-pane .problem_control .marks_pane {
            width: 15%;
            text-align: center;
        }

    .test-problem-pane .problem_info_pane1 {
        background-color: #EEEEEE;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .test-problem-pane .problem_info_pane2 {
        background-color: #F8F8F8;
        padding-top: 10px;
        padding-bottom: 10px;
    }


    .test-problem-pane .problem_display {
    }

    .test-problem-pane .question-label {
        padding: 10px;
        width:40px;
        height: 40px;
        margin-left: -15px;
        background-color: #aaaaaa;
        color: #FFFFFF;
        float:left;
    }
    .marks-label{
        background: #aaaaaa;
        padding: 10px;
        float: right;
        margin-right: -15px;
        color: white;
    }

    .test-details-print-head{
        padding:10px;
        background:#eeeeee;
    }
    @media print{
        .test-problem-pane .question-label {
            border:1px solid silver;
        }
    }


.assignment-print-preview-btn-pane {
    position:absolute;
    z-index: 1000;
    right: 40px;
}

.questions-print-preview-button {
    float:right;
}

.marks-band-content {
    border: 1px solid lightgray; 
    border-radius: 4px;
    text-align: center;
    font-weight: bold;
}

.marks-band-body {
    padding: 10px;
    margin-left: 0;
    margin-right:0;
}

.marks-band-pane {
    text-align: left;
}

.marks-band-value {
    width: 52px;
}

.marks-band-questioncount {
    width: 52px;
}

.marks-band-footer {
    border-top: 1px solid lightgray; 
    text-align: center; 
    padding: 10px; 
    background-color: #fef6f4;
}

.marks-band-content .table td {
    border-top: 0;
}

.test-tablist {
    margin-right: 0; 
    padding-right: 0;
    padding-left: 0;
}

.test-tab-content-pane {
    overflow:hidden;
}

.test-navbutton-pane {
    height:48px; 
    background-color: #F8F8F8; 
    padding:6px; 
    overflow:hidden;
    border-bottom: 1px solid #eaeaea;
}

.test-navbutton-alignment {
    text-align: center;
}

.test-tab1-content {
    padding:2%;
    font-size: 16px;
}

.test-info-icon {
    color: blue;
}

.test-type {
    width: auto; 
    cursor: pointer;
}

.test-tab2-content {
    padding:2%;
        padding-top: 0;
}

.test-syllabus-tree {
    list-style-type: none; 
    border: 1px solid lightgray; 
    border-radius: 4px; 
    height:375px; 
    overflow:auto;
}

.manual-test-Add-question {
    height:500px; 
    overflow-y:auto;
    overflow-x:hidden;
}

.test-duration-pane {
    padding:20px 20px 15px 0px;
}

.test-duration-pane-value {
    width: 55px;
}

.test-marks-band-pane {
    padding: 16px 10px 14px 16px;
}

.create-test-pane {
    padding:20px 10px 14px 0px;
}

.view-edit-header {
    height: 60px; 
    padding-top: 7px; 
    overflow: hidden;
    border-bottom: 1px solid #cccccc;
}

.view-edit-marks-band {
    padding: 2px;
}

.view-edit-marks-band-row {
    border-right: 1px solid #666666;
}

.view-edit-marks-band-name {
    border: 1px solid #666666; 
    border-right: 0px; 
    border-bottom: 0px;
}

.view-edit-marks-band-data {
    border: 1px solid #666666; 
    border-right: 0px;
}

.test-add-problems-btn-pane {
    padding: 2px;
}

@media only screen {
    .view-edit-content {
        overflow-y: scroll;
        overflow-x: hidden;
    }
}

@media only print {
    .view-edit-content {
    }
}

.add-problem-syllabus-pane {
    padding-bottom: 10px;
}

.test-sol-icon {
    background-color: rgba(41, 249, 15, 0.4);
    margin-top: 0;
    margin-bottom: 0;
    width: 36%;
    padding-left: 2px;
}
    
.addProblem-sol-icon {
    background-color: rgba(41, 249, 15, 0.4);
    margin-top: 0;
    margin-bottom: 0;
    width: 46%;
    padding-left: 3px;
}

.test-delete-icon {
    border-radius: 50%;
    cursor:pointer;
    background-color: rgba(41, 249, 15, 0.4);
    text-align: center;
}

  .todo-item.ng-leave {
   -webkit-animation: leave .6s cubic-bezier(.55,-0.04,.91,.94) forwards;
    animation: leave .6s cubic-bezier(.55,-0.04,.91,.94) forwards;
    /*display: block;
    position: relative;
    transform-origin: 0% 100%;*/
  }


@keyframes leave {
        from {
        opacity: 1;
        transform: scale(1);
    }
 
    to {
        opacity: 0;
        transform: scale(0);
    }
}

.displayicon {
   display: none;
  padding:10px;
   /* I assume you'll need display: none; on initialization */ 
}

.parent_div:hover .displayicon { 
   /* This selector will apply styles to hotqcontent when parent_div will be hovered */
   display: block;
    padding:10px;
   /* Other styles goes here */
}

.compare-result {
        text-align: center;
}

.addproblem-title {
    margin-top: 7px;
    text-align: right;
}

.existingProblem {
    /*background-color:#ffffff;*/
    /*border:2px solid rgb(75, 199, 93);
    border-bottom:1px solid rgb(75, 199, 93);*/
}

.newProblem {
    background-color:#F8F8DE;
     /*border:2px solid #cccccc;
     border-bottom:1px solid #cccccc;*/
}

.edit-Problem-border {
    border:2px solid #cccccc;
    border-bottom:1px solid #cccccc;
}

.test-busy-spinner {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1000;
    pointer-events: none;
    opacity: 0.5;
}
    
.range-ctrl-container {
            width: 100%;
            height: 40px;
        }



.view-edit-marks-band .table > tbody > tr > td {
    padding: 1px;
    line-height: 1.428571429;
    vertical-align: middle;
    text-align: center;
}

.view-edit-marks-band .table-bordered  tr > td {
    border-color: 1px solid lightgrey;
}

.view-edit-band-header {
    font-weight: bold;
}

.view-edit-total-marks {
    font-weight: bold;
    padding-top: 13px;
}

.topic-progress-selection-pane {
    height: 80px;
}

.topic-progress-selection-pane .topic-selection-combo {
    background-color: #FFFFFF;
    margin-left: 30px;
    width: 30%;
    height: 100%;
    display: table;
}

    .topic-progress-selection-pane .topic-selection-combo > div {
        display: table-cell;
        vertical-align: middle;
    }

.select-revision-pane .assignments-combo, .topic-progress-selection-pane .topic-selection-combo {
    /*background-color: rgb(248, 248, 248);*/
    border: 1px solid #d9d9d9;
    color: black;
    border-radius: 4px;
    height: 38px;
    font-weight: normal;
    text-indent: 0.01px;
    text-overflow: "";
    -moz-appearance: none;
    padding-right: 25px;
    padding-left: 10px;
    text-transform: none;
    background: url(/funtoot/Content/Images/dropDown_new.png) no-repeat scroll 100% center #F6F6F6;
    text-indent: 0.01px;
    text-overflow: "";
    -webkit-appearance: none;
    -moz-appearance: none;
}

.end-of-sc-card .sc-finished {
    color:#51b9e8;
}

.end-of-sc-card .sc-pending {
    color:#999999;
}

.end-of-sc-card .end-of-sc-card-body {
    background-color:#efefef;
    margin-top: 14px;
}

.end-of-sc-card .end-of-sc-card-title {
    padding-top: 24px;
    padding-bottom: 16px;
}

.end-of-sc-card .left-pane, .revision-status-card .left-pane {
    /*padding-top: 2%;*/
    padding-bottom: 29px;
}

.end-of-sc-card .separator-line, .revision-status-card .separator-line {
    border-right: 1px solid #d2d2d2;
    text-align: right;
    padding-right: 60px;
    margin-bottom: 31px;
}

.end-of-sc-card .donut, .revision-status-card .donut {
        height: 138px;
        padding-right: 25px;
}

.end-of-sc-card .completion-n-success-donut, .revision-status-card .completion-n-success-donut {
    position: relative;
    width: 138px;
    height: 138px;
}

.end-of-sc-card .completion-donut-text, .revision-status-card .completion-donut-text {
    color: #999999;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    width: 100%;
    text-align: center;
    position: absolute;
    top: 60%;
}

.end-of-sc-card .success-donut-text, .revision-status-card .success-donut-text {
    color: #999999;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    width: 100%;
    text-align: center;
    position: absolute;
    top: 60%;
}

.end-of-sc-card .completion-donut-title, .revision-status-card .completion-donut-title {
    color: #999999;
    font-weight: bold;
    font-size: 14px;
    padding-bottom: 16px;
    padding-top: 10px;
    text-align: center;
    padding-left: 23%;
}

.end-of-sc-card .success-donut-title, .revision-status-card .success-donut-title {
    color:#999999;
    font-weight:bold; 
    font-size: 14px;
    padding-top: 10px;
    text-align: center;
    padding-left: 40%;
}

.end-of-sc-card .donut-color-correct, .revision-status-card .donut-color-correct {
    color:#51b9e8;
}

.end-of-sc-card .donut-color-incorrect, .revision-status-card .donut-color-incorrect {
    color:#e26c6c;
}

.end-of-sc-card .right-pane, .revision-status-card .right-pane {
    padding-left: 50px;
}

.end-of-sc-card .right-pane-title, .revision-status-card .right-pane-title {
    color:#333333; 
    font-size:14px; 
}

.end-of-sc-card .toggle-button, .revision-status-card .toggle-button {
    color: #333333;
    font-size: 12px;
    padding: 8px;
    cursor: pointer;
}

.end-of-sc-card .ssc-list, .revision-status-card .ssc-list {
    /*height:130px;
    overflow-y:auto;*/
    margin:auto;
    margin-bottom: 11px;
}

.end-of-sc-card .ssc-item, .revision-status-card .ssc-item {
    padding:3px;
}

.end-of-sc-card .ssc-pending, .revision-status-card .ssc-pending {
    color:#999999;
    display:inline-block;
    font-weight:bold;
}

.end-of-sc-card .sc-pending::before, .revision-status-card .sc-pending::before {
    content: "-";
    margin-right: 4px;
}

.end-of-sc-card .btn-space, .revision-status-card .btn-space {
    padding-bottom: 5px;
    padding-top: 5px;
}

.end-of-sc-card .end-of-sc-btn , .revision-status-card .end-of-sc-btn{
    color: #ffffff;
    text-align: left;
    font-size: 14px;
    padding-left:7px;
    width: 90%;
    margin:auto;
    background-color: #51b9e8;
    border-radius: 4px;
    min-height: 30px;
    line-height: 30px;
    cursor:pointer;
}

.end-of-sc-card .fundaas-pane {
    background-color: #51b9e8;
    color: #ffffff;
    font-weight: bold;
    height: 64px;
    text-align: center;
}

.end-of-sc-card .fundaas-total {
    font-size: 30px;
    padding-right: 5px;
    vertical-align: middle;
}

.end-of-sc-card .fundas-text {
    text-align: left;
    font-size: 18px;
    padding-top: 11px;
    padding-left: 5px;
    display: inline-block;
}

.end-of-sc-card .fundas-text-fundaas {
    height: 20px;
}

.end-of-sc-card .fundas-div {
    margin: 0 auto;
    height: 64px;
}

.end-sc-close-icon {
    background-image: url(/funtoot/Content/images/endOfSCCardIcons.png);
    background-repeat: no-repeat;
    height: 38px;
    width: 38px;
    background-position: -2px -4px;
    cursor: pointer;
}

.end-sc-tick-icon {
    background-image: url(/funtoot/Content/images/endOfSCCardIcons.png);
    background-repeat: no-repeat;
    height: 16px;
    width: 11px;
    background-position: -13px -50px;
    display: inline-block;
}

.end-sc-view-icon {
    background-image: url(/funtoot/Content/images/endOfSCCardIcons.png);
    background-repeat: no-repeat;
    height: 21px;
    width: 22px;
    background-position: -8px -76px;
    display: inline-block;
}

.end-sc-revise-icon {
    background-image: url(/funtoot/Content/images/endOfSCCardIcons.png);
    background-repeat: no-repeat;
    height: 23px;
    width: 18px;
    background-position: -8px -114px;
    display: inline-block;
    margin-bottom: -4px;
}

.end-sc-strength-weakness-icon {
    background-image: url(/funtoot/Content/images/endOfSCCardIcons.png);
    background-repeat: no-repeat;
    height: 23px;
    width: 18px;
    background-position: -10px -149px;
    display: inline-block;
    margin-bottom: -4px;
    margin-right: -4px;
}

.end-of-sc-card .recommendation-title {
    color: #333333;
    font-size: 14px;
    padding-top: 21px;
}

.end-of-sc-card .recommended-sc {
    color: #51b9e8;
    text-decoration: underline;
    font-size: 14px;
    cursor:pointer;
}

.end-of-sc-card .modal-color, .revision-status-card .modal-color {
     background-color: #333333;
}

.end-of-sc-card .closeBtn, .revision-status-card .closeBtn {
    right: 30px;
    opacity: 0.5;
}

.end-of-sc-card .card-header1, .revision-status-card .card-header1 {
        color: #cccccc;
        font-size: 1.28571em;
        color: #999999;
        font-size: 14px;
        font-weight:bold;
        text-align: center;
    }

.end-of-sc-card .card-header1 h3{

}

    .end-of-sc-card .card-header1 > span:last-child, .revision-status-card .card-header1 > span:last-child {
        color: #333333;
    }

    .end-of-sc-card .card-header1 > span:not(:last-child)::after, .revision-status-card .card-header1 > span:not(:last-child)::after {
        content: ">";
        margin-left: 5px;
        margin-right: 5px;
        font-size: smaller;
    }

.end-of-sc-card .sc-lock-pane {
    padding-bottom:15px;
}

.end-of-sc-card .sc-lock {
    margin-top: 0;
}

.end-of-sc-fundas {
    width: 50%;
    margin: 0 auto;
    text-align: center;
}

.revision-status-card .revision-card-title {
    padding-top: 24px;
    padding-bottom: 36px;
}

.revision-status-card .revision-card-body {
    background-color:#fafafa;
    margin-top: 14px;
}

.revision-status-card .rev-card-footer {
    background-color: var(--embibe-blue);  
    color: #ffffff;
    font-weight: bold;
    height: 64px;
    text-align: center;
}

.fundas-div {
    height: 100%;
    display: table;
    width: 100%;
}

.revision-status-card .rev-card-footer > div {
    height: 100%;
}

.fundaas-total {
    display: table-cell;
    text-align: center;
    height: 100%;
    vertical-align: middle;
    width: 100%;
    font-size: 24px;
}

.revision-status-card .revision-syllabus {
    color:#999999;
}

.revision-status-card .revision-syllabus::before {
    content: "-";
    margin-right: 4px;
}

.parent-revision .revision-syllabus-parent{
    padding-top: 10px;
}

 .revision-status-card .test-submited{
    color: #ffffff;
    text-align: left;
    padding: 5px;
    /* padding-left:7px; */
    font-size: 14px;
    width: 80%;
    background-color: #2ebb9b;
    border-radius: 4px;
    height: 30px;
    cursor:pointer;
}

 .revision-status-card .submitToTeacher{
    color: #ffffff;
    text-align: left;
    padding: 5px;
    /* padding-left:7px; */
    font-size: 18px;
    width: 50%;
    background-color: #ff8000;
    border-radius: 4px;
    height: 80px;
    padding:10px;
    cursor:pointer;
    display: grid;
    place-content: center;
}

.revision-status-card .submitToTeacher .submit-to-teacher-info{
    font-size: 14px;
    display: block;
    opacity: 0.7;
}

 .revision-status-card .completion-donut-title-test {
    color: #999999;
    font-weight: bold;
    font-size: 14px;
    padding-bottom: 16px;
    padding-top: 10px;
    text-align: center;
    padding-left: 68px;
}

 .revision-status-card .completion-donut-title-assessment {
    color: #999999;
    font-weight: bold;
    font-size: 14px;
    padding-bottom: 16px;
    padding-top: 10px;
    text-align: center;
    padding-left: 56px;
}

.topic-progress {
}

    .topic-progress .controls-pane {
        height: 80px;
        padding-bottom: 20px;
    }

    .topic-progress .filter-pane {
        /*height: 100%;*/
    }

    .topic-progress .filter-pane > div {
        height: 100%;
        display: table;
        /*width: 100%;*/
    }

        .topic-progress .filter-pane > div > div {
            display: table-cell;
            /*padding-top: 1.5em;*/
            vertical-align: middle;
        }

    .topic-progress .download-pane {
        height: 100%;
    }

        .topic-progress .download-pane > div {
            height: 100%;
            display: table;
            width: 100%;
        }

            .topic-progress .download-pane > div > div {
                display: table-cell;
                /*padding-top: 1.5em;*/
                vertical-align: middle;
                cursor: pointer;
            } 


 .topic-progress .tp-item-prev {
        height: 3em;
        border-bottom: 1px solid #D7D7D7;
        border-right: 1px solid #D7D7D7;
    }

    .topic-progress .tp-item {
        display: table;
        height: 100%;
        margin: 0 auto;
    }

    .topic-progress .tp-item .tp-cell {
        display: table-cell;
        vertical-align: middle;
        margin-right: 5px;
    }

    .topic-progress .tp-progressbar {
        position: relative;
        height: 1em;
        width: 100%;
        background-color: #F6F6F6;
        border: 1px solid #D7D7D7;
    }

    .topic-progress .tp-progressbar > div {
        position: absolute;
        background-color: #4BC75D;
        height: 0.9em;
    }


.test-duration-pane .duration-warning > i{
    color:#EADA13;
    display : table-cell;
    vertical-align: middle;
}

.test-duration-pane .duration-warning > span{
    display : table-cell;
    padding-left: 10px;
}

.test-name-pane .test-name {
    color:#666666;  
    font-size:16px;
    margin-top: 7px;
}

.test-name-pane {
    margin-top: -27px;
    background-color: #C5E7E7;
    border-bottom: 1px solid #F8F8F8;
}

.marks-band-content .table td {
    text-align:center;
}


.marks-band-content .table {
    margin-bottom:0;
}

.addproblem-table {
     margin-bottom:0;
}

.addproblem-marks-band-table {
    margin-bottom: 5px;
}

.filters .table td {
    border-top: 0px;
    vertical-align: middle;
}

.test-name-center {
    padding: 6px;
}

.micro-hint-backdrop {
    position: fixed;
    height:100%;
    width: 100%;
    background-color: rgba(0,0,0,.3);
    z-index: 4;
    top: 0;
    left: 0;
}

.micro-hint-container .micro-hint-backdrop {
    position: absolute;
    height:unset;
}

.micro-hint {
    position:absolute;
}

.micro-hint-popup {
    position: relative;
    padding-left: 10px;
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    border-radius: 8px;
    background-color: #FFFFFF;
    border: 1px solid #F6981D;
    max-width: 400px;
    min-width: 250px;
    left: -47%;
    z-index: 5;
    box-shadow: -2px 4px 3px 0 rgba(0, 0, 0, 0.2);
}

.micro-hint-header {
    margin-bottom: 10px;
    font-size: 16px;
    color: #F6981D;
}

.micro-hint-close {
    position: absolute;
    top: 0px;
    right: 5px;
    cursor: pointer;
}

.micro-hint-popup-connector {
    height: 34px;
    width: 3px;
    border-left: 3px solid #FFFFFF;
    position: absolute;
    top: -34px; /* should be same as height */
    left: 13px; /* should adjust this when the icon size changes */
    z-index: 5;
}

.micro-hint-icon-popup-showing {
    position: relative;
    z-index: 12;
}

.micro-hint-icon {
    background-image: url(/funtoot/Content/images/micro-hint-icons.png);
    background-repeat: no-repeat;
    width: 28px;
    height: 28px;
    cursor: pointer;
}

    .micro-hint-icon.micro-hint-unread {
        background-position: 0px 0px;
    }
    
    .micro-hint-icon.micro-hint-read {
        background-position: 0px -56px;
    }
    
    .micro-hint-icon.micro-hint-glowing {
        background-position: 0px -28px;
        position: relative;
        z-index: 5;
    }

.print-form .report-item .report-item-cell {
    height:3em;
    border-right: 1px solid #D7D7D7;
}

.print-form .report-item .report-item-cell.progress-cell:not(:last-child) {
    border-right: none;
}

.print-form .print-report-header {
    border-top: 1px solid #D7D7D7;
}

.print-download-icons {
    padding: 25px;
}

.print-report-header {
    top: 0;
}

.print-report-footer {
    bottom: 0;
}

.teacher-report-preview {
    text-align: center;
    padding-left: 7%;
    padding-right: 7%;
}

.Edit-topic-weightages {
    padding-top:6px;
    padding-right:6px;
}

.assistance-pane .micro-hint-pane {
    display:table;
}


.assistance-pane .micro-hint-pane > div {
    display:table-cell;
}

    .assistance-pane .micro-hint-pane .microhint-count {
        vertical-align: middle;
        border-radius: 50%;
        cursor: pointer;
        position: relative;
        z-index: 15;
        background-color: rgba(255, 255, 255, 0.7);
        width: 32px;
        text-align: center;
        right: -6px;
        font-weight: bold;
    }

    .assistance-pane .micro-hint-pane .icon {
        /*border: 1px solid #90E2F7;*/
    }

.question-trail-modal .assistance-pane {
    position: absolute;
    right: 50px;
    top: 5px;
}


.mynewclassclose {
    position: absolute;
    margin: 0;
    top: 55px; /* half height of "X" image, just for nice placing*/
    right: -130px; /* half width of "X" image, just for nice placing*/
    opacity: 1;
    z-index: 200;
    width: 50px;
    height: 50px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.42;
    border-radius: 25px;
}

    .mynewclassclose:hover {
        opacity: 1;
}

.test-finish-step {
    text-align: center;
    padding-left: 25%;
    padding-top: 5%;
}

.test-apply-to-all-section {
    text-align: left;
    padding-top: 6px;
}

.ice-ins, .ice-ins p {
    background-color:transparent;
    text-decoration:none;
}

.ice-del {
    display:none;
}

.microhint-read.mcq-option-error {
    border-color : #F7E01D;
    background-color: #FDF2B6;
}

.microhint-unread.mcq-option-error {
    border-color : #FF8E08;
    background-color: #FFD9B0;
}

.asm-error > .microhint-read {
    border:1px solid #F7E01D;
    background-color: #FDF2B6;
}

.asm-error > .microhint-unread {
    border:1px solid #FF8E08;
    background-color: #FFD9B0;
}

.mcq_btn_error.mcq-option-with-img.microhint-read {
    border-color : #F7E01D;
}

.mcq_btn_error.mcq-option-with-img.microhint-unread {
    border-color : #FF8E08;
}

.seq-error.microhint-read {
    border-color : #F7E01D;
}

.seq-error.microhint-unread {
    border-color : #FFD9B0;
}

.mtf-premise.microhint-read {
    border : 1px solid #F7E01D;
}

.mtf-premise.microhint-unread {
    border :1px solid #FFD9B0;
}

.microhint-read.asm-error {
    border-color : #F7E01D;
    background-color: #FDF2B6;
}

.microhint-unread.asm-error {
    border-color : #FF8E08;
    background-color: #FFD9B0;
}

.asm-error > .microhint-read {
    border:1px solid #F7E01D;
    background-color: #FDF2B6;
}

.asm-error > .microhint-unread {
    border:1px solid #FF8E08;
    background-color: #FFD9B0;
}

.microhint-read.bills-error {
    border-color : #F7E01D;
    background-color: #FDF2B6;
}

.microhint-unread.bills-error {
    border-color : #FF8E08;
    background-color: #FFD9B0;
}

.has-error.microhint-read > .form-control{
    border-color : #F7E01D;
}

.has-error.microhint-unread > .form-control{
    border-color : #FF8E08;
}

.microhint-read.fill-in-blank {
    border:1px solid #F7E01D;
}

.microhint-unread.fill-in-blank {
    border:1px solid #FF8E08;
}

ftdropdown.microhint-read {
    border:1px solid #F7E01D;
}

ftdropdown.microhint-unread {
    border:1px solid #FF8E08;
}

.microhint-read.fillInBlank-select {
    border: 1px solid #F7E01D;
}

.microhint-unread.fillInBlank-select {
    border: 1px solid #FF8E08;
}

.has-error > .microhint-read.form-control{
    border-color : #F7E01D;
}

.has-error > .microhint-unread.form-control{
    border-color : #FF8E08;
}

.microhint-read.lcm-input {
    border: 1px solid #F7E01D;
}

.microhint-unread.lcm-input {
    border: 1px solid #FF8E08;
}

.horizontal-control-input {
    border:none;
}

.microhint-read.showborder {
    border: 1px solid #F7E01D;
}

.microhint-unread.showborder {
    border: 1px solid #FF8E08;
}

.microhint-read input.lcm-box {
      border: 1px solid #F7E01D;
}

.microhint-unread input.lcm-box {
      border: 1px solid #FF8E08;
}

.microhint-read.mcq-options-container {
    border: 1px solid #F7E01D;
    background-color: #FDF2B6;
}

.microhint-unread.mcq-options-container {
    border: 1px solid #FF8E08;
    background-color: #FFD9B0;
}

.microhint-read.mcq-options-with-image-container {
    border: 1px solid #F7E01D;
    background-color: #FDF2B6;
}

.microhint-unread.mcq-options-with-image-container {
    border: 1px solid #FF8E08;
    background-color: #FFD9B0;
}

.smart-test-acknowledgment {
	padding: 15px;
}


.timer-container{
    font-size:18px;
    background-color: #222222;
    color: #DDDDDD;
    float: left;
    height: 37px;
    padding-left:2px;
    padding-right:2px;
}

.timer-part{
    float: left;
}

.timer-part .header{
    font-size:6px;
    text-align:center;
    padding-top: 2px;
    padding-bottom: 3px;
}

.timer-digit{
    float:left;
    background-color: #555555;
    min-width: 13px;
    margin-right:1px;
    text-align: center;
    border-radius: 1px;
}

.timer-digit-warn{
    color:#FFAA00;
}

.timer-digit-severe{
    color:#FF2200;
}

.timer-digits-container{
    float:left;
}

.timer-part-separator{
    float:left;
}

.timer-part-separator:before{
    content:".";
    position:relative;
    top:5px;
    left:-.5px;
    display:block;
    height:1px;
}

.timer-part-separator:after{
    content:".";
    position:relative;
    top:9px;
    left:-.5px;
    display:block;
    height:1px;
}

.login-header-msg {
    color:#4a4a4a;
}

.report-download-button {
    margin-top: 24px;
}

.test-instruction-and-questions-pane {
    padding-top: 10px;
}

    .test-instruction-and-questions-pane .question-paper {
        float: left;
        padding-left: 16%;
    }

    .test-instruction-and-questions-pane .instructions {
        text-align: right;
        padding-right: 5%;
    }

.test-instruction-and-questions-pane .icon-padding {
    padding-right: 1px;
}

.test-instruction-and-questions-pane .icon-pointer {
   cursor: pointer;
}

.test-instruction-card {
    width: 80%;
    margin-top:56px;
}

    .test-instruction-card .modal-content {
        border-radius: 0px;
    }
        
    .test-instruction-card .scroll {
        max-height: 500px;
        overflow-x: hidden;
        overflow-y: auto;
        margin-left: 0;
        margin-right: 0;
    }

    .test-instruction-card .close {
        position: absolute;
        top: 10px;
        right: 30px;
    }

    .test-instruction-card .modal-content .modal-body {
        padding: 0px;
    }

    .test-instruction-card .test-instruction-card-title {
        margin-left: 0px;
        margin-right: 0px;
        background-color: #90e2f7;
    }
       
    .test-instruction-card .test-instruction-card-body {
        margin-top: 14px;
    }

    .test-instruction-card .card-header1 {
        color: #cccccc;
        font-size: 1.28571em;
        color: #666666;
        font-size: 14px;
        font-weight:bold;
        text-align: center;
        padding-top: 9px;
    }

    .test-instruction-card .test-instruction-content {
        color: #666666;
        padding: 0px 40px 0px 40px;
    }

    .test-instruction-card .test-instruction-card-footer {
        height: 40px;
    }
      
        .test-instruction-card .test-instruction-card-footer > div {
            height: 100%;
        }

.question-paper-card {
    width: 80%;
    margin-top:56px;
}

    .question-paper-card .modal-content {
        border-radius: 0px;
    }
    
    .question-paper-card .close {
        position: absolute;
        top: 10px;
        right: 30px;
    }

    .question-paper-card .modal-content .modal-body {
        padding: 0px;
    }

    .question-paper-card .question-paper-card-title {
        margin-left: 0px;
        margin-right: 0;
        background-color: #90e2f7;
    }

    .question-paper-card .question-paper-card-body {
        margin-top: 14px;
        pointer-events:none;
    }

    .question-paper-card .questions {
        overflow-x: hidden;
        overflow-y: auto;
        max-height:505px;
        margin-left: 0;
        margin-right: 0;
    }

.dexaedge-solution-loading-container {
    height: 505px;
    text-align: center;
    font-size: 2em;
    padding-top: 15%;
}
.dexaedge-solution-loading-footer {
    font-size: 0.45em;
    margin-top: -60px;
}

.dexaedge-dashboard-loader {
    top:40%;
}
.dexaedge-dashboard-loader-footer {
    font-size: 0.8em;
    text-align: center;
}
    .question-paper-card .card-header1
    {
        color: #cccccc;
        font-size: 1.28571em;
        color: #666666;
        font-size: 14px;
        font-weight:bold;
        text-align: center;
        padding-top: 9px;
    }

    .question-paper-card .question-paper-content {
        color: #666666;
        padding: 0px 40px 0px 40px;
    }

    .question-paper-card .question-paper-card-footer {
        height: 40px;
    }
      
        .question-paper-card .question-paper-card-footer > div {
            height: 100%;
        }

    .question-paper-card .section {
        font-size: 1.5em;
        color: #90e2f7;
        margin-left: -30px;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .question-paper-card .qseperator {
        border-bottom: 1px solid #666666;
        margin-left: -30px;
    }

    .question-paper-card .q-index {
        margin-left: -14px;
    }

.test-section-instruction {
    position: absolute;
    z-index: 1000;
    width: 21%;
}

.full-test-Qstatus {
    width: 61%;
}

    .test-section-instruction .popover-title {
        border-bottom: 1px solid #C0C0C0;
        background-color: #e5f6fd;
        padding-bottom: 5px;
        padding-top: 5px;
    }

    .test-section-instruction .padding {
        padding-bottom: 2px;
        padding-top: 2px;
    }

.test-section-instruction-padding {
    padding: 10px;
}

.test-section-instruction-body {
    border: 1px solid #C0C0C0;
    background-color: #e5f6fd;
    color:#5F5F5F;
    font-weight:normal;
}

.cclp-struggle-modal-lg-text {
     font-weight:bolder;
     text-align:center;
     font-size:1.3em;
     color:#51b9e8;
     margin-top:5px;
}

.cclp-struggle-modal-title {
     text-align:center;
     font-size:1.2em;
}

.cclp-struggle-continue {
    text-align:center;
    display:table;
    height:55px;
    }

    .cclp-struggle-continue> div {
        background-color:#51b9e8;
        color:#ffffff;
        margin-top:10px;
    }

.cclp-struggle-continue-text {
    text-align:center;
    display:table;
    height:55px;
}

    .cclp-struggle-continue-text> div {
        display:table-cell;
        vertical-align:middle;
    }

.cclp-prestruggle-icon {
    background-image:url(/funtoot/Content/images/warning.png);
    background-repeat: no-repeat;
    vertical-align: middle;
    height: 100px;
}

.cclp-poststruggle-icon {
    background-image:url(/funtoot/Content/images/badge.png);
    background-repeat: no-repeat;
    vertical-align: middle;
    height: 100px;
}

.problem-page-content .remediation-assignment-band {
    height: 25px;
    background-color: #fff3cd;
    color: #856404;
    display: table;
}

    .problem-page-content .remediation-assignment-band canvas {
        margin-top: 2px;
        margin-left: 10px;
    }

    .problem-page-content .remediation-assignment-band .remediation-assignment-band-text {
        display: table-cell;
        vertical-align: middle;
        text-align: right;
        width: 55%;
    }

    .problem-page-content .remediation-assignment-band .remediation-assignment-band-progress {
        display: table-cell;
        vertical-align: middle;
        padding-left: 20px;
    }

.problem-page-content .prepost-assignment-band {
    height: 25px;
    background-color: #fff3cd;
    color: #856404;
    display: table;
}

    .problem-page-content .prepost-assignment-band canvas {
        margin-top: 2px;
        margin-left: 10px;
    }

    .problem-page-content .prepost-assignment-band .prepost-assignment-band-text {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        width: 55%;
    }

    .problem-page-content .prepost-assignment-band .prepost-assignment-band-progress {
        display: table-cell;
        vertical-align: middle;
        padding-left: 20px;
    }


.tutorial-pane .playlist .icon.pdf-icon:after {
        content: "";
        position: absolute;
        border-right: 1px solid #CCCCCC;
        height: 100%;
        z-index:-1;
        bottom: 70%;
    }

.tutorial-pane.visible .playlist .icon.pdf-icon:after {
        left: 49%;
    }

.tutorial-pane.maximized .playlist .icon.pdf-icon:after {
        left: 30%;
    }

.tutorial-pane .playlist .icon.pdf-icon:before {
        content: "";
        position: absolute;
        z-index: 0;
        background-color: #F8F8F8;
        width: 17px;
        height: 17px;
        border-radius: 50%;
    }

.tutorial-pane.visible .playlist .icon.pdf-icon:before {
        left: 37%;
    }
.fundaas-popup-header{
    width:100%;
    height:50px;
    text-align:center;
    border-bottom:1px solid silver;
}

.fundaas-zero-message-container{
    height:300px;
    text-align:center;
    padding:100px;
}

.fundaas-lhs-text {
    background-color: #2ebb9b;
    height: 380px;
    padding:3%;
    padding-top:7%;
}

.fundaas-label {
    font-size: 15px;
    color: #333333;
    padding-top: 1%;
    text-align: center;
    padding-bottom: 1%;
}

.rewards-label {
    font-size: 28px;
    height: 45px;
    color: #091044;
    text-align: center;
    background-color: #f7941d;
}

.fundass-message-spl-text{
    font-weight: bold; 
    color:orange;
}


.no-rewards-msg {
    font-size: 23px;
    text-align: center;
    padding: 20px;
}

.fundaas-graph-row {
    border-bottom: black 20px solid;
}

.fundaas-txt {
    font-size: 35px;
    /*font-family: Lato;*/
    /*font-weight: lighter;*/
    padding-bottom: 5%;
    text-align: center;
}

.fundass-total {
}

.fundass-current {
    /*margin-top: 25%;*/
    border-bottom: 1px solid #ffffff;
}

.fundaas-graph {
    padding: 0 25px 10px 25px;
}

.fundaas-modal-content {
    height: 450px;
}

.fundaas-modal-content .certificates-container {
    padding: 15px;
    height: 145px;
    overflow-y: auto;
    overflow-x: hidden;
    font-size: 12px;
}

.fundaas-modal-content .certificates-container .certificate-entry-wrapper {
    padding: 5px;
}

.fundaas-modal-content .certificates-container .certificate-entry-wrapper:hover {
    cursor: pointer;
}

.fundaas-modal-content .certificates-container .certificate-entry-wrapper .certificate-entry {
    padding-bottom: 15px;
}

.fundaas-modal-content .certificates-container .certificate-entry-wrapper .certificate-entry .certificate-icon {
    height: 30px;
    width: 100%;
    text-align: center;
}

.fundaas-modal-content .certificates-container .certificate-entry-wrapper .certificate-entry .certificate-name {
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
}


#pdfframe:-webkit-full-screen,
#pdfframe:-moz-full-screen,
#pdfframe:-ms-fullscreen,
#pdfframe:fullscreen {
    width: 100vw;
    height: 100vh;
}

.btn-strength-chart {
        text-align: center;
        width: 4em;
        cursor: pointer;
    }

    .btn-strength-chart:hover {
            background-color: #9F9F9F;
        }

.classsubtopiclg {
}

.classsubtopiclg .header {
    background-color: #c5c3c3;
    font-size: 16px;
    height: 44px;
    margin-top: 16px;
    padding-top: 10px;
    font-weight: bolder;
}

.classsubtopiclg .body .progress-cell > div {
    width: 100%;
}

.classsubtopiclg .body .progress-cell:not(:last-child) {
    border-right: none;
}

    .classsubtopiclg .body .item-cell {
        border-bottom: 1px solid #D7D7D7;
    }

    .classsubtopiclg .body .item-cell {
    height: 3em;
    padding-top: 8px;
}

.classsubtopiclg >  :nth-child(odd){
   background-color:#efecec;
}

.classsubtopiclg >   :nth-child(even){
  background-color:white;
}

.classsubtopiclg .body .tp-progressbar {
    position: relative;
    height: 1em;
    width: 100%;
    background-color: #F6F6F6;
    border: 1px solid #D7D7D7;
}

.classsubtopiclg .body .tp-progressbar > div {
    position: absolute;
    background-color: #4BC75D;
    height: 0.9em;
        }
.pre-post-test-highlight-attempts {
    position: absolute;
    top: 65%;
}
.disable-qtrail-edit {
    pointer-events: none;
}
.problem-page-header-silver-embium-icon {
    width: 15%;
}
.problem-page-header-silver-embium-text {
    padding-left: 4%;
    color: #fff;
}
.ft-default-cursor {
    cursor:context-menu !important;
}
/* width */
.problem-page-content-in-iframe ::-webkit-scrollbar {
  width: 6.5px;
}

/* Track */
.problem-page-content-in-iframe ::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #cccccc; 
  border-radius: 10px;
}
 
/* Handle */
.problem-page-content-in-iframe ::-webkit-scrollbar-thumb {
  background: #cccccc; 
  border-radius: 30px;
}
.tutorial-video-inIframe {
    overflow-x: hidden;
    overflow-y: auto;
}

.embibe-guide-container {
    padding: 10px;
    height: 100%
}

.embibe-guide-container-list {
    display: flex;
    align-items: flex-end;
    margin-bottom: 12px;
}

.embibe-guide-container-list-bullet {
    width: 20px;
    height: 20px;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,.16);
    background-color: #fff;
    border-radius: 50%;
    margin-right: 5px
}

.embibe-guide-container-list-bullet-img {
    width: 20px;
    height: 20px;
    background-size: 500px;
    background-position: -322px
}

    .embibe-guide-container-list-bullet-img-fallback {
        width: 20px;
        height: 13px;
        position: relative;
        bottom: 3px;
        margin-left: 4px;
    }

.embibe-guide-container-list-discovery-content {
    width: 100%;
    border-radius: 15px;
    border-bottom-left-radius: 0;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,.16);
    background-color: #fff;
    height: 100%;
    display: flex;
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    flex-direction: column
}

.embibe-guide-container-list-discovery-content-title {
    padding: 14px 8px 14px 13px;
    border-bottom: 2px solid #f6f7f9;
    display: flex;
    align-items: center
}

.embibe-guide-container-list-discovery-content-title-image {
    margin-right: 20px;
    width: 61px;
    height: 56px;
    object-fit: contain
}

.embibe-guide-container-list-discovery-content-title-message {
    background: #00e6f0;
    background-image: -webkit-linear-gradient(249deg,#e100f0,#371fff);
    background-image: -moz-linear-gradient(249deg,#e100f0,#371fff);
    background-image: -ms-linear-gradient(249deg,#e100f0,#371fff);
    background-image: -o-linear-gradient(249deg,#e100f0,#371fff);
    background-image: linear-gradient(249deg#e100f0,#371fff);
    font-size: 17.7px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent
}

.embibe-guide-container-list-discovery-content-description {
    padding: 10px 10px 10px 13px;
    display: flex;
    width: 100%
}

.embibe-guide-container-list-discovery-content-description-image,.embibe-guide-container-list-discovery-content-description-image img {
    width: 21px;
    height: 21px
}

.embibe-guide-container-list-discovery-content-description-message {
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    color: #000
}

.embibe-guide-container-list-discovery-content-description-message-link {
    text-decoration: none;
    cursor: pointer;
    font-weight: 600;
    color: #1a9dfd!important;
    font-size: 14px!important;
    padding: 0!important
}

.embibe-guide-container-list-content {
    width: auto;
    border-radius: 15px;
    border-bottom-left-radius: 0;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,.16);
    background-color: #fff;
    padding: 10px;
    height: 100%;
    font-weight: 400;
    line-height: 1.33;
    color: #000;
    display: flex;
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft;
    -webkit-animation-duration: 1s;
    animation-duration: 1s
}

.embibe-guide-container-list-content-simple-message {
    opacity: .8;
    font-size: 14px
}

.embibe-guide-container-list-content-question-number {
    font-weight: 500;
    font-size: 10px;
    color: #8b8b8b;
    align-items: flex-end;
    display: inline-flex;
    padding: 0 5px 0 10px
}

.embibe-guide-container-list .wasted-attempt-css {
    background: rgba(255,212,204,.3)
}

.embibe-guide-container-list .overtime-correct-css {
    background: rgba(251,239,182,.3)
}

.embibe-guide-container-list .overtime-incorrect-css {
    background: rgba(251,215,186,.3)
}

.embibe-guide-container-list .perfect-attempt-css {
    background: rgba(193,242,231,.3)
}

.embibe-guide-container-list .too-fast-correct-attempt-css {
    background: rgba(255,222,64,.12)
}

.embibe-guide-container .bold-text {
    font-size: inherit;
    font-weight: 700
}
.embibe-tutor-message-title-icon {
    background-color: #DEF6FD;
    border-radius: 50%;
    background-image: url(/funtoot/Content/images/assistance-icons.png);
    background-repeat: no-repeat;
    height: 32px !important;
    width: 32px !important;
    display: table-cell;
    vertical-align: middle;
}

    .embibe-tutor-message-title-icon.tutor-message-icon-microhint {
        background-position: -173px -4px;
    }

    .embibe-tutor-message-title-icon.tutor-message-icon-tutorial {
        background-position: -5px -5px;
    }

    .embibe-tutor-message-title-icon.tutor-message-icon-hint {
        background-position: -62px -3px;
    }

    .embibe-tutor-message-title-icon.tutor-message-icon-solution {
        background-position: -118px -4px;
    }

.lmctw-problem-statement {
    padding-bottom: 1em;
    font-size: 1.7em;
    font-weight: bold;
    text-align: center;
 }
.admin-report-filter-row {
    width: 95%;
    display: table;
}
.admin-prepost-test-report-card {
    border: 1px solid #c2e2fc;
    background-color: #E8F4FE;
    padding-bottom: 2%;
    color: #5F5F5F;
}
.admin-prepost-test-report-card-title {
    text-align: center;
    font-weight:bold;
    font-size:1.15em;
}
.admin-prepost-test-report-card-footer{
    padding-bottom:2%
}
.admin-report-loader-row {
    padding:5%;
}
.admin-report-loader {
    text-align: center;
    font-size: 2.1428em;
    color: #6d6783;
}
.admin-report-loader-text {
    text-align: center;
    font-size: 1.3em;
    color:#6d6783;
}

.m-auto{
    margin:auto;
}
.max-height-none {
    max-height:none;
}


.problem-page-tool-bar .tool-bar-container .syllabus-hamburger .grip-image{
    background-color: #51B7E8;
}

.text-center{
    text-align: center !important;
}

.complexity-container{
    
}