@charset "utf-8";


/***Styling for home, sign-in, sign-up***/

/*Styling for elements*/
body{
	font-family:'lato',sans-serif,Helvetica,'Roboto','Raleway',Arial;
	height: 100%;
    margin: 0 auto;
	width: 100%;
	background-color: white;
	background-image: linear-gradient(to bottom right, rgba(28, 35, 133, 0.7), rgba(3, 1, 1, 0.664)) !important;
	background-repeat: no-repeat;
}

/*
html, body{
	font-family:Arial,Helvetica,sans-serif;	
	height: 100%;
    margin: 0 auto;
	width: 100%;
	background-color: white; 
}
*/

legend{
	color: #fff;
}

::placeholder{
	color: black !important;
	font-size: 13px !important;
	opacity: 0.9 !important;
	filter: alpha(opacity=90) !important;
}

::-ms-input-placeholder{
	color: black !important;
	font-size: 13px !important;
	opacity: 0.9 !important;
	filter: alpha(opacity=90) !important;
}

:-ms-input-placeholder{
	color: black !important;
	font-size: 13px !important;
	opacity: 0.9 !important;
	filter: alpha(opacity=90) !important;
}

:-moz-placeholder{
	color: black !important;
	font-size: 13px !important;
	opacity: 0.9 !important;
	filter: alpha(opacity=90) !important;
}

/*Styling for ids*/
#bbkg{
	/*background-image: linear-gradient(to bottom left, #036, #039) !important;
	background-image: url("../images/aciholdings.png"), url("../images/recimg.png"); */
	background-color: #f0f0f0;
	width: 100%;
	height: 100%;
	/*background-size: auto;
	background-position: center;
	position: absolute;
	background-repeat: no-repeat;*/
	margin: 0 auto;
	padding:0px;
}

#dnav{
	float: right;
	font-weight: bold;
}

#main-con{
	color: black;
	position: relative;	
	width: 100%;
	height: 100%;
	padding:30px;
	margin: 0 auto;
}

#form-con{
	background: #C41D1D;
	margin: 0 auto;
	position: relative;
	max-width: 500px;	
	padding: 5px;
	opacity: 0.7;	
	vertical-align: middle;
}

/*
#form-con{
	background: #000;	
	margin: 0 auto;
	position: relative;
	max-width: 400px;
	top: 50%;
	left: 50%;
	transform: translate(-50%);
	padding: 5px;
	opacity: 0.7;	
	vertical-align: center;
}
*/

#login-con, #signup-con, #adasst-form-con{	
	margin: 0 auto;
	position: relative;
	padding: 25px;
	color: white;	
}

#adasst-form-con{	
	margin: 0 auto;
	position: relative;
	padding: 5px 40px !important;
	color: white;
}

#adasst-form-con-con{	
	background: #C41D1D !important;
	margin: 0 auto !important;
	position: relative;
	max-width: 600px !important;
	padding: 5px;
	opacity: 0.7;
	vertical-align: middle;	
}

#asst-pcprop-con, #asstdetails-con{
	display: none;
}
#asst-brand,#asst-model,#asst-serialimei{
	background-color:lightgray;
}

#home-log{
	float: right;	
}

#card{
	opacity:0.9 !important;
	filter: alpha(opacity=90) !important;
	background: #000 !important;
	color:#fff !important;
	padding:20px !important;
	box-shadow: 5px 5px #fff !important;
}

#acct-txt{
	text-align: center;
}

#userp{
	border-right-style: none;	
}

#crt-acct{
	text-decoration: underline;
	text-decoration-style: dashed;
	cursor: pointer;
}

#log-btn{
	border-radius: 5px;
}

#pass-tip{
	background-color: #333;
	position: relative;
	right: -75%;
}

#rem-tip{
	cursor: help;
}

#rem-tip-txt{
	background-color: #333;
	position: relative;
}


#acct-ft span{
	text-decoration: underline;
	text-decoration-style: dashed;
	cursor: pointer;
	display: inline-block;
	text-align: center;
	font-size: 12px;
}

#nBtn{
	text-align: center;
}

#crtBtn{
	float: center;
	border-radius: 5px;
}

#modal-con{
	background: white;
	width: auto;
	margin: 5% auto;
}

#modal-hs{
	padding: 10px 20px 10px;
	background: #C41D1D;
	font-weight: bolder;
	font-size: 15px;
	color: white;
}

#modal-hd{
	text-transform: capitalize;
	text-align: center;
}

#modal-cls{
	float:right;
	color: red;
}

#modal-cls:hover{
	color: orangered;
	cursor: pointer;
	font-size: 150%;
}

#modal-bd{
	padding: 20px;
}

#modal-ft{
	padding: 10px 15px;
	text-align: center;
	background: #C41D1D;
	color: white;
	text-decoration: underline;
	text-decoration-style: dashed;
	cursor: pointer;
	font-size: 12px;
}

#modal-back{
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	display: none;
	position: fixed;
	padding: 100px 30%;
	background: rgba(0,0,0,0.7);
	filter: alpha(opacity=70);
	overflow: auto;
	z-index: 15;
}


