
#menu-bar {
  background: #4c5773; /* fallback for old browsers */
  /* background: -webkit-linear-gradient(to right, #4c5773, #4c5773, #c06c84); /* Chrome 10-25, Safari 5.1-6 */
  /* background: linear-gradient(to right, #4c5773, #4c5773, #c06c84); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

#mobile-menu {
	background-color: #202e3a;
}


@media screen and (min-width: 1024px) and (max-width: 6000px){

	.submenu-leftbar {

		padding-right: 0;
		min-height: 100%;
		
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;	
		-webkit-appearance: none;
	}

	.newspaper {
		width:25%;
		text-align: center;
		float: left;

		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;	
		-webkit-appearance: none;

		-webkit-transition: all .25s;
		   -moz-transition: all .25s;
			-ms-transition: all .25s;
			 -o-transition: all .25s;
				transition: all .25s;

	}

	.newspaper img {
		padding: 10px;
		display: block; 
		margin: auto; 
		width:70px;
	}
	
	
	
	.menu-header {
		border-bottom: 2px #3e4e5b solid; color:#3e4e5b; font-weight: 700; padding: 0px 5px 10px 5px; text-transform: uppercase; 

		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;	
		-webkit-appearance: none;

		-webkit-transition: all .25s;
		   -moz-transition: all .25s;
			-ms-transition: all .25s;
			 -o-transition: all .25s;
				transition: all .25s;
	}

	div.menu-button {
		font-family: 'Poppins', sans-serif;
		padding:30px;
		color:#fff;
		text-transform:capitalize;
		font-size:15px;
		font-weight:700;

		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;	
		-webkit-appearance: none;
		cursor:pointer;
		text-align: center;

		-webkit-transition: all .25s;
		   -moz-transition: all .25s;
			-ms-transition: all .25s;
			 -o-transition: all .25s;
				transition: all .25s;
	}

	div.menu-button span:hover {

		-webkit-transition: all .25s;
		   -moz-transition: all .25s;
			-ms-transition: all .25s;
			 -o-transition: all .25s;
				transition: all .25s;
	}
	
	.icon-circle {
		width: 100px;
		height: 100px;
		border-radius: 50%;
		background-color: transparent;
		border:4px #fff solid;
		align-items: center;
		display: flex;
		text-align: center;
		justify-content: center;
		margin: auto;
		margin-bottom: 5px;
		color:#fff;
	
		-webkit-transition: all .25s;
		   -moz-transition: all .25s;
			-ms-transition: all .25s;
			 -o-transition: all .25s;
				transition: all .25s;
	
	}
	
	.icon-circle:hover {
		width: 100px;
		height: 100px;
		border-radius: 50%;
		background-color: #fff;
		border:4px #fff solid;
		color:#292929;
		align-items: center;
		display: flex;
		text-align: center;
		justify-content: center;
		margin: auto;
		margin-bottom: 5px;
	
		-webkit-transition: all .25s;
		   -moz-transition: all .25s;
			-ms-transition: all .25s;
			 -o-transition: all .25s;
				transition: all .25s;
	
	}

	.icon-circle i {
		font-size: 44px;
		margin: auto; 
		text-align: center;
	}
}

@media screen and (min-width: 0px) and (max-width: 1024px){

	.submenu-leftbar {
		
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;	
	-webkit-appearance: none;
		
	}
	
	.newspaper {
		width:100%;
		text-align: center;

		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;	
		-webkit-appearance: none;

		-webkit-transition: all .25s;
		   -moz-transition: all .25s;
			-ms-transition: all .25s;
			 -o-transition: all .25s;
				transition: all .25s;

	}
	.newspaper img {
		display: none;
	}
	
	.menu-header {
		border-bottom: 2px #3e4e5b solid; color:#3e4e5b; font-weight: 700; padding-bottom: 10px; text-transform: uppercase; 
		text-align: center;

		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;	
		-webkit-appearance: none;

		-webkit-transition: all .25s;
		   -moz-transition: all .25s;
			-ms-transition: all .25s;
			 -o-transition: all .25s;
				transition: all .25s;
	}

	div.menu-button {
		font-family: 'Poppins', sans-serif;
		padding:15px 0px;
		color:#fff;
		text-transform:capitalize;
		font-size:16px;
		font-weight:700;
		filter: grayscale(100%);

		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;	
		-webkit-appearance: none;
		cursor:pointer;
		text-align: center;

		-webkit-transition: all .25s;
		   -moz-transition: all .25s;
			-ms-transition: all .25s;
			 -o-transition: all .25s;
				transition: all .25s;
	}

	div.menu-button:hover {

		background-color: #0E161D;
		border-radius: 10px;
	}
	
	.icon-circle {
		display: none;
	}
}


.Count_notification {
	/* notification */
	background-color: #fa3e3e;
	border-radius: 10px;
	color: white;

	padding: 1px 7px;
	font-size: 11px;

	position: absolute; /* Position the badge within the relatively positioned button */
	top: 12px;
	right: 13px;
}    

