::selection {
    color: #FFF;
}
::-moz-selection {
    color:#FFF;
}
* {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: moz-none;
    -ms-user-select: none;
    user-select: none;
    outline: none;
}

html, body {
    min-height:100%;
    height:100%;
}

body { 
    margin:0; padding:0; 
}

.screen {
    overflow:hidden;
    position:absolute;
    left:50%;
    top:50%;
 
    
    background-color:#000;
    box-shadow: 0px 0px 0px 8px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
    border:1px solid #000;
    
    width:960px;
    height:540px;
  
    margin-left: -480px;
    margin-top: -270px;
} 

.slider-ex-in-panel {
    height:540px !important;
}
.screen {
/*
    left:0% !important;
    top:0% !important;
    margin-left:0 !important;
    margin-top:0 !important;
*/
}
.screen img.reel {
    width:100%;
    height:100%;
}


.container .freez {
    width:100%;
    height:100%;
    position:absolute;
    z-index:99999;
    cursor:wait; 
    /*  background-color:#000;
    opacity:0.5;*/

}



#image-reel, .reel-panning, .reel-panning * {
    cursor: default !important;
}
.reel-preloader {
    display: none; 
}

div[id^="hotspot_"] {
/*
    background-image: url("../img/hotspot_animate_ex.png");
    background-position: center 0;
    cursor: pointer;
    height: 36px;
    width: 36px;
    visibility:hidden;
    z-index:9;
*/
}

div[id^="hotspot_"] a {
    display: block;
    width:100%;
    height:100%;
}

.navigation {
    position:absolute;
    bottom:0;
    left:50%;
    margin-left:-64px;
    background-image:url('../img/navbar.png');
    background-position: center top;
    width:128px;
    height:29px;
    padding-top:18px;
    z-index:999;
}
.navigation .btn-control {
    text-indent: -9999px;
    width:32px;
    height:29px;
    opacity:0.6;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.navigation #btn-next {
    background-image:url('../img/btn-left.png');
    float:left;
}

.navigation #btn-back {
    background-image:url('../img/btn-right.png');
    float:left;
}

.navigation #btn-zoomin {
    background-image:url('../img/btn-zoom-in.png');
    float:right;
}

.navigation #btn-zoomout {
    background-image:url('../img/btn-zoom-out.png');
    float:right;
}


.navigation #btn-next:hover,
.navigation #btn-back:hover,
.navigation #btn-zoomin:hover,
.navigation #btn-zoomout:hover {
    opacity:1;
}




/*
.grabbable {
    cursor: move;  fallback if grab cursor is unsupported 
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

  (Optional) Apply a "closed-hand" cursor during drag operation. 
.grabbable:active { 
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}*/


body {
    overflow:hidden;
}
.screen-zoom, .screen-reel {
    position:absolute;

    width:100%;
    height:100%;
}
.screen-zoom img.zoom {
    width:100%;
    height:100%;
    position: absolute;
      background-size: cover;
}  
 






