/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Template: twentytwentyone
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Tags: one-column,accessibility-ready,custom-colors,custom-menu,custom-logo,editor-style,featured-images,footer-widgets,block-patterns,rtl-language-support,sticky-post,threaded-comments,translation-ready,blog,portfolio
Version: 2.2.1720026583
Updated: 2024-07-03 17:09:43

*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');

* {
    box-sizing: border-box;
}

/* Variables */
:root {
    --primary-color: #f6821f;
    --secondary-color: #008d97;
    --white: #fff;
    --black: #000;
}

html {
  scroll-behavior: smooth;
}

html, body {
    margin: 0;
    padding: 0;
	background-color: var(--white);
}

.container {
    max-width: 1420px;
    width: 100%;
    margin: 0 auto;
     padding: 0 80px;
}

ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

a,
.wpcf7-submit {
    text-decoration: none;
	transition: transform .2s;
}

.why-choose-list-item,
a h4 {
	transition: transform .2s;
}

.why-choose-list-item:hover,
a:hover h4,
a:hover,
.wpcf7-submit:hover {
	transform: scale(1.05);
}

.menu-wrapper ul li a {
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    color: var(--black);
}

.link {
    font-family: "Work Sans", sans-serif;
    font-size: 18px;
    color: var(--primary-color);
    font-weight: bold;
}

p {
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    line-height: 20px;
    color: var(--black);
    margin: 0;
}

.primary-btn {
    background-color: var(--primary-color);
    padding: 15px 60px;
    display: inline-block;
    border-radius: 10px;
    font-size: 16px;
    font-family: "Work Sans", sans-serif;
    color: var(--white);
    font-weight: bold;
    border: 2px solid var(--primary-color);
}

.primary-btn:hover {
    background-color: transparent;
    color: var(--primary-color);
}

.wpcf7-submit {
	width: 100%;
	background-color: var(--primary-color) !important;
	padding: 15px 60px !important;
	display: inline-block;
	border-radius: 10px !important;
	font-size: 16px !important;
	font-family: "Work Sans", sans-serif !important;
	color: var(--white) !important;
	font-weight: bold !important;
	border: 2px solid var(--primary-color) !important;
}

.wpcf7-submit:hover {
	background-color: transparent !important;
    color: var(--primary-color) !important;
}

h1 {
    font-family: "Poppins", sans-serif;
    font-size: 60px;
    line-height: 70px;
    color: var(--black);
    font-weight: bold;
    margin: 0;
}

h2 {
    font-family: "Poppins", sans-serif;
    font-size: 40px;
    line-height: 45px;
    color: var(--black);
    font-weight: bold;
    margin: 0;
}

h3 {
    font-family: "Poppins", sans-serif;
    font-size: 35px;
    line-height: 40px;
    color: var(--black);
    font-weight: bold;
    margin: 0;
}

#contact-link i {
	font-size: 16px;
}

#site-header.sticky .header-wrapper {
	padding: 25px 0;
}

#site-header.sticky {
	background-color: var(--white);
	box-shadow: 0px 0px 10px 0px #000;
}

.white-slant-divider.right {
    right: 0;
    background-color: var(--white);
    height: 100px;
    clip-path: polygon(0% 100%, 0% 100%, 26% -20%, 1000% 100%);
}

.white-slant-divider.left {
    left: 0;
    background-color: var(--white);
    height: 100px;
    clip-path: polygon(0% 100%, 0% 100%, 0% -274%, 100% 100%);
}

.white-slant-divider.reversed {
    clip-path: polygon(0% 100%, 26% 100%, 0% -20%, 1000% 100%);
}

.offer-item-wrapper {
    width: 32.2%;
    position: relative;
    cursor: pointer;
}

.offer-item-wrapper.featured {
    width: 66%;
}

.offer-item-content-wrapper {
    display: none;
    position: absolute;
    bottom: 0;
    padding: 60px 40px;
    background-color: var(--secondary-color);
    clip-path: polygon(-180% 100%, 100% -25%, 100% 100%, 0% 100%);
}

.offer-item-wrapper.featured .offer-item-heading-wrapper {
    width: 49%;
    right: 0;
}

