@font-face {
    font-family: GenerisRG;
    src: url("fonts/SUI_GENERIS_RG.eot");
    src: url("fonts/SUI_GENERIS_RG.woff") format("woff"),
         url("fonts/SUI_GENERIS_RG.ttf") format("truetype");
}
.oeg_font {
    font-family: GenerisRG;
    font-weight: bold;
    font-size: 2.4vw;
}
input[type='text'], input[type='password'], input[type='number'] {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    background-color: #fff;
    color: #000;
    border: 1px solid #e7e7e7;
    font-size: .8vw;
    letter-spacing: 1px;
    padding-left: 3%;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    outline: 0;
}
*:disabled {
    background-color: rgba(0,0,0,0.1);
}
button {
    position: relative;
    width: auto;
    height: auto;
    font-size: .8vw;
    background-color: #192a56;
    color: #ffffff;
    border: none;
    letter-spacing: 1px;
}
button:hover {
    cursor: pointer;
    background-color: #192a56BF;
    transition: 0.5s all;
}
button.invert {
    background-color: #1d1d1d;
    color: #ffffff;
}
button.invert:hover {
    cursor: pointer;
    background-color: #1d1d1dBF;
    transition: 0.5s all;
}
select {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    background-color: #fff;
    color: #000;
    border: 1px solid #e7e7e7;
    font-size: .8vw;
    letter-spacing: 1px;
    padding-left: 3%;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    outline: 0;
}
option:checked {
  background: rgba(0, 128, 0, 0.3);
}
textarea {
    position: relative;
    width: auto;
    height: auto;
    padding: 1%;
    background-color: #ffffff;
    font-family: 'Roboto', sans-serif;
    border: 1px solid #e7e7e7;
}
button, input[type='text'], select, textarea {
    font-family: 'Roboto', sans-serif;
}
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
:-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    
}
::-webkit-scrollbar-thumb {
    
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    background: #192a56;
}
input[type='checkbox']{
    width: 15px;
    height: 15px;
}
.content_divider_vert {
    position: relative;
    float: left;
    background-color: #192a56;
    width: auto;
    min-width: 0.3%;
    max-width: 0.3%;
    height: auto;
    min-height: 99.9vh;
    max-height: 99.9vh;
}
.content_divider_hor {
    position: relative;
    float: left;
    background-color: #192a56;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 0.2vh;
    max-height: 0.2vh;
    margin-top: 5%;
    margin-bottom: 5%;
}
.content_divider_vert.dashboard_admin {
    min-height: 88.4vh;
    max-height: 88.4vh;
}
.hide {
    display: none;
}
.show {
    display: block;
}
.quarterWidth {
    min-width: 25% !important;
    max-width: 25% !important;
}
.halfWidth {
    min-width: 50% !important;
    max-width: 50% !important;
}
.fullWidth {
    min-width: 100% !important;
    max-width: 100% !important;
}
.quarterHeight {
    min-height: 25vh;
    max-height: 25vh;
}
.fullCenter {
    display: flex;
    justify-content: center;
    align-items: center;
}
.alignLeft {
    float: left;
}
.alignRight {
    float: right;
}
.textLeft {
    text-align: left;
}
.textCenter {
    text-align: center;
}
.textRight {
    text-align: right;
}
.fa-folder {
    color: #ffe0a7;
}
.bkTransparent {
    background-color: transparent !important;
}
.noFloat {
    float: unset;
}
html, body {
    position: relative;
    float: left;
    margin: 0;
    padding: 0;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 100vh;
    max-height: 100vh;
    background-color: #ffffff;
    font-family: 'Roboto', sans-serif;
    overflow: hidden;
    font-size: 0.8vw;
    letter-spacing: 1px;
    color: #ffffff;
}
#content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 100vh;
    max-height: 100vh;
}
#content_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 100vh;
    max-height: 100vh;
    background-color: #1d1d1d;
}
#content_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 12%;
    max-width: 12%;
    min-height: 96vh;
    max-height: 96vh;
    height: auto;
    font-size: 0.8vw;
    padding: 1%;
}
#content_left_menu {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 80vh;
    max-height: 80vh;
    margin-top: 10%;
}
#menu {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 33vh;
}
#content_left > ul {
    position: relative;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}
#content_left > ul > li {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    font-size: 0.8vw;
    background-color: transparent;
    box-shadow: 0px 1px 1px -1px #000;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    margin-bottom: 2%;
    color: #fff;
}
#content_left > ul > li:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.1);
}
#content_left > ul > li > i {
    position: relative;
    float: left;
    width: auto;
    min-width: 8%;
    max-width: 8%;
    margin-top: 0.7%;
    font-size: 0.7vw !important;
}
#content_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 85.7%;
    max-width: 85.7%;
    height: auto;
    min-height: 100vh;
    max-height: 100vh;
}
#content_right_screen {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 95vh;
    max-height: 95vh;
}
.freeflow {
    overflow-x: hidden;
    overflow-y: auto;
    scroll-behavior: smooth;
}
.content_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 91.5vh;
    max-height: 91.5vh;
    padding: 1%;
}
.content_container.noLimitHeight {
    min-height: unset;
    max-height: unset;
}
.content_container h2 {
    color: #e4e4e4;
    border-bottom: 2px solid #e4e4e466;
}
.content_container h3 {
    color: #192a56;
    border-bottom: 2px solid #192a5666;
}
.content_container > div.form {
    position: relative;
    float: left;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    height: auto;
    max-height: 40vh;
    border: 1px solid #1d1d1d66;
    box-shadow: 0px 0px 2px -1px #000000;
    background-color: #e4e4e466;
    padding: 1%;
    margin-right: 1%;
}
.content_container .info .form {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.content_container .row {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    margin-bottom: 1%;
    font-size: 0.8vw;
}
.content_container .row .col1 {
    position: relative;
    float: left;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-right: 1%;
    font-weight: bold;
}
.content_container .row .col2 {
    position: relative;
    float: left;
    width: auto;
    min-width: 64%;
    max-width: 64%;
    height: auto;
    min-height: 2.5vh;
}
.content_container .row img {
    position: relative;
    float: left;
    width: auto;
    min-width: 95%;
    max-width: 95%;
    height: auto;
    min-height: 22vh;
    max-height: 22vh;
    object-fit: contain;
    border: 2px solid #e7e7e7;
    padding: 1%;
}
.content_container .form input {
    min-width: 80%;
    max-width: 80%;
}
.content_container .form select {
    max-width: 80%;
}
.content_container .form textarea {
    min-width: 80%;
    max-width: 80%;
    min-height: 6vh;
    max-height: 6vh;
    font-size: 0.7vw;
    padding-left: 3%;
}
.content_container .form .correct {
    border: 1px solid rgb(0,128,0);
    font-weight: bold;
}
#formUpload {
    display: none;
}
#fileInfo {
    position: relative;
    float: left;
    font-size: 0.7vw;
    width: auto;
    min-width: 74%;
    max-width: 74%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    text-align: center;
    overflow-x: hidden;
    text-overflow: ellipsis;
}
.content_container .form button {
    position: relative;
    float: left;
    min-width: 25%;
    max-width: 40%;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-right: 0.5%;
}
.content_container .form button.remove {
    background-color: rgb(204,0,0);
    color: #ffffff;
}
.content_container .form button.remove:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
.content_container_options {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    margin-bottom: 0.5%;
}
.content_container_options .option {
    position: relative;
    float: left;
    width: auto;
    min-width: 7%;
    max-width: 10%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    margin-left: 0.5%;
}
.content_container .toolbar {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    margin-bottom: 0.5%;
}
.content_container .toolbar .searchbar {
    position: relative;
    float: left;
    width: auto;
    min-width: 35%;
    max-width: 35%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    margin-right: 0.5%;
}
.content_container .toolbar select {
    max-width: 13%;
    min-height: 4vh;
    max-height: 4vh;
    margin-right: 0.5%;
    padding-left: 1%;
}
.content_container .toolbar .button {
    position: relative;
    float: left;
    width: auto;
    min-width: 12%;
    max-width: 18%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    margin-right: 0.5%;
}
.content_container .toolbar .container_button {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    margin-right: 0.5%;
}
.container_button-active {
    font-weight: bold;
}
.content_container .toolbar .container_search {
    position: relative;
    float: left;
    width: auto;
    min-width: 96%;
    max-width: 96%;
    height: auto;
    min-height: 3.5vh;
    max-height: 3.5vh;
}
.content_container .toolbar .resultnum {
    position: relative;
    float: right;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    background-color: #192a56;
    color: #ffffff;
    text-align: center;
}
.content_container .container_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 65%;
    max-width: 65%;
    height: auto;
    min-height: 75vh;
    max-height: 75vh;
}
.content_container .container_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    max-height: 78vh;
    padding: 1%;
    background-color: #ffffff;
    color: #000000;
    opacity: 0;
    box-shadow: 0px 0px 2px -1px #000000;
}
.content_container .chart {
    position: relative;
    float: left;
    width: auto;
    min-width: 45%;
    max-width: 45%;
    height: auto;
    max-height: 40vh;
    overflow: hidden;
    margin-bottom: 1%;
    margin-left: 0.5%;
    padding: 1%;
    background-color: #e4e4e4;
}
.content_container .chart canvas {
    width: 100% !important;
    height: 100% !important;
}
.content_container .content {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    max-height: 35vh;
    overflow-x: hidden;
    overflow-y: auto;
    margin-bottom: 1%;
}
.content_container .table {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    max-height: 75vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.content_container table {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    max-height: 75vh;
    overflow-x: hidden;
    overflow-y: auto;
    margin-bottom: 1%;
}
.content_container table th, .content_container table td {
    height: 40px;
    border-bottom: 1px solid rgba(231,231,231,0.3);
    font-size: 0.7vw;
}
.content_container table img {
    max-height: 2vh;
}
.content_container table span {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    margin-right: 5%;
}
.content_container .info {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    max-height: 79vh;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: #ffffff;
    color: #000000;
    opacity: 0;
}
.content_container .info .record-info {
    font-size: 0.7vw;
    color: #d1d1d1;
    font-weight: bold;
}
.content_container .clickable:hover {
    cursor: pointer;
    background-color: #192a5666;
}
.content_container .clickable.clicked {
    background-color: rgba(0,128,0,0.4);
}
.content_container .content_divider_hor {
    margin-top: 2%;
    margin-bottom: 2%;
}
.content_container .scroll {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 21vh;
    overflow-x: hidden;
    overflow-y: auto;
}
#explore_container table, #explore_container .table, #explore_container .content {
    max-height: 88vh !important;
}
#explore_container input, #explore_container select {
    font-size: 0.7vw;
}
#explore_container .searchbar {
    min-width: 20%;
    max-width: 20%;
}
#explore_container .resultnum {
    min-width: 8%;
    max-width: 9%;
    float: left;
    font-size: 0.7vw;
    box-shadow: 1px 1px 2px -1px #000000;
}
#explore_view {
    display: block;
    position: relative;
    float: right;
    width: auto;
    min-width: 7%;
    max-width: 7%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
}
#explore_view button {
    position: relative;
    float: left;
    min-width: 50%;
    max-width: 50%;
    min-height: 4vh;
    max-height: 4vh;
}
#explore_view .search_view_active {
    box-shadow: 1px 1px 2px -1px #000000;
}
#explore_container .card {
    position: relative;
    float: left;
    width: auto;
    min-width: 16%;
    max-width: 16%;
    height: auto;
    min-height: 19.5vh;
    max-height: 19.5vh;
    margin-right: 0.5%;
    margin-top: 0.5%;
}
#explore_container .card.Resize {
    min-height: 16vh !important;
    max-height: 16vh !important;
}
#explore_container .card:hover {
    cursor: pointer;
}
#explore_container .card_cover {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 14.5vh;
    max-height: 14.5vh;
    margin-bottom: 2%;
    overflow: hidden;
}
#explore_container .card_cover.Resize {
    min-height: 11.5vh;
    max-height: 11.5vh;
}
#explore_container .card_cover > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 14.5vh;
    max-height: 14.5vh;
    object-fit: inherit;
}
#explore_container .card_cover > img.Resize {
    min-height: 11.5vh;
    max-height: 11.5vh;
}
:root {
  --badge-pad-y: 0.25rem;
  --badge-pad-x: 0.55rem;
  --badge-radius: 0.55rem;
  --badge-blur: 6px;
  --badge-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
  --badge-font-size: 0.72rem;
}
.lang-ribbon {
  position: absolute;
  top: 1rem;
  right: -3.25rem;       /* pull right so only the diagonal shows */
  width: 10rem;
  padding: 0.35rem 0;
  text-align: center;
  font-size: 0.7vw;
  font-weight: bold;
  color: #fff;
  transform: rotate(45deg);
  box-shadow: var(--badge-shadow);
  user-select: none;
  background: #2b9e52f2;
}
.lang-pill {
  display: inline-block;
  margin-left: 0.5em;
  padding: 0.1em 0.45em;
  font-size: 0.7vw;
  font-weight: 600;
  text-transform: uppercase;
  border-radius: 0.4rem;
  color: white;
  background-color: #2b9e52f2;
}
#explore_container .card_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
}
#explore_container .card_bottom > .card_bottom_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    margin-right: 0.5%;
}
.card_bottom_left.Resize {
    min-height: 3vh;
    max-height: 3vh;
}
.card_bottom_left > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    object-fit: contain;
}
.card_bottom_left > img.Resize {
    min-height: 3vh;
    max-height: 3vh;
}
#explore_container .card_bottom > .card_bottom_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 79%;
    max-width: 79%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
}
#explore_container .card_name {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.7vw;
}
#explore_container .card_library {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #ffffff33;
}
#student_report_window {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 70vh;
    padding: 1%;
}
#student_report_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 20vh;
    max-height: 20vh;
    padding: 1%;
}
#reportTop {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
    margin-bottom: 5%;
}
#reportContainer {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 98vh;
}
#reportContainerLogo {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
}
#reportContainerLogo img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
    object-fit: contain;
}
#reportContainer .heading {
    position: relative;
    float: right;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
    text-align: right;
    font-size: 1.6vw;
}
header {
    position: relative;
    float: left;
    background-color: #1d1d1d;
    box-shadow: 0px 1px 2px 1px #000000;
    font-size: 1vw;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    letter-spacing: 1.5px;
    min-height: 6vh;
    max-height: 6vh;
    color: #ffffff;
}
#logo {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
}
#logo img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    max-height: 5vh;
    object-fit: contain;
}
#categories {
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    padding-top: 0.5%;
    padding-left: 39%;
    max-width: 38%;
    opacity: 0;
}
#categories > ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    list-style: none;
    margin: 0;
    padding: 0;
}
#categories > ul > li {
    position: relative;
    display: inline-block;
    width: 11%;
    height: auto;
}
.category:hover {
    cursor: pointer;
}
a {
    text-decoration: none;
    color: #ffffff;
}
a.invert {
    color: #000000;
    text-decoration: underline;
}
.cat_logo {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.header_option {
    position: relative;
    float: right;
    width: auto;
    min-width: 3%;
    max-width: 3%;
    height: auto;
    max-height: 5vh;
    margin-left: 0.5%;
    padding: 0.7%;
    text-align: center;
}
.header_option a {
    color: #ffffff !important;
}
.header_option:hover {
    cursor: pointer;
    background-color: #192a5666;
    transition: 0.5s all;
}
#content_right_top_title {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    max-height: 5vh;
    padding: 0.85%;
    font-weight: bold;
}
#content_right_top_notification {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    padding: 0.5%;
    padding-left: 43%;
    font-weight: bold;
    opacity: 0;
}
#user_name {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw !important;
    text-align: center;
}
#user_profile_window {
    display: none;
    position: absolute;
    float: right;
    width: auto;
    height: auto;
    min-width: 82%;
    max-width: 82%;
    min-height: 92vh;
    max-height: 92vh;
    right: -30%;
    background-color: #fff;
    color: #000;
    top: 2%;
    z-index: 2000;
    box-shadow: 0px 1px 3px -1px #000000;
    opacity: 0;
    padding: 1%;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
}
#user_profile_window_top {
    position: relative;
    float: left;
    width: auto;
    min-height: 3.5vh;
    max-height: 3.5vh;
    padding: 1%;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    color: #fff;
    background-color: #192a56;
    font-size: 1vw;
    font-weight: bold;
}
#user_profile_window_top > span {
    position: relative;
    float: left;
    padding-left: 0%;
    margin-top: 0.2%;
}
#user_profile_window_close {
    position: relative;
    float: right;
    right: 0%;
    margin-top: 0.2%;
}
#user_profile_window_close:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
#user_profile_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 86vh;
    max-height: 86vh;
}
#user_profile_window_content_info {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 70vh;
    max-height: 70vh;
    padding: 1%;
}
#user_profile_window_content_info_left {
    min-width: 50%;
    max-width: 50%;
}
user_profile_window_content_info_right {
    min-width: 50%;
    max-width: 50%;
}
.user_profile {
    position: relative;
    float: left;
    width: auto;
    max-width: 100%;
    height: auto;
    min-height: 15vh;
    max-height: 15vh;
}
.user_profile > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 0.5%;
}
.user_profile > div label {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-right: 1%;
    font-weight: bold;
}
.user_profile > div span {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
}
.user_profile > div select {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    font-size: 0.8vw;
    padding-left: 1%;
    margin-right: 0.5%;
}
.user_profile > div input {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.8vw;
    padding-left: 1%;
    margin-right: 0.5%;
}
#user_profile_window_content_info table tr td:nth-child(1) {
    font-weight: bold;
}
.profile_button {
    position: relative;
    float: left;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    background-color: #192a56;
    color: #fff;
    border: none;
    outline: none;
    font-size: 0.8vw;
    letter-spacing: 1px;
}
.profile_button:hover {
    cursor: pointer;
    background-color: rgba(29,29,29,0.7);
}
#user_login_method {
    min-width: 50%;
    max-width: 50%;
    min-height: 25vh;
    max-height: 25vh;
}
.login_method_switch {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
    padding: 1%;
    margin-right: 2%;
    font-size: 0.8vw;
    background-color: #192a56;
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 1px 1px #000000;
    border-radius: 5%;
    letter-spacing: 1px;
}
.login_method_switch:hover {
    cursor: pointer;
    font-weight: bold;
}
#user_profile_window_name, #user_profile_portal_name, #user_profile_window_access, #user_profile_window_language {
    display: none;
}
#user_profile_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
    margin-top: 2%;
}
#user_profile_window_bottom button {
    position: relative;
    float: left;
    width: auto;
    min-width: 17%;
    max-width: 17%;
    height: auto;
    color: #fff;
    padding: 1%;
    border: none;
    box-shadow: 0px 1px 3px -1px #000;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    margin-right: 1%;
}
#user_profile_window_bottom button:hover {
    cursor: pointer;
    background-color: rgba(29,29,29,0.7);
    font-weight: bold;   
}
.profile_login_option {
    background-color: #192a56;
}
#user_profile_window_logout {
    float: right !important;;
    right: 0%;
    background-color: #192a56;
}
#user_profile_window_change_method_form {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 24%;
    max-width: 24%;
    height: auto;
    left: 45%;
    top: 29%;
    padding: 1%;
    background-color: #fff;
    box-shadow: 0 1px 3px -1px #000;
    z-index: 2001;
    font-size: 0.7vw;
}
#user_profile_window_name {
    position: relative;
    float: left;
    font-size: 0.8vw;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-weight: bold;
}
#user_profile_portal_name {
    position: relative;
    color: #e0e0e0;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
#user_profile_window_access {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
}
#user_profile_window_language {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    text-align: right;
}
#user_profile_language select {
    position: relative;
    width: auto;
    min-width: 5%;
    max-width: 30%;
    height: auto;
    padding: .5%;
    font-size: .8vw;
    border: 1px solid #d7d7d7;
    
    letter-spacing: 1.5px;
}
#user_profile_window_options {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 3%;
}
#user_profile_window_options > ul {
    position: relative;
    float: left;
    margin-top: 1%;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    list-style: none;
    margin: 0;
    padding: 0;
}
#user_profile_window_options > ul li {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    margin-bottom: 1%;
    background-color: #000000BF;
    color: #ffffff;
    padding: 1%;
    font-size: 0.7vw;
}
#user_profile_window_options > ul li:hover {
    cursor: pointer;
    font-weight: bold;
}
#user_profile_window_options a {
    color: #ffffff;
    text-decoration: none;
    font-weight: bold;
}
#user_profile_window_change_password_form {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 24%;
    max-width: 24%;
    height: auto;
    min-height: 14vh;
    max-height: 14vh;
    left: 45%;
    top: 29%;
    padding: 1%;
    background-color: #000000;
    color: #ffffff;
    box-shadow: 0 1px 3px -1px #000;
    z-index: 2001;
    font-size: 0.8vw;
}
#user_profile_window_change_password_form label {
    position: relative;
    float: left;
    width: auto;
    min-width: 40%;
    max-width: 40%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
}
#user_profile_window_change_password_form input {
    position: relative;
    float: left;
    width: auto;
    min-width: 58%;
    max-width: 58%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    font-size: 0.8vw;
    border: 1px solid rgba(0,0,0,0.2);
    margin-bottom: 0.5%;
}
#cancel_password, #update_password {
    position: relative;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    height: auto;
    min-height: 3.5vh;
    max-height: 3.5vh;
    float: right;
    right: 1%;
    margin-left: 1%;
    background-color: #192a56;
    color: #fff;
    font-size: 0.8vw;
    font-family: roboto,sans-serif;
    outline: 0;
    margin-top: 1%;
    padding: 1%;
    border: 0;
}
#cancel_password:hover, #update_password:hover {
    cursor: pointer;
    background-color: rgba(25,42,86,0.7);
}
#searchbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    background-color: #ffffff;
    box-shadow: 0px 1px 1px -1px rgb(0, 0, 0);
    margin-top: 0.5%;
}
#search-bar {
    position: relative;
    float: left;
    padding: 1%;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    font-size: 0.7vw;
    height: auto;
    outline: 0;
    font-family: 'Roboto', sans-serif;
    border: none;
    letter-spacing: 1.5px;
    min-height: 2.3vh;
    max-height: 2.3vh;
    border: 1px solid #e7e7e7;
}
#search-bar::-webkit-input-placeholder {
    padding-left: 1%;
    color: #000000;
}
#searchbar_category {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    max-width: 40%;
}
#searchbar_category div:nth-child(odd) {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding-top: 2%;
}
#searchbar_category div:nth-child(even) {
    position: relative;
    float: left;
    width: 70%;
    height: auto;
    padding-left: 1%;
}
#searchbar_category div img {
    position: relative;
    width: 7%;
    height: auto;
    float: left;
}
#searchbar_category div span {
    position: relative;
    float: left;
    margin-top: 2%;
    font-size: 1vw;
    color: #7d7d7d;
    width: auto;
    word-break: break-word;
}
#searchbar_text {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    color: #000000;
    font-size: 1vw;
    padding: 1%;
    margin-top: 0.5%;
}
#searchbar_option {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    color: #000000;
    font-size: 1vw;
    font-weight: bold;
    padding: 0.5%;
    margin-top: 0.9%;
    
    border: 2px solid #000000;
    box-shadow: 0px 1px 2px -1px #000000;
    margin-left: 0.5%;
}
#searchbar_option:hover {
    cursor: pointer;
    font-weight: bold;
}
.searchbar_option_selected {
    background-color: rgba(0,0,0,0.1);
}
#searchbar_option_0 {
    display: none;
}
#searchbar_filter {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    color: #000000;
    font-size: 1vw;
    font-weight: bold;
    padding: 0.5%;
    margin-top: 0.9%;
    
    border: 2px solid #000000;
    box-shadow: 0px 1px 2px -1px #000000;
    margin-left: 17%;
}
#searchbar_filter:hover {
    cursor: pointer;
    font-weight: bold;
}
#searchbar_filter_origin_window {
    display: none; 
    position: absolute;
    z-index: 1001;
    top: 9%;
    float: right;
    right: 22%;
    width: auto;
    max-width: 13.25%;
    height: auto;
    background-color: #fff;
    border: 1px solid #e7e7e7;
    
    box-shadow: 0px 1px 3px -1px #000;
    color: #000;
    font-size: 0.8vw;
}
#searchbar_filter_origin_window > ul {
    position: relative;
    float: left;
    margin: 0;
    padding: 4%;
    list-style: none;
}
.searchbar_filter_origin_option {
    border-bottom: 1px solid #d7d7d7;
}
.searchbar_filter_origin_option:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.2);
}
#searchbar_filter_window {
    display: none;
    position: absolute;
    z-index: 1001;
    top: 15%;
    float: left;
    left: 51%;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    background-color: #fff;
    box-shadow: 0 1px 3px -1px #000;
    
    padding: 0.5%;
    font-size: 0.7vw;
}
#searchbar_filter_window > ul {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 12vh;
    max-height: 12vh;
    margin: 0;
    padding: 0;
    list-style: none;
}
.searchbar_filter {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    color: #000;
    border-bottom: 1px solid rgba(0,0,0,0.05);
}
.searchbar_filter:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
}
.searchbar_filter_selected {
    background-color: #d3d3d3;
    color: #000000;
}
.searchbar_filter_select_option {
    position: relative;
    float: right;
    width: 50%;
    height: auto;
    text-align: right;
}
#searchbar_option_window {
    display: none;
    position: absolute;
    z-index: 1001;
    top: 15%;
    float: left;
    left: 40.5%;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    background-color: #fff;
    box-shadow: 0 1px 3px -1px #000;
    padding: 0.5%;
    
    font-size: 0.7vw;
}
#searchbar_option_window > ul {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 15vh;
    max-height: 15vh;
    margin: 0;
    padding: 0;
    list-style: none;
}
.searchbar_option {
    position: relative;
    float: left;
    width: auto;
    max-width: 98%;
    min-width: 98%;
    height: auto;
    padding: 1%;
    color: #000;
    border-bottom: 1px solid rgba(0,0,0,0.05);
}
.searchbar_option:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
}
#searchbar_level_window {
    display: none;
    position: absolute;
    z-index: 1001;
    top: 15%;
    float: left;
    left: 47.2%;
    width: auto;
    min-width: 8%;
    max-width: 8%;
    height: auto;
    background-color: #fff;
    box-shadow: 0 1px 3px -1px #000;
    padding: 0.5%;
    
    font-size: 0.7vw;
}
#searchbar_level_window > ul {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 15vh;
    max-height: 15vh;
    margin: 0;
    padding: 0;
    list-style: none;
}
.searchbar_level {
    position: relative;
    float: left;
    width: auto;
    max-width: 98%;
    min-width: 98%;
    height: auto;
    padding: 1%;
    color: #000;
    border-bottom: 1px solid rgba(0,0,0,0.05);
}
.searchbar_level:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
}
#searchbar_active {
    display: none;
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    color: #7d7d7d;
    font-size: 0.8vw;
    padding: 0.5%;
    padding-right: 0.5%;
    margin-top: 0.3%;
    border: 2px solid rgb(0,125,255);
    box-shadow: 0px 1px 7px -1px #000000;
    border-radius: 40px;
    opacity: 0;
}
#searchbar_active > span > i {
    position: relative;
    float: right;
    margin-top: 0.5%;
    color: #7d7d7d;
    font-size: 0.8vw;
    left: 2%;
}
#searchbar_active > span > i:hover {
    cursor: pointer;
    color: rgb(0,125,255);
}
#taskbar {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}

#user_help > i {
    position: relative;
    float: left;
    margin-left: 1%;
    color: rgba(0,0,0,0.75);
}
#user_support > i {
    position: relative;
    float: left;
    margin-left: 1%;
    color: rgba(0,0,0,0.75);
}
#student_courses > i {
    position: relative;
    float: left;
    margin-left: 1%;
    color: #ffd700;
}
#student_syllabus > i {
    position: relative;
    float: left;
    margin-left: 1%;
    color: rgb(0,128,0);
}
#student_assessments > i {
    position: relative;
    float: left;
    margin-left: 1%;
    color: rgba(122,15,175,1);
}
#student_boosters > i {
    position: relative;
    float: left;
    margin-left: 1%;
    color: #000000;
}
#oeg_courses {
    margin-top: 10% !important;
    background-color: rgba(0,0,0,0.1) !important;
}
#oeg_courses > i {
    position: relative;
    float: left;
    width: 13%;
    height: auto;
}
#oeg_courses > i > img {
    width: 80%;
    height: auto;
}
#oeg_courses > span {
    position: relative;
    float: left;
}
#content_left > ul > li > span {
    position: relative;
    float: left;
    margin-left: 2%;
}
.favorites_dropdown > ul {
    position: relative;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}
.favorites_dropdown > ul > li {
    position: relative;
    width: 98%;
    height: auto;
    padding: 1%;
    border-bottom: 1px solid rgba(255,255,255,0.2);
    padding-top: 3%;
    padding-bottom: 3%;
}
.favorites_dropdown > ul > li:hover {
    background-color: rgba(255,255,255,0.3);    
}
.favorites_dropdown > ul > li > div {
    position: relative;
    display: inline-block;
    height: auto;
    font-size: 0.8vw;
    text-align: center;
}
.favorites_dropdown > ul > li > div:nth-child(1) {
    width: 7%;
}
.favorites_dropdown > ul > li > div:nth-child(2) {
    width: 80%;
}
.favorites_dropdown > ul > li > div:nth-child(3) {
    width: 7%;
}
.fav_play, .list_play {
    color: rgba(0,0,0,0.7);
}
.favorite_build_video_name, .playlist_build_video_name {
    color: #777777;
}
.fav_remove, .list_remove {
    color: red;
}
.fav_play:hover, .fav_remove:hover, .list_play:hover, .list_remove:hover {
    cursor: pointer;
    opacity: 0.5;
}
.user_window {
    display: none;
    position: absolute;
    float: left;
    font-size: 0.8vw;
    width: 97%;
    height: auto;
    top: 0%;
    left: 0%;
    margin: 0 auto;
    color: #000000;
    background-color: #ffffff;
    z-index: 100;
    opacity: 0;
}
.user_window_top:hover {
    cursor: move;
}
#user_favorites_window {
    border: 2px solid rgba(204,0,0,0.5);
}
#user_favorites_window_title {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    font-size: 1.2vw;
}
#user_favorites_window_title > i {
    color: rgba(204,0,0,0.5);
}
#user_playlist_window {
    border: 2px solid rgba(0,125,255,0.5);
}
#user_course_window {
    border: 2px solid rgba(0,0,0,0.5);
}
#user_syllabus_window {
    border: 2px solid rgba(0,128,0,0.5);
}
#user_lessonplan_window {
    border: 2px solid rgb(241, 151, 13);
}
#user_assignment_window {
    border: 2px solid rgba(0,0,0,0.2);
}
#user_assessment_window {
    border: 2px solid rgb(122, 15, 175);
}
.user_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    background-color: #1d1d1d;
    box-shadow: 0px 1px 3px -1px #1d1d1d;
    color: #fff;
}
.user_window_top > span {
    font-size: 0.8vw;
}
.user_window_toolbar {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: rgba(0,0,0,0.1);
}
#user_lessonplan_window_new_lessonplan {
    position: relative;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 1%;
    background-color: rgba(241, 151, 13, 1);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
}
#user_lessonplan_window_new_lessonplan:hover {
    cursor: pointer;
    background-color: rgba(241, 151, 13, 0.75);
}
#user_assignment_window_add_learners {
    position: relative;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 1%;
    background-color: rgba(0,0,0,0.2);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
}
#user_assignment_window_add_learners:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
}
#user_playlist_window_title {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    font-size: 1.2vw;
}
#user_playlist_window_title > i {
    color: rgba(0, 125, 255, 0.5);
}
#user_course_window_title {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    font-size: 1.2vw;
}
#user_course_window_title > i {
    color: rgba(0,0,0,0.5);
}
#user_lessonplan_window_title {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    font-size: 1.2vw;
}
#user_lessonplan_window_title > i {
    color: rgba(241, 151, 13, 0.5);
}
#user_syllabus_window_title {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    font-size: 1.2vw;
}
#user_syllabus_window_title > i {
    color: rgba(0,128,0,0.5);
}
#user_assignment_window_title {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    font-size: 1.2vw;
}
#user_assignment_window_title > i {
    color: rgba(0,0,0,0.2);
}
#user_assessment_window_title {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    font-size: 1.2vw;
}
#user_assessment_window_title > i {
    color: rgba(122, 15, 175, 0.5);
}
.user_window_top > i {
    position: relative;
    float: right;
    font-size: 1vw;
    color: #fff;
}
.user_window_top > i:hover {
    cursor: pointer;
    color: #d1d1d1;
}
.user_window_group {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: rgba(125,125,125,0.2);
    box-shadow: 0px 0px 3px -1px #000000;
}
#user_syllabus_window_group_top, #user_syllabus_window_group_subgroup, #user_syllabus_window_group_taskbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_syllabus_window_group_subgroup {
    display: none;
    border-top: 1px solid rgba(0,0,0,0.1);
    padding-top: 1%;
}
#user_syllabus_window_group_taskbar {
    display: none;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#user_syllabus_window_group_taskbar button, #user_syllabus_window_subgroup_taskbar button {
    position: relative;
    width: auto;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
#user_syllabus_window_group_rename:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#user_syllabus_window_group_delete:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
#user_syllabus_window_subgroup_taskbar {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgb(0,0,0,0.1);
}
#user_syllabus_window_subgroup_top {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_syllabus_window_subgroup_add:hover, #user_syllabus_window_group_add:hover {
    cursor: pointer;
    background-color: rgba(0,120,245,0.65);
}
#user_syllabus_window_subgroup_rename:hover, #user_syllabus_window_group_rename:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#user_syllabus_window_subgroup_delete:hover, #user_syllabus_window_group_delete:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
#user_course_window_group_top, #user_course_window_group_subgroup, #user_course_window_group_taskbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_course_window_group_subgroup {
    display: none;
    border-top: 1px solid rgba(0,0,0,0.1);
    padding-top: 1%;
}
#user_course_window_group_taskbar {
    display: none;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#user_course_window_subgroup_taskbar button, #user_course_window_group_taskbar button {
    position: relative;
    width: auto;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
#user_course_window_subgroup_taskbar {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgb(0,0,0,0.1);
}
#user_course_window_subgroup_top {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_course_window_subgroup_add:hover, #user_course_window_group_add:hover {
    cursor: pointer;
    background-color: rgba(0,120,245,0.65);
}
#user_course_window_subgroup_rename:hover, #user_course_window_group_rename:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#user_course_window_subgroup_delete:hover, #user_course_window_group_delete:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
.user_course_window_subgroup_item > .user_window_group_top {
    font-size: 2vw;
}
.user_course_window_subgroup_item > .user_window_group_bottom {
    font-size: 0.8vw;   
}
#user_lessonplan_window_group_top, #user_lessonplan_window_group_subgroup, #user_lessonplan_window_group_taskbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_lessonplan_window_group_subgroup {
    display: none;
    border-top: 1px solid rgba(0,0,0,0.1);
    padding-top: 1%;
}
#user_lessonplan_window_group_taskbar {
    display: none;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#user_lessonplan_window_subgroup_taskbar button, #user_lessonplan_window_group_taskbar button {
    position: relative;
    width: auto;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
#user_lessonplan_window_subgroup_taskbar {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgb(0,0,0,0.1);
}
#user_lessonplan_window_subgroup_top {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_lessonplan_window_subgroup_add:hover, #user_lessonplan_window_group_add:hover {
    cursor: pointer;
    background-color: rgba(0,120,245,0.65);
}
#user_lessonplan_window_subgroup_rename:hover, #user_lessonplan_window_group_rename:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#user_lessonplan_window_subgroup_delete:hover, #user_lessonplan_window_group_delete:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
.user_lessonplan_window_subgroup_item > .user_window_group_top {
    font-size: 2vw;
}
.user_lessonplan_window_subgroup_item > .user_window_group_bottom {
    font-size: 0.8vw;   
}
#user_assignment_window_group_top, #user_assignment_window_group_subgroup, #user_assignment_window_group_taskbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_assignment_window_group_subgroup {
    display: none;
    border-top: 1px solid rgba(0,0,0,0.1);
    padding-top: 1%;
}
#user_assignment_window_group_taskbar {
    display: none;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#user_assignment_window_subgroup_taskbar button, #user_assignment_window_group_taskbar button {
    position: relative;
    width: auto;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
#user_assignment_window_subgroup_taskbar {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgb(0,0,0,0.1);
}
#user_assignment_window_subgroup_top {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_assignment_window_subgroup_add:hover, #user_assignment_window_group_add:hover {
    cursor: pointer;
    background-color: rgba(0,120,245,0.65);
}
#user_assignment_window_subgroup_rename:hover, #user_assignment_window_group_rename:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#user_assignment_window_subgroup_delete:hover, #user_assignment_window_group_delete:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
.user_assignment_window_subgroup_item > .user_window_group_top {
    font-size: 2vw;
}
.user_assignment_window_subgroup_item > .user_window_group_bottom {
    font-size: 0.8vw;   
}
#user_syllabus_window .user_window_group_item {
    position: relative;
    display: inline-block;
    width: 15%;
    height: auto;
    text-align: center;
}
#user_syllabus_window .user_window_group_item:hover {
    cursor: pointer;
}
.user_window_group_item_selected {
    font-weight: bold;
}
#user_syllabus_window #user_syllabus_window_group_item_back {
    display: none;
    opacity: 0;
    border-right: 2px solid rgba(0,0,0,0.1);
}
#user_syllabus_window #user_syllabus_window_group_item_back:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,1);
}
#user_course_window .user_window_group_item, #user_course_window .user_window_subgroup_item {
    position: relative;
    display: inline-block;
    width: 15%;
    height: auto;
    text-align: center;
    color: rgba(0,0,0,0.8);
}
#user_course_window .user_window_group_item:hover, #user_course_window .user_window_subgroup_item:hover {
    cursor: pointer;
    color: rgba(125, 125, 125, 0.5);
}
.user_window_group_item_selected {
    font-weight: bold;
}
#user_lessonplan_window #user_lessonplan_window_group_item_back, #user_lessonplan_window #user_lessonplan_window_subgroup_item_back {
    display: none;
    opacity: 0;
    border-right: 2px solid rgba(0,0,0,0.1);
    color: rgba(0,0,0,0.5);
}
#user_lessonplan_window #user_lessonplan_window_group_item_back:hover, #user_lessonplan_window #user_lessonplan_window_subgroup_item_back:hover {
    color: rgba(0,0,0,1);
}
#user_lessonplan_window #user_lessonplan_window_group_item_back, #user_lessonplan_window #user_lessonplan_window_subgroup_item_back {
    display: none;
    opacity: 0;
    border-right: 2px solid rgba(0,0,0,0.1);
    color: rgba(0,0,0,0.5);
}
#user_lessonplan_window #user_lessonplan_window_group_item_back:hover, #user_lessonplan_window #user_lessonplan_window_subgroup_item_back:hover {
    color: rgba(0,0,0,1);
}
.user_lessonplan_preview {
    position: relative;
    width: 60%;
    height: auto;
    padding: 1%;
    background-color: rgb(0,0,0);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
}
.user_lessonplan_preview:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.5);
}
#user_lessonplan_window .user_window_group_item, #user_lessonplan_window .user_window_subgroup_item {
    position: relative;
    display: inline-block;
    width: 15%;
    height: auto;
    text-align: center;
    color: rgba(0,0,0,0.8);
}
#user_lessonplan_window .user_window_group_item:hover, #user_lessonplan_window .user_window_subgroup_item:hover {
    cursor: pointer;
    color: rgba(125, 125, 125, 0.5);
}
.user_window_group_item_selected {
    font-weight: bold;
}
#user_lessonplan_window #user_lessonplan_window_group_item_back, #user_lessonplan_window #user_lessonplan_window_subgroup_item_back {
    display: none;
    opacity: 0;
    border-right: 2px solid rgba(0,0,0,0.1);
    color: rgba(0,0,0,0.5);
}
#user_lessonplan_window #user_lessonplan_window_group_item_back:hover, #user_lessonplan_window #user_lessonplan_window_subgroup_item_back:hover {
    color: rgba(0,0,0,1);
}
.user_window_group_top, .user_window_subgroup_top {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 3vw;
}
.user_window_group_bottom, .user_window_subgroup_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 0.8vw;
}
.user_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    text-align: left;
    margin-top: 0.5%;
}
.user_window_content_info {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1vw;
}
.user_window_content_info label {
    position: relative;
    float: left;
    width: 5%;
    height: auto;
}
.user_window_content_info input {
    position: relative;
    float: left;
    width: 15%;
    height: auto;
    
    border: 1px solid black;
    padding-left: 1%;
    margin-right: 1%;
    font-size: 1vw;
}
.user_window_content_info button {
    position: relative;
    float: left;
    width: 10%;
    height: auto;
    font-size: 1vw;
    color: #000000;
    background-color: #d7d7d7;
    
    box-shadow: 0px 1px 2px -1px #000000;
}
.user_window_content_info button:hover {
    cursor: pointer
    background-color: #7d7d7d;
}
.user_window_content table, .user_window_content table > tbody {
    width: 100%;
}
.user_window_content > table tr:nth-child(odd){
    background-color: rgba(0,0,0,0.1);
}
.user_window_content_table > table tr:nth-child(even){
    background-color: rgba(0,0,0,0.1);
}
.user_window_content_table {
    position: relative;
    float: left;
    width: 100%;
    height: 300px;
    overflow-x: hidden;
    overflow-y: auto;
}
.student_playlist_edit:hover {
    cursor: pointer;
    color: green;
}
.student_playlist_delete:hover {
    cursor: pointer;
    color: red;
}

#content_right_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    color: #ffffff;
}
#content_window {
    display: none;
    position: absolute;
    float: left;
    min-width: 98%;
    max-width: 98%;
    min-height: 92vh;
    max-height: 92vh;
    padding: 1%;
    width: auto;
    height: auto;
    left: 0%;
    z-index: 100;
    background-color: #ffffff;
    opacity: 0;
    box-shadow: 0 1px 3px -1px #000;
    letter-spacing: 1.5px;
}
#search-results {
    position: relative;
    float: left;
    width: 98.9%;
    height: auto;
    padding: 1%;
}
#search_results {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 89vh;
    max-height: 89vh;
    overflow-x: hidden;
    overflow-y: auto;
    opacity: 0;
}
#search-results-heading {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    color: #1d1d1d;
    font-size: 1.2vw;
    background-color: #ffffff;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#search-results-heading ul {
    position: relative;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: left;
}
#search-results-heading ul li {
    position: relative;
    width: 16%;
    height: auto;
    display: inline-block;
}
#results {
    position: relative;
    float: left;
    width: auto;
    min-width: 99.8%;
    max-width: 99.8%;
    height: auto;
    min-height: 90vh;
    max-height: 90vh;
    overflow: hidden;
}
.results_scroll {
    box-shadow: 0px -5px 6px -6px #000;
}
.result {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 17vh;
    max-height: 17vh;
    margin-left: 0.5%;
    margin-bottom: 0.5%;
    background-color: #fff;
    box-shadow: 0px 1px 2px -1px #000;
    border: 1px solid #e7e7e7;
    color: #000;
    opacity: 0;
    padding: 0.5%;
}
.result:hover {
    cursor: pointer;
}
.result_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.4vh;
    max-height: 2.4vh;
    color: #000;
}
.result_top span:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 85%;
    max-width: 85%;
    padding: 1%;
    font-size: .7vw;
    margin-left: 1%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.result_top > .oeg_icon {
    position: relative;
    float: right;
    width: auto;
    min-width: 8%;
    max-width: 8%;
    height: auto;
}
.oeg_icon > img {
    max-width: 95%;
    max-height: 95%;
}
.result_drag {
    box-shadow: 0px 0px 5px 1px #ffffff;
}
.result_toggle {
    display: none;
    width: 2%;
    height: auto;
    padding: 1%;
    margin-top: 2%;
}
.result_toggle i:hover {
    cursor: pointer;
    color: rgb(0, 128, 0);
}
.result_selected {
    color: rgb(0, 128, 0);
}
.result_tab {
    position: absolute !important;
    float: right !important;
    width: 2% !important;
    padding: 0% !important;
    right: 0% !important;
}
.result_main {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 14.5vh;
    max-height: 14.5vh;
}
.result_info {
    display: none;
    position: absolute;
    float: left;
    width: 98%;
    height: auto;
    min-height: 200px;
    max-height: 200px;
    margin-top: 60%;
    font-size: 0.8vw;
    color: #000;
    z-index: 11;
    background-color: #fff;
    
    box-shadow: 0px 0px 5px 1px #000;
    padding: 1%;
    opacity: 0;
}
.result_close > span {
    position: relative;
    float: right;
    height: auto;
    width: auto;
    font-size: 1vw;
    color: #000000;
    margin-right: 1%;
}
.result_close > span:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.75);
}
.result_type, .result_rating {
    position: relative;
    float: left;
    width: 48%;
    height: auto;
    padding: 1%;
}
.result_rating > span {
    position: relative;
    width: 95%;
    float: left;
    text-align: right;
}
.result_close {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding: 0%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.result_origin, .result_level, .result_duration, .result_criteria, .result_directory, .result_library {
    position: relative;
    float: left;
    width: 96%;
    height: auto;
    padding: 1%;
}
.result_type > span:nth-child(1){
    float: left;
    width: 70%;
}
.result_type > span:nth-child(2){
    float: left;
    width: 30%;
    font-weight: bold;
}
.result_library > span:nth-child(1){
    float: left;
    width: 35%;
}
.result_library > span:nth-child(2){
    float: left;
    width: 65%;
    font-weight: bold;
}
.result_origin > span:nth-child(1){
    float: left;
    width: 35%;
}
.result_origin > span:nth-child(2){
    float: left;
    width: 65%;
    font-weight: bold;
}
.result_level > span:nth-child(1){
    float: left;
    width: 35%;
}
.result_level > span:nth-child(2){
    float: left;
    width: 65%;
    font-weight: bold;
}
.result_duration > span:nth-child(1){
    float: left;
    width: 35%;
}
.result_duration > span:nth-child(2){
    float: left;
    width: 65%;
    font-weight: bold;
}
.result_directory > span:nth-child(1){
    float: left;
    width: 35%;
}
.result_directory > span:nth-child(2){
    float: left;
    width: 65%;
    font-weight: bold;
}
.result_criteria {
    font-weight: bold;
    color: rgba(0,0,0,0.4);
}
.result_cover {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 15vh;
    max-height: 15vh;
    text-align: center;
}
.result_cover .result_play, .result_cover .cover_workshop_demo, .result_cover .cover_doc_view, .result_cover .cover_int_view, .result_cover .cover_summary_view, .result_cover .cover_pp_view {
    position: absolute;
    float: left;
    left: 0%;
    z-index: 2;
    font-size: 2.5vw;
    margin-top: 19%;
    color: rgba(255,255,255,0.4);
    width: auto;
    min-width: 100%;
    max-width: 100%;
    text-align: center;
}
.result_cover i:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.7);
}
.result_cover img {
    max-width: 100%;
    max-height: 100%;
    max-height: 15vh;
}
.result_right > div {
    position: relative;
    float: left;
    width: 97%;
    padding: 1%;
    font-size: 1vw;
    height: auto;
}
.result_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.result_question_video:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.3);
}
footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: auto;
    padding: 0.3%;
    background-color: #ffffff;
    color: #7d7d7d;
    font-size: 1vw;
    box-shadow: 0px 0px 1px -1px rgb(0, 0, 0);
    z-index: 1000;
}
#oeg_tag, .oeg_tag {
    position: absolute;
    bottom: 1%;
    float: left;
    left: 0;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    text-align: center;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
#oeg_tag > img, .oeg_tag > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    max-height: 1.3vh;
    object-fit: contain;
}
#overlay {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 100vh;
    max-height: 100vh;
    background-color: rgba(0,0,0,0.1);
    z-index: 100;
}
#content_right_screen_overlay {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 83vh;
    max-height: 83vh;
    background-color: rgba(0,0,0,0.1);
    z-index: 100;
    top: 5%;
}
#overlay_left {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 89%;
    max-width: 89%;
    height: auto;
    min-height: 92vh;
    max-height: 92vh;
    background-color: rgba(0,0,0,0.1);
    z-index: 98;
}
#content_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    font-size: 0.8vw;
    color: #000000;
    padding: 0.5%;
    background-color: #e7e7e7;
    margin-bottom: 0.5%;
}
#content_window_top_header {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 2.5vh;
    max-height: 2.5vh;
}
#content_window_top_header span {
    position: relative;
    margin-top: 0.2%;
}
#content_window_top_header > span:nth-child(1) {
        float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
#content_window_fav > i.no_fav {
    color: rgba(0,0,0,0.2);
}
#content_window_fav > i.no_fav:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.5);
}
#content_window_fav > i.fav {
    color: rgba(204,0,0,1);
}
#content_window_close {
    position: relative;
    float: right;
    width: auto;
    min-width: 1%;
    max-width: 2%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
#content_window_close:hover {
    cursor: pointer;
    color: #d1d1d1;
}
#content_window_top_taskbar {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.3vh;
    max-height: 2.3vh;
    background-color: #192a56;
    color: #fff;
}
#content_window:active {
    cursor: move;
}
#content_window_bottom video {
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 84vh;
    max-height: 84vh;
    object-fit: fill;
}
#content_window_bottom iframe {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 84vh;
    max-height: 84vh;
    border: 0;
}
#content_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 82%;
    max-width: 82%;
    height: auto;
    min-height: 84vh;
    max-height: 84vh;
    background-color: #e7e7e7;
}
#content_window_data {
    position: relative;
    float: left;
    width: auto;
    min-width: 17.5%;
    max-width: 17.5%;
    margin-left: 0.5%;
    height: auto;
    min-height: 84vh;
    max-height: 84vh;
    background-color: #e7e7e7;
}
#content_window_data_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 77vh;
    max-height: 77vh;
    margin-bottom: 1%;
}
#content_window_data_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
}
#content_window_data button {
    position: relative;
    float: left;
    width: auto;
    min-width: 90%;
    max-width: 90%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    padding: 3%;
    color: #fff;
    background-color: #192a56;
    font-size: 0.7vw;
    margin-left: 5%;
    text-align: left;
    margin-top: 4%;
    box-shadow: 0px 1px 3px -1px #000;
}
#content_window_rate {
    display: none;
    position: absolute;
    width: auto;
    min-width: 60%;
    max-width: 60%;
    height: auto;
    min-height: 22vh;
    padding: 1%;
    font-size: 0.7vw;
    top: 32%;
    left: 11%;
    background-color: rgba(255,255,255,1);
    opacity: 0;
    z-index: 101;
    box-shadow: 0px 1px 3px -1px #000;
    letter-spacing: 1.5px;
}
#content_window_rate_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 1.5vh;
    max-height: 1.5vh;
    padding: 1%;
    background-color: #192a56;
    color: #fff;
    margin-bottom: 0.5%;
}
#content_window_rate_name {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 50%;
    height: auto;
    font-weight: bold;
    margin-right: 0.5%;
}
#content_window_rate_close {
    position: relative;
    float: right;
    right: 0;
    width: auto;
    height: auto;
}
#content_window_rate_close:hover {
    cursor: pointer;
}
.content_rating {
    font-size: 1vw !important;
}
.content_rating:hover {
    cursor: pointer !important;
}
#content_window_rate_content, #content_window_rate_comment, #content_window_rate_comments {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
}
#content_window_rate_content {
    color: #000;
}
#content_window_rate_comment {
    border-bottom: 1px solid #e7e7e7;
    margin-bottom: 1%;
}
#content_window_rate_comment > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
#content_window_new_comment_section {
    position: relative;
    float: left;
    font-size: 0.8vw;
    text-align: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    padding-bottom: 2%;
    resize: none;
    margin-bottom: 1%;
}
#content_window_new_comment_section:focus {
    box-shadow: 0px 0px 0px 3px gold;
}
#content_window_rate_comments > ul {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 145px;
    overflow-y: auto;
}
#content_window_rate_comments > ul > li {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    margin-bottom: 0.5%;
    padding: 1%;
}
#content_window_rate_comments > ul > li:nth-child(odd){
    border-bottom: 1px solid #e7e7e7;
}
.commenter, .comment {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.comment_date {
    position: relative;
    margin-left: 2%;
    font-size: 0.6vw;
    color: #1d1d1d;
}
.comment_remove {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    color: rgb(204,0,0);
}
.comment_remove:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.spotlight_comment {
    border-bottom: 1px solid gold;
    border-top: 1px solid gold;
    background-color: rgba(255, 215, 0, 0.1);
}
#content_window_rate_cancel, #content_window_rate_submit {   
    position: relative;
    float: right;
    width: auto;
    min-width: 5%;
    max-width: 10%;
    height: auto;
    color: #fff;
    font-size: 0.7vw;
    letter-spacing: 1.5px;
    font-family: roboto,sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    margin-left: 1%;
    opacity: 1;
}
#content_window_rate_cancel {
    background-color: rgb(204,0,0);
}
#content_window_rate_submit {
    background-color: rgb(0,128,0);
}
#content_window_rate_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
    box-shadow: 0px 1px 5px -1px #000000;
}
#content_window_rate_submit:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
    box-shadow: 0px 1px 5px -1px #000000;
}
#content_window_rate_loader {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    min-height: 100%;
}
#content_window_rate_loader > img {
    width: 75%;
    height: auto;
}
#content_window_comment {
    display: none;
    position: absolute;
    width: auto;
    min-width: 91%;
    max-width: 91%;
    height: auto;
    padding: 1%;
    font-size: 0.7vw;
    top: 32%;
    left: 3.3%;
    background-color: rgba(255,255,255,1);
    
    color: #000;
    opacity: 0;
    z-index: 101;
    box-shadow: 0px 1px 3px -1px #000;
    letter-spacing: 1.5px;
}
#content_window_comment_top {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: #d3d3d3;
    
    font-weight: bold;
    font-size: 1vw;
    margin-bottom: 5%;
    box-shadow: 0px 1px 6px 0px #000000;
}
.content_window_comment_close {
    position: relative;
    float: right;
    font-size: 1vw;
}
.content_window_comment_close:hover {
    cursor: pointer;
    color: #7d7d7d;
}
#content_window_comment_section {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#content_window_comment_section ul {
    position: relative;
    float: left;
    padding: 0;
    margin: 0;
    width: 100%;
    height: auto;
    list-style: none;
}
#content_window_comment_section ul li {
    position: relative;
    width: 98%;
    height: auto;
    padding: 3%;
    border-bottom: 1px solid #d3d3d3;
}
#result_question_video {
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    border: 1px solid #d3d3d3;
    background-color: #7d7d7d;
    color: #ffffff;
    font-size: 1vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
#result_question_video:hover {
    cursor: pointer;
    background-color: #e7e7e7;
}
#add_to {
    position: relative;
    display: inline-block;
    width: 14%;
    height: auto;
    border: 1px solid #d3d3d3;
    background-color: #7d7d7d;
    color: #ffffff;
    font-size: 1vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
#add_to:hover {
    cursor: pointer;
    background-color: #d1d1d1;
}
.add_to_active {
    border: 1.2px solid #000000 !important;
}
#add_to_window {
    display: none;
    position: absolute;
    z-index: 3;
    width: 25%;
    height: auto;
    padding: 1%;
    background-color: #ffffff;
    box-shadow: 0px 0px 5px -1px #000000;
    color: #000000;
    left: 2.5%;
    top: 13%;
    font-size: 1vw;
    
    opacity: 0;
}
#add_to_window > ul {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    height: auto;
}
#add_to_window > ul > li {
    position: relative;
    width: 98%;
    height: auto;
    border-bottom: 1px solid #d3d3d3;
    padding: 1%;
}
#add_to_window > ul > li:hover {
    cursor: pointer;
    background-color: #d3d3d3;
}
#add_to_window > ul > li > span {
    position: relative;
    margin-left: 6%;
}
.add_to_options_dropdown {
    display: none;
    position: absolute;
    top: 0%;
    left: 105%;
    width: 110%;
    list-style: none;
    padding: 0%;
    margin: 0;
    background-color: #ffffff;
    box-shadow: 0px 0px 5px -1px #000000;
}
.add_to_options_dropdown > li {
    position: relative;
    width: 98%;
    height: auto;
    border-bottom: 1px solid #d3d3d3;
    padding: 1%;
}
.add_to_options_dropdown > li:hover {
    cursor: pointer;
    background-color: #d3d3d3;
    font-weight: bold;
}
.add_to_options > i.fa-heart {
    color: rgba(204,0,0,0.5);   
}
#add_to_options-playlists > i.fa-th-large, .new_playlist > i.fa-th-large, .playlist > i.fa-th-large, .existing_playlist > i.fa-th-large {
    color: rgba(0,125,255,1);
}
#add_to_options-syllabus > i.fa-th-large, .new_syllabus > i.fa-th-large, .syllabus > i.fa-th-large, .existing_syllabus > i.fa-th-large {
    color: rgba(0,128,0,1);
}
#add_to_options-courses > i.fa-th-large, .new_course > i.fa-th-large, .course > i.fa-th-large, .existing_course > i.fa-th-large {
    color: rgba(0,0,0,1);
}
.new_playlist, .new_syllabus, .new_course {
    border-bottom: 1px solid #000000 !important;
}
.playlist_option_status {
    display: none;
    color: rgb(0,128,0);
    font-weight: bold;
    font-size: 1vw;
}
.favorites_glow {
    -webkit-animation: favorites 1500ms 1;
    -moz-animation: favorites 1500ms 1;
    -o-animation: favorites 1500ms 1;
    animation: favorites 1500ms 1;
}
@keyframes favorites {
    0% { color: rgba(204,0,0,0.1); }
    50% { color: rgba(204,0,0,0.5); }
    100% { color: rgb(204,0,0); }
}
.playlist_glow {
    -webkit-animation: playlist 1500ms 1;
    -moz-animation: playlist 1500ms 1;
    -o-animation: playlist 1500ms 1;
    animation: playlist 1500ms 1;
}
@keyframes playlist {
    0% { color: rgba(0,125,255,0.1); }
    50% { color: rgba(0,125,255,0.5); }
    100% { color: rgb(0,125,255); }
}
.syllabus_glow {
    -webkit-animation: syllabus 1500ms 1;
    -moz-animation: syllabus 1500ms 1;
    -o-animation: syllabus 1500ms 1;
    animation: syllabus 1500ms 1;
}
@keyframes syllabus {
    0% { color: rgba(0,128,0,0.1); }
    50% { color: rgba(0,128,0,0.5); }
    100% { color: rgb(0,128,0); }
}
.course_glow {
    -webkit-animation: course 1500ms 1;
    -moz-animation: course 1500ms 1;
    -o-animation: course 1500ms 1;
    animation: course 1500ms 1;
}
@keyframes course {
    0% { color: rgba(0,0,0,0.1); }
    50% { color: rgba(0,0,0,0.5); }
    100% { color: rgb(0,0,0); }
}
#new_playlist_window, #new_syllabus_window, #new_course_window, #new_syllabus_window1, #new_course_window1 {
    display: none;
    position: absolute;
    min-width: 60%;
    height: auto;
    padding: 1%;
    background-color: #ffffff;
    z-index: 1003;
    border: 1px solid black;
    font-size: 1vw;
    
    left: 34%;
    top: 7.5%;
    color: #000000;
}
#new_playlist_window_top {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: rgb(0,125,255);
    color: #ffffff;
}
#new_syllabus_window_top {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: rgb(0,128,0);
    color: #ffffff;
}
#new_course_window_top {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: rgb(0,0,0);
    color: #ffffff;
}
#new_playlist_window_content, #new_playlist_window_bottom, #new_syllabus_window_content, #new_syllabus_window_bottom, #new_course_window_content, #new_course_window_bottom {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
#new_playlist_window label, #new_syllabus_window label, #new_course_window label, #new_syllabus_window1 label, #new_course_window1 label {
    position: relative;
    float: left;
    width: 24%;
    height: auto;
    font-size: 0.8vw;
}
#new_playlist_window input, #new_syllabus_window input, #new_course_window input, #new_syllabus_window1 input, #new_course_window1 input {
    position: relative;
    float: left;
    width: 70%;
    height: auto;
    font-size: 1vw;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    padding-left: 3%;
    margin-bottom: 1%;
    z-index: 100000;
}
.field_required {
    border: 1px solid red !important;
}
#new_playlist_window textarea, #new_syllabus_window textarea, #new_course_window textarea, #new_syllabus_window1 textarea, #new_course_window1 textarea {
    position: relative;
    float: left;
    width: 70.6%;
    height: 100px;
    resize: none;
    padding-left: 2%;
    outline: 0;
    font-family: 'Roboto', sans-serif;
    margin-bottom: 1%;
}
#new_playlist_window select, #new_syllabus_window select, #new_course_window select, #new_syllabus_window1 select, #new_course_window1 select {
    position: relative;
    float: left;
    width: 74%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1vw;
    font-family: 'Roboto', sans-serif;
}
#new_syllabus_group_textbox, #new_course_group_textbox, #new_syllabus_group1_textbox, #new_course_group1_textbox {
    position: absolute !important;
    top: 0;
    left: 0;
    z-index: 999;
    padding: 0;
    margin: 0;
}
#new_playlist_cancel, #new_syllabus_cancel, #new_course_cancel, #new_syllabus_cancel1, #new_course_cancel1 {
    position: relative;
    width: 20%;
    height: auto;
    padding: 1%;
    float: right;
    color: #ffffff;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
#new_playlist_ok, #new_syllabus_ok, #new_course_ok, #new_syllabus_ok1, #new_course_ok1 {
    position: relative;
    width: 20%;
    height: auto;
    padding: 1%;
    float: right;
    color: #ffffff;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
#new_playlist_ok, #new_playlist_cancel {
    background-color: rgb(0,125,255);
}
#new_syllabus_ok1, #new_syllabus_cancel1 {
    background-color: rgb(0,128,0);
}
#new_course_ok1, #new_course_cancel1 {
    background-color: rgb(0,0,0);
}
#playlist_window {
    display: none;
    position: absolute;
    float: left;
    width: 96%;
    height: auto;
    padding: 1%;
    left: -90%;
    z-index: 101;
    background-color: #ffffff;
    
    opacity: 0;
}
#playlist_window > span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1.3vw;
    color: #7d7d7d;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
#playlist_window > span:hover {
    cursor: pointer;
}
#playlist_window > span > i {
    color: rgb(0,125,255);
}
#playlist_window_heading {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    color: #7d7d7d;
    background-color: rgba(0,0,0,0.1);
    
}
#playlist_window_heading > ul {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 1vw;
}
#playlist_window_heading > ul > li {
    position: relative;
    display: inline-block;
    height: auto;
}
#playlist_window_heading > ul > li:nth-child(1){
    width: 10%;
    margin-left: 14%;
}
#playlist_window_heading > ul > li:nth-child(2){
    width: 4%;
    margin-left: 14%;
}
#playlist_window_heading > ul > li:nth-child(3){
    width: 9%;
    margin-left: 0%;
}
#playlist_window_heading > ul > li:nth-child(4){
    width: 4%;
    margin-left: 8%;
}
#playlist_window_heading > ul > li:nth-child(5){
    width: 5%;
    margin-left: 17%;
}
#playlist_window_heading > ul > li:nth-child(6){
    width: 5%;
    margin-left: 6%;
}
.playlist_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: 500px;
    
    background-color: #ffffff;
    overflow: auto;
}
.playlist_window_content > li {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.5);
    background-color: #ffffff;
    list-style: none;
    color: #7d7d7d;
}
.playlist_window_content > li > div {
    position: relative;
    display: inline-block;
    height: auto;
    font-size: 1vw;
}
.playlist_window_content > li:hover {
    cursor: move;
    background-color: rgba(0,0,0,0.1);
}
.playlist_item_play_active {
    background-color: rgba(0,128,0,0.3);
}
.playlist_item_remove_active {
    background-color: rgba(204,0,0,0.5);
}
.playlist_result_cover {
    float: left;
    width: 10%;
    height: auto;
    padding: 1%;
}
.playlist_result_cover i {
    position: absolute;
    z-index: 2;
    font-size: 3vw;
    left: 35%;
    top: 23%;
    color: rgba(255,255,255,0.5);
}
.playlist_result_cover i:hover {
    cursor: pointer;
    color: rgba(0,125,255,0.7);
}
.playlist_result_cover img {
    width: 100%;
    height: auto;
}
.playlist_result_name {
    width: 24%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.playlist_result_name span:last-child {
    color: #000000;
}
.playlist_result_sort {
    width: 3%;
}
.playlist_result_sort input {
    width: 100%;
    text-align: center;
    font-family: 'Roboto', sans-serif;
}
.playlist_result_level {
    width: 16%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.playlist_result_origin {
    width: 15%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.playlist_result_criteria {
    width: 14%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
    text-align: center;
}
.playlist_result_delete {
    width: 5%;
    text-align: center;
    font-size: 1vw;
}
.playlist_window_minimize {
    position: relative;
    float: right;
    right: 3%;
    font-size: 1vw;
}
.playlist_window_minimize:hover {
    cursor: pointer;
    color: rgb(0,125,255);
}
.playlist_window_close {
    position: relative;
    float: right;
    font-size: 1vw;
}
.playlist_window_close:hover {
    cursor: pointer;
    color: rgb(0,125,255);
}
.playlist_remove:hover {
    cursor: pointer;
    font-weight: bold;
}
video::-internal-media-controls-download-button {
    display:none;
}
video::-webkit-media-controls-enclosure {
    overflow:hidden;
}
video::-webkit-media-controls-panel {
    width: calc(100% + 100px); /* Adjust as needed */
}
#popup_window {
    display: none;
    position: absolute;
    min-width: 22%;
    max-width: 22%;
    height: auto;
    min-height: 7vh;
    padding: 1%;
    background-color: #ffffff;
    font-size: 0.7vw;
    opacity: 1;
    z-index: 999;
    color: #000;
    box-shadow: 0 1px 3px -1px #000;
    border: 2px solid #192a56;
    top: 30%;
    left: 1%;
}
.popup_window_center {
    left: 37% !important;
    top: 30% !important;
}
#popup_window_message {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5vh;
}
#popup_window_message > label {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#popup_window_message p {
    font-weight: normal;
}
#popup_window_task {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 1%;
}
#popup_window_task button {
    position: relative;
    min-width: 20%;
    width: auto;
    height: auto;
    padding: 0%;
    float: right;
    color: #ffffff;
    font-size: 0.7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    margin-left: 1%;
    opacity: 1;
}
#popup_cancel {
    background-color: rgb(204,0,0);
}
#popup_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
#popup_confirm {
    background-color: rgba(0,128,0,1);
}
#popup_confirm:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
.tooltip {
    background-color: #ffffff !important;
    border: none;
    padding: 0.5%;
    color: #000000 !important;
    text-align: left;
    font-size: 0.6vw !important;
    box-shadow: none !important;
    font-size: 0.8vw;
}
.user_course_div1 {
    position: relative;
    float: left;
    width: 80%;
    height: auto;
    border-bottom: 1px solid rgba(255,255,255,0.2);
}
.user_course_div1 > span:hover {
    cursor: pointer;
    font-weight: bold;
}
.user_course_div1 > span {
    position: relative;
    margin-left: 5%;
}
.user_course_div2 {
    position: relative;
    float: left;
    width: 20%;
    height: auto;
    border-bottom: 1px solid rgba(255,255,255,0.2);
}
.user_course_div2 > span {
    position: relative;
    margin-right: 20%;
}
.user_syllabus_div1 {
    position: relative;
    float: left;
    width: 80%;
    height: auto;
    border-bottom: 1px solid rgba(255,255,255,0.2);
}
.user_syllabus_div1 > span:hover {
    cursor: pointer;
    font-weight: bold;
}
.user_syllabus_div1 > span {
    position: relative;
    margin-left: 5%;
}
.user_syllabus_div2 {
    position: relative;
    float: left;
    width: 20%;
    height: auto;
    border-bottom: 1px solid rgba(255,255,255,0.2);
}
.user_syllabus_div2 > span {
    position: relative;
    margin-right: 20%;
}
#syllabus_window {
    display: none;
    position: absolute;
    float: left;
    width: 96%;
    height: auto;
    padding: 1%;
    left: -90%;
    z-index: 101;
    background-color: #ffffff;
    
    opacity: 0;
    box-shadow: 0px 1px 1px 0px #000000;
}
#syllabus_window > span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1.3vw;
    color: #7d7d7d;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
#syllabus_window > span:hover {
    cursor: move;
}
#syllabus_window > span > i {
    color: rgb(0,128,0);
}
.syllabus_window_toolbar {
    position: relative;
    display: inline-block;
    width: 64%;
    height: auto;
    left: 2%;
    margin-bottom: 0.2%;
}
.syllabus_window_toolbar button {
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    padding: 0.5%;
    border: 1px solid #fff;
    background-color: green;
    color: #fff;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: varela round,sans-serif;
    
    outline: 0;
}
.syllabus_window_toolbar button:hover {
    cursor: pointer;
    background-color: #7d7d7d;
}
#syllabus_window_heading {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    color: #7d7d7d;
    background-color: rgba(0,0,0,0.1);
    
}
#syllabus_window_heading > ul {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 1vw;
}
#syllabus_window_heading > ul > li {
    position: relative;
    display: inline-block;
    height: auto;
}
#syllabus_window_heading > ul > li:nth-child(1){
    width: 10%;
    margin-left: 13%;
}
#syllabus_window_heading > ul > li:nth-child(2){
    width: 4%;
    margin-left: 13%;
}
#syllabus_window_heading > ul > li:nth-child(3){
    width: 10%;
    margin-left: 1%;
}
#syllabus_window_heading > ul > li:nth-child(4){
    width: 4%;
    margin-left: 9%;
}
#syllabus_window_heading > ul > li:nth-child(5){
    width: 5%;
    margin-left: 13%;
}
#syllabus_window_heading > ul > li:nth-child(6){
    width: 5%;
    margin-left: 5%;
}
#syllabus_window_heading > ul > li:nth-child(7){
    width: 5%;
    margin-left: 0%;
}
.syllabus_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: 500px;
    border: 1px solid #777777;
    
    background-color: #ffffff;
    overflow: auto;
    color: #7d7d7d;
}
.syllabus_window_content > li {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.3);
    background-color: #ffffff;
    list-style: none;
}
.syllabus_window_content > li > div {
    position: relative;
    display: inline-block;
    height: auto;
    font-size: 1vw;
}
.syllabus_window_content > li:hover {
    cursor: move;
    background-color: rgba(0,0,0,0.1);
}
.syllabus_item_play_active {
    background-color: rgba(0,128,0,0.3);
}
.syllabus_item_remove_active {
    background-color: rgba(204,0,0,0.5);
}
.syllabus_result_cover {
    float: left;
    width: 10%;
    height: auto;
    padding: 1%;
}
.syllabus_result_cover i {
    position: absolute;
    z-index: 2;
    font-size: 3vw;
    left: 35%;
    top: 23%;
    color: rgba(255,255,255,0.5);
}
.syllabus_result_cover i:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.syllabus_result_cover .cover_doc_view, .syllabus_result_cover .cover_pp_view {
    position: absolute;
    z-index: 2;
    font-size: 3vw;
    left: 35%;
    top: 23%;
    color: rgba(255,255,255,0.5);
}
.syllabus_result_cover img {
    width: 100%;
    height: auto;
}
.syllabus_result_name {
    width: 24%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.syllabus_result_name span:last-child {
    color: #777777;
}
.syllabus_result_sort {
    width: 3%;
}
.syllabus_result_sort input {
    width: 100%;
    text-align: center;
    font-family: 'Roboto', sans-serif;
}
.syllabus_result_level {
    width: 16%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.syllabus_result_origin {
    width: 15%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.syllabus_result_criteria {
    width: 13%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
    text-align: center;
}
.syllabus_result_notes {
    width: 1%;
    text-align: center;
    font-size: 1vw;
}
.syllabus_result_delete {
    width: 5%;
    text-align: center;
    font-size: 1vw;
    color: red;
}
.syllabus_window_minimize {
    position: relative;
    float: right;
    right: 3%;
    font-size: 1vw;
}
.syllabus_window_minimize:hover {
    cursor: pointer;
    color: rgb(0,128,0);
}
.syllabus_window_close {
    position: relative;
    float: right;
    font-size: 1vw;
}
.syllabus_window_close:hover {
    cursor: pointer;
    color: green;
}
.syllabus_quiz:hover {
    cursor: pointer;
}
.syllabus_notes:hover, .syllabus_remove:hover {
    cursor: pointer;
    font-weight: bold;
}
#course_window {
    display: none;
    position: absolute;
    float: left;
    width: 96%;
    height: auto;
    padding: 1%;
    left: -90%;
    z-index: 101;
    background-color: #ffffff;
    
    opacity: 0;
    box-shadow: 0px 1px 1px 0px #000000;
}
#course_window > span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1.3vw;
    color: #7d7d7d;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
#course_window > span:hover {
    cursor: move;
}
#course_window > span > i {
    color: rgb(0,0,0);
}
.course_window_toolbar {
    position: relative;
    display: inline-block;
    width: 64%;
    height: auto;
    left: 2%;
    margin-bottom: 0.2%;
}
.course_window_toolbar button {
    position: relative;
    display: inline-block;
    width: auto;
    max-width: 15%;
    height: auto;
    padding: 0.5%;
    border: 1px solid #ffffff;
    background-color: #1d1d1d;
    color: #ffffff;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
.course_window_toolbar button:hover {
    cursor: pointer;
    background-color: #7d7d7d;
}
#course_window_info {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    margin-bottom: 1%;
}
#course_window_heading {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    color: #7d7d7d;
    background-color: rgba(0,0,0,0.1);
    
}
#course_window_heading > ul {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 1vw;
}
#course_window_heading > ul > li {
    position: relative;
    display: inline-block;
    height: auto;
}
#course_window_heading > ul > li:nth-child(1){
    width: 10%;
    margin-left: 13%;
}
#course_window_heading > ul > li:nth-child(2){
    width: 4%;
    margin-left: 13%;
}
#course_window_heading > ul > li:nth-child(3){
    width: 9%;
    margin-left: 1%;
}
#course_window_heading > ul > li:nth-child(4){
    width: 4%;
    margin-left: 4%;
}
#course_window_heading > ul > li:nth-child(5){
    width: 5%;
    margin-left: 10%;
}
#course_window_heading > ul > li:nth-child(6){
    width: 5%;
    margin-left: 9%;
}
#course_window_heading > ul > li:nth-child(7){
    width: 5%;
    margin-left: 4%;
}
.course_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: 500px;
    border: 1px solid #777777;
    
    background-color: #ffffff;
    overflow: auto;
    color: #7d7d7d;
}
.course_window_content > li {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.3);
    background-color: #ffffff;
    list-style: none;
}
.course_window_content > li > div {
    position: relative;
    display: inline-block;
    height: auto;
    font-size: 1vw;
}
.course_window_content > li:hover {
    cursor: move;
    background-color: rgba(0,0,0,0.1);
}
.course_item_play_active {
    background-color: rgba(0,128,0,0.3);
}
.course_item_remove_active {
    background-color: rgba(204,0,0,0.5);
}
.course_result_cover {
    float: left;
    width: 10%;
    height: auto;
    padding: 1%;
}
.course_result_cover i {
    position: absolute;
    z-index: 2;
    font-size: 3vw;
    left: 35%;
    top: 23%;
    color: rgba(255,255,255,0.5);
}
.course_result_cover i:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.7);
}
.course_result_cover .cover_doc_view, .course_result_cover .cover_pp_view {
    position: absolute;
    z-index: 2;
    font-size: 3vw;
    left: 35%;
    top: 23%;
    color: rgba(255,255,255,0.5);
}
.course_result_cover img {
    width: 100%;
    height: auto;
}
.course_result_name {
    width: 24%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.course_result_name span:last-child {
    color: #777777;
}
.course_result_sort {
    width: 3%;
}
.course_result_sort input {
    width: 100%;
    text-align: center;
    font-family: 'Roboto', sans-serif;
}
.course_result_level {
    width: 10%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.course_result_origin {
    width: 10%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.course_result_criteria {
    width: 14%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
    text-align: center;
}
.course_result_questions {
    width: 10%;
    height: auto;
    text-align: center;
    font-size: 1vw;
    margin-top: 2%;
    padding: 1%;
}
.course_result_questions button {
    position: relative;
    padding: 1%;
    width: 100%;
    height: auto;
    background-color: rgb(204,0,0);
    color: #ffffff;
    font-size: 1vw;
    border: none;
    
}
.course_result_questions button:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.5);
}
.course_result_delete {
    width: 5%;
    text-align: center;
    font-size: 1vw;
    color: red;
}
.course_window_minimize {
    position: relative;
    float: right;
    right: 3%;
    font-size: 1vw;
}
.course_window_minimize:hover {
    cursor: pointer;
    color: rgb(0,0,0);
}
.course_window_close {
    position: relative;
    float: right;
    font-size: 1vw;
}
.course_window_close:hover {
    cursor: pointer;
    color: rgb(0,0,0);
}
.course_quiz {
    position: absolute;
    float: left;
    text-align: right;
    width: auto;
    min-width: 4%;
    max-width: 4%;
    height: auto;
    margin-top: 40%;
    color: rgb(0,128,0);
}
.course_quiz:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.5);
}
.course_remove:hover, .course_certificate_remove:hover {
    cursor: pointer;
    font-weight: bold;
}
#playlist_add_to {
    position: relative;
    display: inline-block;
    width: 14%;
    height: auto;
    margin-left: 1%;
    border: 1px solid #ffffff;
    background-color: #7d7d7d;
    color: #ffffff;
    font-size: 1vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
#playlist_add_to:hover {
    cursor: pointer;
    background-color: #d3d3d3;
}
.playlist_add_to_active {
    border: 1.3px solid #000000 !important;
}
#playlist_add_to_window {
    display: none;
    position: absolute;
    z-index: 3;
    width: 16%;
    height: auto;
    padding: 1%;
    background-color: #ffffff;
    border: 1px solid black;
    color: #000000;
    left: 15%;
    top: 7.5%;
    font-size: 1vw;
    
    opacity: 0;
}
#playlist_add_to_window ul {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    height: auto;
}
#playlist_add_to_window ul li {
    position: relative;
    width: 98%;
    height: auto;
    border-bottom: 1px solid #d3d3d3;
    padding: 1%;
}
#playlist_add_to_window ul li:hover {
    cursor: pointer;
    background-color: #d3d3d3;
}
#playlist_add_to_window ul li span {
    position: relative;
    margin-left: 6%;
}
.build_syllabus > i {
    color: rgba(0,128,0,0.5);
}
.build_course > i {
    color: rgba(0,0,0,0.5);
}
.course_item_task_window, .syllabus_item_task_window, .playlist_item_task_window, .lessonplan_item_task_window, .assessment_item_task_window {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 50%;
    height: auto;
    padding: 0.5%;
    background-color: #ffffff;
    z-index: 102;
    box-shadow: 0px 1px 3px -1px #000;
    font-size: 0.7vw;
    left: 66%;
    top: 6%;
    color: #000000;
}
.course_item_task_window label, .syllabus_item_task_window label, .playlist_item_task_window label, .lessonplan_item_task_window label, .assessment_item_task_window label {
    position: relative;
    float: left;
    width: 45%;
    height: auto;
}
.course_item_task_window input[type=text], .syllabus_item_task_window input[type=text], .playlist_item_task_window input[type=text], .lessonplan_item_task_window input[type=text], .assessment_item_task_window input[type=text] {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    font-size: 0.7vw;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    padding-left: 1%;
    margin-bottom: 1%;
}
.course_item_task_window textarea, .syllabus_item_task_window textarea, .playlist_item_task_window textarea, .lessonplan_item_task_window textarea, .assessment_item_task_window textarea {
    position: relative;
    float: left;
    width: 50.6%;
    height: 100px;
    resize: none;
    padding-left: 2%;
    outline: 0;
    font-family: 'Roboto', sans-serif;
    margin-bottom: 1%;
}
.course_item_task_cancel, .syllabus_item_task_cancel, .playlist_item_task_cancel, .lessonplan_item_task_cancel, .assessment_item_task_cancel {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    margin-top: 1%;
    left: 45%;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 1.5px;
    font-size: 0.7vw;
    background-color: rgb(204,0,0);
    color: #fff;
    border: 0;
    outline: 0;
    box-shadow: 0px 1px 3px -1px #000;
}
.course_item_task_ok, .syllabus_item_task_ok, .playlist_item_task_ok, .lessonplan_item_task_ok, .assessment_item_task_ok {
    position: relative;
    float: right;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    margin-top: 1%;
    right: 2%;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 1.5px;
    font-size: 0.7vw;
    background-color: rgb(0,128,0);
    color: #fff;
    border: 0;
    outline: 0;
    box-shadow: 0px 1px 3px -1px #000;
}
#add_workshop_window {
    width: 65% !important;
}
#add_workshop_window_top {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    background-color: #d1d1d1;
    padding: 1%;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
}
#add_workshop_window_content {
    position: relative;
    float: left;
    padding: 1%;
    width: 98%;
    height: auto;
}
#add_workshop_window_content table {
    position: relative;
    width: 100%;
    height: auto;
    float: left;
}
#add_workshop_window_content tbody {
    position: relative;
    width: auto;
    height: auto;
}
#add_workshop_window_content tr {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#add_workshop_window_content tr:nth-child(even){
    background-color: #d3d3d3;
}
#add_workshop_window_content th {
    position: relative;
    float: left;
    height: auto;
    text-align: left;
}
#add_workshop_window_content td {
    position: relative;
    float: left;
    height: auto;
}
#add_workshop_window_content th:nth-child(1), #add_workshop_window_content td:nth-child(1) {
    width: 3%;
}
#add_workshop_window_content th:nth-child(2), #add_workshop_window_content td:nth-child(2) {
    width: 30%;
}
#add_workshop_window_content th:nth-child(3), #add_workshop_window_content td:nth-child(3) {
    width: 15%;
}
#add_workshop_window_content th:nth-child(4), #add_workshop_window_content td:nth-child(4) {
    width: 15%;
}
#add_workshop_window_content th:nth-child(5), #add_workshop_window_content td:nth-child(5) {
    width: 35%;
}
#add_workshop_window_bottom {
    position: relative;
    float: left;
    padding: 1%;
    width: 98%;
    height: auto;
}
.back_to_options {
    position: relative;
    width: 25%;
    height: auto;
    padding: 1%;
    border: 1px solid #ffffff;
    background-color: #7d7d7d;
    color: #ffffff;
    font-size: 1vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
    float: right;
    right: 2%;
}
.back_to_options:hover {
    cursor: pointer;
    background-color: #d1d1d1;
}
#assign_student_window {
    display: none;
    position: absolute;
    float: left;
    width: 90%;
    height: auto;
    padding: 1%;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.8vw;
    box-shadow: 0px 1px 6px 0px #000000;
    
    z-index: 1000;
    left: 3%;
    top: 2%;
}
#assign_student_window_top {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: #d3d3d3;
    
    font-weight: bold;
    font-size: 1vw;
    margin-bottom: 1%;
    box-shadow: 0px 1px 6px 0px #000000;
}
#assign_student_window_top_header, #assign_student_window_top_taskbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.assign_student_window_close {
    position: relative;
    float: right;
    font-size: 1vw;
    margin-bottom: 2%;
}
.assign_student_window_close:hover {
    cursor: pointer;
}
#assign_student_window_upload, #assign_student_window_select {
    display: none;
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.8vw;
    box-shadow: 0px 1px 6px 0px #000000;
    
}
#assign_student_window_upload > span {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
}
#assign_student_window_upload > input {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
    padding: 0%;
}
#assign_student_window_upload_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 0.8vw;
}
#assign_student_window_upload_bottom {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_student_window_select_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_student_window_options {
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
}
.assign_student_window_option {
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    padding: 0.5%;
    border: 1px solid #000000;
    background-color: #7d7d7d;
    color: #ffffff;
    
}
.assign_student_window_option:hover {
    cursor: pointer;
    background-color: #d1d1d1;
}
.assign_student_window_option_selected {
    background-color: rgba(204,0,0,0.8);
    box-shadow: 0px 1px 5px 1px #000000;
}
#assign_student_window_select button, #assign_student_window_manually button, #assign_student_window_upload button {
    border: 1px solid #000000;
    background-color: #7d7d7d;
    color: #ffffff;
    
    font-size: 1vw;
}
#assign_student_window_select button:hover, #assign_student_window_manually button:hover, #assign_student_window_upload button:hover {
    cursor: pointer;
    background-color: #d3d3d3;
}
#assign_student_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.assign_student_window_title {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
    font-size: 1vw;
    font-weight: bold;
    color: #000000;
    margin-bottom: 2%;
}
#assign_student_window_manually {
    display: none;
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: #ffffff;
    color: #000000;
    font-size: 1vw;
    box-shadow: 0px 1px 6px 0px #000000;
    
}
#assign_student_window_manually_content, #assign_student_window_select_content {
    position: relative;
    float: left;
    width: 100%;
    max-height: 400px;
    overflow-y: auto;
}
#assign_student_window_manually_content > .manual_item {
    position: relative;
    float: left;
    padding: 1%;
    width: 98%;
    height: auto;
    background-color: #d3d3d3;
    margin-top: 0.5%;
    
}
.manual_item > ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    list-style: none;
    padding: 0;
    margin: 0;
}
.manual_item > ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.manual_item label {
    position: relative;
    float: left;
    width: 40%;
    height: auto;
}
.manual_item input {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
}
#assign_student_window_manually_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_student_window_select table {
    width: 100%;
}
#assign_student_window_select table tr:nth-child(even) {
    background-color: #d3d3d3;
}
#assign_student_window_select table button {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #ffffff;
    border: none;
    
}
.assign_student_select {
    width: auto !important;
    height: auto;
}
#assign_student_add {
    position: relative;
    float: left;
    width: 25%;
    height: auto;
    padding: 1%;
    margin-top: 1%;
    left: 0%;
    font-family: 'Roboto', sans-serif;
    background-color: #d3d3d3;
    color: #000000;
    border: 0;
}
#assign_student_add:hover {
    cursor: pointer;
    background-color: #d1d1d1;
    color: #7d7d7d;
}
#assign_student_cancel {
    left: 24%;
}
#assign_student_ok {
    right: 0%;
}
#quiz_window {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 80%;
    max-width: 80%;
    height: auto;
    min-height: 70vh;
    max-height: 70vh;
    padding: 0.5%;
    left: -90%;
    z-index: 999;
    background-color: #ffffff;
    opacity: 0;
    box-shadow: 0px 1px 3px -1px #000000;
    
    top: 1%;
    font-size: 0.7vw;
}
#quiz_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    padding: 0.5%;
    font-size: 0.7vw;
    color: #fff;
    background-color: #1d1d1d;
}
#quiz_window_top:hover, #quiz_window_top:active {
    cursor: move;
}
#quiz_window_top > span {
    font-size: 0.7vw;
}
#quiz_window_close {
    position: relative;
    float: right;
}
#quiz_window_close:hover {
    cursor: pointer;
}
#quiz_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    color: #000000;
    min-height: 16vh;
    max-height: 16vh;
}
#quiz_window_content > div {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-top: 0.5%;
}
#quiz_passing_score {
    position: relative;
    border-radius: 10px;
    border: 2px solid #d3d3d3;
    outline: 0;
    text-align: center;
    font-size: 1vw;
    font-family: 'Roboto', sans-serif;
}
#quiz_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 47vh;
    max-height: 47vh;
    color: #000000;
    overflow-x: hidden;
    overflow-y: auto;
}
#quiz_window_tasks {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 100%;
    max-width: 100%;
    margin-top: 0.5%;
    min-height: 4vh;
    max-height: 4vh;
}
#quiz_booster1, #quiz_booster2, #quiz_booster3 {
    width: auto;
    min-width: 8%;
    max-width: 8%;
    height: auto;
    font-size: 0.7vw;
    margin-bottom: 0.5%;
}
#quiz_window_bottom table tbody > tr:nth-child(even) {
    background-color: #e8e8e8;
}
#quiz_window_bottom div {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#quiz_window_bottom div button {
    position: relative;
    width: 10%;
    height: auto;
    padding: 0.5%;
}
#quiz_question_window {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    height: auto;
    min-width: 98%;
    max-width: 98%;
    min-height: 90vh;
    max-height: 90vh;
    background-color: #fff;
    color: #000;
    font-size: 1vw;
    z-index: 1000;
    padding: 1%;
}
#quiz_question_window_top:hover {
    cursor: move;
}
#quiz_question_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
    font-weight: 700;
    font-size: 1vw;
    margin-bottom: 0.2%;
    color: #000;
    letter-spacing: 2px;
    padding-bottom: 1%;
}
#quiz_question_window_top_header {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 2.5vh;
    max-height: 2.5vh;
}
#quiz_question_window_top_taskbar {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 3.5vh;
    max-height: 3.5vh;
}
#quiz_question_window_video {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
}
#quiz_question_window_options {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 3.5vh;
    max-height: 3.5vh;
}
.quiz_question_window_option {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 7%;
    max-width: 15%;
    padding: .5%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    background-color: rgba(0,0,0,.75);
    margin-right: 0.5%;
}
.quiz_question_window_option:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,.55);
}
.quiz_question_window_option_selected {
    background-color: #192a56;
    box-shadow: 0px 1px 3px -1px #000000;
}
#quiz_question_window_close {
    position: relative;
    float: right;
    width: auto;
    min-width: 2%;
    max-width: 2%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    text-align: right;
}
#quiz_question_window_close:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.7);
}
#quiz_question_window_content {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 82vh;
    max-height: 82vh;
}
#quiz_question_load {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 82vh;
    max-height: 82vh;
    padding: 1%;
    background-color: #ffffff;
    color: #000000;
}
#quiz_question_load_data {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 54vh;
    max-height: 82vh;
    overflow-x: hidden;
    overflow-y: auto;
}
#quiz_question_load_data_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding-bottom: 1%;
    font-size: 0.8vw;
}
#quiz_question_load_data_content {
    position: relative;
    float: left; 
    width: auto;
    min-width: 100%;
    max-height: 100%;
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
}
#quiz_question_load_data_content table {
    width: 100%;
    font-size: 0.7vw;
}
#quiz_question_load_data_content table tr:nth-child(even){
    background-color: #d3d3d3;
}
#quiz_question_load_data_bottom {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-top: 1%;
    opacity: 0;
}
#quiz_question_load_data_bottom button {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    padding: 0.5%;
    border: none;
    
    margin-left: 1%;
    font-size: 0.8vw;
    color: #ffffff;
    background-color: #1d1d1d;
}
#quiz_question_load_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
#quiz_question_load_add:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
#quiz_question_view {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 82vh;
    max-height: 82vh;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.7vw;
}
#quiz_question_view_data {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 61vh;
    overflow-x: hidden;
    overflow-y: auto;
}
#quiz_question_view_data table {
    width: auto;
    min-width: 100%;
    max-width: 100%;
}
#quiz_question_view_data table tr:nth-child(even) {
    background-color: #d3d3d3;
}
#quiz_question_view_data table button {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    border: none;
    
    outline: 0;
    background-color: transparent;
}
.quiz_question_view_info {
    color: rgba(0,0,0,1);   
}
.quiz_question_view_edit {
    color: rgba(0,128,0,1);
}
.quiz_question_view_edit:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.7) !important;
}
.quiz_question_view_edit:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7) !important;
}
.quiz_question_view_remove {
    color: rgba(204,0,0,1);
}
.quiz_question_view_remove:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7) !important;
}
#quiz_question_add {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 82vh;
    max-height: 82vh;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.7vw;
}
#quiz_question_add > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 1%;
    font-size: 0.7vw;
}
#quiz_question_add table {
    width: auto;
    min-width: 100%;
    max-width: 100%;
}
#quiz_question_add_top {
    font-weight: bold;
    background-color: #d3d3d3;
    box-shadow: 0px 1px 5px -1px #000000;
}
#quiz_question_add textarea {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    padding: 0.5%;
    border: 1px solid #d7d7d7;
    font-family: 'Roboto', sans-serif;
    resize: none;
    font-size: 0.8vw;
}
.normal_question {
    width: 10%;
}
.normal_question.ma {
    width: auto !important;
}
#quiz_question_add select {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    max-width: 20%;
    height: auto;
    padding: 0.5%;
    border: 1px solid #d7d7d7;
    font-size: 0.8vw;
}
#quiz_question_add input[type='file'] {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    padding: 0.5%;
}
#add_quiz_question_feedback {
    display: none;
}
#add_quiz_question_save, #add_content_question_save, #add_content_question_save_next {
    margin-left: 1%;
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 13%;
    max-width: 13%;
    padding: .5%;
    color: #fff;
    letter-spacing: 1.5px;
    font-family: 'roboto,sans-serif';
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    background-color: rgba(0,0,0,.75);
}
#add_content_question_save_next {
    background-color: rgb(0,125,255);
}
#add_content_question_save_next:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.3);
}
#add_content_question_save {
    background-color: rgb(0,128,0);
}
#add_content_question_save:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.3);
}
#add_quiz_question_save:hover, #add_content_question_save:hover {
    cursor: pointer;
    background-color: #d1d1d1;
}
#add_content_question_save {
    display: none;
}
.quiz_question_add_more {
    position: relative;
    float: right;
    width: 5%;
    height: auto;
    color: #ffffff;
    background-color: rgba(204,0,0);
    border: none;
    box-shadow: 0px 1px 3px -1px #000000;
}
.quiz_question_add_more:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
.add_quiz_question {
    float: left;
    left: 0;    
}
.save_quiz {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 10%;
    max-width: 10%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    background-color: rgba(0,128,0,1);
    margin-top: 0.5%;
}
.save_quiz:hover {
    cursor: pointer;
    opacity: 0.75;
}
.fa-star {
    color: #ffd700;
}
.star_weight {
    color: #d3d3d3;
}
.star_weight:hover {
    color: #ffd700;
}
.star_weight_selected {
    color: #ffd700 !important;
}
#syllabus_notes_window {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 90%;
    max-width: 90%;
    height: auto;
    padding: 0.5%;
    background-color: #fff;
    color: #000;
    font-size: .8vw;
    box-shadow: 0 1px 3px -1px #000;
    z-index: 1000;
    left: 4%;
    top: 5%;
    min-height: 47vh;
    max-height: 47vh;
}
#syllabus_notes_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    padding: 0.5%;
    background-color: #192a56;
    font-size: 0.8vw;
    margin-bottom: 0.5%;
    box-shadow: 0 1px 3px -1px #000;
    color: #ffffff;
}
#syllabus_notes_window_top > span {
    font-size: 0.7vw;
}
#syllabus_notes_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 43vh;
    max-height: 43vh;
}
#syllabus_notes_content_preview {
    position: relative;
    float: left;
    width: auto;
    min-width: 49%;
    max-width: 49%;
    height: auto;
    min-height: 43vh;
    max-height: 43vh;
    margin-right: 0.5%;
}
#syllabus_notes_info {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 43vh;
    max-height: 43vh;
}
#syllabus_notes_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    min-height: 41vh;
    max-height: 41vh;
    overflow-x: hidden;
    overflow-y: auto;
}
#syllabus_notes_window_content > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
#syllabus_notes_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 43vh;
    max-height: 43vh;
}
#syllabus_notes_window_content > label {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    background-color: #192a56;
    color: #fff;
    font-size: 0.7vw;
    padding-left: 1%;
    box-shadow: 0px 1px 3px -1px #000;
    margin-bottom: 1%;
    letter-spacing: 1.5px;
}
#syllabus_notes_window_content > input[type=text], #syllabus_notes_window_content > div > input[type=text] {
    position: relative;
    float: left;
    width: auto;
    min-width: 98.5%;
    max-width: 98.5%;
    height: auto;
    padding-left: 1%;
    font-size: 0.7vw;
    border: 1px solid rgba(0,0,0,0.1);
    padding: 0.5%;
    margin-bottom: 1%;
    outline: 0;
}
#syllabus_pre_questions > div {
    position: relative;
    float: left;
    width: auto;
    max-width: 3%;
    min-width: 3%;
}
.syllabus_pre_questions, .syllabus_pre_questions_answer, .syllabus_post_questions, .syllabus_post_questions_answer {
    width: 95% !important;
}
#syllabus_notes_window_content textarea {
    position: relative;
    float: left;
    width: 98%;
    left: 0%;
    margin-top: auto;
    height: auto;
    resize: none;
    outline: 0;
    font-family: 'Roboto', sans-serif;
    padding-bottom: 8%;
    margin-bottom: 1%;
}
#syllabus_notes_window_content > table, #syllabus_notes_window_content > table > tbody {
    width: 100%;
    height: auto;
}
#syllabus_notes_window_content > table > tbody > tr {
    width: 100%;
}
#syllabus_notes_window_content > table > tbody > tr > th:nth-child(1) {
    width: 80%;
}
#syllabus_notes_window_content > table > tbody > tr > th:nth-child(2) {
    width: 20%;
}
#syllabus_notes_window_content > table > tbody > tr > td:nth-child(1) {
    width: 80%;
}
#syllabus_notes_window_content > table > tbody > tr > td:nth-child(2) {
    width: 10%;
}
#syllabus_curr_question {
    font-size: 0.7vw;
}
.syllabus_curr_question, .syllabus_curr_question_answer, .syllabus_curr_question_time_stop {
    position: relative;
    float: left;
    width: auto;
    min-width: 98.5%;
    max-width: 98.5%;
    height: auto;
    padding-left: 1%;
    font-size: 0.7vw;
    border: 1px solid rgba(0,0,0,0.1);
    padding: 0.5%;
    margin-bottom: 1%;
    outline: 0;
}
.syllabus_curr_question_time_stop {
    width: 95%;
    text-align: center;
}
.syllabus_curr_question_time_stop_paste {
    display: none !important;
}
.syllabus_curr_question_time_stop_paste:hover {
    cursor: pointer;
    color: rgba(0,125,255,0.75);
}
.syllabus_notes_add_more {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    color: #ffffff;
    background-color: rgba(204,0,0);
    border: none;
    box-shadow: 0px 1px 3px -1px #000000;
    font-size: 0.5vw;
    margin-bottom: 0.5%;
}
.syllabus_notes_add_more:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
#syllabus_notes_cancel {
    position: relative;
    float: right;
    max-width: 8%;
    min-width: 8%;
    width: auto;
    height: auto;
    right: 0%;
    font-family: 'Roboto', sans-serif;
    font-size: 0.8vw;
    color: #fff;
    border: 0;
    box-shadow: 0px 1px 3px -1px #000;
    background-color: rgb(204,0,0);
}
#syllabus_notes_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
#syllabus_notes_ok {
    display: none;
    position: relative;
    float: right;
    max-width: 8%;
    min-width: 8%;
    width: auto;
    height: auto;
    right: 1%;
    font-family: 'Roboto', sans-serif;
    font-size: 0.8vw;
    color: #fff;
    border: 0;
    box-shadow: 0px 1px 3px -1px #000;
    background-color: rgb(0,128,0);
}
#syllabus_notes_ok:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
#play-pause {
    float: left;
    margin-top: 0.3%;
}
#volumebar {
    width: 10%;
    max-width: 10%;
    position: relative;
    float: right;
    margin-top: .6%;
    height: 40%;
    margin-right: 1%;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 30px;
}
#volume {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(255,255,255);
    border-radius: 15px;
}
#mute {
    position: relative;
    float: right!important;
    width: auto;
    height: auto;
    font-size: .9vw!important;
    margin-top: .6%;
    margin-right: .5%;
}
#seekbar {
    position: relative;
    width: 75%;
    max-width: 75%;
    height: 40%;
    float: left;
    margin-left: 1%;
    margin-top: .6%;
    background-color: rgba(255,255,255,.1);
    
}
#timebar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: rgba(245,0,0,.5);
    border-radius: 30px;
}
#play-pause, #mute {
    color: #ffffff;
    padding-left: 1%;
    font-size: 1.3vw;
}
#play-pause:hover, #mute:hover {
    cursor: pointer;
}
.pop_quiz {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 92vh;
    max-height: 92vh;
    background-color: #e7e7e7;
    padding: 1%;
}
.pop_quiz_heading {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    background-color: rgba(0,0,0,0.1);
    margin-bottom: 1%;
    padding: 1%;
}
.pop_quiz_image {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 45%;
    max-width: 45%;
    height: auto;
    min-height: 50vh;
    max-height: 50vh;
    margin-right: 1%;
}
.pop_quiz_image img {
    max-width: 100%;
    height: auto;
    max-height: 50vh;
}
.quiz_name {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    font-size: 1vw;
    color: #000000;
    text-align: left;
}
.quiz_num {
    position: relative;
    float: right;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    height: auto;
    font-size: 1vw;
    color: #000000;
    text-align: right;
    right: 0%;
}
.quiz_num > span {
    margin-right: 5%;
}
.question {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 49%;
    max-width: 49%;
    height: auto;
    min-height: 7vh;
    max-height: 15vh;
    text-align: left;
    margin-bottom: 1%;
    opacity: 0;
    font-weight: bold;
    font-size: 1vw;
    background-color: #192a56;
    color: #fff;
    padding: 1%;
}
.question_set {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 51%;
    max-width: 51%;
    height: auto;
    min-height: 45vh;
    max-height: 45vh;
    text-align: left;
    opacity: 0;
}
.answer {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 8vh;
    padding: 1%;
    text-align: left;
    background-color: #ffffff;
    margin-bottom: 1%;
    border: 1px solid rgba(0,128,255,1);
    box-shadow: 0px 1px 3px -1px #000000;
    font-size: 1vw;
}
.answer:hover {
    cursor: pointer;
    font-weight: bold;
    background-color: rgba(0,128,255,0.1);
}
.answer_selected {
    font-weight: bold;
    background-color: rgba(0,128,255,0.1) !important;
    border: 2px solid rgba(0,128,255,1);
}
.answer_correct {
    /*box-shadow: 0px 0px 5px 2px green;*/
   background-color: rgba(0,125,0,0.8);
   color: #fff;
   font-weight: bold;
}
.answer_incorrect {
    /*box-shadow: 0px 0px 5px 2px red;*/
   background-color: rgba(204,0,0,0.8) !important;
   color: #fff;
   font-weight: bold;
}
.answer_letter {
    position: relative;
    float: left;
    width: 1%;
    height: auto;
    margin-right: 1%;
}
.answer_text {
    position: relative;
    float: left;
    width: auto;
    min-width: 87%;
    max-width: 87%;
    height: auto;
    min-height: 2vh;
    max-height: 8vh;
}
.answer_text_status {
    position: relative;
    float: left;
    width: auto;
    min-width: 13%;
    max-width: 13%;
    height: auto;
    min-height: 2vh;
    max-height: 8vh;
    text-align: right;
    font-weight: bold;
}
.pop_quiz_score_results {
    position: relative;
    float: left;
    padding: 1%;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 15vh;
    max-height: 15vh;
    text-align: left;
    border-bottom: 1px solid #e7e7e7;
}
.pop_quiz_title {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.9vw;
    color: #000;
    padding: 0.5%;
    background-color: rgba(0,0,0,0.1);
}
.pop_quiz_score {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
    color: #000;
    font-size: 0.7vw;
    margin-top: 0.5%;
}
.pop_quiz_score_left, .pop_quiz_score_center, .pop_quiz_score_right {
    position: relative;
    float: left;
    display: inline-block;
    width: auto;
    min-width: 31%;
    max-width: 31%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
}
.pop_quiz_score_left > div:nth-child(1), .pop_quiz_score_center > div:nth-child(1), .pop_quiz_score_right > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-size: 0.7vw;
    font-weight: bold;
}
.pop_quiz_score_left > div:nth-child(2), .pop_quiz_score_center > div:nth-child(2), .pop_quiz_score_right > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-size: 0.7vw;
    font-weight: bold;
    margin-top: 2%;
}
.pop_quiz_pass {
    background-color: rgb(0,128,0);
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    text-align: center;
    font-size: 1vw;
    color: #ffffff;
    padding: 1%;
}
.pop_quiz_fail {
    background-color: rgb(204,0,0);
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    text-align: center;
    font-size: 1vw;
    color: #ffffff;
    padding: 1%;
}
.pop_quiz_review {
    position: relative;
    float: left;
    height: auto;
    top: 25%;
    left: 0%;
    padding: 0%;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    background-color: #ffffff;
}
.pop_quiz_time_spent {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    font-size: 0.7vw;
    font-weight: normal;
}
.pop_quiz_results {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    max-height: 71vh;
    text-align: left;
    overflow-y: auto;
    overflow-x: hidden;
    margin-top: 0.5%;
}
.pop_quiz_result {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 1%;
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: 0.5%;
}
.pop_quiz_result_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 70%;
    max-width: 70%;
    height: auto;
    
    padding: 0.5%;
}
.pop_quiz_result_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    padding: 0.5%;
    margin-left: 2%;
    background-color: rgba(0,0,0,0.01);
    border: 2px solid rgba(25,42,86,1);
    font-size: 0.7vw !important;
}
.pop_quiz_result_left > div, .pop_quiz_result_right > div {
    position: relative;
    display: inline-block;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 0.5%;
}
.pop_quiz_result_right > div ul {
    position: relative;
    float: left;
    font-size: 0.7vw;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    max-height: 10vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.answer_status_box {
    position: relative;
    float: right;
    width: 8%;
    height: auto;
    text-align: center;
    background-color: rgba(0,128,0,0.7);
    
    padding: 0.5%;
    font-size: 1vw;
}
.answer_status_box > i {
    color: #ffffff;
}
canvas:hover {
    cursor: crosshair;
}
#launch_syllabus_open_notes {
    position: relative;
    float: right;
    width: auto;
    min-width: 7%;
    max-width: 7%;
    height: auto;
    padding: .3%;
    margin-top: 0.3%;
    font-size: .6vw;
    color: #000;
    font-weight: bold;
    right: 1%;
    border: none;
    box-shadow: 0 1px 3px -1px #000;
}
#launch_syllabus_open_notes:hover {
    cursor: pointer;
    background-color: #d1d1d1;
}
#launch_syllabus_question {
    display: none;
    position: absolute;
    float: left;
    z-index: 2;
    width: 45%;
    height: auto;
    padding: 1%;
    background-color: rgba(255,255,255,1);
    top: 1%;
    left: -78%;
    box-shadow: 0px 0px 5px 1px #000000;
    text-align: left;
    font-size: 1.5vw;
    color: #000000;
    
    opacity: 0;
}
#launch_syllabus_question span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.launch_syllabus_question_line {
    position: relative;
    border-bottom: 1px solid #d1d1d1;
    width: 85%;
    height: auto;
    float: left;
    margin-left: 8%;
    margin-bottom: 0.5%;
    margin-top: 0.5%;
}
#launch_syllabus_question_continue {
    display: none;
    position: relative;
    color: #7d7d7d;
    font-size: 3vw;
    float: left;
    margin-left: 50%;
}
#launch_syllabus_question_continue:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
#ls-play-pause {
    float: left !important;
    margin-top: 0.3%;
}
#ls-volumebar {
    width: 10%;
    max-width: 10%;
    position: relative;
    float: right;
    margin-top: .6%;
    height: 40%;
    margin-right: 1%;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 30px;
}
#ls-volume {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(255,255,255);
    border-radius: 15px;
}
#ls-mute {
    position: relative;
    float: right !important;
    width: auto;
    height: auto;
    font-size: 0.9vw!important;
    margin-top: .6%;
    margin-right: 0.5%;
}
#ls-seekbar {
    position: relative;
    width: 75%;
    max-width: 75%;
    height: 40%;
    float: left;
    margin-left: 1%;
    margin-top: .6%;
    background-color: rgba(255,255,255,.1);
    
}
#ls-timebar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: rgba(245,0,0,.5);
    border-radius: 30px;
}
#ls-play-pause, #ls-mute {
    color: #ffffff;
    padding-left: 1%;
    font-size: 1.3vw;
}
#ls-play-pause:hover, #ls-mute:hover {
    cursor: pointer;
}
#launch_syllabus_window_task_container {
    position: relative;
    float: left;
    left: 1%;
    width: auto;
    height: auto;
    min-width: 7%;
    max-width: 7%;
    margin-top: .5%;
}
#launch_syllabus_window_task_container > i {
    position: relative;
    display: inline-block;
    color: #d3d3d3;
    font-size: 1vw;
    outline: 0;
    margin-right: 1%;
}
#launch_syllabus_window_back:hover {
    cursor: pointer;
    color: rgb(255, 212, 0);
}
#launch_syllabus_window_pause:hover {
    cursor: pointer;
    color: rgba(204,0,0,1);
}
#launch_syllabus_window_play:hover {
    cursor: pointer;
    color: rgba(0,125,255,0.8);
}
#launch_syllabus_window_replay {
    display: none;
    position: relative;
    color: #7d7d7d;
    font-size: 1vw;
    outline: 0;
}
#launch_syllabus_window_replay:hover {
    cursor: pointer;
    color: rgb(204,0,0,0.7);
}
#launch_syllabus_window_next:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
#syllabus_upload_doc_window {
    display: none;
    position: absolute;
    width: 50%;
    height: auto;
    padding: 1%;
    background-color: #ffffff;
    box-shadow: 0px 1px 5px -1px #000000;
    color: #7d7d7d;
    font-size: 1vw;
    left: 15%;
    top: 1%;
    z-index: 105;
}
#syllabus_upload_doc_window_top {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    
    background-color: #d3d3d3;
    box-shadow: 0px 1px 5px -1px #000000;
}
#syllabus_upload_doc_window_close {
    position: relative;
    float: right;
    right: 1%;
    font-size: 1vw;
}
#syllabus_upload_doc_window_close:hover {
    cursor: pointer;
}
#syllabus_upload_doc_window_content {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
#syllabus_upload_doc_window_content label {
    position: relative;
    float: left;
    width: 20%;
    height: auto;
    margin-top: 1%;
}
#syllabus_upload_doc_window_content input {
    position: relative;
    float: left;
    width: 70%;
    height: auto;
    padding: 1%;
    font-size: 0.8vw;
    margin-bottom: 1%;
}
#syllabus_upload_doc_window_bottom button {
    position: relative;
    float: right;
    width: 20%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    color: #000000;
    margin-left: 1%;
}

#syllabus_upload_doc_window_submit {
    position: relative;
    float: right;
    width: 20%;
    height: auto;
    padding: 1%;
    font-size: 1vw; 
}
#syllabus_upload_doc_window_bottom {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
#student_course_window {
    border: 2px solid rgba(255, 215, 0, 1);
    box-shadow: 0px 0px 5px 0px #000000;
}
.student_course_launch {
    position: relative;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: #007dff;
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.8vw;
    font-family: 'Roboto', sans-serif;
}
.student_course_launch:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.5);
}
.student_course_complete > i {
    color: rgb(0, 128, 0);
}
#oeg_course_window {
    box-shadow: 0px 0px 5px 0px #000000;
}
#oeg_course_window_title {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
    font-size: 1vw;
}
#oeg_course_window_title > i {
    position: relative;
    float: left;
    width: 3%;
    height: auto;
    margin-right: 1%;
}
#oeg_course_window_title > i > img {
    width: 100%;
    height: auto;
}
.oeg_course_launch {
    position: relative;
    width: 55%;
    height: auto;
    padding: 1%;
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.9vw;
    font-family: 'Roboto', sans-serif;
}
.oeg_course_launch:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.5);
}
@-webkit-keyframes notify {
    0% { -webkit-box-shadow: 0 0 3px rgb(0,128,0); }
    50% { -webkit-box-shadow: 0 0 10px rgb(0,128,0); }
    100% { -webkit-box-shadow: 0 0 3px rgb(0,128,0); }
}
@-moz-keyframes notify {
    0% { -moz-box-shadow: 0 0 3px rgb(0,128,0); }
    50% { -moz-box-shadow: 0 0 10px rgb(0,128,0); }
    100% { -moz-box-shadow: 0 0 3px rgb(0,128,0); }
}
@-o-keyframes notify {
    0% { box-shadow: 0 0 3px rgb(0,128,0); }
    50% { box-shadow: 0 0 10px rgb(0,128,0); }
    100% { box-shadow: 0 0 3px rgb(0,128,0); }
}
@keyframes notify {
    0% { box-shadow: 0 0 3px rgb(0,128,0); }
    50% { box-shadow: 0 0 10px rgb(0,128,0); }
    100% { box-shadow: 0 0 3px rgb(0,128,0); }
}
.share_notification {
    -webkit-animation: notify 2000ms infinite;
    -moz-animation: notify 2000ms infinite;
    -o-animation: notify 2000ms infinite;
    animation: notify 2000ms infinite;
}

.syllabus_textbox {
    position: absolute;
    float: left;
    left: 0%;
    width: auto;
    height: auto;
    top: 0%;
    padding: 0.5%;
    background-color: #ffffff;
    border: 1px solid #000000;
    z-index: 10;
}
.syllabus_textbox:hover {
    cursor: move;
}
.syllabus_textbox textarea {
    margin: 0px;
    height: 100px;
    width: 250px;
    font-size: 1.5vw;
}
.item_textarea {
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
.item_textarea span {
    font-size: 1vw; 
}
#company_logo {
    position: absolute;
    width: 100%;
    height: auto;
    bottom: 2%;
    text-align: center;
    background-color: #fff;
    box-shadow: 0 1px 1px -1px #000;
    
}
#company_logo img {
    position: relative;
    width: 50%;
    height: auto;
}
#edit_question_window {
    display: none;
    position: absolute;
    float: left;
    left: 4%;
    opacity: 0;
    width: auto;
    height: auto;
    padding: 1%;
    background-color: #fff;
    box-shadow: 0 1px 3px -1px #000;
    color: #000;
    z-index: 1001;
    min-width: 95%;
    max-width: 95%;
    min-height: 50vh;
    max-height: 90vh;
}
#edit_question_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    font-size: 0.7vw;
    color: #fff;
    margin-bottom: 0.5%;
    padding: 1%;
    background-color: #192a56;
}
.edit_question_window_close {
    position: relative;
    float: right;
    right: 1%;
    font-size: 0.8vw;
    color: #fff;
}
#edit_question_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 41vh;
    max-height: 79vh;
    font-size: 0.7vw;
    color: #000000;
}
#edit_question_window_content label {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-size: .7vw;
    font-weight: bold;
}
.edit_question_window_field {
    position: relative;
    float: left;
    width: auto;
    min-width: 73%;
    max-width: 73%;
    height: auto;
    font-size: .7vw;
    border: 1px solid #e7e7e7;
    margin-bottom: 1%;
    min-height: 4vh;
    max-height: 4vh;
}
.edit_question_window_field_correct {
    border: 1px solid rgb(0,128,0);
    box-shadow: 0px 1px 3px -1px rgb(0,128,0);
}
.edit_question_window_correct_radio, .edit_question_window_correct_checkbox {
    width: auto;
    float: right;
    width: 20px;
    height: 20px;
}
#edit_question_window_content_left {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    margin-right: 1%;
    min-width: 48%;
    max-width: 48%;
    min-height: 40vh;
    max-height: 78vh;
}
.edit_question_window_content_right {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 51%;
    max-width: 51%;
    min-height: 39vh;
    max-height: 77vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.edit_question_row {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    margin-bottom: 0.5%;
}
.edit_question_row_col1 {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    display: flex;
    justify-content: center; /* Horizontally center */
    align-items: center; /* Vertically center */
}
.edit_question_row_col2 {
    position: relative;
    float: left;
    width: auto;
    min-width: 85%;
    max-width: 85%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
}
.edit_question_window_content_right .edit_question_row_col2 {
    min-width: 75%;
    max-width: 75%;
}
.edit_question_row_col2 .edit_question_window_field {
    min-width: 98%;
    max-width: 98%;
}
.edit_question_row_col3 {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
}
.edit_question_row_col3 .edit_question_window_field {
    min-width: 20%;
    max-width: 20%;
}
#edit_so_question_window_content_right {
    display: none;
    min-height: 22vh;
    max-height: 22vh;
}
#edit_so_question_window_content_right > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.edit_so_question_answer_field {
    position: relative;
    float: left;
    width: auto;
    min-width: 91%;
    max-width: 91%;
    height: auto;
    font-size: .7vw;
    border: 1px solid #e7e7e7;
    margin-bottom: 1%;
    min-height: 2vh;
    max-height: 2vh;
}
.edit_so_question_order_field {
    position: relative;
    float: left;
    width: auto;
    min-width: 5%;
    max-width: 5%;
    height: auto;
    font-size: .7vw;
    border: 1px solid #e7e7e7;
    margin-left: 1%;
    margin-bottom: 1%;
}
#edit_question_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    color: #000000;
    margin-top: 1%;
}
.edit_question_window_button {
    margin-left: 1%;
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 7%;
    max-width: 9%;
    padding: .5%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'roboto,sans-serif';
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
}
.edit_question_window_button:hover {
    cursor: pointer;
}
#edit_question_window_submit {
    background-color: rgb(0,128,0);
}
#edit_question_window_submit:hover {
    background-color: rgba(0,128,0,0.7);
}
#edit_question_window_cancel {
    background-color: rgb(204,0,0);
}
#edit_question_window_cancel:hover {
    background-color: rgba(204,0,0,0.7);
}
#content_window_video_controls {
    display: none;
    position: absolute;
    z-index: 2;
    width: auto;
    min-width: 99.6%;
    max-width: 99.6%;
    height: 5.5%;
    bottom: 0%;
    background-color: rgba(0,0,0,0.1);
    margin-left: 0.1%;
}

.content_play-pause {
    float: left !important;
    margin-top: 0.8% !important;
    font-size: 1vw;
}
.content_volumebar {
    width: 6%;
    max-width: 6%;
    position: relative;
    float: right;
    margin-top: .9%;
    height: 40%;
    margin-right: .5%;
    border: 1px solid rgba(255,255,255,.3);
    
}
.content_volume {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(255,255,255);
    
}
.content_cc {
    position: relative;
    float: right !important;
    height: auto;
    width: auto;
    margin-top: .9%;
    font-size: .8vw;
    color: #fff;
}
.content_cc:hover {
    cursor: pointer;
    opacity: 0.80;
}
.content_cc_active {
    color: rgb(204,0,0) !important;
}
video::cue {
  opacity: 1;
  background-color: #000;
  font-size: 1vw !important;
}
.content_mute {
    position: relative;
    float: right!important;
    height: auto;
    width: auto;
    margin-top: .9%;
    margin-right: .5%;
    font-size: .8vw;
}
.content_fullscreen {
    position: relative;
    float: right!important;
    height: auto;
    width: auto;
    margin-top: 1%;
    font-size: .8vw;
    margin-right: 1%;
    color: #fff;
}
.content_fullscreen:hover {
    cursor: pointer;
}
.content_i_fullscreen {
    font-size: 1.5vw !important;
}
.content_seekbar {
    position: relative;
    width: 70%;
    max-width: 70%;
    height: 40%;
    float: left;
    margin-left: 1%;
    margin-top: 0.9%;
    background-color: rgba(255,255,255,.1);
    
}
.content_timebar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: rgba(245,0,0,0.5);
    
}
.content_play-pause, .content_mute {
    color: #ffffff;
    padding-left: 1%;
}
.content_play-pause:hover, .content_mute:hover {
    cursor: pointer;
}
.no_results {
    font-size: 1.1vw;
    width: auto;
    min-width: 71%;
    max-width: 71%;
    height: auto;
    padding: 15%;
    position: relative;
    float: left;
    text-align: center;
    letter-spacing: 1.5px;
}
#syllabus_window_group_rename_top, #syllabus_window_group_rename_bottom, #syllabus_window_subgroup_rename_top, #syllabus_window_subgroup_rename_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #7d7d7d;
}
#syllabus_window_group_rename input[type=text], #syllabus_window_subgroup_rename input[type=text]{
    width: 99%;
}
#syllabus_window_group_rename button, #syllabus_window_subgroup_rename button {
    position: relative;
    width: auto;
    height: auto;
    float: right;
    padding: 1%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    opacity: 1;
}
#syllabus_window_group_rename_cancel:hover, #syllabus_window_subgroup_rename_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
#syllabus_window_group_rename_submit:hover, #syllabus_window_subgroup_renamce_submit:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#course_window_group_rename_top, #course_window_group_rename_bottom, #course_window_subgroup_rename_top, #course_window_subgroup_rename_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #7d7d7d;
}
#course_window_group_rename input[type=text], #course_window_subgroup_rename input[type=text]{
    width: 99%;
}
#course_window_group_rename button, #course_window_subgroup_rename button {
    position: relative;
    width: auto;
    height: auto;
    float: right;
    padding: 1%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    opacity: 1;
}
#course_window_group_rename_cancel:hover, #course_window_subgroup_rename_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
#course_window_group_rename_submit:hover, #course_window_subgroup_rename_submit:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#course_window_group_add_top, #course_window_group_add_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #7d7d7d;
}
#course_window_group_add input[type=text]{
    width: 99%;
}
#course_window_group_add button {
    position: relative;
    width: auto;
    height: auto;
    float: right;
    padding: 1%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    opacity: 1;
}
#course_window_group_add_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
#course_window_group_add_submit:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#content_window_fullscreen {
    display: none;
    position: absolute;
    z-index: 1001;
    background-color: #000;
    width: 100%;
    height: 100%;
    text-align: center;
    top: 0%;
    opacity: 0;
    object-fit: fill;
}
.exit_fullscreen {
    position: relative;
    float: right !important;
    height: auto;
    width: auto;
    margin-top: 0.7%;
    font-size: .7vw;
    margin-right: 1%;
    color: black;
    border: none;
    background-color: #fff;
    border-radius: 15px;
    font-weight: bold;
}
.exit_fullscreen:hover {
    cursor: pointer;
}
#content_window_fullscreen_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: 100%;
}
#content_window_fullscreen video {
    width: 100%;
    min-height: 100vh;
    max-height: 100vh;
    object-fit: fill;
}
#content_window_fullscreen iframe {
    position: relative;
    width: 100%;
    height: 100%;
}
#content_window_fullscreen_video_controls {
    display: none;
    position: absolute;
    bottom: 0%;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    z-index: 2;
    height: auto;
    min-height: 3%;
    max-height: 5%;
    background-color: rgba(0,0,0,0.2);
}
#content_window_fullscreen-play-pause {
    float: left !important;
    margin-top: 0.8% !important;
    font-size: 1vw;
}
#content_window_fullscreen-volumebar {
    width: 6%;
    max-width: 6%;
    position: relative;
    float: right;
    margin-top: .9%;
    height: 40%;
    margin-right: .5%;
    border: 1px solid rgba(255,255,255,.3);
    
}
#content_window_fullscreen-volume {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(255,255,255);
    
}
#content_window_fullscreen-mute {
    position: relative;
    float: right!important;
    height: auto;
    width: auto;
    margin-top: .9%;
    margin-right: .5%;
    font-size: .8vw;
}
#content_window_fullscreen-seekbar {
    position: relative;
    width: 75%;
    max-width: 75%;
    height: 40%;
    float: left;
    margin-left: 1%;
    margin-top: 0.9%;
    background-color: rgba(255,255,255,.1);
    
}
#content_window_fullscreen-timebar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: rgba(245,0,0,0.5);
    
}
#content_window_fullscreen-timecode {
    position: relative;
    float: left;
    font-size: .6vw;
    padding: .5%;
    width: auto;
    height: auto;
    
    color: #fff;
    font-weight: bold;
    margin-top: .2%;
    margin-left: 0.2%;
}
#content_window_fullscreen-play-pause, #content_window_fullscreen-mute {
    color: #ffffff;
    padding-left: 1%;
}
#content_window_fullscreen-play-pause:hover, #content_window_fullscreen-mute:hover {
    cursor: pointer;
}
.category_new_video {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    width: 28%;
    height: auto;
}
.category_new_video img {
    width: 100%;
    height: auto;
    border-radius: 50px;
}
.result_new_video {
    position: absolute;
    right: -3%;
    bottom: -7%;
    z-index: 2;
    width: 8%;
    height: auto;
}
.result_new_video img {
    width: 100%;
    height: auto;
    border-radius: 50px;
}
@-webkit-keyframes glowing {
    0% { -webkit-box-shadow: 0 0 1px 0 rgb(204,0,0); }
    50% { -webkit-box-shadow: 0 0 15px 0 rgb(204,0,0); }
    100% { -webkit-box-shadow: 0 0 1px 0 rgb(204,0,0); }
}
@-moz-keyframes glowing {
    0% { -moz-box-shadow: 0 0 1px 0 rgb(204,0,0); }
    50% { -moz-box-shadow: 0 0 15px 0 rgb(204,0,0); }
    100% { -moz-box-shadow: 0 0 1px 0 rgb(204,0,0); }
}
@-o-keyframes glowing {
    0% { box-shadow: 0 0 1px 0 rgb(204,0,0); }
    50% { box-shadow: 0 0 15px 0 rgb(204,0,0); }
    100% { box-shadow: 0 0 1px 0 rgb(204,0,0); }
}
@keyframes glowing {
    0% { box-shadow: 0 0 1px 0 rgb(204,0,0); }
    50% { box-shadow: 0 0 15px 0 rgb(204,0,0); }
    100% { box-shadow: 0 0 1px 0 rgb(204,0,0); }
}
.new_video_glow {
    -webkit-animation: glowing 1500ms infinite;
    -moz-animation: glowing 1500ms infinite;
    -o-animation: glowing 1500ms infinite;
    animation: glowing 1500ms infinite;
}
#window_fullscreen, #interactive_fullscreen {
    display: none;
    position: relative;
    width: auto;
    height: auto;
    border: 1px solid #d3d3d3;
    background-color: #fff;
    color: #000;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
#window_fullscreen:hover, #interactive_fullscreen:hover {
    cursor: pointer;
    background-color: rgba(79,79,79,0.3);
}
.fa-info-circle:hover {
    color: #d7d7d7;
}
.link_popup_window {
    display: none;
    position: absolute;
    z-index: 1000;
    background-color: #fff;
    width: auto;
    height: auto;
    padding: 1%;
    box-shadow: 0px 1px 2px -1px #000;
    min-width: 20%;
    max-width: 30%;
    
}
.link_popup_close {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    text-align: right;
    color: #fff;
    background-color: #1d1d1d;
}
.link_popup_close > i {
    margin-right: 1%;
}
.link_popup_close > i:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.75);
}
.link_popup_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.link_popup_top > input[type='text'] {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 98%;
    max-width: 98%;
    margin-bottom: 2%;
    font-size: 0.7vw;
    padding: 1%;
    color: #000000;
    border: none;
    outline: 0;
    text-decoration: underline;
    background-color: #e7e7e7;
}
.link_popup_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.link_popup_bottom > span {
    opacity: 0;
    position: relative;
    float: left;
    width: auto;
    height: auto;
    color: rgb(0,128,0);
    font-size: 0.8vw;
    font-weight: bold;
}
.link_popup_copy {
    position: relative;
    width: auto;
    float: right;
    height: auto;
    padding: 1%;
    color: #ffffff;
    font-size: 0.7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    background-color: rgb(0,128,0);
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    opacity: 1;
}
.link_popup_copy:hover {
    cursor: pointer;
}
.student_playlist {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
.student_playlist > div {
    position: relative;
    height: auto;
    display: inline-block;
}
.playlist_handle {
    position: relative;
    float: left;
    margin-right: 5%;
    width: auto;
    height: auto;
    font-size: 0.8vw;
    color: rgb(0, 125, 255);
    padding: 2%;
    background-color: #d1d1d1;
    border: 1px solid rgba(0,0,0,0.1);
    text-align: center;
}
.playlist_handle:hover {
    cursor: move;
}
.student_playlist:hover {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}
.student_playlist:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}
.playlist_drag {
    color: #000000;
    text-align: center;
    max-width: 15%;
    font-size: 0.8vw;
    background-color: #ffffff;
    border: 1px dashed rgba(0,125,255,0.7);
    padding: 1%;
    
}
.playlist_drag i {
    font-size: 1.5vw;
    color: rgb(0,125,255);
}
.playlist_drop {
    background-color: rgba(0,125,255,0.7);
    color: #ffffff;
}
.playlist_name:hover, .playlist_name:active {
    font-weight: bold;
    color: rgb(0,125,255);
}
.student_playlist_sort {
    border: 2px dashed rgb(79,79,79);
    background-color: rgba(0,125,255,0.3);
} 
.student_playlist_row {
    width: 4.5%;
}
.student_playlist_name {
    width: 22.5%;
}
.student_playlist_descr {
    width: 34%;
}
.student_playlist_author {
    width: 11%;
}
.student_playlist_date {
    width: 6%;
    font-size: 0.8vw !important;
}
.student_playlist_play_button {
    width: 11%;
    text-align: center;
}
.student_playlist_edit_section {
    width: 6%;
    text-align: center;
}
.student_playlist_remove_section {
    width: 5%;  
    text-align: center;
}
.student_playlist_play {
    position: relative;
    width: 60%;
    height: auto;
    padding: 1%;
    background-color: rgb(0, 125, 255);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
}
.student_playlist_play:hover {
    cursor: pointer;
    background-color: rgba(0, 125, 255, 0.75);
}
.user_window_taskbar, .user_window_group_taskbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-top: 1%;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.user_window_taskbar button, .user_window_group_taskbar button {
    position: relative;
    width: auto;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
.user_window_taskbar button:hover, .user_window_group_taskbar button:hover {
    cursor: pointer;
}
#user_playlist_window_group_new:hover, #user_playlist_window_group_add:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.65);
}
#user_playlist_window_group_rename:hover, #user_playlist_window_subgroup_rename:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#user_playlist_window_group_delete:hover, #user_playlist_window_subgroup_delete:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}

#playlist_window_group_add_top, #playlist_window_group_add_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #7d7d7d;
}
#playlist_window_group_add input[type=text]{
    width: 99%;
}
#playlist_window_group_add button {
    position: relative;
    width: auto;
    height: auto;
    float: right;
    padding: 1%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    opacity: 1;
}
#playlist_window_group_add_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
#playlist_window_group_add_submit:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
.user_window_group_taskbar {
    display: none;
}
.user_window_subgroup_taskbar {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgb(0,0,0,0.1);
}
.user_window .user_window_group_item, .user_window .user_window_subgroup_item {
    position: relative;
    display: inline-block;
    width: 15%;
    height: auto;
    text-align: center;
    color: rgba(0,0,0,0.8);
}
.user_window .user_window_group_item:hover, .user_window .user_window_subgroup_item:hover {
    cursor: pointer;
    color: rgba(125, 125, 125, 0.5);
}
.user_window_group_item_selected {
    font-weight: bold;
}
.user_window .user_window_group_item_back, .user_window .user_window_subgroup_item_back {
    display: none;
    opacity: 0;
    border-right: 2px solid rgba(0,0,0,0.1);
}
.user_window .user_window_group_item_back:hover, .user_window .user_window_subgroup_item_back:hover {
    color: rgba(0,0,0,1);
}
#user_playlist_window_group_item_back, .user_playlist_window_group_item {
    color: rgba(0,125,255,0.5) !important;
}
#user_playlist_window_group_item_back:hover, .user_playlist_window_group_item:hover {
    color: rgba(0,125,255,1) !important;
}
#playlist_window_subgroup_add_top, #playlist_window_subgroup_add_bottom, #playlist_window_group_rename_top, #playlist_window_group_rename_bottom, #playlist_window_subgroup_rename_top, #playlist_window_subgroup_rename_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #7d7d7d;
}
#playlist_window_group_rename input[type=text], #playlist_window_subgroup_rename input[type=text]{
    width: 99%;
}
#playlist_window_group_rename button, #playlist_window_subgroup_rename button {
    position: relative;
    width: auto;
    height: auto;
    float: right;
    padding: 1%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    opacity: 1;
}
#playlist_window_group_rename_cancel:hover, #playlist_window_subgroup_rename_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
#playlist_window_group_rename_submit:hover, #playlist_window_subgroup_rename_submit:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#playlist_window_subgroup_add_top, #playlist_window_subgroup_add_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #7d7d7d;
}
#playlist_window_subgroup_add input[type=text]{
    width: 99%;
}
#playlist_window_subgroup_add button {
    position: relative;
    width: auto;
    height: auto;
    float: right;
    padding: 1%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    opacity: 1;
}
#playlist_window_subgroup_add_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
#playlist_window_subgroup_add_submit:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#user_playlist_window_group_top, #user_playlist_window_group_subgroup, #user_playlist_window_group_taskbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_playlist_window_group_subgroup {
    display: none;
    border-top: 1px solid rgba(0,0,0,0.1);
    padding-top: 1%;
}
#user_playlist_window_group_taskbar {
    display: none;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#user_playlist_window_subgroup_taskbar button, #user_playlist_window_group_taskbar button {
    position: relative;
    width: auto;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
#user_playlist_window_subgroup_taskbar {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgb(0,0,0,0.1);
}
#user_playlist_window_subgroup_top {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.user_playlist_window_subgroup_item, #user_playlist_window_subgroup_item_back {
    color: rgba(0,125,255,0.8) !important;
}
.user_playlist_window_subgroup_item:hover, #user_playlist_window_subgroup_item_back:hover {
    cursor: pointer;
    color: rgba(0,125,255,0.5) !important;
}
#user_playlist_window_group_items {
    position: relative;
    display: inline-block;
    width: 84%;
    height: auto;
}
#pp-play-pause {
    float: left !important;
    margin-top: 0.3%;
}
#pp-volumebar {
    width: 10%;
    max-width: 10%;
    position: relative;
    float: right;
    margin-top: .6%;
    height: 40%;
    margin-right: 1%;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 30px;
}
#pp-volume {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(255,255,255);
    border-radius: 15px;
}
#pp-mute {
    position: relative;
    float: right !important;
    width: auto;
    height: auto;
    font-size: 0.9vw!important;
    margin-top: .6%;
    margin-right: 0.5%;
}
#pp-seekbar {
    position: relative;
    width: 75%;
    max-width: 75%;
    height: 40%;
    float: left;
    margin-left: 1%;
    margin-top: .6%;
    background-color: rgba(255,255,255,.1);
    
}
#pp-timebar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: rgba(245,0,0,.5);
    border-radius: 30px;
}
#pp-play-pause, #pp-mute {
    color: #ffffff;
    padding-left: 1%;
    font-size: 1.3vw;
}
#pp-play-pause:hover, #pp-mute:hover {
    cursor: pointer;
}
.user_window .fas.fa-edit, .user_window .fas.fa-trash-alt {
    font-size: 1.5vw;
}
.user_window .fas.fa-edit {
    color: rgb(0,128,0);
}
.user_window .fas.fa-edit:hover {
    color: rgba(0,128,0,0.75);
}
.user_window .fas.fa-trash-alt {
    color: rgb(204,0,0);
}
.user_window .fas.fa-trash-alt:hover {
    color: rgba(204,0,0,0.75);
}
#playlist_window .fas.fa-trash-alt, #syllabus_window .fas.fa-trash-alt, #course_window .fas.fa-trash-alt {
    font-size: 1.5vw;
    color: rgb(204,0,0);
}
#playlist_window .fas.fa-trash-alt:hover, #syllabus_window .fas.fa-trash-alt:hover, #course_window .fas.fa-trash-alt:hover {
    color: rgba(204,0,0,0.75);  
}
#support_section {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
    padding: 1%;
    font-size: 0.7vw;
    background-color: #1d1d1dBF;
    border: 1px solid #1d1d1dBF;
    margin-top: 1%;
    box-shadow: 0px 0px 2px -1px #000000;
}
#support_section ul {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 16vh;
    max-height: 16vh;
    margin: 0;
    padding: 1%;
    list-style: none;
}
#support_section ul > li {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 1%;
}
#support_section i {
    color: #192a56;
}
i.fa-bug {
    color: rgb(204,0,0) !important;
}
#report_issue:hover {
    cursor: pointer;
    text-decoration: underline;
}
#support_section a {
    color: #192a56;
    text-decoration: underline;
}
.content_player-timecode {
    position: relative;
    float: left;
    font-size: .6vw;
    padding: .5%;
    width: auto;
    height: auto;
    
    color: #fff;
    font-weight: bold;
    margin-top: .2%;
    margin-left: 0.2%;
}
.content_timecode {
    position: absolute;
    float: right;
    font-size: 0.6vw;
    font-weight: bold;
    right: 1%;
    bottom: 95%;
    padding: 0.5%;
    width: auto;
    height: auto;
    border: 1px solid #ffffff;
    
    color: #000000;
    background-color: rgb(255,255,255);
}
.content_timecode:hover {
    cursor: pointer;
}
.content_timecode:active {
    background-color: #ffffff;
    color: #000000;
    cursor: pointer;
}
.content_timecode div {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: rgba(0,128,0,0.5);
    top: 0;
    left: 0;
    text-align: center;
    
    opacity: 0;
}
.content_timecode div > span {
    position: relative;
    top: 23%;
}
#content_fullscreen_exit {
    display: none;
    position: relative;
    width: auto;
    height: auto;
    border: 1px solid #d3d3d3;
    background-color: #fff;
    color: #000;
    font-size: 0.9vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
#content_fullscreen_exit:hover {
    cursor: pointer;
    background-color: rgba(79,79,79,0.3);
}
#issue_report_window {
    display: none;
    position: absolute;
    padding: 1%;
    margin: 0 auto;
    width: auto;
    min-width: 55%;
    max-width: 55%;
    height: auto;
    min-height: 35vh;
    max-height: 35vh;
    z-index: 100;
    font-size: 0.8vw;
    color: #000000;
    background-color: #ffffff;
    
    box-shadow: 0px 1px 5px 0px #000000;
    top: 10%;
    left: 18%;
}
#issue_report_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 1%;
}
#issue_report_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 24vh;
    max-height: 24vh;
    padding: 1%;
}
#issue_report_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    padding: 1%;
}
#issue_report_window_top {
    background-color: rgba(0,0,0,0.1);
}
#issue_report_window_content label {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
}
#issue_report_window_content input[type=text], #issue_report_window_content textarea {
    position: relative;
    float: left;
    width: auto;
    min-width: 70%;
    max-width: 70%;
    height: auto;
    margin-bottom: 2%;
}
#issue_report_window_content textarea {
    min-height: 12vh;
    resize: none;
}
#issue_report_submit {
    position: relative;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    padding: 0.5%;
    float: right;
    color: #ffffff;
    font-size: 0.8vw;
    background-color: #192a56;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 2px 0px #000;
    transition: all .5s;
    margin-right: 1%;
}
#issue_report_submit:hover {
    cursor: pointer;
    background-color: #192a5699;
}
#issue_report_window_close {
    position: relative;
    float: right;
}
#issue_report_window_close:hover {
    cursor: pointer;
    color: #ffffff;
}
.kl_help {
    float: right !important;
    font-size: 1vw !important;
    margin-top: 1% !important;
}
.ui-slider .ui-slider-handle {
    background-color: #7d7d7d !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    background: none !important;
    background-color: #7d7d7d !important;
}
#user_sub_syllabus_groups, #user_sub_course_groups, #user_sub_playlist_groups {
    position: relative;
    float: left;
    width: 100%;
    max-height: 300px;
    overflow-y: hidden;
    overflow-x: auto;
    white-space: nowrap;
}
#user_syllabus_window_group_top::-webkit-scrollbar, #user_course_window_group_top::-webkit-scrollbar, #user_sub_syllabus_groups::-webkit-scrollbar, #user_sub_course_groups::-webkit-scrollbar, #user_playlist_window_group_top::-webkit-scrollbar, #user_sub_playlist_groups::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
#user_syllabus_window_group_top::-webkit-scrollbar-track, #user_course_window_group_top::-webkit-scrollbar-track, #user_sub_syllabus_groups::-webkit-scrollbar-track, #user_sub_course_groups::-webkit-scrollbar-track, #user_playlist_window_group_top::-webkit-scrollbar-track, #user_sub_playlist_groups::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
#user_syllabus_window_group_top::-webkit-scrollbar, #user_course_window_group_top::-webkit-scrollbar, #user_sub_syllabus_groups::-webkit-scrollbar-thumb, #user_sub_course_groups::-webkit-scrollbar-thumb,#user_playlist_window_group_top::-webkit-scrollbar-thumb, #user_sub_playlist_groups::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
#user_syllabus_window_group_top, #user_course_window_group_top, #user_playlist_window_group_top {
    overflow-y: hidden;
    overflow-x: auto;
    white-space: nowrap;
}
#user_syllabus_window_group_item_back {
    position: relative;
    width: 10% !important;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: rgba(0,128,0,0.5);
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    margin-bottom: 1%;
}
#user_course_window_group_item_back {
    position: relative;
    width: 10% !important;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: rgba(0,0,0,0.5);
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    margin-bottom: 1%;
}
#user_playlist_window_group_item_back {
    position: relative;
    width: 10% !important;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: rgba(0,125,255,0.5);
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    margin-bottom: 1%;
}
#user_lessonplan_window_group_item_back {
    position: relative;
    width: 10% !important;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: rgba(241, 151, 13, 0.5);
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    margin-bottom: 1%;
}
#user_assessment_window_group_item_back {
    position: relative;
    width: 10% !important;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: rgba(122, 15, 175,0.5);
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    margin-bottom: 1%;
}
.syllabus_directory_count {
    position: absolute;
    float: right;
    right: 30%;
    top: 45%;
    background-color: rgb(0,128,0);
    color: #ffffff;
    border-radius: 51px;
    font-size: 1vw;
    padding: 1%;
    width: 10%;
}
.course_directory_count {
    position: absolute;
    float: right;
    right: 30%;
    top: 45%;
    background-color: rgb(0,0,0);
    color: #ffffff;
    border-radius: 51px;
    font-size: 1vw;
    padding: 1%;
    width: 10%;
}
.playlist_directory_count {
    position: absolute;
    float: right;
    right: 30%;
    top: 45%;
    background-color: rgb(0,125,255);
    color: #ffffff;
    border-radius: 51px;
    font-size: 1vw;
    padding: 1%;
    width: 10%;
}
.lessonplan_directory_count {
    position: absolute;
    float: right;
    right: 30%;
    top: 45%;
    background-color: rgb(241, 151, 13);
    color: #ffffff;
    border-radius: 51px;
    font-size: 1vw;
    padding: 1%;
    width: 10%;
}
.assessment_directory_count {
    position: absolute;
    float: right;
    right: 30%;
    top: 45%;
    background-color: rgb(122, 15, 175);
    color: #ffffff;
    border-radius: 51px;
    font-size: 1vw;
    padding: 1%;
    width: 10%;
}
.directory_active, .sub_directory_active {
    background-color: rgba(0,0,0,0.2);
    font-weight: bold;
}
#user_playlist_window #user_playlist_window_group_item_back {
    display: none;
    opacity: 0;
    border-right: 2px solid rgba(0,0,0,0.1);
}
.add_to_window {
    display: none;
    position: absolute;
    z-index: 1001;
    background-color: #ffffff;
    min-width: 80%;
    height: auto;
    padding: 1%;
    color: #000000;
    left: 0%;
    top: 0%;
    border: 1px solid #000000;
    border-radius: 3px;
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.95vw;
}
.add_to_window_top, .add_to_window_taskbar, .add_to_window_content, .add_to_window_bottom {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
.add_to_window_taskbar > button {
    float: left !important;
}
.add_to_window_close {
    position: relative;
    float: right;
}
.add_to_window_close:hover {
    cursor: pointer;
}
.add_to_window_col1, .add_to_window_col2, .add_to_window_col3, .add_to_window_col4 {
    position: relative;
    float: left;
    display: inline-block;
    width: 24.9%;
    height: auto;
    min-height: 200px;
    max-height: 200px;
    border-right: 1px solid #d3d3d3;
    overflow-x: hidden;
    overflow-y: auto;
}
.add_to_window_col1 {
    float: left;
}
.add_to_window_content ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
    list-style: none;
}
#add_to_playlist_window_top, #add_to_playlist, #add_to_new_playlist {
    color: #ffffff !important;
    background-color: rgb(0,125,255);
}
#add_to_syllabus_window_top, #add_to_syllabus, #add_to_new_syllabus {
    color: #ffffff !important;
    background-color: rgb(0,128,0);
}
#add_to_course_window_top, #add_to_course, #add_to_new_course {
    color: #ffffff !important;
    background-color: rgb(0,0,0);
}
#add_to_playlist_window_col3 li {
    font-weight: bold;
}
#add_to_playlist_window .fa-folder, #add_to_playlist_window .fa-th-large {
    color: rgb(0,125,255);
}
#add_to_playlist_window_most_recent {
    position: relative;
    float: left;
    height: auto;
    margin-bottom: 1%;
    padding: 1%;
    width: 98%;
    box-shadow: 0px 1px 5px -1px #000000;
}
#add_to_playlist_window_playlists {
    position: relative;
    float: left;
    height: auto;
    margin-bottom: 1%;
    padding: 1%;
    width: 98%;
    box-shadow: 0px 1px 5px -1px #000000;
    max-height: 100px;
    overflow-y: auto;
}
#add_to_playlist_window_most_recent span:nth-child(1), #add_to_playlist_window_playlists span:nth-child(1) {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: .5%;
    background-color: #000;
    color: #fff;
    text-align: center;
    font-size: 1vw;
}
#add_to_syllabus_window_col3 li {
    font-weight: bold;
}
#add_to_syllabus_window .fa-folder, #add_to_syllabus_window .fa-th-large {
    color: rgb(0,128,0);
}
#add_to_syllabus_window_most_recent {
    position: relative;
    float: left;
    height: auto;
    margin-bottom: 1%;
    padding: 1%;
    width: 98%;
    box-shadow: 0px 1px 5px -1px #000000;
}
#add_to_syllabus_window_syllabuses {
    position: relative;
    float: left;
    height: auto;
    margin-bottom: 1%;
    padding: 1%;
    width: 98%;
    box-shadow: 0px 1px 5px -1px #000000;
    max-height: 100px;
    overflow-y: auto;
}
#add_to_syllabus_window_most_recent span:nth-child(1), #add_to_syllabus_window_syllabuses span:nth-child(1) {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: .5%;
    background-color: #000;
    color: #fff;
    text-align: center;
    font-size: 1vw;
}
#add_to_course_window_col3 li, #add_to_course_window_col4 li {
    font-weight: bold;
}
#add_to_course_window .fa-folder, #add_to_course_window .fa-th-large {
    color: rgb(0,0,0);
}
#add_to_course_window_most_recent {
    position: relative;
    float: left;
    height: auto;
    margin-bottom: 1%;
    padding: 1%;
    width: 98%;
    box-shadow: 0px 1px 5px -1px #000000;
}
#add_to_course_window_courses {
    position: relative;
    float: left;
    height: auto;
    margin-bottom: 1%;
    padding: 1%;
    width: 98%;
    box-shadow: 0px 1px 5px -1px #000000;
    max-height: 100px;
    overflow-y: auto;
}
#add_to_course_window_most_recent span:nth-child(1), #add_to_course_window_courses span:nth-child(1) {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: .5%;
    background-color: #000;
    color: #fff;
    text-align: center;
    font-size: 1vw;
}
.add_to_window_button {
    position: relative;
    width: 20%;
    height: auto;
    padding: 1%;
    float: right;
    color: #ffffff;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
.add_to_window_button:hover {
    cursor: pointer;
}
.add_to_window_col_heading {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 0.5%;
    background-color: #d3d3d3;
    font-weight: bold;
}
.add_to_window_heading1 {
    position: relative;
    float: left;
    width: 54%;
    height: auto;
    text-align: center;
}
.add_to_window_heading2 {
    position: relative;
    float: left;
    width: 20%;
    height: auto;
    text-align: center;
}
#lessonplan_window {
    display: none;
    position: absolute;
    float: left;
    width: 96%;
    height: auto;
    padding: 1%;
    left: -90%;
    z-index: 101;
    background-color: #ffffff;
    
    opacity: 0;
    box-shadow: 0px 1px 1px 0px #000000;
}
#lessonplan_window > span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1.3vw;
    color: #7d7d7d;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
#lessonplan_window > span:hover {
    cursor: move;
}
#lessonplan_window > span > i {
    color: rgb(241, 151, 13);
}
.lessonplan_window_toolbar {
    position: relative;
    display: inline-block;
    width: 64%;
    height: auto;
    left: 2%;
    margin-bottom: 0.2%;
}
.lessonplan_window_toolbar button {
    position: relative;
    display: inline-block;
    width: auto;
    max-width: 15%;
    height: auto;
    padding: 0.5%;
    border: 1px solid #ffffff;
    background-color: rgb(241, 151, 13);
    color: #ffffff;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
.lessonplan_window_toolbar button:hover {
    cursor: pointer;
    background-color: #7d7d7d;
}
#lessonplan_window_info {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    margin-bottom: 1%;
}
#lessonplan_window_heading {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    color: #7d7d7d;
    background-color: rgba(0,0,0,0.1);
    
}
#lessonplan_window_heading > ul {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 1vw;
}
#lessonplan_window_heading > ul > li {
    position: relative;
    display: inline-block;
    height: auto;
}
#lessonplan_window_heading > ul > li:nth-child(1){
    width: 10%;
    margin-left: 2%;
}
#lessonplan_window_heading > ul > li:nth-child(2){
    width: 4%;
    margin-left: 11%;
}
#lessonplan_window_heading > ul > li:nth-child(3){
    width: 21%;
    margin-left: 3%;
}
#lessonplan_window_heading > ul > li:nth-child(4){
    width: 4%;
    margin-left: 4%;
}
#lessonplan_window_heading > ul > li:nth-child(5){
    width: 11%;
    margin-left: 3%;
}
#lessonplan_window_heading > ul > li:nth-child(6){
    width: 10%;
    margin-left: 3%;
}
#lessonplan_window_heading > ul > li:nth-child(7){
    width: 5%;
    margin-left: 4%;
}
.lessonplan_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: 500px;
    border: 1px solid #777777;
    
    background-color: #ffffff;
    overflow: auto;
    color: #7d7d7d;
}
.lessonplan_window_content > li {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.3);
    background-color: #ffffff;
    list-style: none;
}
.lessonplan_window_content > li > div {
    position: relative;
    display: inline-block;
    height: auto;
    font-size: 1vw;
}
.lessonplan_window_content > li:hover {
    cursor: move;
    background-color: rgba(0,0,0,0.1);
}
.lessonplan_item_play_active {
    background-color: rgba(0,128,0,0.3);
}
.lessonplan_item_remove_active {
    background-color: rgba(204,0,0,0.5);
}
.lessonplan_result_cover {
    float: left;
    width: 10%;
    height: auto;
    padding: 1%;
}
.lessonplan_result_cover i {
    position: absolute;
    z-index: 2;
    font-size: 3vw;
    left: 35%;
    top: 23%;
    color: rgba(255,255,255,0.5);
}
.lessonplan_result_cover i:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.7);
}
.lessonplan_result_cover .cover_doc_view, .lessonplan_result_cover .cover_pp_view {
    position: absolute;
    z-index: 2;
    font-size: 3vw;
    left: 35%;
    top: 23%;
    color: rgba(255,255,255,0.5);
}
.lessonplan_result_cover img {
    width: 100%;
    height: auto;
}
.lessonplan_result_name {
    width: 20%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.lessonplan_result_name span:last-child {
    color: #777777;
}
.lessonplan_result_type {
    width: 7.5%;
}
.lessonplan_result_descr {
    width: 26%;
}
.lessonplan_result_sort {
    width: 3%;
    text-align: center;
}
.lessonplan_result_sort input {
    width: 100%;
    text-align: center;
    font-family: 'Roboto', sans-serif;
}
.lessonplan_result_location {
    width: 16%;
    margin-left: 3%;
}
.lessonplan_result_origin {
    width: 10%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.lessonplan_result_questions button {
    position: relative;
    padding: 1%;
    width: 100%;
    height: auto;
    background-color: rgb(204,0,0);
    color: #ffffff;
    font-size: 1vw;
    border: none;
    
}
.lessonplan_result_questions button:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.5);
}
.lessonplan_result_delete {
    width: 5%;
    margin-left: 2%;
    text-align: center;
    font-size: 1vw;
    color: red;
}
.lessonplan_window_minimize {
    position: relative;
    float: right;
    right: 3%;
    font-size: 1vw;
}
.lessonplan_window_minimize:hover {
    cursor: pointer;
    color: rgb(0,0,0);
}
.lessonplan_window_close {
    position: relative;
    float: right;
    font-size: 1vw;
}
.lessonplan_window_close:hover {
    cursor: pointer;
    color: rgb(0,0,0);
}
.lessonplan_quiz:hover {
    cursor: pointer;
}
.lessonplan_remove:hover {
    cursor: pointer;
    font-weight: bold;
}
.user_lessonplan {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
.user_lessonplan:hover {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}
.user_lessonplan:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}
.lessonplan_drag {
    color: #000000;
    text-align: center;
    max-width: 15%;
    font-size: 0.8vw;
    background-color: #ffffff;
    border: 1px dashed rgba(0,0,0.7);
    padding: 1%;
    
}
.lessonplan_drag i {
    font-size: 1.5vw;
    color: rgb(0,0,0);
}
.lessonplan_drop {
    background-color: rgba(0,0,0,0.7);
    color: #ffffff;
}
.lessonplan_handle {
    position: relative;
    margin-right: 5%;
    width: auto;
    height: auto;
    font-size: 0.8vw;
    color: rgb(0,0,0);
    padding: 2%;
    background-color: #d1d1d1;
    border: 1px solid rgba(0,0,0,0.1);
    text-align: center;
}
.lessonplan_handle:hover {
    cursor: move;
}
.lessonplan_name:hover, .lessonplan_name:active {
    font-weight: bold;
    color: rgb(0,0,0);
}
.user_lessonplan_sort {
    border: 2px dashed rgb(79,79,79);
    background-color: rgba(0,0,0,0.3);
}
.user_lessonplan div {
    position: relative;
    height: auto;
    display: inline-block;
}
.user_lessonplan_row {
    width: 5.5%;
    text-align: left;
}
.user_lessonplan_name {
    width: 27%;
}
.user_lessonplan_descr {
    width: 40%;    
}
.user_lessonplan_author {
    width: 13.5%;
}
.user_lessonplan_edit_section, .user_lessonplan_remove_section {
    width: 7%;
    text-align: center;
}
#add_to_options-lessonplans > i.fa-th-large, .new_lessonplan > i.fa-th-large, .lessonplan > i.fa-th-large, .existing_lessonplan > i.fa-th-large {
    color: rgb(241, 151, 13);
}
#assignment_window, #assignment_student_window, #assignment_content_window, #assignment_content_update_window {
    display: none;
    position: absolute;
    float: left;
    width: 96%;
    height: auto;
    padding: 1%;
    left: -90%;
    z-index: 101;
    background-color: #ffffff;
    
    opacity: 0;
    box-shadow: 0px 1px 1px 0px #000000;
    color: #000;
}
#assignment_content_update_window {
    z-index: 1001;
}
#assignment_window > span, #assignment_student_window > span, #assignment_content_window > span, #assignment_content_update_window > span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1vw;
    color: #7d7d7d;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
#assignment_window > span:hover {
    cursor: move;
}
#assignment_window > span > i {
    color: rgba(0,0,0, 0.5);
}
#assignment_window > span img, #assignment_student_window > span img, #assignment_content_window > span img, #assignment_content_window > span img {
    position: relative;
    float: left;
    width: 2%;
    height: auto;
    margin-right: 1%;
}
.assignment_window_toolbar {
    position: relative;
    display: inline-block;
    width: 64%;
    height: auto;
    left: 2%;
    margin-bottom: 0.2%;
}
.assignment_window_toolbar button {
    position: relative;
    display: inline-block;
    width: auto;
    max-width: 15%;
    height: auto;
    padding: 0.5%;
    border: 1px solid #ffffff;
    background-color: #1d1d1d;
    color: #ffffff;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
.assignment_window_toolbar button:hover {
    cursor: pointer;
    background-color: #7d7d7d;
}
#assignment_window_info {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    margin-bottom: 1%;
    color: #000000;
    font-size: 0.8vw;
}
#assignment_window_info > ul {
    position: relative;
    float: left;
    width: 100%;
    height; auto;
    margin: 0;
    padding: 0;
    list-style: none;
}
#assignment_window_heading {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    color: #7d7d7d;
    background-color: rgba(0,0,0,0.1);
    
}
#assignment_window_heading > ul {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.8vw;
}
#assignment_window_heading > ul > li {
    position: relative;
    display: inline-block;
    height: auto;
}
#assignment_window_heading > ul > li:nth-child(1){
    width: 50%;
    margin-left: 1%;
}
#assignment_window_heading > ul > li:nth-child(2){
    width: 16%;
}
#assignment_window_heading > ul > li:nth-child(3){
    width: 16%;
}
#assignment_window_heading > ul > li:nth-child(4){
    width: 16%;
}
.assignment_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: 500px;
    border: 1px solid #777777;
    
    background-color: #ffffff;
    overflow: auto;
    color: #7d7d7d;
    font-size: 0.8vw;
}
.assignment_window_content > li {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.3);
    background-color: #ffffff;
    list-style: none;
}
.assignment_window_content > li > div {
    position: relative;
    display: inline-block;
    height: auto;
    font-size: 1vw;
}
.assignment_window_content > li > div:nth-child(1){
    width: 50%;
    margin-left: 1%;
}
.assignment_window_content > li > div:nth-child(2){
    width: 16%;
    text-align: left;
}
.assignment_window_content > li > div:nth-child(3){
    width: 16%;
    text-align: left;
    margin-left: 5%;
}
.assignment_window_content > li > div:nth-child(4){
    width: 8%;
    text-align: center;
}
.assignment_course_remove_student, .assignment_syllabus_remove_student, .assignment_assessment_remove_student {
    color: red;
}
.assignment_course_remove_student:hover, .assignment_syllabus_remove_student:hover, .assignment_assessment_remove_student:hover {
    cursor: pointer;
    color: rgba(245,0,0,0.5);
}
.assignment_window_content > li:hover {
    cursor: move;
    background-color: rgba(0,0,0,0.1);
}
.assignment_item_play_active {
    background-color: rgba(0,128,0,0.3);
}
.assignment_item_remove_active {
    background-color: rgba(204,0,0,0.5);
}
.assignment_result_cover {
    float: left;
    width: 10%;
    height: auto;
    padding: 1%;
}
.assignment_result_cover i {
    position: absolute;
    z-index: 2;
    font-size: 3vw;
    left: 35%;
    top: 23%;
    color: rgba(255,255,255,0.5);
}
.assignment_result_cover i:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.7);
}
.assignment_result_cover .cover_doc_view, .assignment_result_cover .cover_pp_view {
    position: absolute;
    z-index: 2;
    font-size: 3vw;
    left: 35%;
    top: 23%;
    color: rgba(255,255,255,0.5);
}
.assignment_result_cover img {
    width: 100%;
    height: auto;
}
.assignment_result_name {
    width: 24%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.assignment_result_name span:last-child {
    color: #777777;
}
.assignment_result_sort {
    width: 3%;
}
.assignment_result_sort input {
    width: 100%;
    text-align: center;
    font-family: 'Roboto', sans-serif;
}
.assignment_result_level {
    width: 10%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.assignment_result_origin {
    width: 10%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
}
.assignment_result_criteria {
    width: 14%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-top: 2%;
    text-align: center;
}
.assignment_result_questions {
    width: 10%;
    height: auto;
    text-align: center;
    font-size: 1vw;
    margin-top: 2%;
    padding: 1%;
}
.assignment_result_questions button {
    position: relative;
    padding: 1%;
    width: 100%;
    height: auto;
    background-color: rgb(204,0,0);
    color: #ffffff;
    font-size: 1vw;
    border: none;
    
}
.assignment_result_questions button:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.5);
}
.assignment_result_delete {
    width: 5%;
    text-align: center;
    font-size: 1vw;
    color: red;
}
.assignment_window_minimize {
    position: relative;
    float: right;
    right: 3%;
    font-size: 1vw;
}
.assignment_window_minimize:hover {
    cursor: pointer;
    color: rgb(0,0,0);
}
.assignment_window_close {
    position: relative;
    float: right;
    font-size: 1vw;
}
.assignment_window_close:hover {
    cursor: pointer;
    color: rgb(0,0,0);
}
.assignment_quiz:hover {
    cursor: pointer;
}
.assignment_edit {
    color: rgb(0,128,0);    
}
.assignment_edit:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.assignment_remove {
    color: rgb(204,0,0);
}
.assignment_remove:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.user_assignment {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
    padding: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.assignment_drag {
    color: #000000;
    text-align: center;
    max-width: 15%;
    font-size: 0.8vw;
    background-color: #ffffff;
    border: 1px dashed rgba(0,0,0.7);
    padding: 1%;
    
}
.assignment_drag i {
    font-size: 1.5vw;
    color: rgb(0,0,0);
}
.assignment_drop {
    background-color: rgba(0,0,0,0.7);
    color: #ffffff;
}
.assignment_handle {
    position: relative;
    margin-right: 5%;
    width: auto;
    height: auto;
    font-size: 0.8vw;
    color: rgb(0,0,0);
    padding: 2%;
    background-color: #d1d1d1;
    border: 1px solid rgba(0,0,0,0.1);
    text-align: center;
}
.assignment_handle:hover {
    cursor: move;
}
.assignment_name:hover, .assignment_name:active {
    font-weight: bold;
    color: rgb(0,0,0);
}
.user_assignment_sort {
    border: 2px dashed rgb(79,79,79);
    background-color: rgba(0,0,0,0.3);
}
.user_assignment div {
    position: relative;
    height: auto;
    display: inline-block;
}
.user_assignment_row {
    width: 6%;
    text-align: left;
}
.user_assignment_name {
    width: 27%;
}
.user_assignment_descr {
    width: 27%;
}
.user_assignment_author {
    width: 13.5%;
}
.user_assignment_preview_button {
    width: 10%;
    text-align: center;
}
.user_assignment_start_date, .user_assignment_end_date {
    width: 7%;
    font-size: 0.8vw;
    text-align: center;
}
.user_assignment_duration {
    width: 6.4%;
    text-align: center;
    color: #7d7d7d;
}
.user_assignment_status_section {
    width: 6%;
    text-align: center;
}
.user_assignment_edit_section, .user_assignment_remove_section {
    width: 6%;
    text-align: center;
}
#add_to_options-assignments > i.fa-th-large, .new_assignment > i.fa-th-large, .assignment > i.fa-th-large, .existing_assignment > i.fa-th-large {
    color: rgb(241, 151, 13);
}
/* The switch - the box around the slider */
.switch {
    position: absolute;
    float: left;
    width: 6%;
    height: auto;
    padding: 2.1%;
    margin-top: 0%;
    margin-left: 25%;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

.student_course_certificate {
    position: relative;
    width: 100%;
    height: auto;
    padding: 1%;
    background-color: green;
    color: #fff;
    border: none;
    
    box-shadow: 0 1px 5px -1px #000;
    font-size: 1vw;
}
.student_course_certificate:hover {
    cursor: pointer;
}
#student_course_window_coursebar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#student_course_window_coursebar > div {
    position: relative;
    display: inline-block;
    width: 10%;
    height: auto;
    padding: 1%;
    text-align: center;
    border: 1px solid black;
    border-radius: 0px;
    border-bottom: none;
}
#student_course_window_coursebar > div:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
    font-weight: bold;
}
.student_course_active_tab {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
    font-weight: bold;
    border: 2px solid black !important;
    border-bottom: none !important;
}
#student_course_window_content_active, #student_course_window_content_completed {
    display: none;
}
.student_course_active_content {
    display: block !important;
}
#course_remediation, #assessment_remediation {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    height: auto;
    min-height: 22vh;
    max-height: 22vh;
}
#course_remediation_heading, #assessment_remediation_heading {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    background-color: rgba(204,0,0,0.9);
    color: #fff;
    font-size: 0.8vw;
    padding: 1%;
    margin-bottom: 1%;
    font-weight: bold;
    text-align: left;
}
#course_remediation_content, #assessment_remediation_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    font-size: 0.8vw;
    background-color: #e7e7e7;
    color: #000;
    padding: 1%;
}
#course_remediation_footer, #assessment_remediation_footer {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 1%;
}
.remediate_popup_button {
    position: relative;
    width: auto;
    min-width: 9%;
    max-width: 25%;
    padding: 0.5%;
    height: auto;
    float: right;
    color: #ffffff;
    font-size: 0.7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    margin-left: 1%;
    opacity: 1;
}
.remediate_popup_button:hover {
    cursor: pointer;
}
#assessment_complete_now {
    min-width: 30%;
    max-width: 30%;
    font-size: 1vw;
    padding: 1%;
    background-color: rgb(0,128,0);
}
#assessment_complete_now:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
#remediate_now, #assessment_remediate_now {
    background-color: rgb(204,0,0);
}
#remediate_now:hover, #assessment_remediate_now:hover {
    background-color: rgba(204,0,0,0.7);
}
#remediate_later, #assessment_remediate_later {
    background-color: rgb(0,128,0);
}
#remediate_later:hover, #assessment_remediate_later:hover {
    background-color: rgba(0,128,0,0.7);
}
#new_lessonplan_window {
    top: 4%;
    left: 0%;
    width: 98%;
    z-index: 1000;
    border: 2px solid black;
    padding: 1%;
}
#new_lessonplan_window_top {
    font-size: 0.8vw;
}
#new_lessonplan_window_top img {
    position: relative;
    float: left;
    width: 2.5%;
    height: auto;
    margin-right: 1%;
}
.new_lessonplan_screen {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 1vw;
}
.new_lessonplan_screen_active {
    display: block !important;
}
.new_lessonplan_screen ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
    list-style: none;
}
.new_lessonplan_window_info_section {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
.current_new_lessonplan_name {
    color: rgba(0,0,0,0.6);
    font-weight: bold;
}
#new_lessonplan_window_info_screen label {
    position: relative;
    float: left;
    width: 24%;
    height: auto;
    font-size: 0.8vw;
}
#new_lessonplan_window_info_screen select {
    position: relative;
    float: left;
    width: 74%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1vw;
    font-family: 'Roboto', sans-serif;
}
#new_lessonplan_window_info_screen input {
    position: relative;
    float: left;
    width: 70%;
    height: auto;
    font-size: 1vw;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    padding-left: 1%;
    margin-bottom: 1%;
    z-index: 100000;
}
#new_lessonplan_window_info_screen textarea {
    position: relative;
    float: left;
    width: 70.6%;
    height: 100px;
    resize: none;
    padding-left: 1%;
    outline: 0;
    font-family: 'Roboto', sans-serif;
    margin-bottom: 1%;
}
#new_lessonplan_workshop_list {
    position: relative;
    float: left;
    width: 50%;
    height: 375px;
    overflow-x: hidden;
    overflow-y: auto;
}
#new_lessonplan_workshop_list > ul > li > span {
    text-decoration: underline;
}
#new_lessonplan_workshop_list > ul > li > span:hover {
    cursor: pointer;
    font-weight: bold;  
}
#new_lessonplan_workshop_preview_window {
    position: relative;
    float: right;
    width: 50%;
    height: auto;
    opacity: 0;
}
#new_lessonplan_workshop_preview {
    width: 100%;
    height: 100%;
    min-height: 350px;
}
.selected_new_lessonplan_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
}
.selected_new_lessonplan_content span {
    float: left;
}
.selected_new_lessonplan_content button {
    float: right;
}
.user_window_bottom {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
.video_wrapper {
    position: absolute;
    float: left;
    background-color: transparent;
    min-width: 100%;
    min-height: 100%;
    z-index: 1;
    opacity: 0;
}
#lessonplan_item_list {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.lessonplan_list_item {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border: 1px solid #d7d7d7;
    margin-bottom: 0.5%;
}
.lessonplan_list_item_heading {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border: 1px solid #d7d7d7;
    margin-bottom: 0.5%;
}
.lessonplan_list_item_move_heading {
    position: relative;
    float: left;
    width: 7%;
    height: auto;
    text-align: center;
    margin-right: 1%;
}
.lessonplan_list_item_move {
    position: relative;
    float: left;
    width: 7%;
    height: auto;
    text-align: center;
    margin-right: 1%;
}
.lessonplan_list_item_move:hover {
    color: rgba(241, 151, 13, 1);
    cursor: pointer;
}
.lessonplan_list_item_type {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    height: auto;
    text-align: left;
    margin-right: 1%;
}
.lessonplan_list_item_name {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    height: auto;
    text-align: left;
}
.lessonplan_list_item_date {
    position: relative;
    float: left;
    width: 13%;
    height: auto;
    text-align: center;
}
.lessonplan_list_item_date > input {
    text-align: center;
    font-size: 1vw;
    width: 80%;
}
.lessonplan_list_item_date_required {
    border: 1px solid red;
}
.lessonplan_list_item_sort {
    position: relative;
    float: left;
    width: 5%;
    height: auto;
    text-align: center;
}
#new_lessonplan_learner_list {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    min-height: 380px;
    overflow-y: auto;
}
#new_lessonplan_learner_list label {
    position: relative;
    float: left;
    width: auto;
    margin-right: 1%;
    margin-top: 1%;
    font-weight: bold;
}
#learner_unit_list {
    position: relative;
    float: left;
    padding: 0.5%;
    width: auto;
    font-size: 1vw;
    height: auto;
}
#new_lessonplan_learner_list hr {
    position: relative;
    float: left;
    width: 98%;
}
#new_lessonplan_learner_list > ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 0.5%;
}
#new_lessonplan_learner_list > ul > li > div:nth-child(1){
    position: relative;
    float: left;
    width: 2%;
    height: auto;
}
#new_lessonplan_learner_list > ul > li > div:nth-child(2){
    position: relative;
    float: left;
    width: auto;
    height: auto;
    max-width: 75%;
}
#new_lessonplan_window_title {
    position: relative;
    float: left;
    width: auto;
    margin-right: 0%;
}
.add_to_lessonplan_screen {
    display: none;
    position: relative;
    float: left;
    width: 96%;
    height: auto;
    font-size: 1vw;
    z-index: 1000;
    background-color: #ffffff;
    color: #000000;
    padding: 1%;
    border: 2px solid rgb(241, 151, 13);
}
.add_to_lessonplan_screen ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
    list-style: none;
}
.add_to_lessonplan_screen_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.add_to_lessonplan_screen_bottom button {
    position: relative;
    float: right;
    width: 10%;
    height: auto;
    padding: 1%;
    font-size: 1vw;
    margin-left: 1%;
    margin-right: 1%;
}
#student_booster_window {
    border: 2px solid rgba(0, 0, 0, 1);
    box-shadow: 0px 0px 5px 0px #000000;
}
#setup_assignment_screen {
    display: none;
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    background-color: #fff;
    color: #000;
    padding: 1%;
    opacity: 0;
}
.setup_assignment_screen {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_learners_window {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_learners_window_title > i {
    color: rgba(0,0,0,0.2);
}
#assign_learners_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_learners_window_content > div {
    position: relative;
    float: left;
    width: 32%;
    height: auto;
    margin-right: 1%;
}
#assign_learners_window_content ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}
#assign_learners_window_content ul li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
}
.learner_list_header {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    text-align: center;
    background-color: rgba(0,0,0,0.1);
}
#assign_learners_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 1%;
    background-color: rgba(0,0,0,0.2);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
    margin-right: 1%;
}
#assign_learners_window_bottom button:hover {
    cursor: pointer;
}
#new_learner_list_window {
    width: auto;
    z-index: 1001;
    border: 2px solid rgba(0,0,0,0.2);
    padding: 1%;
}
#new_learner_list_window_title {
    font-size: 0.8vw;
}
#new_learner_list_window_content {
    margin-top: 2%;
    
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: 5%;
}
#new_learner_list_window_content > div {
    position: relative;
    width: auto;
    max-height: 250px;
    overflow-y: auto;
}
#new_learner_list_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    min-width: 15%;
    height: auto;
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.8vw;
    margin-right: 1%;
}
#new_learner_list_window_bottom button:hover {
    cursor: pointer;
}
#cancel_new_learner_list {
    background-color: red;
}
#cancel_new_learner_list:hover {
    background-color: rgba(204,0,0,0.7);
}
#save_new_learner_list {
    background-color: green;
}
#save_new_learner_list:hover {
    background-color: rgba(0,128,0,0.7);
}
.view_learner_list {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 20%;
    max-width: 20%;
    padding: .5%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 2px 4px -2px #000;
    transition: all .5s;
    
    background-color: rgba(0,0,0,.75);
    margin-right: 1%;
}
.view_learner_list:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.2);
}

#view_learner_list_window {
    width: auto;
    z-index: 1001;
    border: 2px solid rgba(0,0,0,0.2);
    padding: 1%;
}
#view_learner_list_window_title > i {
    color: rgba(0,0,0,0.2);
}
#view_learner_list_window_content > div {
    position: relative;
    width: auto;
    max-height: 250px;
    overflow-y: auto;
}
#view_learner_list_window_content ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 200px;
}
#view_learner_list_window_content li {
    position: relative;
    float: left;
    width: 99%;
    height: auto;
    padding: 1%;
}
#view_learner_list_window_content li > span {
    position: relative;
    float: left;
}
#view_learner_list_window_content li > i {
    position: relative;
    float: right;
    color: red;
}
#view_learner_list_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    min-width: 15%;
    height: auto;
    padding: 0.5%;
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.8vw;
    margin-right: 1%;
}
#view_learner_list_window_bottom button:hover {
    cursor: pointer;
}
#close_view_learner_list {
    background-color: black;
}
.learner_list_remove:hover {
    cursor: pointer;
    color: rgba(245,0,0,0.4) !important;
}
#assign_assignment_window {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_assignment_window_title > i {
    color: rgba(0,0,0,0.2);
}
#assign_assignment_window_content > div {
    position: relative;
    float: left;
    width: 24%;
    height: auto;
    margin-right: 1%;
}
#assign_assignment_window_content > div::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
#assign_assignment_window_content > div ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
#assign_assignment_window_content > div::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
#assign_assignment_window_content ul {
    position: relative;
    float: left;
    width: 99%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}
#assign_assignment_window_content ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.assignment_content_course {
    position: relative;
    float: left;
    width: 98.5% !important;
    height: auto;
    padding: 1%;
    border: 1px solid #e7e7e7;
    margin-bottom: 0.5%;
}
.assignment_content_course > div:nth-child(1){
    position: relative;
    float: left;
    width: auto;
    min-width: 5%;
    max-width: 5%;
    height: auto;
}
.assignment_content_course > div:nth-child(2){
    position: relative;
    float: left;
    width: auto;
    min-width: 95%;
    max-width: 95%;
    height: auto;
    margin-top: 0.5%;
}
.assignment_content_syllabus {
    position: relative;
    float: left;
    width: 97% !important;
    height: auto;
    padding: 1%;
    border: 1px solid black;
    
    margin-bottom: 0.5%;
}
.assignment_content_syllabus img {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.assignment_content_syllabus > div:nth-child(1){
    color: rgb(0,128,0);
}
.assignment_content_lessonplan {
    position: relative;
    float: left;
    width: 97% !important;
    height: auto;
    padding: 1%;
    border: 1px solid black;
    
    margin-bottom: 0.5%;
}
.assignment_content_lessonplan img {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.assignment_content_lessonplan > div:nth-child(1){
    color: rgb(241,151,13);
}
.assignment_content_assessment {
    position: relative;
    float: left;
    width: 99% !important;
    height: auto;
    padding: 1%;
    border: 1px solid #e7e7e7;
    margin-bottom: 0.5%;
}
.assignment_content_assessment > div:nth-child(1){
    position: relative;
    float: left;
    width: auto;
    min-width: 5%;
    max-width: 5%;
    height: auto;
}
.assignment_content_assessment > div:nth-child(2){
    position: relative;
    float: left;
    width: auto;
    min-width: 95%;
    max-width: 95%;
    height: auto;
    margin-top: 0.5%;
}
.assignment_parameter select {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 90%;
    max-width: 90%;
    padding: 0%;
    font-size: .7vw;
    border: 1px solid #d7d7d7;
    outline: 0;
}
.assignment_parameter input[type='text'] {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 20%;
    max-width: 50%;
    padding: 0%;
    font-size: .7vw;
    border: 2px solid #d7d7d7;
    
    padding-left: 1%;
}
.assignment_parameter button {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 35%;
    max-width: 50%;
    padding: .5%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    background-color: rgba(0,0,0,0.75);
    margin-right: 1%;
}
.assignment_parameter button:hover {
    cursor: pointer;
    opacity: 0.5;
}
.assignment_parameter_selected {
    background-color: rgb(0,128,0) !important;
}
#dashboard_window_menu_content_students_options {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#dashboard_window_menu_content_students_options select {
    position: relative;
    width: auto;
    height: auto;
    min-width: 50%;
    max-width: 50%;
    padding: 0%;
    font-size: .7vw;
    border: 1px solid #d7d7d7;
    outline: 0;
    padding-left: 1%;
}
#dashboard_window_menu_content_students_options label {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#dashboard_window_menu_content_students_options > div {
    position: relative;
    display: inline-block;
    width: auto;
    min-width: 24%;
    max-width: 24%;
    padding-right: 1%;
    height: auto;
    text-align: center;
}
#assignment_students {
    position: relative;
    float: left;
    width: auto;
    min-width: 32%;
    max-width: 32%;
    height: auto;
    max-height: 44vh;
    overflow-x: hidden;
    overflow-y: auto;
}
#assignment_learner_lists {
    position: relative;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    float: left;
    margin-left: 1%;
    max-height: 44vh;
    overflow-x: hidden;
    overflow-y: auto;
}
#assignment_students_bank {
    position: relative;
    float: left;
    width: auto;
    min-width: 32%;
    max-width: 32%;
    margin-left: 1%;
    max-height: 44vh;
    overflow-x: hidden;
    overflow-y: auto;
}
#assignment_students > ul, #assignment_learner_lists > ul, #assignment_students_bank > ul {
    max-height: 34vh;
    overflow-y: auto;
    overflow-x: hidden;
}
.filter_heading {
    text-align: center;
    margin-bottom: 0.5%;
    background-color: #1d1d1d;
    color: #fff;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_assignment_window_content_list {
    max-height: 350px;
    overflow-y: auto;
    overflow-x: hidden;
}
#assign_assignment_window_content ul > li div:nth-child(1) {
    position: relative;
    float: left;
    width: 5%;
    height: auto;
    text-align: center;
    margin-right: 1%;
}
#assign_assignment_window_content ul > li div:nth-child(2) {
    position: relative;
    float: left;
    width: 94%;
    height: auto;
    overflow: hidden;
}
.learner_list_header {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    text-align: center;
    background-color: rgba(0,0,0,0.1);
}
#assign_assignment_window_bottom button, #assign_learners_window_tasks button {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 1%;
    background-color: rgba(0,0,0,0.2);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
    margin-right: 1%;
}
#assign_assignment_window_bottom button:hover {
    cursor: pointer;
}
#assign_learners_window_tasks button:hover {
    cursor: pointer;
    background-color: #d7d7d7;
}
.filter_course_content {
    position: relative;
    float: right;
    width: 5%;
    height: auto;
    padding: 1%;
    color: #fff;
    background-color: rgb(0,0,0);
}
.filter_course_content:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.5);
}
.filter_course_content_selected {
    background-color: rgb(255,255,255);
    border: 1px solid rgb(0,0,0);
    color: rgb(0,0,0);
    font-weight: bold;
}
.filter_syllabus_content {
    position: relative;
    float: right;
    width: 5%;
    height: auto;
    padding: 1%;
    color: #fff;
    background-color: rgb(0,128,0);
}
.filter_syllabus_content:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.5);
}
.filter_syllabus_content_selected {
    background-color: rgb(255,255,255);
    border: 1px solid rgb(0,128,0);
    color: rgb(0,128,0);
    font-weight: bold;
}
.filter_lessonplan_content {
    position: relative;
    float: right;
    width: 5%;
    height: auto;
    padding: 1%;
    color: #fff;
    background-color: rgb(241,151,13);
}
.filter_lessonplan_content:hover {
    cursor: pointer;
    background-color: rgba(241,151,13,0.5);
}
.filter_lessonplan_content_selected {
    background-color: rgb(255,255,255);
    border: 1px solid rgb(241,151,13);
    color: rgb(241,151,13);
    font-weight: bold;
}
#assign_assignment_date_window {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_assignment_date_window_title > i {
    color: rgba(0,0,0,0.2);
}
#assign_assignment_date_window_content > div {
    position: relative;
    float: left;
    width: 32%;
    height: auto;
    margin-right: 1%;
}
#assign_assignment_date_window_content > ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    list-style: none;
}
#assign_assignment_date_window_content > ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assign_assignment_date_window_content > ul > li:nth-child(1){
    margin-bottom: 1%;
}
#assign_assignment_date_window_content > ul > li:nth-child(2){
    padding-bottom: 1%;
    padding-top: 0.5%;
    margin-bottom: 1%;
    border-bottom: 1px solid black;
}
#assign_assignment_date_window_content > ul > li > div:nth-child(2) {
    position: relative;
    float: left;
    width: 19%;
    height: auto;
}   
#assign_assignment_date_window_content > ul > li > div:nth-child(3) {
    position: relative;
    float: left;
    width: 23%;
    height: auto;
    margin-left: 1%;
}
#assign_assignment_date_window_content > ul > li > div:nth-child(4) {
    position: relative;
    float: left;
    width: 25%;
    height: auto;
}
#assign_assignment_date_window_content > ul > li > div:nth-child(5) {
    position: relative;
    float: left;
    width: 18%;
    height: auto;
}
#assign_assignment_date_window_content > ul > li > div:nth-child(6) {
    position: relative;
    float: left;
    width: 10%;
    height: auto;
    text-align: center;
}
#assign_assignment_date_window_content label {
    position: relative;
    float: left;
    font-size: 0.8vw;
}
#assign_assignment_date_window_content input[type=radio] {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    margin-left: 3%;
}
#assign_assignment_date_window_content input[type=text] {
    position: relative;
    float: left;
    margin-left: 3%;
    width: auto;
    max-width: 25%;
    height: auto;
    margin-right: 0%;
    font-size: 0.8vw;
}
#assign_assignment_date_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 1%;
    background-color: rgba(0,0,0,0.2);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
    margin-right: 1%;
}
#assign_assignment_date_window_bottom button:hover {
    cursor: pointer;
}
#other_dropdown {
    display: none;
    position: absolute;
    float: left;
    left: 32.5%;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    padding: 0.5%;
    height: auto;
    background-color: #fff;
    color: #000;
    z-index: 101;
    top: 15%;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.7vw;
    
}
#other_dropdown_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    padding: 0%;
    max-height: 30vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.other_dropdown_directories {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    margin-right: 1%;
    text-align: center;
    min-width: 50%;
    max-width: 50%;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    padding-bottom: 1%;
    border-right: 1px solid #e7e7e7;
}
.other_dropdown_directories > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
}
.other_dropdown_directories:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
}
.other_dropdown_directories > span > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 5%;
    max-width: 10%;
    height: auto;
}
.other_dropdown_directories > span > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 88%;
    text-align: left;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: 1%;
    margin-left: 2%;
}
.other_dropdown_window {
    display: none;
    position: relative;
    float: right;
    width: auto;
    min-width: 47%;
    max-width: 47%;
    padding: 0.5%;
    height: auto;
    color: #000;
    z-index: 101;
    top: 0%;
    font-size: 0.7vw;
}
.other_dropdown_subdirectories {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    list-style: none;
    margin: 0;
    padding: 0;
}
.other_dropdown_subdirectories > li {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    padding-bottom: 0.5%;
}
.other_dropdown_subdirectories > li:hover {
    background-color: rgba(0,0,0,0.1);
    cursor: pointer;
}
.other_dropdown_subdirectory > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 5%;
    max-width: 12%;
    height: auto;
}
.other_dropdown_subdirectory > span {
    position: relative;
    float: left;
    width: auto;
    max-width: 80%;
    min-width: 50%;
    height: auto;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 2.1%;
}
#new_assessment_window {
    top: 0%;
    left: 0%;
    width: 97%;
    z-index: 1000;
    border: 2px solid rgb(122,15,175);
}
#new_assessment_window_title > i {
    color: rgba(122,15,175,0.5);
}
#new_assessment_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 1%;
    background-color: rgba(122,15,175,1);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
    margin-right: 1%;
}
#new_assessment_window_add_questions {
    background-color: green !important;
    opacity: 0;
}
#new_assessment_window_complete {
    background-color: #d7d7d7 !important;
    touch-events: none;
}
#new_assessment_window_back {
    opacity: 0;
}
#new_assessment_window_activity_status {
    position: relative;
    float: right;
    padding: .5%;
    margin-top: 1.5%;
    margin-right: 3.5%;
    font-weight: bold;
    color: rgba(204,0,0,1);
}
#new_assessment_window_bottom button:hover {
    cursor: pointer;
    background-color: rgba(0,0,0, 0.75);
}
.new_assessment_screen {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 1vw;
}
#new_assessment_window_content, #new_assessment_window_bottom {
    display: none;
}
#new_assessment_window_info_screen label {
    position: relative;
    float: left;
    width: 24%;
    height: auto;
    font-size: 0.8vw;
}
#new_assessment_window_info_screen select {
    position: relative;
    float: left;
    width: 74%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1vw;
    font-family: 'Roboto', sans-serif;
}
#new_assessment_window_info_screen input {
    position: relative;
    float: left;
    width: 70%;
    height: auto;
    font-size: 1vw;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    padding-left: 1%;
    margin-bottom: 1%;
    z-index: 100000;
}
#new_assessment_window_info_screen textarea {
    position: relative;
    float: left;
    width: 70.6%;
    height: 100px;
    resize: none;
    padding-left: 1%;
    outline: 0;
    font-family: 'Roboto', sans-serif;
    margin-bottom: 1%;
}
#new_assessment_window_content_search {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    border-bottom: 2px solid rgb(0,0,0,0.1);
    padding-bottom: 0.1%;
}
#new_assessment_window_content_results, #new_assessment_window_question_results {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    max-height: 400px;
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 0.8vw;
    padding-top: 0.1%;
}
#new_assessment_window_content_screen label {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    font-size: 0.9vw;
    padding: 0.4%;
}
#new_assessment_window_content_screen input {
    position: relative;
    float: left;
    width: 25%;
    height: auto;
    border-radius: 25px;
    border: 2px solid #000;
    padding-left: 1%;
    font-size: 0.9vw;
    margin-left: 1%;
    outline: none;
}
#new_assessment_window_content_results ul, #new_assessment_window_question_results ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;   
}
#new_assessment_window_content_results ul > li, #new_assessment_window_question_results ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#new_assessment_window_content_results ul > li:nth-child(even), #new_assessment_window_question_results ul > li:nth-child(even) {
    background-color: rgb(0,0,0,0.1);   
}
#new_assessment_window_content_results ul > li > span, #new_assessment_window_question_results ul > li > span {
    position: relative;
    float: right;
    width: auto;
    height: auto;
}
.new_assessment_content_item, .new_assessment_question_item {
    width: auto !important;
    margin-right: 1%;
}
#new_assessment_window_question_screen > div {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
}
#assessment_question_view {
    position: relative;
    float: left;
    width: auto;
    padding: 1%;
    height: auto;
    border: none;
    box-shadow: 0px 0px 1px 0px #000000;
    font-size: 0.9vw;
    margin-right: 1%;
    background-color: #000000;
    color: white;
    
}
#assessment_question_add {
    position: relative;
    float: left;
    width: auto;
    padding: 1%;
    height: auto;
    border: none;
    box-shadow: 0px 0px 1px 0px #000000;
    font-size: 0.9vw;
    margin-right: 1%;
    background-color: #000000;
    color: white;
    
}
#new_assessment_window_question_toolbar button:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.5);
}
.assessment_question_button_selected {
    background-color: red !important;
}
#new_assessment_window_question_add {
    display: none;
}
#user_assessment_window_new_assessment {
    position: relative;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 1%;
    background-color: rgb(122, 15, 175);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
}
#user_assessment_window_new_assessment:hover {
    cursor: pointer;
}
#user_assessment_window_group_top, #user_assessment_window_group_subgroup, #user_assessment_window_group_taskbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_assessment_window_group_subgroup {
    display: none;
    border-top: 1px solid rgba(0,0,0,0.1);
    padding-top: 1%;
}
#user_assessment_window_group_taskbar {
    display: none;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#user_assessment_window_subgroup_taskbar button, #user_assessment_window_group_taskbar button {
    position: relative;
    width: auto;
    height: auto;
    float: left;
    padding: 0.5%;
    margin-left: 1%;
    color: #ffffff;
    background-color: #7d7d7d;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    border-radius: 0px;
    outline: 0;
    border: 0;
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    margin-right: 1%;
    opacity: 1;
}
#user_assessment_window_subgroup_taskbar {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    padding-bottom: 1%;
    border-bottom: 1px solid rgb(0,0,0,0.1);
}
#user_assessment_window_subgroup_top {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#user_assessment_window_subgroup_add:hover, #user_assessment_window_group_add:hover {
    cursor: pointer;
    background-color: rgba(0,120,245,0.65);
}
#user_assessment_window_subgroup_rename:hover, #user_assessment_window_group_rename:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.65);
}
#user_assessment_window_subgroup_delete:hover, #user_assessment_window_group_delete:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.65);
}
#user_sub_lessonplan_groups, #user_sub_assessment_groups {
    position: relative;
    float: left;
    width: 100%;
    max-height: 300px;
    overflow-y: hidden;
    overflow-x: auto;
    white-space: nowrap;
}
#user_sub_lessonplan_groups::-webkit-scrollbar, #user_sub_assessment_groups::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
.user_assessment_window_subgroup_item > .user_window_group_top {
    font-size: 2vw;
}
.user_assessment_window_subgroup_item > .user_window_group_bottom {
    font-size: 0.8vw;   
}
.user_assessment {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
.user_assessment:hover {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}
.user_assessment:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}
.assessment_drag {
    color: #000000;
    text-align: center;
    max-width: 15%;
    font-size: 0.8vw;
    background-color: #ffffff;
    border: 1px dashed rgba(0,0,0.7);
    padding: 1%;
    
}
.assessment_drag i {
    font-size: 1.5vw;
    color: rgb(0,0,0);
}
.assessment_drop {
    background-color: rgba(0,0,0,0.7);
    color: #ffffff;
}
.assessment_handle {
    position: relative;
    margin-right: 5%;
    width: auto;
    height: auto;
    font-size: 0.8vw;
    color: rgb(0,0,0);
    padding: 2%;
    background-color: #d1d1d1;
    border: 1px solid rgba(0,0,0,0.1);
    text-align: center;
}
.assessment_handle:hover {
    cursor: move;
}
.assessment_name:hover, .assessment_name:active {
    font-weight: bold;
    color: rgb(0,0,0);
}
.user_assessment_sort {
    border: 2px dashed rgb(79,79,79);
    background-color: rgba(0,0,0,0.3);
}
.user_assessment div {
    position: relative;
    height: auto;
    display: inline-block;
}
.user_assessment_row {
    width: 6.3%;
    text-align: left;
}
.user_assessment_name {
    width: 29%;
}
.user_assessment_descr {
    width: 29.5%;    
}
.user_assessment_author {
    width: 13.5%;
}
.user_assessment_topic_section {
    width: 7%;
    text-align: center;
}
.user_assessment_preview_section {
    width: 7%;
    text-align: center;
}
.user_assessment_edit_section, .user_assessment_remove_section {
    width: 7%;
    text-align: center;
}
.user_assessment_preview_section button {
    position: relative;
    width: 60%;
    height: auto;
    padding: 1%;
    background-color: rgb(122,15,175);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.8vw;
}
.user_assessment_preview_section button:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.2);
}
.filter_assessment_content {
    position: relative;
    float: right;
    width: 5%;
    height: auto;
    padding: 1%;
    color: #fff;
    background-color: rgb(122,15,175);
}
.filter_assessment_content:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
}
.filter_assessment_content_selected {
    background-color: rgba(0,0,0,0.2);
    border: 1px solid rgb(0,0,0);
    color: rgb(0,0,0);
    font-weight: bold;
}
#assessment_window {
    display: none;
    position: absolute;
    float: left;
    width: 96%;
    height: auto;
    padding: 1%;
    left: -90%;
    z-index: 101;
    background-color: #ffffff;
    
    opacity: 0;
    box-shadow: 0px 1px 1px 0px #000000;
}
#assessment_window > span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    font-size: 1.3vw;
    color: #7d7d7d;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
#assessment_window > span:hover {
    cursor: move;
}
#assessment_window > span > i {
    color: #fff;
    position: relative;
    float: right;
    right: 1%;
}
.assessment_window_namebar >i {
    color: rgba(122,15,175,1);
}
.assessment_window_toolbar {
    position: relative;
    display: inline-block;
    width: 74%;
    height: auto;
    left: 2%;
    margin-bottom: 0.2%;
}
.assessment_window_toolbar button {
    position: relative;
    display: inline-block;
    width: auto;
    max-width: 15%;
    height: auto;
    padding: 0.5%;
    border: 1px solid #ffffff;
    background-color: rgba(0,0,0,0.2);
    color: #ffffff;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
.assessment_window_toolbar button:hover {
    cursor: pointer;
    background-color: #7d7d7d;
}
#assessment_window_info {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    margin-bottom: 1%;
}
#assessment_window_heading {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    color: #7d7d7d;
    background-color: rgba(0,0,0,0.2);
    
}
#assessment_window_heading > ul {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 1vw;
}
#assessment_window_heading > ul > li {
    position: relative;
    display: inline-block;
    height: auto;
}
#assessment_window_heading > ul > li:nth-child(1){
    width: 26%;
    margin-left: 1%;
}
#assessment_window_heading > ul > li:nth-child(2){
    width: 15%;
}
#assessment_window_heading > ul > li:nth-child(3){
    width: 15%;
}
#assessment_window_heading > ul > li:nth-child(4){
    width: 15%;
}
#assessment_window_heading > ul > li:nth-child(5){
    width: 15%;
}
#assessment_window_heading > ul > li:nth-child(6){
    width: 5%;
}
#assessment_window_heading > ul > li:nth-child(7){
    width: 3%;
}
.assessment_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: 500px;
    border: 1px solid #777777;
    
    background-color: #ffffff;
    overflow: auto;
    color: #7d7d7d;
}
.assessment_window_content > li {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.3);
    background-color: #ffffff;
    list-style: none;
}
.assessment_window_content > li > div {
    position: relative;
    display: inline-block;
    height: auto;
    font-size: 1vw;
}
.assessment_window_content > li:hover {
    cursor: move;
    background-color: rgba(0,0,0,0.1);
}
.assessment_window_close {
    position: relative;
    float: right;
    font-size: 1vw;
}
.assessment_window_close:hover {
    cursor: pointer;
    color: rgb(0,0,0);
}
.assessment_col1 {
    width: 26%;
}
.assessment_col2 {
    word-wrap: break-word;
    width: 15%;
    margin-right: 0.5%;
}
.assessment_col3 {
    word-wrap: break-word;
    width: 15%;
    margin-right: 0.5%;
}
.assessment_col4 {
    word-wrap: break-word;
    width: 15%;
    margin-right: 0.5%;
}
.assessment_col5 {
    word-wrap: break-word;
    width: 15%;
    margin-right: 0.5%;
}
.assessment_col6 {
    width: 6%;
    text-align: center;
}
.assessment_col7 {
    width: 4%;
    text-align: center;
}
.assessment_remove {
    color: red;
}
.assessment_remove:hover {
    cursor: pointer;
    color: rgba(245,0,0,0.7);
}
#syllabus_notes_window_content_bottom video {
    max-width: 100%;
    max-height: 43vh;
}
#syllabus_notes_window_content_bottom iframe {
    position: relative;
    width: 100%;
    height: 100%;
}
#syllabus_notes_window_content_bottom {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    box-shadow: 0px 0px 3px -1px #000;
    
}
#syllabus_notes_window_content_video_controls {
    display: none;
    position: absolute;
    z-index: 2;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: 2.8vh;
    min-height: 2.8vh;
    max-height: 2.8vh;
    bottom: 2%;
    background-color: rgba(0,0,0,0.1);
}
#preview_assessment_window {
    display: none;
    position: absolute;
    z-index: 1001;
    background-color: #fff;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 100vh;
    max-height: 100vh;
    text-align: center;
    top: 0%;
    opacity: 0;
    background-color: #e7e7e7;
}
#launch_assessment_window {
    display: none;
    position: absolute;
    z-index: 1001;
    background-color: #fff;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 100vh;
    max-height: 100vh;
    text-align: center;
    top: 0%;
    opacity: 0;
    background-color: #e7e7e7;
}
#preview_assessment_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    background-color: #fff;
    box-shadow: 0px 1px 3px -1px #000;
    opacity: 1;
    background-color: #1d1d1d;
    color: #fff;
}
#launch_assessment_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 100vh;
    max-height: 100vh;
    background-color: #fff;
    box-shadow: 0px 1px 3px -1px #000;
    opacity: 1;
    background-color: #1d1d1d;
    color: #fff;
}
#launch_assessment_window_logo {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    margin-top: 5%;
}
#launch_assessment_window_logo > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 5vh;
    object-fit: contain;
}
#launch_assessment_window_assessmentname {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 5vh;
    max-height: 5vh;
    margin-top: 10%;
}
#launch_assessment_window_assessmentname > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    font-size: 1vw;
    max-height: 5vh;
}
#preview_assessment_window_top > span {
    position: relative;
    float: left;
    left: 87%;
    font-size: .7vw;
    margin-top: .5%;
}
#launch_assessment_window_top > span {
    position: relative;
    float: left;
    left: 87%;
    font-size: .7vw;
    margin-top: .5%;
}
#preview_assessment_window_close, #launch_assessment_window_close {
    position: relative;
    float: right;
    right: 1%;
    font-size: 1vw;
    z-index: 1;
    margin-top: .5%;
}
#preview_assessment_window_close:hover, #launch_assessment_window_close:hover {
    cursor: pointer;
    color: #d1d1d1;
}
#preview_assessment_window_section, #launch_assessment_window_section {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 96vh;
    max-height: 96vh;
}
#preview_assessment_window_info, #launch_assessment_window_info {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    background-color: #000000;
    color: #ffffff;
    min-height: 96vh;
    max-height: 96vh;
}
#preview_assessment_window_info_left, #launch_assessment_window_info_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 97%;
    max-width: 97%;
    height: auto;
    text-align: left;
    min-height: 8vh;
    max-height: 8vh;
    margin-top: 5%;
    padding-left: 3%;
    font-size: 1vw;
}
#preview_assessment_name {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-top: 3%;
}
#preview_assessment_window_info_right, #launch_assessment_window_info_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 97%;
    max-width: 97%;
    height: auto;
    text-align: left;
    min-height: 8vh;
    max-height: 8vh;
    margin-top: 5%;
    padding-left: 3%;
    font-size: 1vw;
}
#preview_assessment_window_content, #launch_assessment_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 85%;
    max-width: 85%;
    height: auto;
    min-height: 96vh;
    max-height: 96vh;
    background-color: #e4e4e4;
}
#assessment {
    position: relative;
    float: left;
    width: auto;
    min-width: 94%;
    max-width: 94%;
    height: auto;
    min-height: 86vh;
    max-height: 86vh;
    padding: 3%;
}
.assessment_question {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 86vh;
    max-height: 86vh;
}
#assessment_question_text {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 10vh;
    text-align: left;
    font-size: 1vw;
    word-break: break-word;
    background-color: #192a56;
    color: #fff;
    padding: 1%;
}
#assessment_image {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 25vh;
    max-height: 25vh;
    text-align: center;
    margin-top: 0.5%;
}
#assessment_image.dd, #assessment_image.dp {
    position: relative;
    /*float: left;*/
    float: right;
    width: auto;
    min-width: 79%;
    max-width: 79%;
    height: auto;
    min-height: 70vh;
    max-height: 70vh;
    text-align: center;
    margin-top: 0.5%;
}
#assessment_image > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 25vh;
    max-height: 25vh;
    object-fit: contain;
}
#assessment_image.dd > img, #assessment_image.dp > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 70vh;
    max-height: 70vh;
    object-fit: contain;
}
#assessment_question_answers {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 40vh;
    max-height: 65vh;
    margin-top: 1%;
}
#assessment_question_answers.dd {
    position: absolute;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 70vh;
    max-height: 70vh;
    margin-top: 6%;
    left: 0;
    text-align: left;
}
#assessment_question_answers.dp {
    /*position: absolute;*/
    position: relative;
    float: left;
    width: auto;
    min-width: 21%;
    max-width: 21%;
    height: auto;
    min-height: 70vh;
    max-height: 70vh;
    /*margin-top: 6%;*/
    left: 0;
    text-align: left;
}
.answer_box {
    position: relative;
    float: left;
    width: auto;
    min-width: 17%;
    max-width: 17%;
    height: auto;
    min-height: 70vh;
    max-height: 70vh;
}
.answer_text.dd, .answer_text.dp {
    background-color: #fff;
    min-width: 100%;
    max-width: 100%;
    text-align: center;
    padding: 1%;
    border: 1px solid #192a56;
    margin-bottom: 1%;
}
.answer_text.dd:hover, .answer_text.dp:hover {
    cursor: pointer;
}
.dd_answer {
    position: absolute;
    float: left;
}
.dp_answer {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-bottom: 1%;
}
.dp_answer select {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-right: 1%;
    font-size: 0.7vw;
}
.dp_answer span {
    position: relative;
    float: left;
    width: auto;
    min-width: 83%;
    max-width: 83%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.answer_text_split.dd, .answer_text_split.dp {
    background-color: rgb(0,0,0,0.1);
    outline: 0;
    border: none;
}
#preview_assessment_window_tasks, #launch_assessment_window_tasks {
    display: none;
    position: absolute;
    float: left;
    z-index: 2;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 7vh;
    max-height: 7vh;
    top: 100%;
    background-color: #1d1d1d;
    color: #fff;
}
#preview_assessment_window_complete, #launch_assessment_window_complete {
    position: relative;
    float: right;
    color: rgba(0,128,0,1);
    font-size: 2.5vw;
    outline: 0;
    right: 1%;
    margin-top: 0.5%;
}
#preview_assessment_window_complete:hover, #launch_assessment_window_complete:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.assessment_question_set {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    text-align: left;
    opacity: 0;
}
.assessment_answer {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 5vh;
    padding: 1%;
    text-align: left;
    background-color: #ffffff;
    margin-bottom: 1%;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.8vw;
    word-break: break-word;
}
.assessment_answer:hover {
    cursor: pointer;
    font-weight: bold;
    background-color: #192a561A}
#student_assessment_window {
    border: 2px solid rgba(122, 15, 175, 1);
    box-shadow: 0px 0px 5px 0px #000000;
}
#student_assessment_window_title > i {
    color: rgb(122,15,175);
}
.student_assessment_launch {
    position: relative;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: rgb(0,0,0);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.8vw;
    font-family: 'Roboto', sans-serif;
}
.student_assessment_launch:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.5);
}
.student_assessment_complete > i {
    color: rgb(0, 128, 0);
}
#student_assessment_window_assessmentbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#student_assessment_window_assessmentbar > div {
    position: relative;
    display: inline-block;
    width: 10%;
    height: auto;
    padding: 1%;
    text-align: center;
    border: 1px solid black;
    border-radius: 0px;
    border-bottom: none;
}
#student_assessment_window_assessmentbar > div:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
    font-weight: bold;
}
.student_assessment_active_tab {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
    font-weight: bold;
    border: 2px solid black !important;
    border-bottom: none !important;
}
#student_assessment_window_content_active, #student_assessment_window_content_completed {
    display: none;
}
.student_assessment_active_content {
    display: block !important;
}
.assessment_score_results {
    position: relative;
    float: left;
    padding: 1%;
    width: 98%;
    height: auto;
    text-align: left;
}
.assessment_title {
    position: relative;
    float: left;
    width: 99%;
    height: auto;
    font-size: 1vw;
    padding: 0.5%;
    background-color: #000000;
    color: #ffffff;
    box-shadow: 0px 1px 1px -1px #000000;
}
.assessment_score {
    position: relative;
    float: left;
    width: 99%;
    height: auto;
    color: #7d7d7d;
    font-size: 1vw;
    margin-top: 1%;
}
.assessment_score_left, .assessment_score_center, .assessment_score_right {
    position: relative;
    float: left;
    display: inline-block;
    width: 31%;
    height: auto;
    padding: 1%;
}
.assessment_score_left > div:nth-child(1), .assessment_score_center > div:nth-child(1), .assessment_score_right > div:nth-child(1) {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 1.1vw;
    font-weight: bold;
}
.assessment_score_left > div:nth-child(2), .assessment_score_center > div:nth-child(2), .assessment_score_right > div:nth-child(2) {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 1vw;
    font-weight: bold;
    margin-top: 2%;
}
.assessment_pass {
    background-color: rgb(0,128,0);
    position: relative;
    float: left;
    width: 50%;
    text-align: center;
    font-size: 1.5vw;
    color: #ffffff;
    padding: 6%;
    
}
.assessment_fail {
    background-color: rgb(204,0,0);
    position: relative;
    float: left;
    width: 50%;
    text-align: center;
    font-size: 1.5vw;
    color: #ffffff;
    padding: 6%;
    
}
.assessment_time_spent {
    position: relative;
    float: left;
    width: 100%;
    font-size: 1vw;
    margin-top: 1%;
    font-weight: normal;
}
.assessment_results {
    position: relative;
    float: left;
    width: 98%;
    max-height: 540px;
    text-align: left;
    padding: 1%;
    overflow-y: auto;
}
.assessment_result {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    text-align: left;
}
.assessment_result_left {
    position: relative;
    float: left;
    width: 70%;
    height: auto;
    
    padding: 0.5%;
}
.assessment_result_correct {
    background-color: rgba(0,128,0,0.2);
    border: 2px solid rgba(0,128,0,0.7);
}
.assessment_result_incorrect {
    background-color: rgba(204,0,0,0.2);
    border: 2px solid rgba(204,0,0,0.7);
}
.assessment_result_right {
    position: relative;
    float: left;
    width: 23%;
    height: auto;
    padding: 0.5%;
    margin-left: 2%;
    background-color: rgba(0,0,0,0.1);
    border: 2px solid rgba(0,0,0,0.7);
    
}
.assessment_result_left > div, .assessment_result_right > div {
    position: relative;
    display: inline-block;
    width: 100%;
    height: auto;
    font-size: 0.9vw;
    margin-bottom: 0.5%;
}
.assessment_result_right > div ul {
    margin: 0;
    font-size: 0.8vw;
}
#assessment_results {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    overflow-y: auto;
    max-height: 540px;
}
#new_assessment_window_toolbar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    border-top: 1px solid #d1d1d1;
    padding-top: 0.5%;
}
#new_assessment_window_toolbar > span {
    position: relative;
    float: left;
    width: 96%;
    height: auto;
    font-weight: 700;
    text-decoration: underline;
    color: #fff;
    background-color: rgba(122,15,175,1);
    text-align: center;
    padding: 1%;
    margin-bottom: 1%;
}
#new_assessment_window_toolbar > div {
    position: relative;
    float: left;
    width: 100%;
    height; auto;
}
#new_assessment_window_toolbar > div > span {
    position: relative;
    float: left;
    width: 47%;
    height: auto;
    font-size: 0.9vw;
    padding: 0.5%;
    margin-bottom: 0.5%;
    background-color: rgba(255,255,255,0.5);
    box-shadow: 0px 1px 3px -1px #000000;
}
#new_assessment_window_toolbar button {
    position: relative;
    float: left;
    width: 49%;
    height: auto;
    padding: 2%;
    border: 2px solid #fff;
    background-color: rgba(122,15,175,.5);
    color: #fff;
    
    box-shadow: 0 1px 5px -1px #000;
    font-size: 1vw;
    margin-right: 1%;
    margin-bottom: 1%;
}
#new_assessment_window_toolbar button:hover {
    cursor: pointer;
    background-color: rgba(122,15,175,0.75);
}
#new_assessment_from_content_window {
    top: 0%;
    left: 0%;
    width: auto;
    min-width: 96%;
    max-width: 96%;
    z-index: 1001;
    border: 1px solid #000;
    padding: 1%;
}
#new_assessment_from_content_window_title > img {
    position: relative;
    float: left;
    width: 2%;
    height: auto;
    margin-right: 1%;
}
#new_assessment_from_content_window_title > i {
    color: rgba(122,15,175,0.5);
}
#new_assessment_active_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    max-height: 400px;
    overflow-y: auto;
}
#new_assessment_active_content > ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}
.new_assessment_active_content {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
.new_assessment_active_content_drag {
    position: relative;
    float: left;
    width: 3%;
    height: auto;
    font-size: 0.8vw;
    text-align: center;
    background-color: #1d1d1d;
    color: #fff;
    
    margin-right: 1%;
}
.new_assessment_active_content:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.1);
}
#new_assessment_from_content_window_bottom button {
    display: none;
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 0.5%;
    background-color: rgb(0,125,255);
    color: #ffffff;
    border: 1px solid #fff;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.8vw;
    margin-right: 1%;
}
#new_assessment_from_content_window_bottom button:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.7);
}
.new_assessment_question_item_col1, .edit_assessment_question_item_col1 {
    position: relative;
    float: left;
    width: 2%;
    height: auto;
}
.new_assessment_question_item_col2, .edit_assessment_question_item_col2 {
    position: relative;
    float: left;
    width: 97%;
    height: auto;
    word-break: break-word;
    margin-left: 1%;
    font-size: 0.7vw;
}
.content_directory_bar, .content_site_bar {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    overflow: hidden;
    margin-top: 0% !important;
}
.content_directories, .content_subdirectories {
    display: flex;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    overflow-x: auto;
    padding-bottom: 0.5%;
}
.content_subdirectories {
    display: none;
    margin-top: 0.5%;
}
.content_directory {
    position: relative;
    float: left;
    display: inline-block;
    padding: 0.5%;
    width: auto;
    min-width: 8%;
    max-width: 8%;
    min-height: 6vh;
    max-height: 6vh;
    height: auto;
    text-align: center;
    margin-right: 0.5%;
    flex: 1;
    border: 1px solid #e7e7e7;
}
.content_subdirectory {
    position: relative;
    float: left;
    display: inline-block;
    width: auto;
    min-width: 8%;
    max-width: 8%;
    min-height: 6vh;
    max-height: 6vh;
    height: auto;
    text-align: center;
    margin-right: 0.5%;
    flex: 1;
    border: 1px solid #e7e7e7;
}
.content_directory_name {
    max-width: 100%;
    text-overflow: ellipsis;
}
.content_directory > i {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: rgba(241, 213, 146, 1);
    font-size: 0.8vw;
}
.content_subdirectory > i {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: rgba(241, 213, 146, 1);
    font-size: 0.8vw;
}
.content_directory > span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 0.7vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.content_subdirectory > span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 0.7vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.content_directory:hover, .content_subdirectory:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.05);
}
.content_directory_selected, .content_subdirectory_selected {
    background-color: rgba(0,0,0,0.05);
}
.content_directories::-webkit-scrollbar {
    height: 5px;
}
.content_directories::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
.content_directories::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
.assignment_window_close {
    position: relative;
    float: right;
    font-size: 1vw;
}
.assignment_window_close:hover {
    cursor: pointer;
    color: rgb(0,0,0);
}
#user_favorites_window li {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    border-bottom: 1px solid rgba(0,0,0,.5);
    background-color: #fff;
    list-style: none;
    color: #7d7d7d;
}
#user_favorites_window li > div {
    position: relative;
    float: left;
    display: inline-block;
    height: auto;
}
#user_favorites_window li > div:nth-child(1){
    width: 15%;
}
.favorite_result_cover > i {
    position: absolute;
    z-index: 2;
    font-size: 3.5vw;
    margin-left: 36%;
    margin-top: 13%;
}
.favorite_result_cover > img {
    width: 100%;
    height: auto;
}
#user_favorites_window li > div:nth-child(2){
    width: 31%;
    padding: 1%;
    margin-left: 1%;
}
#user_favorites_window li > div:nth-child(3){
    width: 14%;
}
#user_favorites_window li > div:nth-child(4){
    width: 14%; 
}
#user_favorites_window li > div:nth-child(5){
    width: 16%;
}
#user_favorites_window li > div:nth-child(6){
    width: 5%;
    text-align: center;
    margin-left: 2%;
}
.student_syllabus_launch {
    position: relative;
    width: auto;
    min-width: 50%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    background-color: rgb(0,128,0);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.9vw;
    font-family: 'Roboto', sans-serif;
}
.student_syllabus_launch:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.5);
}
#view_content_notes {
    display: none;
}
#video_comments {
    text-align: center !important;
}
#add_content_questions, #view_content_notes, #learning_obj, #description, #add_project_folder, #external_video_options, #video_comments, #asset_fullscreen {
    position: relative;
    display: inline-block;
    float: left;
    width: auto;
    min-width: 12%;
    max-width: 17%;
    height: auto;
    background-color: transparent;
    color: #fff;
    font-size: 0.7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    min-height: 2.3vh;
    max-height: 2.3vh;
}
#add_content_questions:hover, #view_content_notes:hover, #learning_obj:hover, #description:hover, #add_project_folder:hover, #external_video_options:hover, #video_comments:hover, #asset_fullscreen:hover {
    cursor: pointer;
    font-weight: bold;
}
.result_cover > i.result_info_circle {
    position: absolute;
    color: rgb(255,255,255);
    font-size: 1vw;
    float: right;
    right: 1%;
    bottom: 2%;
}
.result_cover > i.result_info_circle:hover {
    color: rgba(255,255,255,0.5);
    cursor: pointer;
}
#pop_quiz_bottom, #assessment_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 60%;
    max-width: 60%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    margin-left: 21%;
}
#pop_quiz_bottom {
    margin-left: 40%;
}
#pop_quiz_submit, #assessment_submit {
    position: relative;
    float: right;
    right: 0%;
    width: auto;
    min-width: 10%;
    padding: 1%;
    height: auto;
    max-width: 25%;
    font-size: 1vw;
    color: #fff;
    background-color: #192a56;
    border: none;
    box-shadow: 0px 1px 3px -1px #000;
}
#pop_quiz_submit:hover, #assessment_submit:hover {
    cursor: pointer;
    background-color: #192a56;
    font-weight: bold;
}
.new_assessment_question_section, .edit_assessment_question_section {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
}
.new_assessment_question_section_heading, .edit_assessment_question_section_heading {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    border-bottom: 2px solid #000;
    padding-bottom: 0.5%;
}
.new_assessment_question_section_heading > span:nth-child(1), .edit_assessment_question_section_heading > span:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    max-width: 50%;
    height: auto;
    color: #000;
    font-weight: bold;
    font-size: 0.7vw;
}
.new_assessment_question_section_heading > img, .edit_assessment_question_section_heading > img {
    position: relative;
    float: left;
    width: 2.5%;
    height: auto;
    margin-right: 1%;
}
.new_assessment_question_section_heading > button, .edit_assessment_question_section_heading > button {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    color: #fff;
    background-color: #1d1d1d;
    box-shadow: 0px 1px 3px -1px #000;
    border: none;
    outline: none;
    margin-left: 1%;
}
.new_assessment_question_section_heading > button:hover, .edit_assessment_question_section_heading > button:hover {
    cursor: pointer;
    background-color: rgb(0,0,0,0.7);
}
.new_assessment_question_section_questions, .edit_assessment_question_section_questions {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#new_assessment_num_random_questions, #edit_assessment_num_random_questions {
    position: relative;
    float: left;
    width: auto;
    min-width: 22%;
    font-size: 0.7vw;
    text-align: center;
    border: none;
    color: #000;
}
.menu_section {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 8vh;
    max-height: 23vh;
    padding: 1%;
    font-size: 0.8vw;
    margin-top: 1%;
    color: #000000;
    margin-bottom: 2%;
}
.menu_section ul {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 8vh;
    max-height: 23vh;
    margin: 0;
    padding: 0;
    list-style: none;
}
.menu_section ul > li {
    position: relative;
    float: left;
    width: auto;
    min-width: 84%;
    max-width: 84%;
    height: auto;
    margin-bottom: 2%;
    padding: 1%;
    background-color: #0000001A;
    margin-left: 10%;
    padding-left: 5%;
    color: #ffffff;
}
.menu_section ul > li:hover {
    cursor: pointer;
}
.menu_section_active {
    font-weight: bold;
}
.menu_section_item:before {
    background-color: #f5f6fe;
    content: ' ';
    display: inline-block;
    height: inherit;
    left: 1%;
    margin-top: -0.5rem;
    position: absolute;
    width: 3px;
    height: 3vh;
    border-radius: 1rem;
}
.menu_section i {
    font-size: 0.8vw !important;
    color: rgb(0,0,0,0.75);
}
#content_left_screen {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    min-height: 97vh;
    max-height: 97vh;
    padding: 0.5%;
    background-color: #fff;
    margin-top: 0.5%;
    margin-left: 0.5%;
    margin-right: 0.5%;
    box-shadow: 0px 1px 1px -1px #000;
    color: #000;
    font-size: 0.7vw;
    opacity: 0;
}
#content_left_screen_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-bottom: 0.5%;
    padding-bottom: 0.5%;
    border-bottom: 2px solid #192a56;
}
#content_left_screen_title {
    position: relative;
    float: left;
    width: auto;
    min-width: 45%;
    max-width: 45%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-weight: bold; 
}
#content_left_screen_title img {
    position: relative;
    float: left;
    width: 8%;
    height: auto;
    margin-right: 3%;
}
#content_left_screen i {
    font-size: 0.6vw;
    margin-left: 1%;
}
#content_left_screen_top button {
    position: relative;
    float: right;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-left: 1%;
    outline: 0;
    border: none;
    font-size: 0.7vw;
    letter-spacing: 1.5px;
    box-shadow: 0px 1px 2px -1px #000;
}
#content_left_screen_cancel{
    background-color: rgba(204,0,0,1);
    color: #fff;
}
#content_left_screen_save {
    background-color: rgba(0,128,0,1);
    color: #fff;
}
#content_left_screen_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.5);
    color: #fff;
}
#content_left_screen_save:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.5);
    color: #fff;
}
#content_left_screen_search {
    display: block;
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    margin-bottom: 0.5%;
}
#resource_search {
    position: relative;
    float: left;
    width: auto;
    min-width: 97%;
    max-width: 97%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    padding-left: 2%;
    font-family: 'Roboto', sans-serif;
    font-size: 0.7vw;
    letter-spacing: 1px;
    border: 1px solid #e7e7e7;
}
#content_left_screen_addset {
    display: none;
    position: relative;
    float: right;
    width: auto;
    min-width: 4%;
    max-width: 4%;
    height: auto;
    text-align: center;
    margin-left: 1%;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.8vw;
}
#content_left_screen_addset:hover {
    cursor: pointer;
    color: #d7d7d7;
}
#content_left_screen_assessment_build_option {
    position: relative;
    float: left;
    width: auto;
    min-width: 40%;
    max-width: 40%;
    font-size: 0.7vw;
    background-color: rgb(0,0,0);
    color: #fff;
    border: none;
    padding: 0.3%;
    box-shadow: 0px 1px 3px -1px #000;
    margin-right: 1%;
    margin-top: 1%;
}
#content_left_screen_assessment_build_option:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.8);
}
.content_left_screen_next {
    position: relative;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    font-size: 0.7vw;
    background-color: rgb(0,125,255);
    color: #fff;
    border: none;
    outline: 0;
    box-shadow: 0px 1px 2px -1px #000;
    margin-top: 1%;
    letter-spacing: 1.5px;
}
.content_left_screen_next:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.75);
}
#content_left_screen_info {
    position: relative;
    float: left;
    padding: 1%;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    margin-bottom: 1%;
}
#content_left_screen_info_col1, #content_left_screen_info_col2 {
    position: relative;
    float: left;
    height: auto;
}
#content_left_screen_info_col1 {
    min-width: 30%;
    max-width: 30%;
    margin-right: 1%;
}
#content_left_screen_info_col2 {
    min-width: 69%;
    max-width: 69%;
}
#content_left_resource_name {
    min-width: 92%;
    max-width: 92%;
}
#content_left_resource_name > span {
    position: relative;
    float: left;
    max-width: 92%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
#content_left_screen_info_bar {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 2%;
}
#content_left_screen_info_bar > label {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    margin-right: 5%;
}

#content_left_screen_info_bar > span {
    position: relative;
    float: left;
    width: 70%;
    height: auto;
}
#content_left_screen_info_bar > div {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.content_left_screen_info_right {
    position: relative;
    float: right;
    width: auto;
    min-width: 45%;
    max-width: 45%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
#content_left_screen_info_bar > div > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
}
#content_left_screen_info_bar > div label {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 30%;
    height: auto;
}
#content_left_screen_info_bar > div > input[type='radio'] {
    position: relative;
    float: left;
    width: auto;
    margin-right: 5%;
}
.content_left_screen_full {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    border-top: 1px solid #e7e7e7;
    padding-top: 2%;
}
.content_left_descr_update {
    position: relative;
    float: right;
    right: 5%;
    font-size: 0.8vw;
    color: #fff;
    background-color: rgb(0,125,255);
    box-shadow: 0px 1px 5px -1px #000000;
    border: none;
    padding: 0.5%;
    width: auto;
    min-width: 15%;
    max-width: 15%;
}
.content_left_descr_update:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.7);
}
.user_course_score {
    min-width: 15% !important;
    max-width: 15% !important;
    text-align: center;
}
#content_left_screen_info_col1 > label, #content_left_screen_info_col2 > label {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 1.5vh;
    max-height: 1.5vh;
}
#content_left_screen_info_col1 > span, #content_left_screen_info_col2 > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 1.5vh;
    max-height: 1.5vh;
}
#content_left_screen_info input[type='text'], #content_left_screen_info textarea, #content_left_screen_info select {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-bottom: 1%;
    padding: 0;
    outline: none;
    border: 0.5px solid #e7e7e7;
    font-size: 0.7vw;
    font-family: 'Roboto', sans-serif;
    color: #000;
}
#content_left_screen_info select {
    min-height: 2.3vh !important;
    max-height: 2.3vh !important;
}
#content_left_screen_data_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    height: auto;
    max-height: 81vh;
    overflow-x: hidden;
    overflow-y: auto;
    padding-bottom: 1%;
}
#content_left_screen_data_container_items {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 81vh;
    max-height: 81vh;
}
#content_left_screen_data {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 65vh;
    max-height: 89vh;
    background-color: #fff;
    border: 2px dashed #192a56;
    overflow-x: hidden;
    overflow-y: auto;
}
#content_left_screen_data > span, #content_left_screen_data_container_items > span {
    position: relative;
    float: left;
    color: #000000;
    font-weight: bold;
    font-size: 0.7vw;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    text-align: center;
    margin-top: 70%;
    line-height: 2;
}
#content_right_options {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    margin-bottom: 0.5%;
}
#content_view_directories {
    position: relative;
    float: left;
    width: auto;
    min-width: 9%;
    max-width: 9%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    margin-right: 0.5%;
    margin-top: 0.5%;
    background-color: #fff;
}
.content_view_directories_resize {
    min-height: 2.7vh !important;
    max-height: 2.7vh !important;
}
#content_view_directories:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.7);
}
#content_view_directory_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 35%;
    max-width: 35%;
    height: auto;
    max-height: 3vh;
}
#content_view_directory_left img {
    max-width: 100%;
    max-height: 100%;
    max-height: 3vh;
}
#content_view_directory_left i {
    position: relative;
    float: right;
    margin-top: 13%;
    left: -20%;
    color: #000;
}
#content_view_directory_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 65%;
    max-width: 65%;
    height: auto;
    max-height: 3vh;
}
#content_view_directory_right > span {
    position: relative;
    float: left;
    margin-top: 6%;
    font-size: 0.7vw;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 96%;
    color: #000;
}
#content_view_filter {
    position: relative;
    float: left;
    width: auto;
    min-width: 6.5%;
    max-width: 10.5%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    background-color: #fff;
    color: #000;
    margin-top: 0.5%;
    padding: 0.3%;
}
#content_view_filter:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.7);
}
#content_view_filter > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    padding: 1%;
}
#content_view_search {
    position: relative;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    padding: 0.5%;
}
#content_view_sort {
    position: relative;
    float: left;
    width: auto;
    min-width: 3.5%;
    max-width: 6.5%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    background-color: #fff;
    color: #000;
    margin-top: 0.5%;
    padding: 0.3%;
    margin-left: 0.5%;
}
#content_view_sort:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.7);
}
#content_view_sort > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    padding: 1%;
}
#content_view_level {
    position: relative;
    float: left;
    width: auto;
    min-width: 3.5%;
    max-width: 6.5%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    background-color: #fff;
    color: #000;
    margin-top: 0.5%;
    padding: 0.3%;
    margin-left: 0.5%;
}
#content_view_level:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.7);
}
#content_view_level > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    padding: 1%;
}
#content_view_resultnum {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 3.5%;
    max-width: 11.5%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    background-color: #192a56BF;
    color: #fff;
    margin-top: 0.5%;
    padding: 0.3%;
    margin-left: 0.5%;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    opacity: 0;
}
#content_view_option {
    position: relative;
    float: right;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    padding: 0.8%;
}
.content_view_option {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    border: none;
    margin-left: 1%;
    outline: none;
}
#content_view_option button:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.5);
}
.content_view_selected {
    background-color: rgba(255,255,255,0.5) !important; 
}
#favorites_view {
    display: none;
    position: relative;
    float: right;
    width: auto;
    min-width: 25%;
    height: auto;
    border: none;
    background-color: #fff;
    border-radius: 2px;
    margin-left: 1%;
    font-size: 0.7vw;
    outline: none;
}
.favorite_view_selected {
    color: rgb(204,0,0);
}
#project_folder_view {
    position: relative;
    float: right;
    width: auto;
    min-width: 25%;
    height: auto;
    border: none;
    background-color: #fff;
    border-radius: 2px;
    margin-left: 1%;
    font-size: 0.7vw;
    outline: none;
}
.project_folder_view_selected {
    color: rgb(0,125,255);
}
#project_folder_view_badge {
    position: relative;
    width: auto;
    font-size: 0.7vw;
}
.list_result_heading {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-size: 0.8vw;
    color: #000;
    background-color: #fff;
    box-shadow: 0px 1px 2px -1px #000;
    margin-bottom: 0.5%;
    margin-top: 0.5%;
}
.list_result_heading > div {
    position: relative;
    float: left;
    padding: 0.8%;
}
.list_result {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 0.8vw;
    color: #000;
}
.list_result:nth-child(odd){
    background-color: #fff;
}
.list_result:nth-child(even){
    background-color: #e4e4e4;
}
.list_result > div {
    position: relative;
    float: left;
    padding: 0.8%;
}
.list_result > .list_result_col1 > i:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.5);
}
.list_result_heading > div:nth-child(1), .list_result > div:nth-child(1){
    width: 2%;
    max-width: 2%;
    min-width: 2%;
    text-align: center;
}
.list_result_heading > div:nth-child(2), .list_result > div:nth-child(2){
    width: 20%;
    max-width: 20%;
    min-width: 20%;
    text-align: left;
    word-break: break-word;
}
.list_result_heading > div:nth-child(3), .list_result > div:nth-child(3){
    text-align: center;
    max-width: 5%;
    min-width: 5%;
    width: auto;
}
.list_result_heading > div:nth-child(4), .list_result > div:nth-child(4){
    text-align: center;
    max-width: 4%;
    min-width: 4%;
    width: auto;
}
.list_result_heading > div:nth-child(5), .list_result > div:nth-child(5){
    text-align: center;
    width: 11%;
    max-width: 11%;
    min-width: 11%;
    word-break: break-word;
}
.list_result_heading > div:nth-child(6), .list_result > div:nth-child(6){
    text-align: center;
    max-width: 4%;
    min-width: 4%;
    width: auto;
}
.list_result_heading > div:nth-child(7), .list_result > div:nth-child(7){
    text-align: left;
    width: auto;
    max-width: 10%;
    min-width: 10%;
    word-break: break-word;
}
.list_result_heading > div:nth-child(8), .list_result > div:nth-child(8){
    text-align: center;
    max-width: 8%;
    width: auto;
}
.list_result_heading > div:nth-child(9), .list_result > div:nth-child(9){
    text-align: center;
    max-width: 7%;
    width: auto;
}
.list_result_heading > div:nth-child(10), .list_result > div:nth-child(10){
    text-align: center;
    max-width: 7%;
    width: auto;
}
.list_result_heading > div:nth-child(11), .list_result > div:nth-child(11){
    text-align: center;
    max-width: 2%;
    width: auto;
}
.unrated {
    color: #d3d3d3;
}
.menu_item {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding-top: 2%;
    padding-bottom: 2%;
    font-size: 0.8vw;
    margin-bottom: 5%;
    color: #ffffff;
}
.menu_item:hover {
    cursor: pointer;
    background-color: #192a56BF;
}
.menu_item-active {
    background-color: #192a56;
    box-shadow: 1px 1px 2px -1px #000000;
    font-weight: bold;
}
.menu_item > span > img {
    position: relative;
    float: left;
    max-width: 75%;
    max-height: 100%;
}
.menu_item > span:nth-child(1){
    position: relative;
    float: left;
    width: auto;
    min-width: 7%;
    max-width: 7%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-left: 5%;
}
.menu_item > span:nth-child(2){
    position: relative;
    float: left;
    width: auto;
    min-width: 83%;
    max-width: 83%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-left: 5%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.menu_item > span:nth-child(3){
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    text-align: center;
    margin-left: 1%;
}
#student_courses > span:nth-child(2), #student_assessments > span:nth-child(2), #student_boosters > span:nth-child(2) {
    margin-top: 1%;
}
.new_content_item {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding-bottom: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    box-shadow: 0px 1px 1px -1px #000;
}
.new_content_item > div {
    position: relative;
    float: left;
    width: 25%;
    height: auto;
}
.new_content_item > div:nth-child(4){
    width: 15%;
}
.new_content_item .cover {
    width: 35%;
}
.new_content_item .cover img {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.new_content_item .cover i {
    position: absolute;
    text-align: center;
    font-size: 1.5vw;
    z-index: 1;
    width: 100%;
    margin-top: 20%;
    color: rgba(255,255,255,0.7);
}
.new_content_item .cover i:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
.new_content_item > div > span {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    padding-top: 30%;
}
.new_content_item_remove {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    margin-top: 50%;
    color: rgb(204,0,0);
    font-size: 1vw;
}
.new_content_item_remove:hover {
    cursor: pointer;
    rgba(204,0,0,0.5);
}
#menu_item_directories {
    display: none;
    position: absolute;
    float: left;
    left: 14%;
    width: auto;
    height: auto;
    min-width: 12%;
    max-width: 12%;
    background-color: #1d1d1d;
    color: #ffffff;
    font-size: .7vw;
    z-index: 101;
    box-shadow: 0px 0px 1px -1px #000000;
    padding: 0.5%;
}
#menu_item_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.menu_item_directories {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-bottom: 1%;
}
.menu_item_directories:hover {
    cursor: pointer;
}
.menu_item_directories > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.menu_item_directories > span > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    max-height: 2vh;
}
.menu_item_directories > span > span:first-of-type {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 65%;
    max-width: 65%;
    min-height: 2vh;
    max-height: 2vh;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.menu_item_window {
    display: none;
    position: relative;
    color: #ffffff;
    min-width: 100%;
    max-width: 100%;
    width: auto;
    height: auto;
    opacity: 0;
    margin-top: 2%;
    padding-left: 5%;
}
.menu_item_subdirectories {
    position: relative;
    float: left;
    width: auto;
    min-width: 95%;
    max-width: 95%;
    height: auto;
    list-style: none;
    margin: 0;
    padding: 0;
    background-color: rgba(0,0,0,0.05);
}
.menu_item_subdirectories > li {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    margin-bottom: 1%;
}
.menu_item_subdirectories > li:hover {
    background-color: #d7d7d7;
    cursor: pointer;
}
.menu_item_subdirectory > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    max-height: 2vh;
}
.menu_item_subdirectory > span:first-of-type {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 65%;
    max-width: 65%;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.content_left_logo {
    position: relative;
    float: left;
    width: 10%;
}
.user_playlist {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
    padding: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.user_playlist .user_playlist_descr {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.user_playlist > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.user_playlist > div:nth-child(1) > div:nth-child(1) {
    position: relative;
    float: left;
    font-weight: bold;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
}
.user_playlist > div:nth-child(1) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 1%;
    margin-top: 1%;  
}
.user_playlist > div:nth-child(1) > div:nth-child(3) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_playlist > div:nth-child(1) > div:nth-child(4) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_playlist > div:nth-child(1) > div:nth-child(5) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_playlist_edit, .student_playlist_edit {
    color: rgb(0,128,0);
}
.user_playlist_edit:hover, .student_playlist_edit {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.user_playlist_delete, .student_playlist_delete {
    color: rgb(204,0,0);
}
.user_playlist_delete:hover, .student_playlist_delete {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.user_playlist_play, .student_playlist_play {
    position: relative;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 0%;
    background-color: rgb(0, 125, 255);
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.7vw;
    outline: 0;
    letter-spacing: 1.5px;
}
.user_playlist_play:hover, .student_playlist_play {
    cursor: pointer;
    background-color: rgba(0,125,255,0.7);
}
.user_playlist_link {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 45%;
    max-width: 45%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: roboto,sans-serif;
    outline: 0;
    border: 0;
    padding: 0;
    box-shadow: 0 1px 2px -1px #000;
    transition: all .5s;
    background-color: rgb(0,0,0);
}
.user_playlist_link:hover {
    background-color: rgba(0,0,0,0.8);
    cursor: pointer;
}
.user_course_link, .user_assessment_link {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 45%;
    max-width: 45%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: roboto,sans-serif;
    outline: 0;
    border: 0;
    padding: 0;
    box-shadow: 0px 1px 3px -1px #000;
    transition: all .5s;
    background-color: rgb(0,0,0);
}
.user_course_link:hover, .user_assessment_link:hover {
    background-color: rgba(0,0,0,0.7);
    cursor: pointer;
}
.user_course_link.disabled, .user_assessment_link.disabled {
    pointer-events: none;
    background-color: rgba(0,0,0,0.5);
}
.pitem {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 7.5vh;
    max-height: 7.5vh;
    padding: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    box-shadow: 0px 1px 1px -1px #000;
}
.pitem > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    min-height: 7.5vh;
    max-height: 7.5vh;
    margin-right: 1%;
}
.pitem > div:nth-child(4){
    min-width: 11%;
    max-width: 11%;
}
.pitem .cover {
    min-width: 35%;
    max-width: 35%;
}
.pitem .cover img {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    max-height: 7.5vh;
}
.pitem .cover i {
    position: absolute;
    text-align: center;
    font-size: 1.1vw !important;
    z-index: 1;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    margin-top: 23%;
    color: rgba(255,255,255,0.4);
}
.pitem .cover i:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
.pitem > div > span {
    position: relative;
    float: left;
    text-align: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.pitem > div > i {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
}
.favorite_remove {
    position: relative;
    float: left;
    text-align: center;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    margin-top: 5%;
    color: rgb(204,0,0);
}
.favorite_remove:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.5);
}
.playlist_remove {
    position: relative;
    float: left;
    text-align: center;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    margin-top: 5%;
    color: rgb(204,0,0);
}
.playlist_remove:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.5);
}
.user_syllabus {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
    padding: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.user_syllabus .user_syllabus_descr {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.user_syllabus > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.user_syllabus > div:nth-child(1) > div:nth-child(1) {
    position: relative;
    float: left;
    font-weight: bold;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw; 
}
.user_syllabus > div:nth-child(1) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 1%;
    margin-top: 1%;  
}
.user_syllabus > div:nth-child(1) > div:nth-child(3) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_syllabus > div:nth-child(1) > div:nth-child(4) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_syllabus > div:nth-child(1) > div:nth-child(5) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_syllabus_edit {
    color: rgb(0,128,0);
}
.user_syllabus_edit:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.user_syllabus_delete {
    color: rgb(204,0,0);
}
.user_syllabus_delete:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.user_syllabus_launch {
    position: relative;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 0%;
    background-color: rgb(0, 125, 255);
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.7vw;
    outline: 0;
    letter-spacing: 1.5px;
}
.user_syllabus_launch:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.7);
}
.syllabus_notes {
    position: absolute;
    float: left;
    text-align: right;
    width: auto;
    min-width: 4%;
    max-width: 4%;
    height: auto;
    margin-top: 40%;
    color: rgb(0,128,0);
}
.syllabus_notes:hover {
    cursor: pointer;
    rgba(0,128,0,0.5);
}
.user_course {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
    padding: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.user_course > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.user_course > div:nth-child(1) > div:nth-child(1) {
    position: relative;
    float: left;
    font-weight: bold;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
}
.user_course > div:nth-child(1) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 1%;
    margin-top: 1%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.user_course > div:nth-child(1) > div:nth-child(3) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_course > div:nth-child(1) > div:nth-child(4) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_course > div:nth-child(1) > div:nth-child(5) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_course .user_course_descr {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.user_course_edit {
    color: rgb(0,128,0);
}
.user_course_edit:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.user_course_delete {
    color: rgb(204,0,0);
}
.user_course_delete:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.user_course_preview {
    position: relative;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 0%;
    background-color: rgb(0, 125, 255);
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.7vw;
    outline: 0;
    letter-spacing: 1.5px;
}
.user_course_preview:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.7);
}
.user_course_link, .user_assessment_link {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 45%;
    max-width: 45%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: roboto,sans-serif;
    outline: 0;
    border: 0;
    padding: 0;
    box-shadow: 0 1px 2px -1px #000;
    transition: all .5s;
    background-color: rgb(0,0,0);
}
.course_remove:hover, .course_certificate_remove:hover, .send_course_data_remove:hover, .send_assessment_data_remove:hover {
    cursor: pointer;
    rgba(204,0,0,0.5);
}
.course_item_add_quiz, .course_item_add_certificate, .course_item_send_lms, .assessment_item_send_lms, .course_item_scorm_download {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 28%;
    height: auto;
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.6vw;
    
    letter-spacing: 1.5px;
}
.course_item_add_quiz:hover, .course_item_add_certificate:hover, .course_item_send_lms:hover, .assessment_item_send_lms:hover, .course_item_scorm_download:hover {
    cursor: pointer;
    opacity: 0.75;
}
.course_item_add_quiz, .course_item_add_certificate, .course_item_send_lms, .assessment_item_send_lms, .course_item_scorm_download {
    background-color: #000;
    margin-left: 1%;
    margin-right: 1%;
    font-size: 0.6vw;
}
#content_left_screen textarea { 
    min-height: 3vh;
    max-height: 3vh;
    resize: none;
    margin-top: 1%;
    letter-spacing: 1.5px;
}
.list_result_drag {
    background-color: rgb(255,255,255);
    font-size: 0.8vw;
    font-weight: bold;
    color: #000;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    padding: 1%;
    
}
.list_result_drag span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.list_result_drag img {
    position: relative;
    float: left;
    margin-top: 1%;
    width: 100%;
    height: auto;
}
.scroll_text {
    overflow-x: hidden;
    white-space: nowrap;
}
.result_resize {
    height: auto;
    min-height: 15vh;
    max-height: 15vh;
    min-width: 17%;
    max-width: 17%;
    margin-right: 1%;
}
.result_cover_resize {
    height: auto;
    min-height: 12vh;
    max-height: 12vh !important;
}
.result_cover_resize i:nth-child(1) {
    font-size: 2vw !important;
}
.new_build_option, .edit_build_option {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 18vh;
    max-height: 18vh;
    padding-bottom: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    box-shadow: 0px 1px 1px -1px #000;
}
.new_build_option > div, .edit_build_option > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 18vh;
    max-height: 18vh;
}
.new_build_option > div > button, .edit_build_option > div >button {
    position: relative;
    float: left;
    width: auto;
    margin-left: 5%;
    min-width: 90%;
    max-width: 90%;
    padding: 1%;
    color: #fff;
    background-color: rgb(0, 125, 255);
    margin-top: 30%;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.7vw;
    
    border: none;
}
.new_build_option > div > button:hover, .edit_build_option > div > button:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.75);
}
.new_build_option > div > span, .edit_build_option > div > span {
    position: relative;
    float: left;
    text-align: left;
    width: auto;
    min-width: 95%;
    max-width: 95%;
    padding: 1%;
    padding-left: 3%;
}
.create_assessment_content_item {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding-bottom: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    box-shadow: 0px 1px 1px -1px #000;
}
.create_assessment_content_item > div {
    position: relative;
    float: left;
    width: auto;
    height: auto;
}
.create_assessment_content_item > div:nth-child(1) {
    max-width: 10%; 
}
.create_assessment_content_item > div:nth-child(2) {
    max-width: 55%;
    min-width: 60%;
    padding: 2%;
}
.create_assessment_content_item > div:nth-child(3) {
    width: 10%;
    padding: 2%;
    font-size: 0.8vw;
    text-align: center;
}
.create_assessment_content_item > div:nth-child(4) {
    width: 10%;
    padding: 2%;
    font-size: 0.8vw;
    text-align: center;
    color: rgb(204,0,0);
}
.create_assessment_content_item > div > img {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.create_assessment_content_item_remove:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.user_assessment {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
    padding: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.user_assessment > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.user_assessment > div:nth-child(1) > div:nth-child(1) {
    position: relative;
    float: left;
    font-weight: bold;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
}
.user_assessment > div:nth-child(1) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 1%;
    margin-top: 1%;
}
.user_assessment > div:nth-child(1) > div:nth-child(3) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_assessment > div:nth-child(1) > div:nth-child(4) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_assessment > div:nth-child(1) > div:nth-child(5) {
    position: relative;
    float: left;
    width: auto;
    min-width: 33%;
    max-width: 33%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_assessment_edit {
    color: rgb(0,128,0);
}
.user_assessment_edit:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.user_assessment_delete {
    color: rgb(204,0,0);
}
.user_assessment_delete:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.user_assessment_preview {
    position: relative;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 0%;
    background-color: rgb(0, 125, 255);
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.7vw;
    outline: 0;
    letter-spacing: 1.5px;
    
}
.user_assessment_preview:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.7);
}
.assessment_remove, .assessment_certificate_remove {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    margin-top: 20%;
    color: rgb(204,0,0);
    font-size: 1vw;
}
.assessment_remove:hover, .assessment_certificatee_remove:hover {
    cursor: pointer;
    rgba(204,0,0,0.5);
}
.new_assessment_content_item {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    margin-right: 0%;
    margin-left: 0%;
    height: auto;
    min-height: 8.1vh;
    max-height: 8.1vh;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    box-shadow: 0px 1px 1px -1px #000;
    padding: 1%;
}
.new_assessment_content_item > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 8.1vh;
    max-height: 8.1vh;
}
.new_assessment_content_item > div:nth-child(3){
    min-width: 15% !important;
    max-width: 15% !important;
}
.new_assessment_content_item .cover {
    min-width: 35%;
    max-width: 35%;
    height: auto;
    min-height: 8.1vh;
    max-height: 8.1vh;
}
.new_assessment_content_item .cover img {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.new_assessment_content_item .cover i {
    position: absolute;
    text-align: center;
    font-size: 1.5vw !important;
    z-index: 1;
    width: 100%;
    margin-top: 20%;
    color: rgba(255,255,255,0.7);
}
.new_assessment_content_item .cover i:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
.new_assessment_content_item > div > span {
    position: relative;
    float: left;
    text-align: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%
}
.new_assessment_content_item_remove {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    margin-top: 50%;
    color: rgb(204,0,0);
    font-size: 1vw;
}
.new_assessment_content_item_remove:hover {
    cursor: pointer;
    rgba(204,0,0,0.5);
}
#new_assignment_window {
    top: 0%;
    left: 0%;
    width: 98%;
    z-index: 1001;
    border: 2px solid #000;
    
    padding: 1%;
}
#new_assignment_window_top > img {
    position: relative;
    float: left;
    width: 2.5%;
    margin-right: 1%;
}
#new_assignment_window_title {
    position: relative;
    float: left;
    width: auto;
    color: #fff;
}
.assignment_directory_content_item:hover {
    cursor: pointer;
}
.create_assignment_content_item {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding-bottom: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    box-shadow: 0px 1px 1px -1px #000;
}
.create_assignment_content_item > div {
    position: relative;
    float: left;
    height: auto;
}
.create_assignment_content_item > div:nth-child(1){
    width: 8%;
}
.create_assignment_content_item > div:nth-child(2){
    width: 70%;
}
.create_assignment_content_item > div:nth-child(2) > span {
    margin-left: 5%;
    margin-top: 3%;
}
.create_assignment_content_item > div:nth-child(3){
    width: 10%;
}
.create_assignment_content_item > div:nth-child(3) > span {
    margin-top: 20%;
}
.create_assignment_content_item > div:nth-child(4){
    width: 10%;
}
.create_assignment_content_item .cover {
    width: 35%;
}
.create_assignment_content_item .cover img {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.create_assignment_content_item .cover i {
    position: absolute;
    text-align: center;
    font-size: 1.5vw;
    z-index: 1;
    width: 100%;
    margin-top: 20%;
    color: rgba(255,255,255,0.7);
}
.create_assignment_content_item .cover i:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
.create_assignment_content_item > div > span {
    position: relative;
    float: left;
    text-align: left;
    width: 95%;
}
.create_assignment_content_item_remove {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    margin-top: 25%;
    color: rgb(204,0,0);
    font-size: 1vw;
}
.create_assignment_content_item_remove:hover {
    cursor: pointer;
    rgba(204,0,0,0.5);
}
.new_assignment_content_item img, .added_assignment_content_item img {
    position: relative;
    float: left;
    width: 2%;
    height: auto;
    margin-right: 1%;
}
.user_assignment > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.user_assignment > div:nth-child(1) > div:nth-child(1) {
    position: relative;
    float: left;
    font-weight: bold;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
}
.user_assignment > div:nth-child(1) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 1%;
    margin-top: 1%;
}
.user_assignment > div:nth-child(1) > div:nth-child(3) {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_assignment > div:nth-child(1) > div:nth-child(4) {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_assignment_edit {
    color: rgb(0,128,0);
}
.user_assignment_edit:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.user_assignment_delete {
    color: rgb(204,0,0);
}
.user_assignment_delete:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
#new_lessonplan_window_content > div {
    position: relative;
    float: left;
    width: 24%;
    height: auto;
    margin-right: 1%;
}
#new_lessonplan_window_content > div::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
#new_lessonplan_window_content > div ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
#new_lessonplan_window_content > div::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
#new_lessonplan_window_content ul {
    position: relative;
    float: left;
    width: 99%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}
#new_lessonplan_window_content ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.lessonplan_content_course {
    position: relative;
    float: left;
    width: 97% !important;
    height: auto;
    padding: 1%;
    border: 1px solid black;
    
    margin-bottom: 0.5%;
}
.lessonplan_content_course img {
    position: relative;
    float: left;
    width: 6%;
    height: auto;
    margin-right: 1%;
}
.lessonplan_content_course > div:nth-child(1){
    color: rgb(0,0,0);
}
.lessonplan_content_syllabus {
    position: relative;
    float: left;
    width: 97% !important;
    height: auto;
    padding: 1%;
    border: 1px solid black;
    
    margin-bottom: 0.5%;
}
.lessonplan_content_syllabus img {
    position: relative;
    float: left;
    width: 6%;
    height: auto;
    margin-right: 1%;
}
.lessonplan_content_syllabus > div:nth-child(1){
    color: rgb(0,128,0);
}
.lessonplan_content_assessment {
    position: relative;
    float: left;
    width: 97% !important;
    height: auto;
    padding: 1%;
    border: 1px solid black;
    
    margin-bottom: 0.5%;
}
.lessonplan_content_assessment img {
    position: relative;
    float: left;
    width: 6%;
    height: auto;
    margin-right: 1%;
}
.lessonplan_content_assessment > div:nth-child(1){
    color: rgb(122, 15, 175);
}
.lessonplan_content_course:hover, .lessonplan_content_syllabus:hover, .lessonplan_content_assessment:hover {
    box-shadow: 0px 0px 5px 0px #000000;
}
.create_lessonplan_content_item {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding-bottom: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    box-shadow: 0px 1px 1px -1px #000;
}
.create_lessonplan_content_item > div {
    position: relative;
    float: left;
    height: auto;
}
.create_lessonplan_content_item > div:nth-child(1){
    width: 8%;
}
.create_lessonplan_content_item > div:nth-child(2){
    width: 70%;
}
.create_lessonplan_content_item > div:nth-child(2) > span {
    margin-left: 5%;
    margin-top: 3%;
}
.create_lessonplan_content_item > div:nth-child(3){
    width: 10%;
}
.create_lessonplan_content_item > div:nth-child(3) > span {
    margin-top: 20%;
}
.create_lessonplan_content_item > div:nth-child(4){
    width: 10%;
}
.create_lessonplan_content_item .cover {
    width: 35%;
}
.create_lessonplan_content_item .cover img {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.create_lessonplan_content_item .cover i {
    position: absolute;
    text-align: center;
    font-size: 1.5vw;
    z-index: 1;
    width: 100%;
    margin-top: 20%;
    color: rgba(255,255,255,0.7);
}
.create_lessonplan_content_item .cover i:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
.create_lessonplan_content_item > div > span {
    position: relative;
    float: left;
    text-align: left;
    width: 95%;
}
.create_lessonplan_content_item_remove {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    margin-top: 25%;
    color: rgb(204,0,0);
    font-size: 1vw;
}
.create_lessonplan_content_item_remove:hover {
    cursor: pointer;
    rgba(204,0,0,0.5);
}
.user_lessonplan {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding-top: 1%;
    padding-bottom: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    box-shadow: 0px 1px 1px -1px #000;
}
.user_lessonplan > div:nth-child(1){
    position: relative;
    float: left;
    width: 10%;
    height: auto;
} 
.user_lessonplan > div:nth-child(2) {
    position: relative;
    float: left;
    width: 16%;
    height: auto;
}
.user_lessonplan > div:nth-child(3) {
    position: relative;
    float: left;
    width: 16%;
    height: auto;
    text-align: center;
}
.user_lessonplan > div:nth-child(4) {
    position: relative;
    float: left;
    width: 19%;
    height: auto;
    text-align: center;
}
.user_lessonplan > div:nth-child(5) {
    position: relative;
    float: left;
    width: 19%;
    height: auto;
    text-align: center;
}
.user_lessonplan_edit {
    color: rgb(0,128,0);
}
.user_lessonplan_edit:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.user_lessonplan_delete {
    color: rgb(204,0,0);
}
.user_lessonplan_delete:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.lessonplan_remove {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    color: rgb(204,0,0);
    font-size: 1vw;
}
.lessonplan_remove:hover {
    cursor: pointer;
    rgba(204,0,0,0.5);
}
#lessonplan_item_add_content {
    position: relative;
    width: auto;
    height: auto;
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.6vw;
    background-color: #1d1d1d;
}
#lessonplan_item_add_content:hover {
    cursor: pointer;
}
.sortable_highlight {
    border: 2px dashed rgb(204,0,0);
    background-color: #1d1d1d;
    font-size: 0.8vw;
}
.assign_assignment_dates_required, .assign_assignment_remediation {
    box-shadow: 0px 3px 2px -1px #000;
    position: relative;
    float: left;
    width: auto;
    max-width: 100%;
    min-width: 15%;
    font-size: 0.8vw;
    background-color: grey;
    color: #fff;
    
    border: none;
    margin-right: 1%;
}
.assign_assignment_dates_required:hover, .assign_assignment_remediation:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.7);
}
.new_assignment_content_item_name, .added_assignment_content_item_name {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
}
#content_left_screen_info_col1 label:nth-child(even){
    background-color: #e7e7e7;
}
#content_left_screen_info_col2 span:nth-child(even){
    background-color: #e7e7e7;
}
.assignmentitem > div:nth-child(1) {
    width: 8% !important;
}
.assignmentitem > div:nth-child(1) img {
    width: 55%;
}
.assignmentitem > div:nth-child(2) {
    width: auto;
    max-width: 77%;
    min-width: 77%;
}
.assignmentitem > div:nth-child(2) > span {
    text-align: left !important;
}
.assignmentitem > div:nth-child(3) {
    width: 5% !important;
}
.assignmentitem > div:nth-child(4) {
    width: 5% !important;
}
.assignmentitem > div:nth-child(5) {
    width: 5% !important;
}
.assignmentitem > div:nth-child(3) > span {
    padding-top: 0%
}
.assignmentitem > div:nth-child(4) > span {
    padding-top: 0%
}
.assignmentitem > div:nth-child(5) > span {
    padding-top: 0%
}
#assignment_add_content, #assignment_assign_students, #assessment_add_content_training, #assessment_add_content_next, #assessment_add_content_complete, #assignment_edit_content_info {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 28%;
    height: auto;
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.6vw;
    
    letter-spacing: 1.5px;
    background-color: #000;
}
#assessment_add_content_next {
    background-color: rgb(0,125,255) !important;
}
#assessment_add_content_next:hover {
    cursor: pointer;
}
#assessment_add_content_complete {
    background-color: rgb(0,128,0) !important;
}
#assessment_add_content_complete:hover {
    cursor: pointer;
}
#assignment_add_content:hover, #assignment_assign_students:hover, #assessment_add_content_training:hover, #assignment_edit_content_info:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.7);
}
#assignment_window_content, #assignment_student_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assignment_window_content > div, #assignment_student_window_content > div {
    position: relative;
    float: left;
    height: auto;
}
#assignment_window_content ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    list-style: none;
    padding: 0;
    margin: 0;
}
.assignment_directory_content_item {
    list-style: none;
    font-size: 0.8vw;
}
.assignment_directory_content_item > div:nth-child(1){
    position: relative;
    float: left;
    width: 2%;
    max-width: 3%;
    height: auto;
    margin-right: 1%;
}
.assignment_directory_content_item > div:nth-child(2){
    position: relative;
    float: left;
    width: 94%;
    max-width: 94%;
    height: auto;
}
#assignment_content_window_content, #assignment_content_update_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assignment_student_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assignment_student_window_content > div {
    position: relative;
    float: left;
    width: 33%;
    height: auto;
    min-height: 250px;
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
    font-size: 0.8vw;
}
#assignment_student_window_content > div > ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
    list-style: none;
}
#assignment_student_window_content > div > ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assignment_student_window_bottom, #assignment_window_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assignment_student_window_bottom button, #assignment_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 0.5%;
    background-color: rgb(0,125,255);
    color: #ffffff;
    border: 1px solid #fff;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.8vw;
    margin-right: 1%;
}
#assignment_student_window_bottom button:hover, #assignment_window_bottom button:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.7);
}
#assignment_content_window_bottom_next {
    background-color: rgb(0,128,0) !important;
}
#new_learner_list {
    background-color: rgb(0,128,0) !important;
}
#new_learner_list:hover {
    background-color: rgba(0,128,0,0.7);
}
#assignment_content_window_content > div, #assignment_content_update_window_content > div {
    position: relative;
    float: left;
    width: 32%;
    height: auto;
    margin-right: 1%;
}
#assignment_content_window_content > ul, #assignment_content_update_window_content > ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    list-style: none;
}
#assignment_content_window_content > ul > li, #assignment_content_update_window_content > ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#assignment_content_window_content > ul > li:nth-child(1), #assignment_content_update_window_content > ul > li:nth-child(1) {
    margin-bottom: 1%;
}
#assignment_content_window_content > ul > li:nth-child(2), #assignment_content_update_window_content > ul > li:nth-child(2) {
    padding-bottom: 1%;
    padding-top: 0.5%;
    margin-bottom: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#assignment_content_window_content > ul > li > div:nth-child(2), #assignment_content_update_window_content > ul > li > div:nth-child(2) {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
#assignment_content_window_content > ul > li > div:nth-child(2) > div:nth-child(1), #assignment_content_update_window_content > ul > li > div:nth-child(2) > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    height: auto;   
}
#assignment_content_window_content > ul > li > div:nth-child(2) > div:nth-child(2), #assignment_content_update_window_content > ul > li > div:nth-child(2) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 75%;
    height: auto;   
}
#assignment_content_window_content > ul > li > div:nth-child(3), #assignment_content_update_window_content > ul > li > div:nth-child(3) {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
#assignment_content_window_content > ul > li > div:nth-child(3) > div:nth-child(1), #assignment_content_update_window_content > ul > li > div:nth-child(3) > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    height: auto;   
}
#assignment_content_window_content > ul > li > div:nth-child(3) > div:nth-child(2), #assignment_content_update_window_content > ul > li > div:nth-child(3) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 75%;
    height: auto;   
}
#assignment_content_window_content > ul > li > div:nth-child(4), #assignment_content_update_window_content > ul > li > div:nth-child(4) {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
#assignment_content_window_content > ul > li > div:nth-child(4) > div:nth-child(1), #assignment_content_update_window_content > ul > li > div:nth-child(4) > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    height: auto;   
}
#assignment_content_window_content > ul > li > div:nth-child(4) > div:nth-child(2), #assignment_content_update_window_content > ul > li > div:nth-child(4) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 75%;
    height: auto;   
}
#assignment_content_window_content > ul > li > div:nth-child(5), #assignment_content_update_window_content > ul > li > div:nth-child(5) {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
#assignment_content_window_content > ul > li > div:nth-child(5) > div:nth-child(1), #assignment_content_update_window_content > ul > li > div:nth-child(5) > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    height: auto;   
}
#assignment_content_window_content > ul > li > div:nth-child(5) > div:nth-child(2), #assignment_content_update_window_content > ul > li > div:nth-child(5) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 75%;
    height: auto;   
}
#assignment_content_window_content > ul > li > div:nth-child(6), #assignment_content_update_window_content > ul > li > div:nth-child(6) {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
#assignment_content_window_content > ul > li > div:nth-child(6) > div:nth-child(1), #assignment_content_update_window_content > ul > li > div:nth-child(6) > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    height: auto;   
}
#assignment_content_window_content > ul > li > div:nth-child(6) > div:nth-child(2), #assignment_content_update_window_content > ul > li > div:nth-child(6) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 75%;
    height: auto;   
}
#assignment_content_window_content label, #assignment_content_update_window_content label {
    position: relative;
    float: left;
    font-size: 0.8vw;
    font-weight: bold;
}
#assignment_content_window_content input[type=radio], #assignment_content_update_window_content input[type=radio] {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    margin-left: 3%;
}
#assignment_content_window_content input[type=text], #assignment_content_update_window_content input[type=text] {
    position: relative;
    float: left;
    width: auto;
    max-width: 15%;
    height: auto;
    margin-right: 0%;
    font-size: .8vw;
    padding-left: 1%;
    
    border: none;
    box-shadow: 0 1px 3px 0 #000;
}
#assignment_content_window_bottom button, #assignment_content_update_window button {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 1%;
    background-color: rgba(0,0,0,0.2);
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 1vw;
    margin-right: 1%;
}
#assignment_content_window_bottom button:hover, #assignment_content_update_window button:hover {
    cursor: pointer;
}
#assessment_window, #edit_assessment_window {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 96%;
    max-width: 96%;
    height: auto;
    padding: 1%;
    left: 0%;
    top: 4%;
    z-index: 101;
    background-color: #ffffff;
    opacity: 1;
    box-shadow: 0px 1px 3px -1px #000000;
    color: #000;
}
#assessment_window > span, #edit_assessment_window > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    margin-bottom: 0.5%;
    font-size: 0.8vw;
    color: #fff;
    background-color: #1d1d1d;
}
#assessment_window > span:hover, #edit_assessment_window > span:hover {
    cursor: move;
}
#assessment_window > span > img, #edit_assessment_window > span > img {
    position: relative;
    float: left;
    width: 2%;
    height: auto;
    margin-right: 1%;
}
.new_assessment_question_section_questions > ul, .edit_assessment_question_section_questions > ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}
.new_assessment_question_section_questions > ul > li, .edit_assessment_question_section_questions > ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.new_assessment_question_section_questions > ul > li:nth-child(even), .edit_assessment_question_section_questions > ul > li:nth-child(even) {
    background-color: #e7e7e7;
}
.new_assessment_question_select_all, .new_assessment_question_select_random {
    position: relative;
    float: right;
    width: auto;
    max-width: 50%;
    min-width: 10%;
    margin-left: 1%;
    border: none;
    box-shadow: 0px 2px 3px -1px #000;
    background-color: #1d1d1d;
    color: #fff;
    font-size: 0.8vw;
}
.new_assessment_question_select_all:hover, .new_assessment_question_select_random:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.75);
}
#assignment_window_close, #assignment_content_window_close, .assignment_student_window_close {
    position: relative;
    float: right;
    right: 0;
    color: #fff;
}
#assignment_window_close:hover, #assignment_content_window_close:hover, .assignment_student_window_close:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.75);
}
#search-bar-clear {
    display: none;
    position: absolute;
    float: right;
    color: #000;
    right: 3%;
    top: 26%;
    font-size: 0.8vw;
}
#search-bar-clear:hover {
    cursor: pointer;
    color: rgb(0,0,0,0.75);
}
#other_dropdown_directories_all {
    display: none;
}
.menu_item_info:hover {
    color: rgba(255,255,255,0.7);
}
#menu_item_info {
    display: none;
    position: absolute;
    float: left;
    z-index: 1001;
    background-color: #fff;
    color: #1d1d1d;
    max-width: 20%;
    min-width: 15%;
    height: auto;
    border-radius: 2px;
    box-shadow: 0px 0px 3px 1px #000;
    margin-top: 1%;
    margin-left: 1%;
    padding: 0.5%;
}
#menu_item_info_top, #menu_item_info_content {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
}
#menu_item_info_top {
    background-color: #1d1d1d;
}
#menu_item_info_content {
    background-color: #e7e7e7;
}
#menu_item_info_content span {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 0.7vw;
}
#menu_item_info_close {
    position: relative;
    float: right;
    right: 1%;
    font-size: 0.7vw;
    color: #fff;
}
#menu_item_info_close:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
.info_window {
    display: none;
    position: absolute;
    z-index: 1001;
    background-color: #fff;
    max-width: 40%;
    min-width: 40%;
    height: auto;
    color: #000;
    padding: 1%;
    
    margin-left: 34.5%;
    margin-top: 2.5%;
    border: 1px solid #000;
    box-shadow: 0px 0px 5px -1px #000;
}
.info_window_close {
    position: relative;
    float: right;
    right: 1%;
    color: #fff;
    font-size: 0.8vw;
}
.info_window_close:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
.info_window_top, .info_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.info_window_top {
    background: #1d1d1d;
    
    margin-bottom: 1%;
    padding: 0.5%;
}
.info_window_top > i {
    position: relative;
    float: left;
    margin-left: 1%;
    color: #fff;
    font-size: 0.8vw;
    margin-top: 0.2%;
}
.info_window_content {
    background-color: #e7e7e7;
    padding: 1%;
    width: 98%;
    
    max-height: 400px;
    min-height: auto;
    overflow-x: hidden;
    overflow-y: auto;
}
.info_window_content_heading {
    position: relative;
    float: left;
    width: 100%;
    height:auto;
    font-size: 0.7vw;
    color: #000;
    font-weight: bold;
    text-decoration: underline;
    margin-bottom: 1%;
}
.info_window_content_descr {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #000;
    font-size: 0.7vw;
}
#assessment_window_question_section {
    position: relative;
    float: left;
    width: 100%;
    max-height: 500px;
    overflow-x: hidden;
    overflow-y: auto;
}
.user_assessment_content_item {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    box-shadow: 0px 1px 1px -1px #000;
    padding: 1%;
}
.user_assessment_content_item > div {
    position: relative;
    float: left;
    width: auto;
    height: auto;
}
.user_assessment_content_item > div:nth-child(1) {
    max-width: 10%;
    min-width: 10%;
}
.user_assessment_content_item > div:nth-child(2) {
    max-width: 60%;
    min-width: 60%;
    padding: 2%;
}
.user_assessment_content_item > div:nth-child(3) {
    width: auto;
    min-width: 5%;
    max-width: 5%;
    padding: 2%;
    font-size: 0.8vw;
    text-align: center;
}
.user_assessment_content_item > div:nth-child(4) {
    width: auto;
    min-width: 5%;
    max-width: 5%;
    padding: 2%;
    font-size: 0.8vw;
    text-align: center;
    color: rgb(0,128,0);
}
.user_assessment_content_item > div:nth-child(5) {
    width: auto;
    min-width: 3%;
    max-width: 3%;
    padding: 2%;
    font-size: 0.8vw;
    text-align: center;
    color: rgb(204,0,0);
}
.user_assessment_content_item > div > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.user_assessment_content_item_edit:hover, .user_assessment_content_item_questions:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.user_assessment_content_item_remove:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
#edit_assessment_window_content, #edit_assessment_window_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
}
#edit_assessment_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    color: #ffffff;
    border: none;
    outline: 0;
    box-shadow: 0px 1px 3px -1px #000000;
    font-size: 0.7vw;
    margin-right: 1%;
}
#edit_assessment_window_bottom button:hover {
    cursor: pointer;
}
#edit_assessment_window_bottom_next {
    background-color: rgb(0,128,0);
}
#edit_assessment_window_bottom_next:hover {
    background-color: rgba(0,128,0,0.7);
}
#edit_assessment_window_bottom_cancel {
    background-color: rgb(204,0,0);
}
#edit_assessment_window_bottom_cancel:hover {
    background-color: rgba(204,0,0,0.7);
}
#edit_assessment_window_close {
    position: relative;
    float: right;
    font-size: 0.8vw;
    color: #fff;
}
#edit_assessment_window_close:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
.edit_assessment_question_section_questions {
    max-height: 400px;
    overflow-x: hidden;
    overflow-y: auto;
}
.assessment_random_drop_down {
    display: none;
    position: absolute;
    background-color: #1d1d1d;
    float: right;
    width: auto;
    min-width: 9%;
    max-width: 9%;
    height: auto;
    padding: 0.5%;
    z-index: 1001;
    opacity: 0;
}
#new_assessment_random_dropdown {
    right: 18%;
    top: 19.5%;
}
#edit_assessment_random_dropdown {
    right: 13.3%;
    top: 18.5%;
}
.assessment_random_drop_down > div {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.assessment_random_confirm {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 0%;
    background-color: rgb(0,128,0);
    color: #fff;
    border: none;
    font-size: 0.7vw !important;
}
.assessment_random_confirm:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
.assessment_random_cancel {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    height: auto;
    padding: 0%;
    color: #fff;
    border: none;
    font-size: 0.7vw !important;
    background-color: rgb(204,0,0);
    margin-right: 2%;
}
.assessment_random_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
.assignment_window_top {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    padding: 1%;
    background-color: #1d1d1d;
    box-shadow: 0px 4px 3px -2px #1d1d1d;
    color: #fff;
    
    margin-bottom: 1%;
}
.assignment_window_top > span:nth-child(1) {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 1vw;
}
.assignment_window_top > span:nth-child(1) > img {
    width: 2%;
    margin-right: 1%;
}
#assignment_content_window_close, #assignment_window_close {
    color: #fff;
}
#assessment_add_default_content_next {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    color: #ffffff;
    border: none;
    
    box-shadow: 0px 1px 5px -1px #000000;
    font-size: 0.8vw;
    background-color: rgb(0,125,255);
    margin-right: 1%;
}
#assessment_add_default_content_next:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.7);
}
.playlist_edit_directory, .syllabus_edit_directory, .course_edit_directory, .assessment_edit_directory, .assignment_edit_directory, .refresher_edit_directory {
    position: relative;
    float: right;
    font-size: 0.8vw;
    color: rgb(0,128,0);
}
.playlist_edit_directory:hover, .syllabus_edit_directory:hover, .course_edit_directory:hover, .assessment_edit_directory:hover, .assignment_edit_directory:hover, .refresher_edit_directory:hover {
    color: rgba(0,128,0,0.7);
    cursor: pointer;
}
.edit_directory_window {
    display: none;
    position: absolute;
    z-index: 1000;
    width: auto;
    min-width: 30%;
    max-width: 100%;
    background-color: #fff;
    padding: 1%;
    box-shadow: 0 1px 3px -1px #000;
    margin-left: 15%;
    margin-top: 0%;
    font-size: 0.7vw;
}
.edit_directory_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    background-color: #192a56;
    margin-bottom: 0.5%;
}
.edit_directory_window_top > span {
    color: #fff;
    margin-left: 1%;
}
.edit_directory_window_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom:1%;
}
.edit_directory_window_content > div {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 0.5%;
}
.edit_directory_window_content > div > label {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 30%;
    max-width: 30%;
}
.edit_directory, .edit_subdirectory {
    position: relative;
    float: left;
    width: auto;
    max-width: 40%;
    min-width: 40%;
    height: auto;
    font-size: 0.7vw;
    
}
.edit_directory_window_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.edit_directory_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 15%;
    max-width: 15%;
    padding: .5%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 2px 4px -2px #000;
    transition: all .5s;
    
    margin-right: 1%;
}
.edit_directory_window_cancel {
    background-color: rgb(204,0,0);
}
.edit_directory_window_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
.edit_directory_window_save {
    background-color: rgb(0,128,0);
}
.edit_directory_window_save:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
.pop_quiz_question_type {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: left;
    text-decoration: underline;
    font-weight: bold;
    font-size: 1vw;
    margin-bottom: 1%;
}
.questionnaire_review {
    position: relative;
    float: right;
    width: auto;
    min-width: 45%;
    max-width: 45%;
    height: auto;
    min-height: 45vh;
    max-height: 70vh;
}
.questionnaire_review > iframe {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 70vh;
    max-height: 70vh;
}
.questionnaire_review > video {

}
.pop_quiz_language {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    margin-bottom: 0.5%;
}
.pop_quiz_language > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 2%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.8vw;
    margin-right: 1%;
}
.pop_quiz_language > select {
    position: relative;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    border-radius: 5px;
    color: #000;
}
.pop_quiz_score_to_pass {
    position: relative;
    float: right;
    right: 0;
    width: auto;
    min-width: 7%;
    max-width: 10%;
    height: auto;
    padding: 0.5%;
    background-color: rgba(0,128,0,0.6);
    border: 1px solid rgb(0,128,0);
    color: #fff;
    font-size: 1vw;
    box-shadow: 0px 0px 2px -1px #000000;
}
.send_question_author_message {
    position: relative;
    float: left;
    width: auto;
    max-width: 100%;
    height: auto;
    font-size: 0.8vw;
    background-color: rgb(204,0,0);
    color: #ffffff;
    
    box-shadow: 0px 1px 3px -1px #000;
    border: none;
}
.send_question_author_message:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.2);
}
#notification_title {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw !important;
    text-align: center;
}

@-webkit-keyframes notification {
    0% { color: rgb(255,215,0); }
    50% { color: rgb(214, 181, 2); }
    100% { color: rgb(255,215,0); }
}
@-moz-keyframes notification {
    0% { color: rgb(255,215,0); }
    50% { color: rgb(214, 181, 2); }
    100% { color: rgb(255,215,0); }
}
@-o-keyframes notification {
    0% { color: rgb(255,215,0); }
    50% { color: rgb(214, 181, 2); }
    100% { color: rgb(255,215,0); }
}
@keyframes notification {
    0% { color: rgb(255,215,0); }
    50% { color: rgb(214, 181, 2); }
    100% { color: rgb(255,215,0); }
}
.notifications {
    -webkit-animation: notification 2000ms infinite;
    -moz-animation: notification 2000ms infinite;
    -o-animation: notification 2000ms infinite;
    animation: notification 2000ms infinite;
}
#header_started {
    position: relative;
    float: right;
    width: 7%;
    height: auto;
    padding-left: 1%;
    padding-bottom: 1%;
    padding-right: 1%;
}
#header_started:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.1);
}
#header_started > div {
    position: relative;
    text-align: center;
    width: 100%;
    height: auto;
    font-size: 1.5vw;
    margin-top: 9%;
}
#started > i {
    color: rgb(111, 192, 85);
}
#started_title {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 0.75vw !important;
    text-align: center;
    color: #fff;
}
@-webkit-keyframes started {
    0% { color: rgb(111, 192, 85); }
    50% { color: rgb(135, 230, 104); }
    100% { color: rgb(111, 192, 85); }
}
@-moz-keyframes started {
    0% { color: rgb(111, 192, 85); }
    50% { color: rgb(135, 230, 104); }
    100% { color: rgb(111, 192, 85); }
}
@-o-keyframes started {
    0% { color: rgb(111, 192, 85); }
    50% { color: rgb(135, 230, 104); }
    100% { color: rgb(111, 192, 85); }
}
@keyframes started {
    0% { color: rgb(111, 192, 85); }
    50% { color: rgb(135, 230, 104); }
    100% { color: rgb(111, 192, 85); }
}
.started {
    -webkit-animation: started 2000ms infinite;
    -moz-animation: started 2000ms infinite;
    -o-animation: started 2000ms infinite;
    animation: started 2000ms infinite;
}
#user_notification_window {
    display: none;
    position: absolute;
    float: right;
    width: auto;
    min-width: 20%;
    max-width: 30%;
    height: auto;
    right: 0%;
    background-color: #fff;
    color: #000;
    top: 7%;
    z-index: 2000;
    box-shadow: 0px 1px 3px -1px #000;
    opacity: 0;
    padding: 1%;
}
#user_notification_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    background-color: #192a56;
    color: #fff;
}
#user_notification_window_top > span > i {
    margin-left: 1%;
}
#user_notification_window_close {
    position: relative;
    float: right;
    margin-right: 1%;
}
#user_notification_window_close:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
#user_notification_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 5vh;
    max-height: 40vh;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: #fff;
    margin-top: 1%;
    padding: 1%;
}
.user_notification_window_content_close {
    position: relative;
    float: right;
    width: auto;
    min-width: 3%;
    max-width: 3%;
    height: auto;
    text-align: right;
}
.user_notification_window_content_close:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.7);
}
.user_notification_window_content_message {
    position: relative;
    float: left;
    width: auto;
    min-width: 97%;
    max-width: 97%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
    margin-bottom: 0.5%;
    border: 1px solid rgba(0,0,0,0.1);
    padding: 1%;
    color: #000;
    font-size: 0.7vw;
}
.user_notification_window_content_messenger {
    position: relative;
    float: right;
    width: 100%;
    height: auto;
}
.user_notification_window_content_message_date {
    position: relative;
    float: right;
    width: 100%;
    height: auto;
}
#user_notification_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 1%;
}
#user_notification_send_message {
    position: relative;
    float: right;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    padding: 1%;
    right: 0;
    height: auto;
    background-color: #192a56;
    color: #fff;
    font-size: 0.7vw;
    border: none;
    box-shadow: 0px 1px 3px -1px #000;
}
#user_notification_send_message:hover {
    cursor: pointer;
    background-color: #192a56BF;
}
#send_message_window {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    padding: 0.5%;
    background-color: #fff;
    
    font-size: 0.7vw;
    left: 35%;
    top: 30%;
    z-index: 1001;
    box-shadow: 0px 1px 3px -1px #000;
}
#send_message_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    background-color: #192a56;
    color: #fff;
    box-shadow: 0px 1px 3px -1px #000;
    padding: 1%;
}
#send_message_window_top > i {
    position: relative;
    float: right;
    right: 1%;
}
#send_message_window_top > i:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.7);
}
#send_message_window_content, #send_message_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 1%;
}
#send_message_window_content > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
#send_message_text > textarea {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
    resize: none;
}
#send_message_submit {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    background-color: #192a56;
    color: #fff;
    border: none;
    box-shadow: 0px 1px 3px -1px #000;
    outline: 0;
    margin-left: 1%;
}
#send_message_submit:hover {
    cursor: pointer;
    background-color: rgba(25,42,86,0.7);
}
#send_message_cancel {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    background-color: rgb(204,0,0);
    color: #fff;
    border: none;
    box-shadow: 0px 1px 3px -1px #000;
    outline: 0;
}
#send_message_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
.setup_button_submit {
    background-color: rgb(0,128,0);
}
.setup_button_submit:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
.setup_button_cancel {
    background-color: rgb(204,0,0);
}
.setup_button_cancel:hover {
    background-color: rgba(204,0,0,0.7);
}
.toggle {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 62px;
  height: 20px;
  display: inline-block;
  position: relative;
  float: right;
  right: 40%;
  border-radius: 50px;
  overflow: hidden;
  outline: none;
  border: none;
  cursor: pointer;
  background-color: #707070;
  transition: background-color ease 0.3s;
}

.toggle:before {
  content: "on off";
  display: block;
  position: absolute;
  z-index: 2;
  width: 15px;
  height: 15px;
  background: #fff;
  left: 2px;
  top: 3px;
  border-radius: 50%;
  font: 9px/18px Helvetica;
  text-transform: uppercase;
  font-weight: bold;
  text-indent: -22px;
  word-spacing: 37px;
  color: #fff;
  text-shadow: -1px -1px rgba(0,0,0,0.15);
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  transition: all cubic-bezier(0.3, 1.5, 0.7, 1) 0.3s;
}

.toggle:checked {
  background-color: rgb(0,128,0);
}

.toggle:checked:before {
  left: 32px;
}
.edit_question_window_correct_radio, .add_quiz_correct_answer_radio, .edit_question_window_correct_checkbox, .add_quiz_correct_answer_checkbox {
    position: relative;
    float: left;
    width: 15px;
    height: 15px;
    margin-right: 1%;
}
.add_quiz_correct_so_answer {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 2.6vh;
    max-height: 2.6vh;
    padding: 0.5%;
    border: 1px solid #d7d7d7;
    font-family: 'Roboto', sans-serif;
    text-align: center;
}
.add_quiz_correct_ma_answer {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 75%;
    max-width: 75%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    padding: 0.5%;
    border: 1px solid #d7d7d7;
    font-family: 'Roboto', sans-serif;
    text-align: left;
    font-size: 0.8vw;
}
.quiz_question_correct_label.so, .quiz_question_correct_label.dp {
    position: relative;
    float: left;
    margin-left: 5%;
    margin-top: 3%;
    font-weight: bold;
}
#so_info {
    display: none;
    position: relative;
    float: left;
    margin-top: 1%;
    margin-left: 1%;
}
#ms_add_button_row, #so_add_button_row, #ma_add_button_row {
    display: none;
}
#mc_add_button {
    display: block !important;
}
#mc_add_button, #ms_add_button, #so_add_button, #ma_add_button {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 18%;
    max-width: 18%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    background-color: rgb(0,128,0);
    color: #fff;
    text-align: center;
    border: none;
    outline: none;
}
#mc_add_button:hover, #ms_add_button:hover, #so_add_button:hover, #ma_add_button:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
#mc_remove_button, #ms_remove_button, #so_remove_button, #ma_remove_button {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 18%;
    max-width: 18%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    background-color: rgb(204,0,0);
    
    color: #fff;
    text-align: center;
    border: none;
    outline: none;
}
#mc_remove_button:hover, #ms_remove_button:hover, #so_remove_button:hover, #ma_remove_button:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
#quiz_question_add_tips {
    min-height: 2vh;
    max-height: 2vh;
    background-color: rgba(0,0,0,0.05);
    margin-top: 0.5%;
}
#quiz_question_add_tips > span {
    position: relative;
    float: left;
    margin-left: 1%;
}
#quiz_question_add_data {
    max-height: 73vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.result .result_category_icon {
    position: relative;
    float: left;
    width: auto;
    min-width: 6%;
    max-width: 6%;
    height: auto;
    margin-right: 2%;
    margin-top: 1%;
}
.list_result_col2 .result_category_icon {
    position: relative;
    float: left;
    width: 5%;
    height: auto;
    margin-right: 2%;
    margin-top: 0.5%;
}
.list_result_drag .result_category_icon {
    position: relative;
    float: left;
    width: 8%;
    height: auto;
    margin-right: 2%;
    margin-top: 0%;
}
#content_window_title .result_category_icon {
    position: relative;
    float: left;
    width: auto;
    min-width: 1%;
    margin-right: 0.5%;
    max-width: 2%;
    min-height: 2vh;
    max-height: 2vh;
}
#content_notes_window .result_category_icon {
    position: relative;
    float: left;
    width: 1.5%;
    margin-right: 1%;
}
#content_notes_window {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 75%;
    max-width: 75%;
    height: auto;
    padding: 0.5%;
    background-color: #fff;
    color: #000;
    font-size: .8vw;
    box-shadow: 0 1px 3px -1px #000;
    z-index: 1000;
    left: 6%;
    top: 0%;
}
#content_notes_window_top:hover {
    cursor: move;
}
#content_notes_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    padding: 0.5%;
    background-color: #192a56;
    font-size: 0.8vw;
    margin-bottom: 0.5%;
    box-shadow: 0 1px 3px -1px #000;
    color: #ffffff;
}
#content_notes_window_close {
    position: relative;
    float: right;
}
#content_notes_window_close:hover {
    cursor: pointer;
    color: #7d7d7d;
}
#content_notes_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 49%;
    max-width: 49%;
    height: auto;
    min-height: 60vh;
    max-height: 60vh;
}
#content_notes_window_content > div::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
#content_notes_window_content > div ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
#content_notes_window_content > div::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
#content_notes_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 1%;
}
#content_notes_window_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding-right: 2%;
    height: auto;
    min-height: 60vh;
    max-height: 60vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.content_notes_row_taskbar {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.content_notes_add_more {
    position: relative;
    float: right;
    width: auto;
    min-width: 3%;
    max-width: 3%;
    height: auto;
    padding: .1%;
    background-color: green;
    color: #fff;
    border: none;
    outline: 0;
    box-shadow: 0 1px 3px -1px #000;
    margin-bottom: .5%;
}
.content_notes_add_more:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
.content_notes_row_info_added {
    background-color: rgb(255,255,255) !important;
}
.content_notes_row_info_added input[type='text'] {
    width: 92% !important;
    max-width: 93%;
}
.content_notes_row_info_remove {
    position: relative;
    float: right;
    width: auto;
    color: rgb(204,0,0);
    padding: 1%;
    font-size: 1vw;
    right: 0%;
}
.content_notes_row_info_remove:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
#content_notes_window_content input[type='text'], #content_notes_window_content select {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    background-color: transparent;
    border: 1px solid #000;
    font-size: .7vw;
}
#content_notes_window_content select {
    min-width: 100%;
    max-width: 100%;    
}
#content_notes_window_content textarea {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    background-color: transparent;
    border: 1px solid #000;
    font-size: .7vw;
    font-family: 'Roboto', sans-serif;
    resize: none;
}
#content_notes_window_cancel {
    position: relative;
    float: right;
    width: auto;
    min-width: 7%;
    max-width: 7%;
    height: auto;
    padding: 0.5%;
    font-size: .7vw;
    background-color: rgb(0,0,0);
    color: #fff;
    border: none;
    outline: 0;
    box-shadow: 0 1px 3px -1px #000;
}
#content_notes_window_cancel:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.7);
}
#content_notes_window_update {
    position: relative;
    float: right;
    width: auto;
    min-width: 7%;
    max-width: 7%;
    height: auto;
    padding: 0.5%;
    font-size: .7vw;
    background-color: #192a56;
    color: #fff;
    border: none;
    outline: 0;
    box-shadow: 0 1px 3px -1px #000;
    margin-right: 1%;
}
#content_notes_window_update:hover {
    cursor: pointer;
    background-color: #192a56BF;
}
.content_notes_row {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.content_notes_row_label {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    background-color: #192a56;
    color: #fff;
    font-size: .7vw;
    padding: 1%;
    box-shadow: 0 1px 3px -1px #000;
    letter-spacing: 1.5px;
}
.content_notes_row_info {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 1%;
}
.result_remove_project_folder {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    color: red;
    background: transparent;
    border: none;
    text-align: right;
    margin-top: 5%;
}
.result_remove_project_folder:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.list_result_view_question, .list_result_view_notes, .list_result_view_objective, .list_result_remove_project_folder {
    position: relative;
    display: inline-block;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    border: 1px solid #d3d3d3;
    background-color: #fff;
    color: #000;
    font-size: 0.65vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    
    outline: 0;
}
.list_result_remove_project_folder {
    color: red;
}
.list_result_view_question:hover, .list_result_view_notes:hover, .list_result_view_objective:hover, .list_result_remove_project_folder:hover {
    cursor: pointer;
    background-color: #e7e7e7;
}
#list_result_popup {
    display: none;
    position: absolute;
    width: auto;
    min-width: 25%;
    max-width: 50%;
    height: auto;
    padding: 1%;
}
#list_result_popup > span {
    width: 100%;
    font-size: 0.8vw;
}
#content_notes_window_preview {
    position: relative;
    float: left;
    width: auto;
    min-width: 49%;
    max-width: 49%;
    height: auto;
    margin-right: 1%;
}
#content_notes_window_preview_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
}
#content_notes_window_preview_video_controls {
    position: absolute;
    z-index: 2;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: 2.5vh;
    min-height: 2.5vh;
    max-height: 2.5vh;
    bottom: 2%;
    background-color: rgba(0,0,0,.1);
}
#content_notes_window_preview-play-pause {
    float: left !important;
    margin-top: 0.3% !important;
}
#content_notes_window_preview-volumebar {
    width: 10%;
    max-width: 10%;
    position: relative;
    float: right;
    margin-top: .6%;
    height: 50%;
    margin-right: 1%;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 30px;
}
#content_notes_window_preview-volume {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(255,255,255);
    border-radius: 15px;
}
#content_notes_window_preview-mute {
    position: relative;
    float: right !important;
    width: auto;
    height: auto;
    font-size: 0.7vw!important;
    margin-top: .6%;
    margin-right: 0.6%;
}
#content_notes_window_preview-seekbar {
    position: relative;
    width: 75%;
    max-width: 75%;
    height: 50%;
    float: left;
    margin-left: 1%;
    margin-top: 1%;
    background-color: rgba(255,255,255,.1);
    
}
#content_notes_window_preview-timebar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: rgba(245,0,0,.5);
    border-radius: 30px;
}
#content_notes_window_preview-play-pause, #content_notes_window_preview-mute {
    color: #ffffff;
    padding-left: 1%;
    font-size: 1vw;
}
#content_notes_window_preview-play-pause:hover, #content_notes_window_preview-mute:hover {
    cursor: pointer;
}
#content_left_screen_data::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
#content_left_screen_data::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
#content_left_screen_data::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
#content_left_screen_info_bar > .demo_button {
    max-width: 45%;
    min-width: 45%;
    font-size: 0.7vw;
}
.content_window_contents > table, .content_window_contents > tbody {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.content_window_contents h3 {
    text-align: center;
    text-decoration: underline;
    padding: 0;
    margin: 0;
    margin-bottom: 3%;
}
.content_window_contents > table tr {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    font-size: 0.8vw;
}
.content_window_contents tr td:nth-child(1), .content_window_contents tr th:nth-child(1){
    position: relative;
    float: left;
    min-width: 5%;
    max-width: 5%;
    width: auto;
}
.content_window_contents tr td:nth-child(2), .content_window_contents tr th:nth-child(2){
    position: relative;
    float: left;
    min-width: 30%;
    max-width: 50%;
    width: auto;
}
.content_window_contents tr td:nth-child(3), .content_window_contents tr th:nth-child(3){
   position: relative;
   float: left;
   min-width: 30%;
   max-width: 50%;
   width: auto;
}
.content_window_contents tr td:nth-child(4), .content_window_contents tr th:nth-child(4){
   position: relative;
   float: right;
   width: auto;
   color: rgb(0,128,0);
}
.toc_item:hover {
    cursor: pointer;
    font-weight: bold;
}
.toc_item_active {
    font-weight: bold;
    background-color: #192a56;
    
    box-shadow: 0px 1px 2px -1px #000;
}
#add_content_questions > i, #view_content_notes > i {
    color: #d3d3d3;
    font-size: 0.7vw;
}
#learning_obj > i, #description > i {
    color: #fff;
    font-size: 0.7vw;
}
.content_active_questions_true, .content_active_notes_true, .content_active_objective_true {
   color: rgb(0,128,0) !important;
}
.content_active_questions_false, .content_active_notes_false, .content_active_objective_false {
    color: rgb(204,0,0) !important;
}
#content_left_screen_data_view_option {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-bottom: 1%;
    margin-top: 1%;
}
.content_left_screen_view_option {
    position: relative;
    float: right;
    width: auto;
    max-width: 8%;
    min-width: 8%;
    height: auto;
    background-color: #fff;
    border: 1px solid #e7e7e7;
    color: #d3d3d3;
    margin-left: 1%;
    padding: 0;
    
    margin-right: 0.5%;
}
.content_left_screen_view_option:hover {
    cursor: pointer;
    color: #000;
}
.content_left_screen_view_selected {
    color: #000;
}
#content_left_screen_data_view_option > .user_playlist_play {
    position: relative;
    width: auto;
    min-width: 32%;
    max-width: 32%;
    height: auto;
    padding: 0%;
    background-color: rgb(0, 125, 255);
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 3px -1px #000000;
    font-size: 0.7vw;
    outline: 0;
    margin-left: 1%;
}
#content_left_screen_data_view_option > .user_course_preview {
    position: relative;
    width: auto;
    min-width: 32%;
    max-width: 32%;
    height: auto;
    padding: 0%;
    background-color: rgb(0, 125, 255);
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.6vw;
    outline: 0;
    margin-left: 1%;
    max-height: 1.8vh;
    min-height: 1.8vh;
}
#content_left_screen_data_view_option > .user_syllabus_launch {
    position: relative;
    width: auto;
    min-width: 32%;
    max-width: 32%;
    height: auto;
    padding: 0%;
    background-color: rgb(0, 125, 255);
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 3px -1px #000000;
    font-size: 0.7vw;
    outline: 0;
    margin-left: 1%;
}
#content_left_screen_data_view_option > .user_assessment_preview {
    position: relative;
    width: auto;
    min-width: 32%;
    max-width: 32%;
    height: auto;
    padding: 0%;
    background-color: rgb(0, 125, 255);
    color: #ffffff;
    border: none;
    box-shadow: 0px 1px 2px -1px #000000;
    font-size: 0.6vw;
    outline: 0;
    margin-left: 1%;
    max-height: 1.8vh;
    min-height: 1.8vh;
}
.pitem.list_item_view {
    min-height: 2vh;
    max-height: 2vh;
}
.pitem.list_item_view > div {
    width: auto;
    max-width: 50%;
    min-width: 5%;
}
.pitem.list_item_view > div:nth-child(2){
    max-width: 50%;
    min-width: 50%;
    font-weight: bold;
}
.pitem.list_item_view > div:nth-child(3){
    max-width: 50%;
    min-width: 15%;
}
.pitem.list_item_view > div > span {
    padding-left: 5%;
    text-align: left;
}
.list_item_view .playlist_play, .list_item_view .syllabus_play, .list_item_view .course_play, .list_item_view .favorite_play {
    font-size: 0.8vw !important;
}
.list_item_view .playlist_play:hover, .list_item_view .syllabus_play:hover, .list_item_view .course_play:hover, .list_item_view .favorite_play:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.3);
}
.list_item_view > div > i:hover {
    cursor: pointer;
}
.oeg_default {
    position: relative;
    float: right;
    width: 5%;
    max-width: 5%;
    height: auto;
}
.oeg_default > img {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.toolkit_window {
    display: none;
    position: absolute;
    z-index: 1001;
    background-color: #fff;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    text-align: center;
    top: 0%;
    opacity: 0;
    object-fit: fill;
    min-height: 100vh;
    max-height: 100vh;
}
.toolkit_window_overlay {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0);
}
.toolkit_window_top {
    position: relative !important;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    box-shadow: 0 1px 3px -1px #000;
    opacity: 1;
    z-index: 10;
    background-color: #000000;
    color: #ffffff;
}
.toolkit_window_logo {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
}
.toolkit_window_logo > img {
    position: relative;
    float: left;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 100%;
    max-height: 4vh;
}
.toolkit_window_name {
    position: relative;
    float: right;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    min-height: 4vh;
    max-height: 4vh;
}
.toolkit_window_name > span {
    position: relative;
    padding: 1%;
    float: right;
    font-size: 0.9vw;
    max-height: 4vh;
}
.toolkit_window_contents {
    display: none;
    position: absolute;
    float: left;
    left: 0%;
    top: -15%;
    padding: 1%;
    width: auto;
    min-width: 15%;
    max-width: 30%;
    height: auto;
    text-align: left;
    opacity: 0;
    box-shadow: 0px 1px 3px -1px #000;
    z-index: 2;
    background-color: #000000;
    color: #ffffff;
}
.toolkit_notification_window {
    display: none;
    position: absolute;
    width: 30%;
    height: auto;
    min-height: 150px;
    max-height: 170px;
    left: 33%;
    padding: 1%;
    background-color: rgb(255,255,255);
    box-shadow: 0px 2px 3px 1px #000;
    
    top: -25%;
    z-index: 1003;
    color: #000;
    opacity: 0;
}
.toolkit_notification_window_top {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
.toolkit_notification_window_close {
    position: relative;
    float: right;
}
.toolkit_notification {
    position: relative;
    float: left;
    width: 100%;
    text-align: left;
    height: auto;
    margin-top: 2%;
    font-size: 0.8vw;
}
.toolkit_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 92vh;
    max-height: 92vh;
    background-color: #000;
}
.toolkit_window_content > iframe {
    position: relative;
    float: left;
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    height: auto;
    max-height: 92vh;
    min-height: 92vh;
}
.toolkit_window_content > iframe img {
    width: 100%;
    height: 100%;
    object-fit: fill;
}
.toolkit_window_content > video {
    position: relative;
    min-height: 92vh;
    max-height: 92vh;
    object-fit: fill;
}
.toolkit_window_complete {
    display: none;
    position: absolute;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: 0;
    margin: 0 auto;
    color: #fff;
    z-index: 10;
    top: 94%;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 40px;
    padding: 1%;
    opacity: 0;
}
.toolkit_window_tasks {
    display: block;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: 4vh;
    max-height: 4vh;
    color: #fff;
    border: none;
    background-color: #192a56;
}
.toolkit_window_toc {
    position: relative;
    float: left;
    width: auto;
    max-width: 11%;
    height: auto;
    padding: .3%;
    margin-top: .5%;
    
    font-size: .6vw;
    color: #000;
    font-weight: 700;
    left: 1%;
    border: none;
    box-shadow: 0 1px 3px 0 #000;
}
.toolkit_window_toc_button {
    position: relative;
    float: left;
    width: auto;
    min-width: 2.3%;
    max-width: 2.3%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    padding-left: 0.5%;
    padding-right: 0.5%;
}
.toolkit_window_toc_button img {
    display: block;
    max-width: 100%;
    max-height: 100%;
}
.toolkit_window_toc_button:hover {
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.1);
}
.toolkit_window_toc_button_active {
    background-color: rgba(255,255,255, 0.2);
}
.toolkit_window_replay {
    display: none;
    position: relative;
    float: left;
    color: #d3d3d3;
    font-size: 2vw;
    outline: 0;
}
.toolkit_window_replay:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.toolkit_window_rewatch {
    display: none;
    position: absolute;
    float: left;
    color: #d3d3d3;
    font-size: 2.5vw;
    outline: 0;
    top: 0.5%;
    left: 45%;
}
.toolkit_window_rewatch:hover {
    cursor: pointer;
    color: rgba(255,255,255,1);
    transition: all 1s;
}
#preview_course_window_rewatch {
    font-size: 1.5vw !important;
    top: 2.5% !important;
}
.toolkit_window_next {
    display: none;
    position: relative;
    float: right;
    color: #d3d3d3;
    font-size: 2vw;
    outline: 0;
}
.toolkit_window_next:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.toolkit_window_video_controls {
    display: block;
    position: relative;
    float: left;
    margin-left: 8%;
    z-index: 2;
    width: auto;
    min-width: 74%;
    max-width: 74%;
    height: 4vh;
    bottom: 0%;
    min-height: 4vh;
    max-height: 4vh;
}
.toolkit_window_play_pause {
    position: relative;
    float: left;
    width: auto;
    min-width: 2%;
    max-width: 2%;
    font-size: 1vw !important;
    margin-top: 0.7% !important;
}
.toolkit_window_seekbar {
    position: relative;
    width: auto !important;
    min-width: 70% !important;
    max-width: 70% !important;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    float: left;
    margin-left: 1%;
    margin-top: .6% !important;
    background-color: rgba(255,255,255,.1);
    
}
.toolkit_window_timebar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: rgba(245,0,0,.5);
    border-radius: 30px;
}
.toolkit_window_timecode {
    position: relative;
    float: left;
    font-size: .7vw !important;
    padding: .5%;
    width: auto;
    min-width: 8%;
    max-width: 8%;
    height: auto;
    color: #fff;
    font-weight: 700;
    margin-left: .2%;
}
.toolkit_window_volumebar {
    width: auto;
    min-width: 5%;
    max-width: 5%;
    position: relative;
    float: left !important;
    margin-top: .6% !important;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-right: 1%;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 30px;
}
.toolkit_window_volume {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    border-radius: 15px;
}
.toolkit_window_mute {
    display: none !important;
    position: relative;
    float: right !important;
    width: auto;
    height: auto;
    font-size: .9vw !important;
    margin-top: 1% !important;
    margin-right: .5%;
}
.toolkit_window_video_settings {
    position: relative;
    float: left;
    width: auto;
    min-width: 3%;
    max-width: 3%;
    height: auto;
    margin-top: 0.6%;
    font-size: 1vw;
}
.toolkit_window_exit {
    position: relative;
    float: right;
    width: auto;
    min-width: 5%;
    max-width: 8%;
    height: auto;
    padding: .2%;
    margin-top: .3%;
    font-size: 0.7vw;
    color: #000;
    font-weight: 700;
    right: 1%;
    border: none;
    box-shadow: 0 1px 3px -1px #000;
}
.toolkit_window_toc:hover, .toolkit_window_tasks > i:hover, .toolkit_window_exit:hover {
    cursor: pointer;
}
#content_window_recommended {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 80%;
    max-width: 80%;
    height: auto;
    min-height: 17vh;
    max-height: 17vh;
    background-color: rgba(0,0,0,0.8);
    z-index: 5;
    bottom: 9%;
}
#content_window_recommended_container {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    width: 80%;
    height: auto;
}
.recommended_video {
    position: relative;
    display: inline-block;
    width: auto;
    min-width: 24%;
    max-width: 24%;
    height: auto;
    min-height: 15vh;
    max-height: 15vh;
    margin-left: 2%;
    margin-right: 3%;
    padding: 1%;
}
.recommended_video:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.1);
}
.recommended_video_top, .recommended_video_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    text-align: center;
}
.recommended_video_bottom {
    overflow-x: hidden;
    white-space: nowrap;
}
.recommended_video_top video {
    width: 100%;
    height: auto;
}
.recommended_video_bottom span {
    font-size: 0.7vw;
    color: #fff;
}
#company_images {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 71vh;
    max-height: 71vh;
    overflow-y: auto;
}
.company_image_container {
    position: relative;
    float: left;
    padding: 0.5%;
    max-width: 15%;
    min-width: 15%;
    max-height: 15vh;
    min-height: 15vh;
    border: 1px solid #e7e7e7;
    margin-right: 0.5%;
    margin-bottom: 0.5%;
}
.company_image_container:hover {
    cursor: pointer;
}
.company_image_container_selected {
    background-color: rgba(0,128,0,0.5);
}
.company_image {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 15vh;
    max-height: 15vh;
    object-fit: contain;
}
#company_images_library_window {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 97%;
    max-width: 97%;
    height: auto;
    min-height: 84vh;
    max-height: 84vh;
    padding: 0.5%;
    background-color: #fff;
    color: #000;
    font-size: 0.8vw;
    box-shadow: 0 1px 2px -1px #000;
    z-index: 1001;
    top: 9%;
    left: 1%;
}
#company_images_library_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 1%;
    color: #fff;
    font-size: 0.8vw;
    margin-bottom: 0.5%;
    background-color: #192a56;
}
#company_images_library_window_close {
    position: relative;
    float: right;
}
#company_images_library_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh; 
}
#company_images_library_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 73vh;
    max-height: 73vh;
    margin-bottom: 0.5%;  
}
#company_images_library_window_bottom button {
    position: relative;
    float: right;
    max-width: 15%;
    min-width: 10%;
    width: auto;
    height: auto;
    padding: .5%;
    color: #fff;
    
    font-size: .8vw;
    border: none;
    margin-left: 1%;
}
#company_images_library_window_select {
    background-color: rgb(0,128,0);
}
#company_images_library_window_select:hover {
    background-color: rgba(0,128,0,0.7);
}
#company_images_library_window_cancel {
    background-color: rgb(204,0,0);
}
#company_images_library_window_cancel:hover {
    background-color: rgba(204,0,0,0.7);
}
#question_image_select, #edit_question_image_select {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 21%;
    max-width: 21%;
    padding: 0.5%;
    color: #fff;
    letter-spacing: 1px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    background-color: rgba(0,0,0,.75);
    font-size: 0.7vw;
}
#upload_new_question_image {
    position: relative;
    float: right;
    width: auto;
    min-width: 48%;
    max-width: 48%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    background-color: #192a56;
    color: #fff;
    font-size: 0.7vw;
    letter-spacing: 1px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
}
#question_image_upload {
    display: block;
}
#question_image_upload_preview {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 23vh;
    max-height: 23vh;
}
#question_image_upload_preview img {
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 23vh;
    object-fit: contain;
}
#edit_question_image {
    position: relative;
    float: left;
    width: 20%;
    height: auto;
}
#edit_question_image img {
    width: 100%;
    height: auto;
}
#content_notes_last_modified {
    position: relative;
    float: right;
    width: auto;
    max-width: 50%;
    height: auto;
    font-size: 0.6vw;
    padding: 0.3%;
}
.walkthrough_window {
    display: none;
    position: absolute;
    z-index: 1002;
    width: auto;
    max-width: 20%;
    min-width: 15%;
    padding: 1%;
    height: auto;
    box-shadow: 0px 1px 3px -1px #000;
    font-size: 0.9vw;
    border: 2px solid rgb(0,128,0);
}
.walkthrough_window_content, .walkthrough_window_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.walkthrough_window_content {
    margin-bottom: 10%;
}
.walkthrough_highlight_item {
    background-color: rgb(0,128,0);
    color: #fff;
}
.walkthrough_window_next {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 25%;
    max-width: 25%;
    padding: 0.2%;
    color: #ffffff;
    font-size: 0.6vw;
    letter-spacing: 1.5px;
    font-family: 'Varela Round', sans-serif;
    outline: 0;
    background-color: rgba(0,128,0,1);
    border: 0;
    box-shadow: 0 3px 5px 0px #000;
    transition: all .5s;
    
}
.walkthrough_window_next:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,.45);
}
.result_info_container {
    position: relative;
    float: left;
    width: 98%;
    padding: 1%;
    height: auto;
    margin-top: 1%;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding-bottom: 2%;
}
.content_left_screen_name_edit {
    position: relative;
    float: right;
    color: rgb(0,128,0);
}
.content_left_screen_name_edit:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
#content_left_screen_edit_window {
    display: none;
    position: absolute;
    z-index: 1000;
    background-color: #fff;
    width: auto;
    height: auto;
    padding: 1%;
    box-shadow: 0px 1px 3px 0px #000;
    min-width: 20%;
    max-width: 30%;
    
    top: 13%;
    left: 1.5%;
    font-size: 0.8vw;
}
#content_left_screen_edit_close {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #000;
}
#content_left_screen_edit_close > span {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    font-weight: bold;
}
#content_left_screen_edit_close > i {
    position: relative;
    float: right;
    margin-right: 1%;
}
#content_left_screen_edit_close > i:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.75);
}

#content_left_screen_edit_top {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#content_left_screen_edit_top > input[type='text'] {
    position: relative;
    float: left;
    width: 97%;
    height: auto;
    margin-bottom: 2%;
    font-size: 0.8vw;
    padding: 1%;
    color: #000000;
    background-color: rgba(0,0,0,0.1);
    
    border: none;
    box-shadow: 1px 1px 1px 0px #000;
}
#content_left_screen_edit_bottom {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#content_left_screen_edit_bottom > span {
    opacity: 0;
    position: relative;
    float: left;
    width: auto;
    height: auto;
    color: rgb(0,128,0);
    font-size: 0.8vw;
    font-weight: bold;
}
#content_left_screen_edit_update {
    position: relative;
    width: auto;
    float: right;
    height: auto;
    padding: 1%;
    color: #ffffff;
    font-size: 0.8vw;
    letter-spacing: 1.5px;
    border-radius: 0px;
    outline: 0;
    border: 0;
    background-color: rgb(0,128,0);
    box-shadow: 0 3px 9px 0 #000;
    transition: all .5s;
    opacity: 1;
}
#content_left_screen_edit_update:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.7);
}
.assignment_remediation_active {
    background-color: rgb(0,128,0) !important;
}
.assignment_remediation_inactive {
    background-color: rgb(204,0,0) !important;
}
.assignment_dates_required_no {
    background-color: rgb(204,0,0) !important;
}
.assignment_dates_required_yes {
    background-color: rgb(0,128,0) !important;
}

#loader_window {
    display: none;
    position: absolute;
    z-index: 1000;
    width: auto;
    min-width: 10%;
    max-width: 15%;
    left: 40%;
    top: 0%;
    background-color: #fff;
    padding: 1%;
    
    box-shadow: 0px 1px 3px -1px #000;
    text-align: center;
    color: #000;
    font-size: 0.8vw;
    opacity: 0;
}
#loader_window > span {
    position: relative;
    margin-top: 2%;
    float: left;
    width: 100%;
}
.loader {
  margin: 0 auto;
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 100px;
  height: 100px;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.dashboard_window_scroll {
    overflow-x: hidden;
    overflow-y: auto;
}
.dashboard_window {
    display: none;
    position: absolute;
    z-index: 101;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 92vh;
    max-height: 92vh;
    padding: 1%;
    background-color: #fff;
    color: #000000;
    box-shadow: 0 1px 3px -1px #000;
    letter-spacing: 1.5px;
    top: 0;
    left: 0;
    opacity: 0;
    overflow-x: hidden;
    overflow-y: auto;
}
.dashboard_window_top, .dashboard_window_taskbar, .dashboard_window_center, .dashboard_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3.5vh;
    max-height: 3.5vh;
    color: #000;
    margin-bottom: 1%;
    background-color: #e7e7e7;
}
.dashboard_window_close {
    position: relative;
    float: right;
    width: auto;
    min-width: 1%;
    height: auto;
    right: 0.5%;
    color: #fff;
    margin-top: 0.5%;
}
.dashboard_window_close:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.75);
}
.dashboard_window_taskbar table {
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-size: 0.7vw;
}
#dashboard_toolkit_window_top > span:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    max-width: 90%;
    min-width: 50%;
    height: auto;
    padding: 0.5%;
    color: #fff;
}
#dashboard_toolkit_window_top > span > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 3%;
    max-width: 3%;
    height: auto;
    margin-right: 1%;
}
#dashboard_toolkit_window ul {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    max-height: 36vh;
    overflow-x: hidden;
    overflow-y: auto;
    list-style: none;
    margin: 0;
    font-size: 0.7vw;
    padding: 1%;
    border: 1px solid #d7d7d7;
    margin-top: 0.5%;
}
#dashboard_toolkit_window ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
#dashboard_toolkit_window.additional_settings {
    
    margin-left: 27%;
    margin-top: 0.5%;
    max-width: 23%;
    min-width: 23%;
    min-height: 88.2vh;
    max-height: 88.2vh;
    z-index: 5;
}
#dashboard_toolkit_window.additional_settings #dashboard_toolkit_window_top {
    background-color: transparent;
    border-bottom: 2px solid #192a56;
}
#dashboard_toolkit_window.additional_settings #dashboard_toolkit_window_top > span:nth-child(1) {
    text-transform: capitalize;
}
#dashboard_toolkit_window.additional_settings #dashboard_toolkit_window_top > span:nth-child(1), #dashboard_toolkit_window.additional_settings #dashboard_toolkit_window_close {
    font-size: 0.7vw;
    color: #000;
}
#dashboard_toolkit_window.additional_settings #dashboard_toolkit_window_center > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-size: 0.7vw;
}
.dashboard_window_menu_content {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 61vh;
    max-height: 61vh;
    padding: 0%;
    font-size: 0.7vw;
    overflow-x: hidden;
    overflow-y: auto;
}
.dashboard_window_menu_content > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 0.5%;
}
.resource_parameters_shorten {
    max-height: 49vh;
    overflow-x: hidden;
}
.dashboard_window_menu {
    display: block;
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 0.5%;
    font-size: 0.7vw;
    margin-bottom: 0.5%;
    color: #fff;
}
.dashboard_window_menu:hover {
    cursor: pointer;
    font-weight: bold;
}
.dashboard_window_menu_navigation {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.dashboard_window_menu_navigation button {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 6%;
    max-width: 10%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    background-color: rgba(0,0,0,.75);
    margin-left: 0.5%;
}
.dashboard_window_menu_navigation button:hover {
    cursor: pointer;
    opacity: .75;
}
#dashboard_window_menu_content_parameters_list table, #dashboard_window_menu_review_parameters table {
    width: 100%;
}
#dashboard_window_menu_content_parameters_list th, #dashboard_window_menu_content_parameters_list td {
    text-align: left;
}
#dashboard_window_content_search {
    min-height: 2.5vh;
    max-height: 2.5vh;
    background-color: #e7e7e7;
    padding: 0.5%;
    min-width: 99%;
    max-width: 99%;
    margin-bottom: 0.5%;
}
#dashboard_window_content_search > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 5%;
    max-width: 5%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-right: 1%;
    font-size: 0.8vw;
}
#dashboard_window_content_search > input {
    position: relative;
    float: left;
    width: auto;
    min-height: 1.5vh;
    max-height: 1.5vh;
    font-size: 0.75vw;
    padding-left: 1%;
    letter-spacing: 1px;
}
#assignment_parameter_applyall {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 90%;
    max-width: 100%;
    padding: .5%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 2px 4px -2px #000;
    transition: all .5s;
    
    background-color: rgba(0,0,0,.75);
    margin-right: 1%;
}
button:hover {
    cursor: pointer;
}
.assignment_parameter_applyall_selected {
    background-color: rgba(0,128,0,.75) !important;
}
#assign_student_label {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    height: auto;
}
#auto_assign_students, #manual_assign_students {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 13%;
    max-width: 15%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 2px 4px -2px #000;
    transition: all .5s;
    
    background-color: rgba(0,0,0,.75);
    margin-right: 1%;
}
.assignment_student_option_selected {
    background-color: rgb(0,128,0) !important;
}
#assignment_students_auto_assign > span {
    position: relative;
    width: auto;
    font-weight: bold;
    text-decoration: underline;
    margin-bottom: 1%;
}
#assignment_students_auto_assign table {
    width: 50%;
    max-width: 50%;
}
.assignment_auto_assign_none {
    color: rgb(204,0,0);
    font-weight: bold;
}
#dashboard_popup_window {
    opacity: 1;
    min-width: 90%;
    max-width: 90%;
    left: 4%;
    top: 14%;
    border: 1px solid #000;
    font-size: 0.7vw;
    max-height: 30vh;
}
#dashboard_popup_window ul {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}
#dashboard_popup_window ul > li {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    border-bottom: 1px solid #000;
    margin-bottom: 0.5%;
}
#dashboard_popup_window ul > li:nth-child(odd){
    background-color: #e7e7e7;
}
#dashboard_popup_window table {
    width: auto;
    min-width: 100%;
    max-width: 100%;
}
#dashboard_popup_window_message, #dashboard_popup_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
}
#dashboard_popup_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 10%;
    max-width: 10%;
    padding: .5%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 2px 4px -2px #000;
    transition: all .5s;
    
    background-color: rgba(0,0,0,.75);
    margin-right: 1%;
}
#content_window_info {
    opacity: 0;
    display: none;
    position: absolute;
    float: right;
    z-index: 1002;
    width: auto;
    min-width: 35%;
    max-width: 35%;
    height: auto;
    min-height: 9vh;
    background-color: #fff;
    color: #000;
    font-size: 0.8vw;
    padding: 1%;
    top: 8%;
    right: 18%;
    box-shadow: 0px 1px 3px -1px #000;
}
#content_window_info_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    background-color: #e7e7e7;
}
#content_window_info_close {
    position: relative;
    float: right;
    right: 1%;
    color: #000;
}
#content_window_info_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
}
#user_assessment_question_icon {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3.5vh;
    max-height: 3.5vh;
    background-color: #000;
    color: #fff;
    border: none;
    
    text-align: center;
    pointer-events: none;
}
#user_assessment_question_icon i {
    font-size: 1.2vw;
}
#user_assessment_questions {
    max-height: 65vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.user_assessment_question_handle {
    position: relative;
    float: left;
    width: auto;
    max-width: 2%;
    min-width: 2%;
    height: auto;
    text-align: center;
}
.user_assessment_question_sort {
    position: relative;
    float: left;
    width: auto;
    min-width: 2%;
    max-width: 2%;
    height: auto;
}
.user_assessment_question_text {
    position: relative;
    float: left;
    width: auto;
    max-width: 95%;
    min-width: 95%;
    height: auto;
}
#assessment_question_randomize_label {
    position: relative;
    float: left;
    width: auto;
    min-width: 13%;
    max-width: 13%;
    height: auto;
    font-size: 0.8vw;
}
#assessment_question_randomize {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    min-width: 5%;
    max-width: 5%;
    padding: 0%;
    font-size: .8vw;
    border: 1px solid #d7d7d7;
    
}
.user_refresher {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
    padding: 1%;
    margin-bottom: 1%;
    list-style: none;
    background-color: #fff;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.user_refresher > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.user_refresher > div:nth-child(1) > div:nth-child(1) {
    position: relative;
    float: left;
    font-weight: bold;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
}
.user_refresher > div:nth-child(1) > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 1%;
    margin-top: 1%;
}
.user_refresher > div:nth-child(1) > div:nth-child(3) {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_refresher > div:nth-child(1) > div:nth-child(4) {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
}
.user_refresher_edit {
    color: rgb(0,128,0);
}
.user_refresher_edit:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.7);
}
.user_refresher_delete {
    color: rgb(204,0,0);
}
.user_refresher_delete:hover {
    cursor: pointer;
    color: rgba(204,0,0,0.7);
}
.refresher_questions, .refresher_assign {
    position: relative;
    float: left;
    text-align: center;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    margin-top: 9%;
    color: rgb(0,128,0);
    font-size: 1vw;
}
.refresher_questions:hover, .refresher_assign:hover {
    cursor: pointer;
    color: rgba(0,128,0,0.5);
}
.refresher_remove {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    margin-top: 14%;
    color: rgb(204,0,0);
    font-size: 1vw;
}
.refresher_remove:hover {
    cursor: pointer;
    rgba(204,0,0,0.5);
}
.refresher_questions:hover, .refresher_assign:hover {
    cursor: pointer;
}
#refresher_question_table {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 70vh;
    font-size: 0.7vw;
}
#refresher_question_table > table tr:nth-child(even){
    background-color: #e7e7e7;    
}

#refresher_question_bottom, #refresher_assign_bottom {
    position: relative;
    float: left;
    width: auto;
    max-width: 98%;
    min-width: 98%;
    height: auto;
    padding: 1%;
}
#refresher_question_bottom > button, #refresher_assign_bottom > button {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 7%;
    max-width: 7%;
    padding: .5%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 2px 4px -2px #000;
    transition: all .5s;
    
    background-color: rgba(0,0,0,.75);
    margin-left: 1%;
}
#refresher_question_selected_count, #refresher_assign_selected_count {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    background-color: rgba(23, 189, 3, 0.4);
    border: 1px solid #e7e7e7;
    color: #000;
    font-size: 0.7vw;
    padding: 0.5%;
    
}
#refresher_assign_students_manual_assign {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 1%;
    max-height: 70vh;
    overflow-x: hidden;
    overflow-y: auto;
}
#refresher_assign_students, #refresher_assign_learner_lists {
    position: relative;
    float: left;
    width: auto;
    max-width: 49%;
    min-width: 49%;
    padding-right: 1%;
    height: auto;
}
#refresher_assign_students_bank {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
#refresher_assign_students_bank li:nth-child(even) {
    background-color: #e7e7e7;
}
.oeg_scorm {
    position: relative;
    float: left;
    width: auto;
    min-width: 99.7%;
    max-width: 99.7%;
    padding: 0;
    margin: 0;
    height: auto;
    min-height: 99.6%;
    max-height: 99.6%;
}
.add_project_folder_success {
    color: green !important;
}
.scorm_download_folder {
    display: none;
    position: relative;
    float: right;
    width: auto;
    min-width: 45%;
    max-width: 45%;
    height: auto;
    color: #fff;
    opacity: 0;
    text-align: center;
    background-color: rgba(0,128,0,0.7);
}
.scorm_download_folder:hover {
    cursor: pointer;
}
.scorm_download_folder > i {
    color: #fde5a1 !important;
    font-size: 0.8vw;
}
.open_resource {
    min-height: 51vh;
    max-height: 51vh;
}
.user_resource_content_cover {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 7vh;
    max-height: 7vh;
    background-color: #192a56E6;
    color: #fff;
    text-align: center;
}
.user_resource_content_cover > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-top: 22%;
    font-weight: bold;
    min-height: 4vh;
    max-height: 4vh;
}
.content_header_bar, .dashboard_window_top, .dashboard_window_menu {
    background-color: #192a56;
}
//Admin
#view_company_branding_window_content ul {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}
#view_company_branding_window_content ul > li {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 1%;  
}
#view_company_branding_window_content label {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
}
#view_company_branding_window_content input {
    position: relative;
    float: left;
    width: auto;
    min-width: 40%;
    max-width: 40%;
}
.company_branding_logo {
    position: relative;
    float: left;
    width: 40%;
    min-width: 25%;
    max-width: 40%;
    height: auto;
    margin-left: 1%;
    margin-right: 1%;
}
.company_branding_logo > img {
    width: 100%;
    height: auto;
}
#view_company_branding_cancel {
    position: relative;
    float: right;
    width: auto;
    max-width: 8%;
    min-width: 8%;
    height: auto;
    padding: 0.5%;
    background-color: rgb(204,0,0);
    border: none;
    box-shadow: 0px 1px 3px -1px #000;
    color: #fff;
    margin-left: 1%;
}
#view_company_branding_cancel:hover {
    cursor: pointer;
    background-color: rgba(204,0,0,0.7);
}
#view_company_branding_update {
    position: relative;
    float: right;
    width: auto;
    max-width: 8%;
    min-width: 8%;
    height: auto;
    padding: 0.5%;
    background-color: rgb(0,125,255);
    border: none;
    box-shadow: 0px 1px 3px -1px #000;
    color: #fff;
}
#view_company_branding_update:hover {
    cursor: pointer;
    background-color: rgba(0,125,255,0.7);
}
#view_company_branding_window_close {
    position: relative;
    float: right;
    right: 1%;
    font-size: 1vw;
    color: #fff;
}
#view_company_branding_window_close:hover {
    cursor: pointer;
    color: rgba(255,255,255,.7);
}
#view_company_branding_window_content_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 1%;
}
#view_company_branding_window_content_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
}
#view_company_branding_window_content_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    display: none;
}
#view_company_branding_window_preview {
    position: relative;
    float: left;
    width: 99%;
    height: auto;
    border: 1px solid rgba(0,0,0,1);
}
#view_company_branding_revert {
    position: relative;
    float: right;
    width: auto;
    min-width: 21%;
    max-width: 21%;
    height: auto;
    color: #fff;
    background-color: #192a56;
    box-shadow: 0px 1px 3px -1px #000;
    font-size: 0.7vw;
    outline: 0;
    padding: 0.5%;
    border: none;
}
#view_company_branding_revert:hover {
    cursor: pointer;
    background-color: rgba(25,42,86,0.7);
}
.company_branding_preview_screen {
    display: none;
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    min-height: 300px;
    max-height: 300px;
    background-color: #e4e4e4;
}
.company_branding_preview_header {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    background-color: #000000;
    box-shadow: rgb(228, 228, 228) 0px 1px 3px 0px;
}
.company_branding_preview_logo {
    position: relative;
    float: left;
    width: 15%;
    height: auto;
    margin-top: .7%;
}
.company_branding_preview_logo img {
    width: 100%;
    height: auto;
}
.company_branding_preview_profile {
    position: relative;
    float: right;
    width: 4%;
    height: auto;
    padding-top: 0.5%;
    color: #fff;
}
.company_branding_preview_content {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}
.company_branding_preview_content_left {
    position: relative;
    float: left;
    width: 15%;
    height: auto;
    color: #000;
    font-size: 0.6vw;
    margin-top: .2%;
    background-color: #000000;
    padding: 1%;
    padding-bottom: 27%;
    max-height: 100%;
}
.company_branding_preview_content_right {
    position: relative;
    float: left;
    width: 82.5%;
    height: auto;
    color: #fff;
    font-size: 0.5vw;
}
.company_branding_preview_video {
    position: relative;
    float: left;
    width: 24%;
    height: auto;
    margin-left: 1%;
    margin-right: 0%;
    margin-bottom: 1%;
    border-radius: 10px;
    background-color: #1d1d1d;
    box-shadow: 0 1px 5px -1px #000;
    color: #fff;
    padding-bottom: 15%;
    margin-top: 1%;
}
.company_branding_preview_video_header {
    position: relative;
    float: left;
    width: 91%;
    height: auto;
    padding: 1%;
    padding-left: 8%;
}
.company_branding_preview_menu {
    position: relative;
    float: left;
    width: 94%;
    height: auto;
    padding: 3%;
    font-size: .9vw;
    background-color: #000000;
    box-shadow: 0 1px 1px -1px #000;
    border: 1px solid #fff;
    
    margin-bottom: 2%;
    letter-spacing: 1.5px;
    color: #fff;
    padding-bottom: 20%;
}
.company_branding_preview_content_window {
    position: relative;
    float: left;
    left: 15%;
    margin-top: 5%;
    width: 65%;
    max-width: 65%;
    height: auto;
    padding: 1%;
    background-color: #fff;
    box-shadow: 0 1px 5px -1px #000;
}
.company_branding_preview_content_window_header {
    position: relative;
    float: left;
    width: 98%;
    height: auto;
    background-color: #192a56;
    font-size: 0.5vw;
    
    box-shadow: 0 2px 3px -1px #000;
    margin-bottom: 1%;
}
.company_branding_preview_content_window_header span:nth-child(1) {
    position: relative;
    float: left;
    left: 3%;
}
.company_branding_preview_content_window_header span:nth-child(2) {
    position: relative;
    float: right;
    right: 1%;
}
.company_branding_preview_content_window_table {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    padding-bottom: 30%;
}
.company_branding_preview_content_header {
    position: relative;
    float: left;
    width: 98%;
    padding: 1%;
    height: auto;
    background-color: #192a56;
    font-weight: bold;
    box-shadow: 0px 1px 3px -1px #000;
}
.company_branding_preview_content_header span {
    position: relative;
    float: left;
    left: 1%;
    color: #fff;
    font-size: 0.5vw;
}
.company_branding_preview_content_header button {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 15%;
    max-width: 15%;
    padding: 0.2%;
    color: #ffffff;
    font-size: 0.4vw;
    letter-spacing: 1.5px;
    font-family: 'Varela Round', sans-serif;
    outline: 0;
    background-color: rgba(0,128,0,1);
    border: 0;
    box-shadow: 0 3px 5px 0px #000;
    transition: all .5s;
    
}
#view_company_branding_window_screen_select {
    position: relative;
    float: left;
    margin: 0 auto;
    width: 98%;
    background-color: rgba(0,0,0,0.1);
    
    padding: 1%;
    margin-top: 1%;
    text-align: center;
}
.preview_screen_select {
    font-size: 1vw;
    margin-right: 5%;
    margin-left: 5%;
    color: #000;
}
.preview_screen_select:hover {
    cursor: pointer;
    color: rgb(255,255,255);
}
.preview_screen_select_active {
    color: #fff !important; 
}
header.mobileKL {
    display: none;
}
.mobileKL > .toolkit_window_top {
    display: none;
}
.mobileKL > .toolkit_window_content {
    min-height: 100vh;
    max-height: 100vh;
}
.mobileKL > .toolkit_window_content video {
    min-height: 100vh;
    max-height: 100vh;
}
.mobileKL > .toolkit_window_tasks {
    display: block;
    position: absolute;
    bottom: 0%;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: 10vh;
    max-height: 10vh;
    color: #fff;
    border: none;
    background-color: transparent !important;
}
.mobileKL .toolkit_window_toc_button, .mobileKL .toolkit_window_exit, .mobileKL .toolkit_window_volumebar {
    display: none;
}
.mobileKL > .toolkit_window_tasks i {
    font-size: 3vw !important;
    bottom: 20%;
    margin-right: 2%;
}
.mobileKL .toolkit_window_seekbar {
    min-height: 5vh;
    max-height: 5vh;
}
.mobileKL .toolkit_window_timecode {
    font-size: 2vw !important;
    max-width: 20%;
}
.mobileKL .toolkit_window_complete {
    top: 92%;
    border-radius: 0px;
}
.mobileKL .toolkit_window_next, .mobileKL .toolkit_window_replay {
    font-size: 2vw;
}
.mobileKL .pop_quiz {
    position: relative;
    float: left;
    width: auto;
    min-width: 90%;
    max-width: 90%;
    height: auto;
    min-height: 87vh;
    max-height: 87vh;
    background-color: #e7e7e7;
    padding: 3%;
    margin-left: 4%;
}
.mobileKL .quiz_name, .mobileKL .quiz_num, .mobileKL .pop_quiz_question_type {
    font-size: 1.3vw;
}
.mobileKL .question {
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 12vh;
    max-height: 12vh;
    text-align: left;
    margin-bottom: 1%;
    opacity: 0;
    font-weight: bold;
    font-size: 1.2vw;
}
.mobileKL .question_set {
    min-width: 99.5%;
    max-width: 99.5%;
}
.mobileKL .answer {
    font-size: 1.1vw;
}
.mobileKL #pop_quiz_submit, .mobileKL #assessment_submit {
    min-width: 25%;
    font-size: 1.5vw;
}
.mobileKL #assessment {
    min-height: 96vh;
    max-height: 96vh;
}
.mobileKL .assessment_question {
    min-width: 81%;
    max-width: 81%;
    height: auto;
    min-height: 65vh;
    max-height: 65vh;
    margin-left: 10%;
    margin-top: 5%;
}
.mobileKL .assessment_question .pop_quiz_question_type {
    border: none !important;
    font-size: 1.5vw;
}
.mobileKL #assessment_question_text {
    min-height: 11vh;
    max-height: 11vh;
    font-size: 1.5vw;
}
.mobileKL #assessment_question_answers {
    min-height: 46vh;
    max-height: 46vh;
}
.mobileKL .assessment_answer {
    min-height: 6vh;
    max-height: 6vh;
    font-size: 1.1vw;
}
.mobileKL #assessment_bottom {
    min-width: 70%;
    max-width: 70%;
    min-height: 8vh;
    max-height: 8vh;
}
.oe_answer {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    min-height: 4vh;
    max-height: 4vh;
}
.oe_answer > input {
    position: relative;
    float: left;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    border: 1px solid rgba(0,0,0,0.2);
    color: #000;
    font-size: 0.8vw;
    padding-left: 1%;
}
.so_answer {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    margin-bottom: 1%;
    min-height: 2vh;
}
.so_answer > input {
    position: relative;
    float: left;
    width: auto;
    min-width: 3%;
    max-width: 3%;
    height: auto;
    text-align: center;
    margin-right: 1%;
    border: 1px solid rgba(0,0,0,0.2);
    color: #000;
}
.so_answer > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 87%;
    max-width: 87%;
    height: auto;
}
#edit_quiz_name_update {
    position: relative;
    margin-left: 0.5%;
    width: auto;
    min-width: 8%;
    max-width: 8%;
    height: auto;
    font-size: 0.7vw;
    color: #fff;
    background-color: rgb(0,128,245);
    border: 0;
    outline: 0;
    box-shadow: 0px 1px 3px -1px #000000;
    letter-spacing: 1.5px;
}
#edit_quiz_name_update:hover {
    cursor: pointer;
    background-color: rgba(0,128,245,0.7);
}
.popup_right_side {
    z-index: 2000 !important;
    left: 35% !important;
    top: 32% !important;
}
#resource_stat_screen {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 90.5vh;
    max-height: 90.5vh;
    background-color: #fff;
    padding: 1%;
    opacity: 0;
    transition: 0.5s all;
    z-index: 3;
}
#resource_stat_screen > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 90.5vh;
    overflow-x: hidden;
    overflow-y: auto;
}
#resource_stat_screen_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 0.5%;
    background-color: #192a56;
}
#resource_stat_screen_title {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    color: #fff;
    letter-spacing: 1.5px;
    font-weight: bold;
}
#resource_stat_screen_close {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    color: #fff;
    text-align: right;
}
#resource_stat_screen_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    color: #000;
    font-size: 0.7vw;
}
#resource_stat_screen_content > div {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    padding: 1%;
}
#resource_stat_screen_content > div > .banner {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    margin-bottom: 0.5%;
    background-color: #e7e7e7;
    padding: 0.5%;
}
.banner_toggle {
    position: relative;
    float: right;
    right: 1%;
}
.banner_toggle:hover {
    cursor: pointer;
}
#resource_stat_screen_content table {
    font-size: 0.6vw;
}
#resource_stat_screen_content table tr:nth-child(even) {
    background-color: #e7e7e7;
}
#resource_stat_screen_content > div.col3 {
    min-width: 31%;
    max-width: 31%;
}
#resource_stat_screen_content > div.col5 {
    min-width: 48%;
    max-width: 48%;
}
#resource_stat_screen_content > div.col6 {
    min-width: 64%;
    max-width: 64%;
}
#resource_stat_screen_content > div.col10 {
    min-width: 86%;
    max-width: 86%;
}
#resource_stat_screen_content > div.col12 {
    min-width: 98%;
    max-width: 98%;
}
#oeg_administrator {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 1%;
    font-size: 0.7vw;
    color: #fff;
    margin-top: 5%;
    background-color: rgba(25,42,86,1);
}
#oeg_administrator:hover {
    cursor: pointer;
    background-color: transparent;
    border: 1px solid rgb(25,42,86,1);
    
}
#oeg_administrator span {
    position: relative;
    float: left;
    width: auto;
    min-width: 90%;
    max-width: 90%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-top: 0.6%;
    padding-left: 2%;
}
#oeg_administrator i {
    position: relative;
    float: right;
    right: 1%;
    width: auto;
    min-width: 6%;
    max-width: 6%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-top: 1.1%;
    font-size: .8vw;
}
#system_notice {
    display: none;
    position: absolute;
    z-index: 1001;
    float: left;
    width: 99.5%;
    height: auto;
    bottom: 0%;
    color: #fff;
    font-size: 0.8vw;
    padding: 0.5%;
    letter-spacing: 1.5px;
    opacity: 0;
}
.system_notice_error {
    background-color: rgba(204,0,0,0.9);
}
.system_notice_success {
    background-color: rgba(0,128,0,0.9);
}
.system_notice_warning {
    background-color: rgba(251,174,2,0.9);
}
#system_notice_message {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 75%;
    height: auto;
}
#system_notice_close {
    position: relative;
    float: right;
    width: auto;
    max-width: 25%;
    height: auto;
    text-align: right;
    right: 1%;
}
#system_notice_close:hover {
    cursor: pointer;
    color: rgba(255,255,255,0.75);
}
#content_window_options {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 40%;
    max-width: 40%;
    height: auto;
    min-height: 23vh;
    max-height: 23vh;
    padding: 1%;
    top: 30%;
    left: 16%;
    background-color: #fff;
    color: #000;
    font-size: 0.8vw;
    z-index: 101;
    box-shadow: 0px 1px 3px -1px #000;
    letter-spacing: 1.5px;
    opacity: 0;
}
#content_window_options_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 1.5vh;
    max-height: 1.5vh;
    padding: 1%;
    background-color: #192a56;
    color: #fff;
    margin-bottom: 0.5%;
}
#content_window_options_name {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 1.5vh;
    max-height: 1.5vh;
}
#content_window_options_close {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 1.5vh;
    max-height: 1.5vh;
    text-align: right;
}
#content_window_options_close:hover {
    cursor: pointer;
}
#content_window_options_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 96%;
    max-width: 96%;
    height: auto;
    padding: 2%;
}
#content_window_options_content span {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
}
#content_window_options_content button:hover {
    cursor: pointer;
    background-color: #192a56CC;
}
#asset_integration_options {
    position: relative;
    float: left;
    width: auto;
    min-width: 94%;
    max-width: 94%;
    height: auto;
    min-height: 25vh;
    max-height: 25vh;
    padding: 3%;
    margin-top: 4%;
}
#asset_integration_options .heading {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    color: #000;
}
#asset_integration_options .content_divider_hor {
    margin-top: 1%;
    margin-bottom: 3%;
}
.asset_integration_option {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 6vh;
    max-height: 15vh;
    margin-bottom: 1%;
}
#asset_integration_options .fa-info-circle {
    font-size: 0.6vw;
}
#asset_integration_options .fa-copy {
    position: relative;
    float: left;
    width: auto;
    min-width: 5%;
    max-width: 5%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-right: 2%;
    color: #000000;
    margin-top: 1.5%;
}
#asset_integration_options input {
    position: relative;
    float: right;
    min-width: 88%;
    max-width: 88%;
}
#asset_integration_options input:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.1);
}
#asset_integration_options button {
    margin-left: 0;
    padding: 1%;
    min-height: 2.5vh;
    max-height: 2.5vh;
    min-width: 80%;
    max-width: 80%;
    margin-top: 2%;
    padding-left: 5%;
}
#download_asset_sco, #download_asset_sco_wquiz {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 17%;
    max-width: 17%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    color: #fff;
    box-shadow: 0px 1px 3px -1px #000;
    border: none;
    margin-left: 1%;
    background-color: rgb(0,128,0);
    padding: 1%;
    letter-spacing: 0px;
    text-align: center;
    font-size: 0.7vw;
    margin-top: 2%;
}
#download_asset_sco:hover {
    cursor: pointer;
    background-color: rgba(0,128,0,0.8);
}
#external_asset_link, #api_asset_link {
    position: relative;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 50%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    background-color: #192a56;
    color: #fff;
    box-shadow: 0px 1px 3px -1px #000;
    border: none;
    
    font-size: 0.7vw;
}
#asset_fullscreen {
    display: none;
}
#content_window_fullscreen_exit {
    position: absolute;
    z-index: 2;
    float: right;
    right: 1%;
    bottom: 1%;
    width: auto;
    min-width: 7%;
    max-width: 7%;
    padding: 0.5%;
    height: auto;
    background-color: rgb(25,42,86);
    color: #fff;
    
    box-shadow: 0px 1px 3px -1px #000;
    border: 1px solid #fff;
}
#content_window_fullscreen_exit:hover {
    cursor: pointer;
    background-color: rgba(25,42,86,0.7);
}
.chart {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.stat_icon {
    position: relative;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    margin: 0 auto;
    font-size: 0.7vw;
    
    color: rgb(225,0,0);
    height: auto;
    outline: 0;
    background-color: transparent;
    border: 1px solid #e7e7e7;
    box-shadow: 0px 1px 1px -1px #000;
}
.stat_icon:hover {
    cursor: pointer;
    color: rgba(225,0,0,0.5);
    font-weight: bold;
}
#launch_course_window_popup, #preview_course_window_popup {
    display: none;
    position: absolute;
    z-index: 2;
    top: 5%;
    margin-left: 1%;
    background-color: #192a56;
    border: 1px solid #192a56;
}
#launch_course_window_popup_top, #preview_course_window_popup_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    padding: 1%;
    height: auto;
    text-align: right;
}
#launch_course_window_popup_close, #preview_course_window_popup_close {
    position: relative;
    color: #000;
    background-color: #fff;
    padding: 0.5%;
    float: right;
    min-width: 15%;
    max-width: 15%;
    text-align: center;
    font-size: 0.8vw;
    
}
#launch_course_window_popup_close:hover, #preview_course_window_popup:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.7);
}
.image_half_screen {
    position: relative;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 88vh;
    object-fit: fill;
    max-height: 88vh;
}
.pop_quiz_image_zoom {
        position: absolute;
    bottom: 0;
    left: 40%;
    min-width: 18%;
    max-width: 18%;
    font-size: 0.8vw;
    color: #fff;
    background-color: #192a56;
    box-shadow: 0px 1px 3px -1px #000;
}
.pop_quiz_image_zoom {
    cursor: pointer;
}
#assignment_edit_window {
    display: none;
    position: absolute;
    float: left;
    left: 0%;
    top: 2%;
    width: auto;
    min-width: 50%;
    height: auto;
    min-height: 10vh;
    padding: 1%;
    background-color: #fff;
    border: 1px solid rgb(25,42,86);
    opacity: 0;
    z-index: 1;
    box-shadow: 0px 1px 1px -1px #000;
}
#assignment_edit_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    background-color: #1d1d1d;
    color: #fff;
    font-size: 0.7vw;
    margin-bottom: 1%;
}
#assignment_edit_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    padding: 1%;
    margin-bottom: 1%;
}
#assignment_edit_window_content textarea {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    padding: 1%;
    resize: none;
}
#assignment_edit_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
}
#assignment_edit_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    height: auto;
    min-width: 6%;
    max-width: 10%;
    color: #fff;
    font-size: .7vw;
    letter-spacing: 1.5px;
    font-family: 'Roboto', sans-serif;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 3px -1px #000;
    transition: all .5s;
    background-color: rgba(0,0,0,.75);
    margin-left: 0.5%;
}
#content_window_video_controls {
    display: block;
    position: absolute;
    z-index: 2;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: 4vh;
    bottom: 0%;
    left: 0%;
    background-color: transparent;
    margin-left: 0%;
}
.video_control_seekbar {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: 0.4vh;
    margin-left: 1%;
    background-color: rgba(255,255,255,0.2);
    margin-top: 0%;
    border-radius: 0px;
}
.video_control_timebar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: #192a56CC;
}
.video_control_options {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3.5vh;
    max-height: 3.5vh;
}
.video_control_options_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 3.5vh;
    max-height: 3.5vh;
}
.video_control_play {
    position: relative;
    float: left;
    width: auto;
    min-width: 4%;
    max-width: 5%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    padding: 1%;
}
.video_control_play > .content_play-pause {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    font-size: 1.2vw;
}
.video_control_volume {
    position: relative;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    padding: 1%;
}
.video_control_volume > .content_volumebar {
    width: 98%;
    max-width: 98%;
    position: relative;
    float: left;
    margin-top: 3%;
    height: 1.5vh;
    border: 1px solid rgba(255,255,255,.3);
}
.video_control_volume > .content_volumebar > .content_volume {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(255,255,255);
    border-radius: 0px;
}
.video_control_mute {
    position: relative;
    float: left;
    width: auto;
    min-width: 4%;
    max-width: 5%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    padding: 1%;
}
.video_control_mute > .content_mute {
    position: relative;
    float: left;
    height: auto;
    width: auto;
    margin-top: 2%;
    font-size: 1.1vw;
}
.video_control_timecode {
    position: relative;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: auto;
    padding: 1%;
    min-height: 2.5vh;
    max-height: 2.5vh;
}
.video_control_timecode > .content_player-timecode {
    position: relative;
    float: left;
    font-size: 0.7vw;
    width: auto;
    height: auto;
    color: #fff;
    margin-top: 2%;
    margin-left: 0%;
    font-weight: normal;
}
.video_control_options_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 3.5vh;
    max-height: 3.5vh;
}
.video_control_options_right > div {
    position: relative;
    float: right;
    width: auto;
    min-width: 4%;
    max-width: 4%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    padding: 1%;
}
.video_control_options_right > div > i {
    font-size: 0.9vw !important;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    margin-top: 15%;
    color: #fff;
}
.video_quality_settings:hover, .toolkit_video_quality_settings:hover {
    cursor: pointer;
}
.toolkit_video_setting_window {
    right: 5% !important;
    bottom: 4% !important;
    text-align: left;
}
.video_setting_window, .toolkit_video_setting_window {
    display: none;
    position: absolute;
    float: right;
    width: auto;
    min-width: 12%;
    max-width: 12%;
    height: auto;
    min-height: 15vh;
    max-height: 15vh;
    padding: 1%;
    background-color: #192a56CC;
    color: #fff;
    right: 1%;
    bottom: 7%;
    z-index: 2;
    opacity: 0;
}
.video_setting_window_top, .toolkit_video_setting_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-size: 0.7vw;
    min-height: 2vh;
    max-height: 2vh;
}
.video_setting_window_bottom, .toolkit_video_setting_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-size: 0.7vw;
    min-height: 13vh;
    max-height: 13vh
}
.video_setting_window_bottom > ul, .toolkit_video_setting_window_bottom > ul {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 13vh;
    max-height: 13vh;
    padding: 0;
    margin: 0;
    list-style: none;
}
.video_setting_window_bottom > ul > li, .toolkit_video_setting_window_bottom > ul > li {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    font-size: 0.6vw;
    margin-bottom: 2%;
    margin-top: 2%;
}
.video_quality_selected, .video_cc_selected {
    font-weight: bold;
}
.video_cc_selected {
    background-color: rgba(0,0,0,0.3);
}
.cc-option {
    font-size: 0.8vw !important;
    text-align: left;
}
.cc-option:hover {
    cursor: pointer;
    background-color: rgba(0,0,0,0.3);
}
.video_control_background {
    position: absolute;
    z-index: -1;
    float: left;
    width: auto;
    min-width: 99.99%;
    max-width: 99.99%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    background-color: rgba(0,0,0,0.6);
    bottom: 1%;
    opacity: 0;
}
#edit_question_image_div {
    position: relative;
    float: left;
    width: auto;
    min-width: 99%;
    max-width: 99%;
    height: auto;
    margin-left: 0%;
    margin-top: 1%;
}
#edit_question_image_div > #edit_question_image_upload_preview {
    position: relative;
    float: right;
    width: auto;
    min-width: 35%;
    max-width: 35%;
    height: auto;
    min-height: 18vh;
    max-height: 18vh;
}
#edit_question_image_div > #edit_question_image_upload_preview img {
    width: auto;
    max-width: 100%;
    height: auto;
    min-height: 18vh;
    max-height: 18vh;
}
.content_left_directories {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    padding: 1%;
    border-bottom: 1px solid #e7e7e7;
}
.content_left_directories:hover {
    cursor: pointer;
    background-color: #e7e7e7;
}
.content_left_directories > div {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
}
.content_left_directories img, .content_left_subdirectory img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
}
.content_left_directories > div > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 7%;
    max-width: 8%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    margin-right: 2%;
}
.content_left_directories > div > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 80%;
    max-width: 80%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
}
.content_left_directories > div > div:nth-child(2) > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-top: 2.5%;
}
.content_left_directories > div > div:nth-child(3) {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    text-align: right;
}
.content_left_directories > div > div:nth-child(3) > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-top: 17%;
}
.content_left_window {
    display: none;
    float: left;
    position: relative;
    min-width: 94%;
    max-width: 94%;
    width: auto;
    height: auto;
    opacity: 1;
    margin-top: 2%;
    padding-left: 5%;
    background-color: #f9f9f9;
}
.content_left_subdirectories {
    position: relative;
    float: left;
    width: auto;
    min-width: 95%;
    max-width: 95%;
    height: auto;
    list-style: none;
    margin: 0;
    padding: 0;
}
.content_left_subdirectories > li {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    padding: 1%;
    margin-bottom: 1%;
    min-height: 3vh;
    max-height: 3vh;
}
.content_left_subdirectories > li:hover {
    cursor: pointer;
    background-color: #e7e7e7;
}
.content_left_subdirectories > li > div:nth-child(1) {
    position: relative;
    float: left;
    width: auto;
    min-width: 7%;
    max-width: 8%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    margin-right: 2%;
}
.content_left_subdirectories > li > div:nth-child(2) {
    position: relative;
    float: left;
    width: auto;
    min-width: 80%;
    max-width: 80%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
}
.content_left_subdirectories > li > div:nth-child(2) > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-top: 2.5%;
}
.content_left_subdirectories > li > div:nth-child(3) {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    text-align: right;
}
.content_left_subdirectories > li > div:nth-child(3) > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-top: 17%;
}
.directory_item_count, .sub_directory_item_count {
    color: #192a56;
    font-weight: bold;
}
.content_left_directory_name {
    position: relative;
    float: left;
    margin-top: 2%;
    margin-left: 2%;
}
.asset_item {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 7vh;
    max-height: 7vh;
    padding: 1%;
    margin-top: 1%;
    margin-bottom: 1%;
    background-color: #fff;
}
.asset_item:hover {
    cursor: pointer;
}
.asset_item_cover {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 7vh;
    max-height: 7vh;
}
.asset_item_cover > img {
    max-width: 100%;
    max-height: 7vh;
    min-height: 7vh;
    overflow: hidden;
}
.asset_item_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    height: auto;
    min-height: 7vh;
    max-height: 7vh;
    margin-right: 1%;
}
.asset_item_center {
    position: relative;
    float: left;
    width: auto;
    min-width: 64%;
    max-width: 64%;
    height: auto;
    min-height: 7vh;
    max-height: 7vh;
    margin-right: 1%;
}
.asset_item_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 4%;
    max-width: 4%;
    height: auto;
    min-height: 7vh;
    max-height: 7vh;
}
.asset_item_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.asset_item_top > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-weight: bold;
}
.asset_item_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
}
.asset_item_bottom > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4.2vh;
    max-height: 4.2vh;
    padding-top: 0.5%;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 0.6vw;
    border-top: 1px solid rgba(0,0,0,0.05);
}
.asset_item_select_checkbox {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin: 0;
}
.asset_item_remove {
    position: absolute;
    float: left;
    top: 73%;
    width: auto;
    min-width: 4%;
    max-width: 4%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    text-align: right;
    color: rgb(204,0,0);
    font-size: 0.7vw;
    margin-left: 0%;
}
.asset_item.list_item_view, .asset_item_left.list_item_view, .asset_item_center.list_item_view, .asset_item_right.list_item_view {
    min-height: 2vh !important;
    max-height: 2vh !important;
}
.asset_item_left.list_item_view {
    max-width: 10% !important;
    min-width: 10% !important;
}
.asset_item_left.list_item_view .asset_play {
    min-height: 2vh !important;
    max-height: 2vh !important;
    margin-top: 0% !important;
    font-size: 1vw !important;
}
.asset_item_left.list_item_view .course_quiz, .asset_item_left.list_item_view .fa-star {
    min-height: 2vh !important;
    max-height: 2vh !important;
    margin-top: 0% !important;
    font-size: 1vw !important;
    margin-left: 21% !important;
}
.asset_item_center.list_item_view {
    max-width: 75% !important;
    min-width: 75% !important;
}
.asset_item_right.list_item_view {
    min-width: 13% !important;
    max-width: 13% !important;
}
.asset_item_right.list_item_view .asset_item_select_checkbox {
    min-width: 50%;
    max-width: 50%;
}
.asset_item_right.list_item_view .asset_item_remove {
    top: 0%;
    font-size: 0.9vw !important;
    min-height: 2vh;
    max-height: 2vh;
    float: left;
    position: relative;
    min-width: 49%;
    max-width: 49%;
}
.asset_item_right.list_item_view .syllabus_notes {
    margin-top: 0%;
    font-size: 0.9vw !important;
    min-height: 2vh;
    max-height: 2vh;
    float: left;
    position: relative;
    min-width: 49%;
    max-width: 49%;
}
.background_glow {
    -webkit-animation: bk_glow 2s ease infinite;
    -moz-animation: bk_glow 2s ease infinite;
    -o-animation: bk_glow 2s ease infinite;
    animation: bk_glow 2s ease infinite;
}
@keyframes bk_glow {
    0% { background-color: rgba(0,128,0,0.5); }
    100% { background-color: rgba(0,128,0, 1); }
}
.content_left_screen_data_selection {
    position: relative;
    float: left;
    width: auto;
    min-width: 80%;
    max-width: 80%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
.content_left_screen_data_selection button {
    position: relative;
    float: left;
    width: auto;
    min-width: 30%;
    max-width: 45%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-left: 0.5%;
    margin-right: 0.5%;
    color: #ffffff;
    background-color: #192a56;
    border: none;
    
    box-shadow: 0px 1px 1px -1px #000;
    font-size: 0.6vw;
    letter-spacing: 1px;
}
.content_left_screen_data_selection button:hover {
    cursor: pointer;
    background-color: #192a56BF;
}
#content_left_asset_remove_selected {
    display: none;
}
.fas.fa-edit {
    color: rgb(0,128,0);
}
.fas.fa-trash-alt {
    color: rgb(204,0,0) !important;
}
.asset_play {
    position: absolute;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    font-size: 1.5vw !important;
    color: rgba(0,0,0,0.7);
    text-align: center;
    margin-top: 17%;
}
.asset_play:hover {
    cursor: pointer;
    color: rgba(0,0,0,0.5);
}
.asset_error {
    background-color: rgba(204,0,0,0.5);
}
.demo_button > .fa-play-circle {
    color: rgb(0,128,0);
}
#build_resource_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
    margin-top: 0.5%;
}
.build_resource_option {
    position: relative;
    display: inline-block;
    float: left;
    width: auto;
    min-width: 5%;
    max-width: 5%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding: 1%;
    background-color: #192a56;
    margin-right: 0.5%;
    
}
.build_resource_option:hover {
    cursor: pointer;
    background-color: #192a56BF;
}
.build_resource_option_selected {
    font-weight: bold;
    box-shadow: 0px 1px 1px -1px #000;
}
.build_resource_option > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    text-align: center;
    font-size: 0.7vw;
    color: #ffffff;
}
#build_resource_info_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 21%;
    max-width: 21%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
    padding: 1%;
}
#build_resource_info_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 49%;
    max-width: 49%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
    margin-right: 1%;
}
#build_resource_info_left > label {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
}
#build_resource_info_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
}
#build_resource_item_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    max-height: 65vh;
    padding: 1%;
    overflow-x: hidden;
    overflow-y: auto;
}
.loading {
    position: absolute;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 13vh;
    max-height: 13vh;
    text-align: center;
    padding-top: 21%;
    z-index: 10;
    opacity: 0;
}
.loading span {
  display: inline-block;
  vertical-align: middle;
  width: 2.6em;
  height: 2.6em;
  margin: 2.19em;
  background: #192a56;
  border-radius: 2.6em;
  animation: loading 1s infinite alternate;
}

/*
 * Dots Colors
 * Smarter targeting vs nth-of-type?
 */
.loading span:nth-of-type(2) {
  background: #192a56DE;
  animation-delay: 0.2s;
}
.loading span:nth-of-type(3) {
  background: #192a56BF;
  animation-delay: 0.4s;
}
.loading span:nth-of-type(4) {
  background: #1d1d1d;
  animation-delay: 0.6s;
}
.loading span:nth-of-type(5) {
  background: #1d1d1dDE;
  animation-delay: 0.8s;
}
.loading span:nth-of-type(6) {
  background: #e4e4e4;
  animation-delay: 1.0s;
}
.loading span:nth-of-type(7) {
  background: #f1f1f1;
  animation-delay: 1.2s;
}

/*
 * Animation keyframes
 * Use transition opacity instead of keyframes?
 */
@keyframes loading {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
#quiz_feedback_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
    margin-top: 1%;
}
#quiz_feedback_container > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw;
    text-decoration: underline;
}
#quiz_feedback_container textarea {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 7vh;
    max-height: 7vh;
    resize: none;
    border: 1px solid #d7d7d7;
    box-shadow: 0px 1px 1px -2px #000;
}
#edit_quiz_question_feedback_container {
    display: none;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
}
#preview_course_window_next_questionnaire, #launch_course_window_next_questionnaire {
    display: none;
    position: relative;
    text-align: center;
    width: auto;
    min-width: 60%;
    max-width: 60%;
    height: auto;
    min-height: 3.5vh;
    max-height: 3.5vh;
    border: 0;
    outline: 0;
    border-radius: 50px;
    font-size: 0.7vw;
    font-weight: bold;
    letter-spacing: 2px;
}
#course_mastery_score_status {
    min-width: 15%;
    max-width: 15%;
    float: right !important;
    width: 15% !important;
    text-align: right;
}
.dashboard_window_step1 {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 10vh;
    max-height: 10vh;
    margin-bottom: 0.5%;
}
.dashboard_window_step2 {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 60vh;
    max-height: 60vh;
    margin-bottom: 0.5%;
    overflow-x: hidden;
    overflow-y: scroll;
}
.dashboard_window_step3 {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    margin-bottom: 0.5%;
}
.step_title {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 1vw;
    margin-bottom: 1%;
}
.step_icon {
    position: relative;
    float: left;
    width: auto;
    min-width: 2%;
    max-width: 2%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    background-color: #d3d3d3;
    color: #ffffff;
    text-align: center;
    margin-right: 1%;
}
.step_info {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
}
.step_info > input {
    position: relative;
    float: left;
    width: auto;
    min-width: 35%;
    max-width: 35%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    outline: 0;
}
.dashboard_create button {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    font-size: 0.8vw;
    letter-spacing: 1px;
    background-color: #192a56;
    color: #fff;
    
    outline: 0;
    border: 0;
}
.step_info button:hover {
    cursor: pointer;
    background-color: rgba(29,29,29,0.7);
}
.hidden {
    display: none;
}
.dashboard_create a {
    color: #192a56;
    text-decoration: underline;
}
.dashboard_create label {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 2.3vh;
    max-height: 2.3vh;
    font-size: 0.8vw;
    margin-top: unset;
    margin-bottom: unset;
    margin-top: 0.3%;
}
.dashboard_create input,  .dashboard_create textarea {
    position: relative;
    float: left;
    width: auto;
    min-width: 30%;
    max-width: 30%;
    height: auto;
    min-height: 2.3vh;
    max-height: 2.3vh;
    font-size: 0.8vw;
    padding: 0;
    padding-left: 0.5%;
}
.dashboard_create .form_entry {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 0.5%;
}
#build_course {
    float: right;
    right: 1%;
}
#user_admin_title {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.7vw !important;
    text-align: center;
    margin-top: 6.5%;
}
#dashboard_admin_window {
    display: none;
    position: absolute;
    z-index: 5;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    background-color: #fff;
    height: auto;
    min-height: 96vh;
    max-height: 96vh;
    z-index: 3;
}
#dashboard_admin_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    padding: 1%;
    background-color: #000000;
}
#dashboard_admin_window_logo {
    position: relative;
    float: left;
    width: auto;
    min-width: 11%;
    max-width: 11%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
}
#dashboard_admin_window_logo > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 4vh;
    object-fit: contain;
}
#dashboard_admin_window_title {
    position: relative;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.8vw;
    color: #fff;
    font-weight: bold;
    padding: 0.5%;
}
#dashboard_admin_window_close {
    position: relative;
    float: right;
    width: auto;
    min-width: 1%;
    max-width: 1%;
    height: auto;
    font-size: 0.8vw;
    color: #fff;
}
#dashboard_admin_window_view {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 88vh;
    max-height: 88vh;
}
#dashboard_admin_window_view_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    min-height: 84.5vh;
    max-height: 84.5vh;
    padding: 1%;
    background-color: #000000;
}
#dashboard_admin_action_window {
    display: none;
    position: absolute;
    float: right;
    width: auto;
    min-width: 29%;
    max-width: 29%;
    height: auto;
    min-height: 94vh;
    max-height: 94vh;
    background-color: #fff;
    z-index: 4;
    right: 0%;
    padding: 0.5%;
    box-shadow: 0px 0px 2px 0px #000;
}
#dashboard_admin_action_window_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    background-color: rgb(25,42,86);
}
#dashboard_admin_action_window_top > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 98.4%;
    max-width: 98.4%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    color: #fff;
    font-size: 0.8vw;
    padding: 0.8%;
}
#dashboard_admin_action_window_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 84vh;
    max-height: 84vh;
    margin-top: 0.5%;
    margin-bottom: 0.5%;
}
.admin_action_setup_warning {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    margin-bottom: 0.5%;
    opacity: 0;
    color: #fff;
    font-size: 0.7vw;
    letter-spacing: 1px;
    text-align: center;
    font-weight: bold;
}
.admin_action_setup_warning.success {
    background-color: rgba(0,128,0,0.7);
}
.admin_action_setup_warning.error {
    background-color: rgba(204,0,0,0.7);
}
.admin_action_setup_fields {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 81vh;
    max-height: 81vh;
}
.admin_action_setup_field {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3vh;
    margin-bottom: 1%;
}
.admin_action_setup_field label {
    position: relative;
    float: left;
    width: auto;
    min-width: 35%;
    max-width: 35%;
    height: auto;
}
.admin_action_setup_fields input[type='text'] {
    position: relative;
    float: left;
    width: auto;
    min-width: 63%;
    max-width: 63%;
    padding-left: 0.5%;
    min-height: 2vh;
    max-height: 2vh;
    outline: 0;
    font-family: 'Roboto', sans-serif;
    border: 1px solid #e7e7e7;
    
    letter-spacing: 1.5px;
}
.admin_action_setup_fields select {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 50%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 0.5%;
    border: 1px solid #e7e7e7;
    
    font-family: 'Roboto', sans-serif;
}
.admin_action_setup_fields textarea {
    
}
#dashboard_admin_action_window_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
}
#dashboard_admin_action_window_bottom button {
    position: relative;
    float: right;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    color: #fff;
    background-color: rgb(25,42,86);
    font-size: 0.7vw;
    text-align: center;
    box-shadow: 0px 1px 1px -1px #000;
    border: none;
    
    margin-left: 0.5%;
    letter-spacing: 1px;
}
#dashboard_admin_action_window_bottom button:hover {
    cursor: pointer;
    background-color: rgba(25,42,86,0.7);
}
#admin_option_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 85vh;
    max-height: 85vh;
}
#dashboard_admin_window_view_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 85.7%;
    max-width: 85.7%;
    height: auto;
    min-height: 84.5vh;
    max-height: 84.5vh;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 1%;
    background-color: #e7e7e7;
}
#admin_option_active_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 84.5vh;
    max-height: 84.5vh;
}
.admin_option_active_container_content {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 85vh;
    max-height: 85vh;
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 0.7vw;
}
#admin_option_menu {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 83vh;
    min-height: 83vh;
}
.admin_menu_item {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding-top: 2%;
    padding-left: 4%;
    padding-bottom: 2%;
    margin-bottom: 1%;
    color: #fff;
}
.admin_menu_item:hover {
    cursor: pointer;
    background-color: #192a56;
    font-weight: bold;
}
.admin_option_active_container_content > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.8vw;
    font-weight: bold;
    border-bottom: 2px solid rgb(25,42,86);
}
.admin_option_active_toolbar {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    border-bottom: 1px solid #d7d7d7;
    padding-bottom: 0.5%;
    padding-top: 0.5%;
    margin-bottom: 0.5%;
}
.admin_option_active_toolbar input[type='text'] {
    position: relative;
    float: right;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    font-size: 0.7vw;
    height: auto;
    outline: 0;
    font-family: 'Roboto', sans-serif;
    border: none;
    
    letter-spacing: 1.5px;
    min-height: 2.4vh;
    max-height: 2.4vh;
    padding-left: 0.5%;
    margin-right: 0.5%;
}
.admin_option_active_toolbar button {
    position: relative;
    width: auto;
    height: auto;
    min-height: 2.4vh;
    max-height: 2.4vh;
    color: #fff;
    background-color: rgb(25,42,86);
    font-size: 0.7vw;
    text-align: center;
    box-shadow: 0px 1px 1px -1px #000;
    border: none;
    
    margin-right: 0.5%;
}
.admin_option_active_toolbar button.filter {
    float: right;   
}
.admin_option_active_toolbar select {
    position: relative;
    float: right;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-right: 0.5%;
    border: none;
    font-size: 0.7vw;
    letter-spacing: 1.5px;
}
.admin_option_table_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 77vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.admin_option_active_container_content table {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
.admin_option_active_container_content table tr:nth-child(even) {
    background-color: #d7d7d7;
}
.admin_option_active_container_content table button {
    position: relative;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    padding: 1%;
    color: #fff;
    background-color: rgb(25,42,86);
    font-size: 0.7vw;
    text-align: center;
    box-shadow: 0px 1px 3px -1px #000;
    border: none;
    
}
.admin_option_active_toolbar button:hover, .admin_option_active_container_content table button:hover {
    cursor: pointer;
    background-color: rgba(25,42,86,0.7);
}
.admin_option_active_container_content .clickable:hover {
    cursor: pointer;
    background-color: rgba(255,255,255,0.7);
}
.admin_no_results {
    border-bottom: none !important;
    font-weight: normal !important;
    font-size: 0.7vw !important;
}
/*Login Screen Only*/
#authy_select, #login_navigation {
    position: relative;
    float: left;
    width: auto;
    max-width: 80%;
    min-width: 80%;
    height: auto;
    min-height: 50vh;
    max-height: 50vh;
    padding: 0%;
    text-align: center;
    color: #d1d1d1;
    padding-left: 9%;
    font-size: .8vw;
    text-align: center;
}
#authy_select > span, #login_navigation > span {
    position: relative;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    float: left;
    margin-bottom: 4%;
    color: #000000;
}
#login_navigation {
    display: none;
}
.login_navigation {
    position: relative;
    float: left;
    width: auto;
    min-width: 31%;
    max-width: 31%;
    height: auto;
    min-height: 40vh;
    max-height: 40vh;
    border: 1px solid #e7e7e7;
    margin-right: 1.5%;
    text-align: center;
    font-weight: bold;
}
.login_navigation:hover {
    cursor: pointer;
    box-shadow: 0px 1px 3px -1px #000;
    font-weight: bold;
}
.login_navigation > img {
    position: absolute;
    float: left;
    left: 0;
    top: 0;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 40vh;
    max-height: 40vh;
    object-fit: cover;
    opacity: 1;
}
.login_navigation > span {
    position: absolute;
    float: left;
    left: 0;
    top: 35%;
    z-index: 1;
    font-size: 0.8vw;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    background-color: #fff;
    color: #1d1d1d;
    box-shadow: 0px 0px 3px -1px #000;
}
.login_navigation > span i {
    font-size: 0.6vw;
}
.login_hidden {
    display: none;
}
.authy_button {
    position: relative;
    width: auto;
    min-width: 65%;
    max-width: 65%;
    padding: 2%;
    font-size: .8vw;
    background-color: #1d1d1d;
    color: #fff;
    border: none;
    border-radius: 36px;
    letter-spacing: 1px;
    margin-bottom: 1%;
    outline: none;
}
#auth_password {
    margin-top: 2%;
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 2%;
}
#auth_code {
    margin-top: 2%;
    border-top: 1px solid rgba(0,0,0,0.1);
    padding-top: 5%;
}
#auth_code > div {
    position: relative;
    float: left;
    left: 20%;
    width: auto;
    max-width: 64%;
    margin-bottom: 1%;
}
.auth_code_notification {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    margin-bottom: 1%;
    text-align: left;
    color: #000;
    font-weight: bold;
}
.authy_code {
    max-width: 10% !important;
    min-width: 10% !important;
    min-height: 4vh;
    margin-right: 4%;
    font-size: 1vw !important;
    text-align: center;
}
#enter_phone_num {
    max-width: 20%;
    min-width: 20%;
    margin-left: 20%;
    padding: 1.5%;
}
#enter_phone_carrier {
    max-width: 36%;
    min-width: 36%;
    margin-left: 1%;
    padding: 1.5%;
}
#auth_phone {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 4%;
}
#authy_send_code {
    max-width: 20%;
    min-width: 20%;
    float: left;
    margin-left: 1%;
    margin-top: 1%;
    background-color: rgb(25,42,86);
}
.auth_lock {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 2%;
    font-size: 1.5vw;
    color: rgba(0,0,0,0.1);
}
#authy_submit_password, #authy_code_submit, #authy_submit_sms {
    min-width: 40%;
    max-width: 40%;
}
#auth_complete {
    margin-top: 15%;
    font-size: 1vw;
}
#auth_complete > span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
#auth_complete1 {
    font-size: 10vw;
}
#login_select {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}
#login_select > span {
    margin-bottom: 4%;
}
#login_method_complete {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 25vh;
    max-height: 25vh;
    margin-top: 8%;
}
#login_method_complete > span {
    font-size: 1vw;
}
#login_method_complete1 {
    font-size: 10vw !important;
}
#setup_sms_div, #setup_pass_div {
    display: none;
    opacity: 0;
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
}

/* Admin Styling */
#header_title > span {
    position: relative;
    float: left;
    margin-top: 21%;
    font-weight: bold;
    text-align: left;
}
#header_title:hover {
    cursor: unset;
    background-color: unset;
}
.admin_table {
    overflow: unset !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background-color: #e4e4e4;
}
.admin_table > table {
    position: relative;
    float: left;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    padding: 1%;
}
.admin_table > table td {
    font-size: 0.7vw;
}
.admin_table > table tr:nth-child(1):hover {
    cursor: unset;
    background-color: unset;
}
.admin_table > table tr:nth-child(even) {
    background-color: #d7d7d7;
}
.admin_table > table tr:hover {
    background-color: #ffffff;
    font-weight: bold;
}
.clickable {
    cursor: pointer;
}
#content_view_title {
    position: relative;
    float: right;
    right: 1%;
    width: auto;
    min-width: 3%;
    max-width: 20%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
}
#content_view_title span {
    position: relative;
    float: right;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
    color: #ffffff;
    font-weight: bold;
    text-align: right;
    font-size: 1.5vw;
    margin-top: 4%;
    border-bottom: 3px solid #ffffff;
}
.admin_table .heading {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    text-indent: 1%;
    font-weight: bold;
    font-size: 1vw;
    text-decoration: underline;
}
.admin_table .company_logo {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    min-height: 8vh;
    max-height: 8vh;
    padding: 1%;
    border: 1px solid #000000;
    margin-left: 1%;
    box-shadow: 0px 1px 1px -1px #000;
}
.admin_table .company_logo > img {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 10vh;
    object-fit: contain;
}
#content_right_popup {
    display: none;
    position: absolute;
    float: left;
    width: auto;
    min-width: 97.8%;
    max-width: 97.8%;
    height: auto;
    min-height: 84vh;
    max-height: 84vh;
    padding: 1%;
    margin-top: 0%;
    background-color: #ffffff;
    z-index: 2;
    opacity: 0;
}
#content_right_popup_title {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    margin-bottom: 1%;
    border-bottom: 3px solid #192a56;
}
#content_right_popup_title > span {
    position: relative;
    float: right;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    font-weight: bold;
    font-size: 1vw;
}
#content_right_popup_form {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 73vh;
    max-height: 73vh;
    margin-bottom: 1%;
}
#content_right_popup_form form {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 73vh;
    max-height: 73vh;
}
#content_right_popup_form .content_divider_hor {
    margin-top: 1.5%;
    margin-bottom: 1.5%;
}
#content_right_popup_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
}
#content_right_popup_button {
    position: relative;
    float: right;
    right: 1%;
    width: auto;
    min-width: 5%;
    max-width: 5%;
    height: auto;
    min-height: 4vh;
    max-height: 4vh;
}
.edited {
    border: 1px solid red;
}
.changed {
    border: 1px solid green;
}
.form_field, .form_options {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    margin-bottom: 0.5%;
}
.form_field label {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 2.4vh;
    max-height: 2.4vh;
    font-weight: bold;
}
.form_field input {
    position: relative;
    float: left;
    width: auto;
    min-width: 80%;
    max-width: 80%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    padding-left: 0.5%;
}
.form_field input:read-only {
    background-color: #192a5633;
}
.form_field img {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 15%;
    height: auto;
    min-height: 14vh;
    max-height: 14vh;
}
form .Active, form .active, .form .active, .table .active {
    color: green;
}
form .Inactive, form .inactive, .form .inactive, .table .inactive {
    color: red;
}
.form_options button {
    position: relative;
    float: left;
    width: auto;
    min-width: 8%;
    max-width: 16%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    letter-spacing: 1px;
    margin-right: 0.5%;
    background-color: #192a56;
    color: #ffffff;
}
.inclass_text {
    position: relative;
    float: left;
    width: auto;
    min-width: 75% !important;
    max-width: 75% !important;
    height: auto;
    min-height: 2vh !important;
    max-height: 2vh !important;
    margin-bottom: 0% !important;
    margin-right: 1%;
}
.inclass_btn {
    position: relative;
    float: left;
    width: auto;
    min-width: 20%;
    max-width: 20%;
    height: auto;
    min-height: 2.2vh;
    max-height: 2.2vh;
    background-color: #192a56;
    color: #ffffff;
}
.inclass_btn:hover {
    cursor: pointer;
    background-color: #192a56CC;
}
.question_setup {
    position: relative;
    float: left;
    width: auto;
    min-width: 98% !important;
    max-width: 98% !important;
    height: auto;
    min-height: 81vh !important;
    max-height: 81vh !important;
    padding: 1%;
    margin-bottom: 0% !important;
}
.question_setup_top {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 26vh;
    max-height: 26vh;
    margin-bottom: 0.5%;
}
.question_setup_top span {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 2vh;
    max-height: 2vh;
    font-size: 0.8vw;
    font-weight: bold;
}
.question_setup_top_left {
    position: relative;
    float: left;
    width: auto;
    min-width: 75%;
    max-width: 75%;
    height: auto;
    min-height: 26vh;
    max-height: 26vh;
}
.question_setup_top_right {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    min-height: 26vh;
    max-height: 26vh;
}
.question_setup_top_right > #question_image_select {
    position: relative;
    float: left;
    width: auto;
    min-width: 50%;
    max-width: 50%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    font-size: 0.7vw;
    border: none;
    box-shadow: 0px 1px 2px -1px #000;
}
.question_types {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    margin-bottom: 0.5%;
}
.num_answers {
    position: relative;
    float: left;
    width: auto;
    min-width: 31%;
    max-width: 31%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    margin-bottom: 0.5%;
}
#num_answers {
    position: relative;
    float: left;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    min-height: 2.5vh;
    max-height: 2.5vh;
    text-align: center;
    font-size: 0.8vw;
    border: 1px solid #192a56;
}
.asset_question_type {
    position: relative;
    float: left;
    width: auto;
    min-width: 15%;
    max-width: 20%;
    height: auto;
    min-height: 3vh;
    max-height: 3vh;
    border: none;
    outline: none;
    background-color: #192a56CC;
    font-size: 0.8vw;
    color: #ffffff;
    margin-right: 0.5%;
}
.asset_question_type_selected {
    font-weight: bold;
    background-color: #192a56;
}
.question_container {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 13vh;
    max-height: 13vh;
}
.question_setup_top textarea {
    position: relative;
    float: left;
    width: auto;
    min-width: 30% !important;
    max-width: 30% !important;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    padding: 0.5%;
    border: 1px solid #d7d7d7;
    font-family: 'Roboto', sans-serif;
    resize: none;
    font-size: 0.8vw;
}
.question_setup_center {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 49vh;
    max-height: 49vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.question_setup_row {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
    margin-bottom: 0.5%;
}
.question_col1 {
    position: relative;
    float: left;
    width: auto;
    min-width: 6%;
    max-width: 6%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
    padding-right: 1%;
    display: flex;
    justify-content: center; /* Horizontally center */
    align-items: center; /* Vertically center */
}
.question_col1 span {
    font-weight: bold;
}
.question_col2 {
    position: relative;
    float: left;
    width: auto;
    min-width: 75%;
    max-width: 75%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
    padding-right: 1%;
}
.question_col2 textarea {
    position: relative;
    float: left;
    width: auto;
    min-width: 98%;
    max-width: 98%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    padding: 0.5%;
    border: 1px solid #d7d7d7;
    font-family: 'Roboto', sans-serif;
    resize: none;
    font-size: 0.8vw;
}
.question_col3 {
    position: relative;
    float: left;
    width: auto;
    min-width: 17%;
    max-width: 17%;
    height: auto;
    min-height: 6vh;
    max-height: 6vh;
    display: flex;
    justify-content: center; /* Horizontally center */
    align-items: center; /* Vertically center */
}
.question_col3 input[type='text'] {
    position: relative;
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 25%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    text-align: center;
    font-size: 0.8vw;
    margin-right: 1%;
}
.question_col3 label {
    text-align: center;
    font-size: 0.7vw;
    margin-left: 1%;
}
.question_setup_bottom {
    position: relative;
    float: left;
    width: auto;
    min-width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh
}
.question_setup_bottom button {
    position: relative;
    width: auto;
    min-width: 10%;
    max-width: 10%;
    height: auto;
    min-height: 5vh;
    max-height: 5vh;
    color: #fff;
    font-size: 0.8vw;
    border: none;
    outline: none;
    box-shadow: 0px 1px 2px -1px #000;
}
.question_setup_bottom button:hover {
    cursor: pointer;
    font-weight: bold;
}
#question_setup_cancel {
    float: right;
    background-color: rgb(204,0,0);
}
#question_setup_save {
    float: right;
    background-color: rgb(0,128,0);
    margin-left: 0.5%;
}
#question_setup_continue {
    float: right;
    background-color: #192a56;
    margin-left: 0.5%;
}
.sop_student_cert:hover {
    cursor: pointer;
}