@charset "UTF-8";

html, body {
    height: 100%;
}

body {
    font-family: Barlow, sans-serif;
    background: url('../img/background.png') no-repeat left top;
    background-size: cover;
    background-color: #1d242b;
}

    body.admin {
        background: none;
        background-color: #f4f4f4;
    }

.addbackground {
    background: url('../img/background_2.png') no-repeat left top;
    background-size: cover;
}
#draggable {
    background-color: #E7E7E7;
    height: 100%;
    width: 10px;
    border-left: 1.5px dashed #B5B5B5;
    border-right: 1.5px dashed #b5b5b5;
}
header {
    /* box-shadow: 1px 5px 24px rgba(0,0,0,.5);
    background-color: #fff; */
}

    header .dropdown-menu {
        background-color: #ebebed;
        border-radius: 0;
        border: 1px solid rgba(0,0,0,.15);
    }

    header input {
        letter-spacing: normal;
        text-indent: 0.25em;
        border-radius: 0 !important;
        color: #fff;
        border: 1px solid rgba(255,255,255,.5);
        background: rgba(0,0,0,.5);
    }

/*



@media (max-width: 576px) {
    .main .container {
        max-width: 400px !important;
    }
}

@media (min-width: 600px) {
    .main > .container {
        max-width: 500px !important;
    }
}

@media (min-width: 700px) {
    .main > .container {
        max-width: 600px !important;
    }
}

@media (min-width: 768px) {
    .main > .container {
        max-width: 560px !important;
        ;
    }
}

@media (min-width: 800px) {
    .main > .container {
        max-width: 600px !important;
        ;
    }
}

@media (min-width: 900px) {
    .main > .container {
        max-width: 700px !important;
        ;
    }
}

@media (min-width: 992px) {
    .main > .container {
        max-width: 790px !important;
        ;
    }
}

@media (min-width: 993px) and (max-width: 1099px) {
    .main > .container {
        max-width: 800px !important;
    }
}

@media (min-width: 1100px) and (max-width: 1199px) {
    .main > .container {
        max-width: 900px !important;
    }
}

@media (min-width: 1200px) and (max-width: 1299px) {
    .main > .container {
        max-width: 1000px !important;
    }
}

@media (min-width: 1300px) and (max-width: 1399px) {
    .main > .container {
        max-width: 1100px !important;
    }
} 

@media (min-width: 1400px) {
    .main > .container {
        max-width: 1200px !important;
    }
}

@media (min-width: 1500px) {
    .main > .container {
        max-width: 1300px !important;
    }
}

@media (min-width: 1600px) {
    .main > .container {
        max-width: 100% !important;
    }
} */


.navbar-brand {max-width: 140px;}

