/* Body */

/* FONTS */
@font-face {
    font-family: 'Gilroy - Black';
    src: url('/assets/css/fonts/Gilroy/Gilroy-Black.ttf');
}

@font-face {
    font-family: 'Gilroy - BlackItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-BlackItalic.ttf');
}

@font-face {
    font-family: 'Gilroy - Bold';
    src: url('/assets/css/fonts/Gilroy/Gilroy-Bold.ttf');
}

@font-face {
    font-family: 'Gilroy - BoldItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-BoldItalic.ttf');
}

@font-face {
    font-family: 'Gilroy - ExtraBold';
    src: url('/assets/css/fonts/Gilroy/Gilroy-ExtraBold.ttf');
}

@font-face {
    font-family: 'Gilroy - ExtraBoldItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-ExtraBoldItalic.ttf');
}

@font-face {
    font-family: 'Gilroy - Heavy';
    src: url('/assets/css/fonts/Gilroy/Gilroy-Heavy.ttf');
}

@font-face {
    font-family: 'Gilroy - HeavyItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-HeavyItalic.ttf');
}

@font-face {
    font-family: 'Gilroy - Light';
    src: url('/assets/css/fonts/Gilroy/Gilroy-Light.ttf');
}

@font-face {
    font-family: 'Gilroy - LightItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-LightItalic.ttf');
}

@font-face {
    font-family: 'Gilroy - Medium';
    src: url('/assets/css/fonts/Gilroy/Gilroy-Medium.ttf');
}

@font-face {
    font-family: 'Gilroy - MediumItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-MediumItalic.ttf');
}

@font-face {
    font-family: 'Gilroy - Regular';
    src: url('/assets/css/fonts/Gilroy/Gilroy-Regular.ttf');
}

@font-face {
    font-family: 'Gilroy - RegularItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-RegularItalic.ttf');
}

@font-face {
    font-family: 'Gilroy - SemiBold';
    src: url('/assets/css/fonts/Gilroy/Gilroy-SemiBold.ttf');
}

@font-face {
    font-family: 'Gilroy - SemiBoldItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-SemiBoldItalic.ttf');
}

@font-face {
    font-family: 'Gilroy - Thin';
    src: url('/assets/css/fonts/Gilroy/Gilroy-Thin.ttf');
}

@font-face {
    font-family: 'Gilroy - ThinItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-ThinItalic.ttf');
}

@font-face {
    font-family: 'Gilroy - UltraLightItalic';
    src: url('/assets/css/fonts/Gilroy/Gilroy-UltraLightItalic.ttf');
}

body,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Gilroy - Regular';
    text-transform: none;
}

h1 {
    font-size: 37px;
}

h2 {
    font-size: 26px;
}

h3 {
    font-size: 21px;
}

.red-skin a:hover,
.red-skin .active {
    color: #ff224b !important;
}

[data-overlay]:before {
    background: #fff;
}

label.error,
span.error-block-span,
span.success-block-span {
    color: #ffffff;
    font-family: "Gilroy - Bold";
    font-size: 16px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: -0.25px;
    text-align: left;
    margin-left: 8px;
    margin-bottom: 0;
}

span.error-block-span.pink {
    color: #ff2850 !important;
    margin: 0;
}

span.success-block-span {
    color: #00b265 !important;
    margin: 0;
}

.alert-success {
    border: 2px solid;
}

.alert-danger {
    border: 2px solid;
}

.pagination>li>a:hover,
.pagination>li>a:hover,
.pagination>li>span:hover {
    background-color: #ff2850;
    color: #fff !important;
}

.pagination li:last-child a,
.pagination li:last-child a:hover,
.pagination>li:last-child>span:hover {
    background: #35434e;
    border: 1px solid #35434e;
    border-radius: 50% !important;
    color: #fff;
}

