/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification 
for details on configuring this project to bundle and minify static web assets. */
body {
    /*padding-top: 50px;
    padding-bottom: 20px;*/
    font-size:0.9rem;
    line-height:1.3;
    /*color: #6f859e;*/
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    /*padding-left: 15px;
    padding-right: 15px;*/
}

/* Fonts and colours */
html, body {
    font-family: 'Sora', sans-serif;
}
.workupNavy { 
    color: #0E1750; 
}
.workupOrange {
    color: #FC8229;
}
.workupPurple {
    color: #8C57E0;
}
.workupLaserBlue {
    color: #00BDFF;
}
.workupNeonGreen {
    color: #62E157;
}
.workupSteelBlue {
    color: #6F859E;
}
.workupDenimBlue { 
    color: #002C85;
}
.workupPink {
    color: #973A90;
}
.workupYellow {
    color: #ffca05;
}
.workupRed {
    color: red;
}
.e-grid {
    font-family: 'Sora', sans-serif;
}
.e-control, .e-css {
    font-family: 'Sora', sans-serif;
}
input.e-input, textarea.e-input, .e-input-group, .e-input-group.e-control-wrapper {
    font-family: 'Sora', sans-serif;
}
.e-input-group.e-disabled, .e-input-group.e-control-wrapper.e-disabled {
    font-family: 'Sora', sans-serif;
    /*font-size: 14px;*/
    font-weight: 400;
}
.centerSpinner {
    width: 100px;
    height: 100px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}
/* BUTTONS AND LINKS */
a, .btn-link {
    /*color: #070D26;*/ /* dark blue */
    /*color: #4579ad;*/ /* Medium blue */
    color: #1861ac; /* mid blue */
   /* color: #0e1750;*/ /* Navy Blue */*/
}

.buttonBar {  /*  groups a bunch of buttons together on a detail page */
    margin: 4px 0px 4px 0px;
}

/* Below needed to left align multi-select drop down */
.dropdown-item {
    width: auto;
}
.btn-primary {
    color: #fff;
    /*background-color: #1b6ec2;*/
    border-color: #1861ac;
    background-color: #1861ac; /* mid blue */
}
.btn-outline-primary {
    color: #1861ac;
    border-color: #1861ac;
}
.btn-outline-primary:hover {
    color: #fff;
    background-color: #34495E;
    border-color: #34495E;
}

.e-chip-list.e-selection .e-chip.e-active.e-outline {
    background-color: #34495e;
    border-color: #34495e;
}

/* IMAGE CLASSES */
/* Display a thumbnail image in a grid*/
.gridImage img {
    height: 55px;
    /*width: 55px;*/
    border-radius: 4px;
    box-shadow: inset 0 0 1px #e0e0e0, inset 0 0 14px rgba(0, 0, 0, 0.2);
}
.cardImage img {
/*    height: 140px;
   margin: 4px;*/
    /*width: 55px;*/
    /*border-radius: 1.5rem;*/
/*    box-shadow: inset 0 0 1px #e0e0e0, inset 0 0 14px rgba(0, 0, 0, 0.2);
*/}
.pageImage img {
    height: 200px;
    margin: 4px;
    /*width: 55px;*/
    border-radius: 1.5rem;
    box-shadow: inset 0 0 1px #e0e0e0, inset 0 0 14px rgba(0, 0, 0, 0.2);
}
.pageThumbnail img {
    /*height: 120px;*/
    margin: 4px;
    /*width: 55px;*/
    border-radius: 1.5rem;
    /*box-shadow: inset 0 0 1px #e0e0e0, inset 0 0 14px rgba(0, 0, 0, 0.2);
    background-color: darkgray*/
}
.companyIcon {
    height: auto;
/*    width: auto;
*/}
.gridIcon img {
    height: 28px;
    /*width: 28px;*/
}
.gridThumb img {
    height: 44px;
    /*width: 44px;*/
    border-radius:3px;
}
.gridThumb2 img {
    height: 28px;
    /*width: 44px;*/
    border-radius: 0px;
}
.logoThumb img {
    height: 28px;
    width: auto;
    border-radius: 0px;
}
.cardImg {
    width: 120px;
    height: auto;
}
.gridInitials {
    font-size: 18px;
    height: 40px;
    width:40px;
    background-color: cornflowerblue;
}
.roundedLarge {
    border-radius: 1.5rem;
}
/* LOGIN BOX Styles */
.boxStyle {
    border: 4px #1861ac solid;
    margin: 60px auto 30px;
    padding: 20px;
    border-radius: 8px
}

