.transparence50
{
	opacity: 0.5;
	filter: alpha(opacity=50);
}

.transparence75
{
	opacity: 0.20;
	filter: alpha(opacity=20);
}

.transparence30
{
	opacity: 0.9;
	filter: alpha(opacity=90);
}

.shadowallsides
{
-webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 1);
-moz-box-shadow:    0px 0px 15px 0px rgba(0, 0, 0, 1);
box-shadow:         0px 0px 15px 0px rgba(0, 0, 0, 1);
}

.autocomplete-w1 { background:url(img/shadow.png) no-repeat bottom right; position:absolute; top:0px; left:0px; margin:6px 0 0 6px; /* IE6 fix: */ _background:none; _margin:1px 0 0 0; }
.autocomplete { border:1px solid #999; background:#FFF; cursor:default; text-align:left; overflow:auto; margin:-6px 6px 6px -6px; /* IE6 specific: */ _height:350px;  _margin:0; _overflow-x:hidden; }
.autocomplete .selected { background:#F0F0F0; }
.autocomplete div { padding:2px 5px; white-space:nowrap; overflow:hidden; }
.autocomplete strong { font-weight:normal; color:#3399FF; }
.autocomplete-suggestions {
    background-color:#ffffff;
    border-left:1px solid #ccc;
    border-right:1px solid #ccc;
    border-bottom:1px solid #ccc;
    font-size:16px;
    margin-left:0px;
}


.autocomplete-suggestion {cursor:pointer;padding:3px;padding-left:5px;border-bottom: 0px;}
.autocomplete-suggestion:hover {background-color:#eeeeee;}


#opaque {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 5000;
	display: none;
	background-color: black;
	filter: alpha(opacity=75);
	opacity: 0.75;
}








.scroll-wrapper {
	overflow: hidden !important;
	padding: 0 !important;
	position: relative;
}

.scroll-wrapper > .scroll-content {
	border: none !important;
	box-sizing: content-box !important;
	height: auto;
	left: 0;
	margin: 0;
	max-height: none;
	max-width: none !important;
	overflow: scroll !important;
	padding: 0;
	position: relative !important;
	top: 0;
	width: auto !important;
}

.scroll-wrapper > .scroll-content::-webkit-scrollbar {
	height: 0;
	width: 0;
}

.scroll-element {
	display: none;
}
.scroll-element, .scroll-element div {
	box-sizing: content-box;
}

.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {
	display: block;
}

.scroll-element .scroll-bar,
.scroll-element .scroll-arrow {
	cursor: default;
}

.scroll-textarea {
	border: 1px solid #cccccc;
	border-top-color: #999999;
}
.scroll-textarea > .scroll-content {
	overflow: hidden !important;
}
.scroll-textarea > .scroll-content > textarea {
	border: none !important;
	box-sizing: border-box;
	height: 100% !important;
	margin: 0;
	max-height: none !important;
	max-width: none !important;
	overflow: scroll !important;
	outline: none;
	padding: 2px;
	position: relative !important;
	top: 0;
	width: 100% !important;
}
.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {
	height: 0;
	width: 0;
}




/*************** SCROLLBAR GOOGLE CHROME ***************/

.scrollbar-chrome > .scroll-element,
.scrollbar-chrome > .scroll-element div
{
	border: none;
	margin: 0;
	overflow: hidden;
	padding: 0;
	position: absolute;
	z-index: 10;
}

.scrollbar-chrome > .scroll-element {
	background-color: #ffffff;
}

.scrollbar-chrome > .scroll-element div {
	display: block;
	height: 100%;
	left: 0;
	top: 0;
	width: 100%;
}

.scrollbar-chrome > .scroll-element .scroll-element_outer {}

.scrollbar-chrome > .scroll-element .scroll-element_track {
	background: #f1f1f1;
	border: 1px solid #dbdbdb;
}

.scrollbar-chrome > .scroll-element.scroll-x {
	bottom: 0;
	height: 16px;
	left: 0;
	min-width: 100%;
	width: 100%;
}

.scrollbar-chrome > .scroll-element.scroll-y {
	height: 100%;
	min-height: 100%;
	right: 0;
	top: 0;
	width: 16px;
}

.scrollbar-chrome > .scroll-element .scroll-bar {
	background-color: #d9d9d9;
	border: 1px solid #bdbdbd;
	cursor: default;

	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

.scrollbar-chrome > .scroll-element .scroll-bar:hover {
	background-color: #c2c2c2;
	border-color: #a9a9a9;
}

.scrollbar-chrome > .scroll-element.scroll-draggable .scroll-bar {
	background-color: #919191;
	border-color: #7e7e7e;
}

/* scrollbar height/width & offset from container borders */

.scrollbar-chrome > .scroll-content.scroll-scrolly_visible { left: -16px; margin-left: 16px; }
.scrollbar-chrome > .scroll-content.scroll-scrollx_visible { top:  -16px; margin-top:  16px; }

.scrollbar-chrome > .scroll-element.scroll-x .scroll-bar { height: 8px; min-width: 10px; top: 3px; }
.scrollbar-chrome > .scroll-element.scroll-y .scroll-bar { left: 3px; min-height: 10px; width: 8px; }

.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_outer { border-left: 1px solid #dbdbdb; }
.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_track { height: 14px; left: -3px; }
.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_size { height: 14px; left: -4px; }

.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_outer { border-top: 1px solid #dbdbdb; }
.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_track { top: -3px; width: 14px; }
.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_size { top: -4px; width: 14px; }

.scrollbar-chrome > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -19px; }
.scrollbar-chrome > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -19px; }

.scrollbar-chrome > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -19px; }
.scrollbar-chrome > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -19px; }





#TB_iframeContent {
	-webkit-box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 1);
	-moz-box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 1);
	box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 1);
}


