/*
Theme Name: Traffic Theme
Author: Ugly Duck Marketing
Author URI: https://uglyduckmarketing.com/
Version: 1.2
*/

/* Base Styles
------------------------------------- */
body, html {
	overflow-x: hidden;
}
a {
	text-decoration: none;
}
a:hover {
  color: var(--secondary);
	text-decoration: none;
}
.container {
	max-width: 85%;
}
main img {
	max-width: 100%;
	height: auto;
}

/* Homepage
------------------------------------- */
.hero h1 {
  font-weight: 700;
  color: var(--secondary);
  margin-top: 30px;
  text-align: center;
  margin-bottom: -2rem;
}
.after__hours {
	background: #000000;
	background: var(--primary);
	color: white;
	padding: 4.5rem 0;
}
.after__hours a, .after__hours p, .after__hours a {
	color: white;
}
.after__hours h1 {
	font-weight: 700;
	margin-bottom: 1.5rem;
	color: white;
}
.more__info {
	padding: 5rem 0;
	background: white;
}
.more__info h2 {
	max-width: 85%;
	font-weight: 600;
	margin-bottom: 2rem;
	color: var(--secondary);
}
.more__info p {
	max-width: 85%;
	font-size: 1.1rem;
	line-height: 1.6;
}
.homepage__about {
	padding: 6.5rem 0;
	background: #f9f9f9;
	border-top: 1px solid rgba(0,0,0,.1);
}
.homepage__about-container span {
  font-weight: 600;
  margin-bottom: 1rem;
  display: block;
	color: #000000;
  color: var(--secondary);
}
.homepage__about-container p {
\	font-size: 1.1rem;
	line-height: 1.6;
	color: #595959;
	max-width: 80%;
}
.homepage__about-container {
  padding: 3.5rem;
  background: white;
  box-shadow: 0 0 30px 0 rgba(0,0,0,.1);
  border-top: 6px solid var(--secondary);
}
.homepage__about-container h2 {
	font-weight: 700;
	margin-bottom: 1rem;
}
.homepage__about-container .btn {
	background: #000000;
	background: var(--primary);
	font-weight: 600;
	border-radius: 3px;
	padding: .75rem 1.25rem;
	margin-top: 2rem;
	display: inline-block;
	color: white;
}
.homepage__why {
	background: white;
}
.border-box {
	padding: 5rem 3rem;
}
.border-box:nth-child(1), .border-box:nth-child(2) {
	border-bottom: 1px solid rgba(0,0,0,.1);
}
.border-box:nth-child(1), .border-box:nth-child(3) {
	border-right: 1px solid rgba(0,0,0,.1);
}
.border-box h2 {
	font-weight: 700;
}
.border-box p {
	max-width: 65%;
	font-size: 1.1rem;
	line-height: 1.6;
	color: #595959;
	margin-top: 1rem;
}
.border-box i {
  color: var(--primary);
  font-size: 3rem;
  margin-bottom: 1rem;
  display: block;
	margin-top: -1rem;
}
.homepage__testimonials {
	padding: 4.5rem 0;
	background: #000000;
	background: var(--secondary);
}
.homepage__testimonials .testimonial {
	background: white;
	padding: 1.5rem;
	margin: 1rem;
}
.homepage__testimonials h2 {
  display: block;
  width: 100%;
  text-align: center;
  margin-bottom: 2rem;
  font-weight: 700;
  color: white;
}
.testimonial-text {
	color: #595959;
}
.testimonial-stars {
	margin-bottom: 0;
}
.testimonials i {
	color: #000000;
	color: var(--primary);
}


/* Navigation Helpers
------------------------------------- */

