.targetingDot{
	background: red;
	width: 5px;
	height: 5px;
	position: absolute;
}
.fullBody {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background: rgba(255,255,255,0.5);
	z-index: 5000;
}

body {
	margin: 0px;
	padding: 0px;
	background-size: cover;
	font-family: 'Helvetica';
	background: #1B1B1B;
	line-height: 1.5;
	user-select: none;
}

* { box-sizing: border-box; }

#mapIframeBody {
	position: absolute;
	top: 0;
	right: 0;
	border: 0px;
	height: 1080px;
	width: 675px;
}
#westMapLeftFrame, #eastMapLeftFrame {
	width: 1244px;
	height: 1080px;
	position: absolute;
	top: 0;
	left: 0;
	background: url('/images/mapScreenSaverEast.png') no-repeat center; }
#westBuildingLink, #eastBuildingLink {
	position: absolute;
	top: 13.85vw;
	height: 26.5vw;
	background: transparent;
}
#westBuildingLink {
	left: 8.75vw;
	width: 12.3vw;
}
#eastBuildingLink {
	left: 43.75vw;
	width: 12.5vw;
}
div.youAreHere {
	position: absolute;
	width: 3.25vw;
	height: 3.25vw;
	background: url('/images/youAreHere.svg') no-repeat center;
	background-color: #fff;
    border-radius: 3.25vw;
}

#tracking {
	width: 100%;
	height: 100%;
	background: transparent;
	z-index: 105;
	left: 0;
	top: 0;
	position: absolute;
}
#trackM {
	z-index: 106;
	color: #292;
	position: absolute;
	top: 60px;
}

#screenSaver {
	left: 0px;
	top: 0px;
	position: absolute;
	width: 100%;
	height: 100%;
	background: #000; /* --------- COMMENT THIS OUT --------- */
	/*background: transparent url('/images/Holiday-2019-v.png') no-repeat center; /* --------- UNCOMMENT THIS --------- */
	z-index:100;
	display: none;
	overflow: hidden;
}
.screenSaverText {
	color: #ebebeb; /* --------- COMMENT THIS OUT --------- */
	/*color: transparent;/* --------- UNCOMMENT THIS --------- */
	position: absolute;
	white-space: nowrap;
	overflow: hidden;
	text-align: center;
	font-size: 1.5em;
	display: none;
}
.screenSaverText h1 {
	font-family: "din_condensed";
	margin: 0px;
	font-size: 3em;
}
.screenSaverMessage {
	color: #ebebeb; /* --------- COMMENT THIS OUT --------- */
	/*color: transparent; /* --------- UNCOMMENT THIS --------- */
	position: absolute;
	white-space: nowrap;
	margin: 0px;
	background: transparent url('/images/clickCTA.svg') no-repeat center; /* --------- COMMENT THIS OUT --------- */
	/*background: transparent; /* --------- UNCOMMENT THIS --------- */
	display: none;
	font-size: 1.5em;
}

header {
	background: #ebebeb;
	display: block;
	height: 10.25vw;
	width: 100%;
}
#headerBar {
	width: 100%;
	height: 6.35%;
	position: absolute;
	top: 0;
	right: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

#leftBox {
	position: absolute;
	transform: translateX(-100%);
	will-change: transform;
	top: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 33%;
	z-index: 20;
	height: 100%;
	background: #dedede;
}
#leftBox h2 {
	margin: 4vw 4vw 0 0;
	padding: .5vw 0 .5vw 3vw;
	font-weight: 100;
	background: #114633;
	color: #fff;
	line-height: 6vw;
}

ul.filterCategories {
	display: flex;
	align-items: center;
	justify-content: space-around;
	flex-direction: column;
	height: 100%;
}
ul.filterCategories li {
	width: 17vw;
	height: 17vw;
	border-radius: 1vw;
	padding: 20px 0px;
	font-size: .8em;
	color: #727272;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-direction: column;
}
ul.filterCategories li.selected{ background: rgba(255,255,255,0.35); }
.category__filterItem div {
	width: 75%;
	height: 75%;
}