#TB_window
{
	z-index:50001;
}

#greyout {
	z-index:10000;position:absolute;width:calc(100% - 250px);height:10000px;background-color:#000;top:0px;left:250px;opacity: 0.70;filter: alpha(opacity=70);
}
#navbox {
	box-shadow: 0px 0px 25px 0px rgba(255,255,255, 0.3);z-index:20000;background-color:#000;width:880px;height:500px;position:fixed;top:150px;left:260px;padding:20px;color:#fff;border-radius:3px;border:1px solid #666;
}
.ui_box_wrapper {
	z-index:80000;position:absolute;width:100%;height:10000px;background-color:#000;top:0px;left:0px;opacity: 0.70;filter: alpha(opacity=70);
}
.ui_box_inner_error {
	border-radius:10px;z-index:80001;position:absolute;top:300px;left: calc(50% - 300px);width:600px;background-color:#fff;min-height:100px;padding:10px;border:5px solid red;
}
.ui_box_inner_error_ok {
	float:right;width:295px;cursor:pointer;color:#fff;background-color:#95018c;padding:5px;line-height:25px;text-align:center;font-weight:bold;height:25px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
}
.ui_box_inner_info {
	border-radius:10px;z-index:80001;position:absolute;top:300px;left: calc(50% - 300px);width:600px;background-color:#fff;min-height:100px;padding:10px;border:5px solid #00ce0a;
}
.ui_box_inner_info_ok {
	float:right;width:295px;cursor:pointer;color:#fff;background-color:#95018c;padding:5px;line-height:25px;text-align:center;font-weight:bold;height:25px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
}
.ui_box_inner_confirm {
	border-radius:10px;z-index:80001;position:absolute;top:300px;left: calc(50% - 300px);width:600px;background-color:#fff;min-height:150px;padding:20px;border:5px solid #fff;
}
.ui_box_inner_confirm_ok {
	position:absolute;bottom:20px;left:20px;width:150px;cursor:pointer;color:#fff;background-color:#488fdb;padding:5px;line-height:25px;text-align:center;font-weight:bold;height:25px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
}
.ui_box_inner_confirm_cancel {
	position:absolute;bottom:20px;right:20px;width:150px;cursor:pointer;color:#fff;background-color:#b82c44;padding:5px;line-height:25px;text-align:center;font-weight:bold;height:25px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
}



body {
	background-color: #fff;
}

.lightbox_close {
	float:right;
	margin-right:20px;
	margin-top:10px;
}

.breakline {
	background-color:#ccc;
	height:1px;
	margin-top:5px;
	margin-bottom:5px;
}

.whitebox {
	width: 100%;
	background-color: #fff;
	border-radius: 3px;
	box-shadow: 0 .125rem .25rem rgba(63,63,71,.09);
	padding: 15px;
}

.button_ok {
	cursor: pointer;
	background-color: #98d94c;
	border-radius: 4px;
	padding: 5px;
	padding-left:20px;
	color: #fff;
}

