/*-----------------------------------------------------------------------------
author:    www.visityakima.com
-----------------------------------------------------------------------------*/


/* =Yakima Valley Tourism Communities Pages
-----------------------------------------------------------------------------*/
.bannerYakima {
	background:url("../img/banners/yakima-banner.jpg") center center;	
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;	
	}
    
.bannerSunnyside {
	background:url("../img/banners/sunnyside-banner.jpg") center center;	
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;	
	}
    
.bannerUnionGap {
	background:url("../img/banners/union-gap-banner.jpg") center center;	
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;	
	}
    
.bannerProsser {
	background:url("../img/banners/prosser-banner.jpg") center center;	
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;	
	}
    
.distressedOverlayTop {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    }
    
.distressedOverlayBottom {
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    }
    
.crowdRiffPillar {
    margin:0 0 4em 0;
    }
    
.facebook {
    padding:0 0 2em 0;
    }
    
/* =Pillar Main Features
-----------------------------------------------------------------------------*/
    
.pillarFeatures {
    position:relative;
    display:grid;
    grid-template-columns: 50% 50%;
    background:#eee9e3;
    }
    
.firstPillar {
    margin:-50px 0 0 0;
    z-index:6000;
    }
    
.pillarFeatures div:first-of-type {
    background:url(../img/fifty-border.gif) top right repeat-y;
    }
    
.pillarFeatures img {
    width:100%;
    }
    
.pillarText {
    padding:5%;
    }
    
.pillarText .blueBtn, .pillarText .wineBtn {
    margin:0 0 1em 0;
    }
    
    
/* =Attraction
-----------------------------------------------------------------------------*/

    
ul.attractionCat {
	padding:0 0 0 0;
    margin:0 0 6em 0;
	list-style:none;
	display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr; 
    grid-gap:2rem;
    text-align: center;  
    justify-content: center;
	}
    
ul.attractionCat li {
	}
    
.attractionCatPhoto {
    position:relative;
    -webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
    overflow: auto;
    }
    
.attractionCatPhoto:hover {
    opacity:0.50;
    filter:alpha(opacity=50); /* For IE8 and earlier */
	}
    
.attractionCatPhoto img {
    width:100%;
    }
    
.attractionCat h2 {
    position:absolute;
    bottom:0;
    left:0;
    color:#fff;
    padding: 3%;    
    text-align: center;
    width:94%;
    margin:0;
    background: rgba(140, 24, 45, 0.75);
    }
    
.attractionCatPhoto h2 small {
    display: block;
    font-size:60%;
    line-height: 80%;
    color:#facc65;
    }
    
    
/* =Events
-----------------------------------------------------------------------------*/
h2.eventHeader {
    margin:0 0 .25em 0;
    }

ul.eventsListings {
    display: grid;
    text-align: center;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap:2rem; 
    margin:0 0 2em 0;  
    align-items: center;
    font-size:70%;
    }
    
    
/* =Listings
-----------------------------------------------------------------------------*/
    
ul.listingsSixUp {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-gap:2rem;
    margin:0 0 3em 0;
	}
    
@media all and (max-width: 2000px) {

ul.eventsListings {
    grid-template-columns: 1fr;
    }
    
}

@media all and (max-width: 1775px) {
	
.firstPillar {
    margin:-30px 0 0 0;
    z-index:6000;
    }
	
}

@media all and (max-width: 1750px) {
	
.twoColFifty {
    grid-template-columns: 1fr;
    }
    
ul.eventsListings {
    grid-template-columns: 1fr 1fr 1fr;
    }
	
}
	
@media all and (max-width: 1400px) {
	
ul.listingsSixUp {
    grid-template-columns: 1fr 1fr 1fr 1fr;
	}
	
}

@media all and (max-width: 1250px) {

ul.attractionCat {
    grid-template-columns: 1fr 1fr; 
	}
	
}

@media all and (max-width: 1000px) {
	
ul.eventsListings {
    grid-template-columns: 1fr 1fr;
    }
	
}

@media screen and (max-width: 900px) {	

ul.listingsSixUp {
    grid-template-columns: 1fr 1fr 1fr;
	}
	
}
	
@media all and (max-width: 875px) {

    
ul.attractionCat { 
    grid-template-columns: 1fr 1fr;  
    grid-gap:1rem;
    margin:0 0 2em 0;
	}
    
.attractionCatPhoto h2 {
    font-size: 95%;
    }
    
.attractionCatPhoto h2 small {
    font-size:80%;
    }

}

@media all and (max-width: 750px) {

.attractionCatPhoto {
    margin:0 0 1.5em 0
    }
    
}

@media all and (max-width: 700px) {

section h1 span, .pillarFeatures h1 span {
	display:inline-block;
	}
	
}

@media all and (max-width: 675px) {
	

    
.pillarFeatures {
    grid-template-columns: 100%;
    }
    
.pillarFeatures div:first-of-type {
    background:none;
    }
    
ul.eventsListings {
    grid-template-columns: 1fr;
    grid-gap:1rem;
    }
    
ul.listingsSixUp {
    grid-template-columns: 1fr 1fr;
	}
	
}