@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6,
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em,
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup,
menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	}

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
	display: block;
	}

a img {border: 0;}
img { max-width: 100%; }

.gigantic{
	font-size: 110px;
	line-height: 120px;
	letter-spacing: -2px;
	}

.huge, h1{
	font-size: 26px;
	line-height: 36px;
	letter-spacing: -1px;
	font-weight:normal;
	color:#3e3e3f;
	}

.large, h2 {
	font-size: 22px;
	line-height: 30px;
	}

.bigger, h3{
	font-size: 20px;
	line-height: 28px;
	}

.big, h4{
	font-size: 18px;
	line-height: 26px;
	}

p{
	font-size: 15px;
	line-height: 21px;
	}

body{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	line-height: 17px;
	font-weight: 400;
	}

.small, small {
	font-size: 13px;
	line-height: 18px;
	}

.clear{
	clear:both;
	}

.fd_bck-btn{
	padding:5px 15px;
	background-color:#903;;
	border:none;
	color:#FFFFFF;
	font-weight:bold;
	cursor:pointer;
	margin:5px 0;
	}
.error{
	color:#F00;
	}
.entryerror{
	background-color:#900;
	padding:8px 5px 8px 20px;
	color:#FFFFFF;
	font-weight: normal;
	margin: 10px 0;
	}
.entrysuccess{
	background-color: #81dca5;
	width:98%;
	padding:8px 5px 8px 20px;
	color:#FFFFFF;
	font-weight: normal;
	margin: 10px 0;
	}
.tooltip{
	display:none;
	position:absolute;
	border:1px solid #333;
	background-color:#161616;
	border-radius:5px;
	padding:10px;
	color:#fff;
	font-size:12px Arial;
	width:500px;
	}
.tooltiplink{
	text-decoration:none;
	color:#00325b;
	}

.mainwrap{
	width:100%;
	height: 100%;
	margin:0 auto;
	}



/* header */
.headerwrap{
	width:100%;
	height:100px;
	margin:0 auto;
	border-bottom:1px solid #d1d2d2;
	}
.headerwrap .headerwrap-inner{
	width:96%;
	height: 100%;
	margin:0 auto;
	position: relative;
	}
.headerwrap .headerwrap-inner .logo{
	width:235px;
	height:77px;
	position: absolute;
	left: 0;
	top: 10px;
	}
.headerwrap .headerwrap-inner .logo a{
	border:none;
	text-decoration:none;
	}
.headerwrap .headerwrap-inner .profile{
	position: absolute;
	right: 0;
	top:35px;
	}
.headerwrap .headerwrap-inner .profile p{
	color: #666;
	line-height: 18px;
	padding:5px 0;
	}
.headerwrap .headerwrap-inner .profile a{
	color: #903;
	text-decoration: none;
	padding:2px 10px;
	}
.headerwrap .headerwrap-inner .profile .logout{
	color: #FFF;
	text-decoration:none;
	background-color:#903;
	padding:2px 10px;
	}
/* header */


/* content */
.contentwrap{
	width:100%;
	height: auto;
	display: inline-block;
	min-height:300px;
	margin:0 auto;
	background-color:#f9f8f8;
	}
.contentwrap-inner{
	width:96%;
	margin:0 auto;
	}


/* menu */
.menuwrap{
	width:96%;
	display: flex;
	height: auto;
	margin:5px auto 20px auto;
	background-color:#903;
 	}
.menuwrap a{
	padding:10px 15px;
	margin:0px;
	display:inline-block;
	color:#fff;
	text-decoration:none;
	font-weight: 500;
	font-size: 15px;
	}
/* Menu */

/* Login Form */
.login-form{
	width:100%;
	max-width: 350px;
	margin: 9% auto 0 auto;
	background-color:#fff;
	padding:20px;
	}
.login-form h1{
	font-weight: 600;
	margin-bottom: 10px;
	}
.login-form .label{
	display: block;
	font-size: 14px;
	margin: 5px 0;
	}
.login-form input[type="text"],
.login-form input[type="password"]{
	width: 94%;
	padding: 8px 6px;
	font-size: 17px;
	outline:none;
	}
	.login-form .login_bck-btn, .login-form .fd_bck-btn{
	padding: 12px 10px;
	margin: 10px 0 15px 0px;
	width: 99%;
  font-size: 16px;
  font-weight: 600;
	background: #903;
	color: #FFFFFF;
	}

/* Content Wrap */
.entry{
	width:100%;
	min-height:400px;
	}
.entry h1.title{
	margin:10px 0;
	font-weight: 500;
	}

/* User Area */
.anatomy-wrap{
	width:98%;
	height: auto;
	display: inline-block;
	position: relative;
	margin:30px 0;
	padding: 40px 20px;
	background-color: #FFF;
	}
