body{font-size:$basefont-size * 1.125; font-family:$font__regular; color:$black; overflow-x: hidden; overflow-y: scroll; line-height:1.6; }
h1, h2, h3, h4, h5 {line-height: 1.3; font-weight:800; } 
.container {max-width:1200px; } 
section{position: relative;}
a {color: $black; text-decoration:none; outline:none;
  &:hover {color:$color__primary-hover } 
  &:hover,  &:focus {text-decoration:none; outline:none; }
}

.burger {padding:$spacer*5 0; } 
.t-burger {padding-top: $spacer*5; } 
.b-burger {padding-bottom: $spacer*5; } 
.gutter {padding:0 $spacer*5; } 
.gutter-sm {padding:0 $spacer*2.5; } 

.offset {margin-top: 100px; } 

.animate{transition: all .3s ease-in;}

.opacity-0 { opacity: 0; }
.opacity-25 { opacity: .25; }
.opacity-50 { opacity: .5; }
.opacity-75 { opacity: .75; }
.opacity-100 { opacity: 1; }

/*.chosen-container {width:100% !important; } 
.checkbox, .radio {
  label {margin-bottom:0; cursor:pointer;
    &:after {content: ''; display: table; clear: both; } 
    input[type="checkbox"], input[type="radio"] {display: none; } 
  }
  .checkbox{
    .cr {position: relative; display: inline-block; border: 1px solid #a9a9a9; border-radius: 2px; width: 1.3em; height: 1.3em; float: left; margin-right: .5em;
      .cr-icon {position: absolute; font-size: $basefont-size * .8; line-height: 0; top: 50%; left: 13%; } 
    } 
  }
  .radio{
    .cr {position: relative; display: inline-block; border: 1px solid #a9a9a9; border-radius: 100%; width: 1.3em; height: 1.3em; float: left; margin-right: .5em; border-radius: 50%;
      .cr-icon {position: absolute; font-size: .8em; line-height: 0; top: 50%; left: 13%; margin-left: 0.04em; } 
    }
  }
} 
input[type="checkbox"] + .cr > .cr-icon, input[type="radio"] + .cr > .cr-icon {transform: scale(3) rotateZ(-20deg); opacity: 0; transition: all .3s ease-in; } 
.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon, .radio label input[type="radio"]:checked + .cr > .cr-icon {transform: scale(1) rotateZ(0deg); opacity: 1; } 
.checkbox label input[type="checkbox"]:disabled + .cr, .radio label input[type="radio"]:disabled + .cr {opacity: .5; } */

/*.bg-0 {background:rgb(33, 32, 34); } 
.bg-1 {background:#FBEECA; } 
.bg-2 {background:#C6DBF2; } 
.bg-3 {background:rgba(123, 216, 240,0.3); } 
.bg-4 {background:#f9939a40; } 
.bg-5 {background:rgba(193, 219, 131,0.5); } 
.bg-6 {background:#a1c7f4 } 
.bg-7 {background:rgba(244, 204, 161,0.5); } 
.bg-8 {background:#b9adf6 } 
.alt-bg-2 {background-color: #E4EDED; }
.theme-bg {background-image: linear-gradient(to right,#0f346c 30%,#764ca6 100%); }*/

/*.hero{display: flex; height: 100vh; align-items: center;
  p {font-size: $basefont-size * 1.125; }
}*/

