html,body{height:100%;width:100%;margin:0;padding:0;overflow:hidden}#head{background-color:#283139;height:60px;width:100%}#head #toggleMap{position:absolute;top:10px;left:10px;width:125px;height:38px;border:1px solid #005558;background-color:#005558;cursor:pointer}#head #toggleMap .mapTxt{display:block;padding:8px 0 0 25px}#head #toggleMap .ion-map{position:absolute;top:-5px;left:75px;color:#fff;font-size:32px}#head #marathonLogo{position:absolute;left:13%;top:11px;display:block;max-width:100%;height:auto}#head #beta{position:absolute;top:16px;right:12%}#head .appTitle{color:#00A6E5;display:block;position:absolute;right:14%;top:2px;padding:15px;margin:0 auto;text-transform:uppercase;font-size:26px;font-weight:bold}#head #toggleInfoPanel{position:absolute;top:10px;right:10px;height:38px;width:125px;border:1px solid #005558;background-color:#005558;cursor:pointer}#head #toggleInfoPanel .moreInfo{display:inline;position:absolute;top:10px;margin:-2px 0 0 15px}#loadingTxt{position:absolute;left:0;right:0;margin-left:auto;margin-right:auto;top:46%;text-align:center}#progressbar{position:absolute;top:50%;left:0;right:0;margin-left:auto;margin-right:auto;width:400px}#progressbar .ui-progressbar-value{background-color:#EB7300}#map{width:342px;height:300px;position:absolute;top:60px;left:-357px}#pano{width:100%;height:100%}#startArrow{position:absolute;left:0;right:0;margin-left:auto;margin-right:auto;bottom:8%;text-align:center;z-index:3}#startArrow #startTxt{color:#F5BA42;padding:8px 15px;font-size:28px;font-weight:bold;text-shadow:.5px .5px 2px #000}#startArrow #startIcon img{height:70px}#loadingOverlay{width:100%;height:90%;background-image:url("http://www.bostonmarathonmediaguide.com/hyperlapse/img/loading-screen.jpg");background-repeat:no-repeat;background-position:center center;background-size:cover}#water{position:absolute;bottom:68px;left:121px}#runner{position:absolute;bottom:176px;left:10px}#history{position:absolute;bottom:176px;left:10px}#mileCont{position:absolute;bottom:68px;left:10px}#mileMk{position:absolute;bottom:88px;left:45px;color:#fff;font-size:28px;width:30px;text-align:center;z-index:1}canvas{cursor:move;cursor:grab;cursor:-moz-grab;cursor:-webkit-grab}canvas:active{cursor:grabbing;cursor:-moz-grabbing;cursor:-webkit-grabbing}#infoPanel{position:absolute;top:60px;right:-320px;width:320px;display:block;min-height:100%;overflow-y:scroll}#infoPanel .infoPanelKey{background-color:#1E272F}#infoPanel .infoPanelKey .whiteTxt{font-size:11px;padding:0 5px}#infoPanel .infoPanelKey #closeInfoPanel{color:#fff;float:right;display:inline-block;padding:5px;font-size:22px}#infoPanel .infoPanelKey .infoPanelIcons{text-align:center;padding:7px 0 7px 4px;display:inline-block}#infoPanel .infoList{list-style-type:none;padding:0}#infoPanel .infoList .infoItem{position:relative;height:100%;color:#333}#infoPanel .infoList .infoItem:nth-child(odd){background-color:#DEDEDE}#infoPanel .infoList .infoItem:nth-child(even){background-color:#C2C2C2}#infoPanel .infoList .infoItem a{text-decoration:none;color:inherit;display:block;height:100%}#infoPanel .infoList .infoItem a #colorCode{position:absolute;top:0;left:0;height:100%;width:10px;float:left;content:" "}#infoPanel .infoList .infoItem a #infoContent{padding:15px 7.5px 15px 20px;font-size:14px;line-height:20px}#infoPanel .infoList .infoItem a:hover{background-color:#1E272F;color:#fff}#foot{position:absolute;bottom:-170px;left:0;display:block;height:230px;width:100%;background-color:#005558;color:#F5BB31;z-index:2}#foot #footerContent{height:60px;padding:9px 15px}#foot #footerContent .leftFooter{float:left;display:block;width:45%;margin:0 auto;position:relative}#foot #footerContent .leftFooter .town{display:inline;text-align:left;position:relative}#foot #footerContent .leftFooter .town .currentTxt{position:absolute;top:0;left:0}#foot #footerContent .leftFooter .town .townTxt{position:absolute;top:18px;left:0}#foot #footerContent .leftFooter .town #currentTown{min-width:79px;position:absolute;top:10px;left:78px}#foot #footerContent .leftFooter .besttime{text-align:left;position:absolute;top:0;left:180px}#foot #footerContent .leftFooter .besttime #wCheckPtWrap{position:absolute;top:0;left:100px;border:1px solid #F5BA42;font-weight:bold;padding:10px;cursor:pointer}#foot #footerContent .leftFooter .besttime #mCheckPtWrap{position:absolute;top:0;left:195px;border:1px solid #F5BA42;font-weight:bold;padding:10px;cursor:pointer}#foot #footerContent .leftFooter .besttime #distCheckPtWrap{position:absolute;top:0;left:270px}#foot #footerContent .leftFooter .besttime #distCheckPtWrap #checkPtDist{font-size:16px}#foot #footerContent .hyperControls{float:left;width:10%;text-align:center;border-left:1px solid #fff;border-right:1px solid #fff;height:44px;line-height:44px}#foot #footerContent .hyperControls a{cursor:pointer}#foot #footerContent .hyperControls a:hover{color:#fff}#foot #footerContent .hyperControls #back{font-size:32px;margin-right:10px}#foot #footerContent .hyperControls #playpause{font-size:40px}#foot #footerContent .hyperControls #forward{font-size:32px;margin-left:10px}#foot #footerContent .rightFooter{float:left;width:45%;padding-left:15px;position:relative}#foot #footerContent .rightFooter .milekm{position:absolute;top:-2px;right:420px;display:inline-block}#foot #footerContent .rightFooter .currElevation{position:absolute;top:0;right:300px;display:inline-block;text-align:left;margin-left:15px}#foot #footerContent .rightFooter .currElevation #currentElevation{width:30px;text-align:center;position:absolute;top:20px;right:-30px}#foot #footerContent .rightFooter .paceChart{display:inline;position:absolute;top:0;right:0;background-color:#073a3c;border:1px solid #073a3c}#foot #footerContent .rightFooter .paceChart a{background-color:transparent;border-radius:0;padding:10px 12px 4px 12px;height:42px}#foot #footerContent .rightFooter .paceChart a:hover,#foot #footerContent .rightFooter .paceChart a:active,#foot #footerContent .rightFooter .paceChart a:visited{color:#fff}#foot #footerContent .rightFooter .viewChart{display:inline;position:absolute;top:0;right:128px;background-color:#073a3c;border:1px solid #073a3c;height:44px}#foot #footerContent .rightFooter .viewChart #toggleElevationChart{padding:12px 6px 14px}#foot #footerContent .rightFooter .viewChart #toggleElevationChart img{padding:4px 0}#foot #footerContent .rightFooter .viewChart #toggleElevationChart:hover,#foot #footerContent .rightFooter .viewChart #toggleElevationChart:active,#foot #footerContent .rightFooter .viewChart #toggleElevationChart:visited{color:#fff;text-decoration:none;cursor:pointer}#foot #elevationChart{background-color:#1F282F;display:block;width:100%;height:170px}#foot #elevationChart .node{font:10px sans-serif;fill:#909497;stroke:#909497;stroke-width:1px;transition:all .2s ease-in-out}#foot #elevationChart .node:hover{fill:#F5BA42;stroke:#F5BA42}#foot #elevationChart path{stroke:#909497;stroke-width:2;fill:none}#foot #elevationChart .axis path,#foot #elevationChart .axis line{fill:none;stroke:#F5BA42;stroke-width:1;shape-rendering:crispEdges}#foot #elevationChart .tick text{fill:#fff}#foot #elevationChart .domain{fill:#F5BA42;stroke:#F5BA42}#foot #elevationChart svg{overflow:hidden}.whiteTxt{color:#fff;text-transform:uppercase;text-decoration:none;font-size:14px}.boldGold{color:#F5BA42;font-weight:bold;font-size:16px}.runners{background-color:#EB7300}.history{background-color:#B5BF00}.tips{background-color:#EB7300}.modal-backdrop{background-color:transparent}.infoModal .modal-dialog{margin-top:20%}.infoModal .modal-dialog .modal-content{background-color:transparent;border:0;box-shadow:0;border-radius:10px}.infoModal .modal-dialog .modal-content .modal-body{background-color:rgba(0,0,0,0.7);box-shadow:0;border-radius:10px;padding:0}.infoModal .modal-dialog .modal-content .modal-body .modalType{color:#fff;font-size:16px;text-transform:uppercase;position:absolute;top:30px;left:80px}.infoModal .modal-dialog .modal-content .modal-body .modalIcon{height:30px;margin:20px}.infoModal .modal-dialog .modal-content .modal-body .closeModal{color:#fff;display:inline-block;font-size:22px;float:right;padding:5px 10px}.infoModal .modal-dialog .modal-content .modal-body .modalTxt{color:#fff;padding:20px 30px 30px 30px}.infoModal .modal-dialog .modal-content #finishModalBody{text-align:center}.infoModal .modal-dialog .modal-content #finishModalBody .finishModalHeading{display:block;margin:0 auto;color:#F5BA42;padding:20px 0 0;font-size:30px}.infoModal .modal-dialog .modal-content #finishModalBody .modalTxt{color:#fff;padding:20px 30px;font-size:16px}.infoModal .modal-dialog .modal-content #finishModalBody img{margin:0 auto;padding:0 0 30px}.tooltip,.tooltip-inner{white-space:nowrap}.closeCircle{color:#fff;font-size:22px}#closeElevationChart{position:absolute;top:65px;right:10px;padding:5px}#closeElevationChart:hover{color:#fff}.modalTxt{color:#fff;padding:20px 30px 30px 30px}#axis{position:absolute;bottom:4px;left:14px;pointer-events:none}@media only screen and (max-device-width:1024px){#head,#foot,#loadingTxt,#progressbar,#circlePanel,#pano,#startArrow,#infoPanel{display:none}#smallDevice{width:100%;height:100%;background-color:#073a3c;color:#fff;padding:30px}#smallDevice h1{color:#00A6E5;text-align:center}#smallDevice img{display:block;margin:0 auto}#smallDevice p{display:block;margin:0 auto;padding:15px;text-align:center}}@media only screen and (min-device-width:1025px){#smallDevice{display:none}}@media only screen and (min-device-width:1025px) and (max-device-width:1150px){.whiteTxt{font-size:80%}.appTitle{font-size:22px}#beta{right:13%}#currentTown{left:50px}.besttime{left:145px}.milekm{right:320px}.currElevation{right:233px}#wCheckPtWrap{left:70px}#mCheckPtWrap{left:150px}#distCheckPtWrap{left:215px}.viewChart{right:92px}}