/*
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; }
.hideElement { display: none; }
/***black SKIN***/
.logo_perspective.black .contentHolderUnit { position: absolute; overflow: hidden; cursor: pointer; border-style: solid; border-width: 5px !important; border-color: #fff !important; }
/*
.contentHolderUnit:hover{
-webkit-transform: scale(1.1, 1.1);
-moz-transform: scale(1.1, 1.1);
-ms-transform: scale(1.1, 1.1);
-o-transform: scale(1.1, 1.1);
transform: scale(1.1, 1.1) -webkit-transition : 0.6s;
transition: all 0.6s ease;
}*/
.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(leftNavOFF.png) 0 0 no-repeat; cursor: pointer; display: none !important; }
.logo_perspective.black .leftNav:hover { background: url(leftNavOFF.png) 0 0 no-repeat; }
.logo_perspective.black .rightNav { position: absolute; right: -2px; width: 40px;     /*32px*/ height: 34px;     /*32px*/ background: url(rightNavOFF.png) 0 0 no-repeat; cursor: pointer; display: none !important; }
.logo_perspective.black .rightNav:hover { background: url(rightNavOFF.png) 0 0 no-repeat; }
.logo_perspective.black .bottomNav { position: absolute; height: 35px; width: 0; padding-left: 9px; z-index: 140; display: none !important; }
.logo_perspective.black .bottomNavButtonOFF { float: left; display: block; width: 16px; height: 15px; background: url(img/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(img/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(img/bottomOverThumbBg.png) 23px bottom no-repeat; bottom: 27px; left: 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;     /* opacity: 1 !important; */ }
.logo_perspective.white .bannerControls { position: absolute; left: 0; top: 0; z-index: 101; width: 100%; }
.logo_perspective.white .leftNav {position: absolute;left: 12%;width: 48px;     /*32px*/height: 48px;     /*32px*/background: url(leftNavOFF.png) 0 0 no-repeat;cursor: pointer;}
.logo_perspective.white .leftNav:hover { background: url(leftNavOFF.png) 0 0 no-repeat; }
.logo_perspective.white .rightNav {position: absolute;right: 12%;width: 48px;     /*32px*/height: 48px;     /*32px*/background: url(rightNavOFF.png) 0 0 no-repeat;cursor: pointer;}
.logo_perspective.white .rightNav:hover { background: url(rightNavOFF.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; 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; 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; bottom: 27px; left: 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; }