/*
Theme Name: Intermountain Truck
Description: Warm Thoughts Theme
Version: 2.0
Template Author: Josh Hong
Site Author: Jake Woodbury
*/


/* Root
====================================*/
:root {
	--default: #171796; /*Font*/
	--primo: #328cc1;
	--secondo: #4c4c4c ;
	--terzo: #000 ;
	--quarto: ;
	--ffamily: 'Roboto', sans-serif;
}


/* Global Styles
====================================*/

html, body {
	overflow-x: hidden;
}

body {
	color: black;
	font-family: var(--ffamily);
	font-size: 18px;
	line-height: 28px;
	font-weight: 400;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
	margin-bottom: 1rem;
}

h1, h2, h3, .font-roboto {
    font-family: 'Roboto Slab', serif !important;
} 

h1, .h1 {
	color: var(--default);
	/*font-size: 60px;
	line-height: 60px;
	font-weight: 900;
	text-transform: uppercase;*/
	

	font-size: 48px;
	line-height: 54px;
	font-weight: 900;
	text-transform: uppercase;
}

h2, .h2 {
	/*color: #fff;
	font-size: 60px;
	line-height: 55px;
	font-weight: 700;
	text-transform: uppercase;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);*/
	
	color: #328cc1 !important;
	font-size: 36px;
	line-height: 36px;
	font-weight: 400;
	text-transform: none !important;
	text-shadow: none !important;
}

h3, .h3 {
	color: var(--secondo);
	font-size: 28px;
	line-height: 38px;
	font-weight: 700;
}
h4, .h4 {
	color: var(--secondo);
	font-size: 24px;
	font-weight: 700;
}
h5, .h5 {
	color: var(--primo);
	font-size: 22px;
	font-weight: 700;
}
a {
	color: inherit;
	text-decoration: none;
}
img {
	max-width: 100%;
	height: auto;
}


hr {
	border-top: 2px solid var(--primo);
	margin-top: 0;
}
mark {
	padding: 0;
}
ul li,
ol li {
	padding: 0.5rem 0;
}

blockquote {
	border-left: 5px solid var(--secondo);
	margin: 1rem 0;
	padding: 2rem 2rem 1rem 2rem;
	position: relative;
}
blockquote p {
	font-size: 18px;
	line-height: 26px;
	font-style: italic;
}
blockquote p:before {
	content: '\f10d';
	font-family: "FontAwesome";
	color: var(--primo);
	font-size: 7em;
	opacity: .2;
	position: absolute;
	margin-left: -20px;
}

.alignleft {
	float: left;
	margin: 0 2rem 2rem 0;
}
.alignright {
	float: right;
	margin: 0 0 2rem 2rem;
}
.aligncenter {
	display: block;
	margin: auto;
}
.btn
.small-text {
	font-size: 14px;
}
.med-text {
	font-size: 22px;
	line-height: 32px;
}
.large-text {
	font-size: 32px;
	line-height: 42px;
}
.super-large-text {
	font-size: 40px;
	line-height: 50px;
}
.bomb-large-text {
	font-size: 50px;
	line-height: 60px;
}
.extra-large-text {
	font-size: 60px;
	line-height: 70px;
}

.text-shadow {
	text-shadow: 1px 1px 3px #333;
}