.button_cancel {
	cursor: pointer;
	background-color: #de3737;
	border-radius: 4px;
	padding: 5px;
	padding-left:20px;
	color: #fff;
}


.errorbox_bg {
	z-index:81000;position:absolute;width:100%;height:10000px;background-color:#000;top:0px;left:0px;opacity: 0.70;filter: alpha(opacity=70);
}
.errorbox_inner {
	border-radius:10px;z-index:81001;position:absolute;top:300px;left:0;right:0;margin-left: auto;margin-right: auto;width:calc(100% - 20px);max-width:800px;background-color:#fff;border:5px solid red;min-height:100px;padding:10px;
}
.errorbox_button {
	float:right;width:295px;cursor:pointer;color:#fff;background-color:#232323;padding:5px;line-height:15px;text-align:center;font-weight:bold;height:25px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
}


.infobox_bg {
	z-index:81000;position:absolute;width:100%;height:10000px;background-color:#000;top:0px;left:0px;opacity: 0.70;filter: alpha(opacity=70);
}
.infobox_inner {

   border-radius: 10px;
   z-index: 81001;
   position: absolute;
   top: 50%;
   left: 50%;
   width: 100%;
   background-color: #fff;
   min-height: 100px;
   padding: 30px 15px;
   text-align: center;
   max-width: 360px;
   box-shadow: 0px 0px 7px 1px #00000059;
   transform: translateX(-50%) translateY(-50%);
}

.infobox_button {
	width:100%;cursor:pointer;color:#fff;background-color:#de3737;line-height:35px;text-align:center;font-weight:bold;height:35px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
   transition: .3s;
}
.infobox_button:hover {
background:#F55E5E ;
}


.confirmbox_bg {
	z-index:81000;position:absolute;width:100%;height:10000px;background-color:#000;top:0px;left:0px;opacity: 0.70;filter: alpha(opacity=70);
}
.confirmbox_inner {
	border-radius:10px;z-index:81001;position:absolute;top:300px;left: calc(50% - 300px);width:600px;background-color:#fff;border:5px solid #fff;min-height:150px;padding:20px;
}
.confirmbox_button_ok {
	position:absolute;bottom:20px;right:20px;width:150px;cursor:pointer;color:#fff;background-color:#488fdb;padding:5px;line-height:15px;text-align:center;font-weight:bold;height:25px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
}
.confirmbox_button_cancel {
	position:absolute;bottom:20px;left:20px;width:150px;cursor:pointer;color:#fff;background-color:#b82c44;padding:5px;line-height:15px;text-align:center;font-weight:bold;height:25px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
}


.loadingbox_bg {
	z-index:40000;position:absolute;width:100%;height:100%;background-color:#000;top:0px;left:0px;opacity: 0.70;filter: alpha(opacity=70);
}
.loadingbox_inner {
	z-index:40001;position:absolute;top:300px;left: calc(50% - 100px);min-height:100px;padding:10px;text-align:center;
}
.loadingbox_infotext {
	color:#fff;font-size:22px;
}


.lightbox_bg {
	z-index:80000;position:absolute;width:100%;height:10000px;background-color:#000;top:0px;left:0px;opacity: 1;filter: alpha(opacity=100);
}
/* .lightbox_inner {
	border-radius: 10px;
    z-index: 80001;
    position: fixed;
    top: 50%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: calc(100% - 20px); 
    background-color: #fff;
    max-width: 800px;
    min-height: 400px;
    padding: 30px 15px;
    transform: translateY(-50%);
} */

.lightbox_inner {
   z-index: 80001;
   position: fixed;
   left: 50%;
   width: calc(100% - 20px);
   background-color: #fff;
   max-width: 950px;
   min-height: 400px;
   padding: 0px 15px 10px;
   transform: translateY(-50%) translateX(-50%);
   top: 50%;
   height: 630px;
   overflow: hidden;
}
.datainfobox {
	display:none;z-index:50000;padding:15px;background-color:#fff;position:absolute;box-shadow: 0px 0px 15px 0px rgba(50,50,50,0.2);
}
/*
Redesign
*/
body{
	background-color:#f4f4f5!important;
}

