/***Authored by Preethi R***/
@charset "utf-8";
.okr #banner .banner-content .banner-title{font-size: 48px;font-family: o-bold;margin-bottom: 30px;}
.okr #banner {background-image: url("../img/okr-banner-back.png");background-repeat: no-repeat;background-size: cover;}
.okr #banner .banner-content .button-align .col-md-6 .button{	background: linear-gradient(to right, #5a4d9f 50%, #fafafa 50%)!important;
	background-size: 200% 100%!important;
	background-position: right bottom!important;
	transition: .5s ease-out!important;
	padding: 15px 35px!important;
	font-family: l-bold!important;
	font-size: 16px!important;
	text-decoration: none!important;
	text-transform: uppercase!important;
	letter-spacing: 1px!important;
	border: 1px solid #5a4d9f;
	color: #000 !important;
}
.okr #banner .banner-content .button-align .col-md-6:nth-child(2) .button{background-image: linear-gradient(to right, #5a4d9f 50%, #ffc65a 50%) !important;border: 0px;background-size: 202% 100% !important;}
.okr #banner .banner-content .button-align .col-md-6 .button:hover {
  background-position: left bottom !important;
  color: #fff !important;
}
/*
.okr #banner .banner-content .button-align .col-md-6:nth-child(2) .button {
  background-position: left bottom !important;
  color: #fff !important;
}
.okr #banner .banner-content .button-align .col-md-6:nth-child(2) .button{	background: linear-gradient(to right, #5a4d9f 50%, #fafafa 50%)!important;
	background-size: 200% 100%!important;
	background-position: right bottom!important;
	transition: .5s ease-out!important;
	padding: 15px 35px!important;
	font-family: l-bold!important;
	font-size: 16px!important;
	text-decoration: none!important;
	text-transform: uppercase!important;
	letter-spacing: 1px!important;
	border: 1px solid #5a4d9f;
	color: #000 !important;
}
*/
/*the okr ai*/
.the-okr-ai {margin: 60px 0px;background-color: #F7F5FC;padding: 80px 0px 70px;}
.the-okr-ai .the-okr-ai-title{font-family: o-bold;font-size: 40px;color: #2B2B2B;text-align: center;margin-bottom: 30px;}
.the-okr-ai .the-okr-ai-para {font-family: l-regular;font-size: 18px;text-align: center;}
.the-okr-ai #slider {background:#F7F5FC!important;}
.the-okr-ai .slider {background:#F7F5FC!important;}
/*
.okr #banner .chosen{  
padding: 16px;
  border-radius: 12px;

background:
  linear-gradient(
    180deg,
    rgba(167, 181, 255, 0.01),
    rgba(243, 172, 255, 0.01)
  ) padding-box,
  linear-gradient(
    180deg,
    rgb(167, 181, 255),
    rgb(243, 172, 255)
  ) border-box;
}
*/
.okr #banner .chosen{
border: 1px transparent;
  border-radius: 40px;
  background-image: linear-gradient( 90deg, #F5E3F9, #E4E8FF),linear-gradient(to right, #F3ACFF, #A7B5FF);
  padding: 2px;
  width: 800px;
  margin: 0 auto;
  font-family: l-bold;
  color: #5a4d9f;
  font-size: 18px;
  display: flex;
  align-items: center;
  background-origin: border-box;
	background-clip: content-box,border-box;}


/*
.okr #banner .chosen .chosen-back{
background:linear-gradient(180deg, rgba(167, 181, 255, 0.08), rgba(243, 172, 255, 0.08)) padding-box,linear-gradient(180deg,rgb(167, 181, 255),rgb(243, 172, 255)) border-box;}
*/
.okr #banner .chosen img{float: left;margin-left: 10px;}
.okr #banner .chosen p{position: relative;top: 6px;
  left: 23px;}
/*
.okr #banner .banner-content .synergita {
  font-family: o-regular;
  font-size: 20px;
  width: 712px;
  text-transform: capitalize;
  margin-bottom: 40px;
}
.okr #banner .banner-content .banner-title {
  font-family: o-medium !important;
  font-size: 64px;
  margin-bottom: 20px;
  font-weight: 600;
}
.okr #banner .banner-content .banner-title span {
  animation: 10s infinite animate1;
}
.okr #banner .banner-content .banner-title span::before {
  content: "Intuitive OKR";
  animation: 10s infinite animate;
  padding-left: 10px;
}
*/
/*
@keyframes animate {
  0% {
    content: "Intuitive OKR";
  }
  25% {
    content: "Innovative OKR";
  }
  50% {
    content: "Proactive OKR";
  }
  75% {
    content: "Powerful OKR";
  }
}
*/
/*
@keyframes animate1 {
  0% {
    background: linear-gradient(90deg, #8783ff 0, #8783ff 93.46%);
    -webkit-background-clip: text;
  }
  25% {
    background: linear-gradient(90deg, #ffc65a 0, #ffc65a 93.46%);
    -webkit-background-clip: text;
  }
  50% {
    background: linear-gradient(90deg, teal 0, teal 93.46%);
    -webkit-background-clip: text;
  }
  75% {
    background: linear-gradient(90deg, #ff63b7 0, #ff63b7 93.46%);
    -webkit-background-clip: text;
  }
}
*/
/*
.okr #banner .banner-content .button {
  font-family: l-bold !important;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  background-size: 203% 100%;
}
*/
.okr .banner-video{padding-bottom: 100px;}
.okr .banner-video .banner-video-title{font-family: o-bold;font-size: 40px;text-align: center;margin-bottom: 60px;}
.okr .banner-video .button, .okr .use-ai .button, .quick-look .button{	border-radius: 100px;
	background: linear-gradient(to right, #5a4d9f 50%, #ffc65a 50%);
	background-size: 200% 100%;
	background-position: right bottom;
	transition: .5s ease-out;
	padding: 15px 35px;
	font-family: l-bold;
	color: #2b2b2b;
	font-size: 16px;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
cursor: pointer;}
.okr .banner-video .button:hover, .okr .use-ai .button:hover, .quick-look .button:hover {
	background-position: left bottom;
	color: #fff
}
.okr .banner-video p{font-family: l-regular;font-size: 18px;}
.okr .banner-video .okr-banner-ai{margin-bottom: 60px;}
.okr .banner-video .v-div {border-radius: 260px;margin-top: 17px;background: linear-gradient(to right, #a7b5ff 0, #f3acff 100%); width: fit-content; padding:10px;position: relative;z-index: 1;}
.okr .banner-video .v-div img {border-radius: 500px;cursor: pointer;width: 100%;}
.okr .banner-video .v-div .okr-vicon {position: absolute;margin: auto;top: 0;bottom: 0;left: 0;right: 0;border-radius: 10px important;
width: 65px;}
/*.okr .banner-video .v-div-content{margin-top: 17px;}*/
.okr .banner-video .col-md-6{align-content: center;}
.okr #okr-video .modal-dialog {width: 700px;max-width: 700px;height: 400px;}
.okr #okr-video .modal-content {width: 700px;height: 400px;}
.okr #okr-video .modal-header {border-bottom: 0px;padding: 0;}
.okr #okr-video .modal-header .btn-close {background-size: 10px;padding: 0px;background-color: white;position: absolute;right: 2px;
opacity: 1;z-index: 1;width: 25px;height: 25px;border-radius: 25px;}
.okr #okr-video .modal-body {padding: 0px;}
.okr #okr-video .modal-body iframe {width: 100%;height: 100%;object-fit: cover;}
.okr .banner-video .v-div video {border-radius: 260px;width: 790px;height: 400px;}
/*Feature and benefits*/
.okr .features-benefits .febe-title{font-family: o-bold;font-size: 40px;text-align: center;margin-bottom: 50px;}
.okr .features-benefits {margin: 0px 0px 30px;background-color: #F7F5FC;padding: 40px 0px;}
.okr .features-benefits .febe-grid {background-color: #fff;padding: 20px 20px;border-radius: 25px;border: 1px solid #E8E8E8;margin-bottom: 60px;min-height: 400px;}
.okr .features-benefits .febe-grid:first-child{margin-right: 40px;}
.okr .features-benefits .febe-grid .febe-grid-box{background: linear-gradient(to bottom,rgba(167, 181, 255, 0.2),rgba(243, 172, 255, 0.2));padding: 30px 20px;border-radius: 25px;min-height: 355px;}
.okr .features-benefits .febe-plus-second .febe-grid .febe-grid-box{min-height: 320px;}
.okr .features-benefits .febe-grid .febe-grid-box p{font-family: o-semibold;margin-top: 20px;font-size: 24px;line-height: 35px;}
.okr .features-benefits .febe-grid .col-md-7 p{font-family: l-regular;font-size: 16px;}
.okr .features-benefits .febe-grid .col-md-7 ul li{font-family: l-regular;font-size: 16px;}
.okr .features-benefits .febe-plus{position: relative;}
.okr .features-benefits .febe-plus img{position: absolute;left: 462px;top: -105px;}
/*Who Is Synergita*/
.okr .work-values {margin-top: 140px;position: relative;padding-bottom: 60px;}
.okr .work-values.first .pie-circle img{float: right;}
.okr .work-values.last{padding-top: 40px;}
.okr .work-values .flower-bg {width: 100px;position: absolute;left: -11px;}
.okr .work-values.first .work-values-title h2{font-family: o-bold;font-size: 40px;line-height: 50.4px;margin-bottom: -40px;} 
.okr .work-values.first .work-values-title span{color: #008080;}
.okr .work-values .chess-bg {width: 17%;position: absolute;right: 0;}
.okr .work-values .swiper-pagination-bullet {background-color: #FFFFFF;opacity: unset;}
.okr .work-values .swiper-pagination-bullet-active {background-color: #FFC65A;}
.okr .work-values .card {border: none;}
.okr .work-values .right-section-okr {margin-top: -160px;}
.okr .work-values .card .card-value-title h5 {font-family: o-bold;font-size: 20px;}
.okr .work-values .card .card-value-title{margin-bottom: 10px;}
.okr .okr-whois-title .okr-who-is{font-family: o-bold;font-size: 40px;text-align: center;}
.okr .work-values .card-body {padding: 25px;}
.okr .work-values .card-value-title h5 {font-family: 'o-medium', sans-serif;font-size: 24px;font-weight: 600;color: var(--dark-grey);letter-spacing: 1px;transition: color .5s;}
.okr .work-values .card-text {font-family: 'l-regular', sans-serif;color: var(--light-grey);font-size: 16px;transition: color .5s;}
.okr .work-values .card-value-title img {margin-right: 15px;margin-bottom: 24px;}
.okr #positions {margin-top: 80px;}
.okr #positions .positions-wrapper {position: relative;border-radius: 40px;background-color: #f8f7ff;overflow: hidden;}
.okr #positions .positions-wrapper .circle-1 {position: absolute;bottom: -140px;right: -10px;width: 250px;aspect-ratio: 1;border-radius: 50%;background: radial-gradient(circle, transparent 67%, #DF99F7 68%, #FFDBB0 77%);opacity: 0.4;}
.okr #positions .positions-wrapper .circle-2 {position: absolute;bottom: -103px;right: -139px;width: 250px;aspect-ratio: 1;border-radius: 50%;background: radial-gradient(circle, transparent 67%, #A7B5FF 68%, #F3ACFF 77%);opacity: 0.4;}
.okr #positions .positions-wrapper h2 {padding: 148px 15px;font-family: 'o-medium', sans-serif;font-weight: 600;font-size: 38px;color: var(--dark-grey);}#life {margin-top: 100px;margin-bottom: 100px;}
.okr #rl-content .pie-circle, #rl-content-1 .pie-circle {background-color: #cde2e0;width: 70%;height: 100%;position: absolute;right: 0;border-radius: 35% 0px 0px 35%;}
.okr #rl-content .ani, #rl-content-1 .ani{background: linear-gradient(to left,rgba(223, 153, 247, 0.9),rgba(255, 219, 176, 0.9));width: 43%;height: 70%;position: absolute;left: 0;border-radius: 0px 42% 42% 0px;top: 0;}
#rl-content-1 .swiper .swiper-slide img{margin-top: -160px;transition: .5s;}
#rl-content-1 .swiper .swiper-slide img:hover {transform: scale(1.1);}
/*use AI to*/
.use-ai .use-ai-title{font-family: o-bold;font-size:40px;text-align: center;margin-bottom: 60px;}
.use-ai{background-color: #F7F5FC;padding: 50px 0px;}
.use-ai p{margin-bottom: 25px;}
.use-ai ul{margin-bottom: 40px;}
.use-ai img{width: 100%;}
/*why-switch*/
.why-switch .why-switch-title{font-family: o-bold;font-size: 40px;text-align: center;margin: 50px 0px 50px;}
.why-switch .why-switchg-grid:hover .owg{display:none;}
.why-switch .why-switchg-grid .owg{display:block;}
.why-switch .why-switchg-grid:hover .owgh{display:block;}
.why-switch .why-switchg-grid .owgh{display:none;}
.why-switch .row:nth-child(2) {margin-bottom: 40px;}
.why-switch .why-switchg-grid{border: 1px solid rgba(43, 43, 43, 0.25);padding: 30px;border-radius: 25px;min-height: 290px;}
.why-switch .why-switchg-grid .why-subtitle{font-family: o-semibold;font-size: 20px;margin: 15px 0px;}
.why-switch .why-switchg-grid.one:hover{border:1px solid #F7BD72;box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.why-switch .why-switchg-grid.two:hover{border:1px solid #EB97FF;box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.why-switch .why-switchg-grid.three:hover{border:1px solid #96C6ED;box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.why-switch .why-switchg-grid.four:hover{border:1px solid #65EAD2;box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.why-switch .why-switchg-grid.five:hover{border:1px solid #A4D777;box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.why-switch .why-switchg-grid.six:hover{border:1px solid #AB6AFE;box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.why-switch .why-switchg-grid.one:hover .why-subtitle{color: #F7BD72;}
.why-switch .why-switchg-grid.two:hover .why-subtitle{color: #EB97FF;}
.why-switch .why-switchg-grid.three:hover .why-subtitle{color: #96C6ED;}
.why-switch .why-switchg-grid.four:hover .why-subtitle{color: #65EAD2;}
.why-switch .why-switchg-grid.five:hover .why-subtitle{color: #A4D777;} 
.why-switch .why-switchg-grid.six:hover .why-subtitle{color: #AB6AFE;}
.why-switch .why-switchg-grid p{font-family: l-regular;font-size: 18px;}
/*quick look*/
.quick-look img{margin: auto;width: 60px;height: 60px;animation: mymove 5s infinite;display: flex;}
.quick-look .quick-look-title{font-family: o-bold;font-size: 40px;text-align: center;margin: 35px 0px;}
.quick-look .quick-look-grid{min-height: 360px;}
.quick-look .col-md-12{font-family: l-regular;font-size: 18px;text-align: center;margin: 30px 0px;}
.quick-look .quick-look-grid .quick-look-subtitle{font-family: o-semibold;font-size: 32px;}
.quick-look .quick-look-grid.one {background-color: rgba(254, 250, 224, 0.5);border: 1px solid #A4D777;padding: 30px;border-radius: 24px;}
.quick-look .quick-look-grid.one .quick-micro-title{color: #5A4D9F;font-family: o-bold;font-size: 40px;}
.quick-look .quick-look-grid.one p, .quick-look .quick-look-grid.two p, .quick-look .quick-look-grid.three p{font-family: l-regular;font-size: 16px;color: #9B9B9B;}
.quick-look .quick-look-grid.two {background-color: rgba(241, 250, 238, 0.5);border: 1px solid #D3D3D3;padding: 30px;border-radius: 24px;}
.quick-look .quick-look-grid.two .quick-micro-title span{color: #5A4D9F;font-family: o-bold;font-size: 40px;padding-right: 10px;}
.quick-look .quick-look-grid.two .quick-micro-title, .quick-look .quick-look-grid.three .quick-micro-title{display: flex;align-items: center;}
.quick-look .quick-look-grid.two .quick-micro-title{color: #2B2B2B;}
.quick-look .quick-look-grid.three .quick-micro-title{color: #FFFFFF;}
.quick-look .quick-look-grid.three {background-color: #2B2B2B;border: 1px solid #D3D3D3;padding: 30px;border-radius: 24px;color: #fff;}
.quick-look .quick-look-grid.three .quick-micro-title span{ background: linear-gradient(to top, #DF99F7, #FFDBB0);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;color: transparent;font-family: o-bold;font-size: 40px;padding-right: 10px;}
.quick-look .quick-look-grid.three .quick-look-subtitle span{font-family: l-bold!important;background-color: #CDE2E0;color: #2B2B2B;font-size: 16px;padding: 6px 10px;border-radius: 8px;margin-left: 10px;}
.quick-look .row:nth-child(2) .col-md-12{margin-top: 60px;}



.okr #lr-content .container {
  background: #f8f7ff;
  border-radius: 10px;
  margin-top: -345px;
  width: 95%;
  padding: 375px 40px 0;
  margin-bottom: 100px;
  max-width: 95%;
  position: relative;
}
.okr #lr-content .container > img {
  position: absolute;
  top: 260px;
  opacity: 0.3;
  left: 0;
}
.okr #lr-content .row {
  display: flex;
  align-items: center;
  width: 1070px;
  margin: 0 auto;
}
.okr #lr-content .v-div img {
  width: 100%;
  object-fit: cover;
  border-radius: 10px 10px 0 0;
}
.okr #integration .container,
.okr #lr-content .banner-content {
  position: relative;
}
.okr #lr-content h2 {
  font-family: o-semibold;
  font-size: 36px;
  margin-bottom: 30px;
}
.okr #lr-content p {
  color: #9b9b9b;
  font-size: 20px;
  margin-bottom: 30px;
  font-family: l-regular;
  text-transform: capitalize;
}
.okr #goals {
  margin: 70px auto 0;
  position: relative;
  padding-bottom: 100px;
}
.okr #goals h3,
.okr #goals h1 {
  font-family: o-semibold;
  font-size: 48px;
  color: #2b2b2b;
  text-transform: capitalize;
}
.okr #goals .banner-content {
  position: relative;
  height: 695px;
  margin: 0 auto;
}
.okr #goals .base,
.okr #goals .middle {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.okr #goals .base {
  bottom: 0;
}
.okr #goals .middle {
  bottom: 100px;
  z-index: 1;
}
.okr #goals .g-c,
.okr #goals .g-l,
.okr #goals .top {
  z-index: 2;
  position: absolute;
}
.okr #goals .top {
  margin: 0 auto;
  left: 0;
  right: 0;
  bottom: 200px;
}
.okr #goals .g-c {
  margin: 0 auto;
  left: 0;
  right: 0;
  bottom: 300px;
}
.okr #goals .g-l {
  left: 250px;
  bottom: 225px;
}
.okr #goals .g-r {
  position: absolute;
  right: 105px;
  bottom: 150px;
}
.okr #goals .g-title {
  font-family: o-semibold;
  font-size: 32px;
  color: #5a4d9f;
}
.okr #goals .g-desc {
  font-family: l-regular;
  font-size: 16px;
  color: #9b9b9b;
  width: 355px;
}
.okr #goals .goal {
  position: absolute;
  top: 210px;
  bottom: 360px;
  margin: 0 auto;
  left: 0;
  right: 0;
}
.okr #goals .task {
  right: -50px;
  bottom: 220px;
  position: absolute;
}
.okr #goals .task .g-desc {
  width: 200px;
}
.okr #goals .process {
  left: -20px;
  position: absolute;
  bottom: 220px;
}
.okr #goals .right-pie {
  width: 50%;
  height: 100%;
  background: #f8f7ff;
  border-top-left-radius: 100%;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}
.okr #goals .mob-goal,
.okr #trust-deyond .carousel-control img:nth-child(2),
.okr #trust-deyond .mob-tvideo,
.okr #trust-deyond .top-client .carousel-indicators {
  display: none;
}
.okr #rl-content {
  padding: 200px 0;
  position: relative;
}
.okr #rl-content .pie-circle {
  width: 50%;
  height: 100%;
  background: #fefae0;
  border-bottom-right-radius: 100%;
  position: absolute;
  top: 0;
}
.okr #rl-content .row,
.okr #track .carousel-item .row {
  display: flex;
  align-items: center;
}
.okr #rl-content .banner-content {
  position: relative;
  padding-left: 30px;
}
.okr #rl-content .banner-content img {
  position: absolute;
  z-index: -1;
  right: 0;
  top: -77px;
}
.okr #rl-content .v-div img {
  border-radius: 10px;
  width: 100%;
}
.okr #rl-content h2 {
  font-family: o-semibold;
  font-size: 36px;
  color: #2b2b2b;
}
.okr #rl-content p {
  color: #9b9b9b;
  font-size: 20px;
  margin-bottom: 0;
  font-family: l-regular;
  line-height: 1.5;
  text-transform: none;
}
.okr #track {
  background: #fefae0;
  padding: 150px 0;
}
.okr #track .carousel-item {
  transition: transform 0.6s ease-in-out, -webkit-transform 0.6s ease-in-out;
}
.okr #track .carousel-item .row > .col-md-6:first-child {
  padding-right: 40px;
}
.okr #track .carousel-item p.count {
  font-family: o-regular;
  font-size: 32px;
  color: #2b2b2b;
}
.okr #track .carousel-item h3 {
  font-family: o-semibold;
  font-size: 40px;
  color: #2b2b2b;
}
.okr #track .carousel-item p {
  color: #9b9b9b;
  font-size: 24px;
  margin-bottom: 30px;
  font-family: l-regular;
}
.okr #track .carousel-item img {
  border-radius: 15px;
  width: 100%;
  background: #fff;
}
.okr #track .carousel-indicators {
  bottom: -115px;
  list-style: none;
}
.okr #track .carousel-indicators li {
  width: 24px;
  height: 5px;
  border: 0;
  background: #f2e1b1;
  margin: 0 2px;
  border-radius: 10px;
}
.okr #track .carousel-indicators li.active {
  background: #000 !important;
}
.okr #track .carousel-control {
  background: 0 0;
  width: fit-content;
  height: fit-content;
  top: -80px;
  position: absolute;
  border: 0;
}
.okr #track .left.carousel-control {
  right: 50px;
  left: auto;
}
.okr #track .right.carousel-control {
  right: 0;
  left: auto;
}
.okr #integration .animated {
  animation-duration: 3s;
}
.okr #integration {
  padding: 100px 0;
  position: relative;
  margin-bottom: 50px;
}
.okr #integration .left-pie {
  width: 50%;
  height: 70%;
  background: #f1faee;
  border-top-right-radius: 100%;
  position: absolute;
  bottom: 0;
}
.okr #integration .right-pie {
  width: 50%;
  height: 70%;
  background: #fefae0;
  border-top-left-radius: 100%;
  position: absolute;
  bottom: 0;
  right: 0;
}
.okr #cta .button,
.okr #integration .button {
  border-radius: 50px;
  font-family: l-bold;
  text-decoration: none;
  font-size: 16px;
}
.okr #integration .okr-smart-inte {
  font-family: o-semibold;
  font-size: 48px;
  width: 810px;
}
.okr #integration p {
  color: #9b9b9b;
  font-size: 24px;
  margin-bottom: 30px;
  font-family: l-regular;
  width: 988px;
}
.okr #integration .logos {
  position: relative;
  margin-top: 50px;
  min-height: 285px;
  margin-bottom: 90px;
}
.okr
  #integration
  .logos
  div:not(
    .okr #integration .logos div:nth-child(4),
    .okr #integration .logos div:nth-child(8),
    .okr #integration .logos div:nth-child(9),
    .okr #integration .logos div:nth-child(10)
  ) {
  position: absolute;
  background: #fff;
  box-shadow: 0 3px 6px #dbdbdb;
  height: 75px;
  width: 75px;
  padding: 15px;
  border-radius: 50%;
}
.okr #integration .logos div:first-child {
  left: 120px;
}
.okr #integration .logos div:nth-child(2) {
  left: 0;
  top: 125px;
}
.okr #integration .logos div:nth-child(3) {
  left: 120px;
  top: 245px;
}
.okr #integration .logos div:nth-child(5) {
  right: 120px;
}
.okr #integration .logos div:nth-child(6) {
  right: 0;
  top: 125px;
}
.okr #integration .logos div:nth-child(7) {
  right: 120px;
  top: 245px;
}
.okr #integration .logos div:nth-child(4) {
  top: 75px;
  position: absolute;
  left: 0;
  right: 0;
  width: 222px;
  margin: 0 auto;
}
.okr #integration .logos div img {
  margin-top: 5px;
}
.okr #integration .logos .u-line {
  width: 679px;
  margin-top: 79px;
}
.okr #integration .logos .m-line {
  width: 914px;
}
.okr #integration .logos .d-line {
  width: 679px;
}
/*
.okr #integration .button {
  color: #000;
  background: #fff;
  padding: 10px 30px;
  letter-spacing: 1px;
  word-spacing: 2px;
}
*/
.okr #integration .button{	background: linear-gradient(to right, #5a4d9f 50%, #fafafa 50%)!important;
	background-size: 200% 100%!important;
	background-position: right bottom!important;
	transition: .5s ease-out!important;
	padding: 15px 35px!important;
	font-family: l-bold!important;
	font-size: 16px!important;
	text-decoration: none!important;
	text-transform: uppercase!important;
	letter-spacing: 1px!important;
	border: 1px solid #5a4d9f;
	color: #000 !important;
}
.okr #integration .button:hover {
  background-position: left bottom !important;
  color: #fff !important;
}

