
/* Chrome 29+ */
/*
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) { 

  	.nav-item a, nav-item a:link, nav-item a:visited {
		-webkit-text-stroke-width: 0px;
		-webkit-text-stroke-color: rgba(193,31,20,.88);
		paint-order: stroke;

	    text-shadow:
	    0 1px 0px rgba(193,31,20,.88),
	    1px 0 0px rgba(193,31,20,.88),
	    1px 2px 1px rgba(193,31,20,.88),
	    2px 1px 1px rgba(193,31,20,.88),
	    2px 3px 2px rgba(193,31,20,.88),
	    3px 2px 2px rgba(193,31,20,.88),
	    3px 4px 2px rgba(193,31,20,.88),
	    4px 3px 3px rgba(193,31,20,.88),
	    4px 5px 3px rgba(193,31,20,.88),
	    5px 4px 2px rgba(193,31,20,.88),
	    5px 6px 2px rgba(193,31,20,.88),
	    6px 5px 2px rgba(193,31,20,.88),
	    6px 7px 1px rgba(193,31,20,.88),
	    7px 6px 1px rgba(193,31,20,.88),
	    7px 8px 0px rgba(193,31,20,.88),
	    8px 7px 0px rgba(193,31,20,.88);
	}

	.count-text {
	    font-size: 52px;
	    -webkit-text-stroke-width: 0px;

		text-shadow:
	    0 1px 0px rgba(55,55,31,0.42),
	    1px 0 0px rgba(55,55,31,0.42),
	    1px 2px 1px rgba(55,55,31,0.42),
	    2px 1px 1px rgba(55,55,31,0.42),
	    2px 3px 2px rgba(55,55,31,0.42),
	    3px 2px 2px rgba(55,55,31,0.42),
	    3px 4px 2px rgba(55,55,31,0.42),
	    4px 3px 3px rgba(55,55,31,0.42),
	    4px 5px 3px rgba(55,55,31,0.42),
	    5px 4px 2px rgba(55,55,31,0.42),
	    5px 6px 2px rgba(55,55,31,0.42);
	    


	}

	.ribbon-card h2 {
		-webkit-text-stroke-width: 0px;

		text-shadow:
	    0 1px 0px black,
	    1px 0 0px black,
	    1px 2px 1px black,
	    2px 1px 1px black,
	    2px 3px 2px black,
	    3px 2px 2px black,
	    3px 4px 2px black,
	    4px 3px 3px black,
	    4px 5px 3px black;   


	}
}
*/
/* ########### Above works but got FF also. ########## */

/* Chrome 22-28 */

/*

@media screen and(-webkit-min-device-pixel-ratio:0) {
  
    .nav-item a, nav-item a:link, nav-item a:visited {-chrome-:only(;
	    text-shadow:
	    0 1px 0px rgba(193,31,20,.88),
	    1px 0 0px rgba(193,31,20,.88),
	    1px 2px 1px rgba(193,31,20,.88),
	    2px 1px 1px rgba(193,31,20,.88),
	    2px 3px 2px rgba(193,31,20,.88),
	    3px 2px 2px rgba(193,31,20,.88),
	    3px 4px 2px rgba(193,31,20,.88),
	    4px 3px 3px rgba(193,31,20,.88),
	    4px 5px 3px rgba(193,31,20,.88),
	    5px 4px 2px rgba(193,31,20,.88),
	    5px 6px 2px rgba(193,31,20,.88),
	    6px 5px 2px rgba(193,31,20,.88),
	    6px 7px 1px rgba(193,31,20,.88),
	    7px 6px 1px rgba(193,31,20,.88),
	    7px 8px 0px rgba(193,31,20,.88),
	    8px 7px 0px rgba(193,31,20,.88);
	
  	);} 
}
*/

