@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css');

html {
    background-color: #3A3E3C;
}

body {
    color: white;
    font-family: 'Oswald', sans-serif;
}

a {
    color: #04CA00;
    text-decoration: none;
}

a:hover {
    color: #7CFF7A;
    text-decoration: underline;

}


#hide_title {
    display: none;
}

#bannerimage {
    display: none;
}

#medium_image {
    display: block;
    max-width: 100%;
    height: auto;
    filter: grayscale(100%);
    clip-path: polygon(10% 0, 100% 0%, 90% 100%, 0 100%);
}

#medium_image:hover {
    filter: none;
    clip-path: polygon(0 0, 90% 0, 100% 100%, 10% 100%);
}

ol li {
    list-style-type: none;
}

ul li {
    list-style-type: none;
}

@media only screen and (min-width: 700px) {

    #bannerimage {
        display: block;
        max-width: 100%;
        height: auto;
        margin-left: 10%;
        margin-right: 10%;
    }

    nav {
        display: none;
    }

    #medium_image {
        display: none;
    }

    #centerblock {
        margin: auto;

    }

    header {
        margin-left: 25%
    }

    h1 {
        font-size: 35px;
    }

    body {
        font-size: 20px;
    }

}

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

    html {
        background-image: url(./images/keyboard.jpg);
        background-size: cover;
    }

    body {
        max-width: 1000px;
        background-color: black;
        margin: auto;
        padding: 30px;
    }
}