/*
Roll & Bones homepage stylesheet 

Author:     Cameron Baker
Created:    2026-04-13
Updated:    2026-04-15 

Filename:   homepage.css 
*/ 

html {
    aspect-ratio: 1920 / 8500;
}

body {
    background-image: url('homepagebg-roughdraft.jpg');
    background-repeat: no-repeat; 
    background-size: cover;
    text-align: center;
    font-family: sans-serif;
    color: gold;
    text-shadow: 0 0 0.5px black, 0 0 0.5px black, 0 0 0.5px black, 
        0 0 1px black, 0 0 1px black, 0 0 1px black, 
        0 0 1.5px black, 0 0 1.5px black, 0 0 1.5px black;
    font-size: 18px;
}

h1 {
    font-size: 45px;
}

h2 {
    font-size: 35px;
}

h3 {
    font-size: 25px;
}

a {
    color: limegreen;
    text-decoration: none;
}

a:hover {
    color: darkgreen;
}

.newsImage {
    width: 150px;
    border: 2px solid yellow;
}

.sampleImage {
    width: 250px;
    border: 4px groove limegreen;
}

.sampleImage:hover {
    border-color: darkgreen;
}

#searchButton {
    width: 25px;
    background: transparent;
}

#searchButton img {
    width: 100%;
}

#pfp {
    width: 350px;
    border: 5px groove limegreen;
}

#pfp:hover {
    border-color: darkgreen;
}

.contactItem img {
    width: 75px;
}

#footerLogo {
    width: 35px;
}

.contactItem img:hover,
#footerLogo:hover {
    transform: rotate(360deg);
    transition: all 0.5s ease-in-out 0.15s;
}