header {
    background-image: url("/img/Template/HeaderBackground.gif");
    background-repeat: repeat-x;
}

.card-img-top-phar {
    object-fit: scale-down;
    width: auto;
}

@media (max-width: 575.98px) {
    footer.sticky-footer {
        line-height: 30px !important;
    }
}

/* Used on the registry lists to colour code the car number cell to the colour of the car */
.CarColourOR { background-color: orange; }
.CarColourBP { background-color: black; color: white; }
.CarColourIY { background-color: yellow; }
.CarColourJB { background-color: blue; color: white; }
.CarColourTR { background-color: red; }
.CarColourBL { background-color: blue; color: white; }
.CarColourRS { background-color: silver; }

/* Used on the registry lists to colour the rows */
.BackgroundFadedOrange { background-color: #DDAF5A; }
.BackgroundSilver { background-color: silver; }

/* Makes an unordered list have square bullets */
.SquareBullets { list-style-type: square; }

/* Removes the scroll bars and resize handle from TextArea controls */
.TextNoScroll { resize: none; overflow: hidden; }

/* Overrides the default of 3 columns used by the bootstrap class called "card-columns", to only have 2 columns */
.two-columns { column-count: 2 !important; }

/* Removes the top border that bootstrap puts on all TD cells */
.RemoveTdTopBorder { border-top: none !important; }

/* Since bootstrap tables always have a width of 100%, this allows the table to only be as wide as the content you put in it. */
.TableOnlyExpandsToContent { width: auto !important; }

/* Used to help with alignment of images */
.ImageDisplayBlock { display: block; }

/* Used to apply styling to the DIV's used to link to the Windows 10 apps */
.Win10AppDiv { display: flex; justify-content: left; align-items: center; }
.Win10AppLink { display: flex; justify-content: center; align-items: center; margin: 4px; font-size: 26px; font-weight: bold; }

/* Used to style the single letter square boxes on the movies/games complete listing pages that a user can click to jump down to that section in the list */
.TapBox { padding: 4px 10px 4px 10px; margin: 2px 0; display: inline-block; color: white; font-weight: 700; width: 2rem; }
.TapBox a { color: white; text-decoration: none; }

/* Used to style the TD cells on the movie page so they don't have as much padding */
.MovieInfoCell { padding: 6px 10px !important; }

/* Used to format how the 'table' looks on the variable naming page */
.vn-flex-container { display: flex; flex-direction: column; width: 300px; margin: auto; gap: 5px; }
.vn-header, .vn-flex-item { display: flex; background-color: #E0E0E0; padding: 10px; border-radius: 5px; width: 100%; }
.vn-header { background-color: #660000; color: white; font-weight: bold; }
.vn-prefix, .vn-type { padding: 5px; }
.vn-prefix { width: 80px; text-align: left; font-weight: bold; }
.vn-type { width: 220px; text-align: left; }