@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');

/* Generic */
html {
    background-color: #fff !important;
}

body, button, input, select, textarea {
    font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 100%;
}

.btn:active:focus, .btn:focus, :focus, button:focus, input:focus, select:focus, textarea:focus {
    outline-color: #bf0f0f;
}

.navbar.navbar-default {
    background: url(images/mrl/mrl_header.jpg) 0% 0% no-repeat;
    background-size: 1170px;
    border: none;
    height: 279px;
    margin: 0px auto;
    width: 1170px;
}

.logo-link {
    background: url(images/mrl/mrl_logo.png) 0% 0%/257px 120px no-repeat;
    height: 120px;
    margin-left: 8px;
    margin-top: 0;
    width: 257px;
}

.collapse.navbar-collapse {
    background-color: #575757;
    border-radius: 4px;
    bottom: 0px;
    height: auto !important;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    position: absolute;
    right: 0;
    -webkit-border-radius: 4px;
    width: 100%;
}

.navbar-container {
    height: 279px !important;
}

a, a:focus, a:hover {
    color: #8f0100;
    text-decoration: none;
}

ul.navbar-loaders > li {
    padding-top: 15px;
}

.navbar-nav > li {
    margin-bottom: 0px;
    padding: 0px;
}

.navbar-default .navbar-nav > li > a {
    border-radius: 0;
    font-size: 14px;
    font-weight: normal;
    padding: 15px 10px;
    text-transform: uppercase;
}

.navbar-lang {
    font-size: 14px;
    font-weight: normal;
    text-transform: uppercase;
}

.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
    background-color: transparent;
    color: #333;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background-color: #8f0100;
    margin: 0;
    -moz-transition: none;
    -o-transition: none;
    padding: 15px 10px;
    transition: none;
    -webkit-transition: none;
}

.nav-tabs > li > a {
    height: 43px;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    background-color: #8f0100;
    border-color: #8f0100;
    color: white !important;
}

.nav-tabs > li.active > a > div, .nav-tabs > li.active > a:hover > div, .nav-tabs > li.active > a:focus > div {
    border-bottom: none;
    padding: 10px 15px 6px 15px;
}

.nav-tabs > li > a:hover {
    background-color: #8f0100;
    border-color: #8f0100;
}

.nav .busy-icon-gif, .saving-icon-gif {
    background: url(images/mrl/loader-small.gif) no-repeat;
    height: 32px;
    width: 32px;
}

.navbar-right.navbar-loaders {
    float: right !important;
}

.navbar-lang {
    margin-top: 10px;
}

section.main {
    margin-top: 10px;
}

@media only screen and (max-width: 1199px) {
    .collapse.navbar-collapse {
        bottom: 29px;
    }

    .navbar.navbar-default {
        background-size: 1024px;
        height: 250px;
        width: 1024px;
    }
}

@media only screen and (max-width: 1023px) {
    .collapse.navbar-collapse {
        bottom: 73px;
    }

    .navbar.navbar-default {
        background-size: 800px;
        height: 205px;
        width: 800px;
    }
}

@media only screen and (max-width: 768px) {
    .navbar-container {
        width: 768px;
    }

    .collapse.navbar-collapse {
        bottom: 79px;
    }

    .navbar.navbar-default {
        background-size: 768px;
        height: 199px;
        width: 768px;
    }
}

@media only screen and (max-width: 667px) {
    .navbar-container {
        width: 667px;
    }

    .collapse.navbar-collapse {
        bottom: 0;
        height: auto !important;
        position: relative;
        right: 0;
        width: 100%;
        z-index: 999;
    }

    .navbar.navbar-default {
        background-size: 667px;
        border-bottom: 5px solid #8f0100;
        height: 135px;
        width: 667px;
    }

    .logo-link {
        background-size: 180px;
        height: 85px;
        margin-top: -30px;
        width: 180px;
    }

    .nav-tabs > li > a#navpagelink-namedetail > div {
        padding: 3px 2px !important;
        height: 38px;
    }

    .nav-tabs > li.active > a#navpagelink-namedetail > div {
        padding: 3px 2px !important;
        height: 34px;
    }

    .nav-tabs > li > a#navpagelink-membership > div {
        font-size: 12px;
    }

    .nav-tabs > li > a#navpagelink-reservations > div {
        font-size: 12px;
    }
}

@media only screen and (max-width: 375px) {
    .navbar-container {
        width: 375px;
    }

    .collapse.navbar-collapse {
        bottom: 0px;
    }

    .navbar.navbar-default {
        background-size: 375px;
        border-bottom: 5px solid #8f0100;
        height: 78px;
        width: 375px;
    }

    .logo-link {
        background: url(images/mrl/mrl_mobile.png) 0% 0%/45px 60px no-repeat;
        height: 60px;
        margin-top: -42px;
        width: 45px;
        margin-left: 20px;
    }

    #page-well .navbar-header {
        background-color: #8f0100;
    }

    .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
        border: 1px solid #8f0100;
    }

    .nav-tabs > li > a#navpagelink-namedetail > div {
        padding: 10px 5px !important;
    }

    .nav-tabs > li.active > a#navpagelink-namedetail > div {
        padding: 10px 5px !important;
    }

    .nav-tabs > li > a#navpagelink-membership > div {
        font-size: 15px;
    }

    .nav-tabs > li > a#navpagelink-reservations > div {
        font-size: 15px;
    }

    #contactus-page .contact-1 {
        width: 360px !important;
    }

    #contactus-page .m-btm-20 {
        width: 350px !important;
    }
}