.anatomy-wrap .display-text{
	color: #3e3e3f;
	position: absolute;
	font-weight:500;
}
.anatomy-wrap .display-text.top{
	top: 10px;
	left:40%;
	}
.anatomy-wrap .display-text.left{
	transform: rotate(270deg);
	transform-origin: left center 0;
	top: 60%;
	left:10px;
	}
.anatomy-wrap .display-text.right{
	transform: rotate(90deg);
	transform-origin: right center 0;
	top: 60%;
	right:15px;
	}
.anatomy-wrap .display-text.bottom{
	bottom: 10px;
	left:40%;
	}

.anatomy-wrap .anatomy-container{
	display: flex;
	background-color: #ccc;
	margin: auto;
	width: 950px;
 }
.anatomy-wrap .anatomy-container .left-section{
	width:85%;
	height:auto;
	padding:3px
	}
.anatomy-wrap .anatomy-container .right-section{
	width:15%;
	height:530px;
	padding:3px;
	}

	/* left section */
	.left-section .top-section{
		display:table;
		}

	.left-section .top-section .section{
		float:left;
		width:120px;
		height:80px;
		border:1px solid #999;
		background-color: #dcdcdc;
		margin:5px 0 5px 10px;
		text-decoration:none;
		color:#3e3e3f;
		}
	.top-section .circlecounter{
		position: absolute;
		display: block;
		width: 20px;
		height: 20px;
		margin-top: -2px;
		margin-left: -8px;
		border-radius: 50%;
		border: 1px solid #000;
		background-color: #3e3e3f;
		color: #FFF;
		font-size: 11px;
		text-align: center;
		}
	.top-section .section .boxcontent{
		padding:20px 3px 0 3px;
		display:block;
		text-align:center;
		font-size: 13px;
		line-height: 16px;
		font-weight: 500;
		}
	/* left section */


	/* left section */
	.left-section .middle-section{
		display:table;
		}
	.left-section .middle-section .middle-section-left{
		width:150px;
		float:left;
		}
	.left-section .middle-section .middle-section-left .section{
		float:left;
		width:120px;
		height:80px;
		border:1px solid #999;
		background-color: #dcdcdc;
		margin:5px 0 26px 10px;
		text-decoration:none;
		color:#3e3e3f;
		}
	.middle-section-left  .circlecounter{
		position: absolute;
		display: block;
		width: 20px;
		height: 20px;
		margin-top: -2px;
		margin-left: -8px;
		border-radius: 50%;
		border: 1px solid #000;
		background-color: #3e3e3f;
		color: #FFF;
		font-size: 11px;
		text-align: center;
		}
	.middle-section-left  .section .boxcontent{
		padding:20px 3px 0 3px;
		display:block;
		text-align:center;
		font-size: 13px;
		line-height: 16px;
		font-weight: 500;
		}
	/* left section */

	/* graph section */
	.left-section .middle-section .middle-section-right{
		width:630px;
		float:left;
		}
	.left-section .middle-section .middle-section-right .graph{
		width: 630px;
		height:315px;
		background-color:#FFF;
		margin-top:12px;
		display:table;
		}
	.middle-section-right .graph .graphcontent{
		width:465px;
		vertical-align: middle;
		margin:60px auto 0 auto;
		}
	.graph .graphcontent h1{
		color:#903;
		margin:10px 0;
		text-align:center;
		font-size:20px;
		}
	.graph .graphcontent p{
		line-height:1.9em;
		text-align:center;
		}
	.graph .grappriority{
		width:630px;
		border-top:1px solid #ccc;
		}
	.tableratebox{
		background-color:#ccc;
		color:#FFF;
		text-align:center;
		font-size:10px !important;
	}
	.tablegraphbox{
		text-align:center;
		border-right:1px solid #ccc;
		border-bottom:1px solid #ccc;
		width:90px !important;
		}
	.tablegraphbox p{
		padding:2px 4px;
		line-height:10px !important;
		font-size:10px !important;
		margin:0;
		}
	.tablegraphbox .green{
		color:green;
		}
	/* graph section */

	/* bottom section */
	.left-section .bottom-section{
		display:table;
		}
	.left-section .bottom-section .section{
		float:left;
		width:120px;
		height:80px;
		border:1px solid #999;
		background-color: #dcdcdc;
		margin:5px 0 5px 10px;
		text-decoration:none;
		color:#3e3e3f;
		}
	.bottom-section .circlecounter{
		position: absolute;
		display: block;
		width: 20px;
		height: 20px;
		margin-top: -2px;
		margin-left: -8px;
		border-radius: 50%;
		border: 1px solid #000;
		background-color: #3e3e3f;
		color: #FFF;
		font-size: 11px;
		text-align: center;
		}
	.bottom-section .section .boxcontent{
		padding:20px 3px 0 3px;
		display:block;
		text-align:center;
		font-size: 13px;
		line-height: 16px;
		font-weight: 500;
		}
	/* bottom section */

	/* right section */
	.right-section .section{
		width:120px;
		height:80px;
		display:block;
		border:1px solid #999;
		background-color: #dcdcdc;
		margin:5px 0 5px 10px;
		text-decoration:none;
		color:#3e3e3f;
		}
	.right-section .circlecounter{
		position: absolute;
		display: block;
		width: 20px;
		height: 20px;
		margin-top: -2px;
		margin-left: -8px;
		border-radius: 50%;
		border: 1px solid #000;
		background-color: #3e3e3f;
		color: #FFF;
		font-size: 11px;
		text-align: center;
		}
	.right-section .section .boxcontent{
		padding:20px 3px 0 3px;
		display:block;
		text-align:center;
		font-size: 13px;
		line-height: 16px;
		font-weight: 500;
		}