@font-face {
    font-family: din_condensed;
    src: local(din_condensed), url('/fonts/din_condensed.otf') format('opentype');
}
#headerBar h1 {
	font-size: 2em;
	margin: 0 0 0 0.5em;
	padding: 0;
	line-height: 1em;
	font-family: "din_condensed";
	color: #727272;
    letter-spacing: .6pt;
}
#headerBar div.youAreHerePin, .youAreHerePin {
	right: 3%;
	top: 30%;
	position: absolute;
	width: 4.25vw;
	height: 4.25vw;
	background: url('/images/youAreHere.svg') no-repeat center;
}
.youAreHerePin {
	background: url('/images/youAreHereCircle.svg') no-repeat center;	
}

.pulsingRing {
	position: absolute;
	top: 32%;
	left: 32%;
	border-radius: 20px;
	border: 1px solid transparent;
	width: 35%;
	height: 35%;
	animation: pulse 2.5s ease-in-out infinite;
}
@keyframes pulse {
  0% {
	border: 1px solid transparent;
	transform: scale(0.25);
  }
  50% {
	border: 1px solid #a8123e;
  }
  100% {
	border: 1px solid transparent;
	transform: scale(5);
  }
}
.youAreFacing {
    background: url('/images/youAreFacing.svg') no-repeat left;
    width: 7vw;
    height: 7vw;
    position: absolute;
    top: -2.5vw;
    left: -2.5vw;
    transform-origin: center;
    z-index: -1;
    pointer-events: none;
}

#close {
	width: 3em;
	height: 3em;
	background: url('/images/close.svg') no-repeat center;
	position: absolute;
	top: 0.5%;
	right: 1%;
	z-index: 26;
	opacity: 0;
}

#bottomBox {
	width: 100%;
	height: 35%;
	position: absolute;
	bottom: 7%;
	transform: translateY(100%);
	will-change: transform;
	right: 0;
	background: #eee;
	display: flex;
	justify-content: space-around;
	align-content: space-around;
	flex-direction: column;
	border-top: 1.5px solid #dedede;
	overflow: hidden;
	z-index: 5;
}
#bottomBox h2 {
	font-size: 1.34em;
	text-align: center;
	padding: 0.5em;
	margin: 0;
	background: #dedede;
}

#openingScreenWrap {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}
#openingScreen {
	width: 100%;
	height: 100%;
	background: #fff;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
}
#openingScreen:before,
#openingScreen:after {
	content: '';
	display: block;
}

.openMapButton {
	width: 36vw;
	height: 36vw;
	background: #efefef url('/images/map-icon.svg') no-repeat center;
	border: 3vw solid #eee;
    border-radius: 5vw;
}
.search {
	background: #c3c3c3;
	border-radius: 65px;
	width: 25vw;
	height: 8vw;
	position: relative;
	display: flex;
	align-items: center;
	padding-left: 3vw;
	color: #727272;
}
.search::after {
	background: url('/images/search.svg') no-repeat center;
	width: 4.5vw;
	height: 4.5vw;
	content: ' ';
	display: block;
	position: absolute;
	top: 1.75vw;
	right: 2vw;
}
#searchProducts {
	width: 100%;
	z-index: 15;
	height: 9.5vw;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 5.25vw 0 11.25vw;
}
#searchProducts > form { display: contents; }
#searchProducts input {
	width: 70vw;
	height: 10vw;
	display: block;
	background: #c3c3c3;
	border-radius: 65px;
	text-align: left;
	font-size: 1em;
	border: solid 1px #c3c3c3;
	padding: 0px 30px;
}
datalist {  display: none; }
#searchProducts input:focus { outline: none; }
#searchProducts input.focusSearch{ background: #fff; }
#searchProducts form span {
	width: 0px;
}
#searchProducts form span::after {
	background: url('/images/search.svg') no-repeat center;
	width: 4.5vw;
	height: 4.5vw;
	content: ' ';
	display: block;
	position: relative;
	top: 0vw;
	right: 7vw;
}
#resultCount {
	position: absolute;
	top: 2.75vw;
	right: 8vw;
	color: #ccc;
}
.pickProductSearchResults{
	position: absolute;
	top: 10vw;
	background: #fff;
	width: 100%;
	padding: 0;
	max-height: 122.5vw;
	overflow-y: scroll;
}
.pickProductSearchResults > ul,pickProductSearchResults > p { margin: 0px 4vw; }
.pickProductSearchResults ul{ padding-bottom: 1px; }
.pickProductSearchResults ul li.searchListItem{ padding: 3vw 0 4vw 0; }
.pickProductSearchResults > p {
	padding: 0px 4vw;
}
.searchListItem {
	border-bottom: 1px black solid;
	display: flex;
}
.searchCategory div {
	width: 15vw;
	height: 15vw;
	margin: 0 2vw;
}
.itemName {
	display: flex;
	align-items: center;
	padding-right: 2vw;
}
.floorNumber {
	background: #ddd;
	padding: 0px 4vw;
	display: block;
	position: relative;
	height: 4.5vw;
	border-bottom: 1px black solid;
}
.floorSearch {
	position: sticky;
	top: -0.5px;
	width: 100%
}
#endProductSearchResults {
	width: 100%;
	background: #ddd;
	height: 8vw;
	display: block;
}
.searchCover {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: #393939;
	opacity: 0.5;
	z-index: 11;
}
#elipse::after{
	content: '';
	display: inline;
	animation: elipse 2.25s infinite;
}
@keyframes elipse {
	0% {content: " ";}
	33% {content: ".";}
	66% {content: "..";}
	100% {content: "...";}
}
#onFloor {
	width: 300%;
	margin: 25px 0 40px 0;
	height: 100%;
}
#bottomBox > div {
	display: flex;
	align-content: space-around;
	justify-content: center;
}

