@font-face {
  font-family: 'robotoblack';
  src: url("fonts/roboto-black-webfont.woff2") format("woff2"), url("fonts/roboto-black-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }
.page-content {
  font-family: robotoregular, sans-serif;
  margin-top: 20px;
  margin-bottom: 30px; }

section #car {
  float: right;
  margin-left: 25px;
  width: 48%; }

section #car img {
  max-width: 100%; }

section #intro {
  margin-top: 15px; }

section #intro h2 {
  display: inline-block;
  margin-top: 15px; }

section #intro p {
  color: #2c2c2c;
  font-size: 14px;
  line-height: 22px;
  margin-top: 20px; }

section #intro p span {
  color: #e15f00;
  font-family: robotobold, sans-serif;
  display: block; }

section #intro a {
  color: #004282; }

section #intro a:hover {
  color: #e15f00; }

section #intro ul {
  list-style-type: none;
  margin: 20px 0 20px 35px; }

section #intro ul li {
  margin: 5px;
  padding-left: 1em;
  text-indent: -.7em; }

section #intro ul li:before {
  content: "\002022";
  color: #004282;
  padding-right: 7px; }

section #services {
  /* border-right: 1px solid #ccc; */
  float: left;
  padding: 10px 0;
  /* width: 48%; */
  width: 100%;  }

section #services .service {
  float: left;
  margin: 15px 0;
 /*  width: 50%; */
 width: 33%; }

section #services .service .wrapper {
  padding-right: 20px;
  width: auto; }

section #services .service .wrapper .image-wrapper {
  margin-bottom: 15px;
  width: 100%; }

section #services .service .wrapper .image-wrapper img {
  max-width: 100%; 
  margin: 0 auto;
  display: table;}

section #services .service .wrapper .description span {
  color: #e15f00;
  font-family: robotobold, sans-serif; 
  text-align: center;
  display: block;}

section #services .service .wrapper .description p {
  line-height: 20px;
  margin-top: 5px; 
  text-align: justify;
  padding: 0 10%;}

section #appointment {
  float: right;
  width: 50%; }

section #appointment h2 {
  letter-spacing: 1px;
  margin-top: 10px;
  margin-bottom: 15px; }

section #appointment p {
  line-height: 20px; }

section #appointment form {
  margin-top: 20px; }

section #appointment form > div {
  margin: 15px 0;
  position: relative; }

section #appointment form .half {
  width: 49%; }

section #appointment form .left {
  float: left; }

section #appointment form .right {
  float: right; }

section #appointment form .full {
  float: left;
  width: 100%; }

section #appointment form label {
  color: #004282;
  display: block;
  font-family: familiar_probold, sans-serif;
  font-size: 12px;
  letter-spacing: 2px;
  margin-bottom: 8px; }

section #appointment form input,
section #appointment form textarea {
  border: 1px solid #ababab;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px;
  width: 100%; }

section #appointment form textarea {
  height: 150px; }

section #appointment form #calendar {
  background: url(../images/calendar.png) no-repeat;
  margin: 6px;
  position: absolute;
  right: 0;
  width: 25px;
  height: 28px; }

section #appointment form #time-wrapper {
  width: 100%; }

section #appointment form #time-wrapper input {
  float: left;
  width: 75%; }

section #appointment form #time-wrapper .select-wrapper {
  float: left;
  padding: 10px;
  width: 25%;
  height: auto; }

section #appointment form #time-wrapper .select-wrapper .select-arrow {
  top: 16px; }

section #appointment form #time-wrapper .select-value {
  color: #004282;
  font-family: robotoblack, sans-serif; }

section #appointment form #time-wrapper .select-options {
  color: #004282;
  display: none;
  font-family: robotoblack, sans-serif;
  top: 39px; }

section #appointment form #time-wrapper .select-options ul {
  list-style-type: none; }

section #appointment form #time-wrapper .select-options ul li {
  cursor: default;
  padding: 5px 10px;
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
  user-select: none; }

section #appointment form #time-wrapper .select-options ul li:hover {
  background: #e1e1e1; }

section #appointment form .button-wrapper {
  overflow: hidden; }

section #appointment form .button-wrapper .cta-tail {
  position: relative;
  z-index: 1; }

section #appointment form .button-wrapper button {
  margin-left: -30px;
  width: 100%; }

section #appointment form .button-wrapper button img {
  margin-left: 30px; }

#ui-datepicker-div {
  box-sizing: border-box; }

@media screen and (max-width: 900px) {
  section #car {
    margin: 0 auto;
    text-align: center;
    width: 100%; }

  section #services,
  section #appointment {
    width: 100%; }

  section #services {
    border: 0; }

  section #services .service {
   /*  width: 25%;  */
    width: 48%; }
  }
@media screen and (max-width: 700px) {
  section #services .service {
    /* width: 50%; */
    width: 100%; }

  section #services .service .wrapper {
    padding: 0 20px; }

  section #appointment {
    margin-top: 25px; } }
@media screen and (max-width: 560px) {
  section #services .service .wrapper {
    padding: 0 10px; }

  section #appointment form .half {
    width: 100%; } }
@media screen and (max-width: 380px) {
  section #services .service {
    padding: 0;
    width: 100%; } }

/*# sourceMappingURL=services.css.map */
