@charset "UTF-8";

/*  || 00: Base For website ||  */
/*  ==========================  */
:root {
  /* Background colors */
  --body-bg-color: #eef1f5;
  --body-text: #121533;
  --color-light: #4D4D58;
  /* --brand-color: #00d092; */
  --brand-color: #2de5a7;

  /* Text Color */
  --heading-color: #000110;
  --body-text: #121533;
  --color-light: #4D4D58;
  --default-line-height: 1;

  /* Sidebar Colors */
  --sidebar-bg-color: #26344B;
  --sidebar-icon-color: #4d5d7c;
  --sidebar-text-color: #546e82;

  /* Color */
  --border-color: #e9e9e9;
  --action-color: #32c5d2;
  --error-color: #b94a48;

  /* Action Colors */
  --btn-blue-color: #09ABF3;
  --btn-success-color: #28a745;
  --btn-danger-color: #dc3545;

  /* portlet */
  --portlet-border-colo: #e4e8ec;
}



/* Open Sans Font Family */

/* OpenSans-Bold */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-Bold.woff  OpenSans-Bold.eot');
  src: url('../fonts/open-sans/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-Bold.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-Bold.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-Bold.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-Bold.svg#open_sansbold') format('svg');
  font-weight: 700;
  font-style: normal;
}
/* OpenSans-BoldItalic */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-BoldItalic.eot');
  src: url('../fonts/open-sans/OpenSans-BoldItalic.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-BoldItalic.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-BoldItalic.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-BoldItalic.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-BoldItalic.svg#open_sansbold_italic') format('svg');
  font-weight: 700;
  font-style: italic;
}
/* OpenSans-ExtraBold */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-ExtraBold.eot');
  src: url('../fonts/open-sans/OpenSans-ExtraBold.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-ExtraBold.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-ExtraBold.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-ExtraBold.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-ExtraBold.svg#open_sansextrabold') format('svg');
  font-weight: 800;
  font-style: normal;
}
/* OpenSans-ExtraBoldItalic */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-ExtraBoldItalic.eot');
  src: url('../fonts/open-sans/OpenSans-ExtraBoldItalic.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-ExtraBoldItalic.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-ExtraBoldItalic.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-ExtraBoldItalic.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-ExtraBoldItalic.svg#open_sansextrabold_italic') format('svg');
  font-weight: 800;
  font-style: italic;
}
/* OpenSans-Italic */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-Italic.eot');
  src: url('../fonts/open-sans/OpenSans-Italic.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-Italic.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-Italic.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-Italic.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-Italic.svg#open_sansitalic') format('svg');
  font-weight: normal;
  font-style: italic;
}
/* OpenSans-Light */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-Light.eot');
  src: url('../fonts/open-sans/OpenSans-Light.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-Light.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-Light.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-Light.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-Light.svg#open_sanslight') format('svg');
  font-weight: 300;
  font-style: normal;
}
/* OpenSans-LightItalic */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-LightItalic.eot');
  src: url('../fonts/open-sans/OpenSans-LightItalic.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-LightItalic.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-LightItalic.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-LightItalic.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-LightItalic.svg#open_sanslight_italic') format('svg');
  font-weight: 300;
  font-style: italic;
}
/* OpenSans-Regular */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-Regular.eot');
  src: url('../fonts/open-sans/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-Regular.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-Regular.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-Regular.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-Regular.svg#open_sansregular') format('svg');
  font-weight: 400;
  font-style: normal;
}
/* OpenSans-Semibold */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-Semibold.eot');
  src: url('../fonts/open-sans/OpenSans-Semibold.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-Semibold.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-Semibold.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-Semibold.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-Semibold.svg#open_sanssemibold') format('svg');
  font-weight: 600;
  font-style: normal;
}
/* OpenSans-SemiboldItalic */
@font-face {
  font-family: "Open Sans",sans-serif;
  src: url('../fonts/open-sans/OpenSans-SemiboldItalic.eot');
  src: url('../fonts/open-sans/OpenSans-SemiboldItalic.eot?#iefix') format('embedded-opentype'),
       url('../fonts/open-sans/OpenSans-SemiboldItalic.woff2') format('woff2'),
       url('../fonts/open-sans/OpenSans-SemiboldItalic.woff') format('woff'),
       url('../fonts/open-sans/OpenSans-SemiboldItalic.ttf') format('truetype'),
       url('../fonts/open-sans/OpenSans-SemiboldItalic.svg#open_sanssemibold_italic') format('svg');
  font-weight: 600;
  font-style: italic;

}




.page-container-bg-solid .page-content { background-color: var(--body-bg-color); }
.no-gutter { margin-right: 0; margin-left: 0;}
.no-gutter > [class*="col-"] { padding-right: 0; padding-left: 0; }

