200 lines
3.0 KiB
CSS
200 lines
3.0 KiB
CSS
.container {
|
|
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
|
|
font-size: 16px
|
|
}
|
|
|
|
.columns {
|
|
overflow: hidden
|
|
}
|
|
|
|
.columns .size100 {
|
|
width: 100%;
|
|
float: left
|
|
}
|
|
|
|
.columns .size75 {
|
|
width: 75%;
|
|
float: left
|
|
}
|
|
|
|
.columns .size50 {
|
|
width: 50%;
|
|
float: left
|
|
}
|
|
|
|
.columns .size33 {
|
|
width: 33.33%;
|
|
float: left
|
|
}
|
|
|
|
.columns .size25 {
|
|
width: 25%;
|
|
float: left
|
|
}
|
|
|
|
.clearfix {
|
|
overflow: hidden;
|
|
display: block;
|
|
clear: both
|
|
}
|
|
|
|
.panel {
|
|
position: relative;
|
|
margin-bottom: 20px;
|
|
padding-top: 10px;
|
|
break-inside: avoid;
|
|
break-before: always;
|
|
break-after: always;
|
|
}
|
|
|
|
.panel .header {
|
|
background-color: #FFF;
|
|
padding: 2.5px 10px;
|
|
position: absolute;
|
|
font-weight: bold;
|
|
top: 0px;
|
|
left: 17.5px;
|
|
}
|
|
|
|
.panel .body {
|
|
border: 1px solid #CCC;
|
|
overflow: hidden;
|
|
padding: 20px
|
|
}
|
|
|
|
.panel .body h3 {
|
|
margin-top: 0
|
|
}
|
|
|
|
.panel.dark .header {
|
|
border: 1px solid #808080;
|
|
background-color: #FFF;
|
|
}
|
|
|
|
.panel.dark .body {
|
|
border: 1px solid #808080;
|
|
background-color: #c0c0c0
|
|
}
|
|
|
|
.field {
|
|
border-bottom: 1px solid #CCC;
|
|
border-left: 1px solid #CCC;
|
|
border-top: 1px solid #CCC;
|
|
float: left
|
|
}
|
|
|
|
.field span {
|
|
border-right: 1px solid #CCC;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
display: table-cell;
|
|
vertical-align: middle;
|
|
text-align: center;
|
|
font-weight: bold
|
|
}
|
|
|
|
.field.square span {
|
|
height: 35.4px;
|
|
width: 35.4px
|
|
}
|
|
|
|
.pull-left {
|
|
float: left !important
|
|
}
|
|
|
|
.pull-right {
|
|
float: right !important
|
|
}
|
|
|
|
.vertical-text {
|
|
-moz-transform: rotate(90deg);
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg);
|
|
position: absolute;
|
|
text-align: center;
|
|
font-size: .65em;
|
|
right: -108px;
|
|
width: 200px;
|
|
top: 50%
|
|
}
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
border-spacing: 0;
|
|
}
|
|
|
|
.row-oriented, .column-oriented {
|
|
text-align: left;
|
|
width: 100%
|
|
}
|
|
|
|
.column-oriented {
|
|
margin: 20px 0
|
|
}
|
|
|
|
.column-oriented td,
|
|
.column-oriented th {
|
|
padding: 5px 10px
|
|
}
|
|
|
|
.column-oriented thead {
|
|
background-color: #e5e5e5
|
|
}
|
|
|
|
.column-oriented thead tr {
|
|
border-bottom: 1px solid #808080;
|
|
border-top: 1px solid #808080;
|
|
background-color: #e5e5e5
|
|
}
|
|
|
|
.column-oriented tfoot {
|
|
border-top: 2px solid #808080;
|
|
}
|
|
|
|
.column-oriented tfoot tr:first-child td {
|
|
padding-top: 20px !important;
|
|
}
|
|
|
|
.column-oriented .description {
|
|
border-bottom: 1px solid #DDD;
|
|
font-size: 0.8em
|
|
}
|
|
|
|
.panel .row-oriented td, .panel .row-oriented th {
|
|
padding: 10px 0
|
|
}
|
|
|
|
.row-oriented > tbody > tr > td {
|
|
width: 30%
|
|
}
|
|
|
|
.row-oriented > tbody > tr > th {
|
|
padding-left: 30px;
|
|
width: 70%
|
|
}
|
|
|
|
.row-oriented .description {
|
|
padding: 0 !important;
|
|
font-size: 0.6em;
|
|
color: #888
|
|
}
|
|
|
|
|
|
.line {
|
|
border-bottom: 1px solid #DDD;
|
|
border-right: 1px solid #DDD;
|
|
border-left: 1px solid #DDD;
|
|
margin-top: 10px;
|
|
color: #999;
|
|
padding: 5px
|
|
}
|
|
|
|
.line span {
|
|
background-color: #FFF;
|
|
margin: -5px 0 0 50px;
|
|
display: block;
|
|
padding: 5px;
|
|
float: left
|
|
}
|