/*Spider Slider button links*/
.link-string {
	display: block; 	
	border: none; 	
	margin: 0px auto; 	
	opacity: 0.6;
		filter: alpha( opacity = 70 ); 
	padding: 0px auto;  	
	position: relative; 
	text-align: center;	
	width: 10px; 	
	height: 15px; 	
	z-index:99999999; 	
}

.slider-off {
	background: none repeat scroll rgb(108, 108, 108);
	box-shadow: inset 1px 1px 1px rgba(50, 50, 50, .6);
	border: none;
	border-radius: 8px; 
	display: inline; 
	float: left;
	margin: 0 4px 0 0; 
	padding: 0px; 
	width: 17px; 
 	height: 17px; 
}

.slider-off:hover {
	box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 1);
}

.slider-on {
	background: none repeat scroll rgb(250, 250, 250);
	box-shadow: inset 1px 1px 1px rgba(60, 60, 60, .5);
	border: none;
	border-radius: 8px; 
 	float: left;
	margin: 0 4px 0 0; 
	padding: 0px; 
	width: 17px; 
 	height: 17px; 
}

.slider-on:hover {
	box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .8);
}


/*These are the WP admin page tools and should be left alone */
 .pointable {
 	cursor:	pointer; 
	width: 1px; 
	height: 10px; 
}

#r-marker,
#g-marker,
#b-marker {
	background: rgb(155,155,155); 
	border-left: .1em #ffffff solid; 
	border-radius: 0 0 1px 1px; 
	border-right: .1em #000000 solid; 
	opacity: 0.4; 
		filter: alpha(opacity=60); 
	position: absolute; 
	top: 160px; 
	width: 1px; 
	height: 10px; 
}

.directions {
	position: relative; 
		left: 0px; 
		top: 0px; 
	width: 100px; 
	height: 100px;  
}

.arrow-up {
	background: transparent url("sprite.png"); 
	background-position: -34px -7px; 
	background-repeat: no-repeat; 
	border: none; 
	display: inline; 
	padding: none; 
	position: absolute; 
		left: 38px; 
		top: 18px; 
	width: 24px; 
	height: 26px;  
}

.arrow-up.on, 
.arrow-up:hover {
 	background-position: -116px -7px; 
}

.arrow-right {
	background: transparent url("sprite.png"); 
	background-position: -59px -36px; 
	background-repeat: no-repeat; 
	border: none; 
	display: inline; 
	padding: none; 
	position: absolute; 
		top: 47px; 
		left: 63px; 
	width: 26px; 
	height: 24px; 
}

.arrow-right.on, 
.arrow-right:hover {
	background-position: -141px -36px; 
}

.arrow-down {
 	background: transparent url("sprite.png"); 
	background-position: -34px -62px; 
	background-repeat: no-repeat; 
 	border:none;
 	display:inline; 
 	padding:none; 
 	position: absolute; 
 		left: 38px; 
 		top: 72px; 
 	width:24px; 
 	height: 26px; 
 }

.arrow-down.on, 
.arrow-down:hover {
	background-position: -116px -62px; 
}

.arrow-left {
	background: transparent url("sprite.png"); 
	background-position: -4px -36px; 
	background-repeat: no-repeat; 
	border:none; 
	display:inline; 
	padding:none; 
	position: absolute; 
		left: 8px; 
		top: 47px; 
	width:26px; 
	height: 24px; 
}

.arrow-left.on, 
.arrow-left:hover {
	background-position: -86px -36px; 
}
 
.arrow-fade {
	background: transparent url("sprite.png"); 
	background-position: -30px -33px; 
	background-repeat: no-repeat; 
	border:none; 
	display:inline; 
	padding:none; 
	position: absolute; 
		left: 34px; 
		top: 44px; 
	width:31px; 
	height: 31px; 
 }

 .arrow-fade.on, 
 .arrow-fade:hover {
 	background-position: -112px -33px; 
 }

 .slider-title {
	color: #5E8A8C; 
	font-size: 10pt; 
	font-weight: 700; 
	height: 40px; 
}

