@font-face {
    font-family: Roboto-Bold;
    src: url(../../fonts/Roboto-Bold.ttf);
}

@font-face {
    font-family: Roboto-Medium;
    src: url(../../fonts/Roboto-Medium.ttf);
}

@font-face {
    font-family: Roboto-Regular;
    src: url(../../fonts/Roboto-Regular.ttf);
}

body {
    font-family: Roboto-Regular;
    background-color: #E8E8E8;
    color: #555555;
}

a {
    color: #555555;
    font-family: Roboto-Medium;
}

.inline-item {
    display: inline-flex;
    width: auto;
    align-items: center;
}

.inline-item input[type="checkbox"] {
    margin-bottom: 0;
    width: auto !important;
}

a:hover {
    color: #434343;
}

table, th, td {
    border: 2px solid #B9B9B9;
    /*border: 3px solid #D4D4D4;*/
}

table thead {
    color: white;
    /*background: #83C1D1;*/
    background: #4a4d42;

}

table tbody tr:nth-child(even) {
    background-color: #F1F1F1;
}

table tbody tr:nth-child(odd) {
    background-color: #E8E8E8;
}

.top-bar, .menu a, .menu, .menu li {
    background-color: white;
    color: #168bbc;
}

h3 {
    font-family: Roboto-Bold;
}

.top-bar {
    height: 50px;
    padding: 0;
    top: 0;
    position: sticky;
    position: -webkit-sticky;
    z-index: 100;
}

.menu a {
    margin: 0 4px;
    padding: 5px 10px;
}

.menu li a {
    /*border: solid 1px rgba(190,190,192,0.31);*/
    /*border: solid 1px #efefef;*/
    padding: 5px 13px;
    margin: 0 6px;
    line-height: 0.8em;
    background-color: #F4F4F6;
    color: #555555;
    /*border: solid 1px #EFEFEF;*/
    border-radius: 10px;
}

/*.menu li {*/
/*padding-bottom: 10px;*/
/*}*/

.menu a:hover, .menu a:focus {
    color: white !important;
    background: #95AF5F !important;
}

.card img {
    margin-bottom: 10px;
    /*border: solid 1px #0b1823;*/
    /*box-shadow: 0 0 7px 3px #3b7eae;*/
}

#cardLogin {
    width: 350px;
    height: 400px;
    margin: 10px auto;
    border: solid 1px #A8A8A8;
    box-shadow: 0 0 12px 10px #4a4a4a;
    /*box-shadow: 0 0 12px 10px rgba(146,146,146,0.3);*/
    background-color: #e8e8e8;
}

.pagination .current {
    background: #95AF5F;
}

.pagination .current a {
    color: white;
}

.pagination .current a:hover {
    background: #95AF5F;
}

.loginTitle {
    margin-bottom: 0;
    font-family: Roboto-Bold;
    font-size: 24px;
    margin-top: 30px;
    color: #a8a8a8;
}

.loginSubTitle {
    font-family: Roboto-Regular;
    color: #a8a8a8;
    font-size: 14px;
}

.login, .account, .item, .item_type, .item_category {
    width: 90%;
    padding: 0 auto;
    margin-left: 5%;
}

.login input, .account input, .item input, .item_type input, .item_category input, #item_type_chosen a span {
    /*width: 90%;*/
    font-family: Roboto-Regular;
    border-radius: 10px;
    background-color: #F1F1F1 !important;
    color: #555555 !important;
    width: 100% !important;
    border: 1px solid #f2f2f2 !important;
    /*box-shadow: none;*/
}

.login input:focus, .account input:focus, .item input:focus, .item_type input:focus, .item_category input:focus {
    /*width: 90%;*/
    border: solid 1px #2a4c71;
    background-color: #0c1723;
    box-shadow: 0 0 4px 1px rgba(149, 175, 95, 0.97);
}

.login label, .account label, .item label, .item_type label, .item_category label {
    /*font-size: 18px;*/
    color: #747474;
}

