/*
Name:MengCheng Wang
Date:04/11/2025
Course Section:IT202-004
Phase 4 Assignment: Input Filtering and CSS Styling
Email:mw439@njit.edu
*/
body {
    font-family: "Trebuchet MS", Tahoma, Geneva;
    font-size: 80%;
    background-color: #e6e6e6;
    color: #2a2a2a;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden; 
}
h1 {
    font-family: "Lucida Sans Unicode", "Lucida Grande", Tahoma;
    font-size: 120%;
    color: #2a2a2a;   
    margin: 0px;
    padding: 0px;
}
h2 {
    font-family: "Lucida Sans Unicode", "Lucida Grande", Tahoma;
    font-size: 120%;
    color: #2a2a2a;
    margin: 0px;
    padding: 0px;
}
h3 {
    font-family: "Lucida Sans Unicode", "Lucida Grande", Tahoma;
    font-size: 110%;
    color: white;
    margin: 0px;
    padding: 0px;
}
h4 {
    font-family: "Lucida Sans Unicode", "Lucida Grande", Tahoma;
    font-size: 100%;
    color: #2a2a2a;
    margin: 0px;
    padding: 0px;
}
footer {
    font-family: "Lucida Sans Unicode", "Lucida Grande", Tahoma;
    font-size: 80%;
    clear: both;
    text-align: center;
    background-color: #2a2a2a;
    color: white;
    padding: 5px;
    border-bottom: 3px solid #cccccc;
    border-top: 3px solid #cccccc;
    width: 100%;
}   
header {
    padding: 5px;
    border-bottom: 3px solid #cccccc;
    height: 40px;
    width: 100%;
}
nav {
    padding: 5px;
    border-bottom: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    border-top: 1px solid #cccccc;
    border-left: 5px solid #cccccc;
    color: white;
    background-color: #3a3a3a;
    width: 20%;
}
main {
    padding: 5px;
    border-top: 3px solid #cccccc;
    float: left;
    width: 55%;
    height: 100%;
}
main table {
    padding: 2px;
}
main td {
    padding: 2px;
}

/* Neon purple links */
a, a:link {
    color: #da00ff;
    text-decoration: none;
}
a:visited {
    color: #a84bbf;
}
a:hover {
    color: white;
    background-color: #da00ff;
    padding: 2px 4px;
    border-radius: 4px;
    text-shadow: 0 0 6px #da00ff;
}
a:active {
    color: #8800aa;
    text-shadow: 0 0 5px #8800aa;
}

/* Navigation link colors */
nav a, nav a:link {
    color: #f3a8ff;
    text-decoration: none;
}
nav a:visited {
    color: #c59ad1;
}
nav a:hover {
    color: white;
    background-color: #da00ff;
    border-radius: 4px; 
}
nav a:active {
    color: #a000c0;
}

/* Form input styling */
input {
    font-family: "Trebuchet MS", Tahoma, Geneva;
    border: 2px solid #a000c0;
    background-color: white;
    color: #2a2a2a;
    border-radius: 5px;
}
input[type=submit] {
    font-family: "Lucida Sans Unicode", "Lucida Grande", Tahoma;
    font-size: 80%;
    background-color: #da00ff;
    color: white;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
}
input:required:invalid {
    border-color: #ff00aa;
    background-color: #ffe0f7;
}
input:required:valid {
    border-color: #c59ad1;
    background-color: #f6eaff;
}
input:focus {
    outline: none;
    border-color: #da00ff;
    background-color: #f6d4ff;
    box-shadow: 0 0 6px #da00ff;
}