.slider-title input[type=text] {
	color: #EE383F; 
	font-size: 14pt; 
	font-weight: 900; 
	margin: 4px 0 0 0; 
	position: absolute; 
		left: 16px; 
		top: -1px; 
	padding: 0 0 0 10px;
	text-align: left;	
	width: 260px; 
	height: 30px; 
}

.slider-title select {
	color:#cccccc; 
	font-size: 9pt; 
	font-weight: 500; 
	padding:7px 2px 2px 2px; 
	position:absolute; 
		left:286px; 
		top: 2px; 
	width: 160px; 
	height: 30px; 
}

.slider-title select:hover {
	color: #000000;
}

.slider-title input[type=submit] {
	color: #cccccc; 
	font-size: 9pt; 
	font-weight: 500; 
	padding: 2px; 
	position: absolute; 
		left: 560px; 
		top: 2px; 
	width: 60px; 
	height: 30px; 
}
.slider-title input[type=submit]:hover {
	color:#EE383F; 
}

.boundary {
	padding: 0px auto; 
	position: relative; 
		top: 0px; 
	width: 100px; 
	z-index: 1; 
}

.boundary span {
	font-size: 6pt; 
	font-weight: 200; 
	position: absolute; 
		top: 42px; 
}

#speeds {
	background:rgba(140, 0, 0, .20); 
	height: 10px; 
	padding: 0px; 
	position:absolute; 
		left: 0px; 
		top: 64px; 
	z-index: 999999; 
}

#speed-dial{ 
	background: #000000; 
	border-radius: 3px; 
	border:.1em #cc0009 solid; 
	position: absolute; 
		left: 46px; 
		top: -8px; 
	width: 8px; 
	height: 24px; 
}

#speed-dial:hover{
 	cursor:crosshair;
}
 
.reset-opts { 
 	z-index: 99999999; 
}

#cl-options {
	padding: 5px; 
	position: absolute;  
		left: 400px; 
		top: 30px; 
	width: 400px; 
	height: 110px; 
	z-index: 9999999; 
}	

#color-bar {
	background:rgb(140,140,140); 
	border-radius: 6px; 
	border: .1em #000000 solid; 
	position:absolute; 
		top: 16px; 
		left: 0px; 
}

.colrgb {
	color: #5E8A8C; 
	font-size: 10pt; 
	font-weight: 700; 
	position: absolute; 
		left: 0px; 
		top: 76px; 
	width: 240px; 
	height: 30px; 
}

.colrgb input {
	border: .1em #cccccc solid; 
	width: 30px; 
	height: 20px; 
}

.colhex {
	color: #5E8A8C; 
	font-size: 10pt; 
	font-weight: 700; 
	position: absolute; 
		left: 220px; 
		top: 76px; 
	width: 160px; 
	height: 30px; 
}

#hex-code {
	border: .1em #cccccc solid; 
	width: 110px; 
	height: 30px; 
}

.image-bay-wrap {
	margin: 0px ; 
	padding: 0px; 
	float: left;
	width: 100px;
	height: 940px; 	
}

#click-down{ 
	background-image: url("sprite.png"); 
	background-position: -7px -158px; 
	background-repeat: no-repeat; 
	color: #ffffff;
	font-size: 9pt;
	font-weight: 900;
	padding: 6px 0 0 14px;
	position: absolute; 
		left: 31px; 
		top: 18px; 
	text-align: left;	
	width: 90px; 
	height: 36px; 
}

#image-bay{
	background-image: url("bay.png");
		border-radius: 0 30px 30px 0;   
	box-shadow: 2px 2px 2px rgba(20, 20, 20, .6);	
	margin: 0px; 
	padding: 40px 0px 20px 0;
	float: left;
	position: relative;
		left: 10px;
		top: 30px; 
		
	text-align: right; 
	width: 0px;
	height: 870px; 
	z-index: -1;
 
}

#image-bay img {
	border: .1em #5E8A8C solid; 
	border-radius:12px; 
	margin: 0px 12px 0 0; 
	opacity: 0.6; 
		filter: alpha(opacity=60); 
	position: relative; 
		left: 8px; 
		top: 0px; 
}