/* VALIDATION STYLES */
.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}
.invalid {
    outline: 1px solid red;
}
.validation-message {
    color: red;
}

/* SIDEBAR CLASSES */
/*  From simple Sidebar */
body {
    overflow-x: hidden;
}

/* PAGE TITLES / HEADINGS */
h3 { padding: 4px; }
h3 img { height: 36px; }

h1, h2, h3, h4, h5 {
    /*color: #4579ad;*/ /* medium blue */
    /*color: #070D26;*/ /* dark blue, looks black */
    /*color: #35B38F;*/ /* mid green */
    color: #1861ac; /* mid blue */
    /*color: #0e1750;*/ /* Navy Blue */
}

h4, .h4 {
    font-size: 1.3rem;
}

#sidebar-wrapper {
    min-height: 100vh;
    min-width: 220px;
    margin-left: -15rem;
    -webkit-transition: margin .25s ease-out;
    -moz-transition: margin .25s ease-out;
    -o-transition: margin .25s ease-out;
    transition: margin .25s ease-out;
    background-color: darkgray;
}

#sidebar-wrapper .sidebar-heading {
    padding: 0.875rem 1.25rem;
    font-size: 1.2rem;
}

#sidebar-wrapper .list-group {
    width: 15rem;
}

#page-content-wrapper {
    min-width: 100vw;
}

#wrapper.toggled #sidebar-wrapper {
    margin-left: 0;
}

@media (min-width: 768px) {
    #sidebar-wrapper {
        margin-left: 0;
    }

    #page-content-wrapper {
        min-width: 0;
        width: 100%;
    }

    #wrapper.toggled #sidebar-wrapper {
        margin-left: -15rem;
    }
}

/* Sidebar styles */
.bg-light {
    /*background-color: #070D26 !important;*/
    /*background-color: #334486 !important;*/
    /*background-color: #34495E !important;*/
    /*background-color: #4579ad !important;*/ /* sidebar background colour */
    /* background-color: #ffd800 !important;  sidebar background colour */
    background-color: #42033D !important;
}

.nav-item { 
    padding: 4px 4px 4px 12px; 
}

.nav-item span { padding-left:5px;}
.topIcon {
    padding-right: 12px;
    padding-left: 4px;
    width: 35px;
    text-align: left;
}
#sidebar-wrapper .nav-item a {
    color: #fff;
    display: flex;
    align-items: center;
}

#sidebar-wrapper .nav-item a:hover {
    text-decoration: none;
    font-weight: bold;
    /*color: #39C5E6;*/ /*#acd433; green*/ /*#ffd800 yellow */
}

#sidebar-wrapper h2 { color: white; padding: 6px;}

.navIcon {
    width: 30px;
    padding-left: 6px;
    font-size: 1rem;
    /*color: #acd433;*/
    /*color: #39C5E6;*/ /* blue */
}

#sidebar-wrapper .card {
    color: white;
    padding: 2px;
    border: 0px;
}

#sidebar-wrapper .card-header {
    color: white;
    padding: 2px;
    border: 0px;
}

#sidebar-wrapper .card-body {
    color: white;
    padding: 2px;
    border: 0px;
}

#sidebar-wrapper .btn-link {
    color: white;
}

#sidebar-wrapper h5 {
    color: white;
    margin:2px;
}

.menu-card-header {
    color: white;
    padding: 2px;
}

/** Sidebar collapsable accordian */
/*** Header styles ***/
.page-header {
    /*width: 960px;*/
    max-width: 100%;
    padding: 4px;
    margin: 0 auto;
}