.login button, .account button, .item button, .item_type button, .item_category button, .activate, .deactivate {
    border-radius: 10px;
    border: solid 1px #F1F1F1 !important;
    background-color: #95AF5F !important;
    float: left;
    height: 40px;
    width: 150px;
    /*color: #168ec0;*/
}

button:hover, .activate:hover, .deactivate:hover, .deactivate:focus, .activate:focus {
    /*color: #168ec0;*/
    background-color: rgba(149, 175, 95, 0.71) !important;
    border: solid 1px #ffffff;
    /*box-shadow: 0 0 7px 4px #95AF5F;*/
}

.loginError {
    color: #303030;
    margin-left: 5%;
    margin-top: 2%;
    float: left;
}

ul .submenu {
    border: 0;
    /*border-top: 0px solid rgba(255, 255, 255, 0.95);*/
    padding-top: 5px;
    margin-top: 0px;
}

.dropdown.menu > .is-dropdown-submenu-parent > ul.submenu.align-menu{
    border-top: 8px solid rgba(255, 255, 255, 0.95);
    padding-top: 5px;
    margin-top: 0px;
}

ul .submenu.align-menu {
    padding-top: 0;
    margin-top: 0;
}

/*table tbody tr td {*/
/*padding: 0 10px;*/
/*}*/

.buttonStreams {
    margin-top: 12px;
}

.green-title {
    font-family: Roboto-Bold;
    color: #95AF5F;
}

.panel, .panel-center {
    margin-top: 40px;
    background: #E8E8E8;
}

.line {
    width: 8px !important;
    height: 30px !important;
    background: #47A2BD;
}

.actions-text {
    color: #47A2BD !important;
}

.title-gray {
    font-family: Roboto-Bold;
    color: #A8A8A8;
}

.dropdown-scroll {
    position: absolute;
    /*top: 50px;*/
    background: transparent;
}

.dropdown-left-items {
    margin-top: 3px;
}

.dropdown-left-items li a {
    border-radius: 0;
    padding: 6px;
    background: #F4F4F6;
    border-bottom: solid 1px rgba(112, 112, 114, 0.15);
    line-height: 1.2;
}

.dropdown-user-actions > li {
    border: solid 1px rgba(221, 221, 223, 0);
    margin-left: 15%;
    background-color: rgba(146, 146, 146, 0);
    text-align: right;
}

.dropdown-user-actions > li > a {
    width: 80%;
    border-radius: 0;
    padding: 6px;
    background: #F4F4F6;
}

.dropdown-left-items li {
    background: transparent;
}

.top-bar-right {
    margin-left: auto !important;
}

.top-bar-title ul li a {
    background: white;
    border: none;
}

.btn-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-icon {
    width: 20px;
    height: 20px;
}

.navigation-image-icon-test {
    width: 16px;
    height: 16px;
}

/***********************NAVIGATIONS ICONS HOVER *****************************/
.navigation-image-spaces img {
    margin-top: 3px;
    background-image: url("../../img/spaceoff.png");
    background-repeat: no-repeat;
}

.navigation-image-spaces:hover img, .navigation-image-spaces-active img {
    margin-top: 3px;
    background-image: url("../../img/spaceon.png");
    background-repeat: no-repeat;
}

.navigation-image-spaces-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-items img {
    margin-top: 3px;
    background-image: url("../../img/itemoff.png");
    background-repeat: no-repeat;
}

.navigation-image-items:hover img, .navigation-image-items-active img {
    margin-top: 3px;
    background-image: url("../../img/itemon.png");
    background-repeat: no-repeat;
}

.navigation-image-items-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-tests img {
    margin-top: 3px;
    background-image: url("../../img/testsoff.png");
    background-repeat: no-repeat;
}

.navigation-image-tests:hover img, .navigation-image-tests-active img {
    margin-top: 3px;
    background-image: url("../../img/testson.png");
    background-repeat: no-repeat;
}

