@charset "utf-8";
/* CSS Document */
@import url("embeddefault.css");

/*root element for the scrollable.
when scrolling occurs this element stays still.*/
.slate {position:absolute; top:50%; height:475px; left:10px; right:10px; margin:-236px 0px 0px 0px; background: #444 url(../img/grad475h.png) repeat-x bottom; border-radius:5px;}
.scrollableIcons {
	/* required settings */ overflow:hidden; height:459px; top:6px; left:52px; right:52px; padding: 6px 0px 0px 0px; position:absolute;border-radius:5px;
	-moz-box-shadow: inset 0 0 5px 2px #222; -webkit-box-shadow: inset 0 0 5px 2px #2222; box-shadow: inset 0 0 5px 2px #222; background:url(../img/trans/black/20.png) repeat ;
}
/*root element for scrollable items. Must be absolutely positioned and it should have a extremely large width to accomodate scrollable items.
it's enough that you set the width and height for the root element and not for this element.*/
.scrollableIcons .columns {/* this cannot be too large */ width:20000em; position:absolute; clear:both; padding:0px; margin:0px;}
.mmThumbContainer.selected {cursor:default;}
.mmThumbContainer:hover {cursor:pointer;}
.mmThumbColumn {font-size:11px; text-align:center; position:relative; width:142px; margin-left:10px; float:left; -moz-user-select: none; -khtml-user-select: none; user-select: none;}
.mmThumbContainer {position:relative; height:147px; width:142px; margin-bottom:6px;}
.mmThumb {position:relative; width:142px; height:107px; display:table; border-radius:5px; background:url(../img/bg-warnlite.png) repeat;}
.mmImg {max-width:142px; max-height:107px; margin:auto; display:table-cell; vertical-align:middle;}
.imgIconContainer {position:relative; display:inline-block;}
.mmThumb img {max-width:142px; max-height:107px; margin:auto; border-radius:5px;}
.mmThumb img:hover {-moz-box-shadow: 0 0 3px 1px #000; -webkit-box-shadow: 0 0 3px 1px #000; box-shadow: 0 0 3px 1px #000;}
.mmThumbTitle {position:relative; width:136px; height:auto; padding:3px; margin-top:6px; background:#444; opacity:0.9; border-radius:5px;}
.mmThumbTagline {display:none;}
.mmThumbDesc {display:none;}
.mmPlayIcon {position:absolute; background-image:url(../img/coolPlay.png); width:25px; height:25px; bottom:4px; left:4px;}

/*---------Scrollable Buttons START-----------*/
/* prev, next, prevPage and nextPage buttons */
a.browseThumbs {position:absolute; display:block; cursor:pointer; font-size:1px; width:24px; height:100%;}
/* right */
a.rightThumbs {background: url(../img/arrowRight.png) right no-repeat; right:13px;}
a.rightThumbs:active {background-position:left;}
/* left */
a.leftThumbs {background: url(../img/arrowLeft.png) right no-repeat; left:13px;}
a.leftThumbs:active {background-position: left;}
/* disabled navigational button */
a.browseThumbs.disabled {visibility:hidden !important;} 

/*------------------------------------------------------------------------------------*/
/*These classes are used for a user tutorial for the scrollable thumb container*/
.tutorialContainerDiv {position:relative; width:100%; height:26px; margin-top:14px;}
.tutorialDiv {position:relative; background-color:#444; width:250px; height:20px; padding:3px; margin:auto; text-align:center; opacity:0.6; filter:alpha(opacity=60); border-radius:10px;}
.loadingimg {width:48px; height:48px; position:absolute; top:50%; left:50%; margin:-24px 0px 0px -24px; z-index:100;}	
/*Dynamic Search Bar - change height and padding accordingly for proper dimensions (width is auto)*/
div.searchBar { 
	position:absolute;
	display: block; 
	height: 30px;
	top:0px;
	right:0px;
	border-radius: 0px 5px; 
	background:#06F url(../img/grad20h.png) repeat-x;
	border:1px solid #04D;
	z-index:101;
}
div.searchBar span {display: block; line-height: 20px; padding: 2px 0px 0px 3px; font-size:12px; float:left;}
div.searchBar input {width: 200px; border: 1px solid #00A; border-radius: 10px; padding-left:5px; background:#FFF url(../img/inputShade.png) repeat-x;}
div.searchBar .magnifyGlass {width:30px;height:30px;background:url(../img/search.png); float:left; padding:0px; cursor:pointer;}
div.searchBar .magnifyGlass.searchExit {width:24px;height:24px; background:url(../img/close.png); margin:3px;}
div.genOpacity {opacity:0.6; filter:alpha(opacity=60);}
div.genOpacity:hover {opacity:0.8; filter:alpha(opacity=80);}
/*end of Dynamic Search Bar*/
/*------------------------------------------------------------------------------------*/