body {
    font-family: arial, sans-serif;
    height:4000px;
}

#animated-button-was {
    position:absolute;
    top:50%;
    left:25%;
    width:25%;
}


p {
    width:90%;
    margin-left:5%;
}

.wrapper {
    width:60%;
    margin-left:20%;
    margin-top:20px;
}

img.bg {
    width:100%;
    margin-top: -4px;
}

#logo {
    position:fixed;
    top:16px;
    left:50%;
    margin-left:-15%;
    width:30%;
    height:auto;

}

#logo img {
    width:100%;
}

.filter img {
    width:100%;
}

.filter {
    position:fixed;
    width:14%;
    display:none;
}

#filter-top-right {
    top:0px;
    right:21%;
}

#filter-top-left {
    top:0px;
    left:21%;
}

#filter-bottom-right {
    bottom:15px;
    right:21%;
}

#filter-bottom-left {
    bottom:15px;
    left:21%;
}


@media (max-width: 800px) {
    .wrapper {
        width:100%;
        margin-left:0%;
    }

    #logo {
        position:fixed;
        left:50%;
        margin-left:-25%;
        width:50%;
        height:auto;

    }

    .filter {
        position:fixed;
        width:24%;
    }


    #filter-top-right {
        right:2%;
    }

    #filter-top-left {
        left:2%;
    }

    #filter-bottom-right {
        right:2%;
    }

    #filter-bottom-left {
        left:2%;
    }


}