/*
Theme Name: Omni Modo CRM
Author: PLAWINET
Author URI: http://plawi.net/
Version: 2.0.0
*/

/* =Theme colors
----------------------------------------------- */
/*-- Leitmotiv --*/
#sidebar, #sidebar > nav, .navbar { background: #003c6c }

/*-- Background 2 --*/
#sidebar .nav > .active > a, #sidebar .nav > li > a:hover, #sidebar .nav > li > a:focus, .nav ul > .active > a, .nav ul > .active > a:hover, .nav ul > .active > a:focus, .nav ul > li > a:hover, .nav ul > li > a:focus, .nav > .submenu:hover > a, .submenu.open > a, .submenu.open > a:hover, .submenu.open > a:focus { background: #0078d7 }

/*-- Background 3 --*/
.nav ul { background: #268cdd }

/*-- Background red --*/
.logout { background: #ff0000 }

/*-- Color gray light --*/
/*.navbar .nav > li > a:hover .fa, .navbar-brand:hover { color: #dcdcdc !important }*/

/*-- Color gray dark --*/
footer *, .help-block, .text-muted, .breadcrumb > li > a { color: #888 !important }

/* =Global styles
----------------------------------------------- */
html, body { height: 100%; background: #f5f5f5 }

body { overflow-x: hidden; font-weight: 300 }
    body * { outline: none !important }

body.stop-scroll { overflow: hidden; position: fixed; width: 100% }

footer { position: absolute; right: 0; bottom: 0; left: 0; padding: 19px 0 0; height: 55px; background: #fff; font-size: 12px; border-top: 1px solid #dcdcdc }
footer span + span:before { content: "|"; margin: 0 3px }

blockquote { font-size: 14px }

#wrap { position: relative; width: 100%; height: auto; min-height: 100% }

#sidebar-top a, #sidebar *, .navbar, .navbar a { color: #fff }

.navbar { border: 0; margin: 0 }
.navbar-right { float: right }
.navbar-nav { margin: 0 }
    .navbar-nav > li { float: left }
        .navbar-nav > li > a { padding-bottom: 18.5px; padding-top: 18.5px }
.navbar, .nav { font-size: 13px }
.navbar-header { float: none }
    .navbar-header h1 { margin: 0 }
.navbar-toggle { display: block; float: left; margin: 0; padding: 21.5px 15px; border: 0; border-radius: 0 }
    .navbar-toggle .icon-bar { width: 15px; background: #fff; border-radius: 0 }
    .navbar-toggle .icon-bar + .icon-bar { margin-top: 3px }
.navbar-brand { margin: 0; padding: 0 7px; max-width: 185px; font-size: 15px; font-weight: 600 }
    .navbar-brand > img { height: 100%; max-height: 30px; -webkit-transform: inherit; transform: inherit }
.navbar-brand, .navbar-brand > img { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center }

.badge { position: absolute; z-index: 1; top: 8px; left: 22px; padding: 3px 5px; font-size: 10px }

.huge { font-size: 40px }

.form-control, .btn { height: 35px }

.form-file { padding: 0 }
    .form-file input { padding: 5px; width: 100% }

select { -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer }
.select-style { position: relative }
    .select-style:after { content: ""; position: absolute; top: 16px; right: 6px; border-width: 5px 4px 0; border-style: solid; border-color: #888 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0); pointer-events: none }
.select-style-inline { display: inline-block }

.btn { margin-bottom: 4px; padding-top: 7px; padding-bottom: 7px }
    .btn > span { padding-left: 5px }

.btn-block + .btn-block { margin-top: 4px }

.btn-lnk { color: #fff !important }

.btn-notification{margin-right: 10px; height: 37px}
.btn-up { display: none; position: fixed; z-index: 1039; right: 5px; bottom: 60px; margin: 0; padding: 0; width: 35px; color: #fff !important; line-height: 32px; border-radius: 0 }
    .btn-up:before { content: ""; display: block; position: absolute; z-index: -1; top: -1px; right: -1px; bottom: -1px; left: -1px; background-color: rgba(0, 0, 0, 0.15); border-radius: 4px }
    .btn-up:hover:before, .btn-up:focus:before { background-color: rgba(0, 0, 0, 0.25) }

.notification-info{display: inline-block; max-width: 60%; vertical-align: middle}

.has-error span.selection span span:first-child {border: 1px solid #a94442; border-radius: 4px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075)}

/** buttons collapse */
.btn[data-toggle="collapse"].collapsed > i:last-child, .btn[data-toggle="collapse"].btn > i:first-child { display: none }
.btn[data-toggle="collapse"].collapsed > i:first-child { display: block }
.btn[data-toggle="collapse"] { padding: 0; width: 35px }
.btn[data-toggle="collapse"] > span { padding: 0 }

.modal-footer .btn { margin: 0 }

.alert-dismissable .close, .alert-dismissible .close { top: 0 }

.pagination { margin: 5px 0 0 }

.col-right { text-align: right }

.table { margin-bottom: 0 }
.table + .table { margin-top: 18px }
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { vertical-align: middle }
.table > tfoot > tr > th > input { font-weight: 300 }
.table-footer-text { margin-top: 8px }
.table, .table .form-control { width: 100% !important }

.progress { margin-bottom: 0 }
.progress, .progress-bar { display: block }

.breadcrumb { display: inline-block; margin: 0; padding-top: 10px }
.breadcrumb > li + li:before { padding: 0 0 0 2px }

div.list-group-item:hover {background-color: #f5f5f5; text-decoration: none; cursor: pointer}
div.list-group-item a:hover, div.list-group-item a:focus {text-decoration: none}

/** helper classes */
.space-vertical { margin-top: 10px; margin-bottom: 10px }

.img-border { border: 1px solid #dcdcdc }

/* =Select2
----------------------------------------------- */
.select2-selection { height: 35px !important; border-color: #dcdcdc !important; transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none }
.select2-selection .select2-selection__rendered { padding: 0 12px !important }
.select2-selection__choice { line-height: 20px }
.select2-container { width: 100% !important; display: block }
.select2-container--focus .select2-selection, .select2-container--open .select2-search__field { border-color: #66afe9 !important; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6) }
.select2-container--default .select2-selection--single .select2-selection__arrow { top: 0; bottom: 0; margin: auto }
.select2::-webkit-input-placeholder { line-height: 32px !important }
.select2::-moz-placeholder { line-height: 32px !important }
.select2:-ms-input-placeholder { line-height: 32px !important }
.select2:-moz-placeholder { line-height: 32px !important }
.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 32px !important }
.select2-container .select2-selection--multiple .select2-search__field { line-height: 24px }
.select2-container .select2-selection--multiple { height: auto !important }
.select2-container--default .select2-selection--multiple .select2-selection__choice { margin-top: 6px }
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-width: 5px 4px 0; border-color: #888 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) }

/* =Sign-in
----------------------------------------------- */
body.module-auth #content, body.module-auth footer { margin-left: 0 }
body.module-auth #content-main { padding: 15px 0 }
    body.module-auth #content-main .header-bar { text-align: center }
        body.module-auth #content-main .header-bar h1 { margin-right: 0 }
body.module-auth .panel-body { padding: 15px }
body.module-auth .navbar .navbar-brand { -webkit-justify-content: center; justify-content: center; float: none; margin: auto; font-size: 15px; font-weight: 600 }
    body.module-auth .navbar .navbar-brand > img { margin: auto }
body.module-auth #sidebar-top { float: none }

.form-signin { margin: 20px auto 0; max-width: 330px }

/* =Sidebar
----------------------------------------------- */
#sidebar-top { position: relative; z-index: 1049; float: left }
.nav ul { position: relative; float: none; margin: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; display: none; min-width: 160px }
    .nav ul > .active > a { font-weight: 600; background-color: transparent }
    .nav ul > li > a { display: block; padding: 8px 15px; font-weight: normal; white-space: nowrap; text-decoration: none; clear: both }
    .slide-menu.out .nav ul.sub-submenu > li > a, .submenu.active ul > li > a, .slide-menu.in .submenu:hover ul.sub-submenu > li > a { padding-left: 41px }
    .slide-menu.in .submenu.active { overflow: hidden }
        .slide-menu.in .submenu.active ul.sub-submenu > li > a { padding-left: 67px }
    .slide-menu.out .nav ul > li > a { padding-left: 15px }

#sidebar { position: absolute; z-index: 1040; top: 0; left: 0; padding-top: 55px; min-height: 100% }
    #sidebar ul { list-style: none; padding: 0; margin: 0 }
    #sidebar .nav { margin-bottom: 55px }
        #sidebar .nav > li > a { padding-left: 12px; padding-right: 12px; overflow: hidden; white-space: nowrap }
            #sidebar .nav > li > a > .nav-name, .navbar .nav-name { margin-left: 10px }
            #sidebar .nav > li .fa { width: 19px; text-align: center }

.sidebar-sticky:not(.sidebar-sticky-false) { position: fixed !important; padding-top: 0 !important }

.slide-menu.in { width: 250px !important }
.slide-menu.in + #content, .slide-menu.in + #content + footer { margin-left: 250px }
.slide-menu.out { width: 45px !important }
.slide-menu.out + #content, .slide-menu.out ~ footer { margin-left: 45px }
.slide-menu.in .submenu.open ul, .slide-menu.out .submenu.open > ul, .slide-menu.out .submenu.active.open > ul { display: block; left: 100%; position: absolute; top: 0 }
.slide-menu.in .submenu.active ul { position: static }
.slide-menu.in .submenu.active ul, ul.sub-submenu { display: block }
.slide-menu.in .submenu.open ul { display: none }

/* =Content
----------------------------------------------- */
#content { position: relative; padding-bottom: 55px; min-height: 100% }
    #content .navbar .nav > li > a:hover .nav-name { text-decoration: underline }
#content-main { padding: 25px 15px 30px }
#content-main .header-bar { margin-bottom: 20px; overflow: hidden }
#content-main .header-bar h1 { display: inline-block; margin: 8px 10px 0 0; font-size: 17px; font-weight: 600 }

/* =Panels
----------------------------------------------- */
.panel { box-shadow: none; overflow: hidden }
.panel-heading { padding: 5px 15px }
.panel-title { padding: 8px 0px; font-size: 13px; font-weight: 600 }
.panel-body { line-height: 20px }
.panel-footer { color: #888 }
.panel-heading, .panel-footer { border-radius: 0 }
.panel-heading .btn { margin: 0 }
.panel-heading .btn > span { display: none }

/* =Gallery
----------------------------------------------- */
.gallery {}
    .gallery .gallery-item { position: relative; margin: 15px 0 }
        .gallery .gallery-item .btn { position: absolute; top: 5px; right: 5px; margin: 0; opacity: 0 }
        .gallery .gallery-item:hover .btn { opacity: 1 }
/* =Data Tables
----------------------------------------------- */
#data-tables {}

table.dataTable thead .sorting:after { opacity: 1 }
table.dataTable thead th.sorting:after, table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after { color: #ddd; opacity: 1 }
table.dataTable thead th.sorting_desc:after { top: -3px !important }
table.dataTable thead th.sorting_asc:after { top: 6px !important }
table.dataTable thead th.sorting_desc:after, table.dataTable thead th.sorting_asc:after { color: #aaa }
table.table thead th.sorting:after, table.table thead th.sorting_asc:after, table.table thead th.sorting_desc:after { top: 0; bottom: 0; margin: auto; height: 20px }
table.table-bordered.dataTable tfoot th { border-bottom-width: 0 }

#data-table_wrapper > .row { margin: 0 }
    #data-table_wrapper > .row [class|="col"] { padding: 0 }

div.dataTables_paginate li.first > a, div.dataTables_paginate li.previous > a { padding-left: 12px }
div.dataTables_paginate li.next > a, div.dataTables_paginate li.last > a { padding-right: 12px }
    div.dataTables_paginate li.next a:after, div.dataTables_paginate li.previous a:before { display: none }

/** Data Tables Bootstrap */
div.dataTables_wrapper div.dataTables_length label, div.dataTables_wrapper div.dataTables_filter label { font-weight: 600 }
div.dataTables_wrapper div.dataTables_info { padding-top: 15px; color: #888 }
div.dataTables_wrapper div.dataTables_paginate ul.pagination { margin: 9px 0 0 }
div.dataTables_wrapper div.dataTables_processing { top: 120px }

select.input-sm { padding-right: 20px; width: auto !important; height: 35px; line-height: normal }

/* =Datapicker
----------------------------------------------- */
.ui-widget-content { display: none; margin-top: 2px; background: #fff; border: 1px solid #dcdcdc; border-radius: 4px; overflow: hidden }
.ui-widget-header { padding: 10px 15px; background: #dcdcdc; color: #333 }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; text-align: center; border-radius: 4px; cursor: pointer }
.ui-icon { display: block; width: 18px; height: 18px; overflow: hidden; text-indent: -99999px }
.ui-datepicker .ui-datepicker-next { right: 15px }
.ui-datepicker .ui-datepicker-title { margin: 0 30px; text-align: center }
.ui-datepicker th { padding: 4px 6px; text-align: center }
.ui-datepicker td { padding: 3px }
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: 4px 6px; text-align: right; text-decoration: none; border-radius: 4px }
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { background: #dcdcdc; color: #333 }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background: #268cdd; color: #fff }
.ui-datepicker-header a { color: #333; text-decoration: none }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { background: #0078d7; color: #fff }

/* -- Font Awesome -- */
.ui-datepicker-prev:before, .ui-datepicker-next:before { display: inline-block; font-family: FontAwesome; font-feature-settings: normal; font-kerning: auto; font-language-override: normal; font-size-adjust: none; font-stretch: normal; font-style: normal; font-synthesis: weight style; font-variant: normal; font-weight: normal; line-height: 1; text-rendering: auto; position: absolute; top: 2px; left: 0; width: 100% }
.ui-datepicker-prev:before { content: "\f104" }
.ui-datepicker-next:before { content: "\f105" }

/* =Transition
----------------------------------------------- */
a, .btn, .btn-up:before { -webkit-transition: all 0.1s; transition: all 0.1s }
#sidebar, #content, footer, #sidebar .nav-name { -webkit-transition: all 0.2s; transition: all 0.2s }
#sidebar { -webkit-transition-property: width; transition-property: width }
#content, footer { -webkit-transition-property: margin-left; transition-property: margin-left }
#sidebar .nav-name { -webkit-transition-property: opacity; transition-property: opacity }
.btn-up, .navbar-brand { -webkit-transition: none; transition: none }
.btn-up:before { -webkit-transition-property: background-color; transition-property: background-color }

/* =Animations
----------------------------------------------- */
@-webkit-keyframes fade-in-left {
    from { opacity: 0; left: 0 }
    to { opacity: 1; left: 100% }
}
@keyframes fade-in-left {
    from { opacity: 0; left: 0 }
    to { opacity: 1; left: 100% }
}

/* =Media queries
----------------------------------------------- */
@media (max-width: 1400px){
		.panel-notification > .btn-notification, .panel-notification > a, .panel-notification > span { display: block}
    	.panel-notification > a { margin-bottom: 10px; max-width: 100% }
    	.panel-notification > .pull-right { float: none !important; text-align: left }
}
@media (max-width: 991px) {
    #sidebar { width: 45px }
    #content, footer { margin-left: 45px }
	.gallery .gallery-item .btn { opacity: 1 }
}
@media (max-width: 767px) {
    footer { height: 80px }
    #content { padding-bottom: 80px }
    #sidebar { width: 0; overflow: hidden !important }
    .slide-menu.in { position: fixed !important }
    .slide-menu.in > nav { position: absolute; width: 100%; height: calc(100% - 55px); overflow-y: auto }
    .slide-menu.out { width: 0 !important }
    #content, footer { margin-left: 0 !important }
    .slide-menu.in { width: 100% !important }
    .user .nav-name { display: none }
    .slide-menu.in .nav-name { display: inline-block !important }
    .navbar-brand { font-size: 13px }
    #content-main { padding: 15px 0 }
    .form-inline .form-control { display: inline-block; width: auto }
    .center-sm { text-align: center }
    .center-sm + .center-sm { margin-top: 10px }
    .btn > span { display: none }
	.btn-up { bottom: 5px }
    .breadcrumb { display: block; clear: both }
	.gallery .gallery-item .btn { top: -10px; right: -10px }
    .table-responsive { padding: 10px }
}
@media (max-width: 479px) {
	.navbar-brand { padding: 0 3px; max-width: 145px; font-size: 13px }
    #content { padding-bottom: 85px }
    footer { padding: 14px 0 0; height: 85px }
    footer span { display: block }
    footer span + span { margin-top: 3px }
    footer span + span:before { display: none }
    .center-sm + .center-sm { margin-top: 3px }
    .pagination > li > a, .pagination > li > span { padding: 6px !important }
	.gallery .gallery-item .btn { top: -7px; right: -7px; padding: 0; width: 25px; height: 25px; font-size: 11px; line-height: 23px }
    .panel-heading .btn { padding: 7px 8px }
}
@media (min-width: 768px) {
    .slide-menu.out .nav-name { opacity: 0 }
    .slide-menu.in .nav-name { opacity: 1 !important }
}
@media (min-width: 992px) {
    #sidebar { width: 250px }
    #content, footer { margin-left: 250px }
    .slide-menu.in .nav > .submenu:hover > ul, .slide-menu.out .nav > .submenu:hover > ul, .slide-menu.out .nav > .submenu.active:hover > ul { display: block; left: 100%; position: absolute; top: 0 }
	#sidebar > nav { position: absolute; width: 100%; min-height: calc(100% - 55px) }
    #sidebar .nav > .submenu > ul { z-index: -1 }
    #sidebar .nav > .submenu:not(.active):hover > ul, .slide-menu.out .nav > .submenu:hover > ul { -webkit-animation-name: fade-in-left; animation-name: fade-in-left; -webkit-animation-duration: 0.2s; animation-duration: 0.2s }
    .slide-menu.in .submenu.active:hover ul { position: static }
    .slide-menu.in .submenu.active ul { display: block }
}
@media (min-width: 768px) and (max-width: 991px) {
    #sidebar .nav-name { opacity: 0 }
}