/* Safari 11+ */
@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (stroke-color:transparent) {
    .nav-item a, .nav-item a:link, .nav-item a:visited:not(*:root) {

  	-webkit-text-stroke-width: 0px;
    
    text-shadow:
	    0 1px 0px rgba(193,31,20,.88),
	    1px 0 0px rgba(193,31,20,.88),
	    1px 2px 1px rgba(193,31,20,.88),
	    2px 1px 1px rgba(193,31,20,.88),
	    2px 3px 2px rgba(193,31,20,.88),
	    3px 2px 2px rgba(193,31,20,.88),
	    3px 4px 2px rgba(193,31,20,.88),
	    4px 3px 3px rgba(193,31,20,.88),
	    4px 5px 3px rgba(193,31,20,.88),
	    5px 4px 2px rgba(193,31,20,.88),
	    5px 6px 2px rgba(193,31,20,.88),
	    6px 5px 2px rgba(193,31,20,.88),
	    6px 7px 1px rgba(193,31,20,.88),
	    7px 6px 1px rgba(193,31,20,.88),
	    7px 8px 0px rgba(193,31,20,.88),
	    8px 7px 0px rgba(193,31,20,.88);
  	}


  	

}}




/* Chrome settings  */
/* @media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {  */
@media (-webkit-min-device-pixel-ratio:0) {
  .nav-item a, .nav-item a:link, .nav-item a:visited:not(*:root) {

  	-webkit-text-stroke-width: 0px;
    
    text-shadow:
	    0 1px 0px rgba(193,31,20,.88),
	    1px 0 0px rgba(193,31,20,.88),
	    1px 2px 1px rgba(193,31,20,.88),
	    2px 1px 1px rgba(193,31,20,.88),
	    2px 3px 2px rgba(193,31,20,.88),
	    3px 2px 2px rgba(193,31,20,.88),
	    3px 4px 2px rgba(193,31,20,.88),
	    4px 3px 3px rgba(193,31,20,.88),
	    4px 5px 3px rgba(193,31,20,.88),
	    5px 4px 2px rgba(193,31,20,.88),
	    5px 6px 2px rgba(193,31,20,.88),
	    6px 5px 2px rgba(193,31,20,.88),
	    6px 7px 1px rgba(193,31,20,.88),
	    7px 6px 1px rgba(193,31,20,.88),
	    7px 8px 0px rgba(193,31,20,.88),
	    8px 7px 0px rgba(193,31,20,.88);
  }

  .count-text:not(*:root) {
	    -webkit-text-stroke-width: 0px;

		text-shadow:
	    0 1px 0px rgba(55,55,31,0.42),
	    1px 0 0px rgba(55,55,31,0.42),
	    1px 2px 1px rgba(55,55,31,0.42),
	    2px 1px 1px rgba(55,55,31,0.42),
	    2px 3px 2px rgba(55,55,31,0.42),
	    3px 2px 2px rgba(55,55,31,0.42),
	    3px 4px 2px rgba(55,55,31,0.42),
	    4px 3px 3px rgba(55,55,31,0.42),
	    4px 5px 3px rgba(55,55,31,0.42);
	    /*
	    5px 4px 2px rgba(55,55,31,0.42),
	    5px 6px 2px rgba(55,55,31,0.42);
	    */


	}

	.ribbon-card h2:not(*:root) {
		-webkit-text-stroke-width: 0px;

		text-shadow:
	    0 1px 0px black,
	    1px 0 0px black,
	    1px 2px 1px black,
	    2px 1px 1px black,
	    2px 3px 2px black,
	    3px 2px 2px black,
	    3px 4px 2px black;
	    /*
	    4px 3px 3px black,
	    4px 5px 3px black;   
		*/

	}
}

/* End Chrome */

/* FireFox only */

@-moz-document url-prefix() {

	.nav-item a, .nav-item a:link, .nav-item a:visited {
		-webkit-text-stroke-width: 19px;
		text-shadow: none;
	}

	.count-text:not(*:root) {
		-webkit-text-stroke-width: 4.7px;
		text-shadow: none;
	}

	.ribbon-card h2:not(*:root) {
		-webkit-text-stroke-width: 4.3px;
		text-shadow: none;
	}

}







