forked from flashii/eeprom
111 lines
1.7 KiB
CSS
111 lines
1.7 KiB
CSS
|
* {
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
box-sizing: border-box;
|
||
|
position: relative;
|
||
|
}
|
||
|
|
||
|
html,
|
||
|
body {
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
}
|
||
|
|
||
|
body {
|
||
|
background-color: #111;
|
||
|
color: #fff;
|
||
|
font: 12px/20px Verdana, Geneva, 'Dejavu Sans', Arial, Helvetica, sans-serif;
|
||
|
}
|
||
|
|
||
|
.eeprom {
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
display: flex;
|
||
|
justify-content: flex-start;
|
||
|
align-items: center;
|
||
|
flex-direction: column;
|
||
|
}
|
||
|
|
||
|
.eeprom-inner {
|
||
|
margin: auto;
|
||
|
}
|
||
|
|
||
|
.eeprom-header {
|
||
|
margin: 20px 0;
|
||
|
padding: 0 20px;
|
||
|
}
|
||
|
|
||
|
.eeprom-logo {
|
||
|
max-width: 590px;
|
||
|
width: 100%;
|
||
|
}
|
||
|
.eeprom-description {
|
||
|
text-align: center;
|
||
|
}
|
||
|
|
||
|
.eeprom-stats {
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
justify-content: center;
|
||
|
flex-wrap: wrap;
|
||
|
}
|
||
|
|
||
|
.eeprom-stat {
|
||
|
text-align: center;
|
||
|
margin: 10px;
|
||
|
}
|
||
|
.eeprom-stat-title {
|
||
|
font-size: 1.4em;
|
||
|
}
|
||
|
.eeprom-stat-num {
|
||
|
height: 50px;
|
||
|
display: flex;
|
||
|
flex-direction: column;
|
||
|
justify-content: center;
|
||
|
align-items: center;
|
||
|
}
|
||
|
.eeprom-stat-num-big {
|
||
|
font-size: 2em;
|
||
|
line-height: 1.2em;
|
||
|
}
|
||
|
.eeprom-stat-num-small {
|
||
|
font-size: .9em;
|
||
|
}
|
||
|
|
||
|
.eeprom-divider {
|
||
|
height: 60px;
|
||
|
background-color: #8559a5;
|
||
|
width: 1px;
|
||
|
margin: 20px;
|
||
|
}
|
||
|
|
||
|
.eeprom-footer {
|
||
|
font-size: .8em;
|
||
|
opacity: .6;
|
||
|
text-align: center;
|
||
|
margin: 20px 0;
|
||
|
padding: 0 20px;
|
||
|
}
|
||
|
|
||
|
.eeprom-footer a {
|
||
|
color: inherit;
|
||
|
text-decoration: none;
|
||
|
}
|
||
|
.eeprom-footer a:hover,
|
||
|
.eeprom-footer a:focus {
|
||
|
text-decoration: underline;
|
||
|
}
|
||
|
|
||
|
@media(max-width: 600px) {
|
||
|
.eeprom-divider {
|
||
|
display: none;
|
||
|
}
|
||
|
|
||
|
.eeprom-stat {
|
||
|
border: 1px solid #8559a5;
|
||
|
border-radius: 2px;
|
||
|
padding: 10px;
|
||
|
min-width: 200px;
|
||
|
}
|
||
|
}
|