*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: 'Epilogue', sans-serif;
    list-style-type: none;
    scroll-behavior: smooth;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

@import url('https://fonts.googleapis.com/css2?family=Epilogue:wght@300;400;500;600;700;800;900&display=swap');

body::-webkit-scrollbar{
    width: 5px;
    height: 8px;
    background-color: #000;
}
body::-webkit-scrollbar-thumb{
    background-color: #0FAFB7;
}

#loom-companion-mv3{
    display: none;
}
.wpcf7 form .wpcf7-response-output{
    margin: 0;
    margin-top: 20px;
    padding: 10px;
    border-radius: 6px;
}

body{
    background: #000000;
}
section{
    padding: 80px 135px;
}
h1{
    font-weight: 800;
    font-size: 72px;
    line-height: 80px;
    letter-spacing: -2px;
    color: #FFFFFF;
}
h2{
    font-weight: 800;
    font-size: 54px;
    line-height: 62px;
    color:#FFFFFF
}
h3{
    font-weight: 800;
    font-size: 42px;
    line-height: 56px;
    color: #FFFFFF;
}
h4{
    font-weight: 600;
    font-size: 28px;
    line-height: 36px;
    color: #FFFFFF;
}
h5{
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    color:  #FFFFFF;
}
h6{
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #0FAFB7;
}
p{
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    color:  #fff;
}
ul li{
    color: #fff;
}
a{
    text-decoration: none;
}
/* general outline btn hover effects */
.fillbtn{
    font-weight: 900;
    font-size: 16px;
    line-height: 32px;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    border: 1px solid #0FAFB7;
    border-radius: 6px;
    padding: 12px 28px;
    display: inline-block;
    position: relative;
    overflow: hidden;
    transition: 0.4s ease-in-out;
    z-index: 1; 
}
.fillbtn::before{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #0FAFB7;
    transform: translateX(0%);
    transition: 0.4s ease-in-out;
    z-index: -1;
}
.fillbtn:hover{
    color: #0FAFB7;
}
.fillbtn:hover:before {
    transform: translateX(100%);
}
/* general outline btn hover effects over */


/* general outline btn hover effects */
.outlinebtn{
    font-weight: 900;
    font-size: 16px;
    line-height: 32px;
    text-align: center;
    text-transform: uppercase;
    border: 1px solid #0FAFB7;
    color: #0FAFB7;
    background: transparent;
    border-radius: 6px;
    padding: 12px 28px;
    display: inline-block;
    position: relative;
    overflow: hidden;
    transition: 0.4s ease-in-out;
    z-index: 1;
}
.outlinebtn::before{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #0FAFB7;
    transform: translateX(-100%);
    transition: 0.4s ease-in-out;
    z-index: -1;
}
.outlinebtn:hover{
    color: #FFF;
}
.outlinebtn:hover:before {
    transform: translateX(0);
}
/* general outline btn hover effects over */

.divider-div{
    padding: 0px 135px;
    background: #000;
}
.section-divider{
    background: #fff;
    height: 1px;
    width: 100%;
    border: none;
}


/* back to top */
.back-to-top {
    position: fixed;
    bottom: 100px;
    right: 50px;
    display: inline-block;  
    background: #0FAFB7;
    height: 40px;
    width: 40px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 4;
}
.back-to-top::after{
    content: "\f062";
    color: #fff;
    font-family: 'fontAwesome';
    font-size: 20px;
}

/* 404-section */
.section-404{
    text-align: center;
}
.section-404 h1{
    font-size: 235px;
    line-height: 190px;
    letter-spacing: 0;
    color: #0FAFB7;
    margin-bottom: 40px;
}
.section-404 h1 span{
    color: #fff;
}
.section-404 h3{
    margin-bottom: 30px;
}
.section-404 h3 span{
    color: #0FAFB7;
}


/* whatsapp-widget css */
.whatsapp-widget {
    position: fixed;
    bottom: 25px;
    right: 0;
    z-index: 99999;
}
.whatsapp-widget .whatsapp-link {
    display: flex;
    flex-direction: column;
}
.whatsapp-widget .whatsapp-link .whatsap-icon {
    display: flex;
    flex-direction: column;
    position: relative;
}
.whatsapp-widget .whatsapp-link .whatsap-icon .circle {
    content: '';
    position: absolute;
    background: #D24A38;
    width: 8px;
    height: 8px;
    left: 40px;
    top: 9px;
    border-radius: 100%;
    text-shadow: 0 0 20px #d24a38, 0 0 30px #d24a38, 0 0 40px #d24a38, 0 0 50px #d24a38, 0 0 60px #d24a38, 0 0 70px #d24a38, 0 0 80px #d24a38;
}
.blinking {
    animation: blinker 1s cubic-bezier(.5, 0, 1, 1) infinite alternate;
}
.whatsapp-widget .whatsapp-link .whatsap-icon svg {
    display: block;
    width: 173px;
    height: 50px;
}

