@charset "utf-8";
/* CSS Document cart */

body {
	height:100%;
	width:100%;
	margin:0px;
	/*	background-color: transparent;	*/
	background-color:#4b4b65;
	background-size: cover;
}

/*	main container 768x1024
-----------------------------*/
#mcontainer {
	position:relative;
	height:100%;
	min-height:767px;	/* original 1200	*/
	width:100%;
	min-width:1024px;
	/* background-color:#408080;	*/
	background-color:#4b4b65;
}


#mcontainer_outer {
	position: absolute;
	top: 50%; left: 50%;
	transform: translate(-50%,-50%);
	background-color: rgba(255,255,255,.2);
	border:0px solid #FFF;
	height:485px;	
	width:780px;
	border-radius:5px;
	display: flex;
	box-sizing: border-box;
}
@media only screen and (max-width: 780px) {
	/*	wip	*/
	#mcontainer_outer {
		position: relative;
		background-color: red;
		border:0px solid #FFF;
		height:485px;	
		width:780px;
		border-radius:5px;
		display: flex;
		box-sizing: border-box;
		margin-left: auto;
		margin-right: auto;
	}

	body {
		background-color: rgb(71, 42, 177);
	  }	
  }



#intro_info {
	height: 485px;
	width: 460px;
	color: #fff;
	text-align: center;
	box-shadow: 0 2px 3px rgba(0,0,0,.2);
	background-color: rgba(255,255,255,.2);
	/* background-color: #4b4b65; */
	border-radius: 5px 0 0 5px;
	padding: 30px;
	box-sizing: border-box;
}

#intro_form{
	height: 485px;
	width: 320px;
	background-color: #fff;
	box-shadow: 0 2px 3px rgba(0,0,0,.2);
	border-radius: 0 5px 5px 0;
	padding: 30px;
	box-sizing: border-box;
}

#intro_logo {
  display: inline-block;
  width: 48px;
  height: 64px;
  border-radius: 15%;
  background-image: url(../includes/images/sid_logo.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 3px 3px 8px rgba(0,0,0,.2);
}

#intro_privacy_banner_separator {
	height: 40px;
	width:100%;
	margin-top:20px;
	font-size:90%;
	box-sizing: border-box;
	text-align:center;
}
	#intro_logon_failure_notice {
		display:none;
		height: 20px;
		width:100%;
		font-size:100%;
		box-sizing: border-box;
		text-align:center;
		/* background-color:blue; */
		border-radius:7px;
		color:red;
	}
#intro_privacy_banner {
	height: 35px;
	width: 285px;
	margin-top: 30px;
	background-size: contain; 
	background-repeat: no-repeat;
	background-color: rgba(255,255,255,0.2);
	box-shadow: 3px 3px 8px rgba(0,0,0,.2); 
	border-radius: 0 5px 5px 0;
	box-sizing: border-box;
}
	#intro_privacy_banner_reg, #intro_privacy_banner_about, #intro_privacy_banner_privacy, #intro_privacy_banner_tos {
		height: 35px;
		float:left;
		text-align:left;
		font-size:90%;
		box-sizing: border-box;
		text-align:center;
		/* background-color:green; */
	}
	#intro_privacy_banner_reg {
		width: 135px;
		text-align:left;
	}
	#intro_privacy_banner_about {
		padding-top:15px;
		width: 48px;
		
	}	
	#intro_privacy_banner_privacy {
		padding-top:15px;
		width: 50px;
	}	
	#intro_privacy_banner_tos {
		padding-top:15px;
		width: 48px;
	}	

	/* minor elements formatting */		
	button {
      background-color: #4b4b65;
    }
		h1 {
			font-size: 36px;
			font-weight: 100;
		}	
		h2 {
			font-size: 24px;
			font-weight: 100;
			margin-bottom: 15px;
		}	
		form {
			/* max-width: 320px; */			/* monitor this, appears to bring more errors */
		}
		label {
			font-size: 14px;
			padding: 15px 0 5px 0; 
			display: inline-block; 
		}	
			/* specific override for support */
			label.textSmall { 
				font-size: 12px;
				padding: 1px 0 1px 1px;		
				display: inline-block;
			}		
		input[type='text'],
		input[type='password'] {
			width: 100%;			
			-webkit-appearance: none;
			-moz-appearance: none;
			-ms-appearance: none;
			-o-appearance: none;
			appearance: none;			
			font: inherit;
			font-size: 14px;			
			height: 28px;
			border-radius: 4px;
			padding: 4px 5px;		/* was 4, 9) */
			border: 1px solid rgba(0,0,0,.2);
		}
			/* specific override for support */
			input[type="text"].textSmall { 
				width: 90%;			
				-webkit-appearance: none;
				-moz-appearance: none;
				-ms-appearance: none;
				-o-appearance: none;
				appearance: none;			
				font: inherit;
				font-size: 13px;			
				height: 13px;
				border-radius: 2px;
				padding: 1px 1px;
				margin-bottom: 2px;
				border: 1px solid rgba(0,0,0,.2);
			}	

		button {
			width:100%;
			margin-top: 5px;		/* was 37 */
			height: 35px;
			border: 1px solid #666;
			border-radius: 4px;
			background-image: linear-gradient(to bottom,rgba(255,255,255,0.2) 2%, rgba(0,0,0,0.1) 98%);
			box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.2), 0 2px 3px rgba(0, 0, 0, 0.05);
			outline: none;
			cursor: pointer;
			color: #fff;
			text-align: center;
			position: relative;
			font: inherit;
			font-weight: 600;
		}
			button.btnSmall {
				width:30%;
				margin-top: 0px;		/* was 5 */
				height: 25px;
				border: 1px solid #666;
				border-radius: 4px;
				background-image: linear-gradient(to bottom,rgba(255,255,255,0.2) 2%, rgba(0,0,0,0.1) 98%);
				box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.2), 0 2px 3px rgba(0, 0, 0, 0.05);
				outline: none;
				cursor: pointer;
				color: #fff;
				text-align: center;
				position: relative;
				font: inherit;
				font-weight: 600;
				margin-left:auto;
				margin-right:auto;
			}		
		#button-submit:focus:after {
			box-shadow: 0 0 0 2px rgba(0,0,0,.5);
			content: "";
			position: absolute;
			top: -2px;
			right: -2px;
			bottom: -2px;
			left: -2px;
			border-radius: inherit;
		}
		.error input {
			display: block;
			border-color: red;
		}
		.error form:after {
			content: "The user-name and password you entered do not match our records. Please double-check and try again.";
			display: block;
			border: 1px solid red;
			border-radius: 4px;
			width: 100%;
			margin-top: 16px;
			font-size: 14px;
			padding: 8px;
		}
		
		.reset_textbox {
			font: inherit;
			font-size: inherit;	
			height: 10px;
			width: 30px;
			border-radius: 0px;
			padding: 0px;
			color:black;
		}
		
		.reset_button {
			font-family: inherit; /* 1 */
			font-size: 100%; /* 1 */
			line-height: 1.15; /* 1 */
			margin: 0; /* 2 */
			
			width:100%;
			margin-top: 0;		/* was 37 */
			height: auto;
			border: 1px solid #666;
			border-radius: 4px;
			background-image: none;
			box-shadow: none;
			outline: none;
			cursor: pointer;
			color: #fff;
			text-align: center;
			position: relative;
			font: inherit;		
		}		

/*	privacy writeup container; also for tos */
#privacy_holder {
  width: 760px;
  height: 470px;
  border-radius: 5px;
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.9); 
  box-shadow: 5px 5px 10px rgba(0,0,0,.5);
  box-sizing: border-box;
  margin-top:7px;
  margin-left: auto;
  margin-right: auto;
  padding:2px;
	font-family: 'Slabo 27px'; 
}
	#privacy_inner_header, #privacy_inner_middle, #privacy_inner_bottom{
		width: 98%;
		height: 40px;
		border-radius: 0px 0px 0px 0px;
		box-sizing: border-box;
		margin-left: auto;
		margin-right: auto;  
		background-size: contain;
		background-repeat: no-repeat;
		background-color: rgba(255,255,255,0.9); 
		box-shadow: 5px 5px 10px rgba(0,0,0,.5);
		text-align:center;
		padding: 5px;
		font-size: 27px;
		color:darkgreen;
	
	}
	#privacy_inner_middle {
		/* background-color: #4b4b65; */
		border-radius: 0px 0px 0px 0px;
		height: 375px;
		margin-top:3px;
		overflow-y:auto;
		font-size:16px;
		text-align:justify;
	}
	#privacy_inner_bottom {
		/* background-color: #4b4b65; */
		border-radius: 0px 0px 0px 0px;
		height: 40px;
		margin-top:3px;
		font-size:14px;
	}	

/*	password recovery; also for basic.php engines  */
#precovery_holder {
  width: 760px;
  height: 470px;
  border-radius: 5px;
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.9); 
  box-shadow: 5px 5px 10px rgba(0,0,0,.5);
  box-sizing: border-box;
  margin-top:7px;
  margin-left: auto;
  margin-right: auto;
  padding:2px;
	font-family: 'Slabo 27px'; 
}
	#precovery_inner_header, #precovery_inner_middle, #precovery_inner_bottom{
		width: 98%;
		height: 40px;
		border-radius: 0px 0px 0px 0px;
		box-sizing: border-box;
		margin-left: auto;
		margin-right: auto;  
		background-size: contain;
		background-repeat: no-repeat;
		background-color: rgba(255,255,255,0.9); 
		box-shadow: 5px 5px 10px rgba(0,0,0,.5);
		text-align:center;
		padding: 5px;
		font-size: 27px;
		color:darkgreen;
	
	}
	#precovery_inner_middle {
		/* background-color: #4b4b65; */
		border-radius: 0px 0px 0px 0px;
		height: 375px;
		margin-top:3px;
		overflow-y:auto;
		font-size:16px;
		text-align:justify;
	}
	#precovery_inner_bottom {
		/* background-color: #4b4b65; */
		border-radius: 0px 0px 0px 0px;
		height: 40px;
		margin-top:3px;
		font-size:14px;
	}

