/*!
Theme Name: Autoskyn
Theme URI: http://underscores.me/
Author: Mosharaf Hossain
Author URI: https://www.mosharafmanu.com/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: autoskyn
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/* Blog Css Start */
.blog-card {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.blog-card__link {
	text-decoration: none;
	display: flex;
	flex-direction: column;
	height: 100%;
	flex: 1;
	border-bottom: 0.063rem solid var(--autoskyn-black);
}
.blog-card__content {
	margin-top: 1rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex: 1;
  position: relative;
}
.blog-card__image {
	height: 23rem;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.blog-card__image:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: transparent linear-gradient(70deg, #000000 0%, #6C0323 100%) 0% 0%;
  border-radius: 0.625rem;
  opacity: .7;
  background: transparent linear-gradient(140deg, rgba(0, 0, 0, 0.32) 0%, rgba(220, 1, 68, 0.32) 100%);
  opacity: 0;
  border-radius: 0.625rem;
  visibility: hidden;
  transition: 0.3s all ease;
}
.blog-card__link:hover .blog-card__image:after {
  visibility: visible;
  opacity: 1;
}
.blog-card__image img {
  border-radius: 0.625rem;
}
.blog-card__title {
  color: var(--autoskyn-black);
  font-weight: 700;
  line-height: 150%;
}
.blog-card__footer {
  position: relative;
  transition: 0.3s all ease;
  border-radius: 0.625rem;
}
.blog-card__title {
	color: var(--autoskyn-black);
	font-weight: 700;
	line-height: 150%;
	flex-grow: 1;
  padding-bottom: .5625rem;
}
.blog-card__footer{
  flex-shrink: 0;
  position: absolute;
  width: max-content;
  bottom: 0.063rem;
  transform: translateY(50%);
  right: 1.25rem; 
  transition: 0.5s all ease;
  background: var(--autoskyn-white);
  opacity: 0;
}
.blog-card__link:hover .blog-card__footer {
  opacity: 1;
  right: 0; 
}
.blog-card__read-more {
	display: inline-flex;
	align-items: center;
	gap: .875rem; /* 14px */
	color: var(--autoskyn-black);
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 171.43%;
	position: relative;
	transition: 0.3s all ease;
  padding-left: .3125rem;
	background: var(--autoskyn-white);
}
.blog-card__read-more .btn-icon {
	display: flex;
	align-items: center;
	justify-content: center;
}

.blog-card__read-more svg path {
  fill: var(--autoskyn-red);
}
@media only screen and (max-width: 1199px) {
  .blog-grid.card-grid {
   grid-template-columns: repeat(3, 1fr);
   row-gap: 2.188rem;
  }
  .blog-card__title {
	 font-size: 1.25rem;
  }
}
@media only screen and (max-width: 991px) {
   .blog-grid.card-grid {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 2.188rem;
   }
  .blog-card__title {
	 font-size: 1.125rem;
  }
  .blog-card__read-more-icon svg {
    width: 0.875rem;
  }
  .blog-grid.card-grid {
	  row-gap: 2.188rem;
  }
}
@media only screen and (max-width: 767px) {
  .blog-grid.card-grid {
    grid-template-columns: 1fr;
   }
}
/* Blog Css  End */

/* Contact Enquiry Css Start */
.contact-enquiry-section {
	color: var(--autoskyn-white);
}
.contact-info .section-header .section-title {
	letter-spacing: 0.006rem;
}
.contact-description {
	margin-top: 3.125rem;
}
.contact-info .mobile-number {
	color: var(--autoskyn-white);
	padding: 0.75rem 3.125rem;
	background-color: var(--autoskyn-red);
	font-size: 1.875rem;
	font-weight: 600;
	margin-top: 1.25rem;
	letter-spacing: 0.006rem;
	display: inline-block;
	transition: 0.3s all ease;
	padding-left: 0;
	position: relative;
 }
 .contact-info .mobile-number::before {
	content: "";
	position: absolute;
	width: 118.75rem;
  height: 100%;
	top: 0;
	left: -118.75rem;
	background-color: var(--autoskyn-red);
 }
 .field label {
	margin-top: 0.625rem;
	line-height: 177.78%;
	display: flex;
	column-gap: 1.25rem;
}
 .field input, textarea {
  border-bottom: 0.063rem solid var(--autoskyn-white);
  border-radius: 0;
  padding-top: 0;
  padding-left: 0;
}
 .field textarea {
	min-height: 0;
	height: 7.5rem;
}
 .field .wpcf7-list-item {
	margin-top: 2.5rem;
	margin-bottom: 0;
}
 .field label span {
  color: #E3E3E3;
  font-size: 0.938rem;
  line-height: 146.67%;
}
 .field input[type="checkbox"] {
	background: transparent;
	border: 0.063rem solid var(--autoskyn-white);
	width: 1.188rem;
	height: 1.188rem;
  margin-top: 0.25rem;
}
.field.submit-field {
	text-align: right;
	margin-top: 1.25rem;
}
.field.submit-field input[type="submit"] {
  border: 0;
  font-size: 1rem;
  font-weight: 700;
  line-height: 118.75%;
  padding: 1.25rem 2.813rem;
  border-radius: 2.25rem;
  transition: 0.3s all ease;
  color: white;
  letter-spacing: 0.044rem;
}
.field.submit-field input[type="submit"]:hover{
  color: var(--autoskyn-red);
  background-color: var(--autoskyn-white);
}
@media only screen and (max-width:1300px) {
  .contact-enquiry-grid {
	 column-gap: 9.375rem !important;
  }
}
@media only screen and (max-width:1199px) {
  .contact-enquiry-grid {
	  column-gap: 6.25rem !important;
  }
  .contact-info .mobile-number {
	font-size: 1.575rem;
  }
  .field textarea {
    height: 4.5rem;
  }
  .field label {
    margin-top: 0.75rem;
  }
}
@media only screen and (max-width:991px) {
  .contact-enquiry-grid {
	  column-gap: 6.25rem !important;
  }
  .field textarea {
    height: 4.5rem;
  }
  .field label {
    margin-top: 0.75rem;
  }
  .contact-enquiry-grid {
    grid-template-columns: 1fr !important;
    column-gap: 0;
    row-gap: 2.188rem;
  }
  .contact-info .mobile-number {
    font-size: 1.4rem;
  }
  .field.submit-field input[type="submit"] {
    padding: 1.125rem 2.188rem;
  }
   .field input[type="checkbox"] {
    width: 1.4rem;
    height: 1.4rem;
  } 
}
@media only screen and (max-width: 767px) {
  .contact-enquiry-section .contact-info {
	 margin-top: 0;
  }
  .contact-info .mobile-number {
	 font-size: 1rem;
	 padding: 0.45rem 2.125rem;
  }
  .contact-description {
	margin-top: 2.125rem;
  }
  .contact-enquiry-section .field label {
  	font-size: 1rem;
    margin-top: 0;
  }
  .contact-enquiry-section .field input, textarea {
  	padding-bottom: 0;
  }
  .contact-enquiry-section .field textarea {
	height: 4.5rem;
  }
  .contact-enquiry-section .field.submit-field {
  	text-align: left;
  }
 .contact-enquiry-section .field.submit-field input[type="submit"] {
    padding: 1rem 1.875rem;
  }
}
/* Contact Enquiry Css End */

/* Service Pricing Css Start */
.addon-services-title {
	margin-bottom: 3.125rem;
  font-weight: 600;
}
.addon-service {
  border-top: 0.063rem solid var(--autoskyn-gray3);
  padding: 2.188rem 0;
}
.addon-service:last-child {
	border-bottom: 0.063rem solid var(--autoskyn-gray3);
}
.addon-service-header .addon-service-name {
	font-weight: 600;
	letter-spacing: 0.006rem;
}
.addon-service-description-wrapper {
  display: flex;
  align-items: center;
  column-gap: 14.375rem;
}
.addon-service-description-wrapper .addon-service-price {
	font-weight: 600;
	display: flex;
	align-items: center;
	color: var(--autoskyn-black);
	letter-spacing: 0.006rem;
}
@media only screen and (max-width: 1200px) {
  .addon-service-description-wrapper {
    column-gap: 6.25rem;
  }
}
@media only screen and (max-width: 1199px) {
  .addon-services-title {
	  margin-bottom: 2.813rem;
  }
  .addon-service {
    padding: 1.875rem 0;
  }
}
@media only screen and (max-width: 991px) {
  .addon-service-description {
    font-size: 1rem;
  }
}
@media only screen and (max-width: 767px) {
  .addon-service-description-wrapper {
    column-gap: 0;
    flex-wrap: wrap;
    row-gap: 1.5rem;
  }
  .addon-services-title {
    margin-bottom: 2.188rem;
  }
  .addon-service {
    padding: 1.5rem 0;
  }
}
/* Service Pricing Css End */


/* Contact Enquiry Start */

.contact-enquiry-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 17.625rem;
}
/* Contact Enquiry End */


/* Seivice Pricing Css Start */

.service-pricing-section .section-description {
  max-width: 61.313rem;
  margin-left: auto;
  margin-right: auto;
}
.pricing-packages {
  color: rgb(230, 230, 230, 1);
  display: grid;
}
.columns-1 .pricing-package {
  border-radius: 0.625rem;
  max-width: 31.25rem;
  margin-left: auto;
  margin-right: auto;
}
.pricing-packages.columns-2 .pricing-package:first-child, 
.pricing-packages.columns-3 .pricing-package:first-child {
  border-radius: 0.625rem 0 0 0.625rem;
}
.pricing-packages.columns-2 .pricing-package:last-child, 
.pricing-packages.columns-3 .pricing-package:last-child {
  border-radius: 0 0.625rem 0.625rem 0;
}
.pricing-packages .pricing-package:first-child {
  border-left: 0.063rem solid rgb(155, 155, 155, 1);
}
.pricing-packages .pricing-package {
  padding: 4.688rem;
  border-right: 0.063rem solid rgb(155, 155, 155, 1);
  background-color: var(--autoskyn-black);
  border-top: 0.063rem solid var(--autoskyn-gray3); 
  border-bottom: 0.063rem solid var(--autoskyn-gray3); 
}
.package-header {
	display: flex;
	column-gap: 1.188rem;
	align-items: center;
}
.package-price {
	margin-top: 1.125rem;
	display: flex;
	align-items: center;
	column-gap: 0.75rem;
}
.package-name {
	margin-bottom: 0;
	letter-spacing: 0.006rem;
}
.price sup {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 2rem;
  position: relative;
  top: -0.625rem;
}
.additional-pricing p {
	margin-bottom: 0.125rem;
	line-height: 166.67%;
}
.package-price .price {
	font-size: 4rem;
	font-weight: 600;
	line-height: 150%;
	color: var(--autoskyn-white);
	font-family: var(--font-montserrat);
	display: flex;
	align-items: center;
	column-gap: 0.5rem;
  letter-spacing: 0.006rem;
}
.package-price .price-suffix {
	font-size: 1.125rem;
	line-height: 2rem;
	font-weight: 400;
	margin-top: 1.5rem;
}
.package-features {
  margin-top: 4rem !important;
  display: flex;
  flex-direction: column;
  row-gap: 0.625rem;
}
.package-button {
	letter-spacing: 0.044rem;
}
@media only screen and (max-width: 1300px) {
  .pricing-package {
    padding: 3.438rem;
  }
}
  @media only screen and (max-width: 1199px) {
  .pricing-packages .pricing-package {
    padding: 3.288rem;
  }
  .package-header .package-name {
	  font-size: 1.125rem;
   }
   .package-price .price {
	  font-size: 3rem;
  }
  .package-features {
    margin-top: 3rem !important;
  }
}
@media only screen and (max-width: 991px) {

  .pricing-packages.columns-3 {
    grid-template-columns: repeat(2, 1fr);
  }
  .pricing-packages.columns-3 .pricing-package:last-child {
    grid-column: span 2;
    border-radius: 0 0 0.625rem 0.625rem;
    border-top: 0;
  }
  .pricing-packages.columns-3 .pricing-package:first-child {
    border-radius: 0.625rem 0 0 0;
  }
  .pricing-packages.columns-3 .pricing-package:nth-child(2) {
    border-radius: 0 0.625rem 0 0;
  }
  .package-price .price-suffix {
    margin-top: 1rem;
  }
  ul.autoskyn-lists li {
	font-size: 1rem;
  }
  .additional-pricing p {
	font-size: 1rem;
 }
}
@media only screen and (max-width: 767px) {
  .pricing-packages.columns-2 .pricing-package:first-child, .pricing-packages.columns-3 .pricing-package:first-child {
	  border-radius: 0.625rem 0.625rem 0 0;
  } 
  .pricing-packages.columns-2 .pricing-package:last-child, .pricing-packages.columns-3 .pricing-package:last-child {
   border-radius: 0 0 0.625rem 0.625rem;
   border-top: 0;
   border-left: 0.063rem solid rgb(155, 155, 155, 1);
  }
  .pricing-packages {
	 grid-template-columns: 1fr;
  }
  .columns-2 .pricing-package:first-child, .columns-3 .pricing-package:first-child {
	 border-radius: 0.625rem 0.625rem 0 0;
 } 
  .package-features {
	  margin-top: 1.275rem !important;
  } 
  .pricing-package {
	padding: 2.188rem;
	border-right: 0;
	border-bottom: 0.063rem solid rgb(155, 155, 155, 1);
	padding-bottom: 2.813rem;
  } 
  .package-header .package-name {
    font-size: 1rem;
  }
  .pricing-packages.columns-3 {
    grid-template-columns: 1fr;
  }
  .pricing-packages.columns-3 .pricing-package:last-child {
    grid-column: inherit;
  }
  .pricing-packages.columns-3 .pricing-package:first-child {
    border-radius: 0.625rem 0.625rem 0 0;
  }
  .pricing-packages.columns-3 .pricing-package:nth-child(2) {
    border-radius: 0 0 0 0;
    border-top: 0;
    border-left: 0.063rem solid rgb(155, 155, 155, 1);
  }
  .package-button {
    margin-top: 2.188rem;
  }
}
/* Seivice Pricing Css End */

/* Customer Feedback Css Start */
.customer-feedback-section.dark-bg {
  background-color: var(--autoskyn-black);
  color: var(--autoskyn-white);
}
.customer-feedback-section.gray-bg {
  background-color: var(--autoskyn-gray4);
  color: var(--autoskyn-black);
}
.testimonial-rating {
  max-width: 5.438rem;
}
.dark-bg .testimonial-card {
	color: rgb(230, 230, 230, 1);
}
.testimonial-text p {
  font-size: 0.875rem;
  line-height: 192.86%;
  font-weight: 400;
}
.rating-icon {
  margin-bottom: 1.25rem;
}
.testimonial-author {
  margin-top: 1.375rem;
  display: flex;
  align-items: center;
  column-gap: 0.75rem;
}
.author-name p {
  font-size: 0.875rem;
  font-weight: 500;
}
.testimonial-card {
	border-left: 0.063rem solid var(--autoskyn-red);
  padding-right: 3.125rem;
	padding-left: 2.375rem;
}

/* Customer Feedback Css End */

/* Brands We Trust Css Start */
.brands-we-trust-section {
  background-color: var(--autoskyn-black);
  color: var(--autoskyn-white);
}
.section-header.brands-header h2 {
	margin-bottom: 0;
}
.brands-we-trust-section .section-description {
	color: rgb(230, 230, 230, 1);
}
.brands-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	margin-top: 3.125rem;
	border-top: 0.063rem solid rgb(155, 155, 155, 1);
	border-bottom: 0.063rem solid rgb(155, 155, 155, 1);
}
.brand-item:first-child {
	border-left: 0.063rem solid rgb(155, 155, 155, 1);
}
.brand-item {
	border-right: 0.063rem solid rgb(155, 155, 155, 1);
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.75rem;
}
@media only screen and (max-width: 1599px) {
  .brands-we-trust-section {
	padding-top: 1.875rem;
  }
}
@media only screen and (max-width:991px) {
  .brands-grid {
     margin-top: 2.188rem;
   }
}
@media only screen and (max-width:767px) {
  .brands-grid {
    grid-template-columns: repeat(3, 1fr);
    margin-top: 2.188rem;
    border: 0.063rem solid rgb(155, 155, 155, 1);
    border-right: 0;
    border-bottom: 0;
  }
  .brand-item:first-child {
    border-left: 0;
  }
 .brand-item {
    border-bottom: 0.063rem solid rgb(155, 155, 155, 1);
    padding: 1rem;
  }
  .brand-logo {
	  width: 5rem;
  }
  .testimonial-card {
    padding-right: 0;
    padding-left: 1.25rem;
  }
}
@media only screen and (max-width:767px) {
  .brands-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Brands We Trust Css End */



/* Footer Css Start */
.site-footer {
  background-color: var(--autoskyn-black);
}
.footer-top {
	display: flex;
	justify-content: space-between;
	column-gap: 13rem;
}
.sec-bt {
   border-top: 0.063rem solid rgb(155, 155, 155, 1);
}
.footer-branding {
  max-width: 11.25rem;
}
.footer-box:nth-child(2) {
  margin-left: 4.688rem;
}
.footer-box:last-of-type {
  margin-left: auto;
  margin-right: 3.125rem;
}
.footer-box .widget-title {
	color: var(--autoskyn-gray2);
	font-weight: 500;
	margin-bottom: 0.75rem;
}
.footer-box .menu {
  margin: 0;
  padding: 0;
  list-style: none;
}
.footer-box .menu li:not(:last-child) {
  margin-bottom: 0.375rem;
 }
.footer-box .menu li a {
  color: var(--autoskyn-white);
  text-decoration: none;
  transition: 0.3s all ease;
}
.footer-box .menu li a:hover {
  color: var(--autoskyn-red);
}
.footer-box a {
	color: var(--autoskyn-white);
	text-decoration: none;
	font-weight: 500;
}
.footer-box a:hover {
   color: var(--autoskyn-red);
}
.footer-box p {
  color: var(--autoskyn-white);
  line-height: 1.625rem;
}
.footer-location {
	margin-bottom: 0.5rem;
}
.footer-info a {
  display: block;
}
.footer-location, .footer-location-note {
  color: var(--autoskyn-white);
}
.footer-location address {
  font-style: normal;
}
.footer-location address br {
  display: none;
}
.footer-location-note br {
  display: none;
}
@media only screen and (max-width:1899px) {

  .footer-top{
    column-gap: 9.375rem;
  }
  .footer-box:nth-child(2){
    margin-left: 0;
  }
}
@media only screen and (max-width:1399px) {
   .footer-top{
    column-gap: 7.5rem;
  }
  .footer-box:last-of-type{
    margin-right: 0;
  }
  .footer-box .widget-title, 
  .footer-box a,
  .footer-box .footer-location,
  .footer-location-note {
	  font-size: 1.1rem;
  }
}
@media only screen and (max-width:1199px) {
  .footer-branding {
    max-width: 6.25rem;
}
   .footer-top{
    column-gap: 4rem;
  }
  .footer-box:last-of-type {
    margin-right: 0;
    max-width: 350px;
    margin-left: inherit;
  }
}
@media only screen and (max-width:991px) {
  .footer-top{
    display: grid;
    grid-template-columns: auto auto auto;
    column-gap: 0.625rem;
  }
  .footer-box:last-of-type {
    max-width: 300px;
  }
 .footer-branding {
    grid-column: span 3;
    max-width: 6.25rem;
    margin-bottom: 2.188rem;
  }
  .footer-info a:not(:last-child) {
  	margin-bottom: 0.75rem;
  }
}
@media only screen and (max-width: 767px) {
  .footer-top {
    grid-template-columns: repeat(1, 1fr);
    row-gap: 2.188rem;
  }
  .footer-info a {
    margin-bottom: 0.5rem;
  }
  .footer-branding {
    grid-column: span 1;
  }
  .footer-box:last-of-type {
    margin-left: 0;
  }
  .footer-box:last-of-type {
    max-width: 100%;
  }
}
/* Footer Bottom Css Start */
.footer-bottom {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	column-gap: 2.125rem;
	align-items: center;
}
.footer-bottom .footer-links .menu {
  display: flex;
  column-gap: 3.125rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.footer-bottom .footer-links .menu li a {
	color: var(--autoskyn-gray2);
	text-decoration: none;
	font-weight: 500;
}
.footer-bottom .footer-links .menu li a:hover {
 color: var(--autoskyn-red2);
}
.footer-middle-branding  {
  max-width: 20.5rem;
}
.footer-socials-links .social-media-list {
  display: flex;
  column-gap: 1.625rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.footer-socials-links .social-media-link {
	display: inline-block;
	max-width: 2.25rem;
}
.footer-socials-links .social-media-link svg {
  width: 100%;
  height: auto;
}
.footer-socials-links .social-media-link svg path {
	fill: var(--autoskyn-gray2);
}
.footer-socials-links .social-media-link:hover svg path {
	fill: var(--autoskyn-red2);
}
.footer-socials-links {
	margin-left: auto;
}
@media only screen and (max-width:1199px) {
  .footer-bottom {
    column-gap: 2.125rem;
  }
  .footer-bottom .footer-links .menu li a {
    font-size: 1rem;
  }
  .footer-bottom .footer-links .menu {
  	column-gap: 2.125rem;
  }
  .footer-middle-branding {
  	max-width: 16.875rem;
  }
 }
@media only screen and (max-width:991px) {
  .footer-bottom .footer-links .menu {
    column-gap: 1.125rem;
  }
  .footer-bottom .footer-links .menu li a {
    font-size: 1rem;
    line-height: normal;
  }
  .footer-socials-links .social-media-link svg {
  	width: 1.8rem;
  }
.footer-bottom {
	grid-template-columns: auto auto auto;
}
  .footer-middle-branding {
    max-width: 220px;
  }
  .footer-box .widget-title, .footer-box a, .footer-box .footer-location, .footer-location-note {
	 font-size: 1rem;
  }
}
@media only screen and (max-width:767px) {
  .footer-bottom {
	  row-gap: 1rem;
  }
  .footer-socials-links .social-media-list {
	  column-gap: 1rem;
  }
  .footer-bottom {
    grid-template-columns: 1fr;
    justify-items: center;
  }
 .footer-socials-links {
    margin-right: auto;
    order: 1;
  }
  .footer-links {
    order: 2;
  }
}
/* Footer Css End */


.site-header {
	background: var(--autoskyn-black);
	position: sticky;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 9999;
}
.site-header.transparent-header{
	position: absolute;
	top: 0;
	background: transparent;
}
.site-header.is-scrolled {
	position: fixed;
	background: var(--autoskyn-black);
	box-shadow: 0 .125rem .625rem rgba(0, 0, 0, 0.1);
}
.site-header .header-top{
	transition: opacity 0.3s ease, max-height 0.3s ease, padding 0.3s ease;
	opacity: 1;
	max-height: 100px;
	overflow: hidden;
}
.site-header.is-scrolled .header-top{
	opacity: 0;
	max-height: 0;
	padding-top: 0;
	padding-bottom: 0;
}

.admin-bar .site-header {
	top: 2rem;
}
@media only screen and (max-width:991px) {

	.admin-bar .site-header {
		top: 2.875rem;
	}

}
.header-top-inner {
	font-size: 1rem;
	display: flex;
	justify-content: end;
	column-gap: 6.25rem;
	padding-top: .9375rem;
	padding-bottom: .9375rem;
	border-bottom: .0625rem solid #9B9B9B;
}
.header-top-inner a {
	color: var(--autoskyn-white);
	text-decoration: none;
	letter-spacing: .14rem;
}
.header-top-inner a:hover {
	color: var(--autoskyn-red);
}
.header-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.site-branding {
	max-width: 18.9719rem;
	margin-top: 2.125rem;
	transition: margin-top 0.3s ease, max-width 0.3s ease;
}
.site-header.is-scrolled .site-branding {
	margin-top: 0;
	max-width: 12.5rem;
}
.main-menu > ul {
	margin: 0;
	padding: 0;
	display: flex;
	text-align: start;
	column-gap: 6.55rem;
}
.main-menu > ul > li {
    list-style: none;
	position: relative;
}
.main-menu > ul > li > a {
	padding-top: 2.375rem;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding-bottom: 1.75rem;
	color: var(--autoskyn-white);
	text-decoration: none;
	font-size: 1rem;
	font-weight: 500;
	cursor: pointer;
	letter-spacing: .14rem;
}
.main-menu > ul > li > a:hover {
	color: var(--autoskyn-red);
}

/* Desktop Submenu Indicator */
.main-menu .submenu-indicator {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: .9375rem;
	height: auto;
	transition: transform 0.3s ease;
}
.main-menu .submenu-indicator svg {
	width: 100%;
	height: auto;
	display: block;
}


/* DropDown Menu */
.main-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 22.125rem; /* 354px */
	background: transparent linear-gradient(134deg, #2B2B2B 0%, #4A4A4A 100%) 0% 0% no-repeat padding-box;
	padding: 1.5625rem 2.8125rem 1.875rem 2.8125rem; 	
	margin: 0;
	list-style: none;
	transition: all 0.3s ease;
	z-index: 1000;
	box-shadow: 0 .25rem .75rem rgba(0, 0, 0, 0.15);
	display: flex;
	flex-direction: column;

		opacity: 0;
	visibility: hidden;
	transform: translateY(-0.625rem);

}
.main-menu .sub-menu::after{
	position: absolute;
	content: '';
	top: -0.0625rem;
	left: 0;
	width: 7.1875rem;
	height: .0625rem;
	background: var(--autoskyn-red);
}

/* Show dropdown on hover */
.main-menu > ul > li:hover > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.main-menu .sub-menu > li {
	padding: 0;
	width: 100%;
}
.main-menu .sub-menu > li > a {
	text-decoration: none;
	color: var(--autoskyn-white);
	display: block;
	position: relative;
	transition: all 0.3s ease;
	font-size: 1rem; 
	line-height: 262.5%;
	font-weight: 500;
	letter-spacing: .14rem;
}
.main-menu .sub-menu > li > a::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: .625rem;
	height: .75rem;
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="18" viewBox="0 0 10 18" fill="none"><path d="M1.50743 18L0 16.4025L6.98514 9L0 1.5975L1.50743 0L10 9L1.50743 18Z" fill="%23DC0144"/></svg>');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	opacity: 0;
	transition: all 0.3s ease;
}
.main-menu .sub-menu > li > a:hover {
	color: var(--autoskyn-white);
	padding-left: 1.25rem;
}
.main-menu .sub-menu > li > a:hover::before {
	opacity: 1;
	left: 0;
}

/* Align dropdown to right for last 2 menu items to prevent overflow */
.main-menu > ul > li:nth-last-child(-n+2) .sub-menu {
	left: auto;
	right: 0;
}

/* Adjust red line position for right-aligned dropdowns */
.main-menu > ul > li:nth-last-child(-n+2) .sub-menu::after {
	left: auto;
	right: 0;
}

/* DropDown Menu End */

@media only screen and (max-width: 1399px){

	.main-menu > ul > li > a {
		padding-top: 2rem;
		padding-bottom: 1.75rem;
	}
}


@media only screen and (max-width: 1199px){

	.header-inner {
		column-gap: 1rem;
	}
	.site-branding {
		width: 12.5rem;
	}
	.main-menu > ul {
		column-gap: 4.938rem;
	}
	.main-menu > ul > li > a {
		padding-top: 1.25rem;
		padding-bottom: 1.25rem;
	}
	.site-branding {
		margin-top: 0;
	}
		
}

@media only screen and (max-width: 991px){

	.menu-trigger svg {
		color: var(--autoskyn-white);
	}
    .header-top-inner {
		column-gap: 2.25rem;
		padding-top: .5rem;
		padding-bottom: .5rem;
	}
    .site-branding {
		width: 12.5rem;
		padding: 1rem 0;
	}
	.main-navigation-menu .main-menu {
		display: none;
	}
    .mobile-menu > ul {
		column-gap: 2.5rem;
	}
    .mobile-menu > ul > li > a {
        padding-top: 1.75rem;
        padding-bottom: 1.75rem;
    }

	/* Hamburger Menu */
	.menu-trigger {
		width: 1.875rem;
		height: 1.375rem;
		cursor: pointer;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		position: relative;
		transition: all 0.3s ease;
	}
	.menu-trigger:hover {
		opacity: 0.8;
	}
	.menu-trigger span {
		width: 100%;
		height: 0.125rem;
		display: block;
		background: var(--autoskyn-white);
		border-radius: 0.125rem;
		transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
		transform-origin: center;
	}
	.menu-trigger span:nth-child(1) {
		width: 100%;
	}
	.menu-trigger span:nth-child(2) {
		width: 75%;
		margin-left: auto;
	}
	.menu-trigger span:nth-child(3) {
		width: 100%;
	}
	.menu-trigger:hover span:nth-child(2) {
		width: 100%;
	}

	.hamburger-menu-inner {
		width: 28.125rem;
		max-width: 90vw;
		background: var(--autoskyn-black);
		position: fixed;
		top: 0;
		right: 0;
		padding-top: 6rem;
		padding-bottom: 2rem;
		height: 100vh;
		overflow-y: auto;
		overflow-x: hidden;
		transform: translateX(100%);
		transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
		box-shadow: -0.3125rem 0 1.25rem rgba(0, 0, 0, 0);
		will-change: transform;
	}
    .hamburger-menu {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 50000;
		background-color: transparent;
		backdrop-filter: blur(0rem);
		visibility: hidden;
		pointer-events: none;
		transition: visibility 0s linear 0.35s,
		            background-color 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94),
		            backdrop-filter 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	}
    .hamburger-menu.isOpen {
        visibility: visible;
		background-color: rgba(0, 0, 0, 0.7);
		backdrop-filter: blur(.125rem);
		pointer-events: auto;
		transition: visibility 0s linear 0s,
		            background-color 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94),
		            backdrop-filter 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
	.admin-bar .hamburger-menu.isOpen{
		top: 2.875rem;
	}
    .hamburger-menu.isOpen .hamburger-menu-inner {
        transform: translateX(0);
        box-shadow: -0.3125rem 0 1.25rem rgba(0, 0, 0, 0.3);
		transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.35s ease;
    }
	/* Mobile Menu Container */
    .mobile-menu {
		padding: 0 2rem;
		margin-top: 2rem;
	}
    .mobile-menu ul {
		display: flex;
		flex-direction: column;
		margin: 0;
		padding: 0;
		list-style: none;
		gap: 0.5rem;
	}
	.mobile-menu > ul > li {
		padding: 0;
		margin: 0;
		position: relative;
	}
	.mobile-menu ul li a {
		color: var(--autoskyn-white);
		padding: 1rem 1.5rem;
		padding-right: 0;
		border: none;
		display: block;
		text-decoration: none;
		font-size: 1.125rem;
		font-weight: 500;
		transition: all 0.3s ease;
		position: relative;
		border-radius: 0.25rem;
	}
	.mobile-menu ul li a:hover {
		color: var(--autoskyn-red);
	}

	/* Mobile Submenu Toggle Button */
	.mobile-menu .submenu-toggle {
		background: transparent;
		border: none;
		padding: 0.5rem;
		cursor: pointer;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2rem;
		height: 2rem;
		transition: all 0.3s ease;
		border-radius: 0.25rem;
		position: absolute;
		top: 1.0625rem;
		left: 0;
	}
	.mobile-menu .submenu-toggle:hover {
		background: rgba(171, 29, 55, 0.2);
	}
	.mobile-menu .submenu-toggle svg {
		width: 0.875rem;
		height: auto;
		display: block;
		transition: transform 0.3s ease;
	}

	/* Mobile Submenu Styles */
	.mobile-menu .sub-menu {
		display: none;
		padding: 0.5rem 0 0.5rem 0;
		margin: 0.5rem 0 0 0;
		list-style: none;
		background: rgba(0, 0, 0, 0.4);
		border-radius: 0.25rem;
		gap: 0.25rem;
	}
	.mobile-menu .sub-menu li {
		padding: 0 !important;
		margin: 0 !important;
		position: relative;
	}
	.mobile-menu .sub-menu li a {
		padding: 0.875rem 1.5rem 0.875rem 2.5rem !important;
		font-size: 1rem;
		color: rgba(255, 255, 255, 0.9);
		border-radius: 0.25rem;
	}
	.mobile-menu .sub-menu li a:hover {
		color: var(--autoskyn-red);
	}
    
	/* Close Icon */
	.close-icon {
		position: absolute;
		top: 2rem;
		right: 2rem;
		cursor: pointer;
		width: 3rem;
		height: 3rem;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.3s ease;
		border-radius: 0.375rem;
		z-index: 10;
	}
	.close-icon:hover {
		background: rgba(171, 29, 55, 0.15);
		transform: rotate(90deg);
	}
	.close-icon svg {
		width: 1.25rem;
		height: 1.25rem;
	}
	.close-icon svg path {
		fill: var(--autoskyn-white);
		transition: fill 0.3s ease;
	}
	.close-icon:hover svg path {
		fill: var(--autoskyn-red);
	}

	/* Mobile Menu Container */
    .mobile-menu {
        padding-top: 0;
    }

}

@media only screen and (max-width: 767px){
	.header-top-inner {
		flex-direction: column;
	}
	.header-top-inner {
		flex-direction: column;
		text-align: right;
	}
	.header-email-link {
		order: 2;
	}
    .site-branding {
        width: 12.5rem;
    }
	.hamburger-menu-inner {
		 max-width: 85%;
	}
}


/* Hero Section Start */

.hero-media-wrapper, 
.inner-hero-section {
	position: relative;
	grid-column: 1;
	grid-row: 1;
}
.hero-inner::before, 
.inner-hero-section::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #000000D0 0% 0% no-repeat padding-box;
	mix-blend-mode: multiply;
	border: .0625rem solid #707070;
	opacity: 0.8;
	z-index: 1;
}
.inner-hero-section{
	display: grid;
	grid-template-columns: 100%;
	overflow: hidden;
	position: relative;
	height: 37.5rem;
}
.inner-hero-section > div {
	height: 37.5rem;
}
.hero-inner {
	display: grid;
	grid-template-columns: 100%;
	grid-template-rows: 100%;
	height: 100vh;
	overflow: hidden;
	position: relative;
}
.hero-content {
	grid-column: 1;
	grid-row: 1;
	align-self: center;
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	height: 100%;
}
.hero-content-inner {
	color: var(--autoskyn-white);
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-top: var(--header-offset);
}
.hero-content-inner h1 {
	font-size: 4rem; /* 64px */
	line-height: 125%; 
}
p.hero-eyebrow {
	margin-bottom: 1.25rem;
	letter-spacing: .065rem;
	font-size: 1.625rem;
}
.hero-features {
	display: flex;
	column-gap: 10.625rem;
	color: var(--autoskyn-white);
	margin-top: auto;
	padding-bottom: 6.5rem;
}
.hero-feature-item {
	display: flex;
	column-gap: 1.0625rem;
}
.hero-feature-icon {
	width: 2.0294rem;
	height: 2.6738rem;
	display: flex;
	flex-shrink: 0;
}
.hero-feature-content h3 {
	font-size: 1rem;
	letter-spacing: .14rem;
	margin-bottom: .3125rem;
}
.hero-feature-content p {
	font-size: 1rem;
	font-weight: 400;
	font-style: italic;
	letter-spacing: .14rem;
}
.hero-buttons {
	margin-top: 1.25rem;
}