.button-box {
    display: inline-block;
    cursor: pointer;
	padding: 10px 0px
}

.bar1, .bar2, .bar3 {
    width: 35px;
    height: 5px;
    background-color: #fff;
    margin: 6px 0;
    transition: 0.4s;
	border-radius: 10px;
}

.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px) ;
    transform: rotate(-45deg) translate(-9px, 6px) ;
}

.change .bar2 {opacity: 0;}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px) ;
    transform: rotate(45deg) translate(-8px, -8px) ;
}

#menu-bar .signout-button {
	
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;	
	-webkit-appearance: none;
	cursor:pointer;
	
	padding:18px 12px;
	position:relative;
	line-height: 24px;
	
	background-color:#292929; 
	width:70px; 
	height:60px;
	color:#fff;
	text-transform:uppercase;
	font-size:24px;
	font-weight:700;
	float:right;
	text-align:center;

	-webkit-transition: all .25s;
	   -moz-transition: all .25s;
		-ms-transition: all .25s;
		 -o-transition: all .25s;
			transition: all .25s;

}

#menu-bar .signout-button:hover {
	background-color:#971012; 
}

#menu-bar .smallmenu-header {
	
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;	
	-webkit-appearance: none;
	cursor:pointer;
	
	font-family: 'Poppins', sans-serif;
	width:auto; 
	height:24px;
	padding:12px 10px 1px 10px;
	color:#fff;
	text-transform:uppercase;
	font-size:24px;
	font-weight:700;
	float:left;
	text-align:left;

	-webkit-transition: all .25s;
	   -moz-transition: all .25s;
		-ms-transition: all .25s;
		 -o-transition: all .25s;
			transition: all .25s;
}


#menu-bar .smallmenu-button {
	
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;	
	-webkit-appearance: none;
	cursor:pointer;
	
	padding:18px 12px;
	position:relative; 
	line-height: 24px;
	
	font-family: 'Poppins', sans-serif;
	width:70px; 
	height:60px;
	color:#fff;
	text-transform:uppercase;
	font-size:24px;
	font-weight:700;
	float:left;
	text-align:center;

	-webkit-transition: all .25s;
	   -moz-transition: all .25s;
		-ms-transition: all .25s;
		 -o-transition: all .25s;
			transition: all .25s;

}
	
#menu-bar .smallmenu-button:hover {
	background-color:#202e3a; 
}

#menu-bar .smallmenu-seperator {
	border-left: 3px #fff solid; 
	height: 30px; 
	width:0px; 
	margin: 15px 10px; 
	float: right; 
	display: inline-block;
	border-radius: 20px;
}

#menu-bar .smallmenu-lines {
	
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;	
	-webkit-appearance: none;
	cursor:pointer;
	
	padding:0px 10px;
	position:relative; 
	line-height: 24px;
	
	font-family: 'Poppins', sans-serif;
	width:70px; 
	height:60px;
	color:#fff;
	text-transform:uppercase;
	font-size:24px;
	font-weight:700;
	float:left;
	text-align:center;

	-webkit-transition: all .25s;
	   -moz-transition: all .25s;
		-ms-transition: all .25s;
		 -o-transition: all .25s;
			transition: all .25s;

}
	
#menu-bar .smallmenu-lines:hover {
	background-color:#202e3a; 
}

/* Account */

div.account {
	width:100%; 
	text-align:center;
	padding:20px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;	
	-webkit-appearance: none;

	-webkit-transition: all .25s;
	   -moz-transition: all .25s;
		-ms-transition: all .25s;
		 -o-transition: all .25s;
			transition: all .25s;
}


div.account img {
	border-radius:200px;
	margin:auto;
	width:100%;
	max-width:180px;
	border:5px solid rgba(101, 109, 121, 0.2);
}

div.account h1 {
	font-family: 'Poppins', sans-serif;
	margin:0;
	padding-top:4px;
	color:#fff;
	font-size:23px;
}
div.account p {
	font-family: 'Poppins', sans-serif;
	margin:0;
	padding-bottom:4px;
	color:#fff;
	opacity:0.5;
	font-size:15px;
}