.okr #trust-deyond .see h2{text-align: center;font-family: o-semibold;font-size: 40px;margin-bottom: 30px;}
.okr #trust-deyond .trust {
  background: #f8f7ff;
}
.okr #trust-deyond .okr-trust-title {
  font-size: 50px;
  font-family: o-semibold;
}
.okr #trust-deyond .trust .t-p {
  font-family: l-regular;
  font-size: 16px;
}
.okr #trust-deyond .trust-gif a {
  font-family: l-bold;
  font-size: 16px;
}
.okr #trust-deyond .trust .top {
  position: absolute;
  right: 0;
  top: 0;
  width: 196px;
}
.okr #trust-deyond .hr-head {
  margin-top: 90px;
  display: flex;
  align-items: center;
}
.okr #trust-deyond .trust hr {
  margin-top: -23px;
  width: 250px;
  margin-right: -60px;
  border-top: 0;
  margin-bottom: 33px;
  height: 5px;
  background: linear-gradient(270deg, #a7b5ff 0, #f3acff 117.6%);
}
.okr #trust-deyond .trust .hr-head img {
  width: 100%;
}
.okr #trust-deyond .carousel-control {
  background: 0 0;
  width: fit-content;
  height: fit-content;
  top: auto;
  bottom: 75px;
  opacity: 1;
}
.okr #trust-deyond .left.carousel-control {
  right: 110px;
  left: auto;
}
.okr #trust-deyond .right.carousel-control {
  right: 60px;
}
.okr #trust-deyond .carousel-control img {
  width: 50px;
}
.okr #cta {
  margin-bottom: 40px;
  margin-top: 40px;
}
.okr #cta .container {
  width: 95%;
  max-width: 95%;
}
.okr #cta center {
  background: url("../img/cta.png") 0 0 / cover no-repeat;
  padding: 100px 50px 112px;
  border-radius: 20px;
}
.okr #cta .okr-cta-title {
  font-family: o-semibold;
  font-size: 40px;
  margin-bottom: 30px;
}
.okr #cta .button {
  color: #2b2b2b;
  background: linear-gradient(to right, #ffc65a 50%, #fff 50%);
  background-size: 202% 100%;
  background-position: right bottom;
  transition: 0.5s ease-out;
  padding: 12px 32px;
  text-transform: uppercase;
}
.okr #cta .button:hover {
  background-position: left bottom;
  color: #2b2b2b;
}
@media (min-width: 992px) and (max-width: 1199px) {
.okr .features-benefits .febe-grid {min-height: 435px;}
.okr .features-benefits .febe-plus img {left: 377px!important;}
.why-switch .why-switchg-grid {min-height: 370px;}
.quick-look .quick-look-grid {min-height: 385px;}
.okr #lr-content .container {
    padding: 425px 40px 0;
  }
  .okr #lr-content .row {
    width: 875px;
  }
  .okr #lr-content h2 {
    font-size: 42px;
  }
  .okr #goals .banner-content {
    height: 640px;
  }
  .okr #goals .base {
    width: 60%;
  }
  .okr #goals .middle {
    width: 40%;
    bottom: 80px;
  }
  .okr #goals .top {
    width: 20%;
    bottom: 170px;
  }
  .okr #goals .g-l {
    left: 245px;
    bottom: 165px;
    width: 70px;
  }
  .okr #goals .g-r {
    right: 140px;
    bottom: 105px;
    width: 80px;
  }
  .okr #goals .g-c {
    bottom: 240px;
  }
  .okr #goals .goal {
    top: 205px;
  }
  .okr #goals .task {
    right: 0;
    bottom: 117px;
  }
  .okr #goals .process {
    left: -35px;
    bottom: 153px;
  }
  .okr #integration p {
    width: auto;
  }
  .okr #integration .logos .u-line {
    width: 550px;
  }
  .okr #integration .logos .m-line {
    width: 740px;
    margin-top: 20px;
  }
  .okr #integration .logos .d-line {
    width: 560px;
    margin-top: 20px;
  }
  .okr #trust-deyond .trust hr {
    width: 190px;
  }
  .okr #trust-deyond .trust .t-p {
    font-size: 16px;
  }
  .okr #trust-deyond .hr-head {
    margin-top: 40px;
  }
	.features-benefits .col-md-5, .features-benefits .col-md-7{width: 100%;}
	.features-benefits .col-md-7{min-height: 200px;}
	.okr .features-benefits .febe-plus-second .febe-grid .febe-grid-box {
		min-height: 220px;}
	.okr .features-benefits .febe-grid .febe-grid-box {min-height: 220px;align-content: center;margin-bottom: 25px;}
}
@media (min-width: 768px) and (max-width: 991px) {
.okr .banner-video .chosen {width: auto;}
.okr .banner-video .chosen p {left: 13px;top: 10px;}
.okr .banner-video .v-div img {width: 600px;}
.okr .banner-video .v-div img {width: 600px;}
.features-benefits .col-md-6{width: 100%;}
.okr .features-benefits .febe-grid {min-height: auto;}
.okr .features-benefits .febe-grid .febe-grid-box {min-height: auto;}
.okr .features-benefits .febe-plus img {display: none;}
.okr .banner-video .v-div {margin-bottom: 40px;}
.okr .work-values {padding-bottom: 20px;}
.okr .banner-video{padding-bottom: 40px;}
.okr .banner-video .button, .okr .use-ai .button, .quick-look .button {text-wrap: nowrap;}
.okr .banner-video .v-div-content{margin-bottom: 50px;}	
/*.okr .why-switch .col-md-4{width: 50%;}*/
.okr .why-switch .why-switchg-grid {min-height: 450px;margin-bottom: 0px;}
.okr .quick-look .quick-look-grid {min-height: 550px;}
.quick-look .quick-look-grid.one .quick-micro-title {line-height: 45px;}
.quick-look .quick-look-grid.two .quick-micro-title, .quick-look .quick-look-grid.three .quick-micro-title {display: block;}
.okr #rl-content-1 .swiper .swiper-slide img {margin-top: -494px;}
.okr #banner .chosen {width: auto;top: 14px;}
.okr #banner .chosen p{top: 9px;left: 10px;}
.okr .banner-video .v-div video {width: 600px;height: 360px;}
.okr .banner-video .v-div img {width: 100%;}
.okr #lr-content .container {padding: 370px 40px 0;}
.okr #lr-content .container > img {
    width: 100px;
  }
  .okr #lr-content .row {
    width: 650px;
  }
  .okr #integration .logos div:nth-child(4) img,
  .okr #lr-content .col-md-6,
  .okr #rl-content .col-md-6,
  .okr #track .col-md-6 {
    width: 100%;
  }
  .okr #rl-content {
    padding: 120px 0;
  }
  .okr #rl-content h2 {
    margin-top: 110px;
  }
  .okr #rl-content .banner-content {
    padding-left: 0;
  }
  .okr #goals .banner-content {
    height: 550px;
  }
  .okr #goals .base {
    width: 40%;
  }
  .okr #goals .middle {
    bottom: 33px;
    width: 30%;
  }
  .okr #goals .top {
    bottom: 75px;
    width: 20%;
  }
  .okr #goals .g-r {
    right: 175px;
    bottom: 55px;
    height: 70px;
  }
  .okr #goals .g-c {
    bottom: 125px;
  }
  .okr #goals .g-l {
    left: 190px;
    bottom: 80px;
    width: 70px;
  }
  .okr #goals .task {
    right: 15px;
    bottom: 20px;
  }
  .okr #goals .goal {
    top: 235px;
  }
  .okr #goals .process {
    left: 0;
    bottom: 25px;
  }
  .okr #goals .process .g-desc {
    width: 205px;
  }
  .okr #integration h3,
  .okr #integration p {
    width: auto;
  }
  .okr #integration .logos .u-line {
    width: 340px;
    margin-top: 105px;
  }
  .okr #integration .logos .m-line {
    width: 500px;
    margin-top: 20px;
  }
  .okr #integration .logos .d-line {
    width: 340px;
    margin-top: 20px;
  }
  .okr #integration .logos div:nth-child(4) {
    top: 100px;
    width: 120px;
  }
  .okr #trust-deyond .trust {
    padding: 30px;
  }
  .okr #trust-deyond h3 {
    font-size: 48px;
  }
  .okr #trust-deyond .trust hr {
    width: 120px;
    margin-right: -30px;
  }
  .okr #trust-deyond .trust .t-p {
    font-size: 16px;
  }
  .okr #trust-deyond .hr-head {
    margin-top: 40px;
  }
  .okr #trust-deyond .hr-head .col-md-2 {
    width: 20%;
  }
  .okr #trust-deyond .hr-head .col-md-6 {
    width: 80%;
  }
  .okr #trust-deyond .hr-head .col-md-4 {
    width: 50%;
  }
  .okr #trust-deyond .trust .hr-head .col-md-4 img {
    margin-top: 20px;
  }
  .okr #trust-deyond .right.carousel-control,
  .okr #trust-deyond .trust-gif a {
    right: 30px;
  }
  .okr #trust-deyond .carousel-control {
    bottom: 30px;
  }
  .okr #trust-deyond .left.carousel-control {
    right: 80px;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .okr #goals .mob-goal .m-goal .title span,
  .okr #goals .mob-goal .m-process .title span,
  .okr #goals .mob-goal .m-task .title span {
    width: 15px;
    height: 15px;
    border-radius: 5px;
    display: inline-block;
    margin-right: 10px;
  }