.avatar {width: 32px; height: 32px; color: #fff; font-weight: 600; font-size: 1rem; background-color: #ff0000;}
.profile-name {
    font-weight: 600;
    font-size: 1rem;
}

footer {
    background-color: #888a8d;
    color: #fff;
    line-height: 22px !important;
}
    footer p {color: #fff; margin: 0; padding: 0; font-size: 85%;}

.callout-blue {
    background-color: rgba(82,181,204,0.7) /*#52b5cc*/;
}

h1 {
    font-weight: 700;
    font-size: 30px;
    color: #D7282F;
}
h2 {
    font-weight: 600;
    font-size: 22px;
    color: #D7282F;
}
h3 {font-size: 20px;}
label {font-weight: 700; text-transform: uppercase;}

.banner {
    background-color: #fdc237;
}

.featured {
    /* background-color: #000;
    background: url(../img/r-main-new.jpg) no-repeat;
    min-height: 200px;*/
}
    .featured .white {
        background-color: #fff;
    }

.intro {font-size: 125%;}

.btn {
    border-radius: 0;
    border: 0;
    font-size: 17px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 10px 20px !important;
}

.bootstrap-select .btn.dropdown-toggle {padding: .375rem .75rem !important; font-size: 1rem; font-weight: 400;}

.bootstrap-select > .dropdown-toggle {
    white-space: wrap !important;
    text-transform: none;
}

.delete .btn, .update .btn {
    padding: 0px 5px !important;
    line-height: 1;
}

.btn.primary {
    background-color: #d9282f;
    color: #fff;
}

    .btn.primary:hover {
        background-color: #BE2228;
    }

.btn.secondary {
        background-color: #349FA7;
        color: #fff;
        line-height: 1.6;
    }

    .btn.secondary:hover {
        background-color: #2C878D;
    }

.form-control {
    border-radius: .25rem;
    border: 0px solid #A8A8A8;
    color: #000000;
    box-shadow: 3px 3px 6px rgba(0,0,0,.1);
}

.rounded-4 {
    border-radius: 0.4rem !important;
}

.features-list {
    padding-bottom: 1rem;
    list-style: none;
}

.features-item {
    display: block;
    align-items: center;
    position: relative;
    /*padding: 0.5rem 0.9rem;
    margin-bottom: 1.1rem;*/
    color: #fff;
    cursor: pointer;
    transition: 0.5s ease;
}

    .features-item::before {
        transition: 0.5s ease;
        content: '';
        position: absolute;
        left: -1.2rem;
        height: 100%;
        border-left: 3px solid var(--white-color);
        border-radius: 2px;
        opacity: 0;
        visibility: hidden;
    }

    .features-item:hover {
        color: var(--white-color);
        transition: 0.5s ease;
    }

        .features-item:hover::before {
            opacity: 1;
            visibility: unset;
        }

.features-item-icon {
    color: #888a8d;
}

.features-item-text {
    margin-left: 1.5rem;
    opacity: 1;
    transition: opacity 0.6s ease;
    color: #fff;
    display: none;
}
.sidebar {
    padding: 1.2rem;
    background-color: #444d57;
}

    .sidebar {
        width: 5rem;
        transition: all 0.5s ease;
    }

    @media screen and (min-width: 768px) {
        .sidebar {
            min-width: 200px !important;
            transition: all 0.5s ease;
        }

        /*.collapse:not(.show) {
            display: block;
            height: auto !important;
            visibility: visible;
        }*/

        .collapsing {
            position: relative;
            height: unset !important;
            overflow: hidden;
        }

        .features-item-text {
            margin-left: .5rem;
            opacity: 1;
            transition: opacity 0.6s ease;
            color: #fff;
            display: inline-block;
        }
    }

        .sidebar.collapse .logout,
        .sidebar.collapse .features-item-text {
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.6s ease;
        }

        .sidebar.collapse .features-item-text {display: none;}

    .sidebar .logout {
                transition: opacity 0.6s ease;
    }

@media screen and (max-width: 767px) {
    .sidebar .logout {
        display: none;
    }
}

@media screen and (min-width: 768px) {
    .sidebar .hide_on_collapse {
        display: none;
        opacity: 0;
        transition: opacity 0.5s ease;
    }

}


    .sidebar.collapse .show_on_collapse {
        display: block;
        opacity: 1;
        transition: opacity 0.5s ease;
    }

    .sidebar .nav-link:hover {
        background-color: #486b78;
    }

        .sidebar .nav-link:hover .features-item-icon {
            color: #fff;
        }

    .sidebar .border-bottom {
        border-bottom: 1px solid #8f9398 !important;
    }



    .nav {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none
    }

    .nav-link {
        display: block;
        padding: .5rem 1rem
    }

        .nav-link:hover, .nav-link:focus {
            text-decoration: none
        }

        .nav-link.disabled {
            color: #6c757d
        }

    .nav-tabs {
        border-bottom: 1px solid #dee2e6
    }

        .nav-tabs .nav-item {
            margin-bottom: -1px
        }

        .nav-tabs .nav-link {
            border: 1px solid transparent;
            border-top-left-radius: .25rem;
            border-top-right-radius: .25rem
        }

            .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
                border-color: #e9ecef #e9ecef #dee2e6
            }

            .nav-tabs .nav-link.disabled {
                color: #6c757d;
                background-color: transparent;
                border-color: transparent
            }

            .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
                color: #495057;
                background-color: #fff;
                border-color: #dee2e6 #dee2e6 #fff
            }

        .nav-tabs .dropdown-menu {
            margin-top: -1px;
            border-top-left-radius: 0;
            border-top-right-radius: 0
        }

    .nav-pills .nav-link {
        border-radius: 0;
    }

        .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
            color: #fff;
            background-color: #007bff
        }

    .nav-fill .nav-item {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        text-align: center
    }

    .nav-justified .nav-item {
        -ms-flex-preferred-size: 0;
        flex-basis: 0%;
        -ms-flex-positive: 1;
        flex-grow: 1;
        text-align: center
    }

    .navbar {
        position: relative;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: .5rem 1rem
    }

        .navbar > .container, .navbar > .container-fluid {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-pack: justify;
            justify-content: space-between
        }

    .navbar-brand {
        display: inline-block;
        padding-top: .3125rem;
        padding-bottom: .3125rem;
        margin-right: 1rem;
        font-size: 1.25rem;
        line-height: inherit;
        white-space: nowrap
    }

        .navbar-brand:hover, .navbar-brand:focus {
            text-decoration: none
        }

    .navbar-nav {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none
    }

        .navbar-nav .nav-link {
            padding-right: 0;
            padding-left: 0
        }

        .navbar-nav .dropdown-menu {
            position: static;
            float: none
        }

    .navbar-text {
        display: inline-block;
        padding-top: .5rem;
        padding-bottom: .5rem
    }

    .navbar-collapse {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        -ms-flex-positive: 1;
        flex-grow: 1;
        -ms-flex-align: center;
        align-items: center
    }

    .navbar-toggler {
        padding: .25rem .75rem;
        font-size: 1.25rem;
        line-height: 1;
        background-color: transparent;
        border: 1px solid transparent;
        border-radius: .25rem
    }

        .navbar-toggler:hover, .navbar-toggler:focus {
            text-decoration: none
        }

        .navbar-toggler:not(:disabled):not(.disabled) {
            cursor: pointer
        }

    .navbar-toggler-icon {
        display: inline-block;
        width: 1.5em;
        height: 1.5em;
        vertical-align: middle;
        content: "";
        background: no-repeat center center;
        background-size: 100% 100%
    }

    @media (max-width: 575.98px) {
        .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid {
            padding-right: 0;
            padding-left: 0
        }
    }

    @media (min-width: 576px) {
        .navbar-expand-sm {
            -ms-flex-flow: row nowrap;
            flex-flow: row nowrap;
            -ms-flex-pack: start;
            justify-content: flex-start
        }

            .navbar-expand-sm .navbar-nav {
                -ms-flex-direction: row;
                flex-direction: row
            }

                .navbar-expand-sm .navbar-nav .dropdown-menu {
                    position: absolute
                }

                .navbar-expand-sm .navbar-nav .nav-link {
                    padding-right: .5rem;
                    padding-left: .5rem
                }

            .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid {
                -ms-flex-wrap: nowrap;
                flex-wrap: nowrap
            }

            .navbar-expand-sm .navbar-collapse {
                display: -ms-flexbox !important;
                display: flex !important;
                -ms-flex-preferred-size: auto;
                flex-basis: auto
            }

            .navbar-expand-sm .navbar-toggler {
                display: none
            }
    }

    @media (max-width: 767.98px) {
        .navbar-expand-md > .container, .navbar-expand-md > .container-fluid {
            padding-right: 0;
            padding-left: 0
        }
    }

    @media (min-width: 768px) {
        .navbar-expand-md {
            -ms-flex-flow: row nowrap;
            flex-flow: row nowrap;
            -ms-flex-pack: start;
            justify-content: flex-start
        }

            .navbar-expand-md .navbar-nav {
                -ms-flex-direction: row;
                flex-direction: row
            }

                .navbar-expand-md .navbar-nav .dropdown-menu {
                    position: absolute
                }

                .navbar-expand-md .navbar-nav .nav-link {
                    padding-right: .5rem;
                    padding-left: .5rem
                }

            .navbar-expand-md > .container, .navbar-expand-md > .container-fluid {
                -ms-flex-wrap: nowrap;
                flex-wrap: nowrap
            }

            .navbar-expand-md .navbar-collapse {
                display: -ms-flexbox !important;
                display: flex !important;
                -ms-flex-preferred-size: auto;
                flex-basis: auto
            }

            .navbar-expand-md .navbar-toggler {
                display: none
            }
    }

    @media (max-width: 991.98px) {
        .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid {
            padding-right: 0;
            padding-left: 0
        }
    }

    @media (min-width: 992px) {
        .navbar-expand-lg {
            -ms-flex-flow: row nowrap;
            flex-flow: row nowrap;
            -ms-flex-pack: start;
            justify-content: flex-start
        }

            .navbar-expand-lg .navbar-nav {
                -ms-flex-direction: row;
                flex-direction: row
            }

                .navbar-expand-lg .navbar-nav .dropdown-menu {
                    position: absolute
                }

                .navbar-expand-lg .navbar-nav .nav-link {
                    padding-right: .5rem;
                    padding-left: .5rem
                }

            .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid {
                -ms-flex-wrap: nowrap;
                flex-wrap: nowrap
            }

            .navbar-expand-lg .navbar-collapse {
                display: -ms-flexbox !important;
                display: flex !important;
                -ms-flex-preferred-size: auto;
                flex-basis: auto
            }

            .navbar-expand-lg .navbar-toggler {
                display: none
            }
    }

    @media (max-width: 1199.98px) {
        .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid {
            padding-right: 0;
            padding-left: 0
        }
    }

    @media (min-width: 1200px) {
        .navbar-expand-xl {
            -ms-flex-flow: row nowrap;
            flex-flow: row nowrap;
            -ms-flex-pack: start;
            justify-content: flex-start
        }

            .navbar-expand-xl .navbar-nav {
                -ms-flex-direction: row;
                flex-direction: row
            }

                .navbar-expand-xl .navbar-nav .dropdown-menu {
                    position: absolute
                }

                .navbar-expand-xl .navbar-nav .nav-link {
                    padding-right: .5rem;
                    padding-left: .5rem
                }

            .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid {
                -ms-flex-wrap: nowrap;
                flex-wrap: nowrap
            }

            .navbar-expand-xl .navbar-collapse {
                display: -ms-flexbox !important;
                display: flex !important;
                -ms-flex-preferred-size: auto;
                flex-basis: auto
            }

            .navbar-expand-xl .navbar-toggler {
                display: none
            }
    }

    .navbar-expand {
        -ms-flex-flow: row nowrap;
        flex-flow: row nowrap;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

        .navbar-expand > .container, .navbar-expand > .container-fluid {
            padding-right: 0;
            padding-left: 0
        }

        .navbar-expand .navbar-nav {
            -ms-flex-direction: row;
            flex-direction: row
        }

            .navbar-expand .navbar-nav .dropdown-menu {
                position: absolute
            }

            .navbar-expand .navbar-nav .nav-link {
                padding-right: .5rem;
                padding-left: .5rem
            }

        .navbar-expand > .container, .navbar-expand > .container-fluid {
            -ms-flex-wrap: nowrap;
            flex-wrap: nowrap
        }

        .navbar-expand .navbar-collapse {
            display: -ms-flexbox !important;
            display: flex !important;
            -ms-flex-preferred-size: auto;
            flex-basis: auto
        }

        .navbar-expand .navbar-toggler {
            display: none
        }

    .navbar-light .navbar-brand {
        color: rgba(0,0,0,.9)
    }

        .navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {
            color: rgba(0,0,0,.9)
        }

    .navbar-light .navbar-nav .nav-link {
        color: rgba(0,0,0,.5)
    }

        .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
            color: rgba(0,0,0,.7)
        }

        .navbar-light .navbar-nav .nav-link.disabled {
            color: rgba(0,0,0,.3)
        }

        .navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active {
            color: rgba(0,0,0,.9)
        }

    .navbar-light .navbar-toggler {
        color: rgba(0,0,0,.5);
        border-color: rgba(0,0,0,.1)
    }

    .navbar-light .navbar-toggler-icon {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")
    }

    .navbar-light .navbar-text {
        color: rgba(0,0,0,.5)
    }

        .navbar-light .navbar-text a {
            color: rgba(0,0,0,.9)
        }

            .navbar-light .navbar-text a:hover, .navbar-light .navbar-text a:focus {
                color: rgba(0,0,0,.9)
            }

    .navbar-dark .navbar-brand {
        color: #fff
    }

        .navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {
            color: #fff
        }

    .navbar-dark .navbar-nav .nav-link {
        color: rgba(255,255,255,.5)
    }

        .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
            color: rgba(255,255,255,.75)
        }

        .navbar-dark .navbar-nav .nav-link.disabled {
            color: rgba(255,255,255,.25)
        }

        .navbar-dark .navbar-nav .show > .nav-link, .navbar-dark .navbar-nav .active > .nav-link, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .nav-link.active {
            color: #fff
        }

    .navbar-dark .navbar-toggler {
        color: rgba(255,255,255,.5);
        border-color: rgba(255,255,255,.1)
    }

    .navbar-dark .navbar-toggler-icon {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")
    }

    .navbar-dark .navbar-text {
        color: rgba(255,255,255,.5)
    }

        .navbar-dark .navbar-text a {
            color: #fff
        }

            .navbar-dark .navbar-text a:hover, .navbar-dark .navbar-text a:focus {
                color: #fff
            }