.box-wait-load {
    width: 100%;
    height: 100%;
    background-color: #FFF;
    z-index: 999999;
    position: absolute;
    cursor: wait;
    -moz-opacity: 0.00;
    -khtml-opacity: 0.00;
    opacity: 0.00;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity=0);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
    filter: alpha(opacity=0);
}
.progress {
    position: absolute;
    z-index: 9999999;
    top: 50%;
    left: 50%;
}
.progress .state {
    width: 0%;
    height: 100%;
    background-color: #000;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}
.progress .state span {
    font-family: verdana;
    font-size: 10px;
    line-height: 15px;
    text-align: center;
    width: 100%;
    float: left;
    color: #FFF;
} 







/*@font-face {
    font-family: 'AlteHaasGrotesk';
    src: url('font/AlteHaasGrotesk.eot');   
    src: url('font/AlteHaasGrotesk.eot?#iefix') format('embedded-opentype'), 
        url('font/AlteHaasGrotesk.woff') format('woff'),  
        url('font/AlteHaasGrotesk.ttf') format('truetype'),   
        url('font/AlteHaasGrotesk.svg#svgFontName') format('svg');   
    font-weight: normal;
    font-style: normal;
} 
*/
::selection
{
	color:#FFF;
}
::-moz-selection
{
   color:#FFF;
} 

* {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: moz-none;
    -ms-user-select: none;
    user-select: none;
}

body {
    font-family: AlteHaasGrotesk;
    padding: 0;
    margin: 0;
	position:relative;
/*
	width:960px;
	height:540px;
*/
}
 
.reel-preloader {
    display: none; 
}
#screen {
	background-color:#000;   
	/*position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -270px;
    margin-left: -480px;
    background-color: #000;
    box-shadow: 0px 0px 0px 8px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.5);
    border: 2px solid #000;*/
}
#loading {
    position: absolute;
    z-index: 9999999999;
    width: 100%;
    height: 100%;   
	/*background-color:rgba(0, 0, 0, 0); */
 
	background-color:#000;
    -moz-opacity: 0.0;
    -khtml-opacity: 0.0;
    opacity: 0.0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=0);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
    filter:alpha(opacity=0);  
	
}
#frame-interior {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
#container {
    position: relative;
    width: 960px;
    height: 540px;
    overflow: hidden;
/*    margin-left: auto;
    margin-right: auto;*/
}
div[id^="monitor"] {
}
div[id^="monitor"] img {
    display: block;
}
#monitor {
    width: 100%;
    height: 100%;
}
#monitor-two {
    width: 100%;
    height: 100%;
    top: 540px;
    left: 0;
}
#monitor-three {
    width: 100%;
    height: 100%;
    top: 1080px;
    left: 0;
}
#monitor-four {
    width: 100%;
    height: 100%;
    top: 1620px;
    left: 0;
}
#monitor #car-reel {
    width: 960px;
    height: 540px;
}
/* HOT SPOT */
div[id^="hotspot_"] {
    /*    background-color:#FFF;
    border:1px solid #000;*/
    background-image: url("images/hotspot.png");
    background-position: center center;
    cursor: pointer;
    height: 26px;
    width: 26px;
    visibility: hidden;

}
div[id^="hotspot_"] a {
    /*   background-color: #303030;
        border: 1px solid #000;*/
    display: block;
    height: 24px;
    opacity: 0.5;
    position: absolute;
    width: 25px;
}
/* BUTTON CONTROL */
.img-ctrl {
    position: absolute;
    /* cursor:pointer;*/
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    z-index: 99999;
}
div[id^="ctrl-"] {
    cursor: pointer;
}
#ctrl-next button, #ctrl-back button {
    display: none;
}
#ctrl-next {
    background-image: url('images/next.png');
    top: 270px;
    right: 100px;
    width: 32px;
    height: 58px;
    background-position: 0px 0px;
}
#ctrl-next:hover {
    background-position: 32px 0px;
}
#ctrl-back {
    background-image: url('images/back.png');
    top: 270px;
    left: 100px;
    width: 32px;
    height: 58px;
    background-position: 0px 0px;
}
#ctrl-back:hover {
    background-position: 32px 0px;
}
#ctrl-switch-exin {
    width: 265px;
    height: 60px;
    top: 50px;
    right: -1px;
}
.switch-close {
    /*background-image:url('images/btn_ex_in_close.png');*/
}
.switch-open {
    /*background-image:url('images/btn_ex_in_open.png');*/
}
div[id^="ctrl-cab-"] {
    width: 165px;
    height: 76px;
    cursor: pointer;
}
#ctrl-cab-extended {
    top: 135px;
    background-image: url('images/cab_extended.png');
}
#ctrl-cab-single {
    top: 220px;
    background-image: url('images/cab_regular.png');
}
#ctrl-cab-crew {
    top: 50px;
    background-image: url('images/cab_crew.png');
}
.active-cap {
    /*left:0 !important;*/
	
	/*
    -moz-opacity: 1 !important;
    -khtml-opacity: 1 !important;
    opacity: 1 !important;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity=100) !important;
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100) !important;
    filter: alpha(opacity=100) !important; */
}
.show-cap {
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    left: 0;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);
}
.hide-cap {
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    left: -120px;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);


}
/* TEXT IMAGE*/
div[id^="text-"] {
    background-repeat: no-repeat;
    text-indent: -9999px;
}
#text-logo {
    background-image: url("images/text-logo.png");
    bottom: 51px;
    height: 58px;
    left: 30px;
    width: 215px;
}
#text-loading {
    /*    background-image: url("images/loading.gif");
            top: 50%;
            left: 50%;
            margin-top: -35px;
            margin-left: -90px;
            height: 70px;
            width: 179px;
            display:none;
            -moz-opacity: 0.6;
            -khtml-opacity: 0.6;
            opacity: 0.6;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity=60);
            filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
            filter: alpha(opacity=60);*/
}
#text-detail {
    bottom: 30px;
    height: 13px;
    left: 30px;
    width: 330px;
}
/* CREW */
.text-detail-crew-sd {
    background-image: url('images/textdetail.png');
    background-position: 0 -28px;
}
.text-detail-crew-ls {
    background-image: url('images/textdetail.png');
    background-position: 0 -42px;
}
/* EXTEND */
.text-detail-extend {
    background-image: url('images/textdetail.png'); 
    background-position: 0 -14px;
}
/* REGULAR */
.text-detail-regular {
    background-image: url('images/textdetail.png');
    background-position: 0 0;
}

