html{
background: url('../img/bg.jpg');
background-attachment: fixed;
background-size: cover;
}
.app.container{
padding-left: 0;
padding-right: 0;
}
@media (min-width: 768px) {
.app.container{
width: 750px;
.box-shadow(0 0 30px rgba(0,0,0,0.3));
.app-aside{
overflow-x: hidden;
}
&.app-aside-folded{
.app-aside{
overflow-x: visible;
}
}
&.app-aside-fixed{
.aside-wrap{
left: inherit;
}
&.app-aside-folded{
.app-aside{
> ul.nav{
position: absolute;
}
}
}
}
.app-header,
.app-aside{
max-width: 750px;
}
.app-footer-fixed{
left: auto;
right: auto;
width: 100%;
max-width: 750 - @app-aside-width;
}
&.app-aside-folded{
.app-footer-fixed{
max-width: 750 - @app-aside-folded-width;
}
}
&.app-aside-dock{
.app-footer-fixed{
max-width: 750px;
}
}
}
}
@media (min-width: 992px) {
.app.container{
width: 970px;
.app-header,
.app-aside{
max-width: 970px;
}
.app-footer-fixed{
max-width: 970 - @app-aside-width;
}
&.app-aside-folded{
.app-footer-fixed{
max-width: 970 - @app-aside-folded-width;
}
}
&.app-aside-dock{
.app-footer-fixed{
max-width: 970px;
}
}
}
}
@media (min-width: 1200px) {
.app.container{
width: 1170px;
.app-header,
.app-aside{
max-width: 1170px;
}
.app-footer-fixed{
max-width: 1170 - @app-aside-width;
}
&.app-aside-folded{
.app-footer-fixed{
max-width: 1170 - @app-aside-folded-width;
}
}
&.app-aside-dock{
.app-footer-fixed{
max-width: 1170px;
}
}
}
}