@media only screen and (min-width: 2440px) {
	
	.count-num {
    	letter-spacing: 3.5px;
	}
	.count-text {
		letter-spacing: 3.5px;
	}
	.count-spacer {
		letter-spacing: 3.5px;
	}
	#countdown-container div:nth-child(2) {
    	word-spacing: 50px;
    }
    #footer-nav {
		word-spacing: 0.5px;
		letter-spacing: 12px;
    }
    #footer-address {
	    word-spacing: 0.5px;
	    letter-spacing: 2.5px;
	}
}


@media only screen and (max-width: 1546px) {
	#overlay-container {
		overflow: hidden;
	}

}

@media only screen and (max-width: 1390px) {
	.nav-item a, .nav-item a:link, .nav-item a:visited {
		font-size: 32pt;
	}


}

@media only screen and (max-width: 1333px) {
	.nav-item {
		line-height: 51px;
	}
}



@media only screen and (max-width: 1226px) {
	#countdown-container div:nth-child(1) img {
    	margin-left: 30px;
   	}
   	#countdown-container div:nth-child(3) img {
    	margin-right: 30px;
	}

	.count-num {
    	font-size: 52px;
	}
	.count-text {
    	font-size: 45px;
    }
    .count-spacer {
    	font-size: 45px;
    }

    #countdown-container div:nth-child(2) {
    	word-spacing: 1.5vw;
    }



	#footer-container {
  		/* border: 1px solid black; */
    	max-width: 100vw;
  	}

}


@media only screen and (max-width: 1166px) {

	.nav-item a, .nav-item a:link, .nav-item a:visited {
		font-size: 26pt;
		word-spacing: .5vw;
	}

	.nav {
		margin-top: 2px;
	}

	.nav-item {
		line-height: 42px;
	}

	#soc-media{
		flex-grow: 3;
	}



	#footer-content:before {
		top: -107px;
	}

	#footer-container {
		max-width: 1065px;
		/* max-width: 75%; */
	}

}

@media only screen and (max-width: 1112px) {
	
	#overlay-container {
		display: none;
	}

	#news {
		width: 90%;
		margin: 0 auto;
	}
  
	

	#footer-container {
  		/* border: 1px solid black; */
    	max-width: 100vw;
  	}
}

@media only screen and (max-width: 1066px) {
	.nav-item {
		line-height: 42px;
	}
}

@media only screen and (max-width: 1040px) {
	.nav-item a, .nav-item a:link, .nav-item a:visited {
		font-size: 24pt;

	}

	.nav-item {
		line-height: 42px;
	}

	.nav {
		margin-top: 4px;
	}
	
}

@media only screen and (max-width: 1024px) {
	.nav-item a, .nav-item a:link, .nav-item a:visited {
		font-size: 24pt;
	}
	
}

@media only screen and (max-width: 1009px) {
	.nav-item {
		line-height: 42px;
	}
}



@media only screen and (max-width: 990px) {
	.nav-item a, .nav-item a:link, .nav-item a:visited {
		font-size: 23pt;
	}
	
}



@media only screen and (max-width: 957px) {
	#countdown-container div:nth-child(1) img {
    	margin-left: 10px;
   	}
   	#countdown-container div:nth-child(3) img {
    	margin-right: 10px;
	}

	.count-num {
    	font-size: 40px;
	}
	.count-text {
    	font-size: 36px;
    }
    .count-spacer {
    	font-size: 40px;
    }

    #countdown-container div:nth-child(2) {
    	word-spacing: 1.5vw;
    }

    /* ## contact page ## */

    #contact-info {
    	/* flex-direction: column; */
    }

}

@media only screen and (max-width: 950px) {
	.nav-item a, .nav-item a:link, .nav-item a:visited {
		font-size: 21pt;
		word-spacing: 0.5vw;
		padding: .3rem .5rem;
	}
	
}

/* just before 868 nav font needs to be 22pt */

