@import url('https://fonts.googleapis.com/css?family=Work+Sans:400,700,900&display=swap');

:root {
	--color-xxx:#3c8dbc;
}

body {
	font-size: 14px;
	color: #646fa7;
	font-weight:400;
	font-family: "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

section>div.section>div.container { width:100% !important; }
section>div.section { width:100% !important; }


/* floating-diagbox .................................................*/
.spinner {
	border: 5px solid #f3f3f3;
	border-top-color:#3c8dbc;
	border-radius: 50%;
	width: 15px;
	height: 15px;
	display:inline-block;
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
/* loader .................................................*/

div.table-container { border-radius:10px; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; }
div.table-head { padding:15px; border-bottom:thin solid #f1f0f0; }
table.table-main tr td:first-child { padding-left:15px; }
table.table-main tr td:last-child { padding-right:15px; }

table.table-main tr:first-child { font-size:12px; font-weight:500; text-transform:uppercase; background-color:#f3f6f9; }

table.table-main td { padding:8px; border-bottom:thin solid #f1f0f0; }

table.table-main tr:last-child td:first-child { border-bottom-left-radius:10px; }
table.table-main tr:last-child td:last-child { border-bottom-right-radius:10px; }

table.table-main tr.inactive { background-color:#fff6f6; }



.sec-left {
	min-width:250px;
	max-width:250px;
}
.sec-right { }
.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  box-shadow:0 7px 14px 0 rgba(60,66,87, 0.10), 0 3px 6px 0 rgba(0,0,0, 0.10);
  z-index:1;
}

.warning-wrap { position:relative; background-color:#f8f9fa; }
.warning { padding:5px; margin-top:10px; }
.warning:before {
	content: '';
	position: absolute;
	left: 15px;
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-bottom-color: #f8f9fa;
	border-top: 0;
	margin-top: -15px;	
}
/*
<div class="input-text-wrap">
	<input name="" type="text" class="input-text" />
	<div class="warning-wrap"><p class="warning _red">Email address required</p></div>
</div>
*/


/* Floating Dialogbox */
#fdbox-back {
	height:100%; width:100%; position:fixed; top:0px; left:0px; background-color:#000; z-index:1001; opacity:.5;
}
#fdbox-main {
	width:100%; height:100%; top:0px; position:fixed; z-index:1002;
}
#fdbox-main-container {
	max-height:calc(100% - 110px); overflow:hidden; margin-top:55px; margin-bottom:55px; border-radius:8px; background-color:#FFF; box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
}



/* Input Field */
.input-text-wrap { width:200px; border:thin solid #d3d5d8; border-radius:5px; }
.input-text { height:25px; padding:0px 5px; color:#646fa7; border:none; border-radius:5px; }
.input-disable { background-color:#f3f4f5; }
.submit-button { padding:8px 20px; color:#FFF; background-color:#3c8dbc; border:none; display:inline-block; border-radius:5px; }



/* Left Menu */
ul.left-menu { margin-top:30px; list-style-type: none; }
ul.left-menu li { padding:8px 10px; margin:0 30px; color:#646fa7; }
ul.left-menu li p {
	display:-webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
	overflow: hidden;
}
ul.left-menu li > i { min-width:30px; }
ul.left-menu li:not(.main) { text-transform:capitalize; }
ul.left-menu li.main { color:#b9bfdf; font-size:12px; font-weight:500; text-transform:uppercase; }
ul.left-menu li.active { background-color:#3c8dbc; border-radius:8px; color:#FFF; }

/*
.sec-left { width:auto; }
.sec-right { }
.menu-logo, .menu-resize-0 { display:none; }
.menu-resize-1 { display:block !important; text-align:center; }
ul li { flex-direction:column !important; }
ul li p { display:none; }
ul.left-menu li { margin:0 15px; }
ul.left-menu li > i { width:auto; }
*/




@media only screen and (min-width: 768px) and (max-width: 1030px) {
	section>div.section { width:1024px !important; }
}

@media only screen and (min-width: 1030px) and (max-width: 1300px) {
	section>div.section { width:100% !important; }
}

@media only screen and (min-width: 1300px) {

}