.holder {
    position: absolute;
    /*background-color: #ffffff;*/
    background-image: linear-gradient(#0096FF 0%, #146ec3 100%);
    left: 0%;
    top: 0%;
    width: 100%;
    height: 100%;
}
.new-year {
    font-family: 'Major Mono Display', monospace;
    color: #333333;
    font-size: 14px;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    transform: translateX(-50%) translateY(-50%);
    text-align: center;
}
.year {
    position: relative;
    left: 50%;
    color: #fff;
    display: table;
    font-size: 2.5em;
    transform: translateX(-50%);
}
.year2 {
    display: none;
    transform: translateX(-50%) rotateX(180deg);
    opacity: 0.2;
}
.digit {
    display: inline-block;
    margin: 0px;
    padding: 0px;
    position: relative;
    opacity: 0;
}
.controls {
    margin-top: 30px;
    color: #fff;
}
.control {
    display: inline-block;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 1.2em;
    border-left: 1px solid #fff;
    opacity: 0;
    position: relative;
    top: 100px;
}
.control:first-child {
    border-left: none;
}
.triangles {
    position: absolute;
    left: 0%;
    top: 0%;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.triangle {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #333333;
    position: absolute;
    opacity: 0;
    display: none;
}

/* ---------------------------------------------------------------- */

.waters {
   margin: auto;
   position: relative;
   width: 100%;
   height: 100%;
   background-color: #80c5de!important;
   box-shadow: inset 0 0 50px #1c637c;
   /*clip-path: polygon(0 0, 100% 0, 85% 100%, 15% 100%)*/
}

.waters::before {
    content: "";
    width: 200%;
    height: 200%;
    background-color: #696969AF;
    border: 1px solid #C8D1E0;
    position: absolute;
    top: -160%;
    left: -50%;
    border-radius: 40%;
    animation: anim 12s linear infinite;
}

.waters::after {
    content: "";
    width: 208%;
    height: 208%;
    /*background-color: #696969AF;*/
    background: linear-gradient(to top, rgba(128, 128, 128, 0.4) 0.1%, rgba(255, 255, 255, 0.5) 95%);
    border: 1px solid #C8D1E0;
    position: absolute;
    top: -150%;
    left: -55%;
    border-radius: 10%;
    animation: anim 12s linear infinite;
    animation-delay: 0.5s;
}

@keyframes anim {
    0% {
        transform: rotate(-3deg);
    }
    50% {
        transform: rotate(3deg);
    }
    100% {
        transform: rotate(-3deg);
    }
}