/*  body { padding-top: 60px; 60px to make the container go all the way to the bottom of the topbar
 }
 */
 
 
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    margin-bottom: 0.5rem;
    font-weight: 300;
    line-height: 1.3;
}

h1, .h1 {
    font-size: 2.5rem;
}
h2, .h2 {
    font-size: 2rem;
}
h3, .h3 {
    font-size: 1.75rem;
}
h4, .h4 {
    font-size: 1.5rem;
}
h5, .h5 {
    font-size: 1.125rem;
}
h6, .h6 {
    font-size: 1rem;
}
.text-muted {
    color: #868e96 !important;
}
small, .small {
    font-size: 0.875rem;
    font-weight: 400;
}


body {
	/*padding-top: 0px;
  padding-bottom: 40px;
  background-color: #eee;*/
  margin: 0;
	margin-top: -20px;
	
    /*font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
    font-size: 1.0rem;
    font-weight: 400;
    line-height: 1.5;
    color: #4a4e69;
    text-align: left;*/
    /*word-break: break-all;
    word-break: break-word;*/
}

body.fullScreen {
	background-color: #e4e5e6;
	background-color: #f3f5fa;
	min-height: 100vh;
	display: flex;
	flex-direction: row;
	align-items: center !important;
}


label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-size: 1.1em;
    font-weight: normal; 
}
label.error , label.success {
    padding-left: 15px;
    font-size: 1.1em;    
}

input, button, select, textarea {   
    border: 0.4px solid #ccc;
}

.btn-logout{
	border: none;
    background-color: inherit;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #f1f2f4;
    line-height: 2.6em;
	
}

.fullscreen_bg {
	z-index: 30;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-size: cover;
	background-position: 50% 50%;
	background-image: url('../img/color-splash.jpg');
	background-repeat: repeat;
}
/* OVERRIDE MATRIX THEME */
#header {
    background-color: #20a8d8;
    
}
.navbar-inverse {
    /* background-color: #222;
    border-color: #080808; */
    background-color: #20a8d8;
  
    border-color: #1c97c2;
}
#user-nav > ul > li > a:hover, #user-nav > ul > li.open > a {
    color: #ffffff;
    background: #20a8d8;
}
#user-nav > ul {
    
    /* border-right: 1px solid #2e363f;
    border-left: 1px solid #000; */
     border-right: 0px solid #1c97c2;
    border-left: 0.6px solid #a6def2;
}
#user-nav > ul > li {
    
    /* border-left: 1px solid #2e363f;
    border-right: 1px solid #000; */
    border-left: 0px solid #1c97c2;
    border-right: 0.6px solid #a6def2;
}

#search input[type=text] {
    background-color: #fff;
    color: #666;
    width:250px;
}
#search input[type=text]:focus {
    
    color: #333;
    box-shadow: none;
}
/* #user-nav > ul > li a{color:#eee;} */


/* NAVIGATION */
.navbar {
	min-height: 20px;
    border: 0px solid transparent;
    padding:0;
}

#search button {
	display:none;
	border: 0;
	margin-left: -3px;
	margin-top: 0;
	padding: 4px 10px 5px;
}


#user-nav {
	z-index: 20;
}

#search {
	z-index: 25;
	top: 4.5px;
    right: 1px;
}

#header h1 {
	background: url(../img/vms_logo.png) no-repeat scroll 0 0 transparent;
	height: 30px;
	left: 20px;
	line-height: 600px;
	overflow: hidden;
	position: relative;
	top: 5px;
	width: 191px;
}



/* menu style begin */
.navbar-brand {
	width: 140px;
	height: 50px;
	/* background: url('theme/img/cams.jpg') no-repeat center center; */
	/* background-size: 50px; */
}

.nav-tabs {
	display: flex; /*inline-block;*/
	border-bottom: none;
	padding-top: 15px;
	font-weight: bold;
}

.nav-tabs>li>a, .nav-tabs>li>a:hover, .nav-tabs>li>a:focus, .nav-tabs>li.active>a,
	.nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
	border: none;
	border-radius: 0;
}

.nav-list {
	border-bottom: 1px solid #eee;
}

.nav-list>li {
	padding: 20px 15px 15px;
	border-left: 1px solid #eee;
}

.nav-list>li:last-child {
	border-right: 1px solid #eee;
}

.nav-list>li>a:hover {
	text-decoration: none;
}

.nav-list>li>a>span {
	display: block;
	font-weight: bold;
	text-transform: uppercase;
}


#sidebar > ul > li > a {
    padding: 10px 0 10px 15px;
    display: block;
    color: #f1f2f4;
}
#sidebar > ul li ul li a {
    color: #e2e4e9;
}
#sidebar > ul li ul li a:hover, #sidebar > ul li ul li.active a {
    color: #fff;
    background-color: #20a8d8;
}
#sidebar > ul li.open ul {
    
    max-height: 300px;
    overflow-y: scroll;
}

#sidebar .label:empty {
    display: none;
}
/*bs4 missing caret styling*/
#sidebar .caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid \9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

#user-nav > ul > li > a {
    /*padding: 9px 10px;*/
    padding: 9px 10px;
    display: block;
    font-size: 11px;
    color: #f1f2f4;
    background: transparent;
    line-height: 1.2;
}

.mega-dropdown {
	position: static !important;
}

.mega-dropdown-menu {
	padding: 20px 15px 15px;
	text-align: center;
	width: 100%;
}

#breadcrumb {
    background-color: #fff;
    border-bottom: 1px solid #f9f9fb;
    background: none repeat scroll 0 0 #f9f9fb;
}
#content-header {    
    margin-top: 0px;    
}

#content {
    background: none repeat scroll 0 0 #f9f9fb !important;
    min-height:0;
    
}
#header {
    height: 45px;
    position: relative;
    width: 100%;
    z-index: -9;
}

/* menu style end */

/* Sign In page style begin */
.login-page {
	padding-top: 120px;
}

.btn {
	outline: 0;
	/*border: none;
	border-top: none;
	border-bottom: none;
	border-left: none;
	border-right: none;*/
	border-radius: 3px;
	/* box-shadow:inset 2px -3px rgba(0,0,0,0.15);*/
}

.btn-primary {    
    color: #fff !important;
    background-color: #337ab7;
    border-color: #2e6da4;
}
.btn-primary:focus, .btn-primary.focus {
    box-shadow: none;
}
.btn-primary:active:hover, .btn-primary.active:hover, .open > .dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open > .dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open > .dropdown-toggle.btn-primary.focus {
    color: #fff;
    background-color: #204d74;
    border-color: #122b40;
}

.btn:focus {
	outline: 0;
	-webkit-outline: 0;
	-moz-outline: 0;
}

.bk {
	display: inline-block;
	width: 300px;
	height: 100px;
	box-sizing: border-box;
	background-color: #FFFFFF;
}

