/* Lib: Flag icon */
@import url('../../../../vendor/components/flag-icon-css/css/flag-icon.min.css');

:root {
    --portlet-bg-color-hover: #356c9c;
}


/*padding & margin*/


/*padding*/

.padding-0 {
    padding: 0px !important;
}

.padding-5 {
    padding: 5px !important;
}

.padding-10 {
    padding: 10px !important;
}

.padding-15 {
    padding: 15px !important;
}

.padding-20 {
    padding: 20px !important;
}

.padding-25 {
    padding: 25px !important;
}

.padding-30 {
    padding: 30px !important;
}

.padding-35 {
    padding: 35px !important;
}

.padding-40 {
    padding: 40px !important;
}

.padding-45 {
    padding: 45px !important;
}

.padding-50 {
    padding: 50px !important;
}


/*padding top*/

.padding-top-0 {
    padding-top: 0px !important;
}

.padding-top-5 {
    padding-top: 5px !important;
}

.padding-top-10 {
    padding-top: 10px !important;
}

.padding-top-15 {
    padding-top: 15px !important;
}

.padding-top-20 {
    padding-top: 20px !important;
}

.padding-top-25 {
    padding-top: 25px !important;
}

.padding-top-30 {
    padding-top: 30px !important;
}

.padding-top-35 {
    padding-top: 35px !important;
}

.padding-top-40 {
    padding-top: 40px !important;
}

.padding-top-45 {
    padding-top: 45px !important;
}

.padding-top-50 {
    padding-top: 50px !important;
}


/*padding bottom*/

.padding-bottom-0 {
    padding-bottom: 0px !important;
}

.padding-bottom-5 {
    padding-bottom: 5px !important;
}

.padding-bottom-10 {
    padding-bottom: 10px !important;
}

.padding-bottom-15 {
    padding-bottom: 15px !important;
}

.padding-bottom-20 {
    padding-bottom: 20px !important;
}

.padding-bottom-25 {
    padding-bottom: 25px !important;
}

.padding-bottom-30 {
    padding-bottom: 30px !important;
}

.padding-bottom-35 {
    padding-bottom: 35px !important;
}

.padding-bottom-40 {
    padding-bottom: 40px !important;
}

.padding-bottom-45 {
    padding-bottom: 45px !important;
}

.padding-bottom-50 {
    padding-bottom: 50px !important;
}


/*padding left*/

.padding-left-0 {
    padding-left: 0px !important;
}

.padding-left-5 {
    padding-left: 5px !important;
}

.padding-left-10 {
    padding-left: 10px !important;
}

.padding-left-15 {
    padding-left: 15px !important;
}

.padding-left-20 {
    padding-left: 20px !important;
}

.padding-left-25 {
    padding-left: 25px !important;
}

.padding-left-30 {
    padding-left: 30px !important;
}

.padding-left-35 {
    padding-left: 35px !important;
}

.padding-left-40 {
    padding-left: 40px !important;
}

.padding-left-45 {
    padding-left: 45px !important;
}

.padding-left-50 {
    padding-left: 50px !important;
}


/*padding right*/

.padding-right-0 {
    padding-right: 0px !important;
}

.padding-right-5 {
    padding-right: 5px !important;
}

.padding-right-10 {
    padding-right: 10px !important;
}

.padding-right-15 {
    padding-right: 15px !important;
}

.padding-right-20 {
    padding-right: 20px !important;
}

.padding-right-25 {
    padding-right: 25px !important;
}

.padding-right-30 {
    padding-right: 30px !important;
}

.padding-right-35 {
    padding-right: 35px !important;
}

.padding-right-40 {
    padding-right: 40px !important;
}

.padding-right-45 {
    padding-right: 45px !important;
}

.padding-right-50 {
    padding-right: 50px !important;
}


/*margin*/

.margin-0 {
    margin: 0px !important;
}

.margin-5 {
    margin: 5px !important;
}

.margin-10 {
    margin: 10px !important;
}

.margin-15 {
    margin: 15px !important;
}

.margin-20 {
    margin: 20px !important;
}

.margin-25 {
    margin: 25px !important;
}

.margin-30 {
    margin: 30px !important;
}

