@charset "UTF-8";

html, body {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 16px;
	
	/*background: #aebdc2;
	background: -moz-linear-gradient(45deg, #aebdc2 2%, #f4f6f5 100%);
	background: -webkit-gradient(linear, left bottom, right top, color-stop(2%,#aebdc2), color-stop(100%,#f4f6f5));
	background: -webkit-linear-gradient(45deg, #aebdc2 2%,#f4f6f5 100%);
	background: -o-linear-gradient(45deg, #aebdc2 2%,#f4f6f5 100%);
	background: -ms-linear-gradient(45deg, #aebdc2 2%,#f4f6f5 100%);
	background: linear-gradient(45deg, #aebdc2 2%,#f4f6f5 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aebdc2', endColorstr='#f4f6f5',GradientType=1 );
	*/
	
	margin: 0;
	padding: 0;
	color:#FFF;
}

body {
	background-attachment: fixed;
	background-image: url(background-akbal.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	background-size:100% 100%;
}

a {
	color: #FFF;
	text-decoration:none;
}

#sidebar {
	width: 20%;
	height: 100%;
	box-shadow: 2px 0px 10px #333;
	top: 0;
	right: 0;
	position:fixed;
	box-sizing:border-box;
}

#sidebar #bg {
	position:absolute;
	background-color: #333;
	opacity: 0.0;
	width:100%;
	height:100%;
}

#sidebar #sc {
	height:100%;
	position:absolute;
	top:0;
	left:0;
	right: 0;
	padding: 20px;
	text-align:center;
}

#menu {
	list-style-type: none;
	float:right;
	margin-right: 20%;
}

#menu li {
	display: inline-block;
	padding: 10px;
}

#menu li a {
	text-decoration:none;
	font-size: 30px;
	font-weight:500;
	color:#FFF;
}

#top {
	
}

#logo {
	margin-left:5%;
	width: 30%;
	max-width: 450px;
}

#content {
	width: 80%;
	padding: 25px;
	box-sizing:border-box;
}

.box {
	width:22%;
	margin: 1.5%;
	border: 10px solid #f4f6f5;
	box-shadow: 3px 3px 10px #333;
	box-sizing:border-box;
}

.red {
	background: #a90329;
	background: -moz-linear-gradient(45deg, #a90329 0%, #8f0222 44%, #6d0019 100%);
	background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019));
	background: -webkit-linear-gradient(45deg, #a90329 0%,#8f0222 44%,#6d0019 100%);
	background: -o-linear-gradient(45deg, #a90329 0%,#8f0222 44%,#6d0019 100%);
	background: -ms-linear-gradient(45deg, #a90329 0%,#8f0222 44%,#6d0019 100%);
	background: linear-gradient(45deg, #a90329 0%,#8f0222 44%,#6d0019 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=1 );
}

.green {
	background: #a4b357;
	background: -moz-linear-gradient(45deg, #a4b357 0%, #75890c 100%);
	background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#a4b357), color-stop(100%,#75890c));
	background: -webkit-linear-gradient(45deg, #a4b357 0%,#75890c 100%);
	background: -o-linear-gradient(45deg, #a4b357 0%,#75890c 100%);
	background: -ms-linear-gradient(45deg, #a4b357 0%,#75890c 100%);
	background: linear-gradient(45deg, #a4b357 0%,#75890c 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4b357', endColorstr='#75890c',GradientType=1 );
}