/* Box Layout styles */
.box-layout { width: 100%; width: 1140px; height: 600px; margin: 0 auto;
position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.box-layout > div { border-radius: 10px; border: 1px solid #F0F0F0; box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1); overflow: hidden; }
.box-info { background-image: url(../img/img_landing.png); height: 100%;position: relative;background-position: center;background-repeat: no-repeat;background-size: cover; text-align: center; padding: 50px; }
.box-info:before { content: ""; background: rgba(37, 194, 164, 0.85); position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
.box-info:after { content: ""; background: rgba(31, 110, 94, 0.50); position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
.box-info h2 { position: relative; z-index: 1; color: #fff; margin: 0; font-size: 34px; line-height: 44px; }
.box-info h2 strong { font-weight: 600; }
.box-info p { position: relative; z-index: 1; color: #fff; font-size: 16px; font-weight: 300; margin-left: 10px; margin-right: 10px; }
.table-layout { display: table; width: 100%; }
.table-cell { display: table-cell; }
.v-align-middle { vertical-align: middle; }
.full-height { height: 100% }
@media (max-width: 1200px) {
  .box-layout { width: 960px; }
}
@media (max-width: 992px) {
  .box-layout { width: 90%; max-width: 500px; height: auto; position: static; -webkit-transform: none; transform: none; margin-top: 20px; margin-bottom: 20px; }
  .login-content { padding: 50px 0; }
  .box-info { padding-top: 10px; padding-bottom: 10px; }
}


/*  || 01: Login Page ||  */
/*  ====================  */
/* .login{background:url(../img/login-bg_dark.jpg) no-repeat center center fixed;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover; position: relative;} */
.login .logo{margin:0px auto 10px auto;padding:15px;text-align:center;width:160px;height:auto}
.login .content { border: 1px solid #dfdfdf; width:360px;margin:0 auto;margin-bottom:0;padding:30px;padding-bottom:15px;-webkit-border-radius:7px;-moz-border-radius:7px;-ms-border-radius:7px;-o-border-radius:7px;border-radius:7px; position: relative; }
.login .content h3{color:#000}
.login .content h4{color:#555}
.login .content p{color:#222}
.login .content .forget-form,.login .content .login-form{padding:0;margin:0}
.login .content .login-form {  }
.login .content .input-icon > i{ margin: 16px 10px 14px 15px; }
.login .content .input-icon{border-left:2px solid var(--action-color) !important; -webkit-border-radius:6px;-moz-border-radius:6px;-ms-border-radius:6px;-o-border-radius:6px;border-radius:6px}
.login .content .input-icon > .form-control{border-left:0; height: 44px; padding-left: 44px; }
.login .content .forget-form{display:none}
.login .content .register-form{display:none}
.login .content .form-title{font-weight: 300; font-size: 20px; position: absolute; top: -13px; left: 20px; background: #fff; margin: 0; padding: 0 10px;}
.login .content .forget-form .form-actions{border:0;margin-bottom:0;padding-bottom:20px}
.login .content .register-form .form-actions{border:0;margin-bottom:0;padding-bottom:0}
.login .content .form-actions .rememberme{margin-top:8px;display:inline-block}
.login .content .form-actions .btn{margin-top:1px}
.login .content .forget-password{margin-top:25px}
.login .content .create-account{border-top:1px dotted #eee;padding-top:10px;margin-top:15px}
.login .content .create-account a{display:inline-block;margin-top:5px}
.login .content .select2-container{border-left:2px solid var(--brand-color) !important}
.login .content .select2-container .select2-choice{border-left:none!important}
.login .content .select2-container i{display:inline-block;position:relative;color:#ccc;z-index:1;top:1px;margin:4px 4px 0 -1px;width:16px;height:16px;font-size:16px;text-align:center}
.login .content .has-error .select2-container i{color:var(--error-color)}
.login .content .has-error .input-icon { border-color: var(--error-color)!important}
.login .content .select2-container a span{font-size:13px}
.login .content .select2-container a span img{margin-left:4px}
.login .content .form-actions { margin-bottom: 20px; }
.login .content .alert { margin-bottom: 10px; }
.login .copyright{text-align:center;margin:0 auto;padding:10px;color:#999;font-size:13px}
.login .login-form .alert .close { margin-top: 6px; }
.login .divider { margin-left: -30px; margin-right: -30px;}
.form-footer { text-align: center; background: rgba(37, 194, 164, 0.90); margin: 0px -30px -15px -30px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; padding: 10px; }
.form-footer > .btn { padding-left: 20px; padding-right: 20px; margin-left: 10px; }
@media (max-width:480px){
  .login .logo{margin-top:10px}
  .login .content{width:280px}
  .login .content h3{font-size:22px}
  .login .checkbox{font-size:13px}
}

/*  || 02: Page Sidebar ||  */
/*  ====================  */
.page-sidebar,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover { background-color: var(--sidebar-bg-color); }
.page-header.navbar .page-logo { background-color: rgb(243, 243, 243);border-right: 1px solid #eee; }
.page-header.navbar .page-logo .logo-default { width: 96px; margin-top: 16px; margin-left: 31px; }
.page-header.navbar .menu-toggler { background-image: url(../../layouts/img/sidebar-toggler.png); }
.page-sidebar .page-sidebar-menu>li.open>a,
.page-sidebar .page-sidebar-menu>li:hover>a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.open>a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li:hover>a,
.page-sidebar .page-sidebar-menu>li.active.open>a:hover,
.page-sidebar .page-sidebar-menu>li.active>a:hover { background-color: transparent; }
.page-sidebar .page-sidebar-menu>li.open>a>.arrow.open:before,
.page-sidebar .page-sidebar-menu>li.open>a>.arrow:before,
.page-sidebar .page-sidebar-menu>li.open>a>i,
.page-sidebar .page-sidebar-menu>li:hover>a>.arrow.open:before,
.page-sidebar .page-sidebar-menu>li:hover>a>.arrow:before,
.page-sidebar .page-sidebar-menu>li:hover>a>i,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.open>a>.arrow.open:before,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.open>a>.arrow:before,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.open>a>i,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li:hover>a>.arrow.open:before,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li:hover>a>.arrow:before,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li:hover>a>i { color: var(--brand-color) }
.page-sidebar .page-sidebar-menu>li.active.open>a>i,
.page-sidebar .page-sidebar-menu>li.active>a>i,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.active.open>a>i,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.active>a>i  { color: var(--brand-color) }
.page-sidebar .page-sidebar-menu>li.open>a,
.page-sidebar .page-sidebar-menu>li:hover>a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.open>a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li:hover>a  { color: var(--brand-color) }
.page-sidebar .page-sidebar-menu > li { border-bottom: 1px solid #2b3b55; }
.page-sidebar .page-sidebar-menu>li.start>a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.start>a { border-top-color: transparent!important }

.page-sidebar .page-sidebar-menu>li.active>a,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu>li.active>a { border-top: 1px solid #2b3b55; }
.page-header.navbar .page-top { box-shadow: 0 1px 0px 0 rgba(50,50,50,0.05); }
.page-header.navbar .top-menu .navbar-nav > li.dropdown-user .dropdown-menu > li > a { font-weight: 400; }

/*  || 03: Layout ||  */
/*  ================  */

/* Page Title */
.page-title-section .page-title { display: inline-block; }
.page-title-section .page-action { float: right; margin-top: -3px; }
.page-title-section .page-action i { margin-right: 5px; }
.portlet-title .actions .btn-group .btn+.btn { margin-left: 5px; }
.page-title-section .page-action .select2 { width: 170px;}
@media (max-width:480px){
  .page-title-section { margin-bottom: 20px; }
  .page-title-section .page-action { float: none; text-align: center }
}

.portlet-footer { padding: 15px 20px 15px; min-height: 48px; border-top: 1px solid #eee; }

/* Pagenations */
.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover { background-color: var(--action-color); border-color: var(--action-color); }

/* Buttons */
.btn.btn-outline.green { border-color: var(--action-color); color: var(--action-color);}
.btn.btn-outline.green.active,
.btn.btn-outline.green:active,
.btn.btn-outline.green:active:focus,
.btn.btn-outline.green:active:hover,
.btn.btn-outline.green:focus,
.btn.btn-outline.green:hover { border-color: var(--action-color); background-color: var(--action-color); color: #fff; }
.btn.green:not(.btn-outline),
.btn.green:not(.btn-outline).active,
.btn.green:not(.btn-outline):active,
.btn.green:not(.btn-outline):hover,
.open>.btn.green:not(.btn-outline).dropdown-toggle,
.btn.green:not(.btn-outline).focus,
.btn.green:not(.btn-outline):focus,
.btn.green:not(.btn-outline).active.focus,
.btn.green:not(.btn-outline).active:focus,
.btn.green:not(.btn-outline).active:hover,
.btn.green:not(.btn-outline):active.focus,
.btn.green:not(.btn-outline):active:focus,
.btn.green:not(.btn-outline):active:hover,
.open>.btn.green:not(.btn-outline).dropdown-toggle.focus,
.open>.btn.green:not(.btn-outline).dropdown-toggle:focus,
.open>.btn.green:not(.btn-outline).dropdown-toggle:hover { background-color: var(--action-color); border-color: var(--action-color); }

.btn.btn-outline.blue { border-color: var(--btn-blue-color); color: var(--btn-blue-color); }
.btn.btn-outline.blue.active,
.btn.btn-outline.blue:active,
.btn.btn-outline.blue:active:focus,
.btn.btn-outline.blue:active:hover,
.btn.btn-outline.blue:focus,
.btn.btn-outline.blue:hover { border-color: var(--btn-blue-color); background-color: var(--btn-blue-color); }

.btn-success,
.btn-success.active,
.btn-success:active,
.btn-success:hover,
.open>.btn-success.dropdown-toggle,
.btn-success.active.focus,
.btn-success.active:focus,
.btn-success.active:hover,
.btn-success:active.focus,
.btn-success:active:focus,
.btn-success:active:hover,
.open>.btn-success.dropdown-toggle.focus,
.open>.btn-success.dropdown-toggle:focus,
.open>.btn-success.dropdown-toggle:hover { border-color: var(--btn-success-color); background-color: var(--btn-success-color); }

.btn-danger,
.btn-danger.active,
.btn-danger:active,
.btn-danger:hover,
.open>.btn-danger.dropdown-toggle,
.btn-danger.active.focus,
.btn-danger.active:focus,
.btn-danger.active:hover,
.btn-danger:active.focus,
.btn-danger:active:focus,
.btn-danger:active:hover,
.open>.btn-danger.dropdown-toggle.focus,
.open>.btn-danger.dropdown-toggle:focus,
.open>.btn-danger.dropdown-toggle:hover { border-color: var(--btn-danger-color); background-color: var(--btn-danger-color); }

/* Forms */
.input-group-addon { min-width: 40px; padding:4px 12px;}
.input-group .select2-container--bootstrap .select2-selection { border-radius: 0 4px 4px 0; }
.form-group.well { padding-left: 0; padding-right: 0; margin-bottom: 20px; }
.input-group .form-control:not(:first-child):not(:last-child){ border-top-right-radius: 4px;  border-bottom-right-radius: 4px;}
.select2-container--bootstrap .select2-selection--multiple .select2-selection__choice { height: 24px; line-height: 22px; border-radius: 20px; }
.select2-container .select2-search--inline { margin-bottom: 3px; }
textarea.form-control { resize: none; }
.btn.btn-action-info { width: 26px; height: 26px; padding: 4px 3px; }
.btn.btn-action-info > i { font-size: 19px; }
.input-group.has-action-info { position: relative; }
.input-group.has-action-info .form-control { width: calc(100% - 35px); }
.input-group.has-action-info .btn-action-info { position: absolute; top: 4px; right: 0; z-index: 2; }
.mt-checkbox, .mt-radio { margin-bottom: 10px; }

/* Welcome Page */
.welcome-page-widgets .row { margin-left: -10px; margin-right: -10px; }
.welcome-page-widgets [class*=' col-'] { padding-left: 10px; padding-right: 10px; }
.welcome-page-widgets .widget-thumb { background-color: #fff; border: 1px solid var(--border-color); margin-bottom: 20px; }
.welcome-page-widgets .widget-thumb .widget-thumb-wrap,
.welcome-page-widgets .widget-thumb .widget-thumb-body { overflow: initial; }
.welcome-page-widgets .widget-thumb .widget-thumb-wrap .widget-thumb-icon { margin: 0 10px 0 0; border-radius: 60px; color: var(--brand-color);background: rgba(0, 208, 146, 0.15); }
.welcome-page-widgets .widget-thumb .widget-thumb-body .widget-thumb-body-stat { font-size: 26px; }
.welcome-page-widgets .widget-thumb .widget-thumb-body .widget-thumb-body-stat > span { position: relative; }
.welcome-page-widgets .widget-thumb .widget-thumb-body .widget-thumb-body-stat > span > i { position: absolute; top: -10px; left: 0; font-size: 20px; }
.welcome-page-widgets .widget-thumb .widget-thumb-body .widget-thumb-subtitle { text-transform: uppercase; margin-left: 2px; }

/*  || 03: Helper ||  */
/*  ================  */
.font-green { color: var(--action-color) !important}
.no-margin { margin: 0 !important; }
.p0 { padding: 0 !important; }
.padding-left-20 { padding-left: 20px; }
.shadow { box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-5 { margin-bottom: 5px; }
.pb-5 { padding-bottom: 5px !important }
.pb-0 { padding-bottom: 0 !important }
.or-divider { padding: 5px 0; text-align: center; margin-bottom: 0; }
.form-gutter { margin-left: -5px; margin-right: -5px; }
.form-gutter [class*='col-md'] { padding-left: 5px; padding-right: 5px; }
.alert.alert-sm { padding: 10px; }
.not-active { pointer-events: none; cursor: default; text-decoration: none; }
.hr-sm { margin: 5px auto 15px; }

/*Ingredient repreater*/
.mt-repeater-item{ position: relative; }
.mt-repeater-item .mt-repeater-delete{ position: absolute; top:-20px; right:15px; }

/*client Location*/
.select2-container--bootstrap .select2-results__option--highlighted[aria-selected] {background-color: var(--action-color)}


/* Modal Page center */
.modal-compact-view { overflow: hidden; overflow-y: auto; }
.vertical-alignment-helper { display:table; height: 100%; width: 100%; pointer-events:none; }
.vertical-align-center { display: table-cell; vertical-align: middle; }
.modal-content { width:inherit; max-width: 90%; height:inherit; margin: 0 auto; pointer-events:all; }
/* Modal: Header Close */
.modal .modal-header {position: relative;}
.modal .modal-header .close {display: inline-block;position: absolute;right: 0px;top: 0;width: 60px;height: 55px;outline: 0;background: url(../img/remove-icon-small.svg) center center no-repeat #b9b9b9;background-size: 12px 12px;border-top-right-radius: 5px;}
.modal-footer { border-color: #efefef; }
.modal .file-upload-container { padding: 20px; }
.dropzone-file-area { border-radius: 5px; border-color: #89cff0; background-color: rgba(137, 207, 240, 0.25);; }
.file-upload-container h3 { margin-top: 0; }
.file-upload-container .icon-cloud img { width: 100px; height: 100px; fill: #4422EE; }
/* File upload small size */
.file-upload-container.file-upload-sm .dropzone-file-area { padding: 15px; }
.file-upload-container.file-upload-sm .icon-cloud img { width: 64px; height: 64px; }
.file-upload-container.file-upload-sm h3 { font-size: 18px; }


/* Table Style */
.table td.cell-editable { padding: 2px; vertical-align: middle }
.thumbnail-sm { padding: 4px; line-height: 1.42857; background-color: #fff; border: 1px solid #ddd; border-radius: 4px; display: inline-block; }
.thumbnail-sm > img { width: 80px; height: auto }
table.dataTable thead>tr>th.sorting_asc, table.dataTable thead>tr>th.sorting_desc, table.dataTable thead>tr>th.sorting, table.dataTable thead>tr>td.sorting_asc, table.dataTable thead>tr>td.sorting_desc, table.dataTable thead>tr>td.sorting { padding-right: 20px; }
table.dataTable.no-footer { border-bottom: none; }
.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th { vertical-align: middle; }
.table.white-space-normal>tbody>tr>td,
.table.white-space-normal>tbody>tr>th,
.table.white-space-normal>tfoot>tr>td,
.table.white-space-normal>tfoot>tr>th,
.table.white-space-normal>thead>tr>td,
.table.white-space-normal>thead>tr>th { vertical-align: top; }
/* .table th, td { white-space: nowrap; } */
.table.white-space-nowrap th, .table.white-space-nowrap td { white-space: nowrap; }
.table.white-space-normal th, .table.white-space-normal td { white-space: normal; }
.table tbody .form-control { margin: -9px; min-width: 145px !important; width: calc(100% + 18px) !important; padding: 8px; border-color: #3598dc; background: #fff; border-radius: 2px; }
table.dataTable thead th, table.dataTable thead td { padding-left: 10px; }
.table-scrollable .dataTable td > .btn-group,
.table-scrollable .dataTable th > .btn-group { position: static; margin: 0; }
.table-scrollable .dataTable .btn-group-xs > .btn, .btn-xs { padding: 2px 2px; min-width: 20px; margin-top: -5px; }
.table-scrollable.action-sticky-cell thead th:last-child { position: sticky;right: 0px;transition: left 0.2s;}
.table-scrollable.action-sticky-cell tbody tr > td:last-child {position: sticky;right: 0px;transition: left 0.2s;}

@media (max-width:640px){
  .dataTables_wrapper .dataTables_filter { margin-top: 0 }
  .dataTables_wrapper .dataTables_filter {  }
}

@media (max-width:480px){
  div.dataTables_wrapper div.dataTables_length select.input-xsmall { width: 50px!important; padding-left: 5px; padding-right: 5px; }
  div.dataTables_wrapper div.dataTables_length,
  div.dataTables_wrapper div.dataTables_filter { text-align: left }
}
/*  || Z-index ||  */
.sweet-overlay, .sweet-alert { z-index: 10050; }


/* Page Footer */
.page-footer { text-align: center; font-size: 12px; height: 40px; }
.page-footer .page-footer-inner {float: none}
.page-sidebar-fixed:not(.page-footer-fixed) .page-footer {background-color: #eef1f5;}
.poweredby-logo {width: 75px; height: auto; margin-left: 5px;}
.poweredby-logo-1 {width: 60px; height: auto; margin-left: 5px; margin-top: 6px; border-left: 1px solid #ddd; padding-left: 5px;}
.has-sticky-footer { margin-bottom: 40px; }
.sticky-footer { position: absolute; bottom: 10px; width: 100%; height: 30px; line-height: 30px; }
@media (max-width: 992px) {
  .sticky-footer { position: inherit; }
}


.portlet.box>.portlet-title>.tools>a.pro-cat_remove { background-image: url(../../global/img/portlet-remove-icon-white.png); background-repeat: no-repeat; width: 11px;  }

.collaboration-tags { margin-bottom: 20px; }
.collaboration-tags .btn{ margin: 4px; float: left; padding: 4px 12px; }
.collaboration-tags .btn.active { color: #FFF; background-color: #26a1ab; border-color: #2499a3; }


.fileinput.product-images,
.fileinput.product-images .thumbnail { display: block; text-align: center; }
.fileinput.product-images .thumbnail > img { width: 100%; height: auto}

/* User warning pages */
.warning-content { position: relative; z-index: 1; }
.warning-content h4, .warning-content h3 { font-size: 30px; font-weight: 400; margin: 0 0 30px }
.warning-content h3 { font-size: 36px; font-weight: 600; color: #666; margin-top: 50px; }
.warning-content p { max-width: 540px; font-size: 16px; margin: 20px auto 30px }
.warning-content img { width: 130px; height: 130px; margin-bottom: 30px; }
.warning-content .btn {  }

.portlet-banner { height: 200px; background-color: rgba(45, 229, 168, 0.55); margin: -20px -20px 20px -20px; border-top-left-radius: 4px; border-top-right-radius: 4px; position: relative; text-align: center; width: calc(100% + 40px ); }
.portlet-banner:after { position: absolute; content: ""; background: url(../img/banner_icon-college.svg) center center no-repeat; width: 100%; height: 100%; background-size: 100% 100%; left: 0; top: 0; opacity: 0.5; }
.portlet-banner .banner-icon { width: 100px; height: 100px; border-radius: 100px; line-height: 100px; font-size: 60px; background-color: #fff; display: block; margin: 0 auto; position: relative; z-index: 2; color: var(--brand-color); }
.portlet-banner .banner-icon:before { position: absolute; content: ""; width: 120px; height: 120px; top: -10px; left: -10px; background-color: #fff; border-radius: 120px; z-index: -1; opacity: 0.5; }



/* Vendor Profile */
.vendor-profile-details .form-bordered .form-group .control-label,
.modal-clarify-details .form-bordered .form-group .control-label { padding: 15px; margin: 0; }
.vendor-profile-details .form-bordered .form-group .control-label,
.vendor-profile-details .form-bordered .form-group > div,
.modal-clarify-details .form-bordered .form-group .control-label,
.modal-clarify-details .form-bordered .form-group > div { min-height: 50px; }
.modal-clarify-details .form-bordered .form-group > div:last-child { padding: 5px; }
.vendor-profile-details .form-bordered .form-group > div > span,
.modal-clarify-details .form-bordered .form-group > div > span { font-weight: 600; }
.form .form-bordered .form-group { margin: 0; border-bottom: 1px solid #efefef; }

.modal-clarify-details .form-bordered .form-group .control-label,
.modal-clarify-details .form-bordered .form-group > div { min-height: 64px; }
.modal-clarify-details .form-bordered .form-group > div > span { font-weight: normal }
.modal-clarify-details .form-bordered .form-group .control-label { font-weight: 600; }

/* PDF File Download */
.pdf-file-download { padding: 7px 0;  }
.pdf-file-download .__pdf-file-icon > img { width: 80px; height: 80px; }
.pdf-file-download .__pdf-file-caption { margin-top: 20px; }
.pdf-file-download .__pdf-file-caption > p { font-size: 16px; font-weight: 500; }

.pdf-file-download.pdf-file-download-bordered { border-radius: 5px; background-color: #f1f4f7; border: 2px dashed #e3e3e3; padding: 20px; margin: 0 auto; text-align: center; }

/*Modal Order Track*/

.modal-order-track .modal-header{ padding: 15px 35px 10px; }
.modal.modal-order-track .modal-header .close{ width: 67px; height: 67px; }
.modal-order-track h4{ font-size: 16px; font-weight: 600; color: #000000; }
.modal-order-track .modal-ean-number{ font-size: 12px; font-weight: 600; margin-bottom: 0; margin-top: 5px; color: rgba(0, 0, 0, 0.75); }
.modal-order-track .modal-ean-number span{ color: rgba(0, 0, 0, 0.5); }
.modal .modal-body .order-track-content{ padding: 20px; display: flex; flex-direction: column; }
.modal .order-track-content .order-track-step{ display: flex; min-height: 70px; height: 100%; }
.modal .order-track-content .order-track-step:last-child .order-track-text p{ margin-bottom: 0; }
.modal .order-track-step:last-child .order-track-status span:last-of-type{ display: none; }
.modal .order-track-content .order-track-status{ margin-right: 20px; position: relative; }
.modal .order-track-content .order-track-status .order-track-status-dot{ display: block; width: 12px; height: 12px; border-radius: 50%; background: transparent; border: 2px solid #EAEAEA; margin-top: 4px; }
.modal .order-track-content .order-track-status .order-track-status-line{ display: block; margin: 0 auto; width: 2px; height: calc(100% - 10px); background-color: #EAEAEA; }
.modal .order-track-content .order-track-status .order-track-status-fill-line{ display: block; margin: 0 auto; width: 2px; height: 100%; background:transparent; }
.modal .order-track-content .order-track-text{ opacity: 0.5; }
.modal .order-track-content .order-track-text p{ font-size: 12px; font-weight: 500; color: rgb(135, 135, 135); margin: 0 0 20px; line-height: 17px; }
.modal .order-track-content .order-track-title{ font-size: 14px; font-weight: 600; margin: 0; line-height: 10px; color: rgb(0, 0, 0); margin-bottom: 5px; line-height: 19px; }
.modal .order-track-content .order-track-title span{ margin-right: 5px; }
.modal .order-track-content .order-track-title small{ color: rgba(121, 121, 121, 0.5); font-size: 90%; white-space: nowrap; }

.modal .order-track-step.is-done .order-track-status-dot{ background-color: #2DE5A7; border-color: #2de5a7; -webkit-transition: background-color 0.4s linear; transition: background-color 0.4s linear; }
.modal .order-track-step.is-done .order-track-status-fill-line{ background-color:  #2DE5A7; animation-delay: 0s; animation-name: height; animation-duration: 2s; }
.modal .order-track-step.is-done .order-track-text{ opacity: 1; }
.modal .order-track-step.current-status .order-track-text{ opacity: 1; }
.current-status .order-track-status-dot{ border-color: #2DE5A7 !important; background-color: #2DE5A7 !important; }
.current-status .order-track-status-dot:before {
  content: '';
  display: block;
  border-radius: 28px;
  height: 28px;
  width: 28px;
  position: absolute;
  top: -8px;
  left: -8px;
  -webkit-animation: animation-pulse 2.5s ease-out;
  animation: animation-pulse 2.5s ease-out;
      animation-iteration-count: 1;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  opacity: 0;
  border: 5px solid #2DE5A7;
  margin-top: 4px;
}
@-webkit-keyframes height {
  0% {
      height: 0;
  }
  100% {
      height: 100%;
  }
}
@keyframes height {
  0% {
      height: 0;
  }
  100% {
      height: 100%;
  }
}
@-webkit-keyframes animation-pulse {
  0% {
    -webkit-transform: scale(0.1, 0.1);
    opacity: 0.5; }
  60% {
    -webkit-transform: scale(0.1, 0.1);
    opacity: 0.8; }
  65% {
    opacity: 1; }
  100% {
    -webkit-transform: scale(1.0, 1.0);
    opacity: 0.0; } }

@keyframes animation-pulse {
  0% {
    -webkit-transform: scale(0.1, 0.1);
    opacity: 0.5; }
  60% {
    -webkit-transform: scale(0.1, 0.1);
    opacity: 0.8; }
  65% {
    opacity: 1; }
  100% {
    -webkit-transform: scale(1.0, 1.0);
    opacity: 0.0; } }


@media (max-width: 575.98px){
  .modal-order-track .modal-header { padding: 15px 15px 10px; }
  .modal.modal-order-track .modal-header .close { width: 64px; height: 64px; }
  .modal-order-track h4{ font-size: 14px; }
  .modal-order-track .modal-ean-number{ font-size: 11px; }
  .modal .modal-body .order-track-content{ padding: 0; }
  .modal .order-track-content .order-track-status { margin-right: 15px; }
  .modal .order-track-content .order-track-text p{ margin: 0 0 15px; font-size: 11px; line-height: 14px; }
  .modal .order-track-content .order-track-title{ font-size: 12px; line-height: 15px; }
}
/*more product images*/
.fileinput-wide,
    .fileinput-wide .fileinput { width: 100%; display: block;}
    .fileinput-wide .hide-text-xs>i { display: none;}
    .fileinput-wide .uneditable-input { min-width: auto;}
    .fileinput-wide .fileinput .input-group { white-space: normal;}
    .fileinput-wide .fileinput .input-group .input-fixed { display: flex; justify-content: start;}
    .fileinput-wide .fileinput .input-group .input-fixed i, .fileinput-wide .fileinput .input-group .input-fixed span { line-height: 18px;}
    .fileinput-wide .fileinput .input-group .input-fixed span { margin-left: 2px; }
    .fileinput .btn.btn-danger {line-height: 1.44 !important;}
    /* Form Repeat content */
    .mt-repeater { display: block; width: initial; }
    .mt-repeater .fileinput-wide .fileinput { display: flex; justify-content: space-between; }
    .mt-repeater .fileinput-wide .fileinput .input-group { width: 100%; padding-right: 2px; }
    .mt-repeater .fileinput-wide .fileinput .input-group { width: calc(100% - 40px); padding-right: 2px; }
    .mt-repeater .mt-repeater-add.has-label { margin-top: 25px; line-height: 1.44 !important;}
    .row-sm {
      margin-left: -7.5px;
      margin-right: -7.5px;
    }
    .row-sm [class*="col-"] {
      padding-left: 7.5px;
      padding-right: 7.5px;
    }
    @media (max-width: 1199px) {
      .fileinput-wide .hide-text-xs>span { display: none; }
      .fileinput-wide .hide-text-xs>i { display: block; }
    }

/*New Styles*/
.tbl-info-label {
font-size: 12px;
    white-space: normal;
    color: #f64e60;
    margin-bottom: 5px;
    display: inline-block;
}
.control-label .required, .form-group .required { padding-left: 0; }
.form-group .required { color: #e02222; font-size:12px;}
.btn.btn-outline.grey-mint { border-color: #e02222; background: #fff; color:#e02222; }
.btn.btn-outline.grey-mint:hover i.required {color:#fff;}
.table-scrollable .dataTable .btn-group-xs > .btn, .btn-xs { padding: 2px 6px !important; min-width: 20px !important; }
.input-group .example .form-control:not(:first-child):not(:last-child) { border-top-left-radius: 4px; border-bottom-left-radius: 4px; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.fileinput { vertical-align: middle; }
.font-white { color: #ffffff;}
.upload-icon { padding-right: 5px; font-size: 14px; }
.sbold { margin: 0 0 20px; font-weight: 600; }
.fileinput-wide,.fileinput-wide .fileinput { width: 100%; }
.fileinput-wide .hide-text-xs > i { display: none; }
.fileinput-wide .uneditable-input { min-width: auto; }
.fileinput-wide .fileinput .input-group { white-space: normal; }
.fileinput-wide .fileinput .input-group .input-fixed { display: flex; justify-content: start; }
.fileinput-wide .fileinput .input-group .input-fixed i,
.fileinput-wide .fileinput .input-group .input-fixed span { line-height: 18px; }
.fileinput-wide .fileinput .input-group .input-fixed span { margin-left: 2px; }
.fileinput-wide .fileinput-filename { word-wrap: anywhere; }
@media (max-width: 1199px) {
   .fileinput-wide .hide-text-xs > span { display: none; }
   .fileinput-wide .hide-text-xs > i { display: block; }
}

/*Media Queries */
@media (max-width: 576px) { .input-large { width: 100% !important; } .input-medium { width: calc(100% - 86px) !important; } .uneditable-input { padding: 6px 12px; } .input-group-addon { padding: 4px 12px; } .dropzone-file-area { padding: 10px; } .modal .file-upload-container { padding: 10px; } .modal-body { padding: 10px; } .dropzone-file-area .btn { padding: 5px; font-size: 12px; } .dropzone-file-area .btn.green { margin-top: 10px !important; } .file-upload-container h3 { font-size: 14px; margin-top: 10px;} dropzone-file-area .form-group { margin-bottom: 22px;} .modal-header { padding: 10px 15px; } .modal-title { font-size: 15px; line-height: 17px; } .modal-footer {
padding: 10px 15px;} .modal input[type="file"] { font-size: 12px; } .modal-footer .btn { padding: 4px 6px; font-size: 12px;} }
@media (max-width: 768px) { .input-group { width: 100% } }

/*select field*/

.form-control {
  padding-left: 8px;
  padding-right: 8px;
}
.input-group-addon.has-select{
  padding: 0; }
.input-group-addon select {
  max-width: 60px;
  height: 32px;
  padding: 6px 10px 6px 6px;
  line-height: 18px;
  border: transparent;
  background-color: #eee;
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 1px;
  text-overflow: '';
}
.input-group-addon.has-select::after {
  display: inline-block;
  margin-right: 5px;
  position: absolute;
  right: 2px;
  top: 16px;
  content: "";
  border-top: .3em solid;
  border-right: .3em solid transparent;
  border-bottom: 0;
  border-left: .3em solid transparent;
}

/*Form compare*/

.form .form-bordered .form-group > div {padding: 10px;}
.form .form-bordered .form-group > div label { margin-bottom: 0;}
.form .form-bordered .form-label { font-weight: bold;text-align: right;padding: 10px;margin-bottom: 0;}
.portlet .portlet-footer i {margin-right: 5px;}
.portlet .portlet-footer .btn { font-weight: 600;}
.portlet .portlet-footer .btn-lg {font-size: 16px; padding: 8px 14px; border-radius: 3px;}
.portlet .portlet-footer .btn-block {max-width:90%; margin: 0 auto;}
@media (max-width:992px){ .form .form-bordered .form-group > div { border-left: 1px solid #efefef;}}
@media (max-width:767.98px) { .form .form-bordered .form-group > div {border-left: none;} .portlet .portlet-footer .btn-lg {font-size: 14px; padding: 6px 12px; border-radius: 3px;}.product-content-left{text-align: left !important;}}

svg {
  font-family: Sans-Serif, Arial;
}
.line {
stroke-width: 2;
fill: none;
}

.axis path {
stroke: black;
}

.text {
font-size: 12px;
}

.title-text {
font-size: 12px;
}


/*plus and minus icons*/
td.details-control {
            background: url('/static/assets/img/details_open.png') no-repeat center center;
            background-size:20px;
            cursor: pointer;
      }
      tr.shown td.details-control {
          background: url('/static/assets/img/details_close.png') no-repeat center center;
          background-size:20px;
      }


/*row*/
.row-sm {
  margin-left: -7.5px;
  margin-right: -7.5px;
}
.row-sm [class*="col-"] {
  padding-left: 7.5px;
  padding-right: 7.5px;
}
/*Dashboard*/

.dashboard-stat {position: relative;}
.dashboard-stat .details {position: absolute;right: 15px;top: 50%;transform: translatey(-50%);padding-right:0}
.dashboard-stat .details .number { font-weight: 600; padding-top: 0;font-size: 38px;line-height: 45px;}
.dashboard-stat.dark-green { background-color: #44b6ae;}
.dashboard-stat-v2.brown { background-color: #c49f47;}

.dashboard-stat.brown .visual > i {

  color: #fff;
  opacity: .1;
}
.dashboard-stat.brown .details .number {
  color: #fff;
}
.dashboard-stat.brown .details .desc {
  color: #fff;
  opacity: 1;
}
.dashboard-stat .details .desc {
  font-weight: 500;
}

 .kt-subheader__toolbar .btn:not(.dropdown-toggle-split) {
  margin-left: .25rem;
  background: #ececec;
  display: flex;
}
.kt-subheader .btn {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  height: 32px !important;
  align-items: center;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: .25rem;
  margin-bottom: .25rem;
}
.kt-subheader__toolbar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0;
  
}
.kt-subheader__btn-daterange .kt-subheader__btn-daterange-title {
  display: inline-block;
  color: #959cb6;
  font-weight: 600;
}
.kt-subheader__btn-daterange .kt-subheader__btn-daterange-date {
  color: #737373;
  margin-right: .75rem;
  font-weight: 600;
}
.kt-svg-icon.kt-svg-icon--sm {
  height: 20px;
  width: 20px;
}
.kt-svg-icon g [fill] {
  fill: #737373;
}
.d-sm-block {
    display: block !important;
}
@media (max-width: 768px) {.dashboard-stat {margin-bottom: 20px;}}
@media (max-width: 576px) {.dashboard-stat .details .number{font-size: 30px;line-height: 38px;}.dashboard-stat .details .desc{font-size: 14px;}.dashboard-stat .visual > i{font-size: 100px;line-height: 100px;}.dashboard-stat{margin-bottom: 15px;}.kt-subheader .kt-subheader__toolbar{display: block;margin: 0 auto;text-align: center;}}


/*Date Picker*/

.datepicker {
  width:265px;
  padding:10px;
  border-radius:.42rem
 }
 .datepicker.datepicker-orient-top {
  margin-top:8px
 }
 .datepicker table {
  width:100%
 }
 .datepicker td,
 .datepicker th {
  font-size:14px;
  font-weight:regular;
  width:33px;
  height:33px;
  border-radius:.42rem
 }
 .datepicker thead th {
  color:#484848;
 }
 .datepicker thead th.datepicker-switch,
 .datepicker thead th.next,
 .datepicker thead th.prev {
  font-weight:500;
  color:#484848;
 }
 .datepicker thead th.datepicker-switch i,
 .datepicker thead th.next i,
 .datepicker thead th.prev i {
  font-size:1.2rem;
  color:#80808f
 }
 .datepicker thead th.datepicker-switch i:before,
 .datepicker thead th.next i:before,
 .datepicker thead th.prev i:before {
  line-height:0;
  vertical-align:middle
 }
 .datepicker thead th.datepicker-switch:hover,
 .datepicker thead th.next:hover,
 .datepicker thead th.prev:hover {
  background:#f3f6f9!important
 }
 .datepicker thead th.dow {
  color:#484848;
  font-weight:600
 }
 .datepicker tbody tr>td {
  width:35px;
  height:35px
 }
 .datepicker tbody tr>td.day {
  color:#484848;
  font-weight:400
 }
 .datepicker tbody tr>td.day:hover {
  background:#f3f6f9;
  color:#484848;
 }
 .datepicker tbody tr>td.day.old {
  color:#80808f
 }
 .datepicker tbody tr>td.day.new {
  color:#484848;
 }
 .datepicker tbody tr>td.day.active,
 .datepicker tbody tr>td.day.active:hover,
 .datepicker tbody tr>td.day.selected,
 .datepicker tbody tr>td.day.selected:hover {
  background:#32c5d2;
  color:#fff
 }
 .datepicker tbody tr>td.day.today {
  position:relative;
  background:rgba(137,80,252,.12)!important;
  color:#32c5d2 !important
 }
 .datepicker tbody tr>td.day.today:before {
  content:'';
  display:inline-block;
  border:solid transparent;
  border-width:0 0 7px 7px;
  border-bottom-color:#fff;
  border-top-color:#ecf0f3;
  position:absolute;
  bottom:4px;
  right:4px
 }
 .datepicker tbody tr>td.day.range {
  background:#f3f6f9
 }
 .datepicker tbody tr>td span.hour,
 .datepicker tbody tr>td span.minute,
 .datepicker tbody tr>td span.month,
 .datepicker tbody tr>td span.year {
  color:#80808f
 }
 .datepicker tbody tr>td span.hour:hover,
 .datepicker tbody tr>td span.minute:hover,
 .datepicker tbody tr>td span.month:hover,
 .datepicker tbody tr>td span.year:hover {
  background:#f3f6f9
 }
 .datepicker tbody tr>td span.hour.active,
 .datepicker tbody tr>td span.hour.active.focused:hover,
 .datepicker tbody tr>td span.hour.active:hover,
 .datepicker tbody tr>td span.hour.focused,
 .datepicker tbody tr>td span.hour.focused:hover,
 .datepicker tbody tr>td span.minute.active,
 .datepicker tbody tr>td span.minute.active.focused:hover,
 .datepicker tbody tr>td span.minute.active:hover,
 .datepicker tbody tr>td span.minute.focused,
 .datepicker tbody tr>td span.minute.focused:hover,
 .datepicker tbody tr>td span.month.active,
 .datepicker tbody tr>td span.month.active.focused:hover,
 .datepicker tbody tr>td span.month.active:hover,
 .datepicker tbody tr>td span.month.focused,
 .datepicker tbody tr>td span.month.focused:hover,
 .datepicker tbody tr>td span.year.active,
 .datepicker tbody tr>td span.year.active.focused:hover,
 .datepicker tbody tr>td span.year.active:hover,
 .datepicker tbody tr>td span.year.focused,
 .datepicker tbody tr>td span.year.focused:hover {
  background:#32c5d2;
  color:#fff
 }
 .datepicker tfoot tr>th {
  width:35px;
  height:35px
 }
 .datepicker tfoot tr>th.clear,
 .datepicker tfoot tr>th.today {
  border-radius:.42rem;
  font-weight:500
 }
 .datepicker tfoot tr>th.clear:hover,
 .datepicker tfoot tr>th.today:hover {
  background:#ecf0f3
 }
 .datepicker.datepicker-inline {
  border:1px solid #ecf0f3
 }
 .input-daterange .input-group-addon {
  min-width:44px
 }
 .input-daterange input {
  text-align:left
 }
 .daterangepicker {
  padding:0;
  margin:0;
  width:auto;
  -webkit-box-shadow:0 0 10px 0 rgba(82,63,105,.15);
  box-shadow:0 0 50px 0 rgba(82,63,105,.15);
  border-radius:.42rem;
  border:0;
  font-family:Poppins,Helvetica,sans-serif;
  z-index:98
 }
 .modal-open .daterangepicker {
  z-index:1051
 }
 .daterangepicker:after,
 .daterangepicker:before {
  display:none
 }
 .daterangepicker .ranges ul {
  padding:1rem 0;
  width:175px
 }
 .daterangepicker .ranges li {
  padding:8px 12px;
  font-weight:400;
  font-size:13px;
  border: 1px solid transparent;
  color:#808080;
  -webkit-transition:color .3s ease;
  transition:color .3s ease
 }
 .daterangepicker .ranges li.active,
 .daterangepicker .ranges li:hover {
  background-color:#f3f6f9 !important;
  border: 1px solid #f3f6f9 !important;
  color:#484848;
  -webkit-transition:color .3s ease;
  transition:color .3s ease
 }
 .daterangepicker.show-calendar .ranges {
  border-right:1px solid #ecf0f3
 }
 .daterangepicker.show-ranges .drp-calendar.left {
  border-left:0
 }
 .daterangepicker.show-calendar .ranges {
  margin-top:0
 }
 .daterangepicker .drp-buttons {
  padding:1rem 1.75rem;
  border-top:1px solid #ecf0f3
 }
 .daterangepicker .drp-buttons .btn {
  font-size:12px;
  font-weight:500;
  padding:4px 8px;
  border-radius:.42rem
 }
 .daterangepicker .drp-selected {
  font-size:12px;
  font-weight: 400;
 }
 .daterangepicker .drp-calendar.left,
 .daterangepicker .drp-calendar.right {
  padding:1rem 1rem
 }
 .daterangepicker .drp-calendar.left {
  border-left:0!important
 }
 .daterangepicker .drp-calendar td,
 .daterangepicker .drp-calendar th {
  font-size:13px;
  font-weight:regular;
  width:33px;
  height:33px
 }
 .daterangepicker .drp-calendar th {
  font-weight:400;
  color:#808080;
 }
 .daterangepicker .drp-calendar th.month {
  font-weight:400;
  color:#808080;
 }
 .daterangepicker .drp-calendar th.next span,
 .daterangepicker .drp-calendar th.prev span {
  border-width:0 1px 1px 0;
  border-color:#80808f
 }
 .daterangepicker .drp-calendar th.next span {
  margin-right:1px
 }
 .daterangepicker .drp-calendar th.prev span {
  margin-left:1px
 }
 .daterangepicker .drp-calendar td {
  color:#80808f
 }
 .daterangepicker .drp-calendar td:hover {
  background-color:#f3f6f9
 }
 .daterangepicker .drp-calendar td.available.off {
  color:#b5b5c3
 }
 .daterangepicker .drp-calendar td.active {
  background-color:#ececec !important;
  color:#484848!important;
  border-radius:.42rem
 }
 .daterangepicker .drp-calendar td.active.start-date {
  border-top-right-radius:0;
  border-bottom-right-radius:0
 }
 .daterangepicker .drp-calendar td.active.end-date {
  border-top-left-radius:0;
  border-bottom-left-radius:0
 }
 .daterangepicker .drp-calendar td.active.start-date.end-date {
  border-radius:.42rem
 }
 .daterangepicker .drp-calendar td.today,
 .daterangepicker .drp-calendar td.today.active {
  border-radius:.42rem;
  background:rgba(137,80,252,.12)!important;
  color:#484848 !important
 }
 .daterangepicker .drp-calendar td.in-range.available:not(.active):not(.off):not(.today) {
  background-color:#f3f6f9;
  color:#484848;
 }
 .daterangepicker select {
  border-radius:.42rem;
  background:0 0!important;
  border-color:#e5eaee!important;
  color:#484848 !important
 }
 .datetimepicker {
  width:265px;
  padding:10px;
  left:auto;
  border-radius:.42rem
 }
 .datetimepicker.datetimepicker-orient-top {
  margin-top:8px
 }
 .datetimepicker table {
  width:100%
 }
 .datetimepicker td,
 .datetimepicker th {
  font-size:14px;
  width:33px;
  height:33px;
  font-weight:regular;
  border-radius:.42rem
 }
 .datetimepicker thead th i {
  font-size:1.2rem
 }
 .datetimepicker thead th.next,
 .datetimepicker thead th.prev,
 .datetimepicker thead th.switch {
  color:#484848;
  font-weight:500;
  display:table-cell
 }
 .datetimepicker thead th.next .glyphicon,
 .datetimepicker thead th.prev .glyphicon,
 .datetimepicker thead th.switch .glyphicon {
  color:#80808f
 }
 .datetimepicker thead th.next:hover,
 .datetimepicker thead th.prev:hover,
 .datetimepicker thead th.switch:hover {
  background:#f3f6f9!important
 }
 .datetimepicker thead th.dow {
  font-weight:500;
  color:#484848;
 }
 .datetimepicker thead th.next>span:before {
  font-family:Ki;
  font-style:normal;
  font-weight:400;
  font-variant:normal;
  line-height:1;
  text-decoration:inherit;
  text-rendering:optimizeLegibility;
  text-transform:none;
  -moz-osx-font-smoothing:grayscale;
  -webkit-font-smoothing:antialiased;
  font-smoothing:antialiased;
  content:"";
  font-size:.7rem
 }
 .datetimepicker thead th.prev>span:before {
  font-family:Ki;
  font-style:normal;
  font-weight:400;
  font-variant:normal;
  line-height:1;
  text-decoration:inherit;
  text-rendering:optimizeLegibility;
  text-transform:none;
  -moz-osx-font-smoothing:grayscale;
  -webkit-font-smoothing:antialiased;
  font-smoothing:antialiased;
  content:"";
  font-size:.7rem
 }
 .datetimepicker tbody tr>td span {
  color:#484848;
  font-weight:400
 }
 .datetimepicker tbody tr>td.day {
  color:#80808f
 }
 .datetimepicker tbody tr>td.day:hover {
  background:#f3f6f9
 }
 .datetimepicker tbody tr>td.day.old {
  color:#80808f
 }
 .datetimepicker tbody tr>td.day.new {
  color:#484848;
 }
 .datetimepicker tbody tr>td.day.active,
 .datetimepicker tbody tr>td.day.selected {
  background:#32c5d2;
  color:#fff
 }
 .datetimepicker tbody tr>td.day.today {
  position:relative;
  background:rgba(137,80,252,.12)!important;
  color:#32c5d2 !important
 }
 .datetimepicker tbody tr>td.day.today:before {
  content:'';
  display:inline-block;
  border:solid transparent;
  border-width:0 0 7px 7px;
  border-bottom-color:#fff;
  border-top-color:#ecf0f3;
  position:absolute;
  bottom:4px;
  right:4px
 }
 .datetimepicker tbody tr>td.day.range {
  background:#f3f6f9
 }
 .datetimepicker tbody tr>td span.hour,
 .datetimepicker tbody tr>td span.minute,
 .datetimepicker tbody tr>td span.month,
 .datetimepicker tbody tr>td span.year {
  color:#80808f
 }
 .datetimepicker tbody tr>td span.hour.focused,
 .datetimepicker tbody tr>td span.hour:hover,
 .datetimepicker tbody tr>td span.minute.focused,
 .datetimepicker tbody tr>td span.minute:hover,
 .datetimepicker tbody tr>td span.month.focused,
 .datetimepicker tbody tr>td span.month:hover,
 .datetimepicker tbody tr>td span.year.focused,
 .datetimepicker tbody tr>td span.year:hover {
  background:#f3f6f9
 }
 .datetimepicker tbody tr>td span.hour.active,
 .datetimepicker tbody tr>td span.hour.active:hover,
 .datetimepicker tbody tr>td span.minute.active,
 .datetimepicker tbody tr>td span.minute.active:hover,
 .datetimepicker tbody tr>td span.month.active,
 .datetimepicker tbody tr>td span.month.active:hover,
 .datetimepicker tbody tr>td span.year.active,
 .datetimepicker tbody tr>td span.year.active:hover {
  background:#32c5d2;
  color:#fff
 }
 .datetimepicker tfoot tr>th.clear,
 .datetimepicker tfoot tr>th.today {
  border-radius:.42rem;
  font-weight:500
 }
 .datetimepicker tfoot tr>th.clear:hover,
 .datetimepicker tfoot tr>th.today:hover {
  background-color:#f3f6f9
 }
 .datetimepicker.datetimepicker-inline {
  border:1px solid #f3f6f9
 }
 .input-daterange .input-group-addon {
  min-width:44px
 }
 
 @media (max-width: 576px){
  .daterangepicker .ranges{
    width: auto;
    text-align: center !important;
  }
  .drp-calendar.left,.drp-calendar.right{
    margin: 0 auto;
  }
  .daterangepicker .ranges li{
    padding: 6px 12px;
    font-size: 12px;
  }
  .daterangepicker .drp-calendar td, .daterangepicker .drp-calendar th{
    width: 25px;
    height: 25px;
    font-size: 12px;
  }
  .daterangepicker .drp-selected {
    font-size: 10px;
}
.daterangepicker .drp-buttons .btn {
  font-size: 10px;
  padding: 4px 4px
}
.dashboard-stat .details{
  right: 0;
  width: 100%;
}
.dashboard-stat .details .number{text-align: center;}
.dashboard-stat.green .details .desc {text-align: center;}
.dashboard-stat .details .desc  {text-align: center;}
 }

/*Feedback*/
.portlet.light.page-compact-view{ height: auto !important;}
.feedback-form { max-width:600px; background: #fff; margin: 0 auto;height: auto; padding: 30px; border-radius: 6px; box-shadow: 0 0 5px rgb(206, 204, 204);margin-top: -160px;z-index: 1;position: relative;}
.feedback-form .feedback-heading { font-size: 20px;font-weight: 600;line-height: 26px;text-align: center;max-width: 370px; margin: 0 auto; color:#484848}
.feedback-form .feedback-content {font-size: 14px; font-weight: 400;text-align: center; margin-top:15px!important; margin-bottom: 20px; color: #808080;}

.feedback-form .comment{ resize: none; width: 100%; height: 120px; margin: 10px 0 20px; padding: 1em; border: none; border-radius: 0.3em; color: #2C3E50; border: 1px solid #F2F2F2;}
.feedback-form .comment:hover, .feedback-form .comment:focus {box-shadow: 0 0 5px rgb(206, 204, 204);}
.feedback-form .comment::placeholder { font-size: 110%; color: #2C3E50;}
.feedback-form .comment:focus { outline: none;}
.feedback-form label { font-weight: 600; font-size: 16px; color: #2C3E50;}
.feedback-form h2 { font-weight: 600; font-size: 16px; color: #2C3E50;}
.feedback-form .btn {min-width: 180px; display: block; margin: 0 auto;text-align: center;}
.feedback-form .feedback-lists { font-size: 14px; font-weight: 400; color: #808080;margin: 15px 0;}
.feedback-form .feedback-lists span { margin-right: 5px; display: inline-block;min-width: 20px;}
.feedback-form .feedback-lists li { padding-bottom: 5px;color: #2C3E50;}
.feedback-form .required { color: #e02222;}
.feedback-form .user-feedback { display: flex; font-size: 14px; font-weight: 600; color: #2C3E50;line-height: 16px;margin-bottom: 20px;}
.feedback-form .user-feedback li { padding: 5px 0; margin-right: 23px; margin-left: 22px;}
.feedback-form .user-feedback li:first-child { margin-left: 0;}
.feedback-form .user-feedback li:last-child { margin-right: 0;margin-left: 16px;}
.btn.btn-submit {color: #fff;background-color: #61C2D0;border-color: #61C2D0;}
.btn.btn-submit:hover,.btn.btn-submit:active {color: #fff;background-color: #61C2D0;border-color: #61C2D0;}
.irs--flat .irs-handle {
  top: 23px;
}
.irs--flat .irs-bar {background-color: rgba(72, 72, 72, 0.55);cursor: pointer;}
.irs--flat .irs-handle > i:first-child {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 16px;
  height: 16px;
  margin-left: -1px;
  background-color: #484848;
  border-radius: 50%;
  cursor: pointer;
  
}
.irs--flat .irs-handle.state_hover > i:first-child,
  .irs--flat .irs-handle:hover > i:first-child {
    background-color: #2de5a7;
  }
.irs--flat .irs-min , .irs--flat .irs-max, .irs-single{ display: none;}
.irs--flat .irs-line { top: 12px;cursor: pointer;}
.irs--flat .irs-bar { top: 12px;}
.irs--flat .irs-handle { top: 10px;}
.irs--flat { height: 30px;}

@media (max-width: 576px){ .feedback-form .user-feedback li {margin-right: 8px;margin-left: 8px;}.feedback-form .feedback-heading{font-size: 18px;}.feedback-form .feedback-content{font-size: 12px;}.feedback-form h2{font-size: 14px;}.feedback-form .feedback-lists{font-size: 11px;}.feedback-form .user-feedback{font-size: 12px;}.feedback-form label{font-size: 14px;}.feedback-form .comment{height: 80px;margin: 15px 0 15px;}.feedback-form .user-feedback{margin-bottom: 15px;}.feedback-form .btn{min-width: 140px;padding: 4px 10px;}}
@media (max-width: 375px){ .feedback-form .user-feedback li {margin-right: 10px;margin-left: 10px;}.feedback-form{padding: 20px;}.feedback-form .user-feedback li:last-child{margin-left: 3px;}}
@media (max-width: 360px) { .feedback-form .user-feedback li {margin-right: 9px;margin-left: 9px;}.feedback-form .user-feedback li:last-child{margin-left: 6px;}}
@media (max-width: 320px){ .feedback-form .user-feedback li {margin-right: 8px;margin-left: 7px;}.feedback-form .feedback-heading{font-size: 16px;}.feedback-form .feedback-lists span{margin-right: 0;}.feedback-form .feedback-lists{font-size: 10px;}.feedback-form{padding: 20px 15px;}.feedback-form h2{font-size: 13px;}.feedback-form label{font-size: 13px;}.feedback-form .user-feedback li:last-child{margin-left: 5px;}}

/*reset element*/
.portlet.light>.portlet-title>.actions { padding: 4px 0 6px;}
.page-content-wrapper {overflow:hidden;}
.d-flex { display: flex !important;}
.align-items-center { align-items: center !important;}
.justify-content-between { justify-content: space-between !important;}
.justify-content-end { justify-content: flex-end !important;}
.justify-content-center { justify-content: center !important;}
.flex-column { flex-direction: column !important;}
.mb-3 {margin-bottom : 1rem}
.margin-left-5{ margin-left: 5px}
.margin-right-5{ margin-right: 5px !important}
.margin-top-0{ margin-top: 0;}
.p-0{padding: 0 !important;}
.d-none {display: none;}
.overflow-hidden { overflow: hidden !important;}
hr {margin: 1rem 0;border-top: 1px solid #eee;width: 100%;height: 1px;display: block;}
.portlet .portlet-body .__pdf-file-icon img {width:70px; height:auto;}
.portlet .portlet-body .__pdf-file-caption p{margin-bottom: 10px;}
.portlet .portlet-body .__pdf-file-icon {margin: 15px;}
.file-upload-container.file-upload-sm .icon-cloud img { width: 64px;height: 64px;position: relative;top:-10px;}
.dropzone-file-area { border-radius: 5px;border-color: #89cff0;background-color: rgba(137, 207, 240, 0.25);cursor:pointer;}
/*File upload and download*/
.file-upload-container.file-upload-sm.dropzone-file-area h3{margin: 0 0 10px;}
.file-upload-wrapper { position: relative;width: 100%;height:34px;background-color:#fff;max-width:350px;margin: 0 auto 15px;box-shadow: 0 0px 2px 2px rgba(0,0,0,0.1);}
.file-upload-wrapper:before{ content: 'Upload';position: absolute;top: 0;right: 0;display: inline-block;height: 34px;background: #eee;font-weight: 600;z-index: 25;font-size: 14px;line-height: 16px;padding: 10px 15px;text-transform: uppercase;pointer-events: none;}
.file-upload-wrapper:after { content: attr(data-text);font-size: 14px;position: absolute;top: 0;left: 0;background: #fff;padding: 10px 15px;display: block;width: calc(100% - 40px);pointer-events: none;z-index: 20;height: 20px;line-height:14px;color: #999;border-radius: 4px;font-weight: 300;}
.file-upload-wrapper .file-upload-field { opacity: 0;position: absolute;top: 0;right: 0;bottom: 0;left: 0;z-index: 99;height: 34px;margin: 0;padding: 0;display: block;cursor: pointer;width: 100%;}

.form-control.border-right-0{ border-top-right-radius: 0 !important;border-bottom-right-radius: 0 !important;}
.form-control.border-left-0{ border-top-left-radius: 0 !important;border-bottom-left-radius: 0 !important;}
.file-upload{display:flex;flex-direction:column;align-items:center;justify-content:center;}
.file-upload input { width:200px;min-width:200px;margin-bottom:15px;}