
.simply-scroll-container { /* Container DIV - automatically generated */
	position: relative;
}

	.simply-scroll-clip { /* Clip DIV - automatically generated */
		position: relative;
		overflow: hidden;
	}

	.simply-scroll-list { /* UL/OL/DIV - the element that simplyScroll is inited on */
		overflow: hidden;
		margin: 0;
		padding: 0;
		list-style: none;
	}
	
		.simply-scroll-list li {
			padding: 0;
			margin: 0;
			list-style: none;
		}
	
		.simply-scroll-list li img {
			border: none;
			display: block;
		}
	
	.simply-scroll-btn {
		position: absolute;
		background-image: url(buttons.png);
		width: 42px;
		height: 44px;
		z-index:3;
		cursor: pointer;
	}
	
	.simply-scroll-btn-left {
		left: 6px;
		bottom: 6px;
		background-position: 0 -44px;
	}
	.simply-scroll-btn-left.disabled {
		background-position: 0 0 !important;
	}
	.simply-scroll-btn-left:hover, .simply-scroll-btn-left:focus {
		background-position: 0 -88px;
	}
	
	.simply-scroll-btn-right {
		right: 6px;
		bottom: 6px;
		background-position: -84px -44px;
	}
	.simply-scroll-btn-right.disabled {
		background-position: -84px 0 !important;
	}
	.simply-scroll-btn-right:hover, .simply-scroll-btn-right:focus {
		background-position: -84px -88px;
	}
	
	.simply-scroll-btn-up {
		right: 6px;
		top: 6px;
		background-position: -126px -44px;
	}
	.simply-scroll-btn-up.disabled {
		background-position: -126px 0 !important;
	}
	.simply-scroll-btn-up:hover, .simply-scroll-btn-up:focus {
		background-position: -126px -88px;
	}
	
	.simply-scroll-btn-down {
		right: 6px;
		bottom: 6px;
		background-position: -42px -44px;
	}
	.simply-scroll-btn-down.disabled {
		background-position: -42px 0 !important;
	}
	.simply-scroll-btn-down:hover, .simply-scroll-btn-down:focus {
		background-position: -42px -88px;
	}
	
	.simply-scroll-btn-pause {
		right: 6px;
		bottom: 6px;
		background-position: -168px -44px;
	}
	.simply-scroll-btn-pause:hover, .simply-scroll-btn-pause:focus {
		background-position: -168px -88px;
	}
	
	.simply-scroll-btn-pause.active {
		background-position: -84px -44px;
	}
	.simply-scroll-btn-pause.active:hover, .simply-scroll-btn-pause.active:focus {
		background-position: -84px -88px;
	}

/* Custom class modifications - override classees

.simply-scroll is default

*/

.simply-scroll { /* Customisable base class for style override DIV */
	width: 576px;
	height: 200px;
	margin-bottom: 1em;
}

	.simply-scroll .simply-scroll-clip {
		width: 576px;
		height: 200px;
	}
	
		.simply-scroll .simply-scroll-list {}
		
		.simply-scroll .simply-scroll-list li {
			float: left;
			width: 290px;
			height: 200px;
		}
		.simply-scroll .simply-scroll-list li img {}
	
	.simply-scroll .simply-scroll-btn {}
	
	.simply-scroll .simply-scroll-btn-left {}
	.simply-scroll .simply-scroll-btn-left.disabled {}
	.simply-scroll .simply-scroll-btn-left:hover {}
	
	.simply-scroll .simply-scroll-btn-right {}
	.simply-scroll .simply-scroll-btn-right.disabled {}
	.simply-scroll .simply-scroll-btn-right:hover {}
	
	.simply-scroll .simply-scroll-btn-up {}
	.simply-scroll .simply-scroll-btn-up.disabled {}
	.simply-scroll .simply-scroll-btn-up:hover {}
	
	.simply-scroll .simply-scroll-btn-down {}
	.simply-scroll .simply-scroll-btn-down.disabled {}
	.simply-scroll .simply-scroll-btn-down:hover {}
	


/* Vertical scroller example */

