/*Font*/
@font-face {
    font-family: 'Questrial';
    src: url(../Fonts/Questrial-Regular.ttf);
}

@font-face {
    font-family: 'Droid-Serif';
    src: url(../Fonts/DroidSerif.ttf);
}

@font-face {
    font-family: 'Grotesk';
    src: url(../Fonts/Grotesk.ttf);
}

html {
    min-height: 100%;
}

body {
    font-family: 'Questrial';
    background-color: #F7F9FA;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vh;
    overflow: -moz-scrollbars-none !important;
    -ms-overflow-style: none !important;
}

body::-webkit-scrollbar {
    width: 0 !important;
    background: transparent !important;
}


#login-section {
    background-color: #FFFFFF;
    /* height: 520px; */
    max-width: 350px;
    position: relative;
    margin: auto;
    margin-top: 50px;
    text-align: center;
    padding-bottom: 10px;

    /* padding-left: 20px; */
    /* padding-right: 20px; */
}

#login-section h1 {
    color: #7F7F7F;
}

#login-section h2 {
    font-size: 20px;
    color: #7F7F7F;
}

#login-section input {
    border: none;
    outline: none;
    border-bottom: solid 1px #cccccc;
}

#login-section .entries {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
}

#login-section input:focus {

    border-bottom: solid 2px #3385ff;
}

.search {
    z-index: 100;
    background-color: #F7F9FA;
    max-width: 100%;
    margin-left: 190px;
    padding: 0 0 31px 10px;

}

.elementToFadeInAndOut {
    -webkit-animation: fadeinout 4s linear forwards infinite;
    animation: fadeinout 4s linear forwards infinite;
    opacity: 0;
}

.elementToFadeInAndOut:nth-child(2) {
    animation-delay: 2s;
}

@-webkit-keyframes fadeinout {
    50% {
        opacity: 1;
    }
}

@keyframes fadeinout {
    50% {
        opacity: 1;
    }
}

.company-top {
    position: relative;
    margin: auto;
    width: 20%;
    text-align: center;
    margin-bottom: -15px;
}

.company-top-borders {
    background-image: url("../Icons/banner.svg");
    height: 20px;
    width: 350px;
    margin-top: -1px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    text-align: center;
    cursor: pointer;
}

.company-top-borders-old {
    border-top: 20px solid #7F7F7F;
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    height: 20px;
    width: 200px;
    text-align: center;
    color: #FFFFFF;
    cursor: pointer;
}

.company-top .title {
    color: #FFFFFF;
    left: 33%;
}

.search-parant {
    margin-top: 0px;
    z-index: 10;
    background-color: #F7F9FA;
    width: 100%;
    /* padding: 35px 0 31spx 10px; */
    position: fixed;
}

.search-container {
    float: left;
    width: 85%;
}

#searchBar {
    width: 70%;
    float: left;
    margin-top: 20px;
    margin-right: 2px;
}

.advanced-search-btn-container {
    margin-top: 20px;
}

#advanced-search-inputs {
    width: 63%;
}

#advanced-search-inputs input, #advanced-search-inputs select {
    width: 100%;
    height: 26px;
}

.search .client-photo {
    /* margin-left:15px; */
    text-align: center;
    cursor: pointer;
    /* float: right; */
}

.overflow-items {
    width: 22%;
    margin-top: -35px;
    float: right;
}

.overflow-x {
    overflow-x: auto;
}

.overflow-items .client-photo {
    /* margin-top: -7px; */
    float: right !important;
    margin-right: 17px;
}

.request-icon {
    /* margin-top: -7px; */
    margin-right: 10px !important;
    border: none !important;
}

.xs-user-photo {
    display: none !important;
}

.hamburger {
    width: 3%;
    float: left;
    margin-left: 25px;
    z-index: 333333;
    display: none;
}


.search-private {
    background-color: #408000;
}

.search-quotes {
    background-color: #ff9933;
}

.search-tariff {
    background-color: #e60000;
}

/*Content body */

.no-surcharge-rates{
    display: none;
}

.content {
    width: 100%;
    margin: auto;
    margin-top: 80px;
    /* margin-bottom: 60px; */
    position: relative;
    min-height: calc(100vh - 200px);
    /* overflow: hidden; */
    /* margin-left: 50px; */
}

.incentives-area{
    padding: 20px;
}

/* Enter Rates */
.compare-section {
    width: 100%;
    margin: 10px 0px 0px 0px;
    padding-bottom: 10px;
}

.rates-heading-bold {
    float: left;
    font-weight: bold;
    font-size: 18px;
}

.modal-search-input {
    width: unset;
    display: inline;
}

.display-inline {
    display: inline !important;
}

.modal-y-scroll {
    overflow-x: hidden;
    overflow-y: auto;
}

.full-height-modal-body {
    height: 85vh !important;
    overflow-y: auto;
}

.almost-full-height-modal-body {
    height: 70vh !important;
    overflow-y: auto;
}

.half-height-modal-body {
    height: 40vh !important;
    overflow-y: auto;
}

.rateSection div div input {
    width: 100%;
}

.tax-table-width-state{
    width: 35%;
}

.tax-table-width-16{
    width: 16%;
}

.tax-table-width-17{
    width: 17%;
}

.carbon-tax th, .carbon-tax td{
    font-size: 14px !important;
}

.rule-11 td{
    background: #FFE393;
}

#results {
    width: 100%;
    border-radius: 15px;
    padding: 2px 5px 2px 0px;
    margin-top: 5px;
    display: none;
}

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

.padding-10{
    padding: 10px;
}

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

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

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

#results td, th {
    font-size: 12px;
}

.results {
    position: relative;
    width: 100%;
    margin-top: 5px;
    display: none;

}

.results td, th {
    font-size: 12px;
}

.client-results td, th {
    font-size: 12px;
}

.loading-img {
    display: none;
    width: 300px;
    height: 300px;
}

.loading-img-container {
    width: 100%;
    text-align: center;
}

.sort-columns {
    text-decoration: none;
    cursor: pointer;
    margin-left: 5px;
    color: #000000;
}

.sort-columns:hover {
    text-decoration: none;
    color: #3385ff;
}

a:visited {
    text-decoration: none;
    color: #3385ff;
}

a:active {
    text-decoration: none;
    color: #3385ff;
}

.rule11titles {
    font-weight: bold;
    font-size: 14px;
}

a .edit {
    position: absolute;
    float: right;
}

.resend img {
    width: 25px;
}

.table {
    /*border: solid 1px #7F7F7F;*/
    width: 100%;
}

.table thead {
    background-color: #FFFFFF;
    color: #000000;
}

.table tbody {
    background-color: #FFFFFF;
    color: #000000;
}

.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th {
    background-color: #ffffff;
}

.table-striped > tbody > tr:nth-child(2n) > td, .table-striped > tbody > tr:nth-child(2n) > th {
    background-color: #F7F9FA;
}

.table > tbody > tr > td,
.table > tbody > tr > th {
    border-top: none;
}

.input-width-150{
    width: 150px!important;
}

/* Search Rates */
#search {
    width: 100%;
    left: 15%;
    padding: 5px 5px 5px 5px;
}

#searchDestinationResults {
    position: fixed;
    z-index: 1;
    background-color: white;
}

/* Contracts */
#contracts {
    width: 100%;
}

#contracts div div input {
    width: 100%;
}

.contract-preview {
    position: relative;
    height: 200px;
    margin-left: 0px;
    margin-bottom: 20px;
    border-radius: 15px;
    border: solid 1px #999999; /* #3F48CC;*/
    box-shadow: 7px 7px #d9d9d9;
    width: 100% !important;
}

.contract-preview .left-section {
    height: 100%;
    background-color: #415c7f; /*#1B2065;*/
    color: #FFFFFF;
    border-radius: 15px;
    bottom: 0px;
}

.contract-preview .center-section {
    position: relative;
    height: 100%;
}