#text-menu {
    background-image: url("images/menu.png");
    height: 16px;
    right: 18px;
    top: 132px;
    width: 41px;
}
#text-color {
    background-image: url("images/color.png");
    height: 16px;
    right: 203px;
    top: 129px;
    width: 44px;
}
/*--START OF: HOTSPOT --*/
#text-hotspot {
    bottom: 54px;
    height: 25px;
    right: -15px;
    width: 125px;
}
#btn-hotspot-on {
    height: 23px;
    margin-left: 34px;
    width: 25px;
}
#btn-hotspot-off {
    height: 23px;
    margin-left: 8px;
    width: 30px;
}
div[id^="btn-hotspot-"] {
    float: left;
    cursor: pointer;
}
.img-button-hotspot-on {
    background-image: url('images/hotspot_menu_on.png');
}
.img-button-hotspot-off {
    background-image: url('images/hotspot_menu_off.png');
}
/* START OF: GRADE */
#text-grade {
    height: 16px;
    right: 88px;
    top: 149px;
    width: 160px;
}
#btn-grade-starndard {
    height: 18px;
    margin-left: 50px;
    margin-top: -3px;
    width: 70px;
}
#btn-grade-ls {
    height: 18px;
    margin-left: 8px;
    margin-top: -3px;
    width: 24px;
}
div[id^="btn-grade-"] {
    float: left;
    cursor: pointer;
}
.img-button-grade-standard {
    background-image: url('images/grade_standard.png');
}
.img-button-grade-ls {
    background-image: url('images/grade_ls.png');
}
.img-button-grade-ls-only {
    background-image: url('images/grade_ls_only.png') !important;
}
/* END OF: GRADE */