/* popup */
.popup-overlay {
	width: 100%;
	height: 100%;
	position: fixed;
	background: rgba(196, 196, 196, .85);
	top: 0;
	left: 100%;
	opacity: 0;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	-webkit-transition: opacity .2s ease-out;
	-moz-transition: opacity .2s ease-out;
	-ms-transition: opacity .2s ease-out;
	-o-transition: opacity .2s ease-out;
	transition: opacity .2s ease-out;
	}
.overlay .popup-overlay {
	opacity: 1.9;
	left: 0;
	z-index: 99;
 }
.popup {
  position: fixed;
  top: 25%;
  left: 45%;
  z-index: -9999;
	}
.popup .popup-body {
	background: #ffffff;
	background: -moz-linear-gradient(top, #ffffff 0%, #f7f7f7 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f7f7f7));
	background: -webkit-linear-gradient(top, #ffffff 0%, #f7f7f7 100%);
	background: -o-linear-gradient(top, #ffffff 0%, #f7f7f7 100%);
	background: -ms-linear-gradient(top, #ffffff 0%, #f7f7f7 100%);
	background: linear-gradient(to bottom, #ffffff 0%, #f7f7f7 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f7f7f7', GradientType=0);
	opacity: 0;
	min-height: 180px;
	width: 600px;
	margin-left: -200px;
	padding: 20px;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	-webkit-transition: opacity .2s ease-out;
	-moz-transition: opacity .2s ease-out;
	-ms-transition: opacity .2s ease-out;
	-o-transition: opacity .2s ease-out;
	transition: opacity .2s ease-out;
	position: relative;
	-moz-box-shadow: 1px 2px 3px 1px rgb(185, 185, 185);
	-webkit-box-shadow: 1px 2px 3px 1px rgb(185, 185, 185);
	box-shadow: 1px 2px 3px 1px rgb(185, 185, 185);
	text-align: center;
	border: 1px solid #e9e9e9;
	}
.popup.visible, .popup.transitioning {
	z-index: 9999;
	}
.popup.visible .popup-body {
	 opacity: 1.9;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	}
.popup .popup-exit {
	cursor: pointer;
	display: block;
	width: 24px;
	height: 24px;
	position: absolute;
	right: 8px;
	top:15px;
	background: url("../images/quit.png") no-repeat;
  }
.popup .popup-content {
	overflow-y: auto;
	min-height:180px;
	height:auto;
	}
.popup-content .popup-title {
	border-bottom: 1px solid #e9e9e9;
	padding-bottom: 10px;
	color: #903;
	text-align: left;
	font-size: 20px;
	font-weight: 600;
	}
.popup-content p {
	text-align: left;
	line-height: 20px;
	}
/* popup */

.proceed-botton{
	padding:6px 10px;
	display:block;
	width:115px;
	float:right;
	margin:10px 0 15px 10px;
	color:#FFFFFF;
	font-weight:500;
	text-decoration:none;
	background: #903;
	text-align:center;

}
.fd_bck-btn{
	padding:6px 10px;
	display:block;
	width:115px;
	margin:10px 0 15px 10px;
	color:#FFFFFF;
	font-weight:normal;
	text-decoration:none;
	background: #903;
	text-align:center;
	outline:none;
	float:right;
	}
.login_bck-btn{
	padding:6px 10px;
	display:block;
	width:115px;
	margin:10px 0 15px 0px;
	color:#FFFFFF;
	font-weight:normal;
	text-decoration:none;
	background: #903;
	text-align:center;
	outline:none;
	border:none;
	cursor:pointer;
	}

/* Rate */
.reatinbgbox{
	width:100%;
	margin:20px 0 20px  0;
	display: flex;
  }

	/* dragg */
	.reatinbgbox .draggbox{
		width:50%;
		}
	.draggbox .maintitle{
		margin:0;
		padding:0;
		list-style:none;
		background-color:#dcdcdc;
		width:80%;
		}
	.draggbox .maintitle li{
		line-height:1.6em;
		padding:10px 10px;
		}
	.draggbox .maintitle li ul{
		margin:0 0 0 10px;
		padding:0;
		list-style:none;
		background-color:#ccc;
		width:94%;
		}
	.draggbox .maintitle li ul li{
		border:1px  dashed #dcdcdc;
		padding:4px;
		margin:1px 0;
		cursor:all-scroll;
		}


	/* dragg */

	/* drop */
	.reatinbgbox .dropbox{
		width:49%;
		}
	.reatinbgbox .dropbox .title{
		text-align: right;
	  }
	.dropbox .maintitle{
		margin:0;
		padding:0;
		list-style:none;
		background-color:#dcdcdc;
		width:80%;
		float: right;
		}
	.dropbox .maintitle li{
		line-height:1.6em;
		padding:10px 10px;
		}
	.dropbox .maintitle li ul{
		margin:0 0 0 10px;
		padding:0;
		list-style:none;
		background-color:#ccc;
		width:94%;
		height:160px;
		border:1px solid silver;
		}
	.dropbox .maintitle li ul li{
		border:1px solid #dcdcdc;
		padding:4px;
		margin:1px 0;
		cursor:all-scroll;
		}
	/* drop */

	/* Rate */

	.effectivenesswrap{
		width:100%;
		display:table;
		}
	.effectivenesswrap h2{
		border-bottom:1px solid #ccc;
		margin:10px 0;
		padding:10px 0;
		}

	.effectivenesswrap input[type=radio]{
		font-size:20px;
		cursor:pointer;
		}

.tablerateboxleft{
	background-color:#ccc;
	color:#fff;
	text-align:right;
	}
.tablerateboxleft-td{
	width:17%;
	}
.tablerateboxleft p, .tablerateboxleft-td p{
	padding:10px;
	}
.tablerateboxbottom{
	background-color:#ccc;
	color:#fff;
	text-align:center;
	height:50px;
}
.tablebottomtext{
	color:#fff;
	text-align: center;
	font-size:13px;
	}

.individual-wrap{
	width:100%;
	border:1px solid #FFF;
	margin:20px 0 20px 0;
	display:table;
	}

.individual-wrap .large, h2 {
	font-size: 22px;
	line-height: 30px;
	color:#043657;
	margin:10px 0;
	font-weight:normal;
	}
.individual-wrap p{
	color:#00325b;
	padding:10px 0;
	}
.individual-wrap ul{
	margin:0 0 0 15px;
	padding:0;
	}
.individual-wrap .submissionclass{
	background-color:#ccc;
	display:block;
	width:240px;
	padding:8px 10px;
	margin:2px 0;
	text-decoration:none;
	color:#000;
	font-weight: normal;

}
.individual-wrap .active{
	background-color:#f3f4f4;
	display:block;
	width:240px;
	padding:8px 10px;
	margin:2px 0;
	text-decoration:none;
	color:#000;
	font-weight:bold;
	}

.user-wrap{
	width:100%;
	border:1px solid #FFF;
	margin:20px 0 20px 0;
	}
.user-wrap .add-user-wrap{

}
.user-wrap .add-user-wrap form{
	width: 100%;
	max-width: 400px;
}
.user-wrap .add-user-wrap form .form-group{
	width: 100%;
	margin: 10px 0;
}
.user-wrap .add-user-wrap form .form-group label{
	display: block;
	padding: 10px 0;
	font-size: 16px;
}
.user-wrap .add-user-wrap form .form-group input[type="text"],
.user-wrap .add-user-wrap form .form-group input[type="password"],
.user-wrap .add-user-wrap form .form-group input[type="email"],
.user-wrap .add-user-wrap form .form-group select{
	width: 94%;
	font-size: 16px;
	padding: 6px 8px;
}
.user-wrap .add-user-wrap form .form-group select{
	cursor: pointer;
}
.user-wrap .add-user-wrap form .form-group .error{
	padding: 4px 0;
}
.user-wrap .add-user-wrap form .form-group .fd_bck-btn{
	padding: 10px 20px;
}

.user-wrap .table{
	margin: 20px 0;
}
.user-wrap .table TABLE.userlist {
	width: 100%;
	font-size: 14px;
}
.user-wrap .table .userlist TH {
	font-weight: 600;
	text-align: left;
	background-color: #c1c1c1;
	color #FFF;
	padding: 8px 6px;
}
.user-wrap .table .userlist TD {
	text-align: left;
	padding: 6px 0px;
}
/* content */



/* footer */
.footerwrap{
	width:100%;
	margin:0 auto;
	border-top:1px solid #d1d2d2;
	text-align:center;
	}
.footerwrap p{
	color: #666;
	margin:0 auto;
	padding: 20px 20px;
	font-size:11px;
	display: block;
	}