/* Home */
.well {
    background-color: white;
}

.label.lbl-title {
    background-color: white;
    color: #333;
}

.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary.active, .btn-primary.disabled, .btn-primary[disabled] {
    background-color: #8f0100!important;
    border-color: #8f0100!important;
    outline-color: #8f0100!important;
}

.btn-info, .btn-info:focus, .btn-info.active, .btn-info.active:focus, .btn-info.active:hover, .btn-info:active.focus,
.btn-info:active:focus, .btn-info:active:hover, .btn-info.disabled, .btn-info:active, .btn-info:hover, .btn-info[disabled] {
    background-color: #8f0100;
    border: none;
    outline-color: #8f0100;
}
/* name */
.gender{
    display:none;
}

/* Splash */
#applicationHost {
    background-color: #fff;
}

#applicationHost .page-splash {
    height: 0px;
    width: 620px;
}

#applicationHost .page-splash-message.psm-main {
    background: url(images/mrl/mrl_splash.jpg) 0% 0%/360px 171px no-repeat;
    height: 171px;
    margin-top: 190px;
    width: 360px;
}

#applicationHost .page-splash-message.psm-main:after {
    content: '';
}

#applicationHost .loader-apps:before {
    color: #000;
    font-size: 40px;
    font-weight: bold;
    text-align: center;
}

#applicationHost .loader-apps {
    background: url(images/mrl/loader-64.gif) no-repeat;
    background-position: 2px 0px;
    width: 68px;
    margin-top: 20px;
}

@media only screen and (max-width: 667px) {
    #applicationHost .page-splash {
        width: 320px;
    }

    #applicationHost .page-splash-message.psm-main {
        background-size: 320px;
        height: 150px;
        margin-top: 60px;
        width: 320px;
    }
}

/* Membership */
.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
    background-color: #8f0100;
    color: #fff;
}

.nav-pills li a {
    border: 1px solid #8f0100;
}

i.info {
    margin-right: 2px;
    color: #bf0f0f;
}

.booking-member-info .lbl-info {
    background-color: transparent;
    width: 300px;
}

.booking-member-info .anniv, .booking-member-info .flag, .booking-member-info .levybal {
    display: none;
}

.tbl-cell-ptsBalance {
    display: table-cell;
}

/* Reservations */
.unit_col {
    display: none;
}

.dep_col {
    display: none;
}

/* Accounts */
table.accounts thead,
table.statement thead,
table.transactions thead {
    background-color: #8f0100;
}

table.accounts .th-stat, table.accounts .td-stat {
    display: none;
}

/* Contact */
#contactus-page sup {
    font-size: 85%;
    line-height: 0;
    position: relative;
    top: -.3em;
    vertical-align: baseline;
}

#contactus-page .contact-1 {
    height: 380px;
    width: 650px;
}

#contactus-page .contact-2 {
    display: none;
}

#contactus-page .col-sm-6 {
    width: 180px;
}

#contactus-page .m-btm-20 {
    width: 380px;
}
.lbl-notice{
    margin-left: 30px;
    display:block
}

/* Modals */
#attempt-login {
    margin-left: -44px;
}

.login-page .reg {
    display: none;
}

.login-page .pass {
    display: inline-block;
}

.login-modal {
    background-color: #efefef;
}

.login-btn-grp > div > button {
    background-color: #575757;
    color: #fff;
}

.page-login-message {
    background: url(../../images/mrl/mrl_logo.png) no-repeat;
    background-position-x: 0px;
    border-radius: 4px;
    height: 128px;
    margin-bottom: 10px;
    width: 270px;
}

.btn-success, .btn-success:active, .btn-success:focus, .btn-success:active:focus, .btn-success:hover {
    background-color: #edebeb;
    border-color: #edebeb;
    color: #fff;
    color: black;
}

.modal-message > .modal-content > .modal-footer,
.modal-message > .modal-content > .modal-header {
    background-color: #8f0100;
}

.bookingStatusId-edit {
    display: none;
}

.bookingStatusId-view {
    display: block!important;
}

.login-page .pass {
    display: block;
    margin-right: 0;
}

.login-page .pass > button {
    margin-left: 0;
}


/* Footer */
#footer {
    background: none;
    border-top: 0;
    font-size: 16px;
    padding: 0;
    text-align: center;
}

#footer div.footer-inner {
    background-color: #575757;
    border-radius: 4px;
    margin: 0 auto;
    max-width: 1170px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    padding: 5px 0;
    -webkit-border-radius: 4px;
}