/* -------------------------------------------------  Left Menu :: START  -------------------------------------------------*/
.sidebar-menu.open .open-menu .sidebar-menu-item span:nth-child(1) {transform: translateY(5px) translateX(5px) rotate(45deg);width: 30px;}
.sidebar-menu.open .open-menu .sidebar-menu-item span:nth-child(2) {display: none; }
.sidebar-menu.open .open-menu .sidebar-menu-item span:nth-child(3) {transform: translateY(3px) translateX(5px) rotate(-50deg); width: 30px;}

.sidebar-menu {/* transition: left 900ms ease-in-out, right 900ms ease-in-out; */ position: absolute; left: calc(100% - 80px); top: 0; bottom: 0; margin: auto; background-color: #fff; width: 100%;  height: 100%; z-index: 9;/* transition-delay: 0.3s; */transition: all .9s;}
.sidebar-menu .open-menu {display: flex; align-items: center;    justify-content: center;height: 100%;width: 80px;position: absolute;left: 0;z-index: 11;}

.sidebar-menu .open-menu  span{transition: all 0.5s ease; font-size: 0; background-color: #000; height: 2px; width: 31px; display: block; border-radius: 2px; margin-left: auto; }
.sidebar-menu .open-menu  span:nth-child(2) {margin: 5px 0; width: 24px; margin-left: auto; }
.sidebar-menu .open-menu  span:nth-child(3) {width: 17px; }
.sidebar-menu .open-menu .sidebar-menu-item {z-index: 9999; cursor: pointer;}

.sidebar-menu.open .open-menu .sidebar-menu-item span:nth-child(1){transform: translateY(5px) translateX(5px) rotate(45deg);width: 30px;}
.sidebar-menu.open .open-menu .sidebar-menu-item span:nth-child(2){display: none; }
.sidebar-menu.open .open-menu .sidebar-menu-item span:nth-child(3){transform: translateY(3px) translateX(5px) rotate(-50deg); width: 30px;}

.sidebar-menu-banner {position: relative;overflow: hidden;}
.sidebar-menu.open {left: 0;}
.sidebar-menu .open-menu .sidebar-menu-item:hover span:nth-child(2) {margin-top: 7px; margin-bottom: 7px; }

.left-menu.open {left: 0; }
.left-menu .top {opacity: 0;}
.left-menu .middle {padding: 0px 0;width: 100%;}
.left-menu .middle .heading {font-size: 50px;transition: all .9s;font-weight: 300;font-family: 'Poppins', sans-serif;line-height: 65px;transform: translatex(130%);transition-delay: 0.5s;}
.left-menu .middle .heading svg {display: inline-block;width: 200px;}
.left-menu .middle .row {display: flex;margin: 0 -18px;}
.left-menu .middle .row .col {padding: 42px 18px 18px;width: 33.33%;transition: all .9s;transform: translateX(380%);}
.left-menu .middle .row .col .info {}
.left-menu .middle .row .col .info figure {width: 100%;height: 265px;border: 1px solid #000;margin-bottom: 17px;}
.left-menu .middle .row .col .info .left {width: 50%;padding: 0;}
.left-menu .middle .row .col .info .left .title {font-size: 23px;font-weight: 700;line-height: 27px;}
.left-menu .middle .row .col .info .left span {line-height: 27px;}
.left-menu .middle .row .col .info .right {width: 50%; padding: 0;text-align: right;}
.left-menu .middle .row .col .info .right .white-btn {border: 1px solid #000;}
.left-menu .middle .row .col .info .right .white-btn svg {display: inline-block;vertical-align: middle;margin-left: 14px;}
.left-menu .middle .row .col .info .right .white-btn:hover {background-color: #000;color: #fff;}
.left-menu .middle .row .col .info .right .white-btn:hover svg g path {stroke: #fff;}
.left-menu .bottom {padding: 0 100px;transform: translateY(255%);transition: all .5s; transition-delay: 0.9s;width: 100%;}
.left-menu .bottom .row {display: flex;flex-wrap: wrap; align-items: center;}
.left-menu .bottom .row .col {width: 50%;}
.left-menu .bottom .row .col .left {width: auto;padding: 0;vertical-align: middle;}
.left-menu .bottom .row .col .left p {font-size: 25px;font-weight: 600;line-height: 37px;}
.left-menu .bottom .row .col .left p span {display: block;font-weight: 300;}
.left-menu .bottom .row .col .right {width: auto; padding: 0; vertical-align: middle;padding-left: 40px;}
.left-menu .bottom .row .col-2 {text-align: right;}

.svg {position: absolute;width: 100%; z-index: -1;bottom: calc(-100% + 400px);transition: all .9s;left: 0;transition-delay: 0.2s;}
.svg svg {width: calc(100% + 100px);height: 100%;}
.left-menu {padding: 60px 70px 90px;padding: 0 70px;display: flex;align-items: center;height: 100vh;flex-wrap: wrap;}
.sidebar-menu .svg {}
.sidebar-menu.open .svg {/* top: unset; */ transition-delay: 0.7s; bottom: -11px;}
body.menu-open{overflow: hidden;}
body.menu-open header .left {z-index: 99;transition: all .5s; transition-delay: 0.7s;}
body.menu-open header .right{}
.home.menu-open header {z-index: unset;}

@keyframes slide-in-out {
  0% {
    transform: translate3d(100%, 0 ,0);
  }
  20% {
    transform: translate3d(80%, 0 ,0);
  }
  80% {
    transform: translate3d(60%, 0 ,0);
  }
  100% {
    transform: translate3d(0%, 0 ,0);
  }
}
@keyframes slide-in {
  0% {
    transform: translate3d(0%, 0 ,0);
  }
  20% {
    transform: translate3d(60%, 0 ,0);
  }
  80% {
    transform: translate3d(80%, 0 ,0);
  }
  100% {
    transform: translate3d(100%, 0 ,0);
  }
}

.hero-banner .right .banner-content{margin-right: 90px;}
.sidebar-menu.open .left-menu .middle .heading {transform: translatex(0%);}
.sidebar-menu.open .left-menu .middle .row .col {transform: translateX(0%);}
.sidebar-menu.open .left-menu .middle .row .col:nth-child(1) {transition-delay: 0.5s;}
.sidebar-menu.open .left-menu .middle .row .col:nth-child(2) {transition-delay: 0.6s;}
.sidebar-menu.open .left-menu .middle .row .col:nth-child(3) {transition-delay: .7s;}
.left-menu .middle .row .col:nth-child(1) {transition-delay: .7s;}
.left-menu .middle .row .col:nth-child(2) {transition-delay: 0.6s;}
.left-menu .middle .row .col:nth-child(3) {transition-delay: 0.5s;}
.sidebar-menu.open .left-menu .bottom {transform: translateY(0%);}

@media screen and (min-width: 1611px){
  .home header .container-fluid,.hero-banner .platform-icons .container-fluid {right: -14px;}
  .home header,.hero-banner .platform-icons {width: calc(100% - 105px);}
}
@media screen and (min-width: 1750px){
  .home header .container-fluid,.hero-banner .platform-icons .container-fluid{right: -42px;}
  .home header,.hero-banner .platform-icons {width: calc(100% - 128px);}
}

@media screen and (max-width: 1610px) {
  .home header{ padding-right: 60px;}
  .hero-banner .platform-icons{ padding-right: 60px !important;}
  .hero-banner .right .banner-content{margin-right: 73px;}

  .sidebar-menu .open-menu {width: 60px;}
  .sidebar-menu {left: calc(100% - 60px);}
  .left-menu .middle .heading {font-size: 38px;}
  .left-menu .bottom .row .col .left p {font-size: 22px;line-height: 33px;}
}
@media screen and (max-width: 1366px) {
  .hero-banner .platform-icons{ padding-right: 35px !important;}
  .home header {padding-right: 40px;}

  .sidebar-menu .open-menu {width: 40px;}
  .sidebar-menu {left: calc(100% - 40px);}
  .sidebar-menu .open-menu .sidebar-menu-item span {width: 24px;}
  .sidebar-menu .open-menu .sidebar-menu-item span:nth-child(2) {width: 19px;}
  .sidebar-menu .open-menu .sidebar-menu-item span:nth-child(3) {width: 12px;}

  .left-menu .middle .heading {font-size: 30px;}
  .left-menu .middle .row .col {padding: 20px 18px 0px;}
  .left-menu .bottom .row .col .left p {font-size: 20px;line-height: 28px;}
  .left-menu .middle .row .col .info .left .title {font-size: 20px;}
  .left-menu .middle .row .col .info .left span {font-size: 16px;}
  .left-menu .middle .row .col .info figure {height: 250px;}
  .left-menu .middle .row .col .info figure {height: 100%;}
  .left-menu .middle .row .col .info .right .white-btn svg{margin-left: 9px;}
}
@media screen and (max-width: 1199px) {
  .left-menu .middle .heading {font-size: 28px;line-height: 48px;}
  .left-menu .middle .row .col {padding: 20px 10px 0px;}
  .left-menu .middle .row {margin: 0 -10px;}
  .left-menu .middle .row .col .info .right .white-btn,.left-menu .bottom .row .col .right .black-btn {padding: 9.5px 14px;font-size: 15px;}
  .left-menu .bottom .row .col .right .black-btn {}
  .left-menu .middle .row .col .info .right .white-btn svg {margin-left: 4px;}
  .left-menu .middle .row .col .info .left .title {font-size: 18px;}
  .left-menu .middle .row .col .info .left span {font-size: 14px;}
  .left-menu .bottom .row .col .left p {font-size: 18px;line-height: 27px;}
  .left-menu .bottom .row .col .right {padding-left: 18px;}
  .left-menu .bottom {padding: 0 20px;}
}
@media screen and (max-width: 1023px) {
  .sidebar-menu {display: none;}
  .home header {padding-right: 0; }
}
/*  -------------------------------------------------  Left Menu :: END  -------------------------------------------------  */