.offer-item-heading-wrapper {
    background-color: var(--primary-color);
    position: absolute;
    width: 100%;
    bottom: 0;
}

.offer-item-heading-wrapper h4 {
    color: var(--white);
    font-size: 18px;
    font-family: 'Work Sans', sans-serif;
    font-weight: bold;
    margin: 0;
    padding: 60px 40px;
}

.offer-item-image-wrapper {
    min-height: 400px;
}

.offer-item-wrapper:hover .offer-item-heading-wrapper {
    display: none;
}

.offer-item-wrapper:hover .offer-item-content-wrapper {
    display: block;
}

.offer-item-wrapper.featured .offer-item-content-wrapper {
    width: 49%;
    right: 0;
}

.offer-item-content-wrapper h4 {
    font-family: 'Work Sans', sans-serif;
    color: var(--white);
    font-size: 24px;
    font-weight: bold;
}

.offer-item-content-wrapper p {
    font-family: 'Work Sans', sans-serif;
    color: var(--white);
    font-size: 16px;
    margin-bottom: 20px;
}

.offer-item-content-wrapper .offer-item-link {
    font-family: 'Work Sans', sans-serif;
    color: var(--white);
    font-size: 16px;
    font-weight: bold;
    text-decoration: underline;
}

.about-content-heading-wrapper h2 {
    color: var(--white);
    font-size: 60px;
    line-height: 60px;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
    margin-bottom: 10px;
}

.about-content-heading-wrapper h2 .accent {
    font-size: 28px;
    line-height: 30px;
    vertical-align: top;
}

.about-content-heading-wrapper h3 {
    color: var(--white);
    font-size: 28px;
    line-height: 30px;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
}

.about-heading-wrapper h3 {
    color: var(--white);
}

.about-description-wrapper p {
    color: var(--white);
    margin-bottom: 20px;
}

.about-certificate-item-wrapper .subheading {
    color: var(--white);
    font-size: 16px;
    font-family: 'Work Sans', sans-serif;
    font-weight: normal;
    margin: 0;
}

.about-certificate-item-wrapper .heading {
    color: var(--white);
    font-size: 22px;
    font-family: 'Work Sans', sans-serif;
    font-weight: bold;
    margin: 0;
}

.about-certificate-item-wrapper {
    border-left: 3px solid var(--primary-color);
    padding-left: 10px;
}

.why-choose-list-item .heading {
    color: var(--black);
    font-size: 24px;
    font-family: 'Work Sans', sans-serif;
    font-weight: bold;
    margin: 0;
}

.why-choose-list-item::before {
    content: '';
    position: absolute;
    width: 12px;
    height: 12px;
    background-color: var(--primary-color);
    left: 0;
    top: 5px;
}

.why-choose-list-item {
    margin-bottom: 20px;
}

.background-secondary-color-accent {
    background-color: var(--secondary-color);
}

.brand-promise-content-heading-wrapper h3 {
    font-size: 60px;
    line-height: 65px;
}

.brand-promise-content-heading-wrapper {
    background-color: #f6f6f6;
    padding: 100px 60px 60px 60px;
}

.brand-promise-content-heading-wrapper h6 {
    font-size: 18px;
    font-weight: 600;
    font-family: 'Poppins', sans-serif;
    margin: 0;
}

.contact-info-wrapper h5 {
    font-size: 16px;
    color: var(--secondary-color);
    font-family: 'Work Sans', sans-serif;
    margin-top: 40px;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.contact-info-wrapper h4 {
    color: var(--black);
    font-size: 24px;
    font-family: 'Work Sans', sans-serif;
    font-weight: bold;
    margin: 0;
}

.contact-info-wrapper .link:hover h4 {
    color: var(--primary-color);
}

#footer {
    background-color: var(--secondary-color);
}

.white-slant-divider.bg-secondary {
    background-color: var(--secondary-color);
}

#footer-menu.menu-wrapper ul li a {
    color: var(--white);
    font-weight: bold;
}

#footer-secondary-menu.menu-wrapper ul li a {
    color: var(--white);
}

#copyright {
    background-color: var(--primary-color);
}

#copyright p {
    color: var(--white);
    text-align: center;
}

#logo img,
#footer-logo img {
    max-width: 500px;
}