@media only screen and (max-width: 1699px){

	.hero-features {
		padding-bottom: 3.5rem;
	}
}
@media only screen and (max-width:1599px) {

	.hero-features {
		margin-top: 3.125rem; /* 50px */
	}

}
@media only screen and (max-width:1199px) {

	.hero-content-inner h1 {
		font-size: 3.375rem; /* 54px */
	}
	.hero-inner {
		height: auto;
	}
	.inner-hero-section{
		height: 31.25rem;
	}
	.inner-hero-section > div {
		height: 31.25rem;
	}
	.hero-content-inner {
		display: block;
		padding-top: 3.125rem;
	}
}
@media only screen and (max-width: 991px){
	.hero-content-inner h1 {
		font-size: 2.75rem; /* 44px */
	}
	p.hero-eyebrow {
		font-size: 1.375rem; /* 22px */
	}

	.site-branding {
		margin-top: 0;
	}
	.hero-features {
		column-gap: 2.625rem;
	}
	.hero-feature-icon {
		width: 1.5rem;
		height: 1.8rem;
	}
}

@media only screen and (max-width: 767px){

	.hero-content-inner h1 {
		font-size: 2rem; /* 32px */
	}
	.hero-content-inner {
		padding-top: 1.25rem;
		min-height: 496px;
		display: -webkit-flex;
		display: flex;
		justify-content: flex-end;
		margin-top: 0 !important;
	}
	p.hero-eyebrow {
		margin-bottom: .9375rem; /* 15px */
		letter-spacing: .065rem;
		font-size: 1.125rem; /* 18px */
	}
	.hero-features {
		display: none;
	}
	.hero-feature-icon {
		width: 1.5rem;
		height: 1.6738rem;
		display: flex;
		flex-shrink: 0;
		margin-top: 0.4rem;
	}
	.site-branding {
		width: 10rem;
	}
	.hero-content {
		padding-bottom: 50px;
	}
	.hero-feature-content h3 {
		margin-bottom: 0;
	}
	.inner-hero-inner{
		padding-top: calc(20px + var(--header-offset));
	}
	.inner-hero-media,
	.inner-hero-section > div{
		height: 100%;
		min-height: 31.25rem;
	}
	.inner-hero-section {
		height: auto;
		min-height: 31.25rem;
	}
}


