@charset "UTF-8";
/* CSS Document */

html, body { width:100%; overflow-x:hidden; }

body { 
	background-color:#555; 
	background-image: url("images/HHF.texture.bg.png"); 
	min-height: 100%;     
	background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: -1; 
	background-attachment: fixed; 
	margin:0; 
	font-size:100%; 
	font-family:"Slabo 27px", arial, sans-serif; }

h1, h2, h3, h4, p {font-family: 'Public Sans',Helvetica,Arial,sans-serif; font-weight: normal;text-transform: uppercase;}

.primary h1 {font-family: 'Alfa Slab One',Helvetica,Arial,sans-serif; font-weight: normal;text-transform: uppercase;font-size: 3.0em;} 

.primary h2 {font-family: 'Public Sans',Helvetica,Arial,sans-serif; font-weight: normal;text-transform: uppercase; font-size: 2.0em;}




.thingreenline {
 position: absolute;
 top: 131px;
 width:100%;
 border-top: 18px solid #8CC63F;
 z-index:-1;
}
	
.TGLdivide {
border-top:2px solid #8CC63F; 
border-bottom:none;
width: 85%;
margin-left:auto;
margin-right:auto;
margin-top: 40px;
margin-bottom: 40px;

}
	
	
.cd-fixed-bg {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: -1;
}

#wrapper {
	width:100%;
	min-height:100%;
	position:relative;
}

#content {
	width:100%;
	margin:0 auto;
}

.logo {
	text-align:center;
}

.logo  img{
	width: 300px;
	padding: 40px;
	background-color: rgba(0,0,0,0.5);  
}


h1 { font-size:2.5em; color:#D4A017;}
h2 { font-size:1.2em; color: #FFF;}
p {color: #FFF;}

h2 a { color:#FFF; text-decoration:none; font-weight:bold;}
h2 a:hover { color:#AAA;}



.large { font-size:1.2em; }

.small { font-size:1em; }



/*    Font Style Grit     */ 




.letterpress-grit {
  /* 1. Keep all your existing font styling */
  font-family: 'Alfa Slab One', serif;
  font-size: clamp(3rem, 8vw, 6rem);
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin: 0;
  color: #2b2b2b; 

  /* 2. Your background texture and clip rules */
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://w3.org id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.35'/%3E%3C/svg%3E");
  background-repeat: repeat;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;

  /* 🚀 3. THE FIX: Force the browser to render the clip layer immediately */
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  will-change: transform;
}



/* End Font Style Grit */ 





.splash img {
	max-width: 100%;
}


/*.email h2:first-child {
	color: #CCC;
}*/

.social img {
	max-width: 120px;
	padding: 20px;
}

.social .second-line {
	margin-top: -10px;
}

.location h2 {
	font-weight: bold;
}

.email a {
	text-decoration: none;
	color: #FFF;
}

#footer {
width:100%;
background-color: rgba(0,0,0,0.5);
border-top:3px solid #8CC63F; 

}

.copyright { font-size:1.0em; padding:20px; margin:0 auto; }

.img { margin: 50px auto; text-align:center; }
.img img { max-width: 500px; height: auto; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.99); }

.alpha50 {
	background: rgba(0,0,0,0.5);
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.99); 
	padding: 40px;
	margin: 20px;
}



.span80{
width:80%;
padding: 0px 10%;
text-align:center;
}

.span30{
width:30%;
padding: 0px 5%;
text-align:center;
}

.span40{
width:40%;
padding: 0px 5%;
text-align:center;
}

.span55{
width:50%;
padding: 0px 5%;
text-align:center;
}

li {
color:#AAA;
font-size: 22px;
font-weight:bold;
}
.decal {
margin-left:auto;
margin-right:auto;
text-align:center;
}


.decal img {
max-width: 250px;
margin-left:0px;
}

.pull-left{
float:left;
}

@media (max-width: 767px) {
.span50 {
width:100%;
padding: 0px;
}

.span80 {
width:100%;
padding: 0px;
}

.span40{
width:90% !important;
padding: 0px 5%;
text-align:center;
margin-left: 0px;
}

.span55{
width:90% !important;
padding: 0px 5%;
text-align:center;
margin-left: 0px;
}

.span30 {
width: 90%;
}

.span30 img {
max-width: 175px;
margin-left:0px;
}

.decal img {
max-width: 175px;
margin-left:0px;
}

.email a {
font-size: 16px;
margin-left:0px;
margin-top:20px;
}

}

@media (max-width: 480px) {

.img img {
max-width: 260px;
}

/*
.email a {
font-size: 12px;
margin-left:-38px;
}
*/

}



/*
@media screen and (max-width: 480px) {
	.img img { max-width:300px; }
}
*/