/*	pre-registration elements */
#prereg_holder {
  width: 680px;
  height: 350px;
  border-radius: 15px;
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 5px 5px 10px rgba(0,0,0,.5);
  box-sizing: border-box;
  margin-top:50px;
  margin-left: auto;
  margin-right: auto;  
}
	#prereg_inner_header, #prereg_inner_middle , #prereg_inner_bottom{
	  width: 580px;
	  height: 70px;
	  border-radius: 0px 0px 0px 0px;
	  box-sizing: border-box;
	  margin-top:50px;
	  margin-left: auto;
	  margin-right: auto;  
	  background-color: #FFF;
	  text-align:center;
	  padding: 5px;
	  box-shadow: -3px 0px 3px rgba(0,0,0,.5);
	  
	}
	#prereg_inner_header {
		color: #4b4b65;
	}
	#prereg_inner_middle {
		height: 90px;
		border-radius: 0px 0px 0px 0px;
		margin-top:3px;
		margin-bottom:3px;
		/*background-color: rgba(255,255,255,0.2);
		box-shadow: 5px 5px 10px rgba(0,0,0,.5); */
		background-color: #FFF;
		padding-top: 25px;
		box-sizing: border-box;
	}
	#prereg_inner_bottom {
		border-radius: 0px 0px 15px 15px;
		margin-top:0px;		
		background-color: #FFF;
		height: 50px;
		font-size:90%;
		color: #4b4b65;		
	}
		
/*	registration elements */
#sid_reg {
	height:485px;	
	width:780px;
	box-sizing: border-box;
	background-color: #FFA07A;
	border-radius: 5px;
	display: flex;
}


#reg_form {
	height: 485px;
	width: 460px;
	/* color: #fff;	 */
	box-shadow: 0 2px 3px rgba(0,0,0,.2);
	/* background-color: rgba(255,255,255,.2);  
	 background-color: #4b4b65; */
	background-color: #fff;
	border-radius: 5px 0 0 5px;
	padding: 10px;
	box-sizing: border-box;
}

#reg_images{
	height: 485px;
	width: 320px;
	background-color: #fff;
	box-shadow: 0 2px 3px rgba(0,0,0,.2);
	border-radius: 0 5px 5px 0;
	padding: 15px;
	box-sizing: border-box;
	text-align: center;
}

#image_passport, #image_passport_teacher {
  width: 190px;
  height: 180px;
  border-radius: 5%;
  /* background-color: #4b4b65; */
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 3px 3px 8px rgba(0,0,0,.2);
  box-sizing: border-box;
  margin-bottom:15px;
  margin-top:15px;
  margin-left: auto;
  margin-right: auto;
}
	.image_passport {
		width: 190px;
		height: 180px;
		border-radius: 5%;
		/* background-color: #4b4b65; */
		background-size: contain;
		background-repeat: no-repeat;
		background-color: rgba(255,255,255,0.2);
		box-shadow: 3px 3px 8px rgba(0,0,0,.2);
		box-sizing: border-box;
		margin-bottom:15px;
		margin-top:15px;
		margin-left: auto;
		margin-right: auto;
	}

#image_nid_front, #image_nid_front_teacher {
  width: 290px;
  height: 180px;
  border-radius: 5%;
  /* background-color: #4b4b65; */
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 3px 3px 8px rgba(0,0,0,.2);
  box-sizing: border-box;
  margin-bottom:15px;
}

#output_nid, #output_pp, #output_pic_others, #output_pic_othersx, #main_image, #main_imagex, #output_nid_teacher, #output_pp_teacher{
	max-width:100%;
	max-height:100%;
}

.xlebel_resize {
	margin-top:0px;
	/* background-color:blue;  */
	padding-top:0px
}

.xauto_width {
	width:auto;
	background-color:blue;
}

.xwrite_stlye_one {
	font-family: 'Playball', cursive;
  	font-size: 20px;
	color: dodgerblue;
}

.xwrite_stlye_two {
	font-family: 'Playball', normal;
  	font-size: 25px;
	color: dodgerblue;
}

.xwrite_stlye_three {
	font-family: 'Playball', cursive;
  	font-size: 20px;
}

.xwrite_stlye_four {
	font-family: 'Slabo 27px';
  	font-size: 20px;
}

.input-container {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    width: 100%;
    margin-bottom: 7px; /* 12 */
}

.icon {
    padding: 8px;
    background: dodgerblue;
    color: white;
    min-width: 50px;
    text-align: center;
}

.input-field {
    width: 100%;
    padding: 8px;
    outline: none;
}

	.input-field-smaller {
		width: 100%;
		height:35px; 
		padding: 0px 8px 0px 8px;
		outline: none;
	}
.input-field:focus {
    border: 2px solid dodgerblue;
}

	.input-field-smaller:focus {
		border: 2px solid dodgerblue;
	}
/* Set a style for the submit button */
.btn {
    background-color: dodgerblue;
    color: white;
    padding: 5px 20px;
    border: none;
    cursor: pointer;
    width: 100%;
    opacity: 0.9;
}

.btn:hover {
    opacity: 1;
}

.divCenter {
	margin-left: auto;
	margin-right: auto;
}

.txtCenter {
	text-align: center;
}

/* home page reg button class */
.regButton {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #599bb3), color-stop(1, #408c99));
	background:-moz-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:-webkit-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:-o-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:-ms-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
	background-color:#599bb3;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:20px;
	font-weight:bold;
	padding:5px 15px;
	text-decoration:none;
	text-shadow:0px 1px 0px #3d768a;
}
.regButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #408c99), color-stop(1, #599bb3));
	background:-moz-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:-webkit-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:-o-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:-ms-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#408c99', endColorstr='#599bb3',GradientType=0);
	background-color:#408c99;
}
.regButton:active {
	position:relative;
	top:1px;
}


	/*	male, femal, other radios 	*/
	#genholder_uploads {
		background-color: #675f6b;
		width:400px;
		height: 52px;
		margin-bottom:7px;
		border: solid 1px #675f6b;
		box-sizing: border-box;
		border-radius: 3px;
		font-size: 80%;
	}
		#genholder_uploads_divider_one, #genholder_uploads_divider_two, #genholder_uploads_divider_premises{
			background-color: #fff;
			width:196px;
			height: 50px;
			border: solid 2px #675f6b;
			box-sizing: border-box;
		}
		#genholder_uploads_divider_one{
			float:left;
		}
		#genholder_uploads_divider_two{
			float:right;
		}
			#guplds_inner_one, #guplds_inner_two, #guplds_inner_three, #guplds_inner_four{
				display: flex;
				height:25px;
				width:100%;
				border-bottom: solid 2px #675f6b;
			}	
			#guplds_inner_one, #guplds_inner_three{
				height:20px;
				background-color: dodgerblue;
				padding-left: 5px;
				text-align:center;
				box-sizing: border-box;
			}
		
		#genholder_uploads_divider_premises{
			border-radius: 5px 5px 0px 0px;
			width:210px;
			font-size: 80%;
			margin-bottom:7px;
			margin-top:-5px;
		}
			
	input[type=radio] {
		display: none;
		position: absolute;
		visibility: hidden;
	}
	input[type=radio]:checked + label {
	  color: #FFF;
	  background: #675f6b;
	  min-width: 90px;
	}
	input[type=radio] + label {
	  border-left: solid 3px #675f6b;
	  min-width: 60px;
	}
	label + input[type=radio] + label {
	  border-left: solid 3px #675f6b;
	  min-width: 60px;
	}	
	.radio-group-reg {
	  border: solid 3px #675f6b;		/* dodgerblue; #332f35*/
	  display: inline-block;
	  border-radius: 5px;
	  overflow: hidden;
	  text-align: center;
	  margin-bottom:8px;
	  
	}	
	
/*	pre-loader for premises process */
#dvLoading {
	background:#fff url(../styles/images/xspinner.gif) no-repeat center center;
	/* background:#transparent url(../styles/images/xspinner.gif) no-repeat center center; */
	height: 100px;
	width: 100px;
	position: fixed;
	z-index: 1000;
	left: 50%;
	top: 50%;
	margin: -25px 0 0 -25px;
}	

/*	main-page elements - persons */
#psn_main_left{
	height: 485px;
	width: 130px;
	background-color: #fff;
	box-shadow: 0 2px 3px rgba(0,0,0,.2);
	border-radius: 5px 0px 0px 5px;
	padding: 7px;
	box-sizing: border-box;
	text-align: center;
}

#psn_main_right {
	height: 485px;
	width: 650px;
	box-shadow: 0 2px 3px rgba(0,0,0,.2);
	background-color: #fff;
	border-radius: 0px 5px 5px 0px;
	padding: 7px;
	box-sizing: border-box;
}

#psn_main_left_inner {
  height: 470px;
  width: 120px;  
  border-radius: 5px;
  /* background-color: #4b4b65; */
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 3px 3px 8px rgba(0,0,0,.6);
  box-sizing: border-box;
  margin-left:auto;
  margin-right:auto;
  padding-top:3px;
}

#psn_main_right_inner {
  height: 470px;
  width: 635px;  
  border-radius: 5px;
  /* background-color: #4b4b65; */
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 3px 3px 8px rgba(0,0,0,.6);
  box-sizing: border-box;
}	
	/*	icons formatting classes */
	.icon-bar {
		width: 110px;
		background-color: #555;
		display: block;
		text-align: center;
		/* font-size: 45px; */
		border: 1px solid #fff;
		border-radius: 6px;
		margin-left:auto;
		margin-right:auto;	
	}
	
	.icon-bar a {
		display: block;
		text-align: center;
		/* padding: 16px; */
		padding: 12px 16px 9px 16px;
		transition: all 0.3s ease;
		color: white;
		font-size: 45px;
	}

	.icon-bar a:hover {
		background-color: #000;
	}

	.active {
		background-color: blue;		/* #4CAF50; */
	}

	.menu-text {
	  font-size: 17px;
	  text-decoration: none;
	}