.okr #banner .chosen {width: auto;display: block;padding: 2px;}
.okr .banner-video .v-div img {width: 100%;}
.okr .the-okr-ai .the-okr-ai-title, .okr .banner-video .banner-video-title  {font-size: 36px;}
.okr .banner-video .v-div {margin-bottom: 40px;}
.okr .banner-video .banner-video-title {margin-bottom: 40px;}
.okr .banner-video .button, .okr .use-ai .button, .quick-look .button {display: block;width: fit-content;}
.okr .features-benefits {margin: 0px 0px 30px;}
.okr .features-benefits .febe-grid:first-child {margin-right: 0px;}
.okr .features-benefits .febe-grid .febe-grid-box {min-height: auto;margin-bottom: 20px;}
.okr .features-benefits .febe-grid {margin-bottom: 35px;}
.okr .features-benefits .febe-plus-second .febe-grid .febe-grid-box {min-height: auto;}
.okr #rl-content-1 .ani, .okr #rl-content-1 .swiper .swiper-slide img {display: none;}
.okr .use-ai {padding: 30px 0px;}
.okr .use-ai .col-md-6{width: 100%;}
.okr .use-ai img {margin-top: 30px;}
.okr .quick-look .quick-look-grid.three {margin-top: 30px;min-height: auto;}
.okr .quick-look .quick-look-grid.two {min-height: auto;}
.okr .features-benefits .febe-plus{display: none;}
	.okr .why-switch .row:nth-child(2) {margin-bottom: 0px;}