@media only screen and (max-width: 890px) {
	/* drop the nav */
	nav {
		display: none;
	}

	#ham-menu {
		display: block;
	}
	#ham-container {
		display: block;
	}

	#navbar-content {
		/* grid-template-columns: 3fr 1fr; */
		justify-content: flex-start;
		flex-wrap: nowrap;
		display: flex;
		flex-direction: row;
		align-items: normal;

	}

	#addition-nav {
		margin-top: 205px;
		flex-grow: 5;
	}


	#mobile-nav-container {
		/* display: block;*/

	}

	#soc-media{
		flex-grow: 1;
	}

	.addition-nav-right {
    	flex-grow: 2;
    }
	

	


}

@media only screen and (max-width: 868px) {

	#page-display {
		padding: 0;
	}

	/* Contact page. At some time as menu changes */

	#contact-form {
		grid-row: 1/2;
		grid-column: 1/3;
	}

	#contact-info{
		grid-row: 2/3;
		grid-column: 1/3;
	}

	#map {
		grid-row: 3/4;
		grid-column: 1/3;
	}

	/*
	Ground Rental Page
	*/
	#ground-rental-info {
		grid-row: 1/2;
		grid-column: 1/3;
	}
	
	#ground-rental-form-area {
		grid-row: 2/3;
		grid-column: 1/3;
	}

}




@media only screen and (max-width: 768px) {

	

	#home-header-content {
		padding-top: 20px;
	}	



	#countdown-container div:nth-child(1) img {
    	margin-left: 0;
    	display: none;
   	}
   	#countdown-container div:nth-child(3) img {
    	margin-right: 0;
    	display: none;
	}

	.count-num {
    	font-size: 46px;
	}
	.count-text {
    	font-size: 42px;
    	letter-spacing: .5vw;
    }
    .count-spacer {
    	font-size: 46px;
    }

    #countdown-container div:nth-child(2) {
    	word-spacing: 1vw;
    }


	#footer-content:before {
		top: -126px;
	}

	#footer-container {
		max-width: 724px;
		/* max-width: 75%; */
	}

	.ribbon-card {
		margin-left: 0;
		margin-right: 0;
	}

}	

@media only screen and (max-width: 815px) {
	/* nav settings ar less then 768px */

	#navbar-content {
		flex-direction: column;
		align-items: center;
	}

	#header-logo {
		max-height: 204px;
	}
	#header-logo-area {
		max-width: 460px;
		height: 206px;
	}
	#addition-nav {
		margin-top: 0;
		max-width: 460px;
		width: 100%;
	}



}

@media only screen and (max-width: 685px) {
	.count-num {
    	font-size: 40px;
	}
	.count-text {
    	font-size: 36px;
    	letter-spacing: .5vw;
    }
    .count-spacer {
    	font-size: 40px;
    }

    #countdown-container div:nth-child(2) {
    	word-spacing: 1vw;
    }
	
}

@media only screen and (max-width: 630px) {

	

	

}


@media only screen and (max-width: 593px) {

	.count-num {
    	font-size: 34px;
	}
	.count-text {
    	font-size: 30px;
    	letter-spacing: .2vw;
    }
    .count-spacer {
    	font-size: 34px;
    }

    #countdown-container div:nth-child(2) {
    	word-spacing: .1vw;
    }




@media only screen and (max-width: 520px) {

	.ribbon-card {
		max-width: 350px;
		height: 350px;
	}

	.ribbon-img{
		max-width: 309px;
		max-height: 309px;
		margin-top: 8px;
		
	}

/*
	.ribbon-img:before {
		max-width: 310px;
		max-height: 309px;
		margin-top: 0px;
		top: 0px;
    	left: 0px;
	}
*/

	.ribbon-img > img {
		flex: none;
		width: auto;
	}

	.ribbon-card h2 {
		font-size: 43px;
		margin-top: 271px;
		letter-spacing: 2px;
	}

	/* use when images in cards are much larger then the ribbon-img div */
	#home-cards-container a:nth-child(2) > div > img {
		flex: auto;
		width: 0;
	}

	#home-cards-container a:nth-child(3) > div > img {
		flex: none;
	}


	#home-cards-container a:nth-child(4) > div > img {
		flex: auto;
		width: 0;

		margin-top: 90px;
		margin-left: 24px;
		margin-right: 18px;
	}

	#home-cards-container a:nth-child(5) > div > img {
		flex: auto;
		width: 0;
	}


		
	

}