nav a:hover,
.offer-item-link:hover {
	color: var(--primary-color) !important;
	font-weight: bold;
}

.half {
	width: 100%;
	max-width: 760px;
}

#copyright a {
	color: #fff;
	font-weight: bold;
}

#copyright a:hover {
	color: #008d97;
}

.footer-social-wrapper ul li a i {
	color: var(--secondary-color);
}

.footer-social-wrapper ul li a {
	background-color: var(--primary-color);
	width: 15px;
	height: 15px;
	display: block;
}

.footer-social-wrapper ul li a {
	background-color: var(--primary-color);
	border: 2px solid var(--primary-color); 
	text-align: center;
	border-radius: 50px;
	font-size: 14px;
	width: 30px;
	height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.footer-social-wrapper ul li a:hover {
	background-color: transparent;
}

.footer-social-wrapper ul li a:hover i {
	color: var(--primary-color);
}

.arrow {
	width: 0; 
	height: 0; 
	display: block !important;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	bottom: -50px;
	cursor: pointer;
}

.triangle-right {
	border-left: 10px solid var(--primary-color);
	left: 40px;
}

.triangle-left {
	border-right:10px solid var(--primary-color); 
}

input, textarea {
	width: 100%;
	border: 2px solid #bdbdbd !important;
	margin: 10px 0 !important;
}

input::placeholder, textarea {
	font-family: 'Work Sans', sans-serif;
	color: #9f9f9f;
}

textarea {
	padding: 10px;
}

.wpcf7-response-output {
	margin: 0 0 20px 0 !important;
	font-size: 18px;
	background-color: #ffffff87;
}

.header-wrapper {
	transition: all 0.3s;
}

/* Responsive */
@media only screen and (max-width: 1420px) {
    .container {
        padding: 0 50px;
    }
}


@media only screen and (max-width: 1536px) {
	#hero {
		padding: 200px 0 100px 0;
	}
	
	.white-slant-divider.right,
	.white-slant-divider.left {
		height: 60px;
	}

	#offer {
		padding: 50px 0;
	}
	
	#brand-promise {
		padding: 100px 0;
	}

	#footer .white-slant-divider {
		top: -50px !important;
	}
	 .container {
        padding: 0 80px !important;
    }
}

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

	.offer-item-content-wrapper p {
		font-size: 14px;
	}
	
	#logo img, #footer-logo img {
		max-width: 350px;
	}
	
	#about img {
		width: 100%;
	}
	
	#about .image-1 {
		clip-path: polygon(230% 0%, 0% 0%, 0% 100%, 0% 100%) !important;
	}

	h1 {
		font-size: 50px;
		line-height: 60px;
	}

	.about-content-heading-wrapper h2 {
		font-size: 50px;
		line-height: 50px;
	}
	
	.about-content-heading-wrapper h3 {
		font-size: 25px;
		line-height: 25px;
	}
	
	h2 {
		font-size: 30px;
		line-height: 35px;
	}
	
	h3 {
		font-size: 28px;
		line-height: 35px
	}
	
	#about .about-heading-wrapper {
		padding-top: 100px;
		padding-bottom: 20px;
	}

	#about .button-wrapper {
		padding-top: 20px;
	}
	
	#about .about-partner-logo-list-wrapper {
		padding-top: 50px;
	}
	
	.arrow-accent-wrapper img {
		width: 150px !important;
	}

	.primary-btn {
		padding: 10px 40px;
	}
	
	.about-certificate-item-wrapper .subheading {
		font-size: 14px;
	}
	
	.about-certificate-item-wrapper .heading {
		font-size: 18px;
		line-height: 20px;
	}

	.why-choose-list-item .heading {
		font-size: 20px;
	}
	
	p {
		font-size: 14px;
		line-height: 18px;
	}

	#why-choose,
	#testimonial {
		padding: 50px 0;
	}
	
	#testimonial .testimonial-heading-wrapper {
		margin-bottom: 20px;
	}

	#brand-promise .col-1,
	#brand-promise .col-2 {
		width: 50%;
	}
	
	.brand-promise-content-heading-wrapper h3 {
		font-size: 50px;
		line-height: 55px;
	}

	.brand-promise-content-heading-wrapper h3 br {
		display: none;
	}

	.brand-promise-content-heading-wrapper h6 {
		font-size: 16px;
	}
	
	#contact {
		padding: 150px 0 100px 0;
	}

	#contact .contact-heading-wrapper {
		margin-bottom: 20px;
	}
	
	.contact-info-wrapper h5 {
		margin-top: 30px;
		margin-bottom: 0px;
	}
	
	.contact-info-wrapper h4 {
		font-size: 20px;
	}
	
	.contact-info-wrapper h5 {
		font-size: 14px;
	}
	
	#why-choose .col-1 {
		min-height: 600px !important;
	}
}
@media only screen and (max-width: 1366px) {
	
	.offer-item-content-wrapper h4 {
		font-size: 24px;
	}

	.why-choose-list-item p br {
		display: none;
	}
	
	#logo img, #footer-logo img {
		max-width: 300px;
	}

	.header-wrapper .col-1 {
		width: 40%;
	}
	
	.header-wrapper .col-2 {
		width: 60%;
	}
	
	 #about .image-1 {
		 clip-path: polygon(210% 0%, 0% 0%, 0% 100%, 0% 90%) !important;
	}
	
	#about .image-2 {
		margin-top: -292px !important;
	}

	.brand-promise-content-heading-wrapper {
		clip-path: polygon(-152% 100%, 100% -40%, 100% 100%) !important;
	}
	
	#why-choose .half {
		padding-left: 50px;
		padding-right: 50px;
	}
	
	#why-choose .arrow-accent-wrapper {
		right: -20px !important;
	}
}