@media only screen and (max-width: 1200px){
    h1 {
        font-size: 60px;
        line-height: 68px;
    }
}
@media only screen and (max-width:992px){
    section{
        padding: 60px;
    }
    .divider-div{
        padding: 0px 60px;
    }
}
@media only screen and (max-width:768px){
    section{
        padding: 40px 20px;
    }
    .divider-div{
        padding: 0px 20px;
    }
    h1{
        font-weight: 800;
        font-size: 40px;
        line-height: 48px;
    }
    h2{
        font-weight: 800;
        font-size: 34px;
        line-height: 42px;
    }
    h3{
        font-weight: 600;
        font-size: 29px;
        line-height: 36px;
    }
    h4{
        font-weight: 600;
        font-size: 24px;
        line-height: 30px;
    }
    h5{
        font-size: 20px;
        line-height: 28px;
    }
    h6{
        letter-spacing: 2px;
    }
    
    .fillbtn , .outlinebtn{
        width: 100%;
    }
    .back-to-top{
        bottom: 100px;
        right: 30px;
    }
    .section-404 h1{
        font-size: 130px;
        line-height: 110px;
        margin-bottom: 30px;
    }
}



/* banner */
.site-banner{
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -88px;
}
.bannner-wraper{
    display: flex;
    align-items: center;
    gap: 87px;
}
.bannner-wraper::after{
    content: "";
    background-color: #000;
    opacity: 0.5;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
}
.banner-content{
    position: relative;
    z-index: 2;
    min-height: 275px;
}
.banner-content h6 {
    font-weight: 700;
}
.banner-images{
    width: 50%;
}
.banner-content h1{
    margin: 24px 0px;
    transition: all 0.4s;
    display: flex;
    align-items: center;
    min-height: 70px;
}
.banner-content h5{
    min-height: 65px;
}
.typing-text{
    color: #0FAFB7;
    padding-left: 15px;
    display: block !important;
    /* border-right: 7px solid #0FAFB7; */
}
.banner-content h1 .typed-cursor{
    /* display: none; */
    color: #0FAFB7;
}
.banner-btns{
    margin-top: 34px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.video-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.video-container video {
    min-width: 100%;
    min-height: 100%;
}
@media only screen and (max-width: 992px){
    .bannner-wraper{
        flex-direction: column-reverse;
    }
    .banner-content{
        width: 100%;
    }
    .banner-images{
        width: 100%;
    }
}
@media only screen and (max-width: 768px){
    .banner-btns{
        flex-direction: column;
    }
    .banner-btns .bann-btn1{
        width: 100%;
        justify-content: center;
    }
    .banner-content h1{
        flex-wrap: wrap;
    }
    .weare{
        width: 100%;
    }
    .typing-text{
        padding-left: 0;
    }
}




/* iamge-with-text */
.iamge-with-text{
    display: flex;
    align-items: center;
    gap: 130px;
}
.img-div{
    width: 100%;
}
.img-div img{
    width: 100%;
}
.text-div{
    width: 100%;
}
.text-div h2{
    margin: 26px 0px;
}
.text-div p{
    margin: 18px 0px 34px;
}
@media screen and (max-width:1200px) {
    .iamge-with-text{
        gap: 60px;
    }
}
@media screen and (max-width:768px) {
    .iamge-with-text{
        flex-direction: column;
        gap: 16px;
    }
    .text-div h2{
        margin: 17px 0px 29px;
    }
    .text-div p{
        margin: 18px 0px 32px;
    }
}


/* num-counter-animation */
.num-cuntr-ani{
}
.number-animtion-box{
    display: flex;
    gap: 20px;    
}
.number-text-boxes{
    width: 100%;
    background: #1F1E1E;
    /* border: 1px solid #0FAFB7; */
    border-radius: 10px;
    padding: 30px;
    transition: all 0.4s;
}
.number-text-boxes h5{
    transition: all 0.4s;
}
.number-text-boxes:hover{
    background-color: #fff;
    /* border: 1px solid #FFF; */
}
.number-text-boxes:hover h5{ 
    color: #000;
}
.number-text-boxes h3{
    margin-bottom: 13px;
    color: #0FAFB7;
    transition: all 0.4s;
}
.counter {
    animation-duration: 1s;
    animation-delay: 0s;
}
@media screen and (max-width:768px) {
    .number-animtion-box{
        flex-direction: column;
        width: 100%;
        max-width: 480px;
        margin: auto;
    }
    .number-text-boxes{
        padding: 25px;
    }
}


/* how work */
.how-we-work{
    background-color: #1F1E1E;;
}
.work-area-wraper {
	display: flex;
	width: 100%;
	gap: 130px;
	box-sizing: border-box;
}
.workinfo {
	width: 100%;
}
.workinfo h6 {
	margin-bottom: 17px;
}
.workinfo h3 {
	margin-bottom: 31px;
}
.workinfo a {
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    color: #FFF;
    text-decoration: none;
    margin-top: 28px;
    max-width: 84px;
    width: 100%;
    display: inline-block;
}
.workpoints {
	width: 100%;
}
.points-box {
	display: flex;
	gap: 25px;
	margin-bottom: 32px;
	align-items: center;
}
.points-box img{
    width: 100%;
    max-width: 30px;
}
/* .points-box h1{ */
    /* color: #0FAFB7; */
    /* color: transparent; */
    /* -webkit-text-stroke: 2px #0FAFB7; */
/* } */
.points-box:last-child{
    margin-bottom: 0;
}
@media only screen and (max-width: 992px) {
	.work-area-wraper {
		gap: 60px;
	}
}
@media only screen and (max-width: 768px) {
	.work-area-wraper {
        flex-direction: column;
	}
	.workinfo h3 {
		margin-bottom: 15px;
	}
	/* .points-box h1 {
		font-size: 72px;
	} */
	/* .points-box h4 {
		font-size: 24px;
	} */
}



/* video-reel */
.video-reel-area{
    display: flex;
    align-items: center;
    /* background: #FDF0E9; */
    gap: 130px;
}
.video-div{
    width: 100%;
    max-width: 60%;
    align-self: stretch;
}
.video-div video{
    width: 100%;
    border-radius: 6px;
    height: 100%;
}

.video-div img{
    width: 100%;
    border-radius: 6px;
    height: 100%;
}

.video-info{
    width: 100%;
    max-width: 40%;
}
.video-info h3{
    margin: 17px 0px 28px;
}
@media screen and (max-width:1200px) {
    .video-reel-area{
        gap: 60px;
    }
}
@media screen and (max-width:768px) {
    .video-reel-area{
        flex-direction: column;
        gap: 24px;
    }
    .video-div{
        max-width: 100%;
    }
    .video-info{
        max-width: 100%;
    }
    .video-info h3{
        margin: 16px 0px;
    }
}


/* features-img-txt */
.features-img-txt{
    display: flex;
    align-items: center;
    /* background: #FDF0E9; */
    gap: 170px;
}
.features-txts{
    width: 100%;
}
.features-imgg{
    width: 100%;
}
.features-txts h2{
    margin: 20px 0px 26px;
}
.features-imgg img{
    width: 100%;
}
.rghchekimg-with-text{
    margin-top: 26px;
}
.rghchekimg-with-text ul li{
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    margin-top: 16px;
    display: flex;
    align-items: center;
    position: relative;
    color:  #FFFFFF;
    padding-left: 48px;
}
.rghchekimg-with-text ul li::before{
    content: "";
    background-image: url("/wp-content/themes/codebuddys/assets/images/check.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: absolute;
    width: 22px;
    height: 22px;
    /*top: -2px;*/
    left: 5px;
}
@media screen and (max-width:1200px) {
    .features-img-txt{
        gap: 60px;
    }
}
@media screen and (max-width:768px) {
    .features-img-txt{
        flex-direction: column-reverse;
        gap: 24px;
    }
}


/* 2white-box-content */
.twowht-box-cntnt {
	/* display: flex; */
	/* gap: 130px; */
    /* align-items: end; */
}
.lft-cntent {
	width: 100%;
    /* max-width: 30%; */
    text-align: center;
}
.lft-cntent h6 {
	margin-bottom: 18px;
}
.lft-cntent h4{
	margin-bottom: 15px;
}
.twowhite-boxes {
	width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    margin-top: 50px;
}
.whiteboxes{
	background: #1F1E1E;
	/* border: 2px solid #0FAFB7; */
    border-radius: 8px;
	box-sizing: border-box;
	padding: 30px;
    transition: all 0.4s;
    width: 100%;
}
.whiteboxes:hover{
    background-color: #fff;
    /* border: 2px solid #fff; */
}
.whiteboxes:hover h4 ,.whiteboxes:hover p{
    color: #000;
}
.whiteboxes h4 ,.whiteboxes p {
    transition: all 0.4s;
}
.whiteboxes h4 {
	margin-top: 24px;
	margin-bottom: 16px;
}
.whiteboxes img{
    width: 100%;
    max-width: 60px;
}
@media only screen and (max-width: 1200px) and (min-width:993px) {
	.twowht-box-cntnt {
        gap: 80px;
        padding: 80px;
    }
}
@media only screen and (max-width: 992px) {
	.twowht-box-cntnt {
		flex-direction: column;
		gap: 40px;
        align-items: normal;
	}
	.lft-cntent {
		max-width: 100%;
	}
    .lft-cntent h6 {
		margin-bottom: 12px;
	}
	.lft-cntent h4 {
		max-width: 100%;
	}
	.lft-cntent p {
		max-width: 100%;
	}
}
@media only screen and (max-width: 768px) {
	.whiteboxes{
		padding: 25px;
	}
}
@media only screen and (max-width: 480px) {
	.twowhite-boxes {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(2, 1fr);
	}
}

/* service-boxs */
.service-boxs-div h3{
    margin: 17px 0px 35px;
}
.serv-box-area{
    display: flex;
    gap: 20px;
}
.serv-icn-box{
    width: 100%;
    padding: 30px;
    border-radius: 10px;
    transition: 0.4s all;
    /* border: 1px solid #0FAFB7; */
    display: flex;
    flex-direction: column;
    background: #1F1E1E;
}
.serv-icn-box:hover{
    background-color: #fff;
    /* border: 1px solid #fff; */
}
.serv-icn-box:hover h4 ,.serv-icn-box:hover p{
    color: #000 !important;
}
.serv-icn-box img{
    width: 100%;
    display: flex;
    max-width: 80px;
}
.serv-icn-box h4{
    margin: 32px 0px 16px;
    transition: 0.4s all;
}
.serv-icn-box p{
    transition: 0.4s all;
    height: -webkit-fill-available;
}
.serv-icn-box a{
    font-weight: 700;
    font-size: 16px;
    line-height: 32px;
    transition: 0.4s all;
    color: #0FAFB7;
    margin-top: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    text-transform: uppercase;
}
.serv-icn-box a::after {
    content: "\f061";
    font-family: 'fontAwesome';
    font-size: 20px;
    transition: 0.4s all;

}
.serv-icn-box a:hover::after{
    margin-left: 6px;
}
@media screen and (max-width: 768px) {
    .serv-box-area{
        flex-direction: column;
    }
    .serv-icn-box{
        display: block;
        padding: 35px 25px;
    }
    .serv-icn-box img{
        max-width: 60px;
    }
    .serv-icn-box h4{
        margin-top: 28px;
    }
    .serv-icn-box p{
        height: auto;
    }
}


/* Industries We Serve */
.industries-we-serve{
    padding-left: 0;
    padding-right: 0;
    user-select: none;
    position: relative;
}
.indstris-serve-slider::after{
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    margin: auto;
    z-index: 1;
}
.industries-we-serve h3{
    margin-bottom: 60px;
    text-align: center;
    color: #0FAFB7;
}

.logo-indstris-name{
    width: 180px;
    text-align: center;
}
.logo-indstris-name img{
    width: 100%;
    max-width: 60px;
    height: 60px;
    margin: auto;
    margin-bottom: 18px;
}
.indstris-serve-slider .slick-slide{
    user-select: none;
}
.industries-we-serve .slick-slider{
    margin-bottom: 0;
    user-select: none;
    touch-action: none;
}
@media screen and (max-width: 768px) {
    .logo-indstris-name img{
        max-width: 50px;
        height: 50px;
    }
    .industries-we-serve h3{
        margin-bottom: 40px;
    }
}





/* get-started */  
.gs-section{
    background: #1F1E1E;
}
.get-started-div{
    padding: 60px;
    border-radius: 6px;
    text-align: center;
    border: 1px solid #0FAFB7;
}
.get-started-div h3{
    width: 100%;
    /* max-width: 525px; */
    margin: auto;
    margin-top: 5px;
    margin-bottom: 32px;
}
@media screen and (max-width:768px){
    .get-started-div{
        padding: 40px 20px;
    }
    .get-started-div h3{
        margin-top: 10px;
        margin-bottom: 24px;
    }
}


/* founder-words */
.founders-info-box{
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 100px;
    margin: 0px 12px;
}
.founder-img{
    width: 100%;
}
.founder-talks{
    width: 100%;
    position: relative;
    z-index: 1;
}
.founder-img img{
    width: 100%;
    max-width: 400px;
}
.founder-talks h3{
    color: #fff;
    margin: 20px 0px ;
}
.founder-talks h4{
    color: #0FAFB7;
}
.founder-talks p{
    color: #0FAFB7;
    margin-top: 6px;
}
.founder-words .slick-slider{
    margin-bottom: 50px;
}
.founders-slider .slick-dots{
    bottom: -50px;
}
.founders-slider .slick-dots li{
	margin: 0px 2px;
}
.founders-slider .slick-dots li button:before {
	opacity: 1;
	content: "";
	background: transparent;
    border: 2px solid #fff;
    border-radius: 50px;
    height: 12px;
    width: 12px;
}
.founders-slider .slick-dots li.slick-active button:before {
	opacity: 1;
	background: #0FAFB7;
	border: 2px solid #0FAFB7;
}

@media screen and (max-width:1200px) {
    .founders-info-box{
        gap: 60px;
    }
}
@media screen and (max-width:768px) {
    .founders-info-box{
        flex-direction: column;
        gap: 40px;
    }
    .founder-img img{
        max-width: 100%;
    }
}
@media screen and (max-width:480px) {
    .founder-img img{
        object-fit: cover;
        object-position: top;
        height: 260px;
    }
}

/* faq-section */
.faq-section {
    background: #1F1E1E;
}
.faq-main-div {
	/* display: flex; */
	gap: 130px;
}
.faqheadings-left{
    width: 100%;
    /* max-width: 40%; */
}
.faq-list-right {
    width: 100%;
    /* max-width: 60%; */
}

.faqheadings-left h6 {
	margin-bottom: 17px;
}
.faqheadings-left h3 {
	margin-bottom: 31px;
}
.faqheadings-left p {
	/* margin-bottom: 29px; */
}
.faqheadings-left a {
    color: #fff;
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
}
.faq-list-right .accordion{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 11px;
    grid-row-gap: 15px;
    margin-top: 30px;
}
.accordion-item{
    width: 100%;
}
.accordion a {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	color: #ffffff;
	padding: 35px;
    user-select: none;
	padding-right: 80px;
	font-weight: 700;
	font-size: 24px;
	line-height: 32px;
	border: 1px solid #0FAFB7;
	cursor: pointer;
	transition: 0.4s all ease;
	border-radius: 6px;
}
.accordion a.active {
	color: #0FAFB7;
	background-color: white;
	border: none;
	transition: 0.4s all ease;
	border-radius: 6px 6px 0px 0px;
}

.accordion a::after {
	font-family: 'Fontawesome';
	content: '\f107';
	position: absolute;
	right: 35px;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 30px;
	height: 30px;
	text-align: center;
	cursor: pointer;
}
.accordion a.active::after {
	color: #0FAFB7;
	transform: rotate(180deg);
}
.accordion .content {
	opacity: 0;
	max-height: 0;
	overflow: hidden;
}
.accordion .content.active {
	opacity: 1;
	max-height: 100%;
	transition: 0.4s all ease;
	background-color: white;
	border-radius: 0px 0px 6px 6px;
}
.accordion .content p {
	color: #000;
	padding: 0px 50px 35px;
}
@media only screen and (max-width: 1200px) and (min-width: 992px){
    .faq-section{
        padding: 80px;
    }
} 
@media only screen and (max-width: 1200px) {
    .faq-main-div{
        gap: 60px;
    }
}
@media only screen and (max-width: 768px) {
	.faq-main-div {
		flex-direction: column;
        gap: 40px;
	}
    .faqheadings-left{
        max-width: 100%;
    }
    .faq-list-right {
        max-width: 100%;
    }
    .faq-list-right .accordion{
        grid: none;
    }
	.faqheadings-left h3 {
		margin-bottom: 15px;
	}
	.faqheadings-left p {
		/* margin-bottom: 24px; */
	}
    .accordion .content p{
        padding: 0px 26px 25px;
    }
    .accordion a{
        padding: 20px;
        padding-right: 80px;
        font-size: 20px;
        line-height: 28px;
    }
    .accordion a::after{
        right: 24px;
    }

}



/* form-on-map */
.form-on-map{
    position: relative;
    overflow: hidden;
}
.mapdiv{
    width: 100%;
}
.formdiv{
    width: 100%;
    max-width: 450px;
    margin-left: auto;
    z-index: 3;
    background-color: #fff;
    border-radius: 6px;
    position: relative;
    padding: 50px;
    box-sizing: border-box;
}
.map-area{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    filter: grayscale(100%) invert(100%) contrast(95%);
}
.mobile-paddiv{
    margin-bottom: -500px;
}
.formdiv h4{
    margin-bottom: 24px;
    color: #000;
}
.input-label .form-inpt{
    display: block;
    width: 100%;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    border-radius: 6px;
    padding: 12px 16px;
    color: #000;
    border: 1px solid #000;
    position: relative;
    margin-bottom: 5px;
}
textarea{
    resize: none;
}
.formsubmit{
    background: transparent;
    border-radius: 6px;
    border: 1px solid #000;
    font-weight: 900;
    font-size: 14px;
    line-height: 14px;
    padding: 16px 30px;
    text-transform: uppercase;
    color: #000;
    display: flex;
    justify-content: center;
    width: 100%;
    max-width: 170px;
    margin-left: auto;
    margin-top: 32px;
    text-align: center;
    cursor: pointer;
    transition: all 0.4s;
}
.formsubmit:hover{
    background: #000;
    color: #fff;
}
.form-inpt:focus-visible{
    border: 1px solid #000 !important;
    outline: auto;
}
.input-label {
    position: relative;
    margin-top: 20px;
}
.input-label label {
    font-weight: 400;
    color: #000;
    position: absolute;
    transition: all 0.25s ease-in-out;
    top: -9px;
    background: #fff;
    padding: 0px 5px;
    left: 11px;
    font-size: 14px;
    line-height: 20px;
}
.wpcf7-spinner{
    display: none;
}
/* plane css */
#plate.front {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
}
.wing {
    background: url('wing1.png') center center no-repeat;
    -webkit-background-size: contain;
    background-size: contain;
    position: absolute;
    -webkit-transform-origin: 0 0 0;
    transform-origin: 0 0 0;
    -webkit-perspective: 1;
    perspective: 1;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: all 1.3s linear;
    transition: all 1.3s linear;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    border-top: 240px solid hsla(0, 0%, 0%, 0);
    border-bottom: 0px solid hsla(0, 0%, 0%, 0);
    border-right: 100px solid hsl(0, 0%, 88%);
    width: 0;
    height: 0;
    bottom: 0;
}
#planebox {
    -webkit-perspective: 600;
    perspective: 600;
    -webkit-perspective-origin: 200px 131px;
    perspective-origin: 200px 131px;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: relative;
    width: 100%;
    max-width: 450px;
    height: 500px;
    top: -550px;
    text-align: center;
    display: block;
    margin-left: auto;
    z-index: 4;
}
#plate {
    -webkit-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}
