body #danplannerBookingWidgetRoot {
  --bar-background-color: #00749a;
  --bar-button-background-color-primary: #399fc5;
  --bar-button-background-hover-color-primary: #399fc5;
  --bar-button-font-color-primary: #fff;
  --bar-button-background-color-secondary: #045874; 
  --bar-button-background-hover-color-secondary: #045874; 
  --bar-button-font-color-secondary: #fff;  
  --bar-button-hover-opacity: 1;
  --bar-button-height: 46px;        
  --bar-dropdown-background-hover-color-primary: #00749a;
  --bar-dropdown-font-hover-color-primary: #fff;
  --bar-top: 0;
  --bar-button-max-width: 275px;
  --bar-font-family: "Myriad Pro Light Condensed";
  --bar-font-size: 20px;
}

@media (max-width: 500px) {
body #danplannerBookingWidgetRoot .control-container {
    width: 100%;
    max-width: 100%;
    padding-bottom: 10px;
}
body #danplannerBookingWidgetRoot .control-container:last-child {
    padding-bottom: 0px;
}
body #danplannerBookingWidgetRoot .dropdown {
    height: auto;
}
body #danplannerBookingWidgetRoot .danplanner-booking-bar {
    padding: 20px 10px!important;
}
}

body #danplannerBookingWidgetRoot #danplannerBookingForm {
    margin: 0;
}
body #danplannerBookingWidgetRoot .danplanner-booking-bar {
    position: relative;
    width: 100%;
    border-radius: 0;
    border: none;
    padding: 20px 0;
}
body #danplannerBookingWidgetRoot .secondary-button {
    font-weight: 600;
}
body #danplannerBookingWidgetRoot .primary-button,
body #danplannerBookingWidgetRoot .secondary-button {
    border-radius: 0;
}
body #danplannerBookingWidgetRoot .secondary-button:disabled, 
body #danplannerBookingWidgetRoot .primary-button:disabled {
    opacity: 1;
}
body #danplannerBookingWidgetRoot .secondary-button:disabled {
        color: var(--bar-button-font-color-secondary);
}

body #danplannerBookingWidgetRoot #resourceTypesDropdown > .d-flex {
    border-bottom: solid 1px;
}
body #danplannerBookingWidgetRoot #resourceTypesDropdown {
    padding-bottom: 14px;
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
    min-width: 0;
}
body #danplannerBookingWidgetRoot #personTypesDropdown {
    padding: 0 10px;
    width: 100%;
    min-width: 0;
    padding-bottom: 14px;
}
body #personTypesDropdown tbody {
    width: 100%;
}
body #personTypesDropdown tbody tr {
    display: flex;
    border-bottom: solid 1px;
}
body #personTypesDropdown tbody tr td {
    display: block;
    width: calc(100% - 100px);
}
body #personTypesDropdown tbody tr td:last-child {
    display: block;
    width: 100px;
}
body #personTypesDropdown tbody tr td:last-child > .d-flex {
    display: block !important;
}
body #personTypesDropdown tbody tr td:last-child > .d-flex div {
    margin: 0 !important;
}

body #personTypesDropdown tbody tr td:last-child .d-flex .d-flex > p {
    width: 21px;
    padding: 0;
}
body #danplannerBookingDates::before {
content: " ";
    position: absolute;
    height: 100%;
    width: 28px;
    left: 9px;
    top: -1px;
    background-image: url(/images/bookingbar/calendar-icon-placeholder.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}
body #resourceTypes::before {
content: " ";
    position: absolute;
    height: 100%;
    width: 28px;
    left: 9px;
    top: 0px;
    background-image: url(/images/bookingbar/muligheder-icon-placeholder.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}
body #personTypes::before {
content: " ";
    position: absolute;
    height: 100%;
    width: 28px;
    left: 9px;
    top: 0px;
    background-image: url(/images/bookingbar/personer-icon-placeholder.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}
body #danplannerBookingWidgetRoot .primary-button {
    text-align: left;
    padding-left: 45px;
    position: relative;
}