body {
	background: #eef3f9;
	font-size: 12px;
}

html, body {
	height: 100%;
}

.row {
	margin-right: 0px;
	margin-left: 0px;
}

.img-responsive {
	max-width: 80px;
	margin: auto;
}

.exel-import {
	color: white;
	background: #1d7044;
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 10px;
}

.approve a {
	color: white;
	background: #4CAF50;
	font-weight: 700;
	padding: 3px;
	border: 1px solid #4CAF50;
	border-radius: 3px;
}

h3, .h3 {
	font-size: 20px;
}

/*Logo on login page*/
.logo-mini {
	background: url("../images/logo.png") no-repeat;
	width: 100px;
	height: 100px;
	display: block;
	text-indent: -9999px;
}

/*Login Background*/
.login-page, .register-page {
	background-image: url('../images/urabg.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

/*Login box*/
.login_form {
	width: 30%;
    text-align: center;
    margin: 0 auto;
    vertical-align: middle;
    position: relative;
    top: 90px;
    background: rgba(255, 255, 255, 0.95);
}

.login-box-msg {
	color: #24539e;
	font-size: 16px;
}

/*Navigation Menu*/
.top-navbar {
	float: none;
}

.ui-menu.ui-menubar {
	background-image: linear-gradient(to bottom, #315c7c, #315c7c);
	border: 1px solid #315c7c;
	border-radius: 0px;
	padding: 10px;
}

.ui-tabs.ui-tabs-top {
	border-bottom: none;
}

.ui-tabs.ui-tabs-top .ui-tabs-nav.ui-widget-header li.ui-state-active {
	border-color: #489bde #489bde transparent #489bde;
}

.ui-tabs .ui-tabs-nav.ui-widget-header li.ui-state-active {
	background-color: #489bde;
	color: #fffefe;
}

.ui-tabs .ui-tabs-nav.ui-widget-header li.ui-state-active a {
	background-color: #489bde;
	color: #fffefe;
}

.ui-tabs .ui-tabs-nav.ui-widget-header li {
	background: rgb(255, 255, 255) none;
	border: 1px solid #489bde;
	border-bottom-color: transparent;
}

.ui-tabs.ui-tabs-top .ui-tabs-nav.ui-widget-header {
	border-bottom: 1px solid #489bde;
}

.content-wrapper {
	margin-left: 5%;
	margin-right: 5%;
	background: #ffffff;
	position: relative;
	top: 5px;
	padding-bottom: 50px;
}

hr {
	border-top: 1px solid #eee;
	border: ridge;
}

.ui-menu.ui-widget li>.ui-menuitem-link.ui-state-hover {
	background-color: #2196F3;
	background-image: linear-gradient(to bottom, #2196F3, #1b77bf);
}

/*  .ui-menu.ui-widget a {
    display: block;
    clear: both;
    font-weight: 700;
    color: red;
    white-space: nowrap;
}   */

/* menu header */
.ui-menu .ui-menu-parent .ui-menu-child {
	background: #269abc;
	border: 1px solid #269abc;
	border-radius: 0px;
}

.ui-menu.ui-widget a {
	font-weight: bold;
	color: #ffffff;
}

.ui-menu.ui-widget li>.ui-menuitem-link.ui-state-hover {
	background-color: #315c7c;
	background-image: linear-gradient(to bottom, #315c7c, #315c7c);
}

.card {
	display: inline-block;
	position: relative;
	width: 100%;
	margin: 25px 0;
	box-shadow: 0 3px 10px 0 rgba(88, 88, 88, 0.54);
	border-radius: 3px;
	color: rgba(0, 0, 0, 0.87);
	background: rgba(38, 154, 188, 0.28);
}

.card .card-header {
	box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.42), 0 4px 25px 0px
		rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
	margin: -20px 15px 0;
	border-radius: 3px;
	padding: 15px;
	background-color: #999999;
}

.card-stats .card-header {
	float: left;
	text-align: center;
}

.card-stats .card-header i {
	font-size: 36px;
	line-height: 56px;
	width: 56px;
	height: 56px;
}

.card-stats .card-content {
	text-align: right;
	padding-top: 10px;
}

.card .card-content {
	padding: 15px 20px;
}

.card .card-content .category {
	margin-bottom: 0;
}

.card .card-footer {
	margin: 0px 10px 10px;
	padding-top: 10px;
	border-top: 1px solid #eeeeee;
}

.card .card-footer .content {
	display: block;
}

.card .card-footer div {
	display: inline-block;
}

.card .card-footer .author {
	color: #999999;
}

.card .card-footer .stats {
	line-height: 22px;
	color: #999999;
	font-size: 12px;
}

.card .card-footer .stats .material-icons {
	position: relative;
	top: 4px;
	font-size: 16px;
}

.card .card-footer h6 {
	color: #999999;
}

.card [data-background-color="blue"] {
	background: #269abc;
	box-shadow: 0 12px 20px -10px rgba(49, 92, 124, 0.81), 0 4px 20px 0px
		rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(49, 92, 124, 0.44);
}

.card [data-background-color] {
	color: #ffffff;
}

/* table */
.row .ui-state-default {
	color: #ffffff;
	text-shadow: 0 0px 0px rgba(255, 255, 255, 0.75);
	background: rgb(6, 118, 152);
	border: 1px solid #cccccc;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	border-color: #e6e6e6 #e6e6e6 #bfbfbf;
	border-radius: 0px;
}

.ui-datatable-odd {
	background-color: rgba(153, 202, 239, 0.15);
}

.ui-panel {
	padding: 1.2em;
}
/* treen ui  */
.ui-tree .ui-treenode {
	padding: 0px 0px 0px;
}

/* tab-grid */
.ui-wizard-step-title {
	border-radius: 0px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	font-size: 14px;
}

.fa-folder-open, .fa-folder {
	color: orange;
	font-size: 25px;
	width: 40px;
	height: 30px;
}

.glyphicon-remove {
	color: red;
}

.ui-tree .ui-treenode-content.ui-tree-selectable .ui-chkbox.ui-selection
	{
	display: inline-block;
	padding-left: 5px;
	padding-right: 10px;
}

.ui-widget button {
	background: #1589bb;
}

h1 {
	font-weight: 700;
	font-size: 25px;
	background: #315c7c;
	padding: 5px;
	display: -webkit-inline-box;
	padding-right: 20px;
	position: relative;
	right: 20px;
	box-shadow: 3px 4px 6px rgba(93, 101, 107, 0.71);
	bottom: 5px;
	color: #eeeeee;
}

.new-btn {
	background: #315c7c;
	color: aliceblue;
	padding: 5px;
	padding-left: 15px;
	padding-right: 14px;
	font-weight: 500;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border: 1px solid #315c7c;
	margin-left: 15px;
}

.new-btn:hover {
	background: #0d73a4;
	color: white;
}

.navbar-default {
	background-color: #333333;
	border-color: #676363;
}

label {
	margin-bottom: 20px;
}

.form-control {
	height: 28px;
	font-size: 13px;
}

.btn-success {
	padding: 1px;
}

.btn-primary {
	padding: 1px;
}

.btn-danger {
	padding: 1px;
}

.btn-info {
	background-color: #269abc;
	border-color: #269abc;
}

.btn-format {
	padding: 5px;
	font-weight: bold;
	font-size: 12px;
	border-radius: 0px;
	background: rgba(240, 248, 255, 0);
	border: 1px solid rgba(240, 248, 255, 0);
}

.home-btn {
	padding: 5px;
	font-weight: bold;
	font-size: 12px;
	border-radius: 0px;
}

.col-sm-offset-4 {
	margin-left: 38.2%;
}

.ui-menu .ui-menu-parent .ui-menu-child {
	width: auto;
}

.ui-menu.ui-menubar .ui-menu-parent .ui-menu-child {
	padding: 5px 5px;
}

.ui-menu.ui-widget li>.ui-menuitem-link.ui-state-active {
	color: white;
	text-decoration: none;
	background-color: #0088cc;
	background-color: #0081c2;
	background-position: 0px;
}

input[type="radio"], input[type="checkbox"] {
	margin: 4px 10px 0px;
}

/*new profile page form css*/
.align-center, .center {
	text-align: center !important;
}

.profile-user-info {
	display: table;
	width: 98%;
	width: calc(100% - 24px);
	margin: 0 auto
}

.profile-info-row {
	display: table-row
}

.profile-info-name, .profile-info-value {
	display: table-cell;
	border-top: 1px dotted #D5E4F1
}

.profile-info-name {
	text-align: right;
	padding: 6px 10px 6px 4px;
	font-weight: 400;
	color: #667E99;
	background-color: transparent;
	width: 200px;
	vertical-align: middle
}

.profile-info-value {
	padding: 6px 4px 6px 6px
}

.profile-info-value>span+span:before {
	display: inline;
	content: ",";
	margin-left: 1px;
	margin-right: 3px;
	color: #666;
	border-bottom: 1px solid #FFF
}

.profile-picture {
	border: 1px solid #CCC;
	background-color: #FFF;
	padding: 4px;
	display: inline-block;
	max-width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, .15)
}

.profile-users .user {
	display: block;
	position: static;
	text-align: center;
	width: auto
}

.profile-users .user img {
	padding: 2px;
	border-radius: 100%;
	border: 1px solid #AAA;
	max-width: none;
	width: 64px;
	-webkit-transition: all .1s;
	-o-transition: all .1s;
	transition: all .1s
}

.ui-fileupload-content .ui-progressbar {
	display: none;
}

.upload_image img {
	width: 95%;
	height: auto;
}

.main-footer {
    color: #2aaab9;
    position: fixed;
    background: rgba(255, 255, 255, 0.52);
    padding: 15px;
    width: 100%;
    bottom: 0;
    left: 0px;
    overflow: hidden;
    text-align: center;
}

.main-footer a{
	color: #738082;
}

.main-footer a:hover {
	color: #000000;
}

.footer {
	text-align: center;
}

.logo-dimension{
	width: 130px; 
	height: auto; 
	padding-bottom: 20px;
}

.login-links{
	position: relative;
    font-size: 12px;
    font-weight: 700;
    background: transparent;
    border: 1px solid #1589bb;
    padding: 5px 10px;
}

.login-links:hover{
    background:#e1e9ec;
}

/*Media queries for screen size*/
@media screen and (max-width: 1025px) {
	.login_form {
		width: 50%;
		top: 60px;
	}
}

@media screen and (max-width: 992px) {
	.login_form {
		width: 60%;
		top: 7px;
		padding: 0px;
	}
}


@media screen and (max-width: 769px) {
	.login_form {
		width: 60%;
		top: 15px;
		padding: 0px;
	}
	
	.logo-dimension {
    	width: 90px;
	}
	
	.form-control {
		height: 33px;
	}
}

@media screen and (max-width: 501px) {
	.login_form {
		width: 90%;
		
	}
}

@media only screen and (max-width:480px) {
	
	.login_form {
		 top: 20vh;
	}
	
	.profile-info-name {
		width: 80px
	}
	.profile-user-info-striped .profile-info-name {
		float: none;
		width: auto;
		text-align: left;
		padding: 6px 4px 6px 10px;
		display: block
	}
	.profile-user-info-striped .profile-info-value {
		margin-left: 10px;
		display: block
	}
	.user-profile .memberdiv {
		width: 50%;
		margin-left: 0;
		margin-right: 0
	}
}


@media screen and (max-width: 321px) {
	.login-links {
	    font-size: 10px;
	}
}


.error-page {
	width: 100%;
    display: inline-table;
    background-image: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
	background-size: 400% 400%;
	animation: gradientBG 10s ease infinite;
}

@keyframes gradientBG {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.error_form {
    width: 55%;
    text-align: center;
    margin: 0 auto;
    vertical-align: middle;
    position: relative;
    top: 120px;
    background: rgba(0, 0, 0, 0);
    box-shadow: none;
    border: 2px solid rgba(0, 0, 0, 0);
}

.circles{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.circles li {
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background: rgba(255, 255, 255, 0.36);
    animation: animate 10s linear infinite;
    bottom: -150px;
}

.circles li:nth-child(1){
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
}


.circles li:nth-child(2){
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 8s;
}

.circles li:nth-child(3){
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}

.circles li:nth-child(4){
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 10s;
}

.circles li:nth-child(5){
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}

.circles li:nth-child(6){
    left: 75%;
    width: 110px;
    height: 110px;
    animation-delay: 3s;
}

.circles li:nth-child(7){
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 3s;
}

.circles li:nth-child(8){
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 20s;
}

.circles li:nth-child(9){
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 20s;
}

.circles li:nth-child(10){
    left: 85%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 15s;
}



@keyframes animate {

    0%{
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0;
    }

    100%{
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        border-radius: 50%;
    }

}


.fa-warning{
	  animation: shadow-pulse 1.5s infinite;
	  border-radius: 50%;
}

@keyframes shadow-pulse
{
  0% {
    box-shadow: 0 0 0 0px rgba(253, 253, 253, 0.45);
  }
  100% {
    box-shadow: 0 0 0 100px rgba(0, 0, 0, 0);
  }
}



/* .error_form:before, .error_form:after{
    content: '';
    position: relative;
    display: block;
    height: 11px;
    width: 100%;
    background: #FF9800;
    background: repeating-linear-gradient(-45deg, #FFC107, #FFC107 12px, black 10px, black 23px);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-bottom: 0;
    margin-top: -10px;
} */