/* styles.css 
   Project: 
   Author: 
   Date: 
	
   Helpful links: 
   	Web colors: 
   		https://en.wikipedia.org/wiki/Web_colors#X11_color_names
	Color picker tool:
		https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Colors/Color_picker_tool
		http://colorpicker.com

*/
body {
   padding: 5px;
}

h1 {
   margin: 5px 0px;
}

h3 {
   margin: 0px;
   margin-bottom: 10px;
   padding-bottom: 5px;
   border-bottom: 2px solid firebrick;
}

.legend {
   overflow: hidden;
}

.legendbox {
   display: flex;
   float: left;
   margin-left: 20px;
   margin-bottom: 20px;
}

.float {
   /*float: left;*/
}

.square {
   width: 20px;
   height: 20px;
   box-shadow: 1px 1px 3px rgba(0,0,0,0.3);
   border-radius: 3px;
}

.label {
   /*border: 2px solid pink;*/
   padding-left: 5px;
}
   .label p {
      margin: 0px;
   }

/*SQUARE COLORS*/

.sq1 {
   background-color: #fae4b4
}

.sq2 {
   background-color: #ffcc5c
}

.sq3 {
   background-color: #ff9c19
}

.sq4 {
   background-color: #ff571f
}

.sq5 {
   background-color: #f22c05
}

.sq6 {
   background-color: #bd0000
}

.source {
   font-style: italic;
   font-size: 12px;
}