.h4,.h5 {
    font-weight:300;
}

.dragdroparea {
    border: 1px dashed #5f69a3;
    vertical-align: middle!important;
    height: 130px;
    width: 100%;
    background-color: #fff;
    text-align: center;
    padding: 5px;
    color: #adadad;
    overflow:scroll;
}


.default-color {
    background-color: #4285f4!important;
}

.modal-header {
    background-color: #4285f4!important;
}

table.table th, table.table td {
     padding-top: .75rem;
     padding-bottom: .75rem;
}

#select-options-addCostCodeCategorySelect2 {
    max-height:350px!important;
}

li.dropdown-item {
    height: 44px;
}

.dropdown-menu a:hover {
    /*background-color: #112f6b!important*/
}

.btn.btn-sm {
    min-width: 75px;
    padding: .5rem .6rem;
}


@media(min-width:1449px) {
    main {
        padding-left:240px!important;
    }
}

@media(max-width:1448px) {
    main {
        padding-left:0px!important;
    }
}

.down-arrow {
    cursor: default;
    width: 50px;
    height: 50px;
    position: absolute;
    z-index: 999;
    right: calc(50% - 30px);
    bottom: 20px;
    margin: 0px;
    background: #2058a5 url('../img/down-arrow.png') no-repeat center 47%;
    border-radius: 25px
}

.up-arrow {
    cursor: default;
    width: 50px;
    height: 50px;
    position: absolute;
    z-index: 999;
    right: calc(50% - 30px);
    bottom: 20px;
    margin: 0px;
    background: #2058a5 url('../img/up-arrow.png') no-repeat center 47%;
    border-radius: 25px
}

.modal-header {
    padding:10px 20px;
}

.tab-pane {
    height:600px;
}

.md-pills .nav-link.active {
    background-color:white!important;
    color:grey!important;
    border:1px solid grey!important;
}

.side-nav .collapsible a {
    font-size:.9rem;
}

.view {
    overflow:scroll!important;
}

#main {
    padding:0;
    margin:0;
}

.white-skin .navbar .navbar-nav .nav-item a {
    font-size:16px!important;
}

#loader, .loader {
    text-align:center;
    line-height:100px;
    font-size:45px;
    position: fixed;
    z-index: 200;
    color: #666;
    width: 300px;
    margin:auto;
    height: 100px;
    top:45%;
    left:50%;
    margin-left:-150px;
    display:table;
    text-align:center;
    border-radius:5px;
}

.qboLink {
    text-align:center;
    line-height:100px;
    font-size:50px;
    position: fixed;
    z-index: 200;
    color: #666;
    width: 300px;
    height: 100px;
    top:45%;
    left:50%;
    margin-left:-150px;
    display:table;
    text-align:center;
    border-radius:5px;
}

#loader2 {
    background-color:white;
    text-align:center;
    line-height:100px;
    font-size:50px;
    position: fixed;
    color: #666;
    width: 300px;
    height: 100px;
    top:45%;
    left:50%;
    margin-left:-150px;
    display:table;
    text-align:center;
}

#page_body_content {
    padding:0 3%;
}

@media(min-width:1450px) {
    .page-body {
        background-size:cover; 
        background-repeat: no-repeat;
        /*position:fixed;
        top:0;
        left:240px;
        width:100%;*/
        /*width:90%;*/
        height:95vh;
    }
}

@media(max-width:1449px) {
    .page-body {

        /* shows 100% of the image but doesn't cover the div on small */
/*        background-size:100% auto;*/

        /* covers the div, but crops the image on smaller windows */
        background-size:cover;

        background-repeat: no-repeat;
        /*position:fixed;
        top:0;
        left:0px;
        width:100%;*/
        height:95vh;

    }
}


@media(min-width:1450px) {
    #season {
        background-size:cover;
        background-repeat: no-repeat;
        position:fixed;
        top:0;
        left:240px;
        width:100%;
        height:100%;
    }
}

@media(max-width:1449px) {
    #season {

        /* shows 100% of the image but doesn't cover the div on small */
/*        background-size:100% auto;*/

        /* covers the div, but crops the image on smaller windows */
        background-size:cover;
        background-position-x: center;
        background-repeat: no-repeat;
        position:fixed;
        top:0;
        left:0px;
        width:100%;
        height:100%;

    }
}

canvas { 
    display: block; 
}

.spring .card,.summer .card,.fall .card,.winter .card {
    background-color: rgba(0, 0, 0, 0.4 );
    width:450px;
}

.spring .card .card-body h2,.summer .card .card-body h2,.fall .card .card-body h2,.winter .card .card-body h2 {
    font-weight: 300
}

#logo {
    background-color:rgba(0,0,0,.4);
    border-radius:.25rem;
}

html,body,header,.view {
    height: 100%;
    /*cursor:pointer;*/
}

h6 {
    line-height: 1.7;
}

.login-btn {
    padding:7px 20px;
}

/*.md-form label {
    color: #ffffff;
}

.md-form .form-control {
    color:white!important;
}

.md-form input[type=text]:focus:not([readonly]),
.md-form input[type=password]:focus:not([readonly]) {
    border-bottom: 1px solid white!important;
    box-shadow: 0 1px 0 0 white!important;
}
.md-form input[type=text]:focus:not([readonly])+label,
.md-form input[type=password]:focus:not([readonly])+label {
    color: white!important;
}*/

.sn-bg-4 {
    /*background-image: url("img/sidebar_background2.png");*/
}

.pattern-9 {
    background-image: url("img/pattern-9.png");
    background-repeat: repeat;
}

.side-nav a {
    line-height: 67px;
}

/*#breadcrumb_name {
    position:absolute;
    top:-15px;
    left:15px;
    width:500px;
}

.breadcrumb-dn {
    position:relative;
}*/

/*

    media queries below are for testing to display the project name at narrower widths.
*/

@media (min-width: 900px) {
    #breadcrumb_name {
        display: block;
    }
}

@media (min-width: 900px) {
    .double-nav .breadcrumb-dn {
        display: block;
    }
}

.navbar {
    min-height: 67px;
    background-color:#333!important;
}

@media(min-width:1445px) {
    .navbar {
        padding-left:250px!important;
    }
}

.navbar .navbar-nav .nav-item .dropdown-menu a:hover {    
    background-color: #36b6b6;
}

.dropdown-submenu:hover {
    box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)!important;
    background-color:#2a75f3;
    
}

li.dropdown-item:hover {
    background-color:white!important;
}

li.dropdown-item.dropdown-submenu:hover {
    background-color:transparent!important;
}

.dropdown .dropdown-menu .dropdown-item:hover {
    /*background-color:#4285f4!important;*/
}

.dropdown-menu>.dropdown-item a:hover {
    border-radius:.125rem;
    box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%);
    color:white!important;
}