.contract-preview .right-section {
    position: relative;
    height: 100%;
}

.contract-preview .contract-logo {
    width: 100px;
    height: 100px;
}

.table-font-small>tbody>tr>td{
    font-size: 10px;
}

.table-font-small-2>tbody>tr>td{
    font-size: 12px;
}

.small-contract-preview {
    position: relative;
    height: 200px;
    border-radius: 15px;
    border: solid 3px #415c7f;
    width: 100% !important;
    margin: auto;
    margin-top: 20px;
    text-align: center;
}

.contract-top-part {
    position: relative;
    height: 40%;
}

.contract-top-part img {
    height: 90%;
}

.contract-bottom-part {
    position: relative;
    height: 60%;
    color: #FFFFFF;
    text-align: center;
}

.small-contract-name {
    position: absolute;
    top: 0;
    margin-top: 10px;
    margin-left: 7px;
    left: 0;
    width: 95%;
    font-size: 18px;
    text-transform: uppercase;
}

.small-contract-rr {
    position: absolute;
    top: 45%;
    left: 0;
    margin-left: 7px;
    text-transform: capitalize;
    /* margin-top: 10px; */
    width: 95%;
}

.contract-bottom-part div {
    position: absolute;
    bottom: 0;
    margin-bottom: 5px;
    width: 100%;
}

.contract-select {
    border-radius: 3px;
    width: 50% !important;
    height: 23px !important;
}

.surcharges-order{
    border-radius: 3px;
    height: 23px !important;
}

.filter-input {
    border-radius: 3px;
    width: 50% !important;
    height: 23px !important;
    border: solid 1px #CCC;
    padding-left: 5px;
}

.position-relative {
    position: relative !important;
}

.route-search-type {
    margin-top: 22px;
}
.reference-router-radio-buttons label{
    margin-bottom: 5px !important;
}

.contract-expired {
    border-color: #444444;
}

.contract-expired .left-section, .contract-expired .contract-bottom-part {
    background-color: #444444; /*#1B2065;*/
}

.contract-current {
    border-color: #16324f;
}

.align-bottom{
    vertical-align: bottom !important;
}

.bulk-notifications-checkbox {
    position: absolute !important;
    margin-top: -6px !important;
    right: 10px !important;
}

.bulk-notifications-checkbox-all {
    margin-left: 5px !important;
}

.contract-current .left-section, .contract-current .contract-bottom-part {
    background-color: #16324f;
}

.contract-future {
    border-color: #33563d;
}

.contract-future .left-section, .contract-future .contract-bottom-part {
    background-color: #33563d;
}

#savedNotes {
    border: #999999 solid 1px;
    height: 175px;
    overflow-y: scroll;
}

.half-wtd {
    width: 50% !important;
}

.full-wtd {
    width: 100% !important;
}

.almost-full-wtd {
    width: 90% !important;
}


/* Tabs design */
.nav-pills {
    border-bottom: solid 3px #f2f2f2;
    padding-bottom: 10px;
}

.nav-pills > li > a {
    background-color: transparent !important;
    border-radius: 0px;
    padding: 20px;
    padding-bottom: 5px;
    padding-left: 0px;
    font-size: 15px;
    color: #000000;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
    font-weight: bold;
    border-bottom: solid 3px #3385ff;
    color: #000000;
}

.first-modal {
    margin-left: 20px;
}

.tab-content {
    margin-top: 5px;
    width: 100% !important;
}

.tab-content label {
    color: #000000
}

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


.radio-charts ul {
    list-style: none;
}

.radio-charts li {
    display: inline-block;
}

.radio-charts label {
    cursor: pointer;
}

.radio-charts input:checked + label {
    color: #3385ff;
}

/*Contract details*/
.modal-dialog,
.modal-content {
    text-align: center;
}


.dropzone {
    clear: both;
    font-size: 15px;
    color: #3385ff;
    margin: 25px;
}

.files-area {
    /* width: 100%; */
    margin-top: 20px;
    font-size: 20px;
    color: #3385ff;
    margin-left: 25px;
    margin-right: 25px;

    overflow-x: auto;
}

.files-area > table {
    width: 100%;
}

.notes-area {
    margin: 20px;
    padding: 5px;
    height: 400px;
    font-size: 20px;
    color: #3385ff;
}

.notes-area .list-group, .contract-prev-notes .list-group {
    height: 90%;
    overflow-y: auto;
}

.contract-prev-notes {
    height: 120px;
    border-radius: 8px;
    border: solid 1px #C2C2C2 !important;
}

.notes-prev {
    font-size: 12px;
}

.notes-detailed {
    font-size: 10px;
    text-align: left;
}

.note-date {
    padding: 6px;
    padding-left: 10px;
    padding-right: 10px;
    color: #FFFFFF;
    background: #3385ff;
}

.note-user {
    padding: 6px;
    padding-left: 10px;
    padding-right: 10px;
    margin-left: 5px;
    color: #999999;
    border: 0.5px solid #d9d9d9;
}

.note-content {
    font-size: 12px;
    font-weight: bold;
    padding: 6px;
    margin-top: 10px;
    color: #000000;
}


.left-section h1, h2, h3, h4 {
    text-align: center;
    font-size: 16px;
}

.center-section h4, h3 {
    text-align: left;
    font-size: 14px;
}

.background-grey {
    background-color: #CCCCCC !important;
}

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

.radio-button-icons {
    position: absolute;
    right: 40px;
    width: 20px;
}

.right-section h4, h3 {
    text-align: left;
    font-size: 14px;
}

/*Text Stylings */
.orange-text {
    color: #ff4500;
}

.left-section .orange-text {
    font-weight: bold;
}

.red-text {
    color: #ED1C24 !important;
}

.blue-text {
    color: #3385ff;
}

.grey-text {
    color: #7F7F7F;
}

.reference-files .grey-text {
    font-size: 15px;
    margin-left: 5px;
}

.carbon-tax-grey-text {
    color: #7F7F7F;
}

.icon-pdf {
    width: 18px !important;
    height: 18px !important;
}

.font-size-15 {
    font-size: 15px !important;
}

.reference-files .rate-details-heading-black {
    font-size: 12px;
}


.reference-files .rate-details-heading {
    margin-left: unset !important;
}

.reference-files .nav li a:active {
    font-weight: bold;
}

.reference-files .nav li a:visited {
    font-weight: bold;
}

.reference-results {
    font-size: 12px;
    margin-top: 10px;
}

.best-route td {
    background-color: #e0e7eb !important;
}

/*Settings*/
#companyInfo .rate-details-heading-bold {
    padding-left: 0;

}

/*Sourcing competitors*/
.competitorRoutes {
    background-color: #efefef;
    border-color: #efefef;
    min-width: 100px !important;
}

.competition-client-row {
    font-weight: bold;
}

/* Preferences */
.preferences {
    width: 100%;
    border-radius: 15px;
    padding: 5px 5px 5px 5px;
}

.preferences label {
    color: #7F7F7F;
    font-weight: normal;
    font-size: 15px;
}


.preferences div {
    /* margin: 2px 0px 2px 0px; */
}

.preferences div div input {
    width: 100%;
}

#groups {
    width: 100%;
    border-radius: 15px;
    padding: 5px 0x 5px 0px;
}

#groupDetails {
    width: 100%;
    padding: 5px 0px 5px 0px;
}

#groupDetails div div input {
    width: 100%;
}

#groupDetails .table {
    margin-top: 10px;
}

/*Dashboard*/
.dashboard-content {
    margin-top: 130px;
}


.dashboard-section {
    background-color: #FFFFFF;
    border: solid 1px #cccccc;
    /* box-shadow: 10px 10px #e6e6e6; */
    margin-bottom: 15px;
    overflow-x: hidden;
}

.dashboard-section-neg-margin-left {
    margin-left: -5px;
}

.dashboard-section h3 {
    margin-left: 5px;
}