@media only screen and (max-width: 520px) {

	#home-header {
		height: auto;
	}

	#home-header-content {
		height: auto;
		background-image: none;
	}

	#footer-top {
		display: none;
	}

	footer {
		margin-top: 170px;
	}	


	#footer-content:before {
		top: -177px;
	}

	#footer-container {
		max-width: 430px;
		/* max-width: 75%; */
	}
}


@media only screen and (max-width: 480px) {

	#navbar-content {
		flex-direction: column;
	}

}


@media only screen and (max-width: 474px) {

 	.masonry-item {
 		justify-self: center;
 	}

 	.masonry-item-n {
 		justify-self: center;
 		width: 100%;
 	}
}

@media only screen and (max-width: 420px) {
	.ribbon-card {
		max-width: 250px;
		height: 250px;
	}

	.ribbon-img{
		max-width: 220px;
		max-height: 220px;
		margin-top: 5px;
		margin-left: -1.5px;
	}
/*
	.ribbon-img:before{
		max-width: 218px;
		max-height: 219px;
		margin-top: 5px;
	}
*/
	
	.ribbon-card h2 {
		font-size: 31px;
		margin-top: 192px;
		letter-spacing: 1.3px;
	}

	#home-cards-container a:nth-child(1) > div > img {
		flex: auto;
	}

	#home-cards-container a:nth-child(4) > div > img {
		margin-top: 50px;
	}

	#home-cards-container a:nth-child(2) > div > img {
		flex: auto;
		width: 0;
	}


}



@media only screen and (max-width: 395px) {
	/* card images get funky. Set them to be ok at 289 */
	
	.countarea {
		line-height: 35px;
		margin-top: 10px;
	}



	#footer-nav {
	    line-height: 50px;
	    font-size: 38px;
	}

	#footer-address {
    	font-size: 28px;
   	}

   	#footer-content::before {
	    top: -150px;
	}


}



@media only screen and (max-width: 320px) {
	/* this is really small. Drop a lot of images and stuff 
	Or just make them look good at 240*/

	.countarea {
		margin-top: 6px;
	}

	#main-stage {
		padding: .7em;
		padding-top: 1em;
	}



	.ribbon-card {
		max-width: 200px;
		height: 200px;
	}

	.ribbon-img{
		max-width: 177px;
		max-height: 177px;
		margin-top: 4px;
		margin-left: -1.5px
	}
/*
	.ribbon-img:before{
		max-width: 175px;
		max-height: 175px;
		margin-top: 4px;
	}
*/
	
	.ribbon-card h2 {
		font-size: 26.5px;
		margin-top: 152px;
		letter-spacing: .5px;
	}

	#home-cards-container a:nth-child(4) > div > img {
		margin-top: 17px;
	}


	.flex-grid-sm > .flex-grid-item {
		min-width: 175px;
	
	}


}


@media only screen and (max-width: 265px) {
	/* this is really small. Drop a lot of images and stuff 
	Or just make them look good at 240*/

	#main-stage {
		padding: .7em;
		padding-top: 1em;
	}

	
	.ribbon-card {
		max-width: 145px;
		height: 145px;
	}

	.ribbon-img{
		max-width: 129px;
		max-height: 129px;
		margin-top: 3px;
		margin-left: 0;
	}
/*
	.ribbon-img:before {
		max-width: 129px;
		max-height: 129px;
		margin-top: 3px;
		margin-left: 0;		
	}
*/
	
	.ribbon-card h2 {
		font-size: 18.5px;
		margin-top: 111px;
		letter-spacing: .5px;
	}

	#home-cards-container a:nth-child(4) > div > img {
		margin-top: 3px;
	}


}