:root{
	--backgroundColorD		:	#f6f5fd;
	--backgroundColorL		:	#FFFFFF;
	--textColorD			:	#000000;
	--textColorL			:	#FFFFFF;
	--textColorDisable		:	#cccccc;
	--textColorOne			:	#232e3c;
	--textColorTwo			:	#4d5969;
	--textColorThree		:	#9da9bb;
	--textColorForu			:	#748194;
	--textColorFive			:	#4a4a4a;
	--actionColorD			:	#f68f19;
	--actionColorL			:	#ffac16;
	--menuBgColorL			:	#f9fafd;
	--menuBgColorD			:	#d8e2ef;
	--menuBorderColor		:	#d8e2ef;
	--actionPopupColor		:	#fff1d0;
	--actionTextColor		:	#c44000;
	--PositiveColorD		:	#77c81d;
	--positiveColorL		:	#7ed321;
	--negativeColorD		:	#d43f3a;
	--negativeColorL		:	#d9534f;
	--disableColor			:	#cccccc;
	--highlightColor		:	#086ed1;
	--standardColor			:	#6f7275;
	--acceptColor			:	#108843;
	--rejectColor			:	#ee0000;
	--pendingColor			:	#e9730a;
	--submitColorL			:	#6cc856;
	--submitColorD			:	#5bc142;
	--submitColorTwo		:	#098346;
	--supportColor			:	#006063;
	--LinkColor				:	#4581fd;
	--addColorL				:	#449944;
	--addColorD				:	#3e8f40;
	--removeColorL			:	#d14643;
	--removeColorD			:	#bb2a27;
	--infoColorL			:	#43b5d9;
	--infoColroD			:	#2aa4c9;
	--warningColorL			:	#eea846;
	--warningColorD			:	#e68d17;
	--primaryColorL			:	#4188c6;
	--primaryColorD			:	#2a669a;
	--logoColor				:	#f68f19;
	--logoBgColorL			:	#3f4551;
	--logoBgColorD			:	#2f333f;
}
@font-face{
	font-family: fontBone;
	src: url(../fonts/fontBone.ttf);
}
@font-face{
	font-family: fontBtwo;
	src: url(../fonts/fontBtwo.ttf);
}
@font-face{
	font-family: fontEone;
	src: url(../fonts/Poppins-Regular.ttf);
}
@font-face{
	font-family: fontEtwo;
	src: url(../fonts/Roboto-Regular.ttf);
}
@font-face{
	font-family: fontEthree;
	src: url(../fonts/Roboto-Thin.ttf);
}
*,*::before,*::after{
	margin:0;
	padding:0;
	list-style-type:none;
	box-sizing:border-box;
}
img{
	width:100%;
	height:auto;
	/*vertical-align:middle;*/
}
video{
	width:100%;
	height:auto;
	/*vertical-align:middle;*/
}
.width-box{
	width:980px;
	margin: 0 auto;
}
body{
	height:100vh;
	width:100vw;
	display:flex;
	justify-content:center;
	align-items:center;
	background-color:var(--menuBgColorL);
}
/*=================
	Login Section
===================*/
#login_section{
	width:100%;
	clear:both;
}
.inside_login{
	background-color: var(--menuBgColorL);
}
.login_part{
	overflow:auto;
	display:flex;
	justify-content:center;
	padding:20px;
}
form{
	display:flex;
	flex-flow: column wrap;
	background-color:var(--backgroundColorL);
	width:400px;
	padding:20px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, .05), 0 4px 8px rgba(0, 0, 0, .05);
}
form img{
	width:250px;
	margin: 0 auto;
	margin-bottom:20px;
}
input[type='text']{
	text-transform:uppercase;
}
input{
	font-family: fontBtwo;
	outline:none;
	margin-bottom:10px;
	font-size: 20px;
	padding: 5px 10px;
}
input[type="submit"]{
	background-color:var(--actionColorD);
	border-color: var(--actionColorD);
	color:var(--textColorL);
	cursor: pointer;
	font-family: fontBtwo;
}
/*=================
	Responsive
===================*/

@media screen and (max-width:980px){
	.width-box{
		width:100%;
	}
	form{
		width:400px;
		padding:20px;
	}
}
@media screen and (max-width:450px){
	form{
		width:100%;
		padding:50px 10px;
	}
	form img{
	width:230px;
	}
}
@media screen and (max-width:300px){
	form img{
		width:80%;
	}
	input{
		width:98%;
	}
}