/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on January 9, 2019 */

@font-face {
    font-family: 'gt_sectra_displaybold';
    src: url('gt-sectra-display-bold-webfont.woff2') format('woff2'),
         url('gt-sectra-display-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'gt_sectra_displaymedium';
    src: url('gt-sectra-display-medium-webfont.woff2') format('woff2'),
         url('gt-sectra-display-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'gt_sectra_displayregular';
    src: url('gt-sectra-display-regular-webfont.woff2') format('woff2'),
         url('gt-sectra-display-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@media screen and (min-width: 640px) {
    body {
        font-size: 0.333333334em;
    }
}
@media screen and (min-width: 960px) {
    body {
        font-size: 0.5em;
    }
}
@media screen and (min-width: 1280px) {
    body {
        font-size: 0.666666667em;
    }
}
@media screen and (min-width: 1536px) {
    body {
        font-size: 0.8em;
    }
}
@media screen and (min-width: 1920px) {
    body {
        font-size: 1em;
    }
}
@media screen and (min-width: 2560px) {
    body {
        font-size: 1.5em;
    }
}
@media screen and (min-width: 3840px) {
    body {
        font-size: 2em;
    }
}

body{
    margin: 0;
    overflow: hidden;
}
html.notouch{
    user-select: none;
}
h4, h3, h2, h1{
    font-family: gt_sectra_displaymedium;
    --font-family-sans-serif: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    --font-family-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
}
div, a, input{
    font-family: gt_sectra_displayregular;
}

noscript.message{
    position: fixed;
    top: 25px;
    font-size: 3em;
    color: #f00;
    width: 100%;
    text-align: center;
    z-index: 2099999993;
}

#titles_container{
    position: fixed;
    top: 0em;
    left: 0;
    width: 100%;
    pointer-events: none;
    user-select: none;
    overflow: hidden;
    height: 6.2em;
    transition: height 0.7s;
    background-color: #fff;
    /* box-shadow: 0 0 1em 17px #fff;
    mix-blend-mode: hard-light; */
    z-index: 3230000;
}
#titles_container.active, #titles_container.fits{
    height: 14.2em;
}
#titles{
    top: 0.1em;
    left: 0.2em;
    position: relative;
    font-size: 3em;
    background: 0em 0.08em no-repeat url(explore.svg);
    background-size: 1em;
    transition: font-size 0.7s, top 0.7s, left 0.7s, background-size 0.7s, background-position 0.7s, height 0.7s;
    height: 2em;
}
#titles_container.active #titles, #titles_container.fits #titles{
    top: 0.1em;
    left: 0.2em;
    font-size: 8.2em;
}

#datetime{
    position: fixed;
    top: 0.4em;
    right: 0.7em;
    z-index: 40000;
    font-size: 1.5em;
    line-height: 1.4em;
    text-align: left;
    width: 5.7em;
    background: 0 0 no-repeat url(logo.svg);
    background-size: 5.2em;
    padding-top: 0.85em;
    transition: font-size 0.7s, background-size 0.7s, background-position 0.7s, height 0.7s, line-height 0.7s, width 0.7s, padding-top 0.7s;
}
#titles_container.active #datetime, #titles_container.fits #datetime{
    font-size: 3.2em;
}

#datetime.loading{
    display: none;
}
#datetime h2, #datetime h3{
    margin: 0;
}
#titles div{
    position: absolute;
    text-shadow: 0.05em 0.05em 0em #ffffff;
    mix-blend-mode: hard-light;
    opacity: 1;
    z-index: 50000;
    padding-left: 1.2em;
}
#titles div.active{
    position: absolute;
    transition: top 0.7s, opacity 0.4s;
}
#titles div+div{
    top: 1.2em;
    opacity: 0;
}

#touchable{
    background: center no-repeat url(touch_app.svg);
    background-size: 25em;
    width: 16em;
    height: 23em;
    pointer-events: none;
    position: fixed;
    bottom: 10em;
    right: 15em;
    opacity: 0;
    transition: opacity 0.7s;
    z-index: 9000000;
    border-top-left-radius: 13em;
    border-top-right-radius: 13em;
    background-position-y: -3em;
    background-position-x: -4.8em;
    border-bottom-right-radius: 7em;
    border-bottom-left-radius: 13em;
}
#touchable.active{
    opacity: 1;
	animation: pulse 2s infinite;
}
#touchable.fits{
    font-size: 0.6em;
    bottom: 23em;
    right: 2.9em;
    opacity: 1;
	/* animation: pulse 2s infinite; */
}
@keyframes pulse {
	0% {
		transform: scale(0.95);
		/* text-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7); */
	}

	70% {
		transform: scale(1);
		/* text-shadow: 0 0 0 0.5em rgba(0, 0, 0, 0); */
	}

	100% {
		transform: scale(0.95);
		/* text-shadow: 0 0 0 0 rgba(0, 0, 0, 0); */
	}
}

