body,
.main-container,
.footer,
.main-navigation,
ul.main-navigation-menu > li > ul.sub-menu,
.navigation-small ul.main-navigation-menu > li > ul.sub-menu {
    background: #34485e none !important;
}


.brand-home { display: inline-block; padding: 10px 0}
.brand-home img { width: 195px; }


.layout-boxed header,
.layout-boxed .main-container,
.layout-boxed .footer {

    border-left-color: #455F77;
    border-right-color: #455F77;
}

.navbar-inverse {
    background: #000;
}

.navbar-inverse .navbar-brand, .navbar-inverse .navbar-brand:hover, .navbar-inverse .nav > li > a {
    color: #A7B4D1;
}

.navbar-inverse .navbar-brand i, .navbar-inverse .navbar-brand:hover i {
    color: #ffffff;
}

.navbar-inverse .nav > li > a {
    color: #A7B4D1;
    text-shadow: 0 1px 0 #000000;
}

.navbar-inverse .nav > li.current-user > a {
    color: #ffffff !important;
}

.navbar-inverse .nav > li.current-user > a i {
    display: inline-block;
    text-align: center;
    width: 1.25em;
    color: #ffffff !important;
    font-size: 12px;
}

.navbar-inverse .nav > li:hover > a, .navbar-inverse .nav > li:active > a, .navbar-inverse .nav > li:focus > a {
    color: #ffffff;
    background: #2B394A;
}

.navbar-inverse .nav li.dropdown.open > .dropdown-toggle, .navbar-inverse .nav li.dropdown.active > .dropdown-toggle, .navbar-inverse .nav li.dropdown.open.active > .dropdown-toggle {
    background: #2B394A;
    color: #ffffff;
}

.navbar-tools .dropdown-menu li .dropdown-menu-title {
    background: #2B394A;
    color: #ffffff;
}

.navbar-inverse .btn-navbar {
    background-color: #2B394A;
    background: -moz-linear-gradient(top, #34485e 0%, #283b52 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #34485e), color-stop(100%, #283b52)); /* webkit */
}

.nav > li.dropdown .dropdown-toggle .badge {
    background-color: #D9534F;
    border: none;
}

.navbar-toggle {
    background-color: #2B394A;
    color: #D9D9D9;
}

.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
    background-color: #2B394A;
    -moz-box-shadow: 0 0 15px #fff;
    -webkit-box-shadow: 0 0 15px #fff;
    box-shadow: 0 0 15px #fff;

}

.navbar-toggle span {
    color: #D9D9D9;
}

ul.main-navigation-menu > li a {
    border-bottom-color: #26384C;
    border-top-color: #6381A1;
    color: #ffffff;
}

ul.main-navigation-menu > li a > i {
    color: #ffffff;
    font-weight: normal;
}

ul.main-navigation-menu > li.active > a {
    background: #E02222 !important;
    border-top: none !important;
    color: #fff;
}

ul.main-navigation-menu > li.active > a .selected:before {
    color: #E02222 !important;
}

ul.main-navigation-menu > li.active > a i {
    color: #fff;
}

ul.main-navigation-menu > li.open > a, ul.main-navigation-menu > li > a:hover, ul.main-navigation-menu > li:hover > a {
    background-color: #2B394A;
}

.navigation-toggler, .go-top {
    background-color: #2B394A !important;
    color: #5A7CA3;
}

.navigation-toggler:hover i:first-child, .go-top:hover {
    color: #A7B4D1;
}

.navigation-toggler:hover i:last-child {
    color: #5A7CA3;
}

.navigation-small .navigation-toggler:hover i:first-child {
    color: #5A7CA3;
}

.navigation-small .navigation-toggler:hover i:last-child {
    color: #A7B4D1;
}

ul.main-navigation-menu li > ul.sub-menu {
    background: rgba(43, 57, 74, 0.9) !important;
    list-style: none;
    margin: 0;
    padding: 10px 0;
}

ul.main-navigation-menu li > ul.sub-menu > li > a {
    border: 0 none;
    display: block;
    font-size: 14px;
    font-weight: 300;
    margin: 0;
    padding: 4px 0 4px 32px !important;
    position: relative;
    text-decoration: none;
    border-bottom-color: #26384C;
    border-top-color: #6381A1;
    color: #ffffff;
}

ul.main-navigation-menu li.open > ul.sub-menu,
ul.main-navigation-menu li.active > ul.sub-menu {
    display: block;
}

ul.main-navigation-menu li > ul.sub-menu > li.open > a,
ul.main-navigation-menu li > ul.sub-menu > li.active > a,
ul.main-navigation-menu li > ul.sub-menu > li > a:hover {
    background: rgba(224,34,34, 0.5) !important;
    border-top: none !important;
    color: #fff;
}

.breadcrumb i {
    color: #cccccc;
}

.breadcrumb a {
    color: #007AFF;
}

.footer-fixed .footer {
    background: rgba(43, 57, 74, 0.9) !important;
    border-top-color: #455F77;
}

.footer-inner {
    color: #ffffff;
}

.main-content .container {
    border-left: 1px solid #455F77;
    border-bottom: 1px solid #455F77;
}

@media (max-width: 767px) {
    .navbar-inverse {
        background: none !important;
    }

    .navbar-tools {
        background: rgba(43, 57, 74, 0.9);
        border-top-color: #455F77;
    }

    .navbar-header {
        background-color: #344D69;
    }
}

.navbar-fixed-top, .navbar-fixed-bottom {
    position: relative !important;
}

.main-container {
    margin-top: 0;
}

.navbar > .container .navbar-brand, .logo {
    padding: 0;
}

table.table thead a.sort-link {
    display: block;
    line-height: 20px
}

table.table thead .sorting {
    background: none
}

