/*-----------------------------------------------------------------------------------

    Template Name: Driveon - Driving School HTML Template
    Template URI: http://hastech.company/
    Description: Bootstrap HTML Template
    Author: Hastech
    Author URI: http://hastech.company/
    Version: 1.0

-----------------------------------------------------------------------------------
    
    CSS INDEX
    ===================
	
    1.   Page Banner Title Area
    2.   Feature Area
	3.   Course Area
	4.   Video Area
	5.   Instructor Area
	6.   FAQ Area
	7.   Call To Action Area
	8.   Contact Area
	9.   Dark Version Style
	
-----------------------------------------------------------------------------------*/

.about-us-image-right {
  float: right;
  width: 371px;
  height: 489px;
}

.base-image {
  display: block;
  /* Ensures no space below the image */
}

.overlay-image {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);
  box-shadow: rgba(0, 0, 0, 0.17) 0px 0px 10px 0px;
  color: rgb(51, 51, 51);
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s, transform 0.4s;
  border-radius: 100%;
  padding: 40px;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  width: 160px;
  height: 160px;
  transform: translate(-30%, -70%);
}

.about-us-image-right p {
  bottom: 20px;
  /* Adjust the distance from the bottom */
  left: 20px;
  /* Adjust the distance from the left */
  color: white;
  /* Text color */
  font-size: 24px;
  /* Text size */
  background-color: rgba(0, 0, 0, 0.5);
  /* Semi-transparent background for better readability */
  padding: 5px;
  /* Padding around the text */
  border-radius: 5px;
  /* Rounded corners */
  transform: translate(-30%, -70%);
  font-size: 14px;
  color: #222;
  font-family: petrona, Sans-serif;
  font-size: 16px;
  font-weight: 500;
}