/**Animation  */
.icon-animated-bell {
	display: inline-block;
	-moz-animation: ringing 2s 5 ease 1s;
	-webkit-animation: ringing 2s 5 ease 1s;
	-o-animation: ringing 2s 5 ease 1s;
	-ms-animation: ringing 2s 5 ease 1s;
	animation: ringing 2s 5 ease 1s;
	-moz-transform-origin: 50% 0;
	-webkit-transform-origin: 50% 0;
	-o-transform-origin: 50% 0;
	-ms-transform-origin: 50% 0;
	transform-origin: 50% 0;
}

.icon-animated-vertical {
	display: inline-block;
	-moz-animation: vertical 2s 5 ease 2s;
	-webkit-animation: vertical 2s 5 ease 2s;
	-o-animation: vertical 2s 5 ease 2s;
	-ms-animation: vertical 2s 5 ease 2s;
	animation: vertical 2s 5 ease 2s;
}

input.error, select.error,textarea.error, span.select2-container.error span.select2-selection , div.medium-editor-element.error{
	border: 0.4px solid red !important;
}
/*@controller error. Import files & access module*/
#content-header> div.error {
    color: red;
    font-size: 1.2em;
    padding-left: 15px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered{
	line-height: 37px;
}
.select2-container--default .select2-selection--multiple,.select2-container--default .select2-selection--single{
	border: 0.4px solid #ccc !important;
    border-radius: 4px !important;
}
.select2-selection--single, .select2-selection--multiple {
	border-radius: 0px;
	min-height: 34px !important;	
	font-size: 14px;
    line-height: 1.42857143;
    padding-left: 5px;
    color: #666 !important;
}

.input-group > .select2-container--default {
    width: auto;
    flex: 1 1 auto;
}

/*  CARD */
.card {
	background-color: #fff;
	/* padding-top: 20px; */
	/*padding: 15px 15px;
	margin: 10px 0px 20px 0px;*/
	padding: 0px 15px;
    margin: 0px 0px 0px 0px;
	/* background-color: rgba(214, 224, 226, 0.2); */
	border-top-width: 0;
	border-bottom-width: 2px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border: 0.6px solid #f3f3f3;
}
.card .card-header {
	padding: 10px 15px;
	margin: 10px 0;
}

.card  .card-body {
	margin: 0px 0;
}

.card .card-footer {
	margin: 10px 0;
}

