#main {margin-top:64px;width:100%}
#main2 {margin-top:10px;width:100%}
@media (min-width: 1900px) {
    #main {margin-top:40px;width:100%}
}
.Error { color: red; }
.hidden {display:none;}
#searchTemplate {display:none;}
/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    background-color: #333; /* Black background color */
    color: #fff; /* White text color */
    text-align: center; /* Centered text */
    border-radius: 2px; /* Rounded borders */
    padding: 16px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 2000; /* Add a z-index if needed */
    left: 50%; /* Center the snackbar */
    top: 60px; /* 60px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
    visibility: visible; /* Show the snackbar */
    /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
    However, delay the fade out process for 2.5 seconds */
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
    from {top: 0; opacity: 0;}
    to {top: 60px; opacity: 1;}
}

@keyframes fadein {
    from {top: 0; opacity: 0;}
    to {top: 60px; opacity: 1;}
}

@-webkit-keyframes fadeout {
    from {top: 60px; opacity: 1;}
    to {top: 0; opacity: 0;}
}

@keyframes fadeout {
    from {top: 60px; opacity: 1;}
    to {top: 0; opacity: 0;}
} 

.selectWidth {
    width:200px;
}

#txtTemplate {
    width:500px;
    height:300px;
}

.cvWrapper {
    width:100%;
}
textarea.cvWrapper {
    width:100%;
}

#txtCv {
    width: 800px;
    height: 800px;
}

.wrapper {
    display: flex;
    width: 100%;
}
#sidetoggleRight {
    margin-top: 16px;
}
#sidetoggleRightMarks {
    margin-top: 16px;
    margin-right:4px;
}
#favourite {
    margin-top: 16px;
}
#sidebarRight {
    width: 240px;
    position: fixed;
    display:none;
    top: 80px;
    right: 0px;
    /*height: 100%;*/
    bottom:0px;
    z-index: 997;
    background: #f8f8f8;
    transition: all 0.3s;
    padding:4px;
}
#sidebarRightBookmarks {
    width: 240px;
    position: fixed;
    overflow-y: scroll;
    display:none;
    top: 80px;
    right: 0px;
    bottom:0px;
    z-index: 999;
    background: #f8f8f8;
    transition: all 0.3s;
    padding:4px;
}
.rightoffset {
    margin-right: 240px;
}
@media (max-width: 768px) {
    #sidebar {
        width: 120px;
        position: fixed;
        display:none;
        top: 80px;
        left: 0;
        height: 100vh;
        z-index: 999;
        background: #f8f8f8;
        transition: all 0.3s;
        padding-left:5px;
    }

    .main {
        margin-left: 0px;margin-top:20px; /* Same width as the sidebar + left position in px */
    }
    #sidetoggle {
        display:block;
        float:left;
        margin-top: 8px;
        margin-left: 8px;
    }
    .footlogo {
        vertical-align:top;
        margin-top:-16px;
    }
    .westlogo {
        width:100px;
        vertical-align:top;
        padding-top:13px;
    }
    .footerLeft {
        left:0px;
    }
}
@media (min-width: 769px) {
    #sidebar {
        width: 120px;
        position: fixed;
        top: 80px;
        left: 0;
        height: 100vh;
        z-index: 999;
        background: #f8f8f8;
        transition: all 0.3s;
        padding-left:5px;
    }
    #sidetoggle {
        display:block;
        float:left;
        margin-top: 8px;
        margin-left: 8px;
        margin-right: 8px;
    }
    .main {
        margin-left: 120px; /* Same width as the sidebar + left position in px */
    }
    .mt20 {
        margin-top:40px;
    }
    .footerLeft {
        left:125px;
    }
}
.displayHidden {display:none;}

#main {
    margin-bottom: 20px;
}

input {width:250px;margin-bottom: 2px;}
textarea {width:250px;margin-bottom: 2px;}
.fourHundredselect {width:250px;}
input[type='checkbox'] {width:10px}
input[type='radio'] {width:10px}
.wraptxt {width:250px;min-width:250px;display:block;}