.navigation-image-tests-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-datasheet img {
    margin-top: 3px;
    background-image: url("../../img/datasheetoff.png");
    background-repeat: no-repeat;
}

.navigation-image-datasheet:hover img, .navigation-image-datasheet-active img {
    margin-top: 3px;
    background-image: url("../../img/datasheeton.png");
    background-repeat: no-repeat;
}

.navigation-image-datasheet-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-terrains img {
    margin-top: 3px;
    background-image: url("../../img/terrainoff.png");
    background-repeat: no-repeat;
}

.navigation-image-terrains:hover img, .navigation-image-terrains-active img {
    margin-top: 3px;
    background-image: url("../../img/terrainon.png");
    background-repeat: no-repeat;
}

.navigation-image-terrains-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-animations img {
    margin-top: 3px;
    background-image: url("../../img/animationoff.png");
    background-repeat: no-repeat;
}

.navigation-image-animations:hover img, .navigation-image-animations-active img {
    margin-top: 3px;
    background-image: url("../../img/animationon.png");
    background-repeat: no-repeat;
}

.navigation-image-animations-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-puzzles img {
    margin-top: 3px;
    background-image: url("../../img/puzzleoff.png");
    background-repeat: no-repeat;
}

.navigation-image-puzzless:hover img, .navigation-image-puzzles-active img {
    margin-top: 3px;
    background-image: url("../../img/puzzleon.png");
    background-repeat: no-repeat;
}

.navigation-image-puzzles-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-import img {
    margin-top: 3px;
    background-image: url("../../img/importoff.png");
    background-repeat: no-repeat;
}

.navigation-image-import:hover img, .navigation-image-import-active img {
    margin-top: 3px;
    background-image: url("../../img/importon.png");
    background-repeat: no-repeat;
}

.navigation-image-import-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-gallery img {
    margin-top: 3px;
    background-image: url("../../img/galleryoff.png");
    background-repeat: no-repeat;
}

.navigation-image-gallery:hover img, .navigation-image-gallery-active img {
    margin-top: 3px;
    background-image: url("../../img/galleryon.png");
    background-repeat: no-repeat;
}

.navigation-image-gallery-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-manage-categories img {
    margin-top: 3px;
    background-image: url("../../img/managecategoriesoff.png");
    background-repeat: no-repeat;
}

.navigation-image-manage-categories:hover img, .navigation-image-manage-categories-active img {
    margin-top: 3px;
    background-image: url("../../img/managecategorieson.png");
    background-repeat: no-repeat;
}

.navigation-image-manage-categories-active {
    color: white !important;
    background: #95AF5F !important;
}

.navigation-image-times img {
    margin-top: 3px;
    background-image: url("../../img/timesoff.png");
    background-repeat: no-repeat;
}

.navigation-image-times:hover img, .navigation-image-times-active img {
    margin-top: 3px;
    background-image: url("../../img/timeson.png");
    background-repeat: no-repeat;
}

.navigation-image-times-active {
    color: white !important;
    background: #95AF5F !important;
}

.add-new-item {
    font-family: Roboto-Medium;
    margin-bottom: 20px;
    text-align: right;
}

/*.add-new-item:hover{*/
/*text-shadow: 2px 2px 3px #ffffff;*/
/*}*/

.add-new-item > a, .edit-items-categories > a {
    color: #4b4a4a;
}

.add-plus-icon {
    vertical-align: middle;
    font-size: 1.5rem;
    color: #4b4a4a;
}

.manage-icon {
    max-height: 25px;
    max-width: 25px;
}

.list-icon {
    max-height: 18px;
    max-width: 18px;
    margin-bottom: 3px;
}

.user-icon {
    margin: 0 5px 0 5px;
    max-height: 25px;
    max-width: 25px;
}

.actions-icons {
    margin: 0 20px;
    max-height: 25px;
    max-width: 25px;
}

.actions-icons-edit {
    max-height: 20px;
    max-width: 20px;
}

