.alertify { 
    position: fixed;left: 0;right: 0;
    display: flex;align-items: center;justify-content: center;
    background: #FFFFFF;padding:15px 0px;font-size: 17px;
    -webkit-animation: alertify 0.3s forwards;
    -moz-animation: alertify 0.3s forwards;
    -o-animation: alertify 0.3s forwards;
    animation: alertify 0.3s forwards;

    -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 8%);
    
     
    -webkit-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -o-animation-name: fadeInDown;
    animation-name: fadeInDown; 
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -o-animation-duration:1s;
    z-index: 999999999999;
}


.alertify .fa { display:inline-block; width:22px; height:22px; line-height: 22px; font-size:14px; margin-right:10px;text-align: center; border-radius: 100%; }

.alertify.success{ background: #27ae60;color:#FFFFFF; }
.alertify.success .fa { background: #FFFFFF;color:#27ae60; }

.alertify.error { background: #E74C3C;color:#FFFFFF; }
.alertify.error .fa { background: #FFFFFF;color:#E74C3C; }

.alertify.warning { background: #f39C12;color:#FFFFFF; }
.alertify.warning .fa { background: #FFFFFF;color:#f39C12; }




@-webkit-keyframes fadeInDown {
    from { top:-500px;  }
    to { top:0px; }
}
@-moz-keyframes fadeInDown {
    from { top:-500px;  }
    to { top:0px; }
}
@keyframes fadeInDown {
    from {  top:-500px;  }
    to {  top:0px; }
}

.m0 { margin:0; }

.text-center { text-align:center !important; }


.header {  position: fixed;top:0px;left:250px;right:0px; display:flex;align-items:center;justify-content:center;background: #ffffff;  box-shadow:0px 10px 30px 0px rgba(82, 63, 105, 0.05);height:70px; padding-left:100px;padding-right: 100px;z-index: 500; }
.header .fal { margin-right: 5px; }



.header .right { margin-left:auto; }
.header .right a { display: inline-block;color: #666; padding:15px 0px 15px 15px;font-size:14px;  }
.header .right .toggle { display: none; }





.sidebar {
	position:fixed;	
	top:0px;
	bottom:0px; 
	width:250px; 
	background: #1e1e2d;
	overflow: hidden; 
	z-index: 500; 
	-webkit-transition: width;
    -o-transition: width;
    transition: width;
    -webkit-transition-duration: .1s;
    transition-duration: .1s;
    transition: width .1s cubic-bezier(0,0,.2,1);

}



.sidebar > ul { position: absolute;top:0px;bottom:0;left:0;right:0;width:100%;height:100%;z-index: 555;overflow-y: scroll; }
.sidebar > ul li {  display: block;}
.sidebar > ul li a {     display: block;overflow: hidden; line-height: 2rem; padding: 12px 20px ; color: #EEE;  }



.sidebar ul li a i.far{ font-size:12px;width:25px;min-width:25px;margin-right: 5px;text-align: center; }
.sidebar ul li a i.fa-caret-down{ margin-left:2.5px;width:auto;}


.sidebar > ul > li:hover > a, 
.sidebar > ul > li > a:focus,
.sidebar .open > a { background: rgba(200,200,200,.2) !important;color:#FFF; }

.sidebar .open  { position: relative;border:0px;border-radius: 0px;width:100%; }


.title { display:flex;align-items:center;justify-content:center;  padding:0 40px 30px 40px;  }
.title .left { margin-right:auto; }
.title .left h1 { color:#181C32;font-size:20px;font-weight:600 }

.breadcrumb { display:flex;align-items:center;justify-content:center;margin-top:0.25rem; }
.breadcrumb li + li { margin-left:5px; }
.breadcrumb li + li:before { content:'-';margin-right:5px;color:#A1A5B7; }
.breadcrumb a { color:#A1A5B7; }

.content {  position: absolute;     padding: 130px 100px 150px 350px;  width:100%; }

.qty  { display: inline-flex;align-content: center;justify-content: center;width: 100px;min-width: 100px;max-width: 100px;font-size:14px;color: #515151;background: #FFFFFF;border: 1px solid #EEE;text-align: center;border-radius:4px;overflow: hidden; }
.qty input { background: none;border:none;text-align: center;-moz-appearance: textfield;width: 100%;}
.qty input::-webkit-outer-spin-button,  .qty input::-webkit-inner-spin-button {  -webkit-appearance: none; margin: 0; }

.qty .btn{background: none;border: none;font-size: 16px;color: #222222;width:40px;}

.qty .btn, .qty input{  height: 35px;z-index: 222;}



@media screen and (max-width: 768px) {


	 .login .modal.active .modal-dialog { width:90%; }


	.sidebar{ display: none; }
	.sidebar.active { display: block; }

.dataTables_wrapper .dataTables_length { display: none !important; }
	.dataTables_wrapper .dataTables_filter { margin-top:0px !important; }
	.dataTables_wrapper .dataTables_filter label,
	.dataTables_wrapper .dataTables_filter input { display: block;width:100%; }
	.dataTables_wrapper .dataTables_paginate ,
	.dataTables_wrapper .dataTables_info{ display: block !important; width:100% !important; }

	body { overflow-x: hidden; }
	.header { left:0px;right:0px; }
	.header  .logo a{  background:none; color:#2c3e50; width: auto;font-size:16px; }

	body .header ul.nav li.first { display: none; }

	.header ul.nav.left{ display: none; }
	.header ul > li > a {  padding:0px 10px !important;	}
	.header ul > li.first { margin-left:0px;}
	.header ul > li.last {  display: none; margin-right:0px; }
	.header .nav li.toggle {  display: block; color:#888; font-weight: bold; 	}
	.header .nav li.toggle a { font-size:20px; }

	.header ul.nav > li.profile {margin:0px;}
.header ul.nav > li.logout {margin:0px;display: none;}
.header ul.nav > li.themes { display: none; }

	.sidebar {  display:none; }

	
	

	.content { padding:10px;margin-left:0px;width:100%; margin-top:60px;  }


	.count { font-size:14px !important; }

	.count .fa { font-size:45px !important; }
}


@media (min-width: 768px){
	

	body .header .nav.full { display: block; }

	.header ul.nav > li.toggle { display: none; }
	

}