/* Add here all your CSS customizations */

.color1{color:#ffde21 !important;}

.btn-xlg {
    width: 100% !important; 
    max-width: 300px !important; 
    padding: 1rem 1.5rem !important; 
    font-size: 1.25rem !important; 
}

@media (max-width: 320px) {
    .btn-xlg {
        width: 90% !important; 
        padding: 0.8rem 1rem !important; 
        font-size: 1rem !important; 
    }
}

    .truck {
      position: absolute;
      bottom: 0px; 
      left: -250px; 
      width: 240px;
      transition: all 23s ease; 
    }

    /* Moving right */
    .move-right {
      left: 110vw; /* Move the truck to the right edge */

    }

    /* Moving left (flipped) */
    .move-left {
      left: -250px; /* Move the truck back to the left */
    }


.top-link {
  position: absolute;
  right: 10px;
  top: 51%;
  transform: translateY(-50%);
    text-transform: uppercase;
    font-weight: 900;
}

@media (max-width: 374px) {
    .top-link { display: none;}
}



/*.   */


.br-statistics-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px 0;
}

.br-stat-block {
    display: flex;
    align-items: center;
    margin-bottom: 0px;
    width: 100%; /* Makes the bar take full width */
}

.br-stat-number {
    font-size: 2rem;
    font-weight: bold;
    color: #000;
    margin: 5px 10px 0 0; /* Space between number and bar */
    width: 60px; /* Fixed width to align all numbers */
}

.br-stat-line-container {
    background-color: #F8F9FA; /* Light gray background for the bar */
    height: 30px;
    width: 100%; /* Full width for the container */
    position: relative;
    border-radius: 26px !important;
}

.br-stat-line {
    height: 30px;
    background-color: #FF9C1E; /* Orange color for the progress */
    position: absolute;
    top: 0;
    left: 0;
    transition: width 0.3s ease-in-out; /* Smooth transition */
    border-radius: 26px !important;
}






.br-line-text {
    padding: 10px 0 20px 0;
 font-size:16px;
    display: table;
}



/*.  */

.br-testimonial-container {
    padding: 20px; /* Adjust padding */
    background-color: transparent; /* Ensure no background */
}

.br-testimonial {
    display: flex;
    align-items: flex-start; /* Align items at the top */
    margin-bottom: 20px; /* Spacing between testimonials */
}

.br-left-aligned {
    flex-direction: row; /* User 1: Image on the left */
}

.br-right-aligned {
    flex-direction: row; /* User 2: Image on the right */
}

.br-image-container {
    margin: 0 20px 20px 20px; /* Horizontal spacing around images */
}

.br-image-container img {
    max-width: 100%; /* Make images responsive */
    height: auto; /* Maintain aspect ratio */
    width: 450px; /* Adjust width as needed */
}

.br-main-image {
       max-width: 90% !important; /* Adjust width as needed */
}


.br-text-container {
    color: #fff; /* Change text color if needed */
}

blockquote {
    font-style: normal; /* Style for blockquote */
    margin: 0; /* Remove margin */
    padding: 5px 0 20px 0; /* Remove padding */
    border: none; 
    font-size: 1.2em; /* Adjust font size */
}

h3, p {
    margin: 0; /* Remove margin */
}

/* Hidden image style */
.br-hidden-image {
    display: none; /* Hide by default */
}

/* Media Queries for Responsiveness */
@media (max-width: 768px) {
    .br-testimonial {
        flex-direction: column; /* Stack items on smaller screens */
        align-items: center; /* Center align items */
    }

    .br-image-container {
        margin: 0; /* Remove margins on smaller screens */
        margin-bottom: 10px; /* Add bottom margin for spacing */
        width: 100%; /* Make the image container full width */
    }

    .br-hidden-image {
        display: block; /* Show hidden image on small screens */
        margin-bottom: 10px; /* Spacing below the hidden image */
    }

    .br-main-image {
        display: none; /* Hide main image on small screens */
    }

    .br-text-container {
        text-align: center; /* Center text on smaller screens */
        width: 100%; /* Make text container full width */
    }

    blockquote {
        text-align: center; /* Center blockquote text */
    }
    
.br-image-container img {
    max-width: 50%; /* Make images responsive */
    width: 246px;
    }
    
    
}



/*----*/











.c-section-shapes:before {
    background-image: url(../img/b1.png);
    background-size: cover;
    content: "";
    height: 200px;
    left: -330px;
    position: absolute;
    top: -10px;
    width: 200px;
}

.e-section-shapes:before {
    background-image: url(../img/b2.png);
    background-size: cover;
    bottom: 0px;
    content: "";
    height: 200px;
    position: absolute;
    right: -300px;
    width: 200px;
    z-index: 1;
}

.p-section-shapes:before {
    background-image: url(../img/b3.png);
    background-size: cover;
    content: "";
    height: 200px;
    left: -360px;
    position: absolute;
    top: 90px;
    width: 200px;
}


.custom-space{ margin-bottom: 15px;}

.prices .panel-default .list-group-item {
	color: #222;
	border: none;
    font-size: 14px;
}