div.pad8 table td {padding-bottom:10px}
div.pad8 input, div.pad8 input, div.pad8 textarea, div.pad8 select {display:block;}
div.pad8 input {margin-top:2px;}
/*div.pad8 textarea {max-height: 500px;}*/
div.pad8 {margin-bottom: 5px;}
div.pd8 {padding:8px;}
h4 {margin-bottom: 0px;}
.red {color:red;font-weight: bold;}
.mT10 {margin-top:10px;}
.mB10 {margin-bottom:10px;}

@-moz-document url-prefix() {
    fieldset { display: table-cell; }
}
div.imageWrapper img {max-width:200px;}
div.imageWrapper {width:200px;}

.table td {max-width:250px;
           overflow-wrap: break-word;

}
.detailsMin {
    min-width: 600px;
}


@media (max-width: 1320px) {
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7.5px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .collapse.in{
        display:block !important;
    }
}
#navbar {
    width:100%;
}

table th, table td {
    width: auto !important;
    padding: 0px 0px 0px 5px;
}
.ml10 {
    margin-left:10px;
}
.mr10 {
    margin-right:10px;
}
.ml5 {
    margin-left:5px;
}
.mr5 {
    margin-right:5px;
}
.loader {
    position: fixed;
    border: 8px solid #f3f3f3;
    border-radius: 50%;
    border-top: 8px solid #428bca;
    width: 35px;
    height: 35px;
    left:50%;
    top:50%;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}
.overlay{
    position: absolute;
    top:0px;
    left:0px;
    width: 100%;
    height: 200%;
    background: black;
    opacity: .5;
    display:none;
}
.loadercontainer{
    position:relative;
}

/* Safari */
@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.westlogo {
    vertical-align:top;
    margin-top:-16px;
}
.footlogo {
    vertical-align:top;
    margin-top:-16px;
}
.listHeaderLeft {float:left;background-color: #f9f9f9;}
.limitRight {float:right;background-color: #f9f9f9;}
.listHeaderContainer {
    background-color: #f9f9f9;
    padding:2px;
    display:block;
    height:auto;
    width:100%;
    margin-bottom:12px;
    overflow: hidden;
}
.listLimitWidth {width:250px;max-width:250px;display:block;}
.hideDetails {margin-left:14px; background-color: #f9f9f9;margin-bottom:12px;}
.w100 {width:100%;}
.orIdent {margin-left:10px;margin-bottom:10px;padding:10px;border: 1px solid grey;}
.colorRed {color:red;}

#footerFixed {
    bottom:0;
    position: fixed;
    margin-left:10px;
    height:20px;
    padding:1px;
    width:100%;
    background-color:#f8f8f8;
    border-color:#e7e7e7;
    text-align: left;
    z-index:20;
}
#footerFixed2 {
    bottom:20px;
    position: fixed;
    height:40px;
    padding:1px;
    margin-left:10px;
    width:100%;
    background-color:#f8f8f8;
    border-color:#e7e7e7;
    text-align: left;
    z-index:20;
}

@media (min-width: 1200px) {
    .container {
        margin-right: auto;
        margin-left: auto;
        width:1200px;
    }
}

@media (min-width: 1400px) {
    .container {
        margin-right: auto;
        margin-left: auto;
        width:1400px;
    }
}
@media (min-width: 1900px) {
    .container {
        margin-right: auto;
        margin-left: auto;
        width:1900px;
    }
}
#searchOuterWrapper {
    z-index:1501;
}
.notification {

    text-decoration: none;
    padding: 5px 6px;
    position: relative;
    display: inline-block;
    border-radius: 2px;
}
.notification img {
    margin-top:-6px;
    background-color:#f8f8f8;
}
.notification:hover {
    background: red;
}

.notification .badgeNotification {
    position: absolute;
    top: 2px;
    right: -5px;
    padding: 2px 7px;
    border-radius: 50%;
    background: red;
    color: white;
}