.margin-35 {
    margin: 35px !important;
}

.margin-40 {
    margin: 40px !important;
}

.margin-45 {
    margin: 45px !important;
}

.margin-50 {
    margin: 50px !important;
}


/*margin top*/

.margin-top-0 {
    margin-top: 0px !important;
}

.margin-top-5 {
    margin-top: 5px !important;
}

.margin-top-10 {
    margin-top: 10px !important;
}

.margin-top-15 {
    margin-top: 15px !important;
}

.margin-top-20 {
    margin-top: 20px !important;
}

.margin-top-25 {
    margin-top: 25px !important;
}

.margin-top-30 {
    margin-top: 30px !important;
}

.margin-top-35 {
    margin-top: 35px !important;
}

.margin-top-40 {
    margin-top: 40px !important;
}

.margin-top-45 {
    margin-top: 45px !important;
}

.margin-top-50 {
    margin-top: 50px !important;
}


/*margin bottom*/

.margin-bottom-0 {
    margin-bottom: 0px !important;
}

.margin-bottom-5 {
    margin-bottom: 5px !important;
}

.margin-bottom-10 {
    margin-bottom: 10px !important;
}

.margin-bottom-15 {
    margin-bottom: 15px !important;
}

.margin-bottom-20 {
    margin-bottom: 20px !important;
}

.margin-bottom-25 {
    margin-bottom: 25px !important;
}

.margin-bottom-30 {
    margin-bottom: 30px !important;
}

.margin-bottom-35 {
    margin-bottom: 35px !important;
}

.margin-bottom-40 {
    margin-bottom: 40px !important;
}

.margin-bottom-45 {
    margin-bottom: 45px !important;
}

.margin-bottom-50 {
    margin-bottom: 50px !important;
}


/*margin left*/

.margin-left-0 {
    margin-left: 0px !important;
}

.margin-left-5 {
    margin-left: 5px !important;
}

.margin-left-10 {
    margin-left: 10px !important;
}

.margin-left-15 {
    margin-left: 15px !important;
}

.margin-left-20 {
    margin-left: 20px !important;
}

.margin-left-25 {
    margin-left: 25px !important;
}

.margin-left-30 {
    margin-left: 30px !important;
}

.margin-left-35 {
    margin-left: 35px !important;
}

.margin-left-40 {
    margin-left: 40px !important;
}

.margin-left-45 {
    margin-left: 45px !important;
}

.margin-left-50 {
    margin-left: 50px !important;
}


/*margin right*/

.margin-right-0 {
    margin-right: 0px !important;
}

.margin-right-5 {
    margin-right: 5px !important;
}

.margin-right-10 {
    margin-right: 10px !important;
}

.margin-right-15 {
    margin-right: 15px !important;
}

.margin-right-20 {
    margin-right: 20px !important;
}

.margin-right-25 {
    margin-right: 25px !important;
}

.margin-right-30 {
    margin-right: 30px !important;
}

.margin-right-35 {
    margin-right: 35px !important;
}

.margin-right-40 {
    margin-right: 40px !important;
}

.margin-right-45 {
    margin-right: 45px !important;
}

.margin-right-50 {
    margin-right: 50px !important;
}


/*//padding & margin*/


/* Transitions */
.transition-0-5{
    transition: 0.5s all;
}

/*FILE ICONS*/

.file-icon,
.file-description-block {
    /*margin: 10px;*/
    display: inline-block;
}

.file-icon {
    background-color: #9a9a9a;
    border-radius: 2px;
    color: white;
    font-weight: 100;
    height: 96px;
    min-height: 96px;
    min-width: 72px;
    position: relative;
    text-align: center;
    width: 72px;
}

.file-icon::before {
    border-color: #fff #fff rgba(255, 255, 255, 0.35) rgba(255, 255, 255, 0.35);
    border-radius: 0 0 0 2px;
    border-style: solid;
    border-width: 14px;
    content: "";
    display: block;
    margin-top: -1px;
    margin-right: -1px;
    position: absolute;
    right: 0;
    top: 0;
}

.file-icon::after {
    content: attr(data-file-type);
    font-size: 16px;
    line-height: 96px;
    margin-left: 0px;
    overflow: hidden;
    text-transform: lowercase;
    white-space: nowrap;
}

