h1 {
    color: #A7D129;
    font-family: monospace;
    text-align: center;
    font-size: 36px;
}

h2 {
    color: #A7D129;
    font-family: monospace;
    text-align: center;
    font-size: 30px;
    padding: -50px;
}

h3 {
    color: #A7D129;
    font-family: monospace;
    text-align: center;
    font-size: 22px;
}

p {
    color: #A7D129;
    font-family: monospace;
}

hr {
    border-color: #A7D129;
    margin: 5% 2% 0px 2%;
}

.intro {
    font-size: 14px;
    border-style: ridge;
    border-width: 2px;
    border-color: #616F39;
    margin-left: 2%;
    margin-right: 2%;
    padding: 0px 25px 0px 25px;
}

p.header {
    color: #A7D129;
    font-family: monospace;
    text-align: center;
    font-size: 22px;
}

/* ####################-NAV BUTTONS-#################### */

div.top {
    width:100%;
    overflow:auto;
}

div.top div {
    display: flex;
    width:90%;  
    justify-content: center;
    margin: auto;
    float:none;
    /* border-style: ridge;
    border-width: 2px;
    border-color: red; */
}

a.basic_button:link, a.basic_button:visited {
    background-color: #3E432E;
    font-size: 16px;
    color: #A7D129;
    font-family: monospace;
    padding: 14px;
    text-align: center;
    text-decoration: none;
    display: block;
    width: 10%;
}

a.basic_button:hover {
    background-color: black;
    font-size: 16px;
    color: #A7D129;
    font-family: monospace;
    padding: 12px;
    text-align: center;
    text-decoration: none;
    display: block;
    border-style: ridge;
    border-width: 2px;
    border-color: #616F39;
    width: 10%;
}

/* ####################-PROJECTS AREA-#################### */

.projects_area {
    width: 100%;
    overflow: auto;
    /* border-style: ridge;
    border-width: 2px;
    border-color: red; */
}

.projects_area div {
    display: flex;
    justify-content: center;
    width: 90%;
    margin: auto;
    float: none;
    /* border-style: ridge;
    border-width: 2px;
    border-color: red; */
}

.project_button {
    display: inline-block;
    margin: 0px 2px 0px 2px;
    background-color: #3E432E;
    font-size: 16px;
    font-family: monospace;
    color: #A7D129;
    border-style: ridge;
    border-width: 2px;
    border-color: #3E432E;
    width: 150px;
    height: 150px;
    text-align: center;
    text-decoration: none;
    line-height: 150px;
    
}

.project_button:hover {
    margin: 0px 2px 0px 2px;
    background-color: #3E432E;
    font-size: 16px;
    font-family: monospace;
    border-style: ridge;
    border-width: 2px;
    border-color: #A7D129;
    width: 150px;
    height: 150px;
    text-align: center;
    text-decoration: none;
}

/* ####################-CURRENT PROJECTS-#################### */

#comptia_a_plus {
    background-image: url(a_plus.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

#amu {
    background-image: url(current_projects/amu_logo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

#current_python {
    background-image: url(current_projects/python_logo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

/* ####################-PREVIOUS PROJECTS-#################### */

#comptia_sec_plus {
    background-image: url(previous_projects/sec_plus_img.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

/* ####################-FUTURE PROJECTS-#################### */

#comptia_net_plus {
    background-image: url(future_projects/net_plus_img.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

#raspberry-pi {
    background-image: url(future_projects/Raspberry_Pi-Logo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

#flask {
    background-image: url(future_projects/flask_logo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

#ubuntu {
    background-image: url(future_projects/ubuntu_logo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

#c_sharp {
    background-image: url(future_projects/cs_logo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

#kali {
    background-image: url(future_projects/kali_logo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

#htb {
    background-image: url(future_projects/htb_logo.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 148px;
    background-color: #3E432E;
}

/* ####################-FOOTER-#################### */
p.footer {
    margin: 2% 2% 2% 2%;
    padding-left: 5px;
    font-size: 14px;
    text-align: left;
    background-color: #3E432E;
}