.dashboard-section .recent-items-titles span:nth-child(1), .recent-items span:nth-child(1) {
    padding-left: 20px;
}

.dashboard-section h2 {
    text-align: left;
}

.dashboard-section .recent-items {
    font-size: 14px;
    color: #7F7F7F;
    cursor: pointer;
}

.dashboard-section .recent-items span {
    overflow: hidden;
    white-space: nowrap;
}


.dashboard-section .recent-items-titles {
    font-size: 16px;
    margin-bottom: 10px;
}

.dashboard-shortcuts {
    margin: 20px 15px 20px 15px;
}

.dashboard-dropdown {
    background-color: transparent;
    border: none;
}

.shortcut-container {
    border-radius: 2px;
    box-shadow: 7px 7px #d9d9d9;
    cursor: pointer;
}

.rate-request-button {
    float: right;
    width: 135px;
    background-color: #4CAF50;
    border-radius: 4px;
    cursor: pointer;
}

.rate-request-button .btn-text {
    width: 70%;
    padding-left: 5px;
    color: white;
    float: right;
    height: 40px;
    display: table;
}

.rate-request-button .btn-text span {
    display: table-cell;
    vertical-align: middle;
}

.rate-request-button .btn-img {
    width: 30%;
    padding-left: 5px;
    float: left;
    height: 40px;
    display: table;
}

.rate-request-button .btn-img img {
    margin-top: 5px;
    display: table-cell;
    vertical-align: middle;
}

.dashboard-shortcuts .btn-text {
    width: 70%;
    float: left;
    height: 60px;
    margin: 0px !important;
    background-color: #999999 !important;
    color: #FFFFFF;
    padding-left: 10px;
    padding-top: 20px;
    font-size: 18px;
    border-radius: 3px;
}

.dashboard-shortcuts .btn-img {
    text-align: center;
    width: 29%;
    height: 60px;
    padding-top: 15px;
    float: right;
    background-color: #408000;
    border-left-color: #FFFFFF solid 1px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}


.dashboard-shortcuts .btn {
    width: 100%;
    height: 60px;
    margin: 0px !important;
    background-color: #7F7F7F !important;
    font-size: 15px;
    font-weight: bold;

}

.img-button {
    width: 30px;
    height: 30px;
    margin-bottom: 10px;
}


/*Rate details*/
.rate-details-border {
    width: 80%;
    padding-bottom: 10px;
    margin-bottom: 15px;
    margin-left: 0px;
    stroke-opacity: 0.5;
    border-bottom: 1px solid #7F7F7F;
}

.bottom-border {
    padding-bottom: 10px;
    border-bottom: 1px solid #CCC;
}

.compare-details-border {
    width: 100%;
    padding-bottom: 10px;
    margin-bottom: 15px;
    margin-left: 0px;
    stroke-opacity: 0.5;
    border-bottom: 1px solid #7F7F7F;
}

.compare-details-border select {
    width: 100%;
}

.rate-details-buttons button:nth-child(4), button:nth-child(5), button:nth-child(6) {
    /* float: right;
    margin-left: 4px; */
}

.rate-analyze-buttons button:nth-child(4) {
    float: right;
    margin-left: 4px;
}

.rate-details-heading-bold {
    font-weight: bold;
    font-size: 15px;
    color: #000000;
}

.rate-details-heading {
    margin-left: 5px;
    color: #7F7F7F;
    font-size: 15px;
}

.info-details .rate-details-heading-bold {
    margin-left: 5px;
}

.bookmark-icon{
    height: 20px;
    width: 15px;
}

.warning-icon{
    height: 20px;
    width: 20px;
}

.rate-details-aux-icons{
    width: 32px;
    height: 32px;
}

.rate-details-heading-black {
    margin-left: 5px;
    color: black;
    font-size: 15px;
}

/*Clients management styling */
.clients {
    width: 100%;
    margin-top: 5px;
}

.clients div div input {
    width: 100%;
}

.client-details-users-head {
    width: 100%;
    height: 40px;
    margin-bottom: 20px;
    border-top: 1px solid #f2f2f2;
    border-bottom: 1px solid #f2f2f2;
    padding: 2px 0 2px 0;
}

.client-details-users-head .btn {
    float: right;
}

.recent-search-advanced-select {
    max-width: 60%;
}

.width-30 {
    width: 50px;
}

.width-45-percent {
    width: 45%;
}

.quote-width-60 {
    width: 60%;
}

.quote-width-tds {
    width: 40%;
}

.btn-search-history {
    padding-left: 0;
}

.btn-width-100 {
    width: 100px;
}

.search-advanced-footer-buttons {
    margin-top: 17px;
}

.client-results {
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: solid 1px #f2f2f2;
}

.client-text-name {
    font-weight: bold;
}

.nav-pills-thin > li > a {
    border-width: 1.5px !important;
    padding-top: 5px;
    font-size: 12px;
}

.search-input {
    background-color: #FFFFFF !important;
    background: url('../Icons/Icon.Search.png') top left no-repeat;
    padding-left: 28px;
    background-position: 1px 4px;
    background-size: 23px;
}

.max-z-index {
    z-index: 99999999999999;
}

.client-text-position {
    border-radius: 4px;
    margin-left: 5px;
    border: 1.5px solid #f2f2f2;
    background-color: #f2f2f2;
}

.client-results .right-buttons {
    float: right;
}

.client-results .right-buttons img {
    width: 18px;
    height: 18px;
    margin-right: 5px;
}

.client-text-email {
    color: #3385ff;
}

#clientDialog {
    font-size: 16px;
}

.client-photo {
    position: relative;
    float: left;
    width: 35px;
    height: 35px;
    border: #cccccc solid 1px;
    border-radius: 50%;
    text-align: center;
    display: table;
}

.client-photo img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
}

.side-icons {
    margin-top: 6px;
}

.side-icons img {
    width: 34px !important;
    height: 20px !important;
}

.notification-icon img {
    width: 35px !important;
    height: 35px !important;
}

.client-photo-default {
    display: table-cell;
    vertical-align: middle;
}

.client-details {
    position: relative;
    left: 10px;
}


.sectionTitles h2 {
    text-align: left;
}

.sectionTitles {
    width: 100%;
    margin-left: 0.5px;
}

.sectionData {
    margin-top: 5px;
}

.clients-modal {
    text-align: left;
    margin: 10px;
}

/*New Rate Section*/
.new-rate-section, .new-contract-section {
    background-color: #FFFFFF;
}

.new-rate-section h1, .new-contract-section h1 {
    float: left;
}

.new-rate-section input, .new-contract-section input {
    height: 30px;
}

.new-rate-section input[type=checkbox] {
    height: unset !important;
    margin-right: 5px;
}

.new-rate-section select, .new-contract-section select {
    height: 30px;
}

.new-rate-section .row-details, .new-contract-section .row-details {
    margin-left: 1px;
}

.new-rate-heading {
    float: left;
    margin-top: 20px;
    margin-left: 20px;
}

.reviewSamples .rate-details-heading-black {
    width: 100%;
    text-align: center;
}

.segmented-button label {
    width: 100%;
    cursor: pointer;
    height: 40px;
    text-align: center;
    padding-top: 10px;
    font-weight: normal !important;
    background: #FFFFFF;
    border-radius: 15px;
    border: #7F7F7F solid 1px;
}

.segmented-download label {
    width: 100%;
    height: 30px;
    padding-top: 5px;
}


.segmented-button label.active {
    border: #3385ff solid 1.5px;
    font-weight: bold !important;
    border-radius: 15px;
    background: #3385ff;
    color: #FFFFFF;
}

.segmented-button label:active {
    border: #3385ff solid 1.5px;
    font-weight: bold !important;
    border-radius: 15px;
    color: #FFFFFF;
    background: #3385ff;
}

.segmented-button input:checked + label {
    border: #3385ff solid 1.5px;
    font-weight: bold !important;
    border-radius: 15px;
    color: #FFFFFF;
    background: #3385ff;
}

