/* Slider */
#slider option{
  color: var(--orange);
}
#slider select{
  border: none;
  cursor: pointer;
}
#slider{
  padding: 8% 0 0 0;
}
.video-controls{
  background: var(--orange);
  background-clip: padding-box;
  position: absolute;
  height: 65px;
  width: 65px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
  animation-name: pulse;
}
.video-controls i.fa.fa-pause{
  display: none;
}
.video-controls i {
  font-size: 30px;
  color: var(--white);
}
.container .controls {
position: absolute;
bottom: 40px;
left: 0;
right: 0;
margin: 0 auto;
width: 95%;
display: flex;
justify-content: space-around;
  transition: opacity 0.4s;
}

.controls .timeline .bar .inner {
  background:#F86F03;
  width: 0%;
  height: 100%;
}
.container .controls .timeline {
flex: 1;
display: flex;
align-items: center;
border: none;
}
.container .controls .timeline .bar{
background: #fff;
height: 6px;
flex: 1;
border-radius: 10px;
}

.video-setting i{
color: #ffffff;
}

.video-setting{
width: 60px;
height: 20px;
position: absolute;
bottom: -20px;
right: 40px;
text-align: end;
}
.video-fullscreen{
width: 20px;
height: 20px;
position: absolute;
bottom: -20px;
right: 0px;
}
.timings{
position: absolute;
bottom: -22px;
left: 10px;
color: #fff;
}
.video-setting-wrap{
position: absolute;
bottom: -1px;
right: 30px;
color: #fff;
width: max-content;
}
.video-setting:hover .video-setting-wrap {
  display: block !important;
}
.video-controls {
  cursor: pointer;
}
.video-wrap video{    
  border-radius: 12px;
  border: 5px solid #fff;
  height: 210px;
  object-fit: cover;
  width: 100%;
}
.video-wrap{
  width: 80%;
  margin: 0 auto;
}
.custom-social-icons i{
  background: #000;
  height: 35px;
  width: 35px;
  line-height: 35px;
  text-align: center;
  color: #fff;
  border-radius: 5px;
  font-size: 18px;
}
.custom-social-icons i:hover{
  background: var(--white);
  color: var(--black);
}
.slider-social-wrap{
  background: #FE6726;
  padding: 6px 10px;
  width: max-content;
  border-radius: 5px;
}
.slider-follow-us{
  font: 500 14px / 31px Rubik;
  color: #FFFFFF;
}
.slider-progress-head select{
  width: max-content;
  background: unset;
  font: 400 14px / 30px Rubik;
  padding: 0;
}
:focus-visible {
  outline: unset
}
.slider-progress-box{
  background: #0A0A0A;
  padding: 20px;
  border-radius: 12px;
  position: relative;
  right: -5%;
}
.slider-graph-img img{
  height: 100%;
  width: 100%;
  border-radius: 12px;
}
.slider-right-box{
  margin-top: 20%;
    position: relative;
    left: -20px;
}
/* partners */
/* .our-partner-img{
  width: max-content;
  margin: 0 auto;
} */
#partner .our-partner-img img {
  width: auto !important;
  margin: 0 auto !important;
  position: relative;
  vertical-align: top;
  margin: 0 auto;
  width: auto;
  height: auto;
  transition: all .4s linear;
  transition: all 0.5s;
  filter: gray;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);    opacity: 0.5;
    
}
#partner .our-partner-img img:hover{   
  -webkit-filter: grayscale(0);
  filter: none;
  opacity:1;
}

