/*  Animation and some show */
.move_design{
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #de456f;
	height: 100%;
	display: none;
}
.logo_load{
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #de456f;
	height: 100%;
}
.logo_load .ani_union{
	position: absolute;
	top: 0;
	left: 0;
}
.logo_load .one_Designer{

}


/* I added this part design segment to change the colors between pages to white since the background screen was now an image.*/
.content, .settings_content, .whole_of_settings, .user_wallet_arena p, .user_pixs_name{
    color: #ffffff;
}
/* Smallest Screens and Mobile Devices... Hand gadgets .... */
@media screen and (max-width: 860px){
	
	body, html{
		font-family: "Times New Roman", Times, Sans-serif;
		background-color: #000000;
		color: #ffffff;
	}
	
    .headings{
		height: 60px;
		top: 0;
		left: 0;
		position: fixed;
		z-index: 2;
		width: 100%;
		bottom: 0;
		text-align: center;
		background-color: #00058A;
		vertical-align: middle;
		overflow: hidden;
		margin-left: -1.28%;
	}

	.headings .top_menu{
		display: inline-block;
		text-align: center;
		padding: 3px;
		vertical-align: middle;
	}
	.headings .top_menu img{
		display: block;
		vertical-align: middle;
		height: 16px;
		width: 16px;
	}
	.headings .top_menu span{
		display: block;
		vertical-align: text-bottom;
		color: #ffffff;
	}

	.mail_box{
		background-color: red;
		padding: 3px;
		padding-left: 5px;
		padding-right: 5px;
		color: #fff;
		border-radius: 50%;
		text-decoration: none;
		position: absolute;
		margin-left: 5%;
		margin-top: -1.5%;
		vertical-align: text-top;
	}


	.headings input{
		width: 45%;
		border-radius: 40px;
		display: inline;
		margin-top: 10px;
		display: none;
		vertical-align: middle;
		height: 29px;
		padding: 5px;
	}
	.content_and_navBar{
		width: 100%;
		margin-top: 10%;
	}
	.content_and_navBar .nav_bar{
		position: fixed;
		z-index: 2;
		width: 100%;
		bottom: 0;
		text-align: center;
		background-color: #00058A;
		border-radius: 40px;
		vertical-align: middle;
		overflow: hidden;
		margin-left: -1.28%;
		display: none;

	}
	.nav_bar .side_item{
		display: block;
	}
	.nav_bar .side_item span{
		font-weight: bold;
		color: #fff;
		overflow: scroll;
		white-space: nowrap;
	}
	.nav_bar .side_item img{
		width: 30px;
		height: 30px;
		padding: 15px;
		vertical-align: middle;
	}

	/* work for storing cookies popup suggestion box and donation */
	.cookies{
		width: 70%;
		background: #1f09ef;
		color: #ffffff;
		text-align: center;
		margin-left: 15%;
		display: none;
	}
	.cookies .closure{
			margin-left: 90%;
			font-size: 23px;
			width: 25px;
			padding: 3px;
			display: block;
			border: 2px solid #aaaaaa;
			border-radius: 10px;
			text-align: center;
			font-family: arial;
			background-color: #fefefe;
			color: red;
	}
	.cookies p{
			font-family: sans-serif;
			font-weight: bold;
			font-size: 18px;
	}
	.donate_invest{
		width: 70%;
		display: none;
		position: absolute;
		top: 15%;
		left: 15%;
		background: #123456;
		color: #fefefe;
		text-align: center;
	}
	.donate_invest .closure{
			margin-left: 90%;
			font-size: 23px;
			width: 25px;
			padding: 3px;
			display: block;
			border: 2px solid #aaaaaa;
			border-radius: 10px;
			text-align: center;
			font-family: arial;
			background-color: #fefefe;
			color: red;
	}
	.donate_invest h3{
			text-align: center;
	}
	.donate_invest img{
			width: 100px;
			height: ;
	}
	.donate_invest p{
			text-align: justify;
			font-size: 20px;
			font-weight: bold;
	}
	.donate_invest button{
			border: 2px solid #aaaaaa;
			border-radius: 10px;
			text-align: center;
			font-family: arial;
			background-color: #fefefe;
			color: red;
			padding: 12px;
			font-size: 16px;
			font-weight: bold;
	}
	.suggestion_arena{
		width: 90%;
		text-align: center;
		display: block;
		position: absolute;
		background-color: #fefefe;
		margin-left: 10%;
		font-size: 16px;
		z-index: 4;
	}

	.suggestion_arena .the_section{
		padding: 20px;
		border-bottom: #000000;
		text-align: center;
	}

	.suggestion_arena .link_two{
		font-size: 17px;
		font-weight: bold;
	}

}