.card-header {
  /*padding: 0.75rem 1.25rem;*/
  margin-bottom: 0;
  padding: 0.75rem 1.25rem;
  
  background-color: transparent;
  border-bottom: 1px solid #cfd8dc; }

.card-footer {
  padding: 0.75rem 1.25rem;
  background-color: #eceff1;
  border-top: 1px solid #cfd8dc; }

.card-header-tabs {
  margin-right: -0.625rem;
  margin-bottom: -0.75rem;
  margin-left: -0.625rem;
  border-bottom: 0; }

.card-header-pills {
  margin-right: -0.625rem;
  margin-left: -0.625rem; }

.card-primary {
  background-color: #20a8d8;
  border-color: #20a8d8; }
  .card-primary .card-header,
  .card-primary .card-footer {
    background-color: transparent; }

.card-success {
  background-color: #4dbd74;
  border-color: #4dbd74; }
  .card-success .card-header,
  .card-success .card-footer {
    background-color: transparent; }

.card-info {
  background-color: #63c2de;
  border-color: #63c2de; }
  .card-info .card-header,
  .card-info .card-footer {
    background-color: transparent; }

.card-warning {
  background-color: #f8cb00;
  border-color: #f8cb00; }
  .card-warning .card-header,
  .card-warning .card-footer {
    background-color: transparent; }

.card-danger {
  background-color: #f86c6b;
  border-color: #f86c6b; }
  .card-danger .card-header,
  .card-danger .card-footer {
    background-color: transparent; }


.card-link:hover {
  text-decoration: none; }

.card-link + .card-link {
  margin-left: 1.25rem; }    

.card-inverse {
	color: rgba(255, 255, 255, 0.95);
}

.card-inverse .card-header, .card-inverse .card-footer {
	background-color: transparent;
	border-color: rgba(255, 255, 255, 0.2);
}

.card-inverse .card-header, .card-inverse .card-footer, .card-inverse .card-title,
	.card-inverse .card-blockquote {
	color: #fff;
}

.card-inverse .card-link, .card-inverse .card-text, .card-inverse .card-subtitle,
	.card-inverse .card-blockquote .blockquote-footer {
	color: rgba(255, 255, 255, 0.65);
}

.card-inverse .card-link:focus, .card-inverse .card-link:hover {
	color: #fff;
}



/* FORM */
 .page-header{
	font-size: 1.4em !important;
    font-weight: bold !important;    
    text-transform: uppercase;	
    font-family: 'Open Sans', sans-serif;
}
.panel {
   
    border: 0.1px solid transparent;
}    
.panel-default > .panel-heading {
    color: #333;
    background-color: #fbfbfb;
    border-color: #fff;
    box-shadow: 0 .125rem 1.25rem rgba(0,0,0,.075)!important;
}
.panel-heading {
	font-size: 1.4em !important;
    font-weight: bold !important;    
    text-transform: uppercase;	
    font-family: 'Open Sans', sans-serif;
}

.panel-subheading{
	font-size: 1.1em !important;
    font-weight: bold !important;    
    text-transform: uppercase;	
    font-family: 'Open Sans', sans-serif;
}

/* tabbed within a panel */
.panel .nav-pills > li.active > a, 
.panel .nav-pills > li.active > a:hover, 
.panel .nav-pills > li.active > a:focus {

    color: #666;
    background-color: transparent; 
}

.nav.nav-tabs.style1 .nav-link.active{
	border-bottom: 2px solid #337ab7;
	border-top: none;
    border-left: none;
    border-right: none;
}
.nav.nav-tabs.style2 .nav-link.active{
	border-bottom: none;
}

.panel .nav-pills > li.active  {
    border-bottom: 2px solid #337ab7;
}
.panel .nav-pills .nav-item.active a{
    color: #337ab7;
    background-color: white;
    border-radius: 0.5rem 0.5rem 0 0;
    font-weight: 600
}


.panel .tab-content {
    padding: 15px;
   
}

.panel .nav > li > a:hover, 
.panel .nav > li > a:focus {
    text-decoration: none;
    background-color: transparent;
    color: #337ab7;
}


/* accordian within a panel */


.panel .accordion .card:first-of-type {
     border-bottom: 0;
     border-bottom-right-radius: 0;
     border-bottom-left-radius: 0
 }

.panel  .accordion .card {
     margin-bottom: .75rem;
     box-shadow: 0px 1px 15px 1px rgba(230, 234, 236, 0.35);
	 padding:0;
     border: none
 }

.panel  .accordion .card .card-header {
     background-color: transparent;
     border: none;
     padding: 2rem
 }




 .panel .accordion .card .card-header a {
     display: block;
     text-decoration: none;     
     position: relative;
     -webkit-transition: color 0.5s ease;
     -moz-transition: color 0.5s ease;
     -ms-transition: color 0.5s ease;
     -o-transition: color 0.5s ease;
     transition: color 0.5s ease;
     padding-right: 1.5rem
 }


 .panel .accordion .card .card-header a[aria-expanded="false"]:before {
     content: "\f067"
 }

 .panel .accordion .card .card-header a[aria-expanded="true"]:before {
     content: "\f068"
 }

 .panel .accordion .card .card-header a:before {
     position: absolute;
     right: 7px;
     top: 0;    
     display: block;
     font-family: FontAwesome;
     display: inline-block;
     padding-right: 3px;
     vertical-align: middle;    
     color: #405189
 }
 
 

form .input-group {
	margin: 5px 0;
}

form .input-group {
	margin: 5px 0;
}

.form-group.required .control-label:after { 
   content:"*";
   color:red;
}

.form-inline .form-control {
 display: inline-block;
 width: 200px;
 vertical-align: middle;
 padding: 6px 12px;
 border: 0.4px solid #ccc
}
.form-control-file, .form-control-range {
    display: block;
    width: 200px;
    vertical-align: middle;
    padding: 6px 12px;
    border: 0.4px solid #ccc;
}.badge
.form-control:focus {    
    box-shadow: 0 0 0 0.5px rgb(0 123 255 / 25%);
}


select.form-control{
	padding-left: 5px !important;
}

.form-signin {
	max-width: 280px;
	padding: 15px;
	margin: 0 auto;
	margin-top: 50px;
}

.form-signin .form-signin-heading, .form-signin {
	margin-bottom: 10px;
}

.form-signin .form-control {
	position: relative;
	font-size: 16px;
	height: auto;
	padding: 10px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.form-signin .form-control:focus {
	z-index: 2;
}

.form-signin input[type="text"] {
	margin-bottom: -1px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: solid;
	border-color: #000;
}

.form-signin input[type="password"] {
	margin-bottom: 10px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-color: rgb(0, 0, 0);
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.form-signin-heading {
	color: #fff;
	text-align: center;
	text-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
}

.formated-text {
    height: 200px;
    overflow: scroll;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
}
.formated-text-editor{
	width: 95%;
    float: left;
}

.medium-editor-placeholder:after {    
    margin: 0 0 0 10px !important;
}
.medium-editor-insert-plugin .medium-insert-buttons .medium-insert-buttons-show {
    margin-top: 40px;
}    

/* dropzone : file styling*/
.dropzone{
	border: 2px dashed #0087F7;
    border-radius: 5px;
    background: white;
}
.file-box-with-delete{
	padding: 5px 10px;
    min-width: 300px;
    min-height: 30px;
    background-color: #ffff;
    vertical-align: middle;
	line-height: 30px;  
}
/* dropzone : image styling*/
.dropzone {
    width: 200px !important;
    /* min-height: 150px; */
    border: 1px dashed #ddd !important;
    background: white;
    padding: 0px 0px !important;
}
.show-image-box img{
	width: 200px;   
   /*  border: 1px ridge #ddd; */
}

.image-box-with-delete-image{
	position: relative;
}
.show-image-box .dz-remove{
	position: absolute;
    top: 3px;
    left: 180px;
    color: #ddd
}
.dropzone .dz-message {
    text-align: center;
    margin: 3em !important;    
}

.dropzone .dz-preview .dz-remove{display:none;}

.dropzone .dz-preview .dz-image{
	
	
}
.dropzone .dz-filename, .dropzone .dz-progress{display:none;}


.show-image-box .dz-remove:hover { 
  color: red;
}

/* Thin Blue Progress Bar */
.dropzone .dz-preview .dz-progress {
    left: 0;
    right: 0;
    margin: 0;
    top: -3px; /* Adjusted to sit closer to the top */
    height: 2px; /* Made thinner */
    border-radius: 2px;
    width: 100%;
    display: block;
    background: rgba(0, 135, 247, 0.2); /* Light blue background */
    position: absolute;
}

/* Progress Fill (Moving Part) */
.dropzone .dz-preview .dz-progress .dz-upload {
    background: #0087F7 !important; /* Solid blue for progress */
    height: 100%;
    border-radius: 2px;
}
 

.dropzone.dz-clickable>i {    
  display: none !important;
}
.dropzone.dz-clickable {  
  color: transparent;
}
.dropzone.dz-clickable span p {  
	color: #666;
}


table ,table.dataTable{
	border-collapse: collapse !important;
}
table .form-control {
	border: 0px solid #ccc;
}

table.dataTable tbody th, table.dataTable tbody td {
	padding: 4px 6px;
}

.buttonSeperator{
	margin-right: 10px;
}

/* Sign In page style end */
.buttonbar-top {
	padding: 15px 15px;

}
.buttonbar-top a, .buttonbar-top div {
    display: inline;
    margin: 15px 0;
}
.paddingTopBottom {
	padding: 20px 0 20px 0;
}

.paddingTop{
	padding-top: 15px; 
}
.paddingBottom{
	padding-bottom: 15px; 
}
.marginTop{
	margin-top: 15px; 
}
.marginBottom{
	margin-bottom: 15px; 
}
.marginTopBottom {
	margin: 20px 0 20px 0;
}

.ui-autocomplete {
	max-height: 100px;
	overflow-y: auto;
	/* prevent horizontal scrollbar */
	overflow-x: hidden;
	background-color: #fff;
	list-style: none;
}
/* IE 6 doesn't support max-height
 * we use height instead, but this forces the menu to always be this tall
 */
html .ui-autocomplete {
	height: 100px;
}

.message{
    padding: 10px 0 0 15px;
    color:#3c763d;
}

.login-form .card{
	height:25em;	
}


/*datatables css start*/
.dataTables_filter{
	position: relative;
    top: 5px;
}

table.dataTable tbody th, table.dataTable tbody td {
    padding: 5px 10px;
}

table.dataTable thead th, table.dataTable thead td {
    padding: 10px 18px;
    border-bottom: 1px solid #20a8d8 !important;
}
table.dataTable.no-footer {
    border-bottom: 1px solid #20a8d8 !important; 
}
.table-bordered {
    border: 0px solid #ddd !important;
}
.table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
    border: 0.1px solid #eee;
}

.table-section{
	margin: 40px 10px;
    padding: 0px 0px;
    background: #fff;
}

.table-section .panel-heading{
	margin-top:0px;
}

.table-section .table-section-head{
	/* background: rgb(153,204,255);
    background: linear-gradient(90deg, rgba(153,204,255,1) 0%, rgba(230,242,255,1) 35%); */
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #f7fbff ;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
 .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
	
	border: 1px solid #a6def2 !important;
	background: #f7fbff !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover{
	background: #cce6ff !important; 
	border: 1px solid #a6def2 !important;
}
table.dataTable thead th{
	background: #cce6ff;
}
.dataTables_wrapper .dataTables_filter input {
    
    border: 0.4px solid #ccc;
}
.dataTables_wrapper .paginate_input{width: 4em;}
/*datatables css end*/

/*code for toggle button in laneDevice page*/
.onoffswitch4-checkbox:checked+.onoffswitch4-label .onoffswitch4-inner {
	margin-left: 0;
}

.onoffswitch4-checkbox:checked+.onoffswitch4-label .onoffswitch4-switch
	{
	right: 0px;
}

.cmn-toggle {
	position: absolute;
	margin-left: -9999px;
	visibility: hidden;
}

.cmn-toggle+label {
	display: block;
	position: relative;
	cursor: pointer;
	outline: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

input.cmn-toggle-round-flat+label {
	padding: 2px;
	width: 75px;
	height: 30px;
	background-color: #dddddd;
	-webkit-border-radius: 60px;
	-moz-border-radius: 60px;
	-ms-border-radius: 60px;
	-o-border-radius: 60px;
	border-radius: 60px;
	-webkit-transition: background 0.4s;
	-moz-transition: background 0.4s;
	-o-transition: background 0.4s;
	transition: background 0.4s;
}

input.cmn-toggle-round-flat+label:before, input.cmn-toggle-round-flat+label:after
	{
	display: block;
	position: absolute;
	content: "";
}

input.cmn-toggle-round-flat+label:before {
	top: 2px;
	left: 2px;
	bottom: 2px;
	right: 2px;
	background-color: #fff;
	-webkit-border-radius: 60px;
	-moz-border-radius: 60px;
	-ms-border-radius: 60px;
	-o-border-radius: 60px;
	border-radius: 60px;
	-webkit-transition: background 0.4s;
	-moz-transition: background 0.4s;
	-o-transition: background 0.4s;
	transition: background 0.4s;
}

input.cmn-toggle-round-flat+label:after {
	top: 4px;
	left: 4px;
	bottom: 4px;
	width: 22px;
	background-color: #dddddd;
	-webkit-border-radius: 52px;
	-moz-border-radius: 52px;
	-ms-border-radius: 52px;
	-o-border-radius: 52px;
	border-radius: 52px;
	-webkit-transition: margin 0.4s, background 0.4s;
	-moz-transition: margin 0.4s, background 0.4s;
	-o-transition: margin 0.4s, background 0.4s;
	transition: margin 0.4s, background 0.4s;
}

input.cmn-toggle-round-flat:checked+label {
	background-color: #466BB0;
}

input.cmn-toggle-round-flat:checked+label:after {
	margin-left: 45px;
	background-color: #466BB0;
}
/* end toggle button*/

.site-stats {
    
    text-align: left; 
    
}


@media (min-width: 1200px){
	.row {
    	margin-left: -15px;
	}		
}
@media (min-width: 970px){
	#sidebar > a {
    	display: none !important;
	}	
}


.btn-margin{
	margin:0px 2px;	
}


input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"] {
    line-height: 18px;
}

.ui-widget-header {
    color: #fff;
    background: none;
    background-color: #337ab7;
    border-color: #2e6da4;
}


/*added by jyoti for customer fb button : start*/

.loginBtn {
  box-sizing: border-box;
  position: relative;
  /* width: 13em;  - apply for fixed size */
  margin: 0.2em;
  padding: 0 15px 0 46px;
  border: none;
  text-align: left;
  line-height: 34px;
  white-space: nowrap;
  border-radius: 0.2em;
  font-size: 16px;
  color: #FFF;
}
.loginBtn:before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  top: 0;
  left: 0;
  width: 34px;
  height: 100%;
}
.loginBtn:focus {
  outline: none;
}
.loginBtn:active {
  box-shadow: inset 0 0 0 32px rgba(0,0,0,0.1);
}


/* Facebook */
.loginBtn--facebook {
  background-color: #4C69BA;
  background-image: linear-gradient(#4C69BA, #3B55A0);
  /*font-family: "Helvetica neue", Helvetica Neue, Helvetica, Arial, sans-serif;*/
  text-shadow: 0 -1px 0 #354C8C;
}
.loginBtn--facebook:before {
  border-right: #364e92 1px solid;
  background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/14082/icon_facebook.png') 6px 6px no-repeat;
}
.loginBtn--facebook:hover,
.loginBtn--facebook:focus {
  background-color: #5B7BD5;
  background-image: linear-gradient(#5B7BD5, #4864B1);
}


/* Google */
.loginBtn--google {
  /*font-family: "Roboto", Roboto, arial, sans-serif;*/
  background: #DD4B39;
}
.loginBtn--google:before {
  border-right: #BB3F30 1px solid;
  background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/14082/icon_google.png') 6px 6px no-repeat;
}
.loginBtn--google:hover,
.loginBtn--google:focus {
  background: #E74B37;
}

/*added by jyoti for customer fb button : end*/
.stripe-2 {
  color: black;
  width: 50px;
  background: 
  
    repeating-linear-gradient(
      45deg,
      transparent,
      transparent 10px,
      #ccc 10px,
      #ccc 20px
    ),
    linear-gradient(
      to bottom,
      #eee,
      #999
    );
}


.site-stats li {
	cursor: pointer; display:inline-block;
	margin: 0px 5px 10px 0px; text-align:center; width:47%;
	padding:30.5px 0; color:#fff;
	position: relative;
}
.widget-box{	
	background-color: #ffffff;
    border: 1px solid rgba(0, 34, 51, 0.1);
    box-shadow: 2px 4px 10px 0 rgba(0, 34, 51, 0.05), 2px 4px 10px 0 rgba(0, 34, 51, 0.05);
    border-radius: 0.15rem;
}

.widget-content {
    padding: 15px;
    border-bottom: 1px solid #cdcdcd;
    background-color: #fff;
}
.widget-desc {
    min-height: 100px;
}

/*added by anand: global loading on submit*/
body.wait *, body.wait
{
    cursor: progress !important;
}

ul 
      
      
        ul li a:hover {
	background: #425B90;
	text-decoration: none;
	cursor: pointer;
}

#noti_Container {
	position: relative;
}

/* THE NOTIFICAIONS WINDOW. THIS REMAINS HIDDEN WHEN THE PAGE LOADS. */
#notifications {
	width: 350px;
	/*         width: 100%;
    height: 100%; */
	position: fixed;
	bottom: 0px;
	/*  left:300px; */
	right: 0%;
	background: #FFF;
	border: solid 1px rgba(100, 100, 100, .20);
	-webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, .20);
	z-index: 0;
	/* overflow:auto; */
}
#notifications .card{
	background-color:#ddd;
	box-shadow: 2px 4px 10px 0 rgba(0, 34, 51, 0.05), 2px 4px 10px 0 rgba(0, 34, 51, 0.05);
    border-radius: 0.15rem;
    margin-bottom:10px;
}
#notifications .card.INFO{
	background-color:#e6f7ff;
	border-left:2px solid #19b5fe;
}
#notifications .card.WARNING{
	background-color:#fff7e6;
	border-left:2px solid #ffb61e;
}
#notifications .card.ERROR{
	background-color:#ffe6e7;
	border-left:2px solid #ff1a29;
}
#notifications .card.REQUIREACTION{
	background-color:#ffffff;
	border-left:2px solid #F22613;
}

