/*--------------------------------------------------------
                        Global styles
--------------------------------------------------------*/
body {
  font-family: "Montserrat", sans-serif;
}
h1,
h2,
h3 {
  font-family: "Anton", sans-serif;
}
.row {
  margin: 0;
  padding: 0;
}
img {
  width: 100%;
}
video {
  box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06),
    0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086),
    0 100px 80px rgba(0, 0, 0, 0.12);
  border-radius: 5px;
}
/*--------------------------------------------------------
                        Header styles
--------------------------------------------------------*/
header {
  min-height: 60vh;
  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
    url(../img/home.jpg) fixed center center/cover;
  color: #fff;
  text-transform: capitalize;
  position: relative;
  padding: 7% 0;
}
header h1 {
  font-size: 3rem;
}
header p {
  color: #f6f6f6;
}
header .intro_box {
  padding: 30px 20px;
}
header ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
  position: absolute;
  bottom: 20px;
  right: 50px;
}
header li {
  display: inline-block;
}
header a {
  display: inline-block;
  padding: 5px;
  color: #fff;
  font-size: 1.2em;
  transition: all 0.3s ease-in-out;
}
header a:hover {
  color: #6f35c0;
}

/*--------------------------------------------------------
                        key_features styles
--------------------------------------------------------*/
.key_features {
  padding: 7% 0;
}
.key_features h2 {
  font-weight: 900;
  font-size: 3rem;
  color: #333;
  letter-spacing: 0.3rem;
}
.features-row {
  margin: 3rem 0;
}
.key_features article {
  text-align: center;
  background-color: #fff;
  color: #333;
  padding: 10px;
  margin: 10px;
  border-radius: 5px;
  box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06),
    0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086),
    0 100px 80px rgba(0, 0, 0, 0.12);
}
.key_features article h3 {
  color: #000;
}
.key_features article i {
  font-size: 2em;
  margin-bottom: 15px;
}

/*--------------------------------------------------------
                        services styles
--------------------------------------------------------*/
.services {
  background-color: #6a0dad;
  padding: 7% 0;
}
.services h2 {
  font-size: 3rem;
  color: rgb(255, 255, 255);
}
.services p {
  color: #f6f6f6;
}
.services img {
  box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06),
    0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086),
    0 100px 80px rgba(0, 0, 0, 0.12);
  border-radius: 5px;
}

/*--------------------------------------------------------
                        our_fleet styles
--------------------------------------------------------*/
.our_fleet {
  padding: 7% 0;
}
.our_fleet h2 {
  font-size: 3rem;
  color: #333;
}

/*--------------------------------------------------------
                        various_sizes styles
--------------------------------------------------------*/
.various_sizes {
  padding: 7% 0;
  background-color: #6f35c0;
  position: relative;
  color: #fff;
}
.various_sizes h2 {
  font-size: 3rem;
  color: rgb(255, 255, 255);
}
.various_sizes p {
  color: #f6f6f6;
}
.various_sizes img {
  box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
    0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06),
    0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086),
    0 100px 80px rgba(0, 0, 0, 0.12);
  border-radius: 5px;
}

/*--------------------------------------------------------
                        reach_out styles
--------------------------------------------------------*/
.reach_out {
  padding: 0;
  height: 100vh;
  background: url(../img/ThanitJuly_17.jpg) top center/cover;
  position: relative;
}
.call_box {
  position: absolute;
  bottom: 20%;
  left: 15%;
  background-color: #fff;
  padding: 10px;
  border-radius: 5px;
}
.reach_out h2 {
  font-size: 3rem;
  color: #333;
}
.reach_out ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
}
.reach_out li {
  padding: 0.2rem 0;
  margin: 1rem 0;
}
.reach_out a {
  color: #6a0dad;
  font-size: 1.3rem;
}
.reach_out i {
  color: #6a0dad;
  font-size: 1.3rem;
}
/*--------------------------------------------------------
                        footer styles
--------------------------------------------------------*/

footer {
  padding: 7% 0;
  background-color: #202125;
  color: #fff;
}
footer i {
  margin-right: 0.5rem;
}
footer h2 {
  margin-bottom: 1rem;
}
footer p,
footer a {
  color: rgb(170, 170, 170);
}
footer a:hover {
  color: #ffff00;
}
footer ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
}
footer .foot {
  margin-bottom: 25px;
}
footer .foot a {
  font-size: 1rem;
}

/*--------------------------------------------------------
            Quote, reservation, contact styles
--------------------------------------------------------*/
.form-control {
  margin: 0.5rem 0;
}
.contact_form {
  padding: 7% 0;
}

header.contact {
  background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
    url(../img/contact.jpg) center center/cover;
}
header.reservation {
  background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
    url(../img/reservation.jpg) center center/cover;
}
header.quote {
  background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
    url(../img/quote.jpg) center center/cover;
}
header.response {
  background: url(../img/response.jpg) top center/cover;
}
section.response {
  padding: 7% 0;
  text-align: center;
}
section.response img {
  width: 10%;
}
/*---------------------------
    Responsive styles
---------------------------*/
@media (max-width: 1024px) {
  .key_features,
  .various_sizes,
  .services {
    padding: 17% 0;
  }
  video {
    margin: 2rem 0;
  }
  .lower_footer {
    margin-bottom: 2rem;
  }
  .problem_form {
    margin-top: 2rem;
  }
}
