        /* ////////////////////////   Efnify default theme stylesheet ////////////////////////////// */
        /*------------------------------------------------------------------
[Color]
#2196f3 - blue [primary color for theme]
#1976d2 - blue darken-2
#64b5f6 - blue lighten-2
#90caf9 - blue lighten-3
#bbdefb - blue lighten-4
#ffab40 - orange accent-2 [secondary color]
#fff3e0 - orange lighten-5
#d32f2f - red darken-2 [error color]
#616161 - grey darken-2
#f8f8f8 - grey (aprox lighten-4)
#eeeeee - grey lighten-3
#9F9F9F - [disabled color]
rgba(0, 0, 0, 0.87) - black [Default color for html]
#ffffff - white
#fafafa - grey lighten-5


[Table of contents]

1. Body
2. Navbar / Header
3. Left Sidenav / Sidebar
4. Right Sidenav / Sidebar
5. Content / #content
	1. Button
    2. Tabs
    3. Dropdown
    4. Collections
    5. Pagination
    6. Preloader
    7. Waves
    8. Toasts
    9. Form Element
    10. Typography
    11. Card
    12. carousel
    13. SweetAlert
    14. Range Slider
    15. Grid
    16. FeatureDiscovery
    17. DataTable
	18. Pages (login,signup,....)


-------------------------------------------------------------------*/
        /* =================================================================================
body
================================================================================= */
        /* basic and prepage loader background color */
        
        body,
        #prepage-loader {
            background-color: #fafafa;
        }
        /*text selection*/
        
         ::-moz-selection,
        pre[class*="language-"]::selection,
        pre[class*="language-"] ::selection,
        code[class*="language-"]::selection,
        code[class*="language-"] ::selection {
            background-color: #bbdefb;
        }
        
         ::selection,
        pre[class*="language-"]::selection,
        pre[class*="language-"] ::selection,
        code[class*="language-"]::selection,
        code[class*="language-"] ::selection {
            background-color: #bbdefb;
        }
        /* prepage loader color */
        
        .ui-app__prepage-loader .double-bounce1,
        .ui-app__prepage-loader .double-bounce2 {
            background-color: #2196f3;
        }
        /* Page heading bookmark color */
        
        .ui-app__header .ui-app__header__bookmark>i.material-icons {
            color: rgba(0, 0, 0, 0.87);
        }
        /* anchor tag color */
        
        a {
            color: #2196f3;
        }
        /* =================================================================================
navbar/header
================================================================================= */
        /* background color */
        
        nav.ui-app__wrapper__navbar {
            background-color: #2196f3;
        }
        /* search box */
        
        .ui-app__wrapper__navbar__leftside__search input[type=search]:not(.browser-default) {
            background-color: #1976d2;
            color: rgba(255, 255, 255, 0.8);
        }
        
        .ui-app__wrapper__navbar__leftside__search input[type=search]:focus:not(.browser-default) {
            background-color: #ffffff;
        }
        
        .ui-app__wrapper__navbar__leftside__search input[type=search]:focus+ul+label.active i {
            color: #444444;
        }
        /* User Profile icon background and notification item indicator */
        
        .ui-app__wrapper__navbar__rightside--icons .ui-app__wrapper__navbar__rightside--users {
            background-color: #ffab40;
        }
        
        .notification-badge:after {
            background-color: #d32f2f;
        }
        /* user profile dropdown element color*/
        
        .ui-app__wrapper__navbar__rightside--users__dropdown li>a,
        .ui-app__wrapper__navbar__rightside--users__dropdown.dropdown-content li>span {
            color: #616161 !important;
        }
        /* full menu dropdown item color */
        
        .dropdown-content.ui-app__wrapper__navbar__rightside--full-menu__dropdown li a {
            color: rgba(0, 0, 0, 0.87);
        }
        /* =================================================================================
Left sidenav/sidebar
================================================================================= */
        /* sidenav navbar */
        
        .ui-app__left-sidenav.sidenav .ui-app__left-sidenav__navbar-menu {
            background-color: #2196f3;
        }
        
        .ui-app__left-sidenav__navbar-menu .brand-logo,
        .ui-app__left-sidenav__navbar__small-toggle>i.material-icons {
            color: #ffffff;
        }
        /* dashboard button */
        
        .ui-app__left-sidenav.sidenav .btn-dashboard,
        .ui-app__left-sidenav.sidenav .btn-dashboard:hover {
            background-color: #f8f8f8;
            color: rgba(0, 0, 0, 0.87);
        }
        /* left sidenav menu list ripple*/
        
        .ui-app__left-sidenav.sidenav .waves-effect .waves-ripple {
            background-color: #90caf9;
        }
        /* sidenav, quick, main menu and scrollbar background color*/
        
        .ui-app__left-sidenav.sidenav,
        .ui-app__left-sidenav.sidenav .ui-app__left-sidenav__menu,
        .ui-app__left-sidenav.sidenav .ui-app__left-sidenav__collapsible-quick-menu,
        .ui-app__left-sidenav.sidenav .ui-app__left-sidenav__collapsible-quick-menu-name,
        .ui-app__left-sidenav.sidenav .collapsible-body {
            background-color: #f8f8f8;
        }
        
        .ui-app__left-sidenav.sidenav .ui-app__scrollbar ::-webkit-scrollbar-track-piece {
            background-color: #f8f8f8;
        }
        /* scroolabr  */
        
        .ui-app__left-sidenav.sidenav .ui-app__scrollbar::-webkit-scrollbar-thumb {
            border: 2px solid #f8f8f8;
        }
        /* left sidenav active  menu text and icon color */
        
        .ui-app__left-sidenav.sidenav .ui-app__left-sidenav__menu>li.active>a,
        .ui-app__left-sidenav.sidenav .ui-app__left-sidenav__menu>li.active>a>i {
            color: #2196f3;
        }
        /* left sidenav active  menu color */
        
        .ui-app__left-sidenav.sidenav .ui-app__left-sidenav__menu>li.active {
            background-color: #bbdefb;
        }
        
        .sidenav .collapsible-body>ul:not(.collapsible)>li.active,
        .sidenav.sidenav-fixed .collapsible-body>ul:not(.collapsible)>li.active {
            background-color: #eeeeee;
        }
        
        .sidenav .collapsible-body>ul:not(.collapsible)>li.active a,
        .sidenav.sidenav-fixed .collapsible-body>ul:not(.collapsible)>li.active a {
            color: rgba(0, 0, 0, 0.87);
        }
        /* =================================================================================
Right sidenav/sidebar
================================================================================= */
        /* right sidenav toggle color */
        
        .ui-app__right-sidenav-toggle.btn-floating,
        .ui-app__right-sidenav-toggle.btn-floating:hover,
        .ui-app__right-sidenav-toggle.btn-floating:focus,
        .ui-app__right-sidenav-toggle.btn-floating:active {
            background-color: #ffffff;
        }
        
        .ui-app__right-sidenav-toggle.btn-floating>i {
            color: #2196f3;
        }
        
        .ui-app__right-sidenav__layout__color-body__sidebar {
            background-color: #f8f8f8;
        }
        /* rightsidenav layout */
        
        .ui-app__right-sidenav__layout__color-body.active:after {
            color: #ffab40;
        }
        /* =================================================================================
Content
================================================================================= */
        /* ============================================= Button ================================== */
        
        .btn,
        .btn-large,
        .btn-small,
        .btn-floating,
        .btn:hover,
        .btn-large:hover,
        .btn-small:hover,
        .btn-floating:hover,
        .btn:focus,
        .btn-large:focus,
        .btn-small:focus,
        .btn-floating:focus,
        .btn:active,
        .btn-large:active,
        .btn-small:active,
        .btn-floating:active {
            background-color: #2196f3;
        }
        
        .btn-flat,
        .btn-flat:hover,
        .btn-flat:focus,
        .btn-flat:active {
            color: #2196f3
        }
        
        .btn.white,
        .btn-large.white,
        .btn-small.white,
        .btn-floating.white,
        .btn:hover.white,
        .btn-large.white:hover,
        .btn-small.white:hover,
        .btn-floating.white:hover,
        .btn.white:focus,
        .btn-large.white:focus,
        .btn-small.white:focus,
        .btn-floating.white:focus,
        .btn.white:active,
        .btn-large.white:active,
        .btn-small.white:active,
        .btn-floating.white:active {
            color: rgba(0, 0, 0, 0.87);
        }
        /* ============================================= Tabs ================================== */
        
        .tabs.tabs-swipe .tab a:hover,
        .tabs.tabs-swipe .tab a.active {
            color: initial;
        }
        
        .tabs .tab a:hover,
        .tabs .tab a.active,
        .tabs .tab a:focus {
            background-color: transparent !important;
        }
        
        .tabs .tab a {
            color: rgba(0, 0, 0, 0.87);
        }
        
        .tabs .tab.disabled a,
        .tabs .tab.disabled a:hover {
            color: #9F9F9F;
        }
        
        .tabs .tab>.active {
            box-shadow: inset 0 -2px #2196f3;
        }
        
        .tabs .tab>a:hover,
        .tabs .tab>a.active {
            color: #2196f3;
        }
        
        .tabs .indicator {
            background-color: #2196f3;
        }
        /* ============================================= Dropdown ================================== */
        
        .dropdown-content {
            color: rgba(0, 0, 0, 0.87);
        }
        
        .dropdown-content li>a,
        .dropdown-content li>span,
        .dropdown-content li:not(.disabled) span>label {
            color: #2196f3;
        }
        /* ======================================== Collections ===================================== */
        
        .collection a.collection-item {
            color: rgba(0, 0, 0, 0.87);
        }
        
        .collection .collection-item.active {
            background-color: #2196f3;
        }
        
        .secondary-content .material-icons {
            color: #2196f3;
        }
        /* ====================================Pagination ========================================================== */
        
        .pagination li.active {
            background-color: #2196f3;
        }
        /* ============================== Preloader
======================================================= */
        
        .progress .determinate,
        .progress .indeterminate,
        .preloader1-spinner,
        .preloader2-double-bounce1,
        .preloader2-double-bounce2,
        .preloader3-spinner>div,
        .preloader4-spinner>div,
        .preloader5-cube-grid .preloader5-cube,
        .preloader6-folding-cube .preloader6-cube:before {
            background-color: #2196f3;
        }
        
        .progress {
            background: #90caf9;
        }
        /* ============================================= Waves ================================== */
        
        .waves-effect.waves-default .waves-ripple {
            background-color: #2196f3;
        }
        /* ============================================= Toasts ================================== */
        
        .toast .toast-action,
        .toast .toast-action:hover,
        .toast .toast-action:focus,
        .toast .toast-action:active {
            color: #ffab40;
        }
        /* ============================================= Form Element ================================== */
        /* checkbox */
        
        [type="checkbox"]:checked+span:not(.lever):before {
            border-right: 2px solid #2196f3;
            border-bottom: 2px solid #2196f3;
        }
        
        [type="checkbox"]:indeterminate+span:not(.lever):before {
            border-right: 2px solid #2196f3;
        }
        
        [type="checkbox"].filled-in:checked+span:not(.lever):after {
            border: 2px solid #2196f3;
            background-color: #2196f3;
        }
        
        [type="checkbox"].filled-in.tabbed:checked:focus+span:not(.lever):after {
            background-color: #2196f3;
            border-color: #2196f3;
        }
        
        [type="checkbox"]:not(:checked):disabled+span:not(.lever):before {
            border: none !important;
            background-color: rgba(0, 0, 0, 0.42) !important;
        }
        
        [type="checkbox"]:checked:disabled+span:before {
            border-right: 2px solid rgba(0, 0, 0, 0.42) !important;
            border-bottom: 2px solid rgba(0, 0, 0, 0.42) !important;
        }
        
        [type="checkbox"]:indeterminate:disabled+span:not(.lever):before {
            border-right: 2px solid rgba(0, 0, 0, 0.42) !important;
            background-color: transparent !important;
        }
        
        [type="checkbox"].filled-in:disabled:not(:checked)+span:not(.lever):before {
            background-color: transparent !important;
            border: 2px solid transparent !important;
        }
        
        [type="checkbox"].filled-in:disabled:not(:checked)+span:not(.lever):after {
            border-color: transparent !important;
            background-color: #949494 !important;
        }
        
        [type="checkbox"].filled-in:disabled:checked+span:not(.lever):before {
            background-color: transparent !important;
        }
        
        [type="checkbox"].filled-in:disabled:checked+span:not(.lever):after {
            background-color: #949494 !important;
            border-color: #949494 !important;
        }
        /*radio button*/
        
        [type="radio"]:checked+span:after,
        [type="radio"].with-gap:checked+span:before,
        [type="radio"].with-gap:checked+span:after {
            border: 2px solid #2196f3;
        }
        
        [type="radio"]:checked+span:after,
        [type="radio"].with-gap:checked+span:after {
            background-color: #2196f3;
        }
        
        [type="radio"].with-gap:disabled:checked+span:before {
            border: 2px solid rgba(0, 0, 0, 0.42) !important;
        }
        
        [type="radio"].with-gap:disabled:checked+span:after {
            border: none;
            background-color: rgba(0, 0, 0, 0.42) !important;
        }
        
        [type="radio"]:disabled:not(:checked)+span:before,
        [type="radio"]:disabled:checked+span:before {
            background-color: transparent !important;
            border-color: rgba(0, 0, 0, 0.42) !important;
        }
        
        [type="radio"]:disabled+span {
            color: rgba(0, 0, 0, 0.42) !important;
        }
        
        [type="radio"]:disabled:not(:checked)+span:before {
            border-color: rgba(0, 0, 0, 0.42) !important;
        }
        
        [type="radio"]:disabled:checked+span:after {
            background-color: rgba(0, 0, 0, 0.42) !important;
            border-color: #949494 !important;
        }
        /* switch */
        
        .switch label input[type=checkbox]:checked+.lever {
            background-color: #64b5f6;
        }
        
        .switch label input[type=checkbox]:checked+.lever:after {
            background-color: #2196f3;
        }
        
        .switch label .lever:before {
            background-color: #bbdefb;
        }
        
        input[type=checkbox]:checked:not(:disabled)~.lever:active::before,
        input[type=checkbox]:checked:not(:disabled).tabbed:focus~.lever::before {
            -webkit-transform: scale(2.4) !important;
            transform: scale(2.4) !important;
            background-color: #bbdefb;
        }
        
        input[type=checkbox]:not(:disabled)~.lever:active:before,
        input[type=checkbox]:not(:disabled).tabbed:focus~.lever::before {
            -webkit-transform: scale(2.4) !important;
            transform: scale(2.4) !important;
            background-color: rgba(0, 0, 0, 0.08);
        }
        
        .switch input[type=checkbox][disabled]+.lever {
            cursor: default !important;
            background-color: rgba(0, 0, 0, 0.12) !important;
        }
        
        .switch label input[type=checkbox][disabled]+.lever:after,
        .switch label input[type=checkbox][disabled]:checked+.lever:after {
            background-color: #949494 !important;
        }
        /* html5 slider */
        
        input[type=range]+.thumb {
            background-color: #2196f3;
        }
        
        input[type=range]::-webkit-slider-thumb {
            background-color: #2196f3;
        }
        
        input[type=range]::-moz-range-thumb {
            background-color: #2196f3;
        }
        
        input[type=range]::-ms-thumb {
            background-color: #2196f3;
        }
        
        .keyboard-focused input[type=range]:focus:not(.active)::-webkit-slider-thumb {
            -webkit-box-shadow: 0 0 0 10px #bbdefb;
            box-shadow: 0 0 0 10px #bbdefb;
        }
        
        .keyboard-focused input[type=range]:focus:not(.active)::-moz-range-thumb {
            box-shadow: 0 0 0 10px #bbdefb;
        }
        
        .keyboard-focused input[type=range]:focus:not(.active)::-ms-thumb {
            box-shadow: 0 0 0 10px #bbdefb;
        }
        /* picker (date and time)*/
        
        .datepicker-date-display,
        .datepicker-table td.is-selected,
        .timepicker-digital-display {
            background-color: #2196f3;
        }
        
        .datepicker-cancel,
        .datepicker-clear,
        .datepicker-today,
        .datepicker-done,
        .timepicker-close,
        .datepicker-table td.is-today {
            color: #2196f3;
        }
        
        .timepicker-canvas line {
            stroke: #2196f3;
        }
        
        .timepicker-canvas-bearing {
            fill: #2196f3;
        }
        
        .timepicker-canvas-bg {
            fill: #2196f3;
        }
        
        .datepicker-day-button:focus,
        .timepicker-tick.active,
        .timepicker-tick:hover {
            background-color: #90caf9;
        }
        /* select */
        
        .select-wrapper input.select-dropdown:focus {
            border-bottom: 1px solid #2196f3;
        }
        /* input field */
        
        .chips.focus,
        input:not([type]):focus:not([readonly]),
        input[type=text]:not(.browser-default):focus:not([readonly]),
        input[type=password]:not(.browser-default):focus:not([readonly]),
        input[type=email]:not(.browser-default):focus:not([readonly]),
        input[type=url]:not(.browser-default):focus:not([readonly]),
        input[type=time]:not(.browser-default):focus:not([readonly]),
        input[type=date]:not(.browser-default):focus:not([readonly]),
        input[type=datetime]:not(.browser-default):focus:not([readonly]),
        input[type=datetime-local]:not(.browser-default):focus:not([readonly]),
        input[type=tel]:not(.browser-default):focus:not([readonly]),
        input[type=number]:not(.browser-default):focus:not([readonly]),
        input[type=search]:not(.browser-default):focus:not([readonly]),
        textarea.materialize-textarea:focus:not([readonly]) {
            border-bottom: 1px solid #2196f3;
            -webkit-box-shadow: 0 1px 0 0 #2196f3;
            box-shadow: 0 1px 0 0 #2196f3;
        }
        
        input:not([type]):focus:not([readonly])+label,
        input[type=text]:not(.browser-default):focus:not([readonly])+label,
        input[type=password]:not(.browser-default):focus:not([readonly])+label,
        input[type=email]:not(.browser-default):focus:not([readonly])+label,
        input[type=url]:not(.browser-default):focus:not([readonly])+label,
        input[type=time]:not(.browser-default):focus:not([readonly])+label,
        input[type=date]:not(.browser-default):focus:not([readonly])+label,
        input[type=datetime]:not(.browser-default):focus:not([readonly])+label,
        input[type=datetime-local]:not(.browser-default):focus:not([readonly])+label,
        input[type=tel]:not(.browser-default):focus:not([readonly])+label,
        input[type=number]:not(.browser-default):focus:not([readonly])+label,
        input[type=search]:not(.browser-default):focus:not([readonly])+label,
        textarea.materialize-textarea:focus:not([readonly])+label {
            color: #2196f3;
        }
        
        .input-field .prefix.active {
            color: #2196f3;
        }
        /* ========================================= Typography ================================ */
        /* blockquote left border*/
        
        blockquote {
            border-left: 5px solid #2196f3;
        }
        /* code color with class default */
        
        code.default {
            color: #d32f2f;
        }
        /* blockquote, code and pre with language background color */
        
        blockquote,
        code.default,
         :not(pre)>code[class*="language-"],
        pre[class*="language-"] {
            background-color: #eeeeee;
        }
        /* ========================================= Card ================================ */
        
        .card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating),
        .card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating):hover,
        .card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating):active,
        .card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating):focus {
            color: #ffab40;
        }
        /* ============================================= carousel ================================== */
        
        .carousel .indicators .indicator-item.active {
            background-color: #ffab40
        }
        
        .carousel .indicators .indicator-item {
            background-color: #fff3e0;
        }
        /* ============================================= SweetAlert ================================== */
        
        .swal-button,
        .swal-button:focus {
            color: #fff;
            border: none;
            box-shadow: none;
        }
        
        .swal-button,
        .swal-button:focus,
        .swal-button:active,
        .swal-button:not([disabled]):hover {
            background-color: #2196f3;
        }
        
        .swal-button--cancel,
        .swal-button--cancel:focus {
            color: #555;
            background-color: #efefef;
            box-shadow: none;
        }
        
        .swal-button--cancel:not([disabled]):hover {
            background-color: #e8e8e8;
        }
        
        .swal-button--cancel:active {
            background-color: #d7d7d7;
        }
        
        .swal-button--danger,
        .swal-button--danger:focus {
            background-color: #d32f2f;
            box-shadow: none;
        }
        
        .swal-button--danger:not([disabled]):hover {
            background-color: #df4740;
        }
        
        .swal-button--danger:active {
            background-color: #cf423b;
        }
        /* ============================================= Range Slider
 ================================== */
        
        .irs-from,
        .irs-to,
        .irs-single {
            background-color: #2196f3;
        }
        
        .irs-from:after,
        .irs-to:after,
        .irs-single:after {
            border-top-color: #2196f3;
        }
        /* ============================================= Grid
 ================================== */
        
        .ui-app__grid-demo .col {
            border: 1px solid #e8e8e8;
            background-color: #2196f3;
        }
        /* ============================================= FeatureDiscovery
 ================================== */
        
        .tap-target {
            background-color: #2196f3;
            color: #ffffff;
        }
        /* ============================================= DataTable ================================== */
        
        table.dataTable tbody tr.group td {
            background: #eeeeee;
        }
        
        .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
            background: #2196f3;
            box-shadow: inset 0 0 3px #2196f3;
            border: 1px solid #2196f3;
        }
        
        .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
            box-shadow: inset 0 0 3px #111;
        }
        /* ============================================= Pages (login,signup,....)================================== */
        /* navbar */
        
        .form-brand-logo {
            color: #2196f3;
        }
        
        .btn.ui-app__wrapper__navbar-form__signup {
            background: #ffab40 !important;
        }
        /* 404 - Page not found!*/
        
        .error-code {
            color: #ffab40;
        }