.logo {
background:#fff; 
color:black;
border-radius:20px 0;
padding: 15px;
text-align:center;
position: absolute; 
filter: drop-shadow(12px 12px 7px rgba(0, 0, 0, 0.7));
font-size:2vmin;
line-height:25px;
animation: show 1s forwards;
margin-top:-10vmax;
}

@keyframes show {
0%, 95% {transform: translateY(-300%) scale(1); opacity:0;}
99% {transform: translateY(-100%) scale(1); opacity:0.5;}
100% {transform: translateY(-100%) scale(1); opacity:1;}
}


#colorborder {
padding:12px;
border-radius:20px;
animation: change 5s infinite;
transition: animation 2s ease-out;
}

@keyframes change {
0% {background: linear-gradient(0deg, #dce474, #a9bf9a, #72a02d, #f38063);}
25% {background: linear-gradient(90deg, #dce474, #a9bf9a, #72a02d, #f38063);}
50% {background: linear-gradient(180deg, #dce474, #a9bf9a, #72a02d, #f38063);}
75% {background: linear-gradient(270deg, #dce474, #a9bf9a, #72a02d, #f38063);}
100% {background: linear-gradient(360deg, #dce474, #a9bf9a, #72a02d, #f38063);}
}


h4 {
color: #fffcd1;
}


.allbg {
background-image: url(../images/bg.jpg);
background-attachment: fixed;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}

.allbg:after {
      top:0;
      height:100vh;  fix for mobile browser address bar appearing disappearing */
      left:0;
      right:0;
      z-index:-1; /* needed to keep in the background */
background-image: url(../images/bg.jpg);
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}