body {
 margin:0;
 background-color: #000000;
 color: #ffffff;
 font-family: Courier;
 font-size: 12pt;	
}

.nav {
 overflow: hidden;
 background-color: #000;
 position: relative;
 z-index:1;
}

.nav a {
 float: left;
 color: #f2f2f2;
 text-align: center;
 padding: 7px 8px;
 text-decoration: none;
 font-size: 17px;
}

.nav a:hover {
 background-color: #ddd;
 color: black;
}

.nav a.active {
 background-color: #7e7e7e;
 color: white;
}

.nav a.cases {
 background-color: #000
 color: white;
 font-weight: bold;
}

.tl {
 width: 90%;
 height: 90%;
 position: absolute;
 top: 50px;
 bottom: 0;
 left: 0;
 right: 0;
 margin: auto;
 z-index:-11;
 border: 0;
}

.bl {
 position:absolute;
 bottom:0;
 left:0;
 z-index:-11;
 border: 0;
}

.br {
 position:absolute;
 bottom:0;
 right:0;
 z-index:-11;
 border: 0;
}

.cc {
 position: absolute;
 top: 50px;
 left: 20px;
 margin: auto;
 z-index:-11;
 border: 0;
}

img {
 width: 100%;
 height: auto;
 border: 0;
 max-width: 960px;
}

div.gallery {
 margin: 5px;
 border: 1px solid #777;
 float: left;
 width: 72px;
}

div.gallery:hover {
 border: 2px solid #ccc; 
 width: 72px;
}

div.gallery img {
 width: 100%;
 height: auto;
}

.desc {
 padding: 5px;
 text-align: center;
}

@keyframes blink {50% { color: transparent }}
.loader__dot { animation: 1s blink infinite }
.loader__dot:nth-child(2) { animation-delay: 250ms }
.loader__dot:nth-child(3) { animation-delay: 500ms }

.ele01 { position: absolute;  width: 75%;  background-color: #000000;  animation: .5s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele02 { position: absolute;  width: 75%;  background-color: #000000;  animation: 1s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele03 { position: absolute;  width: 75%;  background-color: #000000;  animation: 1.5s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele04 { position: absolute;  width: 75%;  background-color: #000000;  animation: 2s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele05 { position: absolute;  width: 75%;  background-color: #000000;  animation: 2.5s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele06 { position: absolute;  width: 75%;  background-color: #000000;  animation: 3s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele07 { position: absolute;  width: 75%;  background-color: #000000;  animation: 3.5s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele08 { position: absolute;  width: 75%;  background-color: #000000;  animation: 4s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele09 { position: absolute;  width: 75%;  background-color: #000000;  animation: 4.5s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele10 { position: absolute;  width: 75%;  background-color: #000000;  animation: 5s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele11 { position: absolute;  width: 75%;  background-color: #000000;  animation: 5.5s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele12 { position: absolute;  width: 75%;  background-color: #000000;  animation: 6s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele13 { position: absolute;  width: 75%;  background-color: #000000;  animation: 6.5s fadeIn;  animation-fill-mode: forwards;  visibility: hidden;}
.ele15 { position: absolute;  width: 100%;  background-color: #000000;  animation: 14s fadeIn2;  animation-fill-mode: forwards;  visibility: hidden;}

@keyframes fadeIn {
  49% {visibility: hidden; }
  50% {visibility: visible; }
  100% {visibility: hidden; }
}

@keyframes fadeIn2 {
  49% {visibility: hidden; }
  50% {visibility: visible; }
  100% {visibility: visible; }
}