/* Title: Styles */
/* Author: Spencer T. Crosland*/
/* Purpose: Master Style sheet for Spener Crosland's Portal Page website */

/* Body */
body {
    font-family: Arial, Helvetica, sans-serif;    margin: 0;
    padding: 0;
    background: url(../images/CC_logo_background.png);
    color: #fbfbfb; 
   
}

#wrapper {
    max-width: 900px;
    min-height: 1000px;
    margin: 20px auto;
    background: rgba(255, 2, 2, 0.85);
    border: 5px solid #ffffff;
    border-radius: 20px;
    box-shadow: 0 0 20px #ffffff;
    overflow: hidden;
    display: grid;
    grid-template-rows: 178px 50px auto 120px;
}

/*  Header */
header {
     background: url("../images/Eucalyptus_trees.jpeg") center / cover no-repeat;
    height: 178px;
    display: flex;
    align-items: center;
    padding: 0;          
    margin: 0;
}

header h1 {
    margin: 0;
    font-size: 3em;
    color: #f40404;
    text-shadow: 9px 9px 15px #000;
    padding-left: 90px;
}

header img {
    display: block;
    width: 180px;
    height: 178px;       
    margin: 0;  
}



/* Navagation  */
nav {
    background: #f40404;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 50px; 
    height: 50px; 
    border-top: 7px solid #f98e1b;
    border-bottom: 7px solid #f98e1b;
    padding: 0 20px;
    box-sizing: border-box;
}

nav a {
    color: #ffffff;
    text-shadow: #330000;
    text-decoration: none;
    font-size: 1.5em;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s ease, text-shadow 0.3s ease;
    cursor: pointer;
}

nav a:hover {
    background: #f98e1b;
    text-shadow: 4px 4px 2px #f40404;
}


/*  MAIN CONTENT  */
main h1 {
    text-align: center;
    font-size: 3em;
    color: #e98411;
    text-shadow: 4px 4px 7px #000;
    margin-bottom: 20px;
}
main h2{

    color: #ffea08;
    text-shadow: 4px 4px 7px #e0e0e0;
    margin-bottom: 20px;
}

main h3{

    color: #ffffff;
    text-shadow: 4px 4px 7px #000;
    margin-bottom: 20px;
}

main img {
    display: block;
    margin: 0 auto 20px auto;
    max-width: 80%;
    border: 5px solid #ff8c00;
    border-radius: 15px;
    box-shadow: 0 0 15px #ffffff;
}

/*  Sidebar Form  */
#ads {
    width: 220px;
    border: 3px solid #000;
    background: #ec0e0e;
    padding: 20px;
    box-sizing: border-box;
    position: fixed;
    right: -180px; /* Partially hidden offscreen */
    top: 260px;
    transition: right 0.6s ease-in-out;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

/* When you hover, the sidebar slides fully into view */
#ads:hover {
    right: 0;
}

/* Form layout inside */
#ads form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

#ads label {
    font-weight: bold;
    font-size: 0.9em;
    color: #fff;
}

#ads input,
#ads textarea,
#ads select {
    max-width: 90px;
}


/* Table Green Box Styles  */
table.greenTable {
    font-family: Georgia, serif;
    border: 6px solid #24943A;
    background-color: #D4EED1;
    width: 100%;
    text-align: center;
    border-collapse: collapse;
}

table.greenTable td, table.greenTable th {
    border: 1px solid #24943A;
    padding: 8px 12px;
}

table.greenTable tbody td {
    font-size: 17px;
    color: #e98411;
}

table.greenTable tr:nth-child(even) {
    background: #6EBD62;
}

table.greenTable thead {
    background: linear-gradient(to bottom, #5baf6b 0%, #3a9e4d 66%, #24943A 100%);
    border-bottom: none;
}

table.greenTable thead th {
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    border-left: 2px solid #24943A;
}

/*  FOOTER  */
footer {
    background: url(../images/Crosland_Corp_logo.png) center no-repeat;
    margin: 20px auto; /* centers horizontally */
    width: 90%; /* or 900px if you prefer a fixed width */
    max-width: 900px; /* keeps it consistent with #wrapper */
    text-align: center;
    padding: 15px;
    border: 5px solid #ffffff;
    border-radius: 20px;
    box-shadow: 0 0 20px #ffffff;
    color: #f2c46e;
    text-shadow: 1px 1px 3px #330033;
}