body {
        background-color: #ffccff;
        background-image: linear-gradient(#ffccff, #b3ffff);
        background: #ffccff;
        background: linear-gradient(#ffccff, #b3ffff);
        background-repeat: no-repeat;
        background-attachment: fixed;
    }
    
    .center-screen {
        position: fixed;
        top: 45%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        z-index: 5;
        text-align: center;
    }
    
    .img-responsive img {
        max-width: 30%;
    }
    
    .site-footer {
        position: fixed;
        top: 80%;
        width: 100%;
        font-size: 15px;
        color: #737373;
        text-align: center;
        font-size: font-display;
        margin-bottom: 5px;
    }
    
    .site-footer a {
        color: #737373;
        text-decoration: none;
    }
    
    .site-footer a:hover {
        color: #3366cc;
        text-decoration: none;
    }
    
    .site-footer .social-icons {
        text-align: center;
    }
    
    .site-footer .social-icons a {
        width: 45px;
        height: 45px;
        line-height: 45px;
        margin-left: 6px;
        margin-right: 0;
        border-radius: 100%;
        background-color: #99ffff;
    }
    
    .social-icons {
        padding-left: 0;
        margin-bottom: 0;
        list-style: none
    }
    
    .social-icons ul {
        float: right;
    }
    
    .social-icons ul li {
        float: left;
        list-style: none;
    }
    
    .social-icons li {
        display: inline-block;
        margin-bottom: 4px
    }
    
    .social-icons li.title {
        margin-right: 15px;
        text-transform: uppercase;
        color: #96a2b2;
        font-weight: 700;
        font-size: 20px
    }
    
    .social-icons a {
        background-color: #eceeef;
        color: #818a91;
        font-size: 16px;
        display: inline-block;
        line-height: 44px;
        width: 44px;
        height: 44px;
        text-align: center;
        margin-right: 8px;
        border-radius: 100%;
        -webkit-transition: all .2s linear;
        -o-transition: all .2s linear;
        transition: all .2s linear
    }
    
    .social-icons a:active,
    .social-icons a:focus,
    .social-icons a:hover {
        color: #fff;
        background-color: #29aafe
    }
    
    .social-icons.size-sm a {
        line-height: 40px;
        height: 40px;
        width: 40px;
        font-size: 40px
    }
    
    .social-icons a.facebook:hover {
        background-color: #3b5998
    }
    
    .social-icons a.twitter:hover {
        background-color: #00aced
    }
    
    .social-icons a.linkedin:hover {
        background-color: #007bb6
    }
    
    .social-icons a.dribbble:hover {
        background-color: #ea4c89
    }
    
    .social-icons a.github:hover {
        background-color: #3e75c3
    }
    
    .social-icons a.reddit:hover {
        background-color: #ff4500
    }
    
    .social-icons a.medium:hover {
        background-color: #14c767
    }
    
    .social-icons a.instagram:hover {
        background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
        background: -webkit-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
        background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
    }
    
    .social-icons a.youtube:hover {
        background-color: #FF0000
    }
    
    .social-icons a.bandcamp:hover {
        background-color: #629aa9
    }
    
    .social-icons a.spotify:hover {
        background-color: #1DB954
    }
    
    .social-icons a.soundcloud:hover {
        background-color: #ff7700
    }
    
    .social-icons a.audius:hover {
        background-color: #CC0FE0
    }
    
    @media only screen and (max-width: 600px) {
        .title h1 {
            font-size: 20px;
        }
        .title img {
            max-width: 8%;
        }
        .img-responsive img {
            max-width: 60%;
        }
        .site-footer .social-icons a {
            width: 20px;
            height: 20px;
            line-height: 20px;
            font-size: 10px;
            margin: 0 6px;
        }
        .site-footer p {
            font-size: 10px;
        }
    }
    
    @media only screen and (min-width: 600px) {
        .title h1 {
            font-size: 30px;
        }
        .title img {
            max-width: 10%;
        }
        .img-responsive img {
            max-width: 40vw;
        }
        .site-footer .social-icons a {
            width: 35px;
            height: 35px;
            line-height: 35px;
            font-size: 20px;
            margin: 0 6px;
        }
        .site-footer p {
            font-size: 15px;
        }
    }
    
    @media only screen and (min-width: 768px) {
        .title h1 {
            font-size: 35px;
        }
        .title img {
            max-width: 5%;
        }
        .title br {
            line-height: 50px;
        }
        .img-responsive img {
            max-width: 40vh;
        }
        .site-footer .social-icons a {
            width: 40px;
            height: 40px;
            line-height: 40px;
            font-size: 20px;
            margin: 0 6px;
        }
        .site-footer p {
            font-size: 15px;
        }
    }
    
    @media only screen and (min-width: 1200px) {
        .title h1 {
            font-size: 40px;
        }
        .title img {
            max-width: 5%;
        }
        .title br {
            line-height: 55px;
        }
        .img-responsive img {
            max-width: 45vh;
        }
        .site-footer .social-icons a {
            width: 50px;
            height: 50px;
            line-height: 50px;
            font-size: 30px;
            margin: 0 6px;
        }
        .site-footer p {
            font-size: 20px;
        }
    }