html {
	overflow-y: scroll;
}

.scroll-horizontal {
	white-space: nowrap;
    overflow: auto;
    overflow-y: hidden;
	-ms-overflow-y: hidden;
}

.scroll-horizontal::-webkit-scrollbar {
	width: 15px;
}

.scroll-horizontal::-webkit-scrollbar-track {
	background: #FFFFFF;
	-webkit-box-shadow: inset 1px 1px 2px #E0E0E0;   
	border: 1px solid #D8D8D8;
}

.scroll-horizontal::-webkit-scrollbar-thumb {
	background: #999999;
	-webkit-box-shadow: inset 1px 1px 2px rgba(168, 168, 168, 0.4);  
}

.scroll-horizontal::-webkit-scrollbar-thumb:hover {
	background: #DDDDDD;
}

.scroll-horizontal::-webkit-scrollbar-thumb:active {
	background: #BBBBBB;
	-webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3);
}


/* Overwrite Original Design */
label {
	color: #605CA8;
}

.form-group {
	margin-bottom: 5px;
}

.alert {
	border: none;
}

@media (max-width: 767px) {
	.form-horizontal .control-label {
		/* text-align: center; */
	}
}

span.help-block {
	padding-top: 0px;
	margin-top: 0px;
}

@media (min-width: 576px) {
	span.help-block {
		padding-top: 2px;
		margin-top: 5px;
	}
}

.table > tbody > tr > td {
	vertical-align: middle;
}

.form-control:read-only {
	background-color: #fff;
}

.label {
	padding: .2em .4em;
	font-size: 90%;
}

.select2-search__field {
	padding: 0px 7px !important;
}

.select2-search--inline {
    display: contents; /*this will make the container disappear, making the child the one who sets the width of the element*/
}

.select2-search__field:placeholder-shown {
    width: 100% !important; /*makes the placeholder to be 100% of the width while there are no options selected*/
}

/* Bootstrap Switch Checkbox */
.material-switch > input[type="checkbox"] {
    display: none;   
}

.material-switch > label {
    cursor: pointer;
    height: 0px;
    position: relative; 
    width: 40px;  
}

.material-switch > label::before {
    background: rgb(0, 0, 0);
    box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    content: '';
    height: 16px;
    margin-top: -8px;
    position:absolute;
    opacity: 0.3;
    transition: all 0.4s ease-in-out;
    width: 40px;
}
.material-switch > label::after {
    background: rgb(255, 255, 255);
    border-radius: 16px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
    content: '';
    height: 16px;
    left: 0px;
    margin-top: -8px;
    position: absolute;
    top: 0px;
    transition: all 0.3s ease-in-out;
    width: 16px;
}
.material-switch > input[type="checkbox"]:checked + label::before {
    background: inherit;
    opacity: 0.5;
}
.material-switch > input[type="checkbox"]:checked + label::after {
    background: inherit;
    left: 24px;
}

@media (min-width: 576px) {
	.material-switch {
		margin-top: 7px;
	}
}