html {
  scroll-behavior: smooth;
}

@media (min-width: 992px) {
  .navbar-expand-lg .navbar-toggler {
    display: none !important;
  }
}

/* :target:before {
  content:"";
  display:block;
  height:67px; /* fixed header height*/
/* margin:-66px 0 0; negative fixed header height  */


/* animation-name: easy_anchore;
  animation-duration: 0.2s;
  animation-timing-function: ease-in;
  animation-fill-mode: forwards; */
/* } */


/* @keyframes easy_anchore {
  from {margin-top: 0px;}
  to {margin-top: -68px;}
} */

.intro-2 {
  background: url("https://mdbootstrap.com/img/Photos/Others/img(40).jpg")no-repeat center center;
  background-size: cover;
}

.view.intro-2 {
  background-image: url("https://mdbootstrap.com/img/Photos/Others/img(40).jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.navbar {
  background-color: transparent;
}

.top-nav-collapse {
  background-color: #4285F4;
}


.my-hidden-nav-transform {
  background: #4285F4;
}

.my-hidden-nav-transform img {
  width: 50px !important;
  height: 50px !important;
  border-radius: 50%;
}

.my-hidden-nav-transform-a {
  padding-bottom: 0;
}



@media only screen and (max-width: 768px) {
  .navbar {
    background-color: #4285F4;
  }

  .mtop {
    height: 65px !important;
  }

  #profile-img {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50%;
  }

  .navbar-brand {
    padding-left: 0px !important;
    padding-top: 0px !important;
  }

  .view {
    margin-top: 0px !important;
  }

  #name-status {
    font-size: 23px !important;
    color: white;
  }

  .mask {
    padding: 21% 5% !important;
  }

  .client .card-img {
    height: 300px;
  }
}

html,
body {
  height: 100%;
}

header {
  height: max-content;
}

.navbar-brand {
  padding-left: 40px;
  padding-top: 30px;
  color: white !important;
}

.my-hidden-nav .navbar-brand {
  padding-left: 40px;
  padding-top: 0px;
}

.view {
  margin-top: -170px;
}

.mask {
  background-color: #5100808a;
  padding: 21% 10%;
}

#name-status {
  font-size: 43px;
  color: white;
}



#profile-img {
  width: 90px;
  height: 90px;
  border-radius: 50%;
}

.my-hidden-nav #profile-img {
  width: 90px;
  height: 90px;
  border-radius: 50%;
}

/* .my-hidden-nav{
  transform: translateY(-140px);
  background: #4285F4;
} */

.show-nav {
  animation-name: show;
  animation-duration: 1s;
  animation-timing-function: ease-in;
  animation-fill-mode: forwards;
}


@keyframes show {
  from {
    transform: translateY(-140px);
  }

  to {
    transform: translateY(0px);
  }
}


.nav-item {
  padding: 0px 10px;
}

.skills {
  padding: 8px 0;
}

.skills .progress {
  background: #2472f5;
  font-size: 1px;
}

.skill-name {
  display: block;
  padding: 4px;
  overflow: hidden;
}

.name {
  float: left;
}

.percentage {
  float: right;
}


.anchor {
  font-size: 12px;
  padding-top: 11px;
  color: white;
}

.personal-img {
  /* height: 100px; */
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(45deg, #405de6, #5851db, #833ab4, #c13584, #e1306c, #fd1d1d);
}

.personal .card-img {
  height: 300px;
  color: #fff;
}

.card {
  text-align: left;
  font-size: 16px;
  font-style: italic;
  font-weight: 560;
}


.client .card-img {
  height: 283px;
}


.footer {
  background: #4285F4;
  text-align: center;
  padding: 40px;
  font-weight: 400;
  color: black;
}

.footer span {
  color: white;
}


.modal-dialog {
  max-width: 90%;
}

a {
  color: black;
}

.res-alt {
  display: none;
}

.res-header {
  height: 40px;
  width: 100%;
  /* position: fixed; */
}

#scaleSelectContainer {
  display: none !important;
}

#close-mode-one {
  position: absolute;
  right: -24px;
  color: white;
  top: -27px;
  opacity: 1;
}

.dizzitapp-container{
  background-color: #4285f4;
}

.ecocomm-container,
.ncm-container{
  background-color: #4285f4
}

.ecocomm-container img,
.ncm-container img{
  padding: 28px 0;
}

.dizzitapp{
  max-height: 385px;
  margin: auto;
  display: block;
  padding: 41px 0px;
}

@media (max-width: 991px) {
  .client .card-img {
    height: auto;
  }
  .ecocomm-container img,
  .ncm-container img{
    padding: 0;
    min-height: 290px;
  }

  .dizzitapp{
    max-height: 300px;
  }
}

@media (max-width: 770px) {
  .res-alt {
    display: block;
  }

  .res {
    display: none;
  }

  #modalQuickView {
    display: none !important;
  }

  .modal-backdrop {
    display: none;
  }
}

@media (max-width: 485px) {
  .ecocomm-container img,
  .ncm-container img {
    min-height: auto;
  }
}