.padLeft5 {padding-left:5px;}
.right {float:right;}
.clear {clear: both;}
.max500 {max-width:500px;}

#drop_zone {
    border: 5px solid #d1d1d1;
    padding:5px;
    width:  250px;
    height: 100px;
}

.modal { overflow-y: auto }
#calendar {
    max-width: 1900px;
    margin: 0 auto;
}

.modal-dialog-larger {
    width: 1910px;
    margin: 30px auto;
}

.leftResponsive {width:275px;float:left;}
.rightResponsive {width:275px;float:left;}
.largerInput { width:600px;}
.handsOff0 {color:green;font-weight:bold}
.handsOff_0 {color:green;font-weight:bold}
.handsOff0_0 {color:green;font-weight:bold}
.handsOff0_1 {color:blue;font-weight:bold}
.handsOff_1 {color:blue;font-weight:bold}
.handsOff {color:green;font-weight:bold}
.handsOff1 {color:red;font-weight:bold}
.handsOff1_0 {color:red;font-weight:bold}
.handsOff1_1 {color:purple;font-weight:bold}
.canBorder01 {border: 5px solid green;}
.canBorder02 {border: 5px solid blue;}
.canBorder03 {border: 5px solid gold;}
.canBorder04 {border: 5px solid pink;}
.canBorder11 .canBorder12 .canBorder13 .canBorder14 {border: 5px solid red;}

.imgOverLaywrap {
    position: relative;

    width:100px;
    height:100px;
}
.imgOverLaywrapLarger {
    position: relative;

    width:200px;
    height:200px;
}
/*.imgOverLaywrap .overlay {
    position: absolute;
    top: 80px;
    right: 15px;
    background: url(/images/transCV_20.png) no-repeat;
}*/

.overLayTest {
    position: absolute;
    top: 80px; right: 0;
    background: url(/images/transCV_20.png) repeat;
    z-index:32;
}
img.imgOver2 {
    background: url(/images/interview-icon2.png) center center no-repeat;
    background-size: cover;
    content: '';
    display: block;
    width: 800px;
    height: 100px;
}
.main_image {
    width: 100%;
    height: 100%;
}
.overlayCV1 {
    position: absolute;
    bottom: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    opacity: 75%;
    background: url(/images/whiteCV_20.png) repeat;
}
.overlayInterview1 {
    position: absolute;
    bottom: 2px;
    left: 24px;
    width: 22px;
    height: 20px;
    opacity: 75%;
    background: url(/images/whiteInterview20.png) repeat;
}
.overlayPlaced1 {
    position: absolute;
    bottom: 2px;
    left: 48px;
    width: 15px;
    height: 20px;
    opacity: 75%;
    background: url(/images/placed_20.png) repeat;
}
.overlayActive1 {
    position: absolute;
    bottom: 2px;
    left: 65px;
    width: 20px;
    height: 20px;
    opacity: 75%;
    background: url(/images/active_20.png) repeat;
}
.inline {
    display: inline-block;
}
.gauge__needle {
    display:none;
}
.searchWrap div.uniFloatLeft {
    transform: scale(0.8);
    transform-origin: top left;
}
.searchWrap {
    margin-left:2px;
    display: flex;
    flex-direction: row;
    width: 1200px;
}
.searchWrap div {
}
.guage {

    width: auto !important;
}
.searchWrap div.dashHeadersWidth {
    min-width:100px;
    width:100px;
    display:block;
}
.dashHeadersWidth {
    min-width:100px;
    width:100px;
    display:block;
}

.dashHeadersCenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}
.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}
.spancenter {
    display: table;
    margin: 0 auto;
    margin-top:5px;
}
.padLeftDials {
    margin-left:10px;
}
.uniWrapper {
    width:100%;
    height:100%;
    overflow: hidden;
}
.uniFloatLeft {
    float:left;
    display: inline-block;
    min-width:150px;
    max-width:500px;
}
.uniContainers {
    position: relative;
    animation: MoveUpDown 1s linear infinite;
    height:150px;
    width:100%;
    margin-left: 10px;
    margin-right: 10px;
}
.shortPosition {
    width:33px;
    position: absolute;
    top:90px;
    left:5px;
}
.mangerPosition {
    width:33px;
    position: absolute;
    top:25px;
    left:5px;
}
.mangerPosition2 {
    width:33px;
    position: absolute;
    top:25px;
    left:-28px;
}
.mangerPosition3 {
    width:33px;
    position: absolute;
    top:25px;
    left:-61px;
}
img.uni {
    width:75px;
    position: absolute;
    top:40px;
}
img.candidateUni {
    width:50px;
    position: absolute;
    left:50px;
}
div.candidateInit {
    width:50px;
    position: absolute;
    left:73px;
    font-weight: bold;
    top:58px;
}
.firstDollar {
    position: absolute;
    top:110px;
    left:20px;
}
.offerDollar {
    position: absolute;
    top:110px;
    left:60px;
}
.secondDollar {
    position: absolute;
    top:110px;
    left:35px;
}
.thirdDollar {
    position: absolute;
    top:110px;
    left:55px;
}
.fourthDollar {
    position: absolute;
    top:110px;
    left:75px;
}
.fifthDollar {
    position: absolute;
    top:110px;
    left:95px;
}
img.companyUni {
    height:50px;
    position: absolute;
    top:5px;
    left:100px;
}
p.stage {
    width:10px;
    position: absolute;
    top:65px;
    left:85px;
    font-weight:bold;
}
img.companyUni2 {
    height:50px;
    max-width:100px;
    margin: auto; 
}
p.sg {
    width:10px;
    position: relative;
    top:5px;
    left:30px;
    font-weight:bold;
}
.companySpacer {
    /*position: absolute;
    top:5px;
    left:100px;*/
    margin-left:100px;
    margin-top:5px;
}
.companyContainer {
    display: flex;
    gap: 0px;
    width:100%;
}

.uniFlexContainer {
    display: flex;
    align-content: flex-start;
    flex-wrap:wrap;
    gap: 10px;
}
@keyframes MoveUpDown {
    0%, 100% {
        bottom: 0;
    }
    50% {
        bottom: 5px;
    }
}

a{
    cursor: pointer;
}
#uniAllWrapper {
    display:none;
}
.uniSpacer {
    height:15.58px;display:block;
}

.graphContainer {
    width:500px; height:500px;
}
@media (min-width: 3000px) {
    .graphContainer {
        width:1000px; height:500px;
    }
}
.searchMarqueeWrapper {
    margin: auto;
}

.searchWrapHeader {
    width: 560px;
    float: left;
}
.marqueeWrap {
    width: 590px;
}
@media (min-width: 1000px) {
    .marqueeWrap {
        margin-left:10px;
        float: left;
        width: 1130px;
    }
}
[data-tooltip]::before {
    /* needed - do not touch */
    content: attr(data-tooltip);
    position: absolute;
    opacity: 0;

    /* customizable */
    transition: all 0.15s ease;
    padding: 10px;
    color: #fff;
    border-radius: 10px;
    box-shadow: 2px 2px 1px silver;
}

[data-tooltip]:hover::before {
    /* needed - do not touch */
    opacity: 1;

    /* customizable */
    background: black;
    margin-top: -30px;
    margin-left:25px;
}

[data-tooltip]:not([data-tooltip-persistent])::before {
    pointer-events: none;
}

.items-list {
    display: grid;
    grid-template-rows: 50px 50px; /* 2 rows of 50px */
    grid-auto-flow: column;  /* a column flow */
    grid-auto-columns:100px; /* each column will 100px of width */
    grid-gap: 5px;
    overflow: auto;
}
.item {
    border:2px solid red;
}

/* Custom styles for the submenu */
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: 0;
    border-radius: 0 4px 4px 4px;
}

.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

.dropdown-submenu > a:after {
    content: " ";
    float: right;
    border: 5px solid transparent;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover > a:after {
    border-left-color: #fff;
}