table.table thead .sorting_asc {
    background: none
}

table.table thead .sorting_desc {
    background: none
}

table.table thead .sorting a.sort-link {
    background: url('../plugins/DataTables/media/css/images/sort_both.png') no-repeat center right;
}

table.table thead .sorting a.sort-link.asc {
    background: url('../plugins/DataTables/media/css/images/sort_asc.png') no-repeat center right;
}

table.table thead .sorting a.sort-link.desc {
    background: url('../plugins/DataTables/media/css/images/sort_desc.png') no-repeat center right;
}

table.table td.button-column {
    white-space: nowrap;
}

.input-icon > textarea, .input-icon > select {
    padding-left: 25px;
    padding-right: 6px;
}

.input-icon.input-icon-right > textarea, .input-icon.input-icon-right > select {
    padding-left: 6px;
    padding-right: 25px;
}

span.input-help > textarea {
    padding-left: 30px;
    padding-right: 6px;
}

#rbam .row, #rbam-dialog-form .row {
    margin-right: 15px !important;
    margin-left: 15px !important;
}

.photos-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
    place-items: center;
    margin-bottom: 17px;
}

.movie-photo { border: 3px solid transparent; border-radius: 4px; }
.main-hard-photo { border-color: red; }
.main-soft-photo { border-color: green; }
.carousel-hard-photo { border-color: #f0ad4e; }
.carousel-soft-photo { border-color: #edf000; }


.hidden-photo-eye-opened { opacity: 0 }
.hidden-photo-eye-closed { opacity: 0 }

.hidden-photo-checkbox { display: none }
.hidden-photo-checkbox ~ label { position: absolute; right: 10px; top: 10px }

.hidden-photo-checkbox:checked ~ img { opacity: 0.3 }
.hidden-photo-checkbox:checked ~ label svg .hidden-photo-eye-opened { opacity: 1}
.hidden-photo-checkbox:not(:checked) ~ label svg .hidden-photo-eye-closed { opacity: 1}


.photo-controls {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.photo-buttons-header {
    margin-bottom: 4px;
}
.photo-buttons-grid {
    display: grid;
    grid-template-columns: auto auto;
    gap: 8px 16px;
    align-items: center;
    justify-content: space-between;
}
.photo-buttons-grid label {
    margin-bottom: 0;
}
.photo-buttons-grid .mt-ios,
.photo-buttons-grid .mt-ios-red {
    font-size: 6px;
}

.photo-buttons-grid .mt-ios label,
.photo-buttons-grid .mt-ios label:before,
.photo-buttons-grid .mt-ios-red label,
.photo-buttons-grid .mt-ios-red label:before {
    transition-property: transform, box-shadow;
}

.photo-underline { background: lightgray; height: 4px; }
.photo-underline[data-label="hard"] { background: lightcoral; }
.photo-underline[data-label="soft"] { background: lightgreen; }
:checked + .photo-selectable-thumb {
    background: rgb(232,240,254);
    padding: 10px;
}
.photo-selectable-item {
    position: relative;
    padding: 0;
}
.photo-selectable-input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
}
.photo-selectable-thumb {
    display: flex;
}


.thumbnails .thumbnail {
    position: relative;
}
.thumbnails .thumbnail.selected {
    background: #0088cc;
}

.thumbnails .thumbnail.main {
    background: #FF0000;
}

.thumbnails .thumbnail.second {
    background: #f0ad4e;
}

.thumbnails .thumbnail.landscape {
    background: #ff04e8;
}

.thumbnails .thumbnail.portrait {
    background: #edf000;
}

.thumbnails .thumbnail.softMainLandscape {
    background: green;
}

.thumbnails .thumbnail.softLandscape {
    background: #0DFFBA;
}
.thumbnails .thumbnail img {
    cursor: pointer;
}

.thumbnails .thumbnail img:hover {
    opacity: .9;
}

.editable-photo {
    position: relative;
}

.editable-photo .overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    visibility: hidden;
}

.overlay {
    display: block;
    color: #fff;
    opacity: 0.8;
    background: #4477aa;
    border: solid 3px #336699;
    border-radius: 4px;
    box-shadow: 2px 2px 10px #333;
    text-shadow: 1px 1px 1px #666;
    padding: 4px;
}

.editable-photo:hover .overlay {
    visibility: visible;
}

div .pic_container {
    border: 1px solid #DDDDDD;
    float: left;
    margin: 10px;
    padding: 6px;
}

#Movie_categoryIds > div {
    width: 20% !important;
    float: left;
}

.col-sm-margin-l-20 {
    margin-left: 20px;
}

.grid-view tr.deleted td {
    background-color: #f09b9b !important
}

.fc-event {
    cursor: pointer;
}

.tab-content > .active {
    display: block !important;
}

#zone-names.modal {
    background: #FFF;
    top: 20px;
    left: calc(50% - 450px);
    bottom: 0
}

.select2-container {
    width: 100%;
    padding: 0;
    margin: 0;
}

.select2-container-multi .select2-choices, .select2-container .select2-choice {
    min-height: 34px;
    padding-top: 2px;
}

.select2-container.select2-allowclear .select2-choice abbr {
    margin-right: 10px;
}

body.login .footer {
    display: none
}

#album-list-photos {
    margin: 0;
    padding: 0;
}

#album-list-photos li {
    list-style: none;
    margin-left: 10px;
}

.break-word {
    word-wrap: break-word;
}

#movie-grid table thead input[type=text], #movie-grid table thead .form-control{
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
}

video {
    max-width: 100%;
}

.video-container {
    aspect-ratio: 16 / 9;
    width: 100%;
    display: grid;
    place-items: center;
}

.modal {
    outline: none;
}

@media (min-width: 992px) {
    .modal-lg {
        width: 1400px;
    }
}
