@font-face {
    font-family: 'forqueregular';
    src: url('../fonts/myfont/Forque-webfont.eot');
    src: url('../fonts/myfont/Forque-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/myfont/Forque-webfont.woff') format('woff'), url('../fonts/myfont/Forque-webfont.ttf') format('truetype'), url('../fonts/myfont/Forque-webfont.svg#forqueregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: 'forqueregular';
}

body {
    background: url(../img/gradient-dark-nights.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding-bottom: 40px;
}

h1 {
    font-size: 60px;
}

.light {
    color: aliceblue;
}

.album-cover {
    transition: all .2s ease-in-out;
    transform: scale(1.0);
}

.album-cover:hover {
    transform: scale(1.1);
    transition: all .2s ease-in-out;
}

.date {
    float: right;
}

.iframe {
    padding-top: 3px;
}

.spotify-top {
    margin: 10px 0px;
}

.iframe2 {
    padding-top: 10px;
}

iframe {
    width: 100%;
}

.btn-custom {
    font-size: 35px;
    letter-spacing: 3px;
    border-radius: 0;
    background-color: #333333;
    border-color: aliceblue;
    margin: 10px;
    transition: .3s all;
    width: 100%;
}

a.btn-custom:hover,
a.btn-custom:active,
a.btn-custom:focus {
    background-color: aliceblue;
    border-color: #333333;
    color: #333333;
    transition: .3s all;
}

p {
    color: aliceblue;
    font-size: 25px;
    letter-spacing: 2px;
}

.khio-img {
    padding-bottom: 20px;
}

.khio-text a {
    color: inherit;
    text-decoration: none;
}

.khiotext a:hover + h1 {
    color: aliceblue;
    text-decoration: none;
}


/* Large Devices, Wide Screens */

@media only screen and (max-width: 1200px) {}


/* Medium Devices, Desktops */

@media only screen and (max-width: 992px) {}


/* Small Devices, Tablets */

@media only screen and (max-width: 770px) {
    .date {
        float: none;
    }
    .khio-text {
        text-align: center;
    }
    .text-wrap {
        padding-bottom: 10px;
    }
    h1 {
        font-size: 40px;
    }
    .btn-custom {
        width: 100%;
        margin: 0px 0px 10px 0px;
    }
    .btn-wrap {
        padding-top: 20px;
    }
    a.btn-custom {
        font-size: 30px;
    }
}


/* Extra Small Devices, Phones */

@media only screen and (max-width: 480px) {}