.okr .why-switch .why-switchg-grid {margin-bottom: 30px;min-height: auto;}
.okr .quick-look .quick-look-grid.one {margin-bottom: 30px;min-height: auto;}
.okr .quick-look .col-md-4{width: 100%;}
.okr .the-okr-ai {padding: 50px 0px 40px;}
.okr #banner .chosen img {float: none;display: block;margin: auto; padding-top: 10px;}
.okr #banner .chosen p {left: 6px;padding: 10px;}
.okr #banner .container, .the-okr-ai .container, .banner-video .container, .features-benefits .container, .okr-who .container, .use-ai .container, .why-switch .container, #integration .container, #trust-deyond .container, .quick-look .container, #dropdown .container {padding: 0 30px;width: 100%;max-width: 100%;}
.okr #banner .banner-content .banner-title,
.okr #cta h3,
.okr #goals h3,
.okr #goals h1,
.okr #lr-content h2,
.okr #track .carousel-item h3,
.okr #trust-deyond h3 {
    font-size: 36px;
  }
.okr #banner .banner-content .synergita {
    width: auto;
    font-size: 16px;
  }
.okr #banner .banner-content .button {
    display: block;
    width: fit-content;
  }
  .okr #banner .banner-content br,
  .okr #goals .banner-content h1 + div,
  .okr #goals .right-pie,
  .okr #trust-deyond .carousel-control img:first-child,
  .okr #trust-deyond .trust-gif a,
  .okr #trust-deyond .trust-gif img {
    display: none;
  }
  .okr #banner .v-div video {
    width: 100%;
    height: 100%;
  }
  .okr #banner .v-div img {
    width: 100%;
  }
  .okr #okr-video .modal-dialog {
    width: 97%;
    max-width: 97%;
    height: 300px;
    margin-top: 100px;
  }
  .okr #okr-video .modal-content {
    width: 100%;
    height: 300px;
  }
  .okr #lr-content .container {
    margin-top: -245px;
    width: 100%;
    max-width: 100%;
    padding: 230px 20px 0;
    border-radius: 0;
  }
  .okr #lr-content .container > img {
    width: 100px;
    top: 100px;
  }
  .okr #lr-content .col-md-6,
  .okr #lr-content .row,
  .okr #rl-content .col-md-6,
  .okr #track .col-md-6,
  .okr #trust-deyond .col-md-6 {
    width: 100%;
  }
  .okr #lr-content .banner-content img {
    top: -90px;
    width: 70px;
    left: -30px;
  }
  .okr #lr-content p,
  .okr #rl-content p,
  .okr #track .carousel-item p,
  .okr #trust-deyond .trust .t-p {
    font-size: 16px;
  }
  .okr #goals .container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 30px;
  }
  .okr #goals .banner-content {
    height: auto;
    margin: 0 auto;
  }
  .okr #goals {
    padding-bottom: 60px;
  }
  .okr #goals .mob-goal {
    display: block;
    text-align: left;
  }
  .okr #goals .mob-goal > img {
    width: 100%;
    margin: 50px auto;
  }
  .okr #goals .mob-goal .title {
    color: #5a4d9f;
    font-size: 20px;
    font-family: o-semibold;
    margin-bottom: 5px;
  }
  .okr #goals .mob-goal .desc {
    font-family: l-regular;
    font-size: 16px;
    color: #9b9b9b;
  }
  .okr #goals .mob-goal .m-goal .title span {
    background: #adaaf2;
  }
  .okr #goals .mob-goal .m-task .title span {
    background: #f9d187;
  }
  .okr #goals .mob-goal .m-process .title span {
    background: #cde2e0;
  }
  .okr #rl-content {
    padding: 110px 0;
  }
  .okr #cta .container,
  .okr #integration .container,
  .okr #rl-content .container,
  .okr #track .container {
    width: 100%;
    max-width: 100%;
    padding: 0 30px;
  }
  .okr #rl-content h2 {
    font-size: 36px;
    margin-top: 105px;
  }
  .okr #rl-content .banner-content img {
    top: -77px;
    width: 70px;
    right: -30px;
  }
  .okr #rl-content .banner-content {
    padding-left: 0;
  }
  .okr #track .carousel-item .row > .col-md-6:first-child {
    padding-right: 12px;
  }
  .okr #integration {
    padding: 100px 0 50px;
  }
  .okr #integration h3 {
    font-size: 36px;
    width: auto;
    margin-bottom: 30px;
  }
  .okr #integration p {
    font-size: 16px;
    width: auto;
  }
  .okr #integration .logos {
    width: 260px;
    min-height: 250px;
    margin-bottom: 0;
  }
  .okr
    #integration
    .logos
    div:not(
      .okr #integration .logos div:nth-child(4),
      .okr #integration .logos div:nth-child(8),
      .okr #integration .logos div:nth-child(9),
      .okr #integration .logos div:nth-child(10)
    ) {
    height: 40px;
    width: 40px;
    padding: 5px;
  }
  .okr #integration .logos div img {
    width: 100%;
    margin-top: 0;
  }
  .okr #integration .logos div:first-child {
    left: 12px;
    top: 30px;
  }
  .okr #integration .logos div:nth-child(2) {
    left: -25px;
    top: 92px;
  }
  .okr #integration .logos div:nth-child(3) {
    left: 12px;
    top: 150px;
  }
  .okr #integration .logos div:nth-child(4) {
    top: 85px;
    width: 50px;
  }
  .okr #integration .logos div:nth-child(5) {
    right: 12px;
    top: 30px;
  }
  .okr #integration .logos div:nth-child(6) {
    right: -25px;
    top: 92px;
  }
  .okr #integration .logos div:nth-child(7) {
    right: 12px;
    top: 150px;
  }
  .okr #integration .logos div:nth-child(6) img {
    width: 22px;
  }
  .okr #integration .logos .u-line {
    width: 65%;
    margin-top: 79px;
  }
  .okr #integration .logos .m-line,
  .okr #trust-deyond .hr-head .col-md-6 {
    width: 80%;
  }
  .okr #integration .logos .d-line {
    width: 65%;
  }
  .okr #integration .button {
    width: fit-content;
    display: block;
  }
  .okr #trust-deyond .container {
    width: 100%;
    max-width: 100%;
    padding: 0 15px;
    background: #f8f7ff;
  }
  .okr #trust-deyond .container > .row > .col-md-12 {
    padding: 0;
  }
  .okr #trust-deyond .carousel-inner {
    border-radius: 0;
  }
  .okr #trust-deyond .trust {
    padding: 30px 40px 100px;
    height: auto;
  }
  .okr #trust-deyond .trust .top {
    width: 150px;
  }
  .okr #trust-deyond .trust hr {
    margin-top: -21px;
    width: 33%;
    margin-right: 0;
  }
  .okr #trust-deyond .trust .star {
    width: 15px;
  }
  .okr #trust-deyond .hr-head {
    margin-top: 40px;
  }
  .okr #trust-deyond .hr-head .col-md-2 {
    width: 20%;
  }
  .okr #trust-deyond .hr-head .col-md-4 {
    width: 40%;
  }
  .okr #trust-deyond .hr-head .col-md-4 img {
    width: 190px;
    margin-top: 20px;
  }
  .okr #trust-deyond .mob-tvideo {
    display: block;
    width: 100%;
    border-radius: 10px;
  }
  .okr #trust-deyond .carousel-control img:nth-child(2) {
    display: block;
  }
  .okr #trust-deyond .carousel-control {
    bottom: 30px;
  }
  .okr #trust-deyond .left.carousel-control {
    right: 0;
    left: -45px;
    margin: 0 auto;
    transform: rotate(180deg);
  }
  .okr #trust-deyond .right.carousel-control {
    right: -45px;
    margin: 0 auto;
    left: 0;
  }
  .okr #trust-deyond .carousel-control img {
    width: 35px;
  }
  .okr #cta center {
    background-size: cover;
    background-repeat: no-repeat;
    padding: 100px 10px;
  }
}
#banner .banner-content .banner-title span {
  background: linear-gradient(90deg, #a36bff 0, #8783ff 93.46%);
  background-clip: border-box;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#banner .button-align .col-md-6 a {
  display: block;
  width: fit-content;
}
#banner .button-align .col-md-6 p {
  margin-bottom: 0px;
  font-size: 15px;
}
.okr #banner .banner-content .button {
  margin-bottom: 20px;
}
#banner .button-align {
  width: 680px;
}

