Шаблон:31415-test.css

/****** BLURRED TEXT ******/

.blur-container {
  align-items: center;
  display: flex;
  height: 20vh;
  justify-content: center;
  width: 40vw;
  background-color: white;
  clear: right;
}

.blur-text {
  color: transparent;
  text-shadow: 0 0 0.4rem #eee;
  transition: all 0.35s ease;
 } 

p.blur-text {
  font-size: 4rem;
}

p.blur-text:hover {
  color: #eee;
/*  color: #A9A9A9;   */
  text-shadow: none;
}


/****** DROP-DOWN MENU ******/

div.drop-menu {background-color: SkyBlue;}
div.drop-menu a {
  text-decoration: none;
  color: white;
  font-size: 20px;
  padding: 15px;
  display:inline-block;
}

div.drop-menu ul {
  display: inline;
  margin: 0;
  padding: 0;
}

div.drop-menu ul li {display: inline-block;}
div.drop-menu ul li:hover {background: #555;}
div.drop-menu ul li:hover ul {display: block;}
div.drop-menu ul li ul {
  position: absolute;
  width: 200px;
  display: none;
}

div.drop-menu ul li ul li { 
  background: #555; 
  display: block; 
}

div.drop-menu ul li ul li a {display:block !important;} 
div.drop-menu ul li ul li:hover {background: #666;}


/****** RESPONSIVE 2-COLUMN LAYOUT ******/

.resp-row {
  display: inline-block;
}

.resp-col, .resp-row {
  box-sizing: border-box;
}

/* Clear floats after the columns */
.resp-col:after {
  content: "";
  display: table;
  clear: both;
}

[class*="resp-col"] {
  float: left;
  width: 50%;
  padding: 15px;
}

@media only screen and (max-width: 768px) {
  /* For mobile phones: */
  [class*="resp-col"] {
    width: 100%;
  }
}

/****** ROUNDED IMAGE  ******/

img.ts-img-rounded { border-radius:50%; }

/****** BLACK-AND-WHITE IMAGE ******/

img.ts-img-silver { filter: grayscale(100%); }

/****** SEPIA IMAGE ******/

img.ts-img-sepia { filter: sepia(100%); }


/****** ANIMATION ******/

.poof {
    opacity: 0; 
    animation: opacityOn 20s normal forwards;
    animation-delay: 3s;
}

@keyframes opacityOn {
    0% {
        opacity: 1;
    }
    69% {
        opacity: 1;
    }
    70% {
        opacity: 0;
    }
    77% {
        opacity: 0;
    }
    78% {
        opacity: 1;
    }
    99% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}