/* Author: Phillip Breunig
File: index.html
Date: October 14, 2025 */

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

/*! Changes colors globally for the page */
:root {
  --global-color-1: rgb(15, 114, 245);
  --global-color-2: rgb(11, 167, 58);
  --global-color-3: rgb(5, 120, 252);
  --global-color-4: rgb(255, 255, 255);
}

/*! 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(--global-color-2);
  font-style: italic;
  text-shadow: 0.25rem 0.25rem 0.25rem var(--global-color-2);
  text-indent: 3rem;
}

header {
  border-bottom: 3px solid var(--global-color-2);
  background: linear-gradient(
    to bottom,
    var(--global-color-4),
    var(--global-color-3)
  );
  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(--global-color-1);
}
section a:hover,
section a:focus {
  color: var(--global-color-2);
}

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);
  padding: 20px;
}

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

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

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

#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;
}