/* CSS Document */

/*########################################
## Body
########################################*/
body {padding: 0; margin: 0; width: 100%; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 400; color: #333; min-width: 1200px;}

/*########################################
## Typography
########################################*/
h1,h2,h3,h4,h5,h6 {font-family: "Phudu", sans-serif; font-weight: 700; line-height: 1.2em; color: #333;}
h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dd,dt {padding: 0; margin:0;}
ul,ol {list-style: none;}
a {text-decoration:none; transition: all .3s linear;}
a:hover {color: #BF00FE !important;}
a:focus {outline: none;}
h3 {font-size: 50px; line-height: 1em;}
h1, h2 {font-size: 80px; line-height: 1em;}
h5 {font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 25px; color: #BF00FE; letter-spacing: 2px;}
p, ul, ol {font-size: 16px; color: #333; line-height: 2em;}

/*########################################
## Layouts
########################################*/
.screen-reader-text {display: block; width: .1px; height: .1px; overflow: hidden; padding: 0 !important; margin: 0 !important;}
img {border:0; transition: all .3s linear; max-width: 100%;}
hr.hide-line {padding:0; margin:0; display:none;}
figure {margin: 0; padding: 0; box-sizing: border-box; overflow: hidden; display: inline-block;}
figure img {display: block;}
figure img:hover {transform: scale(1.03); filter: brightness(1.1);}
.container {width: 100%; max-width: 1500px; padding: 0 10px; box-sizing: border-box; margin: 0 auto;}


/*########################################
## Clearfix
########################################*/
.clear {clear:both;}
.clearfix:after {height:0; clear:both;visibility:hidden;}
.clrfix:before,
.clrfix:after {content: " "; display: table;}
.clrfix:after {clear: both;}
.clrfix {*zoom: 1;}

/*########################################
## Forms
########################################*/
/*contact form messages*/
form .messages p {display: none; font-family: "Open Sans", sans-serif!important; font-weight: 400 !important;letter-spacing: 0 !important;font-size: 16px !important;}
form .loading {display: none;}
form .alert {padding: 15px !important;margin-bottom: 20px;border: 1px solid transparent !important;border-radius: 4px !important;}
form .alert-success {color: #3c763d !important;background-color: #dff0d8 !important;border-color: #d6e9c6 !important;}
form .alert-danger {color: #a94442 !important;background-color: #f2dede !important;border-color: #ebccd1 !important;}
form input:focus, form select:focus, form textarea:focus {outline: none;}

/*contact form*/
.ctc-form {text-align: center;}
.ctc-form input[type="text"],.ctc-form textarea {width: 100%; height: 45px; margin: 0 0 20px; border: 1px solid #D6D6D6; border-radius: 0; background: none; font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: 600; line-height: 120%; padding: 0 20px; box-sizing: border-box; display: block; color: #111;}
.ctc-form textarea {height: 111px; padding-top:10px; width: 100%;}
.ctc-form button {margin-top: 10px;}
.ctc-form .recap {display: inline-block;}
.ctc-hide, .hdMob {display: none;}
.g-recaptcha > div {margin: 20px auto 0;} 

/*########################################
## Button
########################################*/
.btn, .contactForm input[type=submit] {width: 100%; max-width: 180px; padding: 20px 10px; box-sizing: border-box; background: #BF00FE; border-radius: 30px; text-align: center; font-weight: 700; font-size: 16px; color: #FFF; line-height: 120%; font-family: 'Phudu', sans-serif; position: relative; z-index: 1; transition: all .3s linear; display: block; border: none;}
.btn:hover {text-shadow: 0 2px 5px #000; box-shadow: 0 2px 7px #000; color: #FFF !important;}
.btn::after {content: ""; border-radius: 30px; width: 100%; height: 100%; left: 0; top: 0; transform: scaleY(0); transform-origin: top; transition: all .25s linear; background: linear-gradient(to bottom, rgb(255, 255, 255, .3), transparent); position: absolute; z-index: -1;}
.btn:hover::after {transform: scaleY(1);}

/*########################################
## Header
########################################*/
header {position: relative;}
#header {position: fixed; width: 100%; top: 0; left: 0; z-index: 9999; background: transparent; padding: 25px 0; transition: all 0.5s ease;}
#header .container {max-width: 1840px; display: flex; justify-content: space-between;}
#header .logo img {display: block;}
#header .navigation .btn {display: none;}
#header nav #pull {display: none; cursor: pointer;}
#header nav {width: 100%; margin: 0 auto; padding: 0;}
#header nav ul {padding: 0; margin: 0;}
#header nav ul li {padding: 0; margin: 0; display: inline-block; vertical-align: middle;}
#header nav ul li:not(:first-of-type) {margin-left: 50px;}
#header nav ul li a {display: inline-block; font-family: "Phudu", sans-serif; font-weight: 700; font-size: 16px; color: #FFF; line-height: 120%; padding: 20px 0; text-transform: uppercase; transition: all .3s linear; position: relative;}
#header nav ul li a::after {content: ""; background: #BF00FE; height: 6px; width: 100%; position: absolute; bottom: 0; left: 0; transform: scaleX(0); transform-origin: center; transition: all .3s linear;}
#header nav ul li a.active-menu, #header nav ul li a:hover {color: #FFF !important;}
#header nav ul li a.active-menu::after, #header nav ul li a:hover::after {transform: scaleX(1);}
#header .schedule .btn {padding: 20px 35px;} 
#header.sticky {background: #000; padding: 15px 0;}
#header.sticky .logo img {width: 100px;}
#header.sticky .container {align-items: center;}
#header .mobile-logo {display: none;}

/*########################################
## Banner
########################################*/
#banner {position: relative;}
#banner:before {content: ""; background: rgba(0,0,0,0.2); position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%;}
#banner .book-mobile {display: none; background: #000; padding: 20px 10px 10px; box-sizing: border-box; position: relative; z-index: 99;}
#banner .image img {display: block; width: 100%; min-height: 980px; max-height: 980px; object-fit: cover;}
#banner .content {position: absolute; left: 0; right: 0; bottom: 30px;}
#banner .content .container {display: flex; justify-content: space-between;}
#banner .content .caption {width: 40%;}
#banner .content .caption h2, #banner .content .caption h5, #banner .content .caption p {color: #FFF;}
#banner .content .caption h2 span {display: block;}
#banner .content .caption h5 {margin: 25px 0 50px;}
#banner .content .caption .btn {margin-top: 50px;}
#banner .content .book {background: #000; width: 38.5%; padding: 45px 25px 25px; box-sizing: border-box;}

.home #banner .content .caption{margin-top: 10vh;}
.inner-banner .content .container {display: flex; justify-content: space-between; align-items: flex-end;}
.inner-banner .content .caption {padding-bottom: 0;}

.inner #banner .image img {min-height: 200px;max-height: 400px;}
#banner .inner-banner .image img{object-fit:cover;object-position:top;}
/*########################################
## Home Page Content
########################################*/
#transportation {padding: 135px 0 105px;}
#transportation .container {display: flex; justify-content: space-between; align-items: center;}
#transportation .content-left {width: 43.2%;}
#transportation .content-left h1 {margin: 30px 0 55px;}
#transportation .content-left .btn {margin-top: 60px;}
#transportation .image-right {width: 56%;}
#transportation .image-right img {display: block; width: 100%;}

/*########################################
## Footer
########################################*/
footer {position: relative;}
#footer {background: #000;}
#footer .container {max-width: 1640px; display: flex;}
#footer .row {max-width: 350px;}
#footer .left-content, #footer .middle-content, #footer .right-content {width: 33.333%; padding: 65px 10px 50px; box-sizing: border-box;}
#footer .left-content, #footer .right-content {text-align: center; display: flex; flex-direction: column;}
#footer .left-content img {display: block; margin: 0 auto 60px;}
#footer .left-content p, #footer .left-content a {color: #FFF; font-size: 15px;}
#footer .middle-content {background: #111;}
#footer .middle-content .row {margin: 0 auto;}
#footer .middle-content h6 {font-family: "Montserrat", sans-serif; font-size: 11px; font-weight: 700; color: #BF00FE; letter-spacing: 2px; margin-bottom: 10px;}
#footer .middle-content .phone {margin-bottom: 90px;}
#footer .middle-content .phone a {font-family: "Phudu", sans-serif; font-weight: 700; font-size: 30px; color: #FFF; display: block;}
#footer .middle-content .email a {font-size: 17px; font-weight: 700; color: #FFF; line-height: 1.7em;}
#footer .right-content {align-items: flex-end;}
#footer .right-content h6 {font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 13px; color: #FFF; text-align: left; letter-spacing: 2px; margin-bottom: 20px;}
#footer .right-content .ctc-form input[type="text"], #footer .right-content .ctc-form textarea {font-family: "Montserrat", sans-serif; font-weight: 400; font-size: 15px; color: #FFF; border: 1px solid #333; background: #222; margin: 0 0 8px;}
#footer .right-content .ctc-form input[type="text"]::placeholder, #footer .right-content .ctc-form textarea::placeholder {color: #FFF;}

/*########################################
## Sidebar
########################################*/
aside{ float:right; width:280px; min-height:444px; margin:0; padding:0; background:#C63;}

/*########################################
## Inner Pages
########################################*/
.inner-banner h1 {color: #FFF;}
.inner p {margin-bottom: 30px;}
.inner p:last-of-type {margin-bottom: 0;}
.inner #content {padding: 150px 0 100px;}

/*########################################
## Services Page
########################################*/
.services-page #content {padding: 0 !important;}
.services-page .container {max-width: 1386px;}
.services-page .top-section {padding: 150px 0 80px;}
.services-page .top-section .container {display: flex; flex-direction: column; row-gap: 80px;}
.services-page .top-section .service {display: flex; justify-content: space-between; align-items: center;}
.services-page .top-section .service:nth-of-type(even) {flex-direction: row-reverse;}
.services-page .service .image {width: 41.4%;}
.services-page .service .image img {display: block; width: 100%;}
.services-page .service .content {width: 49.2%;}
.services-page .service .content h3 {margin-bottom: 45px;}
.services-page .fleet {background: url('../images/content/fleet-background.jpg') no-repeat; background-size: 100% 82.8%; background-position: bottom center; padding-bottom: 150px;}
.services-page .fleet .container {display: flex; justify-content: space-between;}
.services-page .fleet .content {padding: 50px 20px 0 0;}
.services-page .fleet .content h2 {margin-bottom: 70px;}
.services-page .fleet .content h2 span {display: block;}
.services-page .fleet .image {width: 76.1%; display: flex; justify-content: space-between; align-items: flex-start;}
.services-page .fleet .image img {display: block; border-radius: 20px; width: 30.3%;}
.services-page .fleet .image img:nth-of-type(2) {margin-top: 50px;}
.services-page .button-section {padding-bottom: 150px;}
.services-page .button-section .btn {margin: 0 auto;}

/*########################################
## About Us Page
########################################*/
.about-page #content {padding: 0 !important;}
.about-page .content-wrapper {padding: 150px 0 105px;}
.about-page .top-section {margin-bottom: 80px;}
.about-page .top-section .container {display: flex; flex-direction: column; row-gap: 80px;}
.about-page .top-section .boxed {display: flex; justify-content: space-between; align-items: center;}
.about-page .top-section .boxed:nth-of-type(even) {flex-direction: row-reverse;}
.about-page .boxed .image {width: 41.4%;}
.about-page .boxed .image img {display: block; width: 100%;}
.about-page .boxed .content {width: 49.2%;}
.about-page .boxed .content h3 {margin-bottom: 45px;}
.about-page .boxed .content h3 span {display: block;}
.about-page .bottom-section {text-align: center;}
.about-page .bottom-section p {font-size: 20px; font-weight: 700;}
.about-page .bottom-section .btn {margin: 40px auto 0;}

/*########################################
## Contact Us Page
########################################*/
.contact-page #banner .inner-banner .image img{object-fit:cover;object-position:bottom;}
.contact-page #content {padding: 100px 0;}
.contact-page .content-wrapper .container {display: flex;}
.contact-page .content-wrapper .info, .contact-page .content-wrapper .form {width: 50%; padding: 50px 30px; box-sizing: border-box;}
.contact-page .content-wrapper .info {background: #111; text-align: center;}
.contact-page .content-wrapper .info h3 {color: #FFF; margin-bottom: 30px;}
.contact-page .content-wrapper .info h6 {font-size: 23px; color: #BF00FE; letter-spacing: 2px; margin-bottom: 10px;}
.contact-page .content-wrapper .info a {font-size: 18px; font-weight: 700; color: #FFF; display: block; line-height: 1.8em;}
.contact-page .info .phone {margin-bottom: 30px;}
.contact-page .content-wrapper .form {background: #000;}
.contact-page .content-wrapper .form input[type="text"], .contact-page .content-wrapper .form textarea {font-family: "Montserrat", sans-serif; font-weight: 400; font-size: 15px; color: #FFF; border: 1px solid #333; background: #222; margin: 0 0 8px;}
.contact-page .content-wrapper .form input[type="text"]::placeholder, .contact-page .content-wrapper .form textarea::placeholder {color: #FFF;}
.contact-page .content-wrapper .form .btn {margin: 20px auto 0;}
.contact-page .hidden {display: none !important;}

/*########################################
## Request Quote Page
########################################*/
.inner.request-quote-page #banner .image img {min-height: 875px; max-height: 600px;}
.request-quote-page .inner-banner .content .caption {padding-bottom: 270px;}

/*########################################
## Book Page
########################################*/
.book-page .hidden {display: none;}

/*########################################
## Thank You Page
########################################*/
.thank-you-page #content {text-align: center;}
.thank-you-page .inThankLogo {margin-bottom: 40px; }
.thank-you-page #content .btn { display: inline-block; }
.thank-you-page #banner .book, .thank-you-page #banner .book-mobile { display: none; }
.thank-you-page #banner h1 { text-align: center; }
.thank-you-page #banner .content .caption { width: 100%; }

/*########################################
## Responsive
########################################*/
@media screen and (max-width: 1600px) {
	h1, h2 {font-size: 60px;}
	h3 {font-size: 40px;}
}

@media screen and (max-width: 1366px) {
	h1, h2 {font-size: 50px;}
	h5 {font-size: 23px;}
	h3 {font-size: 35px;}
	.inner p {margin-bottom: 20px;}
	.btn, .contactForm input[type=submit] {font-size: 15px; padding: 17px 10px; max-width: 160px;}
	#header .logo img {max-width: 120px;}
	#header nav ul li:not(:first-of-type) {margin-left: 40px;}
	#header .schedule .btn {padding: 17px 30px;}
	#transportation {padding: 120px 0 80px;}
	#transportation .content-left h1 {margin: 20px 0 30px;}
	#transportation .content-left .btn {margin-top: 30px;}
	#footer .left-content img {max-width: 200px;}
	#footer .middle-content .phone a {font-size: 25px;}
	#footer .middle-content .email a {font-size: 15px;}
	#footer .right-content .ctc-form input[type="text"], #footer .right-content .ctc-form textarea {font-size: 13px;}
	.ctc-form input[type="text"] {height: 40px;}
	.services-page .top-section, .about-page .content-wrapper {padding: 130px 0 50px;}
	.services-page .service .content h3, .about-page .boxed .content h3 {margin-bottom: 30px;}
	.services-page .fleet {padding-bottom: 80px;}
	.services-page .fleet .content .btn {padding: 17px 20px;}
	.services-page .fleet .content h2 {margin-bottom: 40px;}
	.inner #content {padding: 150px 0 80px;}
	.about-page .bottom-section p {font-size: 18px;}
	.contact-page #content {padding: 80px 0;}
	.about-page #banner .image img, .services-page #banner .image img, .contact-page #banner .image img {min-height: 100px;}
	.services-page .button-section {padding-bottom: 80px;}
} 

@media screen and (max-width: 1024px) {
	body {min-width: 320px;}
	h1, h2 {font-size: 40px;}
	h3 {font-size: 30px;}
	h5 {font-size: 21px;}
	#banner .content .book {padding: 25px 25px 10px;}
	#transportation {padding: 120px 0 50px;}
	#footer .left-content, #footer .middle-content, #footer .right-content {padding: 40px 10px;}
	#footer .left-content img {max-width: 170px;}
	.services-page .top-section .container, .about-page .top-section .container {row-gap: 50px;}
	.services-page .fleet {padding-bottom: 50px;}
	.inner #content {padding: 130px 0 80px;}
	.contact-page .content-wrapper .info h6 {font-size: 20px;}
	.contact-page .content-wrapper .info a {font-size: 16px;}
	.about-page .top-section {margin-bottom: 50px;}
	.about-page .bottom-section .btn {margin: 30px auto 0;}
	.contact-page #content {padding: 50px 0;}
	.services-page .button-section {padding-bottom: 50px;}
}

@media screen and (max-width: 980px) {
	h1, h2 {font-size: 35px;}
	h5 {font-size: 20px;}
	#header {position: absolute; margin-top: 20px; padding: 10px 0; background: none; box-shadow: none;}
	#header .logo, #header .schedule {display: none;}
	#header .navigation .btn {display: block; font-size: 12px; padding: 10px; max-width: 110px; position: absolute; top: 5px; right: 70px; z-index: 999;}
	#header nav {position: fixed; top: 0; left: 0; width: 100%; z-index: 999; box-shadow: 0 0 5px rgba(0, 0, 0, .8);}
	#header nav ul {max-width: 100%; display: none; height: auto; background: rgba(255, 255, 255, .9);}
	#header nav ul li {max-width: 100%; position: relative; text-align: left; padding: 0; display: block; border-bottom: 1px solid #EEE; margin-left: 0 !important;}
	#header nav ul li a {padding: 10px 0; font-size: 18px; line-height: 120%; margin: 0; color: #333; text-align: left; width: 100%; text-indent: 20px;}
	#header nav ul li a::after {display: none;}
	#header nav ul li a.active-menu, #header nav ul li a:hover {color: #FFF; background: #BF00FE;}
	#header nav #pull {display: block; background: #000; width: 100%; position: relative; height: 45px; color: #fff; z-index: 999;}
	#header nav #pull img {max-height: 35px; display: block; position: relative; top: 5px; padding-left: 10px;}
	#header nav #pull:after {content:"\f0c9"; font-family: 'Font Awesome 5 Free'; font-size: 30px; display: inline-block; position: absolute; right: 15px; top: 7px; font-weight: 700; color: #BF00FE;}
	#header nav #pull strong{line-height: 45px;}
	#banner .content .caption {width: 50%;}
	#banner .content .book {width: 42.5%;}
	#footer .container {flex-direction: column;}
	#footer .row {max-width: 100%; margin: 0 auto;}
	#footer .left-content, #footer .middle-content, #footer .right-content {width: 100%; text-align: center;}
	#footer .left-content {order: 3;}
	#footer .middle-content .phone {margin-bottom: 30px;}
	#footer .middle-content .phone a {font-size: 22px;}
	#footer .middle-content .email a {font-size: 13px; display: block;}
	#footer .right-content h6 {text-align: center;}
	#footer .right-content .ctc-form button {margin: 10px auto 0 !important;}
	#footer .ctc-form .g-recaptcha div {transform: scale(0.9);}
	#footer .left-content p, #footer .left-content a {font-size: 14px;}
	#header .mobile-logo {position: absolute; top: 7px; left: 15px; display: block; z-index: 99999;}
	#header .mobile-logo img {max-height: 35px;}
}

@media screen and (max-width: 767px) {
	h1, h2 {font-size: 30px;}
	h3 {font-size: 23px;}
	p {font-size: 15px;}
	.btn {font-size: 14px; padding: 15px 10px; max-width: 140px;}
	#banner .content {bottom: 0; top: 100px;}
	#banner .content .container, .inner-banner .content .container {flex-direction: column; row-gap: 30px;}
	#banner .content .caption, #transportation .content-left {width: 100%; text-align: center;}
	#banner .content .book {display: none;}
	#banner .book-mobile {display: block;}
	#banner .image img {min-height: 450px;}
	#banner .content .caption h5 {margin: 20px 0 30px;}
	#banner .content .caption .btn {margin: 30px auto 0;}
	.home #banner .content .caption{margin-top: 5vh;}
	.inner.request-quote-page #banner .image img{max-height:200px;min-height:200px;}

	#transportation {padding: 30px 0;}
	#transportation .container {flex-direction: column-reverse; row-gap: 30px;}
	#transportation .content-left .btn {margin: 30px auto 0;}
	#transportation .image-right, .services-page .service .image, .services-page .service .content, .services-page .fleet .content, .services-page .fleet .image,
	.contact-page .content-wrapper .info, .contact-page .content-wrapper .form, .about-page .boxed .image, .about-page .boxed .content {width: 100%;}
	#transportation .image-right img {max-width: 280px; margin: 0 auto;}
	.inner-banner .content {top: 45% !important; transform: translateY(-45%);}
	.inner.request-quote-page .inner-banner .content{top:40% !important;}


	.inner-banner .content .caption {padding-bottom: 0;}
	.services-page .top-section, .about-page .content-wrapper {padding: 30px 0;}
	.services-page .top-section .container {row-gap: 30px;}
	.services-page .top-section .service, .services-page .top-section .service:nth-of-type(even), .about-page .top-section .boxed, .about-page .top-section .boxed:nth-of-type(even) {flex-direction: column;}
	.services-page .service .image, .about-page .top-section .image {margin-bottom: 20px;}
	.services-page .service .image img, .about-page .top-section .image img {max-width: 400px; margin: 0 auto;}
	.services-page .service .content, .about-page .top-section .content {text-align: center;}
	.services-page .service .content h3, .about-page .top-section .content h3 {margin-bottom: 20px;}
	.services-page .fleet .container {flex-direction: column; row-gap: 30px;}
	.services-page .fleet .content .btn {padding: 15px;}
	.services-page .fleet .content {text-align: center; padding: 0;}
	.services-page .fleet .content h2 {margin-bottom: 30px;}
	.services-page .fleet .content .btn {margin: 0 auto;}
	.inner #content {padding: 30px 0;} 
	.contact-page .content-wrapper .container {flex-direction: column;}
	.contact-page .content-wrapper .info, .contact-page .content-wrapper .form {padding: 30px 10px;}
	.contact-page .content-wrapper .info h6 {font-size: 18px;}
	.contact-page .content-wrapper .info a {font-size: 14px;}
	.contact-page .content-wrapper .form input[type="text"], .contact-page .content-wrapper .form textarea {font-size: 14px;}
	.contact-page .form .g-recaptcha div {transform: scale(0.9);}
	.about-page .top-section {margin-bottom: 30px;}
	.about-page .top-section .container {row-gap: 30px;}
	.about-page .bottom-section p {font-size: 16px;}
	.contact-page #content {padding: 30px 0;}
	.contact-page #banner .content {bottom: 45% !important;}
	.about-page #banner .content, .services-page #banner .content, .contact-page #banner .content {bottom: 50% !important;}
/*	.about-page #banner .image img, .services-page #banner .image img, .contact-page #banner .image img {min-height: 300px;}*/
	.services-page .button-section {padding-bottom: 30px;}
}

@media screen and (max-width: 480px) {
	.services-page .fleet .image {flex-direction: column; row-gap: 20px;}
	.services-page .fleet .image img {width: 100%;}
	.services-page .fleet .image img:nth-of-type(2) {margin-top: 0;}
}

@media screen and (max-width: 360px) {
	#banner .content {top: 100px;}
}