.file-icon-download::after {
    font-family: 'fontawesome';
    content: '\f019';
    font-size: 18px !important;
    line-height: 65px !important;
}

.file-icon.file-icon--xsmall {
    height: 40px;
    min-height: 40px;
    min-width: 30px;
    width: 30px;
}

.file-icon.file-icon--xsmall::before {
    -webkit-transition: all 0.25s linear;
    -moz-transition: all 0.25s linear;
    -ms-transition: all 0.25s linear;
    -o-transition: all 0.25s linear;
    transition: all 0.25s linear;
    border-width: 6px;
}

.file-icon.file-icon--xsmall:hover::before {
    -webkit-transition: all 0.25s linear;
    -moz-transition: all 0.25s linear;
    -ms-transition: all 0.25s linear;
    -o-transition: all 0.25s linear;
    transition: all 0.25s linear;
    border-width: 0px;
}

.file-icon.file-icon--xsmall::after {
    font-size: 11px;
    line-height: 50px;
    font-weight: 500;
    text-transform: uppercase;
}

.file-icon.file-icon--small {
    height: 64px;
    min-height: 64px;
    min-width: 48px;
    width: 48px;
}

.file-icon.file-icon--small::before {
    -webkit-transition: all 0.25s linear;
    -moz-transition: all 0.25s linear;
    -ms-transition: all 0.25s linear;
    -o-transition: all 0.25s linear;
    transition: all 0.25s linear;
    border-width: 8px;
}

.file-icon.file-icon--small:hover::before {
    -webkit-transition: all 0.25s linear;
    -moz-transition: all 0.25s linear;
    -ms-transition: all 0.25s linear;
    -o-transition: all 0.25s linear;
    transition: all 0.25s linear;
    border-width: 0px;
}

.file-icon.file-icon--small::after {
    font-size: 11px;
    line-height: 70px;
    font-weight: 500;
    text-transform: uppercase;
}

.file-icon.file-icon--large {
    height: 128px;
    min-height: 128px;
    min-width: 96px;
    width: 96px;
}

.file-icon.file-icon--large::before {
    -webkit-transition: all 0.25s linear;
    -moz-transition: all 0.25s linear;
    -ms-transition: all 0.25s linear;
    -o-transition: all 0.25s linear;
    transition: all 0.25s linear;
    border-width: 18px;
}

.file-icon.file-icon--large:hover::before {
    -webkit-transition: all 0.25s linear;
    -moz-transition: all 0.25s linear;
    -ms-transition: all 0.25s linear;
    -o-transition: all 0.25s linear;
    transition: all 0.25s linear;
    border-width: 0px;
}

.file-icon.file-icon--large::after {
    font-size: 24px;
    line-height: 128px;
}

div[data-file-type=ai] {
    background-color: #9b59b6;
}

div[data-file-type=cdr] {
    background-color: #9b59b6;
}

div[data-file-type=csv] {
    background-color: #329a41;
}

div[data-file-type=doc] {
    background-color: #4286ce;
}

div[data-file-type=docx] {
    background-color: #4286ce;
}

div[data-file-type=gif] {
    background-color: #4286bf;
}

div[data-file-type=jpeg] {
    background-color: #A17C4A;
}

div[data-file-type=jpg] {
    background-color: #A17C4A;
}

div[data-file-type=key] {
    background-color: #e38d00;
}

div[data-file-type=mp4] {
    background-color: #51396B;
}

div[data-file-type=mov] {
    background-color: #51396B;
}

div[data-file-type=mp3] {
    background-color: #51396B;
}

div[data-file-type=pdf] {
    background-color: #d04730;
}

div[data-file-type=png] {
    background-color: #A17C4A;
}

div[data-file-type=ppt] {
    background-color: #e38d00;
}

div[data-file-type=pptx] {
    background-color: #DC4929;
}

div[data-file-type=pps] {
    background-color: #DC4929;
}

div[data-file-type=ps] {
    background-color: #9b59b6;
}

div[data-file-type=rar] {
    background-color: #e38d00;
}

div[data-file-type=svg] {
    background-color: #9b59b6;
}

