*{
	margin:0;
	padding:0;
	box-sizing:border-box;
	list-style:none;
	text-decoration:none;
	font-family:Arial, Helvetica, sans-serif;
}
body{
	background-color:#f7f7f7;
}

/*--Popup message--*/
.msg-div{background:#f4f4fd; color:; width:400px; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); border-radius:10px; text-align:center; 
	border:solid black 2px; z-index:9999; padding:10px;}
#okIcon{color:green; font-size:100px;}
#NotokIcon{color:red; font-size:100px;}
#usrid{display:none;}
.btnPopup{background:dodgerblue; color:white; font-size:20px; padding:5px 20px; cursor:pointer; transition:1s;}
.btnPopup:hover{background:white; color:dodgerblue; transition:1s;}


@media(max-width:768px){
    .msg-div{width:300px;}
}

.header{
	background:#883333;
	width:100%;
	min-height:50px;
}
#loader{width:150px; height:150px; position:fixed; top:50%; left:50%; z-index:10; transform:translate(-50%,-50%);}
.brand{
	background:#883333;
	width:55%;
	height:50px;
	line-height:50px;
	text-align:left;
	float:left;
}
.brand img{width:30px; height:30px;float:left; margin:10px 10px 5px 40px;}
.brand h3{color:white; float:left;}
.brand i{font-size:30px; color:white; margin:10px 25px; float:right; display:none;}


.notification{
	background:;
	width:25%;
	height:50px;
	float:left;
}
.notifDiv{
	background:;
	height:50px;
	width:33%;
	float:right;
	position:relative;
	text-align:center;
}
.notifDiv i{
	font-size:30px;
	color:white;
	margin-top:10px;
}
.nodi{
	background:red;
	width:30px;
	height:30px;
	line-height:30px;
	border-radius:50%;
	font-size:17px;
	color:white;
	text-align:center;
	position:absolute;
	top:2px;
	left:40px;
	display:none;
}
.notifiDiv{
	background:red;
	width:50px;
	height:50px;
	border-radius:50%;
	position:absolute;
	top:10px;
	left:10px;
}
.user-div{
	background:;
	width:20%;
	height:50px;
	float:left;
	text-align:right;
	padding-right:20px;
}
.user-div i{
	color:#fff;
	font-size:40px;
	margin-top:5px;
}
.outr{
	background:;
	min-width:50px;
	min-height:50px;
	position:absolute;
	top:45px;
	right:20px;
	z-index:11;
	overflow:hidden;
}
.innr{
	display:none;
	background:#252625;
	min-width:40px;
	min-height:40px;
	position:absolute;
	top:8px;
	right:-12px;
	z-index:12;
	transform:rotate(60deg);
}

#user-details{
	display:none;
	background:#252625;
	color:white;
	min-width:300px;
	height:auto;
	position:absolute;
	top:60px;
	right:20px;
	z-index:10;
	text-align:left;
	padding:10px 20px 10px 10px;
	border-radius:5px;
}
#user-details p{
	height:30px;
	margin:0;
	padding:0;
}
#user-details a{
	background:#fff;
	float:right;
	color:blue;
	font-size:15px;
	padding:4px 10px;
	border-radius:4px;
	transition:1s;
	margin:20px 10px 10px 0;
}
#user-details a:hover{
	background:blue;
	color:#fff;
	transition:1s;
	margin-right:0px;
}
#signout{font-size:15px; color:blue; transition:1s;}
#user-details a:hover #signout{color:white; transition:1s;}
.statusDiv1{background:white; width:26px; height:26px; margin-left:10px; padding:3px;}
.statusDiv2{width:20px; height:20px; border-radius:50%;}

.container{background:#f7f7f7; width:100%; min-height:90vh; position:absolute;}
	nav{background:#2b4d2a; width:18%; min-height:33rem; float:left; z-index:10000;}
		nav ul{list-style:none;}
		nav ul li{background:#2b4d2a;  z-index:10000; padding:.3vw 1vw; border-bottom:solid orange 1px; color:white; transition:0.5s; font-size:1.3vw; cursor:pointer;}
		nav ul li i{margin:0 .4vw;}
		nav ul li a{text-decoration:none; color:white; transition:0.5s;}
		nav ul li a:hover{color:orange; transition:0.5s;}
		nav ul li:hover{color:orange; transition:0.5s;}
		.submenu{background:; height:0px; padding:0 1vw; overflow:hidden; transition:2s;}
			.submenu ul li{height:35px; border-bottom:solid #ededed 1px; }
			.submenu ul li a{text-decoration:none; color:#ededed; font-size:1.1vw; transition:1s;}
			.submenu ul li a:hover{margin-left:10px; transition:1s; color:orange;}
	

.user{
	background:#bb8207;
	width:100%;
	text-align:center;
}
.user img{
	width:90px;
	height:90px;
	border-radius:50%;
	border:solid gray 1px;
	margin:3px;
}
.user h3{
	background:#803300;
	color:white;
	padding:5px;
	border-top:solid white 1px;
}
.user p{
	background:#803300;
	color:white;
	padding:5px;
	border-top:solid white 1px;
}



.content{
	background:#f7f7f7;
	width:82%;
	min-height:90vh;
	float:left;
	border-left:solid #c4c4c4 1px;
	padding-left:-1px;
}
.head{
	background:#f7f7f7;
	width:100%;
	min-height:50px;
	float:left;
	display:inline-block;
}
.title{
	background: #41403f;
	color:white;
	width:21%;
	height:40px;
	line-height:40px;
	text-align:center;
	float:left;
}
.title p{
	font-size:17px;
	font-weight:bold;
}
.msg{
	background:#fafbfb;
	width:79%;
	height:40px;
	line-height:40px;
	text-align:center;
	float:left;
	padding:0px 30px;
}
marquee{
	font-size:20px;
	letter-spacing:0.8px;
	 z-index:2;
}
.data-content{
	border-left:solid #c4c4c4 1px;
	margin-left:-1px;
}

#blue{background:blue; color:white; padding:3px 4px; border-radius:5px; font-weight:bold;}
#green{background:green; color:white; padding:3px 4px; border-radius:5px; font-weight:bold;}
#red{background:red; color:white; padding:3px 4px; border-radius:5px; font-weight:bold;}



.footer{
	background:#883333;
	width:100%;
	text-align:center;
	float:left;
	padding:10px;
	color:white;
}