@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons'), local('MaterialIcons-Regular'),
  url(../fonts/materialicons.woff2) format('woff2'),
  url(../fonts/materialicons.woff) format('woff');
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  word-wrap: normal;

  font-feature-settings: 'liga'; 
  -webkit-font-feature-settings: 'liga';  
  -webkit-font-smoothing: antialiased;
}

.bg-opacity-8 {
  background-color: rgba(255,255,255,.8);
}

.border-radius-6 {
  border-radius: 6px!important;
}

.border-radius-3 {
  border-radius: 3px!important;
}

.valign-wrapper {
  height: 100vh;
}

.nav-wrapper { 
/*   background: rgb(2,0,36);
  background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(0,44,77,1) 10%, rgba(0,77,64,1) 100%); */
  background: -webkit-linear-gradient(45deg,#303f9f,#7b1fa2)!important;
  background: linear-gradient(45deg,#303f9f,#7b1fa2)!important;
}

.bgsistuc{
  background: rgb(2,0,36);
  background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(0,44,77,1) 10%, rgba(0,77,64,1) 100%);
}


.gradient-deg-blue-green.gradient-shadow{
  box-shadow: 0 6px 20px 0 rgba(0,77,64,1)!important
}

.gradient-deg-blue-green{
  background: -webkit-linear-gradient(45deg,rgb(2,0,36),rgba(0,77,64,1))!important;
  background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(0,44,77,1) 10%, rgba(0,77,64,1) 100%);
}

.gradient-deg-red-pink.gradient-shadow{
  box-shadow: 0 6px 20px 0 rgba(244,143,177,.5)!important
}

.gradient-deg-red-pink{
  background: -webkit-linear-gradient(45deg,#ff5252,#f48fb1)!important;
  background: linear-gradient(45deg,#ff5252,#f48fb1)!important;
}

.gradient-deg-light-blue-cyan.gradient-shadow {
  box-shadow: 0 6px 20px 0 rgba(44, 4, 224, 0.5)!important;
  }

.gradient-deg-light-blue-cyan {
  background: -webkit-linear-gradient(45deg,#01087C,#4048C9)!important;
  background: linear-gradient(45deg,#01087C,#4048C9)!important;
  }   

  .gradient-deg-amber-amber.gradient-shadow {
  box-shadow: 0 6px 20px 0 rgba(255,202,40,.5)!important;
  }

  .gradient-deg-amber-amber {
      background: -webkit-linear-gradient(45deg,#ff6f00,#ffca28)!important;
      background: linear-gradient(45deg,#ff6f00,#ffca28)!important;
  }

  .gradient-deg-green-teal.gradient-shadow {
      box-shadow: 0 6px 20px 0 rgba(29,233,182,.5)!important;
  }

  .gradient-deg-green-teal {
      background: -webkit-linear-gradient(45deg,#43a047,#1de9b6)!important;
      background: linear-gradient(45deg,#43a047,#1de9b6)!important;
  }

  .gradient-45deg-light-blue-cyan {
    background: -webkit-linear-gradient(45deg,#0288d1,#26c6da)!important;
    background: linear-gradient(45deg,#0288d1,#26c6da)!important;
  }

  .gradient-45deg-indigo-purple {
    background: -webkit-linear-gradient(45deg,#303f9f,#7b1fa2)!important;
    background: linear-gradient(45deg,#303f9f,#7b1fa2)!important;
}

  .min-height-100 {
      min-height: 100px!important;
  }

  .animate.fadeLeft {
      -webkit-animation: fadeLeft;
      animation: fadeLeft;
      -webkit-animation-duration: 1.5s;
      animation-duration: 1.5s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both;
  }

  .animate.fadeRight {
      -webkit-animation: fadeRight;
      animation: fadeRight;
      -webkit-animation-duration: 1.5s;
      animation-duration: 1.5s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both;
  }

  .mb-0 {
      margin-bottom: 0!important;
  }

  .nav-wrapper { 
      background: rgb(2,0,36);
      background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(0,44,77,1) 10%, rgba(0,77,64,1) 100%);
    }

  .border-round {
    border-radius: 10px!important;
  }

  .border-round-50 {
    border-radius: 150px!important;
  }

  .width-40 {
    width: 40%!important;
  }

  .width-30 {
    width: 27%!important;
  }


  .animate.fadeUp {
    -webkit-animation: fadeUp;
    animation: fadeUp;
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.btn, .btn-flat, .btn-large, .btn-small {
  text-transform: capitalize;
}

.btn-block {
  display: block;
  width: 100%;
}

.tbtn{
  text-transform: capitalize;
}

.tbtn:hover {
  width: 70%;
}


.content-wrapper-before {
  position: absolute;
  z-index: -1;
  top: 64px;
  left: 0;
  width: 100%;
  height: 185px;
  -webkit-transition: .3s ease all;
  transition: .3s ease all;
}

h4 {
  transform: translateY(100px);
  animation: slideUp .8s ease forwards .5s;
}

.lh5{
  line-height: 28px;
  transform: translateY(300px);
  animation: slideUp .8s ease forwards .8s;
}

.card_ri_img {
  overflow: hidden;
  transform: translateX(6000px);
  animation: slideInR .8s ease-in-out forwards .8s;
}  

.card_le_img {
  overflow: hidden;
  transform: translateX(-6000px);
  animation: slideInL .8s ease-in-out forwards .8s;
} 
    

@keyframes slideUp {
  0% {
    transform: translateY(300px);
  }
  100% {
    transform: translateY(0px);
  }
}

@keyframes slideInR {
  0% {
    transform: translateX(500px) scale(.2);
  }
  100% {
    transform: translateX(0px) scale(1);
  }
}

@keyframes slideInL {
  0% {
    transform: translateX(-500px) scale(.2);
  }
  100% {
    transform: translateX(0px) scale(1);
  }
}