@media only screen and (max-width: 1280px) {
	#about .image-2 {
		margin-top: -200px !important;
	}
	
	#about .image-1 {
		clip-path: polygon(240% 0%, 0% 0%, 0% 100%, 0% 95%) !important;
	}

	#about .arrow-accent-wrapper {
		right: -20px !important;
	}

	#about .col-2 {
		padding-left: 50px;
	}
	
	.offer-item-wrapper {
		width: 40%;
	}

	.offer-item-wrapper.featured {
		width: 81.9%;
	}
	
	#offer .heading-wrapper.mb-50 h3 {
		text-align: center;
	}

	#about .about-certificate-wrapper {
		padding-top: 50px;
		padding-bottom: 0;
	}
	
	.brand-promise-content-heading-wrapper {
		clip-path: unset !important;
	}

	.offer-item-content-wrapper {
		clip-path: unset;
	}

	.offer-item-heading-wrapper h4,
	.offer-item-content-wrapper  {
		padding: 40px;
	}
}

@media only screen and (max-width: 1100px) {
	#brand-promise {
		padding: 50px 0 100px 0;
	}

	.brand-promise-content-heading-wrapper {
		padding: 50px;
	}
	
	#footer-secondary-menu nav {
		width: 75%;
	}
	
	#about .image-2 {
		margin-top: -170px !important;
	}
	
	#about .image-1 {
		clip-path: polygon(255% 0%, 0% 0%, 0% 100%, 0% 95%) !important;
	}

	.about-certificate-wrapper ul li {
		justify-content: start;
	}
	
	.about-partner-logo-list-wrapper ul {
		justify-content: space-between;
	}
	
	#hero .col-1 {
		width: 50%;
	}
}

@media only screen and (max-width: 1024px) {
	.footer-social-wrapper {
		margin-top: 20px;
	}

	#footer-menu {
		margin-bottom: 20px;
	}
	
	.brand-promise-content-heading-wrapper h3 {
		font-size: 40px;
		line-height: 45px;
	}

	.primary-btn {
		padding: 5px 30px;
		font-size: 14px;
	}
	
	.arrow-accent-wrapper img {
		width: 100px !important;
	}
	
	.about-content-heading-wrapper h2 {
		font-size: 40px;
		line-height: 40px;
	}
	
	.offer-item-heading-wrapper {
		display: none;
	}

	.offer-item-content-wrapper {
		display: block;
	}
	
	.offer-item-content-wrapper h4 {
		font-size: 20px;
	}

	h3 {
		font-size: 25px;
		line-height: 30px;
	}
}