.login-area{
   background:#fff;
   border-radius: 10px;
   padding: 30px 15px 15px;
   box-shadow: 0px 0px 4px 0px #a3a3a3;


}
.page-title{
   color:#de3737;
   font-size: 30px;
   text-align: center;
   margin-bottom: 27px;
   text-transform: uppercase;
   font-weight: bold;	
   padding-top: 50px;
}
.field-input{
   border-bottom: 1px solid #a1a1a6;
   margin-bottom: 15px;    
   height: 32px;
   display: flex;

}
.field-input i {
   position: relative;
   top: 8px;
   left: 3px;
   font-size: 16px;
   color: #a1a1a6;
}

.field-input input{
   background:none;
   border: 0;	
   line-height: 31px;
   padding: 0 10px 0 0; 
   font-size: 14px; 
   width: 100%;
   outline: 0;
   border: 0;
}
.field-input:focus, .field-input:outline {
   border-color: inherit;
   -webkit-box-shadow: none;
   box-shadow: none;
   background: none;
 }
 input:-webkit-autofill,
 input:-webkit-autofill:hover,
 input:-webkit-autofill:focus,
 input:-webkit-autofill:active {
	 transition: background-color 5000000s ease-in-out 0s;
    outline: none;
    border: 0;
 }
.buttom-area {
   cursor: pointer;
   line-height: 31px;
   padding: 0 20px;
   font-size: 14px;
   text-transform: uppercase;
   background:#de3737;
   padding: 0 20px;
   width: 100%;
   color: #fff;
   transition: .3s;
   text-align: center;
   font-weight: 600;
   margin-top: 30px;

}
.buttom-area:hover {
background:#a1a1a6 ;
}	
.language-section img{
   cursor:pointer;
   width:25px;
   float:left;
   margin-top:10px;
   margin-right:10px;	 
}


nav{
   box-shadow: 0px 0px 5px -1px #000;
   padding: 10px 15px 15px!important;
   background:#fff
}
.header_lang-area{
   position: relative;
   padding: 0px 20px;
   border-right: 1px solid #de3737;
   margin-right: 15px;
   display: flex;
   flex-direction: column;
   line-height: 0;	 
}
.header_lang-area img{
		width:25px;
}.header_lang-area span:first-child{
   margin-top: 0px;
}

.header_lang-area span{
   margin-top: 7px;
}

.logout-icon{
   transition: .3s;
}

.logout-icon:hover{
   filter: grayscale(1);
}

.user-settings-icon{
   transition: .3s;
}

.logout-icon:hover{
   filter: grayscale(1);
}

.user-settings-icon:hover{
   filter: grayscale(4);
}

.date-area{	
   margin-right: 10px;
}
.date-area input{
   border: 0;
   border-bottom: 1px solid #a1a1a6;	
   border-radius: 0;
   margin-left: 7px;
}

.template-area{	
   margin-top: 8px;	
   
}
.template-area select{
   border: 0!important;
   border-bottom: 1px solid #a1a1a6!important;	
   border-radius: 0!important;
   margin-left: 7px;
}
.select2-container--default .select2-selection--single {
   background-color: #fff;
   border: 0!important;
   border-bottom: 1px solid #aaa!important;
   border-radius: 0!important;
}
.navbar-nav{
   margin: 0 auto;
}
.grid-stack > .grid-stack-item > .grid-stack-item-content {
   /*border-radius: 4px;*/
}



.header_usermanager i{
   font-size: 30px;
   color:#de3737;
   transition: .3s;
}
.header_usermanager:hover i{
   color:#a1a1a6
}

.popup-close-button{
   position: absolute;
   right: 0;
   top: 0;
   height: 35px;
   width: 35px;
   display: block;
   color: #fff;
   background-color: #de3737;
   transition: .3s;
   border: 1px solid #fff;
   text-align: center;
   line-height: 33px;
   cursor: pointer;
   border-top: 0;
   border-right: 0;
   border-radius: 0 10px;
}
.popup-close-button:hover{
   color:#de3737 ;
   background: #fff;
   border-color:#de3737 ;
}
.popup-filter-section{
    margin-bottom: 40px;
    font-size: 0;
    background: #eee;
    border-radius: 9px;
    overflow: hidden;
}
.popup-filter-section div{ 
   cursor:pointer; 
   height:50px; 
   text-align:center;
   font-size:16px;
   line-height: 50px;
   border-bottom: 2px solid #de3737;
   text-align: center;
   background: #eee;
   transition: .3s;
   font-weight: 700;
   text-transform: capitalize;
   padding: 0 15px;
   display: inline-block;

}
 
