html {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translateZ(0px);
  -webkit-transform: translate3d(0,0,0);
  -webkit-perspective: 1000;
}
* {
  -webkit-overflow-scrolling: touch;
}
/*filter animation*/
.item{
    margin-left: 10px;
    opacity: 0;
    /*transition-delay: 3s;*/
}
.active{
    opacity: 1!important;
}
.container {
    padding: 33px 0px!important;
    max-width: 100%!important;
}
.moving-left{
    position: relative;
    transition: margin-left 2s ease;
    margin-left: 0;
    width: 100px;
    display: flex;
    margin-left: 0;
    margin-top: -12px;
}

.menu__logo {
    display: flex!important;
    width: 170px!important;
}

.menu__logo span {
  margin-top: 4%!important;
}

/*overlay*/
.container2 {
    position: relative;
  }
  
  .image {
    display: block;
    width: 100%;
    height: auto;
  }
  
  /*header*/
  .wrapper .overlayheader {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #4900FB;
    width: 49%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper .header:hover .overlayheader {
    bottom: 0;
    height: 94.5%;
    overflow: visible;
  }

  /*content2*/
  .wrapper .overlaycontent2 {
    position: absolute;
    top: 0%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 49.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper .content2:hover .overlaycontent2 {
    bottom: 0;
    height: 45.6%;
    overflow: visible;
    width: 49.1%;
  }

  /*content*/
  .wrapper .overlaycontent {
    position: absolute;
    top: 48.5%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 23.5%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper .content:hover .overlaycontent {
    bottom: 0;
    height: 46%;
    overflow: visible;
  }

  /*footer*/
  .wrapper .overlayfooter {
    position: absolute;
    top: 48.5%;
    left: 76%;
    right: 0;
    background-color: #4900FB;
    width: 24.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper .footer:hover .overlayfooter {
    bottom: 0;
    height: 46%;
    overflow: visible;
    width: 24.1%;
  }

  /*header*/
  .wrapper5 .overlayheader {
    position: absolute;
    top: 0;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 49%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper5 .header:hover .overlayheader {
    bottom: 0;
    height: 89%;
    overflow: visible;
    width: 49%;
  }

  /*footer*/
  .wrapper5 .overlaysidebar {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0;
    background-color: #4900FB;
    width: 49%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper5 .sidebar:hover .overlaysidebar {
    bottom: 0;
    height: 89%;
    overflow: visible;
  }

  /*header*/
  .wrapper2 .overlaysidebar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: #4900FB;
    width: 49%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper2 .sidebar:hover .overlaysidebar {
    bottom: 0;
    height: 94.5%;
    overflow: visible;
  }

  /*content*/
  .wrapper2 .overlaycontent {
    position: absolute;
    top: 0%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 49%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper2 .content:hover .overlaycontent {
    bottom: 0;
    height: 46%;
    overflow: visible;
  }

  /*footer*/
  .wrapper2 .overlayfooter {
    position: absolute;
    top: 48%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 49.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper2 .footer:hover .overlayfooter {
    bottom: 0;
    height: 46.1%!important;
    overflow: visible;
    top: 48%!important;
    width: 49.1%!important;
  }

  /*header*/
  .wrapper6 .overlayheader {
    position: absolute;
    top: 0%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 49.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper6 .header:hover .overlayheader {
    bottom: 0;
    height: 89%;
    overflow: visible;
    width: 49.1%!important;
  }

  /*footer*/
  .wrapper6 .overlaysidebar {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0;
    background-color: #4900FB;
    width: 49%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper6 .sidebar:hover .overlaysidebar {
    bottom: 0;
    height: 89%;
    overflow: visible;
  }

  /*header*/
  .wrapper4 .overlayheader {
    position: absolute;
    top: 0%;
    left: 76%;
    right: 0;
    background-color: #4900FB;
    width: 24.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper4 .header:hover .overlayheader {
    bottom: 0;
    height: 89%;
    overflow: visible;
    width: 24.1%;
  }

  /*footer*/
  .wrapper4 .overlaysidebar {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0;
    background-color: #4900FB;
    width: 49%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper4 .sidebar:hover .overlaysidebar {
    bottom: 0;
    height: 89%;
    overflow: visible;
  }

  /*content*/
  .wrapper4 .overlaycontent {
    position: absolute;
    top: 0%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 23.5%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper4 .content:hover .overlaycontent {
    bottom: 0;
    height: 89%;
    overflow: visible;
  }

  /*header*/
  .wrapper7 .overlaysidebar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: #4900FB;
    width: 49%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper7 .sidebar:hover .overlaysidebar {
    bottom: unset;
    height: 94.5%;
    overflow: visible;
    top: 0%;
    width: 49%;
  }

  /*content*/
  .wrapper7 .overlaycontent {
    position: absolute;
    top: 0%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 49.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper7 .content:hover .overlaycontent {
    bottom: 0;
    height: 46%;
    overflow: visible;
    width: 49.1%;
  }

  /*footer*/
  .wrapper7 .overlayfooter {
    position: absolute;
    top: 48%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 49.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper7 .footer:hover .overlayfooter {
    bottom: 0;
    height: 46.5%;
    overflow: visible;
    width: 49.1%;
  }
  
  .text {
    position: absolute;
    font-size: large;
    top: 40px;
    left: 40px;
    opacity: 0;
    transition-property: opacity;
    transition-duration: 1s;
    transition-delay: 0.5s;
  }
  .image:hover .text {
    opacity: 1;
  }
  .text h3 {
    color: white;
  }

/*grid*/
.header {
    grid-area: hd;
}
.footer {
    grid-area: ft;
}
.content {
    grid-area: main;
}
.content2 {
    grid-area: main2;
}
.sidebar {
    grid-area: sd;
}
.wrapper {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-auto-rows: minmax(0px, auto);
    grid-template-areas: 
      "hd hd hd hd main2 main2 main2 main2  "
      "hd hd hd hd main main ft ft"
      ;
}
.wrapper .header {
    height: 790px;
    background-image: url(/img/dimal/profile-photo.png);
    background-size: cover;
    background-position: center;
}
.wrapper .content {
    height: 382.5px;
    background-image: url(/img/poliknikagjermane/pgj.jpg);
    background-size: cover;
    background-position: center;
    margin-top: -10px;
}
.wrapper .content2 {
    height: 382.5px;
    background-image: url(/img/healthylicious/Cover.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper .footer {
    height: 382.5px;
    background-image: url(/img/hgj/hgj.jpg);
    background-size: cover;
    background-position: center;
    margin-top: -10px;
}
.wrapper2 {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-auto-rows: minmax(0px, auto);
    grid-template-areas:
        "sd sd sd sd main main main main"
        "sd sd sd sd ft ft ft ft";
    grid-gap: 25px;
    border-radius: 5px;
    max-width: 1200px;
    margin: 0 auto;
    margin-bottom: -25px;
}
.wrapper2 .header {
    height: 280px;
    background-position: center;
}
.wrapper2 .content {
    height: 382.5px;
    background-image: url(/img/albrecovery/albrecovery.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper2 .sidebar {
    height: 790px;
    background-image: url(/img/nfma/nfma.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper2 .footer {
    height: 382.5px;
    background-image: url(/img/otium/otium.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper3 {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-auto-rows: minmax(0px, auto);
    grid-template-areas: 
      "sd sd main2 main2 main main main main"
      "hd hd hd hd ft ft ft ft"
      ;
}
.wrapper3 .header {
    height: 330px;
    background-position: center;
}
.wrapper3 .content {
    height: 300px;
    background-position: center;
}
.wrapper3 .content2 {
    height: 300px;
    background-position: center;
}
.wrapper3 .sidebar {
    height: 300px;
    background-position: center;
}
.wrapper3 .footer {
    height: 330px;
    background-position: center;
}
.wrapper4 {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-auto-rows: minmax(100px, auto);
    grid-template-areas: 
      "sd sd sd sd main main hd hd"
      ;
}
.wrapper4 .header {
    height: 382.5px;
    background-image: url(/img/muito/muito.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper4 .content {
    height: 382.5px;
    background-image: url(/img/faas/faas.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper4 .sidebar {
    height: 382.5px;
    background-image: url(/img/qato/qato.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper5 {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-auto-rows: minmax(100px, auto);
    grid-template-areas: 
      "sd sd sd sd hd hd hd hd"
      ;
}
.wrapper5 .header {
    height: 382.5px;
    background-image: url(/img/luara/luara.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper5 .sidebar {
    height: 382.5px;
    background-image: url(/img/suko/suko.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper6 {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-auto-rows: minmax(100px, auto);
    grid-template-areas: 
      "sd sd sd sd hd hd hd hd"
      ;
}
.wrapper6 .header {
    height: 382.5px;
    background-image: url(/img/zean/zean.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper6 .sidebar {
    height: 382.5px;
    background-image: url(/img/akkakappa/akkakappa.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper7 {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-auto-rows: minmax(0px, auto);
    grid-template-areas:
        "sd sd sd sd main main main main"
        "sd sd sd sd ft ft ft ft";
    grid-gap: 25px;
    border-radius: 5px;
    max-width: 1200px;
    margin: 0 auto;
    margin-bottom: -20px;
}
.wrapper7 .header {
    height: 280px;
}
.wrapper7 .content {
    height: 382.5px;
    background-image: url(/img/vela/vela.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper7 .sidebar {
    height: 790px;
    background-image: url(/img/hsem/hsem.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper7 .footer {
    height: 382.5px;
    background-image: url(/img/albasolutions/banner.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper {
    border-radius: 5px;
    max-width: 1200px;
    margin: 0 auto;
    height: 840px;
    grid-gap: 25px;
    margin-bottom: -25px;
}

.wrapper3 {
    border-radius: 5px;
    max-width: 1200px;
    margin: 0 auto;
    height: 640px;
    grid-gap: 5px;
}
.wrapper4 {
    border-radius: 5px;
    max-width: 1200px;
    margin: 0 auto;
    height: 430px;
    grid-gap: 25px;
    margin-bottom: -5px;
}
.wrapper5 {
    border-radius: 5px;
    max-width: 1200px;
    margin: 0 auto;
    height: 430px;
    grid-gap: 25px;
    margin-bottom: -25px;
}
.wrapper6 {
    border-radius: 5px;
    max-width: 1200px;
    margin: 0 auto;
    height: 430px;
    grid-gap: 25px;
    margin-bottom: -15px;
}
.wrapper > div {
    padding: 1em;
    color: #606060;
}
.wrapper2 > div {
    padding: 1em;
    color: #606060;
}
.wrapper3 > div {
    padding: 1em;
    color: #606060;
}
.wrapper4 > div {
    padding: 1em;
    color: #606060;
}
.wrapper5 > div {
    padding: 1em;
    color: #606060;
}
.wrapper6 > div {
    padding: 1em;
    color: #606060;
}
.wrapper7 > div {
    padding: 1em;
    color: #606060;
}
.wrapper8 > div {
  padding: 1em;
  color: #606060;
}
.wrapper8 {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-auto-rows: minmax(0px, auto);
  grid-template-areas: 
    "sd sd sd sd hd hd hd hd"
    ;
}
.wrapper8 .header {
  height: 330.5px;
  background-image: url(/img/vh/banner.jpg);
  background-size: cover;
  background-position: center;
}
.wrapper8 .sidebar {
  height: 330.5px;
  background-image: url(/img/brema/banner.png);
  background-size: cover;
  background-position: center;
}
  /*header*/
  .wrapper8 .overlayheader {
    position: absolute;
    top: 0%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 49.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper8 .header:hover .overlayheader {
    bottom: 0;
    height: 87.5%;
    overflow: visible;
    width: 49.1%;
  }

  /*footer*/
  .wrapper8 .overlaysidebar {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0;
    background-color: #4900FB;
    width: 49%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
  .wrapper8 .sidebar:hover .overlaysidebar {
    bottom: 0;
    height: 87%;
    overflow: visible;
  }
  .wrapper8 {
    grid-gap: 25px;
    border-radius: 5px;
    max-width: 1200px;
    margin: 0 auto;
    margin-bottom: -25px;
}
.wrapper9 .footer {
    height: 329.5px;
    background-image: url(/img/bati/cover.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper9 .sidebar {
    height: 329.5px;
    background-image: url(/img/peppermint/peppermint.jpg);
    background-size: cover;
    background-position: center;
}
 .wrapper9 .overlaysidebar {
    position: absolute;
    top: 0%;
    left: 51%;
    right: 0;
    background-color: #4900FB;
    width: 49.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
 .wrapper9 .overlayfooter {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0;
    background-color: #4900FB;
    width: 49.1%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;
  }
 .wrapper9 {
    grid-gap: 25px;
    border-radius: 5px;
    max-width: 1200px;
    margin: 0 auto;
    margin-bottom: -25px;
}
.wrapper9 {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-auto-rows: minmax(0px, auto);
    grid-template-areas: "ft ft ft ft sd sd sd sd";
}
.wrapper9 .footer:hover .overlayfooter {
    bottom: 0;
    height: 87%!important;
    overflow: visible;
    top: 0%!important;
}
.wrapper9 .sidebar:hover .overlaysidebar {
    bottom: 0;
    height: 87%!important;
    overflow: visible;
    top: 0%!important;
}
.footer {
    grid-area: ft;
}
body{
    background-color: #000!important;
}
.menu-icon__line2{
    background-color: #fff!important;
}
  .right {
    position: absolute!important;
    right: 50px!important;
}

.menu-icon__line {
    margin-bottom: 7px!important;
}
.menu-icon {
    padding-top: 15px!important;
}

label{
  line-height: 0!important;
  margin-left: 10px;
}

.mpx_nav {
  width: 100%;
  margin-top: -1.3%;
  margin-left: 10%;
}
.nav_menu li{
display:inline-block;
vertical-align : top;
}
.nav_menu a{
  display: inline-block;
  padding: 0 1em;
  text-decoration: none;
  list-style: none;
  color: #D1FF5A!important;
  line-height: 40px;
  -webkit-transition: all 3s ease-in-out;
  -moz-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  vertical-align : top
}
.nav_menu a:hover {
  /*background-color: #eee;*/
  color: #fff;
  font-weight: 700;
}
.dropdown {
  /*position: relative;*/
  /*display: inline-block;*/
  white-space:nowrap;
}
.dropdown-content {
  display: inline-block;
  vertical-align : top;
  /*position: absolute;*/
/*    background-color: rgba(98, 98, 98, 1);*/
  /*background-color: #eee;*/
  /*min-width: 160px;*/
  /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
  z-index: 5;
  width:0;
  overflow:hidden;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.dropdown-content a {
  /*color: rgb(98, 98, 98);*/
  /*padding: 12px 16px;*/
  text-decoration: none;
  
}
.dropdown-content a:hover {
  color: yellow;
}
.dropdown:hover .dropdown-content {
  /*display: inline-block;*/
  width:100%
}
.first:hover {
  color: red;
}

@font-face {
  font-family: AvenirLTStdBook;
  src: url(../fonts/AvenirLTStd-Book.otf);
}

.text p {
  font-family: AvenirLTStdBook;
  color: #D1FF5A;
}
.text h3 {
  font-family: AvenirLTStdBook;
  color: #4900FB;
}

@media all and (max-width: 480px) {
    .wrapper9 .sidebar {
    height: 211.5px!important;
    }
  .text {
    left: 30px!important;
    right: 20px;
  }
    .menu__logo img {
        width: 20%!important;
    }
  .menu__logo span {margin-top: -15%!important;}
  .menu__logo p {margin-top: 3px!important;}
  .wrapper {
    display: grid;
    grid-template-areas:
        "hd ft"
        "main2 main2"!important;
    grid-template-columns: repeat(2, 2fr);
    grid-auto-rows: auto;
    margin-bottom: 0px!important;
  }
  .wrapper5 {
    display: grid;
    grid-template-areas:
        "sd"
        "hd"!important;
    grid-template-columns: repeat(1, 1fr);
    grid-auto-rows: auto;
    margin-bottom: -50px!important;
  }
  .wrapper2 {
    grid-template-columns: repeat(2, 2fr);
    grid-auto-rows: auto;
    grid-template-areas:
        "sd main2"
        "main main"
        "ft ft"!important;
  }
  .wrapper6 {
    grid-template-areas:
        "sd"
        "hd"!important;
    grid-template-columns: repeat(1, 1fr);
    grid-auto-rows: auto;
    margin-bottom: -45px;
  }
  .wrapper4 {
    grid-template-columns: repeat(2, 2fr);
    grid-auto-rows: auto;
    grid-template-areas: 
    "sd sd" 
    "hd main" !important;
  }
  .wrapper7 {
    grid-template-columns: repeat(1, 1fr);
    grid-auto-rows: auto;
    grid-template-areas:
        "ft" 
        "main"
        "sd"!important;
        margin-bottom: 20px!important;
  }
  .wrapper .header {
    height: 228.5px!important;
    width: 100%;
  }
  .wrapper .content2 {
    height: 211.5px!important;
  }
  .wrapper5 .sidebar {
    height: 211.5px!important;
}
.wrapper5 .header {
  height: 211.5px!important;
}
.wrapper {
  height: 100%;
}
.wrapper5 {
  height: 100%;
}
.wrapper2 {
  height: 100%;
}
.wrapper6 {
  height: 100%;
}
.wrapper4 {
  height: 100%;
}
.wrapper7 {
  height: 100%;
}
.wrapper8 {
  height: 100%;
  margin-top: -32%;
  grid-template-areas:
  "sd sd sd sd"
  "hd hd hd hd";
  grid-template-columns: auto;
}
.wrapper2 .sidebar {
  height: 250px;
  width: 100%;
}
.wrapper2 .content {
  height: 211.5px;
}
.wrapper2 .footer {
  height: 211.5px;
}
.wrapper6 .header {
  height: 211.5px;
}
.wrapper6 .sidebar{
  height: 211.5px;
  margin-top: -15px;
}
.wrapper4 .header{
  height: 211.5px;
}
.wrapper4 .sidebar{
  height: 211.5px;
  margin-top: 0px;
}
.wrapper4 .content{
  height: 211.5px;
}
.wrapper7 .sidebar {
  height: 400px;
}
.wrapper7 .content {
  height: 211.5px;
}
.wrapper7 .footer {
  height: 211.5px;
  margin-top: -40px;
}
.wrapper8 .header {
  height: 211.5px;
}
.wrapper8 .sidebar{
  height: 211.5px;
  margin-top: -45px;
}
.menu {
  width: 125%!important;
}
.mpx_nav {display: none;}

.wrapper .header:hover .overlayheader {
  top: 0;
  height: 42%;
  width: 50%;
  bottom: unset;
  transition: unset!important;
}
.wrapper .content:hover .overlaycontent {
  bottom: 0!important;
  height: 25%!important;
  left: 0%!important;
  width: 100%!important;
}
.wrapper .content2:hover .overlaycontent2 {
    height: 44%!important;
    top: 51%!important;
    left: 0%!important;
    width: 100%!important;
    transition: unset!important;
}
.wrapper .overlaycontent2{
    top: 46%!important;
    transition: unset!important;
}
.wrapper .footer:hover .overlayfooter {
  bottom: unset;
  height: 47%!important;
  overflow: visible;
  width: 50%!important;
  top: 0;
  left: 50%;
}
.wrapper5 .header:hover .overlayheader {
  bottom: 0;
  height: 41%;
  overflow: visible;
  left: 0;
  width: 100%;
  top: 45%;
}
.wrapper5 .sidebar:hover .overlaysidebar {
  bottom: 0;
  height: 41%;
  overflow: visible;
  width: 100%;
}
.wrapper2 .sidebar:hover .overlaysidebar {
  top: 0;
  bottom: unset;
  height: 30.5%;
  overflow: visible;
  width: 47%;
}
.wrapper2 .content:hover .overlaycontent {
  bottom: 0;
  height: 23%;
  overflow: visible;
  left: 0;
  top: 43%;
  width: 100%;
}
.wrapper2 .content2:hover .overlaycontent2 {
  bottom: unset;
  height: 30.5%;
  overflow: visible;
  left: 50%;
  top: 0;
  width: 50%;
}
.wrapper2 .footer:hover .overlayfooter {
  top: 62%!important;
  bottom: unset;
  height: 26.5%!important;
  overflow: visible;
  width: 100%!important;
  left: 0;
}
.wrapper6 .header:hover .overlayheader {
  width: 100%!important;
  bottom: 0;
  height: 48%;
  overflow: visible;
  left: 0;
  top: 40%;
}
.wrapper6 .sidebar:hover .overlaysidebar {
  top: -15px;
  height: 42%;
  overflow: visible;
  width: 100%;
}
.wrapper8 .header:hover .overlayheader {
  width: 100%;
  bottom: 0;
  height: 47%;
  overflow: visible;
  left: 0;
  top: 47%;
}
.wrapper8 .sidebar:hover .overlaysidebar {
  bottom: 0;
  height: 100%;
  overflow: visible;
  width: 47%;
}
.wrapper8 .header:hover .overlayheader {
  width: 50%;
  bottom: 0;
  height: 100%;
  overflow: visible;
  left: 50%;
  top: 0;
}
.wrapper4 .sidebar:hover .overlaysidebar {
  bottom: 0;
  height: 38%!important;
  overflow: visible;
  width: 100%;
  top: 0px;
}
.wrapper4 .content:hover .overlaycontent {
bottom: unset;
    height: 44.5%;
    overflow: visible;
    width: 50%;
    left: 50%;
    top: 42.5%;
}
.wrapper7 .content:hover .overlaycontent {
  bottom: unset;
  height: 22%;
  overflow: visible;
  width: 100%;
  left: 0;
  top: 19%!important;
}
.wrapper7 .footer:hover .overlayfooter {
  bottom: unset;
  height: 22%;
  overflow: visible;
  top: -4.5%!important;
  left: 0;
  width: 100%;
}
.wrapper .content {
  height: 218.5px;
  background-size: cover;
  width: 100%;
  display: none;
}
.wrapper .footer {
  height: 228.5px;
  width: 100%!important;
  background-size: cover;
  margin-top: 0px!important;
}
.wrapper4 .content {
  height: 244.5px;
  width: 100%!important;
}
.wrapper4 .header {
  height: 244.5px;
  width: 100%;
}
.wrapper2 .content2 {
  display: block!important;
  width: 100%!important;
  background-image: url("../img/poliknikagjermane/pgj.jpg");
  background-size: cover;
  height: 250px;
}
.container {
  padding: 50px 0px!important;
}
.menu {
  top: 0px!important;
  padding: 10px!important;
}
.wrapper2 {
  margin-bottom: -15%;

}
}
.wrapper2 .header {
  display: none;
}
.wrapper2 .overlayheader {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background-color: #4900FB;
  width: 100%;
  height: 0;
  transition: .5s ease;
  overflow: hidden;
}
.wrapper2 .overlaycontent2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background-color: #4900FB;
  width: 100%;
  height: 0;
  transition: .5s ease;
  overflow: hidden;
}
.wrapper2 .content2 {
  display: none;
}

/*overlaymobile*/
/*wrapper*/
.overlayheadermphovered{
  top: 0!important;
  height: 47%!important;
  width: 47%!important;
  bottom: unset!important;
  transition: none!important;
}
.overlaycontentgphovered{
  bottom: 0!important;
  height: 25%!important;
  left: 0%!important;
  width: 100%!important;
  transition: none!important;
}
.overlaycontent2othovered{
  height: 26.5%!important;
  top: 62%!important;
  left: 0%!important;
  width: 100%!important;
  transition: none!important;
}
.overlayfooterhgjhovered{
  bottom: auto!important;
  height: 47%!important;
  overflow: visible!important;
  width: 47%!important;
  top: 0!important;
  left: 53%!important;
  transition: none!important;
}
/*wrapper5*/
.overlayheaderluhovered{
  bottom: 0;
  height: 45%;
  overflow: visible;
  left: 0;
  width: 100%;
  top: 48%;
  transition: none!important;
}
.overlaysidebarsuhovered{
  bottom: 0;
  height: 47%;
  overflow: visible;
  width: 100%;
  transition: none!important;
}
/*wrapper2*/
.overlaysidebarpphovered{
    top: 0;
    bottom: unset;
    height: 29%;
    overflow: visible;
    width: 47%!important;
    transition: none!important;
}
.overlaypgjhovered{
    bottom: unset;
    height: 30.5%!important;
    overflow: visible;
    left: 53%!important;
    top: 0;
    width: 50%!important;
    transition: none!important;
}
.overlayalbhovered{
bottom: 0!important;
    height: 27%!important;
    overflow: visible!important;
    left: 0;
    top: 33%!important;
    width: 100%;
    transition: none!important;
}
.overlayarpeghovered{
  top: 60%!important;
  bottom: unset;
  height: 47%;
  overflow: visible;
  width: 100%;
  left: 0;  
  transition: none!important;
}
/*wrapper6*/
.overlayzeanhovered{
  width: 100%!important;
  bottom: 0;
  height: 42%!important;
  overflow: visible;
  left: 0!important;
  top: 43.5%!important; 
  transition: none!important;
}
.overlayhkhovered{
  bottom: 0;
  height: 45%;
  overflow: visible;
  width: 100%;
  transition: none!important;
}
/*wrapper4*/
.overlaymuitohovered{
    bottom: 0!important;
    height: 44%!important;
    overflow: visible;
    left: 0%!important;
    width: 47%!important;
    top: 42.5%!important;
    transition: none!important;
}
.overlayqatohovered{
  bottom: 0;
  height: 38%!important;
  overflow: visible;
  width: 100%!important;
  transition: none!important;
}
.overlayfaashovered{
  bottom: unset;
  height: 44%;
  overflow: visible;
  width: 55%;
  left: 50%;
  top: 42.5%;
  transition: none!important;
}
/*wrapper7*/
.overlayhsemhovered{
  bottom: unset;
  height: 40%!important;
  overflow: visible;
  top: 43%!important;
  width: 100%!important;
  transition: none!important;
}
.overlaywhovered{
  bottom: unset;
  height: 22%!important;
  overflow: visible;
  width: 100%!Important;
  left: 0!important;
  top: 19%!important;  
  transition: none!important;
  
}
.overlayalbahovered{
  bottom: unset;
  height: 23%;
  overflow: visible;
  top: 0%!important;
  left: 0;
  width: 100%;
  transition: none!important;
}
/*wrapper7*/
.overlayvhhovered{
  width: 100%!important;
  bottom: 0!important;
  height: 48%!important;
  overflow: visible!important;
  left: 0%!important;
  top: 42%!important;
  transition: none!important;
}
.overlaygsahovered{
  bottom: 0!important;
  height: 48%!important;
  overflow: visible!important;
  width: 100%!important;
  display: block!important;
  transition: none!important;
  top: -11%!important;
}

.menu-icon {
  height: 40px !important;
  width: 40px !important;
}

@media (max-width: 480px){
.wrapper9 {
    height: 100%;
    margin-top: 0%;
    grid-template-areas:
        "ft ft ft ft"
        "sd sd sd sd";
    grid-template-columns: auto;
}
.wrapper9 .footer {
    height: 211.5px;
    background-image: url(/img/bati/cover.jpg);
    background-size: cover;
    background-position: center;
}
.wrapper9 .footer:hover .overlayfooter {
    height: 43%!important;
    width: 100%!important;    
}
.wrapper9 .sidebar:hover .overlaysidebar {
bottom: 0;
    height: 43.5%!important;
    overflow: visible;
    top: 47%!important;
    left: 0!important;
    width: 100%!important;
}
.wrapper9 .overlayheader {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0;
    background-color: #4900FB;
    width: 100%;
    height: 0;
    transition: .5s ease;
    overflow: hidden;   
    height: 43%!important;
}
}
@media all and (min-width: 768px) and (max-width: 1023px) {
  .menu-icon {
    padding-top: 40px!important;
    margin-left: 180%;
  }
  .mpx_nav {
    display: none;
  }
  .dropdown-content {
    display: grid;
    background-color: rgba(0,0,0,0.8);
}
.menu {
  left: 35px!important;
  top: 15px!important;
}
.right {
  top: 8px!important;
}
.menu__logo span {
  margin-top: 10%!important;
}
.menu__logo p {
  margin-top: 14px!important;
}
.container {
  padding: 70px 0px!important;
}
.menu__logo {
  width: 50px!important;
  height: 40px!important;
  margin-left: -1px!important;
  margin-top: -1px!important;
}
#nav-close {
  margin: 55px 50px auto auto!important;
}
}

@media all and (min-width: 1024px) and (max-width: 1365px) {
  .mpx_nav{display: none;}
}

@media all and (min-width: 1921px) {
  .mpx_nav{margin-top: -1%;}
}

@media only screen 
and (min-width : 768px) 
and (max-width : 850px) 
and (orientation : landscape)  
{ 
.menu__logo span{
  margin-top: -14%!important;
}
.menu__logo p{
  margin-top: 3px!important;
}
}

@media all and (min-width: 1921px) {
  .right {
      position: absolute!important;
      right: 20px!important;
  }
}

.container2 h3 {
  color: #D1FF5A!important;
}

@media (max-width: 820px) and (min-width: 481px) {
.main .right {
    margin-left: 90vw!important;
    margin-top: 0%!important;
}
.work-cards {
  margin-top: 15%!important;
}
.mpx_nav {
  display: none;
}
.menu {
  width: 106%!important;
}
#nav-close {
  margin: 65px 60px auto auto!important;
}
}

@media all and (min-width: 1600px) {
  .container2 h3 {
    font-size: 3em!important;
    text-transform: uppercase;
  }
  #ov14 h3 {
    font-size: 2em!important;
  }
  .gp h3{
    font-size: 2em!important;
  }
  #ov4 h3 {
    font-size: 2em!important;
  }
  #ov12 h3 {
    font-size: 2em!important;
  }
}

@media all 
    and (min-width: 900px) 
    and (max-width: 928px) {
    
.menu-icon {
    padding-top: 40px!important;
    margin-left: 180%;
  }
.mpx_nav {
    display: none;
  }
.dropdown-content {
    display: grid;
    background-color: rgba(0,0,0,0.8);
}
.menu {
  left: 35px!important;
  top: 15px!important;
}
.right {
  top: 8px!important;
}
.menu__logo span {
  margin-top: 10%!important;
}
.menu__logo p {
  margin-top: 14px!important;
}
.container {
  padding: 70px 0px!important;
}
.menu__logo {
  width: 50px!important;
  height: 40px!important;
  margin-left: -1px!important;
  margin-top: -1px!important;
}
#nav-close {
  margin: 55px 50px auto auto!important;
}
.menu__logo span{
  margin-top: 4%!important;
}
.menu__logo p{
  margin-top: 10px!important;
}

    .right {
        margin-left: 83vw;
        top: -40px;
    }
    .table {
        margin-top: 25%;
    }
    .menu__logo {
        left: 25px;
    }
    #clientes .container .cliente {
        padding-top: 30%!important;
    }
    #about-equipe #redes {
        height: 25%!important;
    }
    #contactTxt {
        margin-left: 4.5%;
        margin-right: 4.5%;
        margin-top: 5%;
    }
    #contato .col {
        margin-left: 4.5%;
    }
    .pull-right {
        margin-right: 10px;
    }
    #contato .col.right {
        margin-top: 5%;
    }
    .title-redes {
        margin-bottom: 5%;
    }
    #about-equipe #redes hr {
        margin: 0px 19px 15px 31px!important;
    }
    .wrapper .header {
        height: 510px!important;
    }
    .wrapper .content {
        height: 243.5px!important;
        margin-top: -92%!important;
    }
    .wrapper .footer {
        height: 243.5px!important;
        margin-top: -92%!important;
    }  
    .wrapper .content2 {
        height: 232.5px!important;
    }  
    .wrapper5 {
        margin-top: -33%!important;
    }
    .wrapper5 .header {
        height: 232.5px!important;
    }
    .wrapper5 .sidebar {
        height: 232.5px!important;
    }  
    .wrapper2 {
        margin-top: -19%!important;
    }  
    .wrapper2 .sidebar {
        height: 510px!important;
    }
    .wrapper2 .content {
        height: 243.5px!important;
    }
    .wrapper2 .footer {
        height: 243.5px!important;
    }
    .wrapper6 .header {
        height: 243.5px!important;
    }
    .wrapper6 .sidebar {
        height: 243.5px!important;
    }
    .wrapper4 {
        margin-top: -18%!important;
    }
    .wrapper4 .header {
        height: 243.5px!important;
    }
    .wrapper4 .content {
        height: 243.5px!important;
    } 
    .wrapper4 .sidebar {
        height: 244.5px!important;
    } 
    .wrapper7 {
        margin-top: -18%!important;
    }  
    .wrapper7 .sidebar {
        height: 510px!important;
    }
    .wrapper7 .footer {
        height: 243.5px!important;
    }
    .wrapper7 .content {
        height: 243.5px!important;
    }
    .wrapper8 .header {
        height: 243.5px!important;
    }
    .wrapper8 .sidebar {
        height: 243.5px!important;
    }
    .menu {
        left: 35px!important;
        top: 50px;
    }
    #nav-logo {
        top: 50px!important;
        left: 55px!important;
    }
    #nav-close {
        margin: 50px 50px auto auto!important;
    }
    #menu-panel nav {
        margin: 170px 0!important;
    }
    .socialnav {
        margin-top: 20%!important;
    }
    .menu__logo {
        width: 50px!important;
        height: 40px!important;
        margin-left: -9px!important;
        margin-top: -1px!important;
    }
    
    }