*,
*:before,
*:after {
  box-sizing: border-box;
}
header {
    background-color: #e8fae9;
}
.banner-section{padding:30px 0px 80px;position: relative;background-color: #E8FAE9;text-align: center;}
.left_content{width: 100%;margin-bottom: 60px;position: relative;max-width: 630px;}
.left_content h1{font-size: 51px;line-height:66px;font-family: 'Zoho_Puvi_ExtraBold';margin-bottom: 10px;}
.left_content p{font-size:18px;line-height: 32px; font-family:'Zoho_Puvi_Regular',sans-serif;max-width: 602px;margin:0 auto 30px;}
.banner_inner{display: flex;align-items: center;justify-content: center;background: url(/sites/zweb/images/contracts/contract-approval/banner-img.png) no-repeat;background-size: 1140px;background-position: center; height: 855px;}

.ca-importance-section{padding: 50px 0 120px;position: relative;}
.ca-importance-section::before{content: ""; position: absolute;left: 0;top: 0;width: 100%;height: 50%;background-color: #E8FAE9;z-index: -1;}
.ca-importance-inner{background: #435DC0;border-radius: 15px;color: #fff;padding: 100px;position: relative;}
.ca-importance-inner h2{font-size: 42px;line-height:56px;text-align: center;max-width: 560px;margin: 0 auto 15px;font-family: 'Zoho_Puvi_Bold';}
.ca-importance-inner h2+p{max-width: 630px;text-align: center;margin: 0 auto 20px;}
.ca-importance-inner::after{ content: '';position: absolute;right: 5px;top: 45px;width: 0;height: 0;border-left: 80px solid transparent;border-right: 80px solid transparent;border-top: 80px solid #647CDB;transform: rotate(45deg);}
.ca-importance-inner::before{ content: '';position: absolute;right: -62px;top: -13px;width: 0;height: 0;border-left: 85px solid transparent;border-right: 85px solid transparent;border-bottom: 85px solid #E8FAE9;transform: rotate(45deg);}

.ca-imp-list h3{font-size:24px;font-family: 'Zoho_Puvi_SemiBold';margin: 20px 0;}
.ca-imp-list h3 span{width: 51px;height: 51px;background: #fff;display: inline-block;border-radius: 100%;position: relative;margin-right: 15px;vertical-align: middle;}
.ca-imp-list h3 span::after{content: ""; background:url(/sites/zweb/images/contracts/contract-approval/ca-sprite.png);background-size: 260px;position: absolute;}
.ca-imp-list .ca-imp-list1 span::after{background-position: -4px -6px;top: 11px;right: 13px;width: 24px;height: 26px;}
.ca-imp-list .ca-imp-list2 span::after{background-position: -53px -4px;top: 13px;right: 13px;width: 24px;height: 26px;background-size: 220px;}
.ca-imp-list .ca-imp-list3 span::after{background-position: -26px -4px;top: 13px;right: 13px;width: 24px;height: 26px;background-size: 220px;}
.ca-imp-list .ca-imp-list4 span::after{background-position: -93px -6px;top: 11px;right: 13px;width: 26px;height: 26px;}
.ca-imp-list{display: flex;justify-content: space-around;margin-top: 20px;}

.clm-benefits-inner h2{font-size: 42px;line-height:56px;max-width: 380px;font-family: 'Zoho_Puvi_Bold';}
.clm-benefits-inner h2+p{max-width: 660px;}
.clm-flex{display: flex;margin-top: 50px;flex-wrap: wrap;justify-content: space-between;}
.clmflx-list{background: #E8FAE9;border-radius: 15px;padding: 35px 25px 25px;margin: 9px 0;text-align: center;width: 24%;display: flex;align-items: center;flex-direction: column;justify-content: space-around;min-height: 300px;}
.clmflx-list h4{font-size: 18px;font-family: 'Zoho_Puvi_Bold';line-height: 26px;margin-bottom: 30px;}

.approval-zc-section{margin: 120px 0;background: #222328;padding-bottom: 80px;}
.approval_head{background: #fff;position:relative; top:-1px;}
.approval-zc-section h1{font-size: 51px;line-height:66px;font-family: 'Zoho_Puvi_ExtraBold';margin: 0 auto 70px;color: #fff;}
.approval-zc-inner h2{font-size: 42px;line-height:56px;max-width: 405px;font-family: 'Zoho_Puvi_Bold';color: #F7D78F;}
.approval-zc-inner h2+p{max-width: 710px;color: #fff;margin-bottom: 0;}
.approval-zc-inner{padding: 120px 0 20px;}
.sequential_approval{background: #F7F0C8;}
.parallel_approval{background: #DFF7D6;}
.approval_flx{display: flex;justify-content: space-evenly;align-items: center; border-radius: 15px;margin: 120px 0;padding: 100px 0;position: relative;}
.approval_flx h3,.get_content h4{font-size: 26px;line-height: 54px;font-family: 'Zoho_Puvi_Bold';margin-bottom: 0px;}
.approval_flx p,.get_content p{margin-bottom: 0;}
.sequential_content,.parallel_content{max-width: 390px;width: 45%;}
.sequential_img,.parallel_img{max-width: 45%;}
.zc_threads{position: absolute;z-index: 1;}
.zc_threads1{left: -40px;top: -80px;}
.zc_threads2{right: 19%;bottom: -58px;z-index: 0;}
.zc_threads3{right: -55px;top: 20%;z-index: 0;}
.zc_threads4{left: 5%;bottom: -26px;}

.get-reviews-inner h2{font-size: 42px;line-height:56px;font-family: 'Zoho_Puvi_Bold';}
.get-reviews-inner h2 span{background: url(/sites/zweb/images/contracts/contract-approval/ca-sprite.png);background-size: 240px;display: inline-block;width: 36px;height: 51px;background-position: -114px -9px;vertical-align: bottom;}
.get_flex{display: flex;align-items: center;justify-content: space-between;margin: 40px 0px;}
.get_content,.get_img{width: 46%;margin: 50px 0px;position: relative;}
.get_content{max-width: 490px;}
.automated_inner_img{position: absolute;background: url(/sites/zweb/images/contracts/contract-approval/ca-sprite.png);background-size: 300px;width: 107px;height: 110px;background-position: -191px 0px;bottom: -15px;right: 110px;left: 0;margin: auto;animation: 3s ease infinite normal none running floatY 1.3s;}
.modern-toolkit-section{background: #435DC0;padding: 120px 0;margin-top: 100px;}
.modern-toolkit-inner h2{font-size: 42px;line-height: 54px;color: #F7D78F;margin-bottom: 65px;}
.toolkit_flex{display: flex;}
.toolkit_accordian,.toolkit_img{width: 50%;}
.toolkit_accordian{padding-right: 50px;color: #fff;margin-right: 80px;}
.toolkit-list h4{font-size: 26px;margin-bottom: 10px;position: relative;cursor: pointer;}
.toolkit-list p{margin-bottom: 0;display: none;max-width: 405px;}
.toolkit-list{padding: 40px 20px 0px 80px;transition: background ease 1s;}
.toolkit-list.active{background: #F2F4FE1F;border-radius: 15px;padding: 40px 20px 40px 80px;}
.toolkit-list.active h4{color: #F7D78F;}
.toolkit-list:first-child p{display: block;}
.toolkit-list h4::before{ content: " ";width: 20px;height: 2px;position: absolute; top: 17px;left: -45px;background:#fff;}
.toolkit-list h4::after{ content: " ";width: 2px;height: 20px;position: absolute; top: 8px;left: -36px;background:#fff;}
.toolkit-list.active h4::before{background: #F7D78F;}
.toolkit-list.active h4::after{content: none;}
.toolkit_img{max-width: 460px;height: 640px;background: url(/sites/zweb/images/contracts/contract-approval/mordern_toolkit.png) no-repeat;background-size: 1280px;background-position: 0 0;border-radius: 10px;position: relative;transition: all ease 1s;}
.toolkit_tabs{position: absolute;display: none;}
.toolkit_tab0{top: 73px;left: 2px;display: block;}
.toolkit_tab1{top: 80px;margin: auto;right: 0;left: 0;box-shadow: 0px 21px 32px 0px rgb(0 0 0 / 12%);border-radius: 9px;}
.toolkit_tab3{top: 17px;margin: auto;right: 67px;}
.indicator{position: absolute;width: 16px;height: 16px;border-radius: 100%;background:#f0483e;box-shadow: 0 0 0 15px rgb(240 72 62 / 23%);   animation: waveIndicator 1s infinite;right: 0;left: 0px;margin: auto;top: 120px;transition: all cubic-bezier(0.075, 0.82, 0.165, 1) 0.8s; }
.indicator.indicator1{right: 0;left: 200px;top: 320px;}
.indicator.indicator2{right: 0;top: 200px;left: 250px;}
.indicator.indicator3{left: 130px;top: 65px;}

.btm-section .content-wrap{text-align: center;padding: 120px 0;}
.btm-section h1{font-size: 42px; line-height: 54px;margin: 0 auto 30px;font-family: 'Zoho_Puvi_SemiBold';}

/*Animation start*/
@media only screen and (min-width:768px) {
.fadein {opacity: 0;-ms-filter: "alpha(opacity=0)";-webkit-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);-o-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86)}
.fadeinup {opacity: 0;-webkit-transform: translateY(30px);-ms-transform: translateY(30px);transform: translateY(30px);-ms-filter: "alpha(opacity=0)";-webkit-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);-o-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);}
.fadeinupcontent {opacity: 1;-webkit-transform: translateY(30px);-ms-transform: translateY(30px);transform: translateY(30px);-ms-filter: "alpha(opacity=0)";-webkit-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);-o-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);}
.fadeindown {opacity: 0;-webkit-transform: translateY(-30px);-ms-transform: translateY(-30px);transform: translateY(-30px);-ms-filter: "alpha(opacity=0)";-webkit-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);-o-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);}
.fadeinleft {opacity: 0;-webkit-transform: translateX(-30px);-ms-transform: translateX(-30px);transform: translateX(-30px);-ms-filter: "alpha(opacity=0)";-webkit-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);-o-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);}
.fadeinright {opacity: 0;-webkit-transform: translateX(30px);-ms-transform: translateX(30px);transform: translateX(30px);-ms-filter: "alpha(opacity=0)";-webkit-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);-moz-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);-ms-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);-o-transition: all 1000ms cubic-bezier(0.11, 0.16, 0.43, 0.86);}
.middle-animated .fadein {opacity: 1;-ms-filter: "alpha(opacity=100)"}
.middle-animated .fadeinup,.middle-animated .fadeinupcontent,.middle-animated .fadeindown {opacity: 1;-webkit-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);-ms-filter: "alpha(opacity=100)"}
.middle-animated .fadeinleft,.middle-animated .fadeinright,.middle-animated .fadeinleft,.middle-animated .fadeinright {opacity: 1;-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);-ms-filter: "alpha(opacity=100)"}
.delay1 {-webkit-transition-delay: 200ms;-o-transition-delay: 200ms;transition-delay: 200ms}
.delay2 {-webkit-transition-delay: 400ms;-o-transition-delay: 400ms;transition-delay: 400ms}
.delay3 {-webkit-transition-delay: 600ms;-o-transition-delay: 600ms;transition-delay: 600ms}
.delay4 {-webkit-transition-delay: 800ms;-o-transition-delay: 800ms;transition-delay: 800ms}
.delay5 {-webkit-transition-delay: 1000ms;-o-transition-delay: 1000ms;transition-delay: 1000ms}
.delay6 {-webkit-transition-delay: 1200ms;-o-transition-delay: 1200ms;transition-delay: 1200ms}
.delay7 {-webkit-transition-delay: 1400ms;-o-transition-delay: 1400ms;transition-delay: 1400ms}
.delay8 {-webkit-transition-delay: 1600ms;-o-transition-delay: 1600ms;transition-delay: 1600ms}
@keyframes floatX{
    0% {-webkit-transform: translateX(0);transform: translateX(0);}
    50% {-webkit-transform: translateX(-7px);transform: translateX(-7px);}
    100% {-webkit-transform: translateX(0);transform: translateX(0);} 
}
@keyframes floatY{
    0% {-webkit-transform: translateY(0);transform: translateY(0);}
    50% {-webkit-transform: translateY(-7px);transform: translateY(-7px);}
    100% {-webkit-transform: translateY(0);transform: translateY(0);} 
}

@keyframes waveIndicator {
    0% {box-shadow: none;}
    100% {box-shadow: 0 0 0 15px rgb(240 72 62 / 23%);} 
}


}
/*Animation End*/


/*responsive css*/

@media(max-width: 1199px){
.zc_threads{display: none;}
.banner_inner{background-size: 975px;height: 730px;}
.left_content h1,.approval-zc-section h1{font-size: 45px;line-height: 1.2;margin-bottom: 15px;}
.approval-zc-section h1{margin-bottom: 50px;}
.left_content p{font-size: 17px;line-height: 1.6;}
.ca-importance-section{overflow-x: hidden;}
.pagewrapper h2,.btm-section h1{font-size: 40px;line-height: 50px;}
.ca-imp-list h3{font-size: 20px;}
.get_content h4,.toolkit-list h4{font-size: 24px;}
.approval-zc-section,.approval_flx{margin: 80px 0;}
.approval-zc-section{padding-bottom: 40px;}
.approval_flx{padding: 80px 30px;}
.modern-toolkit-section{padding: 80px 0;margin-top: 80px;}
.ca-importance-section{padding-bottom: 80px;}
.ca-importance-inner{padding: 80px;}
.modern-toolkit-inner h2{margin-bottom: 45px;}
.approval-zc-inner{padding-top: 80px;}
.automated_inner_img{width: 91px;height: 96px; background-size: 260px;background-position: -167px 0px;bottom: -5px;right: 10px;}
.toolkit_accordian{margin-right: 50px;}
}

@media only screen and (max-width: 1023px){
  .toolkit-list{padding: 30px 20px 0px 70px;}
  .toolkit-list.active{padding: 30px 20px 30px 70px;}
  .toolkit_accordian{width: 45%;padding-right: 0;}
  .toolkit_flex{justify-content: space-between;}
}

@media(max-width: 991px){
  .pagewrapper h1, .pagewrapper h2, .pagewrapper h3, .pagewrapper h4 {line-height: normal;}
  .approval_flx h3,.get_content h4{margin-bottom: 10px;}
  .pagewrapper p{font-size: 15px;line-height: 1.8;}
  .banner-section{padding-bottom: 30px;}
  .banner_inner{background-size: 735px;height: 550px;}
  .left_content{max-width: 550px;}
  .left_content h1, .approval-zc-section h1{font-size: 42px;}
  .left_content p{max-width: 450px;}
  .left_content{margin-bottom: 0;}
  .pagewrapper h2, .btm-section h1{font-size: 38px;}
  .ca-importance-inner h2+p{max-width: 560px;}
  .ca-importance-inner{padding: 80px 50px;}
  .ca-imp-list{justify-content: space-between;}
  .ca-imp-list h3{font-size: 18px;margin: 15px 0;}
  .ca-imp-list h3 span{transform: scale(0.9);}
  .clmflx-list img{width: 145px;}
  .clmflx-list{min-height: 260px;padding: 30px 20px 25px;}
  .clmflx-list h4{margin-bottom: 15px;}
  .sequential_img, .parallel_img{max-width: 42%;}
  .clmflx-list h4{font-size: 16px;}
  .clm-benefits-inner h2+p{margin: 0 0 20px;}
  .approval-zc-inner h2+p{max-width: 600px;}
  .automated_inner_img{bottom: -10px;}
  .toolkit_img{display: none;}
  .toolkit_accordian{margin-right: 0;width: 100%;}
  .toolkit-list p{max-width: 95%;}
  .get_content h4, .toolkit-list h4{font-size: 22px;}
  .toolkit-list h4::before{top: 12px;}
  .toolkit-list h4::after{top: 3px;}
  .banner_inner{background: none;height: auto;}
}

@media(max-width: 767px){
.get_flex{flex-direction: column;align-items: center;margin:30px auto 0;max-width: 500px;}
.approval_flx,.get_flex2{flex-direction: column-reverse;align-items: center;}
.get_content, .get_img{margin: 30px 0 20px;}
.get_content{width: 100%;}
.get_img{width: 100%;text-align: center;max-width: 400px;}
.sequential_content, .parallel_content{width: 100%;margin-bottom: 30px;max-width: 500px;}
.sequential_img, .parallel_img{width: 350px;max-width: 100%;}
.left_content h1, .approval-zc-section h1{font-size: 40px;}
.banner-section{padding-bottom: 80px;}
.ca-importance-inner::before,.ca-importance-inner::after,.ca-importance-section::before{content: none;}
.ca-importance-section{background: #435DC0;}
.ca-importance-inner{padding: 70px 0 55px;}
.ca-importance-section{padding: 0;margin-bottom: 80px;}
.pagewrapper h2, .btm-section h1{font-size: 35px;}
.ca-imp-list{margin-top: 40px;}
.ca-imp-list{flex-direction: column;}
.clmflx-list{width: 210px;}
.clm-benefits-inner,.get-reviews-inner h2{text-align: center;}
.clm-benefits-inner h2{margin: 0 auto 15px;}
.clm-flex{max-width: 440px;margin: 50px auto 0;}
.btm-section .content-wrap{padding: 100px 0;}
.get-reviews-inner h2 span{vertical-align: middle;}
.left_content h1 br{display: block;}
.left_content h1{max-width: unset;}
}

@media(max-width: 480px){	
.approval_flx{padding: 80px 25px;}
.left_content h1,.approval-zc-section h1{font-size: 38px;}
.ca-imp-list h3{font-size: 15px;margin: 10px 0 0;line-height: 1.8;position: relative;display: flex;align-items: center;;}
.ca-imp-list h3 span{transform: scale(0.75);display: inline-block;min-width: 51px;min-height: 51px;}
.clm-flex{flex-direction: column;align-items: center;}
.clmflx-list{width: 240px;max-width: 100%;min-height: auto;}
.clmflx-list img{width: 130px;}
.get-reviews-inner h2 br,.modern-toolkit-inner h2 br{display: none;}
.automated_inner_img {width: 76px;height: 81px;background-size: 220px;background-position: -142px 0px;bottom: -2%;}
.toolkit-list,.toolkit-list.active{padding-left: 55px;}
.toolkit-list h4::before{width: 15px;top: 12px;left: -32px;}
.toolkit-list h4::after{height: 15px;left: -26px;top: 5px;}
.left_content h1 br{display: none;}
}