.pagination>.current_page_active>span {
    border-color: #ff2850;
    background-color: #ff2850;
    background: #ff2850;
    z-index: 2;
    color: #ffffff;
    cursor: default;
}

.preloader.ajax {
    background-color: transparent;
    position: relative;
    height: unset;
    z-index: 99;
    background-image: url("../../img/loader.svg");
    background-position: center center;
    background-repeat: no-repeat;
    left: 0px;
    top: 0px;
    width: 100%;
}

.dash_action_link a.cancel {
    color: #ff2850 !important;
    border-radius: 3px;
    border: 1px solid transparent;
}

.dash_action_link a.view {
    color: #00b265 !important;
    border-radius: 3px;
    border: 1px solid transparent;
}

.dash_action_link a:hover {
    border: 1px solid;
}

.dash_action_link a.view:hover {
    border: 1px solid;
    color: #00b265 !important;
}

/* input.select2-search__field {
    width: 100% !important;
} */

/* .select2-selection--multiple .select2-search--inline .select2-search__field {
    width: auto !important;
} */

/* Header */

.header.header-fixed {
    position: sticky !important;
}

.navigation {
    font-family: 'Poppins' !important;
    font-size: 16px;
}

.nav-menu.nav-menu-social>li.login_click.light a {
    color: #ff224b !important;
}

.nav-menu>li:first-child {
    margin-left: 80px;
}

.nav-brand,
.nav-brand:focus,
.nav-brand:hover,
.nav-menu>li>a {
    color: #131b31;
    letter-spacing: -0.22px;
}

.nav-menu>.active>a,
.nav-menu>.focus>a,
.nav-menu>li:hover>a {
    color: #ff224b !important;
}

.header.homepage.logged_in .nav-brand {
    padding: 15px 0;
    font-size: 32px;
    margin-right: 0;
}

.header.homepage:not(.logged_in) .nav-brand {
    padding: 15px 15px;
    font-size: 32px;
    margin-right: 0;
}

.header:not(.homepage).logged_in .nav-brand {
    padding: 15px 15px;
    font-size: 32px;
    margin-right: 40px;
}

.nav-brand img {
    max-width: unset;
    top: 0;
}

.nav-brand p {
    display: inline-block;
    font-weight: 700;
    font-style: normal;
    line-height: normal;
    text-align: left;
    margin: 0;
}

.nav-brand p.logo_esc {
    color: #131b31;
    letter-spacing: -0.59px;
}

.nav-brand p.logo_ola {
    color: #ff2850;
    letter-spacing: normal;
}

.submenu-indicator {
    margin-top: 4px;
}

.nav-menu.nav-menu-social>li.login_click a {
    color: #ff2850;
    font-family: Poppins;
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: -0.22px;
    line-height: normal;
    text-align: center;
    padding: 21px 15px;
}

.nav-menu.nav-menu-social>li.login_click {
    background-color: #ff2850;
}

.nav-menu.nav-menu-social>li.login_click.light {
    border: 1px solid #ff2850 !important;
}

.nav-menu.nav-menu-social>li.login_click.light:hover,
.nav-menu.nav-menu-social>li.login_click.light:focus {
    background: #ff2850;
    border-color: #ff2850 !important;
}

.nav-menu.nav-menu-social>li.language_button>a,
.navigation-portrait .nav-menu.nav-menu-social>li.language_button>a {
    padding: 30px 0;
}

.nav-menu.nav-menu-social>li.language_button>a,
.nav-menu.nav-menu-social>li.language_slash>a {
    opacity: 0.2;
    color: #131b31 !important;
    font-family: "Gilroy - Bold";
    font-size: 16px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: -0.22px;
    line-height: normal;
    text-align: left;
    text-transform: uppercase;
}

.navigation-portrait .nav-menu.nav-menu-social>li.language_button>a,
.navigation-portrait .nav-menu.nav-menu-social>li.language_slash>a {
    color: #fff !important;
}