.shadowed {
  box-shadow: 0 2px 20px 0 rgba(0,0,0,0.20);
}
.bordered {
  border-bottom: 1px solid rgba(0,0,0,.1);
}
.transparent {
	background: transparent !important;
}
.transparent.bordered {
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.load-hidden {
	visibility: hidden;
}

/* Header Basic
------------------------------------- */

header.header__basic {
	position: relative;
	width: 100%;
	background: white;
	z-index: 9;
	border-bottom: 1px solid rgba(0,0,0,.1);
}
header.header__basic.transparent {
	position: absolute;
}
header.header__basic .container {
  width: 100%;
  max-width: 90%;
  padding: 0;
}
header.header__basic .logo img {
  max-height: 55px;
  margin: .5rem 0;
}
header.header__basic nav ul {
  margin: 0;
}
header.header__basic nav ul li {
  list-style: none;
  display: inline-block;
}
header.header__basic nav ul li a {
  font-weight: 500;
  padding: 2.15rem 1.15rem;
  padding-bottom: 2rem;
  font-size: 0.85rem;
  letter-spacing: 0.25px;
  height: 100%;
  display: inline-block;
  line-height: .75;
  color: #101010;
}
header.header__basic nav ul li a:hover {
  text-decoration: none;
}
header.header__basic nav ul li::after {
  content: "";
  width: 0%;
  background: var(--primary);
  height: 3px;
  display: block;
  transition: all 0.3s ease;
}
header.header__basic nav ul li.current_page_item::after {
  width: 100%;
}
header.header__basic nav ul li:hover::after {
  width: 100%;
}
header.header__basic nav .menu-item-has-children a::after {
  content: "\f3d0";
  font-family: "Ionicons";
  vertical-align: middle;
  padding-left: 12px;
  display: inline-block;
  opacity: .5;
  font-size: 10px;
}
header.header__basic nav ul.sub-menu li a::after, header.header__two nav ul.sub-menu li a::before {
  display: none;
}
header.header__basic nav ul.sub-menu {
  position: absolute;
  border: 1px solid rgba(0,0,0,.1);
  border-top: none;
  background-color: white; /* Change through CSS variable */
  padding: 0;
  opacity: 0;
  pointer-events: none;
  transform: translateY(1rem);
  transition: all .3s ease;
}
header.header__basic nav ul li.menu-item-has-children:hover > .sub-menu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(3px);
}
header.header__basic nav ul.sub-menu li {
  display: block;
}
header.header__basic nav ul.sub-menu li a {
  padding: 1rem 4rem;
  padding-left: 1.25rem;
  border-bottom: 1px solid rgba(0,0,0,.1);
	display: block;
}
header.header__basic.transparent nav ul.sub-menu li a {
	color: #353535 !important;
	text-align: left;
}
header.header__basic nav ul.sub-menu li a:hover {
	color: var(--primary) !important;
}
header.header__basic nav ul.sub-menu li::after {
	display: none;
}
header.header__basic nav ul.sub-menu li:last-of-type a {
  border: none;
}
header.header__basic .top__widget {
	display: inline-block;
	margin-left: 1.75rem;
	vertical-align: middle;
}
header.header__basic .social__icons i {
  color: var(--secondary);
  font-size: 1.05rem;
  margin-left: 0.95rem;
  transition: all 0.3s ease;
}
header.header__basic .social__icons i:hover {
  color: var(--primary);
}
header.header__basic .cta__btn {
  background: var(--primary);
  color: white;
  border-radius: 3-px;
  padding: 8px 20px;
  verticle-align: middle;
  font-weight: 600;
  font-size: 0.9rem;
}
header.header__basic .cta__btn i {
  vertile-align: middle;
  display: inline-block;
  margin-left: 1rem;
  padding-left: 1rem;
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.3s ease;
}
header.header__basic .cta__btn:hover i {
  padding-left: 1.5rem;
}
header.header__basic .social__icons {
	display: inline-block;
}

/* Footer One
------------------------------------- */
footer.footer__one {
	padding: 0;
	border-top: 1px solid rgba(0,0,0,.05);
	background: white;
}
footer.footer__one img {
  max-height: 75px;
}
footer.footer__one ul {
	padding: 0;
}
footer.footer__one ul li {
	list-style: none;
}
footer.footer__one ul li a {
	color: var(--global-dark);
	display: block;
	padding-bottom: .75rem;
	font-size: .865rem;
}
footer.footer__one .widget__title {
  font-size: 1rem;
  color: var(--primary);
}
footer.footer__one .company__info {
	border-top: 1px solid rgba(0,0,0,.05);
	padding: .75rem 0;
	font-size: .75rem;
}
footer.footer__one .company__info p {
	margin-bottom: 0;
}
footer.footer__one .company__info span {
	display: inline-block;
	margin: 0 .35rem;
	color: rgba(0,0,0,.165);
}
footer.footer__one .company__info a {
	font-weight: 600;
	color: var(--primary);
}
footer.footer__one .footer__block {
	margin-bottom: 3rem;
}

