/*================================================================================
	Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */



#overlay {
	/*background: #f2f1fc;*/
	color: #666666;
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: 5000;
	top: 0;
	left: 0;
	float: left;
	/*   text-align: center;*/
	/* padding-top: 20%;*/
	opacity: .80;
}

.spinner-border {
	/* top:200px;*/
	/* margin: 0 auto;*/
	position: fixed;
	top: 50%;
	left: 50%;
	height: 64px;
	width: 64px;
	/*animation: rotate 0.8s infinite linear;
	border: 5px solid firebrick;
	border-right-color: transparent;
	border-radius: 50%;*/
}

.loadingText {
	/* top:200px;*/
	/* margin: 0 auto;*/
	position: fixed;
	top: 60%;
	left: 48%;
	/* height: 64px;
    width: 64px;*/
}

@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}



.col-custom-1 {
	flex: 0 0 4.16666%;
	max-width: 4.16666%;
}

.col-custom-2 {
	flex: 0 0 8.3333%;
	max-width: 8.3333%;
}

.col-custom-3 {
	flex: 0 0 12.5%;
	max-width: 12.5%;
}

.col-custom-4 {
	flex: 0 0 16.6666%;
	max-width: 16.6666%;
}

.col-custom-5 {
	flex: 0 0 20.83333%;
	max-width: 20.83333%;
}

.col-custom-6 {
	flex: 0 0 25%;
	max-width: 25%;
}

.col-custom-7 {
	flex: 0 0 29.1666666667%;
	max-width: 29.1666666667%;
}

.col-custom-8 {
	flex: 0 0 33.3333%;
	max-width: 33.3333%;
}

.col-custom-9 {
	flex: 0 0 37.5%;
	max-width: 37.5%;
}

.col-custom-10 {
	flex: 0 0 41.6666%;
	max-width: 41.6666%;
}

.col-custom-11 {
	flex: 0 0 45.83333%;
	max-width: 45.83333%;
}

.col-custom-12 {
	flex: 0 0 50%;
	max-width: 50%;
}

.col-custom-13 {
	flex: 0 0 54.16666%;
	max-width: 54.16666%;
}

.col-custom-14 {
	flex: 0 0 58.33333%;
	max-width: 58.33333%;
}

.col-custom-15 {
	flex: 0 0 62.50000%;
	max-width: 62.50000%;
}

.col-custom-16 {
	flex: 0 0 66.6666%;
	max-width: 66.6666%;
}

.col-custom-17 {
	flex: 0 0 70.83333%;
	max-width: 70.83333%;
}

.col-custom-18 {
	flex: 0 0 75.0000%;
	max-width: 75.0000%;
}

.col-custom-19 {
	flex: 0 0 79.16666%;
	max-width: 79.16666%;
}

.col-custom-20 {
	flex: 0 0 83.3333%;
	max-width: 83.3333%;
}

.col-custom-21 {
	flex: 0 0 87.50000%;
	max-width: 87.50000%;
}

.col-custom-22 {
	flex: 0 0 91.6666%;
	max-width: 91.6666%;
}

.col-custom-23 {
	flex: 0 0 95.83333%;
	max-width: 95.83333%;
}

.col-custom-24 {
	flex: 0 0 100%;
	max-width: 100%;
}


table.dataTable.dtr-column > tbody > tr > td.control:before, table.dataTable.dtr-column > tbody > tr > th.control:before {
	background-color: #7367F0
}


@media (max-width: 400px) {
	div #breadcrumb h4:nth-child(2) > span {
		overflow: hidden;
		max-width: 8ch;
		text-overflow: ellipsis;
		font-size: 65%
	}


	div#breadcrumb h4:nth-child(3) > span {
		overflow: hidden;
		max-width: 8ch;
		text-overflow: ellipsis;
		font-size: 65%
	}
}
/**/


.DivMainScrollable {
	-ms-overflow-style: none; /* Internet Explorer 10+ */
	scrollbar-width: none; /* Firefox */
}

.DivMainScrollable::-webkit-scrollbar {
		display: none; /* Safari and Chrome */
}


.customHidden {
	display: none !important;
}

.card {
	margin-bottom:1rem ;
}
.swal2-container {
	z-index: 100000000000 !important;
}


/* HEARBEAT */
.heartbeat {
	position: absolute;
	display: none;
	margin: 5px;
	color: red;
	right: 0;
	top: 0;
}

#loading {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	width: 100vw;
	height: 100vh;
	background-color: rgba(192, 192, 192, 0.5);
	background-image: url("https://i.stack.imgur.com/MnyxU.gif");
	background-repeat: no-repeat;
	background-position: center;
}

.no-js #loader {
	display: none;
}

.js #loader {
	display: block;
	position: absolute;
	left: 100px;
	top: 0;
}

/*.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(https://smallenvelop.com/wp-content/uploads/2014/08/Preloader_11.gif) center no-repeat #fff;
}*/


.loader,
.loader:after {
	border-radius: 50%;
	width: 10em;
	height: 10em;
}

.loader {
	margin: 60px auto;
	font-size: 10px;
	/*position: relative;*/
	position: fixed; /* or absolute */
	top: 43%;
	left: 48%;
	text-indent: -9999em;
	border-top: 1.1em solid rgba(255, 255, 255, 0.2);
	border-right: 1.1em solid rgba(255, 255, 255, 0.2);
	border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
	border-left: 1.1em solid #ffffff;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-animation: load8 1.1s infinite linear;
	animation: load8 1.1s infinite linear;
}

@-webkit-keyframes load8 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes load8 {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

#loadingDiv {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*background-color: #B4B7BD;*/
	z-index: 99999;
}

/*.card {
	background-color: lightyellow !important;

}*/


.table tfoot th {

    font-size: 1rem !important;
  
}