html, body {font-family:'Roboto', sans-serif;}

#top-btns .logo {float:left;width:34px;}
#top-btns {text-align:right;padding:0 20px;}
#top-btns > a > img {width:20px;margin-left:20px;} 

#top-div {box-shadow:0px -1px 2px rgba(0,0,0,0.05), 0px 4px 8px rgba(0,0,0,0.2);z-index:2;padding:20px 0;}
#map-div {z-index:1;position:relative;padding:0;}
#map {width:100%;height:400px;}

.popover {max-width:100%;}
.popover table td:last-child {text-align:right;}
.row {padding:10px 0;}
.btn-default {border:1px solid #ccc;}
.btn-primary, .btn-primary:hover {background-color:#a90073;border-color:#a90073;}
.btn-primary.save, .btn-primary.save:hover {background-color:#0071b3;border-color:#0071b3;}
label {font-weight:bold;margin:5px;text-transform:uppercase;color:#6b6b6b;font-size:0.9em;}
label.form-check-label {font-weight:normal;}

ul {list-style:none;margin:20px 0;padding:0;}
ul > li {display:inline-block;}
ul > li > a {display:inline-block;width:150px;background:#fff;padding:5px 10px;border:1px solid #ccc;border-radius:4px;text-decoration:none;color:#000;margin:0 10px 10px 0;}
ul > li.selected > a {background:#eee;color:#999;}

#config, #settings {background:#f6f6f6;padding:20px 0;}
#settings {margin:20px 0;border-top:1px solid #ccc;border-bottom:1px solid #ccc;}

.timeslot {padding:10px 20px;border:1px solid #000;margin:20px 0;}
.timeslot .slot-time {text-align:center;font-size:2em;}
.timeslot .dist {float:right;}
.slot-time {margin:10px;}

#dates .nav-link {width:100px;padding:10px;color:#999;}
#dates .nav-link.active {color:#000;}
#dates .date .wd {display:block;font-size:1.2em;padding:6px;}


#results-div {background:#f6f6f6;padding:0;border:1px solid #e5e5e5;}
#results-div h4 {padding:20px;}
#results-div p {padding:10px 20px;}

.date-div {border-top:1px solid #e5e5e5;background:#fff;position:relative;}
.date-div.unselected > .slots {padding-left:80px;padding-top:10px;padding-bottom:10px;}
.date-div .slots > a {display:inline-block;padding:5px 10px;margin:10px 10px 10px 0;border:1px solid #e5e5e5;background:#fff;text-decoration:none;color:#6b6b6b;min-width:130px;text-align:center;border-radius:4px;font-size:0.9em;}

.date-banner {display:inline-block;height:100%;background:#f6f6f6;padding:10px;text-align:center;vertical-align:middle;margin-right:20px;color:#222;width:64px;border-right:1px solid #e5e5e5;}
.date-div.unselected .date-banner {display:block;position:absolute;top:0;left:0;}
.date-banner .dt {font-weight:bold;display:block;}
.date-banner .dow {font-size:0.7em;text-transform:uppercase;}

.date-div.selected {padding:20px;background:#f6f6f6;white-space:normal;}
.date-div.selected .date-banner {display:block;font-size:1.1em;color:#a90073;background:transparent;padding:0;text-align:left;width:auto;}

.date-div a:hover {background:#0071b3;color:#fff;}
.date-div:last-child {border-bottom:1px solid #e5e5e5;}

#confirmModal .modal-footer {border-top:0;}
#confirmModal .modal-body .type {border:1px solid #999;border-radius:4px;padding:2px 5px;color:#999;float:right;}

#types {min-height:100px;border:1px solid #ced4da;padding:10px;background:#fff;}
.tag {padding:0 25px 0 5px;border-radius:4px;position:relative;margin:5px;background:#f6f6f6;border:1px solid #e5e5e5;display:inline-block;}
.tag > a {display:block;position:absolute;top:-1px;right:5px;color:#ccc;text-decoration:none;}

#show-kpis-div {float:right;font-size:0.8em;}
.kpis {padding:10px 0 0 0;font-size:0.8em;display:none;}
.kpis.show {display:block;}
.kpi {padding:2px 6px;margin:0 4px;background:#0071b3;color:#fff;border-radius:4px;opacity:0.8;}

#results {overflow:hidden;overflow-x:auto;width:100%;}
.slot-table {width:100%;}
.slot-table th {text-align:center;padding:10px;} 
.slot-table th.selected {background:#efefef;border-top-left-radius:10px;border-top-right-radius:10px;}
.slot-table td {text-align:center;padding:20px 0;}
.slot-table td.selected {background:#efefef;border-bottom-right-radius:10px;border-bottom-left-radius:10px;} 
.slot-table td > a {display:block;padding:5px 10px;margin:10px;border:1px solid #e5e5e5;background:#fff;text-decoration:none;color:#6b6b6b;min-width:190px;text-align:center;border-radius:4px;font-size:0.9em;}
.slot-table td.selected > a {padding:8px;border-color:#ccc;font-size:1.1em;}
.slot-table th .dow {font-size:1.4em;}
.slot-table th.selected {font-size:1.4em;}