body{
  background-color: #111517;
  height:100vh;
  color:#ddd
}
h1,h2,h3{
  font-family:Oswald,sans-serif;
}
a{
  text-decoration:none
}
header{
  height:100%;
  position:relative
}
header:after{
  content:'';
  background: url(Jawad_STORE_FRONT.jpg) bottom no-repeat;
  background-size:cover;
  display:block;
  width:100%;
  height:100%;
  opacity:0.9;
  position:absolute;
  z-index:-1
}
header h1{
  position:absolute;
  left:0;
  right:0;
  top:0;
  bottom:0;
  margin:auto;
  display:inline-block;
  width:fit-content;
  height:fit-content;
  color:#ef0d33;
  font-size:6vw;
  text-transform:uppercase;
  transition:all 0.2s;
  cursor:wait
}
header h1:hover{
 text-shadow:0 0 10px #ef0d33;
}


@keyframes anim-in-layer {
0% {
transform: translate3d(-100%,0,0)
}

to {
transform: translateZ(0)
}
}

@keyframes anim-out-layer {
0% {
transform: translateZ(0)
}

to {
transform: translate3d(100%,0,0)
}
}

@keyframes anim-in-text {
0% {
transform: translate3d(100%,0,0)
}

to {
transform: translateZ(0)
}
}

@keyframes anim-out-text {
0% {
transform: translateZ(0)
}

to {
transform: translate3d(-100%,0,0)
}
}


.case_text{ 
  background: rgba(0,0,0,.4);
  width:80%;
  max-width:400px;
  padding:15px;
  position:absolute;
  margin:15px;
  top:0;
  transition:all 0.7s;
  font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
line-height: 1.2}

.case_text a{
  display:inline-block;
  padding:8px 15px;
  background: #ddd;
  font:600 1.2em/1 Oswald;
  color:#000;
  margin:10px 0;
  mix-blend-mode: screen;
}
.case_text a:hover{
  background: #ffffff;
  box-shadow:0 0 10px #fffa
}