all repos — retro-website @ 1ce53a4681cf20a81c4591a518c27d0e357772a9

res/style.css (view raw)

  1@font-face {
  2    font-family: '04b_03';
  3    src: url('ttf/04b03.ttf')  format('truetype');
  4}
  5
  6#overlay {
  7    position: absolute;
  8    text-align: center;
  9    padding-top: 450px;
 10    top: 0;
 11    left: 0;
 12    width:100%;
 13    height:100%;
 14    background-color: black;
 15    z-index: 999;
 16}
 17
 18html {
 19    font-family: "04b_03";
 20    color: white;
 21    cursor: url("cur/cursor2x.cur"), auto;
 22}
 23
 24#content-iframe {
 25    height: inherit;
 26    width: 100%;
 27    border: 0px;
 28    cursor: url("cur/cursor2x.cur"), auto;
 29}
 30
 31a {
 32    cursor: url("cur/pointer2x.cur"), auto;
 33}
 34
 35img {
 36    image-rendering: pixelated;
 37}
 38
 39.center {
 40    text-align: center;
 41}
 42
 43.hover-tilt {
 44    transition: transform .1s ease-in-out;
 45    rotate: -1.5deg;
 46}
 47.hover-tilt:hover {
 48    transform: rotate(3deg);
 49}
 50
 51#main-container {
 52    /* width: calc(100% / 2); */
 53    height: 100%;
 54    width: 800px;
 55    margin: auto;
 56}
 57
 58.shadow {
 59    text-shadow: 1px 1px #000000;
 60}
 61
 62#menu-div {
 63    text-align: center;
 64    background-image: url("img/orange-banner.jpg");
 65    background-size: cover;
 66    color: white;
 67    padding:15px;
 68    margin-top: -18px;
 69}
 70
 71#menu-div a {
 72    color: white;
 73    text-decoration: none;
 74}
 75
 76#menu-div h1 {
 77    margin-left: 18px;
 78}
 79
 80.menu-item {
 81    text-align: center;
 82    display: inline-block;
 83    width: 118px;
 84}
 85
 86.menu-item img {
 87    height: 50px;
 88    margin: auto;
 89    display: block;
 90}
 91
 92#music-player {
 93    position: fixed;
 94    left: 5px;
 95    height: 66px;
 96    image-rendering: pixelated;
 97    transition: bottom .4s ease-in-out;
 98}
 99
100#music-player-base {
101    float: left;
102    width: 114px;
103    height: 66px;
104    background-color: #141414;
105    background-image: url("img/player_pause.png");
106    background-size: contain;
107}
108
109#music-player-song {
110    position: relative;
111    float: right;
112    height: 66px;
113    min-width: 700px;
114    margin-left: 5px;
115    background-color: #141414;
116    background-image: url("img/player_song.png");
117    background-size: 100% 100%;
118    transition: top .4s ease-in-out;
119}
120
121#song-text {
122    position: relative;
123    font-weight: 700;
124    color: black;
125    margin: 10px;
126    top: 30%;
127}
128
129.player-play {
130    background-image: url("img/player_play.png")!important;
131}
132
133#music-player-overlay {
134    width: 100%;
135    height: 100%;
136    background-image: url(img/player_overlay.png);
137    cursor: url("cur/pointer2x.cur"), auto;
138    background-size: contain;
139}