.popup-filter-section  div.active, .popup-filter-section div:hover,.popup-filter-section div:hover {
   background: #de3737;
   color: #fff;
}

.popup-body-header{
   font-size: 21px;
   margin-bottom: 20px;
   display: block;
   color: #de3737;
   font-weight: 700;
   border-bottom: 1px solid #ccc;
   padding-bottom: 10px;
}
.popup-body-header span{
   font-size: 12px;
   display: block;
   margin-top: 10px;
   color: #000;
   font-weight: 400;
}

.popup-list-area label{
   margin-bottom: 0;
   cursor: pointer;
   width: 100%;

}
.popup-list-area ul{
   list-style: none;
   padding: 0;
   margin: 0;
   
}
.popup-list-area ul li{
   line-height: 35px;
   font-size:14px;
   cursor: pointer;
}
.popup-list-area ul li{ 
}
.popup-list-area ul li div{
   
}

.field-select{
margin-bottom: 15px;
}
.field-select select{
   width: 100%;
   line-height: 30px;
}
.field-select label{
   
}
.field-input{
   margin-bottom: 15px;
   
}
.field-input input{
   padding:0 10px
}
.field-input label{

   
}
.savedDashedboard-field-textarea{
	
	margin-bottom: 20px;     

}
.savedDashedboard-field-textarea textarea{
   background:none;
   border: 1px solid #ccc;	
   line-height: 31px;
   padding: 10px; 
   font-size: 14px; 
   width: 100%;
   padding:0 10px;
   border-radius: 4px;
}
.savedDashedboard-field-checkbox{
	margin-bottom: 5px;
}
.usermanager-field-input, .savedDashedboard-field-input, .widgetsettings-field-input{
   border-bottom: 1px solid #a1a1a6;
   margin-bottom: 20px;     

}
.usermanager-field-input input, .savedDashedboard-field-input input, .widgetsettings-field-input input{
   background:none;
   border: 1px solid #eee;	
   line-height: 31px;
   padding: 0 10px 0 0; 
   font-size: 14px; 
   width: 100%;
   padding:0 10px
}
.usermanager-field-input:focus, .usermanager-field-input:outline, .savedDashedboard-field-input:focus, .savedDashedboard-field-input:outline{
   border-color: inherit;
   -webkit-box-shadow: none;
   box-shadow: none;
   background: none;
 }
 .usermanager-field-input label, .usermanager-field-select label, .savedDashedboard-field-input label, .widgetsettings-field-input label{
	width: 100%;
	display: block;
	font-size: 14px;
 }
 .widgetsettings-field-input input:focus-visible{
   outline: none;
}
 
.usermanager-field-select, .field-checkbox-select{
	border-bottom: 1px solid #a1a1a6;
	margin-bottom: 20px;     
 }

 .usermanager-field-select select, .field-checkbox-select select{
	background:none;
	border: 1px solid #eee;	
	line-height: 35px;
	height: 35px;
	padding: 0 10px 0 5px; 
	font-size: 14px; 
	width: 100%;
 }

.form-button{
   cursor: pointer;
   text-align: center;
   border-radius: 3px; 
   line-height: 35px; 
   font-size: 16px;
   transition: .3s;
   font-weight: 700;
   margin: 0 10px;
}

.form-button-cancel{
background: #383838;
}
.form-button-area{
 text-align: left;
 margin-top: 25px;
}
.form-button-area .form-button{
	margin: 0;
	display: inline-block;
}
.navtab_active {
   position: relative;
   cursor: pointer;
   height: 40px;
   text-align: center;
   color: #000;
   display: inline-block;
   padding: 0 10px;
   border: 0;
   background: #eee;
   line-height: 40px;
   font-size: 24px;
   border-bottom: 2px solid #de3737;
}

input[type=checkbox], input[type=radio] {
    margin-right: 5px;
    height: 20px;
    width: 20px;
    position: relative;
    top: 3px;
}

.popup-addwidget-freestyle-box {
	width: 100%;
    background: #eee;
    padding: 8px 10px;
    display: inline-block;
    font-size: 14px;
    margin-bottom: 5px;
    line-height: 30px;
    cursor: pointer;
}