.nav-menu.nav-menu-social>li.language_slash,
.navigation-portrait .nav-menu.nav-menu-social>li.language_slash {
    pointer-events: none;
}

.navigation-portrait .nav-menu.nav-menu-social>li.language_slash>a {
    padding: 29px 0;
}

.nav-menu.nav-menu-social>li.language_button.active>a,
.nav-menu.nav-menu-social>li.language_slash>a {
    opacity: 1;
}

.navigation-portrait .nav-menu.nav-menu-social>li.user_avatar:first-child {
    margin-left: 5px;
}

.navigation-portrait .nav-menu.nav-menu-social>li:not(.user_avatar):first-child {
    margin-left: 20px;
}

/* Backoffice nav-bar */

.nav-menu .user_avatar a {
    padding: 20px 12px;
}

.nav-menu .user_avatar a img {
    border-radius: 50%;
    margin-right: 10px;
}

.nav-menu .user_avatar a img:not(.logo) {
    width: 42px;
    height: 42px;
}

.nav-menu .user_avatar a .top_nav_bar_avatar {
    border-radius: 50%;
    margin-right: 10px;
    width: 42px;
    height: 42px;
    background-size: 100%;
    vertical-align: middle;
    display: inline-block;
    background-repeat: no-repeat;
}

.nav-menu .user_notifications a {
    padding: 28px 8px !important;
}

.nav-menu .user_notifications .notifications-count {
    background-color: #ff2850;
    color: #fff;
    border-radius: 12px;
    font-weight: 500;
    position: absolute;
    top: 24px;
    right: 4px;
    padding: 2px 4px;
    vertical-align: middle;
    font-size: 0.60rem;
    line-height: 1;
}

/* Backoffice mobile side-navbar */
.navigation-portrait .nav-menu.nav-menu-social:nth-child(2) {
    margin-top: 24px;
}

.navigation-portrait .nav-menu .user_avatar a {
    padding: 20px 8px !important;
}

.navigation-portrait .nav-menu .user_avatar a.msg-title {
    padding: 8px 15px !important;
}

.navigation-portrait .nav-menu.nav-menu-social>li {
    margin-left: 10px;
}

.navigation-portrait .nav-menu .user_avatar .message-box {
    left: 60px !important;
}

.navigation-portrait .message-box .msg-box-content {
    max-height: 40vh !important;
}

/* Footer */
.dark-footer .footer-widget {
    padding: 0;
}

.dark-footer p,
.dark-footer a {
    color: #858c9f;
    font-family: Poppins;
    font-weight: 400;
    font-style: normal;
    letter-spacing: -0.25px;
    line-height: normal;
    text-align: left;
}

.dark-footer p {
    font-size: 14px;
    margin-bottom: 15px;
}

.dark-footer a {
    font-size: 16px;
    margin-bottom: 9px;
}

.dark-footer .supported_label {
    color: #ffffff;
    margin-bottom: 10px;
}

.dark-footer h4 {
    color: #ffffff;
    font-family: "Gilroy - Bold";
    font-size: 22px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: -0.35px;
    line-height: 40px;
    text-align: left;
}

.dark-footer .footer-bottom p {
    color: #ffffff;
    font-family: "Gilroy - Bold";
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: -0.22px;
    line-height: 40px;
    text-align: left;
}

.dark-footer .footer-bottom a {
    color: #ffffff;
    transition: all ease 0.4s;
    font-family: "Gilroy - Bold";
    font-weight: 700;
    font-style: normal;
    letter-spacing: -0.22px;
    line-height: 40px;
    text-align: left;
}



/* CSS TEST */

.top-head {
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    background: #FFFFFF;
    width: 100%;
    float: left;
    height: 50px;
}

.top-head h1 {
    color: #fff;
    font-size: 26px;
    font-weight: 600;
    line-height: 50px;
    margin-bottom: 0px;
}

.top-menu-right {
    float: right;
}

