@import url(http://fonts.googleapis.com/css?family=Yellowtail%7cCabin:400,500,600,700,400italic,700italic%7cLibre+Baskerville:400italic%7cGreat+Vibes%7cOswald:400,300,700%7cOpen+Sans:600italic,700);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700);

html {
    scroll-behavior: smooth;
}

.font-opensans {
    font-family: "open sans";
}

.font-yellowtail {
    font-family: "Yellowtail", serif;
}

.font-oswald {
    font-family: "Oswald", sans-serif;
}

.font-lobsterTwoItalic {
    font-family: "LobsterTwoItalic", serif;
}

.font-montserrat {
    font-family: "Montserrat", sans-serif;
}

.bg-openinghours {
    background-image: url(images/opening_hours.jpg);
}

.bg-testimonials {
    background-image: url(images/testimonials.jpg);
}

.animate-slide-left {
    animation: slideLeft cubic-bezier(0.4, 0, 0.2, 1) 300ms;
}

.animate-cool {
    animation: coolAnimation cubic-bezier(0.4, 0, 0.2, 1) 1s infinite;
}

.animate-show-up {
    animation: showUp cubic-bezier(0.4, 0, 0.2, 1) 300ms;
}

.animate-disappear {
    animation: disappear cubic-bezier(0.4, 0, 0.2, 1) 300ms;
}

@keyframes slideLeft {
    from {
        right: -100%;
    }

    to {
        right: 0;
    }
}

@keyframes coolAnimation {
    from {
        opacity: 1;
        transform: translateY(0px);
    }

    to {
        opacity: 0;
        transform: translateY(20px);
    }
}

@keyframes showUp {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes disappear {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}