.areas-of-expertise{
  overflow:hidden;
}
.two-or-three-col .single-card{
  transition:0.35 all !important;
}
.two-or-three-col .single-card:hover{
  box-shadow:0 2px 25px #00215b40;
}

@media(min-width:768px){
  .areas-of-expertise.animate_custom .two-or-three-col .single-card {
    -webkit-transform: translateY(50px);
        -ms-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  .areas-of-expertise.animate_custom.animated_custom .two-or-three-col .single-card {
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  .areas-of-expertise .section-heading {
    margin-bottom: 48px;
  }
  .two-or-three-col-inner.three_col .single-card {
    -ms-flex-preferred-size:32.2%;
    flex-basis: 32.2%;
    margin-right: 1.7%;
    margin-bottom:30px;
    border: 1px solid #C5D0D8;
    padding: 60px 49px 30px 52px;
    position: relative;
    z-index: 1;
    cursor:pointer;
    overflow:hidden;
  }
  .two-or-three-col-inner.three_col .single-card:nth-child(3n+3){
    margin-right:0;
  }
  .two-or-three-col-inner.two_col{
    max-width:840px;
    margin:0 auto;
  }
  .two-or-three-col-inner.two_col .single-card {
    -ms-flex-preferred-size:49%;
    flex-basis: 48.81%;
    margin-right:2.38%;
    margin-bottom:30px;
    border: 1px solid #C5D0D8;
    padding: 60px 49px 10% 52px;
    position: relative;
    z-index: 1;
    cursor:pointer;
    overflow:hidden;
  }
  .two-or-three-col-inner.two_col .single-card:nth-child(2n+2){
    margin-right:0;
  }

  .two-or-three-col .single-card .top_content {
    position: relative;
    z-index: 8;
  }
  .two-or-three-col .single-card .icon-box{
    max-width:70px; 
    width:100%;
  }
  .single-card.card_2 .icon-box, .single-card.card_3 .icon-box, .single-card.card_4 .icon-box, .single-card.card_5 .icon-box, .single-card.card_6 .icon-box {
    max-width: 126px;
}
  .two-or-three-col .single-card .title-box {
    margin-top: 31px;
    padding-bottom: 15px;
  }
  .two-or-three-col .single-card .title-box > *{
    -webkit-transition: color 0.4s 0.2s;
    -o-transition: color 0.4s 0.2s;
    transition: color 0.4s 0.2s;
  }
  {# .two-or-three-col .single-card:hover .title-box > *{
    color:#ffff;
    -webkit-transition: color 0.4s;
    -o-transition: color 0.4s;
    transition: color 0.4s;
  }
  .single-card .content-box {
    position: absolute;
    bottom: 44px;
    width: 100%;
    height:100%;
    left: 0;
    padding: 0 49px 0 52px;
    max-height: 140px;
    overflow-y: auto;
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity 0.4s 0.2s,-webkit-transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s 0.2s,-webkit-transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: opacity 0.4s 0.2s,transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s 0.2s,transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s 0.2s,transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1),-webkit-transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  .single-card .content-box::-webkit-scrollbar {
    display: none;
  } #}
  .single-card .content-box {
    -ms-overflow-style: none;  
    scrollbar-width: none;  
  } 
  .two-or-three-col .single-card .card-hover {
    position: relative;
    z-index: 1;
    display: none;
    width: 100%;
    overflow: hidden;
  }
  .two-or-three-col .single-card .card_bg:before {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: rgba(0,0,0,0.4);
    z-index: -1;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
  }
  .two-or-three-col .single-card .card_bg {
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    -webkit-transition:-webkit-transform .7s ease-in-out;
    transition:-webkit-transform .7s ease-in-out;
    -o-transition:transform .7s ease-in-out;
    transition:transform .7s ease-in-out;
    transition:transform .7s ease-in-out, -webkit-transform .7s ease-in-out;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    top:0;
    bottom:0;
    right:0;
    left:0;
  }
  .cards_white_before{
    position: absolute;
    z-index: -1;
    left: -1px;
    right: -1px;
    top: -1px;
    bottom: -1px;
    background: #ffffff;
    -webkit-transform: scaleY(1) translate3d(0, 0, 0);
    transform: scaleY(1) translate3d(0, 0, 0);
    -webkit-transform-origin: top;
    -ms-transform-origin: top;
    transform-origin: top;
    will-change: transform;
    -webkit-transition: -webkit-transform 0.75s cubic-bezier(0.77, 0, 0.175, 1);
    transition: -webkit-transform 0.75s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: transform 0.75s cubic-bezier(0.77, 0, 0.175, 1);
    transition: transform 0.75s cubic-bezier(0.77, 0, 0.175, 1);
    transition: transform 0.75s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform 0.75s cubic-bezier(0.77, 0, 0.175, 1);
  }
  {# .single-card:hover .cards_white_before{
    -webkit-transform: scaleY(0);
    -ms-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: bottom;
    -ms-transform-origin: bottom;
    transform-origin: bottom;
  }
  .single-card:hover .card_bg{
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  .single-card:hover .content-box{
    opacity: 0;
    -webkit-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    transform: translateY(-50px);
    -webkit-transition: opacity 0.4s,-webkit-transform 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s,-webkit-transform 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: opacity 0.4s,transform 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s,transform 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s,transform 0.4s cubic-bezier(0.645, 0.045, 0.355, 1),-webkit-transform 0.4s cubic-bezier(0.645, 0.045, 0.355, 1);
  } #}
  .single-card .card-link{
    position: absolute;
    z-index: 10;
    bottom: 23px;
    -webkit-transform: translateY(40px);
    -ms-transform: translateY(40px);
    transform: translateY(40px);
    opacity: 0;
    -webkit-transition: opacity 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1),-webkit-transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1),-webkit-transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: opacity 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1),transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1),transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1),transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1),-webkit-transform 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  .single-card .card-link .arrow-one a,
  .single-card .card-link a.arrow-one {
    opacity: 0;
    -webkit-transition: opacity 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: opacity 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 0.4s 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  {# .single-card:hover .card-link{
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
    -webkit-transition: all .75s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: all .75s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all .75s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  .single-card:hover .card-link .arrow-one a,
  .single-card:hover .card-link a.arrow-one{
    opacity: 1;
    -webkit-transition: all .75s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: all .75s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all .75s cubic-bezier(0.645, 0.045, 0.355, 1);
  } #}
} 
.two-or-three-col-inner .single-card{
  border: 1px solid #C5D0D8;
  position: relative;
  z-index: 1;
  cursor:pointer;
  overflow:hidden;
  border-radius:5px;
}
@media(max-width:991px){
  .two-or-three-col-inner.three_col .single-card {
    -ms-flex-preferred-size: 48%;
    flex-basis: 48%;
    margin-right:4%;
  }
  .two-or-three-col-inner.three_col .single-card:nth-child(2n+2){
    margin-right:0;
  }
  .two-or-three-col-inner.three_col .single-card:nth-child(3n+3){
    margin-right:4%;
  }
  .two-or-three-col .two-or-three-col-inner {
    row-gap: 30px;
  }
}


@media(max-width:767px){
  .single-card .card-link a{
    color:var(--primary_color);
  }
  .two-or-three-col-inner .single-card {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    margin:0 auto 30px;
    padding: 40px 35px;
  }
  .two-or-three-col-inner.two_col .single-card,
  .two-or-three-col-inner.two_col .single-card:nth-child(2n+2){
    margin-right:0;
  }
  .two-or-three-col-inner.three_col .single-card,
  .two-or-three-col-inner.three_col .single-card:nth-child(3n+3){
    margin-right:0;
  }
  .two-or-three-col .single-card .title-box {
    margin-top: 37px;
    margin-bottom: 20px;
  }
  .areas-of-expertise .section-heading {
    margin-bottom: 67px;
  }
  .top_content .icon-box {
    max-width: 80px;
  }
  .single-card.card_2 .icon-box, .single-card.card_3 .icon-box, .single-card.card_4 .icon-box, .single-card.card_5 .icon-box, .single-card.card_6 .icon-box {
    max-width: 126px;
}
}