/* Mobile Navigation - One
----------------------------------------- */
.mobile__header-one {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: white;
	padding: .75rem 0;
	z-index: 5;
	border-bottom: 1px solid rgba(0,0,0,.1);
	max-height: 61px;
	overflow: hidden;
}
.mobile__header-one i {
	font-size: 2rem;
	line-height: 1;
}
.mobile__logo img {
	max-height: 35px;
}
.mobile__header-one .container {
	max-width: 100%;
	padding: 0 1.5rem;
}
.mobile__navigation__one {
  position: fixed;
  height: 100%;
  width: 100%;
  background: white;
  z-index: 7;
  top: 60px;
	right: 0%;
	overflow: scroll;
	padding: 0;
	background: #f9f9f9;
	opacity: 0;
	pointer-events: none;
}
.mobile__navigation__one-visible {
  right: 0px;
  opacity: 1;
	pointer-events: auto;
}
.mobile__navigation__one ul {
	padding: 0;
}
.mobile__navigation__one li {
  display: block;
  width: 100%;
}
.mobile__navigation__one li a {
  display: block;
  width: 100%;
  padding: 19px;
  border-bottom: 1px solid rgba(0,0,0,.1);
  font-size: 14px;
  color: #212944;
  background: white;
  font-weight: 600;
  position: relative;
}
.mobile__navigation__one .menu-item-has-children a::after {
  content: "\f30f";
  font-family: "Ionicons";
  vertical-align: middle;
  padding-left: 14px;
  display: inline-block;
  margin-right: -10px;
  font-size: 18px;
  opacity: 1;
  float: right;
  background: transparent;
  color: #000 !important;
  text-align: center;
  padding: 16px 14px;
  position: absolute;
  height: 100%;
  top: 1px;
  right: 11px;
  width: 63px;
  border-left: 1px solid rgba(0,0,0,.1);
}
.mobile__navigation__one .sub-menu a::after {
	display: none;
}
.mobile__navigation__one .sub-menu {
  padding-left: 0px;
  background: white;
  position: fixed;
  top: 61px;
  height: 100%;
  width: 100%;
  z-index: 9;
	right: -100%;
	transition: all 600ms cubic-bezier(0.075, 0.82, 0.165, 1);
}
.mobile__navigation__one .visible__sub {
	right: 0 !important;
}
.mobile__navigation__one .mobile__title a {
	background: var(--primary) !important;
	border-bottom: none;
	color: white !important;
	padding-left: 85px !important;
	font-size: 18px !important;
}
.mobile__navigation__one .mobile__title a::before {
  content: "\f2ca";
  font-family: "Ionicons";
  vertical-align: middle;
  padding-left: 14px;
  transform: translateY(-1px);
  display: inline-block;
  margin-right: -10px;
  font-size: 22px;
  opacity: 1;
  float: right;
  background: rgba(0,0,0,.1);
  color: white !important;
  text-align: center;
  padding: 17px 14px;
  position: absolute;
  height: 100%;
  top: 1px;
  left: 0;
  width: 63px;
}

