/* here you can put your own css to customize and override the theme */
.imgLogo {
    height: 45px;
    margin-left: -10px;
    margin-top: 3px;
    width: auto;
}

.txtBoxHeader {
    display: table-row-group;
}

.bolderText {
    font-weight: 700;
}

.offsetTop {
    margin-top: 8px;
}

.rightText {
    text-align: right;
}

.bg-light-green {
    /*background: #7fea7b  !important;*/
    background: rgba(139,238,125,0.5)  !important;
}

.bg-light-green:hover {
    background: red;
}

.bg-light-red {
    /*background: #ea7b7b  !important;*/
    background: rgba(234,123,123,0.5)  !important;
}

.bg-light-yellow {
    /*background: #ea7b7b  !important;*/
    background: rgba(234,217,54,0.5)  !important;
}


@media only screen and (max-width: 990px) {

    .rightText {
        text-align: left;
    }

    .offsetTop {
        margin-top: 0px;
    }
}

.stats-offset-top {
    margin-top: 0px;
}

@media only screen and (max-width: 990px) {

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

.code-font {
    font-family: 'Oxygen Mono', monospace;
    font-size: 1em !important;
}

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

.voucherContainer {
    position: relative;
    text-align: center;
}

.voucherImage {
    height: 100%;
    width: 100%;
    max-width: 500px;
    max-height: auto;
}

.voucherAmount {
    bottom: 50%;
    color: #000;
    font-size: 250%;
    line-height: 150%;
    left: 2%;
    position: absolute;
    text-align: center;
    width: 100%;
}

.voucherCode {
    bottom: 11%;
    color: #000;
    font-size: 200%;
    line-height: 100%;
    margin-right: -15%;
    position: absolute;
    left: 0%;
    text-align: center;
    width: 100%;
}

@media only screen and (max-width: 1281px) {

    .voucherAmount {
        bottom: 50%;
        font-size: 225%;
        line-height: 150%;
        left: 2%;
    }

    .voucherCode {
        bottom: 11%;
        font-size: 175%;
        line-height: 100%;
    }
}

@media only screen and (max-width: 1201px) {

    .voucherAmount {
        bottom: 48%;
        font-size: 225%;
        line-height: 150%;
        left: 2%;
    }

    .voucherCode {
        bottom: 10%;
        font-size: 175%;
        line-height: 100%;
    }
}

@media only screen and (max-width: 1101px) {

    .voucherAmount {
        bottom: 48%;
        font-size: 180%;
        line-height: 150%;
        left: 2%;
    }

    .voucherCode {
        bottom: 11%;
        font-size: 130%;
        line-height: 100%;
    }
}


@media only screen and (max-width: 991px) {

    .voucherAmount {
        bottom: 50%;
        font-size: 280%;
        line-height: 150%;
        left: 2%;
    }

    .voucherCode {
        bottom: 12%;
        font-size: 200%;
        line-height: 100%;
    }
}

@media only screen and (max-width: 561px) {

    .voucherAmount {
        bottom: 49%;
        font-size: 280%;
        line-height: 150%;
        left: 2%;
    }

    .voucherCode {
        bottom: 12%;
        font-size: 200%;
        line-height: 100%;
    }
}

@media only screen and (max-width: 491px) {

    .voucherAmount {
        bottom: 48%;
        font-size: 250%;
        line-height: 150%;
        left: 2%;
    }

    .voucherCode {
        bottom: 11%;
        font-size: 200%;
        line-height: 100%;
    }
}

@media only screen and (max-width: 421px) {

    .voucherAmount {
        bottom: 48%;
        font-size: 220%;
        line-height: 150%;
        left: 2%;
    }

    .voucherCode {
        bottom: 11%;
        font-size: 180%;
        line-height: 100%;
    }
}

@media only screen and (max-width: 381px) {

    .voucherAmount {
        bottom: 48%;
        font-size: 190%;
        line-height: 150%;
        left: 2%;
    }

    .voucherCode {
        bottom: 11%;
        font-size: 140%;
        line-height: 100%;
    }
}

@media only screen and (max-width: 351px) {

    .voucherAmount {
        bottom: 48%;
        font-size: 170%;
        line-height: 150%;
        left: 2%;
    }

    .voucherCode {
        bottom: 11%;
        font-size: 130%;
        line-height: 100%;
    }
}

.btnWidthLarge {
    width: 250px;
}

.btnWidthMedium {
    width: 150px;
}

.btnWidthSmall {
    width: 110px;
}

.btnWidthAuto{
    margin-bottom: 5px;
}


.btn-add-folder {
    margin-bottom: 10px;
}

.btnOffsetTop {
    margin-top: 0px;
}

@media only screen and (max-width: 991px) {

    .btnWidthLarge {
        width: 100%;
    }

    .btnWidthMedium {
        width: 100%;
    }

    .btnWidthSmall {
        width: 100%;
    }

    .btnWidthAuto{
        width: 100%;
    }

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

.sortable th {
    cursor: pointer;
}

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

.footRow {
    background-color: #e4e4e4;
}

tr.footRow td {
    border-top: 1px solid black !important;
}

.footRowZarada {
    background-color: #afd6bf;
}

tr.footRowZarada td {
    border-top: 1px solid black !important;
}

.footRowProfit {
    background-color: #eeeccd;
}

tr.footRowProfit td {
    border-top: 1px solid black !important;
}

tr.headRow th {
    border-bottom: 1px solid black !important;
}

.treeIcon:hover
{
    background-color: #4591d1;
}

.imageThumbContainer{
    float: left;
    margin-top: 10px;
    margin-left: 10px;
    border: 1px solid #525252;
}

.rulesPDFContainer {
    float: left;
    margin-top: 6px;
}

.imageThumbCover
{
    max-height: 150px;
    width: auto;
}

.imageThumbGallery
{
    width: auto;
    max-height: 170px;
}

.btnThumbsOffset{
    margin-left: 20px;
    margin-top: 3px;
    margin-bottom: 3px;
}

.infoValueLabel {
    margin-top: 8px;
    font-weight: bold;
    display: block;
}

.txtSuccess {
    border: 2px solid #13a766;
}

.txtError {
    border: 2px solid #f12525;
}

.errorMessage{
    color: red;
}

.lblWhite{
    color: white;
}

.chkClass input {
    width: 17px;
    height: 17px;
    color: white;
}

.chkClass label {
    display: inherit;
    color: white;
    padding-left: 5px;
    font-weight: 400;
    font-size: 0.9em;
    position: relative;
    top: -3px;
}

.icon-ok{
    color: green;
}

.icon-fail{
    color: red; 
}

.defaultPointer{
    cursor: not-allowed;
}

.adjustTop {
    margin-top: 5px;
}

.border {
    border: 1px solid grey;
    margin-bottom: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

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

.btnWinnerAdjust {
    margin-top: 120px;
}

@media only screen and (max-width: 1091px) {

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

.btnAddGalleryCenter {
    display: flex;
    justify-content: center;
    margin-top: 30px;
}

@media only screen and (max-width: 1022px) {

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

.emptyList {
    display: flex;
    justify-content: center;
}

.update-section-adjust{
    margin-top: 20px;
}

.attachment-list-item{
    text-decoration: none;
    /*list-style-type: none;*/
}

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

.padd-8{
    padding-right: 8px !important;
}

.chkClass input {
    position: relative;
    top: 5px;
    border: 2px solid #666;
    height: 20px;
    width: 20px;
}

.chkClass label {
    color: grey;
    padding-right: 20px;
    font-weight: 400;
    font-size: 1.1em;
    position: relative;
    top: 0px;
}

.reportTotal {
    border-top: 3px solid black;
    border-bottom: 3px solid black;
}

.currencyLabel {
    padding: 5px 10px;
    background: #2f353b;
    color:white;
}

.repeaterHead{
    border-top: 3px solid black;
    border-bottom: 3px solid black;
}

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

.borderless{
    border: none !important;
}

.klasa {
    right: 20px !important;
}

/* registered users section */

.formElements {
    /*float: left;*/
    /*width: 50%;*/
}

.userPermissionTitle {
    color: white;
    background: darkred;
    font-weight: bold;
    width: 100%;
    text-transform: uppercase;
    font-size: 15px;
}

.userPermissionBox {
    border: 1px solid grey;
    margin-bottom: 20px;
    padding: 0px !important;
}

.paddedCheckbox {
    margin-top: 5px;
    margin-left: 30px;
}

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

.pageCaption {
    width: 100%;
    height: 50px;
    padding-left: 15px;
    padding-top: 14px;
    font-family: "Open Sans";
    font-size: 15px;
    margin: 0px;
}

.passChangeHeading {
    margin-bottom: 20px;
    padding: 0px 10px 10px;
    border-bottom: 1px solid grey;
    color: #4c87b9;
    font-weight: 600;
}

.attachment-padd-left{
    padding: 8px;
}

.repeater-custom {
    border-top: none;
    border-left: none;
    border-right: none;
}

.padd-left-20{
    padding-left: 20px;
}


.position-relative{
    position: relative;
}

.position-absolute {
    position: absolute;
}

.btnReturn-position{
    position: absolute;
    top: 15px;
}
.attBreadcrumbs{
    font-size: 2rem;
    font-weight: bold;
}

.file-icon-size{
    width: 20px;
    height: 20px;
}

.upload-heading {
    font-size: 2rem;
    font-weight: bold;
}

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

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

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

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


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

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

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

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

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

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

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

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

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

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

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

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

.textbox-foldername{
    width: 30%;
    display: inline-block;
}

.height-20{
    height: 20px;
}

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

.float-right{
    float: right;
}

.btn-upload {
    padding: 0px !important;
    margin-bottom: 10px;
    margin-left: 15px;
}

.hidden-new-folder{
    margin-left: 15px;
    margin-bottom: 10px;
}

.newfolder-container{
    display: inline-block;
    position: absolute;
}

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

.interspace {
    margin: 0px 10px;
    font-size: 2rem;
}

.width-100{
    width: 100%;
}

.storage-space-viewer{
    text-align: right;
    margin-right: 40px;
}

.color-red{
    color: red;
}

.color-green {
    color: green;
}


/* dashboard style*/
.containerDash {
    width: 97%;
    margin: 2em auto;
    border: 1px solid black;
    background-color: #fff;
}

.headerDash {
    text-align: left;
    color: #ffffff;
    padding: 1.5em;
    background-color: #3598dc;
}

.containerBox {
    display: flex;
    justify-content: space-between;
    margin: 2em 1em;
}

.colBox {
    position: relative;
    width: 25%;
    height: 150px;
    background-color: aquamarine;
    /*border: 1px solid black;*/
    margin: 1em;
    padding-top: 30px;
    overflow: hidden;
}

.colBox-blue {
    background-color: #3598dc;
}

.colBox-red {
    background-color: #e7505a;
}

.colBox-purple {
    background-color: #8E44AD;
}

.colBox-yellow {
    background-color: #c49f47;
}

.containerGraph {
    display: flex;
    justify-content: space-between;
    margin: 2em 1em;
}

.graph-wide {
    margin: 1em 2em;
    border: 1px solid black;
    padding: 0px 20px;
    box-sizing: border-box;
}

.colGraph {
    width: 50%;
    padding: 0px 20px;
    border: 1px solid #e7ecf1 !important;
    margin: 1em;
}

@media (max-width: 1000px) {
    .containerBox {
        flex-direction: column;
    }

    .colBox {
        width: 100%;
        margin: 0;
        margin-top: 1em;
    }

    .containerGraph {
        flex-direction: column;

    }

    .colGraph {
        width: 100%;
        margin: 0;
        margin-top: 1em;
    }

    .graph-wide {
        margin: 2em 1em;
    }
}

.colBoxItem {
    text-align: right;
    font-size: 3em;
    font-weight: 300;
    padding-right: 8px;
    margin: 0;
    color: #fff;
    position: relative;
    cursor: pointer;
}

.colGraphHead {
    margin: 1em;
    border-bottom: 1px solid #e7ecf1;
    /*border-bottom: 1px solid black;*/
}

.colBoxItem i {
    position: absolute;
    font-size: 10rem;
    opacity: 0.15;
    left: -12px;
    top: 70px;
}

.boxItemSmall {
    font-size: 1.5em;
    font-weight: 300;
    padding-bottom: 50px;
    margin-top: -15px;
}

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

.rowTotal{
    background-color: beige !important;
    border-bottom: 2px solid #888 !important;
}

.btnDeleteUserControl{
    position:absolute;
}

.projectPhaseHeader {
    /*background: #c49f47db;*/
    text-align: center;
    margin-bottom: 20px;
    padding: 10px 0px;
    color: white;
}

.icon-position {
    position: absolute;
    top: 13px;
    right: 20px;
    transition: .2s ease-in;
}

.icon-position:hover{
    color: #5C9BD1;
    cursor: pointer;
}

.rotate {
    transform: rotate(180deg);
}

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

.selectedItems{
    display: none;
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1000; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    /*margin: 15% auto;*/ /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 500px; /* Could be more or less, depending on screen size */
    /*height: 630px;*/
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.modal-placeholder {
    padding: 0 5px;
    height: 500px;
    width: 100%;
    white-space: nowrap;
    overflow-y: auto;
    overflow-x: auto;
}

.explorer-header {
    width: 100%;
    background: #337ab7;
    color: white;
    text-align: center;
    padding: 10px 0;
    margin-bottom: 10px;
}

.modal-placeholder::-webkit-scrollbar {
  /*  display: none;*/
}

.width-20-px{
    width: 20px;
}

.cursor-pointer{
    cursor: pointer;
}

.background-yellow {
    background: #c49f47db;
    color: white;
}

.background-yellow:hover {
    color: white;
}

.background-blue {
    background: #5C9BD1;
    color: white;
}
.background-blue:hover {
    color: white;
}

.background-purple {
    background: #8E44AD;
    color: white;
}

.background-purple:hover {
    color: white;
}

.background-green {
    background: #147772;
    color: white;
}

.background-green:hover {
    color: white;
}

.modalElement{
    margin-top: 10px;
    padding-bottom: 5px;
    font-size: 1.5rem;
}

.file-explorer-links{
    text-decoration: none;
}

.file-explorer-links:hover{
    text-decoration: none;
}

.file-explorer-links:focus{
    text-decoration: none;
}

.selected-link {
    text-decoration: none;
    background: #337ab7;
    color: white;
    padding: 2px 5px;
}

.selected-link:hover {
    text-decoration: none;
    background: #337ab7;
    color: white;
}

.selected-link:focus {
    text-decoration: none;
    background: #337ab7;
    color: white;
}

.img-explorer{
    position: absolute;
    top: -16px;
    margin-right: 5px;
    width: 100%
}

.div-explore-move{
    border-top: 1px solid lightgrey;
    padding-top: 20px;
    margin: 15px 0px 0px 0px;
}

.img-placeholder{
    position: relative;
    width: 20px;
}

.inactiveLink {
    pointer-events: none;
    cursor: default;
    font-size: 1.2rem;
}

.currentFolder {
    pointer-events: none;
    cursor: default;
}

.padding-LR{
    padding: 0px 5px;
}

.chk-show-hide{
    border-bottom: 1px solid lightgrey;
    padding-bottom: 5px;
}

.refresh-button{
    padding-left: 0px;
}

.file-name-td{
    display: flex;
    align-items: center;
}

.header-border-bottom{
    border-bottom: 1px solid lightgrey;
}

.bar-indicator{
    padding: 0px 40px 0px 0px;
}

.bar-indicator-label{
    padding-right: 40px;
    text-align: end;
}

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

.background-white{
    background-color: white!important;
}

.table > thead > tr > th {
     vertical-align: baseline; 
    border-bottom: 2px solid #e7ecf1;
}

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

.bar-container{
    width: 100%;
    padding-right: 40px;
}

.outer-bar {
    width: 242px;
    float: right;
    border: 1px solid grey;
    padding: 1px;
    margin-top: 5px;
}

.inner-bar {
    background: #337ab7;
    height: 100%;
}

/* modal new folder */
.new-folder-modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1000; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.new-folder-modal-content {
    background-color: #fefefe;
    margin: 20% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 25%; /* Could be more or less, depending on screen size */
}

.modal-new-folder-header{
    padding-bottom: 10px;
    font-weight: bold;
}

.div-modal-button {
    display: flex;
    justify-content: center;
}

.newfolder-container-btn{
    margin: 10px 10px 0px 0px;
}


/* media query za mobilne*/
@media only screen and (max-width: 560px) {
    .form-body {
        padding: 0px !important;
    }

    .refresh-button {
        padding-left: 15px;
    }

    .portlet {
        margin-bottom: 0px;
    }

    .storage-space-viewer {
        text-align: left;
        margin-left: 20px;
    }

    .button-up {
        display: block;
        margin: 0 20px 0 20px;
    }

    .btn-new-map {
        margin-bottom: 5px;
        display: block;
        width: 100%;
    }

    .modal-content {
        width: 100%; /* Could be more or less, depending on screen size */
        height: 100vh;
        position: fixed;
        display: flex;
        flex-direction: column;
        padding-top: 40px;
    }

    .modal-header-content {
        height: 15%;
    }

    .modal-placeholder {
        height: 85%;
        white-space: nowrap;
    }

        .modal-placeholder::-webkit-scrollbar {
            display: none;
        }

    .page-header.navbar.navbar-fixed-top {
        z-index: 150;
    }

    .selected-button-items {
        margin: 0px 20px 20px 20px;
    }

    .deleteSelected {
        width: 100%;
        margin-bottom: 10px;
    }

    .download-selected {
        width: 100%;
        margin-bottom: 10px;
    }

    .move-selected {
        width: 100%;
    }

    .btn-add-folder {
        padding-left: 20px;
        padding-right: 20px;
        margin-top: 10px;
    }

    .btn-upload {
        margin: 0px 20px 0px 20px;
    }

    .uplaod-input {
        width: 100% !important;
    }

    .textbox-foldername {
        display: block;
        width: 100%;
    }

    .newfolder-container {
        position: static;
        display: flex;
        justify-content: center;
    }

    .hidden-new-folder {
        margin-left: 0px;
        padding: 0px 20px;
    }

    .newfolder-container-btn {
        margin: 10px 5px 10px 5px;
    }

    .new-folder-modal-content {
        width: 100%;
        padding: 20px;
        border: 1px solid #888;
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .bar-indicator-label {
        padding-right: 20px;
        padding-left: 20px;
        text-align: start;
    }

    .bar-container {
        margin: 10px 20px 10px 20px;
    }

    .outer-bar {
        width: 100%;
        float: left;
        margin-bottom: 10px;
    }

    .btn-add-client {
        width: 85%;
        margin: 0 auto;
        margin-top: 20px;
    }
}

.error-title{
    font-size: 3rem;
    font-weight: bold;
}

.padd-10{
    padding: 10px;
}

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

.bg-confidential {
    background: #F0F8FF;
}

.gantt-container {
    /*width: 120px;*/
    background-color: black;
    color: #fff;
    /*text-align: center;*/
    padding: 5px;
    border-radius: 7px !important;
}

.width-15{
    width: 15%;
}

.container-gantt {
    display: flex;
    justify-content: space-between;
    margin: 2em 2em;
}

.col-gantt {
    width: 100%;
}

.label-duplicate {
    display: block;
    text-align: center;
    border: 1px solid #c2cad8;
    padding: 6px;
    background: #c49f47;
    color: white;
    cursor: default;
}

.billing-changed {
    background: #0079ff24 !important
}

.dxDropdown {
    width: 100%;
    background: white;
    border: 1px solid #c2cad8;
    box-shadow: none;
    color: #555;
    font-family: "Open Sans",sans-serif;
    padding-left: 12px !important;
}

.dxDropdown input{
    background: white !important;
    color: #555 !important;
}

.check-adjusted{
    right: 60px !important;
}

.uncheck-adjusted {
    right: 35px !important;
}

.border-success {
    border: 1px solid #27a4b0;
}

.border-failed {
    border: 1px solid #e73d4a;
}

.dxDropdown input{
    width: 90% !important;
}

.text-color {
    color: #555;
}

.display-flex{
    display: flex;
}

.swal2-container {
    z-index: 10000;
}

.chk-position {
    margin-top: 7px;
}

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

.modal-override {
    width: auto !important;
    top: 0 !important;
    left: 0 !important;
}

@media only screen and (min-width: 768px) {
    .modal-override {
        top: 50% !important;
        left: 50% !important;
        transform: translate(-74%, -50.1%);
    }
}

.padd-15{
    padding: 15px;
}

.legend{
    text-decoration: underline;
    font-weight: bold;
}

.feedback-msg-box {
    padding: 10px;
    background-color: aliceblue;
    border: 1px solid #c2cad8;
}

.feedback-msg-box-warning {
    padding: 10px;
    background-color: palegoldenrod;
    border: 1px solid #c2cad8;
}

.container-reminder {
    margin: 2em 1em 0 1em;
    display: flex;
    justify-content: space-between;
}

.container-reminder-content {
    margin: 0 1em;
    width: 100%;
    border: 1px solid #c2cad8;
    background-color: palegoldenrod;
    padding: 10px;
    position:relative;
}

.btn-reminder {
    border: 1px solid black;
    margin-top: 10px;
    background-color: lightgoldenrodyellow;
}

.close-icon {
    position: absolute;
    left: 98%;
    cursor: pointer;
}

@media (max-width: 1000px) {
    .container-reminder-content{
        margin: 0;
    }

    .close-icon{
        left:96%;
    }
}


@media (max-width: 1000px) {
    .close-icon{
        left: 94%;
    }
}

.pink-opacity {
    background: #ffd0d7 !important;
}

.label-control {
    display: inline-block;
    width: 100%;
    height: 34px;
    padding: 8px 0px;
    background-color: #fff;
    font-weight: bold;
}

.budget-control{
    width: 25% !important;
    display: inline-block !important;
}

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

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

.containerAppointments {
    width: 96%;
    padding: 10px;
    box-sizing: border-box;
    margin: 2em 2em 0em 2em;
    border: 1px solid #4c87b9;
}

.containerAppointmentsTitle {
    font-size: 16px;
    font-weight: bold;
}

.appointmentBox {
    background: #4c87b9;
    margin-top: 10px;
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    color: white;
}

.appointmentBoxTime {
    font-size: 12px;
    margin-top: 10px;
    font-weight: bold;
}

.appointmentBoxTitle {
    font-size: 14px;
    margin-top: 10px;
    font-weight: bold;
}

.appointmentBoxDescription {
    font-size: 14px;
    margin-top: 10px;
}