#map.sl_map {
    /*width: 768px;*/
    /*margin-left: 5px;*/
    height: 700px;
    border: 1px solid #ccc;
}

.sidebar {
    position: absolute;
    /*width: 87%;*/
    overflow: hidden;
    z-index: 200;
    height: 600px;
    top: 185px; /* further adjusted by JS in jobs_map.html */
    /*margin-top: 175px;*/
    margin-left: 10px;
}

.sidebar-header {
    background-color: #A33540;
}

#sidebar-icons {
    display: none;
}

#sidebar-icons > ul {
    margin-top: 15px;
    margin-left: 0;
}

.jobList {
    overflow-y: auto;
    height: 560px;
    margin: 0 -20px;
}

.jobPopup {
    text-align: center;
}


.jobEntry .jobDetails {
    max-width: 375px !important;
}


.jobPopup .companyLogo {
    min-width: 50px;
}

.jobPopup .companyLogo > img {
    max-height: 35px;
    max-width: 50px;
    margin: 0 auto;
}

.jobPopup .companyLogo > img {
    max-width: 120px !important;
}

.jobList .additionalDetails {
    max-width: 150px !important;
    margin-right: 10px;
}

.jobList .more_items_link {
    padding: 20px;
}

.sidebar-left .sidebar-content {
    overflow-y: hidden;
}

.leaflet-popup-content {
    min-width: 150px;
}

.leaflet-popup-content-wrapper {
    border-radius: 0;
}

.leaflet-container {
    background-color: #FFF !important;
}

.jobList .jobEntry {
    padding-top: 20px;
    padding-bottom: 20px;
}
.jobList .jobEntry:hover {
    background-color: #F5F5F5;
    cursor: pointer;
}
.jobList .jobEntry:not(:last-child) {
    border-bottom: 1px solid #DDDDDD;
}
.jobList .companyLogo,
.jobList .jobDetails {
    margin-left: 10px;
}
.jobList .jobTitle a {
    text-decoration: none;
    font-weight: bold;
}
.jobList .jobIcons {
    margin-left: 10px;
}
.jobList .jobIcons .recommendation-enabled {
    vertical-align: -22%;
}
.jobList .companyLogo {
    min-width: 50px;
}
.jobList .companyLogo img {
    max-height: 35px;
    max-width: 50px;
}
.jobList .jobDetails {
    max-width: 500px;
}
.jobList .additionalDetails {
    max-width: 200px;
    margin-right: 10px;
}
.jobList .jobDate,
.jobList .jobLocation {
    text-align: right;
}
.jobList .jobDate {
    font-weight: bold;
}
.jobList .jobLocation a {
    text-decoration: none;
}
.jobList .jobLocation span {
    font-size: 16px;
}
.jobList .jobLocation .fa {
    color: #A33540;
}
.jobList .no-results {
    text-align: center;
    padding: 50px;
    font-weight: bold;
}
.mapLink, .listLink {
    text-decoration: none;
    font-weight: bold;
}

/*  Overwrite css_style.css */
/* Bootstrap border-radius is removed everywhere, but we need this on map markers */
.marker-cluster {
    border-radius: 20px !important;
}
.marker-cluster div {
    border-radius: 15px !important;
}

.map-toggle {
    background-color: #A33540;
    color: #fff;
    border: 1px solid #A33540;
    padding: 5px 10px;
    margin-bottom: 15px;
    min-width: 75px;
}

.map-toggle:hover {
    background-color: #81252E;
}

.map-toggle:focus {
    outline: none;
}