/* 
==========================================================================
Homepage
========================================================================== */

/* Slideshow css on home-slideshow.css */

/* 
==========================================================================
Intro
*/

@media screen and (min-width: 300px) {
	
#page-content {  padding-top: 20px; }
	
.intro h1 { text-align:center; width: 93%; font-size: 30px; line-height: 37px; margin: 0 auto 10px; }
	
.intro p { text-align:center; width: 90%; font-size: 16px; line-height: 24px; margin: 0px auto 6px; }

}

@media screen and (min-width: 481px) {
	
#page-content {  padding-top: 10px; }

}

@media screen and (min-width: 500px) {

#page-content {  padding-top: 25px; }

.intro h1 { font-size:36px; line-height: 44px; }
	
.intro p { width:95%; font-size:18px; line-height: 28px; margin:0 auto 10px;  }
	
}

@media screen and (min-width: 850px) {
	
.intro h1 { font-size:40px; line-height: 45px; margin:0 auto 15px; }
	
.intro p { font-size:18px; line-height: 28px; margin:0 auto 20px;  }

#page-content {  padding-top: 35px; }

}


@media screen and (min-width: 900px) {
	
.intro h1 { width: 85%; }
	
.intro p { width: 90%; }

}


/* 
==========================================================================
Social Media Feeds
*/
.social-feeds-container { position:relative; display:none; width:260px; height:auto; margin:10px auto 20px; z-index:1000; }

.facebookButton, .twitterButton, .instagramButton, .pinterestButton { position:relative; float:left; margin:0 5px; display:block; }

.facebookButton .icon, .twitterButton .icon, .instagramButton .icon, .pinterestButton .icon 
{ background:url(/assets/images/home-social-icons.png) no-repeat; width:55px; height:55px; overflow:hidden; display:block; text-indent:-9999px; }

.facebookButton .icon:hover, .twitterButton .icon:hover, .instagramButton .icon:hover, .pinterestButton .icon:hover
{ cursor:pointer; opacity:8; }

.facebookButton .icon { background-position:0 0; }

.twitterButton .icon { background-position:-63px 0; }

.instagramButton .icon { background-position:-189px 0; }

.pinterestButton .icon { background-position:-125px 0; }

/* FEED WINDOWS  */ 

