@charset "utf-8";
/* CSS Document */
html{ height:100%;}
body {
	margin:0px;
	padding:0px;
	width:100%;
	background:#eff4ea;	
}
.container {
	margin: 10% auto !important;	
	vertical-align:middle;
}

h4 { text-align:center; font-weight:bold; margin-bottom:20px; margin-top:10px; }
.col-lg-5 { width:100% !important;}
div.bhoechie-tab-container{
  z-index: 10;
  background-color: none;
  padding: 0 !important;
  border-radius: 4px;
  -moz-border-radius: 4px;
  border:0px solid #ddd;
/*  margin-top: 20px;
  margin-left: 50px;
  -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
  box-shadow: 0 6px 12px rgba(0,0,0,.175);
  -moz-box-shadow: 0 6px 12px rgba(0,0,0,.175);
  background-clip: padding-box;
  opacity: 0.97;
  filter: alpha(opacity=97);*/
}
div.bhoechie-tab {
	background-color: #ffffff;
	border:1px solid #ddd;
	-webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
  box-shadow: 0 6px 12px rgba(0,0,0,.175);
  -moz-box-shadow: 0 6px 12px rgba(0,0,0,.175);
  background-clip: padding-box;
  opacity: 0.97;
  filter: alpha(opacity=97);
}
div.bhoechie-tab-menu{
  padding-right: 0;
  padding-left: 0;
  padding-bottom: 0;
}
div.bhoechie-tab-menu div.list-group{
  margin-bottom: 0;
}
div.bhoechie-tab-menu div.list-group>a{
  margin-bottom: 0;
  margin-top:2px;
  background:#e5ebe0;
}
div.bhoechie-tab-menu div.list-group>a .glyphicon,
div.bhoechie-tab-menu div.list-group>a .fa {
  color: #5A55A3;
}
div.bhoechie-tab-menu div.list-group>a:first-child{
  border-top-right-radius: 0;
  -moz-border-top-right-radius: 0;
  margin-top:0px;
}
div.bhoechie-tab-menu div.list-group>a:last-child{
  border-bottom-right-radius: 0;
  -moz-border-bottom-right-radius: 0;
}
div.bhoechie-tab-menu div.list-group>a.active,
div.bhoechie-tab-menu div.list-group>a.active .glyphicon,
div.bhoechie-tab-menu div.list-group>a.active .fa{
  background-color: #fff;
  background-image: #5A55A3;
  color: #000;
  width:101%;
}
/*
div.bhoechie-tab-menu div.list-group>a.active:after{
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  margin-top: -13px;
  border-left: 0;
  border-bottom: 13px solid transparent;
  border-top: 13px solid transparent;
  border-left: 10px solid #5A55A3;
}
*/
.list-group-item {
	border-right:none !important;
	padding: 15px 20px !important;	
}
.list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover {
  border:1px solid #ddd;
}
div.bhoechie-tab-content{
  background-color: #ffffff;
  /* border: 1px solid #eeeeee; 
  padding-left: 20px;
  padding-top: 10px;*/
}

div.bhoechie-tab div.bhoechie-tab-content:not(.active){
  display: none;
}

.leftbg { 
	background:url(../image/leftside-bg.png) top left no-repeat;
	width:30%;
	height:100%;
	position:fixed;
	left:0px;
	top:0px;
}
.rightbg { 
	background:url(../image/rightside-bg.png) bottom right no-repeat;
	width:30%;
	height:100%;
	position:fixed;
	right:0px;
	bottom:0px;
}
.applogo { padding:0px; margin-left:-5px;}
.col-lg-8,.col-md-8, .col-sm-8, .col-xs-8 { padding:0px !important; }
label { font-weight:500; font-size:14px !important; }

.mdl-layout {
	align-items: center;
	justify-content: center;
}
.mdl-textfield { padding:24px !important;}
.mdl-textfield__input { padding:3px 0px !important;}
.mdl-textfield__label { left:23 !important; top:24 !important; width:85% !important;}
.mdl-layout__content {

	flex: none;
}
.mdl-card__supporting-text {
	width:100% !important;	
}
.mdl-button.mdl-button--colored {
    color: #ffffff;
    width: 100%;
    background: #49ed2e;
}
.mdl-button:hover { background:#4cc2c9; }
.mdl-checkbox.is-upgraded {
    padding-left: 24px;
    left: 24px;
    text-align: left;
    color: #7a9396;
}
.mdl-checkbox__label { font-size:14px !important; }
.mdl-checkbox {
	height:30px;
	margin-top:10px;
}
.mdl-card__actions.mdl-card--border {
    border: none !important;
	 padding:10px 24px;
}

@media (min-width:550px){
	.container{width:400px}
}
@media (min-width:768px){
	.container{width:500px}
}
@media (min-width:992px){
	.container{width:500px}
}
@media (min-width:1200px){
	.container{width:500px}
	
}