.main-header .page-header {
    display: flex;
    align-items:center;
    justify-content: space-around;
    flex-wrap: wrap;
}
.main-nav { margin-left: auto;}
.main-nav ul {
    margin: 1em 0 .5em;
    text-align: center;
}

.main-nav li {
    display: inline;
}

.main-nav a {
    display: inline-block;
    padding: .5em 1.5em;
}

/*.header-search {
    flex: 200px;
}*/
.hidden {
    display: none;
}

/*** FORM STYLES ***/
.required {
    font-weight: bold;
}
.required:after {
    content: " *";
    font-weight: bold;
    /*color: red;*/
}
.form-inline label {
    text-align: left;
    justify-content: left;
    /*color: #4579ad;*/
    color: #1861ac;
}

.form-group{
    font-size: 0.9rem;
    line-height: 1.2;
    padding: 0.2rem;
    margin-bottom: 0.4rem;
}

.form-control {
    font-size: 0.9rem;
    line-height: 1.2;
    padding: 0.2rem;
    height: calc(1.2em + 0.5rem + 2px);
}
.form-group label {
    /*color: #4579ad;*/
    color: #1861ac;
    padding-left: 0px;
}
.form-group span {
    font-size: 14px;
}
.e-disabled {
    opacity: 0.70;
}

/***   BUTTON STYLES */
.btn {
    font-size: 0.9rem;
/*    padding: 0.2rem 0.5rem;
*/}

/*** Syncfusion Grid Styles ***/
.e-grid .e-rowcell {
    font-size: 0.9rem;
    padding: 3px 3px 3px 3px;
}

.e-grid .e-gridheader .e-sortfilter .e-headercelldiv, .e-grid .e-gridheader .e-stackedheadercelldiv, 
.e-grid .e-gridheader .e-headercell .e-headercelldiv.e-headerchkcelldiv {
    /*padding: 3px 15px 3px 3px;*/
}

.e-grid .e-gridheader .e-headercelldiv {
    font-size: 0.9rem;
    /*color: #4579ad;*/
    color: #1861ac;
    font-weight: bold;
}
.e-grid .e-headercell, .e-grid .e-detailheadercell {
    padding: 0 5px 0;
}

/* Set background colour of ejs-schedule tooltips */
.e-tooltip-wrap.e-popup {
    background-color: #334486;
    border: 1px solid #334486;
}

/* Sets size of edit/view icons on grids */
td i {font-size: 1.1rem; }

/* Used for colouring cells in grid */
.colourCell { 
    padding: 4px 8px 4px 8px;
    border-radius: 4px;
}



/* nav panel */
.nav-tabs {
    /*background-color: #b2d8e3;*/ /*#39C5E6; light blue */
    /*background-color: #c2c8cf;
    border-radius: 6px;*/
    margin: 6px 0px 6px 0px;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #34495E;  /*#334486;*/
}

.nav-tabs .nav-link {
    padding: 0.5rem 0.5rem;
}
.nav-pills .nav-link {
    padding: 0.5rem 0.5rem;
}

/*  Dashboard styles */
.dashboardBox {
   /* border-bottom: 1px solid #4579ad;*/
    border: 1px solid #d1d1d1;
    border-radius: 10px;
    margin: 5px 2px 12px 2px;
    background-color: #ffffff;
    padding:6px;
}
.dashboardBox h4 {
    color: #454545;
    font-weight: 600;
    font-size: 18px;
}
.dashboardHeader{
    padding:4px;
    font-size:16px;
    font-weight: bold;
    text-align: left;
}
.dashboardBody {
    text-align: left;
}
.dashboardFooter{
}
.dashboardColumn {
    padding-left: 5px;
    padding-right: 5px;
}
.taskListTitle {
    font-size: 1.0rem;
    color: #1861ac;
}
.tasklistText {
    /*border: 1px solid black;*/
    margin-left: 6px;
}
/* Card styles */
h5 { 
    font-size: 1.0em;
}