div[data-file-type=tif] {
    background-color: #4286bf;
}

div[data-file-type=xls] {
    background-color: #329a41;
}

div[data-file-type=zip] {
    background-color: #e38d00;
}

div[data-file-type=DWG] {
    background-color: #5B2FCD;
}

div[data-file-type=C4D] {
    background-color: #5B2FCD;
}

div[data-file-type=OBJ] {
    background-color: #5B2FCD;
}

div[data-file-type=3DS] {
    background-color: #5B2FCD;
}


/*// FILE ICONS*/

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

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

.label a {
    color: #fff !important;
}

.popover {
    max-width: 150px;
}

.popover-content {
    word-wrap: break-word;
}


/*Odin Loader*/

.odin_loader {
    width: 50px;
    height: 50px;
    position: relative;
    margin: 30px 0px;
}

.odin_loader_right {
    margin-left: calc( 100% - 100px);
}

.odin_loader_center {
    margin-left: calc( 50% - 25px);
}

.odin_loader_text {
    text-align: center;
    font-size: 1.4rem;
    font-style: italic;
    font-family: "Open Sans", sans-serif;
    position: absolute;
    width: 100%;
    left: 0px;
    margin-top: 78px;
}

.odin_loader_text:after {
    content: ' .';
    animation: dots 2s steps(5, end) infinite;
}

@keyframes dots {
    0%,
    20% {
        color: rgba(0, 0, 0, 0);
        text-shadow: .5em 0 0 rgba(0, 0, 0, 0), 1em 0 0 rgba(0, 0, 0, 0);
    }
    40% {
        color: black;
        text-shadow: .5em 0 0 rgba(0, 0, 0, 0), 1em 0 0 rgba(0, 0, 0, 0);
    }
    60% {
        text-shadow: .5em 0 0 black, 1em 0 0 rgba(0, 0, 0, 0);
    }
    80%,
    100% {
        text-shadow: .5em 0 0 black, 1em 0 0 black;
    }
}

.odin_loader:after {
    width: 100%;
    height: 100%;
    position: absolute;
    background: url('../../../../assets/img/logo/odin_loader.png');
    content: '';
    -webkit-animation: spinX 2s linear infinite;
    animation: spinX 2s linear infinite;
    background-repeat: no-repeat;
    background-size: 50px;
    margin-left: calc( 50% - 25px);
}

.first-sidebar-link {
    padding: 35px 15px 25px 15px !important;
}

@keyframes spinX {
    0% {
        -webkit-transform: rotate(0deg);
        opacity: 1;
    }
    50% {
        opacity: 0.2;
    }
    100% {
        -webkit-transform: rotate(360deg);
        opacity: 1;
    }
}

/* Odin Range Slider */
.odin_slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 10px;
    border-radius: 5px !important;
    background: #d3d3d3;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
    margin: 10px 0px 30px 0px;
}

.odin_slider:hover {
    opacity: 1;
}

.odin_slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 35px;
    height: 35px;
    border: 0;
    background: url('../../../../assets/img/logo/odin_loader.png') no-repeat !important;
    background-size: 35px 35px !important;
    cursor: pointer;
}

.odin_slider::-moz-range-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 35px;
    height: 35px;
    border: 0;
    background: url('../../../../assets/img/logo/odin_loader.png') no-repeat !important;
    background-size: 35px 35px !important;
    cursor: pointer;
}

.btn.btn-outline.yellow,
.mbtn,
.sbtn {
    border: 1px solid;
    border-color: #b7af7b !important;
    color: #b7af7b;
    background: 0 0;
}

.btn.btn-outline.yellow:hover,
.mbtn:hover,
.sbtn:hover {
    background-color: #e2d688;
}

.btn.btn-outline.dark {
    border: 1px solid;
}


/*sidebar full height fix*/

.page-sidebar.collapse {
    position: absolute;
    top: 0;
    bottom: 0;
}

.page-sidebar .page-sidebar-menu {
    height: 100%;
}


/*sidebar full height fix*/


/* .page-sidebar .page-sidebar-menu>li.active>a {
    font-weight: 800;
} */

