/*=========================================================================================
	MEDIA WIDGET DEFAULT
==========================================================================================*/
.media_widget_settings{
	width: 616px;
	/*height: 650px;*/
	clear:both;
}

#photoThumbsContainer{
	padding-left: 6px;
}
#videoThumbsContainer{
	float:right;
	width:255px;
}
.safari_mobile #videoThumbsContainer{
	width:270px;
}

#photo_title_text{
	padding-left:25px;
}
#view_details_text{
	font-size:10px;
	text-decoration:underline;
}
.thumbnailTitleText{
	padding-left:70px;
	margin-top:3px;
	margin-bottom:2px;
	font-size:12px;
}

#filmstrip {
	background-image: url(/images/common/img_checked_bg.gif);
	margin-top: 8px;
	padding-top: 1px;
	padding-bottom: 2px;
	width: 616px;  			/* changed by Aaron to fix wide pages */
	#height: 99px;
	_height: 96px; /* Firefox height setting */
}

.wedding #filmstrip {
	background-image: url(/images/weddings/common/img_checked_bg.gif);
}

/* table to define position of elements inside photoThumbs div, and to create white bg */
/* height must be a multiple of 4, minus 1 */
#photoThumbStructure, #videoThumbStructure {
	width: 100%;
	height: 75px;
	background-color: #ffffff;
}

/* left arrow in thumb scroller */
a#photoArrowLeft, a#videoArrowLeft{
	background-image: url(/images/common/img_phototools_arrow_left_disabled.gif);
	background-position: 0% 50%;
	background-repeat: no-repeat;
	display: block;
	width: 15px;
	padding-top: 28px;
	padding-bottom: 35px;
	display: block;
	text-decoration: none;
	font-size: 10px;
	line-height: 10px;
	float: left;
	cursor: default;
}

/* enabled state for left arrow in thumb scroller */
a#photoArrowLeft.enabled, a#videoArrowLeft.enabled{
	background-image: url(/images/common/img_phototools_arrow_left.gif);
	cursor: pointer;
}

.wedding a#photoArrowLeft.enabled{
	background-image: url(/images/common/img_phototools_arrow_left_wedding.gif);
}
.wedding a#videoArrowLeft.enabled{
	background-image: url(/images/common/img_phototools_arrow_left_wedding.gif);
}
/* right arrow in thumb scroller */
a#photoArrowRight, a#videoArrowRight {
	background-image: url(/images/common/img_phototools_arrow_right_disabled.gif);
	background-position: 0% 50%;
	background-repeat: no-repeat;
	display: block;
	padding-top: 28px;
	padding-bottom: 35px;
	margin-left: 7px;
	padding-left: 7px;
	text-decoration: none;
	font-size: 10px;
	line-height: 10px;
	float: left;
	cursor: default;
}


/* enabled state for right arrow in thumb scroller */
a#photoArrowRight.enabled, a#videoArrowRight.enabled {
	background-image: url(/images/common/img_phototools_arrow_right.gif);
	color: #8e8e4f;
	cursor: pointer;
}
.wedding a#photoArrowRight.enabled, .wedding a#videoArrowRight.enabled{
	background-image: url(/images/common/img_phototools_arrow_right_wedding.gif);
	color: rgb(100, 149, 163);
}

.safari_mobile a#photoArrowLeft,
.safari_mobile a#videoArrowLeft {
	background-image: url(/images/common/img_phototools_arrow_left_disabled_big.gif);
	width: 23px;
}

.safari_mobile a#photoArrowRight,
.safari_mobile a#videoArrowRight {
	background-image: url(/images/common/img_phototools_arrow_right_disabled_big.gif);
	width: 8px;
}

.safari_mobile a#photoArrowLeft.enabled,
.safari_mobile a#videoArrowLeft.enabled {
	background-image: url(/images/common/img_phototools_arrow_left_big.gif);
}

.safari_mobile a#photoArrowRight.enabled,
.safari_mobile a#videoArrowRight.enabled {
	background-image: url(/images/common/img_phototools_arrow_right_big.gif);
}

.safari_mobile .wedding a#photoArrowLeft.enabled,
.safari_mobile .wedding a#videoArrowLeft.enabled {
	background-image: url(/images/common/img_phototools_arrow_left_wedding_big.gif);
}

.safari_mobile .wedding a#photoArrowRight.enabled,
.safari_mobile .wedding a#videoArrowRight.enabled {
	background-image: url(/images/common/img_phototools_arrow_right_wedding_big.gif);
}


/* viewer div for thumbscoller */
#photoThumbsViewer, #videoThumbsViewer {
	position: relative;
	overflow-x:scroll;
	overflow-y:hidden;
	float: left;
	width: 225px;
	height: 74px;
}

/* table containing thumbs */
#photoThumbsTable, #videoThumbsTable {
	position: absolute;
	left: 0px;
	top: 0px;
	height: 68px;
}

/* a div is wrapped around each thumb to ensure proper spacing */
#photoThumbsTable  div,#videoThumbsTable div {
	width: 74px;
}

/* the * html variants below are used to get the img border showing up in IE6 */
/* photothumb default state */
#photoThumbsTable img, #videoThumbsTable img {
	margin: 2px;
}
* html #photoThumbsTable img, #videoThumbsTable img  {
	margin: 2px;
}

