body	{
	background: #ECEAEA;
	font-family:	open sans;
	font-size:	16px;
}

/*------------------------------*/
/******** BEGIN HEADER **********/
/*______________________________*/



#page_nav	{
	width:	100%;
	height:	40px;
	z-index:	10000;
	position:	fixed;
	top:	0px;
	left:	0px;
	right:	0px;
	box-sizing:	content-box;
	/*box-shadow:	0px 0px 5px rgba(0,0,0,.8);*/
	border-bottom:	1px solid rgba(0,0,0,.3);
}

#page_nav>.background	{
	background:	white;
	height:	40px;
	width:	100%;
}

#leftNavBtn	{
	padding:	8px 8px;
	height:	21px;
	width:	22px;
	padding-top:	11px;
	box-sizing:	content-box;
}

#leftNavBtn:hover	{
	background:	#ECEAEA;
}

#leftNavBtn .line	{
	padding-top:	5px;
	border-top:	2px solid #6D1717;
}

#userNav	{
	float:	right;
	padding-right:	8px;
	height:	40px;
}

#userNav .login	{
	line-height:	38px;
	padding-bottom:	2px;
	float:	left;
	padding-right:	10px;
	color:	#6D1717;
}

#userNav .link	{
	float:	left;
	height: 30px;
	width: 30px;
	background:	#6D1717;
	border-radius:	3px;
	margin:	5px;
	margin-right:	0px;
	box-sizing:	content-box;
	position:	relative;
}


#userNav .link .numNotifications	{
	line-height:	28px;
	height:	28px;
	font-size:	.5em;
	position:	absolute;
	z-index:	10;
	top:	0px;
	width:	30px;
	padding-top:	1px;
	left:	0px;
	text-align:	center;
	color:	#6D1717;
}

#userNav .link:hover .numNotifications	{
	color:	#DBD1D1;
}

#userNav .link img	{
	width:	30px;
	height:	30px;
}

#userNav .link:hover	{
	background:	#DBD1D1;
}

#leftNavBtn	{
	float:	left;
}

#pageLogo	{
	float:	left;
	height:	40px;
	padding-left:	10px;
	padding-right:	10px;
}

#pageLogo:hover	{
	background:	#ECEAEA;
}

#pageLogo .logoText	{
	line-height:	38px;
	float:	left;
	color:	#6D1717;
}

#pageLogo .logoImage	{
	float:	left;
	height:	25px;
	width:	auto;
	padding-top:	7.5px;
	padding-left:	10px;
	box-sizing:	content-box;
}

#page_nav .login	{

}

#notificationsDrop	{
	font-size:	.8em;
	position:	fixed;
	z-index:	100;
	top:	40px;
	right:	-300px;
	width:	100%;
	max-width:	300px;
	background:	#ECEAEA;
	border-left:	1px solid rgba(0,0,0,.1);
	bottom:	0px;
	box-shadow:	-.5px 1px 0px rgba(0,0,0,.2);
	overflow:	auto;
	 -webkit-transition: right 0.3s ease-out;  /* Chrome 1-25, Safari 3.2+ */
     -moz-transition: right 0.3s ease-out;  /* Firefox 4-15 */
       -o-transition: right 0.3s ease-out;  /* Opera 10.50–12.00 */
          transition: right 0.3s ease-out;  /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
}

#notificationsDrop.active	{
	right:	-20px;
}

#notificationsDrop>.notification{
	height:	60px;
	padding-right:	30px;
	border-bottom:	1px solid rgba(0,0,0,.1);
	background:	#ECEAEA;
	line-height:	60px;
	white-space:	no-wrap;
	overflow:	hidden;
	/*text-overflow: ellipsis;*/
	box-sizing:	border-box;
	padding-left:	10px;
	cursor:	pointer;
}

#notificationsDrop>.notification.unread{
	background:	white;
}

#notificationsDrop>.notification:hover	{
	background:	#E7E4E4;
}

#notificationsDrop>.notification.unread:hover	{
	background:	#FCFAFA;
}

/******* MAIN MENU **********/

#mainMenu	{
	font-size:	.8em;
	position:	fixed;
	z-index:	100;
	top:	40px;
	left:	-300px;
	width:	100%;
	max-width:	300px;
	background:	#ECEAEA;
	border-right:	1px solid rgba(0,0,0,.1);
	bottom:	0px;
	box-shadow:	-.5px 1px 0px rgba(0,0,0,.2);
	overflow:	auto;
	 -webkit-transition: left 0.3s ease-out;  /* Chrome 1-25, Safari 3.2+ */
     -moz-transition: left 0.3s ease-out;  /* Firefox 4-15 */
       -o-transition: left 0.3s ease-out;  /* Opera 10.50–12.00 */
          transition: left 0.3s ease-out;  /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
}

#mainMenu.active	{
	left:	0px;
}

#mainMenu .menuItem{
	height:	60px;
	padding-right:	10px;
	border-bottom:	1px solid rgba(0,0,0,.1);
	background:	#ECEAEA;
	line-height:	60px;
	white-space:	no-wrap;
	overflow:	hidden;
	/*text-overflow: ellipsis;*/
	box-sizing:	border-box;
	padding-left:	10px;
	cursor:	pointer;
	color:	black;
}

#mainMenu .menuItem:hover	{
	background:	#E7E4E4;

}


.col3	{
	width:	30%;
	box-sizing:	border-box;
	padding:	15px;
	float:	left;
}

.col7	{
	width:	70%;
	box-sizing:	border-box;
	padding:	15px;
	float:	left;
}

.col5	{
	width:	50%;
	box-sizing:	border-box;
	padding:	15px;
	float:	left;
}

.col10	{
	width:	100%;
	box-sizing:	border-box;
	padding:	15px;
}

.col3, .col7, .col5, .col10	{
	
}

.clearLeft	{
	clear:	left;
}
			

@media (max-width: 700px) {
	.col3, .col7, .col5	{
		width:	100%;
	}
}





@media (max-width: 500px) {
	#userNav .login.name	{
		display:	none;
	}
	#pageLogo .logoImage	{
		display:	none;
}

}


/*------------------------------*/
/********** END HEADER **********/
/*______________________________*/



.submitStyle	{
	background:	#ECEAEA;
	border:	1px solid rgba(0,0,0,.2);
	border-radius:	5px;
	padding:	5px;
	float:	right;
	margin-right:	10px;
	font-size:	.9em;
}

.submitStyle:hover	{
	background:	#E7E4E4;
}

html body .label  {
                display: inline;
                padding: .2em .6em .3em;
                padding-bottom:	10px;
                font-size: 75%;
                font-weight: bold;
                line-height: 32px;
                color: #aaa;
                text-align: center;
                white-space: nowrap;
                vertical-align: baseline;
                border-radius: .25em;
            }



