@charset "UTF-8";
/* CSS Document */


/* 1200+  */
/****************************/
/* BOOTSTRAP XXL			*/
/****************************/

@media (min-width: 1401px) {
	.mobile-show	{ display:none;}
	.mobile-hide	{ display:block;}

	.banner-mobile-show	{ display:none;}
	.banner-mobile-hide	{ display:block;}

	#mobile-nav { display:none; }
	
	#wrapper{
		max-width:1340px;
		margin:30px auto 15px;
	}
	
	.container {
		width:100%;
		padding:0 50px;
	}

    .lg-padding {
        padding:0 50px;
    }

	.logo { height:100px; width:auto; }

    h1 { font-size: 54px; margin-bottom:20px;}
    h2 { font-size: 48px; }
    h3 { font-size:32px; }
	#introduction h3 { font-size:22px; }
    h4 { font-size:26px; margin-bottom:20px;}
    p { font-size:20px; margin-bottom:20px; }
    .btn { font-size:20px; }
    nav ul li {font-size:18px; }

    .hero-content .headline { font-size:56px; line-height:60px; }
    .hero-content .subheadline { font-size:28px; }
    .hero-content ul li { font-size:28px; }
    .hero-content ul li span { font-size:64px; line-height:48px; }

	.logo-block { height:135px; }
}

/****************************/
/* BOOTSTRAP XL 			*/
/****************************/

@media (min-width: 1200px) and (max-width: 1400px) {
	.mobile-show	{ display:none;}
	.mobile-hide	{ display:block;}

	.banner-mobile-show	{ display:none;}
	.banner-mobile-hide	{ display:block;}

	#mobile-nav { display:none; }
	
	body { padding:0 50px; }

	#wrapper {
		width:100%;
		margin:30px auto 15px;
	}

	.container {
		width:100%;
		max-width:100%;
		padding:0 50px;
	}

	header .container {
		padding:0 50px;
	}
	.logo { height:90px; width:auto; }

	h1 { font-size: 38px; line-height:42px; margin-bottom:15px;}
    h2 { font-size: 38px; line-height:36px; }
    h3 { font-size:24px; margin-bottom:5px; }
    h4 { font-size:22px; margin-bottom:15px;}
    p { font-size:18px; }
    .btn { font-size:20px; }
    nav ul li {font-size:16px; }

    .hero-content .headline { font-size:40px; line-height:44px; }
    .hero-content .subheadline { font-size:18px; line-height:24px; }
    .hero-content ul li { font-size:20px; }
    .hero-content ul li span { font-size:44px; line-height:42px; }
	.hero-content .btn { font-size:16px; }

	.logo-block { height:125px; }

	.location-box .btn {
		 font-size:16px;
		 margin-right:10px;
		 margin-bottom:10px;
	}

}
	
/*  <-> 1200  */
/****************************/
/* BOOTSTRAP LG				*/
/****************************/

@media (min-width: 993px) and (max-width: 1199px) {


	
	.mobile-show	{ display:none;}
	.mobile-hide	{ display:block;}

	.banner-mobile-show	{ display:none;}
	.banner-mobile-hide	{ display:block;}

	#mobile-nav { display:none; }
	
	#wrapper {
		width: 100%;
		padding:0;
		margin:0;
		position: relative;
		overflow: hidden;
	}
	
	.container {
		width:100%;
		max-width:100%;
		padding:0 50px;
	}

	.g-5, .gx-5 { --bs-gutter-x: 4rem; }

	.logo { height:80px; height:auto; }

	h1 { font-size: 38px; line-height:42px; margin-bottom:15px;}
    h2 { font-size: 38px; line-height:36px; }
    h3 { font-size:24px; margin-bottom:5px; }
    h4 { font-size:22px; margin-bottom:15px;}
    p { font-size:18px; }
    .btn { font-size:20px; }
    nav ul li {font-size:16px; }

    .hero-content .headline { font-size:40px; line-height:44px; }
    .hero-content .subheadline { font-size:18px; line-height:24px; }
    .hero-content ul li { font-size:20px; }
    .hero-content ul li span { font-size:44px; line-height:42px; }
	.hero-content .btn { font-size:16px; }

	.intro-box p { font-size:15px; }
	.intro-box .btn { font-size:15px; }

	.logo-block { height:115px; }
	#brands .logo-block{ height:110px; }

	.location-item { font-size:18px; }
	.location-box p,
	.location-box .btn-primary { font-size:15px; }
	.location-box h3 {
        font-size: 20px;
        margin-bottom: 0;
	}
}


/****************************/
/* BOOTSTRAP MD 			*/
/****************************/