/*  Modals  */
/*.modal-title {
    color: #fff;
}
.modal-header {
    padding: 0.5rem;
    color: white;
    background: #34495e; 
}*/
/*.modal-title {
    color: #3d3d3d;
}
.modal-header {
    padding: 0.5rem;
    color: #3d3d3d;
    background: #ffff; 
}
.modal-footer {
    padding: 0.5rem;
}
.modal-body {
    padding: 0.5rem;
}
.close {
    color: #ffffff;
    opacity: .50;
}
*//*.close:hover {
    color: #ffffff;
    opacity: 1;
}
*//* Index Page Styles*/
.toolbarPanel {
    padding: 5px 2px 5px 0px;
}
.filterPanel {

}

table td .weekend {
    background-color: aquamarine !important;
}

/*.e-schedule .weekend table td {
    background-color: aquamarine !important;
}

.weekend table td {
    background-color: aquamarine !important;
}*/

/* Used by info boxes at the top of various pages and dashboards, eg Employees */
.ibox-title {
   /* background-color: #ffffff;*/
    color: inherit;
    margin-bottom: 0;
    padding: 5px 5px 2px 5px;
    position: relative;
    clear: both;
}

.ibox-content {
   /* background-color: #ffffff;*/
    color: inherit;
    padding: 2px 10px 5px 10px;
}

.ibox-title h5 {
    display: inline-block;
    font-size: 16px;
    padding: 0;
    text-overflow: ellipsis;
    float: none;
}

.ibox-content small {
    /*color: #4579ad;*/
    color: #1861ac;
}