#bottomBox ul {
	display: flex;
	align-content: space-around;
	flex-wrap: wrap;
	width: 100%;
}
#bottomBox ul.categories { justify-content: center; }
ul.categories li {
	width: 30%;
	height: 125px;
	margin: 20px 0px;
	font-size: .8em;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
ul.categories li .selected {
	background:rgba(255,255,255,0.35);
	width: 17vw;
	height: 17vw;
	border-radius: 1vw;
	position: absolute;
	z-index: -1;
}
#subcategories {
	align-content: flex-start;
	justify-content: flex-start;
	width: 100%;
}
#subcategories li div {
	width: 10vw;
	height: 10vw;
	background: red;
}

#subcategoryHeader {
	width: 100%;
    padding: 0 2em;
	display: flex;
	justify-content: space-between;
}
#subcategories .back {
  	background: url('/images/back.svg') no-repeat center;
  	width: 50px;
  	height: 50px;
}

.backText::before{
	background: url('/images/back.svg') no-repeat center;
  	width: 75px;
  	height: 50px;
  	content: ' ';
  	display: block;
  	position: absolute;
  	top: 5%;
  	left: -75px;
}
.backText {
	color: #7f7f7f;
    font-weight: 300;
    position: relative;
    left: 1em;
}
#subcategories h3 { margin: 0; }
#subcategories ul li {
	width: 33.3%;
	height: 125px;
	margin: 20px 0px;
	font-size: .8em;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-direction: column;
}
h3#subcategoryTitle {
	padding-left: 1.5em;
	position: relative;
	text-align: right;
	font-size: 1.25em;
}

#products {
	align-content: flex-start;
	justify-content: flex-start;
	width: 100%;
}

#productHeader {
	width: 100%;
    padding: 0 2em;
	display: flex;
	justify-content: space-between;
}
#products h3 { margin: 0; }
#products ul li {
	width: 33.3%;
	height: 125px;
	margin: 20px 0px;
	font-size: .8em;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-direction: column;
}
h3#productTitle {
	padding-left: 1.5em;
	position: relative;
	text-align: right;
	font-size: 1.25em;
}

#clickCTA {
	width: 10vw;
	height: 10vw;
	background: transparent url('/images/clickCTA.svg') no-repeat center;
	z-index:100;
	border-radius: 75%;
	position: absolute;
	opacity: 0;
	top: 33.3%;
	left: 45%;
}
.clickCTA {
	width: 7vw;
	height: 7vw;
	background: transparent url('/images/clickCTA.svg') no-repeat center;
	z-index:100;
	border-radius: 75%;
	position: absolute;
	opacity: 0;
	top: 33.3%;
	left: 21%;
}
.focusBuilding {
	background: white;
	height: 220px;
	width: 120px;
	border-radius: 10px;
	opacity: 0;
	position: absolute;
	z-index: 1000;
	color: #727272;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.5)
}
.focusBuilding h2 {
	text-transform: uppercase;
	font-family: "din_condensed";
	font-size: 4em;
	text-align: center;
	margin-top: .5em;
	opacity: 0;
}
.focusBuilding ul {
	font-size: 3em;
	font-weight: 100;
}
.focusBuilding div {
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0;
}
.focusBuilding div> * {
	margin: 0 3%;
}
.westBuilding {
	top: 370px;
	left: 255px;
}
.eastBuilding {
	top: 370px;
	left: 905px;
}