.vert { /* wider than clip to position buttons to side */
	width: 250px;
	height: 678px;
	margin-bottom: 1.5em;
	padding-top:1.5em;
}

	.vert .simply-scroll-clip {
		width: 250px;
		height: 645px;
	}
	
		.vert .simply-scroll-list {}
		
		.vert .simply-scroll-list li {
			width: 200px;
			height: 67px;
		}
		.vert .simply-scroll-list li img {}
	
	.vert .simply-scroll-btn {}

	.vert .simply-scroll-btn-up { /* modified btn pos */
		right: 0;
		top: 0;
	}
	.vert .simply-scroll-btn-up.disabled {}
	.vert .simply-scroll-btn-up:hover {}
	
	.vert .simply-scroll-btn-down { /* modified btn pos */
		right: 0;
		top: 52px;
	}
	.vert .simply-scroll-btn-down.disabled {}
	.vert .simply-scroll-btn-down:hover {}
	
	/* NOTE left-right classes wouldn't be needed on vertical scroller */


:focus { outline: 0;} :focus { outline: none; } *::-moz-focus-inner { border: none;}

/* style.css */
div.wrap {
    width:660px;
}

.wrap .pane .pane2 {
    display:none;
    padding:20px;
    border:1px solid #999;
    border-top:0;
    font-size:14px;  
    font-size:18px;
    color:#456;
    _background-image:none;
}

.wrap .pane .pane2 p {
    font-size:12px;
    text-align:center;
    color:#000;
	line-height:17px;
}

/* root element for tabs  */
ul.tabs{border:none !important;width:70%;margin:0 0 10px;}
ul.tabs, ul.tabs2 { 
    list-style:none; 
    padding:0;
    height:30px;
    border-bottom:1px solid #666;
}
 ul.tabs2{ height:21px;}
/* single tab */
ul.tabs li, ul.tabs2 li { 
    float:left;      
    text-indent:0;
    padding:0;
    margin:0 !important;
    list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
ul.tabs a, ul.tabs2 a { 
    background:#1A4F01;
	border:1px solid #dfdfdf;
    font-size:11px;
    display:block;
    height: 30px;  
    line-height:30px;
    width: 111px;
    text-align:center;
    text-decoration:none;
    color:#fff;
	font-size:14px;
    padding:0px;
	padding-left:0;
    margin:0px;
    
}
ul.tabs2 a{ background:#f1f1f1; color:#333; line-height:20px; height:auto; font-size:12px;}
ul.tabs a:active, ul.tabs2 a:active {
    outline:none;
}

/* when mouse enters the tab move the background image */
ul.tabs a:hover, ul.tabs2 a:hover {
    background:#AFC176;
    color:#fff;
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a, ul.tabs2 a.current, ul.tabs2 a.current:hover, ul.tabs2 li.current a {
    background:#AFC176;
    cursor:pointer !important; 
    color:#fff !important;
}
 ul.tabs2 a.current{ background:#333;}
ul.tabs2 li:hover a{ background:#333;}
/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */
/* width 1 */
ul.tabs a.w1,ul.tabs2 a.w1            { background-position: -519px 0; width:134px; }
ul.tabs a.w1:hover,ul.tabs2 a.w1:hover      { background-position: -519px -31px; }
ul.tabs a.w1.current,ul.tabs2 a.w1.current { background-position: -519px -62px; }

/* width 2 */
ul.tabs a.w2,ul.tabs2 a.w2            { background-position: -366px -0px; width:154px; }
ul.tabs a.w2:hover,ul.tabs2 a.w2:hover      { background-position: -366px -31px; }
ul.tabs a.w2.current,ul.tabs2 a.w2.current { background-position: -366px -62px; }


/* width 3 */
ul.tabs a.w3,ul.tabs2 a.w3            { background-position: -193px -0px; width:174px; }
ul.tabs a.w3:hover,ul.tabs2 a.w3:hover      { background-position: -193px -31px; }
ul.tabs a.w3.current,ul.tabs2 a.w3.current { background-position: -193px -62px; }

/* width 4 */
ul.tabs a.w4,ul.tabs2 a.w4            { background-position: -0px -0px; width:194px; }
ul.tabs a.w4:hover,ul.tabs2 a.w4:hover      { background-position: -0px -31px; }
ul.tabs a.w4.current,ul.tabs2 a.w4.current { background-position: -0px -62px; }