.segmented-button input:disabled + label {
    border: grey solid 1.5px;
    border-radius: 15px;
    color: #FFFFFF;
    background: grey;
}

.segmented-button input:checked + label .icon-box {
    display: none;
}

.segmented-button label .icon-box {
    display: inline;
}

.segmented-button input:checked + label .icon-tick {
    display: inline;
}

.segmented-button label .icon-tick {
    display: none;
}

.cost-detail-input {
    height: 18px;
}

.nav-pills-container {
    width: 100%;
    overflow-x: auto;
}

/*Autocomplete styling*/
.ui-autocomplete {
    max-height: 300px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding to account for vertical scrollbar */
    padding-right: 20px;
    text-align: left !important;
}

#rule11SearchModal label {
    font-weight: bold;
    margin-bottom: unset !important;
}

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

#searchModal .ui-autocomplete {
    max-height: 300px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding to account for vertical scrollbar */
    text-align: left !important;
    /* font-size: 10px; */
}


/* Side Menu Styling*/

.content-parent {
    width: calc(100% - 210px);
    min-height: 100%;
    margin-right: 10px;
    position: relative;
    float: right;
    /* margin-top: 100px; */

}

.containerrr {
    width: 99%;
    height: 100%;
}


.sidenav-parent {
    width: 190px;
    position: relative;
    /* margin-top: 200px;  */
}

.dashboard-volume {
    margin-top: 3px;
    font-size: 12px;
}

.nav-pills-no-modal > li > a {
    padding-top: 0px !important;
}

.page {
    /* display: block; */
    /* margin-top: 200px; */
}

.sidenav {
    height: 100%;
    width: 190px;
    position: fixed;
    z-index: 1;
    left: 0;
    background-color: #F7F9FA; /*#a9a9a9;*/
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 5px;
    margin-top: 38px;

}

.sidenav-content {
    margin-top: 34px;
}

.sidenav a {
    margin-top: 12px;
    padding: 0px 8px 0px 20px;
    text-decoration: none;
    font-size: 16px;
    color: #000000; /*#F8F4E3;*/
    display: block;
    transition: 0.3s;
}

.link {
    width: 16px;
    height: 16px;
    margin-right: 10px;
}

.sidenav a.active {
    color: #3385ff;
    font-weight: bold;
}

.sidenav .active .link {
    /* width:  23px;
    height: 23px; */
}


a.logo {
    padding: 25px 8px 4px 16px;
    text-decoration: none;
    font-size: 20px;
    color: #F8F4E3;
    display: inline;
    float: left;
    transition: 0.3s;
}

a.logo img, #login-section img {
    width: 130px;
    /* height: 45px; */
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }

    .sidenav a {
        font-size: 18px;
    }
}

.accordion {
    margin-top: 10px;
    padding: 0 8px 0 20px;
    text-decoration: none;
    font-size: 16px;
    background-color: #F7F9FA;
    color: #000000;
    display: block;
    border: none;
    outline: none;
    transition: 0.4s;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
    color: #3385ff;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
    padding: 0 8px 0 30px;
    font-size: 17px;
    background-color: #F7F9FA;
    color: #F8F4E3;
    display: none;
    overflow: hidden;
}


/* Radio Buttons styling */
.segmented-button {
    padding: 12px;
}

.segmented-button input[type="radio"] {
    width: 0;
    height: 0;
    display: none;
}

/* Button styles */
.btn, .btn:hover, .btn:active, .btn:visited, .btn.focus, .btn:focus, .btn[disabled] {
    background-color: #3385ff !important;
    border-color: #3385ff !important;
    color: #FFFFFF;

    outline: unset !important;
    outline-offset: unset !important;
}

.btn-success, .btn-success:hover, .btn-success:active, .btn-success:visited, .btn-success.focus, .btn-success:focus, .btn-success[disabled] {
    background-color: #51ad84 !important;
    color: #FFFFFF;
    border-color: #51ad84 !important;
}

.btn-link, .btn-link:hover, .btn-link:active, .btn-link:visited, .btn-link.focus, .btn-link:focus, .btn-link[disabled] {
    border-color: transparent !important;
    text-decoration: underline !important;
    color: grey !important;
    background-color: transparent !important;
}


.btn-info, .btn-info:hover, .btn-info:active, .btn-info:visited, .btn-info.focus, .btn-info:focus, .btn-info[disabled] {
    background-color: #7F7F7F !important;
    color: #FFFFFF;
    border-color: #7F7F7F !important;
}

.btn-compare, .btn-compare:hover, .btn-compare:active, .btn-compare:visited, .btn-compare.focus, .btn-compare:focus, .btn-compare[disabled] {
    background-color: #eeb211 !important;
    color: #FFFFFF;
    border-color: #eeb211 !important;
}

.btn-back, .btn-back:hover, .btn-back:active, .btn-back:visited, .btn-back.focus, .btn-back:focus, .btn-back[disabled] {
    background-color: #eeb211 !important;
    color: #FFFFFF;
    border-color: #eeb211 !important;
}

.btn-close, .btn-close:hover, .btn-close:active, .btn-close:visited, .btn-close.focus, .btn-close:focus, .btn-close[disabled] {
    background-color: #ec1127 !important;
    color: #FFFFFF;
    border-color: #ec1127 !important;
}

.btn-cancel, .btn-cancel:hover, .btn-cancel:active, .btn-cancel:visited, .btn-cancel.focus, .btn-cancel:focus, .btn-cancel[disabled] {
    background-color: #efefef !important;
    border-color: #efefef !important;
    color: #7F7F7F;
    font-weight: bold;
}

.btn-search, .btn-search:hover, .btn-search:active, .btn-search:visited, .btn-search.focus, .btn-search:focus, .btn-search[disabled] {
    background-color: transparent !important;
    border-color: transparent !important;
    color: #000000;
    font-size: 15px;
    text-decoration: underline;
}

.btn-color-grey{
    color: grey !important;
}

.btn-what-if, .btn-what-if:hover, .btn-what-if:active, .btn-what-if:visited, .btn-what-if.focus, .btn-what-if:focus, .btn-what-if[disabled] {
    background-color: transparent !important;
    border-color: transparent !important;
    color: #339966;
    font-size: 15px;
    text-decoration: underline;
}


.btn-lock, .btn-lock:hover, .btn-lock:active, .btn-lock:visited, .btn-lock.focus, .btn-lock:focus, .btn-lock[disabled] {
    background-color: #EC5428 !important;
    color: #FFFFFF;
    border-color: #EC5428 !important;
}

.btn-dashboard {
    width: 115px !important;
}

.btn-default, .btn-default:hover {
    color: #333 !important;
    background-color: #fff !important;
    border-color: #ccc !important;
}

.btn-primary {
    color: #fff !important;
    background-color: #337ab7 !important;
    border-color: #2e6da4 !important;
}

.btn-passive, .btn-passive:hover, .btn-passive:active, .btn-passive:visited, .btn-passive[disabled] {
    background-color: #b3d1ff !important;
    color: #FFFFFF;
    border-color: #b3d1ff !important;
}

.btn-width-140 {
    width: 140px;
}

.font-bold {
    font-weight: bold;
}

.font-normal {
    font-weight: normal !important;
}

.screenshot-content canvas {
    border: solid 1px red;
    padding: 5px;
}

.padding-right-btn-link{
    padding-right: 23px;
}

/* Pagination style */
.pagination_H {
    margin: 0;
    padding: 0;
}

.pagination_H li {
    display: inline;
    padding: 6px 10px 6px 10px;
    border: 1px solid #ddd;
    margin-right: -1px;
    font: 15px/20px Arial, Helvetica, sans-serif;
    background: #FFFFFF;
    box-shadow: inset 1px 1px 5px #F4F4F4;
}

.pagination_H li a {
    text-decoration: none;
    color: rgb(89, 141, 235);
}

.pagination_H li.first {
    border-radius: 5px 0px 0px 5px;
}

