/**
*  	schoolinfo
*	webapp
*	responsive design template 2
*	Design: Luca FRICK, 2014
*	Authors: Luca FRICK, Andy MOSER
*	Edited: 18.04.2014
**/
*{
	border-radius:0px !important;
}
body {
	margin: 0;
	font-family: 'Open Sans',Arial,sans-serif;
	background-color:#444;
}

.sidebar {
	position: fixed;
	height: 100%;
	width: 200px;
	background: #f00;
	background: #444;
	font-size: 15px;
}

.sidebar_scroll {
	width: 250px;
	height: 100%;
	overflow-y: scroll;
}
.sidebar_scroll img{
	height: 50px;
	width: 200px;
	background: #2488CF;
	margin: 0;
	padding: 0;
}
.sidebar_scroll ul {
	margin: 0;
	padding: 0;
	margin-bottom: 20px;
	margin-top: -5px; /* WTF */
}

.sidebar_scroll ul li {
	list-style-type:none;
}

.sidebar_scroll h2 {
	margin: 0;
	color: #ccc;
	font-size: 16px;
	display: block;
	width: 190px;
	background: rgba(0, 0, 0, 0.2);
	text-decoration: none;
	padding-left: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.sidebar_scroll a {
	display: block;
	height: 50px;
	width: 190px;
	color: #fff;
	line-height: 50px;
	text-decoration: none;
	padding-left: 10px;
	border-bottom: 1px solid rgba(100, 100, 100, 0.4);
}

.sidebar_scroll a:last-child {
	border: none;
}

.sidebar_scroll a:hover {
	background: #666;
}

.sidebar_scroll a:active {
	/*box-shadow: 0 0 20px #000 inset;*/
	background: #333;
}

.sidebar_scroll ul li.active a {
	background-color:#fff;
}
.sidebar_scroll ul li.active a:hover{
	background-color:#ddd;
}
.sidebar_scroll ul li.active a:active {
	background-color:#bbb;
}
.sidebar_scroll ul li.active a{
	color:#2488cf;
}
.page {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	transition: left 0.2s, width 0.2s;
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	background: #fff;
}

.overlap {
	display: none;
	position: fixed;
	left: 200px;
	top: 0;
	width: 100%;
	height: 100%;
}

.backbutton {
	display: inline-block;
	width: 50px;
	height: 50px;
	cursor: default;
	margin: 0px;
}
.backbutton:hover {
	background: rgba(255,255,255,0.2);
}
.backbutton:active {
	background: rgba(0,0,0,0.2);
}

.menu_label {
	display: inline-block;
	width: 50px;
	height: 50px;
	background: url('/core/img/btn.png');
}

.menu_label:hover {
	background: url('/core/img/btn.png') rgba(255,255,255,0.2);
}

.menu_label:active {
	background: url('/core/img/btn.png') rgba(0,0,0,0.2);
}

.checkbox {
	display: none;
}

.checkbox:checked ~ .page{
	left: 200px;
}

.checkbox:checked ~ .overlap{
	display: block;
}

#header {
	height: 50px;
	background: #2488cf;
	white-space: nowrap;
}

.header_content_box {
	float:left;
	height: 50px;
	overflow: hidden;
	white-space: nowrap;
}

.header_content_box.hide_login_button_right:after {
	display: none;
}

.header_content_box.show_login_button_right:after {
    content: '';
    width: 20px;
    height: 50px;    
    position: absolute;
    right: 50px;
    top: 0;
    background: linear-gradient(90deg, rgba(36, 136, 207, 0), #2488cf);
}

.header_content_box.hide_login_button_right {
	width: 100%;
}

.header_content_box.show_login_button_right {
	width: calc(100% - 50px);
}

.header_text_box {
	vertical-align: top;
	display: inline-block;
	height: 50px;
	padding-left: 5px;
}

.header_text {
	display: inline;
	line-height: 50px;
	font-weight: 100;
	font-size: 25px;
	color: #fff;
}

.header_btn_right {
	float: right;
	display: block;
	width: 50px;
	height: 50px;
	cursor: default;
}

.header_btn_right:hover {
	background: rgba(255,255,255,0.2);
}
.header_btn_right:active {
	background: rgba(0,0,0,0.2);
}

.header_btn_right img {
	width: 50px;
	height: 50px;
}

.header_logged_in_hide {
	display: none;
}

.content {
	position: absolute;
	top: 50px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	background-image:url('/administrator/img/background.png');
	box-shadow: 0 0 100px #999 inset;
	padding: 10px;
	overflow: auto;
	font-size: 14px;
}


/** this is for not-mobile-devices**/
@media (min-width: 800px){
	.overlap{
		display:none;
	}
	.menu_label{
		display:none;
	}
	.page{
		left:200px;
		width:calc(100% - 200px);
	}
	.header_content_box .header_text_box:nth-child(2) {
		padding-left: 10px;
	}
}