/* YOUR CUSTOM STYLES */
.w-80p
{
	width:80%;
}
.w-100p
{
	width:100%;
}
.responsive-text
{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}
@media (min-width: 300px)
{
	body
	{
		margin-bottom:20vh;
		margin-top:0px;
	}
}
@media (min-width: 992px)
{
	body
	{
		margin-bottom:20vh;
		margin-top:20px;
	}
}
@media (min-width: 992px)
{
	body
	{
		margin-bottom:20vh;
		margin-top:40px;
	}
}
body-login
{
	margin-top:0px;
}
.body-login .login-title-back
{
	background-color: white;
}
.body-login .card
{
	background-color: #f7f7f7;
}
.menu-small-item
{
	font-size:x-small;
}
.recommend-tile
{
	width:100%;
	height:150px;
}
.row
{
	margin:0px 0px 10px 0px;
	padding:4px 0px 4px 0px;
}
.card
{
	margin:0px 0px 10px 0px;
}
.accordion .panel {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #eee;
}
[role=button], a, area, button, input, label, select, summary, textarea {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}
.fa-angle-up.rotate-icon {
    -webkit-transition: all 150ms ease-in 0s;
    -moz-transition: all 150ms ease-in 0s;
    -o-transition: all 150ms ease-in 0s;
    -ms-transition: all 150ms ease-in 0s;
    transition: all 150ms ease-in 0s;
}
.accordion .fa-angle-up {
	float: right;
    margin-right: 20px;
}
.nav-tabs .nav-item {
    float: left;
    margin-bottom: -1px;
}
.nav-link .notify .badge
{
	margin-top: -4px;
	font-size: 0.7em;
}
.sidenav-bg
{
	background-image: url(../img/sidenav-light-blue-skin.jpg);
}
.md-form .btn
{
	margin-bottom: 0;
}
.sticky-subnav .col
{
	background-color: white;
	padding-top: 10px;
	padding-bottom: 10px;
}
.side-nav .expand-item
{
	padding-left: 30px;
}
.avator-img-preview
{
	width:64px;
}
.navbar-brand
{
	padding-left:20px;
}
.nav-bars-margin
{
	padding: 6px 2px;
	margin : 0px 0px 3px 0px;
	/*border : solid 1px #ffffff;*/
}
.nav-title-margin
{
	padding: 2px;
	/*border : solid 1px #ffffff;*/
}
.nav-item .nav-link
{
	padding-right:4px;
}
@media (max-width: 768px)
{
	.nav-link .badge
	{
		font-size: 100%;
		vertical-align: auto;
	}
}
@media (min-width: 768px)
{
	.nav-link .badge
	{
		font-size: 106%;
		vertical-align: super;
	}
}
.list-group-item-text {
    margin-bottom: 0;
    line-height: 1.3;
    margin-left: 20px;
}

#page-top {
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 99999;
    font-size: 80%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 80px;
    padding: 16px 0;
    text-align: center;
    display: block;
    border-radius: 4px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}

.first-item
{
	margin-top:30px;
}

.class-item
{
	cursor: all-scroll;
}
.class-item-title
{
	margin-left:14px;
}

// tag class is not define in the mdb.css
.tag
{
    display: inline-block;
    padding: .25em .4em;
    font-size: 75%;
    line-height: 1;
    color: #fff;
    text-align: center;
    vertical-align: baseline;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
    font-weight: 700;
    white-space: nowrap;
}
.tag-primary
{
    background-color: #0275d8;
    color:white;
}
.sticky-footer
{
	padding-top:0px ! important;
	position: fixed;
	bottom: 0;
	z-index: 5;
	width: 100%;
	height: 50px;
}
.sticky-footer .footer-copyright span
{
	padding-right: 10px;
}
/* the table striped style 2rows in a row */
.row2-striped tbody tr:nth-child(4n+1),
.row2-striped tbody tr:nth-child(4n+2) {
	background-color: rgba(0, 0, 0, 0.05);
}
.row2-striped tbody tr:nth-child(4n+3),
.row2-striped tbody tr:nth-child(4n+4) {
	background-color: #fff;
}

/*custom button class*/
.btn-not-select {
  color:gray !important;
  background: #FFFFFF;}
  .btn-not-select:hover, .btn-not-select:focus, .btn-not-select:active {
    background-color: #e0e0e0 !important; }
  .btn-not-select.active {
    background-color: #9e9e9e !important; }

/* customer members page */
.cmember-home-class-detail
{
	padding: 10px;
}

.job-status-detail
{
	padding: 10px 10px 10px 20px;
}

/* IE10- delete clear button for input field */
input::-ms-clear {
    visibility:hidden
}

.img-evalute-stamp-fluid
{
	max-width: 128px;
	max-height: 128px;
}

/* AutoComplete pulldown style */
.autocomplete-suggestions { border: 1px solid #999; background: #FFF; overflow: auto; }
.autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; }
.autocomplete-selected { background: #F0F0F0; }
.autocomplete-suggestions strong { font-weight: normal; color: #3399FF; }
.autocomplete-group { padding: 2px 5px; }
.autocomplete-group strong { display: block; border-bottom: 1px solid #000; }
/* suggest style */
#suggest {
	top:+30px;
    position: absolute;
    background-color: #FFFFFF;
    border: 1px solid #CCCCFF;
    font-size: 90%;
    min-width: 200px;
    width: auto;
    z-index: 10;
}
#suggest div {
	display: block;
    width: auto;
    overflow: hidden;
    white-space: nowrap;
}
#suggest div.select{
    color: #FFFFFF;
    background-color: #3366FF;
}
#suggest div.over{
    background-color: #99CCFF;
}

/* tablesorter style */
.tablesorter th.headerSortUp
{ 
    background-image: url(../img/asc.gif); 
}
.tablesorter th.headerSortDown
{ 
    background-image: url(../img/desc.gif); 
}
th.sortHeader
{ 
    background-image: url(../img/bg.gif);
	cursor: pointer;
	font-weight: bold;
	background-repeat: no-repeat;
	background-position: center left; 
	padding-left: 20px;
	margin-left: -1px;
}

.fielderrMsg {
  color: red;
}
.globalerrMsg {
  color: #CC00CC;
}

.modal-nav {
  position    : relative;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  padding     : 3px;
  text-align  : center;
}

textarea.md-textarea {
  overflow-y: auto;
}

.input-title
{
	color: #757575;
	left: 0;
	font-size:0.8rem;
	margin-bottom:.5rem;
}
.input-body
{
	color: rgba(0, 0, 0, 0.46);
	padding:0 0 1.6rem 0;
	font-size:1rem;
	margin: 0;
}
.input-body .eval-date
{
	display: block;
}
.input-body .eval-comment
{
	margin-left: 0px;
}

.slider
{
	margin-left: 40px;
	width: 80% !important;
}

#lang-selecter
{
	width:74px !important;
}
#lang-selecter img
{
	width:26px !important;
}