/* Homepage
----------------------------------------- */
.homepage__hero {
	position: relative;
	overflow: hidden;
	padding: 5rem 0;
	background-color: var(--secondary);
}
.homepage__hero-background {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	/* filter: brightness(60%); */
	z-index: 1;
}
.homepage__hero-content {
	position: relative;
	z-index: 2;
}
.homepage__hero h1 {
  color: white;
  font-size: 3.5rem;
	font-weight: 600;
	margin-bottom: 2rem;
}
.homepage__hero-secondary {
  color: white;
  font-size: .95rem;
  background: var(--secondary);
  padding: .65rem 1.5rem;
  border-radius: 100pc;
  margin-bottom: .75rem;
  display: inline-block;
  line-height: 1;
  font-weight: 500;
}
.homepage__hero ul {
	padding-left: 0;
}
.homepage__hero li {
  list-style: none;
  color: white;
  display: block;
  padding-bottom: 1rem;
  font-weight: 400;
  font-size: 1.15rem;
}
.homepage__hero li::before {
	color: var(--primary);
	content: '\f122';
	font-family: 'Ionicons';
	margin-right: .65rem;
}
.homepage__hero .btn {
	background: #000000;
  background: var(--primary);
  color: white;
  padding: 0 1.75rem;
  padding-right: 0;
  font-weight: 600;
  font-size: 1.05rem;
  border-radius: 3px;
	transition: all .3s ease;
	margin-top: 2rem;
	margin-left: .75rem;
}
.why__us .btn {
	background: #454545;
  background: var(--primary);
  color: white;
  padding: 1rem 2rem;
  font-weight: 600;
  font-size: 1.05rem;
  border-radius: 3px;
  transition: all .3s ease;
  margin-top: 4rem;
}
.why__us .btn:hover {
	color: white;
	filter: brightness(115%);
}
.homepage__hero .btn i {
  padding: .75rem 1.25rem;
  border-left: 1px solid rgba(0, 0, 0, 0.05);
  display: inline-block;
  margin-left: .65rem;
	transition: all .3s ease;
}
.homepage__hero .btn:hover {
	filter: brightness(115%);
}

/* Contact Page
----------------------------------------- */
.contact__container {
	background: white;
	border-top: 6px solid var(--primary);
	text-align: center;
	padding: 3rem;
	padding-bottom: 1.5rem;
	box-shadow: 0 0 30px 0 rgba(0,0,0,.15);
}
.contact__container i {
	background: #000000;
  background: var(--secondary);
  color: white;
  width: 70px;
  height: 70px;
  display: inline-block;
  font-size: 2rem;
  border-radius: 100pc;
  padding-top: 11px;
  margin-bottom: 1.5rem;
}
.contact__container h2 {
	font-weight: 600;
	margin-bottom: 1rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(0,0,0,.1);
}
.contact__container p {
	font-size: 1.1rem;
	margin-bottom: 5px;
	color: #525252;
}


/* Internal Pages
----------------------------------------- */

html, body {
	background: #f9f9f9;
}
.how__intro, .how__expanded {
	padding: 5rem 0;
}
.how__expanded {
	background: #000000;
	background: var(--secondary);
}
.primary-border {
	border-top: 6px solid var(--primary);
}
.secondary-border {
	border-top: 6px solid var(--secondary);
}
.how__intro-image {
	height: 200px;
	background-size: cover;
	background-position: center;
}
.how__intro-single {
	background: white;
	box-shadow: 0 0 30px 0 rgba(0,0,0,.15);
}
.how__inner {
	padding: 1.75rem;
	padding-bottom: 1rem;
}
.how__inner h2 {
  font-size: 1.35rem;
  font-weight: 600;
  display: block;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid rgba(0,0,0,.1);
}
.how__inner p {
  font-size: 1.1rem;
  line-height: 1.6;
  max-width: 90%;
	color: #525252;
}
.padded-row {
	padding: 2.5rem;
}
.how__expanded h3 {
	font-weight: 600;
	color: white;
	border-bottom: 4px solid var(--primary);
	padding-bottom: 1rem;
	margin-bottom: 1rem;
}
.how__expanded p {
  color: rgba(255, 255, 255, 0.89);
  font-size: 1.125rem;
}
.how__expanded img {
  max-height: 65px;
  transform: translateX(-20px);
}
.number {
  position: absolute;
  left: 32px;
  top: 22px;
	background: #000000;
  background: var(--secondary);
  color: white;
  display: inline-block;
  width: 38px;
  height: 38px;
  text-align: center;
	padding-top: 1px;
  border-radius: 100pc;
  font-size: 1.25rem;
	border: 3px solid white;
}

/* FAQs
------------------------------------- */
.faq__question, .faq__answer {
  background: white;
  border: 1px solid rgba(0,0,0,.1);
  padding: 1.25rem 2rem;
}
.faq__question {
	cursor: pointer;
	margin-top: 2rem;
	position: relative;
	overflow: hidden;
	box-shadow: 0 0 30px 0 rgba(0,0,0,.15);
}
.faq__question h2 {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.4;
  max-width: 85%;
}
.faq__answer {
	border-top: none;
	display: none;
	box-shadow: 0 0 30px 0 rgba(0,0,0,.15);
}
.page-id-18 > main > section > div > div > div > div:nth-child(2) {
	display: block;
}
.faq__answer p {
  font-size: 1.1rem;
  color: #525252;
	line-height: 1.5;
}
.about p {
	color: #525252;
	line-height: 1.6;
	font-size: 1.15rem;
}
.faq__question::after {
  content: '\f123';
  position: absolute;
  right: 2.75rem;
  font-size: 1.35rem;
  color: var(--primary);
  font-family: 'Ionicons';
  top: 50%;
  transform: translateY(-44%);
}

