/* -------------------------------------------------------------- 

		Filename: slideshows.css
		Author:   Tommy Sanchez <tom.sanchez@tinyprints.com>
		Date Created:  8/21/10
		Date Modified: 9/02/10

		Description:
		CSS for the HP, VLP, LP, mini, Greeting and Business slideshows.
		
		Versions:
		8/19/10 | v1.0   | tsanchez | Initial Construction and Development
		8/28/10 | v1.0.1 | eritchey | Updated Description
		9/02/10 | v1.0.2 | tsanchez | Made slideshow more flexible for dynamic # of slides
		9/04/10	| v1.0.3 | tsanchez | Added styles for all types of pages
		9/05/10 | v1.0.4 | tsanchez | Added styles for full-width pages
		
		Example Implementation:
		Large version: <div id="slideshow">
		Mini version: <div id="slideshow" class="mini">
		
		Page-modifying classes will control images that appear in slideshow. E.G. #container.vlp.occasions and #container.vlp.invitations 
		can have different images because of specificity.  Images would be added like so:
			#container.vlp.occasions #slides div {
				background: url('new_image_sprite.jpg') no-repeat 0 0;
			}
		...and so on. 

-------------------------------------------------------------- */
#slideshow {
	position: relative;
	overflow: hidden;
	background: #fff;
	border: 1px solid #e5e5e5;
}

#slideshow.mini {
	height: auto;
	border: 0;
	padding: 0px;
	width: 225px;
}

#slideshow.mini img {
	padding:0px;
}

.lp .module #slideshow.col_6.mini,
.blp .module #slideshow.col_6.mini,
.glp .module #slideshow.col_6.mini,
.wlp .module #slideshow.col_6.mini {
	min-height: 225px;
}

#slides div {
	background: transparent url('/image/wpd/slideshows/multi-homepage-second-2012-01-24.jpg') no-repeat 0 0; /* Sprite */
	position: relative;
	overflow: hidden;
	text-indent: -999em;
	border: 2px solid #fff;
	border-bottom: 0;
	margin: 5px;
	width: 744px;
	z-index: 0;
}

#slides div:first-child {
	background: transparent url('/image/wpd/slideshows/multi-homepage-first-2012-01-31.jpg') no-repeat 0 0;
}

#slideshow.mini #slides div {
	
	/* Need final sprited images */

	background: transparent url('/image/tp/rebrand/tempImg.png') no-repeat 0 0; /* Sprite */
	margin: 4px;
	border: 0;
	width: 217px;
	height: 144px;
}

#slideshow.mini #slides div:first-child {
	
	/* Need final mini image 1 */
	
	background: transparent url('/image/tp/rebrand/tempImg.png') no-repeat 0 0;
}

.full #slides div {
	/* Need final image */
	
	background: transparent url('/image/tp/multi-homepage-second.jpg') no-repeat 0 0; /* Sprite */
	width: 954px;
}

#slides a {
	display: block;
	position: absolute;
	top: 0; left: 0;
}

#slideshow.mini #slides a {
	/* width: 218px; */
	width: 217px;
	height: 131px;
}

.full #slides a {
	width: 954px;
}

/* Controls the height of the slides */
.wpd #slides div, .wpd #slides a {
	height: 356px;
	width: 744px;
}

.lp #slides div, .lp #slides a,
.vlp #slides div, .vlp #slides a,
.bvlp #slides div, .bvlp #slides a,
.gvlp #slides div, .gvlp #slides a,
.wvlp #slides div, .wvlp #slides a,
.full #slides div, .full #slides a {
	height: 260px;
}

/* Slideshow "control" links (pagination) */
#slideshow-controls {
	position: relative;
	width: 750px;
	z-index: 15;
	border-right: 2px solid #fff;
	margin: 7px 0 5px 5px;
}

.full #slideshow-controls {
	width: 100%;
}

#slideshow-controls p {
	position: relative;
	float: left;
	text-align: center;
	padding-top: 5px;
	margin: -5px 0 5px 0;
	white-space: nowrap;
	overflow: hidden;
}

#slideshow-controls p:first-child a {
	border-left: 2px solid #fff;
}

#slideshow.mini #slideshow-controls {
	position: absolute;
	bottom: 8px;
	right: 5px;
	width: auto;
}

