2019-03-05 10:14:17 +00:00
|
|
|
body{
|
|
|
|
margin: 0;
|
|
|
|
}
|
|
|
|
.wrapper{
|
|
|
|
min-height: 100vh;
|
|
|
|
background: #FFFFFF;
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
}
|
|
|
|
.header {
|
2019-03-06 13:21:47 +00:00
|
|
|
height: 100px;
|
2019-03-05 10:14:17 +00:00
|
|
|
background: #FFFFFF;
|
|
|
|
color: #000000;
|
|
|
|
}
|
|
|
|
.content {
|
|
|
|
display: flex;
|
|
|
|
flex: 1;
|
|
|
|
background: #333333;
|
|
|
|
color: #000;
|
|
|
|
min-height: 0px;
|
|
|
|
max-height: 100vh;
|
|
|
|
}
|
|
|
|
.columns{
|
|
|
|
display: flex;
|
|
|
|
flex:1;
|
|
|
|
}
|
|
|
|
.main{
|
|
|
|
flex: 1;
|
|
|
|
order: 2;
|
|
|
|
background: #fff;
|
|
|
|
border: 3px solid #CCCCCC;
|
|
|
|
border-radius: 5px;
|
|
|
|
height: 400px;
|
|
|
|
margin-top: auto;
|
|
|
|
margin-bottom: auto;
|
|
|
|
}
|
|
|
|
.main section {
|
|
|
|
overflow-y: scroll;
|
2019-03-06 13:21:47 +00:00
|
|
|
height: calc(100% - 100px);
|
2019-03-05 10:14:17 +00:00
|
|
|
}
|
|
|
|
.sidebar-first{
|
|
|
|
width: 25%;
|
|
|
|
background: transparent;
|
|
|
|
order: 1;
|
|
|
|
}
|
|
|
|
.sidebar-second{
|
|
|
|
width: 25%;
|
|
|
|
order: 3;
|
|
|
|
background: transparent;
|
|
|
|
}
|