.edit-items-categories {
    font-family: Roboto-Medium;
    margin-bottom: 20px;
    text-align: left;
}

.flex-vert {
    display: flex;
    align-items: center;
}

.full-top-bar {
    height: 100%;
}

.top-bar-size {
    height: 50px;
}

.welcome-block {
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 15px !important;
    display: flex !important;
    height: 50px;
    align-items: center !important;
    width: auto;
    line-height: 1.2;
    text-align: left;
}

.menu li a.lh-12 {
    line-height: 1.2;
}

.ml-3 {
    margin-left: 12px;
}

.blue-border-left {
    border-left: 7px solid;
}

.pl-0 {
    padding-left: 0;
}

.pr-0 {
    padding-right: 0;
}

.pl-3 {
    padding-left: 12px;
}

.m-0 {
    margin: 0;
}

.mb-0 {
    margin-bottom: 0;
}

.mb-1 {
    margin-bottom: 0.5rem;
}

.mt-1 {
    margin-top: 1rem;
}

.filters {
    margin-bottom: 2rem;
}

.filters .search-text-filter {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #CACACA;
    width: 100%;
}

.filters .category-filter {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

#item_type_name, #item_category_chosen, #item_type_chosen, #item_category_parentCategory, form > div > input, form > div > div > input, form > div > div > a > span {
    background-color: #F1F1F1 !important;
    color: #555555 !important;
    width: 100% !important;
    border: 1px solid #D4D4D4 !important;
}

#item_category_chosen {
    border: none;
}

.panel-center {
    width: 480px;
    margin: auto;
}

.button {
    margin-top: 15px;
    font-family: Roboto-Medium;
    background: #83C1D1 !important;
    color: white !important;
    border: 1px solid #83C1D1 !important;
}

.loginLabel {
    font-family: Roboto-Regular;
    font-size: 17px;
    color: #747474;
    margin-left: 15px;
}

.page-button {
    border-radius: 10px;
    border: solid 1px #F1F1F1 !important;
    background-color: #95AF5F !important;
    height: 40px;
    width: auto !important;
    min-width: 150px;

    background: white;
    color: #95AF5F;
}

.page-button:hover {
    color: white;
    background: #95AF5F;
}

.btn-auto {
    width: auto !important;
}

.page-button-red {
    border-radius: 10px;
    border: solid 1px #F1F1F1 !important;
    background-color: red !important;
    height: 40px;
    width: auto !important;
    min-width: 150px;

    background: white;
    color: #95AF5F;
}

.page-button-red:hover {
    color: white;
    background: red;
}

.custom-btn-img {
    background-image: url("../../img/exportoff.png");
    background-repeat: no-repeat;
    background-position: left center;
    background-origin: content-box;
    background-size: contain;
}

.flag-button > a {
    border: solid 1px #B9B9B9;
    background: #ffffff !important;
}

.flag-button > ul {
    left: 0 !important;
    right: auto !important;
}

.flag-button > ul > li > a {
    border-top: solid 1px #B9B9B9;
    background: #ffffff !important;
}

.flag {
    width: 20px;
    margin-right: 10px;
}

.flag:not:first-child {
    margin-right: 0px;
}

.normal-size > li > a {
    border-radius: 0px;
    padding-left: 10px;
}

.change-avatar {
    cursor: pointer;
    margin: 10px;
    border: solid 2px #B9B9B9;
    text-align: center;
    text-align: -moz-center;
    text-align: -webkit-center;
}

.change-avatar > p {
    margin-bottom: 0px;
    font-family: Roboto-Bold;
}

.change-avatar > div > img {
    /*padding-left: 90px;*/
    max-width: 175px;
    max-height: 135px;
    margin-bottom: 10px;
}

.change-avatar > a {
    margin: auto;
    float: none !important;
}

.profile-avatar {
    border: solid 2px #B9B9B9;
    text-align: center;
    text-align: -moz-center;
    text-align: -webkit-center;
    padding-bottom: 9px;
    padding-top: 4px;
}