.top-head .user-bar {
    text-align: right;
    float: right;
}

.top-head .user-bar a {
    color: rgba(0, 0, 0, .7);
    font-size: 15px;
    font-weight: 400;
    line-height: 49px;
    position: relative;
    padding: 0 7px;
}

.top-head .user-bar a:hover {
    color: #02b875;
}

.top-head .user-bar a i {
    margin-right: 6px;
}

.top-head .user-bar .ping {
    background: #02b875;
    border-radius: 50%;
    height: 10px;
    position: absolute;
    right: 9px;
    top: 13px;
    width: 10px;
    z-index: 1;
}

.top-head .user-bar img {
    float: left;
    height: 32px;
    width: 32px;
    margin-top: 9px;
}


/* DROPDOWN MENU */

.dropbtn {
    color: rgba(0, 0, 0, .7);
    padding: 13px 7px;
    font-size: 15px;
    border: none;
    margin-top: 0px;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #fff;
    min-width: 180px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 999;
    float: left;
    text-align: left;
}

.dropdown-content a {
    text-decoration: none;
    display: block;
    padding: 10px 25px 10px 15px !important;
    line-height: 1.42857 !important;
}

.dropdown-content a:hover {
    color: #02b875;
    text-decoration: none;
    background-color: #f1f1f1;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #fff;
    color: #02b875;
}

.dropdown-divider {
    height: 0;
    margin: 0px;
    overflow: hidden;
    border-top: 1px solid #e9ecef;
}

.dropdown-menu-arrow {
    display: none;
    bottom: 26px;
    left: 24px;
    position: absolute;
    z-index: 1002;
}

.user_avatar .dropdown-menu-arrow {
    left: 110px;
}

.dropdown-menu-arrow:before,
.dropdown-menu-arrow:after {
    content: "";
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-width: 11px 12px;
    border-style: solid;
    border-color: transparent;
    z-index: 1001;
}

.dropdown-menu-arrow:after {
    bottom: -18px;
    right: -8px;
    border-bottom-color: #fff;
}

.dropdown-menu-arrow:before {
    bottom: -16px;
    right: -8px;
    border-bottom-color: rgba(0, 0, 0, .15);
}


/* ========== Navigation Start ========== */

.account-name {
    font-weight: 600;
}


/* NOTIFICATION */

.notification {
    color: rgba(0, 0, 0, .7) !important;
    font-size: 17px !important;
}

.notification:hover,
.messages:hover {
    color: #183247;
}

.notification-imp {
    font-weight: 600;
    color: #1d2129;
}

/* .messages {
    color: rgba(0, 0, 0, .7) !important;
    font-size: 17px !important;
    margin-left: -5px !important;
} */

.nav-link {
    font-weight: unset;
}

/* Message DropBox*/

.message-box {
    background-color: #fff;
    padding-bottom: 0px;
    border-radius: 6px;
    border: 2px solid #e2e2e2 !important;
    position: absolute !important;
    margin-top: 0 !important;
    top: -10px !important;
    z-index: 1001;
    margin-left: -475%;
    width: 200px;
}

.message-box.notifications {
    min-width: 250px !important;
}

.user_avatar .message-box {
    margin-left: -30%;
    padding: 0;

}


/* Message Heading */

.message-box .msg-title {
    border-bottom: 2px solid #e2e2e2;
    padding: 0px 15px 8px 15px;
    color: #131b31;
    font-family: "Gilroy - Bold";
    font-size: 16px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: -0.25px;
    line-height: normal;
    text-align: left;
}

.user_avatar .message-box .msg-title {
    padding: 8px 15px 8px 15px;
    border-bottom: unset;
}

.logout_icon {
    border-radius: 0 !important;
}

a.view_profile {}

/* Message Notification */

.messages-noti {
    font-weight: 600;
}


/* Message Content */