#closesearch{
    height: 3em;
    width: 4em;
    position: absolute;
    right: 0.5em;
    top: -3em;
    border-top-left-radius: 1em;
    background: #000 center no-repeat url(keyboard_hide.svg);
    background-size: 1.5em;
    cursor: pointer;
}
#cancelsearch{
    height: 3em;
    width: 5em;
    position: absolute;
    right: 3.5em;
    top: -3em;
    border-top-left-radius: 1em;
    background: #737373 center no-repeat url(delete_forever.svg);
    background-size: 1.5em;
    cursor: pointer;
    background-position-x: 1.5em;
}
#opensearch {
    height: 11em;
    width: 11em;
    position: fixed;
    right: 0;
    bottom: 0;
    border-top-left-radius: 1em;
    background: #000 center no-repeat url(search-white.svg);
    background-size: 8.3em;
    cursor: pointer;
    z-index: 800000;
}

#onscreenkeyboard {
    font-size: 1.5em;
    background-color: rgb(216, 216, 216);
    display: inline-block;
    padding: 0.4em 1em 1.4em 0.4em;
    border-top-left-radius: 1.2em;
    position: fixed;
    right: -0.7em;
    bottom: -20em;
    box-shadow: -0.2em -0.2em 2em 0px #5f5f5fa8;
    z-index: 9000000;
    transition: bottom 0.7s;
}
#onscreenkeyboard.open {
    bottom: -0.7em;
}
#onscreenkeyboard .searchinput{
    width: 15.5em;
    text-transform: uppercase;
    font-size: 2em;
    margin: 0.1em;
    padding: 0.3em 0.4em;
    padding-bottom: 0.1em;
    border-radius: 0.4em;
    border: 0;
    box-shadow: 0.1em 0.1em 0.4em #7d7d7d66;
    background: #fff center no-repeat url(search-black.svg);
    background-size: 1.2em;
    background-position-x: 14.9em;
    background-position-y: 0.3em;
}
#onscreenkeyboard .searchinput:disabled{
    color: #000;
    user-select: none;
    pointer-events: none;
}
#onscreenkeyboard .searchinput:focus{
    padding: 0.3em 0.4em;
    padding-bottom: 0.1em;
    border-radius: 0.4em;
    border: 0;
    box-shadow: 0.1em 0.1em 0.4em #7d7d7d66;
    outline-offset: none;
    outline: none;
}

#businesslist{
    margin-top: 7em;
    position: fixed;
    top: 0;
    z-index: 0;
    opacity: 1;
    transition: top 0.7s, opacity 0.7s, margin-top 0.7s;
    width: calc(100% - 11em);
}
#businesslist.active{
    margin-top: 16em;
    opacity: 0.5;
}
#businesslist.fits{
    margin-top: 16em;
    z-index: 3230000;
    opacity: 1;
}
#businesslist.animateStopUp{
    margin-top: -1em;
}
#businesslist.animateStopDown{
    margin-top: 1em;
}
#navup, #navdown{
    height: 11em;
    width: 11em;
    position: fixed;
    right: 0;
    border-top-left-radius: 1em;
    background: #000 center no-repeat url(search-white.svg);
    background-size: 8.3em;
    cursor: pointer;
    z-index: 800000;
}
#navup{
    bottom: 16.5em;
    background: #999999 center -1em no-repeat url(arrow_up.svg);
}   
#navdown{
    bottom: 8.1em;
    background: #737373 center -1em no-repeat url(arrow_down.svg);
}

.businesscard{
    display: inline-block;
    padding: 0.5em 0.7em;
    border: 0.05em solid #000;
    margin: 0.5em;
    font-size: 1.05em;
    height: 2.7em;
    vertical-align: text-top;
    user-select: none;
    overflow: hidden;
    cursor: pointer;
    background-color: #fff;
    -webkit-tap-highlight-color:  rgba(255, 255, 255, 0); 
}

.businesscard h3{
    margin-top: 0.2em;
    font-size: 2em;
    margin-bottom: 0;
    text-overflow: clip;
    white-space: nowrap;
    overflow: hidden;
}
.businesscard h4{
    margin: 0;
    opacity: 0.5;
}
.businesscard.doubletitle h3{
    margin-top: -0.2em;
}
.businesscard.doubletitle h4{
    margin-top: 0;
}

.businesscardicons .room{
    background-image: url(room.svg);
}
.businesscardicons .website{
    background-image: url(website.svg);
}
.businesscardicons .phone{
    background-image: url(phone.svg);
}
.businesscardicons .openinfo{
    background-image: url(openhours.svg);
}
.businesscardicons .openinfo ul{
    padding-inline-start: 0.7em;
}
.businesscardicons .openinfo ul li{
    list-style-type: disc;
    padding: 0;
    text-transform: capitalize;
    font-size: 0.8em;
}
.businesscardicons .openinfo ul li label{
    list-style-type: disc;
    width: 3.5em;
    display: inline-block;
}