.pagination_H li.last {
    border-radius: 0px 5px 5px 0px;
}

.pagination_H li:hover {
    background: #CFF;
}

.pagination_H li.active {
    background: #F0F0F0;
    color: #333;
}

.tratics-footer {
    width: 100%;
    height: 100px;
    margin: 0;
    padding: 0;

    font-size: 12px;
    color: #7F7F7F;
}

.multiple-link-options{
    background-color: #FFEBEB;
}

.fsc-change {
    margin-top: 4px;
}

.best-rate label {
    margin-bottom: unset !important;
}

.best-rate input, .best-rate select {
    height: 27px;
    padding-left: 8px !important;
}

.best-rate .ms-options-wrap button {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding-left: 6px !important;
}

.select2-container--default .select2-selection--single {
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    height: 27px !important;
}

.best-rate input[type=checkbox] {
    height: unset !important;
}


.best-rate-recent-search-margin-top {
    margin-top: 8px;
}


.buysheet label {
    margin-bottom: unset !important;
}

.buysheet input, .buysheet select {
    height: 27px;
    padding-left: 8px !important;
}

.buysheet .ms-options-wrap button {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding-left: 6px !important;
    height: 27px;
}


.buysheet input[type=checkbox] {
    height: unset !important;
}

.reference-files .mileages label {
    margin-bottom: unset !important;
    margin-top: unset !important;
}

.reference-files .mileages input, .reference-files .mileages select {
    height: 27px;
}

.reference-files .btn {
    margin-left: 0 !important;
}

.reference-files input[type="radio"] {
    height: unset !important;
    margin-right: 5px;
}

.reference-files input[type="checkbox"] {
    height: unset !important;
}

.reference-files .segmented-button {
    padding: unset !important;
    padding-top: 22px !important;
}

.reference-files .segmented-button label {
    height: 40px !important;
    padding-top: 10px !important;
}

.reference-files .checkbox-padding-left {
    padding-left: 21px !important;
}

.carbon-tax-radio-buttons input[type="radio"] {
    margin-top: 2px !important;
}

.carbon-tax-radio-buttons span {
    margin-right: 5px;
}

.carbon-tax-radio-buttons .second-span {
    margin-left: 30px;
}

.col-height-55 {
    height: 55px;
}

.input-height-tight {
    height: 25px;
}

.height-20{
    height: 20px;
}



.tratics-footer a {
    text-decoration: none;
    color: #7F7F7F;
}

.copy-image {
    width: 24px !important;
    height: 24px !important;
}

.icon-svg-small{
    width: 15px !important;
}

.cursor-default {
    cursor: default !important;
}

.manager-page-icons {
    width: 15px !important;
    height: 15px !important;
}

.icons-block {
    display: block;
}

.icons-inline {
    width: 16px !important;
    height: 16px !important;
}

.icons-block {
    width: 25px !important;
    height: 25px !important;
}

.item-protocol-rate {
    color: #5B87F7;
}

.bg-white{
    background: #FFFFFF;
}

.rate-red {
    color: red;
}

.rate-green {
    color: #00b300;
}

.rate-blue {
    color: #0000b3;
}

.rate-type-managed-contracts {
    color: #008000;
}

.progress-indicator > li .bubble-active-img {
    display: none;
}

.progress-indicator > li.info .bubble {
    color: #3385ff !important;
}

.progress-indicator > li.info .bubble, .progress-indicator > li.info .bubble:after, .progress-indicator > li.info .bubble:before {
    background-color: #3385ff !important;
    border-color: #25135d;
}

.progress-indicator > li.info .bubble-active-img {
    display: block;
}

.progress-indicator > li.info-final > .bubble {
    border-radius: 0 !important;
}


.bubble-active-img {
    width: 20px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 999999999999999999999;
}


.text-bold {
    font-weight: bold;
}

.text-normal {
    font-weight: normal !important;
}

.text-underline {
    text-decoration: underline;
}

.column-no-wrap {
    white-space: nowrap;
}

.support-ticket-modal label {
    font-weight: normal !important;
}

.rule-11-index-check-box {
    margin-left: 3px !important;
    margin-right: 5px !important;
}

.text-black {
    color: black !important;
}

.ui-tooltip {
    white-space: pre-line;
}

/*Confirm modal*/
.confirm-modal {
    /* height: 30%; */
    width: 50%;
    position: absolute;
    bottom: 0;
    right: 50px;
}

.centered-modal{
    display: flex;
    align-items: center;
    min-height: 100vh;
}

.confirm-modal-content {
    text-align: left;
    padding: 15px;
}

.confirm-modal .modal-footer {
    width: 100%;
}

.confirm-modal-content .rate-details-heading {
    margin-left: 0px;
}

.standard-modal {
    padding: 20px;
}

textarea {
    resize: none;
}

.support-ticket-file-btn {
    background: transparent;
    border: none;
    color: #3385ff;
}

/*Quote*/
.quote-modal {
    background-color: #FFFFFF;
    overflow-y: auto;
    position: relative;
}

.quote-content {
    position: relative;
    text-align: left;
}

.quote-content input {
    width: 100%;
    margin-left: 5px !important;
    padding-left: 5px;
    margin-top: 2px;
    border-radius: 3px;
    border: solid 1px #cccccc;
}

.xs-rate-container {
    background-color: #FFFFFF;
    padding: 5px;
    margin-bottom: 10px;
}

.rate-item {
    cursor: pointer;
    padding-bottom: 5px;
    margin: 5px;
    border-bottom: solid 2px #ccc;
}


.checkbox-tariff, .checkbox-rate {
    float: right;
    margin-top: 20px !important;
}

.checkbox-notification {
    float: right;
    margin-top: 7px !important;
    margin-right: 10px !important;
}

.checkbox-rule-11 {
    margin: 14px 3px 0 0 !important;
}

.check-all-rule-11 {
    float: right;
    margin: 7px 0 0 10px !important;
}


.checkbox-tariff, .checkbox-rate {
    float: right;
    margin-top: 20px !important;
}


.notification-link {
    text-decoration: underline !important;
    color: grey !important;
    margin-right: 10px;
}

.link-element {
    text-decoration: underline !important;
    color: #3385ff !important;
    cursor: pointer !important;
}


/*.row-notification-not-seen {
    background-color: #e0eaff !important;
}

.row-notification-selected {
    background-color: #FFD5D4 !important;
}*/

.row-notification-not-seen {
    /*background-color: #f6f7f7 !important;*/
    font-weight: bold;
}

.notification-seen-label {
    display: none;
    color: red;
    margin-top: -2px;
    font-size: 11px;
    position: absolute;
    margin-left: 10px;
}

.row-notification-not-seen .notification-seen-label {
    display: inline;
}

.row-notification-selected {
    background-color: #e0eaff !important;
}

.notification-part-2-td {
    width: 170px;
}

.row_selected {
    /*background-color: #dde1ee !important;*/
    background-color: #e0eaff !important;
}

.rate-margin-top td div:nth-child(2), .rate-margin-top td div:nth-child(3) {
    margin-top: 10px;
}

/*Modal group edit */
#modalGroupEdit .modal-content {
    text-align: left;
}

#modal-group-edit {
    margin: 15px;
    width: 150px;
}

.modal-import .modal-dialog, #importRatesModal .modal-dialog, #importVolumesModal .modal-dialog {
    width: 100%;
}

.modal-width-600 {
    width: 600px !important;
}

.modal-width-xl {
    width: 80%;
}

#modalRatesVolume .modal-dialog {
    width: 90%;
}

.modal-notifications .modal-dialog {
    width: 80%;
}

.modal-import .modal-body, #importRatesModal .modal-body, #importVolumesModal .modal-body {
    overflow-x: auto;
    max-width: 1900px;
}

.modal-import input, #importRatesModal input, #bulk-result input, #importVolumesModal input {
    width: 100%;
    border-radius: 3px;
}