.color-default { color: var(--default); }
.color-primo { color: var(--primo); }
.color-secondo { color: var(--secondo); }
.color-terzo { color: var(--terzo); }
.color-quarto { color: var(--quarto); }
.black { color: #333; }
.white, .white a { color: #fff !important;}

.bg-default { background-color: var(--default); }
.bg-primo { background-color: var(--primo); }
.bg-secondo { background-color: var(--secondo); }
.bg-terzo { background-color: var(--terzo); }
.bg-quarto { background-color: var(--quarto); }
.bg-gray { background-color: #f0f0f0; }
.bg-white { background-color: #fff; }


/* Image Overlay
==================*/

.img-overlay {
	position: relative;
}
[class^="img-overlay-"] {
	position: absolute;
}
.img-overlay-full {
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}
.img-overlay-center {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.img-overlay-center-left {
	top: 50%;
	left: 10%;
	transform: translate(0%, -50%);
}
.img-overlay-center-right {
	top: 50%;
	right: 10%;
	transform: translate(0%, -50%);
}
.img-overlay-top-center {
	top: 0;
	left: 0;
	right: 0;
}
.img-overlay-top-left {
	top: 0;
	left: 10%;
}
.img-overlay-top-right {
	top: 0;
	right: 10%;
}
.img-overlay-bottom-center {
	bottom: 5%;
	left: 0;
	right: 0;
}
.img-overlay-bottom-left {
	bottom: 5%;
	left: 10%;
}
.img-overlay-bottom-right {
	bottom: 5%;
	right: 10%;
}

/* Buttons
==================*/

.btn {
	border: none;
	border-radius: 0;
	font-weight: 700;
	padding: 8px 20px 8px 20px;
	text-shadow: none;
	color: #fff !important;
	text-transform: uppercase;
	transition: 0.4s;
}

.btn-default {
    background-color: var(--default);
    border: none;
    font-weight: bold;
    padding: 12px 20px;
    color: #fff !important;
    font-size: 22px;
    border-radius: 15px;
    display: table;
	width: 250px;
}

.btn-default:hover, .btn-default:active, .btn-default:focus {
	background-color: var(--primo);
	color: #fff !important;
}


.btn-secondo {
	background-color: var(--primo);
    border: none;
    font-weight: bold;
    padding: 12px 20px;
    color: #fff !important;
    font-size: 22px;
    border-radius: 15px;
    display: table;
	/*width: 80%;*/
}
.btn-secondo:hover, .btn-secondo:active, .btn-secondo:focus {
	background-color: var(--default);
	color: #fff !important;
}

.btn-terzo {
	background-color: var(--default);
    border: none;
    font-weight: bold;
    padding: 12px 20px;
    color: #fff !important;
    font-size: 22px;
    border-radius: 15px;
    display: table;
	/*width: 250px;*/
}
.btn-terzo:hover, .btn-terzo:active, .btn-terzo:focus {
	background-color: var(--secondo);
	color: #fff !important;
}
.btn-quarto {
	background-color: var(--primo);
    border: none;
    font-weight: bold;
    padding: 12px 20px;
    color: #fff;
    font-size: 22px;
    border-radius: 15px;
    display: table;
	/*width: 250px;*/
}
.btn-quarto:hover, .btn-quarto:active, .btn-quarto:focus {
	background-color: var(--secondo);
	color: #fff !important;
}


.btn-sell {
	background-color: var(--default);
    border: none;
    font-weight: bold;
    padding: 12px 20px;
    color: #fff !important;
    font-size: 18px;
    border-radius: 15px;
	/*width: 250px;*/
}
.btn-sell:hover, .btn-sell:active, .btn-sell:focus {
	background-color: var(--secondo);
	color: #fff !important;
}


/* Zip Input
==================*/

.zipinput {
	border: 1px solid #585858;
	box-shadow: none;
	color: #585858;
	max-width: 180px;
	padding: 6px 10px;
	outline: none;
	text-align: center;
}
.zipinput::placeholder {
	color: #585858;
}


/* Breadcrumbs
====================================*/

.breadcrumbs a {
	color: var #171796 !important;
	text-decoration: none;
	font-size: 16px;
	font-weight: 600;
}
.breadcrumbs {
	color: #171796 !important;
	text-decoration: none;
	font-size: 16px;
	font-weight: 600;
}


/* Header
====================================*/

header a {
	text-decoration: none;
}
header .logo {
	display: block;
	margin: auto;
}


/* Content
====================================*/

.content a {
	color: #0033ff;
}
.content ul li {
	padding-left: 0.5rem;
}
.content ul li::marker {
	content: "\f0da";
	color: var(--default);
	font: var(--fa-font-solid);
}


/* Footer
====================================*/

footer a {
	text-decoration: none;
}


/* Pagination
====================================*/

.pagination {
	margin: 3rem 0;
}
.page-numbers {
	border: 1px solid var(--secondo);
	padding: 5px 10px;
	text-decoration: none;
}


/* Post
====================================*/

.post {
	padding-bottom: 3rem;
}
.post h3 {
	margin: 1rem 0;
}
.post img {
	display: inline-block;
}


/* Responsive CSS
====================================*/

@media (width < 576px) {
	h1, .h1 {
		font-size: 32px;
		line-height: 42px;
	}
	h2, .h2 {
		font-size: 42px;
		line-height: 36px;
	}
	h3, .h3 {
		font-size: 22px;
		line-height: 30px;
	}
	.super-large-text {
		font-size: 36px;
		line-height: 46px;
	}
	.bomb-large-text {
		font-size: 40px;
		line-height: 50px;
	}
	.extra-large-text {
		font-size: 40px;
		line-height: 50px;
	}
}


@media (min-width: 576px) {
	.post img {
		float: right;
		margin-left: 1rem;
	}
}

/* Styles for tablets and smaller devices */
@media only screen and (max-width: 1399px) {
    .footer-btns-secondo {
        padding: 8px 16px;
        font-size: 14px;
        width: 100%;
    }
}

/* Styles for mobile phones */
@media only screen and (max-width: 480px) {
    .footer-btns-secondo {
        padding: 6px 12px;
        font-size: 12px;
        width: 100%;
    }
}

@media (min-width: 768px) {
	.li-cols-2,
	.li-cols-3 {
		columns: 2;
		column-gap: 40px;
	}
}

@media (max-width: 768px){
.images {
	border-radius: 8px;
	box-shadow: #000 0px 3px 6px, #000 0px 3px 6px;
    }
}

@media (max-width: 768px){
    .offer {
        color: #171796 !important;
        font-weight: 600;
        text-transform: uppercase;
    }
}



@media (min-width: 767px) {
    .explore-nation {
        background-image: url(images/bk-nation-service.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }
}

@media (max-width: 992px) {
            .brand-logos-padding {
                padding-top: 20px;
                padding-bottom: 20px;
            }
        }

@media (width < 992px) {
	.alignright, .alignleft {
		display: block;
		float: none;
		margin: 0 auto 1rem auto;
	}
}

@media (min-width: 1200px) {
	.li-cols-3 {
		columns: 3;
		column-gap: 40px;
	}
}

@media (min-width: 768px) {
	.browsersedge {
		bottom: 20px;
		right: 0;
		position: fixed;
	}
	.browsersedge a {
		text-decoration: none;
	}
}

@media (min-width: 145px) {

    .browsersedge {
		bottom: 20px;
		right: 0;
		position: fixed;
	}
	.browsersedge a {
		text-decoration: none;
	}
}

@media (min-width: 767px) {
	.bac-cta-img {
		margin-top: -100px;
	}
}

@media (max-width: 767px) {
	.nationwide-text {

    text-align: center !important;
	margin-bottom: 20px;
	}
}

@media only screen and (max-width: 768px) {
    #mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2 > li.mega-menu-item > a.mega-menu-link {
        border-radius: 0;
        border: 0;
        margin: 0;
        line-height: 40px;
        height: 50px;
        padding: 0 10px;
        background: transparent;
        text-align: left;
        color: #171796;
    }
}

@media (max-width: 1200px) {
  /*.footer-btns {
    width: 100%;
    margin-bottom: 10px;
	flex: 0 0 auto;
    width: 100%;
  }*/
}


@media (max-width: 768px) {
  .carousel-item .col-3 {
    flex: 0 0 50%;
    max-width: 50%;
  }
}

@media (max-width: 576px) {
  .carousel-item .col-3 {
    flex: 0 0 100%;
    max-width: 100%;
  }
}



/* Custom Styles
====================================*/

.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
}

.footer {
            background-image: url(images/footer-background.jpg);
            background-size: cover; 
            background-position: center; 
            padding: 20px;
            color: white; /
        }

.contact-cta {
	background-image: url('/wp-content/uploads/2024/08/cta-background.jpg');
	background-size: cover; 
}

.no-padding {
            padding-top: 0;
            padding-bottom: 0;
        }


.blu-bar {
    border: none;
    height: 7px;
    background-color: var(--primo);
    margin: 20px 0; 
    width: 70%; 
	opacity: 100;
	margin: 0 auto;
	margin-top: 30px;
    margin-bottom: 30px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}


.brand-logos {
            width: 100%; 
            height: auto;
            margin: 5px;
}

.custom-brand-row {
            width: 100%;
            margin: 0 auto; 
			margin-bottom: 40px;
        }

.darkblu-bar {
    border: none;
    height: 7px;
    background-color: var(--default);
    margin: 20px 0; 
    width: 90%; 
	opacity: 100;
	margin: 0 auto;
	margin-top: 30px;
    margin-bottom: 30px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.footer-text {
	font-size: 16px;
}

.homepage .universal-footer {
    display: none;
}


.images {
	border-radius: 8px;
	box-shadow: #000 0px 3px 6px, #000 0px 3px 6px;
}

.dist-images {
	border-radius: 8px;
	
}


.shadow-image {
    
    filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.5)); 
}


.btn-shadow {
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); 
}

.text-shadow {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5) !important; 
}

.fa-chevron-right:hover {
    content: "\f054";
    color: white !important;
}

.fa-chevron-right:before {
    content: "\f054";
	color: #fff !important;
}

.review-text {
	color: var(--primo);
	line-height: 2 !important;
    font-weight: 400;	
}

.explore-nation {
    background-image: url(images/bk-nation-service.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.dispensers {
    background-image: url(images/bk-dispensers.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.bobtails {
    background-image: url(images/bk-bobtails.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.diamonds {
    background-image: url(images/bk-diamonds.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.service-trucks {
    background-image: url(images/bk-service-trucks.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.lpg-products {
    background-image: url(images/bg-lpg-products.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.bulk-plants {
    background-image: url(images/bk-bulk-plants.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.offer {
	color: #171796 !important;
	font-weight: 600;
	text-transform: uppercase;
}

.custom-border {
      border-bottom: 3px solid #328cc1; 
    }

.reviews {
    background-image: url(images/bk-reviews.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
		
 #mega-menu-max_mega_menu_1 {
	text-align:center !important;
}
 #mega-menu-wrap-max_mega_menu_1 #mega-menu-max_mega_menu_2 > li.mega-menu-item{
	margin: 5px 20px 5px 20px !important;
	/*width:200px;*/
}
 #mega-menu-wrap-max_mega_menu_1 #mega-menu-max_mega_menu_2 > li.mega-menu-item a{
	text-align:center !important;
}

.full-width-row {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

.image-element {
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
    border-radius: 10px;
}



.bg-gray {
	background: #d9eafb;
}

.cta-links {
    color: #fff !important;
  }



/*.fa-mobile {
    margin: 10px; 
    padding: 5px;
}*/


#mega-menu-wrap-max_mega_menu_2, #mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2, #mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2 ul.mega-sub-menu, #mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2 li.mega-menu-item, #mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2 li.mega-menu-row, #mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2 li.mega-menu-column, #mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2 a.mega-menu-link, #mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2 span.mega-menu-badge {

    text-shadow: none;

}

#mega-menu-wrap-max_mega_menu_2 {
    display: flex;
	flex-wrap: wrap;
    justify-content: center;
}



/* Truck Carousels
==================*/

#carousel-freightliner,
#carousel-freightliner2,
#carousel-kenworth {
	margin-bottom: 3rem;
}

#carousel-freightliner .carousel-inner,
#carousel-freightliner2 .carousel-inner, 
#carousel-kenworth .carousel-inner {
	background: #d9eafb;
	overflow: hidden;
}

#carousel-freightliner .carousel-item img,
#carousel-freightliner2 .carousel-item img,
#carousel-kenworth .carousel-item img {
	display: block;
	width: 100%;
	height: 320px;
	object-fit:contain;
	object-position: center;
}

#carousel-freightliner .carousel-control-prev,
#carousel-freightliner .carousel-control-next,
#carousel-freightliner2 .carousel-control-prev,
#carousel-freightliner2 .carousel-control-next,
#carousel-kenworth .carousel-control-prev,
#carousel-kenworth .carousel-control-next {
	width: 11%;
	opacity: 0.95;
}

#carousel-freightliner .carousel-control-prev-icon,
#carousel-freightliner .carousel-control-next-icon,
#carousel-freightliner2 .carousel-control-prev-icon,
#carousel-freightliner2 .carousel-control-next-icon,
#carousel-kenworth .carousel-control-prev-icon,
#carousel-kenworth .carousel-control-next-icon {
	background-color: #171796;
	padding: 1.35rem;
	background-size: 58% 58%;
}

#carousel-freightliner .carousel-indicators [data-bs-target],
#carousel-freightliner2 .carousel-indicators [data-bs-target],
#carousel-kenworth .carousel-indicators [data-bs-target] {
	width: 10px;
	height: 10px
	margin: 0 4px;
	background-color: rgba(255, 255, 255, 0.75);
	border: 0;
}

#carousel-freightliner .carousel-indicators .active,
#carousel-freightliner2 .carousel-indicators .active,
#carousel-kenworth .carousel-indicators .active {
	background-color: #ffffff;
}

@media (min-width: 992px) {
	#carousel-freightliner .carousel-item img,
	#carousel-freightliner2 .carousel-item img,
	#carousel-kenworth .carousel-item img {
		height: 430px;
	}
}


.carousel-inner img {
    max-height: 400px;
    width: auto;
    margin: 0 auto;
    display: block;
  }


#carouselImageModal .modal-body {
  min-height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
#carouselImageModalSrc {
  width: 35%;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* Custom Styles Responsive CSS
====================================*/

@media (width < 576px) {
	.parent-h1 {
		font-size: 32px;
		line-height: 42px;
	}
	.parent-h2 {
		font-size: 28px;
		line-height: 34px;
	}
}

@media (max-width: 768px) {
  #carouselImageModalSrc {
    width: 85%;
  }
}

#carouselImageModalSrc {
  width: 50% !important;
  height: auto;
  margin: 0 auto;
  display: block;
}

@media (max-width: 768px) {
  #carouselImageModalSrc {
    width: 90% !important;
  }
}