#notifications .card .card-body{
	padding:10px;
}

#notifications .curser-remove{
	position: relative;
    top: -20px;
}

.badge{color:#777;font-weight: bold;}

.badge.badge-primary{background-color:#F22613;}
.badge.badge-danger{background-color:#ff1a29;}
.badge.badge-warning{background-color:#ffb61e;}
.badge.badge-success{background-color:#19b5fe;}

._fyy {
	background-color: #27a9e3;
	border-bottom: 1px solid #dddfe2;
	color: #ffffff;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 11px;
	font-weight: 500;
	padding: 5px 12px;
}
/* 
.seeMore {
	background-color: #FFF;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
	border-top: 1px solid #dddfe2;
	display: block;
	font-weight: 600;
	padding: 8px 12px;
	position: relative;
	text-align: center;
	z-index: 100;
} */

a {
	color: #365899;
	cursor: pointer;
	text-decoration: none;
}

.not-ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
	overflow:auto;
}

#notiList {
	overflow: auto;
}

.not-ul li {
	padding: 45px 3px;
	padding-top:10px;
	border-bottom: 1px solid #ddd
}

.not-ul li:hover {
	color: #365899 !important;
	background-color: #e4e5e6 !important
}

.not-bar-item {
	padding: 0px 1px;
	float: left;
	width: auto;
	border: none;
	display: block;
	outline: 0
}

.not-right {
	float: right !important
}

.arrow-down{
	float: right !important;
	 width: 10%;
  padding: 12px;
 
  color: black;
  font-size: 20px;
  box-sizing: border-box;
}

#icon-stat{
  float: left !important;
 
 
}

.not-button:hover {
	color: #365899 !important;
	background-color: #ccc !important
}

.not-xlarge {
	font-size: 24px !important
}

.not-large {
	/* font-size: 15px !important */
padding-left: 50px
}

/* qjuery rules styling : start*/
.rules-group-container .group-actions>button {
    margin-left: 10px !important;
}

.rules-group-container .group-conditions>label {
   margin-right: 10px;
   background: #aaa;
    color: #333;
}

.rules-group-container .group-conditions>label.active {
   
     color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
}
.rules-group-container .group-conditions>label:hover {
color: #fff;
    background-color: #286090;
    border-color: #204d74;
}
.query-builder .rule-value-container input[type=number], .query-builder .rule-value-container input[type=text], .query-builder .rule-value-container select {
    padding: 6px 12px !important;
}

/* qjuery rules styling : end*/




/*POS STYLING : START*/

.multiply-x {
	margin-left: 12px;
	margin-right: -12px;
}

.quantityMyInput {
	width: 62px;
	padding-left: 25px;
	margin-top: -31px;
	margin-left: -3px;
	background-color: #ffffff !important;
}

.minusQty {
	margin-top: -6px;
	cursor: pointer;
	font-size: 29px;
}

.plusQty {
	margin-top: -31px;
	margin-left: 46px;
	cursor: pointer;
	font-size: 20px;
}

/*POS STYLING : END*/


select.ui-datepicker-month ,select.ui-datepicker-year{
	color:#777;
}
span.ui-datepicker-month ,span.ui-datepicker-year{
	color:#fff;
}
#ui-datepicker-div{z-index:200005 !important;}

/*CUSTOM SCROLLBAR : START*/
::-webkit-scrollbar {
    width: 3px;
}

::-webkit-scrollbar-track {
    /*-webkit-box-shadow: inset 0 0 6px rgba(255,255,255,0.3);*/ 
    border-radius: 0px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    /*-webkit-box-shadow: inset 0 0 6px rgba(32,168,216,0.5);*/ 
    background-color:#c1c1c1; /*#20a8d8;*/
}

/*CUSTOM SCROLLBAR : END*/

/*DYNACMIC ATTRIBUTE : Customer*/
#dynamicElementsDiv .dynamic-element {
    /* display: inline-block; */
    width: 200px;
}
#dynamicElementsDiv .help-text {
    padding-top: 7px;
    padding-left: 15px;
    display: block;
}
#dynamicElementsDiv .data-type-hint{
   /*display:none; *//* if this line is disabled then form is distorted*/
}
#dynamicElementsDiv .form-group{  margin-bottom: 0rem  !important;}