/*	main-page elements - premises */
#pre_main_left{
	height: 485px;
	width: 130px;
	background-color: #fff;
	box-shadow: 0 2px 3px rgba(0,0,0,.2);
	border-radius: 5px 0px 0px 5px;
	padding: 7px;
	box-sizing: border-box;
	text-align: center;
}

#pre_main_right, #pre_main_right_results{
	height: 485px;
	width: 650px;
	box-shadow: 0 2px 3px rgba(0,0,0,.2);
	background-color: #fff;
	border-radius: 0px 5px 5px 0px;
	padding: 7px;
	box-sizing: border-box;
}

#pre_main_left_inner {
  height: 470px;
  width: 120px;  
  border-radius: 5px;
  /* background-color: #4b4b65; */
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 3px 3px 8px rgba(0,0,0,.6);
  box-sizing: border-box;
  margin-left:auto;
  margin-right:auto;
  padding-top:3px;
}

#pre_main_right_inner, #pre_main_right_inner_results {
  height: 470px;
  width: 635px;  
  border-radius: 5px;
  /* background-color: #4b4b65; */
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 3px 3px 8px rgba(0,0,0,.6);
  box-sizing: border-box;
}
	/*	icons formatting classes */
	.iconx-bar {
		width: 110px;
		height: 99.8%;	/* 462px 99.5% */
		background-color: #555;	
		display: block;
		text-align: center;
		/*font-size: 45px;	//seems not working */ 
		border: 1px solid #fff;
		border-radius: 6px;
	  	margin-left:auto;
	  	margin-right:auto;	 
		box-sizing: border-box; 
	}

	.iconx-bar a {		
		display: block;
		text-align: center;
		/*  padding:16px; height: 92.7px;*/
		
		padding: 12px 16px 9px 16px; 
		transition: all 0.3s ease;
		color: white;
		font-size: 45px;
		box-sizing: border-box;
	}

	.iconx-bar a:active {
		background-color: #4CAF50;
	}

	.iconx-bar a:hover {
		background-color: #000;
	}

	.active {
		background-color: #4CAF50;
	}

	.menux-text {
	  font-size: 17px;
	  text-decoration: none;
	}

/*	menu item containers, activated on menu-item clicks 
--------------------------------------------------------	*/	

/*	menu item holders - home (both pre and per) 	*/
#menu_holder_person_home{
	display:none;
	position:relative;
	height:440px;
	width: 600px;
	padding: 10px;
	top:15px;
	margin-left:auto;
	margin-right:auto;
	/* background-color: #4CAF50; */	
	box-sizing: border-box;
	/* overflow-y: auto; removed as chrome shows 2 of them including down one*/
	color:darkblue;
	font-family: 'Slabo 27px';
  	font-size: 14px;
	text-align: justify;
}
.generic_holder_right_inner{
	display:none;
	position:relative;
	height:440px;
	width: 600px;
	padding: 10px;
	top:15px;
	margin-left:auto;
	margin-right:auto;
	/* background-color: #4CAF50; */	
	box-sizing: border-box;
	/* overflow-y: auto; removed as chrome shows 2 of them including down one*/
	color:darkblue;
	font-family: 'Slabo 27px';
  	font-size: 14px;
	text-align: justify;
}
	#mholder_person_home_one{
		position:relative;
		height:360px;
		width: 560px;
		padding: 7px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: #4CAF50; */	
		box-sizing: border-box;
		box-sizing: border-box;
		overflow-y: scroll;		
	}
	#mholder_prm_settings_one{
		position:relative;
		height:360px;
		width: 560px;
		padding: 7px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: #4CAF50; 	*/
		box-sizing: border-box;
		overflow-y: scroll;		
	}	
	.home_grid_container_psn {
	  display: grid;
	  grid-template-columns: auto auto auto;
	  grid-template-rows: 50px;		/* top row only	*/
	  grid-auto-rows: 100px;		/* any new rows created	*/
	  grid-gap: 30px;
	  /* background-color: #2196F3; */
	  padding: 10px;
	  box-sizing: border-box;
	}
	.home_grid_container_psn > div {
	  background-color: rgba(255, 255, 255, 0.8);
	  text-align: center;
	  padding: 5px 0;
	  font-size: 65px;
	}
	.settings_grid_container_prm {
	  display: grid;
	  grid-template-columns: auto auto auto;
	  grid-template-rows: 50px;		/* top row only	*/
	  grid-auto-rows: 100px;		/* any new rows created	*/
	  grid-gap: 30px;
	  /* background-color: #2196F3; */
	  padding: 10px;
	  box-sizing: border-box;
	}
	.settings_grid_container_prm > div {
	  background-color: rgba(255, 255, 255, 0.8);
	  text-align: center;
	  padding: 5px 0;
	  font-size: 65px;
	}	
	.hmenu_header {
		grid-column: 1 / 4;
		color:blue;
	}
	.hmenu_others {
	  border-radius:5px;
	  border-style: double;
	}	
	#hmenu_header_div {
		height:100%;
		width:100%;
		 background-color:  #717d7e ;
		 font-size: 25px;
		 padding: 5px 0;
		 box-sizing: border-box;
		 color:darkgreen;
	}

/*	get reports - pre-holders 	*/
#pre_reports_holder{
	display:none;
	position:relative;
	height:400px;
	width: 580px;
	padding: 10px;
	top:50px;			/* margin-top:50px; does not work well here, pushes parent down	*/
	margin-left:auto;
	margin-right:auto;
	/* background-color: #4CAF50;	*/
	box-sizing: border-box;
	
}
	#pre_reports_header{
		height:60px;
		width: 480px;
		padding: 10px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: #000;	*/
		box-sizing: border-box;	
		text-align:center;
	}
	#pre_reports_middle{
		height:70px;
		width: 480px;
		padding: 5px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: blue;	*/
		box-sizing: border-box;		
	}
	#pre_reports_lower{
		height:140px;
		width: 480px;
		padding: 10px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: #000;	*/	
		box-sizing: border-box;		
	}	
		#prerep_lower_main, #prerep_lower_one, #prerep_lower_two, #prerep_lower_checkbox{
			position:relative;
			margin-left:auto;
			margin-right:auto;
			box-sizing: border-box;	
			text-align: center;
		}
		#prerep_lower_main{
			height:80px;
			width: 450px;
			/* background-color: blue;		*/
		}
		#prerep_lower_one{
			height:40px;
			width: 450px;
			text-align:center;
			/* background-color: green;	*/
		}
		#prerep_lower_two, #prerep_lower_checkbox{
			height:40px;
			width: 450px;
			/* background-color: pink;	*/
		}	
		#prerep_lower_checkbox{	
			display: none;
		}
			#prerep_inner_left{
				height:35px;
				width: 220px;
				/* background-color: red;	*/
				float:left;
				padding:2px;
			}
			#prerep_inner_right{
				height:35px;
				width: 220px;
				/* background-color: yellow;	*/
				float:right;
				padding:2px;
			}	
				.dycenter{
					display: flex;
					justify-content: center;
					align-items: center;
				}	
	#rholder{
		height:50px;
		width: 240px;
		background-color: #FFF;
		margin:auto;	
		box-sizing: border-box;
	}
	.radio-group-report {
	  border: solid 3px #675f6b;
	  display: inline-block;
	  border-radius: 5px;
	  overflow: hidden;
	  text-align: center;
	}

/*	help menu - pre-holders (both pre and per) 	*/
#pre_help_holder{
	display:none;
	position:relative;
	height:440px;
	width: 600px;
	padding: 10px;
	top:15px;			/* margin-top:50px; does not work well here, pushes parent down	*/
	margin-left:auto;
	margin-right:auto;
	/* background-color: #4CAF50; */	
	box-sizing: border-box;
	overflow-y: auto;	/* required */
	color:darkblue;
	font-family: 'Slabo 27px';
  	font-size: 14px;
	text-align: justify;
}	
	/* help page, collapsible formatting */
	.collapsible, .collapsible_sch_help {
	  background-color: darkgren;
	  color: white;
	  cursor: pointer;
	  padding: 5px;
	  width: 100%;	/* wass 100% */
	  border: none;
	  text-align: left;
	  outline: none;
	  font-size: 15px;
	}

	.activex, .collapsible:hover {
	  background-color: #555;
	}
	.activex, .collapsible_sch_help:hover {
		background-color: #555;
	  }	

	.collapsible:after {
	  content: '\002B';
	  color: white;
	  font-weight: bold;
	  float: right;
	  margin-left: 5px;
	}
	.collapsible_sch_help:after {
		content: '\002B';
		color: white;
		font-weight: bold;
		float: right;
		/* margin-left: 5px; */
	  }	

	.activex:after {
	  content: "\2212";
	}	

	.contentx {
	  padding: 0 15px;
	  max-height: 0;
	  overflow: hidden;
	  transition: max-height 0.2s ease-out;
	  background-color: #f1f1f1;
	}	
	.contentx_sch_help {
		padding: 0 10px;
		max-height: 0;
		overflow: hidden;
		box-sizing: border-box;
		transition: max-height 0.2s ease-out;
		background-color: #f1f1f1;
	  }		
	/* ----------------------------------	*/
	#help_email_form_holder {
		background-color: transparent;
		height: 380px;
		width: 450px;
		margin: auto;
		color: black;	
	}

