/*
	Name: Peace Pieces - Main Style Sheet
	Date: Jul 2021
	Version: 2.5
	Author: T Newfields
	Autor URI: http://tnewfields.info
*/
a {outline: 0px; font-weight: 600;}
a:hover, a:active {background-color: #C74350;
	color: #000;
	text-decoration: none;
	text-shadow: 2px 2px 2px #333;
}
a img {border: 0px; text-decoration: none;}
a:link {color: black;
	text-decoration: none;
	position: relative;
}
a:visited {color: #01a;
	font-weight: 500;
	text-decoration: underline;
}
.alternativetext {color: #004513;
	font-family: Quicksand, "Existence Light", Lane, "New Cicle", Bryant, Superstudio, serif;
	font-size: 1.1em; font-size: 1.75vw;
	font-style: normal;
	font-variant: normal;
	font-weight: 200;
	display: block;
	text-align:center;
	-webkit-transform:scale(1,.618);
	-moz-transform:scale(1,.618);
	-ms-transform:scale(1,.618);
	-o-transform:scale(1,.618);
	transform:scale(1,.618);
}
body {background-color:#FFF;
	line-height: 1.5;
	margin: 0px;
	padding: 0px;
}
body:before {content:"";
height:100%;
float:left;
width:0px;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}
.body2 a:link,a:visited {display: inline-block;
font-weight:bold;
background-color:#666;
width:133px;
text-align:center;
padding:4px;
text-decoration:none;
}
.body2 a:hover,a:active {background-color:#7A991A;
}
.box {display: flex;
	flex-flow: column;
	justify-content: center;
	align-content: center;
	align-items: center;
}

.col {display: block;
	float:left;
	margin: 1% 0 1% 1.75%;
}
.col:first-child {margin-left: 0px; }

.dialog1 {color: #2E5262;
	width:100px;
	font-size: 1.25em; font-size: 2vw;
	font-weight: 800;
	font-style: oblique;
	text-align:right;
	vertical-align: text-top;
	font-family: Didot, "Didot LT STD", "Hoefler Text", "Garamond","Helvetica Neue Light", "Warnock Pro Subhead", serif;
}
.dialog2 {color: black;
	font-size: 1.25em; font-size: 2vw;
	font-weight: 500;
	padding-left: 12px; 
	text-align:left;
	vertical-align: text-top;
	font-family: Didot, "Didot LT STD", "Hoefler Text", "Garamond","Helvetica Neue Light", "Warnock Pro Subhead", serif;
}

.flex-container {display: -webkit-flex;
  display: flex;
  height: auto;
  -webkit-flex-direction: row;
  flex-direction: row;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  justify-content: center;
  -webkit-justify-content: center;
  align-items: center;
  -webkit-align-items: center;
  align-content: center;
}

.flex-item {background-color: #9a9aff ;
  color:#FEE2BD;
  width: 9vw;
  height: 4vh;
  margin: 10px;
  font-family: "Arial Black", "Arial Bold",Gadget,sans-serif;
  font-weight:bold;
  text-align:center;
  padding:4px;
  text-decoration:none;
}
.flex-item a:hover,a:active{background-color:#7A991A;
}
#footer {position:fixed;
	height: 180px;
	left:1%;
	bottom:0px;
	text-align: center;
   	width:100%;
	clear:both;} 
	
