/**
*    Import fonts
*/
@font-face {
    font-family: 'RobotoCondensed-Bold'; 
    src: url(../fonts/RobotoCondensed-Bold.ttf);
}

@font-face {
    font-family: 'RobotoCondensed-Italic';
    src: url(../fonts/RobotoCondensed-Italic.ttf);
}

@font-face {
    font-family: 'RobotoCondensed-Light';
    src: url(../fonts/RobotoCondensed-Light.ttf);
}
@font-face {
    font-family: 'RobotoCondensed-Regular';
    src: url(../fonts/RobotoCondensed-Regular.ttf);
}
@font-face {
    font-family: 'RobotoCondensed-SemiBold';
    src: url(../fonts/RobotoCondensed-SemiBold.ttf);
}

/***
 *   Define color
*/

:root {
    --backgrund-black: #000;
    --backgrund-light: #333333;
    --text-breadcrumbs-color: #bdbdbd;
    --red: #C4253B;
}
.color-breadcrumbs {
   color:#bdbdbd!important;
}

body {
    font-family: 'RobotoCondensed-SemiBold';
    font-size: 17px;
}
.top-menu {
 min-height:110px;
}
.background-light {
    background-color: var(--backgrund-light);
}
.burger-icon {
  display:none;
}
.logo-img {
    min-width: 250px;
}
.menu-list a {
    font-family: RobotoCondensed-SemiBold!important;
    font-size: 17px!important;
    color:white!important;
}

    .menu-list a:hover {
        text-decoration:none!important;
        color: #ff4800 !important;
    }
.menu-sub-list a {
    font-family: RobotoCondensed-SemiBold !important;
    font-size: 17px !important;
    color: white !important;
}

    .menu-sub-list a:hover {
        text-decoration: none !important;
        color: #ff4800 !important;
    }
.icon-user-menu button span, .account-total, .user-name-menu {
    font-family: RobotoCondensed-SemiBold !important;
    font-size: 17px !important;
    color: white !important;
}
.menu-btns div.mud-chip {
    font-family: RobotoCondensed-SemiBold !important;
    font-size: 17px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.menu-btns div.mud-chip span{    
    color: white !important;
}
.main-breadcrumbs li a {
    font-family: RobotoCondensed-Regular !important;
    font-size: 17px !important;
    color: var(--text-breadcrumbs-color) !important;
}
.main-breadcrumbs li a:hover {
    cursor:pointer;
}
.left-sidebar {
    background-color: #e5e5e5 !important;
}
.top-menu {
    max-height: 110px;
    min-height: 110px;
    background-color: #333333;
}
.bg-nav-link {
    background-color: #e5e5e5;
}

.header a.mud-nav-link, .sub-header button.mud-nav-link {
    cursor: default;
    padding: 10px 30px !important;
    background-color: #660706 !important;
    color: white !important;
    font-family: RobotoCondensed-Regular;
    font-size: 17px !important;
    line-height: 20px;
}
a.link-menu {
    text-transform: capitalize !important;
    text-decoration: none !important;
    font-family: 'RobotoCondensed-SemiBold';
    font-size: 17px;
    color: #333333 !important;
}
.sub-header button.mud-nav-link svg {
    fill:white!important;
}
.sidebar-item a div, .sidebar-item div div.mud-nav-link-text {
    cursor: pointer;
    padding: 10px 30px !important;
    color: #333333 !important;
    font-family: RobotoCondensed-Bold;
    font-size: 17px !important;
    line-height: 20px;
}

@media screen and (max-width: 1548px) {
    .menu-list a {
        font-size: 17px !important;
    }
    menu-btns div.mud-chip {
        font-size: 17px !important;
    }
}

@media screen and (max-width: 1346px) {
    .menu-list {
        width:40%;
        flex-flow: column wrap;
        max-height: 100px;
        margin-left:5px!important;
    }
}
@media screen and (max-width: 1043px) {
    .menu-list a {
        font-size: 15px !important;
    }
    .menu-btns div.mud-chip {
        font-size: 15px !important;
    }
    .menu-sub-list a {
        font-size: 15px!important;
    }
    .icon-user-menu button span, .user-name-menu {
        font-size: 15px !important;
    }
}
@media screen and (max-width: 972px) {
    .menu-list {
        flex-flow: column wrap;
        max-height: 125px;
        margin-top: 5px;
        padding-bottom: 5px;
        width: 30%;
    }
    .menu-list a {
        font-size: 13px !important;
    }
    .menu-sub-list a {
        font-size: 13px !important;
    }
}
@media screen and (max-width: 870px) {
    .menu-list, .sub-list-menu {
        display: none !important;
    }
    .burger-icon {
        display: inline-block;
    }
    div.menu-logo .mud-chip.mud-chip-size-large,
    div.close-option .mud-chip.mud-chip-size-large {
        font-size: 2.5rem !important;
        height: auto !important;
    }
    div.close-option .mud-chip.mud-chip-size-large {        
        background-color: #333333;
    }
}
@media screen and (max-width: 870px) {
    img.logo-img {
      min-width:150px!important;
    }
}
@media screen and (max-width: 563px) {
    img.logo-img {
        min-width: 150px !important;
    }
    .currency-balance {
       display:none;
    }
   
}
@media screen and (max-width: 487px) {
    .user-name-menu {
        display: none;
    }
    .mud-popover.mud-popover-open {
        min-width: 115px;
        max-width: 115px;
        right: 15px !important;
        left: auto !important;
        background-color: #e5e5e5 !important;
    }
}
@media screen and (max-width: 450px) {
    .menu-btns div.mud-chip {
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin-left:0px!important;
        margin-right:0px!important;
    }
}
@media screen and (max-width: 405px) {
    img.logo-img {
        margin: 0.1rem !important;
    }
}
@media screen and (max-width: 378px) {
    img.logo-img {
        min-width: 150px !important;
        max-width: 150px !important;       
    }
}
@media screen and (max-width: 318px) {
    img.logo-img {
        min-width: 115px !important;
        max-width: 115px !important;
        margin: 0.1rem !important;
    }
}
@media screen and (max-width: 298px) {
    img.logo-img {
        display:none;
    }
}
/***
    Pages
*/
.pages {
  min-height:80vh;
}
.page-title {
    font-family: RobotoCondensed-Bold !important;
    font-size: 21px !important;
    color: var(--backgrund-black);
}
.page-message {
    font-family: RobotoCondensed-Regular !important;
    font-size: 19px !important;
    color: var(--backgrund-light);
}
.btn-site {
    font-family: RobotoCondensed-Regular !important;
    font-size: 19px !important;
    text-transform:uppercase;
    color: white;
    background-color:var(--red);
}