/*	menu item holders - signout (both pre and per) 	*/
#menu_holder_person_signout{
	display:none;
	position:relative;
	height:440px;
	width: 600px;
	padding: 10px;
	top:15px;
	margin-left:auto;
	margin-right:auto;	
	box-sizing: border-box;
	color:darkblue;
	font-family: 'Slabo 27px';
  	font-size: 14px;
	text-align: justify;
}
	#mholder_person_signout_one{
		position:relative;
		height:360px;
		width: 560px;
		padding: 7px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: #4CAF50; */	
		box-sizing: border-box;
	}	
		#mholder_person_signout_msg, #mholder_person_signout_button{
			position:relative;
			height:100px;
			width: 500px;
			margin-bottom: 15px;
			margin-left:auto;
			margin-right:auto;
			padding: 20px;
			/* background-color: pink; */	
			box-sizing: border-box;
			font-size: 20px;
			text-align: center;
			border-radius:15px;
		}
		#mholder_person_signout_button{
			position:relative;
			height:50px;
			width: 300px;
			padding: 10px;
			background-color:transparent;
		}

/*	menu item holders - settings (both pre and per) 	*/
#menu_holder_person_settings{
	display:none;
	position:relative;
	height:440px;
	width: 600px;
	padding: 10px;
	top:15px;			/* margin-top:50px; does not work well here, pushes parent down	*/
	margin-left:auto;
	margin-right:auto;	
	box-sizing: border-box;
	/* overflow-y: auto; */
	color:darkblue;
	font-family: 'Slabo 27px';
  	font-size: 14px;
	text-align: justify;
}
	#mholder_person_settings_one{
		position:relative;
		height:360px;
		width: 560px;
		padding: 7px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: #4CAF50; */	
		box-sizing: border-box;
	}	
		#mholder_person_settings_msg, #mholder_person_settings_button{
			position:relative;
			height:120px;
			width: 500px;
			margin-bottom: 15px;
			margin-left:auto;
			margin-right:auto;
			padding: 20px;
			/* background-color: pink; 	*/
			box-sizing: border-box;
			font-size: 20px;
			text-align: center;
			border-radius:15px;
		}
		#mholder_person_settings_button{
			position:relative;
			height:50px;
			width: 300px;
			padding: 10px;
			background-color:transparent;
		}			
/*	menu item containers, ends
--------------------------------------------------------	*/	
	

/*	inner-menu-item containers, persons 0nly 
--------------------------------------------------------	*/	

/*	menu item holders - home (both pre and per) 	*/
#base_holder_all, #base_holder_all_settings, #base_holder_all_prm, #base_holder_all_results, #base_holder_all_support, #base_holder_all_rider_pickups{
	display:none;
	position:relative;
	height:440px;
	width: 600px;
	padding: 1px;
	top:15px;
	margin-left:auto;
	margin-right:auto;
	/* background-color: #4CAF50; */	
	box-sizing: border-box;
	/* overflow-y: auto; //monitor if removal brings any isues, wip elkana*/
	color:darkblue;
	font-family: 'Slabo 27px';
  	font-size: 14px;
	text-align: justify;
}
	#base_holder_all_results{
		display:block;
	}
	/*	mostly persons 	*/
	#psn_checkin, #psn_checkout, #psn_viewreport, #psn_notices, #psn_sendid{
		display:none;
		position:relative;
		height:438px;
		width: 598px;
		padding: 5px;
		margin-left:auto;
		margin-right:auto;
		 background-color: #fff; 	
		box-sizing: border-box;
		overflow-y: auto;
		color:darkblue;
	}
	
	#psn_checkin_header, #psn_checkin_center, #psn_checkin_bottom, #psn_checkin_banner{
		height:48px;
		width:100%;
		/* background-color:  #717d7e; */
		 font-size: 25px;
		 padding: 5px 0;
		 box-sizing: border-box;
		 color:darkgreen;
		 margin-bottom:15px;
		 text-align:center;
	}

	#psn_checkin_center{
		height:205px;
		font-size: 18px;
		padding:10px;
		 color:darkgreen;
	}	
	#psn_checkin_bottom{
		height:60px;
		color:darkgreen;
	}
	#psn_checkin_banner{
		position:absolute;
		height:30px;
		width:588px;
		bottom:0;
		padding:0;
		margin-bottom:0px;
		color:darkgreen;
		box-sizing: border-box;
		text-align:right;
		font-size:small;
	}
		#psn_checkin_banner_hone, #psn_checkin_banner_htwo{
			position:relative;
			height:25px;
			width:auto;
			color:darkgreen;
			box-sizing: border-box;
			background-color:  #fff;
			margin-right:5px;
			padding:5px 7px 0px 0px;
			float:right;
		}
	/* some of the above are used for psn-checkout also; */

	/*	mostly premises 	*/
	#pre_checkin, #pre_checkout, #pre_viewreport, #pre_notices, #pre_adduser, #pre_reqid, #pre_adduser_results, #pre_settings, #pre_settings_results {
		display:none;
		position:relative;
		height:438px;
		width: 598px;
		padding: 5px;
		margin-left:auto;
		margin-right:auto;
		 background-color: #fff; 	
		box-sizing: border-box;
		/* overflow-y: auto; monitor, elkana, wip*/
		color:darkblue;
	}
	#pre_adduser_results, #pre_settings_results{
		display:block;
	}
	
	#pre_checkin_header, #pre_checkin_center, #pre_checkin_bottom, #pre_checkin_banner,  #pre_checkin_header_res_empl, #pre_checkin_center_res_empl{
		/* targeting issue at employee register result pages - conflict with add user, duplicated now */
		height:48px;
		width:100%;
		/* background-color:  #717d7e;  */
		 font-size: 25px;
		 padding: 5px 0;
		 box-sizing: border-box;
		 color:darkgreen;
		 margin-bottom:15px;
		 text-align:center;
	}
	#pre_checkin_header_res_sch, #pre_checkin_center_res_sch, #pre_checkin_bottom_res_sch, .pre_checkin_header{
		/* targeting issue at school module result pages - conflict */
		height:48px;
		width:100%;
		/* background-color:  #717d7e; */  
		 font-size: 25px;
		 padding: 5px 0;
		 box-sizing: border-box;
		 color:darkgreen;
		 margin-bottom:15px;
		 text-align:center;
	}	

	#pre_checkin_center, #pre_checkin_center_res_empl, #pre_checkin_center_res_sch, .pre_checkin_center{
		height:280px;		/* was 205 */
		font-size: 18px;
		padding:10px;
		 color:darkgreen;
		/* background-color:  #717d7e; */
		 margin-top:0px;
		 margin-bottom:2px;
	}	
	#pre_checkin_bottom, #pre_checkin_bottom_res_empl, #pre_checkin_bottom_res_sch, .pre_checkin_bottom{
		height:60px;
		color:darkgreen;
		overflow-y: auto;
		/* background-color:red; */
	}
	#pre_checkin_banner, .pre_checkin_banner{
		position:absolute;
		height:30px;
		width:588px;
		bottom:0;
		padding:0;
		margin-bottom:0px;
		color:darkgreen;
		box-sizing: border-box;
		text-align:right;
		font-size:small;
	}
		#pre_checkin_banner_hone, #pre_checkin_banner_htwo, .pre_checkin_banner_hone, .pre_checkin_banner_htwo{
			position:relative;
			height:25px;
			width:auto;
			color:darkgreen;
			box-sizing: border-box;
			background-color:  #fff;
			margin-right:5px;
			padding:5px 7px 0px 0px;
			float:right;
		}
		#pre_checkin_banner_htwo{
			background-color: transparent;	/* not reflecting, WIP 2020-12-06 */
		}
	/* some of the above are used for prm-checkout also; */	
	
	/*	reports results fails to display some; copied from check-ins */
	#pre_reports_header_res{
		height:48px;
		width:100%;
		 font-size: 25px;
		 padding: 5px 0;
		 box-sizing: border-box;
		 color:darkgreen;
		 margin-bottom:15px;
		 text-align:center;
	}
	#pre_reports_center_res{
		height:205px;
		font-size: 18px;
		padding:10px;
		color:darkgreen;
		text-align:center;
	}	
	
	
/*	inner-menu-item, ends
--------------------------------------------------------	*/