#left-wing,
#right-wing {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    width: 200px;
    height: 260px;
    display: block;
    position: absolute;
    top: 0px;
    -webkit-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}
#left-wing {
    -webkit-transform: rotateZ(0deg);
    transform: rotateZ(0deg);
    -webkit-transform-origin: 100% 50% 0;
    transform-origin: 100% 50% 0;
    left: 0;
}
#right-wing {
    -webkit-transform: rotateZ(0deg);
    transform: rotateZ(0deg);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    left: 199px;
}
.wing1 {
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: translateY(-38px) translateX(8px) rotateZ(22.62deg) skewY(-22.62deg);
    transform: translateY(-38px) translateX(8px) rotateZ(22.62deg) skewY(-22.62deg);
}
.wing2 {
    -webkit-transform: rotateZ(22.62deg);
    transform: rotateZ(22.62deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    border-left: 100px solid hsl(0, 0%, 88%);
    border-right: none;
    left: 100px;
}
.wing3 {
    -webkit-transform: rotateZ(-22.62deg);
    transform: rotateZ(-22.62deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    border-right: 100px solid hsl(0, 0%, 88%);
}
.wing4 {
    -webkit-transform: translateY(-38px) translateX(-8px) rotateZ(-22.62deg) skewY(22.62deg);
    transform: translateY(-38px) translateX(-8px) rotateZ(-22.62deg) skewY(22.62deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    border-right: none;
    border-left: 100px solid hsl(0, 0%, 88%);
    left: 100px;
}
#planebox.hover #left-wing {
    -webkit-transform: rotateY(60deg);
    transform: rotateY(60deg);
}
#planebox.hover #right-wing {
    -webkit-transform: rotateY(-60deg);
    transform: rotateY(-60deg);
}
#planebox.hover.fly_away_first {
    -webkit-transform: translatex(-100px) translateZ(300px) rotateX(42deg) rotateY(-11deg) rotateZ(27deg);
    transform: translatex(-100px) translateZ(300px) rotateX(42deg) rotateY(-11deg) rotateZ(27deg);
    -webkit-transition-delay: 0;
    transition-delay: 0;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
#planebox.hover.fly_away_first.fly_away {
    -webkit-transform: translateX(600px) translateY(-400px) translateZ(-5000px) rotateX(66deg) rotateY(-12deg) rotateZ(36deg);
    transform: translateX(600px) translateY(-400px) translateZ(-5000px) rotateX(66deg) rotateY(-12deg) rotateZ(36deg);
    -webkit-transition: -webkit-transform 2s ease-out, opacity 1.5s 0.5s linear;
    transition: transform 2s ease-out, opacity 1.5s 0.5s linear;
    opacity: 0;
}
#planebox.hover .wing1 {
    -webkit-transform: translateY(-38px) translateX(8px) rotateZ(22.62deg) rotateY(-60deg) skewY(-22.62deg);
    transform: translateY(-38px) translateX(8px) rotateZ(22.62deg) rotateY(-60deg) skewY(-22.62deg);
    border-right: 100px solid hsl(0, 0%, 95%);
}
#planebox.hover .wing2 {
    border-left: 100px solid hsl(0, 0%, 85%);
}
#planebox.hover .wing3 {
    border-right: 100px solid hsl(0, 0%, 71%);
}
#planebox.hover .wing4 {
    -webkit-transform: translateY(-38px) translateX(-8px) rotateZ(-22.62deg) rotateY(60deg) skewY(20deg);
    transform: translateY(-38px) translateX(-8px) rotateZ(-22.62deg) rotateY(60deg) skewY(20deg);
    border-left: 100px solid hsl(0, 0%, 95%);
}
#planebox.hover {
    -webkit-transform: rotateX(54deg) rotateY(-10deg) rotateZ(25deg);
    transform: rotateX(54deg) rotateY(-10deg) rotateZ(25deg);
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
}
#planebox.beginning {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.send {
    -webkit-appearance: none;
    appearance: none;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.curvable.top_left {
    -webkit-transform-origin: 100px 112px;
    transform-origin: 100px 112px;
    -webkit-transition-delay: 1300ms;
    transition-delay: 1300ms;
    width: 0;
    height: 0;
    top: 0;
    border-right: 202px solid hsla(0, 0%, 0%, 0);
    border-bottom: 202px solid hsla(0, 0%, 0%, 0);
    border-top: 223px solid hsl(0, 0%, 88%);
}
.curvable {
    -webkit-transition: -webkit-transform 800ms ease-out;
    transition: transform 800ms ease-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    background-color: transparent;
    z-index: 0;
    width: 0;
}
.top_right.curvable {
    right: 0;
    border-left: 202px solid hsla(0, 0%, 0%, 0);
    border-bottom: 202px solid hsla(0, 0%, 0%, 0);
    border-top: 224px solid hsl(0, 0%, 88%);
    -webkit-transform-origin: 96px 112px;
    transform-origin: 96px 112px;
    -webkit-transition-delay: 1650ms;
    transition-delay: 1650ms;
}
.bottom_left.curvable {
    -webkit-transform-origin: 109px 0;
    transform-origin: 109px 0;
    -webkit-transition-delay: 2100ms;
    transition-delay: 2100ms;
    width: 109px;
    height: 38px;
    background: hsl(0, 0%, 88%);
    bottom: 0;
    left: 0;
}
.bottom_left.curvable:after {
    position: absolute;
    content: "";
    border-right: 92px solid hsla(0, 0%, 0%, 0);
    border-bottom: 39px solid hsl(0, 0%, 88%);
    border-top: 37px solid hsla(0, 0%, 0%, 0);
    left: 109px;
    bottom: 0;
}
.bottom_right.curvable {
    -webkit-transform-origin: 0px 0;
    transform-origin: 0px 0;
    -webkit-transition-delay: 2450ms;
    transition-delay: 2450ms;
    width: 109px;
    height: 38px;
    background: hsl(0, 0%, 88%);
    bottom: 0;
    right: 0;
}
.bottom_right.curvable:after {
    position: absolute;
    content: "";
    border-left: 92px solid hsla(0, 0%, 0%, 0);
    border-bottom: 39px solid hsl(0, 0%, 88%);
    border-top: 37px solid hsla(0, 0%, 0%, 0);
    left: -92px;
    bottom: 0;
}
.top_left.curvable.curved {
    -webkit-transform: rotate3d(1, -1.11, 0, 180deg);
    transform: rotate3d(1, -1.11, 0, 180deg);
}
.bottom_left.curvable.curved {
    -webkit-transform: rotate3d(2.4867, 1, 0, -180deg);
    transform: rotate3d(2.4867, 1, 0, -180deg);
}
.bottom_right.curvable.curved {
    -webkit-transform: rotate3d(-2.4867, 1, 0, 180deg);
    transform: rotate3d(-2.4867, 1, 0, 180deg);
}
.top_right.curvable.curved {
    -webkit-transform: rotate3d(1, 1.11, 0, 180deg);
    transform: rotate3d(1, 1.11, 0, 180deg);
}
#planebox.hover .wing {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
}
#planebox.hover .curved {
    display: none;
}
/* plane css over */