#slideshow.mini #slideshow-controls p {
	background: transparent;
	padding: 0;
	margin: -8px 0 0 3px;
	font-size: .9em;
}

#slideshow.mini #slideshow-controls p:first-child {
	margin-left: 0;
}

#slideshow-controls a {
	display: block;
	background: #b3a89d;
	color: #fff;
	vertical-align: middle;
	padding: 2px 0 4px;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
}

#slideshow.mini #slideshow-controls a {
	padding: 1px 6px 0;
	border: 0;
	background: transparent;
	color: #00d1ce;
	border: 0;
	vertical-align: middle;
}

.blp #slideshow.mini #slideshow-controls a,
.bvlp #slideshow.mini #slideshow-controls a {
	color: #099;
}

#slideshow-controls a:hover, #slideshow-controls a.activeSlide {
	background: #5CADD6;
	text-decoration: none;
}

#slideshow-controls p.activeSlide {
	/* background: url('/image/tp/rebrand/sprite-main.png') no-repeat 0 0; */
	z-index: 20;
}

.bhp #slideshow-controls a:hover, .bhp #slideshow-controls .activeSlide a,
.blp #slideshow-controls a:hover, .blp #slideshow-controls .activeSlide a,
.bvlp #slideshow-controls a:hover, .bvlp #slideshow-controls .activeSlide a {
	background: #97b5b4;
}

#slideshow.mini #slideshow-controls p.activeSlide a {
	background: #00d1ce;
	color: #fff;
	-moz-border-radius: 14px;
	-webkit-border-radius: 14px;
	-o-border-radius: 14px;
}

.blp #slideshow.mini #slideshow-controls p.activeSlide a,
.bvlp #slideshow.mini #slideshow-controls p.activeSlide a {
	background: #099;
}

/* Next/Previous */
#slideshow #prev, #slideshow #next {
	display: none;
	position: absolute;
	top: 40%;
	width: 27px;
	height: 54px;
	z-index: 10;
	cursor: pointer;
}

#slideshow.mini #prev, #slideshow.mini #next {
	top: 25%;
	width: 17px;
	height: 32px;
}

#slideshow #prev {
	background: url('/image/tp/rebrand/sprite-main.png') no-repeat 0px -279px;
	left: 0;
}

#slideshow #next {
	background: url('/image/tp/rebrand/sprite-main.png') no-repeat -41px -279px;
	right: 0;
}

#slideshow.mini #prev {
	background: url('/image/tp/rebrand/sprite-main.png') no-repeat 0px -342px;
}

#slideshow.mini #next {
	background: url('/image/tp/rebrand/sprite-main.png') no-repeat -52px -342px;
}
/* --- dots -- */
#ssdots {
	position:absolute;
	bottom:15px;
	right: 15px;
	z-index: 15;
}

#ssdots p {
	margin: 0px 5px;
	float: left;
	width: 10px;
	background: #DDD;
	opacity:0.8;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border: 1px solid #666;
}

#ssdots a {
	text-indent: -9999px;
	width:10px;
	height: 10px;
	display:block;
}

#ssdots p.activeSlide {
	background: #666;
	opacity: 1.0;
}

/* --- SPECIFYING THE CSS FOR EACH OF THE VERTICALS HERE --- */

/*
	Date:     5/13/2010

	Purpose:  This file is specifc to adding any A/B test
	          related CSS. Use this for overriding anything
	          that might be included in the base CSS files also.

	Author:   Eric Ritchey <eric@tinyprints.com>
	
	Versions: 1.0 - Initial A/B test relating to:
	                https://bugs.tinyprints.com/browse/AWSM-1796

	Versions: 1.1 - Custom Homepage Content based on search terms:
	                https://bugs.tinyprints.com/browse/AWSM-2582
	                https://bugs.tinyprints.com/browse/AWSM-1451

*/

/* --- added for multivariate custom HP content based on search terms --- */
.index .core-3-col div.mid { margin-left: 10px; }
#container #featured-aside h4.heart,
#container #featured-aside h4.blog  { padding-left: 22px; height: 17px; }
#container #featured-aside h4.heart { background: url('/image/core-icons/icon-sprite.png')      no-repeat 0  -113px; }
#container #featured-aside h4.blog  { background: url('/image/wpd/css/icons/social-sprite.png') no-repeat 0px -42px; }