﻿#scroll
{
    position: relative;
    overflow: hidden;
    width: 840px;
    height: 280px; /*-moz-border-radius:5px; 	-webkit-border-radius:5px;**/
}

#tools
{
    width: 9999em;
    position: absolute;
    height: 400px;
}

.tool
{
    float: left;
    width: 1000px;
    height: 340px; /*text-align:center;*/
}

/*
.details
{
    font-size: 18px;
    color: #555;
    margin-top: -20px;
    background-color: transparent;
    padding: 5px 148px;
}
*/


#thumbs
{
    /*background: url(http://static.flowplayer.org/tools/img/demo-navi.jpg) no-repeat;*/
    height: 80px; /*position:absolute; 	top:425px;*/
    width: 952px; /*left: -8px;*/
    background-image: url('../Images/toolbarbg.png');
    background-repeat: repeat-x;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: #DCDCDC;
}

/*.t
{
    padding: 0 !important;
    border: 0 !important;
}

.t a
{
    background: transparent url(http://static.flowplayer.org/tools/img/demo-navi.jpg) no-repeat scroll -21px -90px;
    margin-left: 11px;
    display: block;
    width: 99px;
    float: left;
    height: 90px;
    cursor: pointer;
}

.t a.active
{
    cursor: default !important;
}*/

.navi
{
    /*margin-left: 314px;
    _margin-left: 304px;
    padding-top: 20px;*/
    padding-left: 10px;
    /*margin-top: 100px;*/
    padding-top: 12px;
}

.navi a
{
    /*border: solid 2px #000;*/
    margin-left: 10px;
    cursor: pointer;
    padding-top: 200px;
}

.navi a.active
{
    padding-top: 61px;
    background-position: center top;
    /*border: solid 2px #F00;*/
    margin-left: 10px;
    background-image: url('../Images/toolbarv.png');
    background-repeat: no-repeat;
}

.navi img
{
    border: solid 1px #848484;
}

.navi a.active img
{
    border: solid 1px #0054A5;
}

/* tooltip styling. by default the element to be styled is .tooltip  
.tooltip {
	display:none;
	background: url('../Images/black_arrow.png');
	font-size:12px;
	height:70px;
	width:160px;
	padding:25px;
	color:#fff;	
}*/
.tooltip {
	background-color:#000;
	border:1px solid #fff;
	padding:10px 15px;
	width:200px;
	display:none;
	color:#fff;
	text-align:left;
	font-size:12px;

	/* outline radius for mozilla/firefox only */
	-moz-box-shadow:0 0 10px #000;
	-webkit-box-shadow:0 0 10px #000;
}

/* CSS sprite for the navigation 
#t0
{
    margin-left: 20px;
    _margin-left: 10px;
}
#t0.active
{
    background-position: -21px 0 !important;
}
#t0:hover
{
    background-position: -21px -180px;
}
#t0:active
{
    background-position: -21px -270px;
}

#t1
{
    background-position: -325px -90px;
}
#t1:hover
{
    background-position: -325px -180px;
}
#t1:active
{
    background-position: -325px -270px;
}
#t1.active
{
    background-position: -325px 0 !important;
}

#t2
{
    background-position: -435px -90px;
}
#t2:hover
{
    background-position: -435px -180px;
}
#t2:active
{
    background-position: -435px -270px;
}
#t2.active
{
    background-position: -435px 0 !important;
}

#t3
{
    background-position: -545px -90px;
}
#t3:hover
{
    background-position: -545px -180px;
}
#t3:active
{
    background-position: -545px -270px;
}
#t3.active
{
    background-position: -545px 0 !important;
}

#t4
{
    background-position: -655px -90px;
}
#t4:hover
{
    background-position: -655px -180px;
}
#t4:active
{
    background-position: -655px -270px;
}
#t4.active
{
    background-position: -655px 0 !important;
}

#t5
{
    background-position: -765px -90px;
}
#t5:hover
{
    background-position: -765px -180px;
}
#t5:active
{
    background-position: -765px -270px;
}
#t5.active
{
    background-position: -765px 0 !important;
}

#t6
{
    background-position: -875px -90px;
}
#t6:hover
{
    background-position: -875px -180px;
}
#t6:active
{
    background-position: -875px -270px;
}
#t6.active
{
    background-position: -875px 0 !important;
}
*/