/* on hover, remove img margin and border of equal thickness */
#photoThumbsTable img:hover, #videoThumbsTable img:hover {
	margin: 0px;
	border: 2px solid #ff0033;
}
* html #photoThumbsTable a:hover{
  visibility: visible;
}
* html #photoThumbsTable a:hover img, #photoThumbsTable a:focus img {
	margin: 0px;
	border: 2px solid #ff0033;
}

/* keep border on current thumb */
#photoThumbsTable img.currentThumb, #videoThumbsTable img.currentThumb  {
	margin: 0px;
	border: 2px solid #ff0033;
}
* html #photoThumbsTable img.currentThumb:hover, #videoThumbsTable img.currentThumb:hover {
    margin: 1px;
	border: none;
	
}


/*=========================================================================================
	END PHOTO THUMBS
==========================================================================================*/



/*=========================================================================================
	LARGE PHOTO DISPLAY
==========================================================================================*/

/* div where img tag for large photo is written using javascript */
#mediaContainer {
	position:relative;
	margin-top: 8px;
	text-align:center;
	z-index:100;
	background-color: #FFFFFF;
}
.jp #mediaContainerNext {
        position:absolute;
        top:318px;
        *top:321px;
        _top:323px;
        text-align:center;
        z-index:99;
        background-color: #FFFFFF;
}

#mediaContainerNext {
	position:absolute;
	top:317px;
	*top:321px;
        _top:320px;
	width: 616px;	
        text-align:center;
	z-index:99;
	background-color: #FFFFFF;
	padding-bottom: 2px;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
	#mediaContainerNext {
		position:absolute;
		top:317px;
		text-align:center;
		z-index:99;
		background-color: #FFFFFF;
	}
}
.media_invisible{
filter:alpha(opacity=0);
	-moz-opacity:0;
	opacity:0;
}
.media_visible{
filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
}
#mediaContainerContents, #mediaContainerNextContents{
	position:relative;	
	margin: 0 auto;
}
/* div where caption for large photo is written using javascript */


#mediaContainermediaCaption, #mediaContainerNextmediaCaption{
	text-align:left;
	position:absolute;
	top:0px;
	left:0px;
	margin:auto;
	background-color: #EEEFE0;
	filter:alpha(opacity=75);
	-moz-opacity:.75;
	opacity:.75;
	
	z-index:1000;
}

.mediaContents{
	position:absolute;
	text-align:left;
	left:10px;
	height:50px;
	font-family: Verdana;
	font-size: 12px;
	color: #000000;
	line-height:1.5em;
	z-index:1001;
	margin:auto;
}

/*	this div uses a tiled bg image to create the dotted lines, with white table cells in size to block out the middle as needed */
#mediaToolbar {
	white-space:nowrap;
	background-image:url(/images/common/img_checked_bg.gif);
	clear:both;
	height:29px;
	margin-bottom:16px;
	margin-top:-10px;
	padding-bottom:2px;
	padding-top:1px;
	width:616px;
 }

.wedding #mediaToolbar {
	background-image: url(/images/weddings/common/img_checked_bg.gif);
}

/* white bg color for certain cells in photo tools */
#mediaToolbar td.solid {
	background-color: #ffffff;
	padding-top:0px;
	padding-bottom:0px;
	padding-left:0px;
}
#mediaContainerFlashPlayer {
 -moz-outline-style: none;
outline: none;
}
#flashFullScreenButton {
	-moz-outline-style: none;
	outline: none;
}
#fullScreenBtn{
	float:left;
	margin-top: 7px;
	width:119px;
	height:15px;
	white-space:nowrap;
}
.ar #fullScreenBtn{
	padding-left:5px;	
}
#flashContainer{
	width:119px;
	height:15px;
}

.de #fullScreenBtn{
	position:relative;
	top:7px;
	width:98px;
	height:15px;
	white-space:nowrap;
}
.de #flashContainer{
	width:98px;
	height:15px;
}

.safari_mobile #fullScreenBtn{
	width:109px;
}

/*=========================================================================================
	END LARGE PHOTO DISPLAY
==========================================================================================*/

/*=========================================================================================
        START PHOTOS AND VIDEOS CONTROL
==========================================================================================*/
#slideshow_buttons {
	position:relative;
	top:7px;
	*top:5px;
	height:15px;
	font-size:11px;
	float:left;
	vertical-align:	middle;
	visibility:hidden;
}

.es #slideshow_buttons {
	padding-left: 50px;
}
#slideshow_buttons A:link {text-decoration: none;color:black;}
#slideshow_buttons A:visited {text-decoration: none;color:black;}
#slideshow_buttons A:active {text-decoration: none;color:black;}
#slideshow_buttons A:hover {text-decoration: none;color:black;}

#slower_button, #previous_button, #next_button, #faster_button, #playpause_button{
	float: left; 
	margin-left:40px;
	cursor:pointer;
	height:15px;
}

#ordinal{
	float: left; 
	margin-left:125px;
	height:15px;
}


#slower, #previous, #next, #faster, #play, #pause{
	width:18px;
	height:13px;
}

.safari_mobile #slower,
.safari_mobile #previous,
.safari_mobile #next,
.safari_mobile #faster,
.safari_mobile #play,
.safari_mobile #pause{
	width:24px;
	height:16px;
}


#slower_button_text, #previous_button_text, #next_button_text, #faster_button_text, #playpause_button_text {
	position:relative;
	top:-2px;
	*top:0px;
	height:13px;
}

