﻿html {
    position: relative;
    min-height: 100%;
}

footer {
    position: absolute;
    /*bottom: 0;*/
    width: 100%;
    height: 80px;
    padding: 10px;
}

    footer p {
        margin: 0;
        text-align: right;
    }

a {
    color: #3a3b3b;
}

    a:hover {
        color: #3a3b3b;
    }

hr {
    margin-top: 15px;
    margin-bottom: 15px;
}

.body-content {
    padding: 0;
}

.qStandardBtn {
    background-color: #3a3b3b;
    color: #dadada;
    border: none;
    height: auto;
    width: 100%;
    padding: 10px 0;
}


    .open > .dropdown-toggle.qStandardBtn,
    .qStandardBtn:active,
    .qStandardBtn.active,
    .qStandardBtn:hover,
    .qStandardBtn:active:hover,
    .qStandardBtn.active:hover,
    .open > .dropdown-toggle.qStandardBtn:hover,
    .qStandardBtn:active:focus,
    .qStandardBtn.active:focus,
    .open > .dropdown-toggle.qStandardBtn:focus,
    .qStandardBtn:active.focus,
    .qStandardBtn.active.focus,
    .open > .dropdown-toggle.qStandardBtn.focus {
        background-color: #616161;
        color: #dadada;
        -webkit-box-shadow: inset 0 3px 5px #616161;
        box-shadow: inset 0 3px 5px #616161;
    }

    .qStandardBtn.disabled,
    .qStandardBtn.disabled.active,
    .qStandardBtn.disabled.focus,
    .qStandardBtn.disabled:active,
    .qStandardBtn.disabled:focus,
    .qStandardBtn.disabled:hover,
    .qStandardBtn[disabled],
    .qStandardBtn[disabled].active,
    .qStandardBtn[disabled].focus,
    .qStandardBtn[disabled]:active,
    .qStandardBtn[disabled]:focus,
    .qStandardBtn[disabled]:hover,
    fieldset[disabled] .qStandardBtn,
    fieldset[disabled] .qStandardBtn.active,
    fieldset[disabled] .qStandardBtn.focus,
    fieldset[disabled] .qStandardBtn:active,
    fieldset[disabled] .qStandardBtn:focus,
    fieldset[disabled] .qStandardBtn:hover {
        background-color: #616161;
        color: white;
        opacity: unset;
        box-shadow: none;
    }

.qStandardTile {
    background-color: #ff770d;
    width: 100%;
    min-height: 200px;
    border: none;
    border-radius: 0;
    padding: 20px;
    color: #ffffff;
    text-align: left;
    white-space: normal;
}

div.qStandardTile:hover, div.qStandardTile {
    background-color: #bdc3c7;
}

.open > .dropdown-toggle.qStandardTile,
.qStandardTile:active,
.qStandardTile.active,
.qStandardTile:hover,
.qStandardTile:active:hover,
.qStandardTile.active:hover,
.open > .dropdown-toggle.qStandardTile:hover,
.qStandardTile:active:focus,
.qStandardTile.active:focus,
.open > .dropdown-toggle.qStandardTile:focus,
.qStandardTile:active.focus,
.qStandardTile.active.focus,
.open > .dropdown-toggle.qStandardTile.focus {
    background-color: #FF994A;
    color: #ffffff;
    -webkit-box-shadow: inset 0 3px 5px #FF994A;
    box-shadow: inset 0 3px 5px #FF994A;
}

.qStandardTile a {
    color: #ffffff;
    font-size: 36pt;
    font-weight: bold;
    background-color: transparent;
    vertical-align: middle;
}

.qStandardTable tr th, .qStandardTable tr td {
    vertical-align: middle !important;
    height: 50px;
    width: 25%;
}

    .qStandardTable tr th:first-child {
        border-radius: 10px 0 0 10px;
    }

    .qStandardTable tr th:last-child {
        border-radius: 0 10px 10px 0;
    }

    .qStandardTable tr th:only-child {
        border-radius: 10px 10px 10px 10px;
    }

.qStandardTable tr th {
    background-color: #ff770d;
    border-top: none !important;
    color: #FFF3E9;
}

    .qStandardTable tr th:hover {
        background-color: #ff770d;
    }

.qStandardTable td {
    border-top: none !important;
    border-bottom: 1px solid #ddd;
}

.qStudentTable tr td:last-child {
    text-align: center;
}

.qResponsiveTable {
    border: none !important;
}

#login-tab {
    background-image: url(../images/booksBackground.jpg);
    background-size: cover;
    padding-top: 10%;
    padding-bottom: 5%;
}

#forgotPasswordContainer {
    text-align: center;
}

.loginCaption {
    margin-bottom: 30px;
}

.login-wrapper {
    color: #fff3e9;
}

    .login-wrapper .row:nth-child(2n) {
        margin-top: 15%;
    }

.loginForm {
    margin-top: 20px;
    margin-bottom: 20px;
}

    .loginForm .qLogin-input {
        background-color: #ff994a;
        border: none;
        height: 45px;
    }

    .loginForm select.qLogin-input option {
        background-color: #fff3e9;
    }

    .loginForm input.qLogin-input:-webkit-autofill {
        -webkit-box-shadow: 0 0 0px 1000px #ff994a inset;
        background-color: #FF994A !important;
        color: #555 !important;
    }

    .loginForm ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

    .loginForm .text-danger {
        margin-bottom: 2%;
        font-size: 14px;
        color: #fff3e9;
    }

