VulpesOS/gaia/tv_apps/browser/style/index.css

html, body {
  width: 1920px;
  height: 100%;
  padding: 0;
  margin: 0;
  overflow: hidden;
  cursor: default;
  background-color : #e0e2e4;
}

html {
  font-size: 10px;
}

body {
  font-size: 20px;
}

a {
  overflow: hidden;
  outline: none;
}

.input-line {
  position: absolute;
  bottom: -2px;
  left: 0px;
  height: 3px;
  transition: transform 0.3s ease-in 0s;
  transform: scaleX(0);
  background-color: #00CAF2;
}

/* --------------- layout --------------- */
.side-window {
  width: 400px;
  height: 1080px;
  float: left;
  background-color: #282929;
  display: none;
  cursor: default;
}
#side-block[data-sidebar="true"] {
  display: block;
}

.main-window {
  position: relative;
  width: 1920px;
  height: 100%;
  float: left;
  cursor: default;
  display: block;
}
#main-block[data-sidebar="true"] {
  width: -moz-calc(1920px - 400px);
}

/* --------------- block --------------- */

#web-block {
  position: absolute;
  width: 100%;
  height: -moz-calc(100% - 100px);
  cursor: default;
  top: 100px;
}

/* --------------- other --------------- */
input::-moz-focus-inner {
  border: 0;
}

/* --------------- browser --------------- */
#web-block > iframe {
  -moz-box-sizing: border-box;
  height: 100%;
  width: 100%;
  border: solid 0px;
}

#block-l {
  position: absolute;
  left: 1px;
  width: 10px;
  height: 1080px;
  z-index: 200;
  cursor: default;
}

#block-r {
  position: absolute;
  right: 1px;
  width: 10px;
  height: 1080px;
  z-index: 200;
  cursor: default;
}

#block-d {
  position: absolute;
  bottom: 1px;
  width: 100%;
  height: 10px;
  z-index: 200;
  cursor: default;
}

/* --------------- scroll --------------- */
#scroll-u, #scroll-d {
  position: absolute;
  width: 100%;
  height: 1px;
  z-index: 190;
}
#scroll-u {
  top: 0px;
}
#scroll-d {
  bottom: 0px;
}

#scroll-l, #scroll-r {
  position: absolute;
  width: 1px;
  height: 1080px;
  z-index: 190;
}
#scroll-l {
  left: 0px;
}
#scroll-r {
  right: 0px;
}

#scroll-u:not(.disable):hover {
  cursor: url('../img/scroll_up.cur'), auto;
}
#scroll-d:not(.disable):hover {
  cursor: url('../img/scroll_down.cur'), auto;
}
#scroll-l:not(.disable):hover {
  cursor: url('../img/scroll_left.cur'), auto;
}
#scroll-r:not(.disable):hover {
  cursor: url('../img/scroll_right.cur'), auto;
}

/* --------------- fade --------------- */
#fade-base {
  display: block;
  visibility: hidden;
  position: absolute;
  width: 1920px;
  height: 1080px;
  opacity: 0;
  background-color: black;
  z-index: 1200;
}
#fade-base.fade {
  visibility: visible;
  opacity: 1;
}
/* animation */
#fade-base {
  -moz-transition-property: all;
  -moz-transition-duration: 1s;
  -moz-transition-timing-function: ease-out;
  -moz-transition-delay: 0s;

  transition-property: all;
  transition-duration: 1s;
  transition-timing-function: ease-out;
  transition-delay: 0s;
}