:root{
    --nunito-font: Nunito, serif;
    --josefin-font: Josefin Sans, sans-serif;
    --pt-serif-font: PT Serif, serif;
}
body{
    font-family: var(--nunito-font);
    background-image: radial-gradient(#ffffff, #f1f3f4);
    /*background: ;*/
    /*background-image: radial-gradient(#ffffff, #ffffff);*/
}
main{
    /*margin-bottom: 30px;*/
    padding-bottom: 30px;
    margin-top: 40px;
}
.nunito{
    font-family: var(--nunito-font);
    /*font-weight: bold;*/
}
.josefin{
    font-family: var(--josefin-font);
}
#createProjBtn, #addContactBtn, #archiveContactBtn{
    /*background-color: #F0BA20;*/
    /*color: white;*/
    font-size: 10pt;
    color: #3b7690;
}
.modal{
    color: black!important;
}
.modal-header{
    color: #141414;
    background: #AABDCB;
}
.modal-body{
    background-image: radial-gradient(#ffffff, #f1f3f4);
}
.modal-footer{
    /*color: #141414;*/
    background: #AABDCB;
}

#navbar{
    /*max-height: 35px;*/
}
#footerBar{
    /*height: 30px;*/
}

.logo-color{
    color: #f1f3f4!important;
    font-size: 14pt;
    text-align: left;
}

.logo-prefix{
    color: #aabdcb!important;
    font-size: 10pt;
    text-align: left;
}

.logo-for{
    color: #aabdcb!important;
    font-size: 10pt;
    text-align: left;
}