.modal-import .error, #importRatesModal .error, #bulk-result .error, #importVolumesModal .error {
    color: #e60000 !important;
    border-color: #e60000 !important;
}

.modal-import .success-rate, #importRatesModal .success-rate, #bulk-result .success-rate, #importVolumesModal .success-rate {
    color: #000000 !important;
}

.modal-import td, .modal-import td input{
    font-size: 12px !important;
}

.modal-95vh {
    height: 95vh;
}

.modal .scrollbox {
    overflow-y: auto;
}

.modal .scrollbox-height-minus-220 {
    max-height: calc(100vh - 220px);
}

.modal .scrollbox-height-minus-400 {
    /*400 is size of footer*/
    max-height: calc(100vh - 400px);
}

.bulk-result-content {
    font-size: 9px;
}

.search-section .tariff-linked-item .rate-limitation-rate-basis {
    background: #ffe6e6;
}

.single-line {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.global-request-button {
    float: right;
}

.edit-lanes-table input {
    width: 50px !important;
}

#editContractLanesModal td, #editContractLanesModal th, #editContractLanesModal input {
    font-size: 10px !important;
}

#modalNotificationsRule11 .res {
    font-size: 12px !important;
}

.currencyinput {
    border: 1px inset #ccc;
    width: 100%;
}

.currencyinput input {
    border: 0;
}

#searchModal input, #searchModal select {
    height: 26px !important;
}

#searchModal label {
    float: left;
    color: #000000;
    font-size: 14px;
    font-weight: normal;
}

.modal-close-button {
    margin-right: 20px !important;
    margin-top: 20px;
}

.ul-access {
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 2px;
    font-size: 16px;
    text-align: left;
    list-style: none;
    background-color: transparent;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
}

.ul-access li {
    cursor: pointer;
}

.access-segmented-button {
    margin: 5px 5px;
}

.access-segmented-button input[type="radio"] {
    width: 0px;
    height: 0px;
    display: none;
}

.access-segmented-button label {
    width: 70%;
    cursor: pointer;
    text-align: left;
    padding: 5px 5px;
    display: block;
    background: #FFFFFF;
    border: #7F7F7F solid 1px;
}

.access-segmented-button label.active {
    border: #3385ff solid 1px;
    background: #FFFFFF;
    color: #3385ff;
}

.access-segmented-button label:active {
    border: #3385ff solid 1px;
    color: #3385ff;
    background: #FFFFFF;
}

.access-segmented-button input:checked + label {
    border: #3385ff solid 1px;
    color: #3385ff;
    background: #FFFFFF;
}


.limit-segmented-button {
    margin: 5px 5px;
}

.limit-segmented-button input[type="radio"] {
    width: 0px;
    height: 0px;
    display: none;
}

.limit-segmented-button label {
    width: 70%;
    cursor: pointer;
    text-align: left;
    padding: 5px 5px;
    display: block;
    color: #7F7F7F;
    font-weight: normal;
}

.limit-segmented-button label.active {
    color: #3385ff;
}

.limit-segmented-button label:active {
    color: #3385ff;
}

.limit-segmented-button input:checked + label {
    color: #3385ff;
}

.xs-close-button {
    float: right;
    width: 50%;
    text-align: right;
}

.xs-close-button button {
    width: 100% !important;
    text-align: right;
    padding-right: 19px;
    font-size: 20px !important;
}

.access-list {
    max-height: 230px;
    overflow-y: auto;
}

.access-list li {
    text-align: left;
}

.access-label {
    color: #7F7F7F !important;
    font-size: 13px;
    font-weight: normal !important;
}

.side-padding-5 {
    padding-left: 5px;
    padding-right: 5px;
}

.side-margin-10 {
    margin-left: 10px;
    margin-right: 10px;
}

.btn-search-dashboard {
    float: right;
    margin: 0px !important;
    margin-top: -7px !important;
}

.modal-rates-filter .modal-dialog, .modal-rates-filter .modal-body, .modal-rates-filter .modal-content {
    width: 900px;
}

.btn-filter-rates {
    margin: 0 !important;
    margin-top: -7px !important;
}

.table-rule-11 thead, .table-rule-11 tbody {
    background-color: transparent;
}

.table-rule-11 th {
    color: #7F7F7F;
    font-size: 15px;
    font-weight: normal;
    border-bottom: none !important;
}

.table-rule-11 td {
    color: #000000;
    font-size: 13px;
    font-weight: normal;
}

.handling {
    display: none;
}

.checkbox-handling {
    color: #7F7F7F;
}


.checkbox-search-station {
    color: #7F7F7F;
    margin-top: 4px !important;
    margin-bottom: 40px;
}


.checkbox-search-station input {
    margin-top: -2px !important;
}

.checkbox-search {
    color: #7F7F7F;
    margin-top: 30px !important;
}

.checkbox-search input {
    margin-top: -2px !important;
}

.checkbox-handling input {
    height: 12px !important;
}

.waybill-content {
    width: 100%;
    max-height: 350px;
    overflow-x: auto;
}

.companies-select {
    float: right;
    width: 125px;
    height: 20px;
    margin-top: 10px;
    background-color: transparent;
    border-color: #ccc;
    border-radius: 3px;
    color: #000000;
    cursor: pointer;
    font-size: 15px;
}


.top-img {
    float: right;
    width: 35px;
    margin-top: 3px;
}

.neg-margin-top {
    margin-top: -20px;
}

.close-button-mg-right {
    margin-right: 10px;
}

.details-select {
    height: 35px;
    width: 190px;
}

#modalClients .modal-dialog {
    width: 600px;
}


#quotesModal .modal-dialog {
    width: 780px;
}

.company-detailed-info {
    margin-top: 10px;
    margin-bottom: 10px;
}

.chart-rates-input-container {
    width: 80%;
}

.chart-rates-input-container .rate-details-heading {
    margin-left: 0;
}

.input-width-50 {
    width: 50px;
}

.input-width-70 {
    width: 70px;
}

.selected-contract-container {
    /* max-height: 130px; */
    /* overflow-y: auto; */
    margin-left: 10px;
}

.charts-limit-list {
    cursor: pointer;
    padding-left: 22px;
}

.charts-rates-dropdown {
    height: 27px;
    color: black;
    font-weight: normal !important;
    border-radius: 5px !important;
    border-color: #ccc;
}


.compare-section-tight input[type=text] {
    height: 27px !important;
}

.compare-section-tight label {
    margin-bottom: 0 !important;
}

.rates-modal-dialog {
    width: 170px;
}

.buysheet-email-modal-dialog {
    /*width: 260px;*/
}

.rate-upload-templates a, .download-all-data a {
    margin-left: 15px;
}

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

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

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

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

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

.dsb-border-top {
    border-top: unset !important;
}

.dsb-borders {
    border: unset !important;
}

/*Canvas for chart*/
.canvas-container {
    position: relative;
    margin-bottom: 40px;
    width: 70% !important;
    height: 70% !important;
}

/*Canvas for chart in waybill*/
.waybills-canvas-container {
    position: relative;
    margin-bottom: 40px;
    width: 95% !important;
}

.waybill-charts .btn-group {
    color: #8c8c8c !important;
}

.btn-waybill-charts, .btn-waybill-charts:hover, .btn-waybill-charts:active {
    color: #8c8c8c !important;
    background-color: #FFFFFF !important;
    border-color: #8c8c8c !important;
}

.canvas-container .canvassds {
    position: relative;
    width: 100% !important;
    height: 100% !important;
}

.dashboard-section .item {
    padding: 2px 0px;
    border-bottom: #cccccc solid 2px;
    cursor: pointer;
}

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

.dashboard-section .xs-dashboard-container {
    margin: 0 0;
}

.dashboard-item-img img {
    width: 100%;
}