.page-quick-sidebar-chat-user-form > .input-group input.notif_sidebar_msg {
    border: 0;
    height: 50px;
}

.notif_sidebar_send, .sidebar_btn_single_cancel {
    padding: 15px;
    border:none;
}

.portlet-body fieldset {
    padding: 25px 15px;
    margin: 0px 15px;
}

.form-group.form-md-line-input {
    margin: 0px 0px 5px 0px;
}

.page-header.navbar .top-menu .navbar-nav>li.dropdown {
    padding: 0 2px;
}

.page-sidebar .sidebar-search-wrapper .input-group .form-control::placeholder {
    color: #999;
}

.well_dropdown,
.company_dropdown,
.oa_dropdown,
#department,
#sub_project {
    border: 0;
}

#department:focus,
#department:hover,
#department:active,
#sub_project:focus,
#sub_project:hover,
#sub_project:active {
    border-bottom: 1px solid #c5b96b !important;
}

.well_dropdown,
.company_dropdown,
.oa_dropdown,
#collection_result,
#hcs_result,
#la_name_result,
input[name="wellname_search"],
#wellname_search_result,
#project,
#project_result,
#department,
#department_result,
#sub_project,
#sub_project_result,
#joblist,
#job_result {
    width: 100%;
}

.well_dropdown,
.company_dropdown,
.oa_dropdown,
#collection_result,
#hcs_result,
#la_name_result,
#wellname_search_result,
#project_result,
#job_result,
#department_result,
#sub_project_result {
    display: block;
    position: absolute;
    background: #fff;
    z-index: 999;
    overflow: auto;
    max-height: 200px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#hcs_result,
#la_name_result,
#project_result {
    margin-top: 23px;
    /*transition: 0.3s all;*/
}

#job_result {
    width: 91%;
}

.well_dropdown .option,
.company_dropdown .option,
.oa_dropdown .option,
.hcs_option,
.collection_option,
.job_option,
.project_option,
.department_option,
.sub_project_option {
    display: block !important;
    padding: 10px;
    border: 1px solid #adb8c8;
    border-left: 0px;
    border-right: 0px;
    border-top: 0px;
    color: #364150;
    /*    -webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
    -o-transition: all 0.6s;
    transition: all 0.6s;*/
}

.well_dropdown .option:hover,
.company_dropdown .option:hover,
.oa_dropdown .option:hover,
.hcs_option:hover,
.collection_option:hover,
.job_option:hover,
.project_option:hover,
.department_option:hover,
.sub_project_option:hover {
    text-decoration: none;
    background-color: #364150;
    color: #fff;
    padding-left: 20px;
    cursor: pointer;
}

.page-header.navbar .top-menu .navbar-nav>li.dropdown-extended .dropdown-menu {
    display: block !important;
    -webkit-transform: scale(0, 0);
    -moz-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    transform: scale(0, 0);
    transition: transform 110ms ease-in;
}

.notif_read {
    background-color: #fff;
    margin: 10px 15px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.notif_unread {
    background-color: #edf2fa;
    margin: 10px 15px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.page-header.navbar .top-menu .navbar-nav>li.dropdown-extended .dropdown-menu>li.external {
    background: #fff;
    z-index: 1;
    position: relative;
    padding: 20px;
    transition: all 0.1s linear 0s;
}

.label-green {
    background-color: #c1e49e;
}

.label-purple {
    background-color: #dda4ea;
}

.label-orange {
    background-color: #fbbe95;
}

#job_header_detail_portlet {
    display: none;
}

.page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed .sidebar-search .input-group .form-control {
    display: block;
    border-bottom: 1px solid #efe;
}

.page-header.navbar {
    padding: 0px 0px 50px 0px;
}

.user_dropdown_arrow:before {
    margin-top: 25px;
}

.modal-body {
    overflow-y: auto;
    max-height: 70vh;
}


/*.modal-dialog {
position: absolute;
top: 40%;
left: 50%;
transform: translate(-50%, -50%) !important;
}*/

.dropdown-menu-list,
.page-quick-sidebar-chat-user-messages {
    scroll-behavior: smooth;
    overflow: scroll !important;
    position: unset !important;
    -webkit-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important;
}

#notification_modal,
#contacts_modal {
    background-color: rgba(0, 0, 0, 0.5);
}