.bg-light {background-color:$white !important; } 
.white-text {color:$white; }
.background_1{background-color:#f8f8f8}
.background_2 {background-color: #E4EDED; }

.big-text {font-size: $basefont-size * 1.875; font-weight:600; line-height:1.5; } 

.shade {display: inline; color: #fd2e35; font-weight: bold; text-transform: uppercase; font-size: $basefont-size * .825; letter-spacing: 2px; }

.section-header{
  h2 {font-size: $basefont-size * 2.125; line-height: 1.4; margin-top: 20px; }
}
.big-h3 {font-size: 40px; font-weight: 500; line-height: 1.5; }

.more-stuffs {padding: 10px 0; }

.blur-heading {display: block;text-transform: uppercase; font-size: $basefont-size * 0.8; font-weight: bold; letter-spacing: 2px; position: relative; }

/*.services{
  &__sidebar {position: -webkit-sticky; position: -moz-sticky; position: -ms-sticky; position: -o-sticky; position: sticky; height: 100%; top: 150px; bottom: auto; padding-bottom: 50px; }

  &__wrapper {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;
    &-item {width: 100%; padding: 30px; margin-bottom: 50px; display: flex; align-items: flex-start;
      &:first-child {margin-top:100px; }
      &:last-child {margin-bottom: 0; }
      .icon {margin-right: 50px;
        ion-icon {font-size: 60px; color: $color__primary; }
      }
      img {margin-right:50px; }  
      .number {font-size:2em; display: block; margin-right: 30px; line-height: 1; color: $color__primary; }
    }
  }
  &__item-body {width: 80%;    
    h5 {margin-top: 0px; font-size:$basefont-size * 1.75; } 
    p {font-size: $basefont-size * 1.125; font-weight: 500; margin-top: 20px; }
    ul {padding-left: 17px; font-size: $basefont-size * 0.9; 
      li {margin-bottom: 10px; }
    }
    .link-arrow {display: flex; align-items: center; margin-top: 20px; color: #cf307d; font-size: $basefont-size * 0.9; font-weight:500;
      .fa { font-size: $basefont-size * 1; margin-right: 10px; width: 30px; height: 30px; border: 2px solid; border-radius: 100%; text-align: center; line-height: 27px;}
    }
  } 
}*/
.underline {border-bottom: 8px solid #fedc86; }

.service {position: relative; border-top: 1px solid #f0f4f7; border-bottom: 1px solid #f0f4f7;
  &:after {position: absolute; content:""; height: 100%; width: 60%; background: #f0f4f7; top:0; z-index: -1; }
  &__sidebar {position: -webkit-sticky; position: -moz-sticky; position: -ms-sticky; position: -o-sticky; position: sticky; height: 100%; top: 150px; bottom: auto; padding-bottom: 50px; }
  &__wrapper {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;
    &-item {width: 100%; margin-bottom: 150px; display: flex; align-items: flex-start;
      &:first-child {margin-top:100px; }
      &:last-child {margin-bottom: 0; }
      ul {padding-left: 17px; font-size: 0.9em; font-weight:600; margin-top:30px; color:#000;
        li {margin-bottom: 10px; }
      }      
      .link-arrow {margin-top: 30px; }
      .icon {margin-right: 50px;
        ion-icon {font-size: 60px; color: $color__primary; }
      }
      img {margin-right:50px; } 
      h5 {margin-top: 0px; font-size: 50px; letter-spacing:-0.015em; color:#000; } 
      p {font-size: 18px; font-weight: 500; margin-top: 20px; opacity:0.7; } 
      .number {font-size:72px; display: block; margin-right: 20px; line-height: 1; font-weight:800; opacity:0.1; }

    }
  }
}

.project {display: flex; flex-wrap: wrap; margin-right: -20px; margin-left: -20px; 
  &__item {flex: 0 0 50%; max-width: 50%; position: relative; width: 100%; min-height: 1px; padding-right: 20px; padding-left: 20px; margin-top: 30px; 
    img {max-width: 100%; border-radius: 8px; }
    &-brief {display: flex; margin-top: 40px; justify-content: space-between;
      p {margin-right: 50px; width: 350px; }
      h3 {font-size: 24px; line-height: 1.5; font-weight: 500; }
    }
  }
}
.cursor {position: fixed; pointer-events: none; opacity: 0; } 
.cursor-eye {top: -50px; left: -50px; padding: 20px; z-index: 1; border-radius: 50%; background-color: var(--darkblue); } 
.cursor-show {height: 60px; width: 60px; background: rgba(0,0,0,0.8); display: flex; border-radius: 100%; text-align: center; color: #FFF; justify-content: center; align-items: center; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; font-size: 10px; }

.techicons {/*display: flex; flex-wrap: wrap;*/ /*flex-wrap: wrap; justify-content: center;*/ list-style: none; /*overflow: auto; padding: 0;*/     margin-bottom: 0;
  li {display: inline-block; max-width: 12rem; flex-basis: 12rem; margin:0rem .75rem .75rem 0; 
    a {position: relative; display: inline-flex; min-width:130px; align-items: center; /*width: calc(100% - 1em);*/ padding: 10px 12px; line-height: 130%; color: #000; background-color: #FFF; box-shadow: 0 1px 2px rgba(0,0,0,0.2); border-radius: 8px; /*margin-bottom: 16px;*/ border: 1px solid #eee; font-size: 0.8em; transition: 0.3s all; .ti-image {margin-right: 15px; display: flex; img{ width:24px; height:auto } } 
      &:hover {border-color:#fd2e35; }
    }
  }
}

.reviewsection{background-color:#474747; color: #fff;
  h2 {font-size: 46px; }
  .why-item{
    .big {font-size: 65px; font-weight: bold; display: block; border-bottom: 1px solid #000;}
    .title {font-size: 20px; font-weight: 500; margin-top: 20px; display: block; }
    p {font-size: 14px; opacity: 0.6; margin-top: 20px; }
  }
}

.stats-light {color: #FFF;
  .why-item .big {border-color:#FEDC86; color:#FEDC86; }
}

.client_logo{
  h5{  margin-bottom:50px; position: relative;
    span{color:#fff; background: #474747; display: inline-block; padding:5px 30px; position: relative; z-index: 1; letter-spacing: 3px; text-transform: uppercase; font-size: 16px; }
    &:after{ content:''; position:absolute; left:0; top:50%; border-top:1px solid rgba(255,255,255,.1); width:100%; height:1px; z-index:0 }
  }
  ul{ margin: 0; padding: 0; list-style: none;
    li{ border-right: 1px solid rgba(255,255,255,.3); border-bottom: 1px solid rgba(255,255,255,.3);      
      a{ display:block; transition: .5s ease all; cursor: default; position: relative;
        &:after{ content:''; display:block; padding-bottom:100% }
        img{ width: 110px; filter: grayscale(100%); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%)}
        span{ display:block; width:100%; color:rgba(255,255,255,.6); font-size:16px; text-transform:uppercase }
      }
    }
    &.col8{display: grid; gap: 0; grid-template-columns: repeat(5, 1fr); grid-template-rows: masonry; width: 940px; margin:0 auto;
      li{ /*width: 12.5% !important; break-inside: avoid;*/ position: relative;
        a{
          img{ width:60% !important}
        }
        &.bouble{background-color: #fff; color: #474747; grid-column: span 2; 
        }    
        .stats_feature{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);min-width: 170px;
          span{ display:block;
            &:last-child{font-size: .8em; line-height: 18px; margin-top: 5px}
          }
          .big-text {font-size:2.5em; font-weight: 700; color: #474747; display: inline-block; line-height: 100%;}
        }
      }
    }
  }
}

/*Testimonial*/
.testimonial_review{  
  .reviewslide {width: 80%; max-width: 1070px; margin:0 auto; opacity: 1;  padding:50px 50px 0px 50px; border-radius: 4px; position: relative; 
    &__authorimg{position: absolute; bottom: 0; left: 0; bottom: 0; width: 260px;
      img{ position: relative; z-index: 1; width: 100%}
      &:before {content: ""; position: absolute; width: 250px; height: 250px; background-color: #fedc86; left: 0px; top: 0px; z-index: 0; border-radius: 100%; transition: all ease .5s .3s;}
    }
    &__content{ padding-left: 280px; padding-right: 70px; padding-bottom: 70px; min-height: 320px;
      .blockquote {color: $white; font-size: $basefont-size * 1.25; font-weight: 500; font-style: italic;
        &:after {content: "\f10e"; font-family: FontAwesome; font-size: $basefont-size * 4; height: 80px; opacity: 0.07; position: absolute; right: 40px; top: 0; width: 80px; }
      }
      &-author{color: $white;font-size: $basefont-size * 1.125; font-weight: 600; margin-top: 10px;
        .review-role{ color: rgba($white, .6); font-size: $basefont-size * .875; font-weight: normal;}
      }
    }
  }
  .swiper-slide {
    &.swiper-slide-active{
      .review_slide{
        .author_img{
          &:before {left: 24px; top: -25px; }
        }
      }
    }
    &.swiper-slide-active .review_slide {width: 80%; max-width: 1070px; margin:0 auto; opacity: 1;  padding:50px 50px 0px 50px; border-radius: 4px; }
  }  
  .swiper-button-next, .swiper-button-prev { top: auto; bottom: 10px; background: url(../images/arrow-right.svg) center no-repeat!important; background-size: 40px auto!important; opacity: .5; border-radius: 0%;  transition: .5s all ease; overflow: hidden!important; box-shadow:none; height: 50px !important; width: 80px !important; z-index: 1;
    &:after{ content: '';}
    &:hover {opacity: 1;}
  }
  .swiper-button-next {right: 50% !important; left: auto; margin-right: -70px;
  }
  .swiper-button-prev { left: 50% !important; right: auto; margin-left:-70px; -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg);
  }
  .swiper-slide.swiper-slide-active .reviewslide__authorimg:before {left: 24px; top: -25px; }
}
/*Testimonial*/

.industries{
  .grid{ position: relative; padding: 1em 0 2em;
    figure{ background-color: transparent !important;
      .img{ position: relative; display: block; overflow: hidden;
        img{ position:absolute; left:50%; top:50%; transform: translate(-50%, -50%) scale(1.1) rotate(2deg); width:100%; min-height:100%; object-fit:cover;}
        &:after{ content:''; display:block; padding-bottom:105% }
      }
      figcaption{ transition: .05s all ease; position: relative; padding: 1.2em 1.5em;
        a{    text-indent: 0; border: 1px solid; color: #fff; opacity: 1; font-size: 14px; padding: 4px 20px 8px; border-radius: 20px; margin-top: 20px; display: inline-block;}
        h2{ color:#fff; margin-top:0; padding-top:0;     font-size: 22px; font-weight:600; }
        p {opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); padding: 0; text-overflow:ellipsis; overflow:hidden; display: -webkit-box !important;-webkit-line-clamp: 2; color: #FFF;-webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; margin-bottom: 10px; font-size: 14px; font-weight: 300;}
      }
      &:nth-child(1n){
        figcaption{background: #20376a !important;}
      }
      &:nth-child(2n){
        figcaption{background: #58698f !important;}
      }
      &:nth-child(3n){
        figcaption{background: #8f9bb4 !important;}
      }
      &:nth-child(4n){
        figcaption{background: #aeb6c7 !important;}
      }
      &:nth-child(5n){
        figcaption{background: #8f9bb4 !important;}
      }
      &:nth-child(6n){
        figcaption{background: #58698f !important;}
      }
      &:nth-child(7n){
        figcaption{background: #20376a !important;}
      }
      &:hover{
        .img img{ transform: translate(-50%, -50%) scale(1.0) rotate(0deg)}
      }
    }
    .swiper-industries {padding-bottom: 50px !important; }
  }
}

.blog{ border-radius: 18px; overflow: hidden; margin: 13px 15px; display: inline-block; background:#FFF;;
  /*&__body{ padding:.5rem 1.5rem; display:flex; flex-direction: column; justify-content: center; height: 100%; border: 1px solid #dee2e6!important;
    h5{ font-size:1.25rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
    p{ font-size:.875rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; margin-bottom:0  }
  }*/
  .blog__img{position: relative; display: block; overflow: hidden;
    &:after{ content:''; position:relative; display: block; padding-bottom:62.67% }
    img{ position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);object-fit: cover; min-height: 100%;} 
    &.col2{
      &:after{ padding-bottom:calc(130% - 7px) }
    }
  }

  .blog__body{ padding:30px;
    .blog__date{ font-size:70%; margin-bottom:15px;
      a{color: #6c757d!important}
      i{ margin-right: 5px}
    }
    h5{ font-size:22px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
    p{ font-size:.875rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; margin-bottom:0  }
  }
  .readmore{  font-size: .75rem; margin-top: 25px; display: inline-block;position: relative;
    &:after{ content:"→"; margin-left:10px; transition:.5s ease all; }
    &:before{ content:''; position:absolute; bottom:-5px; width:50px; height:1px; background:#999 }
    &:hover{ text-decoration:none;
      &:after{ margin-left:20px;}
    }
  }
}