/*	specific: inner-menu-item-premises checkin/checkout begins
--------------------------------------------------------	*/
	#premises_checkin, #premises_checkout{
		display:none;
		position:relative;
		height:438px;
		width: 598px;
		padding: 2px;
		margin-left:auto;
		margin-right:auto;
		 background-color:  #000; 	
		box-sizing: border-box;
		overflow-y: auto;
		color:darkblue;
		z-index:10;
	}	
		#premises_checkin_header, #premises_checkin_center, #premises_checkin_bottom, #premises_checkin_banner{
			height:68px;
			width:100%;
			box-sizing: border-box;
			background-color:  #fff; 
			margin-bottom:3px;
		}	
		#premises_checkin_header{
			z-index:11;
			
		}
		#premises_checkin_center{
			z-index:12;
			height:285px;
		}	
		#premises_checkin_bottom{
			z-index:11;
			height:74px;
			margin-bottom:0px;
			background-image: url("images/carbon_fibre.png");
			 background-repeat: repeat;

		}
			#premises_checkin_bottom_up{
				height:40px;
				width:100%;
				margin-left:auto;
				margin-right:auto;
				box-sizing: border-box;
			}
				#premises_checkin_entry_button{
					height:40px;
					width:125px;
					margin-left:auto;
					margin-right:auto;
					box-sizing: border-box;
					float:left;
				}
				#premises_checkin_carreg_holder, #premises_checkin_purpose_holder{
					height:40px;
					width:210px;
					margin-left:auto;
					margin-right:auto;
					box-sizing: border-box;
					float:right;
					text-align:center;
				}
				#premises_checkin_purpose_holder{
					float:left;
					width:230px;
					margin-right:20px;					
				}
					#car_reg_number, #purpose_details{
						display:none;
						height:40px;
						width:130px;
						font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
						font-size:24px;
						font-weight: bold;
						color:orange;
						text-transform: uppercase;
						margin-left:35px;
						margin-right:auto;
						box-sizing: border-box;
						float:left;
						/* background-color:orange; */
						border-radius:5px;
					}
					#purpose_details{
						float:right;
						text-align:left;
						width:180px;
						font-size:12px;
						margin-left:0px;
						padding-top: 0px;
						background-color:transparent;
						box-sizing: border-box;
					}
			#premises_checkin_bottom_briefs{
				height:28px;
				width:100%;
				margin-left:auto;
				margin-right:auto;				
				font-size:small;
				padding:4px;
				box-sizing: border-box;
				text-align:center;
				color:white;
			}			
		#premises_checkin_banner{
			z-index:11;
			margin-bottom:0px;
		}
			#premises_holder_icons, #premises_holder_levels{
				z-index:11;
				height:68px;
				width:300px;
				float:left;
				/* background-color: #717d7e; */ 
				 text-align:center;
				 font-size:16px;
				 color:white;
				 box-sizing: border-box;
			}
				#pholder_icons_in{
					height:60px;
					width:105px;
					float:left;
					padding: 5px 0px 0px 5px; 
					cursor: hand;
					cursor: pointer;
				}
				#pholder_icons_refresh, #pholder_icons_refreshx {
					height:45px;
					width:60px;
					float:left;
					padding: 0px 0px 0px 0px; 
					margin-left:8px;
					margin-top:10px;
					cursor: hand;
					cursor: pointer;
					color:#717d7e;
					/* background-color: #fff; 4b4b65*/
				}				
				#pholder_icons_out{
					height:60px;
					width:105px;
					float:right;
					padding: 2px 5px 5px 5px;
					cursor: hand;
					cursor: pointer;					
				}

			#premises_holder_levels{
				width:290px;
				box-sizing: border-box;
				float:right;
				padding:5px 0px 5px 7px;
				/* background-color: pink; */
			}
				#pholder_level_one, #pholder_level_onex{
					height:55px;
					width:145px;
					box-sizing: border-box;
					float:left;
					padding: 10px 0px 0px 5px;
					background-color: #717d7e;
					 border-radius: 10px 0px 0px 0px; 
					font-size:28px;
					overflow:hidden;
				}	
				#pholder_level_two, #pholder_level_twox{
					height:55px;
					width:128px;
					box-sizing: border-box;
					float:right;
					padding: 3px 5px 5px 5px;
					/*background-color: #717d7e; */
					margin-right:10px;
					 border-radius: 0px 10px 0px 0px; 
					 border: 2px solid #717d7e;
					 color: #717d7e;
				}	
					#pholder_level_two_star, #pholder_level_two_starx {
						height:45%;
						width:100%;
						box-sizing: border-box;
						font-size:14px;
						overflow:hidden;
						color:#D3D3D3;						
					}
					#pholder_level_two_cat, #pholder_level_two_catx{
						height:60%;
						width:100%;
						box-sizing: border-box;
						font-size:18px;
						overflow:hidden;
					}	
					.star_checked{
						color: #717d7e;
					}
			
			#premises_center_left, #premises_center_leftx{
				z-index:12;
				height:100%;
				width:315px;
				float:left;
				overflow-y:auto;
				box-sizing: border-box;

				
			}

				#premises_center_images, #premises_center_imagesx{
					width: 90px;
					height: 120px;
					float: left;
					margin: 4px;
					background: white;
					box-sizing: border-box;	
					text-align:center;
					border-radius: 5px 5px 0px 0px;
					border: 2px solid #717d7e;
				}	
				#premises_center_images_top, #premises_center_images_topx{
					width: 86px;
					height: 96px;
					/* background: yellow; */
					box-sizing: border-box;					
				}	
				#premises_center_images_down, #premises_center_images_downx {
					width: 86px;
					height: 20px;
					background: #717d7e;
					box-sizing: border-box;
				}				
				.scene_main {
					/* perspective: 500px; */
				}
				.scene_each{
				  width: 90px;
				  height: 100px;
				  float: left;
				  margin: 5px;
				  background: green;
				  box-sizing: border-box;
				 transform: rotateX(5deg);
				 text-align:center;
				}			
			
			#premises_center_right, #premises_center_rightx{
				z-index:12;
				height:100%;
				width:275px;
				float:right;
			}
				#premises_main_image_right, #premises_main_image_rightx {
				  width: 230px;
				  height: 250px;
				  border-radius: 5%;
				  /* background-color: #4b4b65; */
				  background-size: contain;
				  background-repeat: no-repeat;
				  background-color: rgba(255,255,255,0.2);
				  box-shadow: 3px 3px 8px rgba(0,0,0,.2);
				  box-sizing: border-box;
				  margin-bottom:0px;
				  margin-top:5px;
				  margin-left: auto;
				  margin-right: auto;
				  text-align:center;
				}
					#premises_main_image_name, #premises_main_image_namex {
					  width: 100%;
					  height: 28px;
					  box-sizing: border-box;
					  font-size:24px;
					  text-align:center;
					}				  

				 #base { 
					background: #4b4b65; 
					display: inline-block; 
					height: 45px; 
					margin-right: 20px; 
					margin-top: 0px; 
					position: relative; 
					width: 100px; 
					box-sizing: border-box;
					padding:5px;
				} 
				#base:before { 
					border-top: 15px solid #4b4b65; 
					border-left: 30px solid transparent; 
					border-right: 30px solid transparent; 
					content: ""; 
					height: 0; 
					left: 18px; 	/* 0px;	*/
					position: absolute; 
					top: 45px; 
					width: 0; 
				}					
					#base_active { 
						background: orange; 
						display: inline-block; 
						height: 45px; 
						margin-right: 20px; 
						margin-top: 0px; 
						position: relative; 
						width: 100px; 
						box-sizing: border-box;
						padding:5px;
					} 
					#base_active:before { 
						border-top: 15px solid orange; 
						border-left: 30px solid transparent; 
						border-right: 30px solid transparent; 
						content: ""; 
						height: 0; 
						left: 18px; 	/* 0px;	*/
						position: absolute; 
						top: 45px; 
						width: 0; 
					}				
				 #basex { 
					background: #4b4b65;
					display: inline-block; 
					height: 45px; 
					margin-left: 2px; 
					margin-top: 15px; 
					position: relative; 
					width: 100px; 
					box-sizing: border-box;
					padding:0px 2px 0px 2px;
				} 
				#basex:before { 
					border-bottom: 15px solid #4b4b65; 
					border-left: 30px solid transparent; 
					border-right: 30px solid transparent; 
					content: ""; 
					height: 0; 
					left: 20px; 	/* 40px;	*/
					position: absolute; 
					top: -15px; 
					width: 0;
				}
					#basex_active { 
						background: orange;
						display: inline-block; 
						height: 45px; 
						margin-left: 2px; 
						margin-top: 15px; 
						position: relative; 
						width: 100px; 
						box-sizing: border-box;
						padding:0px 2px 0px 2px;
					} 
					#basex_active:before { 
						border-bottom: 15px solid orange; 
						border-left: 30px solid transparent; 
						border-right: 30px solid transparent; 
						content: ""; 
						height: 0; 
						left: 20px; 	/* 40px;	*/
						position: absolute; 
						top: -15px; 
						width: 0;
					}				
				/* wip	*/
				.bases_normal {
					background: #4b4b65;
				}
				.bases_active {
					background: orange;
				}
				
		/* helpers for show-qr-premises; */	
		.sid_white {
			border-radius: 1%;
			background-size: contain;
			background-repeat: no-repeat;
			background-color: rgba(255,255,255,0.2);
			box-shadow: 3px 3px 8px rgba(0,0,0,.2);
			box-sizing: border-box;
			margin-top:1px;
			margin-left:auto;
			margin-right:auto;
			}
			
			
			
	
/*	specific: inner-menu-item-premises checkin/checkout ends
--------------------------------------------------------	*/		
	
	
/*	specific: verification windows
--------------------------------------------------------	*/	
	
	#pre_verification_header, #pre_verification_center, #pre_verification_bottom, #pre_verification_banner{
		height:40px;
		width:100%;
		 background-color:  #717d7e; 
		 font-size: 25px;
		 padding: 5px 0;
		 box-sizing: border-box;
		 margin-bottom:10px;
		 text-align:center;
	}
	#pre_verification_header{
		font-weight:bold;
	}	
	#pre_verification_center{
		height:320px;
		font-size: 18px;
		padding:0px; 
		background-color:transparent;
	}
		#pre_verification_center_left, #pre_verification_center_right{
			height:300px;
			width:440px;
			float:left;
			padding:5px;
			border: 3px solid #717d7e;
			border-radius:7px 7px 0px 0px;
		}	
		#pre_verification_center_right{
			float:right;
			width:120px;
		}
			#verification_image_main {
			  width: 350px;
			  height: 290px;
			  border-radius: 5%;
			  background-size: contain;
			  background-repeat: no-repeat;
			  background-color: rgba(255,255,255,0.2);
			  box-shadow: 3px 3px 8px rgba(0,0,0,.2);
			  box-sizing: border-box;
			  margin-bottom:0px;
			  margin-top:5px;
			  margin-left: auto;
			  margin-right: auto;
			  text-align:center;
			}
				#verification_image_rone, #verification_image_rtow, #verification_image_rthree, #verification_image_rfour {
				  width: 100%;
				  height: 90px;
				  background-size: contain;
				  background-repeat: no-repeat;
				  background-color: rgba(255,255,255,0.2);
				  box-shadow: 3px 3px 8px rgba(0,0,0,.2);				  
				  box-sizing: border-box;
				  font-size:24px;
				  text-align:center;				  
				  margin-bottom:5px;
				  margin-left:auto;
				  margin-right:auto;
				  
				}
				#verification_image_rone {
					height: 50px;
					width:40px;
					background-position: center;
					background-image: url(../includes/images/sid_logo.png);					
				}
				#verification_image_rthree {
					height: 100px;	
					margin-top:-65px;
				}
				#verification_image_rfour {
					height: 40px;
					/* background-color:pink;	*/
					cursor: hand;
					cursor: pointer;
					font-size:16px;
					font-weight:bold;
					padding-top:10px;					
				}	
			
	#pre_verification_bottom{
		height:45px;
		color:#fff;
		font-size:20px;
	}
	#pre_verification_banner{
		position:absolute;
		height:30px;
		width:588px;
		bottom:0;
		padding:0;
		margin-bottom:0px;
		color:darkgreen;
		box-sizing: border-box;
		text-align:right;
		font-size:small;
	}
		#pre_verification_banner_hone, #pre_verification_banner_htwo{
			position:relative;
			height:25px;
			width:auto;
			color:darkgreen;
			box-sizing: border-box;
			background-color:  #fff;
			margin-right:5px;
			padding:5px 7px 0px 0px;
			float:right;
		}	
	
	