#lucky-draw-join #dynamicElementsDiv .form-group{  margin-bottom: 1rem  !important;}
#lucky-draw-join #dynamicElementsDiv>div>* {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

/* button toggle start */
.btn-toggle {
    top: 50%;
    transform: translateY(-50%);
  }
  
 .btn-toggle {
  margin: 0 4rem;
  padding: 0;
  position: relative;
  border: none;
  height: 1.5rem;
  width: 3rem;
  border-radius: 1.5rem;
  color: #6b7381;
  background: #bdc1c8;
}
.btn-toggle:focus,
.btn-toggle.focus,
.btn-toggle:focus.active,
.btn-toggle.focus.active {
  outline: none;
}
.btn-toggle:before,
.btn-toggle:after {
  line-height: 1.5rem;
  width: 4rem;
  text-align: center;
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: absolute;
  bottom: 0;
  transition: opacity 0.25s;
}
.btn-toggle:before {
  content: "Off";
  left: -4rem;
}
.btn-toggle:after {
  content: "On";
  right: -4rem;
  opacity: 0.5;
}
.btn-toggle > .handle {
  position: absolute;
  top: 0.1875rem;
  left: 0.1875rem;
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 1.125rem;
  background: #fff;
  transition: left 0.25s;
}
.btn-toggle.active {
  transition: background-color 0.25s;
}
.btn-toggle.active > .handle {
  left: 1.6875rem;
  transition: left 0.25s;
}
.btn-toggle.active:before {
  opacity: 0.5;
}
.btn-toggle.active:after {
  opacity: 1;
}
.btn-toggle.btn-sm:before,
.btn-toggle.btn-sm:after {
  line-height: -0.5rem;
  color: #fff;
  letter-spacing: 0.75px;
  left: 0.4125rem;
  width: 2.325rem;
}
.btn-toggle.btn-sm:before {
  text-align: right;
}
.btn-toggle.btn-sm:after {
  text-align: left;
  opacity: 0;
}
.btn-toggle.btn-sm.active:before {
  opacity: 0;
}
.btn-toggle.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-xs:before,
.btn-toggle.btn-xs:after {
  display: none;
}
.btn-toggle:before,
.btn-toggle:after {
  color: #6b7381;
}
.btn-toggle.active {
  background-color: #29b5a8;
}
.btn-toggle.btn-lg {
  margin: 0 5rem;
  padding: 0;
  position: relative;
  border: none;
  height: 2.5rem;
  width: 5rem;
  border-radius: 2.5rem;
}
.btn-toggle.btn-lg:focus,
.btn-toggle.btn-lg.focus,
.btn-toggle.btn-lg:focus.active,
.btn-toggle.btn-lg.focus.active {
  outline: none;
}
.btn-toggle.btn-lg:before,
.btn-toggle.btn-lg:after {
  line-height: 2.5rem;
  width: 5rem;
  text-align: center;
  font-weight: 600;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: absolute;
  bottom: 0;
  transition: opacity 0.25s;
}
.btn-toggle.btn-lg:before {
  content: "Off";
  left: -5rem;
}
.btn-toggle.btn-lg:after {
  content: "On";
  right: -5rem;
  opacity: 0.5;
}
.btn-toggle.btn-lg > .handle {
  position: absolute;
  top: 0.3125rem;
  left: 0.3125rem;
  width: 1.875rem;
  height: 1.875rem;
  border-radius: 1.875rem;
  background: #fff;
  transition: left 0.25s;
}
.btn-toggle.btn-lg.active {
  transition: background-color 0.25s;
}
.btn-toggle.btn-lg.active > .handle {
  left: 2.8125rem;
  transition: left 0.25s;
}
.btn-toggle.btn-lg.active:before {
  opacity: 0.5;
}
.btn-toggle.btn-lg.active:after {
  opacity: 1;
}
.btn-toggle.btn-lg.btn-sm:before,
.btn-toggle.btn-lg.btn-sm:after {
  line-height: 0.5rem;
  color: #fff;
  letter-spacing: 0.75px;
  left: 0.6875rem;
  width: 3.875rem;
}
.btn-toggle.btn-lg.btn-sm:before {
  text-align: right;
}
.btn-toggle.btn-lg.btn-sm:after {
  text-align: left;
  opacity: 0;
}
.btn-toggle.btn-lg.btn-sm.active:before {
  opacity: 0;
}
.btn-toggle.btn-lg.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-lg.btn-xs:before,
.btn-toggle.btn-lg.btn-xs:after {
  display: none;
}
.btn-toggle.btn-sm {
  margin: 0 0.5rem;
  padding: 0;
  position: relative;
  border: none;
  height: 1.5rem;
  width: 3rem;
  border-radius: 1.5rem;
}
.btn-toggle.btn-sm:focus,
.btn-toggle.btn-sm.focus,
.btn-toggle.btn-sm:focus.active,
.btn-toggle.btn-sm.focus.active {
  outline: none;
}
.btn-toggle.btn-sm:before,
.btn-toggle.btn-sm:after {
  line-height: 1.5rem;
  width: 0.5rem;
  text-align: center;
  font-weight: 600;
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: absolute;
  bottom: 0;
  transition: opacity 0.25s;
}
.btn-toggle.btn-sm:before {
  content: "Off";
  left: -0.5rem;
}
.btn-toggle.btn-sm:after {
  content: "On";
  right: -0.5rem;
  opacity: 0.5;
}
.btn-toggle.btn-sm > .handle {
  position: absolute;
  top: 0.1875rem;
  left: 0.1875rem;
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 1.125rem;
  background: #fff;
  transition: left 0.25s;
}
.btn-toggle.btn-sm.active {
  transition: background-color 0.25s;
}
.btn-toggle.btn-sm.active > .handle {
  left: 1.6875rem;
  transition: left 0.25s;
}
.btn-toggle.btn-sm.active:before {
  opacity: 0.5;
}
.btn-toggle.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-sm.btn-sm:before,
.btn-toggle.btn-sm.btn-sm:after {
  line-height: -0.5rem;
  color: #fff;
  letter-spacing: 0.75px;
  left: 0.4125rem;
  width: 2.325rem;
}
.btn-toggle.btn-sm.btn-sm:before {
  text-align: right;
}
.btn-toggle.btn-sm.btn-sm:after {
  text-align: left;
  opacity: 0;
}
.btn-toggle.btn-sm.btn-sm.active:before {
  opacity: 0;
}
.btn-toggle.btn-sm.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-sm.btn-xs:before,
.btn-toggle.btn-sm.btn-xs:after {
  display: none;
}
.btn-toggle.btn-xs {
  margin: 0 0;
  padding: 0;
  position: relative;
  border: none;
  height: 1rem;
  width: 2rem;
  border-radius: 1rem;
}
.btn-toggle.btn-xs:focus,
.btn-toggle.btn-xs.focus,
.btn-toggle.btn-xs:focus.active,
.btn-toggle.btn-xs.focus.active {
  outline: none;
}
.btn-toggle.btn-xs:before,
.btn-toggle.btn-xs:after {
  line-height: 1rem;
  width: 0;
  text-align: center;
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  position: absolute;
  bottom: 0;
  transition: opacity 0.25s;
}
.btn-toggle.btn-xs:before {
  content: "Off";
  left: 0;
}
.btn-toggle.btn-xs:after {
  content: "On";
  right: 0;
  opacity: 0.5;
}
.btn-toggle.btn-xs > .handle {
  position: absolute;
  top: 0.125rem;
  left: 0.125rem;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 0.75rem;
  background: #fff;
  transition: left 0.25s;
}
.btn-toggle.btn-xs.active {
  transition: background-color 0.25s;
}
.btn-toggle.btn-xs.active > .handle {
  left: 1.125rem;
  transition: left 0.25s;
}
.btn-toggle.btn-xs.active:before {
  opacity: 0.5;
}
.btn-toggle.btn-xs.active:after {
  opacity: 1;
}
.btn-toggle.btn-xs.btn-sm:before,
.btn-toggle.btn-xs.btn-sm:after {
  line-height: -1rem;
  color: #fff;
  letter-spacing: 0.75px;
  left: 0.275rem;
  width: 1.55rem;
}
.btn-toggle.btn-xs.btn-sm:before {
  text-align: right;
}
.btn-toggle.btn-xs.btn-sm:after {
  text-align: left;
  opacity: 0;
}
.btn-toggle.btn-xs.btn-sm.active:before {
  opacity: 0;
}
.btn-toggle.btn-xs.btn-sm.active:after {
  opacity: 1;
}
.btn-toggle.btn-xs.btn-xs:before,
.btn-toggle.btn-xs.btn-xs:after {
  display: none;
}
.btn-toggle.btn-secondary {
  color: #6b7381;
  background: #bdc1c8;
}
.btn-toggle.btn-secondary:before,
.btn-toggle.btn-secondary:after {
  color: #6b7381;
}
.btn-toggle.btn-secondary.active {
  background-color: #ff8300;
}

