.leaflet-routing-container, .leaflet-routing-error {
    width: 320px;
    background-color: white;
    padding-top: 4px;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.leaflet-control-container .leaflet-routing-container-hide {
    width: 32px;
    height: 32px;
}

.leaflet-routing-container h2 {
    font-size: 14px;
}

.leaflet-routing-container h3 {
    font-size: 12px;
    font-weight: normal;
}

.leaflet-routing-collapsible .leaflet-routing-geocoders {
    margin-top: 20px;
}

.leaflet-routing-alt, .leaflet-routing-geocoders, .leaflet-routing-error {
    padding: 6px;
    margin-top: 2px;
    margin-bottom: 6px;
    border-bottom: 1px solid #ccc;
    max-height: 320px;
    overflow-y: auto;
    transition: all 0.2s ease;
}

.leaflet-control-container .leaflet-routing-container-hide .leaflet-routing-alt, 
.leaflet-control-container .leaflet-routing-container-hide .leaflet-routing-geocoders {
    display: none;
}

.leaflet-bar .leaflet-routing-alt:last-child {
    border-bottom: none;
}

.leaflet-routing-alt-minimized {
    color: #888;
    max-height: 64px;
    overflow: hidden;
    cursor: pointer;
}

.leaflet-routing-alt table {
    border-collapse: collapse;
}

.leaflet-routing-alt tr:hover {
    background-color: #eee;
    cursor: pointer;
}

.leaflet-routing-alt::-webkit-scrollbar {
    width: 8px;
}

.leaflet-routing-alt::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #eee;
}

.leaflet-routing-alt::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #888;
}

.leaflet-routing-icon {
    background-image:'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'
	/* url('leaflet.routing.icons.png'); */
    -webkit-background-size: 240px 20px;
    background-size: 240px 20px;
    background-repeat: no-repeat;
    margin: 0;
    content: '';
    display: inline-block;
    vertical-align: top;
    width: 20px;
    height: 20px;
}

.leaflet-routing-icon-continue         { background-position: 0 0; }
.leaflet-routing-icon-sharp-right      { background-position: -20px 0; }
.leaflet-routing-icon-turn-right       { background-position: -40px 0; }
.leaflet-routing-icon-bear-right       { background-position: -60px 0; }
.leaflet-routing-icon-u-turn           { background-position: -80px 0; }
.leaflet-routing-icon-sharp-left       { background-position: -100px 0; }
.leaflet-routing-icon-turn-left        { background-position: -120px 0; }
.leaflet-routing-icon-bear-left        { background-position: -140px 0; }
.leaflet-routing-icon-depart           { background-position: -160px 0; }
.leaflet-routing-icon-enter-roundabout { background-position: -180px 0; }
.leaflet-routing-icon-arrive           { background-position: -200px 0; }
.leaflet-routing-icon-via              { background-position: -220px 0; }

.leaflet-routing-geocoders div {
    padding: 4px 0px 4px 0px;
}

.leaflet-routing-geocoders input {
    width: 303px;
    width: calc(100% - 4px);
    line-height: 1.67;
    border: 1px solid #ccc;
}

