@media screen and (min-width: 796px) { 
 .overlay {
      height: 0vh;
      width: 30vw;
      min-width: 250px;
      position: fixed;
      z-index: 3;
      top: 0;
      right: 0;
      background-color: rgb(0,0,0);
      background-color: rgba(0,0,0, 0.9);
      overflow-x: hidden;
      transition: 0.3s;
      text-align: center;
      text-transform: capitalize;
    }
.panel-row {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;    
    
  }
  
  .panel-row > div {
    position: relative;
    right:100px;    
    width:90px;
    height:90px;
    margin: 0 30px;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    perspective: 1000px;
  }
  
  .panel-row > div > a {
    margin-top:-20px;
    padding: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    text-decoration:none;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: translateZ(-25px);
    -moz-transform: translateZ(-25px);
    -ms-transform: translateZ(-25px);
    -o-transform: translateZ(-25px);
    transform: translateZ(-25px);
    -webkit-transition: -webkit-transform 0.25s;
    -moz-transition: -moz-transform 0.25s;
    transition: transform 0.25s;
  }
  .panel-row > div > a::before, .panel-row > div > a::after {
    justify-content: center;
    -webkit-justify-content: center;
    align-items: top;
    font-size:15px;
    font-family:Oswald, Arial, Helvetica, sans-serif;
    margin: 0;
    width:90px;
    height:90px;
    position: absolute;
    border: 0px solid #223484;
    box-sizing: border-box;
    content: attr(title);
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    text-transform:uppercase;    
  }
  
    .panel-row > div.budujemy > a::before {      
      background-color: rgb(51,102,153);
      color: #FFF;
      -webkit-transform: rotateY(0deg) translateZ(45px);
      -moz-transform: rotateY(0deg) translateZ(45px);
      -ms-transform: rotateY(0deg) translateZ(45px);
      -o-transform: rotateY(0deg) translateZ(45px);
      transform: rotateY(0deg) translateZ(45px);
    }
    .panel-row > div.budujemy > a::after {
      background-color: red;
      border-color: #223484;
      color:white;
      content: attr(data-next);
      align-items: top;
      font-size:15px;
      font-family:Armata,Verdana, Geneva, sans-serif;
      -webkit-transform: rotateX(90deg) translateZ(45px);
      -moz-transform: rotateX(90deg) translateZ(45px);
      -ms-transform: rotateX(90deg) translateZ(45px);
      -o-transform: rotateX(90deg) translateZ(45px);
      transform: rotateX(90deg) translateZ(45px);
    }
    .panel-row > div.budujemy > a:hover {
      -webkit-transform: translateZ(-45px) rotateX(-90deg);
      -moz-transform: translateZ(-45px) rotateX(-90deg);
      -ms-transform: translateZ(-45px) rotateX(-90deg);
      -o-transform: translateZ(-45px) rotateX(-90deg);
      transform: translateZ(-45px) rotateX(-90deg);
    }
    
    
  }
    