/* button toggle end */


/* colors */
/* colour background where text is white */
.bg_gd {
	/* background: #348aa7; */
	background: #b6e8f9;
}

.bg_gl {
	/* background: #3ec4d6; */
	background: #ebf4ff;
}

.bg_bl {
	/* background: #779be7; */
	background: #f5fdf1;
}

.bg_bd {
	/* background: #2255a4; */
	background: #fff0ea;
}

.bg_rl {
	/* background: #ff3366; */
	background: #ebf0fd;
}
.bg_rd {
	/* background: #ca1551; */
	background: #eadefd;
}






.border_gd {
	/* border: 1px solid #348aa7 !important; */
	background: #fff;
	color: #666;
}

.border_gl {
	/* border: 1px solid #3ec4d6 !important; */
	background: #fff;
	color: #666;
}

.border_bl {
	/* border: 1px solid #779be7 !important; */
	background: #fff;
	color: #666;
}

.border_bd {
	/* border: 1px solid #2255a4 !important; */
	background: #fff;
	color: #666;
}

.border_rl {
	/* border: 1px solid #ff3366 !important; */
	background: #fff;
	color: #666;
}
.border_rd {
	/* border: 1px solid #ca1551 !important; */
	background: #fff;
	color: #666;
}

.shadow {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
}