.about-us-img-section {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  align-content: flex-start;
  flex-wrap: wrap;
  position: relative;
  width: 543.95px;
  display: flex;
  padding: 10px;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.about-us-img-section img {
  box-sizing: border-box;
  height: 589.438px;
  max-width: 100%;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px 0px;
  color: rgb(51, 51, 51);
  break-inside: auto;
  border-radius: 0px;
  display: inline-block;
  vertical-align: middle;
  width: 471.55px;
  text-align: right;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

/*-------------------------- 
	1. Page Banner Title Area
--------------------------*/
.page-banner-area {
  background-image: url("img/section-bg/page-banner.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
  background-size: cover;
  padding: 270px 0 150px;
}

.page-banner {}

.page-banner h1 {
  color: #fff;
  display: block;
  font-size: 36px;
  font-weight: 900;
  line-height: 30px;
  margin-bottom: 0;
  text-transform: uppercase;
}

.page-banner.text-left h1 {
  float: left;
}

.page-banner.text-right h1 {
  float: right;
}

.page-banner ul {
  display: inline-block;
  vertical-align: top;
  margin-top: 15px;
}

.page-banner.text-left ul {
  float: right;
}

.page-banner.text-right ul {
  float: left;
}

.page-banner ul li {
  display: block;
  float: left;
  padding: 0 6px;
  position: relative;
}

.page-banner ul li:first-child {
  padding-left: 0;
}

.page-banner ul li:last-child {
  padding-right: 0;
}

.page-banner ul li+li::before {
  color: #fff;
  content: "/";
  display: block;
  left: -3px;
  line-height: 9px;
  overflow: hidden;
  position: absolute;
  top: 0;
}

.page-banner ul li a,
.page-banner ul li span {
  color: #fff;
  display: block;
  font-size: 12px;
  line-height: 9px;
  text-transform: uppercase;
}

.page-banner ul li a:hover {
  color: #dec839;
}

.slider-text {
  font-size: 20px;
}

.icon {
  font-size: 20px;
  /* Adjust the size */
  color: #FFBD48;
  /* Change the color as needed */
  margin-right: 8px;
}

/*-------------------------- 
	2. Feature Area
--------------------------*/
.feature-wrapper {}

.feature-left {}

.feature-right {}

/* Feature Image */
.feature-image {
  z-index: 9;
}

/* Single Feature */
.single-feature {
  position: relative;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  z-index: 1;
}

.single-feature:nth-child(1) {
  padding: 15px 0 14px;
}

.single-feature:nth-child(2) {
  padding: 37px 0;
}

.single-feature:nth-child(3) {
  padding: 15px 0;
}

/* Single Feature Hover */
.single-feature:hover {
  background-color: #fff;
}

.single-feature::before {
  background-color: #fff;
  bottom: 0;
  content: "";
  opacity: 0;
  position: absolute;
  top: 0;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 50%;
  z-index: -1;
}

.single-feature:hover::before {
  opacity: 1;
}

.feature-left .single-feature::before {
  left: 100%;
}

.feature-right .single-feature::before {
  Right: 100%;
}

/* Left Single Feature */
.feature-left .single-feature {
  margin-right: -7px;
}

.feature-left .single-feature:nth-child(2) {
  margin-left: -15px;
  padding-right: 24px;
}

/* Right Single Feature */
.feature-right .single-feature {
  margin-left: -7px;
}

.feature-right .single-feature:nth-child(2) {
  margin-right: -15px;
  padding-left: 24px;
}

/* Featue Icon */
.single-feature .icon {
  display: block;
  margin-top: 19px;
  min-width: 36px;
}

.feature-left .icon {
  float: right;
  margin-left: 29px;
  text-align: left;
}

.feature-right .icon {
  float: left;
  margin-right: 29px;
  text-align: right;
}

.single-feature .icon i {
  color: #dec839;
  font-size: 36px;
  display: block;
}

/* Feature Text */
.single-feature .text {}

.single-feature .text h4 {
  font-size: 18px;
  margin-bottom: 9px;
}

.single-feature .text p {}

/*-------------------------- 
	3. Course Area
--------------------------*/

.empty-div {
  -ms-flex: 0 0 12.5%;
  flex: 0 0 12.5%;
  max-width: 12.5%;
}

.course-wrapper {}

.course-item {
  background: rgba(0, 0, 0, 0) url("img/shape/course/course-white.png") no-repeat scroll center center;
  -webkit-background-size: cover;
  background-size: cover;
  overflow: hidden;
  padding: 34px 25px 40px;
  position: relative;
  transition: all 1s ease 0s;
  z-index: 1;
}

.course-item i {
  color: #dec839;
  display: inline-block;
  font-size: 48px;
  margin-bottom: 18px;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.course-item h4 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 19px;
  padding-bottom: 19px;
  position: relative;
  text-transform: uppercase;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.course-item h4::before {
  background-color: #dec839;
  bottom: 0;
  content: "";
  height: 2px;
  left: 50%;
  margin-left: -25px;
  position: absolute;
  width: 50px;
}

.course-item p {
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

/* Course Hover */
.course-item:hover {
  background-image: url("img/shape/course/course-color.png");
  transform: rotate(360deg);
}

.course-item:hover i {
  color: #fff;
}

.course-item:hover h4 {
  color: #fff;
}

.course-item:hover h4::before {
  background-color: #fff;
}

.course-item:hover p {
  color: #fff;
}

.pricing-area {
  box-sizing: border-box;
  background: linear-gradient(rgb(35, 31, 32) 52%, rgb(121, 120, 118) 100%) 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  align-self: auto;
  flex: 0 1 auto;
  order: 0;
  position: relative;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  font-family: -apple-system, "system-ui", "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.customized-package-section {
  background-attachment: fixed;
  background-image: url(https://6ixdriver.com/wp-content/uploads/2020/11/FFBD48-1.png);
  background-size: cover;
  position: relative;
}

.background-overlay {
  background-color: #231F20;
  opacity: .86;
  transition: background .3s, border-radius .3s, opacity .3s;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  position: absolute;
}

.customized-package-section-data {
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  text-align: center;
  align-items: center;
  align-content: center;
  padding: 50px 0px 150px;
  align-content: flex-start;
  flex-wrap: wrap;
  position: relative;
  width: 60%;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin-left: auto;
  margin-right: auto;
}

.customized-package-section-divider {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  display: flex;
  padding-block: 2px;
  text-align: center;
  font-family: -apple-system, "system-ui", "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin-top: 15px;
  margin-bottom: 15px;
  align-content: center;
}

.customized-package-section-divider-separator {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  direction: ltr;
  display: flex;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
  margin-bottom: 10px;
  border-block-start: 4px solid rgb(255, 189, 72);
  width: 60px;
  text-align: center;
  font-family: -apple-system, "system-ui", "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.customized-package {
  max-width: 80%;
  display: flex;
  margin-right: auto;
  margin-left: auto;
  position: relative;
  line-height: 1.5;
  color: #333;
}

.column1 {
  width: 40%;
  box-sizing: border-box;
  background: linear-gradient(0deg, rgb(35, 31, 32) 80%, rgb(255, 255, 255) 100%) 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  place-content: center;
  flex-wrap: wrap;
  position: relative;
  padding: 15px 0px;
  align-items: center;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  font-family: -apple-system, "system-ui", "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.column1 h2 {
  box-sizing: border-box;
  color: rgb(255, 255, 255);
  font-family: "open sans", sans-serif;
  font-weight: 600;
  line-height: 20px;
  margin-block: 0px;
  font-size: 20px;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  orphans: 2;
  widows: 2;
  break-after: auto;
  margin: 0px;
  text-align: center;
  padding-bottom: 15px;
}

.column1 li {
  font-size: 15px;
}

.elementor-icon-list-items {
  padding: 0;
  list-style-type: none;
  margin: 0;
}

.elementor-icon-list-item {
  justify-content: center;
  display: flex;
  font-size: inherit;
  margin: 0;
  padding: 0;
  position: relative;
  align-items: center;
}

.elementor-icon-list-icon i {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(255, 255, 255);
  font-size: 7px;
  width: 8.75px;
  transition: color 0.3s;
  display: block;
  font-variant: normal;
  line-height: 7px;
  text-rendering: auto;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  text-align: center;
  list-style-type: none;
  align-self: center;
}

.elementor-icon-list-text {
  font-family: open sans, Sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: #fff !important;
  transition: color .3s;
  padding-left: 5px;
}

.column2 {
  box-sizing: border-box;
  background: linear-gradient(0deg, rgb(255, 189, 72) 80%, rgb(255, 255, 255) 100%) 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  place-content: center;
  flex-wrap: wrap;
  position: relative;
  width: 35%;
  display: flex;
  padding: 15px 0px;
  align-items: center;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  font-family: -apple-system, "system-ui", "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.column2 h2 {
  box-sizing: border-box;
  color: rgb(255, 255, 255);
  font-family: "open sans", sans-serif;
  font-weight: 400;
  line-height: 18px;
  margin-block: 0px;
  font-size: 18px;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  orphans: 2;
  widows: 2;
  break-after: auto;
  margin: 0px;
  text-align: center;
}

.column2 i {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(255, 255, 255);
  font-size: 15px;
  width: 18.75px;
  transition: color 0.3s;
  display: block;
  font-variant: normal;
  line-height: 15px;
  text-rendering: auto;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  text-align: left;
  list-style-type: none;
}

.column3 {
  box-sizing: border-box;
  background: linear-gradient(0deg, rgb(255, 255, 255) 80%, rgb(188, 188, 188) 100%) 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  place-content: center;
  flex-wrap: wrap;
  position: relative;
  width: 25%;
  display: flex;
  padding: 15px 0px;
  align-items: center;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  font-family: -apple-system, "system-ui", "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.column3 h2 {
  box-sizing: border-box;
  color: rgb(35, 31, 32) !important;
  font-family: "open sans", sans-serif;
  font-weight: 600;
  line-height: 18px;
  margin-block: 0px;
  font-size: 18px;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  orphans: 2;
  widows: 2;
  break-after: auto;
  margin: 0px;
  text-align: center;
}

.empty-section {
  margin-bottom: 50px;
}

.single-empty-section {
  margin-bottom: 15px;
}


/*--------------------------
	4. Video Area
--------------------------*/
.video-area {
  background: rgba(0, 0, 0, 0) url("img/section-bg/video.jpg") repeat scroll 0 0;
  -webkit-background-size: cover;
  background-size: cover;
  padding: 195px 0;
}

.video-content {}

.video-content a {
  color: #ffffff;
  display: inline-block;
}

.video-content a:hover {
  color: #dec839;
}

.video-content a i {
  display: block;
  font-size: 60px;
}

.video-content h3 {
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  line-height: 18px;
  margin: 30px 0 0;
  text-transform: uppercase;
}

/*--------------------------
	5. Instructor Area
--------------------------*/
.instructor-details {}

.instructor-name {
  font-size: 18px;
  font-weight: bold;
  text-transform: uppercase;
}

.instructor-title {
  color: #333;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 20px;
}

.instructor-details p {
  margin-bottom: 17px;
}

.instructor-social {}

.instructor-social a {
  border: 1px solid #aaaaaa;
  color: #aaaaaa;
  display: block;
  float: left;
  height: 35px;
  margin-right: 15px;
  text-align: center;
  width: 35px;
}

.instructor-social a i {
  display: block;
  font-size: 18px;
  line-height: 33px;
}

.instructor-social a:hover {
  background-color: #dec839;
  border-color: #dec839;
  color: #fff;
}

.instructor-image {
  margin-top: 74px;
}

.instructor-image img {
  width: 100%;
}

/* Instructor Tab List */
.instructor-tab-list {
  float: left;
  margin-top: -127px;
}

.instructor-tab-list li {
  display: block;
  float: left;
  margin-right: 30px;
  padding-bottom: 12px;
  width: 115px;
}

.instructor-tab-list li:last-child {
  margin-right: 0;
}

.instructor-tab-list li a {
  display: block;
  position: relative;
}

.instructor-tab-list li a::before {
  background-color: #000;
  bottom: 0;
  content: "";
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.instructor-tab-list li a:hover::before,
.instructor-tab-list li.active a::before {
  opacity: 0.5;
}

.instructor-tab-list li a::after {
  background-color: #dddddd;
  border-radius: 50%;
  bottom: -12px;
  content: "";
  height: 2px;
  left: 10px;
  opacity: 0;
  position: absolute;
  right: 10px;
}

.instructor-tab-list li a:hover::after,
.instructor-tab-list li.active a::after {
  opacity: 1;
}

.instructor-tab-list li a img {
  width: 100%;
}

/*--------------------------
	6. FAQ Area
--------------------------*/
.faq-image {
  margin-top: 75px;
}

.faq-image img {
  width: 100%;
}

/*--------------------------
	7. Call To Action Area
--------------------------*/
.cta-area {
  background-color: #dec839;
}

.call-to-action {}

.call-to-action h3 {
  color: #fff;
  display: block;
  float: left;
  font-weight: 600;
  line-height: 36px;
  margin: 0;
  text-transform: uppercase;
}

.call-to-action a {
  float: right;
}

/*--------------------------
	8. Contact Area
--------------------------*/
#contact-map {
  height: 530px;
}

.contact-info {}

.contact-info .single-info {}

.contact-info .single-info+.single-info {
  margin-top: 45px;
}

.contact-info .single-info .icon {
  background-color: #dec839;
  border-radius: 2px;
  color: #fff;
  display: block;
  float: left;
  height: 44px;
  margin-left: 10px;
  margin-right: 40px;
  margin-top: 10px;
  text-align: center;
  transform: rotate(45deg);
  width: 44px;
}

.contact-info .single-info .icon i {
  display: block;
  font-size: 24px;
  line-height: 44px;
  transform: rotate(-45deg);
}

.contact-info .single-info .content {}

.contact-info .single-info .content h5 {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 11px;
  text-transform: uppercase;
}

.contact-info .single-info .content p {}

.contact-info .single-info .content p a {
  display: block;
}

.contact-info .single-info .content p a:hover {
  color: #dec839;
}

/*--------------------------
	9. Dark Version Style
--------------------------*/
.dark-wrapper .bg-white,
.dark-wrapper.bg-white {
  background-color: #1e2127 !important;
}

.dark-wrapper .bg-gray,
.dark-wrapper.bg-gray {
  background-color: #252830 !important;
}

.dark-wrapper .overlay-white::before,
.dark-wrapper.overlay-white::before {
  background-color: #000;
}

.dark-wrapper p,
.dark-wrapper span {
  color: #d0d0d0;
}

.dark-wrapper li {
  color: #d0d0d0;
}

.dark-wrapper h1,
.dark-wrapper h2,
.dark-wrapper h3,
.dark-wrapper h4,
.dark-wrapper h5,
.dark-wrapper h6,
.dark-wrapper a {
  color: #fff;
}

.dark-wrapper .section-title::before,
.dark-wrapper .section-title::after {
  background-color: #444;
}

/* Course Form */
.dark-wrapper .find-course-form h5 span {
  color: #555555;
}

/* Feature */
.dark-wrapper .single-feature:hover {
  background-color: #1e2127;
}

.dark-wrapper .single-feature::before {
  background-color: #1e2127;
}

/* Funfact */
.dark-wrapper .single-facts i {
  color: #d0d0d0;
}

.dark-wrapper .single-facts h1::before {
  background-color: #d0d0d0;
}

/* Course */
.dark-wrapper .course-item {
  background-image: url("img/shape/course/course-dark.png");
}

.dark-wrapper .course-item:hover {
  background-image: url("img/shape/course/course-color.png");
}

/* Gallery */
.dark-wrapper .gallery-filter button::before,
.dark-wrapper .gallery-filter button::after {
  background-color: #d0d0d0;
}

.dark-wrapper .gallery-filter button {
  color: #d0d0d0;
}

/* Testimonial */
.dark-wrapper .ts-arrows {
  color: #fff;
}

/* FAQ */
.dark-wrapper .panel-group .panel {
  background-color: #252830;
}

/* Blog */
.dark-wrapper .blog-item .meta p {
  color: #d0d0d0;
}

.dark-wrapper .blog-item .title a {
  color: #fff;
}

.dark-wrapper .category-sidebar ul li a {
  color: #fff;
}

/* Contact */
.dark-wrapper .form .input input[type="text"],
.dark-wrapper .form .input input[type="email"],
.dark-wrapper .form .input input[type="tel"],
.dark-wrapper .form .input input[type="password"],
.dark-wrapper .form .input input[type="search"],
.dark-wrapper .form .input input[type="url"],
.dark-wrapper .form .input textarea {
  color: #fff;
}

/* Other */
.dark-wrapper .pagination ul li a {
  color: #fff;
}

/* Service Areas page */
section img {
  width: 436px;
  /* Fixed width of the image */
  height: 523px;
  /* Fixed height of the image */
  object-fit: cover;
  /* Ensures the image covers the space without distortion */
}

.image-left {
  float: left;
  margin-right: 15px;
}

.image-right {
  float: right;
  margin-left: 15px;
}

.clearfix::after {
  content: "";
  display: table;
  clear: both;
  padding: 100px 0px 100px 0px;
}

/* home page testimonial section */

.testimonial-container {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  /* Padding between boxes */
  width: 100%;
  /* Adjust width as needed */
  height: 60%;
  /* Adjust height as needed */
}

.testimonial-box {
  justify-content: center;
  align-items: center;
  font-size: 1.2em;
  font-weight: bold;
  border-radius: 15px;
  /* Adjust the radius for more or less roundness */
  margin: 0px 16px 0px 0px;
  padding: 35px 35px 35px 35px;
}

.top-box {
  height: 100%;
  text-align: left;
}

.bottom-box {
  height: 100%;
  text-align: left;
}

.dark-color-box {
  background-color: #231F20;
  color: #F8F8F8;
}

.light-color-box {
  background-color: #FEF3B3;
}

.light-color-box p {
  color: #231F20;
}

.hands-raised {
  width: 100%;
  text-align: center;
}

.hands-raised img {
  width: 10%;
  margin-bottom: 12px;
}

/* Home page service areas  */
.home-service-areas {
  width: 75%;
  font-size: 1.2em;
  font-weight: bold;
}

.home-service-areas h2 {
  color: #000;
}

.home-service-areas h3 {
  box-sizing: border-box;
  color: rgb(0, 0, 0);
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  line-height: 42px;
  margin-block: 0px;
  font-size: 36px;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  text-shadow: rgba(255, 255, 255, 0.76) 1px 2px 0px;
  orphans: 2;
  widows: 2;
  break-after: auto;
  margin: 0px;
  text-align: center;
}

.service-button {
  background-color: black;
  color: #FFBD48;
  border: none;
  border-radius: 5px;
  padding: 10px 20px;
  font-size: 16px;
  font-size: 1.2em;
  font-weight: bold;
  cursor: pointer;
  transition: background-color 0.3s, color 0.3s;
}

.service-button:hover {
  background-color: #dec839;
  color: black;
  border: 2px solid black;
  /* Adjust the border width as needed */
}

/* circle with tick mark */
/* Custom bullet points with yellow circle and black checkmark */
ul.custom-bullets {
  list-style: none;
  padding-left: 0;
}

ul.custom-bullets li {
  position: relative;
  padding-left: 30px;
  /* Adjust for bullet size */
  margin-bottom: 10px;
  /* Space between items */
}

ul.custom-bullets li::before {
  content: '✔';
  /* Checkmark character */
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  color: black;
  /* Color of the checkmark */
  font-size: 18px;
  /* Size of the checkmark */
}

ul.custom-bullets li::before {
  content: '';
  /* Clear previous content */
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: #FFBD48;
  /* Bullet background color */
  width: 20px;
  /* Bullet size */
  height: 20px;
  /* Bullet size */
  border-radius: 50%;
  /* Makes the bullet round */
  display: flex;
  align-items: center;
  justify-content: center;
  color: black;
  /* Checkmark color */
  font-size: 12px;
  /* Checkmark size */
  font-weight: bold;
  /* Checkmark weight */
}

ul.custom-bullets li::after {
  content: '✔';
  /* Checkmark character */
  position: absolute;
  left: 5px;
  /* Position within bullet */
  top: 50%;
  transform: translateY(-50%);
  color: black;
  /* Checkmark color */
  font-size: 12px;
  /* Checkmark size */
  font-weight: bold;
  /* Checkmark weight */
}

/* Style for the button */
.contact-button {
  display: inline-block;
  /* Make the link behave like a button */
  background-color: #FFBD48;
  /* Button background color */
  color: white;
  /* Text color */
  text-align: center;
  /* Center text */
  text-decoration: none;
  /* Remove underline */
  border: none;
  /* Remove default border */
  padding: 10px 20px;
  /* Padding inside the button */
  font-size: 16px;
  /* Font size */
  cursor: pointer;
  /* Cursor style */
  border-radius: 5px;
  /* Rounded corners */
  transition: background-color 0.3s ease;
  /* Smooth transition */
  margin-top: 20px;
  /* Add space between the list and button */
}

/* Hover effect */
.contact-button:hover {
  background-color: black;
  /* Button background color on hover */
  color: white;
  /* Keep text color white on hover */
}

.cta-area-button {
  align-content: center;
}

.team-instructor-image {
  height: 80%;
}

/* Programs page */

.programs-container {
  margin-top: 0px;
  margin-bottom: 50px;
  padding: 110px 0px 080px 0px;
}

.new-comers-program {}

.new-comers-program-heading {
  background-color: transparent;
  background-image: linear-gradient(180deg, #FFBD48 0%, #FEF3B3 100%);
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 015px;
}

.new-comers-program-heading h2 {
  text-align: left !important;
  justify-content: left;
  -webkit-font-smoothing: antialiased;
  font-size: 20px !important;
}

.new-comers-program p {
  text-align: left;
  font-weight: 400;
  color: var(--e-global-color-87cb0fc);
  font-family: "Open Sans", Sans-serif;
  font-size: 16px;
  line-height: 1.6em;
}

.new-comers-program img {
  margin-top: 60px;
  margin-bottom: 40px;
  vertical-align: middle;
  display: inline-block;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
}

.new-comers-program h2 {
  color: #231F20;
  font-family: "Open Sans", Sans-serif;
  font-size: 30px;
  font-weight: 700;
  line-height: 50px;
  text-align: center;
  display: block;
}

.new-comers-program ul {
  list-style-type: none;
  /* Remove default bullets */
  padding-left: 0;
  /* Remove padding */
}

.new-comers-program li::before {
  content: "•";
  /* Custom bullet */
  color: #FFBD48;
  /* Bullet color */
  font-weight: 900;
  font-size: 1.5em;
  /* Adjust size if needed */
  margin-right: 0.5em;
  /* Space between bullet and text */
}

.new-comers-program li {
  font-family: "Open Sans", Sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 29px;
  color: #231F20;
  padding-left: 5px;
}

/* Senior driving image */
.programs-senior-driving {
  width: 50%;
  position: relative;
  min-height: 1px;
  display: flex;
  float: left;
}

.programs-senior-driving img {
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
  width: 510px !important;
  height: 636px !important;
  margin-left: 20px;
}

.programs-special-needs-driving {
  width: 50%;
  position: relative;
  min-height: 1px;
  display: flex;
  float: left;
}

.programs-special-needs-driving img {
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
  width: 452px !important;
  height: 325px !important;
  margin-left: 10%;
}

.programs-content {
  width: 50%;
  padding: 0px 0px 0px 0px;
  float: right;
}

.programs-content p {
  margin-block-start: 0;
  margin-block-end: .9rem;
  text-align: left;
  color: #231F20;
  font-family: "Open Sans", Sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6em;
  -webkit-font-smoothing: antialiased;
}

.programs-content h2 {
  color: #231F20;
  font-family: "Open Sans", Sans-serif;
  font-size: 30px;
  font-weight: 700;
  line-height: 50px;
  padding: 0;
  margin: 0;
  -webkit-font-smoothing: antialiased;
}

.programs-content ul {
  list-style-type: none;
  /* Remove default bullets */
  padding-left: 0;
  /* Remove padding */
}

.programs-content li::before {
  content: "•";
  /* Custom bullet */
  color: #FFBD48;
  /* Bullet color */
  font-weight: 900;
  font-size: 1.5em;
  /* Adjust size if needed */
  margin-right: 0.5em;
  /* Space between bullet and text */
}

.programs-content li {
  font-family: "Open Sans", Sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 29px;
  color: #231F20;
  padding-left: 5px;
}

.programs {
  clear: both;
  max-width: 1200px;
  display: flex;
  margin-right: auto;
  margin-left: auto;
  position: relative;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #333;
  box-sizing: border-box;
  margin-bottom: 6%;
}

.programs h2 {
  text-align: center;
  color: #000;
}

.programs-clearfix::after {
  content: "";
  display: table;
  clear: both;
}

.divider {
  text-align: center;
  padding-block-start: 24px;
  padding-block-end: 24px;
  display: flex;
  margin-top: 8%;
}

.divider-separator {
  width: 100%;
  margin: 0 auto;
  direction: ltr;
  align-items: center;
  display: flex;
}

.divider-separator::before {
  display: block;
  content: "";
  border-block-end: 0;
  flex-grow: 1;
  border-block-start: 2px solid #000;
  margin-right: 15px;
}

.divider-separator::after {
  display: block;
  content: "";
  border-block-end: 0;
  flex-grow: 1;
  border-block-start: 2px solid #000;
  margin-left: 15px;
}

.divider-text {
  color: #000 !important;
  font-family: open sans, Sans-serif;
  font-size: 36px;
  font-weight: 600;
  line-height: 42px;
  text-align: center !important;
}

.divider-element {
  margin: 0 32px;
  flex-shrink: 0;
}

.program {
  width: 25%;
  padding: 010px 010px 010px 010px;
}

.program h3 {
  margin-bottom: 8px;
  color: #FFBD48;
  font-family: "Open Sans", Sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 30px;
  margin-block-start: .5rem;
  margin-block-end: 1rem;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  text-align: center;
}

.program p {
  color: #090202;
  font-family: "Open Sans", Sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 24px;
  margin: 0;
  display: block;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  text-align: center;
}

.learn-more {
  align-items: center;
  justify-content: center;
  font-family: "Open Sans", Sans-serif;
  font-size: 15px;
  font-weight: 600;
  fill: #231F20;
  color: #231F20;
  background-color: #FFBD48;
  border-radius: 0px 0px 0px 0px;
  padding: 010px 080px 010px 080px;
  width: auto;
  box-shadow: none;
  text-decoration: none;
  transition-duration: .3s;
  transition-property: transform;
  display: flex;
  line-height: 1;
  text-align: center;
  transition: all .3s;
  cursor: auto;
  -webkit-font-smoothing: antialiased;
  margin: 20px 10px 20px 10px;
}

.drivers-rehab-program {
  width: 50%;
  position: relative;
  min-height: 1px;
  display: flex;
  float: left;
}

.drivers-rehab-program img {
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
  width: 480px !important;
  height: 500px !important;
  margin-left: 40px;
}

.drivers-rehab-program-inclusions {
  margin-top: 10px;
}

.drivers-rehab-program-inclusions-para {
  margin-top: 20px;
  margin-bottom: 20px;
}

.drivers-rehab-program-inclusions i {
  color: #FFBD48;
  transition: color 0.3s;
  font-size: 20px;
  width: 1.25em;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  line-height: 1;
}

.icon-list-text {
  font-family: "Open Sans", Sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 29px;
  color: #231F20 !important;
  transition: color 0.3s;
  padding-left: 15px;
  align-self: center;
  display: inline-block;
}

.about-us-content {
  padding: 0;
  margin: 0;
  display: block;
  float: left;
  width: 50%;
}

.about-us-content h3 {
  color: #000000;
  font-family: "Open Sans", Sans-serif;
  font-size: 36px;
  font-weight: 400;
  line-height: 42px;
  margin-block-start: .5rem;
  margin-block-end: 1rem;
  display: block;
  -webkit-font-smoothing: antialiased;
}

.about-us-content p {
  color: #000000;
  font-family: "Open Sans", Sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 29px;
  -webkit-font-smoothing: antialiased;
}

.about-us-content li {
  font-family: "Open Sans", Sans-serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 29px;
  color: #000000;
  transition: color 0.3s;
}

.about-us-img {
  display: flex;
  float: right;
  margin-bottom: 10%;
}

.about-us-img img {
  vertical-align: middle;
  display: inline-block;
}

.mission-vision-section {
  background-color: transparent;
  background-image: linear-gradient(0deg, #FFBD48 0%, #FEF3B3 100%);
  clear: both;
  border-style: solid;
  border-width: 1px 0px 0px 0px;
  border-color: #E2E2E2;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  padding-bottom: 12%;
  padding-left: 10%;
  padding-right: 10%;
  padding-top: 25px;
}

.mission {
  width: 40%;
  /* Adjust the width as necessary */
  padding: 30px;
  border-radius: 8px;
  /* Rounded corners */
  float: left;
  text-align: left;
  margin-left: 10%;
}

.mission h3 {
  color: #000000;
  font-family: "Open Sans", Sans-serif;
  font-size: 25px;
  font-weight: 600;
  line-height: 36px;
  padding: 0;
  display: flex;
  align-items: center;
  margin: 0px 0px 0px 10px;
}

.mission-header {
  display: flex;
  /* Use flexbox to align icon and heading */
  align-items: center;
  /* Center items vertically */
  margin-bottom: 3%;
}

.mission p {
  color: #000000;
  font-family: "Open Sans", Sans-serif;
  font-size: 16px;
  font-weight: 500;
  text-transform: capitalize;
  line-height: 24px;
}

.mission i {
  color: #000000;
  border-color: #000000;
  font-size: 24px;
  display: inline-block;
  align-items: center;
}

.vision {
  width: 40%;
  /* Adjust the width as necessary */
  padding: 30px;
  border-radius: 8px;
  /* Rounded corners */
  float: right;
  text-align: left;
  margin-right: 10%;
}

.vision h3 {
  color: #000000;
  font-family: "Open Sans", Sans-serif;
  font-size: 25px;
  font-weight: 600;
  line-height: 36px;
  padding: 0;
  margin: 0px 0px 0px 10px;
}

.vision-header {
  display: flex;
  /* Use flexbox to align icon and heading */
  align-items: center;
  /* Center items vertically */
  margin-bottom: 3%;
}

.vision p {
  color: #000000;
  font-family: "Open Sans", Sans-serif;
  font-size: 16px;
  font-weight: 500;
  text-transform: capitalize;
  line-height: 24px;
}

.vision i {
  color: #000000;
  border-color: #000000;
  font-size: 24px;
  display: inline-block;
}

.our-team-section {
  text-align: center;
  margin-top: 4%;
}

.our-team-section h3 {
  box-sizing: border-box;
  color: #000;
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  line-height: 42px;
  margin-block: 0px;
  font-size: 38px;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  orphans: 2;
  widows: 2;
  break-after: auto;
  margin: 0px;
  text-align: center;
}

.team-section-divider {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  display: flex;
  padding-block: 2px;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.team-section-divider-separator {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  direction: ltr;
  display: flex;
  border-block-start: 4.8px solid rgb(255, 189, 72);
  width: 10%;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin-left: 45%;
  margin-right: 45%;
  margin-top: 2%;
}

.team-members {
  clear: both;
  max-width: 80%;
  display: flex;
  margin-right: auto;
  margin-left: auto;
  position: relative;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #333;
  box-sizing: border-box;
  margin-bottom: 3%;
  align-items: center;
}

.member-box {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);
  box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 16px 0px;
  color: rgb(51, 51, 51);
  align-content: flex-start;
  flex-wrap: wrap;
  position: relative;
  width: 276px;
  display: flex;
  padding: 0px 0px 32px;
  border-radius: 4px;
  margin: 0% 3%;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.founder-box {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);
  box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 16px 0px;
  color: rgb(51, 51, 51);
  align-content: flex-start;
  flex-wrap: wrap;
  position: relative;
  padding: 0px 0px 32px;
  border-radius: 4px;
  margin: 0% 40%;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.founder {
  box-sizing: border-box;
  padding: 0px 0px 010px 0px;
  font-family: "Open Sans", sans-serif;
  text-align: center;
  orphans: 2;
  widows: 2;
}

.founder img {
  width: 376px;
  height: 346px;
}

.member {
  box-sizing: border-box;
  padding: 0px 0px 010px 0px;
  font-family: "Open Sans", sans-serif;
  text-align: center;
  orphans: 2;
  widows: 2;
}

.member img {
  width: 276px;
  height: 254px;
}

.member h3 {
  color: rgb(35, 31, 32);
  font-weight: 700;
  line-height: 30px;
  margin-block: 8px 7px;
  font-size: 20px;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  break-after: auto;
  margin-bottom: 7px;
}

.member p {
  margin-block: 0px;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgba(78, 90, 106, 0.6);
  margin: 0px;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
}

.member-experience {
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(35, 31, 32);
  line-height: 24px;
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  font-size: 16px;
}

.member-divider {
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  display: flex;
  padding-block: 2px;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  margin-left: 40%;
  margin-right: 40%;
  margin-bottom: 5px;
}

.member-divider-separator {
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  direction: ltr;
  display: flex;
  margin: 0px 108px;
  border-block-start: 1.6px solid rgb(255, 189, 72);
  width: 60px;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.button-wrapper {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0);
  color: rgb(51, 51, 51);
  align-content: flex-start;
  flex-wrap: wrap;
  position: relative;
  padding: 10px 10px 40px 10px;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.elementor-button-text {
  box-sizing: border-box;
  background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 189, 72);
  color: rgb(35, 31, 32);
  text-decoration: none solid rgb(35, 31, 32);
  width: 20%;
  border-radius: 0px;
  display: inline-block;
  fill: rgb(35, 31, 32);
  font-size: 16px;
  line-height: 16px;
  padding: 15px 80px;
  text-align: center;
  transition: transform 0.3s;
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  transform: matrix(0.9, 0, 0, 0.9, 0, 0);
}