#notification_modal>.modal-dialog>.modal-content>.modal-header,
#notification_modal>.modal-dialog>.modal-content>.modal-footer,
#contacts_modal>.modal-dialog>.modal-content>.modal-header,
#contacts_modal>.modal-dialog>.modal-content>.modal-footer {
    border: 0px;
}

#notification_modal_title>.label {
    padding: 10px;
    float: left;
}

.dashboard_logo {
    margin: 5px 0px 0px 0px !important;
    width: 70px;
}

.divider {
    width: 70%;
    margin-left: 15%;
    height: 1px;
    background: #c5b96b;
    display: block;
    opacity: 0.5;
}

.btn.btn-outline.default {
    border: 1px solid;
}


/*CONTACTS PAGE*/

.tile-thumbnail {
    width: 100% !important;
    height: 210px !important;
}

#section_my_contacts,
.no_contact,
.my_no_contact {
    display: none;
}

#dv_selected_well a {
    color: #fff;
}


/*wellbore simulation css*/

.m-container {
    width: 100%;
    padding: 15px;
    margin: 0 auto;
}

.axis path,
.axis line {
    fill: none;
    stroke: #777;
    shape-rendering: crispEdges;
}

.axis text {
    font-family: 'Arial';
    font-size: 13px;
}

.tick {
    stroke-dasharray: 1, 2;
}

.bar {
    fill: FireBrick;
}

.form-group.form-md-line-input.has-warning .form-control {
    min-width: 150px;
}

.fa-expand:before {
    content: "\f065" !important;
}


/*.dropdown-menu > li > .slimScrollDiv{
height: 250px !important;
}*/


/*Sidebar*/

.jscolor {
    border: 1px solid #00000033 !important;
    border-left: 0px !important;
    width: 10em;
}

.jscolor_hash {
    border: 1px solid #00000033 !important;
}

.searched_content {
    color: black;
    font-weight: bold;
    padding: 1px 3px 1px 3px;
    background-color: white;
}

.unread_goto {
    position: absolute;
    text-align: center;
    display: block;
    color: #fff;
    padding: 15px 15px;
    bottom: -4px;
    width: 100%;
    background: #111;
}

.unread_goto:hover,
.unread_goto:focus {
    text-decoration: none;
    background: #000;
    color: #fff;
}

.sidebar_chat_dropdown {
    transform: scale(0, 1);
    transition: 0.2s all;
    position: absolute;
    right: -10px;
    margin-top: -10px;
    padding: 8px 12px;
    background: rgba(255, 255, 255, 0.2);
    color: #c3c3bd;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-size: 1.2em;
}

.sidebar_chat_dropdown:hover {
    text-decoration: none;
    color: #c3c3bd;
    background: rgba(255, 255, 255, 0.1);
}

.search_loader {
    z-index: 4 !important;
}

.bg-light-green {
    background-color: #bbf1bb !important;
}

.bg-light-yellow {
    background-color: #fff1bb !important;
}

.bg-light-red {
    background-color: #fbb !important;
}

.bg-light-blue {
    background-color: #87b7ff !important;
}

.bg-light-grey {
    background-color: #d7cfd7 !important;
}