#image-bay img:hover{ 
	opacity: 1.0; 
		filter: alpha(opacity=100); 
}

#search-bay{
	background-image: url("edge.png"); 
	border-radius: 0 24px 24px 0; 
	border: 0em transparent solid; 
	box-shadow: 2px 2px 3px rgba(50, 50, 50, .6);
	color: #000000; 
	color: #ebebeb; 
	float: left; 
	padding: 2px 2px 50px 4px; 
	position: relative; 
		top: 0px; 
	width: 120px; 
	z-index: 222; 
}

.search-wrap{
	font-size: 8pt; 
	font-weight: 400; 
	line-height: 14px;
	margin: 4px auto; 
	padding: 0 0 0 4px; 
	position: relative;
		top: 24px;
	width: 104px; 
	height: 90px; 
}
#limits-wrap{
	height: 80px;
	position: absolute;
		top: 56px;
	width: 100px;	
}

#limits-wrap span{
	font-size: 8pt;
	position: absolute;
		top: 10px;
		left: 10px;
	width: 100px;	
}

#int-limit{
	position: absolute;
		top: 24px;
		left: 55px;
	width: 42px;	
}

#int-start{
	position: absolute;
		top: 24px;
		left: 10px;
	width: 42px;	
}
#get-results{
	color: #ffffff;
	background: transparent url( "wash.png" ); 
	font-size: 10pt; 
	font-weight: 800; 
	line-height: 14px;
	margin: 0 1px 0 0;
	opacity: 0.6;
		filter: alpha( opacity = 70 ); 
	padding: 1px; 
	position: absolute;
		top: 50px;
		left: 10px;
	width: 88px;	
}
#results-wrap{
	font-size: 8pt; 
	font-weight: 400; 
	line-height: 14px;
	margin: 4px 0 4px 10px; 
	padding: 0 0 0 0px; 
	position: relative;
		top: 40px;
	width: 84px; 
}
#results-wrap input{
	background: transparent url( "wash.png" ); 
	color: #ffffff;
	display: block;
	font-size: 10pt; 
	font-weight: 200; 
	line-height: 14px;
	margin: 0 1px 0 0;
	opacity: 0.6;
		filter: alpha( opacity = 70 ); 
	padding: 1px; 
}
#results-wrap input:hover{
	background: transparent url( "bay.png" ); 
	color: #ffffff;
}
.results-wrap-clicked{
	background: #000000; 
	border: none;
	color: #ffffff;
}

#results-wrap .pg-decrementer{
	float: left;
	margin: 0 0 10px 0;
}
#results-wrap .pg-incrementer{
	float: right;
	margin: 0 0 10px 0;
}

.search-input{ 
	background: transparent url( "sprite.png" );  
	background-position: -110px -133px; 
	color: #0000cc; 
	position: absolute; 
		left: 4px; 
		top: 10px; 
	width: 90px; 
}

#start-here { 
	background: transparent url( "sprite.png" );  
	background-position: -7px -108px; 
	color: #ffffff;
	font-size: 9pt;
	font-weight: 900;
	padding: 6px 0 0 34px;
 	position: absolute; 
	 	left: -9px; 
 		top: 6px; 
 	width: 96px; 
 	height:  36px; 
}

.slider-bay-wrap {
	height: 940px; 
	margin: 0 2px 0 0; 
	padding: 4px 4px 4px 12px; 
	position: relative;
	z-index:111; 
	border: .1em dotted #cccccc;
}

.slider-controls {
	color: #000000; 
	font-size: 14pt; 
	position: absolute; 
		left: 240px; 
		top: 0px; 
	text-align: center; 
 	width: 800px; 
	height: 140px; 
}

.slider-controls input {
	font-size: 14pt; 
	text-align: center; 
	width: 60px; 
	height: 30px; 
} 

#slide-dimens {
	border: none; 
	color: #5E8A8C; 
	font-size: 9pt; 
	font-weight: 700; 
	position: absolute; 
		left: 6px; 
		top: 36px; 
	width: 80px; 
}