/************* dashboards css ***************/
.notify-badge-count {
	position: absolute;
    right: 0px;
    top: -10px;
	background: #ff6666;
	text-align: center;
	border-radius: 30px 30px 30px 30px;
	color: white;
	padding: 5px 10px;
	font-size: 1em;
}
.notify-group-count {
	position: relative;
    right: 15px;
    top: -10px;

	background: #ff6666;
	text-align: center;
	/* border-radius: 30px 30px 30px 30px; */
	color: white;
    padding: 5px 8px;
    font-size: 16px;
}

/*.card {
	border: 0;
	box-shadow: 0 0 2rem 0 rgba(174, 169, 169, .4);
	text-align: center;
	margin: 0px 15px 10px 15px;
	padding: 10px 10px;
}*/
.bg_gd,.bg_gl,.bg_bl,.bg_bd,.bg_rl,.bg_rd,.border_gd,.border_gl,.border_bl,.border_bd,.border_rl,.border_rd{
	border: 0;
	box-shadow: 0 0 2rem 0 rgba(174, 169, 169, .4);
	text-align: center;
	margin: 0px 15px 10px 15px;
	padding: 10px 10px;
}

.bg_gd .info,
.bg_gl .info,
.bg_bl .info,
.bg_bd .info,
.bg_rl .info,
.bg_rd .info{
	font-size: 30px;
	color: #666;
	font-weight: bold;
}

.info-title {
	font-weight: 500 !important;
	font-size: 35px;
	margin-top: 0px;
}

.nav-tabs {
	padding-top: 3px;
}

/* .bg_t {
	border: 1px solid #f7db9d;
} */

.border_gd .info,
.border_gl .info,
.border_bl .info,
.border_bd .info,
.border_rl .info,
.border_rd .info {
	font-size: 30px;
	color: #666;
}

.csegment {
	padding: 12px 10px;
}
.cardlp {
	border: 0;
	box-shadow: 0 0 2rem 0 rgba(174, 169, 169, .4);
	text-align: center;
	margin: 0px 15px 10px 15px;
	padding: 10px 10px;
	width: 270px;
}

