:root {
  --trunking_thickness_1: 0.24em;
  --trunking_thickness_2: 0.4em;

  --cycle_header_sat: 60%;
  --cycle_header_val: 95%;

  --cycle_main_sat: 40%;
  --cycle_main_val: 99%;
}

@keyframes background_color_cycle_header {
  0% {background-color: hsl(0, var(--cycle_header_sat), var(--cycle_header_val))}
  40% {background-color: hsl(90, var(--cycle_header_sat), var(--cycle_header_val))}
  50% {background-color: hsl(180, var(--cycle_header_sat), var(--cycle_header_val))}
  60% {background-color: hsl(270, var(--cycle_header_sat), var(--cycle_header_val))}
  100% {background-color: hsl(360, var(--cycle_header_sat), var(--cycle_header_val))}
}

#page_header{
  margin:0;
  padding: 0;
  text-align: left;
  background-color: #FDE;
  border-bottom: 4px solid #DDD;
  animation-name: background_color_cycle_header;
  animation-duration: 42s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-delay: 0s;
}

@keyframes background_color_cycle_main {
  /*
  0% {background-color: hsl(180, var(--cycle_main_sat), var(--cycle_main_val))}
  25% {background-color: hsl(270, var(--cycle_main_sat), var(--cycle_main_val))}
  50% {background-color: hsl(360, var(--cycle_main_sat), var(--cycle_main_val))}
  75% {background-color: hsl(0, var(--cycle_main_sat), var(--cycle_main_val))}
  100% {background-color: hsl(90, var(--cycle_main_sat), var(--cycle_main_val))}
  */
  0% {background-color: hsl(90, var(--cycle_main_sat), var(--cycle_main_val))}
  25% {background-color: hsl(180, var(--cycle_main_sat), var(--cycle_main_val))}
  50% {background-color: hsl(270, var(--cycle_main_sat), var(--cycle_main_val))}
  75% {background-color: hsl(360, var(--cycle_main_sat), var(--cycle_main_val))}
  100% {background-color: hsl(0, var(--cycle_main_sat), var(--cycle_main_val))}
}

p{
  margin:0;
  padding:0;
}

#page_main{
  margin: 0;
  padding: 0;
  text-align: left;
  background-color: #FAFAFA;
  animation-name: background_color_cycle_main;
  animation-duration: 72s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-delay: 0s;
}

div.float_clear_fix{
  clear: both;
}

nav.crud_links_container{
  float:right;
  border: 0 solid #DDD;
  display: block;
  margin:0 1.2em;
  padding:0;
}

div.crud_block{
  display: block;
  text-align: center;
  margin: 0 0  2.4em 0;
}

a.crud_link{
  display: inline-block;
  background: #FE4;
  margin:0 3.2em 0 0;
  padding: 0.4em 1.2em;
  border-radius: 1.6em;
  border: 2px solid #FA0;
  font-style: italic;
  font-size: 1.0em;
  font-weight: bolder;
  color: #040;
  font-family: sans-serif;
  text-decoration: none;
}

div.alert_container{
  margin:0.0em 0.4em;
  padding:0.0em 0.4em;
  border-width: 4px 0;
  border-style: dotted;
  border-color: #FA0;
  color: #D20;
  display: inline-block;
  text-align: center;
}

p.alert_info{
  padding: 0.4em 0;
  margin:0;
  line-height: 100%;
  font-style: italic;
  font-size: 1.4em;
  font-weight: bold;
}

img.alert_icon{
  height: 0.8em;
  margin: 0 0.24em;
}

section.hero_section{
  margin: 1.2em 1.2em 3.2em 1.2em;
  padding: 0em;
}

section.hero_section{
  font-family: georgia,serif;
}

h1.hero_section_title{
  font-size: 2.4em;
}

section.hero_section p{
  font-size: 1.4em;
}

h1.hero_section_title,
section.hero_section p
{
  margin: 0 0 0.24em 0;
}

section.main_section{
  margin: 1.2em 0 3.6em 0;
  padding: 0em;
}

h1.main_section_title
{
  font-size: 2.0em;
  margin: 0 0 1.2em 0;
}

a.main_section_title_link{
  text-decoration: none;
  color: #000;
}

a.main_section_title_link:hover{
  color: #444;
  text-decoration: underline;
}

section.main_section ul
{
  margin: 0 0 0.24em 0;
}

section.main_section ul{
  font-size: 1.0em;
}

section.sub_section{
  display: block;
  padding: 0.0em 0 3.6em 0;
}

h2.sub_section_title{
  margin: 0 0 0.64em 0;
  padding: 0;
  font-size: 1.8em;
  font-style:italic;
  text-indent:0.8em;
}

a.sub_section_title_link{
  text-decoration: none;
  color: #000;
}

a.sub_section_title_link:hover{
  color: #444;
  text-decoration: underline;
}

div.section_half_column_container{
  width:48%;
  display: inline-block;
  vertical-align: top;
}