
/* Track (the area on the sides of the scrollbar) */
::-webkit-scrollbar {
    height: .5rem;
    width: .5rem;
}
.dark ::-webkit-scrollbar-thumb {
    background-color: hsla(0,0%,100%,.1);
}
::-webkit-scrollbar-thumb {
    background-color: rgba(217,217,227,.8);
    border-color: rgba(255,255,255,1);
    border-radius: 9999px;
    border-width: 1px;
}
  ::-webkit-scrollbar-track {
    background-color: transparent;
    border-radius: 9999px;
}






/* invert the logo for coloured backgrounds. */
#mainLogoArea {    
    filter : brightness(0) invert(1);
}

/* handle the default styling of the page */
body.fournetTheme   #navigationTop {
    background-color: var(--Darkest-theme-color)!important;
}
body.fournetTheme  #allApplications {
    background-color: var(--Darkest-theme-color)!important;
} 
body.fournetTheme  #iconMenuBar {
    background-color: var(--SideBar-Background)!important;
    background-color: var(--theme-background) !important;
}

/* handle the styling of IconMenuBar */
body.fournetTheme #iconMenuBar > .iconItem.bottom {
    position: absolute;
    bottom:0;
    top:unset;
}
body.fournetTheme #iconMenuBar > .iconItem {
    color: var(--theme-text-color) !important;
}
body.fournetTheme #iconMenuBar > .iconItem:hover {
    background-color: var(--Darkest-theme-color) !important;
    color: var(--iconItem-hover-color) !important;
}
body.fournetTheme #iconMenuBar > .iconItem:hover > .leftMenuIcon {
    background-color: var(--Darkest-theme-color) !important;
    color: var(--iconItem-hover-color) !important;
}
body.fournetTheme #iconMenuBar > .iconItem.selected > .leftMenuIcon {
    padding: 4px 15px 4px 7px !important;
    margin: 8px 0px 8px 1px !important;
    border-left: 2px solid var(--Darkest-theme-color);
}
body.fournetTheme #iconMenuBar > .iconItem.selected:hover > .leftMenuIcon {
    color: var(--iconItem-hover-color) !important;
    padding: 11px 15px !important;
    margin: 0 !important;
    border-left: 0px solid var(--Darkest-theme-color);
}
body.fournetTheme #iconMenuBar > .iconItem.selected {
    color: var(--Darkest-theme-color) !important;
    margin-left: 4px;
    padding-left: 0px;
    background-color: transparent;
}
body.fournetTheme #iconMenuBar > .iconItem.selected:hover {
    background-color: var(--Darkest-theme-color) !important;
    color: var(--iconItem-hover-color) !important;
    margin: 0;
}

body.fournetTheme th {
    background-color: var(--Darkest-theme-color);
    color: white;
}
body.fournetTheme tr.selected, body.fournetTheme tr.selected td {
    background-color: var(--Darkest-theme-color);
    color: #fff !important;
}
body.fournetTheme tr:hover, body.fournetTheme tr.odd:hover, body.fournetTheme tr:hover td {
    background-color: var(--Lightest-theme-color);
    color: #fff !important;
}

.fournetTheme-Button {
    background-color: var(--Darkest-theme-color) !important;
    border-color: var(--Second-theme-color) !important;
    color: #fff !important;
}
.fournetTheme-Button:hover {
    background-color: var(--Second-theme-color) !important;
    border-color: var(--Darkest-theme-color) !important;
    color: #fff !important;
}
.fournetTheme-iconButton {
    color: var(--Darkest-theme-color) !important;
}
.fournetTheme-iconButton:hover {
    color: var(--Second-theme-color) !important;
}

.context-menu_Colours {
    display: block;
    margin-top: 5px;
    padding: 4px 12px;
    text-decoration: none;
}
.ColourBlock {
    display: inline-block;
    width: 30px;
    height: 30px;
    content: "";
    border-radius: 2px;
    margin: 0px 5px 5px 0px;
}
.mainTheme {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 9px 0px;
    height: 35px;
}
.ColourBlock:hover {
    cursor: pointer;
    -moz-box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.3);
    -webkit-box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.3);
    box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.3);
}
.BlockpurpleTheme {
    background-color: #38006b;
}
.BlockpinkTheme {
    background-color: #c60055;
}
.BlockdarkTheme {
    background-color: #1f1f1f;
}
.BlockblueTheme {
    background-color: #0069c0;
}
.BlockgreyTheme {
    background-color: #707070;
}
.BlockbrownTheme {
    background-color: #40241a;
}
.BlockorangeTheme {
    background-color: #b53d00;
}
.BlockgreenTheme {
    background-color: #255d00;
}
.BlocktealTheme {
    background-color: #005b4f;
}
.BlockcyanTheme {
    background-color: #005662;
}
.BlockdarkblueTheme {
    background-color: #005b9f;
}
.BlockindigoTheme {
    background-color: #3949ab;
}
.BlockdarkindigoTheme {
    background-color: #00227b;
}
.BlockhotPinkTheme {
    background-color: #e91e63;
}
.BlocklightblueTheme {
    background-color: #039be5;
} 
.BlockctredTheme {
    background-color: #D32F2F;
} 
.BlocklightPurpleTheme {
    background-color: #6a1b9a;
}
.BlocklightgreenTheme {
    background-color: #7cb342;
}