address {
    margin-left: 20px;
}

p.address {
    background: black;
    -webkit-text-fill-color: white;
    mix-blend-mode: difference;
}

footer {
    text-align: center;
    font-family: sans-serif;
    -webkit-text-fill-color: white;
}

.message {
    position: fixed;
    font-family: 'Times New Roman', Times, serif;
    text-align: center;
    top: 66px; /* Position the navbar at the top of the page */
    width: 100%; /* Full width */
    background: linear-gradient(to bottom, #ff0000, #00ffff, #ff0000);
    -webkit-text-fill-color: black;
}

.navbar {
    position: fixed; /* Set the navbar to fixed position */
    top: 0; /* Position the navbar at the top of the page */
    width: 100%; /* Full width */
    background-color: #222222;
    min-height: 66px;
    max-height: 66px;
}

body {
    padding-top: 15px; /* Add a top margin to avoid content overlay */
    -webkit-text-fill-color: #000000;
}

body.pig-latin {
    background-image: url("../images/pig-latin-background.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

body.survey {
    background-image: url("../images/survey-background.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

body.main {
    background-image: url("../images/main-background.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

.col-30 {
    margin-left: 50px;
    margin-right: -400px;
}

/* Float four columns side by side */
.col-cards {
    float: left;
    width: 20%;
    padding: 10px;
    display: block;
    margin-bottom: 20px;
}
  
/* Remove extra left and right margins, due to padding in columns */
.row-cards {margin: 0 -5px;}
  
/* Clear floats after the columns */
.row-cards:after {
    content: "";
    display: table;
    clear: both;
}
  
/* Style the counter cards */
.card {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); /* this adds the "card" effect */
    padding: 16px;
    text-align: center;
    background-color: #f1f1f1;
}

.nav-link {
    margin: 5px;
}

.row-lg-5-5 {
    margin-left: 100px;
    margin-right: -100px;
}

.bootstrap-background {
    background-color: #ffffff;
    -webkit-text-fill-color: #000000;
}

th {
    border-bottom: 3px solid #999999;
    text-align: left;
    padding: 8px;
}

th.blank, td.header {
    border-right: 3px solid #999999;
}

td {
    text-align: left;
    padding: 8px;
}

td.alignment {
    padding-right: 20px;
}

td.item {
    padding-right: 50px;
}

td.button {
    text-align: center;
}

img {
    height: 50%;
    width: 50%;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 100px;
    margin-right: -100px;
}

.touch {
    margin-top: 0px;
    margin-bottom: 0px;
}

del, s {
    color:red;
}

ol, ul {
    padding-bottom: 30px;
}

li {
    padding-right: 15px;
    padding-left: 15px;
}

ul.navbar-nav {
    padding-bottom: 0px;
}

dd {
    margin-bottom: 50px;
}

ins {
    color: #00ff00;
}

.minecraft-chart {
    background-color: #dddddd;
}

/*Headers*/
h1, h2 {
    color: #000000;
}

h1, h2 {
    padding-top: 50px;
}

h1 {
    padding-bottom: 30px;
}

h1.index {
    padding-top: 80px;
}

.stripe {
    background: linear-gradient(180deg, #ff0000, #ff0000, #ff9900, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000, #ff0000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/*Links*/
a {
    -webkit-text-fill-color: red;
}

a.address {
    background: linear-gradient(to right, #ff0000, #ff0000, #ff9900, #ffcc00, #ffff00, #99ff00, #00ff00, #00ff99, #00ffcc, #00ffff, #0000ff, #9900ff, #ff00ff, #ff0000, #ff0000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

a:hover {
    background: conic-gradient(at 50% 10%, #ff0000 70deg, #ff9900 100deg, #ffcc00 110deg, #ffff00 120deg, #99ff00 135deg, #00ff00 160deg, #00ff99 190deg, #00ff99 210deg, #00ffff 230deg, #0099ff 240deg, #0000ff 250deg, #9900ff 255deg, #ff00ff 260deg, #ff0000 270deg);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    animation: zoom2 5s infinite alternate;
}

/*Touch ups*/
abbr, sub, sup {
    background: linear-gradient(45deg, #0000ff, #9900ff, #ff00ff, #ff0000, #ff9900, #ffcc00, #ffff00, #99ff00, #00ff00, #00ff99, #00ff99, #00ffff, #0099ff, #0000ff, #9900ff, #ff00ff, #ff0000, #ff0000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: zoom 10s infinite alternate;
}

@keyframes zoom {
    0% {
        background-size: 1000%;
        background-position: left;
    }
    100% {
        background-size: 1000%;
        background-position: right;
    }
}

@keyframes zoom2 {
    0% {
        background-size: 200%;
        background-position: left;
    }
    100% {
        background-size: 200%;
        background-position: right;
    }
}

@keyframes zoom3 {
    0% {
        background-size: 1000%;
        background-position: left;
    }
    48% {
        background-size: 1000%;
        background-position: center;
    }
    50% {
        background-size: 1000%;
        background-position: right;
    }
    52% {
        background-size: 1000%;
        background-position: center;
    }
    100% {
        background-size: 1000%;
        background-position: left;
    }
}