/* Grid Status Labels */
.label {
    padding: 3px 8px;
    border-radius: 0.25em;
}
.label-approved, .label-active, .label-done { background-color: #5debd4; color: #0e7762; } /* Teal 300 */
.label-requested, .label-pending, .label-suspended, .label-paused, .label-negotiation, .label-todo { background-color: #F1B258; } /* Carrot 300  */
.label-inprogress { background-color: #FFE143; }  /* Yellow 300  */
.label-rejected, .label-cancelled { background-color: #C20E2F; color:#ffffff; }  /* pink 700 */
.label-cancelled, .label-completed { background-color: #1980a1; color:#ffffff; }  /* SkyBlue 600 */

/* Grid progress bars */
.progress-bar {
    background-color: #1ab394;
}
.progress-small,
.progress-small .progress-bar {
    height: 10px;
}  
.progress-small,
.progress-mini {
    margin-top: 5px;
}

.progress-mini,
.progress-mini .progress-bar {
        height: 5px;
        margin-bottom: 0;
}
.progress-bar-navy-light {
    background-color: #3dc7ab;
}
.progress-bar-success {
    background-color: #1c84c6;
}
.progress-bar-info {
    background-color: #23c6c8;
}
.progress-bar-warning {
    background-color: #f8ac59;
}
.progress-bar-danger {
    background-color: #ed5565;
}

/* Multi select overrides so that entries are left aligned */
.form-inline .multiselect-container span.form-check {
     padding: 3px 5px 3px 5px; 
}
.multiselect-container .multiselect-option .form-check, .multiselect-container .multiselect-group .form-check, .multiselect-container .multiselect-all .form-check {
     padding: 0 5px 0 5px;
     margin-left: 10px;
}
.custom-select {
    height: calc(1.2em + 0.5rem + 2px );
    padding: 2px 30px 2px 5px;
}

/* Pricing/Signup */
.packages {
    text-align: center;
}

.packages .package {
    /*border: 3px solid #e1e1e1;*/
    border-radius: 4px;
    padding: 30px 0;
    background: #cfdbe3;
}

.packages .package.featured {
    padding: 45px 0;
    margin-top: -15px;
}

.packages .package .package-price {
    font-size: 30px;
    font-weight: 300;
    display: block;
}

.packages .package .package-features ul li {
    margin: 15px 0;
    list-style: none;
}
.package-features {
    text-align: left;
    margin-left: 15px;
}
.package-features i {
    margin: 0px 5px 0px 0px;
}
.packages .package .btn {
    margin-top: 10px;
    width: 208px;
}

/* Spinning timer dialog */
.loader-center {
    position: absolute;
    left: 50%;
    top: 60%;
    transform: translate(-50%, -60%);
    padding: 10px;
}
.loader-box {
    align-items: center;
    display: flex;
    /*height: 100%;*/
    justify-content: center;
    padding: 10px;
    z-index: 9;
}
.loader {
    background-color: #973A90;
    width: 300px;
    height: 150px;
    border: 1px black;
    border-radius: 10px;
}
.loader-wheel {
    animation: loader-spin 1s infinite linear;
    border: 2px solid rgba(30, 30, 30, 0.5);
    border-left: 4px solid #fff;
    border-radius: 50%;
    height: 50px;
    width: 50px;
    margin-left: auto;
    margin-right: auto;
}
.loader-text {
    color: #fff;
    font-family: arial, sans-serif;
}
.loader-text:after {
    /* content: 'Please wait while we setup your Organisation';*/
    /*animation: load 2s linear infinite;*/
}

@keyframes loader-spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/*@@keyframes load {
  0% {
    content: 'Please wait while we setup your Organisation';
  }
  33% {
    content: 'Please wait while we setup your Organisation.';
  }
  67% {
    content: 'Please wait while we setup your Organisation..';
  }
  100% {
    content: 'Please wait while we setup your Organisation...';
  }
}*/


.bullet {
    margin-right: 10px;
   /* margin-top: 4px;*/
    /*background-color:#00bdff;*/
    border-radius: 30px;
    width: 22px;
    height: 22px;
    font-size: 12px;
    display: flex !important;
    text-align: center;
    justify-content: center;
    align-items: center;
    flex: 0 0 22px;
}
.bulletBlue {
    background-color: #00BDFF;
    color: #ffffff;
}

.bulletPurple {
    background-color: #8C57E0;
    color: #ffffff;
}

.bulletOrange {
    background-color: #FC8229;
    color: #ffffff;
}

.bulletItem {
    display: flex;
    align-items: center;
    line-height: 1.8;
}

.bulletItem i {
    margin-left: 10px;
    margin-right: 6px;
    font-size: 14px;
}
.whiteBack {
    background-color: #ffffff;
    border-radius: 20px;
    filter: drop-shadow(2px 2px 2px #878ba8);
}
.whiteText {
    color: white;
}

.navyText {
    color: #0e1750;
}

.orangeText {
    color: #FC8229;
}

.purpleText {
    color: #8C57E0;
}

.lightBlueText {
    color: #00BDFF;
}

.greenText {
    color: #62E157;
}

.denimBlueText {
    color: #002C85;
}

.steelBlueText {
    color: #6F859E;
}

.navyBack {
    background-color: #0e1750;
    color: #ffffff;
}

.orangeBack {
    background-color: #FC8229;
    color: #ffffff;
}

.purpleBack {
    background-color: #8C57E0;
    color: #ffffff;
}

.lightBlueBack {
    background-color: #00BDFF;
    color: #ffffff;
}

.greenBack {
    background-color: #62E157;
    color: #0e1750;
}

.denimBlueBack {
    background-color: #002C85;
    color: #ffffff;
}

.steelBlueBack {
    background-color: #6F859E;
    color: #ffffff;
}
/* Regular blue button */
.btnBlue {
    background-color: #0e1750;
    color: white;
}

.btnBlue:hover {
    background-color: #00BDFF;
    color: #ffffff;
}

.btnOrange {
    background-color: #FC8229;
    color: white;
}

.btnOrange:hover {
    background-color: #fd9b54;
    color: #ffffff;
}

.btnPurple {
    background-color: #8C57E0;
    color: white;
}

    .btnPurple:hover {
        background-color: #9868e3;
        color: #ffffff;
    }

.btnLightBlue {
    background-color: #00BDFF;
    color: white;
}

    .btnLightBlue:hover {
        background-color: #33caff;
        color: #ffffff;
    }

.btnGreen {
    background-color: #62E157;
    color: #0e1750;
}

    .btnGreen:hover {
        background-color: #81e779;
        color: #0e1750;
    }

.pricingBox {
    border: 1px #0e175055 solid;
    margin: 8px;
    min-height: 480px;
    /*padding: 8px;*/
    /*border-radius:10px;
        filter: drop-shadow(2px 2px 2px #333333);*/
}