/* Text classes */
.text-right {
    text-align: right;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.dashboard-text-first {
    font-size: 12px;
}

.dashboard-text-first-bold {
    font-size: 12px;
    font-weight: bold;
}

.dashboard-text-second {
    font-size: 11px;
    font-weight: bold;
    color: #7F7F7F;
}


.dashboard-text-12 {
    font-size: 12px !important;
}

.dashboard-text-third {
    font-size: 10px;
    color: #7F7F7F;
}


.section-border-right {
    padding-right: 10px;
    border-right: #cccccc solid 1.5px;
}

.table-dashboard {
    display: table !important;
    margin-bottom: 0px;

}

.table-dashboard img {
    width: 40px;
    height: 40px;;
}

.dashboard-section-button {
    float: right;
    margin: 7px;
}

.table-contracts .row td:nth-child(1), .table-contracts .row td:nth-child(2) {
    padding-top: 20px;
}


.contract-expired-select {
    color: #444444;
}

.contract-current-select {
    color: #16324f;
}

.contract-future-select {
    color: #33563d;
}

.container-rates {
    height: 475px;
}

.container-analyses {
    height: 258px;
}

.container-contracts {
    height: 200px;
}

.progress-indicator li {
    cursor: pointer;
}


.progress-indicator .stacked-text {
    color: #000000;
}

.checkbox-quote {
    color: #000000;
    margin-top: 0px;
}

.checkbox-quote label {
    padding-left: 0px;
    margin-left: -4px;
}

.checkbox-quote input {
    margin-top: 2px;
}

.quote-heading {
    font-size: 15px;
    font-weight: bold;
    margin-top: 10px;
}

.quote-contents {
    height: 327px;
}

.quote-contents input {
    height: 24px;
    width: 100%;
    border: solid 1px #ccc;
    border-radius: 5px;
}

.quote-contents .next-item {
    position: absolute;
    bottom: 0;
    right: 12px;
}

.quote-section div {
    margin-top: 10px;
}

.settings-select2-container .select2-selection {
    height: 34px !important;
}

.settings-select2-container ul {
    z-index: 9999999999;
    position: absolute;
}

.quote-confirm-heading {
    color: #7F7F7F;
    font-size: 18px;
    margin-top: 10px;
}

.quote-confirm-content-heading {
    color: #000000;
    font-size: 13px;
    font-weight: bold;
}

.waybills-modal .modal-dialog {
    width: 950px;
}

.btn-waybills {
    margin-top: 25px;
}

.waybills-table {
    font-size: 11px !important;
}

.ms-search input[type="checkbox"] {
    height: unset !important;
}

#chart-waybill-years input[type="checkbox"] {
    height: unset !important;
}

.table-tight {
    margin-top: 7px;
}

.table-tight > tbody > tr > td {
    padding: 0px;
}

.table-no-padding-left > tbody > tr > td {
    padding-left: 0px;
}

.table-normal-text > tbody > tr > td {
    font-size: 12px;
}


.border-top {
    padding-top: 5px;
    border-top: solid 1px #000000;
}

.border-right {
    padding-right: 5px;
    border-right: solid 1px #cccccc;
}

.border-bottom {
    padding-bottom: 5px;
    border-bottom: solid 1px #cccccc;
}

.border-left {
    padding-left: 5px;
    border-left: solid 1px #000000;
}

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

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

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

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

.margin-horizontal-5 {
    margin-top: 5px;
    margin-bottom: 5px;
}

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

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

.dsb-side-margin {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.dsb-side-padding {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

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

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

.modes-left-padding {
    padding-left: 8px;
}

.modes-right-padding {
    padding-right: 20px;
}

#buysheetConsumersGroupModal label {
    font-weight: normal !important;
}

.font-size-18 {
    font-size: 18px;
}

.border-color-grey {
    border-color: #ccc !important;
}

.small-rate-details {
    margin-left: 5px;
}

.buysheet label {
    font-weight: normal;
}

.select2-suppliers {
    width: 100% !important;
}

.btn-buysheet {
    width: 100%;
    margin-top: 5px;
}

.select2-selection--multiple {
    height: 30px !important;
}

.select2-container {
    width: 100% !important;
}

.select2-search__field {
    margin-top: 0 !important;
}

.select2-selection {
    min-height: unset !important;
    border: 1px solid #ccc !important;
    height: 27px !important;
}

.select2-selection__choice {
    margin-top: 2px !important;
}

.hidden-normal {
    display: none;
}

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

.select2-suppliers .select2-container {
    width: 100% !important;
}

.details-rates-note {
    margin-top: 10px;
}

.small-rate-details .rate-details-heading,
.small-rate-details .rate-details-heading-black,
.small-rate-details .rate-details-heading-bold {
    font-size: 14px !important;
}

.cursor-pointer {
    cursor: pointer;
}

.cursor-default {
    cursor: default;
}


.underline-hover:hover {
    text-decoration: underline;
}

.table-notification-expire tr {
    cursor: pointer;
    padding: 2px 0;
    border-bottom: #cccccc solid 2px;
}

.modal-change-input {
    width: 95% !important;
    height: 30px;
    margin: 5px;
}

.modal-change-btn {
    width: 95% !important;
    height: 30px;
    margin: 5px;
}

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

.preference-icons {
    margin: 5px;
}

.rulse11surchargeType {
    display: inline;
    width: 90% !important;
}


.rule11active {
    margin: 0 !important;
}

.favourite-image {
    width: 20px;
    margin-top: -4px;
    margin-left: 2px;
}

.favourite-image-bestrate {
    width: 30px;
    margin-top: -4px;
    margin-left: 2px;
}

.competitive-analyse-details {
    margin-top: 120px;
}

.navbar-collapse {
    padding-left: 0 !important;
}

.reference-radio-buttons {
    margin: 15px 0;
}

.reference-radio-buttons label {
    color: #7f7f7f !important;
    margin-right: 35px;
}

.new-rate-radio-buttons {
    margin: 15px 0;
}

.new-rate-radio-buttons label {
    color: #7f7f7f !important;
    margin-right: 35px;
}

.new-rate-radio-buttons label:first-child {
    margin-left: 16px;
}

#rule11SearchHistoryModal .modal-content {
    min-height: 373px;
}

.scatter-row select {
    height: 35px !important;
}

.live-tariffs-span {
    color: red;
    position: absolute;
    font-size: 11px;
    margin-left: 2px;
    font-weight: bold;
}

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


.error-results-message {
    color: #3385ff;
}

.comparison-input {
    width: 50% !important;
    display: inline !important;
}

.comparison-margin-left {
    margin-left: -6px;
}

.comparison-margin-top {
    margin-top: 10px;
}

.compare-no-data {
    display: none;
    color: #cc3300;
}

#modalUserActive .modal-content {
    width: 450px;
    margin: auto;
}

.dsb-scroll-x {
    overflow-x: hidden;
}

.modal-content-tight {
    width: 450px;
    margin: auto;
}

.radio-charts input {
    display: none;
}

.radio-charts input:checked + label {
    color: #5B87F7;
}

.bnt-width-70 {
    width: 70px !important;
}

.btn-width-100 {
    width: 100px;
}

.btn-width-115 {
    width: 115px;
}

.width-unset {
    width: unset !important;
}

.height-unset {
    height: unset !important;
}

.btn-width-125 {
    width: 125px;
}

.waybill-reverse {
    margin-top: 31px !important;
}

.table-lane-column {
    width: 20% !important;
}

.btn-width-150 {
    width: 150px;
}

.buysheet-link-buttons {
    margin-top: 29px;
}

.contract-details-row {
    margin-bottom: 3px;
}

.modal-buysheet-edit-content {
    width: 400px;
}

.best-rate-search-input {
    width: 25% !important;
    display: inline !important;
}

.best-rate-inputs-container {
    display: inline;
    width: 75% !important;
}

.btn-width-215 {
    width: 215px;
}

.section-wtd-75 {
    margin-left: 0;
    width: 75%;
}

.quote-dt-margin-top {
    margin-top: 10px;
}

