@charset "utf-8";
/* http://www.menucool.com */

/*slider frame*/
#sliderFrame { position:relative; background-color:White; }
#slider { width:693px; height:448px;/* Make it the same size as your images */ background:transparent url(../../images/loading.gif) no-repeat 50% 50%; position:relative; margin:0 auto;/*this makes the image slider center-aligned. Remove this line if you want to align the whole slider to the left side*/ }
#slider img { position:absolute; border:none; visibility:hidden; }
/* the link style (if slide image is wrapped in a link) */
#slider a.imgLink { z-index:2; display:none; position:absolute; top:0px; left:0px; border:0; padding:0; margin:0; width:100%; height:100%; }
#slider a.video { background:transparent url(../../images/video.png) no-repeat 50% 50%; }
/* Caption styles */
div.mc-caption-bg, div.mc-caption-bg2 { position:absolute; width:190px; height:auto; padding:20px; right:30px; /* or left: ??px; */ bottom:30px;/* or top: ??px; */ z-index:3; overflow:hidden; font-size:0; }
div.mc-caption-bg { background-color:White; /*Caption background color. Can be set to "background:transparent;", or set to semi-transparent through the sliderOptions.captionOpacity setting in the javascript.*/ border-radius: 5px; }
div.mc-caption { font:bold 15px/20px Arial; color:#000000; z-index:4; padding:0px; text-align:center; }
div.mc-caption a { color:#66FFFF; }
/* ----------- thumbnails ----------- */
#thumbs { background:white url(../../images/thumbs-bar.gif) repeat-x 0 0; border:1px solid white; text-align:center; font-size:0px; line-height:45px;/*Setting the expected height to line-height fixes many IE8 erratic behaviours*/ }
#thumbs .thumb { width:60px; height:45px; cursor:pointer; text-align:center; border-left:1px solid #FFF; border-right:1px solid #DDD; display:inline-block;  *display:inline;
zoom:1; /*IE Hack*/ }
#thumbs .thumb-on { background-image: url(../../images/active-bg.png); }
#thumbs .thumb img { vertical-align:middle; }
/* ------ built-in navigation bullets wrapper ------*/
div.navBulletsWrapper { top:430px; left:240px;  width:270px; background:none; position:relative; z-index:5; cursor:pointer; }
/* each bullet */
div.navBulletsWrapper div { width:11px; height:11px; background:transparent url(../../images/bullet.png) no-repeat 0 0; float:left; overflow:hidden; vertical-align:middle; cursor:pointer; margin-right:10px;/* distance between each bullet*/ _position:relative;/*IE6 hack*/ }
div.navBulletsWrapper div.active { background-position:0 -11px; }
/*----------- navigation buttons on both sides of the slider -----------*/
.group1-Wrapper { position:absolute; z-index:20; top:135px; margin-left:50%;/* position it in the middle of #sliderFrame */ width:1px; }
a.group1-Prev, a.group1-Next { width:50px; height:150px; background:transparent url(../../images/navButtons2.png); display:block; cursor:pointer; position:absolute; top:0; user-select: none; }
a.group1-Prev { background-position:0 0; left: -330px; }
a.group1-Next { background-position:0 -150px; left:280px; }
a.group1-Prev:hover { background-position:50px 0; }
a.group1-Next:hover { background-position:50px -150px; }
/* ----------- navigation buttons in the thumbnails bar ---------- */
a.group2-Prev, a.group2-Next, a.group2-Play, a.group2-Pause { width:20px; height:20px; background:transparent url(../../images/navButtons.gif); display:inline-block;  *display:inline;
zoom:1;/*IE hack*/ margin-right:8px; vertical-align:middle; cursor:pointer; }
a.group2-Pause { background-position:0 0; }
a.group2-Play { background-position:0 -20px; }
a.group2-Next { background-position:0 -40px; }
a.group2-Prev { background-position:0 -60px; }
a.group2-Pause:hover { background-position:20px 0; }
a.group2-Play:hover { background-position:20px -20px; }
a.group2-Next:hover { background-position:20px -40px; }
a.group2-Prev:hover { background-position:20px -60px; }
/* --------- Others ------- */
#slider { transform: translate3d(0, 0, 0); -ms-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); -o-transform:translate3d(0, 0, 0); }
