@charset "UTF-8";

* {
  box-sizing: border-box;
}

html, body {
    height: 100vh;
}

.layout-views {
    text-align: right;
}

.layout-nav {
    background-color: #e8e8e8;
    width: 64px;
}

.layout-nav img {
    height: 32px;
    width: 32px;
}

.layout-list {
    background-color: #f0f0f0;
    width: 30%;
}

.layout-info {
    background-color: #e8e8e8;
    width: calc(70% - 64px);
}



/* Small devices (portrait phones, up to 320px) */
@media (min-width: 320px) {
}

/* Medium devices (landscape phones, up to 576px) */
@media (min-width: 576px) {
}

/* Medium devices (tablets, up to 768px) */
@media (min-width: 768px) {
}

/* Large devices (desktops, up to 992px) */
@media (min-width: 992px) {
}

/* Extra large devices (large desktops, up to 1200px) */
@media (min-width: 1200px) {
}

/* Ultra large devices (large desktops, above 1200px) */
@media (min-width: 1200px) {
}