.quote-dt-prev-offer-margins {
    margin-top: 20px;
    margin-bottom: 20px;
}

.quote-dt-prev-offer-expire-label {
    position: absolute;
    margin-left: 45px;
}

.quote-dt-message-section {
    background-color: #eff3f5;
    color: #5B5B5B;
    width: 100%;
    border-radius: 10px;
    padding: 5px;
    min-height: 100px;
    text-align: left;
}

.quote-dt-offer-section {
    background-color: #16324f;
    border-radius: 10px;
    border: 1px solid transparent;
    padding: 5px;
}

#correspondences {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 10px;

}

.bubble-content {
    max-width: 60%;
    width: 46%;
    padding: 12px 16px;
    border-radius: 12px;
    line-height: 1.4;
    position: relative;
}

/* 3) Different backgrounds for latest vs previous */
.quote-last-bubble {
    background-color: #16324f;
    color: #fff;
}

.quote-dt-previous-offer-section {
    background-color: #eff3f5;
    color: #333;
}

.quote-message-bubble{
    background-color: #5B5B5B ;
}

.correspondence-left {
    align-self: flex-start;

}

.correspondence-right {
    align-self: flex-end;
}

.bubble-content .timestamp {
    display: block;
    margin-top: 8px;
    font-size: 0.75em;
    opacity: 0.6;
}

.quote-dt-previous-offer-section {
    background-color: #CCCCCC !important;
}

.quote-dt-top-bottom-margin {
    margin-top: 10px;
    margin-bottom: 10px;
}

.quote-dt-white-text {
    color: #FFFFFF;
}

.font-size-13 {
    font-size: 13px;
}

.font-size-16 {
    font-size: 16px;
}

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

.checkbox-link-tariff{
    margin-left: 8px !important;
}

.width-110{
    width: 110px;
}



.volume-input {
    width: 35px;
    height: 25px;
    border-radius: 4px;
}

.volume-total {
    width: 50px;
    height: 25px;
    border-radius: 4px;
}

.xs-inline-block {
    display: none;
}

.company-name-td {
    width: 4%;
}

.rule11-lane-details {
    width: 25%;
}

.table-sort {
    margin-bottom: 0 !important;
}

.table-sort > tbody > tr > td {
    background-color: #F7F9FA !important;
    font-size: 14px;
}

.rule11-note-details {
    width: 25%;
}

.rule11-car-type-details {
    width: 10%;
}

.rule11-rate-details {
    width: 20%;
}

.rule11-railroad-details {
    text-align: center;
}


.table-search-rule-11 {
    border-radius: 10px;
    border: 1px solid #cccccc;
    margin-bottom: 0 !important;
    /* border-collapse: separate; */
}

.search-rule-11-footer {
    margin-top: -2px !important;
}

.search-rule-11-footer tbody {
    background-color: #4f484d !important;
    color: #F7F9FA;
}

#modalRatesVolume tbody > tr > td {
    font-size: 12px;
}


.search-rule-11-footer > tbody > tr > td {
    font-size: 12px;
}

.rule-11-error-first {
    background-color: #dde1ee !important;
}

.rule-11-error-second {
    background-color: #aab4d4 !important;
}

.rule-11-error input {
    /*background-color: #2b4a6d !important;*/
}

.rule11-lane-footer-info {
    margin-top: 3px;
    /*color: #7F7F7F;*/
}

.rule11-transit-info {
    color: #7F7F7F;
    margin-top: 25px;
}

.rule11-text {
    margin-top: 25px;
    /* font-size: 16px; */
    /*color: #0066ff;*/
}


.table-search-rule-11 > tbody > tr > td {
    /* border-top: 1px solid #cccccc !important; */
}

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

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

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

.quotes-modal-header {
    font-weight: bold;
    padding: 10px;
    margin: -16px;
}

.notification {
    color: white;
    text-decoration: none;
    position: relative;
    display: inline-block;
    border-radius: 50%;
}


.notification .badge {
    position: absolute;
    top: -3px;
    right: -7px;
    padding: 4px 10px;
    border-radius: 50%;
    background-color: transparent;
    color: red;
}

.contract-detail-file-buttons {
    margin-top: 99px;
}

.contract-detail-file-buttons-2 {
    margin-top: 40px;
}

.contract-detail-div-container {
    height: 240px;
}

.contract-detail-div-bottom {
    position: absolute;
    bottom: 0;
    border: none !important;
    width: 93%;
}

.filter-alert-span {
    padding-top: 7px;
}

.reminder-place {
    display: inline;
}

.contract-div-side-borders {
    border-style: solid;
    border-color: #C2C2C2;
    border-width: 0px 1px 0px 1px;
}

.contract-reminder-close-btn {
    color: red;
    position: absolute;
    font-size: 15px;
    margin-top: -6px;
    margin-left: 2px;
    font-weight: bold;
}

.contract-reminder {
    border: solid 0.5px #e6f0ff;
    padding: 2px;
    border-radius: 5px;
    background: #e6f0ff;
}

.checkbox-contract input {
    margin-top: -6px !important;
}

.modal-notifications .rate-details-heading,
.modal-notifications .rate-details-heading-black,
.modal-notifications .rate-details-heading-bold {
    font-size: 13px !important;
}

.what-if-input {
    width: 105px;
}

.what-if-table th {
    font-size: 14px;
}

.what-if-table .flexible-th {
    background-color: #e6f0ff !important;
}


.what-if-table td {
    font-size: 15px;
}

.what-if-table input {
    font-size: 15px;
    height: 20px !important;
}

.notification-compare-labels {
    padding-top: 12px;
}

.search-text-red {
    color: #ED1C24;
}

.search-text-red span {
    color: #ED1C24 !important;
}

.search-advance-error-field {
    border: 2px solid #ED1C24;
}

.search-results-ol li {
    margin-top: 10px;
}

.right-search-buysheet-buttons {
    margin-top: 35px;
}

.reference-recent-search-btn-container {
    width: 70px;
}

.reference-recent-search-aux-icon-container {
    width: 30px;
    padding-top: 13px !important;
}

.font-11 {
    font-size: 11px;
}

.font-12 {
    font-size: 12px !important;
}

.font-14 {
    font-size: 14px !important;
}

.color-red {
    color: red !important;
}

.font-active {
    color: #00b300;
}

.font-expired {
    color: red;
}

.section-width-800 {
    width: 800px;
}

.section-height-400 {
    height: 400px;
}

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

#modalClientDates .modal-content {
    width: 400px;
}

.tariff-search-table-container{
    height: 40vh;
}

.import-input-bigger-wtd{
    width: 120px !important;
}

.bg-transparent{
    background-color: transparent !important;
}

.linePreloader {
    width: 100%;
    height: 1.5px;
    background: linear-gradient(to right, #3385ff, #3385ff);
    background-color: transparent;
    margin: auto;
    margin-bottom: 5px;
    border-radius: 4px;
    background-size: 20%;
    background-repeat: repeat-y;
    background-position: -25% 0;
    animation: scroll 1s ease-in-out infinite;
}

.limited-characters {
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@keyframes scroll {
    50% {
        background-size: 80%
    }
    100% {
        background-position: 125% 0;
    }
}

.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}


.col-xs-15ths,
.col-sm-15ths,
.col-md-15ths,
.col-lg-15ths {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-15ths {
    width: 60%;
    float: left;
}

.col-xs-20ths,
.col-sm-20ths,
.col-md-20ths,
.col-lg-20ths {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-20ths {
    width: 80%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }

    .col-sm-15ths {
        width: 60%;
        float: left;
    }

    .col-sm-20ths {
        width: 80%;
        float: left;
    }

    .md-width-140{
        width: 140px;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }

    .col-md-15ths {
        width: 60%;
        float: left;
    }

    .col-md-20ths {
        width: 80%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }

    .col-lg-15ths {
        width: 60%;
        float: left;
    }

    .col-lg-20ths {
        width: 80%;
        float: left;
    }
}