@charset "utf-8";

/* STYLES FOR DHTML PLACEMENT IN RESPONSE TO USER INTERACTIONS */

.slideimage                    { width:640px; height:480px; }
.slideimage_captioned          { width:640px; height:480px; }
.slideimage_swapped            { width:320px; height:240px; }
.slideimage_swapped_captioned  { width:320px; height:240px; }

	/*
	.slideimage_mirrored                    { width:640px; height:480px; }
	.slideimage_captioned_mirrored          { width:640px; height:480px; }
	.slideimage_swapped_mirrored            { width:320px; height:240px; }
	.slideimage_swapped_captioned_mirrored  { width:320px; height:240px; }
	*/

.region1                       { left:338px; top:105px; width:640px; height:480px; }
.region1_captioned             { left:338px; top:105px; width:640px; height:480px; }
.region1_swapped               { left:17px;  top:106px; width:320px; height:240px; }
.region1_swapped_captioned     { left:17px;  top:106px; width:320px; height:240px; }

.video                         { left:17px;  top:106px; width:320px; height:304px; }
.video_captioned               { left:17px;  top:106px; width:320px; height:368px; }
.video_swapped                 { left:381px; top:106px; width:555px; height:480px; }
.video_swapped_captioned       { left:424px; top:105px; width:469px; height:480px; }

.captionbox                    { display:none;  }
.captionbox_captioned          { display:block; }
.captionbox_swapped            { display:none;  }
.captionbox_swapped_captioned  { display:block; }

.video_bg                      { height:304px; }
.video_bg_captioned            { height:368px; }
.video_bg_swapped              { height:304px; }
.video_bg_swapped_captioned    { height:304px; }

.sourcemedia                   { height:304px; }
.sourcemedia_captioned         { height:304px; }
.sourcemedia_swapped           { height:480px; }
.sourcemedia_swapped_captioned { height:416px; }

.sourcereal                    { height:304px; 
									// clip:rect(0px,240px,320px,0px); }
.sourcereal_captioned          { height:304px; }
.sourcereal_swapped            { height:527px; 
	clip:rect(0px 416px 555px 0px); // clip:rect(0px,416px,555px,0px); }
.sourcereal_swapped_captioned  { height:416px; }

.mscc                          { display:none;  }
.mscc_captioned                { display:block; }
.mscc_swapped                  { display:none;  }
.mscc_swapped_captioned        { display:block; }

.MediaPlayer                   { width:320px; height:304px; }
.MediaPlayer_captioned         { width:320px; height:304px; }
.MediaPlayer_swapped           { width:555px; height:480px; }
.MediaPlayer_swapped_captioned { width:469px; height:416px; }

.RealPlayer                    { width:320px; height:304px;
									// clip:rect(0px,240px,320px,0px); }
.RealPlayer_captioned          { width:320px; height:304px; }
.RealPlayer_swapped            { width:555px; height:527px;
	clip:rect(0px 416px 555px 0px); // clip:rect(0px,416px,555px,0px); }
.RealPlayer_swapped_captioned  { width:469px; height:416px; }

.controls                      { position:relative; top:-64px;  height:64px; }
.controls_captioned            { position:relative; top: 0px;   height:64px; }
.controls_swapped              { position:relative; top:-110px; }
.controls_swapped_captioned    { position:relative; top: 0px;   }

/* -----
.element                   {}
.element_captioned         {}
.element_swapped           {}
.element_swapped_captioned {}
 ----- */
 
/* elements involved in DHTML scripting operations */
.grpRight    { float:right; }
.grpLeft     { float:left; }
#slide_bg    { width:640px; height:480px; background-color:#333333; }
#region1     { position:absolute; }
#video_bg    { position:relative; width:320px; background-color:#333333; margin-bottom:1px; }
#video       { position:absolute; margin-bottom:1px; }
#captionbox  { background-color:#181818; }
#mscc        { font-size:11px; letter-spacing:1px; color:#FFFFFF; text-align:center;
	overflow:auto; line-height:16px; height:64px; }
#controls    { width:100%; }

/* style for content box underneath the tab menu */
.region2content { width:310px; padding:10px 5px; clear:both; background:#545b5f;
	color:#ffffff; z-index:2; position:relative; overflow:auto; font-size:.9em; }
.r2normal { height:129px; clip:rect(0px 129px 310px 0px); // clip:rect(0px,129px,310px,0px); }
.r2short  { height:65px;  clip:rect(0px 65px  310px 0px); // clip:rect(0px,65px,310px,0px);  }

/* top-menu buttons and their icons */
#zoomVid     { background:url(icon_zoomVid.gif)   center left no-repeat; padding-left:5px; padding-right:5px; }
#swapVid     { background:url(icon_swap.gif)      center left no-repeat; padding-left:5px; padding-right:5px; }
#captions    { background:url(icon_cc.gif)        center left no-repeat; padding-left:5px; padding-right:5px; }
#thumbs      { background:url(icon_thumbs.gif)    center left no-repeat; padding-left:5px; padding-right:5px; }
#zoomSlide   { background:url(icon_zoomSlide.gif) center left no-repeat; padding-left:5px; padding-right:5px; }

/* div grouping of the video and region2 elements. achieves the 1px
	 gap between the video/region2 and the slide. */
.videoR2Group          { position:relative; z-index:9999; width:320px; float:left; margin-left:-1px; margin-right:1px; }
.videoR2Group_mirrored { width:320px; float:right; margin-right:-1px; margin-left:1px; }
