@charset "utf-8";
/* CSS Document */

.divflrplancontainer {width:100%; height:100%; position:relative; display:block; top:0; left:0; z-index:9}
.mainflrplan, .markfloor {width:100%; height:100%; position:absolute; display:block; top:0; left:0;}
.mainflrplan {z-index:10}
.markfloor {z-index:100}
.mainflrplan img, .markfloor img {width:auto; height:100%; position:absolute; bottom:0; left:0}
.markfloor {background: url(../floorplan/flrblank.png) left bottom no-repeat; background-size: auto 100%}
.divallflrnamecont {position:absolute; top:50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); right:30%; z-index:10; width:280px; color:#000000}
.flrplannumli li {display:inline-block; width:14%; margin:5px 1%; padding:2px 2%; background-color:transparent; text-align:center; cursor:pointer}
.flrplannum {display:inline-block; width:14%; margin:5px 1%; padding:2px 2%; background-color:transparent; text-align:center; cursor:pointer}
.flrplannumli li:hover {background-color:#333; color:#FFFFFF}
.flrplannumli {text-align:center}

.unitplannumli li {display:inline-block; width:66%; margin:5px auto; padding:2px 2%; background-color:transparent; text-align:center; cursor:pointer}
.unitplannumli li:hover {background-color:#333; color:#FFFFFF}
.unitplannumli {text-align:center}
.unitplannumli h1 {background-color:#333333; color:#FFFFFF}


.markfloor.out {background: url(../floorplan/flrblank.png); background-position:left bottom; background-size: auto 100%; background-repeat:no-repeat}
.markfloor.active11, .markfloor.active12, .markfloor.active13, .markfloor.active14, .markfloor.active15, .markfloor.active16, .markfloor.active17, .markfloor.active18, .markfloor.active19, .markfloor.active20, .markfloor.active21, .markfloor.active22, .markfloor.active23, .markfloor.active24, .markfloor.active25, .markfloor.active26, .markfloor.active27, .markfloor.active28, .markfloor.active29, .markfloor.active30, .markfloor.active31, .markfloor.active32, .markfloor.active33, .markfloor.active34, .markfloor.active35, .markfloor.active36, .markfloor.active37, .markfloor.active38, .markfloor.active39, .markfloor.active40, .markfloor.active41, .markfloor.active42, .markfloor.active43, .markfloor.active44, .markfloor.active45, .markfloor.active46, .markfloor.active47, .markfloor.active48, .markfloor.active49, .markfloor.active50, .markfloor.active51, .markfloor.active52, .markfloor.active53, .markfloor.active54, .markfloor.active55, .markfloor.active56, .markfloor.active57, .markfloor.active58 {background-position:left bottom; background-size: auto 100%; background-repeat:no-repeat}
.markfloor.active11 {background-image: url(../floorplan/markflr11.png);}
.markfloor.active12 {background-image: url(../floorplan/markflr12.png);}
.markfloor.active13 {background-image: url(../floorplan/markflr13.png);}
.markfloor.active14 {background-image: url(../floorplan/markflr14.png);}
.markfloor.active15 {background-image: url(../floorplan/markflr15.png);}
.markfloor.active16 {background-image: url(../floorplan/markflr16.png);}
.markfloor.active17 {background-image: url(../floorplan/markflr17.png);}
.markfloor.active18 {background-image: url(../floorplan/markflr18.png);}
.markfloor.active19 {background-image: url(../floorplan/markflr19.png);}
.markfloor.active20 {background-image: url(../floorplan/markflr20.png);}
.markfloor.active21 {background-image: url(../floorplan/markflr21.png);}
.markfloor.active22 {background-image: url(../floorplan/markflr22.png);}
.markfloor.active23 {background-image: url(../floorplan/markflr23.png);}
.markfloor.active24 {background-image: url(../floorplan/markflr24.png);}
.markfloor.active25 {background-image: url(../floorplan/markflr25.png);}
.markfloor.active26 {background-image: url(../floorplan/markflr26.png);}
.markfloor.active27 {background-image: url(../floorplan/markflr27.png);}
.markfloor.active28 {background-image: url(../floorplan/markflr28.png);}
.markfloor.active29 {background-image: url(../floorplan/markflr29.png);}
.markfloor.active30 {background-image: url(../floorplan/markflr30.png);}
.markfloor.active31 {background-image: url(../floorplan/markflr31.png);}
.markfloor.active32 {background-image: url(../floorplan/markflr32.png);}
.markfloor.active33 {background-image: url(../floorplan/markflr33.png);}
.markfloor.active34 {background-image: url(../floorplan/markflr34.png);}
.markfloor.active35 {background-image: url(../floorplan/markflr35.png);}
.markfloor.active36 {background-image: url(../floorplan/markflr36.png);}
.markfloor.active37 {background-image: url(../floorplan/markflr37.png);}
.markfloor.active38 {background-image: url(../floorplan/markflr38.png);}
.markfloor.active39 {background-image: url(../floorplan/markflr39.png);}
.markfloor.active40 {background-image: url(../floorplan/markflr40.png);}
.markfloor.active41 {background-image: url(../floorplan/markflr41.png);}
.markfloor.active42 {background-image: url(../floorplan/markflr42.png);}
.markfloor.active43 {background-image: url(../floorplan/markflr43.png);}
.markfloor.active44 {background-image: url(../floorplan/markflr44.png);}
.markfloor.active45 {background-image: url(../floorplan/markflr45.png);}
.markfloor.active46 {background-image: url(../floorplan/markflr46.png);}
.markfloor.active47 {background-image: url(../floorplan/markflr47.png);}
.markfloor.active48 {background-image: url(../floorplan/markflr48.png);}
.markfloor.active49 {background-image: url(../floorplan/markflr49.png);}
.markfloor.active50 {background-image: url(../floorplan/markflr50.png);}
.markfloor.active51 {background-image: url(../floorplan/markflr51.png);}
.markfloor.active52 {background-image: url(../floorplan/markflr52.png);}
.markfloor.active53 {background-image: url(../floorplan/markflr53.png);}
.markfloor.active54 {background-image: url(../floorplan/markflr54.png);}
.markfloor.active55 {background-image: url(../floorplan/markflr55.png);}
.markfloor.active56 {background-image: url(../floorplan/markflr56.png);}
.markfloor.active57 {background-image: url(../floorplan/markflr57.png);}
.markfloor.active58 {background-image: url(../floorplan/markflr58.png);}

.szoomcontainer {width:80% !important; height:80% !important; margin:0 auto; position:relative; display:block}

.flrwh100 {position:absolute; top:0; left:0; overflow:hidden}
.flrwh100 {width:100%; height:100%; }
.flrwh100 img {height:90% !important; min-height:90%; width:auto !important; min-width:90%;}
.flrwh100:hover, .flrwh100:focus {-ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); -webkit-transition: all 3s; -moz-transition: all 3s; -o-transition: all 3s; transition: all 3s;}
.flrwh100:hover {-webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-animation: flrbgdanimn 3s ease-in-out; -moz-animation: flrbgdanimn 3s ease-in-out; animation: flrbgdanimn 3s ease-in-out;}
@-webkit-keyframes flrbgdanimn {
    0% {-webkit-transform: scale(1.0); -moz-transform: scale(1.0); transform: scale(1.0)}
    100% {-webkit-transform: scale(1.5); -moz-transform: scale(1.5); transform: scale(1.5)}
}

.divszoom {width:80% !important; height:80% !important; position:relative; margin:5%}
.smooth_zoom_preloader {width:100% !important; height:100% !important;}
.smooth_zoom_preloader img {width:100% !important; height:auto !important;}

.closeunits {display:block; margin-bottom:20px; text-align:right}
.closeunits img {display:inline-block; width:30px; height:auto}
h1.unitplans {
    margin-bottom: 10px;
    padding: 4px 10px; color:#000; font-weight:normal; font-size:12pt; background-color:rgba(0, 0, 0, 0.3) !important
}
h1.unitplans:hover {
    background-color:rgba(255, 255, 255, 0.3) !important;
}

/*
.trigger12:hover ~ .markfloor {background: lightblue !important;}
.trigger12:hover ~ .trigger13 {background: lightblue !important;}
*/


@media screen and (min-width: 300px) {
.mainflrplan img, .markfloor {left:-55%}
.divallflrnamecont {top:50%; right:26px; width:160px; font-size:9pt}
.divallflrnamecont h1 {font-size:9pt; line-height:14pt}
.flrplannumli li {width:14%; margin:2px 1%; padding:2px 2%;}
.flrplannum {width:14%; margin:2px 1%; padding:2px 2%;}
.unitplannumli li {margin:2px auto; width:80%}
.closeunits img {width:20px;}
}

@media screen and (min-width: 480px) {
.mainflrplan img, .markfloor {left:-16%}
.divallflrnamecont {top:50%; right:12%; width:180px; font-size:9pt}
.divallflrnamecont h1 {font-size:9pt; line-height:14pt}
.flrplannumli li {width:14%; margin:5px 1%; padding:2px 2%;}
.flrplannum {width:14%; margin:5px 1%; padding:2px 2%;}
.closeunits img {width:30px;}
.unitplannumli li {margin:2px auto; width:100%;}

}

@media screen and (min-width: 768px) {
.mainflrplan img, .markfloor {left:-22%}
.divallflrnamecont {top:50%; right:12%; width:240px; font-size:10pt}
.divallflrnamecont h1 {font-size:10pt; line-height:14pt}
.flrplannumli li {width:14%; margin:5px 1%; padding:2px 2%;}
.flrplannum {width:14%; margin:5px 1%; padding:2px 2%;}
.unitplannumli li {margin:5px auto; width:100%;}
}

@media screen and (min-width: 1024px) {
.mainflrplan img, .markfloor {left:-5%}
.divallflrnamecont {right:10%; width:280px; font-size:11pt}
.divallflrnamecont h1 {font-size:16pt; line-height:24pt}
.flrplannum {width:14%; margin:5px 1%; padding:2px 2%;}
.unitplannumli li {margin:5px auto; width:90%}

}

@media screen and (min-width: 1280px) {
.divallflrnamecont {right:20%;}
.mainflrplan img, .markfloor {left:0%}

}

@media screen and (min-width: 1366px) {
.divallflrnamecont {right:20%;}

}

@media screen and (min-width: 1440px) {
.divallflrnamecont {right:25%;}

}

@media screen and (min-width: 1600px) {
.divallflrnamecont {right:30%;}

}