#navItemWrapper {
	background: #ebebeb;
	border-top: 1.5px solid #dedede;
	height: 12.75vw;
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 10;
}
#navItems {
	display: flex;
	align-content: space-around;
	justify-content: space-around;
	flex-wrap: wrap;
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: 0;
	right: 0;
}
ul#navItems li {
	width: 22%;
	height: 83%;
	font-size: .6em;
	color: #727272;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-direction: column;
	text-align: center;
}

#container {
	overflow-y: hidden;
	overflow-x: hidden;
	position: absolute;
	top: 12.35%;
	right: 0;
	height: 79.65%;
	width: 100%;
	box-sizing: content-box;
}




#scrollBar {
	overflow-y: hidden;
	overflow-x: hidden;
	position: absolute;
	top: 12.35%;
	left: 0;
	height: 79.65%;
	width: 100%;
	box-sizing: content-box;
}
.scrollBox {
	width: 50px;
	height: 50px;
	z-index: 100;
}

.category__item div {
	width: 100%;
	height: 100%;
}
.thisFloor {
	width: 100%;
	height: 25%;
	position: absolute;
	top: 0;
	left: 0;
}
.thisFloor div {
	width: 75%;
	height: 75%;
	margin: 0 auto;
	background: url('/images/youAreHereCircle.svg') no-repeat center;
}

li > p {
	text-align: center;
	font-weight: 700;
	margin: 0;
}

