/* Body Scrollbar */
body {
	overflow-y: scroll;
}

::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
	background-color: #F5F5F5;
}

::-webkit-scrollbar
{
	width: 8px;
	background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb
{
	background-color: #666666;
}
/* vertical-menu */
.vertical-menu {
	width: 50;
	height: 80vh;
	overflow-y: auto;
	background-color: #222222; /* Grey background color */
}

.vertical-menu a {
	background-color: #222222; /* Grey background color */
	color: white; /* Black text color */
	display: flex; /* block */ /* Make the links appear below each other */
	padding: 12px; /* Add some padding */
	text-decoration: none; /* Remove underline from links */
}

.vertical-menu .hallListbutton:hover, .activities-list-btn:hover, .paymentServiceListbutton:hover {
	background-color: #ccc; /* Dark grey background on mouse-over */
	color: #222222;
}


.vertical-menu .hallListbutton.active, .activities-list-btn.active, .paymentServiceListbutton.active {
	background-color: #eff0f1;
	/* Add a green color to the "active/current" link */
	color: #222222;
}

.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:hover,
	.navbar-inverse .navbar-nav>.active>a:focus {
	color: #222222;
	background-color: #eff0f1;
}

.slow-spin {
	-webkit-animation: fa-spin 1.5s infinite ;
	animation: fa-spin 1.5s infinite ;
}

textarea.form-control {
	height: 7em;
	clear: both;
}
.form-group {
	padding: .5em 0;
	clear: both;
}
/* form adjustment */
.nav-subtitle h2 {
    font-size: 1.2em;
    display: inline-block;
    color: #333333;
    font-style: italic;
}
.nav-subtitle h2 .btn {
	font-style: normal;
}
.nav-subtitle h2+h2:before {
	content:"|";
    margin: 0.7em;
}
/* List menu */
.vertical-menu a {
	padding: 12px 0;
}

a.list-tab h4 {
    color: #FFF;
    margin: 0 5px;
    padding: 7px 15px;
    text-align: center;
    font-size: 1em;
    border-radius: 10em;
    background: #9d9d9d44;
}
a.list-menu-title h4 {
	margin: 10px auto 0px;
}
/* Search Payment Service */
a.list-search {
	display: block;
    text-align: center;
}
a.list-search:focus, a.list-search:hover {
    text-decoration: none;
    }
.searchpaymentservice {
    font-size:1em;
    line-height:1.5;
    padding: 10px;
}
label.searchpaymentservice {
	padding: 10px 5px;
	color: white;
}
input[type=text].searchpaymentservice {
  width: 280px;
  max-width: 80%;
  height: 30px;
  border: 0px;
  border-radius: 0px 30px 30px 0px;
  background: #333333;
  color: #CCCCCC;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  
}
input[type=text].searchpaymentservice:focus {
  height: 42px;
  background: #9d9d9d;
  color: #FFFFFF;
  outline: -webkit-focus-ring-color auto 0px;
}
.searchpaymentservicetr td{
	background: #222222;
	color: #9d9d9d;
}

/* bootstrap table adjustment #host/webjars/bootstrap/3.3.7/css/less/tables.less */
.table-hover>tbody>tr:hover {
    background-color: #EEE;
}

h1.pagesubtitle {
	background-color: #222222;
    padding: 8px;
    color: #FFFFFF;
    display: inline-block;
    margin: 20px auto 10px auto;
    width: fit-content;
}
#newpaymentgateway_fluid {
	display: none;
	margin-bottom: 15px;
}
.gird-container {
	padding: 10px 30px 30px 30px;
	border: 1px solid #DDD;
	background: #FCFCFC;
	display: grid;
}
.gird-container:not(:first-child)  {
	margin-bottom:15px;
}
	.gird-container div.selectpaymentservicechild {
		padding: 40px 20px 20px 20px;
	    text-align: center;
	}
/* View 6 */
label.paymentmethodname {
	margin-top: 7px;
}
.vertical-menu > a, .vertical-menu > a:hover{
	-webkit-transition: all .4s cubic-bezier(0.4, 0, 0.2, 1);
	-moz-transition: all .4s cubic-bezier(0.4, 0, 0.2, 1);
	transition: all .4s cubic-bezier(0.4, 0, 0.2, 1);
}
.vertical-menu.disactive > a.paymentServiceListbutton, .vertical-menu.disactive > a.paymentServiceListbutton:hover{
	color:#9d9d9d;
	font-style: italic;
	background: #222222;
}
.vertical-menu > a > h4, .vertical-menu.disactive > a.paymentServiceListbutton, .vertical-menu.disactive > a.paymentServiceListbutton:hover {
	cursor: default;
}
a.active{
}

/* Switch Layout */
.switch {
	position: relative;
	display: inline-block;
	width: 45px;
	height: 25.5px;
	margin-top: 4px;
}

.switch input { 
	opacity: 0;
	width: 0;
	height: 0;
}

.switch .switchslider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
	
	border-radius: 25.5px;
}

.switch .switchslider:before {
	position: absolute;
	content: "";
	height: 19.5px;
	width: 19.5px;
	left: 3px;
	bottom: 3px;
	background-color: white;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	
	border-radius: 50%;
}

.switch input:checked + .switchslider {
	background-color: #2196F3;
}

.switch input:focus + .switchslider {
	box-shadow: 0 0 5px #2196F3;
}

.switch input:checked + .switchslider:before {
	-webkit-transform: translateX(19.5px);
	-ms-transform: translateX(19.5px);
	transform: translateX(19.5px);
}
.table th {
	background: #222222;
	color: #9d9d9d;
}
.table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>th,
.table>caption+thead>tr:first-child>th, 
.table>colgroup+thead>tr:first-child>th, 
.table>thead:first-child>tr:first-child>th {
    border: 1px solid #222222;
}

tr.searchpaymentservicetr>td {}
.modal-span {
	margin: 0 0 0 20px;
}
.testgatewayresult { display:none; }
.testwithdrawresult { display:none; }
#testgatewayerror label, #testgatewayerror textarea {
	height: 200px;
}

#spnTop, #spnbottom {
	padding: 5px;
}
#spnTop {
    position: fixed;
    bottom: 50px;
    right: 20px;
}
#spnbottom {
    position: fixed;
    bottom: 20px;
    right: 20px;
}
#arrUp {
	width: 0; 
	height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid #333;
    display: block;
}
#arrDo {
  width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid #333;
  display: block;
}