/* Tablets and Medium Devices and lit stuffs .... */
@media screen and (min-width: 860px){

body, html{
	font-family: "Times New Roman", Times, Sans-serif;
	background-color: #241212;
	color: #ffffff;
}

/* Nice award color #fed453  and a kind of bache or title #ed546f*/
/* Design for the top most header */

.headings{
	background-color: #00058A;
	width: 100%;
	border-radius: 40px;
	top: 0;
	position: fixed;
	z-index: 2;
}

.headings .top_menu{
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	padding: 7px;
}

.headings .top_menu img{
	display: block;
	vertical-align: middle;
	height: 25px;
	width:25px;
}
.headings .top_menu span{
	display: block;
	vertical-align: text-bottom;
	color: #ffffff;
}

.mail_box{
	background-color: red;
	padding: 3px;
	padding-left: 5px;
	padding-right: 5px;
	color: #fff;
	border-radius: 50%;
	text-decoration: none;
	position: absolute;
	margin-left: 1.5%;
	margin-top: -0.5%;
	vertical-align: text-top;
}

.headings input{
	width: 58%;
	border-radius: 40px;
	display: inline;
	margin-top: 10px;
	vertical-align: middle;
	height: 29px;
	padding: 5px;
}

/* Navigation Bar and the write-up and change scripts content on top */
.content_and_navBar{
	width: 100%;
	margin-top: 8%;
}
.nav_bar{
	float: left;
	width: 15%;
	padding: 10px;
	background-color: #00058A;
	border-radius: 40px;
	vertical-align: middle;
	position: fixed;
	z-index: 2;
}
.nav_bar .side_item{
	display: block;
	overflow: hidden;
	white-space: nowrap;
}
.nav_bar .side_item span{
	font-weight: bold;
	color: #fff;
	overflow-x: hidden;
}
.nav_bar .side_item img{
	width: 50px;
	height: 50px;
	display: inline;
	padding: 15px;
	vertical-align: middle;
}

/* work for storing cookies popup suggestion box and donation */
.cookies{
	width: 70%;
	background: #1f09ef;
	color: #ffffff;
	text-align: center;
	margin-left: 15%;
	display: none;
}
.cookies .closure{
		margin-left: 90%;
		font-size: 23px;
		width: 25px;
		padding: 3px;
		display: block;
		border: 2px solid #aaaaaa;
		border-radius: 10px;
		text-align: center;
		font-family: arial;
		background-color: #fefefe;
		color: red;
}
.cookies p{
		font-family: sans-serif;
		font-weight: bold;
		font-size: 18px;
}
.donate_invest{
	width: 70%;
	display: none;
	position: absolute;
	top: 15%;
	left: 15%;
	background: #123456;
	color: #fefefe;
	text-align: center;
}
.donate_invest .closure{
		margin-left: 90%;
		font-size: 23px;
		width: 25px;
		padding: 3px;
		display: block;
		border: 2px solid #aaaaaa;
		border-radius: 10px;
		text-align: center;
		font-family: arial;
		background-color: #fefefe;
		color: red;
}
.donate_invest h3{
		text-align: center;
}
.donate_invest img{
		width: 100px;
		height: ;
}
.donate_invest p{
		text-align: justify;
		font-size: 20px;
		font-weight: bold;
}
.donate_invest button{
		border: 2px solid #aaaaaa;
		border-radius: 10px;
		text-align: center;
		font-family: arial;
		background-color: #fefefe;
		color: red;
		padding: 12px;
		font-size: 16px;
		font-weight: bold;
}
.suggestion_arena{
	width: 90%;
	text-align: center;
	margin-left: 10%;
	display: block;
	position: absolute;
	background-color: #fefefe;
	font-size: 16px;
	z-index: 4;
}
.suggestion_arena .the_section{
	padding: 10px;
	border-bottom: #000000;
	text-align: center;
}

.suggestion_arena .link_two{
	font-size: 17px;
	font-weight: bold;
}


}