.invalid p { color: #d1d1d1; }

.floorMap div.bed div {
	width: 26px;
	height: 35px;
}
.floorMap div.bookcase div {
	width: 26px;
	height: 17px;
}
.floorMap div.smallFloor div {
	width: 17px;
	height: 17px;
}
.floorMap div.rectangle div {
	width: 35px;
	height: 17px;
}
.floorMap div.largeFloor div {
	width: 35px;
	height: 35px;
}
.bedding div { background: url('/images/categories/bedding.svg') no-repeat center; }
/*.category__item.bedding div, */.bedding.selected div { background: url('/images/categories/bedding-selected.svg') no-repeat center; }
.bedding.invalid div { background: url('/images/categories/bedding-invalid.svg') no-repeat center; }

.mattresses div { background: url('/images/categories/mattresses.svg') no-repeat center; }
/*.category__item.mattresses div, */.mattresses.selected div { background: url('/images/categories/mattresses-selected.svg') no-repeat center; }
.mattresses.invalid div { background: url('/images/categories/mattresses-invalid.svg') no-repeat center; }

.bedFrames div { background: url('/images/categories/bedFrames.svg') no-repeat center; }
/*.category__item.bedFrames div, */.bedFrames.selected div { background: url('/images/categories/bedFrames-selected.svg') no-repeat center; }
.bedFrames.invalid div { background: url('/images/categories/bedFrames-invalid.svg') no-repeat center; }

.recliners div { background: url('/images/categories/recliners.svg') no-repeat center; }
/*.category__item.recliners div, */.recliners.selected div { background: url('/images/categories/recliners-selected.svg') no-repeat center; }
.recliners.invalid div { background: url('/images/categories/recliners-invalid.svg') no-repeat center; }

.furniture div {	background: url('/images/categories/dressers.svg') no-repeat center; }
/*.category__item.dressers div, */.furniture.selected div {	background: url('/images/categories/dressers-selected.svg') no-repeat center; }
.furniture.invalid div { background: url('/images/categories/dressers-invalid.svg') no-repeat center; }

.misc div {	background: url('/images/categories/misc.svg') no-repeat center; }
/*.category__item.dressers div, */.misc.selected div {	background: url('/images/categories/misc-selected.svg') no-repeat center; }
.misc.invalid div { background: url('/images/categories/misc-invalid.svg') no-repeat center; }

.seating div { background: url('/images/categories/couches.svg') no-repeat center; }
/*.category__item.couches div, */.seating.selected div { background: url('/images/categories/couches-selected.svg') no-repeat center; }
.seating.invalid div { background: url('/images/categories/couches-invalid.svg') no-repeat center; }

.nav__item div {
	width: 50%;
	height: 50%;
}
.floorMap .mapItem {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 3.25vw;
	width: 3.25vw;
}
.floorMap .poi {
	width: 3.25vw;
	height: 3.25vw;
	border: solid transparent .5vw;
	background-color: rgba(235,235,235,0.75);
	border-radius: 40px;
}
.photoPointLocation:before {
	content: url("/images/chevrons.svg");
	width: 45px;
	height: 45px;
	position: absolute;
}

.floorMap .product > div {
	background-color: rgba(0,0,0,0.15);
	border: 1px solid rgba(0,0,0,0.25);
}
.floorMap div.beddingCategory {
	border-radius: .15vw;
	z-index: 3; }

.floorMap div.mattressesCategory {
	border-radius: .15vw;
	z-index: 2; }

.floorMap mapItem {
	border-radius: .15vw;
	z-index: 1; }

.floorMap div.combinedProducts > div { background-image: repeating-linear-gradient( 45deg, rgba(0,0,0,0.3), rgba(0,0,0,0.3) .3vw, rgba(0,0,0,0) .3vw, rgba(0,0,0,0) .6vw ); }

.floorMap div.withColor > div { background-color: #114633; z-index: 1; }


.invalid p { color: #d1d1d1; }

/* ------------------ BUILDING CODE BELOW ------------------ */


ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#container > ul {
	height: 100%;
	flex-direction: column;
	align-items: center;
	align-content: space-around;
	padding: 15px 0px;
}

#container > ul > li {
	will-change: transform;
	position: relative;
	transform-style: preserve-3D;
	transition: height .5s, width .1s cubic-bezier(0.23, 1, 0.32, 1);
	margin-left: auto;
	margin-right: auto;
	z-index: 1;
	color: black;
	transform-origin: center 5%;
	overflow: hidden;
	display: flex;
	background-position: right center;
	border-radius: 10px;
	background-image: linear-gradient(#DCD6CA, #DCD6CA);
	width: 65%;
}

#container > ul > li h2 {
	margin-top: 24px;
	font-size: 16px;
	line-height: 1;
	display: block;
	font-size: 36px;
}

#container > ul > li .mapName {
	font-size: 2vw;
	font-weight: 700;
	position:relative;
	overflow: hidden;
	background: #FFF;
	height: 100%;
	width: 10%;
	padding: 15px 0;
	display: flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
}

.floorMapImg {
	width: 100%;
	height: 100%;
}
.floorMap {
	height: 100%;
	width: 100%;
	position: relative;
}
.mapName > p {
	line-height: 5;
	margin: 0;
	transform:rotate(270deg);
	text-align: center;
	color: #727272;
}
.mapName > p > span {
	font-size: 1.35vw;
	font-style: oblique;
	font-weight: 500;
}

.itemSelected .mapName > p { line-height: 1.5vw; }

.itemSelected { background-size: 100% 583px; }

.coverBack, .photoBrowser {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: #1B1B1B;
	z-index: 4;
	opacity: 0;
}
.photoBrowser {
	background: rgba(0,0,0,0.75);
	z-index: 25;
	opacity: 0;
	overflow: hidden;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#photoToLeft, #photoToRight {
	background: url("/images/next-photo.svg") no-repeat;
	height: 100px;
	padding-right: 130px;
}
#photoToLeft {
	transform: scaleX(-1);
}


/* ------------------ 45th Street View Map CSS ------------------ */


#streetMap {
	overflow-y: hidden;
	overflow-x: hidden;
	position: absolute;
	top: 5%;
	left: 0;
	height: 87%;
	width: 100%;
	box-sizing: content-box;
  	background: url('/images/45thStreetMap.svg') no-repeat center;
  	display: none;
}

.directionalArrow {
	overflow-y: hidden;
	overflow-x: hidden;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	box-sizing: content-box;
  	background: url('/images/directionalLine.svg') no-repeat center;
}




.st0 { fill: red; }