.feed { position: absolute; background:#fff;  }

.feed.facebook { display:none; height:410px; width:310px; padding:0 0 0 5px; left:-126px; top:-417px; border:solid 1px #ccc; border-bottom:none; z-index:1001; }

.feed.twitter { display:none; height:405px; width:210px; padding: 10px 15px 5px 15px; left:-76px; top:-413px; border:solid 1px #ccc; border-bottom:none; z-index:1001;}

.feed.instagram { display:none; height: 410px; width:265px; padding:20px 5px 0 10px; left:-102px; top:-417px; border:solid 1px #ccc; border-bottom:none; z-index:1001;}

.feed.pinterest { height:300px; width:264px; background:none; left:-9999px; top:-417px; z-index:1001;}

.feed.pinterest span:first-child { background:#fff!important; box-shadow: none!important; border-radius: 0!important; border:solid 1px #ccc; border-bottom:none; height:410px; z-index:51; }

.feed.pinterest a span:first-child { background: transparent!important; z-index:52; }

.feed.pinterest span span a:hover { background:#fff!important; }

.social-feeds .facebookButton:hover .feed.facebook, .social-feeds .twitterButton:hover .feed.twitter, .social-feeds .instagramButton:hover .feed.instagram { display: block!important; }

.social-feeds .pinterestButton:hover .feed.pinterest { left:-105px; }

/* WINDOW ARROWS */

.feed.facebook .bottom-arrow, .feed.twitter .bottom-arrow, .feed.instagram .bottom-arrow, .feed.pinterest .bottom-arrow 
{ display: block; height:19px; background:url(/assets/images/home-social-feed-arrow.png) bottom center no-repeat; z-index:100; }

.feed.facebook .bottom-arrow { width:310px; margin:-4px 0 0 -5px; }

.feed.twitter .bottom-arrow { width:210px; margin:-4px 0 0 -15px; }

.feed.instagram .bottom-arrow { width:263px; margin:-4px 0 0 -10px; }

.feed.pinterest .bottom-arrow { width: 266px; margin:-2px 0 0 0; z-index:100!important; }


@media screen and (min-width: 600px) {
	.social-feeds-container { display: block; }
}

@media screen and (min-width: 890px) {
	.social-feeds-container { width: 260px; }
}

/* 
==========================================================================
Divider
*/ 

@media screen and (min-width: 300px) {

.divider { margin-bottom:20px; }

.divider.showOnMobile { display:block; margin-bottom:40px; }


}

@media screen and (min-width: 481px) {

.divider { margin-bottom:40px; }

}

/* 
==========================================================================
Theme
*/

.theme { text-align:center; display:block; }

.themeLink { display:block; padding:10px; text-align:center; font-size:18px; margin:0 0 15px 0; }

.themePhotoRT { margin-bottom:26px; }

.themePhotoRB { }

.theme a:hover img { opacity:.8 }

.videoWrapper {	position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; }

.videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


@media screen and (min-width: 300px) {

.themeTitle { font-size:32px; line-height:37px; margin:0 0 15px 0; font-weight:300; }

.themeText {  width:90%; font-size: 16px; line-height: 24px; margin: 0 auto 10px auto; padding:0; }
	
.tagline { display:none; }

.theme { margin-bottom: 40px; }

}


@media screen and (min-width: 481px) { 

.divider.showOnMobile { display:none; }

.theme { margin-bottom:70px; }

}


@media screen and (min-width: 600px) { 

.themeTitle { font-size:35px; line-height:40px; }

.themeText { width: 80%; font-size: 19px; line-height: 27px; }

.tagline { background:url(/uploads/homepage/gettysburg-cvb-tagline.png) no-repeat; width:395px; height:60px; display:block; text-indent:-9999px; margin:20px 25px 0 0; float:right; display:block; }

}

/* 
==========================================================================
Featured
*/

.featured { display:block; margin-bottom:20px; margin-top:20px; }

.featured .addPadd { margin-bottom: 25px; }

.featured .item { position:relative; }

.featured .item img { z-index:90; }

.featured a p { font-weight:300; color:#fff; background:rgba(198,78,12,0.80); font-size:19px; line-height:22px; padding:6px 20px 7px; display:block; margin:0; position:absolute; bottom:25px; white-space:nowrap; transition: background .5s ease; z-index:100; }

.featured a:hover p { background:rgba(198,78,12,1.0); }

.featured .titleLeft a p { padding-right:35px; left:15px; transition: padding .5s ease; }

.featured .titleRight a p { padding-left:35px; right:15px; transition: padding .5s ease; }

.featured .titleLeft a:hover p { padding-left:30px; }

.featured .titleRight a:hover p { padding-right:30px; }

.featuredPhotoTL { margin-bottom:25px; }

.featuredPhotoB { margin-bottom:25px; }

.locatorMap { margin-bottom:25px; }

.locatorMap:hover { opacity:.8 }


@media screen and (min-width: 481px) { 

.featured .addPadd { margin-bottom:22px; }

.featuredPhotoTL { margin-bottom:0; }

/*section img.locatorMap  { margin-bottom:0; max-width:125%!important; }*/

.locatorMap { margin-bottom:0; }

}

@media screen and (min-width: 769px) { 

.featuredPhotoB { margin-bottom:0; }

}

/* 
==========================================================================
SOCIAL SHARES
*/

@media screen and (min-width: 300px) { 

.socialLinks { margin: 0 auto 20px; text-align: center; float:none; }  

}

@media screen and (min-width: 560px) {

.socialLinks { margin: 0; float:right; text-align:right; }
 }


/* 
==========================================================================
SCROLL
*/

@media screen and (min-width: 300px) {

.scrollTop { text-align:center; color:#ddd; font-size:60px; display:block; margin:0 auto; width:150px;  }

.scrollTop span { display:block;  color: #fff;  font-size: 14px;  text-transform: uppercase;  padding: 0 0;  font-family: oxygen, arial;  letter-spacing: .04em; }

.scrollTop:hover { color:#d6d580; cursor:pointer; }

.scrollTop:hover span { cursor:pointer; color: #aaa;!important }

}

@media screen and (min-width: 481px) {
	
.scrollTop { display:none; }
	
}

/* 
==========================================================================
FOOTER
*/

@media screen and (min-width: 300px) {

#getaway-guide { margin-top:0; }

}

@media screen and (min-width: 481px) {

#getaway-guide { margin-top:30px; }



}