@import "https://fonts.googleapis.com/css?family=Ubuntu:400,300,500,700";

/* STYLE FOR USING BOOTSTRAP ICONS*/
.glyphicon {
	font-size:2.1rem;
	vertical-align:bottom;
	margin:0 10px;
	color:#8ca3af;
}

.title .glyphicon {
	color:#333;
	background:#FFF;
	width:50px;
	height:50px;
	text-align:center;
	line-height:50px;
	border-radius:50%;
	border:5px solid #D7DCC5;
	box-sizing:content-box;
	vertical-align:middle;
}

li.active .glyphicon {
	color:#47541b;
}

header a.logout .glyphicon {
	color:#000;
}



/* MAIN STYLES*/

body {
	background:url(https://dbcdz2ghpd993.cloudfront.net/platform/img/main-bg.png)top left repeat-y;
	background-size:101.6%;
	font-family:'Ubuntu','Helvetica Neue',Helvetica,Arial,sans-serif;
}

main {
	background:#ffffff;
}

aside {
	background:#454a4d;
}

a {
	color:#00757b;
}

a:hover {
	color:#8CA3AF;
}

.container {
	width:100%;
}

.row {
	margin-right:0;
	margin-left:0;
}

/* hacked cols for full width */
aside.col-lg-2 {
	padding:0;
	margin:0;
	width:17%;
	float:left;
	position: static;
}

main.col-lg-10 {
	margin:0;
	padding:0;
	width:83%;
	float:left;
}

.burger {
	display:none;
}

/* header styles */
header {
	background:#fff;
	padding:10px 20px;
}

header p.greeting {
	padding: 15px 20px;
	font-weight:800;
	color:#5e5e5e;
	margin: 0;
}

header p.greeting span {
	font-weight:400;
	margin-left:10px;
}

header a.logout {
	padding: 15px 0;
	display:inline-block;
	border-left: 1px solid #ebebeb;
}

/* Main Content */
.modual-holder {
	padding:20px;
	min-height: 62vh;
}

main header {
	background:#eff5db;
	border-top:2px solid #dfe5ce;
	border-bottom:2px solid #dfe5ce;
	padding:10px 20px 0;
}

.arrow-down:after {
	display:table;
	content:'';
	position:relative;
	top:12px;
	width:0;
	height:0;
	border-style:solid;
	border-width:12px 12px 0;
	border-color:#eff5db rgba(0,0,0,0) rgba(0,0,0,0);
	z-index:2;
	left:30px;
	clear:both;
}

.arrow-down:before {
	display:table;
	content:'';
	position:absolute;
	top:84px;
	width:0;
	height:0;
	border-style:solid;
	border-width:15px 15px 0;
	border-color:#dfe5ce rgba(0,0,0,0) rgba(0,0,0,0);
	z-index:2;
	left:47px;
}

main header .title {
	margin:0;
	font-size:2rem;
	font-weight:400;
}

main header .title i {
	margin:0 10px 0 0;
}

main header .back a {
	display:inline-block;
	color:#575e3f;
	text-decoration:underline;
	line-height:50px;
}

/* -------- SIDEBAR ----------*/
/* NAVIGATION */
ul.sub-menu {
	display:none;
}

li.active > a {
	background:#bfde56;
	position:relative;
	color:#47541b;
}

li.has-children.active > a:after {
	display:block;
	content:'';
	position:absolute;
	bottom:-10px;
	width:0;
	height:0;
	border-style:solid;
	border-width:10px 10px 0;
	border-color:#bfde56 rgba(0,0,0,0) rgba(0,0,0,0);
	z-index:2;
	left:20px;
}

li.active ul.sub-menu {
	display:block;
	background:#34373a;
	padding-top:15px;
}

nav ul {
	list-style:none;
	margin:0;
	padding:0;
}

nav ul li a {
	padding:20px;
	display:inline-block;
	color:#fff;
	width:100%;
	font-weight:400;
	-webkit-font-smoothing:antialiased;
}

nav ul li a i {
	margin:0 10px 0 0;
}

nav ul li a i img {
	vertical-align:top;
}

nav > ul > li {
	color:#fff;
	border-top:2px solid #616568;
}

nav > ul > li:first-of-type {
	border-top:0;
}

nav > ul > li:last-of-type {
	border-bottom:2px solid #616568;
}

li.nav-item.active {
	border-top:none;
}

nav ul.submenu li {
	color:#fff;
	border-bottom:none;
}

/* Healpay Logo */
.healpay-logo {
        position: absolute;
        bottom: 30px;
        left: 75px;
}

nav ul.sub-menu li a {
	padding:10px 20px;
}

.current a {
	font-weight:800;
	color: #EFF5DB;
}

.current a:before {
	content:'\00bb';
	margin:0 5px 0 0;
}

/* FORMS */
form .row {
	margin-bottom:20px;
}

form a {
	text-decoration:underline;
}
fieldset {
	margin-bottom:20px;
	border-bottom:1px solid #ccc;
	padding:20px 0;
	position:relative;
}
fieldset:after {
	display:block;
	content:'';
	position:absolute;
	bottom:-10px;
	width:0;
	height:0;
	border-style:solid;
	border-width:10px 10px 0;
	border-color:#FFF rgba(0,0,0,0) rgba(0,0,0,0);
	z-index:2;
	left:53px;
}
fieldset:before {
	display:block;
	content:'';
	position:absolute;
	bottom:-11px;
	width:0;
	height:0;
	border-style:solid;
	border-width:10px 10px 0;
	border-color:#ccc rgba(0,0,0,0) rgba(0,0,0,0);
	z-index:2;
	left:53px;
}
fieldset:last-of-type {
	border-bottom:none;
}
fieldset:last-of-type:before,fieldset:last-of-type:after {
	display:none;
}
legend {
	border:none;
	font-weight:800;
	margin-bottom:0;
}
label {
	font-weight:400;
	display:block;
}
input[type="radio"] ~ label,input[type="checkbox"] ~ label {
	display:inline;
	margin:0 10px;
}
input[type="text"] {
	background:#f3f3f3;
	border:1px solid #e0e0e0;
	width:50%;
	min-height:35px;
	margin-bottom:20px;
	padding:0 10px;
}
.prepend-dollar-sign input[type="text"] {
	padding:0 30px;
	position:relative;
}
.prepend-dollar-sign:before {
	content:'$';
	position:absolute;
	z-index:9;
	line-height:38px;
	margin:0 0 0 10px;
	font-size:1.7rem;
}
input[type="text"]:last-of-type {
	margin-bottom:0;
}
button,html input[type=button],input[type=reset],input[type=submit] {
	-webkit-appearance:button;
	cursor:pointer;
	border:none;
	background:#bfde56;
	padding:10px 15px;
	border-radius:3px;
	font-weight:700;
}
form .group {
	width:50%;
	overflow:hidden;
	margin-top:20px;
}
form .group div {
	display:inline-block;
	margin-right:20px;
}
form .group div:last-of-type {
	margin-right:0;
}
​
form .group input[type="text"] {
	width:100%;
}
form small {
	position:relative;
	display:block;
}
form fieldset > input[type="text"]:last-of-type ~ small {
	margin-top:0;
}
/* ICONS */
svg.icon {
	width:25px;
	display:inline-block;
	height:20px;
	margin:15px 10px 0 0;
	vertical-align:bottom;
}

/* Responsive Styles based on custom break points */
@media screen and (max-width:1060px) {
	aside.col-lg-2 {
		width:30%;
	}
	
	main.col-lg-10 {
		width:70%;
	}
	
	body {
		background-size:178.9%;
	}
}

@media screen and (max-width:900px) {
	input[type="text"] {
		width:100%;
	}
	
	form .group {
		width:100%;
	}
}

@media screen and (max-width:640px) {
	header {
		text-align:center;
	}

	aside.col-lg-2 {
		width:60%;
		margin-left:-60%;
		-webkit-transition:margin-left 1s ease;
		-moz-transition:margin-left 1s ease;
		-o-transition:margin-left 1s ease;
		transition:margin-left 1s ease;
	}
	
	body.active aside.col-lg-2 {
		margin-left:0;
	}
	
	main.col-lg-10 {
		width:100%;
		margin-left:0;
		position:absolute;
		-webkit-transition:margin-left 1s ease;
		-moz-transition:margin-left 1s ease;
		-o-transition:margin-left 1s ease;
		transition:margin-left 1s ease;
		min-height: 100%;
	}
	
	body.active main.col-lg-10 {
		width:100%;
		overflow:hidden;
		position:absolute;
		margin-left:60%;
	}
	
	body {
		background-size:357.9%;
	}
	
	header .col-xs-2,header .col-xs-10 {
		width:100%;
		float:none;
	}
	
	.greeting {
		display:none;
	}
	
	.burger,.logout {
		display:block;
		float:none!important;
		position:absolute;
		left:0;
		padding:0;
		top:-35px;
	}
	
	header a.logout {
		right:0;
		text-align:right;
		padding:0;
	}
	
	body.active {
		overflow-x:hidden;
	}
	
	.back.pull-right {
        display: none;
	}
}

/*LOGIN STYLES*/
body.login{
   background:#eff5db;
}

body.login header.container {
        box-shadow: 0px -3px 7px #000;
}

.login-form-wrapper {
        max-width: 430px;
        margin: 65px auto 40px auto;
        text-align: center;
}

.login-form-wrapper .glyphicon {
        color: #464e39;
        
}

.login-form {
        background: #fff;
        text-align: center;
        border: 5px solid #d7dcc6;
        border-radius: 5px;
        margin-bottom: 30px;
}

.login-form-icon {
        margin-top: -45px;
        margin-bottom: 20px;
}

.login-form-icon span {
        font-size: 3.5rem;
        padding: 20px;
        background: #fff;
        text-align: center;
        border-radius: 50%;
        border: 5px solid #d7dcc5;
}

.login-form-icon span:before {
        padding: 0 0 0 5px;
}

.login-form-top{
   padding:20px;
}

.login-form-top p {
        color: #151515;
        font-family: 'Ubuntu','Helvetica Neue',Helvetica,Arial,sans-serif;
        line-height: 1.9;
}

.login-form-top .input-group-addon {
        padding: 5px 0px;
        border: none;
        border-radius: 4px 0px 0px 4px;
        border-right: 1px solid #fff;
}

.login-form-top .input-group-addon .glyphicon {
        font-size: 1.5rem;
}

.login-form-top .input-group {
        margin-bottom: 10px;
}


.login-form-top img,.login-form-top p{
   margin-bottom: 30px;
}

.login-form-top form a {
        text-decoration: underline;
        margin: 10px 0;
}

.login-form-top form input[type=submit] {
        padding: 10px 30px;
}

.login-form-bottom {
        background: #f8fcee;
        box-shadow: inset 2px 9px 10px -14px #000;
        padding: 20px;
}

.login-form-bottom .secondary.btn {
        background: #454a4d;
        width: 82%;
        font-size: 2rem;
        text-transform: uppercase;
        padding: 0;
}

.login-form-bottom .secondary.btn a {
        color: #fff;
        font-size: 16px;
        display: block;
        padding: 10px 20px;
        text-decoration: none;
}

.login-form-bottom p {
        text-transform: uppercase;
        color: #82857e;
}

.login-form-wrapper .disclaimer{
   padding: 0 20px;font-size: 12px;
}

.login-form a:hover {
        color: #000;
}


.login-form h2 {
        font-size: 18px;
        text-transform: uppercase;
        color: #464E39;
        margin-bottom: 20px;
}

.login-form .form-control{
   border: none;
   box-shadow: none;
   background: #eeeeee;
}
.login-form button.btn.btn-large.btn-success {
        -webkit-appearance: button;
        cursor: pointer;
        border: none;
        background: #bfde56;
        padding: 10px 15px;
        border-radius: 3px;
        font-weight: 700;
        color: #454a4d;
}
.login-form  .checkbox.pull-left {
        margin: 5px 0px 30px 10px;
}

.login-form  .pager {
        margin: 0;
}

.login-form  .pager li>a,.login-form  .pager li>span {
        display: inline-block;
        padding: 5px 14px;
        background-color: #454a4d;
        border-radius: 3px;
        border: none;
        color: #fff;
}
.login-form  .pager li>a:hover, .login-form  .pager li>span:hover,.login-form-bottom .secondary.btn:hover {
        background-color: #637682;
        color: #fff;
}
.header-logo img {
   max-width: 150px;
}
/*------END OF LOGIN STYLES-------*/

.close-icon {
  background-color: transparent;
  border: 0;
  cursor: pointer;
  display: inline-block;
  height: 0;
  outline: 0;
  padding: 0;
  vertical-align: middle;
}
.close-icon::after {
  background-color: #216ba5;
  border-radius: 50%;
  bottom: 0;
  box-sizing: border-box;
  color: #fff;
  content: "\00d7";
  cursor: pointer;
  font-size: 12px;
  height: 16px;
  width: 16px;
  line-height: 1;
  margin: -8px auto 0;
  padding: 2px;
  position: absolute;
  right: 7px;
  text-align: center;
  top: 50%;
}

.table thead {
  background-color: #333;
  text-transform: uppercase;
  font-size: 12px;
  color: #fff;
}