.footer__cta {
	padding-top: 5rem;
	background: white;
	border-top: 1px solid rgba(0,0,0,.1);
}
.margin-bottom {
	margin-bottom: 2.5rem;
}
.footer__cta img {
	max-height: 325px;
}
.footer__cta h2 {
  font-weight: 700;
  display: block;
  margin-bottom: 1rem;
  margin-top: -2rem;
}
.footer__cta h3 {
	color: var(--primary);
}
.footer__cta span {
	font-weight: 700;
}
.why__us {
	padding: 4.5rem;
	background-color: #000000;
	background-color: var(--secondary);
}
.why__us h1 {
	color: white;
	margin-bottom: 2.5rem;
	font-weight: 700;
}
.why__us ul {
	padding: 0;
	margin: 0;
}
.why__us li {
  list-style: none;
  color: white;
  display: block;
  padding-bottom: 1rem;
  font-weight: 400;
  font-size: 1.15rem;
}
.why__us li::before {
	color: var(--primary);
	content: '\f122';
	font-family: 'Ionicons';
	margin-right: .65rem;
}

/* Media Queries
------------------------------------- */

@media(max-width: 992px) {
	body {
  	font-size: 1.15rem;
		padding-top: 60px;
	}
	main {
	  padding: 3.5rem 0;
	}
	footer .container {
		padding: 0;
	}
	.hero__basic {
		padding: 8px 0;
	}
	.hero__basic h1 {
		font-size: 1.35rem;
	}
	.hero__one {
	  padding: 4rem 0;
	  min-height: auto;
	}
	.hero__one .contents {
		max-width: 100%;
	}
	.hero__one .contents h1 {
	  font-size: 2.25rem;
	  max-width: 90%;
	}
	.hero__one .contents .description {
	  font-size: 1.25rem;
	  line-height: 1.5;
	}
	.footer__cta-one {
		height: auto;
		padding: 4.5rem 0;
	}
	.footer__cta-one-content {
		position: relative;
		transform: none;
		max-width: 100%;
	}
	.footer__cta-one-content.centered {
		max-width: 100%;
	}
	.footer__cta-one h2 {
		font-size: 2.15rem;
	}
	.how__intro, .how__expanded {
	  padding: 1rem 0;
	}
	.contact__container, .how__intro-single {
		margin-bottom: 1.5rem;
	}
	.why__us {
		padding: 3.5rem 0;
	}
	.why__us .btn {
		display: block;
	}
	.sticky__nav .col:nth-child(1) {
		display: none !important;
	}
	.sticky__nav .col {
	  font-size: 1rem;
	  text-align: center !important;
	}
	.footer__cta img {
	  max-height: 175px;
	  margin-top: 2rem;
	  transform: translateX(-9%);
	}
	.faq__question h2 {
		font-size: 1rem;
	}
	.faq__question::after {
		right: 25px;
	}
	.how__expanded img {
	  max-height: 35px;
	  transform: none;
	  margin-bottom: 1rem;
	}
	.more__info p {
	  margin-bottom: 2rem;
	}
	.border-box {
	  padding: 3rem 2rem !important;
		border: none !important;
		border-bottom: 1px solid rgba(0,0,0,.1) !important;
	}
	.homepage__about {
	  padding: 0 !important;
	}
	.homepage__about-container {
	  padding: 2.5rem !important;
	}
	.homepage__hero-secondary {
		font-size: .75rem;
	}
	.home main, .page- {
		padding: 0;
	}
	.right__boxes {
		display: none;
	}
	.home .container {
		max-width: 95%;
	}
	.homepage__about .container {
	  max-width: 100%;
	  padding: 0;
	}
	.homepage__hero {
		padding: 2rem 0;
	}
	.border-box p {
		max-width: 85%;
	}
}