/* GLOBAL STYLES

-------------------------------------------------- */

/* Padding below the footer and lighter body text */



@import url(https://fonts.googleapis.com/css?family=Roboto:400,700);



body {

  padding-bottom: 40px;

  color: #5a5a5a;

  font-family: "Roboto";

}



.form-buttons {

  clear: both;

  /*padding-top: 15px;*/

  overflow: hidden;

  /*margin: 0 0 0 -555px;*/
  margin: 0 0 0 -355px;

}

.form-buttons > * {

  width: 50%;

  display: block;

  text-align: center;

  padding: 12px 0;

  font-weight: bold;

  text-decoration: none;

  font-size: 15px;

  float: right;

  clear: both;

}

.form-buttons > a:hover {

  opacity: 0.85;

  text-decoration: none;

}

.form-buttons img {

  padding: 0;

}



/* CUSTOMIZE THE NAVBAR

-------------------------------------------------- */



/* Special class on .container surrounding .navbar, used for positioning it into place. */

.navbar-wrapper {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;

  z-index: 20;

}



.justify {

  text-align: justify;

}



.adjust1 {

  margin: -50px 0 0 0;

}

.adjust2 {

  margin: 0 0 -50px 0;

}

.adjust3 {

  margin: 15px 0 0 0;

}



/* Flip around the padding for proper display in narrow viewports */

.navbar-wrapper > .container {

  padding-right: 0;

  padding-left: 0;

}

.navbar-wrapper .navbar {

  padding-right: 15px;

  padding-left: 15px;

}

.navbar-wrapper .navbar .container {

  width: auto;

}



.nav > li > a{

  padding: 24px 16px;

  font-size: 18px;

}

.navbar-brand,

.nav .phone {

  color: #fff !important;

  font-weight: bold;

}

.navbar-brand {

  padding-top: 5px;

  padding-bottom: 0;

}



.navbar-wrapper { margin-top: 20px !important; }



/*.navbar-brand, .navbar-brand:hover {

  background: #fff !important;

  height: 138px;

  margin-bottom: -40px;

  margin-top: -40px;

  box-shadow: #000 0 0 2px;

}*/



.navbar-wrapper .navbar, .form-control, .btn {

  border-radius: 0 !important;

}



.footer-nav {

  list-style-type: none;

  padding: 0;

  text-align: center;

  margin: 40px 0 -20px;

}

.footer-nav li {

  display: inline-block;

  margin: 0 15px;

}

.accepted-cards {

  float: right;

}

#new-quote {

  color: #0079c6;

  padding: 0;

}

#checkout {

  color: #fff;

  background: #40a040;

  border: #008000 1px solid;

  margin-bottom: 20px;

}





/* CUSTOMIZE THE CAROUSEL

-------------------------------------------------- */



/* Carousel base class */

.carousel {

  height: 500px;

  margin-bottom: 60px;

}

/* Since positioning the image, we need to help out the caption */

.carousel-caption {

  z-index: 10;

  margin-left: 25px;

  margin-right: 25px;

}



/* Declare heights because of positioning of img element */

.carousel .item {

  height: 500px;

  background-color: #777;

  background: #777 url('img/mechanic.jpg') center;

  background-size: cover;

}



.carousel h1 {

  margin-bottom: 25px !important;

}

.carousel h1 span {

  background: rgba(217,0,0,0.75);

  /*padding: 5px 15px 7px;*/

  font-weight: bold;

  display: inline-block;

}

.carousel h3 span {

  background: rgba(1,1,255,0.55);

  padding: 5px 15px 7px;

  display: inline-block;

}



.carousel-caption {

  left: 0;

  right: 0;

}



.quote-conteiner {

  background: #eee;

  margin: -60px 0 -81px;

  padding: 10px 0 20px;

}



.navbar-brand {

  height: auto !important;

}

.navbar-toggle {

  margin-top: 16px !important;

}





/* MARKETING CONTENT

-------------------------------------------------- */



/* Center align the text within the three columns below the carousel */

.marketing .col-lg-4 {

  margin-bottom: 20px;

  text-align: center;

}

.marketing h2 {

  font-weight: normal;

}

.marketing .col-lg-4 p {

  margin-right: 10px;

  margin-left: 10px;

}





/* Featurettes

------------------------- */



.featurette-divider {

  margin: 80px 0; /* Space out the Bootstrap <hr> more */

}



/* Thin out the marketing headings */

.featurette-heading {

  font-weight: 300;

  line-height: 1;

  letter-spacing: -1px;

}







/* RESPONSIVE CSS

-------------------------------------------------- */



@media (min-width: 768px) {



  /* Navbar positioning foo */

  .navbar-wrapper {

    margin-top: 20px;

  }

  .navbar-wrapper .container {

    padding-right: 15px;

    padding-left: 15px;

  }

  .navbar-wrapper .navbar {

    padding-right: 0;

    padding-left: 0;

  }



  /* The navbar becomes detached from the top, so we round the corners */

  .navbar-wrapper .navbar {

    border-radius: 4px;

  }



  /* Bump up size of carousel content */

  .carousel-caption p {

    margin-bottom: 20px;

    font-size: 21px;

    line-height: 1.4;

  }



  .featurette-heading {

    font-size: 50px;

  }

}



@media (min-width: 992px) {

  .featurette-heading {

    margin-top: 120px;

  }

}



@media (max-width: 992px) {

  .footer-nav li {

    margin: 0 5px;

  }

}



@media (max-width: 768px) {

  .footer-nav {

    margin-bottom: 20px;

  }

}