/*	styling for support (admin) begins here 
--------------------------------------------------------	*/	
#support_main_one, #support_main_results {
	height: 485px;
	width: 780px;
	box-shadow: 0 2px 3px rgba(0,0,0,.2);
	background-color: #fff;
	border-radius: 5px 5px 5px 5px;
	padding: 7px;
	box-sizing: border-box;
}

/*	menu item holders - home (both pre and per) 	*/ 
#support_main_two {
  height: 470px;
  width: 760px;   
  border-radius: 5px;
  /* background-color: #4b4b65; */
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 3px 3px 8px rgba(0,0,0,.6);
  box-sizing: border-box;
  margin-left:auto;
  margin-right:auto;
}

	#menu_holder_support_home, #support_uverify_main{
		position:relative;
		height:440px;  
		width: 700px;
		padding: 5px; 
		top:15px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: #4CAF50; */
		box-sizing: border-box;
		overflow-y: auto;
		color:darkblue;
		font-family: 'Slabo 27px';
		font-size: 14px;
		text-align: justify;
	}
	#mholder_support_home_one {
		position:relative;
		height:360px;
		width: 560px;
		padding: 7px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: #4CAF50; */	
		box-sizing: border-box;
	}
	
	#support_uverify_main{
		display:none;
		width: 740px;
		padding: 0px;
	}
		#support_uverify_rone, #support_uverify_rtwo{
			position:relative;
			box-sizing: border-box;
			padding: 0px;
			height:255px;
			width: 740px;
			margin-left:auto;
			margin-right:auto;		
			/* background-color: #4CAF50; */
		}
		#support_uverify_rtwo{
			height:180px;
			border-top: 5px solid black;
			margin-top: 5px;
			padding-top: 5px;
			/* background-color: blue; */
		}
			#support_uverify_rone_left{
				height:260px;
				width: 300px;
				float:left;
				/* background-color: pink; */
			}
			#support_uverify_rone_right{
				height:260px;
				width: 440px;
				float:right;
				/* background-color: yellow; */
			}	
				#support_uverify_rone_left_top{
					height:230px;
					width: 300px;
					/* background-color: black; */
				}
				#support_uverify_rone_left_down{
					height:25px;
					width: 300px;
					font-size:large;
					/* background-color: orange; */
				}	
				#support_uverify_rone_right_top{
					height:230px;
					width: 440px;
					/* background-color: orange; */
				}
				#support_uverify_rone_right_down{
					height:25px;
					width: 420px;
					font-size:large;
					/* background-color: black; */
				}
				
			#support_uverify_rtwo_left{
				height:165px;
				width: 360px;	/* was 370	*/
				float:left;
				border: 1px solid purple;
				border-radius: 10px 10px 0px 0px;
				/* background-color: yellow; */
			}
				#support_uverify_rtwo_left_top{
					height:80px;
					width: 360px;
					float:left;
					border-radius: 10px 10px 0px 0px;
					font-size:20%;
					/* background-color: yellow; */
				}
				#support_uverify_rtwo_left_down{
					box-sizing: border-box;
					height:85px;
					width: 360px;
					float:right;
					padding:3px;
					background-color: purple;
				}	
					#support_uverify_rtwo_left_down_header, #support_uverify_rtwo_left_down_center, #support_uverify_rtwo_left_down_bottomm, #support_uverify_back_bottom {
						height:20px;
						width: 100%;
						margin-bottom: 1px;
						text-align:center;
					}
					#support_uverify_rtwo_left_down_header {
						height:15px;
						padding-top:0px;
						color:green;
					}					
					#support_uverify_rtwo_left_down_center {
						height:25px;
						/* display:none; */
					}
					#support_uverify_rtwo_left_down_bottom {
						height:25px;
						margin-top:1px;
						text-align:center;
					}
					#support_uverify_back_bottom {
						height:12px; 
						text-align:center;
						font-size:small; 
						background-color:#fff;
						border-radius:3px;
						width:32px;
						padding: 0px 2px 0px 2px;
					}					
					
			#support_uverify_rtwo_right{
				height:165px;
				width: 370px;
				float:right;
				/* background-color: pink;  */
			}
				#support_uverify_rtwo_right_left{
					height:160px;
					width: 260px;
					float:left;
					border-radius: 10px 10px 0px 0px;
				}
					#support_uverify_actions, #support_uverify_globe {
						height:160px;
						width: 120px;
						float:left;
						padding:3px;
						/* background-color: green; 
						border: 1px solid black;	*/
						border-radius: 10px 10px 0px 0px;
					}
					#support_uverify_globe {
						width: 120px;
						float:right;	
						/* background-color: yellow; */
					}
						#support_uverify_actions_header, #support_uverify_actions_accept, #support_uverify_actions_skip, #support_uverify_actions_reject{
							height:35px;
							margin-bottom: 3px;
							width: 100%;
							/* background-color: yellow; 	*/
						}
						#support_uverify_actions_header {
							height:25px;
						}
						#support_uverify_actions_accept {
							margin-bottom: 10px;
							color:green;
							font-size:large;
						}						
						#support_uverify_globe_one, #support_uverify_globe_two, #support_uverify_globe_three{
							height:35px;
							width: 90%;
						}
						#support_uverify_globe_one {
							width: 50%;
							text-align: center;
							background-position: center; 
							background-image: url(../includes/images/sid_logo.png);
						}
						#support_uverify_globe_two {
							margin-top:-35px;
							height:70px;
						}
						#support_uverify_globe_three {
							font-weight:bold;
							font-size: large;
							padding-top:7px;
						}						
				#support_uverify_rtwo_right_right{
					height:165px;
					width: 100px;
					float:right;
					/* background-color: purple; */
				}	
					#support_uverify_hright_one, #support_uverify_hright_two, #support_uverify_hright_three{
						height:65px;
						width: 100%;
						border-bottom: 2px solid red;
						text-align:center;	
						cursor:pointer;
					}
					#support_uverify_hright_three{
						height:30px;
						border-bottom: none;
						background-color:#fff;	
						background-image:url(images/fa_caret-up.png);
						background-image:url(images/angle-double-up.png);
						/* background-repeat:no-repeat;  */
						background-size:cover;
						background-size: 100% 100%;
						overflow: hidden;
					}	
									
	
	#menu_holder_support_uadd{
		display:none;
		position:relative;
		height:440px;  
		width: 700px;
		padding: 5px; 
		top:15px; 
		padding: 5px;
		margin-left:auto;
		margin-right:auto;
		 background-color: #fff; 	
		box-sizing: border-box;
		overflow-y: auto;
		color:darkblue;
	}
	
	#support_uverify_psp_image-xxx, #premises_center_rightx-xxx{
		z-index:12;
		height:100%;
		width:275px;
		float:right;
	}
	.sid_wshadow {
	  background-size: contain;
	  background-repeat: no-repeat;
	  background-color: rgba(255,255,255,0.2);
	  box-shadow: 3px 3px 8px rgba(0,0,0,.2);
	  box-sizing: border-box;
	  border-radius: 5%;
	  margin-bottom:0px;
	  margin-top:2px;
	  margin-left: auto;
	  margin-right: auto;
	  text-align:center;
	}		
		#support_uverify_psp_image, #support_uverify_nid_image {
		  height: 225px;
		  width: 290px;
		  border-radius: 10px;
		  /* background-color: #4b4b65;  */
		  background-size: contain;
		  background-repeat: no-repeat;
		  background-color: rgba(255,255,255,0.2);
		  box-shadow: 3px 3px 8px rgba(0,0,0,.2);
		  box-sizing: border-box;
		  margin-bottom:0px;
		  margin-top:2px;
		  margin-left: auto;
		  margin-right: auto;
		  text-align:center;
		}
		#support_uverify_nid_image {
			width: 420px;
			border-radius: 10px;
		}
			#support_psp_image , #support_nid_image, #support_preone_image, #support_pretwo_image {
				max-width:100%;
				max-height:100%;
			}	
			
			#premises_main_image_name-xxx, #premises_main_image_namex-xxx {
			  width: 100%;
			  height: 28px;
			  box-sizing: border-box;
			  font-size:24px;
			  text-align:center;
			}














/*	styling for support (admin) ends here 
--------------------------------------------------------	*/


/*	styling for QR Checkins begins here 
--------------------------------------------------------	*/
/*	QR Checkin 	*/
#qr_scanner_main_wrapper, #qr_scanner_main_wrapperx {
  width: 350px;
  height: 250px;
  /* background-color: #4b4b65;  */
  box-sizing:border-box;
  margin-left: auto;
  margin-right: auto;
}

#qr_scanner_main_camera, #qr_scanner_main_camerax {
  width: 190px;
  height: 190px;
  border-radius: 5%;
  /* background-color: #4b4b65; */
  background-size: contain;
  background-repeat: no-repeat;
  background-color: rgba(255,255,255,0.2);
  box-shadow: 3px 3px 8px rgba(0,0,0,.2);
  box-sizing: border-box;
  margin-bottom:15px;
  margin-top:15px;
  margin-left: auto;
  margin-right: auto;
}