/* MENU COLOR */
#ctrl-color {
    right: 29px;
    top: 124px;
 
}
#ctrl-color ul {
    margin: 0;
    padding: 0;
}
#ctrl-color ul li {
    float: left;
    width: 19px;
    height: 20px;
    list-style: none;
	
	/* DEBUG FOR IE7 COMPAT VIEW 
	border:1px solid #000;*/
	
}
#ctrl-color ul li a.active-color, #ctrl-color ul li a:hover {
    padding-top: 0 !important;
    width: 20px !important;
    height: 20px !important;
    background-size: 20px 20px !important;
}
#ctrl-color ul li a:link, #ctrl-color ul li a:visited {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 14px 14px;
    display: table-cell;
    height: 21px;
    padding-left: 10px;
    padding-top: 6px;
    text-align: center;
    text-indent: -9999px;
    vertical-align: middle;
    width: 14px;
	
	/* DEBUG FOR IE7 COMPAT VIEW 
	border:1px solid #FF0;
	display:block;*/
}
.cosmic-black {
    background-image: url("images/color/cosmic_black.png");
}
.mineral-grey {
    background-image: url("images/color/mineral_grey.png");
}
.ash-beige {
    background-image: url("images/color/ash_beige.png");
}
.titanium-silver {
    background-image: url("images/color/titanium_silver.png");
}
.splash-white {
    background-image: url("images/color/splash_white.png");
}
.nautilus-blue {
    background-image: url("images/color/nautilus_blue.png");
}
.tundra-green {
    background-image: url("images/color/tundra_green.png");
}
.vanatian-red {
    background-image: url("images/color/vanatian_red.png");
}
.obsidian-gray {
      background-image: url("images/color/obsidian_gray.png");
}
.fjord-blue {
    background-image: url("images/color/fjord_blue.png");
}
#car-reel-reel, .reel-panning, .reel-panning * {
    cursor: default !important;
}
.bg-warehouse {
    background-image: url("images/wallpaper_black.png");
}
.bg-concrete {
    background-image: url("images/wallpaper_white.png");
}
#wallpaper {
    height: 90px;
    right: 15px;
    width: 185px;
    cursor: default;
    bottom: 0 ;
}
.show-wallpaper {
    bottom: 0 ;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}
.hide-wallpaper {
    bottom: -33px !important;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}
#wallpaper #btn-wallpaper {
    cursor: pointer;
    display: block;
    height: 90px;
    margin-top: 22px;
    width: 100%;
}
#pano {
    width: 960px;
    height: 540px;/*    left:960px;
     -webkit-box-shadow:  -2px 0px 2px 0.5px rgba(0, 0, 0, 0.65);
        
        box-shadow:  -2px 0px 2px 0.5px rgba(0, 0, 0, 0.65);*/

}
#frame {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}

.text-grade-top {
    top:102px !important
}
.text-color-top {
    top: 82px !important;
}
.nav-color-top {
    top: 78px !important;
}
p#frame-no {
    color: #FFF;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 10px;
    top: 10px;
    text-align: right;
    z-index: 999999;
}
.preload-background-image-css {
    display: none;
}


.screen-float-left {
    position:absolute;
}


.screen-interior {
    left:960px;
    top:0;
    position: absolute;
}

.screen-exterior {
    position: absolute;
}



.jquery-ui-like {
    /* box-shadow: 0px 0px 0px 2px rgba(0,0,0, 0.8); */  
}
#btn-switch {

    height: 35px;
    left: 2px;
    position: absolute;
    top: 10px;
    width: 38px;  
background-color:#FFF;
-moz-opacity: 0.00;
-khtml-opacity: 0.00;
opacity: 0.00;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=0);
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
filter:alpha(opacity=0);
}
#btn-ex {
 
background-color:#FFF;
-moz-opacity: 0.00;
-khtml-opacity: 0.00;
opacity: 0.00;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=0);
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
filter:alpha(opacity=0);
	
    height: 35px;
    left: 53px;
    position: absolute;
    top: 10px;
    width: 98px;
}

#btn-in {
background-color:#FFF;
-moz-opacity: 0.00;
-khtml-opacity: 0.00;
opacity: 0.00;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=0);
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
filter:alpha(opacity=0);

    height: 35px;
    left: 166px;
    position: absolute;
    top: 10px;
    width: 98px;
}

#car-reel-reel img {
    width:960px;
}

a, #img-button-switch {
    text-decoration: none;
    border: none;
    border: 0px;
}


.bg-warehouse {
    background-image: url("images/wallpaper_black.png");
}
.bg-concrete {
    background-image: url("images/wallpaper_white.png");
}



.fancybox-lock .fancybox-overlay {
    z-index:99999999
}