body {
    background-color: #8bd124;
}


/*
*************************************
          Copyright 2018
               benn
*************************************
*/


/* Google Fonts */

@import url(https://fonts.googleapis.com/css?family=Open+Sans);

/* set global font to Open Sans */

body {
    font-family: 'Open Sans', 'sans-serif';
    background-image: url(http://benague.ca/files/pw_pattern.png);
}


/* header */

h1 {
    color: #55acee;
    text-align: center;
}

h3 {
    font-weight: 500;
    font-size: 28px;
}

.isi {
    margin-top: 20%;
}

.logoaxe {
    width: 400px;
}


/* header/copyright link */

.link {
    text-decoration: none;
    color: #55acee;
    border-bottom: 2px dotted #55acee;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    cursor: url(http://cur.cursors-4u.net/symbols/sym-1/sym46.cur), auto;
}

.link:hover {
    color: #033b1b;
    border-bottom: 2px dotted #033b1b;
}


/* button div */

#buttons {
    padding-top: 50px;
    text-align: center;
}


/* start da css for da buttons */

.btn {
    border-radius: 0px;
    padding: 15px 50px;
    font-size: 24px;
    text-decoration: none;
    color: #000;
    position: relative;
    display: inline-block;
}

.btn:active {}

.green {
    outline: #000 0.5px solid;
}

.green:hover {
    background-color: #033b1b;
    color: #fff;
    box-shadow: 0px 5px 0px 0px #033b1b;
}


/* copyright stuffs.. */

@media (min-width: 70px) and (max-width: 296px) {
    .isi {
        margin-top: 220px;
    }
    h3 {
        margin-top: -60px;
        font-size: 6px;
        font-weight: 600;
    }
    .btn {
        padding: 10px 10px;
        font-size: 10px;
        margin-top: -150px;
    }
    .logoaxe {
        width: 180px;
    }
}


/* copyright stuffs.. */

@media (min-width: 296px) and (max-width: 768px) {
    .isi {
        margin-top: 220px;
    }
    h3 {
        margin-top: -60px;
        font-size: 8px;
        font-weight: 600;
    }
    .btn {
        margin-top: -140px;
        padding: 10px 20px;
        font-size: 12px;
    }
    .logoaxe {
        width: 240px;
    }
}


/* copyright stuffs.. */

@media (min-width: 768px) and (max-width: 1028px) {
    .isi {
        margin-top: 220px;
    }
    h3 {
        font-size: 12px;
        font-weight: 600;
    }
    .btn {
        padding: 10px 10px;
        font-size: 16px;
        margin-top: -4%;
    }
    .logoaxe {
        width: 250px;
    }
}

@media (min-width: 1028px) and (max-width: 1200px) {
    .isi {
        margin-top: 220px;
    }
    h3 {
        font-size: 12px;
        font-weight: 600;
    }
    .btn {
        padding: 10px 10px;
        font-size: 16px;
        margin-top: -4%;
    }
    .logoaxe {
        width: 300px;
    }
}