/* Author: Phillip Breunig
File: final.css
Date: October 31, 2025 */

/* TODO: */
/*? questions */
/** Important */
/*! Warning */
/* // strike through */
/*! ******************** 
/** Global formatting  * 
/*! *****************!*/

/*! Changes colors globally for the page */
:root {
  --global-color-1: #237a6a;
  --global-color-2: #1e6f5c;
  --global-color-3: #a8e6cf;
  --global-color-4: #f8fff9;

  --text-color1: #1f2937;
  --link: #1e6f5c;
  --link-hover: #257f6d;
}

/*! set html, h1, h2, h3 defaults */
html {
  font-family: sans-serif, Arial, Helvetica;
  font-size: 1rem;
}

h1 {
  font-size: 2.5rem;
}

h2 {
  font-size: 2rem;
}
h3 {
  font-size: 1.5rem;
}

/********************** 
** header formatting  * 
***********************/
header img {
  float: left;
  width: 7rem;
  height: 6rem;
}

header h3 {
  text-indent: 10rem;
  font-size: 1rem;
}

header h1 {
  color: var(--text-color1);
  font-style: italic;
  text-shadow: 0.15rem 0.15rem 0.25rem var(--text-color1);
  text-indent: 3rem;
}

header {
  border-bottom: 3px solid var(--global-color-2);
  background: linear-gradient(
    to bottom,
    var(--global-color-4) 0%,
    var(--global-color-3) 100%
  );
  padding: 20px;
  margin-bottom: 20px;
}

/********************** 
**  main formatting   * 
***********************/

main {
  clear: both;
}

/********************** 
**<section> formatting* 
***********************/

section {
  margin-left: 265px;
  padding: 0 40px;
}
section a:link,
section a:visited {
  color: var(--link);
}
section a:hover,
section a:focus {
  color: var(--link-hover);
}

section ol {
  line-height: 2.5em;
}
/************************* 
**    Body formatting    * 
**************************/
body {
  width: 1200px;
  margin: 20px auto;
  border: 3px solid var(--global-color-2);
  box-shadow: 5px 5px 10px black;
  background-color: var(--global-color-4);
  line-height: 1.6rem;

  color: var(--text-color1);
}

/************************* 
**#leftsidebar formatting* 
**************************/

#leftsidebar {
  float: left;
  width: 245px;
  margin-right: 20px;
  padding: 0 10px;
}
#leftsidebar h2 {
  color: var(--text-color1);
  font-size: 1.5rem;
}

#leftsidebar a:link,
#leftsidebar a:visited {
  color: var(--link);
  font-weight: bold;
}
#leftsidebar a:hover,
#leftsidebar a:focus {
  color: var(--link-hover);
}

#leftsidebar ul {
  line-height: 1.5em;
}

/********************* 
**Footer formatting  * 
**********************/
footer {
  clear: both;
  font-size: 0.75rem;
  text-align: center;
  background-color: var(--global-color-2);
  color: var(--global-color-4);
  padding: 10px;
}

/********************** 
**Css Badge formatting* 
***********************/

footer .css-badge {
  border: 0px;
  width: 88px;
  height: 31px;
}