.profile-avatar > h4 {
    font-family: Roboto-Medium;
    margin-bottom: 0px;
}

.profile-avatar > div > img {
    /*padding-left: 90px;*/
    max-width: 310px;
    max-height: 252px;
    margin-bottom: 10px;
}

.profile-avatar > a {
    margin: auto;
    float: none !important;
}

.item-image-thumb, .terrain-image-thumb {
    max-width: 80px;
    max-height: 40px;
}

.test-questions {
    border: 1px #adadad solid;
    padding: 7px;
    margin: 8px;
}

.result-question-name {
    font-size: 20px;
    font-family: Roboto-Bold;
}

.result-question-type {
    font-family: Roboto-Medium;
    text-align: right;
}

.test-question-header {
    border-bottom: 1px #adadad solid;
    clear: both;
    display: flex;
    margin-bottom: 5px;
}

.question-content-title {
    font-family: Roboto-Bold;
}

.isDisabled {
    color: currentColor;
    cursor: not-allowed;
    opacity: 0.5;
    text-decoration: none;
}

.question, .teacher {
    border: 1px solid #adadad;
    padding: 10px;
    margin-bottom: 10px;
}

.add-question, .add-question > a, .add-answer, .add-answer > a, .add-space-teacher, .add-space-teacher > a {
    color: white;
}

.delete-question, .delete-answer, .delete-space-teacher {
    background-color: red !important;
}

.select-right {
    position: absolute;
    right: 0;
    margin: auto 0;
}

.select-left {
    position: absolute;
    left: 0;
    margin: auto 0;
}

.relative {
    position: relative;
}

.delete-question > a, .delete-answer > a {
    color: white;
}

.sorted .asc, .sorted .desc {
    width: 10px;
    height: 10px;
    position: relative;
    cursor: pointer;
}

.sorted .asc::before {
    content: " ";
    width: 6px;
    height: 6px;
    border-top: 2px solid white;
    border-left: 2px solid white;
    display: inline-block;
    margin-left: 10px;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: -10px;
    transition: 0.5s all;
}

.sorted .desc::before {
    content: " ";
    width: 6px;
    height: 6px;
    border-top: 2px solid white;
    border-left: 2px solid white;
    display: inline-block;
    margin-left: 10px;
    transform: rotate(-135deg) translateY(100%);
    position: absolute;
    top: 50%;
    right: -10px;
    transition: 0.5s all;
}

.dropdown.menu > li.is-dropdown-submenu-parent:hover > a::after {
    border-color: #ffffff transparent transparent;
}

.dropdown.menu > li.is-dropdown-submenu-parent > a::after {
    border-color: #95AF5F transparent transparent;
}

.is-dropdown-submenu .is-dropdown-submenu-parent.opens-right:hover > a::after {
    border-color: transparent transparent transparent #ffffff;
}

.is-dropdown-submenu .is-dropdown-submenu-parent.opens-right > a::after {
    border-color: transparent transparent transparent #95AF5F;
}

.text-uppercase {
    text-transform: uppercase;
}

.table-break {
    max-width: 30vw;
    word-break: break-all;
    word-wrap: break-word;
}

@media (min-width: 1401px) {
    #mobile-top-bar {
        display: none;
    }

    .locale-shortcut {
        display: none;
    }
}

@media (max-width: 1400px) {
    #responsive-menu {
        display: none;
    }

    .icon-s {
        display: none !important;
    }

    .dropdown.custom .dropdown-user-actions .is-submenu-item {
        margin-left: 0;
        text-align: left;
        padding-left: 10px;
    }

    .dropdown.custom .dropdown-user-actions .is-submenu-item .custom-vertical-menu {
        margin-top: 0;
        padding-top: 0;
    }

    .dropdown.custom .dropdown-user-actions .is-submenu-item .custom-vertical-menu li {
        border: solid 1px rgba(221, 221, 223, 0);
        background: transparent;
    }

    .dropdown.custom .dropdown-user-actions .is-submenu-item .custom-vertical-menu li a {
        width: 100%;
        border-radius: 0;
        padding: 6px 0 6px 10px;
        background: #F4F4F6;
    }

    .dropdown.custom .dropdown-user-actions .is-submenu-item a {
        margin: 0;
        width: 100%;
        line-height: 1.2;
    }
}

