@import url(fonts.css); html,body{ width: 100%; height: 100%; overflow: hidden; padding: 0; margin: 0; } h1,h2,h3,h4,p{ margin: 0; } p{ padding-top: 16px; padding-bottom: 16px; padding-left: 5px; padding-right: 5px; } div#topbar{ width: 100%; border-color: black; border-style: solid; border-width: 1px; background-color: black; color: white; overflow: hidden; } div.topbar-left{ height: 100%; } div#topbar a{ color: white; text-decoration: none; text-transform: capitalize; text-align: center; vertical-align: middle; border-color: white; border-style: solid; border-width: 0; border-right-width: 1px; border-left-width: 1px; margin-left: -1px; float: left; font-size: 20px; line-height: 35px; padding-left: 2px; padding-right: 2px; overflow: hidden; cursor: pointer; min-width: 35px; } div#topbar a:hover{ background-color: white; color: black; border-bottom-color: black; } div.topbar-right{ float: right; } div.topbar-left{ float: left; } a.topbar-home{ background-color: darkred; } a.topbar-home:hover{ background-color: gray !important; } div#content{ width: 100%; -webkit-overflow-scrolling: touch; overflow: auto; } div#loading{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: gray; background-color: rgba(0,0,0,0.5); background-image: url('../img/load.gif'); background-repeat: no-repeat; background-position: center; } span.icon-bugs{ background-image: url('../img/bug.png'); background-size: 100%; background-repeat: no-repeat; display: block; width: 35px; height: 35px; } span.icon-bugs-invert{ background-image: url('../img/bug-invert.png'); background-size: 100%; background-repeat: no-repeat; display: block; width: 35px; height: 35px; } @media screen and (max-width: 767px){ div#topbar a{ padding-left: 5px; padding-right: 5px; } a.tabbar-home{ width: 35px; } a.topbar-home span{ display: none; } a.topbar-home{ padding-left: 2px !important; padding-right: 2px !important; } a.topbar-home:after{ content: "\2261"; /*use \8943 elsewhere for options dropdown*/ } div.topbar-right{ display: none; } div.topbar-left{ width: 100%; } div.topbar-right a{ clear: both; float: right !important; width: 100%; border-left-style: none !important; } a.topbar-current{ float: right !important; } a.topbar-back,a.topbar-history,a.topbar-index{ width: 35px !important; position: absolute; top: 0; padding: 0 !important; border-bottom: 1px solid white !important; } a.topbar-back{ background-color: darkred; left: 0; } a.topbar-back:hover{ background-color: gray !important; } a.topbar-history{ left: 36px; } a.topbar-index{ left: 72px; } div#topbar{ min-height: 35px; } div.topbar-right{ min-height: 35px; width: 100%; padding-top: 35px; } } @media screen and (min-width: 768px){ div#topbar a{ font-size: 15px; } div#topbar a:hover + a{ border-left-color: black; } a.topbar-back{ display: none !important; } div.topbar-right{ height: 100%; } a.topbar-index{ display: none; } } @viewport{ zoom: 1.0; width: device-width; } @viewport{ zoom: 1.0; width: extend-to-zoom; } @-ms-viewport{ width: extend-to-zoom; zoom: 1.0; }