#appointment-wrapper html, #appointment-wrapper #appointment-wrapper body, #appointment-wrapper #appointment-wrapper div, #appointment-wrapper span, #appointment-wrapper applet, #appointment-wrapper object, #appointment-wrapper iframe,
#appointment-wrapper h1, #appointment-wrapper h2, #appointment-wrapper h3, #appointment-wrapper h4, #appointment-wrapper h5, #appointment-wrapper h6, #appointment-wrapper p, #appointment-wrapper blockquote, #appointment-wrapper pre,
#appointment-wrapper a, #appointment-wrapper abbr, #appointment-wrapper acronym, #appointment-wrapper address, #appointment-wrapper big, #appointment-wrapper cite, #appointment-wrapper code,
#appointment-wrapper del, #appointment-wrapper dfn, #appointment-wrapper em, #appointment-wrapper img, #appointment-wrapper ins, #appointment-wrapper kbd, #appointment-wrapper q, #appointment-wrapper s, #appointment-wrapper samp,
#appointment-wrapper small, #appointment-wrapper strike, #appointment-wrapper strong, #appointment-wrapper sub, #appointment-wrapper sup, #appointment-wrapper tt, #appointment-wrapper var,
#appointment-wrapper b, #appointment-wrapper u, i, #appointment-wrapper center,
#appointment-wrapper dl, #appointment-wrapper dt, #appointment-wrapper dd, #appointment-wrapper ol, #appointment-wrapper ul, #appointment-wrapper li,
#appointment-wrapper fieldset, #appointment-wrapper form, #appointment-wrapper label, #appointment-wrapper legend,
#appointment-wrapper table, #appointment-wrapper caption, #appointment-wrapper tbody, #appointment-wrapper tfoot, #appointment-wrapper thead, #appointment-wrapper tr, #appointment-wrapper th, #appointment-wrapper td,
#appointment-wrapper article, #appointment-wrapper aside, #appointment-wrapper canvas, #appointment-wrapper details, #appointment-wrapper embed,
#appointment-wrapper figure, #appointment-wrapper figcaption, #appointment-wrapper footer, #appointment-wrapper header, #appointment-wrapper hgroup,
#appointment-wrapper menu, #appointment-wrapper nav, #appointment-wrapper output, #appointment-wrapper ruby, #appointment-wrapper section, #appointment-wrapper summary,
#appointment-wrapper time, #appointment-wrapper mark, #appointment-wrapper audio, #appointment-wrapper video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

div#appointment-wrapper{
    background-color: white;
}

#appointment-wrapper {
  line-height: 1;
}

#appointment-wrapper ol, #appointment-wrapper ul {
  list-style: none;
}

#appointment-wrapper table {
  border-collapse: collapse;
  border-spacing: 0;
}

#appointment-wrapper caption, #appointment-wrapper th, #appointment-wrapper td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

#appointment-wrapper q, #appointment-wrapper blockquote {
  quotes: none;
}
#appointment-wrapper q:before, #appointment-wrapper q:after, #appointment-wrapper blockquote:before, #appointment-wrapper blockquote:after {
  content: "";
  content: none;
}

#appointment-wrapper a img {
  border: none;
}

#appointment-wrapper article, #appointment-wrapper aside, #appointment-wrapper details, 
#appointment-wrapper figcaption, #appointment-wrapper figure, #appointment-wrapper footer, 
#appointment-wrapper header, #appointment-wrapper hgroup, #appointment-wrapper main, #appointment-wrapper menu, 
#appointment-wrapper nav, #appointment-wrapper section, #appointment-wrapper summary {
  display: block;
}

/* Colors */
/* ---------------------------------------- */
#appointment-wrapper * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#appointment-wrapper  {
  text-align: center;
  /*font-family: 'Lato', 'sans-serif';*/
  font-weight: 400;
}

#appointment-wrapper a {
  text-decoration: none;
}

#appointment-wrapper .info-text {
  text-align: left;
  width: 100%;
}

#appointment-wrapper header, #appointment-wrapper form {
  padding: 4em 10%;
}

#appointment-wrapper .form-group {
  margin-bottom: 20px;
}

#appointment-wrapper h2.heading {
  font-size: 18px;
  /*text-transform: uppercase;*/
  font-weight: 300;
  text-align: left;
  color: #506982;
  border-bottom: 1px solid #506982;
  padding-bottom: 3px;
  margin-bottom: 20px;
}

#appointment-wrapper .controls {
  text-align: left;
  position: relative;
}
#appointment-wrapper .controls input[type="text"],
#appointment-wrapper .controls input[type="email"],
#appointment-wrapper .controls input[type="number"],
#appointment-wrapper .controls input[type="date"],
#appointment-wrapper .controls input[type="time"],
#appointment-wrapper .controls input[type="tel"] {
  background: none;
  padding: 12px;
  font-size: 14px;
  border: 0px solid #c6c6c6;
  border-bottom: 1px solid #c6c6c6;
  width: 100%;
  margin-bottom: 18px;
  color: #888;
  font-family: 'Lato', 'sans-serif';
  font-size: 16px;
  font-weight: 300;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
