@font-face {
    font-family: 'Satoshi-Variable';
    src: url('../font/Satoshi-Variable.woff2') format('woff2'),
    url('../font/Satoshi-Variable.woff') format('woff'),
    url('../font/Satoshi-Variable.ttf') format('truetype');
    font-weight: 300 900;
    font-display: swap;
    font-style: normal;
}

@font-face {
    font-family: 'Satoshi-VariableItalic';
    src: url('../font/Satoshi-VariableItalic.woff2') format('woff2'),
    url('../font/Satoshi-VariableItalic.woff') format('woff'),
    url('../font/Satoshi-VariableItalic.ttf') format('truetype');
    font-weight: 300 900;
    font-display: swap;
    font-style: italic;
}


@font-face {
    font-family: 'Satoshi-Light';
    src: url('../font/Satoshi-Light.woff2') format('woff2'),
    url('../font/Satoshi-Light.woff') format('woff'),
    url('../font/Satoshi-Light.ttf') format('truetype');
    font-weight: 300;
    font-display: swap;
    font-style: normal;
}


@font-face {
    font-family: 'Satoshi-LightItalic';
    src: url('../font/Satoshi-LightItalic.woff2') format('woff2'),
    url('../font/Satoshi-LightItalic.woff') format('woff'),
    url('../font/Satoshi-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-display: swap;
    font-style: italic;
}


@font-face {
    font-family: 'Satoshi-Regular';
    src: url('../font/Satoshi-Regular.woff2') format('woff2'),
    url('../font/Satoshi-Regular.woff') format('woff'),
    url('../font/Satoshi-Regular.ttf') format('truetype');
    font-weight: 400;
    font-display: swap;
    font-style: normal;
}


@font-face {
    font-family: 'Satoshi-Italic';
    src: url('../font/Satoshi-Italic.woff2') format('woff2'),
    url('../font/Satoshi-Italic.woff') format('woff'),
    url('../font/Satoshi-Italic.ttf') format('truetype');
    font-weight: 400;
    font-display: swap;
    font-style: italic;
}


@font-face {
    font-family: 'Satoshi-Medium';
    src: url('../font/Satoshi-Medium.woff2') format('woff2'),
    url('../font/Satoshi-Medium.woff') format('woff'),
    url('../font/Satoshi-Medium.ttf') format('truetype');
    font-weight: 500;
    font-display: swap;
    font-style: normal;
}


@font-face {
    font-family: 'Satoshi-MediumItalic';
    src: url('../font/Satoshi-MediumItalic.woff2') format('woff2'),
    url('../font/Satoshi-MediumItalic.woff') format('woff'),
    url('../font/Satoshi-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-display: swap;
    font-style: italic;
}


@font-face {
    font-family: 'Satoshi-Bold';
    src: url('../font/Satoshi-Bold.woff2') format('woff2'),
    url('../font/Satoshi-Bold.woff') format('woff'),
    url('../font/Satoshi-Bold.ttf') format('truetype');
    font-weight: 700;
    font-display: swap;
    font-style: normal;
}


@font-face {
    font-family: 'Satoshi-BoldItalic';
    src: url('../font/Satoshi-BoldItalic.woff2') format('woff2'),
    url('../font/Satoshi-BoldItalic.woff') format('woff'),
    url('../font/Satoshi-BoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-display: swap;
    font-style: italic;
}


@font-face {
    font-family: 'Satoshi-Black';
    src: url('../font/Satoshi-Black.woff2') format('woff2'),
    url('../font/Satoshi-Black.woff') format('woff'),
    url('../font/Satoshi-Black.ttf') format('truetype');
    font-weight: 900;
    font-display: swap;
    font-style: normal;
}


@font-face {
    font-family: 'Satoshi-BlackItalic';
    src: url('../font/Satoshi-BlackItalic.woff2') format('woff2'),
    url('../font/Satoshi-BlackItalic.woff') format('woff'),
    url('../font/Satoshi-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-display: swap;
    font-style: italic;
}

body {
    background-color: #F4F5F6;
    font-family: 'Satoshi-Medium';
}

.navbar {
    background-color: #ffffff;
}

.navbar .logo {
    max-height: 35px;
}
.navbar .nav-link, .navbar .nav-link a{
    color: #475569;
    cursor: pointer;
}
.user-nav-logo {
    background-color: #0178D4;
    color: #DBEAFE;
    border: 1px solid #DBEAFE;
    border-radius: 50%;
    padding: 1px 5px 3px 5px;
}
.blue-menu {
    background-color: #0178D4;
    width: 100%;
    padding: 15px;
}

.blue-menu .blue-menu-item a {
    color: #FFFFFF;
    font-family: 'Satoshi-Medium';
    padding: 10px;
    text-decoration: none;
}
.navbar-toggle-item i {
    color: #0178D4;
}
.main {
    min-height: 638px;
    position: relative;
}
footer {
    background-color: #082C47;
    padding: 20px 0 0 0;
}
footer img {
    max-width: 200px !important;
    margin-bottom: 20px;
}
footer p {
    color: #94A3B8;
    font-size: 13px;
}
footer a, footer a:hover {
    color: #D0D9E4;
    font-size: 13px;
    text-decoration: none;
}

.breadcrumbs-trail {
    margin: 10px 0;
    padding: 0;
    border-bottom: 2px solid #D0D9E4;
}

.breadcrumbs-trail li {
    list-style: none;
    display: inline-block;
    margin: 0 5px;
    color: #94A3B8;
}

.breadcrumbs-trail li a {
    text-decoration: none;
    color: #94A3B8;
}

.breadcrumbs-trail li:last-child a {
    color: #0178D4;
}
.description-row {
    font-size: 22px;
    color: #0F172A;
}
.description-row .title {
    border-bottom: 2px solid #D0D9E4;
    text-transform: uppercase;
    margin: 10px 0;
}
.description-row .subtitle {
    position: relative;
}
.description-row .subtitle .subtitle-border {
    height: 3px;
    background-color: #0178D4;
    width: 100%;
    position: absolute;
    bottom: -5px;
    left: 0;
}
.description-row .subtitle .subtitle-border-gray {
    height: 3px;
    background-color: #94A3B8;
    width: 100%;
    position: absolute;
    bottom: -5px;
    left: 0;
}
.text-right {
    text-align: right;
}
.form-label {
    font-size: 18px;
    color: #475569;
}
.form-label .form-required {
    color: #E2215C;
}
.custom-form .row {
    margin-top: 8px;
}
.accordion-button, .accordion-button:hover {
    background-color: #0178D4;
    color: #ffffff;
}
.accordion-button::after {
    color: #ffffff;
}
.accordion-body{
    background-color: #E9EDF1;
}
.accordion-footer{
    background-color: #E2E7ED;
}
.message {
    color: #ffffff;
    text-align: center;
    padding: 10px;
}
.message.success {
    background-color: #28a745;
}
.message.error {
    background-color: #D7202C;
}
.message.success .message-agree {
    background-color: #38944d;
}
.message.error .message-agree {
    background-color: #B4212A;
}
.message-agree {
    font-size: 12px;
    vertical-align: middle;
    border: 1px solid;
    border-radius: 5px;
    padding: 2px 7px;
    cursor: pointer;
}
.bold {
    font-weight: bold;
}
.hidden {
    display: none !important;
}
.me-expert-select-area, .me-expert-select-area-transport {
    display: block;
    width: 100%;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.me-expert-select-area .me-expert-select-item, .me-expert-select-area-transport .me-expert-select-item-transport {
    cursor: pointer;
    padding: 0.375rem 0.75rem;
    border-bottom: 1px solid #ced4da;
}
.me-expert-select-area .me-expert-select-item:hover, .me-expert-select-area-transport .me-expert-select-item-transport:hover {
    background-color: #83beeb;
}
.me-expert-select-value, .me-expert-select-value-transport {
    background-color: #0178D4;
    color: #ffffff;
    padding: 3px 7px;
    margin-right: 5px;
}
.js--me-expert-select-container, .js--me-expert-select-container-transport {
    padding: 6px 0 0 0;
}
.me-expert-select-value .fa-close, .me-expert-select-value-transport .fa-close {
    cursor: pointer;
}
.white-background {
    background-color: #ffffff;
}
.table {
    border: 1px solid #D0D9E4;
}
.table tr, .table td, .table th {
    border-bottom: none !important;
}
.table-gray {
    background-color: #D0D9E4;
    border-color: #D0D9E4;
}
.table .table-gray th, .table .tbody-gray-2 tr td {
    border-bottom: none !important;
}
.tbody-gray-2 tr:nth-child(2n){
    background-color: #F4F5F6 !important;
}
.tbody-gray-2 tr:nth-child(1n){
    background-color: #FFFFFF;
}
.search-area {
    background-color: #ffffff;
    padding: 10px 10px 20px 10px;
    border: 1px solid #D0D9E4;
    margin-bottom: 15px;
}
.header-line {
    margin: 20px 0;
}
.no-padding-right {
    padding-right: 0 !important;
}
.no-padding-left {
    padding-left: 0 !important;
}
.pagination li {
    background-color: #94A3B8;
    border: 1px solid #94A3B8;
    color: #ffffff;
    padding: 2px 5px;
    margin: 2px;
    border-radius: 5px;
}
.pagination li a {
    color: #ffffff;
    text-decoration: none;
}
.pagination li.active {
    background-color: #475569;
}
.table .actions a,
.table .actions span{
    background-color: #D0D9E4;
    color: #64748B;
    padding: 4px 7px;
    border-radius: 50%;
    cursor: pointer;
    vertical-align: middle;
}
.white-color {
    color: #ffffff !important;
}
.filters-button {
    cursor: pointer;
    color: #0178D4;
}
.button-custom-as-input input[type="file"] {
    position: absolute;
    left: 0;
    opacity: 0;
    top: 0;
    bottom: 0;
    width: 100%;
}
.bg-upload-gold {
    background: #ada038;
    border: 1px solid #ada038;
    max-width: 400px;
}
.button-custom-as-input {
    position: relative;
    margin: 0;
    width: 100%;
    line-height: 2.7;
    height: calc(1.5em + 1.3rem + 2px) !important;
}
.upload-file {
    text-align: center;
}
.btn-gray {
    color: #ffffff;
    background-color: #64748B;
    border-color: #94A3B8;
}
.table a {
    text-decoration: none;
    color: #000000;
}
.btn-me-expert {
    color: #0178D4;
    border: 1px solid #0178D4;
    border-radius: 5px;
    background-color: #ffffff;
    padding: 7px 20px;
}
.btn-me-expert:hover {
    color: #ffffff;
    border: 1px solid #ffffff;
    background-color: #0178D4;
}
.list-of-items {
    padding: 0;
}
.list-of-items li {
    list-style: none;
    margin: 2% 0;
}
.items-container{
    margin: 0;
    padding: 0;
    width: 100%;
    cursor: pointer;
}
.items-container li{
    list-style: none;
    float: left;
    padding: 10px;

}
.items-container li:first-child{
    width: 80%;
    background-color: #fff !important;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-top:  2px solid #E7EBF0;
    border-left:  2px solid #E7EBF0;
    border-bottom:  2px solid #E7EBF0;
}
.items-container li p, .custom-button {
    margin: 5px auto;
    padding: 2px 15px;
    border-radius: 5px;
    width: fit-content;
    font-size: 13px;
}
.items-container li h3 {
    font-size: 22px;
    color: #0F172A;
    margin: 10px 0 12px 20px;
}
.items-container li:last-child{
    width: 20%;
    background-color: #F4F5F6;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border: 2px solid #E7EBF0;;
}
.no-of-status {
    text-align: center;
    margin: 21px auto !important;
    padding: 8px 15px !important;
    border-radius: 100% !important;
}
.green {
    background-color: #1BA468;
    color: #fff;
}
.light-green {
    background-color: lightgreen;
    color: #fff;
}
.orange {
    background-color: #FFA53E;
    color: #fff;
}
.gray-dark {
    background-color: #64748B;
    color: #fff;
}
.blue {
    background-color: #0178D4;
    color: #fff;
}
.danger {
    background-color: #dc3545;
    color: #ffffff;
}
.light-gray {
    background-color: #E7EBF0;
    color: #fff;
}
.white-container {
    background-color: #fff !important;
    border: 2px solid #E7EBF0;
    border-radius: 5px;
    padding: 15px 10px;
    margin: 4% 0;
    overflow-y: scroll;
    height: 234px;
}
.notification-container {
    background-color: #fff !important;
    border: 2px solid #E7EBF0;
    border-radius: 5px;
    padding: 25px 10px;
    margin: 4% 0;
    height: auto;
    text-align: center;
}
.countries-elements {
    padding: 0;
    margin: 0;
}
.countries-title {
    color: #0F172A;
    font-size: 18px;
    font-weight: bold;
}
.countries-elements li {
    list-style: none;
    margin: 2% 0;
}
.countries-items {
    margin: 0;
    padding: 0;
}
.countries-items li {
    list-style: none;
    float: left;
    padding: 5px 0;
}
.countries-items li:first-child{
    width: 80%;

}
.countries-items li:nth-child(2){
    width: 19%;
    text-align: right;
}
.no-of-country-item {
    background-color: #D0D9E4;
    padding: 5px 12px !important;
    border-radius: 100% !important;
}
.company-elements {
    margin: 2px 0;
    padding: 0;
    cursor: pointer;
}
.company-elements a {
    text-decoration: none;
    color: #0F172A;
}
.company-elements > li {
    background-color: #F4F5F6;
    width: 100%;
    margin: 10px 0;
    border-radius: 2px;
    padding: 5px 0;
    text-decoration: none;
    list-style: none;
}
.company-elements ul {
    list-style: none;
    margin-left: 0;
    padding-left: 10px;
}
.company-elements li p{
    margin: 0;
    padding: 0;
}
.date {
    color:  #0178D4;
}
.countries-elements li li {
    padding: 13px 5px 13px 15px;
    height: 50px;
    margin-bottom: 0;
    list-style: none;
}
.countries-elements li:nth-child(2) li {
    background-color: #E7EBF0 !important;
}
.client-notes {
    width: 100%;
    min-height: 150px;
    background-color: lightyellow;
    border: 1px solid black;
}
.custom-container {
    background-color: #fff !important;
    border: 2px solid #E7EBF0;
    border-radius: 5px;
    padding: 15px 10px;
    margin: 4% 0;
}
.relative {
    position: relative;
}
.country-delete-icon {
    position: absolute;
    right: 8px;
    top: 8px;
    border: 1px solid red;
    color: red;
    padding: 0 4px 4px 4px;
    line-height: 1;
    cursor: pointer;
    border-radius: 50%;
}
.span-title {
    color: #94A3B8;
}
.admin-subtitle {
    color: #64748B;
}
.admin-button {
    color: #0178D4;
    border: 1px solid #0178D4;
    border-radius: 5px;
    display: block;
    text-align: left;
    margin: 5px 5px 5px 20px !important;
    text-decoration: none;
}
.notification-modal-title {
    background-color: #D0D9E480;
    border: 1px solid #D0D9E4;
    color: #0F172A;
}
.notification-modal-footer {
    border-top: none !important;
}
.see-password {
    position: absolute;
    right: 10px;
    top: 10px;
    color: blue;
    cursor: pointer;
}
.spinner-overlay {
    display: none;
    bottom: 0;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 99999;
    background-color: rgba(255, 255, 255, 0.5);
}
.js--spinner {
    position: absolute;
    font-size: 9rem;
    left: 47%;
    bottom: 35%;
}
.input {
    margin: 5px 0;
}
.select2-container--default {
    width: 100% !important;
    max-width: 400px !important;
}
.select2-container--default .select2-selection--single {
    padding: 4px !important;
    height: fit-content !important;
}
label {
    display: block !important;
}
.display-inline {
    display: inline-block !important;
}
.no-margin, .no-margin > .input {
    margin: 0 !important;
}
.js--goods-code-copy-item {
    margin-right: 5px;
}
.custom-disabled {
    pointer-events: none;
    background-color: #afafaf;
}
.custom-table {
    display: block;
    margin-bottom: 0;
}
.custom-table td {
    max-width: 250px;
}