#dashboardcontrol {
   margin-top: 9px;
   border: 0!important;
   background-color: #fff;
   border-bottom: 1px solid #ccc!important;
   padding: 3px;
   border-radius: 0!important;
}
#widgetsettings{
	overflow: auto;
    /*max-height: 245px;*/
}
.popup-welcome-msg{
   min-height: 25px;
   font-size: 14px;
   margin-bottom: 10px;
}
.background-wrapper{
   background-color: #eee;
   padding-top: 10px;
   margin-top: 10px;

}
.margin-top-button{
   margin-top: 27px;
}
.navtab_active {
    position: relative;
    cursor: pointer;
    margin-bottom: 4px;
    margin-right: 4px;
    width: 60px;
    border-radius: 4px;
    height: 40px;
    float: left;
    border: 1px solid #4fafd9;
    background-color: #dceff7;
    text-align: center;
    color: #181821;
    font-size: 16px;
    line-height: 40px;
}


.navtab_inactive {
    position: relative;
    cursor: pointer;
    margin-bottom: 4px;
    margin-right: 4px;
    width: 60px;
    height: 40px;
    border-radius: 4px;
    float: left;
    border: 1px solid #ccc;
    text-align: center;
    font-size: 16px;
    line-height: 40px;
}
#TB_window{
	border-radius: 15px;
	overflow: hidden;
}
.widgetbox_innercontent{
   //padding-left: 4px;
}
.widgetbox_innercontent td{
   font-size: 14px;
   padding-left: 4px;
}
.widgetbox_actionwrapper { 
    background-color: #383838!important; 
    width: 95px;
    height: 32px;
    padding-top: 4px;
}
.widgetbox_title {
    padding-left: 14px!important;
    background-color: #383838!important; 
    height: 32px;
    line-height: 32px!important;
    font-size: 14px;
}
.popup-col-description{
 font-size: 14px;
 font-weight: 600;
 margin-bottom: 10px;
}
.popup-col-description span{
   display: inline-block;
   margin-left: 20px;
   
}
.popup-list-body{
   background-color: #eee;
   display: flex;
   height: 35px;
   margin-bottom: 2px;
   height: 35px;
   padding: 0 10px;
   border: 1px solid #fff;
   transition: .3s;
   border-radius: 5px;
}
.popup-list-body:hover{
   border: 1px solid #ccc; 
}
.popup-checkbox-area{
   position: relative;
   top: 3px;
}
.popup-input-area{
   width: 100%;
   margin-right: 10px;
   padding: 3px 0;
}
.popup-input-area input{
   width: 100%;
   padding: 0 10px;
   font-size: 14px;
   border: 0;
}
.popup-delete-area{
   position: relative;
   top: 3px;
   transition: .3s;
}
.popup-delete-area:hover{
   color: #de3737;
}
.popup-edit-dashboard{
   padding-top: 30px;
}

.widgetbox_title { 
   width: calc(100% - 155px)!important; 
}
.widgetbox_actionwrapper { 
   width: 155px!important;
}
.widgetbox_innercontent { 
   height: calc(100% - 30px)!important;
}
.navtab_active {
   position: relative!important;
   cursor: pointer!important;
   margin-bottom: 4px!important;
   margin-right: 4px!important;
   width: 50px!important;
   border-radius: 4px!important;
   height: 40px!important;
   float: left!important;
   border: 1px solid #eee!important;
   
   text-align: center!important;
   color: #fff!important;
   font-size: 16px!important;
   line-height: 37px!important;
}
.navtab_inactive {
   position: relative!important;
   cursor: pointer!important;
   margin-bottom: 4px!important;
   margin-right: 4px!important;
   width: 50px!important;
   height: 40px!important;
   border-radius: 4px!important;
   float: left!important;
   border: 1px solid #ccc!important;
   text-align: center!important;
   line-height: 37px!important;
   transition: .3s;
}
.filtercount {
   position: absolute;
   top: -9px;
   right: -9px;
   width: 20px;
   height: 20px;
   border-radius: 50%; 
   color: #fff;
}
.filtercountnumber {
   color: #fff;
   margin-top: 0px;
   font-size: 10px;
   line-height: 19px;
   font-weight: 600;
}
.flex-option ul li{
   display: flex;
    justify-content: space-between;
}
#assigned_chartlines select {
   background: none;
}  
.widgetsettings_edit_chartlinefilter{
   display: flex;
   justify-content: space-between;
} 
.chartlines-list-name{
   font-size: 14px;
   line-height: 25px;
   padding-left: 10px;
}
.chartlines-list-dropdown{
   font-size: 14px;

}
.chartlines-list{
   display: flex;
    justify-content: space-between;
    line-height: 28px;
    margin-bottom: 1px;
    transition: .3s;
    border-bottom:1px solid #ccc;
}
#new_chart_selector {
   overflow-y: scroll;
   
   scrollbar-width: thin;
   scrollbar-color: rgb(147, 147, 147) rgb(56, 56, 56);
 }