#appointment-wrapper .controls textarea,
#appointment-wrapper .controls button,
#appointment-wrapper .controls select {
  background: none;
  padding: 12px;
  font-size: 14px;
  border: 1px solid #c6c6c6;
  width: 100%;
  margin-bottom: 18px;
  color: #888;
  font-family: 'Lato', 'sans-serif';
  font-size: 16px;
  font-weight: 300;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
#appointment-wrapper .controls input[type="text"]:focus, .controls input[type="text"]:hover,
#appointment-wrapper .controls input[type="email"]:focus,
#appointment-wrapper .controls input[type="email"]:hover,
#appointment-wrapper .controls input[type="number"]:focus,
#appointment-wrapper .controls input[type="number"]:hover,
#appointment-wrapper .controls input[type="date"]:focus,
#appointment-wrapper .controls input[type="date"]:hover,
#appointment-wrapper .controls input[type="time"]:focus,
#appointment-wrapper .controls input[type="time"]:hover,
#appointment-wrapper .controls input[type="tel"]:focus,
#appointment-wrapper .controls input[type="tel"]:hover,
#appointment-wrapper .controls textarea:focus,
#appointment-wrapper .controls textarea:hover,
#appointment-wrapper .controls button:focus,
#appointment-wrapper .controls button:hover,
#appointment-wrapper .controls select:focus,
#appointment-wrapper .controls select:hover {
  outline: none;
  border-color: #9FB1C1;
}
#appointment-wrapper .controls input[type="text"]:focus + label, .controls input[type="text"]:hover + label,
#appointment-wrapper .controls input[type="email"]:focus + label,
#appointment-wrapper .controls input[type="email"]:hover + label,
#appointment-wrapper .controls input[type="number"]:focus + label,
#appointment-wrapper .controls input[type="number"]:hover + label,
#appointment-wrapper .controls input[type="date"]:focus + label,
#appointment-wrapper .controls input[type="date"]:hover + label,
#appointment-wrapper .controls input[type="time"]:focus + label,
#appointment-wrapper .controls input[type="time"]:hover + label,
#appointment-wrapper .controls input[type="tel"]:focus + label,
#appointment-wrapper .controls input[type="tel"]:hover + label,
#appointment-wrapper .controls textarea:focus + label,
#appointment-wrapper .controls textarea:hover + label,
#appointment-wrapper .controls button:focus + label,
#appointment-wrapper .controls button:hover + label,
#appointment-wrapper .controls select:focus + label,
#appointment-wrapper .controls select:hover + label {
  color: #bdcc00;
  cursor: text;
}
#appointment-wrapper .controls .fa-sort {
  position: absolute;
  right: 10px;
  top: 17px;
  color: #999;
}
#appointment-wrapper .controls select {
  -moz-appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}
#appointment-wrapper .controls label {
  position: absolute;
  left: 8px;
  top: 12px;
  width: 60%;
  color: #999;
  font-size: 16px;
  display: inline-block;
  padding: 4px 10px;
  font-weight: 400;
  background-color: rgba(255, 255, 255, 0);
  -moz-transition: color 0.3s, top 0.3s, background-color 0.8s;
  -o-transition: color 0.3s, top 0.3s, background-color 0.8s;
  -webkit-transition: color 0.3s, top 0.3s, background-color 0.8s;
  transition: color 0.3s, top 0.3s, background-color 0.8s;
  background-color: white;
}
#appointment-wrapper .controls label.active {
  top: -11px;
  color: #555;
  background-color: white;
  width: auto;
}
#appointment-wrapper .controls textarea {
  resize: none;
  height: 200px;
}

#appointment-wrapper button {
  cursor: pointer;
  background-color: lightseagreen;
  border: none;
  color: #fff;
  padding: 12px 0;
  float: right;
}

#appointment-wrapper .btn-danger {
  background-color: darkred;
}
#appointment-wrapper button:hover {
  background-color: #224c60;
}

#appointment-wrapper .clear:after {
  content: "";
  display: table;
  clear: both;
}

#appointment-wrapper .grid {
  background: white;
}
#appointment-wrapper .grid:after {
  /* Or @extend clearfix */
  content: "";
  display: table;
  clear: both;
}

#appointment-wrapper [class*='col-'] {
  float: left;
  padding-right: 10px;
}
#appointment-wrapper .grid [class*='col-']:last-of-type {
  padding-right: 0;
}

#appointment-wrapper .col-2-3 {
  width: 66.66%;
}

#appointment-wrapper .col-1-3 {
  width: 33.33%;
}

#appointment-wrapper .col-1-2 {
  width: 50%;
}

#appointment-wrapper .col-1-4 {
  width: 25%;
}

@media (max-width: 760px) {
  #appointment-wrapper .col-1-4-sm, #appointment-wrapper .col-1-3, #appointment-wrapper .col-2-3 {
    width: 100%;
  }

  #appointment-wrapper [class*='col-'] {
    padding-right: 0px;
  }
}
#appointment-wrapper .col-1-8 {
  width: 12.5%;
}