/*  General Styles
=========================*/
html {
  box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: inherit;
}
body {
  font-family: "Raleway", sans-serif;
  font-weight: 400;
}
h1,
h2,
h3 {
  font-weight: 800;
}
.row {
  margin: 0;
  padding: 0;
}
/*  Contact Navigation
=========================*/
.contact-nav {
  background-color: #f5f6fa;
  color: #8a93a7;
}
.contact-nav ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  justify-content: end;
}
.contact-nav li {
  padding: 0;
}
.contact-nav li a {
  display: block;
  padding: 10px 0;
  margin: 5px 0;
  font-size: 0.8em;
}
.contact-nav a i {
  font-size: 1.2em;
  margin-right: 5px;
}

/*  Main Navigation
=========================*/
.site-logo {
  width: 70px;
}
.navbar-brand {
  margin-right: 50px;
}
.navbar-nav li {
  margin: 0 15px;
}

/*  Home Header
=========================*/
.home-header {
  background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)),
    url(../img/home-header.jpg) center right/cover;
  height: 600px;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
.home-header-box h1 {
  font-size: 70px;
}
.home-header-box {
  text-align: right;
}

/*  Home-Quote-Section
=========================*/
.home-quote-section {
  padding: 50px 0;
}
/*  Services
=========================*/
.services {
  padding: 80px 0;
  margin-top: 70px;
}
.our-services {
  justify-content: center;
}
.services h2 {
  color: #2c2a55;
}
.services h2 + p {
  color: #8a93a7;
}
.service {
  color: #fff;
  height: 400px;
  border: 1px solid #ebeef2;
}
.service.airport {
  background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
    url(../img/services/airport.jpg) center center/cover;
}
.service.bach {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/bachelorette.jpg) center center/cover;
}
.service.birthday {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/birthday.jpg) center center/cover;
}
.service.business {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/business.jpg) 60% 50% / cover;
}
.service.casino {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/casino.jpg) center center/cover;
}
.service.concert {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/concert.jpg) center center/cover;
}
.service.cruise {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/cruise.jpg) center center/cover;
}
.service.outlet {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/outlets.jpg) center center/cover;
}
.service.proms {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/proms.jpg) center center/cover;
}
.service.quin {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/quin.jpg) center center/cover;
}
.service.shuttle {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/shuttle.jpg) center center/cover;
}
.service.wedding {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/services/wedding.jpg) center center/cover;
}

/*  Why-us
=========================*/
.why-us {
  padding: 80px 0;
  text-align: center;
}
.why-us h2 {
  color: #2c2a55;
  padding: 20px 0;
}
.why-us .feature span {
  background: linear-gradient(to bottom right, #ebeef2, #fff);
  color: #2c2a55;
  border: 3px dashed #2c2a55;
  border-radius: 50%;
  padding: 10px 25px;
  font-size: 3em;
  font-weight: 800;
  display: inline-block;
}
.why-us .feature h3 {
  margin-top: 10px;
  color: #2c2a55;
}

/*  reserve-quote
=========================*/
.reserve-quote {
  padding: 80px 0 20px;
  text-align: center;
}
.reserve-quote h3 {
  color: #2c2a55;
}
.reserve-quote p {
  color: #8a93a7;
}

.reserve-quote-buttons {
  background-color: #4e5aff;
  text-align: left;
  font-weight: 800;
  padding: 20px;
  border-radius: 10px;
}
.reserve-quote-buttons p {
  color: #fff;
}
.reserve-quote-buttons a {
  display: inline-block;
  padding: 10px;
  background-color: #ebeef2;
  color: #2c2a55;
  border-radius: 20px;
  transition: 0.3s ease-in-out;
}
.reserve-quote-buttons a:hover {
  background-color: #2c2a55;
  color: #ebeef2;
  text-decoration: none;
}
/*  Footer
=========================*/
footer {
  background-color: #ebeef2;
  padding-top: 100px;
  color: #8a93a7;
}
.home-footer {
  clip-path: polygon(
    46% 7%,
    58% 7%,
    100% 0,
    100% 100%,
    70% 100%,
    30% 100%,
    0 100%,
    0 0
  );
}
footer h3 {
  color: #2c2a55;
}
.foot {
  padding: 20px;
}
.foot img {
  width: 100px;
  padding-bottom: 10px;
}
.foot ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
}
.foot li a {
  display: inline-block;
  padding: 5px 0;
  margin: 5px 0;
}

/*=================================
        Contact Page
=================================*/
.message-us {
  background-color: #f9f9f9;
  clip-path: polygon(
    46% 7%,
    58% 7%,
    100% 0,
    100% 100%,
    70% 100%,
    30% 100%,
    0 100%,
    0 0
  );
  padding: 100px 0;
  text-align: left;
}
header.contact-header {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/contact22.jpg) center center/cover;
}
.contact-info {
  padding: 100px 0;
}
.contact-info ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
}
.contact-info h2 {
  color: #2c2a55;
}
.contact-info li {
  color: #8a93a7;
}
@media (min-width: 768px) {
  .contact-info {
    background: url(../img/contact-info.webp) no-repeat 80% 50%/300px;
  }
}
/*  Message us
===================*/
.message-us h2 {
  color: #2c2a55;
  padding: 20px;
}
.message-us input,
.message-us textarea {
  padding: 10px;
  border: 1px solid #8a93a7;
  color: #8a93a7;
  display: block;
}
.message-us textarea {
  height: 200px;
}
.message-us button {
  padding: 10px 20px;
  background-color: #2c2a55;
  color: #ebeef2;
  border: 1px solid #2c2a55;
  border-radius: 15px;
  transition: all 0.3s ease-in-out;
  margin: 20px;
}
.message-us button:hover {
  background-color: #ebeef2;
  color: #2c2a55;
}
@media (min-width: 667px) {
  .message-us {
    text-align: center;
  }
  .form-text {
    margin: 0 auto;
  }
}

/*======================================
        Quote, Reservation Pages
======================================*/
.quote-header {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/quote.jpg) center center/cover;
}
.reservation-header {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/contact2.jpg) center center/cover;
}
.quote-header h1,
.reservation-header h1 {
  font-size: 50px;
}
.iframe-page {
  height: 1300px;
}
.iframe-page iframe {
  width: 100%;
  height: 100%;
}
@media (max-width: 766px) {
  .iframe-page {
    height: 1400px;
  }
}

/*Success page
-----------------*/
section.response {
  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url(../img/success.png) center center/cover;
  height: 600px;
  padding: 60px 0;
  color: #fff;
}
section.response p {
  color: #fff;
}