/* counter*/
#counter>.container{
  background-size: 100% 100%;
  background-repeat: no-repeat !important;
}
#counter{
  margin-bottom: -7%;
  position: relative;
}
#counter .container{
  background-size: 100% 100%;
  padding: 50px;
  border-radius: 20px;
}
.recrd_inner span{
  font:600 50px / 26px Rubik;
  letter-spacing: 0px;
  color: var(--orange);
}
.counter-box{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
/* Advisor */
#get-quote{
  overflow-x: hidden;
}
.man-img{
  height: 80%;
  width: 80%;
  margin: 0 auto;
  animation: leftright 5s infinite alternate ease-in-out;
}
@keyframes leftright {
  0%, 20% {
    transform: translateX(0%);
    left: 0%;
}
80%, 100% {
    transform: translateX(-10%);
    left: 100%;
}
}
.quote-form-box{
  padding: 30px 30px;
  text-align: center;
  background: #000;
  border-radius: 20px;
  margin-top: 10%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

/* How to work */
.work-wrap{
  width: 300px;
  position: relative;
  margin: 0 auto;
}
.work-wrap.work-wrap-1 .how-img-wrapper,.work-wrap.work-wrap-3 .how-img-wrapper{
  width: 125px;
  height: 125px;
}
.how-img-wrapper{
  width: 140px;
  height: 140px;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  border-radius: 50%;
  position: relative;
  transition: all 1s ease 0s;
  overflow: hidden;
  transition: color 0.25s ease-in-out 0.3s;
}
.how-img-wrapper:before{
  content: "";
    position: absolute;
    transition: top 0.5s ease-in 0.5s, width 0.5s ease-out, height 0.5s ease-out;
    -webkit-transition: top 0.5s ease-in 0.5s, width 0.5s ease-out, height 0.5s ease-out;
    left: 50%;
    top: -50%;
    transform: translate(-50%, -50%);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color:var(--orange);
    z-index: 0;
}
  
.work-wrap:hover .how-img-wrapper:before{
  transition: top 0.5s ease-in, width 0.5s ease-out 0.5s, height 0.5s ease-out 0.5s;
  -webkit-transition: top 0.5s ease-in, width 0.5s ease-out 0.5s, height 0.5s ease-out 0.5s;
  top: 50%;
  width: 200px;
  height: 200px;
}
.work-no{
  background: #FE6726;
  position: absolute;
  height: 43px;
  width: 43px;
  font: 500 19px / 30px Rubik;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  left: 25%;
  z-index: 1;
}
.how-img-wrapper img{
  z-index: 1;
    position: relative;
    transition: all 1s ease 0s;
    
}
.work-wrap:hover .work-no{
  background: var(--black);
  transition: all 0.8s;
    animation: zoomIn .4s ease-in-out
}
.line-1{
  position: absolute;
  width: max-content;
  left: 22%;
  top: 20%;
}
.line-2{
  position: absolute;
  width: max-content;
  left: 55%;
  top: 30%;

}
#how-work{
  padding-bottom: 10%;
}
/* Project */
#project{
  background-color: #171717;
  padding-top: 10%;
}
.project-box{
  background: var(--black);
  display: flex;
  flex-direction: column;
  padding: 20px 25px;
  gap: 12px;
  border-radius: 10px;
  justify-content: space-around;
  overflow: hidden;
}

