/*
skins available:
	- black
	- white
*/

/* the container */
.logo_perspective {
	position:relative;
}
.logo_perspective img {
	max-width:none;
	max-height:none;
	/*-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;		*/
}
.lbg_perspective_grayscale {
 	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
	filter: gray; /* IE6-9 */
	-webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */	
	-o-filter: grayscale(100%);
}
.lbg_perspective_grayscale.disabled {
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
	-webkit-filter: grayscale(0%);
	-o-filter: grayscale(0%);
}
.logo_perspective_list {
	margin:0;
	padding:0;
	list-style:none;
	display:none;
}

.logo_perspective .contentHolder {
	position:relative;
	overflow:hidden;	
}
.mycanvas {
	position:absolute;
	top:8px;
	right:10px;
	z-index:1000;
}

.myloader {
	background:url(../skins/loader.gif);
	width:37px;
	height:37px;
	position:absolute;
	left:49%;
	top:49%;
	z-index:999;
}

.hideElement {
	display:none;
}

/***black SKIN***/
.logo_perspective.black .contentHolderUnit {
	position:absolute;
	overflow:hidden;
	cursor: pointer;
	border-style:solid;
}



.logo_perspective.black .bannerControls {
	position:absolute;
	left:0;
	top:0;
	z-index:101;
	width:100%;
}

.logo_perspective.black .leftNav {
	position:absolute;
	left:2px;
	width:40px; /*32px*/
	height:34px; /*32px*/
	background:url(../skins/black/leftNavOFF.png) 0 0 no-repeat;
	cursor: pointer;
}

.logo_perspective.black .leftNav:hover {
	background:url(../skins/black/leftNavON.png) 0 0 no-repeat;
}

.logo_perspective.black .rightNav {
	position:absolute;
	right:-2px;
	width:40px; /*32px*/
	height:34px; /*32px*/
	background:url(../skins/black/rightNavOFF.png) 0 0 no-repeat;
	cursor: pointer;
}

.logo_perspective.black .rightNav:hover {
	background:url(../skins/black/rightNavON.png) 0 0 no-repeat;
}

.logo_perspective.black .bottomNav {
	position:absolute;
	height:35px;
	width:0;
	padding-left:9px;
	z-index:140;
}

.logo_perspective.black .bottomNavButtonOFF {
	float:left;
	display:block;
	width:16px;
	height:15px;
	background:url(../skins/black/bottomNavOFF.png) 0 0 no-repeat;
	padding-left:9px;
	cursor: pointer;
}

.logo_perspective.black .bottomNavButtonON {
	float:left;
	display:block;
	width:16px;
	height:15px;
	padding-left:9px;
	background:url(../skins/black/bottomNavON.png) 0 0 no-repeat;
	cursor: pointer;
}

.logo_perspective.black .bottomNavLeft {
	display:none;
	position:absolute;
	z-index:140;
}
.logo_perspective.black .bottomNavRight {
	display:none;
	position:absolute;
	z-index:140;
}

.logo_perspective.black .bottomOverThumb {
	position:absolute;
	width:88px;
	height:106px;
	background:url(../skins/black/bottomOverThumbBg.png) 23px bottom no-repeat;
	bottom:27px;
	xleft:0px;
	margin-left:-25px;
}
.logo_perspective.black .bottomOverThumb img {
	border:4px solid #000000;
}






/***white SKIN***/
.logo_perspective.white .contentHolderUnit {
	position:absolute;
	overflow:hidden;
	cursor: pointer;
	border-style:solid;	
}



.logo_perspective.white .bannerControls {
	position:absolute;
	left:0;
	top:0;
	z-index:101;
	width:100%;
}

.logo_perspective.white .leftNav {
	position:absolute;
	left:-2px;
	width:40px; /*32px*/
	height:34px; /*32px*/
	background:url(../skins/white/leftNavOFF.png) 0 0 no-repeat;
	cursor: pointer;
}

.logo_perspective.white .leftNav:hover {
	background:url(../skins/white/leftNavON.png) 0 0 no-repeat;
}

.logo_perspective.white .rightNav {
	position:absolute;
	right:-2px;
	width:40px; /*32px*/
	height:34px; /*32px*/
	background:url(../skins/white/rightNavOFF.png) 0 0 no-repeat;
	cursor: pointer;
}

.logo_perspective.white .rightNav:hover {
	background:url(../skins/white/rightNavON.png) 0 0 no-repeat;
}

.logo_perspective.white .bottomNav {
	position:absolute;
	height:35px;
	width:0;
	padding-left:9px;
	z-index:140;
}

.logo_perspective.white .bottomNavButtonOFF {
	float:left;
	display:block;
	width:12px;
	height:12px;
	background:url(../skins/white/bottomNavOFF.png) 0 0 no-repeat;
	padding-left:9px;
	cursor: pointer;
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;			
}

.logo_perspective.white .bottomNavButtonON {
	float:left;
	display:block;
	width:12px;
	height:12px;
	padding-left:9px;
	background:url(../skins/white/bottomNavON.png) 0 0 no-repeat;
	cursor: pointer;
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;			
}

.logo_perspective.white .bottomNavLeft {
	display:none;
	position:absolute;
	z-index:140;
}
.logo_perspective.white .bottomNavRight {
	display:none;
	position:absolute;
	z-index:140;
}

.logo_perspective.white .bottomOverThumb {
	position:absolute;
	width:88px;
	height:106px;
	background:url(../skins/white/bottomOverThumbBg.png) 23px bottom no-repeat;
	bottom:27px;
	xleft:0px;
	margin-left:-25px;
}
.logo_perspective.white .bottomOverThumb img {
	border:4px solid #ffffff;
}


/* jQuery-UI TOOL TIP */

.ui-tooltip {	
	padding:8px;
	position:absolute;
	z-index:9999;
}

.ui-tooltip, .lbg_perspective_arrow:after {
	background: #333;
}
.ui-tooltip {
	background: #333;
	color: #FFFFFF;
	padding: 8px 8px;
	border-radius: 4px;
}
.lbg_perspective_arrow {
  width: 70px;
  height: 16px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  margin-left: -33px;
  bottom: -16px;
}
.lbg_perspective_arrow.top {
	top: -16px;
	bottom: auto;
}
.lbg_perspective_arrow.left {
	left: 20%;
}
.lbg_perspective_arrow:after {
  content: "";
  position: absolute;
  left: 20px;
  top: -20px;
  width: 25px;
  height: 25px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  tranform: rotate(45deg);
}
.lbg_perspective_arrow.top:after {
	bottom: -20px;
	top: auto;
}