.lineCard {
	box-shadow: 0 0 2rem 0 rgba(174, 169, 169, .4);
}
.cover {
    display: block;
    width: 100%;
    height: 250px;
    margin-bottom:10px;
    border-radius:8px;
    background-color: #f1f1f1;
    background-image: url("../css/images/cover-placeholder.jpg");
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

/******* onoffswitch in discount popup ********/
.scrollable-panel {
	height: 350px;
	overflow-y: scroll;
	width: 100%;
}
.onoffswitch {
	position: relative;
	width: 90px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

.onoffswitch-checkbox {
	display: none;
}

.onoffswitch-label {
	display: block;
	overflow: hidden;
	cursor: pointer;
	border: 2px solid #999999;
	border-radius: 20px;
}

.onoffswitch-inner {
	display: block;
	width: 200%;
	margin-left: -100%;
	transition: margin 0.3s ease-in 0s;
}

.onoffswitch-inner:before, .onoffswitch-inner:after {
	display: block;
	float: left;
	width: 50%;
	height: 30px;
	padding: 0;
	line-height: 30px;
	font-size: 14px;
	color: white;
	font-family: Trebuchet, Arial, sans-serif;
	font-weight: bold;
	box-sizing: border-box;
}

.onoffswitch-inner:before {
	content: "%";
	padding-left: 10px;
	background-color: #34A7C1;
	color: #FFFFFF;
}

.onoffswitch-switch {
	display: block;
	width: 18px;
	margin: 6px;
	background: #FFFFFF;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 56px;
	border: 2px solid #999999;
	border-radius: 20px;
	transition: all 0.3s ease-in 0s;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner {
	margin-left: 0;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch {
	right: 0px;
}

.medium-insert-images img {
    max-width: 100%;
}

/*
Glyphicons
*/
.glyphicon {
   display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.glyphicon-trash:before {
  content: "\f1f8";
}
.glyphicon-edit:before {
  content: "\f044";
}
.glyphicon-pencil:before {
  content: "\f040";
}
.glyphicon-info-sign:before {
  content: "\f05a";
}
.glyphicon-remove:before {
  content: "\e014";
}
.glyphicon-refresh:before {
  content: "\e031"";
}
.glyphicon-check:before{
  content: "\f00c";
}

.glyphicon-chevron-up:before{
	content: "\f077";
}	
.glyphicon-chevron-down:before{
	content: "\f078";
}
.glyphicon-file:before{
	content: "\f15b";
}
.glyphicon-star:before{
	content: "\f005";
}
.glyphicon-star-empty:before{
	content: "\f006";
}

.glyphicon-plus-sign:before{
	content: "\2b";
}
.glyphicon-plus:before{
	content: "\2b";
}
.glyphicon-remove:before{
	content: "\F00D";
}

.btn-xs {
	padding: 0.1rem 0.45rem;
}
/*
 issue withoutleftmenu design with box css
*/
.mySlides {
	width : 115px;
	height: 100px;
	border-radius: 20px;
	padding: 5px;
}


.campaignDiv {
	background-color: #fff;
	width: 100%;
	/* max-height: 300px;
    overflow: auto; */
	min-height: 300px;
	/*  padding: 10px; */
}


.panel-heading-custom {
	padding: 10px 15px;
	background-color: #fff;
	border-color: #fff;
	box-shadow: none;
}

.campaignDiv input[type=radio] {
	display: none;
}

.campaignDiv input[type=radio]:checked+label .mySlides {
	box-shadow: none;
	height: 100px;
	border: 1px solid #ddd;
	border-radius: 20px;
	padding: 5px;
	
}
.campaignDiv input[type=checkbox] {
	display: none;
}

.campaignDiv input[type=checkbox]:checked+label .mySlides {
	box-shadow: none;
	height: 100px;
	border: 1px solid #ddd;
	border-radius: 20px;
	padding: 5px;
}
/********* new style **********/
.campaignDiv ul {
	list-style-type: none;
}

.campaignDiv li {
	display: inline-block;
}

.campaignDiv input[type="checkbox"] {
	display: none;
}
.campaignDiv input[type="radio"] {
	display: none;
}

.campaignDiv label {
	border: 1px solid #fff;
	padding: 10px;
	display: block;
	position: relative;
	/* margin: 5px; */
	cursor: pointer;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.campaignDiv label::before {
	background-color: white;
	color: white;
	content: " ";
	display: block;
	border-radius: 50%;
	border: 1px solid grey;
	position: absolute;
	top: -5px;
	left: -5px;
	width: 25px;
	height: 25px;
	text-align: center;
	line-height: 28px;
	transition-duration: 0.4s;
	transform: scale(0);
}

.campaignDiv label img {
	height: 100px;
	width: 100px;
	transition-duration: 0.2s;
	transform-origin: 50% 50%;
}

.campaignDiv :checked+label {
	border-color: green;
}

.campaignDiv :checked+label::before {
	content: "\2713";
	background-color: green;
	transform: scale(1);
}

.campaignDiv :checked+label img {
	transform: scale(0.9);
	box-shadow: 0 0 5px #333;
	z-index: -1;
}


/* disabled button don't show' */

.btn-primary:disabled, .btn-secondary:disabled, .btn-success:disabled, .btn-danger:disabled, .btn-warning:disabled, .btn-info:disabled, .btn-light:disabled, .btn-dark:disabled{
	opacity: 0;
    width: 0;
    margin: 0;
    padding: 0;
}

.btn:disabled,.btn-primary:disabled, .btn-secondary:disabled, .btn-success:disabled, .btn-danger:disabled, .btn-warning:disabled, .btn-info:disabled, .btn-light:disabled, .btn-dark:disabled {padding: 0px !important; border: 0px solid transparent !important;}
	
/*custom checkbox styling*/
.form-check{padding-left:0}
.form-check input {
  visibility: hidden;
  display: block;
  height: 0;
  width: 0;
  position: absolute;
  overflow: hidden;
}

.form-check label {
  position: relative;
  cursor: pointer;
}

.form-check label:before {
  content:'';
  -webkit-appearance: none;
  background-color: white;
  border: 1px solid #ddd;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
  padding: 10px;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  cursor: pointer;
  margin-right: 5px;
}

.form-check input:checked + label:after {
    content: '\2713';
    position: absolute;
    top: 0;
    left: 5px;
    color: #666;
}

.custom-disable{
	    pointer-events: none;
	    background-color:#eee;
}

span.tooltip-r {
    font-size: 12px;   
}

/*image with zoom fucntionality. add class zoom*/
img.zoom {      
-webkit-transition: all 0.35s ease-in-out;    
-moz-transition: all 0.35s ease-in-out;    
transition: all 0.35s ease-in-out;     
cursor: -webkit-zoom-in;      
cursor: -moz-zoom-in;      
cursor: zoom-in;  
}     

img.zoom:hover,  
img.zoom:active,   
img.zoom:focus {
/**adjust scale to desired size, 
add browser prefixes**/
-ms-transform: scale(3.5);    
-moz-transform: scale(3.5);  
-webkit-transform: scale(3.5);  
-o-transform: scale(3.5);  
transform: scale(3.5);    
position:relative;      
z-index:100;  
}

div.serial-no-generator #prefix,div.serial-no-generator #postfix{width: 100px;}
div.serial-no-generator #from,div.serial-no-generator #to{width: 150px;}




/* animation keyframes*/
/*add to any item to float:  transform: translatey(0px); animation: float 6s ease-in-out infinite; */
@keyframes float {
	0% {
		/*box-shadow: 0 5px 2px 0px rgba(0,0,0,0.6);*/
		transform: translatey(0px);
	}
	50% {
		/*box-shadow: 0 15px 2px 0px rgba(0,0,0,0.2);*/
		transform: translatey(-10px);
	}
	100% {
		/*box-shadow: 0 5px 2px 0px rgba(0,0,0,0.6);*/
		transform: translatey(0px);
	}
}
/*add to any div to shake on hover:  div:hover { animation: shakeme 0.8s ease infinite;} */
@-webkit-keyframes shakeme {
				0% { transform: translate(2px, 1px) rotate(0deg); }
				10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
				20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
				30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
				40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
				50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
				60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
				70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
				80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
				90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
				100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
			}


/*add to any BUTTON for animation*/

@-webkit-keyframes push-on-hover {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes push-on-hover {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.push-on-hover {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.push-on-hover:hover, .push-on-hover:focus, .push-on-hover:active {
  -webkit-animation-name: push-on-hover;
  animation-name: push-on-hover;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}


/*tablet */
@media (max-width: 970px){
	#search{
	  display: none;	
	}
	#user-nav {
	    position: absolute !important;
	    right: 10px !important;
	
	}
	/*to allow focus on add button. without this add button not clickable on list page*/
	.table-responsive {
       margin-top: 60px;
    }
	table.dataTable .btn {margin: 5px !important; padding: 5px !important;}
}



/*mobile phone*/
@media only screen and (max-width: 480px) {

	#user-nav {
	 
	    width: 150px !important;
	    top: 1px !important;
	    right:0 !important;
	    left: unset !important;
	}
	#user-nav > ul {
	    
	    margin-left: 0%!important;	    
	    background: #000;
	    position: relative;
	}
	#header .brand img{
	    height: auto !important;  
	    max-width: 100px !important;
	    left: 15px !important;
	}
	
	#sidebar {
    	top: 0px;
	}
	
	#system-messages #notificationCount{display:none;}


	.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter {
	    display: flex !important;
	    float: left !important;
	    width: 45% !important;
	    text-align: center;
	}
	
	
	table.dataTable .btn {margin: 15px !important; padding: 10px !important;}
	.btn {padding: 10px !important;}
	.form-inline .form-control , .select2-container, .dropzone, .file-box-with-delete {   
	    width: 95% !important;   
	}
	.mobile-select-with-button .select2-container{width: calc(95% - 40px) !important; }
	.mobile-select-with-button .btn, .dropzone .btn {padding: 5px 15px !important;}
	.file-box-with-delete .btn {padding:3px 5px !important;}
	
	.buttonbar-top >* {
	    margin: 15px 0;
	}
	
	
	.form-inline .form-control, .select2-container, .dropzone, .file-box-with-delete {
	    width: 100% !important;
	}
	#ui-datepicker-div{
		left: 0 !important;   
	    width: 100%;
	}
	table.ui-datepicker-calendar td a {
	    padding: 15px;
	}
	.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
	    position: absolute;
	    top: 2px;
	    width: 45px;
	    height: 45px;
	}
	.ui-datepicker .ui-datepicker-header {
	    position: relative;
	    padding: 0.2em 0;
	    height: 45px;
	    font-size: 1.8em;
	    font-weight: normal;
	}

	#dynamicElementsDiv .form-inline, #dynamicElementsDiv label {    
    	padding: 0 !important;
	}
	
#dynamicElementsDiv input[type="radio"] {
    display: block;
}
}			
			
