/*
 * Globals
 */

 /* Links */
 a,
 a:focus,
 a:hover {
  color: #fff;
}

/* Custom default button */
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
  color: #333;
  text-shadow: none; /* Prevent inheritance from `body` */
  background-color: #fff;
  border: .05rem solid #fff;
}


/*
 * Base structure
 */

 html,
 body {
  height: 100%;
  background-color: #333;
}

body {
  /*display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;*/
  color: #fff;
  text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
  box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
}
.text-center {
  text-align: center!important;
}
.flex-column {
  -webkit-box-orient: vertical!important;
  -webkit-box-direction: normal!important;
  -ms-flex-direction: column!important;
  flex-direction: column!important;
}
article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block;
}
.mb-auto, .my-auto {
  margin-bottom: auto!important;
}
.cover-container {
  max-width: 90%;
  margin: 0 auto;
}


/*
 * Header
 */
 header {
  margin-bottom: 2rem;
}
.masthead-brand {
  margin-bottom: 0;
}
.justify-content-center {
  -webkit-box-pack: center!important;
  -ms-flex-pack: center!important;
  justify-content: center!important;
}
.nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
  justify-content: end;
}
.main-menu li {
  display: inline-block;
  position: relative;
}
.main-menu ul.sub-menu {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  padding-left: 0;
  border: 3px solid #fff;
  width: 200px;
  text-align: center;
}
.main-menu ul.sub-menu li{
  display: block;
  text-align: left;
}
.main-menu ul.sub-menu li:hover,
.main-menu ul.sub-menu li.active{
  background-color: rgba(255, 255, 255, .5); 
}
.main-menu ul.sub-menu li a{
  padding: 1rem;
}
.main-menu li:hover > ul.sub-menu {
  opacity: 1;
  visibility: visible;
}
.nav-masthead .nav-link {
  font-weight: 700;
  background-color: transparent;
  border-bottom: .25rem solid transparent;
}
.nav-masthead .nav-link a{
  display: block;
  color: rgba(255, 255, 255, .5);
  padding: 2rem;
  text-decoration: none;
}
.nav-masthead .nav-link:hover,
.nav-masthead .nav-link:focus,
.nav-masthead .nav-link.active {
  border-bottom-color: rgba(255, 255, 255);
}
.nav-masthead .nav-link:hover a,
.nav-masthead .nav-link:focus a,
.nav-masthead .nav-link.active a {
  color: rgba(255, 255, 255, 1);
}

@media (min-width: 48em) {
  .masthead-brand {
    float: left;
  }
  .nav-masthead {
    float: right;
  }
}


/*
 * Cover
 */
 .cover {
  padding: 0 1.5rem;
}
.cover .btn-lg {
  padding: .75rem 1.25rem;
  font-weight: 700;
}
main.inner.cover {
  min-height: 70vh;
  margin-top: 15vh;
}
main.home.inner.cover {
  min-height: 50vh;
  margin-top: 25vh;
}
/*
 * Footer
 */
 .mastfoot {
  color: rgba(255, 255, 255, .5);
}
.panel {
  background-color: inherit;
}
.clear {
  clear: both;
}
.error {
  color: #ff0000;
}
.half-width .form-control {
  width: 50%;
}
.available-dates, .available-slots{
  display: table-cell;
  border: 1px solid;
}
.available-dates input[type="radio"], .available-slots input[type="radio"] {
  display: none;
}
.date-sel-wrap, .slot-sel-wrap {
  margin: 5px 0;
}
.available-dates label.active {
  background-color: #5bc0de;
}
.available-slots label.active {
  background-color: #5cb85c;
}

/** datatables */
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
  background: transparent;
}
table.dataTable thead .sorting_asc:after {
  content: "\f0de";
  float: right;
  font-family: fontawesome;
}
table.dataTable thead .sorting_desc:after {
  content: "\f0dd";
  float: right;
  font-family: fontawesome;
}
table.dataTable thead .sorting:after {
  content: "\f0dc";
  float: right;
  font-family: fontawesome;
  color: rgba(50, 50, 50, 0.5);
}
/* datatables ends */
.appoint div#dataTables-pages_wrapper {
  text-align: left;
}
@media screen and (max-width: 620px) {
  .date-sel-wrap, .slot-sel-wrap {
    width: 50% !important;
  }
}
@media screen and (max-width: 500px) {
  .date-sel-wrap, .slot-sel-wrap {
    width: 100% !important;
  }
}