/* jwbs (color) class, and default styling */
@import url("../includes/assets/default.css");
@import url("jwbs.css");

@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700|Raleway:300,400,500,700&display=swap');

html, body { overflow-x: hidden; }
body { font-family: 'Lato', sans-serif; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { margin-bottom: 1.975rem; font-family: 'Roboto', sans-serif; font-weight: 600; }
a { color: #808080; }
a:hover { color: #212529; }
.alignwide { margin-left: -15rem; margin-right: -15rem; }
.wp-block-image.alignwide { max-width: none; }
.alignfull { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); max-width: 100vw; width: 100vw; }
.alignfull img { width: 100vw; }
a.btn, .wp-block-button.btn a, input.btn { display: inline-block; padding: 0 1.375rem; height: 2.5rem; font-size: 0.875rem; font-weight: 600; line-height: 2.5; text-transform: uppercase; letter-spacing: 0.14285em; border: 2px solid #bbb; border-radius: 1.25rem; }
a.btn-yellow, .wp-block-button.btn-yellow a, input.btn-yellow { color: #808080; background-color: #ffd51d; }
a.btn-yellow:hover, .wp-block-button.btn-yellow a:hover, input.btn-yellow:hover { color: #fff; background-color: #444; border-color: #444; text-decoration: none; }
ul.yellow li { position: relative; list-style: none; }
ul.yellow li:before { content: '\2022'; position: absolute; top: -0.125em; left: -1em; font-size: 1.25em; color: #ffd51d; }
.red { color: #f00; }
.yellow-txt { color: #ffd51d; }
.prev-slide,.next-slide { color: #ffffff; }
.page-header .page-title { text-align: center; }
.gap-0 { gap: 0; }

@-webkit-keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }
	100% { opacity: 1; -webkit-transform: none; transform: none; }
}
@keyframes fadeInDown {
	0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }
	100% { opacity: 1; -webkit-transform: none; transform: none; }
}
.fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; }

.full-width { position: relative; }
.full-width:before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: -99rem; }
.bg-grey { background-color: #ddd; }
.full-width.bg-grey:before { border-left: 99rem solid #ddd; box-shadow: 99rem 0 0 #ddd; }

header .fixed-top { padding: 0.5% 3.25% 0.5% 5.5%; top: 0; right: 0; bottom: auto; left: 0; }
body.admin-bar .navbar.fixed-top { top: 32px; }
.fixed-top .container { max-width: none; }
.bg-jwbs { padding: 0; background-color: #fff !important; }
.home .bg-img .bg-jwbs { background-color: transparent !important; }
.bg-jwbs .container { padding: 0;  -webkit-align-items: flex-start; align-items: flex-start; }
.bg-jwbs .navbar-brand { margin-right: 1rem; padding: 0; }
.bg-jwbs .navbar-brand img { max-height: 110px; } /* logo */
.bg-jwbs #phone h2 { font-size: 2.25rem; }
.bg-jwbs #phone a { color: #808080; }
.bg-jwbs #phone a:hover { color: #212529; text-decoration: none; }
.home .bg-img .bg-jwbs #phone a, .home .bg-img .bg-jwbs #phone a:hover { color: #eee; }

.navbar-dark .navbar-nav { background-color: #333; }
.navbar-dark .navbar-nav .nav-link { padding: 0.25rem 0.5rem; font-family: 'Raleway', sans-serif; font-weight: bold; color: #999; letter-spacing: 1px; text-transform: uppercase; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); }
.navbar-dark .navbar-nav .active > .nav-link { color: #999; }
.navbar-dark .navbar-nav :not(.active) .nav-link:hover { color: #ffd51d; }
.home .bg-img .navbar-dark .navbar-nav .nav-link, .home .bg-img .navbar-dark .navbar-nav .nav-link:hover, .home .bg-img .navbar-dark .navbar-nav .active > .nav-link { color: #eee; }
.dropdown-menu { padding: 0.375rem 0; top: 99%; background-color: #fff; border-top: 1px solid #ffd51d; }
.dropdown-menu .menu-item { font-size: 14px; }
.home .bg-img .dropdown-menu { background-color: #333; }
.dropdown-item { padding: 0.625rem 1.25rem 0.625rem 0.625rem; font-family: 'Raleway', sans-serif; font-weight: 600; color: #666; text-transform: uppercase; }
.home .bg-img .dropdown-item { color: #999; }
.dropdown-item:hover { background-color: #eaeaea; }
.home .navbar-dark .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(33, 37, 41, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); }
.navbar-dark .navbar-toggler { align-self: center; color: #212529; border-color: #212529; }
.navbar-dark .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(33, 37, 41, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); }

/* forms */
fieldset { margin-bottom: 1rem; padding: 1rem; border: 1px solid #ffd51d; }
fieldset legend { margin: 0 -17px; padding: 0.5rem 1rem; width: calc(100% + 34px); max-width: none; font-size: 1rem; font-weight: bold; background-color: #ffd51d; }
.wpcf7-form label { font-weight: 500; text-transform: uppercase; letter-spacing: 1px; }
#registration-modal .modal-dialog { max-width: 600px; }
#registration-modal .modal-footer { padding-bottom: 0; }
#registration-modal button.btn, #registration-modal a.btn {
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	text-transform: uppercase;
	letter-spacing: 0;
	color: #212529;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e0e0e0+100 */
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(224,224,224,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(224,224,224,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(224,224,224,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e0e0e0',GradientType=0 ); /* IE6-9 */
	border: 1px solid #ccc;
	border-radius: 0.25rem;
}
#registration-modal button.btn:hover, #registration-modal a.btn:hover { background: #e0e0e0; background-position: 0 -15px; border-color: #adadad; }

/* home */
body.home.navbar-fixed-top { padding-top: 0; }
.home #banner { margin-bottom: 6.75rem; }
.home .carousel-caption { top: 40%; right: 10%; bottom: 0; left: 10%; }
.home .carousel-caption h1 { margin-bottom: 3.125rem; font-size: 2.125rem; font-weight: 400; color: #333; line-height: 1.5; letter-spacing: -2px; text-shadow: 4px 6px 8px rgba(247, 247, 247, 1); }
.home .carousel-caption .btn { color: #fff; background-color: #888; }
.home .carousel-caption .btn:hover { color: #333; background-color: #eee; border-color: #eee; }
.home .carousel-caption .home-page-arrow { display: none; position: absolute; width: 32px; height: 32px; left: 40%; bottom: 20px; font-size: 32px; font-weight: 400; color: #fff; }
.home .carousel-caption .home-page-arrow .fa-angle-down { animation-name: fadeInDown; animation-duration: 1.5s; animation-iteration-count: infinite; }
#platform { background-color: #808080; }
#platform h2 { font-size: 1.125rem; line-height: 1.5; color: #fff; }
#services { background-color: #282828; }
#services h3 { color: #fff; }
#services h5.has-background { padding: 1.125em 2.375em; }
#solutions.wp-block-cover { margin-bottom: 0; min-height: 450px; }
#solutions.wp-block-cover > .container.mt-5 { margin-top: 2rem !important; }
#solutions.wp-block-cover h2, #solutions.wp-block-cover h3 { margin-bottom: 1.25rem; max-width: none; }
#solutions.wp-block-cover h2 { padding: 0; font-size: 2.25rem; line-height: 1.25; text-align: left; }
#solutions.wp-block-cover h3 { font-size: 2rem; }
#solutions.wp-block-cover .wp-block-button { margin-bottom: 0; }
.home article > footer { display: none; }

/* fleetmode */
#fleetmode { color: #fff; background-color: #2b66aa; }
#fleetmode ul { font-size: 1.75rem; list-style-type: circle; }
.checklist { margin: 0 auto; }
.checklist ul { font-size: 1.25rem; list-style: none; }
.checklist ul li:before { display: none; content: '\f00c'; font-family: 'Font Awesome 5 Solid'; }
.svg-inline--fa.fa-check { margin-right: 0.5em; font-size: 14px; font-weight: bold; vertical-align: 0; fill: #212529; }

/* webinar */
.webinar-img { position: relative; margin-top: -3%; margin-bottom: 5%; top: 0; border-bottom: 4px solid #ffd51d; }
.greyrow { margin-bottom: 2rem; margin-left: -15px; padding-top: 2rem; padding-left: 15px; background-color: #dcdcdc; border-radius: 15px 30px; }

/* contact us */
.wp-block-image.contact-us img { width: 100px; height: 100px; border-radius: 55px; border: 4px solid #ffd51d; }
.wp-block-image.contact-us-lg img { width: 150px; height: 150px; border-radius: 75px; border: 4px solid #ffd51d; }
.contact h5 { margin-bottom: 10px; }
.contact h5, .contact a { font-weight: normal; color: #999; }
.contact .email-ico { color: #212529; }
.contact h6 { margin-bottom: 0; font-style: oblique; }
.contact p > a:hover { color: #212529; text-decoration: none; }
.card { border: 0 none; border-radius: 0; }
.card .wp-block-image { margin: 0; }
.card-body { padding: 0.75rem 0.75rem 0.5rem; height: auto; background-color: #fbf6e6; }
.card-body p:not(.contact) { line-height: 1.25; }
.card-body p:not(.contact) small { line-height: 1; }
p.contact { position: static; margin: 0; padding: 0.5rem 1.25rem; }
p.contact a { margin: 0 1rem; }

.user-row { border-color: #dcdcdc; border-style: solid; }

body > footer { background-color: #eee; }
#widget-footer { text-align: center; }
#widget-footer > div { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
#widget-footer a, .attribution a { color: #808080;  }
#widget-footer a:hover, .attribution a:hover { color: #212529; text-decoration: none; }
#widget-footer .menu { margin: 0 0 2rem 0; padding: 0; list-style: none; }
#widget-footer .menu li { padding: 0.125rem 0; }
#widget-footer .menu a { font-size: 1.125rem; font-weight: bold; letter-spacing: 1px; }
#widget-footer h2 a { font-size: 2.625rem; font-weight: normal; }
.attribution { color: #555; }

/* owl carousel */
.owl-carousel .owl-item img { height: 100px; width: auto !important; }

/* media queries */
@media only screen and (max-width: 575px){
	.home .mobile-grid { padding: 30px; }
}
/* Extra Small Devices, Phones */
@media only screen and (min-width : 576px) {
	.contact a { margin: 0; }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
	body.navbar-fixed-top:not(.home) { padding-top: 10.625rem; }
	.gap-sm-2em { gap: 2em; }
	.card-body { height: 10rem; }
	.navbar-dark .navbar-nav { background-color: transparent; }
	.navbar-dark .navbar-nav .nav-link, .navbar-dark .navbar-nav .active > .nav-link { color: #444; }
	.home .carousel-caption { top: 40%; right: 32%; bottom: 0; left: 38%; }
	.home .carousel-caption h1 { font-size: 2.5rem; }
	.home .carousel-caption .home-page-arrow { display: inline; }
	#platform h2 { font-size: 2.125rem; line-height: 1.5; }
	#solutions.wp-block-cover > .container.mt-5 { margin-top: 3rem !important; }
	#solutions.wp-block-cover h2 { font-size: 3.5rem; }
	#solutions.wp-block-cover h3 { margin-bottom: 1.875rem; font-size: 2.25rem; }
	p.contact { position: absolute; right: 0; bottom: 0; left: 0; padding: 0.5rem 1.25rem; }
	p.contact a { margin: 0; }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
	.card-body { padding: 0.75rem 1.25rem 0.5rem; }
	.card-body { height: 8.5rem; }
	.mc-embed iframe { width:520px; height:291px; }
}