.businesscardicons{
    padding-left: 0;
    padding-bottom: 0.2em;
    overflow: hidden;
    width: 0.1em;
    display: inline-block;
    margin-top: 0.3em;
    font-size: 0.9em;
}
.businesscardicons li{
    list-style-type: none;
    background-repeat: no-repeat;
    padding: 0 0 0.1em 1.6em;
    background-size: 1.2em;
}

.businesscard.openfloat .map{
    width: 0em;
}
.businesscard.openfloat .map{
    display: inline-block;
    border: 1px solid #f00;
    height: 16.2em;
    width: 23em;
    background-color: #ccc;
    position: relative;
    float: right;
    bottom: 0;
    /* display: none; */
}

.businesscardplaceholder{
    display: inline-block;
    padding: 0.5em 1.4em;
    border: 0.05em solid #ffffff00;
    margin: 0.5em;
    font-size: 1.05em;
    height: 2.7em;
    vertical-align: text-top;
    background-color: #ccc;
}
.businesscard.openfloat{
    position: fixed;
    overflow: hidden;
    margin: 0;
    transition: font-size 1s, height 1s, width 1s, top 1s, left 1s;
    z-index: 100000;
}
.businesscard.openfloat .businesscardicons {
    width: 12.2em;
}
.closebutton{
    position: absolute;
    top: 0;
    right: 0;
    width: 3em;
    height: 3em;
    opacity: 0;
    transition: opacity 0.5s;
    background: #ccc center no-repeat url(clear.svg);
    border-bottom-left-radius: 0.3em;
}
.closebutton.fade{
    opacity: 1;
}

.rowslot>div{
    background-color: #fff;
    display: inline-block;
    padding: 0.5em;
    margin: 0.2em;
    width: 1.3em;
    height: 1.2em;
    text-align: center;
    font-family: gt_sectra_displaymedium;
    vertical-align: middle;
    border-radius: 0.8em;
    box-shadow: 0.1em 0.1em 0.4em #7d7d7d66;
    user-select: none;
    cursor: pointer;
    -webkit-transition-duration: 0.3s; /* Safari */
    transition-duration: 0.3s;
    text-decoration: none;
    overflow: hidden;
}

.rowslot>div {
    position: relative;
    text-align: center;
    -webkit-transition-duration: 0.3s; /* Safari */
    transition-duration: 0.3s;
    text-decoration: none;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0.1em 0.1em 0.4em #7d7d7d66;
}

.rowslot>div:after {
    content: "";
    background: #000;
    display: block;
    position: absolute;
    padding-top: 300%;
    padding-left: 350%;
    margin-left: -20px!important;
    margin-top: -120%;
    opacity: 0;
    transition: all 0.6s;
    box-shadow: 0.2em 0.2em 0.4em #33333366;
}

.rowslot>div:active:after {
    opacity: 0.3;
    transition: 0s
}

.rowslot:nth-child(4){
    margin-left: 0.6em;
}
.rowslot:nth-child(5){
    margin-left: 1.2em;
}
.rowslot:nth-child(6){
    margin-left: 1.8em;
}
.key_erase{
    background: center no-repeat url(backspace.svg);
    background-size: 1.5em;
    width: 1.8em !important;
}
.key_space{
    background: center no-repeat url(space_bar.svg);
    background-size: 1.5em;
    width: 2.83em !important;
}

.businesscard .map{
    display: none;
}

.businesscard.openfloat .map{
    display: block;
}

.hilight{
    fill: #f00;
}
#mapcrop{
    height: 17em;
    width: 23em;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background-color: #768471;
    margin: 0;
    border: 2px solid #f00;
    position: absolute;
}
#mapbox{
    position: relative;
    height: 2000px;
    width: 2000px;
}


.stc44{fill: #838282;}
.stc196{fill:#ff80de;}
.stc197{fill:#E62E23;}
.stc198{fill:#30b44a;}
.stc199{fill:#2c60f1;}

.stc196, .stc197, .stc198, .stc199{
    stroke: none;
}

.floorbuttons {
    position: absolute;
    left: 0;
    z-index: 15;
    background: white;
    font-size: 35px;
    font-family: monospace;
}
.floorbtn {
    width: 1.5em;
    text-align: center;
    height: 1.3em;
    border: solid #ccc;
    border-width: 0 3px 3px 0;
    cursor: pointer;
    padding: 0.16em;
}
.curFloor{
    background-color: #E62E23;
    border-color: #E62E23;
}