.logo-subscriber-company{
    color: #f1f3f4!important;
    font-size: 14pt;
    text-align: left;
}
.menu-icon{
    color: #f1f3f4!important;
    font-size: 20pt;
    padding-top: 0;
    padding-bottom: 0;
}
.subscriber-name{
    color: #f1f3f4!important;
    font-size: 12pt;
    text-align: left;
}
.accordion-button:not(.collapsed){
    background-color: #AABDCB;
    color: #3b7690;
    font-weight: bold;
}
.nav-font{
    font-family: var(--pt-serif-font);
    color: #f1f3f4;
    font-size: 14pt;
    margin-left: 10px;
    margin-right: 10px;
}
.form-check-input:checked{
    background-color: #3b7690!important;
}
.default-switch .form-check-input:checked{
    background-color: #F0BA20!important;
    border-color: #d2a21d;
}
.default-switch .form-check-input:focus{
    box-shadow: 0 0 0 0.25rem rgba(210, 162, 29, 0.26);
}
/*.form-check-input{*/
/*    border: 1px solid #3b7690!important;*/
/*}*/
.bg-blue{
    background-color: #3b7690;
}
.header-color{
    background-color: #3b7690;
}
.table-head-blue{
    background-color: #aabdcb;
}
.sortable-header{
    cursor: pointer;
}
.bg-orange{
    background-color: #F0BA20;
}
.list-group-item-action.active{
    background-color: #3b7690;
    border: #3b7690;
}
.task-summary-header{
    margin: 0 !important;
    border: 0 !important;
    padding: 0 2px 0 2px!important;
    /*box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);*/
    font-family: var(--pt-serif-font);
    text-decoration: none;
    color: #f1f3f4;
    font-size: 12pt;
    text-align: left;
}
.summary-header{
    margin: 0 !important;
    border: 0 !important;
    padding: 0 2px 0 2px!important;
    /*box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);*/
    font-family: var(--pt-serif-font);
    text-decoration: none;
    color: #3b7690;
    font-size: 12pt;
    text-align: left;
}
.left-col-header{
    font-family: var(--pt-serif-font);
    color: #d2a21d;
    font-size: 24px;
    text-align: left;
}
.left-col-subheader{
    font-family: var(--pt-serif-font);
    text-decoration: none;
    color: #3b7690;
    background-color: #aabdcb;
    font-size: 12pt;
    text-align: left;
    font-weight: bold;
    margin-top: 8px;
    margin-bottom: 0;
    padding-left: 2px;
    border-radius: 5px;
}
.assigned-img, .task-comment-img, .comment-img{
    position: absolute;
    border-radius: 50%;
    height: 25px;
    width: 25px;
    top: 50%;
    left: 50%;
}
.img-container{
    position: relative;
    text-align: center;
    border-radius: 50%;
    height: 25px;
    width: 25px;
    display: inline-block;
    transform: translate(-50%, -40%);
}
.contact-img, .company-img{
    position: absolute;
    border-radius: 50%;
    height: 100px;
    width: 100px;
    top: 50%;
    left: 50%;
}
.contact-img-sm, .company-img-sm{
    position: absolute;
    border-radius: 50%;
    height: 25px;
    width: 25px;
    top: 50%;
    left: 50%;
}
.img-text-middle.contact-img{
    font-size: 50px;
    background-image: linear-gradient(#B5C3CB, #B5C3CB, #545B60);
    line-height: 100px;
    color: #343a40;
}
.img-text-middle.company-img{
    font-size: 50px;
    background-image: linear-gradient(#B5C3CB, #B5C3CB, #545B60);
    line-height: 100px;
    color: #343a40;
}
.img-text-middle{
    font-size: 12px;
    background-image: linear-gradient(#B5C3CB, #B5C3CB, #545B60);
    line-height: 23px;
    color: #343a40;
}
.filter-input{
    border-radius: 20px;
    background: transparent;
    border-color: #6F6E73;
    width: 300px;
    margin: 5px;
}
.filter-input:active, .filter-input:focus{
    background: transparent;
}
.summary-title{
    font-family: var(--pt-serif-font);
    text-decoration: none;
    color: #3b7690;
    font-size: 16pt;
    text-align: left;
}

.summary-content{
    text-decoration: none;
    color: #141414;
    font-size: 10pt;
    text-align: left;
}

.summary-content-link{
    text-decoration: none;
    color: #3b7690;
    font-size: 10pt;
    text-align: left;
    width: 100%;
}
.name-date-stamp, .date-stamp{
    font-style: italic;
    color: rgba(115, 115, 115, 0.5);
    font-size: 10px;
    text-align: right;
    margin-right: 0;
    /*float: right;*/
}
.dropdown-menu{
    z-index: 1100;
}


.comment-input-cell{
    width: 100%;
}
.percent-input-cell{
    white-space: nowrap;
}
.comment-row.comment{
    width: 100%;
}
.comment-row.name-date-stamp, .comment-row.comment-percent, .comment-row.comment-img-cell{
    white-space: nowrap;
}
.comment-img-cell, .img-cell{
    width: 30px;
}
.img-cell{
    white-space: nowrap;
}
/*.flexdatalist-multiple-value{*/
/*    padding: 0!important;*/
/*    margin: 0!important;*/
/*}*/
.footer-font{
    font-family: var(--pt-serif-font);
    color: #f1f3f4!important;
    font-size: 10pt;
    background-color: #3b7690;
    /*background-image: linear-gradient(#3b7690, #aabdcb, #3b7690);*/
}
.save-edit-btn{
    background: rgba(240, 186, 32, 1);
    border: rgba(240, 186, 32, 1);
    color: white;
    font-size: 8pt;
    padding: 1px 4px 1px 4px;
}
.btn-deopus-blue{
    background-color: #3b7690;
    padding-top: 1px;
    padding-bottom: 1px;
    color: white;
}
.btn-green{
    color: #129f7dff
}
.table-row-light{
    background: #f1f3f4;
}
.table-row-dark{
    background: #d3dde4;
}
.edit-btn{
    font-size: 6pt;
    padding: 1px 4px 1px 4px;
}
.expand-btn, .collapse-btn{
    font-size: 7pt;
    padding: 1px 4px 1px 4px;
    float: right;
    /*padding: 2px 5px;*/
}

.left-col-row{
    margin-bottom: 1px;
    margin-top: 1px;
}
.left-col-card:hover{
    background: #d3dde4;
}
.left-col-card{
    position: relative;
    overflow: hidden;
    /*background-color: #f1f3f4;*/
    --bs-gutter-x: 0;
    margin-left: 12px !important;
    margin-right: 12px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}
.person-name{
    color: #d2a21d;
    font-size: 12pt;
    text-align: left;
    margin: 0 !important;
}

.person-title{
    text-decoration: none;
    color: #3b7690;
    font-size: 10pt;
    text-align: left;
}
.person-card-company-name{
    font-size: 10pt;
    text-align: left;
    color: #AABCDC;
}

.btn-primary{
    background: rgba(240, 186, 32, 1);
    border: rgba(240, 186, 32, 1);
}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus{
    background: rgba(230, 176, 22, 0.8)!important;
}
.task-green{
    background: #129F7D;
}
.task-yellow{
    background: #F0BA20;
}
.task-red{
    background: #BA331D;
}

.task-count{
    font-size: 12px;
    line-height: 12px;
}
.task-circle{
    max-width: 12px!important;
    height: 12px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: inline-block;
    border: solid black 1px;
    line-height: 12px;
}
.delete-btn{
    color: #B64D3EFF;
}
.delete-task-btn{
    display: none;
}


/*.deliverable-data{*/
/*    width: 200%;*/
/*}*/
.file-required-text{
    font-size: 8pt;
    color: #d2a21d;
}
input[type="checkbox"]:checked{
    accent-color: #3b7690;
}

.file-stamp, .deliverable-stamp{
    font-size: 8pt;
    margin-right: 5px;
    float: right;
}



.toast-success{
    border: #129f7dff 3px solid;
    border-radius: 5px;
    background: rgba(18, 159, 125, 0.22);
}
.toast-warning{
    border: #f0ba20 3px solid;
    border-radius: 5px;
    background: rgba(240, 186, 32, 0.3);
}
.toast-danger{
    border: #BA331D 3px solid;
    border-radius: 5px;
    background: rgba(186, 51, 29, 0.35);
}


.comment{
    font-size: 8pt;
    vertical-align: middle;
}
div.comment{
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    /*justify-content: center;*/
}
.comments, .new-comment{
    margin-left: 40px;
}
/*.new-comment .comment-input{*/
/*    padding-right: 0;*/
/*}*/
/*.comments .row{*/
/*    background-color: #f0f3f2;*/
/*}*/



/* width */
::-webkit-scrollbar {
  width: 8px;
    height: 8px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
    box-shadow: inset 0 0 5px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #3b7690;
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #276e8d;
}
.spinner-border{
    color: #3b7690;
}
.summary-header-background{
    background-color: #aabdcb;
}
.task-summary-header-background{
    background-color: #3b7690;
}
::-webkit-calendar-picker-indicator{
    margin-left: 0;
}
.btn-primary, .btn-secondary, .btn-danger{
    padding-top: 1px;
    padding-bottom: 1px;
    font-size: 14px;
}
.template-btn{
    padding: 4px 6px;
    font-size: 8pt;
}
/* flexdatalist result classes */
.item-company_name{
    font-size: 10px;
    font-style: italic;
}
.item-title{
    font-size: 10px;
    font-style: italic;
}
.item-thumb{
    margin-right: 5px;
    max-height: 20px;
}
.item-project_status{
    font-size: 10px;
    margin-left: 10px;
    background: #e8cf86;
}
.item-inHierarchy{
    font-size: 10px;
    margin-left: 10px;
    background: #e8cf86;
}
/*  */
.phone-link{
    text-decoration: none;
    margin-right: 10px;
    display: inline;
}
.phone-span{
    /*todo: make wrapping better*/
    /*white-space: nowrap;*/
    display: inline;
}
.email-link{
    text-decoration: none;
}
/*@media (min-width: 1200px){*/
/*    !* todo: play around with this. Get it to scroll to bottom of column then stick*!*/
/*    .sticky-xl-col{*/
/*        position: -webkit-sticky;*/
/*        position: sticky;*/
/*        top: 40px;*/
/*        !*bottom: 0;*!*/
/*    }*/
/*}*/
.text-green{
    color: #129F7D;
}
.text-yellow{
    color: #d2a21d;
}
.text-red{
    color: #BA331D;
}
.key-info-link{
    color: #d2a21d;
    text-decoration: none;
}
.project-status-text-dead{
    /*color: #BA331D;*/
    border: #BA331D 3px solid;
    border-radius: 5px;
    background: rgba(186, 51, 29, 0.35);
}
.project-status-text-hold{
    /*color: #BA331D;*/
    border: #f0ba20 3px solid;
    border-radius: 5px;
    background: rgba(240, 186, 32, 0.3);
}
.pendingText{
    color: #BA331D;
    margin-left: 5px;
    font-size: 10pt;
}
.relationship-btn{
    color: #d2a21d;
    padding: 0 3px 3px 3px;
}
.safari-note, .ios-note{
    display: none;
    font-size: 10pt;
    background: rgba(240, 186, 32, 0.3);;
}
.person-info{
    text-decoration: none;
    color: #141414;
    font-size: 8pt;
    text-align: left;
}

.person-info-label{
    color: #f0ba20;
    font-size: 8pt;
}
.hidden {
    display: none;
}
.flexdatalist-results .item{
    cursor: pointer;
}