/*accordian*/
.okr #dropdown .question {
  text-align: center;
  margin-top: 80px;
}
.okr #dropdown .question .okr-fre-title {
  font-family: o-semibold;
  margin-bottom: 20px;
  font-size: 48px;
}
.okr #dropdown .question h3 + p {
  font-family: l-regular;
  font-size: 24px;
  color: #9b9b9b;
  margin-bottom: 50px;
}
.okr #accordian {
  position: relative;
  width: 720px;
  margin: 0 auto;
}
.okr .filter-heading {
  font-family: l-regular;
  font-size: 24px;
  margin-top: 25px;
  margin-bottom: 10px;
  position: relative;
  padding-right: 60px;
  cursor: pointer;
}
.okr .filter-heading:before {
  content: url("../img/plus-expand.svg");
  font-size: 20px;
  right: 0;
  position: absolute;
  transition: all 0.6s ease;
  top: 9px;
  color: #5a4d9f;
}
.okr #sidebar ul li {
  list-style: none !important;
  font-family: l-regular;
  width: 95%;
  font-size: 16px;
}
.okr #sidebar ul {
  padding: 0px;
}
.okr #sidebar hr {
  opacity: 0.1;
  margin: 30px 0px 10px;
}
.okr .filter-heading.activeFilter:before {
  display: none;
}
.okr #accordian .filter-heading.activeFilter:after {
  content: url("../img/minus-collapse.svg");
  font-size: 18px;
  right: 0px;
  top: 10px;
  position: absolute;
  transition: all 0.6s ease;
  color: #5a4d9f;
}
.okr .filter-option-content {
  display: none;
}
.okr #accordian .list-class li {
  line-height: 25px;
  margin-bottom: 10px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .okr #accordian {
    width: auto;
  }
  .okr #dropdown .container {
    width: 100%;
    max-width: 100%;
    padding: 0px 30px;
  }
  .okr #dropdown .question h3 {
    font-size: 36px;
  }
  .okr #dropdown .question h3 + p {
    font-size: 16px;
  }
  #banner .button-align {
    width: 100%;
  }
  #banner .button-align .col-md-6 {
    width: 100%;
  }
	.banner-video .col-md-6{width: 100%;}
	.okr .banner-video{padding-bottom: 40px;}
	.okr .banner-video .v-div-content{margin-bottom: 50px;}	
	.okr .banner-video .okr-banner-ai {margin-bottom: 30px;}
	.okr #integration .okr-smart-inte {width: 100%;}
}
@media (min-width: 768px) and (max-width: 991px) {
  .okr #accordian {
    width: 100%;
  }
  .okr .pms .col-md-4 {
    width: 100%;
  }
  .okr .pms .perform {
    min-height: auto;
  }
  .okr #trust-deyond .trust .t-p {
    font-size: 15px !important;
  }
	.okr .okr-who #rl-content-1 .ani, .okr .okr-who .swiper {display: none;}
	.banner-video .col-md-6{width: 100%;}
}

@media (min-width:1400px){
	.okr .features-benefits .febe-plus img {left: 554px;}
}