.message-box .msg-box-content {
    /* min-height: 380px; */
    max-height: 50vh;
    overflow-y: scroll;
    z-index: 1001;
}

.message-box .msg-box-content a,
.message-box .msg-box-content p {
    display: block;
    padding: 10px 10px 18px 10px;
    /* border-bottom: 2px solid #e2e2e2; */
    color: #131b31;
    font-family: "Gilroy - Medium";
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    letter-spacing: -0.22px;
    line-height: 19px;
    text-align: left;
    padding: 20px 12px 0px 12px !important;
}

.message-box .msg-box-content a.unread {
    font-family: "Gilroy - Bold";
}

.message-box .msg-box-content p:not(.time) {
    margin: 0 !important;
    padding: 10px !important;
    font-family: "Gilroy - Bold";
}

.message-box .msg-box-content p.time {
    padding: 0 12px 5px 12px !important;
    margin: 0;
}

/* .message-box .msg-box-content a:hover {
    color: rgb(0, 0, 0, .7);
    background-color: #fafafa;
    text-decoration: none;
} */

.message-box .msg-box-content .pd-l0 {
    padding-left: 0px;
}


/* Message box scroller hides */

.message-box .msg-box-content::-webkit-scrollbar,
.message-box .msg-box-content::-webkit-scrollbar-thumb {
    display: none;
}

/* .message-box .msg-box-content p {
    font-size: 13px;
    color: #1d2129;
    font-weight: normal;
    margin: 1px 0px 8px 0px;
} */

.message-box .msg-box-content p.time,
.notification_time_ago {
    position: relative;
    display: inline-block;
    margin-top: 14px;
    margin-right: 0px;
    opacity: 0.5;
    color: #131b31;
    font-family: "Gilroy - Medium";
    font-size: 10px;
    font-weight: 500;
    font-style: normal;
    letter-spacing: -0.16px;
    line-height: 19px;
    text-align: left;
}

.dropdown.show .dropdown-menu-arrow {
    display: block;
}

textarea.form-control {
    height: auto;

    color: #131b31;
    font-family: "Gilroy - Medium";
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    letter-spacing: -0.25px;
    line-height: normal;
    text-align: left;
}

/* 
    ToolTips
*/

.tooltip-inner,
.ui-tooltip-content {
    background-color: #131b31;
    color: #ffffff;
    font-family: "Gilroy - Medium";
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    letter-spacing: -0.19px;
    line-height: 14px;
    text-align: left;
    padding: 15px;
    max-width: 100%;
    /* margin: auto; */
}

.tooltip.bs-tooltip-auto[x-placement^=top],
.tooltip.bs-tooltip-top {
    top: -5px !important;
}

.tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before,
.tooltip.bs-tooltip-top .arrow::before {
    border-top-color: #131b31;
    margin-left: -7px;
    border-width: 8px 10px 0px 10px;
    /* bottom: 3px; */
}

.tooltip.bs-tooltip-auto[x-placement^=top] .arrow,
.tooltip.bs-tooltip-top .arrow {
    border-top-color: #131b31;
    /* bottom: 3px; */
}

/* .tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
} */

/* Tooltip text */
.info_tooltip+.info_tooltip_text {
    visibility: hidden;
    width: 120px;
    bottom: 100%;
    left: 50%;
    margin-left: -60px;
    /* Use half of the width (120/2 = 60), to center the tooltip */
    background-color: black;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;

    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.info_tooltip:hover+.info_tooltip_text {
    visibility: visible;
}

#performance_graph_placeholder {
    height: 600px;
    background-size: 50% !important;
    background-position: center !important;
    background-color: white !important;
    padding: 0px;
    /* background: no-repeat; */
    position: relative;
}

.low_z_index .select2.select2-container.select2-container--default {
    z-index: 1 !important;
}

.flot-x-axis.flot-x1-axis.xAxis.x1Axis {
    color: transparent !important;
}

.link_on_chart {
    color: #ff2850 !important;
}