#qr_scanner_main_wrapper_top, #qr_scanner_main_wrapper_topx {
	height: 190px;
	width:100%;	
	/* background-color: purple; */
}
#qr_scanner_main_wrapper_bottom, #qr_scanner_main_wrapper_bottom {
	height: 60px;
	width:100%;	
	text-align:center;
	/* background-color: green; */
}

.qrscanner_tcamera {
	width:190px;
	margin: 0 auto;
	text-align:center;
}
	
/*	Non-QR Checkins 	
#qr_scanner_main_wrapper, #qr_scanner_main_wrapperx {
	width: 350px;
	height: 250px;
	 background-color: #4b4b65;  
	box-sizing:border-box;
	margin-left: auto;
	margin-right: auto;
  }
  
  #qr_scanner_main_camera, #qr_scanner_main_camerax {
	width: 190px;
	height: 190px;
	border-radius: 5%;
	 background-color: #4b4b65; 
	background-size: contain;
	background-repeat: no-repeat;
	background-color: rgba(255,255,255,0.2);
	box-shadow: 3px 3px 8px rgba(0,0,0,.2);
	box-sizing: border-box;
	margin-bottom:15px;
	margin-top:15px;
	margin-left: auto;
	margin-right: auto;
  }
  
  #qr_manual_main_wrapper_bottom {
	  height: 190px;
	  width:100%;	
	   background-color: purple; 
  }
  #qr_scanner_main_wrapper_bottom, #qr_scanner_main_wrapper_bottom {
	  height: 60px;
	  width:100%;	
	  text-align:center;
	   background-color: green; 
  }
  */
	
	
	
/*	----------------------------------	*/	
	


/*	styling for School Reports begins here 
--------------------------------------------------------	*/
/*	report selection holders 	*/
#sch_reports_holder{
	display:none;
	position:relative;
	height:400px;
	width: 580px;
	padding: 10px;
	top:50px;			/* margin-top:50px; does not work well here, pushes parent down	*/
	margin-left:auto;
	margin-right:auto;
	/* background-color: #4CAF50;	*/
	box-sizing: border-box;
	
}
	#sch_reports_header{
		height:60px;
		width: 480px;
		padding: 10px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: #000;	*/
		box-sizing: border-box;	
		text-align:center;
	}
	#sch_reports_middle{
		height:45px;
		width: 480px;
		margin-left:auto;
		margin-right:auto;
		/* background-color: blue;	*/
		box-sizing: border-box;
	}
	#sch_reports_lower{
		height:155px;
		width: 480px;
		padding: 5px 0;
		margin-left:auto;
		margin-right:auto;
		box-sizing: border-box;	
	}	
		#prerep_lower_main_sch, #prerep_lower_one_sch, #prerep_lower_two_sch, #prerep_lower_checkbox_sch{
			position:relative;
			margin-left:auto;
			margin-right:auto;
			box-sizing: border-box;	
			text-align: center;
		}
		.prerep_lower_main_sch, .prerep_lower_one_sch, .prerep_lower_two_sch, .prerep_lower_checkbox_sch{
			position:relative;
			margin-left:auto;
			margin-right:auto;
			box-sizing: border-box;	
			text-align: center;
		}		
		#prerep_lower_main_sch{
			height:100%;
			width: 450px;
			/* background-color: blue;	*/
		}
		.prerep_lower_main_sch{
			height:100%;
			width: 450px;
			/* background-color: blue;	*/
		}		
		#prerep_lower_one_sch{
			height:38px;
			width: 450px;
			text-align:center;
			/* background-color: green;	*/
		}
		.prerep_lower_one_sch{
			height:38px;
			width: 450px;
			text-align:center;
			/* background-color: green;	*/
		}		
		#prerep_lower_two_sch, #prerep_lower_checkbox_sch{
			height:38px;
			width: 450px;
			/* background-color: pink;	*/
		}	
		.prerep_lower_two_sch, .prerep_lower_checkbox_sch{
			height:38px;
			width: 450px;
			/* background-color: pink;	*/
		}		
		#prerep_lower_checkbox_sch{	
			display: none;
		}
		.prerep_lower_checkbox_sch{	
			display: none;
		}		
		#prerep_lower_three_sch{
			height:38px;
			width: 450px;
			text-align:center;
			/* background-color: green; */
			 padding-top:5px;	
		}	
		.prerep_lower_three_sch{
			height:38px;
			width: 450px;
			text-align:center;
			/* background-color: green; */
			 padding-top:5px;	
		}		
		#prerep_lower_four_sch{
			height:30px;
			width: 450px;
			text-align:center;
			/* background-color: pink;	*/
		}	
		.prerep_lower_four_sch{
			height:30px;
			width: 450px;
			text-align:center;
			/* background-color: pink;	*/
		}		
			#prerep_inner_left_sch, #prerep_inner_left_sch_class{
				height:30px;
				width: 220px;
				/* background-color: red; */
				float:left;
				padding:2px;
			}
			.prerep_inner_left_sch, .prerep_inner_left_sch_class{
				height:30px;
				width: 220px;
				/* background-color: red; */
				float:left;
				padding:2px;
			}			
			#prerep_inner_right_sch, #prerep_inner_right_sch_stream{
				height:30px;
				width: 220px;
				/* background-color: yellow; */
				float:right;
				padding:2px;
			}	
			.prerep_inner_right_sch, .prerep_inner_right_sch_stream{
				height:30px;
				width: 220px;
				/* background-color: yellow; */
				float:right;
				padding:2px;
			}			
				.dycenter_sch{
					display:none; 
					width: 160px; 
					height: 25px; 
					margin: 0 auto; 
					font-size:20px; 
					text-align:center;
				}	

	#rholder_sch{
		height:45px;
		width: 240px;
		background-color: #FFF;
		margin:auto;	
		box-sizing: border-box;
	}
	.rholder_sch{
		height:45px;
		width: 240px;
		background-color: #FFF;
		margin:auto;	
		box-sizing: border-box;
	}
	.radio-group-report_sch {
	  border: solid 3px #675f6b;
	  display: inline-block;
	  border-radius: 5px;
	  overflow: hidden;
	  text-align: center;
	}
/*	----------------------------------	*/
/*	----------------------------------	*/