#slide-shape {
	border: none; 
	color: #5E8A8C; 
	font-size: 9pt; 
	font-weight: 700; 
	position: absolute; 
		left: 80px; 
		top: 36px; 
	width: 80px; 
}

#slider-trans { 
	color: #5E8A8C; 
	font-size: 10pt; 
	font-size: 9pt; 
	font-weight: 700; 
	margin: 0px auto; 
	position: absolute; 
		left: 170px; 
		top: 36px; 
	width: 100px; 
}

#slider-speed { 
	color: #5E8A8C; 
	font-size: 9pt; 
	font-weight: 700; 
	margin: 0px auto; 
	position: absolute; 
		left: 280px; 
		top: 36px; 
	width: 100px; 
}

#image-list {
	color: #000000;
	font-size: 9pt; 
	font-weight: 700;  
	padding:0 0 20px 0; 
	 position: relative;
		left: 235px;  
 		top: 150px; 
 	width: 140px;
	height:	0px;
}

.img-list {
	position: absolute; 
		left: 0px;
		top: 0px;
	text-align: right; 
	width: 130px; 
	height: 96px; 
}

.img-list input[type=text] { 
	box-shadow: inset 1px 1px 3px rgba(50, 50, 50, .6);
	font-size: 9pt; 
	margin: 0 0 20px 0; 
	opacity: 0.4; 
		filter: alpha( opacity=40 ); 
	padding: 0px; 
	position: absolute; 
		right: 4px; 
		top: 66px; 
	width: 110px; 
	height: 20px; 
}

.img-list img {
	border: .1em #000000 solid; 
	box-shadow: 3px 3px 5px rgba(50, 50, 50, .6);
	margin: 2px; 
	padding: 0px; 
	position: absolute; 
		left: 66px; 
		top: -2px; 
	width: 60px; 
	height: 60px; 
}

.img-list img:hover { 
	border: .1em #ffffff solid; 
}

.img-list span{
	font-size: 8pt; 
	font-weight: 300;
	position: absolute; 
		left: 16px; 
		top: 50px;
}

.img-list li {
	color: #ffffff; 
	display: inline; 
	font-size: 10pt; 
	position: absolute; 
		left: 0px; 
		top: 0px; 
}

#x-ruler {
	background-image: url(x_ruler.png); 
	height: 9px; 
	position: absolute; 
		left: 390px; 
		top: 151px; 
}

#y-ruler {
	background-image: url(y_ruler.png); 
	position: absolute; 
		left: 381px; 
		top: 160px; 
	width: 9px; 
}

#admin-slide-display {
	position: absolute; 
		left: 390px; 
		top: 160px; 
}

#grid-space {
	background: url("grid.png"); 
	opacity: 0.2; 
		filter: alpha(opacity=20); 
	position: absolute; 
		left: 0px; 
		top: 0px; 
	width:120%; 
	height: 120%; 
	z-index:-9999; 
}

input.embedder {
	color: #cccccc; 
	font-size: 9pt; 
	font-weight: 500; 
	padding: 2px; 
	position: absolute; 
		left: 460px; 
		top: 2px; 
	width: 80px; 
	height: 30px; 
}

.spider-admin-menu{
	position: absolute; 
		right: 10px; 
		top: -20px; 
	width: 180px;
}
.spider-admin-menu span{
	font-size: 10pt; 
	font-weight: 800;
	float: right;
	margin: 0 8px 0 0;
}
.spider-admin-menu span:hover{
	color: #EE383F;;
}

#helper, 
#licensor, 
#about-spiderslider{
	background: #ebebeb;
	border: .1em #ebebeb solid;
	border-radius: 10px 0 0 10px;
 	display: none;	
	padding: 10px 10px 10px 30px;
	position: absolute;
		right: 0px;
		top: 0px;
	width: 400px;
	z-index: 99999999;
}
#helper span,  
#licensor span,  
#about-spiderslider span{
	color: #EE383F; 
	font-weight: 900; 
}
.righter{
	color: #cccccc;
	font-weight: 200;
	position:relative;
		left:360px;
	
}