.leaflet-routing-geocoders button {
    font: bold 18px 'Lucida Console', Monaco, monospace;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: white;
    margin: 0;
    margin-right: 3px;
    float: right;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.leaflet-routing-add-waypoint:after {
    content: '+';
}

.leaflet-routing-reverse-waypoints:after {
    font-weight: normal;
    content: '\21c5';
}

.leaflet-routing-geocoders button:hover {
    background-color: #eee;
}

.leaflet-routing-geocoders input,.leaflet-routing-remove-waypoint,.leaflet-routing-geocoder {
    position: relative;
}

.leaflet-routing-geocoder-result {
    font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    position: absolute;
    max-height: 0;
    overflow: hidden;
    transition: all 0.5s ease;
    z-index: 1000; /* Arbitrary, but try to be above "most" things. */
}

.leaflet-routing-geocoder-result table {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 0 0 4px 4px;
    background-color: white;
    cursor: pointer;
}

.leaflet-routing-geocoder-result-open {
    max-height: 800px;
}

.leaflet-routing-geocoder-selected, .leaflet-routing-geocoder-result tr:hover {
    background-color: #eee;
}

.leaflet-routing-geocoder-no-results {
    font-style: italic;
    color: #888;
}

.leaflet-routing-remove-waypoint {
    background-color: transparent;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
}

.leaflet-routing-remove-waypoint:after {
    position: absolute;
    display: block;
    width: 15px;
    height: 1px;
    z-index: 1;
    right: 1px;
    top: 4px;
    bottom: 0;
    margin: auto;
    padding: 2px;
    font-size: 18px;
    font-weight: bold;
    content: "\00d7";
    text-align: center;
    cursor: pointer;
    color: #ccc;
    background: white;
    padding-bottom: 16px;
    margin-top: -16px;
    padding-right: 4px;
    line-height: 1;
}

.leaflet-routing-remove-waypoint:hover {
    color: black;
}

.leaflet-routing-instruction-distance {
    width: 48px;
}

.leaflet-routing-collapse-btn {
    position: absolute;
    top: 0;
    right: 6px;
    font-size: 24px;
    color: #ccc;
    font-weight: bold;
}

.leaflet-routing-collapse-btn:after {
    content: '\00d7';
}

.leaflet-routing-container-hide .leaflet-routing-collapse-btn {
    position: relative;
    left: 4px;
    top: 4px;
    display: block;
    width: 26px;
    height: 23px;
    background-image:'iVBORw0KGgoAAAANSUhEUgAAABoAAAAXCAYAAAAV1F8QAAABjUlEQVR4Ab1VA4h0URR+v23btv/8wtgKa9v2bp6wDOuwjpPdZG/mxs2b3eS359Q99eymerhH3/HlBEGw/WQymVPRaPR3JBLJwv81PVnbIADQBACC/OF5/rRrQGCwDo2Gw+F1juNOIC0QCNwhMFeA0DAzeCTnVVVVnWe8JadAmLJ3aAy+D9X4WlHZSVseDek40ot8jNwZkE4dTHddPB5/BQXei8ViH9Ejq0DY7qBfCvxCMBiMiW0QwHW1VkVgs0Agy+vZECtjux6wrsoSDc9GQFNTUyeJDjW6gjoA8F1sg8M0EQFCv0wpEIGnjYBAplqNLgL/ioecnpCcblG2wOg5ju0q9LyTBpIJ/WTetDmI6JAioknHwz5ONPvfxHmh3WWxRqg7RGeqEXn0V61joH4Vel0no//XsPFEPEfUAAvkFSzJc67PUbE3g9hQvlhAgt4VAekZcwxENyfk+L6KEzPIa2hoOOMYSBxVKBR6KYpkiG5VknMMRHOh8iwg3zUgerxe7yWsB27mX79+UbpsPcfWV8aO/4mmHgAAAABJRU5ErkJggg=='
	
	/* url('routing-icon.png'); */
}

.leaflet-routing-container-hide .leaflet-routing-collapse-btn:after {
    content: none;
}

.leaflet-top .leaflet-routing-container.leaflet-routing-container-hide {
    margin-top: 10px !important;
}
.leaflet-right .leaflet-routing-container.leaflet-routing-container-hide {
    margin-right: 10px !important;
}
.leaflet-bottom .leaflet-routing-container.leaflet-routing-container-hide {
    margin-bottom: 10px !important;
}
.leaflet-left .leaflet-routing-container.leaflet-routing-container-hide {
    margin-left: 10px !important;
}

@media only screen and (max-width: 640px) {
    .leaflet-routing-container {
        margin: 0 !important;
        padding: 0 !important;
        width: 100%;
        height: 100%;
    }
}