input[type="checkbox"] {
    width: auto !important;
}

.colors {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin-top: 10px
}

.colors-hide {
    display: none;
}

.colors > div {
    margin: 0 23px 27px 0;
}

.colorCube {
    width: 45px;
    height: 30px;
    border-radius: 3px;
    opacity: 0.8;
}

.colorCube.color-selected {
    border: 3px solid #FFFFFF;
}

.end-row {
    margin-bottom: 50px;
}
.d-flex {
    display: flex;
    align-items: center
}

.d-flex-justify {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mr-1{
    margin-right: 4px;
}

.mr-3{
    margin-right: 12px;
}
.ml-4{
    margin-left: 2rem;
}
.mb-2{
    margin-bottom: 1rem;
}

.border-baseline{
    border: 2px solid #B9B9B9;
}

.student-list{
    padding: 10px;
    margin-bottom: 50px;;
}

summary{
    position: relative;
    padding-left: 30px;
}
details[open] > summary::before{
    content: " ";
    width: 6px;
    height: 6px;
    border-top: 2px solid black;
    border-left: 2px solid black;
    display: inline-block;
    margin-left: 10px;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    left: 0;
    transition: 0.5s all;
}

summary::before{
    content: " ";
    width: 6px;
    height: 6px;
    border-top: 2px solid black;
    border-left: 2px solid black;
    display: inline-block;
    margin-left: 10px;
    transform: rotate(-135deg) translateY(100%);
    position: absolute;
    top: 50%;
    left: 0;
    transition: 0.5s all;
}

.pr-3{
    padding-right: 1.5rem;
}

.overflow{
    overflow: auto;
    display: flex;
    display: -webkit-inline-flex;
    display: -webkit-inline-box;
    display: -webkit-box;
    position: relative;
}

/*.is-dropdown-submenu.js-dropdown-active{ */
/*    right: 0;*/
/*    left: unset;*/
/*}*/


.pagination{
    text-align: center;
}

/*HAMBURGER MENU*/

.hamburger-menu {
    margin: 2rem;
    display: flex;
    flex-flow: column wrap;
    justify-content: space-between;
    width: 2rem;
    cursor: pointer;
}
.bar-top,
.bar-middle,
.bar-bottom {
    height: 3px;
    background: #95AF5F;
    border-radius: 5px;
    margin: 3px 0;
    transform-origin: left;
}
.welcome-block:hover .hamburger-menu .bar-top {
    transform: translateX(4px) rotate(45deg) translateY(0px);
}
.welcome-block:hover .hamburger-menu .bar-middle {
    transform:translateX(1rem);
    opacity: 0;
}
.welcome-block:hover .hamburger-menu .bar-bottom {
transform: translateX(0px) rotate(-45deg) translateY(5px)
}
.active-link:hover{
color: #95AF5F;
}
/*END*/
@media (max-width: 1024px) {
    .top-bar-title{
        display: none;
    }
    table{
        display: block;
        overflow: auto;
        width: auto;
    }

    .is-dropdown-submenu-parent.opens-inner .is-dropdown-submenu.dropdown-user-actions{
        left: unset;
        right: 0;
    }

    .select-left{
        position: unset;
        text-align: left;
        padding-left: 0.5rem;
    }

}
@media (max-width: 1400px){
    .dropdown.menu > li.is-dropdown-submenu-parent > a.no-arrow::after{
        content: unset;
    }

    .welcome-block:hover .hamburger-menu .bar-top,.welcome-block:hover .hamburger-menu .bar-bottom{
        background: white;
    }
}