.project-wrap{
  display: grid;
  position: relative;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(12, 45px);
  grid-gap: 20px;
}
.project-box-1{
  grid-column-start: 1;
  grid-column-end: 5;
  grid-row-start: 1;
  grid-row-end: 9;
}
.project-box-1 img{
  max-height: 198px;
  max-width: 369px;
  height: 100%;
  width: 100%;
  object-fit: contain;
}
.project-box-2{
  grid-column-start: 5;
  grid-column-end: 9;
  grid-row-start: 1;
  grid-row-end: 6;
}
.project-box-2 img{
  height: 100%;
  width: 100%;
  object-fit: cover;
  max-width: 425px;
  max-height: 75px; 
}
.project-box-3{
  grid-column-start: 9;
  grid-column-end: 13;
  grid-row-start: 1;
  grid-row-end: 9;
}
.project-box-3 img{
  max-width: 359px;
  max-height: 244px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.project-box-4{
  grid-column-start: 1;
  grid-column-end: 5;
  grid-row-start: 9;
  grid-row-end: 13;
}
.project-box-4 img{
  max-width: 349px;
  max-height: 73px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.project-box-5{
  grid-column-start: 5;
  grid-column-end: 9;
  grid-row-start: 6;
  grid-row-end: 11;
}

.project-box-6{
  grid-column-start: 9;
  grid-column-end: 13;
  grid-row-start: 9;
  grid-row-end: 13  ;
}
.project-box-6 img{
  max-width: 350px;
  max-height: 53px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.project-box-1 .project-para p{
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.project-box-2 .project-para p,.project-box-3 .project-para p{
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.project-box-4 .project-para p,.project-box-5 .project-para p{
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.project-box-5 img{
  height: 100%;
    width: 100%;
    max-width: 330px;
    margin: 0 auto;
    object-fit: contain;
}
.project-box-6 .project-para p{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.project-para p{
  margin-bottom: 0;
}

.project-box-7 {
  grid-column-start: 6;
  grid-column-end: 8;
  grid-row-start: 11;
  grid-row-end: 12;
  position: relative;
  left: 30px;
  top: 25px;
  display: flex;
  align-items: center;
}



/* choose */
#why-choose{
  overflow-x: hidden;
}
.progress-bar {
  overflow: hidden;
  background: transparent;
  text-align:left;
}

.progress-title-holder {
padding-bottom: 7px;
position: relative;
font-size: 15px;
line-height: 15px;
font-weight: 400;
color: #fff;  
}
.progress-title {
z-index: 100;
}
.progress-number-wrapper {
width: 100%;
z-index: 10;
}
.progress-number-mark {
margin-bottom: 4px;
position: absolute;
bottom: 0;   
-moz-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
-ms-transform: translateX(-50%);
-webkit-transform: translateX(-50%); 
} 
.progress-number-wrapper,
.progress-number-mark {
font: normal normal normal 15px / 20px Rubik;
  letter-spacing: 0px;
  color: #FFFFFF;
}

.progress-content-outter {
height: 12px;
background-color: #111111;
border-radius: 5px;
}

.progress-content,.progress-content-slider {
height: 12px;
  background-color: #FE6726;
  width: 0%;
  border-radius: 10px;

} 

.progrss-wrap{
  display: flex;
  gap: 20px;
  flex-direction: column;
  width: 90%;
  
}

.choose-img-main{
  display: grid;
  position: relative;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(10, 30px);
  grid-gap: 15px;
  z-index: 1;
  width: 90%;
  margin: 0 auto;
}
.choose-main-iner-1{
  grid-column-start: 3;
  grid-column-end: 8;
  grid-row-start: 2;
  grid-row-end: 7;
}
.choose-main-iner-2{
  grid-column-start: 9;
    grid-column-end: 12;
    grid-row-start: 1;
    grid-row-end: 4;
    background: var(--orange);
    border-radius: 10px;
    text-align: center;
    align-items: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 7px;
    position: relative;
    top: 12px;
}
.choose-main-iner-3{
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 7;
  grid-row-end: 11;
  position: relative;
  left: 30px;
}
.choose-main-iner-4{
  grid-column-start: 8;
  grid-column-end: 14;
  grid-row-start: 4;
  grid-row-end: 10;
  margin-top: 15px;
}
.choose-img-main img{
  border-radius: 12px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}

/* staff */
.staff-img{
  height: 380px;
  position: relative;
}
.staff-img img{
  height: 100%;
  width: 100%;
  object-fit: contain;
}
.staff-img::after{
  content: '';
  position: absolute;
  background-color: #000;
  z-index: -1;
  height: 70%;
  bottom: 0;
  left: 0;
  right: 0;
  border-radius: 15px;
}
.staff-title a{
  color: #fff;
}
.staff-social-icon-box i{
  background: #FFFFFF;
  height: 35px;
  width: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--black);
  font-size: 16px;
}
.staff-social-icon-box  {
  position: relative;
  text-align: center;
  left: -100%;
  z-index: 1;
  transition: all .4s linear;
  margin: 15px 0px 0px 0px;
  opacity: 0;
}
.staff-inner-content:hover .staff-social-icon-box  {
  opacity: 1;
  transition: all .4s linear;
  left: 0%;
}
.staff-inner-content:hover .staff-social-icon-box  a i {
  transition: all .4s linear;
  transform: rotate(360deg);
}
.staff-social-icon-box-main{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 5%;
}
.staff-social-icon-box i:hover{
  background-color: var(--orange);
  color: var(--white);
}