@media only screen and (max-width: 980px) {
	#main-menu, #contact-link {
		display: none;
	}

	h1 {
		font-size: 40px;
		line-height: 50px;
	}

	h2 {
		font-size: 25px;
		line-height: 30px;
	}

	#hero .col-1 {
		width: 55%;
		background-color: rgba(255, 255, 255, 0.7);
		padding: 25px;
	}
	
	#about .col-1, #about .col-2 {
		width: 100%;
	}
	
	.md-wrap {
		flex-wrap: wrap;
	}
	
	#about .image-1,
	#about .image-2 {
		clip-path: unset !important;
		text-align: center;
	}
	
	#about .image-2 {
		margin-top: 50px !important;
	}

	#hero {
		background-position: right;
	}
	
	#about .arrow-accent-wrapper {
		display: none;
	}

	#about .col-2 {
		padding-left: 0;
	}
	
	#about .about-heading-wrapper {
		padding-top: 50px;
	}
	
	.about-content-heading-wrapper h2 br {
		display: none;
	}

	.about-partner-logo-list-wrapper ul {
		justify-content: unset;
		gap: 60px;
	}
	
	#why-choose .col-1, #why-choose .col-2 {
		width: 100%;
	}
	
	#why-choose .half {
		width: 100%;
		max-width: 100%;
	}
	
	#why-choose .why-choose-heading-wrapper {
		padding-top: 50px;
	}
	
	#why-choose .col-1 {
		margin: 0 50px;
	}
	
	#testimonial .col-1, #testimonial .col-2 {
		width: 100%;
	}
	
	#testimonial .col-2 {
		margin-top: 120px;
	}

	#brand-promise .col-1 {
		width: 0;
	}
	
	#brand-promise .col-2 {
		width: 100%;
	}

	.brand-promise-content-heading-wrapper {
		background-color: rgba(255, 255, 255, 0.7);
	}

	#contact .col-1, #contact .col-2 {
		width: 100%;
	}

	#contact .contact-info-wrapper {
		margin-bottom: 50px;
	}
	
	#footer .col-1, #footer .col-2 {
		width: 100%;
	}

	#footer .col-2,
	#footer .footer-social-wrapper {
		margin-top: 20px;
	}
	
	#footer {
		text-align: center;
	}
	
	#footer .footer-social-wrapper ul {
		justify-content: center;
	}
	
	#footer-menu ul,
	#footer-secondary-menu ul {
		justify-content: space-evenly;
	}

	#footer-secondary-menu nav {
		width: 100%;
	}
}

@media only screen and (max-width: 767px) {
	#contact .contact-description-wrapper p br {
		display: none;
	}

	#testimonial-home {
		width: 100%;
	}
	
	.arrow.triangle-left.absolute.slick-arrow {
		right: 55%;
	}
	
	.arrow.triangle-right.absolute.slick-arrow {
		left: 55%;
	}

	#about,
	#testimonial,
	#brand-promise,
	#contact,
	#why-choose h3 {
		text-align: center;
	}

	.about-certificate-item-wrapper {
		text-align: left;
	}

	#footer-menu ul,
	#footer-secondary-menu ul {
		flex-direction: column;
	}

	.about-partner-logo-list-wrapper ul {
		justify-content: center;
	}
	
	.offer-item-wrapper {
		width: 100%;
	}

	.offer-item-wrapper.featured,
	.offer-item-wrapper.featured .offer-item-content-wrapper,
	.offer-item-content-wrapper {
		width: 100%;
	}
	
	h3 {
		font-size: 25px;
	}

	#hero .col-1 {
		width: 100%;
		text-align: center;
	}
	
	.about-content-heading-wrapper h2 {
		font-size: 30px;
		line-height: 30px;
	}

	.about-content-heading-wrapper h3 {
		font-size: 20px;
		line-height: 20px;
	}
}

@media only screen and (max-width: 640px) {
	#about .about-certificate-wrapper ul,
	.about-partner-logo-list-wrapper ul {
		flex-direction: column;
		gap: 25px;
	}

	.offer-item-content-wrapper {
		padding: 25px;
	}
}

@media only screen and (max-width: 440px) {
	#brand-promise {
		background-position: center;
	}

	#logo img, #footer-logo img {
		max-width: 220px;
	}
}

.bg-inherit {
    background-size: inherit;
}