.portlet.light.bordered {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.panel-default>.panel-heading+.panel-collapse>.panel-body,
.export_div {
    overflow: auto;
    width: 100%;
}

.export_div select {
    min-width: 110px;
}


/*Ekko lightbox*/

.ekko-lightbox.modal {
    background: #000000aa;
    z-index: 99999;
}

.ekko-lightbox .modal-body {
    max-height: 100vh;
    padding: 10px;
}

.emoji-menu {
    margin-top: -227px !important;
    transform: none !important;
    position: fixed !important;
    right: 6px !important;
    left: auto !important;
    top: auto !important;
    width: 304px;
}

.emoji-picker-icon {
    line-height: initial !important;
}

.emoji-picker-container {
    display: contents;
}

.emoji-menu-tab.icon-bell::before,
.emoji-menu-tab.icon-grid::before {
    content: "";
}

.fa-expand::before {
    content: "\f065" !important;
}


/* Portlet-title link update */

.portlet.box>.portlet-title {
    cursor: pointer;
}

.portlet.box>.portlet-body {
    width: 100% !important;
    display: none;
    overflow: auto;
}

.portlet.box>.portlet-title>.tools {
    display: none;
}

.portlet.blue-madison:hover,
.portlet.box.blue-madison>.portlet-title:hover,
.portlet>.portlet-body.blue-madison:hover {
    background: var(--portlet-bg-color-hover);
}
/* Library: Bootstrap-Table */
/* .bootstrap-table table{
    overflow: auto;
    display: block;
} */

.input-icons i {
    position: absolute;
}
.input-icons {
    width: 100%;
    margin-bottom: 10px;
}
.icon {
    padding: 10px;
    min-width: 40px;
    margin-left: 55px;
}
/* .input-field { 
    width: 100%; 
    padding: 10px; 
    text-align: center; 
} */

.new_label{
    margin-top: 10px;
}

#note{
    width: 100%;
}

/* Contact list dropdown */
.contact_list > .dropdown {
    max-height: 150px;
    overflow-y: auto;
    background-color: #fff;
    border-radius: 5px !important;
    margin-top: 5px;
    box-shadow: 0 12px 24px -6px rgba(9, 30, 66, .25), 0 0 0 1px rgba(9, 30, 66, .08);
    padding: 5px;
    box-sizing: border-box;
    cursor: pointer;
}
.contact_list > .dropdown span {
    padding: 5px;
    float: left;
    width: 100%;
    margin-top: 2px;
}
.contact_list > .dropdown span:hover {
    background-color: #dadbe2;
}

/* CARDS */
.card{
    background-color: #ffffff;
    border-radius: 5px !important;
    box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -moz-box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin: 10px 0px;
}
.card > .card-title{
    background-color: var(--main-theme-bg-color);
    padding: 15px;
    border-radius: 5px !important;
    box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -moz-box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.card > .card-title > .heading{
    font-size: 1.5em;
    color: #ffffff;
}
.card > .card-title > .content{
    font-size: 1em;
    color: #ffffff;
}
.card > .card-text{
    padding: 15px;
    overflow: auto;
    max-height: 150px;
}
.card > .card-footer{
    border-top: 1px dashed #ccc;
    padding: 15px;
}
.card > .card-title.invert-margin {
    margin: 0px -10px;
}

/* Gradient Background's */
.bg-grad-red {
    background: linear-gradient(40deg,#ffd86f,#fc6262) !important;
}
.bg-grad-black {
    background: linear-gradient(40deg,#868f96,#152020) !important;
}
.bg-grad-blue {
    background: linear-gradient(40deg,#45cafc,#303f9f) !important;
}
.bg-grad-pink {
    background: linear-gradient(40deg,#ff6d91,#7d0321) !important;
}
.bg-grad-maroon{
    background: linear-gradient(40deg,#b93434,#7d0000) !important;
}

/* Background's */
.bg-theme {
    background-color: var(--main-theme-bg-color) !important;
}
.bg-dark-terminal {
    background-color: #1f1f1f !important;
}

/* Font */
.font-terminal {
    font-family: monospace;
    font-size: 12px;
}

/* Custom OA dropdown */
.custom_dropdown {
    max-height: 150px;
    overflow-y: auto;
    background-color: #fff;
    border-radius: 5px !important;
    box-shadow: 0 12px 24px -6px rgba(9, 30, 66, .25), 0 0 0 1px rgba(9, 30, 66, .08);
    padding: 5px;
    box-sizing: border-box;
    cursor: pointer;
    position: absolute;
    z-index: 1;
    width: 100%;
}

.custom_dropdown > .option {
    padding: 5px;
    float: left;
    width: 100%;
    margin-top: 2px;
}

.custom_dropdown > .option:hover {
    background-color: #dadbe2;
}

.custom_dropdown:empty {
    display: none;
}

.capitalize {
    text-transform: capitalize;
}

.page-content {
    min-height: calc(100vh - 60px) !important;
}

.mark, mark {
    background: #ff0 !important;
}

.btn, .form-control, .dropdown-menu {
    font-size: 1.2rem !important;
}