.form-group {
    margin-top: 15px;
}

.login-box {
    background-color: #ff770d;
    border-radius: 10px;
}

#register-box, .demo-register-box {
    background-color: #ff770d;
    min-height: 270px;
    display: -webkit-flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 10px;
}

    #register-box .loginForm, .demo-register-box .loginForm {
        width: 100%;
    }

#register-tab > div, .demo-register-tab > div {
    margin-bottom: 20px;
    margin-top: 20px;
}

/*::-webkit-input-placeholder {*/ /* Chrome */
/*color: #fde2cc !important;
}

:-ms-input-placeholder {*/ /* IE 10+ */
/*color: #fde2cc !important;
}

::-moz-placeholder {*/ /* Firefox 19+ */
/*color: #fde2cc !important;
}

:-moz-placeholder {*/ /* Firefox 4 - 18 */
/*color: #fde2cc !important;
}*/

#info-tab {
    padding-top: 5%;
}

    #info-tab h1 {
        margin-bottom: 40px;
    }

    #info-tab hr {
        margin-top: 40px;
    }

    #info-tab ul {
        margin-top: 20px;
        margin-bottom: 20px;
    }

#headerGridSm {
    display: none;
}

#loggedIn-header {
    /*background-color: #3A3B3B;*/
    background-image: url(../images/booksBackground.jpg);
    min-height: 150px;
    color: #ffffff;
    padding: 20px;
}

    #loggedIn-header h2 {
        vertical-align: bottom;
    }

#back-wrapper {
    margin-top: 10px;
    margin-bottom: 10px;
}

#backArrow:hover {
    text-decoration: none;
}

.marginRow {
    margin-top: 20px;
}

.control-label {
    color: #FFF3E9;
    font-weight: normal;
}

.nonPaddingCols {
    padding: 10px 0 10px 0;
}

@media (min-width: 768px) {
    .qStandardTile {
        border-radius: 4px;
    }

    #loggedIn-header {
        border-radius: 4px;
        margin-top: 5%;
    }



    #register-box, .demo-register-box {
        border-radius: 4px;
        /*min-height:350px;*/
    }

    #register-tab > div, .demo-register-tab > div {
        padding: 0;
    }

    #myAccountBack {
        float: left;
    }

    .nonPaddingCols {
        margin: 0;
    }

    .marginRow .nonPaddingCols:first-child {
        float: right;
    }

    .marginRow .nonPaddingCols:last-child {
        float: left;
    }
}

@media (max-width: 765px) {
    .topMargin {
        margin-top: 15px;
    }
}

@media (min-width: 992px) {

    #register-box, .demo-register-box {
        margin-top: 0;
    }

    .qStandardTile {
        min-height: 270px;
    }


    #loggedIn-header {
        min-height: 250px;
        margin-top: 0;
    }

    #headerGridLg {
        padding-left: 45px;
    }

    #headerGridSm {
        display: unset;
    }

    #content-wrapper {
        height: 100%;
    }

    #login-content {
        height: 100%;
    }

    #info-tab {
        min-height: 100%;
    }

    footer {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: -1;
    }
}

/* 
    Override the default bootstrap behavior where horizontal description lists 
    will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}


.pagination > .active > a {
    background-color: rgb(255, 119, 13);
    border-color: rgb(255, 119, 13);
}

/*.col-xs-offset-right-1 {
    margin-right: 8.33333333%;
}*/

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}


/* 
    Override standard DevExpress menu settings
*/

.dxbl-menu-title {
    color: darkorange !important;
    padding-left: 0px !important;
    /*white-space: normal !important;*/
}

.dxbl-menu-item {
    color: darkorange !important;
}

    .dxbl-menu-item .dx-icon {
        color: darkorange !important;
    }

.dxbl-menu-hamburger {
    color: darkorange !important;
}

dxbl-menu > div > div.dropdown-menu {
    right: 0px !important;
    width: fit-content !important;
}


/* 
    Set styles for typical dialogs (list of collectors, one collector, etc.)
*/

.q-title {
    color: darkorange;
    font-size: larger;
    font-weight: bold;
}

.q-title-subtext {
    font-size: smaller;
}

.q-title-decent-body {
    color: darkgray;
    font-size: smaller;
    font-style: italic;
}

.q-section {
    color: darkorange;
}

.q-label {
    font-size: smaller;
    font-style: normal;
}

.q-hintheader {
    color: darkorange !important;
    font-style: italic;
}

.q-hinttext {
    font-size: smaller;
    font-style: italic;
    color: dimgray;
}

.question-mark {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: darkorange;
    color: white;
    text-align: center;
    font-size: 10px;
    font-weight: bold;
    line-height: 13px;
    margin-left: 2px;
    cursor: pointer;
}

.q-errorpopup-technical {
    font-size: smaller;
    font-style: italic;
    color: darkgray;
}