#wrapper_usermanager{
   /*max-height: 335px;*/
   height: 100%;
   overflow-x: hidden;
}
#wrapper_usermanager .form-button-area{
   margin-right: 13px;
}
/* ScrollBar on Chrome */
body ::-webkit-scrollbar {
   width: 10px;
   background:#383838;
   width: 10px;
}

body ::-webkit-scrollbar-track {
   -webkit-box-shadow: inset 0 0 0px #383838; 
   border-radius: 0;
   width: 10px;
}

body ::-webkit-scrollbar-thumb {
   border-radius: 0;
   -webkit-box-shadow: inset 0 0 6px #858585; 
   background:#858585;
} 

.select2-container--default .select2-results__group {
   font-size: 14px!important;
 }
 .select2-container--default .select2-results__option .select2-results__option {
   font-size: 14px!important;
   padding-left: 10px!important;
 }
 .kivvon-logo-section{
   text-align: center;
   margin: 90px 0 90px;
 }
 .kivvon-logo-section img{
   width: 100%;
   max-width: 700px;
 }
 .heatmap-dropdown { 
 color:#fff;position:absolute;width:100%;text-align:center;top:50px;padding-left:15px;padding-right:15px;font-size:12px;
 }
.heatmap-dropdown select{
   width: 100%;
   max-width: 300px;
   padding: 5px;
   border: 1px solid #fff;
   border-radius: 5px;
   background: #ffffff6e;
   color: #fff;
}
.heatmap-dropdown option{
   color: #333;
   font-size: 12px;
}



@media (min-width:1025px) {
	.mediaWrapperDesktop
	{
		
	}
	.mediaWrapperMobile
	{
		display:none;
	}
   .form-button-area {
      margin-right: 10px;
    }
}

@media (max-width:1024px) {
	.mediaWrapperDesktop
	{
		display:none;
	}
	.mediaWrapperMobile
	{
		
	}
	
	.popup-filter-section div {
	    display: block;
	}
	.header_lang-area span {
		margin-top: 0;
	    margin-right: 10px;
	}
	.header_lang-area {
	   margin-top: 15px;
	   flex-direction: row;
	   padding: 5px 10px;
	   margin-right: 0;
	   border: 0;
	   padding-right: 0;
	}
	.date-area select {
	    width: 235px;
	}
	.date-area input  {
	    width: 260px;
	    margin-right: 0;
	}
	#new_chart_selector {
	   max-height: 270px;
	   height: 100%;
	}
	
	.form-button-area {
	   margin: 25px 0px 0;
	}
	.form-button {  
	   
	   margin: 0 10px 10px;
	}
	.form-button-area .form-button {
	margin-top: 10px;
	}
}
  

@media only screen and (min-width : 1025px) {
	.mobile_only {
		display:none !important;
	}

    .lightbox_inner {
       min-height: auto; 
       height: 95%; 
       width:95%;
       padding-top: 0px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #0e1821;
    }

}


@media only screen and (max-width: 1024px)
{
	.desktop_only {
		display:none !important;
	}
    
    .lightbox_inner {
       min-height: auto; 
       height: 100% !important; 
       width:100% !important;
       padding-top: 0px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: #0e1821;
    }
    
    
    section {
      width: 100%;
      height: 100%;
      background-color:#0e1821;
    }
    .block {
      width: 500px;
      height: 100px;
      margin: auto;
      padding: 0px;
    }
    .slider-box {
      display: flex;
      overflow: hidden;
      border: 0px;
    }
    .slider {
      display: flex;
      transition: 0.5s;
    }
    .slide {
      width: 320px !important;
      margin-right:10px;
      height: 100%;
      border: 1px solid #444;
      color:#fff;
      background-color:#182530;
    }

    /*  */
    @for $i from 1 through 3 {
      @for $j from 1 through 4 {
        [class~="#{$i}"] .slide:nth-child(#{$j}) {
          background-image: url(https://picsum.photos/500/100?#{1000 * $i + $j});
        }
      }
    }    
}

