@charset "utf-8";
/* from the poorly named flow-simulations-style.css by B.Yanofsky  */
/* mirrors   home-pg_my-style.css on CH  */
/* ===================================== */
	p {
    color: #0a0a0a;
    text-align: left;
	  font-family: palatino;
	  font-size: 1.0rem;
  /*	background-color: rgba(36, 36, 214, .7);  blue  */
	/*  background-color: rgba(72, 56, 173, .4);  blue  */
	/* margin: 4 prop is Top R Bott L no , but spaces*/
	  margin: 1rem;
    padding: 1rem;
    outline: solid #4c4b4b 1px;
    box-sizing: border-box;
	}

	font {
		color: black;
		text-align: left;
		font-family: palatino;
		font-size: 1.2rem;
		margin: .25rem;
	  padding: .25rem;
	}
		.auth {
			font-size: .75rem;
			/* color is dk green */
			color: #222310;
					}
		.dark {
			color: #1a1a1a;
			font-size: 1.2rem;
			margin: .25rem;
			padding: .25rem;
					}
		.lite {
			color: white;
			font-size: 1.2rem;
			margin: .25rem;
			padding: .25rem;
					}

/* this used some sort of repeat of images/bg.jpg   */
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
  /* background-image: linear-gradient(140deg, rgb(195, 200, 210), rgb(024, 51, 32)); */
/* Cucumber Water from cssgradient.io     */
	/* background-image: linear-gradient(90deg, #e3ffe7 0%, #d9e7ff 100%); */
	background-image: linear-gradient(90deg, #1CB5E0 0%, #000851 100%);
	/* background-color: #000000; */
	/* background-image: url(images/bg.jpg);
	background-repeat: repeat-x; */
}
/* so does this style body + table headers also   */
body,td,th {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.25rem;
	color: #BBBBBB;
	/* this is standard text color super light grey */
}

/* links:  moved to it's own css */
/* should put image defs in doc as all these socials are unique  */

/* neat way to style all 6 headers at once */
h1,h2,h3,h4,h5,h6 {
		text-align: center;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		margin: 0px;
		margin-bottom: 0px;
	  }

	h1
		/* big white */
		{    	color: rgba(255,255,255,0.9);
		text-shadow: 2px -2px 6px rgba(9,9,9,0.8);
	  font-size: 2.6em;
	  padding-left:10px;
	  }

	h2
		/* big blue */
		{    	color: rgba(48,34,71,0.9);
		text-shadow: 2px -2px 6px rgba(61,9,9,0.8);
	  font-size: 2.6em;
	  padding-left:10px;
	  }

	h3
		/* med white shadow*/
		{    	color: rgba(255,255,255,0.9);
		text-shadow: 2px -2px 4px rgba(9,9,9,0.8);
	  font-size: 1.9em;
	  padding-left:10px;
	  }

	h4
		/* med red shadow */
		{    color: rgba(115,33,43,0.9);
		text-shadow: -2px -3px 5px rgba(48,9,9,0.8);
		font-size: 1.5rem;
		padding-left:10px;
	  }

	h5
		/* smaller grey shadow */
		{     color: rgba(90,90,90,0.9);
			 text-shadow: 1px 1px 1px rgba(165,177,158,0.8);
		 font-size: .9em;
		 padding-left:10px;
		  }

	h6
		/* small black */
		{
		font-size: .5em;
		color: #202020;
		margin-left: 2em;
	 }

table {
	/* the next 2 lines create centered tables on the page */
  margin-left: auto;
	margin-right: auto;
	vertical-align: top;
	width: 610px;
	cellSpacing: 0px;
	cellPadding: 5px;
	background-color: white;
	border: 0;
		}
	 .you {
		 background-color: lightblue;
	 }
	 .other {
		 background-color: darkgrey;
	 }

	    /* somehow I cannot get the table with the hero image to have 0 padding  td pad = 1 px */
	 .hero {
		 background-color: darkgrey;
		 cellSpacing: 0px;
		 cellPadding: 0px;
		 }



/* controls footer */
.footer {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 1rem;
		color: #650e0e;
		margin-top: 20px;
	}