/* Gregory Ecklund */
/* February 2023 */

/* Multi-Table Stuff */
body {
    background-color: pink;
}
table {
    border-spacing: 0px;
}
.LABELS {
    font-weight: bold;
}
.TITLES {
    font-size: 20px;
    font-weight: 1000;
}
.ALLCOLUMNS {
    display: flex;
}
.RIGHTCOLUMN, .CENTERCOLUMN {
    margin-left: 3%;
}

/* Metal Table */
.metalsTable > table > tbody > tr > td, .metalsTable > table > caption {
    border-width: 1px;
    border-style: solid;
    border-color: black;
    padding: 3px;
    border-spacing: 0px;
    margin: 0px;
    text-align: center;
    background-color: lightgray;
}

/* Organic Substances Table */
.NAME {
    margin-bottom: 0px;
    color: red;
}
.FORMULA {
    margin-top: 0px;
    font-size: 70%;
    color: blue;
}
.organicSubstancesTable > table > tbody > tr > td, .organicSubstancesTable > table > caption {
    border-width: 1px;
    border-style: solid;
    border-color: black;
    padding: 3px;
    border-spacing: 0px;
    margin: 0px;
    text-align: center;
    background-color: tan;
}

/* Inorganic Substances Table */
.inorganicSubstancesTable > table > caption, .inorganicSubstancesTable > table > tbody > tr > td {
    border-width: 1px;
    border-style: solid;
    border-color: black;
    padding: 3px;
    border-spacing: 0px;
    margin: 0px;
    text-align: center;
    background-color: lightyellow;
}

/* Polyatomics Table */
.polyatomicsTables {
    float: right;
    margin-right: 425px;
    margin-top: -1300px;
}
.polyatomicsTable > table > tbody > tr > td {
    border-width: 1px;
    border-style: solid;
    border-color: black;
    padding: 3px;
    border-spacing: 0px;
    margin: 0px;
    text-align: left;
    background-color: lightgreen;
}
.polyatomicsTable > table > caption {
    font-weight: 1000;
    font-size: 20px;
    text-align: center;
    border-width: 1px;
    border-style: solid;
    border-color: black;
    padding: 3px;
    border-spacing: 0px;
    margin: 0px;
    background-color: lightgreen;
}

/* Strong Acids & Bases Tables */
.strongAcidsBasesTable > table > tbody > tr > td, .strongAcidsBasesTable > table > caption {
    border-width: 1px;
    border-style: solid;
    border-color: black;
    padding: 3px;
    border-spacing: 0px;
    margin: 0px;
    text-align: center;
}
.strongAcidsBasesTable > table > caption {
    background-color: rgb(170, 149, 171);
}
.ACID {
    background-color: indianred;
}
.BASE { 
    background-color: lightskyblue;
}

/* Hydrocarbons Table */
.hydrocarbonsTable > table > tbody > tr > td, .hydrocarbonsTable > table > caption {
    border-width: 1px;
    border-style: solid;
    border-color: black;
    padding: 3px;
    border-spacing: 0px;
    margin: 0px;
    text-align: center;
    background-color: aquamarine;
}

/* Alcohols Table */
.alcoholsTable > table > tbody > tr > td, .alcoholsTable > table > caption {
    border-width: 1px;
    border-style: solid;
    border-color: black;
    padding: 3px;
    border-spacing: 0px;
    margin: 0px;
    text-align: center;
    background-color: lightsalmon
}

/* Navbar */
.navbar {
    overflow: hidden;
    margin-bottom: 2%;
}
/* Navbar Elements */
.navbar a {
    float: left;
    text-decoration: none;
}
/* Navbar Dropdown Containers */
.dropdown {
    float: left;
    overflow: hidden;
}
/* Change Background Color on Hover */
.navbar a:hover, .dropdown:hover .dropdownLabel {
    background-color: lightgreen;
}
/* Dropdown Div */
.dropdownLinks {
    display: none;
    position: absolute;
}
/* Dropdown Options */
.dropdownLinks a {
    float: none;
    display: block;
}
/* Display Dropdown Options on Hover */
.dropdown:hover .dropdownLinks {
    display: block;
}
/* Background Color and Border */
.navbar a, .dropdownLabel {
    border-style: solid;
    border-width: 1px;
    border-color: black;
    background-color: lightskyblue;
    padding: 15px;
    font-size: 16px;
    color: black;
    text-align: left;
}