@media only screen and (max-width:768px){
    .mobile-paddiv{
        padding: 40px 20px;
    }
    .form-on-map{
        padding: 0;
    }
    .map-area{
        position: unset;
        height: 500px;
    }
    .formdiv{
        max-width: 100%;
        padding: 30px 20px;
    }
}



/* footer css */
.footer-area {
    background-color: #000;
    border-top: 1px solid #0FAFB7;
}
.footer-links-icons{
    display: flex;
    justify-content: space-between;
    margin-bottom: 50px;
}
.footer-logo {
    width: 30%;
}
.links-box {
    width: 35%;
    display: flex;
}
.social-links {
    width: 30%;
}
.footer-logo > a > img{
    width: 100%;
    max-width: 200px;
}
.footer-links{
    width: 100%;
}
.footer-links ul li a{
    color: #FFF;
    font-size: 16px;
    line-height: 32px;
    list-style: none;
    margin-top: 10px;
    transition: all 0.2s;
}
.footer-links ul li a:hover{
    /* text-decoration: underline; */
    color: #0FAFB7;
}
.footer-links h6 {
    margin-bottom: 14px;
    font-weight: 600;
}

.copyright-bottom {
    padding-top: 50px;
    display: flex;
    justify-content: space-between;
    border-top: 2px solid #0FAFB7;
}
.policy-terms {
    display: flex;
    gap: 60px;
} 
.policy-terms a{
    color: #FFFFFF;
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
}
.policy-terms a:hover{
    text-decoration: underline;
}
.address-li h6 {
    margin-bottom: 14px;
    font-weight: 600;
}
.address-li p{
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-top: 10px;
}
.address-li p::before{
    content: "\f3c5";
    font-family: 'FontAwesome';
    font-size: 20px;
    color:  #0FAFB7;
}
.address-li a{
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    color: #fff;
    display: flex; 
    align-items: flex-start;
    gap: 15px;
    margin-top: 10px;
    transition: all 0.2s;
}
.address-li a:hover{
    color: #0FAFB7;
}
.address-li a::before{
    font-family: 'FontAwesome';
    font-size: 20px;
    color:  #0FAFB7;
}
.telto::before{
    content: "\f095";
}
.mailto::before{
    content: "\f0e0";
}
.footer-logo h6 {
    margin-bottom: 14px;
    margin-top: 32px;
    font-weight: 600;
    color: #fff;
}
.social-a{
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    width: 100%;
    max-width: 210px;
}
.social-a a{
    width: 40px;
    height: 40px;
    transition: all 0.4s;
    /* border-radius: 100%; */
    /* background-color: #0FAFB7; */
    /* color: #fff; */
    /* display: flex; */
    /* align-items: center; */
    /* justify-content: center; */
}
.social-a a img{
    width: 100%;
    opacity: 0.6;
    transition: all 0.4s;
}
.social-a a:last-child img{
    border-radius: 100%;
}
.social-a a img:hover{
    opacity: 1;
}   
.social-a a:hover{
    /* background-color: #fff;
    color: #000; */
}
.social-a a::after{
    /* font-family: 'FontAwesome';
    font-size: 20px; */
}
/* .fbook::after{
    content: "\f39e";
}
.twiter::after{
    content: "\f099";
}
.insta::after{
    content: "\f16d";
}
.linkdin::after{
    content: "\f0e1";
} */
@media only screen and (max-width: 768px) {
    .footer-area {
        /* text-align: center; */
        padding: 40px 25px;
    }
    .footer-links-icons{
        flex-direction: column;
        gap: 40px;
        margin-bottom: 40px;
    }
    .footer-logo {
        width: 100%;
        text-align: center;
    }
    .links-box {
        width: 100%;
    }
    .social-links {
        width: 100%;
    }
    .footer-logo > img{
        max-width: 150px;
    }
    .social-a{
        margin: auto;
        justify-content: center;
    }
    .copyright-bottom {
        padding-top: 40px;
        gap: 20px;
        text-align: center;
        flex-direction: column;
    }
    .copyright-bottom p{
        width: 100%;
        max-width: 250px;
        margin: auto;
    }
    .policy-terms {
        justify-content: center;
    }
    .footer-links ul li ,.address-li a ,.address-li p{
        margin-top: 7px;
    }
}
  
/* privacy policy and terms and condition page */
.policy-terms-div h2{
    color: #0FAFB7;
    text-align: center;
    margin-bottom: 32px;
}
.policy-terms-div h3 ,.policy-terms-div h4 , .policy-terms-div h5{
    margin-top: 24px;
    margin-bottom: 15px;
}
.policy-terms-div p{
    margin-top: 24px;
}
.policy-terms-div ul li {
    font-size: 16px;
    line-height: 26px;
    margin-top: 10px;
    font-weight: 400;
    /* display: flex; */
    /* align-items: center; */
    position: relative;
    color: #FFFFFF;
    padding-left: 30px;
}
.policy-terms-div ul li::before {
    content: "";
    background-image: url('/wp-content/themes/codebuddys/assets/images/check.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: absolute;
    width: 20px;
    height: 20px;
    left: 0px;
    top: 5px;
}
.policy-terms-div ul li a , .policy-terms-div p a , .policy-terms-div a {
    color: #0FAFB7;
}
.policy-terms-div ul li a:hover , .policy-terms-div p a:hover , .policy-terms-div a:hover{
    text-decoration: underline;
}