/**Styling for classes**/

.other-bod{
	background-color: #f0f0f0 !important;
/*	background-image: linear-gradient(to bottom right, rgba(50,100,150,0.7), rgba(20,10,10,0.6)) !important; 
	background-image: linear-gradient(to bottom right, #bcbc,rgba(21, 30, 109, 0.8), #bcbc, rgba(21,30,109,0.8), #bcbc,rgba(21, 30, 109, 0.8), #bcbc) !important;
	background-image: linear-gradient(to bottom left, #009, #efef, #008) !important; */
	height: 100% !important;
	padding: 0px;
	margin: 0 auto;
	background-repeat: repeat !important;
}

.main-con{
	color: #C41D1D !important;
	position: relative;	
	width: 100%;
	height: 100%;
	padding:30px;
	margin: 0 auto;
}
.navcon{
	background-color: #000;
	opacity: 0.7;
	filter: alpha(opacity=70);
}

.mainnav{
	text-align: left;
	color: #fff;
	list-style-type: none;	
	padding: 20px;
}

.mainnav li{
	display: inline-block;
	padding: 0px 20px;
}

.mainnav li:hover{
	cursor: pointer;
}

.form-con{
	vertical-align:center;
}

.form-con{
	background: #000;
	margin: 0 auto;
	position: relative;
	max-width: 400px;	
	padding: 5px;
	opacity: 0.7;	
	vertical-align: middle;
}
.btns{
	border-radius: 5px;
}

.btns-err{
	background-color: red !important;
	border: red !important;
}

.btn0{
	color: yellow;
}

.nsh, .psh{
	border-left-style: none;
	cursor: pointer;
}

.tip-txt{
	color: #fff;
	border-radius: 5px;
	visibility: hidden;
	padding: 5px;
	z-index: 99;
	font-size:10px;
}

.tip-txt::after{
	content: "";
    position: absolute;
    top: 100%;
    left: 50%;
	margin-bottom: 20px;
    border-width: 5px;
    border-style: solid;
    border-color: #333 transparent transparent transparent;	
}

.showM{
	display: block;
}

.modal-right{
	top: 0px;
	right: 0px;	
}

.modal-left{
	top: 0px;
	left: 0px;	
}

.ams-busy{
	display:none;
}

@keyframes closeModal{
	from{opacity: 0.7}
	to{opacity: 0}
}

@keyframes openModal{
	from{opacity: 0}
	to{opacity: 0.7}
}

.err{
	background-color: white;
	border-radius: 1px 1px 4px 4px;
	color: red;
	display: none;
	text-align: center;
	padding: 5px 0px;
}

.txt-err{
	font-size: 12px;
}

.frm-chk{
	border-radius: 5px;
	font-size: 18px;
	text-align: center;
	padding: 5px;
	display: none;
}

/*
.modals{
	top: 0px;
	width: 100%;
	height: 100%;
	display: block;
	position: fixed;
	background: rgba(0,0,0,0.5);
	filter: alpha(opacity=50);
}

.mainnav li:last-child{
	padding-right: 0px;
}
*/

@media screen and (max-width:620px){
	#dnav{
		display: none;
	}
	
	.navcon{
		color: navy;
	}
	
	.headlogo::after{
		content: "Hello there";
	}
	
	#rem-tip{
		content: "Working?";
	}		
}

/***Styling for Dashboard***/

/**For Elements**/

/**For Classes**/
.dashcon{
	padding: 50px;
	margin: 0 auto;
/*	background-image: linear-gradient(to bottom right, #003, rgba(50,100,150,0.7), #004) !important; 
	background-image: linear-gradient(to bottom right, rgba(50,100,150,0.7), rgba(20,10,10,0.6)) !important;*/
	background-color: #f0f0f0 !important;
	height: 100% !important;
}

.men{
	margin: 0 auto;
	text-align: center;
}

.men-con{
	margin: 0 auto;
	padding: 20px;
}

.men-itm{
	border-radius: 10px;
	box-shadow: 3px 3px; 
	display: inline-block;
	text-align: center;
	background-color: #fff;
	padding: 5px;
	margin: 20px 45px;
	min-width: 120px;
	cursor: pointer;
}

.men-itm:hover{
	box-shadow: 10px 10px !important;	
}

.men-itm-ico{
	font-size: 20px;
}

.men-itm-cap{
	font-size: 15px;
	font-weight: bold;
}

.men-in{
	min-width: 170px;
}

.usr{
	color: rgb(17, 17, 71);
}

.mgusr-con, .mgdev-con{
	padding: 30px;
	text-align: center;
}

.mgusr-men, .mgdev-men{
	color: white;
	font-size: 14px;
	padding: 15px;
	border-radius: 8px;
	background: #001;
	font-weight: 500;
}

.mgusr-men:hover, .mgdev-men:hover{
	cursor: pointer;
}

.slow-fa-spin{
	-webkit-animation: fa-spin 10s infinite linear !important;
	animation: fa-spin 10s infinite linear !important;
}