/* Car Detailing Services */

.section-header.card-grid-header {
	max-width: 67.375rem;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding-bottom: 2.8125rem;
}
.card-grid {
	display: grid;
	gap: 1.875rem;
}
.card-content {
	grid-column: 1;
	grid-row: 1;
	align-self: end;
	padding-left: 2.9375rem;
	padding-right: 2.9375rem;
	color: var(--autoskyn-white);
	padding-bottom: .75rem;
	position: relative;
	z-index: 2;
	transform: translateY(73%);
	transition: transform 0.5s ease;
	pointer-events: none;
	display: grid;
	grid-template-rows: auto auto auto;
	align-content: end;
}
.content-card:hover .card-content {
	transform: translateY(-0.9375rem);
	pointer-events: auto;
}
.content-card:hover .card-content .card-description,
.content-card:hover .card-content .card-button{
  opacity: 1;
}
.content-card {
	position: relative;
	overflow: hidden;
}
.content-card::befor {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	bottom: 0;
	left: 0;
	background: transparent linear-gradient(180deg, #00000000 0%, #00000000 69%, #000000 100%) 0% 0% no-repeat padding-box;
	z-index: 0;
	border-radius: 1rem;
	transition: 0.3s ease;
}
.content-card::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient( 150deg, #00000077 0%, #DC0144 100% );
	opacity: 0;
	transition: opacity 0.3s ease;
	z-index: 1;
	pointer-events: none;
	border-radius: 1rem;
	overflow: hidden;
}
.content-card:hover::after {
	opacity: 1;
	border-radius: 1rem;
	overflow: hidden;
}
.card-image {
	height: 34.3125rem;
	border-radius: 1rem;
	overflow: hidden;
	grid-column: 1;
	grid-row: 1;
}
.content-card .card-link {
	display: grid;
	grid-template-columns: 100%;
	text-decoration: none;
}
.card-title-wrapper h3 {
	margin-bottom: .7rem;
}
.card-description {
	font-size: 1rem;
	margin-bottom: 1.8rem;
	opacity: 0;
	transform: translateY(1.25rem);
	transition: 0.3s ease;
	line-height: 150%;
}
.card-button {
	font-size: .875rem;
	margin-bottom: 2.5rem;
	opacity: 0;
	transform: translateY(1.25rem);
	transition: 0.3s ease;
}
.card-title-wrapper {
	height: 2rem;
	display: flex;
	align-items: end;
}
.card-button span.btn-icon svg {
	width: 1.2138rem;
	height: 1.2675rem;
	margin-left: .625rem;
}

@media only screen and (max-width:1399px){

	.card-content {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}
	.card-image {
		height: 25rem; /* 400px */
	}


}

@media only screen and (max-width:1199px){
	.card-content {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}
	.card-grid-section .columns-4 {
		grid-template-columns: repeat(3, 1fr);
	}
	.card-grid-section .columns-4 .content-card:last-of-type {
		grid-column: span 3;
	}
}

@media only screen and (max-width: 991px){
	.section-header.card-grid-header .section-description > p br {
		display: none;
	}
	.card-grid-section .columns-4 {
		grid-template-columns: repeat(2, 1fr);
	}
	.card-grid-section .columns-4 .content-card:last-of-type {
		grid-column: span 1;
	}
}

@media only screen and (max-width: 767px){
	.section-header.card-grid-header .section-description > p br {
		display: none;
	}
	.card-grid-section .columns-4 {
		grid-template-columns: repeat(1, 1fr);
	}
	.card-grid-section .columns-4 .content-card:last-of-type {
		grid-column: span 1;
	}
	.card-image {
		height: 25rem; /* 400px */
		border-radius: 1rem;
		overflow: hidden;
		grid-column: 1;
		grid-row: 1;
	}
}


/* Car Detailing Services Single */

.media-content-fifty-section.bg-gray {
	background: var(--autoskyn-gray);
}
.bg-black {
	background: transparent linear-gradient(70deg, #000000 0%, #6C0323 100%) 0% 0% no-repeat padding-box;
	color: var(--autoskyn-white);
}

.mcf-content {
	grid-area: content;
}
.has-background .mcf-content{
	padding-top: 3.4375rem;
}
.video-container.mcf-video-container iframe, 
.video-container.mcf-video-container image, 
.video-container.mcf-video-container video {
	min-height: 34.1875rem;
	display: block;
}
.mcf-media {
	grid-area: media;
}
.mcf-grid {
	display: grid;
	column-gap: 7.8125rem;
}
.media-left .mcf-grid {
	grid-template-areas: "media content";
	grid-template-columns: 1fr 43.9375rem;
}
.media-right .mcf-grid {
	grid-template-areas: "content media";
	grid-template-columns: 43.9375rem 1fr;
}
.hero-content-inner .btns,
.mcf-content-inner .btns {
	row-gap: 1.5625rem;
	column-gap: 1.5625rem;
}
.mcf-buttons {
	margin-top: 4.375rem;
}
.mcf-image-wrapper, 
.mcf-video-wrapper {
	border-radius: .625rem;
	overflow: hidden;
	position: relative;
}


@media only screen and (max-width:1799px) {

    .media-right .mcf-grid{
        grid-template-columns: 1fr 1fr;
    }
    .media-left .mcf-grid{
        grid-template-columns: 1fr 1fr;

    }

}
@media only screen and (max-width:1599px) {

    .mcf-grid{
        column-gap: 3.125rem;
    }

}
@media only screen and (max-width:1399px) {

	.has-background .mcf-content{
		padding-top: 1rem;
	}
}

@media only screen and (max-width:1199px) {

    .mcf-grid{
        column-gap: 1.875rem;
    }
	.has-background .mcf-content{
		padding-top: 0;
	}
	.mcf-buttons {
		margin-top: 2.438rem;
	}

	.video-container.mcf-video-container iframe, 
	.video-container.mcf-video-container image, 
	.video-container.mcf-video-container video {
		min-height: 21.188rem;
		display: block;
	}
}

@media only screen and (max-width:991px) {

	.video-container.mcf-video-container iframe, 
	.video-container.mcf-video-container image, 
	.video-container.mcf-video-container video {
		min-height: 21.875rem;
	}
    .mcf-grid{
        row-gap: 3.125rem;
    }
	.media-right .mcf-grid {
		grid-template-areas: "media" 
		"content";
		grid-template-columns: 1fr;
		row-gap: 1.5625rem;
	}
    .media-left .mcf-grid{
		grid-template-areas: 
        "media"
        "content";
        grid-template-columns: 1fr;
		row-gap: 1.5625rem;  
    }
}
@media only screen and (max-width: 767px) {

	.mcf-buttons {
		margin-top: 2.438rem;
	}
	.mcf-grid {
		row-gap: 1.125rem;
	}
	.video-container.mcf-video-container iframe, 
	.video-container.mcf-video-container image, 
	.video-container.mcf-video-container video {
		min-height: 14.875rem;
	}
}


/* About Page Style */

.inner-hero-media {
	grid-column: 1;
	grid-row: 1;
}
.inner-hero-header h1 {
	letter-spacing: .1688rem;
}
.inner-hero-description p {
	font-size: 1.625rem;
	letter-spacing: .065rem;
}
.mcf-content-inner .mcf-title {
	margin-bottom: 1.25rem;
}
.rte-content {
	margin-top: 1.25rem;
}
.inner-hero-content {
	grid-column: 1;
	grid-row: 1;
	color: var(--autoskyn-white);
	position: relative;
	z-index: 4;
	padding-bottom: 3.125rem;
	display: flex;
}
.inner-hero-inner{
	align-self: flex-end;
}
.rich-text-editor-inner {
	width: 61.3125rem;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
}
.rte-section-buttons {
	margin-top: 2rem;
}
.rte-columns {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
}
.rte-buttons {
  margin-top: 3.125rem;
}

@media only screen and (max-width:1199px) {

	.inner-hero-header h1 {
		font-size: 3rem;
	}


}

@media only screen and (max-width:991px) {

	.inner-hero-section {
		grid-template-rows: 100%;
	}
	.inner-hero-header h1 {
		font-size: 2.5rem;
	}
	.inner-hero-content {
		padding-bottom: 3.125rem;
	}
	.rich-text-editor-inner {
		width: 100%;
	}
	.mcf-content-inner .mcf-title {
		margin-bottom: 1rem;
	}
}

@media only screen and (max-width: 767px) {
	.rte-columns {
		grid-template-columns: 1fr;
	}
	.inner-hero-description p {
		font-size: 1.25rem; 
	}
	.inner-hero-content {
		padding-bottom: 30px;
	}
}

/* USP Section Style */
.section-header.usp-header {
	padding-top: 4rem;
}
.usp-row-section .section-description {
	max-width: 61.3125rem;
	margin-bottom: 4.375rem;
}
.usp-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}
.usp-item {
	padding-left: 4.375rem;
	padding-right: 4.875rem;
	padding-top: 4.875rem;
	padding-bottom: 5.625rem;
	border-top: .0625rem solid var(--autoskyn-gray3);
	border-bottom: .0625rem solid var(--autoskyn-gray3);
	border-right: .0625rem solid var(--autoskyn-gray3);
	background: var(--autoskyn-black);
}
.usp-item:first-child {
	border-left: .0625rem solid var(--autoskyn-gray3);
}
.usp-icon {
	width: 2.0294rem;
	height: 2.6738rem;
	display: flex;
	margin-bottom: 2.8125rem;
}
.usp-item h3 {
	font-size: 1.5rem;
}
.usp-description {
	padding-bottom: 3.75rem;
	font-size: 1rem;
}

@media only screen and (max-width:1399px) {

	.usp-item {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
		padding-top: 1.5rem;
		padding-bottom: 1.5rem;
	}
	.usp-description {
		padding-bottom: 0;
	}

}
@media only screen and (max-width:991px) {

	.usp-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.usp-item:last-of-type {
		grid-column: span 2;
		border-top: none;
		border-left: .0625rem solid var(--autoskyn-gray3);
	}
	.usp-item {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
		padding-top: 1.5rem;
		padding-bottom: 1.5rem;
	}
	.usp-description {
		padding-bottom: 0;
	}
	.usp-icon {
		margin-bottom: 2rem;
	}
}
@media only screen and (max-width:767px) {


	.section-header.usp-header {
		padding-top: 2rem;
	}
	.usp-grid {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
	}
	.usp-item {
		border-top: none;
		border-left: .0625rem solid var(--autoskyn-gray3);
		border-right: .0625rem solid var(--autoskyn-gray3);
		border-bottom: .0625rem solid var(--autoskyn-gray3);
	}
	.usp-item:first-child {
		border-top: .0625rem solid var(--autoskyn-gray3);
	}
	.usp-item:last-of-type {
		grid-column: span 1;
	}
	.usp-icon {
		width: 1.5rem;
		height: 1.6738rem;
		display: flex;
		margin-bottom: 2rem;
	}
	.usp-item h3 {
		font-size: 1.25rem;
	}
	.usp-row-section .section-description {
		max-width: 61.3125rem;
		margin-bottom: 2.375rem;
	}
	.usp-description {
		padding-bottom: 1.75rem;
	}
}


/* FAQ page */

.faq-question {
	font-size: 1.5rem;
	position: relative;
	padding: 1.4375rem 0; /* 23px top and bottom */
	padding-left: 1.875rem;
	margin-bottom: 0;
	cursor: pointer;
	font-weight: 600;
}
.faq-answer {
	padding-bottom: 1.4375rem;
	margin-top: -.625rem;
}
.faq-list {
	max-width: 76.625rem;
	border-top: .0625rem solid var(--autoskyn-gray3);
	margin-top: 3.75rem;
}
.faq-list .faq-item:nth-child(even) {
	background: #EFEFEF;
}
.faq-item {
	padding-left: 1.875rem;
}
.faq-answer {
	display: none;
}
.faq-question::before,
.faq-question::after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  font-size: 1.5rem;
  color: var(--autoskyn-red);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.faq-question::before {
  content: "+";
  opacity: 1;
}

.faq-question::after {
  content: "-";
  opacity: 0;
}

.faq-item.active .faq-question::before {
  opacity: 0;
}

.faq-item.active .faq-question::after {
  opacity: 1;	
}

@media only screen and (max-width: 991px){
	.faq-question {
		font-size: 1.375rem;
	}
}

@media only screen and (max-width: 767px){
	.faq-question {
		font-size: 1.25rem;
	}
	.faq-item {
		padding-left: .9375rem;
		padding-top: .5rem;
		padding-bottom: .5rem;
		padding-right: .9375rem;
	}
	.faq-answer {
		padding-bottom: .9375rem;
	}
	.faq-question {
		font-size: 1.25rem;
	}
}

/* Contact Form Design */
.contact-form-grid {
	display: grid;
	grid-template-columns: 44.6875rem 1fr;
	column-gap: 6.5rem;
}
.section-header.contact-details-header .section-title {
	font-size: 2.125rem;
	margin-bottom: 1.5625rem;
}
.contact-details-description {
	max-width: 36.375rem;
}
.contact-details .contact-info-title, 
.contact-details .contact-hours-title, 
.contact-details .contact-location-title {
	font-size: 1.625rem;
	margin-bottom: 1.25rem;
	font-weight: 600;
}
.contact-details .contact-info-items a {
	display: block;
	font-size: 1.25rem;
	color: var(--autoskyn-black);
	text-decoration: none;
	font-weight: 500;
}
.contact-details .contact-info-items {
	display: flex;
	flex-direction: column;
	gap: .3125rem;
}
.contact-wrapper {
	display: grid;
	grid-template-columns: repeat(2,1fr);
	margin-top: 4.0625rem;
	column-gap: 5.8125rem;
}
.contact-location address {
	line-height: 1.875rem;
}
.contact-hours-list {
	line-height: 2.25rem;
}
.contact-location-note {
	margin-top: 1.5625rem;
}
.contact-location address,
.contact-location .contact-location-note,
.contact-hours .contact-hours-list {
	font-style: normal;
	font-weight: 500;
	font-size: 1.25rem;
}
.contact-location address br,
.contact-location .contact-location-note br,
.contact-hours .contact-hours-list br {
	margin-bottom: .3125rem;
}
.contact-location address br:nth-of-type(2n),
.contact-location .contact-location-note br:nth-of-type(2n),
.contact-hours .contact-hours-list br:nth-of-type(2n) {
	display: none;
}

.contact-form-grid .contact-form-wrapper {
	background: var(--autoskyn-gray4);
	padding-left: 4.375rem;
	padding-top: 2.6875rem;
	padding-right: 4.375rem;
	padding-bottom: 1rem;
	border-radius: .625rem;
}
.contact-form-grid .contact-form-container form label{
	color: var(--autoskyn-black);
}
.contact-form-grid .contact-form-container form input, 
.contact-form-grid .contact-form-container form textarea {
	color: #6A6A6A;
	border-radius: 0;
	border-bottom: .0625rem solid #6C6C6C;
	font-size: .9375rem;
	padding-bottom: .3125rem;
	margin-top: .375rem;
}
.contact-form-container form input::placeholder,
.contact-form-container form textarea::placeholder {
	color: #6A6A6A;
}
.contact-form-container form label {
	font-size: .9375rem;
	margin-bottom: -0.3125rem;
	margin-top: .3125rem;
}
.field textarea {
	min-height: 0;
	height: 6.5rem;
}
.field.acceptance-field.field-full {
	margin-top: -1.875rem;
}
.acceptance-field label input[type="checkbox"] {
	border: .0625rem solid #707070;
	width: 1.1875rem;
	height: 1.1875rem;
	margin-right: -0.25rem;
}
.acceptance-field label span {
	color: #6A6A6A;
	font-size: 0.938rem;
	line-height: 146.67%;
}

@media only screen and (max-width: 1399px){
	.contact-form-grid {
		display: grid;
		grid-template-columns: 36.5rem 1fr;
		column-gap: 3.125rem;
	}
	.contact-wrapper {
		display: grid;
		grid-template-columns: repeat(2,1fr);
		margin-top: 4.0625rem;
		column-gap: 3.125rem;
	}
	.contact-form-grid .contact-form-wrapper {
		padding-left: 2.5rem;
		padding-top: 3.5rem;
		padding-right: 2.5rem;
	}

}

@media only screen and (max-width: 1199px){
	.contact-form-grid {
		grid-template-columns: 34.375rem 1fr;
		column-gap: 2.5rem;
	}
	.contact-wrapper {
		margin-top: 4.0625rem;
		column-gap: .625rem;
	}
	.contact-form-grid .contact-form-wrapper {
		padding-left: 1.875rem;
		padding-top: 2rem;
		padding-right: 1.875rem;
	}

}

@media only screen and (max-width: 991px){
	.contact-form-grid .contact-form-wrapper {
		margin-top: 3.75rem;
		padding-top: 3rem;
		padding-left: 2.5rem;
		padding-right: 2.5rem;
	}
	.contact-form-grid {
		grid-template-columns: 1fr;
		column-gap: 3.125rem;
	}
}
@media only screen and (max-width: 767px){
	.contact-wrapper {
		display: grid;
		grid-template-columns: 1fr;
		margin-top: 2.5rem;
		row-gap: 2.5rem;
	}
	.contact-form-grid .contact-form-wrapper {
		margin-top: 2.75rem;
		padding-top: 3rem;
		padding-left: 1.5rem;
		padding-right: 1.5rem;
		padding-bottom: 1.5rem;
	}
	.contact-details .contact-info-items a {
		font-size: 1rem;
	}
	.contact-location address, 
	.contact-location .contact-location-note, 
	.contact-hours .contact-hours-list {
		font-size: 1rem;
	}
}


/* Google Map */
.google-map-container iframe {
	display: block;
	width: 100%;
}
.google-map-container.media {
	border-radius: 1rem;
	overflow: hidden;
	max-height: 33.8125rem;
	height: 33.8125rem;
}

@media only screen and (max-width: 991px){
.google-map-container.media {
	height: 21.875rem;
}
}


/* Full Width Media Section  */

.full-width-media-container {
  height: 41.25rem;
}
.full-width-media-container img,
.full-width-media-container video,
.full-width-media-container iframe {
  border-radius: 3.125rem;
}
@media only screen and (max-width:1599px) {

	.full-width-media-container {
	height: 34.375rem;
	}
}
@media only screen and (max-width:991px) {
	.full-width-media-container {
		height: 28.125rem;
	}
}

@media only screen and (max-width:767px) {
	.full-width-media-container {
		height: 15.625rem; 
	}
}
@media only screen and (max-width:767px) {
.full-width-media-container img,
.full-width-media-container video,
.full-width-media-container iframe {
  border-radius: 1.5625rem;
}
}

/* Full Width Media Section  */