@media (min-width: 768px) and (max-width: 992px) {
	
	.mobile-show	{ display:block; }
	.mobile-hide	{ display:none; }

	.banner-mobile-show	{ display:none; }
	.banner-mobile-hide	{ display:block; height:100%; }

	.banner-text-overlay {
		bottom:50px;
	}

	#wrapper {
		width: 100%;
		padding:0;
		margin:0;
		position: relative;
		overflow: hidden;
	}

	.logo { width:225px; max-width:100%; }
	
	body { padding:0;}

	.container {
		width:100%;
		max-width:100%;
		padding:0 50px;
	}

	h1 { font-size: 38px; line-height:42px; margin-bottom:15px;}
    h2 { font-size: 32px; line-height:34px; }
    h3 { font-size:24px; margin-bottom:5px; }
    h4 { font-size:20px; margin-bottom:15px;}
    p { font-size:16px; }
    .btn { font-size:16px; }
    nav ul li {font-size:16px; }

	.page-hero .hero-content { bottom:25px; }
    .hero-content .headline { font-size:35px; line-height:38px; }
    .hero-content .subheadline { font-size:18px; line-height:24px; }
    .hero-content ul li { font-size:18px; }
    .hero-content ul li span { font-size:38px; line-height:32px; }
	.hero-content .btn { font-size:14px; }
	

	.intro-img { margin-top:30px; }

	.brand-box .brand-logo {
        height: 100px;
    }

	.mobile-nav-top {
		text-align: left;
		padding:15px 0px 0 30px;
	}
	
	header { margin:0; }
	header .container {
		padding:0 0 0 30px;
	}

	.quote {
		margin-top:30px; 
	}

	#extended .brand-logo {
        height: 80px;
        margin: 15px auto;
    }
	
}


/****************************/
/* < 768 IPHONE (L)
/****************************/

@media (max-width: 767px) {
	
	.mobile-show	{ display:block; }
	.mobile-hide	{ display:none; }

	.banner-mobile-show	{ display:block; height:100%; }
	.banner-mobile-hide	{ display:none; }
	
	body { padding:0;}

	h1 {
		font-size: 40px;
		line-height: 42px;
	}

	#home-introduction h1 {
		font-size:32px;
		line-height:35px;
	}

	h2{
		font-size: 30px !important;
		line-height: 35px;
	}

	h4 {
		font-size:18px;
		margin-bottom:15px;
	}

	h5 {
		font-size: 18px;
	}

	p,
	li {
		font-size:15px;
	}

	#wrapper {
		width: 100%;
		padding:0;
		margin:0;
		position: relative;
		overflow: hidden;
	}

	.container {
		width:100%;
		padding:0 20px;
	}

	header {
		margin-top:0;
	}

	header .container {
	    padding: 0 25px 0 15px;
	}


	.home .page-hero .hero-bg {
	    background-position: -440px;
	}

	.home .page-hero {
		aspect-ratio: 5/8;	
	}

	.page-hero {
		aspect-ratio: 5 / 6;
		background-color: #fff;
	}
	
	.page-hero .hero-content {
		width:100%;
		left:0;
		padding:0 15px;
		bottom:30px;
	}

	ul.slides {
		position: absolute;
		bottom:0;
	}

	ul.slides,
	.page-hero .slides li  { width:100% !important; }

	.hero-content .subheadline { 
		margin-bottom:15px;
	}

	.hero-content ul {
		text-align: center;
		margin:30px 0 0;
		padding:0;
	}
	
	.hero-content ul li {
	    margin: 0 0 0 20px;
    	padding: 15px 0 0 20px;
	}

	.hero-content li span {
		font-size:40px;
		line-height:40px;
	}

	.page-hero .btn {
		font-size:14px;
	}

	p.headline {
		font-size:28px;
		line-height: 30px;
	}

	p.subheadline {
		display:none;
	}

	.intro-img {
		margin-top:15px;
	}

	#introduction {
		text-align: center;
	}

	.brand-box .brand-logo {
		height: 120px;
	}

	.logo-block {
		margin-bottom:30px; 
	}

	#features {
		padding-bottom:0;
		text-align: center;
	}

	#features img {
		margin-bottom: 15px;
	}

	#features h2 {
		margin-bottom:5px;
	}

	.feature-item { padding-bottom:30px;}

	footer li {
		font-size:12px;
	}

	.copyright {
		font-size: 12px;
		color: var(--brand-font-color);
		padding:10px 0;
		background-color: var(--brand-color);
		margin:0;
	}

	footer { 
		display:none; 
	}

	#wrapper {
		box-shadow: none;
	}

	.brand-box {
		margin-bottom:30px;
	}

	.brand-box .logo-block {
		margin-bottom:0; 
	}

	#extended .brand-logo {
		height:90px;
		margin:15px auto;
	}

	#introduction .brand-logo {
		max-width:100%;
	}

	.location-box {
		text-align: center;
	}
}