.icod{
	font-size:12px;
}

.prop{
	color: black;
}

/**For Ids**/


#sidemen{
	border-right: #fff solid 2px;
	min-height: 500px;	
}

#dshbkg{
	height: 100% !important;
/*	background-image: linear-gradient(to bottom right, rgba(50,100,150,0.7), rgba(20,10,10,0.6)) !important;
	background-image: linear-gradient(to bottom right, #008, rgba(50,100,150,0.7), #009) !important; */
	background-color: #f0f0f0 !important;
	width: 100%;
	background-size: 100% !important;
	background-position: center;
	position: fixed;
	overflow: auto;
	background-repeat: repeat !important;
	margin: 0 auto;
	/* padding:0px; */
	/* background-size: contain; */
}

.sidenav{
	background-color: #fff;
	float: left;
	width: 20%;
	height: 100%;
	
}

.det-con{
	width: 80%;
	float: right;
}

.sidenav-men{
	display: inline-block;
	list-style-type: none;
	width: 100%;
}

#asstpnl-con{
	background-size: auto;
	background-position: center;
	background-image: linear-gradient(to bottom left, whitesmoke, rgba(255, 255, 255, 0.993), white) !important;
}

#asst-sidenav{
	margin-top: -10px;
	padding-top: 40px;
	background-color: #C41D1D;
	position: fixed;
	font-size: 13px;
	top:60px;
	z-index: 10;
}

#asst-navbar{
	font-size-adjust: auto;
}

#asst-navbar-men li{
	padding-top: 0px !important;
}

.sidenav-men-item{
	min-height: 35px;
	color: white;
	text-decoration: none;	
	border-top: solid gray 0.5px;
	width: 100%;
	padding: 8px;
	padding-left: 30px;
}

.sidenav-men-item a{
	text-decoration: none;
	color: inherit;
	width: 100%;
}

.sidenav-men-item:hover{
	background-color: #C41D1D;
	cursor: pointer;
}

.sidenavsubmen{
	display:none;
}

#asst-det-con{
	padding-left: 20px;
	margin-top: -10px;
}

#asst-det-hd{	
	background-color: white;	
}

#asst-det-hd-con{
	padding-top: 15px;
	height: 50px;
	color: #C41D1D !important;
	font-size: 18px;
	border-bottom: #C41D1D solid 2px;
	text-decoration-line: none !important;
	position: sticky;
	top: 40px;
	background-color: white;
	z-index: 10;
}

#asst-det-hd a{
	text-decoration: none;
	color: inherit;
	width: 100%;
}

.tab-col-hd th{
	font-size: 12px;
	text-align: center !important;
}

.activemenitem{
	background-color: #fff !important;
	color: #C41D1D !important;
}


.info:hover, .mgset:hover, .del:hover{
	opacity: 0.7;
	cursor: pointer;
}

.del{
	opacity: 0.9;
}

.right-itm{
	text-align: right;
}

.inftit{
	font-weight: bold;
	font-size: 11px;
}

.dev-inf td{
	border: white 1px solid;
}


/**800px devices and below**/
@media screen and (max-width:767px){
	#asst-sidenav{
		display: none;
	}

	.sidenav{
		display:none;
	}

	.det-con{
		width: 100%;
	}
	
	#devinftab{
		font-size: 9px;
	}

	#modal-hs{
		padding: 10px 20px 10px;
		background: #C41D1D;
		font-weight: bolder;
		font-size: 11px;
		color: white;
	}

	#login-con, #signup-con, #adasst-form-con{	
		margin: 0 auto;
		position: relative;
		padding: 8px;
		color: white;
	}
	
	#adasst-form-con{	
		margin: 0 auto;
		position: relative;
		padding: 5px 20px !important;
		color: white;
	}
	
	#adasst-form-con-con{		
		max-width: 600px !important;
		padding: 5px;
		opacity: 0.7;
		vertical-align: middle;	
	}
	
}


@media screen and (min-width:767px){
	#asst-navbar{
		display: none !important;
	}	
}

/**1000px devices and below**/
@media screen and (max-width:1150px){
	body{
		background-image: linear-gradient(to bottom right, rgba(50,100,150,0.7), rgba(20,10,10,0.6)) !important;
	}
	
	#sidemen{
		border: none;
		min-height: auto;
	}

	.men-itm{
		margin: 20px;
	}

	.men-in{
		min-width: 140px;
	}

	.mgusr-con{
		padding: 10px;
		text-align: center;
	}

	.mgusr-men{
		font-size: 13px;
		padding: 5px;
		border-radius: 4px;
		background: #002;
	}

	.sidenav-men{
		font-size: 12px;
	}

	.sidenav-men-item{
		padding-left: 12px;
	}

	.sidenavsubmen{
		margin-left: 0px;
	}

	#modal-con{
		min-width: 400px;				
		margin: 0 auto;
	}

	#modal-bk{
		padding: 10px;
	}

	#modal-hs{
		padding: 10px 20px 10px;
		background: #C41D1D;
		font-weight: bolder;
		font-size: 11px;
		color: white;
	}
}