/*	Dynamic Table by JQuery for Subjects Verification 
------------------------------------------------------	*/
.verify_subjects_table {
	font-family: Arial, Helvetica, sans-serif;
	border-collapse: collapse;
	width: 100%;
  }
  
  .verify_subjects_table td, .verify_subjects_table th {
	border: 1px solid #ddd;
	padding: 8px;
  }
  
  .verify_subjects_table tr:nth-child(even){background-color: #f2f2f2;}
  
  .verify_subjects_table tr:hover {background-color: #ddd;}
  
  .verify_subjects_table th {
	padding-top: 12px;
	padding-bottom: 12px;
	text-align: left;
	background-color: #04AA6D;
	color: white;
  }

  /*	copied for subject-teacher-mappings */
	.verify_map_subjects_table {
		font-family: Arial, Helvetica, sans-serif;
		border-collapse: collapse;
		width: 100%;
		text-align: left;
	}
	
	.verify_map_subjects_table td, .verify_map_subjects_table th {
		border: 1px solid #ddd;
		padding: 2px;
	}
	
	.verify_map_subjects_table tr:nth-child(even){background-color: #f2f2f2;}
	
	.verify_map_subjects_table tr:hover {background-color: #ddd;}
	
	.verify_map_subjects_table th {
		padding-top: 2px;
		padding-bottom: 2px;
		text-align: left;
		background-color: #04AA6D;
		color: white;
	}

		.vmaps_text_box {
			padding: 0px;
			width: auto;
			max-width: 42px;
			text-align: center;
		}

/*	styling for rider-operations (main-pickups) begins here 
--------------------------------------------------------	*/	
/* #base_holder_all_rider_pickups, already defined up 
#base_holder_all_rider_pickups{
	display:none;
	position:relative;
	height:440px;
	width: 600px;
	padding: 1px;
	top:15px;
	margin-left:auto;
	margin-right:auto;

	box-sizing: border-box;
	overflow-y: auto;
	color:darkblue;
	font-family: 'Slabo 27px';
  	font-size: 14px;
	text-align: justify;
}
*/

#rider_pickups_main{
	position:relative;
	height:435px;
	width: 590px;
	padding: 0; 
	margin-left:auto;
	margin-right:auto;
	/* background-color: hsl(268, 39%, 49%); */
	box-sizing: border-box;
	color:rgb(0, 139, 53);
	font-family: 'Slabo 27px';
	font-size: 14px;
	text-align: justify;
}

	#rider_pickups_rone, #rider_pickups_rtwo{
		position:relative;
		box-sizing: border-box;
		padding: 0px;
		height:255px;
		width: 590px;
		margin-left:auto;
		margin-right:auto;		
		/* background-color: #4CAF50; */
	}
	#rider_pickups_rtwo{
		height:170px;
		border-top: 5px solid black;
		margin-top: 3px;
		padding-top: 3px;
		box-sizing: border-box;
		/* background-color: blue; */
	}
  
		#rider_pickups_rone_left{
			height:255px;
			width: 196px;
			float:left;
			/* background-color: pink; */
		}
		#rider_pickups_rone_right{
			height:255px;
			width: 388px;
			float:right;
			/* background-color: yellow; */
		}	

			#rider_pickups_rone_left_top{
				height:200px;
				width: 196px;
				max-height:200px;
				max-width:196px;				
				text-align: center;
				background-position: center;
				background-repeat:no-repeat;
				background-image: url(../styles/images/generic.jpg);				
				/* background-color: black; */
			}
			#rider_pickups_rone_left_down{
				height:52px;
				width: 196px;
				margin-top: 2px;
				padding-top: 5px;
				font-size:large;
				background-color: purple; 
				text-align: center; 
				font-family:Verdana, Geneva, Tahoma, sans-serif;
				font-weight: bold;
				box-sizing: border-box;
			}	
			#rider_pickups_rone_right_top{
				height:180px;
				width: 388px;
				background-size: contain;
				text-align: center;
				/*  background-color: orange; */
			}
				#rider_pickups_rone_right_top_student_main{
					height:178px;
					width: 385px;
					margin-left:auto;
					margin-right:auto;					
					border: 1px solid purple;
					box-sizing: border-box;
					border-radius: 15px 15px 0px 0px;
					/* background-color: green; */		 
				}	
					#rider_pickups_student_main_details{
						height:172px;
						width: 235px;
						float: left;
						box-sizing: border-box;
						padding: 3px;			
						border-radius: 15px 0px 0px 0px;
						font-family: Verdana, Geneva, Tahoma, sans-serif;
						font-size: medium;
						/* background-color: pink; */					 
					}	
					#rider_pickups_student_main_picture{
						height:170px;
						width: 140px;
						max-height:170px;
						max-width: 140px;
						box-sizing: border-box;
						/* margin-left:5px; */
						margin-right:2px;
						margin-top: 2px;
						margin-bottom: 2px;
						float: right;			
						border-radius: 15px 15px 15px 15px;
						object-fit: contain;
						background-size: contain;
						text-align: center;
						background-position: center; 
						background-repeat:no-repeat;
						/* background-image: url(../styles/images/generic_small.jpg);						
						background-color: purple; */ 				 
					}														
			#rider_pickups_rone_right_down{
				height:72px;
				width: 388px;
				padding-top: 3px;
				box-sizing: border-box;
				font-size:large;
				background-color: purple;
				text-align: center;
				font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
				font-size: large;
			}		

		#rider_pickups_rtwo_left{
			height:156px;
			width: 120px;	/* was 370	*/
			box-sizing: border-box;
			float:left;
			/* border: 1px solid purple; */
			border-radius: 10px 10px 0px 0px;
			/* background-color: yellow; */
		}
		
		#rider_pickups_rtwo_generic_splitter{
			height:160px;
			width: 463px;
			box-sizing: border-box;
			float:right;
			/* background-color: white; */
		}
		#rider_pickups_rtwo_center{
			height:160px;
			width: 335px;
			box-sizing: border-box;
			float:left;
			/* border: 1px solid purple; */
			border-radius: 10px 10px 0px 0px;
			/* background-color: green; */			 
		}
			#rider_pickups_rtwo_center_up{				 
				 height:25px;
				 width: 333px;
				 box-sizing: border-box;
				 padding-top: 3px;
				 /* border-bottom: 1px solid purple; */
				 border-radius: 10px 10px 0px 0px;
				 font-size:large;
				 /* font-weight: bold; */
				 text-align: center;
				 /* background-color: orange; */			 
			}
			#rider_pickups_rtwo_center_down{
				 height:133px; 
				 width: 333px;
				 padding: 2px 3px 1px 3px;
				  box-sizing: border-box; 
				 /* background-color: purple; */
				  /*
				  overflow-x: scroll;
				  overflow-y: hidden;
				  white-space:nowrap;
				  */
			}
			#rider_pickups_rtwo_center_down_grid_wrapper{
				height:100%; 
				width: 100%;
				box-sizing: border-box; 
		   }
				#rider_pickups_thumbnail_wrapper{  
					height:132px;
					width: 100px;
					box-sizing: border-box; 
					border: 1px solid #4b4b65;
					background-color: #4b4b65;
					border-radius: 3px 3px 0px 0px; 				 
				}
					#rider_pickups_thumbnail_picture{
						height:90px;
						width: 98px;
						max-height:90px;
						max-width: 100px;	
						box-sizing: border-box; 
						margin-left: auto;	
						margin-right: auto;	
						margin-top: 1px;			
						/* border: 1px solid purple; */
						/* background-color: yellow; */		 
					}
					#rider_pickups_thumbnail_names{
						height:22px;
						width: 100%;
						max-height:22px;
						max-width: 100%;
						margin-top: 1px;
						box-sizing: border-box; 
						margin-left: auto;	
						margin-right: auto;	  
						/* background-color: black; */				 
					}									
		#rider_pickups_rtwo_right{
			height:160px;
			width: 120px;	
			float:right;
			box-sizing: border-box;
			/* border: 1px solid purple; */
			border-radius: 10px 10px 0px 0px;
			/* background-color: yellow; */
		}		

		#riderpickup_actions, #riderpickup_globe {
			height:156px;
			width: 120px;
			float:left;
			padding:3px;
			/* background-color: green; 
			border: 1px solid black;	*/
			border-radius: 10px 10px 0px 0px;
		}
			#riderpickup_globe {
				width: 120px;
				float:right;	
				/* background-color: yellow; */
			}
				#riderpickup_actions_header, #riderpickup_actions_scan_qr, #riderpickup_actions_app, #riderpickup_actions_manual{
					height:30px;
					margin-bottom: 3px;
					width: 100%;
					font-size:large;
					/* background-color: yellow; 	*/
				}
				#riderpickup_actions_header {
					height:25px;
				}
				#riderpickup_actions_scan_qr {
					margin-bottom: 10px;
					color:green;
				}	
				#riderpickup_actions_app {
					margin-bottom: 10px;
					color:green;
				}									
				#riderpickup_globe_one, #riderpickup_globe_two, #riderpickup_globe_three{
					height:30px;
					width: 90%;
				}
				#riderpickup_globe_one {
					width: 50%;
					text-align: center;
					background-position: center; 
					background-image: url(../includes/images/sid_logo.png);
				}
				#riderpickup_globe_two {
					margin-top:-30px;
					height:70px;
				}
				#riderpickup_globe_three {
					font-weight:bold;
					font-size: large;
					padding-top:7px;
				}		

		.sid_wshadow_nobr {
			background-size: contain;
			background-repeat: no-repeat;
			background-color: rgba(255,255,255,0.2);
			box-shadow: 3px 3px 8px rgba(0,0,0,.2);
			box-sizing: border-box;
			border-radius: 3%; 
			margin-bottom:0px;
			margin-top:2px;
			margin-left: auto;
			margin-right: auto;
			text-align:center;
		  }	
		  .sid_wshadow_brtops {
			background-size: contain;
			background-repeat: no-repeat;
			background-color: rgba(255,255,255,0.2);
			box-shadow: 3px 3px 8px rgba(0,0,0,.2);
			box-sizing: border-box;
			border-radius: 3% 3% 0 0; 
			margin-bottom:0px;
			margin-top:2px;
			margin-left: auto;
			margin-right: auto;
			text-align:center;
		  }		  	

		  .grid_std_list_container{
			display: grid;
			grid-gap: 10px;
			grid-auto-flow: column;
			grid-auto-columns: auto auto auto; 
			 box-sizing: border-box; 
			/* background: black; */
			overflow-x: auto; 
			-webkit-overflow-scrolling: touch; 
			padding-left: 5px;
			padding-right: 5px;	
			overflow-y: hidden;
			white-space:nowrap;			
		}	

		.rider_image_fit{
			max-width: 100%;
			max-height: 100%;
		}

	/* overlay div for scans, sid-number, and app list */
	#rider_pickups_main_overlay{
		position:relative;
		z-index: 11;
		height: 100%;		/* 430px; */
		width: 100%;		/* 580px; */
		padding: 3px; 
		margin-left:auto;
		margin-right:auto;
		background-color: white; 
		box-sizing: border-box;
		color:rgb(0, 139, 53);
		font-family: 'Slabo 27px';
		font-size: 14px;
		text-align: justify;
		opacity: 0.98;
		position: absolute;
		top: 0;
		left: 0;
	}		
		/* qr-scanner for riders, classes used 		
		-----------------------------------------------      */
		.qr_scanner_main_wrapper, .qr_scanner_main_wrapperx {
			width: 350px;
			height: 250px;
			/* background-color: .4b4b65;  */
			box-sizing:border-box;
			margin-left: auto;
			margin-right: auto;
		}		
		.qr_scanner_main_camera, .qr_scanner_main_camerax {
			width: 190px;
			height: 190px;
			border-radius: 5%;
			/* background-color: .4b4b65; */
			background-size: contain;
			background-repeat: no-repeat;
			background-color: rgba(255,255,255,0.2);
			box-shadow: 3px 3px 8px rgba(0,0,0,.2);
			box-sizing: border-box;
			margin-bottom:15px;
			margin-top:15px;
			margin-left: auto;
			margin-right: auto;
		}		
		.qr_scanner_main_wrapper_top, .qr_scanner_main_wrapper_topx {
			height: 190px;
			width:100%;	
			/* background-color: purple; */
		}
		.qr_scanner_main_wrapper_bottom, .qr_scanner_main_wrapper_bottom {
			height: 60px;
			width:100%;	
			text-align:center;
			/* background-color: green; */
		}		
		.qrscanner_tcamera {
			width:190px;
			margin: 0 auto;
			text-align:center;
		}	


/*	on-off toggle (slider); begin, copied from mobile 	
-------------------------------------------------- */
.switch_cs {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 24px;
  }
  
  .switch_cs input { 
	opacity: 0;
	width: 0;
	height: 0;
  }
  
  .slider_cs {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  .slider_cs:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  input:checked + .slider_cs {
	background-color: #2196F3;
  }
  
  input:focus + .slider_cs {
	box-shadow: 0 0 1px #2196F3;
  }
  
  input:checked + .slider_cs:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider_cs.round {
	border-radius: 34px;
  }
  
  .slider_cs.round:before {
	border-radius: 50%;
  }

  .dummy_naming_class {
	color:blue;
  }

/*	on-off toggle (slider); end	
-------------------------------------------------- */		


/*	dummy classes for targeting items only; begin 	
-------------------------------------------------- */
.subject_group_edits_class {
	font-size: inherit;
  }
  .subject_classes_edits_class {
	font-size: inherit;
  }


/*	dummy classes for targeting items only; end	
-------------------------------------------------- */
