/* IMPORTS */ @font-face { font-family: DINPro; font-weight: normal; src: url(../../res/fonts/DINPro-Light.ttf); } @font-face { font-family: DINPro; font-weight: bold; src: url(../../res/fonts/DINPro-Bold.ttf); } /* GENERAL SETUP */ * { margin: 0; padding: 0; } html, body { width: 100%; height: 100%; } body { font-family: DINPro; overflow: hidden; } /* UTILITY CLASSES */ .smooth { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } [contenteditable=true]:empty:before { content: attr(placeholder); display: block; /* For Firefox */ } /* LOGIN PANEL */ .loginPanel { width: 100%; height: 100%; top: 0%; left: 0%; display: flex; align-items: center; justify-content: center; position: fixed; z-index: 20; //background: rgba(30,30,30,.9); background: rgba(31, 45, 84, 1); } .loginPanel>div { box-shadow: 0 0 2em #000; } .loginPanel .login-logo { width: 70%; } /* MAIN FRAMEWORK */ .wrapper-main { height: 100%; width: 100%; top: 0; left: 0; } .wrapper-main.toggled { padding-left: 250px; } .wrapper-sidebar { z-index: 10; left: 250px; width: 0px; height: 100%; margin-left: -250px; overflow-y: auto; position: fixed; background: #222; color: #fff; box-shadow: 0 0 1em rgba(0, 0, 0, 0.5); } .wrapper-main.toggled .wrapper-sidebar { width: 250px; } .nav-sidebar .navbar ul { float: none; display: block; } .wrapper-sidebar .navbar li { float: none; display: block; } @media(min-width:768px) { .wrapper-main { padding-left: 250px; } .wrapper-main.toggled { padding-left: 0px; } .wrapper-sidebar { width: 250px; } .wrapper-main.toggled .wrapper-sidebar { width: 0px; } } .wrapper-sidebar ul li a { color: inherit; } .wrapper-sidebar ul li a:hover, .wrapper-sidebar ul li a:active, .wrapper-sidebar ul li a:focus { color: #000; } .wrapper-sidebar>div { padding: 1em; } .wrapper-sidebar .sidebar-logo { width: 100%; } .wrapper-content { margin-top: -20px; //height: calc(100vh - 51px); background: #eee; width: 100%; overflow: auto; } /* MAIN NAVBAR */ .navbar-main .container-fluid>ul>li { float: left; } /* LOG BAR */ .alertCont { position: fixed; z-index: 10000; left: 50%; top: 10px; transform: translateX(-50%); }