.page-header {
	margin: 0 0 0px 0;
	padding: 0;
	border: none;
}

.divider-image {
	width: 100%;
	height: 480px;
	background-size: cover;
	margin-top: -240px;
	position: relative;
	z-index: -1;
	overflow: hidden;
}

.divider-image::before,
.divider-image::after {
	content: "";
	width: 0;
	height: 0;
	position: absolute;
}

.divider-image::before {
	border-top: 60px solid #fff;
	border-right: 0vw solid transparent;
	top: 0;
	left: 0;
}

.divider-image::after {
	border-bottom: 60px solid #fff;
	border-left: 0vw solid transparent;
	bottom: 0;
	right: 0;
}



.navbar .container {
    padding-left: 25px;
    padding-right: 25px;
}

.btn-primary-size {
    padding: 14px 16px 12px 16px;
    border-radius: 6px;
    font-weight: bold;
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    transition: background-color 0.2s;
}

h1,h2,h3,h4,h5,h6{text-transform:uppercase !important;}

.green{color:#00B529 !important;}

.white{color:#fff !important;}

.orange{color:#FF9C1E !important;}

.black{color:#232323 !important;}


.bg_grey{ background-color: #F8F9FA;}

.bg_green{ background-color: #00B529;}

.bg_black{ background-color: #232323;}


.headline {
    font-size: clamp(2rem, 2.6vw, 4.5rem);
    font-weight: bold;
    line-height: 1.2;
    margin-bottom: 20px;
}

.headline-main {
    font-size: 50px;
    line-height: 1.2;
    margin-bottom: 20px;
}






.headline--1, .headline--2 {
    /*background: rgb(245, 165, 35);
    background: linear-gradient(90deg, rgba(245, 165, 35, 1) 0%, rgba(233, 98, 0, 1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;*/
    color:#000;
    text-transform: uppercase;
    font-weight: 900;
    
}

.headline--3 {
    font-size: 24px;
    min-height: 48px;
}

.paragraph {
    font-size: 16px;
    line-height: 1.5;
    color: #323235;
    padding: 0 0 40px 0;
    margin: 0;
}

.paragraph--1 {
    color: #000; 
    font-size: clamp(1.1rem, 0.9vw, 4rem);
        line-height: auto;
}

.paragraph--2 {
    color: #000; 
    font-size: clamp(1.1rem, 0.9vw, 4rem);
        line-height: auto;
}

.paragraph--3 {
    font-size: 16px;
    color: #000;
    padding: 0 0 20px 0;
}

.paragraph__cc {
    color: #000; 
    font-size: clamp(0.9rem, 0.9vw, 2rem);
        line-height: auto;
}


.one-image-bg {
    aspect-ratio: 3;
    background-image: url(../img/Mockups.png);
    background-position: 0;
    background-repeat: no-repeat;
    background-size: cover;
    box-sizing: border-box;
    content: "";
    display: inline-block;
    height: calc(100% + 80px);
    position: relative;
}

.right-item {
    padding-top: 20px;
    perspective: 1000px;
    position: relative;
    width: 50%;
}





.header__cards {
	display: flex;
	padding: 0;
	margin: 0;
}

.header__cards__card {
	list-style: none;
	padding: 120px 20px 20px 20px;
	margin: 0 20px 0 0;
	border-radius: 12px !important;
	box-shadow: 0 0 8px -2px rgba(0, 0, 0, 0.1), 0 6px 20px -3px rgba(0, 0, 0, 0.2);
	text-align: left;
	background: #fff;
	display: flex;
	flex-direction: column;
	justify-content: space-between;


}

.header__cards__card .link {
	font-weight: bold;
}

.header__cards__card.header__cards__icon {
	background-image: url("../img/icon.jpg");
    	background-size: 100px 100px;
	background-position: 20px 20px;
	background-repeat: no-repeat;
	flex-basis: 0;
	flex-grow: 1;
}

.header__cards__card.header__cards__icon__a{	background-image: url("../img/icon-a.jpg");}
.header__cards__card.header__cards__icon__b{	background-image: url("../img/icon-b.jpg");}
.header__cards__card.header__cards__icon__c{	background-image: url("../img/icon-c.jpg");}

.header__cards__card.header__cards__icon2 {
	background-image: url("../img/stars.jpg");
    	background-size: 120px auto;
	background-position: 20px 20px;
	background-repeat: no-repeat;
	flex-basis: 0;
	flex-grow: 1;
    padding-top: 54px;
}




.header__cards__card:last-child {
	margin: 0;
}






.header__cards__b {
	display: flex;
	padding: 0;
	margin: 0;
}

.header__cards__card__b {
	list-style: none;
	padding: 20px 20px 20px 20px;
	margin: 0 20px 0 0;
	border-radius: 12px !important;
	box-shadow: 0 0 8px -2px rgba(0, 0, 0, 0.1), 0 6px 20px -3px rgba(0, 0, 0, 0.2);
	text-align: left;
	background: #fff;
	display: flex;
	flex-direction: column;
	justify-content: space-between;


}

.header__cards__card__b .link {
	font-weight: bold;
}

.header__cards__card__b.header__cards__icon__b {
	background-image: url("../img/green-line.png");
    background-size: 140px 10px;
	background-position: 20px 83%;
	background-repeat: no-repeat;
	flex-basis: 0;
	flex-grow: 1;
}




.header__cards__c {
	display: block;
	padding: 0;
	margin: 0;
}

.header__cards__card__c {
	list-style: none;
	padding: 40px 20px 20px 0px;
	margin: 0 20px 0 0;
	text-align: left;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.header__cards__card__c .link {
	font-weight: bold;
}

.header__cards__card__c.header__cards__icon__c {
	background-image: url("../img/orange-line.png");
    background-size: 140px 10px;
	background-position: 0px 0px;
	background-repeat: no-repeat;
	flex-basis: 0;
	flex-grow: 1;
}

.header__cards__card__c.header__cards__icon__cg {
	background-image: url("../img/green-line.png");
    background-size: 140px 10px;
	background-position: 0px 0px;
	background-repeat: no-repeat;
	flex-basis: 0;
	flex-grow: 1;
}

.header__cards__card__cc {
	padding: 30px 0px 0px 0px !important;
	margin: 0 0 0 0 !important;
}





.header__cards__d {
	display: block;
	padding: 0;
	margin: 0;
    background: #fff;
	padding: 40px 30px 0px 30px;
	margin: 0 0px 0 0;
	border-radius: 12px !important;
	box-shadow: 0 0 8px -2px rgba(0, 0, 0, 0.1), 0 6px 20px -3px rgba(0, 0, 0, 0.2);
    
}

.header__cards__card__d {
	list-style: none;
	padding: 40px 0px 40px 0px;
	margin: 0 0px 0 0;
	text-align: left;
	background: #fff;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.header__cards__card__d .link {
	font-weight: bold;
}

.header__cards__card__d.header__cards__icon__d {
	background-image: url("../img/green-line.png");
    background-size: 140px 10px;
	background-position: 0px 0px;
	background-repeat: no-repeat;
	flex-basis: 0;
	flex-grow: 1;
}



.btn{border-radius: 6px !important;}

.prices .price-box-featured .price-box-ribbon {
    position: absolute;
    width: 150px;
    top: 25px;
    right: -35px;
    text-align: center;
    padding: 5px 20px 1px 20px;
    background: #FFF;
    color: #00b529;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.prices .price-box-ribbon2 {
	position: absolute;
	width: 150px;
	top: 25px;
	right: -35px;
	text-align: center;
	padding: 5px 20px 2px 20px;
	background: #00b529;
	color: #fff;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
    font-size: 12px;
}

.text-color1{color: #F99B1F !important;}
.text-color2{color: #00b529 !important;}

.cover-inner {
	border: 0px solid #FFF;
}

.fluid-width-video-wrapper {
    width: 100%;
    position: relative;
    padding: 0;
}

.fluid-width-video-wrapper iframe, .fluid-width-video-wrapper object, .fluid-width-video-wrapper embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Spacer Style   ||-----------*/

.spacer-15 {
    width: 100%;
    height: 15px;
    clear: both;
}

.spacer-30 {
    width: 100%;
    height: 30px;
    clear: both;
}

.spacer-45 {
    width: 100%;
    height: 45px;
    clear: both;
}

.spacer-60 {
    width: 100%;
    height: 60px;
    clear: both;
}

.spacer-75 {
    width: 100%;
    height: 75px;
    clear: both;
}

.spacer-90 {
    width: 100%;
    height: 90px;
    clear: both;
}

.extra-started{margin-top: 90px;}

.s-footer{text-align: center; height: 60px; font-size: clamp(0.8rem, 0.8vw, 4.5rem);}


@media (max-width: 999px) {
    .extra-center{ text-align: center;}
.extra-started{margin-top: -15px; text-align: center;}
.navbar-brand {
	background-repeat: no-repeat;
	background-position: left center;
	width: 190px !important;
	height: auto;
	padding: 24px 0;
	text-indent: -99999px;
	font-size: 24px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: 4px;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
    background-size: 190px auto !important;
}
}

@media (max-width: 767px) {
.navbar-brand {
	background-repeat: no-repeat;
	background-position: left center;
	width: 220px !important;
	height: auto;
	padding: 24px 0;
	text-indent: -99999px;
	font-size: 24px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: 4px;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
    background-size: 220px auto !important;
}
    
.header__cards{ width: 100%; display: block; margin: 0; padding: 0;}
    .header__cards__card{margin: 0 0 20px 0;}
}


@media only screen and (max-width : 1199px) {
   .all-hide{display:none !important;} 
}



@media only screen and (max-width : 767px) {
   .header__cards__b{ width: 100%; display: block; margin: 0; padding: 0;}
    .header__cards__card__b{margin: 0 0 20px 0;} 
    .paragraph { padding: 0 10px;}
}


@media (max-width: 499px) {
.navbar .container {
    padding-left: 0px;
    padding-right: 0px;
}
    
    .navbar{padding: .5rem 0.5rem;}
}
