/* About page css start here */

.rts-breadcrumb-area {
  padding-top: 153px;
  padding-bottom: 80px;
  margin: -123px 0 0 0;
  }
  .service-one-inner .service-details p {
  margin-bottom: 20px;
  margin: 0;
  }
  .service-one-inner .service-details .title {
  font-size: 20px;
  height: 62px;
  margin: 22px 0 0 0;
  }
  .rts-breadcrumb-area .title {
  color: #fff;
  margin-bottom: 0;
  font-size: 41px;
  }
  h2.areas  {
  font-size: 26px;
  }
  .playful figure.softeffect p {
  text-transform: math-auto !important;
  max-width: unset !important;}
  h2.areas span { color:#ff7b00;}
  .service-one-inner {
  padding: 0;
  }
  .faq-two-inner .title-area-faq span.sm-title span {
  color: var(--color-primary);
  font-weight: 600;
  font-size: 31px;
  text-transform: capitalize;
  }
  .about-progress-inner {
  padding-left: 0;
  }
  .about-progress-inner .title-area .title {
  margin-top: 5px;
  font-size: 37px;
  }
  .rts-about-area {
  padding: 39px 0;
  }
  .title.csr{color:#ff7b00;}
  
#gallery {
  padding-top: 40px;
  }
  @media screen and (min-width: 991px) {
  #gallery {
  padding: 60px 30px 0 30px;
  }
  }
  .img-wrapper {
  position: relative;
  margin-top: 15px;
  }
  .img-wrapper img {
  width: 100%;
  }
  .img-overlay {
  background: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  }
  .img-overlay i {
  color: #fff;
  font-size: 3em;
  }
  #overlay {
  background: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 20000;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  }
  #overlay img {
  margin: 0;
  width: 80%;
  height: auto;
  -o-object-fit: contain;
  object-fit: contain;
  padding: 5%;
  }
  @media screen and (min-width: 768px) {
  #overlay img {
  width: 60%;
  }
  }
  @media screen and (min-width: 1200px) {
  #overlay img {
  width: 50%;
  }
  }
  #nextButton {
  color: #fff;
  font-size: 2em;
  transition: opacity 0.8s;
  }
  #nextButton:hover {
  opacity: 0.7;
  }
  @media screen and (min-width: 768px) {
  #nextButton {
  font-size: 3em;
  }
  }
  #prevButton {
  color: #fff;
  font-size: 2em;
  transition: opacity 0.8s;
  }
  #prevButton:hover {
  opacity: 0.7;
  }
  @media screen and (min-width: 768px) {
  #prevButton {
  font-size: 3em;
  }
  }
  #exitButton {
  color: #fff;
  font-size: 2em;
  transition: opacity 0.8s;
  position: absolute;
  top: 15px;
  right: 15px;
  }
  #exitButton:hover {
  opacity: 0.7;
  }
  @media screen and (min-width: 768px) {
  #exitButton {
  font-size: 3em;
  }
  }
  .accordion-body h4 {
  font-size: 18px;
  color: #ff7b00;
  }
  .galleryviws{padding:0;}
  .col-lg-3.col-md-6.col-sm-6.col-xs-12.image{position:relative;}
  .col-lg-3.col-md-6.col-sm-6.col-xs-12.image h4 {
  padding: 13px 13px;
  position: absolute;
  color: #fff;
  width: 100%;
  bottom: -163px;
  background: rgba(0,0,0,0.5);
  left: 0;
  }
  .img-wrapper {
  border: 2px solid #272727; 
  }
  .galleryviws .container{padding:0;}
  .galleryviws h4 {
  font-size: 18px;
  padding: 13px 0 0 7px;
  }
  .img-wrapper {
  border: unset;
  }
  .vsicon {
  display: block;
  margin: 17px 0 16px 0;
  }
  .vsbox {
  text-align: center;
  padding: 18px 32px;
  margin: 0 0 70px 0;
  box-shadow: 1px 1px 6px 3px #ccc;
  }
  .vsicon svg{max-width:100%; max-height:100%}
  .vsbox p.disc {
  font-size: 16px;
  min-height: 196px;
  line-height: 26px;
  }
  .vsicon img {
  width: 49px;
  }
  .faq-accordion-area.aboyt .accordion-button{}
  #gallery {
  padding: 8px 30px 15px 0;
  }
  .rts-business-case-s-2 .thumbnail {
  text-align: center;
  display: block; }
  .rts-business-case-s-2.style-home-7S .thumbnail img {
  width: 66%;
  }
  .rts-business-case-s-2 .inner {
  padding: 35px;
  text-align: center;
  position: unset;
  bottom: 35px;
  left: 50%;
  transform: unset;
  width: 100%;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  z-index: 10;
  }
  .rts-service-area.rts-service-area5.keypar {
  margin: 32px 0 60px 0;
  }
  .hover {
  overflow: hidden;
  position: relative;
  text-align: center;
  padding-bottom: 60%;
  }
  .hover-overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 90;
  transition: all 0.4s;
  }
  .hover img {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.3s;
  }
  .hover-content {
  position: relative;
  z-index: 99;
  }
  span.font-weight-light {
  color: #fff;
  font-size: 21px;
  }
  /* DEMO 1 ============================== */
  .hover-1 img {
  width: 105%;
  position: absolute;
  top: 0;
  left: -5%;
  transition: all 0.3s;
  }
  .hover-1-content {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 99;
  transition: all 0.4s;
  }
  .hover-1 .hover-overlay {
  background: rgba(0, 0, 0, 0.5);
  }
  .hover-1-description {
  transform: translateY(0.5rem);
  transition: all 0.4s;
  opacity: 0;
  }
  .hover-1:hover .hover-1-content {
  bottom: 2rem;
  }
  .hover-1:hover img {
  left: 0;
  }
  .hover-1:hover .hover-overlay {
  opacity: 0;
  }
  .hover-1:hover .hover-1-description {
  opacity: 1;
  font-size: 15px;
  line-height: 20px;
  transform: none;
  color: #fff;
  }
  p.hover-1-description.font-weight-light.mb-0 {
  opacity: 0;
  }
  .hover-1 img {
  max-width: unset; }
  .sliderTitle {
  background: unset !important; }
  p.keysb {font-size: 16px;
  line-height: 23px;
  margin: 14px 0 0 0; }
  h4.csrlff {
  margin: -77px 0 15px 0;
  }
  .service-detials-step-2.inner {
  max-width: unset;
  margin: 0;
  }
  .team-single-one-start .single-details p {
  color: #272727;
  line-height: 23px;
  font-size: 16px;
  margin: 15px 0 0 0;
  }
  .textb {
  max-width: 600px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 1.1rem;
  }
  .text-btnb {
  appearance: none;
  border: 1px solid #000;
  padding: 0.5em;
  cursor: pointer;
  width: fit-content;
  border-radius: 0.25em;
  -webkit-border-radius: 0.25em;
  -moz-border-radius: 0.25em;
  -ms-border-radius: 0.25em;
  -o-border-radius: 0.25em;
  }
  .text-btnb::before {
  content: "see more";
  text-transform: capitalize;
  }
  .text-btnb:checked::before {
  content: "see less";
  }
  .textb:has(+ .text-btnb:checked) {
  -webkit-line-clamp: initial;
  }
  input.text-btnb {
  opacity: unset;
  border: 0;
  color: #ff8216;
  font-size: 14px;
  }
  .team-single-one-start .single-details {
  padding: 28px 30px 52px 30px;
  }
  .service-detials-step-2 .single-service-step {
  background: #eee; }
  .hover-1-content {
  width: 100%; }
  .alignlf {
  text-align: left;
  margin: 0 0 0 9px;
  }
  .service-detials-step-2 .single-service-step {
  padding: 18px 20px; transition: 0.3s; border-radius: 8px; }
  span.font-weight-light {
  color: #fff;
  font-size: 19px;
  }
  .valsubb {
  margin: 0 0 18px 0; text-align: left;
  }
  .valsubb_title {
  display: inline-block;
  }
  .valsubb_img {
  width: 45px;
  display: inline-block;
  }
  .vsbox p.disc {
  min-height:unset; }
  .vsbox {
  min-height: 350px; }
  a.linnkd {
  color:#fff;
  display:block;
  margin:15px 0 0 0; font-size:21px;
  }

  h3.hover-1-title.font-weight-bold.mb-0.animated.fadeIn {
    background: rgba(255,255,255,0.6);
}
.service-detials-step-2 .single-service-step p.step {
    position: relative;
    color: #fff;
    z-index: 1;
    margin-bottom: 0px;
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    margin-top: 16px;
}
.service-detials-step-2 .single-service-step p.step::before {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    background: #e81c2e1a;
    height: 70px;
    width: 70px;
    transform: translate(-50%, -50%);
    z-index: -1;
    border-radius: 50%;
}
.service-detials-step-2 .single-service-step p.step::after {
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    background: #ff7b00;
    height: 50px;
    width: 50px;
    transform: translate(-50%, -50%);
    z-index: -1;
    border-radius: 50%;
}

.single-service-step:hover {
    transform: translateY(-10px);
    border-radius: 8px;
    transition: 0.3s;
}
/* About page css end here */