img.bg {box-shadow: 1px 1px 2px #FFF, 0 0 6px #8C9FAD, 1px 1px 7px #00FF00, 0 0 12px #EBE4D4, 0 0 15px #009900, 0 0 30px #006600, 0 0 55px #EBE4D4, 0 0 66px #003300;}
.ghosttext {color:  black;
	font-size:1.3em; 
	text-align:center;
	font-family: Luminari, "Book Antiqua", "Gills Sans", Arial;
	font-weight:800;
	padding-left: 16px;
	padding-right: 16px;
    text-shadow: 0 0 5px #fff,
                   0 0 10px #00F1EA,
                   0 0 15px #fff,
                   0 0 20px #009DE0,
                   0 0 25px #fff,
                   0 0 30px #C2DEDB,
                   0 0 36px #fff,
                   0 0 56px #7ab8cb;
}
.group:before,
.group:after {content:""; display:table; }
.group:after {clear:both;}
h1 {color:maroon;
	font-size: 2.6em;
	margin-bottom:-4px;
	letter-spacing: 2px;
	text-align:center;
	-webkit-transform:scale(1.2,1);
	transform:scale(1.2,1);
	font-family: Didot, "Helvetica Neue Light", "Warnock Pro Subhead";
	text-shadow: 2px 2px 5px #800000, -2px 1px 3px #FFF, 0px  -1px 4px #FFFFF8;
}
h2 {font-size: 1.571em; 
	letter-spacing: 2px;
	font-weight: 700;
	text-align:center;
}
h3 {font-size: 1.429em; text-align:center; }
h4 {font-size: 1.1em; text-align:center;}
h5 {font-size: 1.143em; text-align:center; }
h6 {font-size: 1em; text-align:center; }
html, body {height: 100%;}
.hvr-bounce-in {display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.hvr-bounce-in:hover, .hvr-bounce-in:focus, .hvr-bounce-in:active {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	-webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
	transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
}
.hvr-grow {display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.25);
  transform: scale(1.25);
}
img.grayscale {filter: none;
 -webkit-filter: grayscale(0%); /* Chrome 19+ & Safari 6+ */
}

img.grayscale:hover {-webkit-filter: grayscale(100%);
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
}
.inner-bg {box-shadow: inset 0px 0px 5px #fff, 0px 0px 10px #FDF48D, 0px 0px 15px #fff, 0px 0px 20px #BFA371, 0px 0px 25px #fff, 0px 0px 30px #719357, 0 0 36px #fff, 0 0 56px #3E9175;
	-moz-box-shadow: inset 0px 0px 5px #fff, 0px 0px 10px #FDF48D, 0px 0px 15px #fff, 0px 0px 20px #BFA371, 0px 0px 25px #fff, 0px 0px 30px #719357, 0 0 36px #fff, 0 0 56px #3E9175;
    -webkit-box-shadow: inset 0px 0px 5px #fff, 0px 0px 10px #FDF48D, 0px 0px 15px #fff, 0px 0px 20px #BFA371, 0px 0px 25px #fff, 0px 0px 30px #719357, 0 0 36px #fff, 0 0 56px #3E9175;
}


li {float: left; padding:4px; }
li a {display: block;  
    color: cyan;
    text-align: center;
    text-decoration: none;
}
li  a:hover:not(.active) {
    background-color: #111;
}
#main {overflow:hidden;
	padding-bottom: 180px;}  /* must be same height as the footer */
.maintext {color:#2B1B18;
	font-size: 1.3em;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	display: block;
	line-height: 25px;
	font-family: Didot, "Didot LT STD", "Hoefler Text", "Garamond","Helvetica Neue Light", "Warnock Pro Subhead", serif;
}
.page-break {page-break-after: always;}

#proviso {color: #5A92A3;
	font-size:70%; font-size: 0.88vw;
    text-align:center;
    font-family: "Virtual Bliss", Village, "Double Scratch", "Visual Magnets",sans-serif;
}
#proviso2 {color: black;
	font-size:78%; font-size: 0.9vw; 
	text-align:center;
	font-weight: 300;
	font-family: "Gill Sans", Lato, "Century Gothic", "Sans Guilt", sans-serif;
}
#proviso3 {color: #FFF;
	font-size:65%; font-size: 0.7vw; 
    text-align:center;
	font-weight: 200;
    font-family: "Virtual Bliss", Village, "Double Scratch", "Visual Magnets",sans-serif;
}

.section {clear: both;
	padding: 0px;
	margin: 0px;
}

.span_2_of_2 {width: 100%;}
.span_1_of_2 {width: 49.12%;}

table, caption, tbody, tfoot, thead, tr, th, td {margin: 2px;
  padding: 2px;
  border: 0px;
}
table {border-spacing: 18px;}
td {vertical-align: top;}
ul {list-style-type: none;
	z-index:3;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: white;
    position: fixed;
    top: 0;
    width: 100%;
}
#wrap {min-height: 100%;}

.zoom-tilt {-webkit-transition:all 0.3s ease-out;
  -moz-transition:all 0.3s ease-out;
  -ms-transition:all 0.3s ease-out;
  -o-transition:all 0.3s ease-out;
  transition:all 0.3s ease-out;
}
.zoom-tilt:hover {-webkit-transform:rotate(15deg) scale(1.3);
  -moz-transform:rotate(15deg) scale(1.3);
  -ms-transform:rotate(15deg) scale(1.3);
  -o-transform:rotate(15deg) scale(1.3);
  transform:rotate(15deg) scale(1.3);
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.col {margin: 1% 0 1% 0%;}
}
@media only screen and (max-width: 480px) {
	.span_2_of_2, .span_1_of_2 { width: 100%; }
}

