/*===================================================================================================

 - TEMPLATE : PROTOTIPO
 - DESCRIPTION : MODERN BOOTSTRAP 4 ADMIN TEMPLATE - FULLY RESPONSIVE
 - AUTHOR : SNAZZYSHEET (http://www.snazzysheet.com/)
 - VERSION : 1.0
 - FILE : MAIN CSS

=====================================================================================================

 - GENERAL CUSTOMISATION
      - GENERAL
      - TYPOGRAPHY
      - TEXT COLOR
      - BACKGROUND COLOR
      - HEADING
      - DISPLAY HEADING
      - IMAGES
 - GRID
 - WRAPPER
      - WRAPPER
      - WRAPPER LOADER
      - WRAPPER TOP
      - WRAPPER CONTENT
      - WRAPPER LEFT
      - WRAPPER RIGHT
      - WRAPPER FOOTER
      - WRAPPER SLIDE
 - LAYOUT
      - LAYOUT BOX
      - HEADER FIXED
      - SIDE FIXED
 - NAVBAR
 - SIDEBAR
 - FOOTER
 - CONTENT
      - TABLES
 - COMPONENTS
      - ALERTS
      - BADGES
      - BREADCRUMB
      - BUTTONS
      - CARD
      - CANVAS
      - CURRENT TIME
      - DROPDOWNMENU
      - FORMS
      - LISTS
      - LOAD SPINNER
      - Nav
      - PROGRESS
      - SECTION
      - TIMELINE
      - TOOLTIP
 - UTILITIES
      - BORDER
      - FILTER
      - ICON
      - SNAZZY FILE ICONS
 - BOX
      - ACCOUNT
      - ACTIVITIES
      - CHAT
      - FILE
      - MAIL
      - MESSAGE
      - NOTES
      - NOTIFICATION
      - PLAN
      - PRODUCT
      - PROFILE
      - TASK
      - TIMELINE
      - WEATHER
 - PLUGINS
      - PROTOTIPO TIMEPICKER
      - PROTOTIPO CALENDAR
 - CUSTOM PLUGINS
      - OVERLAYSCROLLBARS
      - JVECTORMAP
      - SUMMERNOTE
      - NOTIFY
      - SUMMOSELECT
      - BOOTSTRAP SLIDE

===================================================================================================*/


/*===================================================================================================
- GENERAL CUSTOMISATION -----------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- GENERAL ----------------------------------------
------------------------------------------------*/

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Lato", sans-serif;
    font-size: 12px;
    font-weight: normal;
    /*     overflow-y: auto;
    overflow-x: hidden; */
}

/*------------------------------------------------
- TYPOGRAPHY -------------------------------------
------------------------------------------------*/

@font-face {
    font-family: "Lato";
    src: url("assets/fonts/Lato.woff2");
}

.font-montserrat{
    font-family: "Montserrat", sans-serif;
}

.font-julius-sans-one{
    font-family: "Julius Sans One", sans-serif;
}

p {
    font-size: 12px;
}

p > .dropcap{
    float: left;
    font-weight: 600;
    font-size: 34px;
    vertical-align: baseline !important;
    line-height: 36px;
    padding-right: 5px;
}

a{
    color: #888fa9;
}

a:hover, a:focus {
    color: #767b95;
}

a, a:focus, a:hover, a:active {
    outline: 0!important;
    text-decoration: none;
}

small, .small {
    font-size: 75%;
}

.lead {
    font-size: 16px;
}

.mark, mark {
    background-color: rgba(245, 44, 69, 0.18);
}

.blockquote{
    font-size: 14px;
}

code{
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.2);
    box-shadow: 0 1px 1px rgba(0,0,0,.2);
    padding: 2px 4px;
    background: #fff;
}

/*------------------------------------------------
- TEXT COLOR -------------------------------------
------------------------------------------------*/

.text-primary {
    color: #4b5066 !important;
}

.text-secondary {
    color: #b6b3aa !important;
}

.text-info {
    color: #888fa9 !important;
}

.text-success {
    color: #319d24 !important;
}

.text-warning {
    color: #ff7400 !important;
}

.text-danger {
    color: #ef2b41 !important;
}

.text-muted {
    color: rgba(0,0,0,0.5);
}

.text-light {
    color: #f4f1e7 !important;
}

.text-dark {
    color: #464646 !important;
}

.text-white {
    color: #fff !important;
}

.text-black {
    color: #000 !important;
}

.text-red {
    color: #F44336 !important;
}

.text-pink {
    color: #E91E63 !important;
}

.text-purple {
    color: #9C27B0 !important;
}

.text-deep-purple {
    color: #673AB7 !important;
}

.text-indigo {
    color: #3F51B5 !important;
}

.text-blue {
    color: #2196F3 !important;
}

.text-light-blue {
    color: #03A9F4 !important;
}

.text-cyan {
    color: #00BCD4 !important;
}

.text-teal {
    color: #009688 !important;
}

.text-green {
    color: #4CAF50 !important;
}

.text-light-green {
    color: #8BC34A !important;
}

.text-lime {
    color: #CDDC39 !important;
}

.text-yellow {
    color: #FFEB3B !important;
}

.text-amber {
    color: #FFC107 !important;
}

.text-orange {
    color: #FF9800 !important;
}

.text-deep-orange {
    color: #FF5722 !important;
}

.text-brown {
    color: #795548 !important;
}

.text-grey {
    color: #9E9E9E !important;
}

.text-blue-grey {
    color: #607D8B !important;
}

a.text-primary:hover, a.text-primary:focus {
    color: #313649 !important;
}

a.text-secondary:hover, a.text-secondary:focus {
    color: #b7b4ab !important;
}

a.text-info:hover, a.text-info:focus {
    color: #767b95 !important;
}

a.text-success:hover, a.text-success:focus {
    color: #2d8822 !important;
}

a.text-warning:hover, a.text-warning:focus {
    color: #eb7400 !important;
}

a.text-danger:hover, a.text-danger:focus {
    color: #db2a3e !important;
}

a.text-muted:hover, a.text-muted:focus {
    color: rgba(0, 0, 0, 0.7) !important;
}

a.text-light:hover, a.text-light:focus {
    color: rgba(244, 241, 231, 0.7) !important;
}

a.text-dark:hover, a.text-dark:focus {
    color: #323232 !important;
}

a.text-white:hover, a.text-white:focus {
    color: #ebebeb !important;
}

a.text-black:hover, a.text-black:focus {
    color: #888 !important;
}

a.text-red:hover, a.text-red:focus {
    color: #EF5350 !important;
}

a.text-pink:hover, a.text-pink:focus {
    color: #EC407A !important;
}

a.text-purple:hover, a.text-purple:focus {
    color: #AB47BC !important;
}

a.text-deep-purple:hover, a.text-deep-purple:focus {
    color: #7E57C2 !important;
}

a.text-indigo:hover, a.text-indigo:focus {
    color: #5C6BC0 !important;
}

a.text-blue:hover, a.text-blue:focus {
    color: #42A5F5 !important;
}

a.text-light-blue:hover, a.text-light-blue:focus {
    color: #29B6F6 !important;
}

a.text-cyan:hover, a.text-cyan:focus {
    color: #26C6DA !important;
}

a.text-teal:hover, a.text-teal:focus {
    color: #26A69A !important;
}

a.text-green:hover, a.text-green:focus {
    color: #66BB6A !important;
}

a.text-light-green:hover, a.text-light-green:focus {
    color: #9CCC65 !important;
}

a.text-lime:hover, a.text-lime:focus {
    color: #D4E157 !important;
}

a.text-yellow:hover, a.text-yellow:focus {
    color: #FFEE58 !important;
}

a.text-amber:hover, a.text-amber:focus {
    color: #FFCA28 !important;
}

a.text-orange:hover, a.text-orange:focus {
    color: #FFA726 !important;
}

a.text-deep-orange:hover, a.text-deep-orange:focus {
    color: #FF7043 !important;
}

a.text-brown:hover, a.text-brown:focus {
    color: #8D6E63 !important;
}

a.text-grey:hover, a.text-grey:focus {
    color: #BDBDBD !important;
}

a.text-blue-grey:hover, a.text-blue-grey:focus {
    color: #78909C !important;
}

/*------------------------------------------------
- BACKGROUND COLOR -------------------------------
------------------------------------------------*/

.bg-primary {
    background-color: #4b5066 !important;
}

.bg-secondary {
    background-color: #b6b3aa !important;
}

.bg-info {
    background-color: #888fa9 !important;
}

.bg-success {
    background-color: #319d24 !important;
}

.bg-warning {
    background-color: #ff7400 !important;
}

.bg-danger {
    background-color: #ef2b41 !important;
}

.bg-light {
    background-color: #f4f1e7 !important;
}

.bg-dark {
    background-color: #464646 !important;
}

.bg-white {
    background-color: #fff !important;
}

.bg-black {
    background-color: #000 !important;
}

.bg-red {
    background-color: #F44336 !important;
}

.bg-pink {
    background-color: #E91E63 !important;
}

.bg-purple {
    background-color: #9C27B0 !important;
}

.bg-deep-purple {
    background-color: #673AB7 !important;
}

.bg-indigo {
    background-color: #3F51B5 !important;
}

.bg-blue {
    background-color: #2196F3 !important;
}

.bg-light-blue {
    background-color: #03A9F4 !important;
}

.bg-cyan {
    background-color: #00BCD4 !important;
}

.bg-teal {
    background-color: #009688 !important;
}

.bg-green {
    background-color: #4CAF50 !important;
}

.bg-light-green {
    background-color: #8BC34A !important;
}

.bg-lime {
    background-color: #CDDC39 !important;
}

.bg-yellow {
    background-color: #FFEB3B !important;
}

.bg-amber {
    background-color: #FFC107 !important;
}

.bg-orange {
    background-color: #FF9800 !important;
}

.bg-deep-orange {
    background-color: #FF5722 !important;
}

.bg-brown {
    background-color: #795548 !important;
}

.bg-grey {
    background-color: #9E9E9E !important;
}

.bg-blue-grey {
    background-color: #607D8B !important;
}

.bg-first {
    background-color: #ef2b41 !important;
}

.bg-second {
    background-color: #ffffff !important;
}

.bg-third {
    background-color: #ffffff !important;
}

.bg-fourth {
    background-color: #FFFFFF !important;
}
.bg-fifth {
    background-color: #ffffff !important;
}

/*------------------------------------------------
- HEADING ----------------------------------------
------------------------------------------------*/

h1 ,.h1 ,h2 ,.h2, h3, .h3, h4, .h4,h5 ,.h5 ,h6 ,.h6 {
    font-weight: bold;
    letter-spacing: 1px;
}

h1, h2 ,h3 ,h4 ,h5 ,h6 {
    font-family: "Lato", sans-serif;
}

h1{
    font-size: 32px;
}
.h1{
    font-size: 32px !important;
}

h2{
    font-size: 28px;
}

.h2{
    font-size: 28px !important;
}

h3{
    font-size: 24px;
}
.h3 {
    font-size: 24px !important;
}

h4{
    font-size: 20px;
}
.h4 {
    font-size: 20px !important;
}

h5{
    font-size: 16px;
}
.h5 {
    font-size: 16px !important;
}

h6 {
    font-size: 12px;
}
.h6 {
    font-size: 12px !important;
}

h1 small, .h1 small, h1 .small, .h1 .small,
h2 small, .h2 small, h2 .small, .h2 .small,
h3 small, .h3 small, h3 .small, .h3 .small,
h4 small, .h4 small, h4 .small, .h4 .small,
h5 small, .h5 small, h5 .small, .h5 .small,
h6 small, .h6 small, h6 .small, .h6 .small {
    color: inherit;
    opacity: 0.75;
    font-size: 75%;
}

/*------------------------------------------------
- DISPLAY HEADING --------------------------------
------------------------------------------------*/

.display-1 {
    font-size: 78px;
}

.display-2 {
    font-size: 66px;
}

.display-3 {
    font-size: 54px;
}

.display-4 {
    font-size: 42px;
}

.display-1 small, .display-1 .small,
.display-2 small, .display-2 .small,
.display-3 small, .display-3 .small,
.display-4 small, .display-4 .small {
    color: inherit;
    opacity: 0.75;
    font-size: 75%;
}

/*------------------------------------------------
- IMAGES -----------------------------------------
------------------------------------------------*/

.img-thumbnail {
    border: 0;
    border-radius: 0;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.shadow{
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.bubble{
    width: 100px;
    height: 100px;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    display: -ms-inline-flexbox;
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-transform: uppercase;
}

.bubble p{
    margin-bottom: 0;
}

.bubble span{
    font-size: 85%;
    opacity: 0.6;
    letter-spacing: 1px;
}

.gallery-item{
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.gallery-item:hover{
    cursor: pointer;
}

.gallery-item:hover:before{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.4);
}

.gallery-item:hover:after{
    font-family: "fontawesome";
    content: "\f030";
    color: white;
    position: absolute;
    width: 24px;
    height: 24px;
    font-size: 24px;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.gallery-item img{
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.column-1{
    -webkit-column-count:1;
    column-count:1;
}
.column-2{
    -webkit-column-count:2;
    column-count:2;
}
.column-3{
    -webkit-column-count:3;
    column-count:3;
}
.column-4{
    -webkit-column-count:4;
    column-count:4;
}
.column-5{
    -webkit-column-count:5;
    column-count:5;
}

@media (min-width: 576px){
    .column-sm-1 {
        -webkit-column-count:1;
        column-count:1;
    }
    .column-sm-2 {
        -webkit-column-count:2;
        column-count:2;
    }
    .column-sm-3 {
        -webkit-column-count:3;
        column-count:3;
    }
    .column-sm-4 {
        -webkit-column-count:4;
        column-count:4;
    }
    .column-sm-5 {
        -webkit-column-count:5;
        column-count:5;
    }
}
@media (min-width: 768px){
    .column-md-1 {
        -webkit-column-count:1;
        column-count:1;
    }
    .column-md-2 {
        -webkit-column-count:2;
        column-count:2;
    }
    .column-md-3 {
        -webkit-column-count:3;
        column-count:3;
    }
    .column-md-4 {
        -webkit-column-count:4;
        column-count:4;
    }
    .column-md-5 {
        -webkit-column-count:5;
        column-count:5;
    }
}
@media (min-width: 992px){
    .column-lg-1 {
        -webkit-column-count:1;
        column-count:1;
    }
    .column-lg-2 {
        -webkit-column-count:2;
        column-count:2;
    }
    .column-lg-3 {
        -webkit-column-count:3;
        column-count:3;
    }
    .column-lg-4 {
        -webkit-column-count:4;
        column-count:4;
    }
    .column-lg-5 {
        -webkit-column-count:5;
        column-count:5;
    }
}
@media (min-width: 1200px){
    .column-xl-1 {
        -webkit-column-count:1;
        column-count:1;
    }
    .column-xl-2 {
        -webkit-column-count:2;
        column-count:2;
    }
    .column-xl-3 {
        -webkit-column-count:3;
        column-count:3;
    }
    .column-xl-4 {
        -webkit-column-count:4;
        column-count:4;
    }
    .column-xl-5 {
        -webkit-column-count:5;
        column-count:5;
    }
}

/*===================================================================================================
- GRID ----------------------------------------------------------------------------------------------
===================================================================================================*/

.row{
    margin-left: -10px;
    margin-right: -10px;
}

.row > [class^="col"],
.row > [class*="col"] {
    padding-left: 10px;
    padding-right: 10px;
}

.container-fluid{
    padding-left: 20px;
    padding-right: 20px;
}

/*===================================================================================================
- WRAPPER -------------------------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- WRAPPER ----------------------------------------
------------------------------------------------*/

#wrapper {
    position: relative;
    width: 100%;
    min-height: 100vh;
    height: 100%;
    background: #fff url("../img/texture/brushed-alum.png");
}

/*------------------------------------------------
- WRAPPER LOAD -----------------------------------
------------------------------------------------*/

#wrapper-load{
    position: fixed;
    z-index: 2000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 1;
    -webkit-transition: opacity 0.4s linear;
    -o-transition: opacity 0.4s linear;
    transition: opacity 0.4s linear;
}

#wrapper-load.end{
    opacity: 0;
}

/*------------------------------------------------
- WRAPPER TOP ------------------------------------
------------------------------------------------*/

#wrapper-header {
    position: absolute;
    z-index: 1030;
    top: 0;
    left: 18.5%;
    width: 81.5%;
}

/*------------------------------------------------
- WRAPPER CONTENT --------------------------------
------------------------------------------------*/

#wrapper-content {
    position: relative;
    margin-left: 18.5%;
    padding-top: 80px;
    padding-bottom: 50px;
}

/*------------------------------------------------
- WRAPPER LEFT -----------------------------------
------------------------------------------------*/

#wrapper-left {
    position: absolute;
    z-index: 1031;
    top: 0;
    left: 0;
    width: 18.5%;
    height: 100%;
}

/*------------------------------------------------
- WRAPPER RIGHT ----------------------------------
------------------------------------------------*/

#wrapper-right {
    position: fixed;
    z-index: 1080;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    top: 0;
    right: -260px;
    width: 260px;
    height: 100%;
    -webkit-transition: right 0.4s ease-out;
    -o-transition: right 0.4s ease-out;
    transition: right 0.4s ease-out;
}

#wrapper-right.open {
    right: 0 !important;
}

#wrapper-right > .btn {
    position: fixed !important;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto 0;
    height: 46px;
    -webkit-transition: right 0.4s ease-out;
    -o-transition: right 0.4s ease-out;
    transition: right 0.4s ease-out;
}

#wrapper-right.open > .btn {
    right: 260px;
}

/*------------------------------------------------
- WRAPPER FOOTER ---------------------------------
------------------------------------------------*/

#wrapper-footer {
    position: absolute;
    bottom: 0;
    left: 18.5%;
    width: 81.5%;
}

/*------------------------------------------------
- WRAPPER SLIDE ----------------------------------
------------------------------------------------*/

#wrapper-slide {
    position: fixed;
    z-index: 1050;
    bottom: 30px;
    right: 30px;
    display: none;
}

/*------------------------------------------------
- WRAPPER MEDIA ----------------------------------
------------------------------------------------*/

@media screen and (min-width: 992px) {

    #wrapper.toggled #wrapper-header{
        left: 80px;
        width: calc(100% - 80px);
    }

    #wrapper.toggled #wrapper-left {
        margin-left: 0;
        width: 80px;
    }

    #wrapper.toggled #wrapper-content {
        margin-left: 80px;
    }

    #wrapper.toggled #wrapper-footer {
        left: 80px;
        width: calc(100% - 80px);
    }

}

@media screen and (max-width: 991px) and (min-width: 768px) {

    #wrapper-header{
        left: 80px;
        width: calc(100% - 80px);
    }
    #wrapper.toggled #wrapper-header{
        left: 0;
        width: 100%;
    }

    #wrapper-left {
        margin-left: 0;
        width: 80px;
    }
    #wrapper.toggled #wrapper-left {
        display: none;
    }

    #wrapper #wrapper-content {
        margin-left: 80px;
    }
    #wrapper.toggled #wrapper-content {
        margin-left: 0;
    }

    #wrapper-footer {
        left: 80px;
        width: calc(100% - 80px);
    }
    #wrapper.toggled #wrapper-footer {
        left: 0;
        width: 100%;
    }

}

@media screen and (max-width: 767px) {

    #wrapper-header{
        left: 0;
        width: 100%;
    }

    #wrapper-left {
        margin-left: -255px;
        width: 250px;
        -webkit-transition: margin-left 0.4s ease-out;
        -o-transition: margin-left 0.4s ease-out;
        transition: margin-left 0.4s ease-out;
    }
    #wrapper.toggled #wrapper-left {
        margin-left: 0;
    }

    #wrapper #wrapper-content {
        margin-left: 0;
    }

    #wrapper-footer {
        left: 0;
        width: 100%;
    }
}

@media (max-width: 575px){
    #wrapper-content {
        padding-bottom: 70px;
    }
}


/*===================================================================================================
- LAYOUT --------------------------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- WRAPPER BOX -------------------------------------
------------------------------------------------*/

#wrapper.wrapper-box {
    margin: 0 5%;
    width: 90%;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

@media screen and (min-width: 992px) {

    #wrapper.wrapper-box:not(.wrapper-header-fixed) #wrapper-header{
        left: calc(18.5% - 2px);
        width: calc(81.5% + 2px);
    }
    #wrapper.toggled.wrapper-box:not(.wrapper-header-fixed) #wrapper-header{
        left: 80px;
        width: calc(100% - 80px);
    }

    #wrapper.wrapper-box.wrapper-header-fixed #wrapper-header {
        left: 21.5%;
        width: 73.5%;
    }
    #wrapper.toggled.wrapper-box.wrapper-header-fixed #wrapper-header {
        left: calc(80px + 5%);
        width: calc(90% - 80px);
    }

    #wrapper.wrapper-box.wrapper-left-fixed #wrapper-left {
        left: 5%;
        width: 16.5%;
    }
    #wrapper.toggled.wrapper-box.wrapper-header-fixed #wrapper-left {
        width: 80px;
    }

    #wrapper.wrapper-box #wrapper-footer {
        left: calc(18.5% - 2px);
        width: calc(81.5% + 2px);
    }
    #wrapper.toggled.wrapper-box #wrapper-footer {
        left: 80px;
        width: calc(100% - 80px);
    }

}

@media screen and (max-width: 991px  ) and (min-width: 768px) {

    #wrapper.wrapper-box:not(.wrapper-header-fixed) #wrapper-header{
        left: 80px;
        width: calc(100% - 80px);
    }
    #wrapper.wrapper-box.toggled:not(.wrapper-header-fixed) #wrapper-header{
        left: 0;
        width: 100%;
    }

    #wrapper.wrapper-box.wrapper-header-fixed #wrapper-header {
        left: calc(80px + 5%);
        width: calc(90% - 80px);
    }
    #wrapper.toggled.wrapper-box.wrapper-header-fixed #wrapper-header {
        left: 5%;
        width: 90%;
    }

    #wrapper.wrapper-box.wrapper-left-fixed #wrapper-left {
        left: 5%;
        width: 80px;
    }
    #wrapper.toggled.wrapper-box.wrapper-header-fixed #wrapper-left {
        margin-left: -80px;
    }

    #wrapper.wrapper-box #wrapper-footer {
        left: 80px;
        width: calc(100% - 80px);
    }
    #wrapper.wrapper-box.toggled #wrapper-footer {
        left: 0;
        width: 100%;
    }

}

@media screen and (max-width: 767px) {

    #wrapper.wrapper-box {
        margin: 0;
        width: 100%;
    }

    #wrapper.wrapper-box.wrapper-header-fixed #wrapper-header {
        left: 0;
        width: 100%;
    }

    #wrapper.wrapper-box.wrapper-left-fixed #wrapper-left {
        left: 0;
        width: 250px;
    }

}

/*------------------------------------------------
- WRAPPER HEADER FIXED ---------------------------
------------------------------------------------*/

#wrapper.wrapper-header-fixed #wrapper-header {
    position: fixed;
}

#wrapper.wrapper-header-fixed #wrapper-content {
    padding-top: 80px;
}

/*------------------------------------------------
- WRAPPER LEFT FIXED -----------------------------
------------------------------------------------*/

#wrapper.wrapper-left-fixed #wrapper-left {
    position: fixed;
    top: 0;
    height: 100%;
}

/*===================================================================================================
- NAVBAR --------------------------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- HEADERBAR --------------------------------------
------------------------------------------------*/

.navbar{
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 60px;
    padding: 0;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

/*------------------------------------------------
- LIGHT HEADERBAR --------------------------------
------------------------------------------------*/

.navbar-light .navbar-nav  .nav-link {
    color: #000 !important;
}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
    color: rgba(0, 0, 0, 0.5) !important;
}

/*------------------------------------------------
- DARK NAVBAR ------------------------------------
------------------------------------------------*/

.navbar-dark .navbar-nav  .nav-link {
    color: #fff !important;
}

.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
    color: rgba(255, 255, 255, 0.5);
}

/*------------------------------------------------
- NAVBAR COLOR -----------------------------------
------------------------------------------------*/

.navbar-primary .nav-link .badge,
.navbar-primary .dropdown-menu .dropdown-item.active:after  {
    background-color: #4b5066;
}

.navbar-primary .navbar-nav .nav-item.show:after {
    border-bottom-color: #4b5066 !important;
}

.navbar-secondary .nav-link .badge,
.navbar-secondary .dropdown-menu .dropdown-item.active:after  {
    background-color: #b6b3aa;
}

.navbar-secondary .navbar-nav .nav-item.show:after {
    border-bottom-color: #b6b3aa !important;
}

.navbar-success .nav-link .badge,
.navbar-success .dropdown-menu .dropdown-item.active:after  {
    background-color: #319d24;
}

.navbar-success .navbar-nav .nav-item.show:after {
    border-bottom-color: #319d24 !important;
}

.navbar-info .nav-link .badge,
.navbar-info .dropdown-menu .dropdown-item.active:after {
    background-color: #888fa9;
}

.navbar-info .navbar-nav .nav-item.show:after {
    border-bottom-color: #888fa9 !important;
}

.navbar-warning .nav-link .badge,
.navbar-warning .dropdown-menu .dropdown-item.active:after  {
    background-color: #ff6318;
}

.navbar-warning .navbar-nav .nav-item.show:after {
    border-bottom-color: #ff6318 !important;
}

.navbar-danger .nav-link .badge,
.navbar-danger .dropdown-menu .dropdown-item.active:after {
    background-color: #93bd9e !important;
}

.navbar-danger .navbar-nav .nav-item.show:after {
    border-bottom-color: #93bd9e !important;
}

/*------------------------------------------------
- NAVBAR NAVIGATION ------------------------------
------------------------------------------------*/

.navbar .navbar-nav{
    height: 100%;
    padding: 0 20px;
}

.navbar .navbar-nav + .navbar-nav{
    padding-left: 0 !important;
}

.navbar .navbar-nav .nav-item + .nav-item {
    margin-left: 20px;
}

.navbar .navbar-nav .nav-item.show:after {
    content: "";
    position: absolute;
    bottom: 0;
    border-bottom: 3px solid #93bd9e;
    width: 100%;
}

.navbar .navbar-nav .nav-item.dropdown-fluid.show:after{
    width: 24px;
}

.navbar .navbar-nav .nav-link {
    position: relative;
    padding: 18px 0;
    height: 100%;
}

.navbar .navbar-nav .nav-link i {
    font-size: 24px;
}

.navbar .navbar-nav .nav-link .badge {
    position: absolute;
    top: 5px;
    right: -10px;
}

.navbar .navbar-nav. nav-link .flag-icon{
    margin-top: 3px;
    font-size: 18px;
}

/*------------------------------------------------
- NAVBAR SEARCH ----------------------------------
------------------------------------------------*/

.navbar-search {
    position: fixed;
    z-index: 1080;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    top: -65px;
    left: 0;
    padding: 0 15px;
    width: 100%;
    height: 60px;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    -webkit-transition: top 0.3s linear;
    -o-transition: top 0.3s linear;
    transition: top 0.3s linear;
}

.navbar-search.open {
    top: 0;
}

/*------------------------------------------------
- NAVBAR DROPDOWN --------------------------------
------------------------------------------------*/

.navbar .dropdown-menu {
    position: absolute !important;
    /*left: auto;*/
    right: 0;
    width: 250px;
    margin-top: 5px;
    max-width: 250px;
}

.navbar .dropdown-fluid .dropdown-menu {
    max-height: 365px;
}

@media (max-width: 575px) {
    .navbar .dropdown-fluid .dropdown-menu {
        max-height: 291px;
    }
}

@media (max-width: 500px) {
    .navbar .dropdown-menu {
        position: fixed !important;
        top: 60px;
        right: 15px;
        width: calc(100% - 30px) !important;
        max-width: inherit !important;
    }
}

/*===================================================================================================
- SIDEBAR -------------------------------------------------------------------------------------------
===================================================================================================*/

.sidebar {
    height: 100%;
    background-color: #fff;
    -webkit-box-shadow: 1px 0 2px 0 rgba(0, 0, 0, 0.1), 1px 0 5px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 1px 0 2px 0 rgba(0, 0, 0, 0.1), 1px 0 5px 0 rgba(0, 0, 0, 0.1);
}

.sidebar-close {
    position: absolute;
    right: 8px;
    top: 6px;
}

.sidebar-close:hover {
    opacity: 0.5;
}

/*------------------------------------------------
- LIGHT SIDEBAR ----------------------------------
------------------------------------------------*/

.sidebar-light,
.sidebar-light a,
.sidebar-light .sidebar-nav > .nav-item > .nav-link {
    color: #000;
}

.sidebar-light a:not(.nav-link):hover{
    color: rgba(0,0,0,0.5);
}


.sidebar-light .nav-item.active > .nav-link,
.sidebar-light .nav-item.open > .nav-link,
.sidebar-light .nav-link:hover {
    background-color: rgba(0, 0, 0, 0.02);
}

/*------------------------------------------------
- DARK SIDEBAR -----------------------------------
------------------------------------------------*/

.sidebar-dark,
.sidebar-dark a,
.sidebar-dark .sidebar-nav > .nav-item > .nav-link {
    color: #fff;
}

.sidebar-dark a:not(.nav-link):hover{
    color: rgba(255,255,255,0.5);
}

.sidebar-dark .nav-item.active > .nav-link,
.sidebar-dark .nav-item.open > .nav-link,
.sidebar-dark .nav-link:hover {
    background-color: rgba(255,255,255, 0.02);
}


/*------------------------------------------------
- SIDEBAR COLOR ---------------------------------
------------------------------------------------*/

.sidebar-primary .dropdown-list,
.sidebar-primary .badge,
.sidebar-primary .progress-bar,
.sidebar-primary .nav-item.open:before {
    background-color: #4b5066;
}
.sidebar-primary .sidebar-nav li.active > a {
    border-left-color: #4b5066;
}

.sidebar-secondary .dropdown-list,
.sidebar-secondary .badge,
.sidebar-secondary .progress-bar,
.sidebar-secondary .nav-item.open:before {
    background-color: #b6b3aa;
}
.sidebar-secondary .sidebar-nav li.active > a {
    border-left-color: #b6b3aa;
}

.sidebar-success .dropdown-list,
.sidebar-success .badge,
.sidebar-success .progress-bar,
.sidebar-success .nav-item.open:before {
    background-color: #319d24;
}
.sidebar-success .sidebar-nav li.active > a {
    border-left-color: #319d24;
}


.sidebar-info .dropdown-list,
.sidebar-info .badge,
.sidebar-info .progress-bar,
.sidebar-info .nav-item.open:before {
    background-color: #888fa9;
}
.sidebar-info .sidebar-nav li.active > a {
    border-left-color: #888fa9;
}

.sidebar-warning .dropdown-list,
.sidebar-warning .badge,
.sidebar-warning .progress-bar,
.sidebar-warning .nav-item.open:before {
    background-color: #ff7400;
}
.sidebar-warning .sidebar-nav li.active > a {
    border-left-color: #ff7400;
}

.sidebar-danger .dropdown-list,
.sidebar-danger .badge,
.sidebar-danger .progress-bar,
.sidebar-danger .nav-item.open:before {
    background-color: #ef2b41;
}
.sidebar-danger .sidebar-nav li.active > a {
    border-left-color: #93bd9e;
}

/*------------------------------------------------
- SIDEBAR LOGO ---------------------------------
------------------------------------------------*/

.sidebar-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 61px;
    position: relative;
    padding-left: 23px;
}


.sidebar-header .sidebar-brand {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none !important;
}

.sidebar-brand .sidebar-brand-text {
    margin-left: 14px;
    font-size: 20px;
    height: 20px;
    line-height: 12px;
    text-transform: uppercase;
    font-family: "Azedo", sans-serif;
    font-weight: bold;
    letter-spacing: 2px;
}

/*------------------------------------------------
- SIDEBAR HEADER ---------------------------------
------------------------------------------------*/

.sidebar-profile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px 0 12px 12px;
}

.sidebar-profile .sidebar-profile-img{
    width: 56px;
    height: 56px;
    background-color: rgba(0,0,0,0.02);
}

.sidebar-profile .sidebar-profile-info {
    padding-left: 12px;
}

.sidebar-profile .sidebar-profile-info h6 {
    margin-bottom: 4px;
    text-transform: capitalize;
    letter-spacing: 1px;
    font-size: 12px;
}

.sidebar-profile .sidebar-profile-info span {
    opacity: 0.7;
    text-transform: capitalize;
}

/*------------------------------------------------
- SIDEBAR ACTIONS ------------------------------
------------------------------------------------*/

.sidebar-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    margin-bottom: -7px;
}

.sidebar-actions a + a {
    margin-left: 20px;
}

.sidebar-actions a{
    position: relative;
    left:-4px;
}

/*------------------------------------------------
- SIDEBAR CONTAINER ------------------------------
------------------------------------------------*/

.sidebar-container {
    position: relative;
    height: calc(100vh - 61px);
}

/*------------------------------------------------
- SIDEBAR NAVIGATION -----------------------------
------------------------------------------------*/

.sidebar-nav {
    margin: 0;
    padding: 0;
    width: 100%;
    list-style: none;
}

.sidebar-nav .nav-divider {
    height: 1px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.175)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(left, rgba(0,0,0,0.175), rgba(0,0,0,0));
    background: -o-linear-gradient(left, rgba(0,0,0,0.175), rgba(0,0,0,0));
    background: linear-gradient(to right, rgba(0,0,0,0.175), rgba(0,0,0,0));
}

.sidebar-nav .nav-link {
    position: relative;
/*     z-index: 3; */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    /*padding: 12px 23px 12px 18px;*/
    padding: 3px 8px 6px 3px;
    border-left: 5px solid transparent;
    width: 100%;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 1px;
}

.sidebar-nav .nav-link i {
    font-size: 24px;
}

.sidebar-nav .link-text {
    padding-left: 13px;
}
.sidebar-nav .nav-link .badge{
    position: absolute;
    right: 23px;
}

.sidebar-nav .nav-item.has-dropdown {
    position: relative;
}

.sidebar-nav > .nav-item.open:before,
.sidebar-nav > .nav-item.open:after {
    content: "";
    position: absolute;
    z-index: 2;
    top:45px;
    right: 27px;
    width: 8px;
    height: 8px;
    -webkit-transform: rotateZ(45deg);
    -ms-transform: rotate(45deg);
    transform: rotateZ(45deg);
}

.sidebar-nav >.nav-item.open:before{
    -webkit-animation: caret-before .6s ease-out;
    animation: caret-before .6s ease-out;
}

.sidebar-nav > .nav-item.open:after {
    background-color: transparent;
    border: 1px solid rgba(0,0,0,0.125);
    border-bottom-color: transparent;
    border-right-color: transparent;
    -webkit-animation: caret-after .6s ease-out;
    animation: caret-after .6s ease-out;
}

@-webkit-keyframes caret-before {
    0%{
        opacity: 0;
        top:53px;
    }
    80%{
        opacity: 0;
        top:53px;
    }
    100%{
        top:45px;
        opacity: 1;
    }
}

@keyframes caret-before {
    0%{
        opacity: 0;
        top:53px;
    }
    80%{
        opacity: 0;
        top:53px;
    }
    100%{
        top:45px;
        opacity: 1;
    }
}

@-webkit-keyframes caret-after {
    0%{
        opacity: 0;
    }
    80%{
        opacity: 0;
    }
    100%{
        opacity: 1;
    }
}

@keyframes caret-after {
    0%{
        opacity: 0;
    }
    80%{
        opacity: 0;
    }
    100%{
        opacity: 1;
    }
}

.sidebar-nav .dropdown-list {
    position: relative;
    display: none;
    padding-left: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.125);
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    list-style: none;
}

.sidebar-nav .dropdown-list .nav-link {
    color: #fff;
}

.sidebar-nav .dropdown-list li.active > a {
    border-left-color: #fff;
}

.sidebar-nav .dropdown-list .badge {
    background-color: #fff !important;
    color: #000;
}

.sidebar-nav .dropdown-list .dropdown-list {
    background-color: rgba(0,0,0,0.2);
}

.sidebar-nav .dropdown-list .dropdown-list .dropdown-list {
    background-color: rgba(0,0,0,0.3);
}

.sidebar-nav .dropdown-list .dropdown-list .dropdown-list {
    background-color: rgba(0,0,0,0.2);
}

.sidebar-nav .dropdown-list .dropdown-list .dropdown-list {
    background-color: rgba(0,0,0,0.2);
}

/*------------------------------------------------
- SIDEBAR MEIDIA SCREEN --------------------------
------------------------------------------------*/

@media screen and (max-width: 1130px) and (min-width: 992px) {
    .sidebar-brand .sidebar-brand-text {
        letter-spacing: 0px;
    }
}

@media screen and (min-width: 992px) {

    #wrapper.toggled .sidebar-nav {
        width: 80px;
    }

    #wrapper.toggled .sidebar-header{
        padding-left: 0;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    #wrapper.toggled .sidebar-brand .sidebar-brand-text {
        display: none;
    }

    #wrapper.toggled .sidebar-profile{
        padding: 12px;
        width: 80px;
    }

    #wrapper.toggled .sidebar-profile .sidebar-profile-info {
        display: none;
    }

    #wrapper.toggled .sidebar-actions{
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 0;
        width: 80px;
    }

    #wrapper.toggled .sidebar-actions a:not(.keep){
        display: none;
    }

    #wrapper.toggled .sidebar-container {
        width:320px;
    }

    #wrapper.toggled .sidebar-container .os-scrollbar-vertical {
        right:240px;
    }

    #wrapper.toggled .sidebar-container .os-scrollbar-vertical{
        z-index: 2;
    }

    #wrapper.toggled .sidebar-nav{
        width: 80px;
    }

    #wrapper.toggled .sidebar-nav .nav-item{
        position: relative;
        overflow: visible;
    }

    #wrapper.toggled .sidebar-nav .nav-item.open:before,
    #wrapper.toggled .sidebar-nav .nav-item.open:after {
        top:26px;
        right: -4px;
        -webkit-transform: rotateZ(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotateZ(-45deg);
    }

    #wrapper.toggled .sidebar-nav .nav-item.open:before{
        -webkit-animation-name: caret-before-right;
        animation-name: caret-before-right;
    }

    #wrapper.toggled .sidebar-nav .nav-item.open:after{
        -webkit-animation-name: caret-after-right;
        animation-name: caret-after-right;
    }

    @-webkit-keyframes caret-before-right {
        0%{
            opacity: 0;
            right:-12px;
        }
        80%{
            opacity: 0;
            right:-12px;
        }
        100%{
            opacity: 1;
            right:-4px;
        }
    }

    @keyframes caret-before-right {
        0%{
            opacity: 0;
            right:-12px;
        }
        80%{
            opacity: 0;
            right:-12px;
        }
        100%{
            opacity: 1;
            right:-4px;
        }
    }

    @-webkit-keyframes caret-after-right {
        0%{
            opacity: 0;
        }
        80%{
            opacity: 0;
        }
        100%{
            opacity: 1;
        }
    }

    @keyframes caret-after-right {
        0%{
            opacity: 0;
        }
        80%{
            opacity: 0;
        }
        100%{
            opacity: 1;
        }
    }

    #wrapper.toggled .sidebar-nav > .nav-item > .nav-link {
        padding-left: 23px !important;
        width: 80px;
    }

    #wrapper.toggled .sidebar-nav > .nav-item > .nav-link > .link-text{
        display: none;
    }

    #wrapper.toggled .sidebar-nav > .nav-item > .nav-link > .badge {
        bottom: 10px;
        right: 15px;
    }

    #wrapper.toggled .sidebar-nav > .has-dropdown > .dropdown-list{
        position: absolute;
        bottom: 0;
        left:80px;
        border-top-width: 0;
        border-bottom-width: 0;
        border-left: 1px solid rgba(0,0,0,0.125);
        width: 240px;
        -webkit-box-shadow: 1px 0 2px 0 rgba(0, 0, 0, 0.1), 1px 0 5px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 1px 0 2px 0 rgba(0, 0, 0, 0.1), 1px 0 5px 0 rgba(0, 0, 0, 0.1);
    }

    #wrapper.toggled .sidebar-nav > .has-dropdown > .dropdown-list.top{
        top:0;
        bottom: auto;
    }
}

@media screen and (max-width: 991px  ) and (min-width: 768px) {

    .sidebar-header{
        padding-left: 0;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .sidebar-brand .sidebar-brand-text {
        display: none;
    }

    .sidebar-profile{
        padding: 12px;
        width: 80px;
    }

    .sidebar-profile .sidebar-profile-info {
        display: none;
    }

    .sidebar-actions{
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        width: 80px;
    }

    .sidebar-actions a:not(.keep){
        display: none;
    }

    .sidebar-container {
        width:320px;
    }

    .sidebar-container .os-scrollbar-vertical {
        right:240px;
    }

    .sidebar-container .os-scrollbar-vertical{
        z-index: 2;
    }


    .sidebar-nav{
        width: 80px;
    }

    .sidebar-nav .sidebar-nav .nav-item{
        position: relative;
        overflow: visible;
    }

    .sidebar-nav  .nav-item.open:before,
    .sidebar-nav  .nav-item.open:after {
        top:26px;
        right: -4px;
        -webkit-transform: rotateZ(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotateZ(-45deg);
    }

    .sidebar-nav  .nav-item.open:before{
        -webkit-animation-name: caret-before-right;
        animation-name: caret-before-right;
    }

    .sidebar-nav  .nav-item.open:after{
        -webkit-animation-name: caret-after-right;
        animation-name: caret-after-right;
    }

    @-webkit-keyframes caret-before-right {
        0%{
            opacity: 0;
            right:-12px;

        }
        80%{
            opacity: 0;
            right:-12px;
        }
        100%{
            opacity: 1;
            right:-4px;
        }
    }

    @keyframes caret-before-right {
        0%{
            opacity: 0;
            right:-12px;

        }
        80%{
            opacity: 0;
            right:-12px;
        }
        100%{
            opacity: 1;
            right:-4px;
        }
    }

    @-webkit-keyframes caret-after-right {
        0%{
            opacity: 0;
        }
        80%{
            opacity: 0;
        }
        100%{
            opacity: 1;
        }
    }

    @keyframes caret-after-right {
        0%{
            opacity: 0;
        }
        80%{
            opacity: 0;
        }
        100%{
            opacity: 1;
        }
    }

    .sidebar-nav > .nav-item > .nav-link {
        padding-left: 23px !important;
    }

    .sidebar-nav > .nav-item > .nav-link > .link-text{
        display: none;
    }

    .sidebar-nav > .nav-item > .nav-link > .badge {
        bottom: 10px;
        right: 15px;
    }

    .sidebar-nav > .has-dropdown > .dropdown-list{
        position: absolute;
        bottom: 0;
        left:80px;
        border-top-width: 0;
        border-bottom-width: 0;
        border-left: 1px solid rgba(0,0,0,0.125);
        width: 240px;
        -webkit-box-shadow: 1px 0 2px 0 rgba(0, 0, 0, 0.1), 1px 0 5px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 1px 0 2px 0 rgba(0, 0, 0, 0.1), 1px 0 5px 0 rgba(0, 0, 0, 0.1);
    }

    .sidebar-nav > .has-dropdown > .dropdown-list.top{
        top:0;
        bottom: auto;
    }
}

/*===================================================================================================
- COPYRIGHT --------------------------------------------------------------------------------------------
===================================================================================================*/

.copyright{
    bottom: 0;
    padding: 17px 20px;
    background-color: #fff;
    font-size: 11px;
    -webkit-box-shadow: 0 -2px 2px 0 rgba(0, 0, 0, 0.01), 0 -1px 1px -2px rgba(0, 0, 0, 0.01);
    box-shadow: 0 -2px 2px 0 rgba(0, 0, 0, 0.01), 0 -1px 1px -2px rgba(0, 0, 0, 0.01);
}

/*===================================================================================================
- CONTENT -------------------------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- TABLES -----------------------------------------
------------------------------------------------*/

.table-justify tr > td:last-child,
.table-justify tr > th:last-child{
    text-align: right;
}

.table-justify tr > td:first-child,
.table-justify tr > th:first-child{
    text-align: left !important;
}

.table th,
.table td {
    border-top:0;
    vertical-align: middle;
}


.table .table {
    background-color: #fff;
}

.table-bordered {
    border: 1px solid rgba(0,0,0,0.125);
}

.table-bordered th,
.table-bordered td {
    border: 1px solid rgba(0,0,0,0.125);
}

.table-bordered thead th,
.table-bordered thead td {
    border-bottom-width: 2px;
}

.table-semi-bordered {
    border:0;
}

.table-semi-bordered tr + tr td {
    border-top: 1px solid rgba(0,0,0,0.125) !important;
}

.table-semi-bordered.table-dark tr + tr td{
    border-top: 1px solid #fff !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.05);
}

.table-hover > tbody > tr:hover {
    background-color: rgba(0, 0, 0, 0.075);
}

.table-primary,
.table-primary > th,
.table-primary > td {
    background-color: #e8e9ec;
    color: #4b5066;
}

.table-hover .table-primary:hover {
    background-color: #c9cbd1;
}

.table-hover .table-primary:hover > td,
.table-hover .table-primary:hover > th {
    background-color: #c9cbd1;
}

.table-secondary,
.table-secondary > th,
.table-secondary > td {
    background-color: #f9f8f7;
    color: #b6b3aa;
}

.table-hover .table-secondary:hover {
    background-color: #f0efec;
}

.table-hover .table-secondary:hover > td,
.table-hover .table-secondary:hover > th {
    background-color: #f0efec;
}

.table-success,
.table-success > th,
.table-success > td {
    background-color: #e5f3e3;
    color: #319d24;
}

.table-hover .table-success:hover {
    background-color: #c0e2bd;
}

.table-hover .table-success:hover > td,
.table-hover .table-success:hover > th {
    background-color: #c0e2bd;
}

.table-info,
.table-info > th,
.table-info > td {
    background-color: #f0f1f4;
    color: #888fa9;
}

.table-hover .table-info:hover {
    background-color: #dbdee5;
}

.table-hover .table-info:hover > td,
.table-hover .table-info:hover > th {
    background-color: #dbdee5;
}

.table-warning,
.table-warning > th,
.table-warning > td {
    background-color: #fff1e5;
    color: #ff7400;
}

.table-hover .table-warning:hover {
    background-color: #ffd8b7;
}

.table-hover .table-warning:hover > td,
.table-hover .table-warning:hover > th {
    background-color: #ffd8b7;
}

.table-danger,
.table-danger > th,
.table-danger > td {
    background-color: #fde4e7;
    color: #ef2b41;
}

.table-hover .table-danger:hover {
    background-color: #fbbfc6;
}

.table-hover .table-danger:hover > td,
.table-hover .table-danger:hover > th {
    background-color: #fbbfc6;
}

.table-light,
.table-light > th,
.table-light > td {
    background-color: #fcf9ef;
    color: #bdbab3;
}

.table-hover .table-light:hover {
    background-color: #f1eee4;
}

.table-hover .table-light:hover > td,
.table-hover .table-light:hover > th {
    background-color: #f1eee4;
}

.table-dark,
.table-dark > th,
.table-dark > td {
    background-color: #e8e8e8;
    color: #464646;
}

.table-hover .table-dark:hover {
    background-color: #c8c8c8;
}

.table-hover .table-dark:hover > td,
.table-hover .table-dark:hover > th {
    background-color: #c8c8c8;
}


.table .thead-dark th {
    background-color: #444;
    border-color: #444;
}

.table .thead-light th {
    color: #444;
    background-color: #f4f1e7;
    border-color: #f4f1e7;
}

.table-dark {
    color: #fff;
    background-color: #444;
}

.table-dark th,
.table-dark td,
.table-dark thead th {
    border-color: #fff;
}

.table-dark.table-bordered {
    border: 0;
}

.table-dark.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.table-dark.table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.075);
}

.table-responsive {
    overflow-x: hidden;
}
.table-responsive .table{
    margin-bottom: 0;
}

/*===================================================================================================
- COMPONENETS ---------------------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- ALERTS ------------------------------------------
------------------------------------------------*/

.alert {
    border-radius: 0;
}

.alert-dismissible .close {
    outline: none;
}

.alert-primary {
    background-color: #e8e9ec;
    border-color: #c9cbd1;
    color: #4b5066;
}

.alert-primary .alert-link {
    color: #4b5066 !important;
}

.alert-primary hr {
    border-top-color: #c9cbd1;
}

.alert-secondary {
    background-color: #f9f8f7;
    border-color: #f0efec;
    color: #b6b3aa;
}

.alert-secondary .alert-link {
    color: #b6b3aa !important;
}

.alert-secondary hr {
    border-top-color: #f0efec;
}

.alert-success {
    background-color: #e5f3e3;
    border-color: #c0e2bd;
    color: #319d24;
}

.alert-success .alert-link {
    color: #2e7f22 !important;
}

.alert-success hr {
    border-top-color: #c0e2bd;
}

.alert-info {
    background-color: #f0f1f4;
    border-color: #dbdee5;
    color: #888fa9;
}

.alert-info .alert-link {
    color: #6a718b !important;
}

.alert-info hr {
    border-top-color: #dbdee5;
}

.alert-warning {
    background-color: #fff1e5;
    border-color: #ffd8b7;
    color: #ff7400;
}

.alert-warning .alert-link {
    color: #e17100 !important;
}

.alert-warning hr {
    border-top-color: #ffd8b7;
}

.alert-danger {
    background-color: #fde4e7;
    border-color: #fbbfc6;
    color: #ef2b41;
}

.alert-danger .alert-link {
    color: #d12b40 !important;
}

.alert-danger hr {
    border-top-color: #fbbfc6;
}

.alert-dark {
    background-color: #e8e8e8;
    border-color: #c8c8c8;
    color: #464646;
}

.alert-dark .alert-link {
    color: #464646 !important;
}

.alert-dark hr {
    border-top-color: #c8c8c8;
}

/*------------------------------------------------
- BADGES -----------------------------------------
------------------------------------------------*/

.badge:empty {
    display: inherit;
}

.badge {
    border: 0;
    border-radius: 0;
    padding: 4px 5px;
    font-size: 80%;
    font-weight: lighter;
    color: #fff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.badge-pill {
    border-radius: 10px !important;
}

.badge-state {
    padding: 0;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.175);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.175);
}

.badge-legend {
    display: inline-block !important;
    padding: 0;
    width: 14px;
    height: 14px;
    position: relative;
    margin: 0 2px;
}

.badge-legend:after {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    width: 18px;
    height: 18px;
    border: 1px solid;
}

.badge-circle {
    display: -ms-inline-flexbox !important;
    display: -webkit-inline-box !important;
    display: inline-flex !important;
    width: 16px;
    height: 16px;
    border-radius: 16px;
}

.badge-sm{
    padding: 0;
    width: 12px;
    height: 12px;
    font-size: 9px;
    text-align: center;
    line-height: 12px;
}

.badge-md{
    padding: 0;
    width: 16px;
    height: 16px;
    text-align: center;
    line-height: 16px;
}

.badge-lg{
    padding: 0;
    width: 20px;
    height: 20px;
    font-size: 15px;
    text-align: center;
    line-height: 20px;
}

.badge-muted {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

.badge-primary {
    background-color: #4b5066 !important;
}
.badge-primary.badge-legend:after {
    border-color: #4b5066 !important;
}

.badge-secondary {
    background-color: #b6b3aa !important;
}
.badge-secondary.badge-legend:after {
    border-color: #b6b3aa !important;
}

.badge-info {
    background-color: #888fa9 !important;
}
.badge-info.badge-legend:after {
    border-color: #888fa9 !important;
}

.badge-success {
    background-color: #319d24 !important;
}
.badge-success.badge-legend:after {
    border-color: #319d24 !important;
}

.badge-warning {
    background-color: #ff7400 !important;
}
.badge-warning.badge-legend:after {
    border-color: #ff7400 !important;
}

.badge-danger {
    background-color: #ef2b41 !important;
}
.badge-danger.badge-legend:after {
    border-color: #ef2b41 !important;
}

.badge-light {
    color: #000;
    background-color: #f4f1e7 !important;
}
.badge-light.badge-legend:after {
    color: #000;
    border-color: #f4f1e7 !important;
}

.badge-dark {
    background-color: #464646 !important;
}
.badge-dark.badge-legend:after {
    border-color: #464646 !important;
}

.badge-black {
    background-color: #000 !important;
}
.badge-black.badge-legend:after {
    border-color: #000 !important;
}

/*------------------------------------------------
- BREADCRUMB -------------------------------------
------------------------------------------------*/

.breadcrumb {
    margin-bottom: 0px;
    padding: 10px 12px;
    border: 0;
    border-radius: 0;
    background: #fff;
    /*--
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    --*/
}

.breadcrumb-item:hover {
    text-decoration: none;
}

.breadcrumb-item:active,
.breadcrumb-item.active {
    color:#888;
}

.breadcrumb-info {
    margin-left: auto;
    padding-left: 12px;
    border-left: 1px solid rgba(0,0,0,0.125);
}

@media (max-width: 575px){
    .breadcrumb-info {
        -webkit-box-flex:100%;
        -ms-flex:100%;
        flex:100%;
        margin-top: 8px;
        margin-left: 0;
        padding-left: 0;
        border-left: 0;
    }
}

/*------------------------------------------------
- BUTTONS ----------------------------------------
------------------------------------------------*/
    .btn {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    font-size: 12px;
    height: 35px;
    border: none;
    border-radius: 0;
    padding: 0 12px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    -webkit-transition: background-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
    transition: background-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
    -o-transition: background-color .15s ease-in-out, box-shadow .15s ease-in-out;
    transition: background-color .15s ease-in-out, box-shadow .15s ease-in-out;
    transition: background-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
}

.btn:hover,
.btn:focus, .btn.focus,
.btn:active, .btn.active {
    -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2) !important;
}

.btn.disabled, .btn:disabled {
    opacity: 0.6;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:focus, .btn-primary.focus,
.btn-primary:active, .btn-primary.active,
.btn-primary.disabled, .btn-primary:disabled {
    color: #fff !important;
    background-color: #4b5066 !important;
}

.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus, .btn-secondary.focus,
.btn-secondary:active, .btn-secondary.active,
.btn-secondary.disabled, .btn-secondary:disabled {
    color: #fff !important;
    background-color: #b6b3aa !important;
}

.btn-success,
.btn-success:hover,
.btn-success:focus, .btn-success.focus,
.btn-success:active, .btn-success.active,
.btn-success.disabled, .btn-success:disabled {
    color: #fff !important;
    background-color: #319d24 !important;
}

.btn-info,
.btn-info:hover,
.btn-info:focus, .btn-info.focus,
.btn-info:active, .btn-info.active,
.btn-info.disabled, .btn-info:disabled {
    color: #fff !important;
    background-color: #888fa9 !important;
}

.btn-warning,
.btn-warning:hover,
.btn-warning:focus, .btn-warning.focus,
.btn-warning:active, .btn-warning.active,
.btn-warning.disabled, .btn-warning:disabled {
    color: #fff !important;
    background-color: #ff7400 !important;
}

.btn-danger,
.btn-danger:hover,
.btn-danger:focus, .btn-danger.focus,
.btn-danger:active, .btn-danger.active,
.btn-danger.disabled, .btn-danger:disabled {
    color: #fff !important;
    background-color: #ef2b41 !important;
}

.btn-light,
.btn-light:hover,
.btn-light:focus, .btn-light.focus,
.btn-light:active, .btn-light.active,
.btn-light.disabled, .btn-light:disabled {
    color: #444 !important;
    background-color: #f4f1e7 !important;
}

.btn-dark,
.btn-dark:hover,
.btn-dark:focus, .btn-dark.focus,
.btn-dark:active, .btn-dark.active,
.btn-dark.disabled, .btn-dark:disabled {
    color: #fff !important;
    background-color: #444 !important;
}

.btn-white,
.btn-white:hover,
.btn-white:focus, .btn-white.focus,
.btn-white:active, .btn-white.active,
.btn-white.disabled, .btn-white:disabled {
    color: #000;
    background-color: #fff;
}

.btn-black,
.btn-black:hover,
.btn-black:focus, .btn-black.focus,
.btn-black:active, .btn-black.active,
.btn-black.disabled, .btn-black:disabled {
    color: #fff;
    background-color: #000;
}

[class*="btn-outline"]:not(:hover):not(:focus):not(.active):not(.focus):not(.active):before,
[class*="btn-outline"].disabled:before, [class*="btn-outline"]:disabled:before {
    content: "";
    position: absolute;
    z-index: 0;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    border: 2px solid;
}

.btn-page [class*="btn-outline"]:not(:hover):not(:focus):not(.active):not(.focus):not(.active):before,
.btn-page [class*="btn-outline"].disabled:before, [class*="btn-outline"]:disabled:before {
    border-width: 1px !important;
}

.btn-outline-primary {
    color: #4b5066 !important;
    background: white none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus, .btn-outline-primary.focus,
.btn-outline-primary:active, .btn-outline-primary.active {
    color: #fff !important;
    background-color: #4b5066 !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
    color: #4b5066 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-outline-secondary {
    color: #b6b3aa !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:focus, .btn-outline-secondary.focus,
.btn-outline-secondary:active, .btn-outline-secondary.active {
    color: #fff !important;
    background-color: #b6b3aa !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
    color: #b6b3aa !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-outline-success {
    color: #319d24 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-success:hover,
.btn-outline-success:focus, .btn-outline-success.focus,
.btn-outline-success:active, .btn-outline-success.active {
    color: #fff !important;
    background-color: #319d24 !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-success.disabled, .btn-outline-success:disabled {
    color: #319d24 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-outline-info {
    color: #888fa9 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-info:hover,
.btn-outline-info:focus, .btn-outline-info.focus,
.btn-outline-info:active, .btn-outline-info.active {
    color: #fff !important;
    background-color: #888fa9 !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-info.disabled, .btn-outline-info:disabled {
    color: #888fa9 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-outline-warning {
    color: #ff7400 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-warning:hover,
.btn-outline-warning:focus, .btn-outline-warning.focus,
.btn-outline-warning:active, .btn-outline-warning.active {
    color: #fff !important;
    background-color: #ff7400 !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-warning.disabled, .btn-outline-warning:disabled {
    color: #ff7400 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-outline-danger {
    color: #ef2b41 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-danger:hover,
.btn-outline-danger:focus, .btn-outline-danger.focus,
.btn-outline-danger:active, .btn-outline-danger.active {
    color: #fff !important;
    background-color: #ef2b41 !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-danger.disabled, .btn-outline-danger:disabled {
    color: #ef2b41 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-outline-light {
    color: #f4f1e7 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-light:hover,
.btn-outline-light:focus, .btn-outline-light.focus,
.btn-outline-light:active, .btn-outline-light.active {
    color: #444 !important;
    background-color: #f4f1e7 !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-light.disabled, .btn-outline-light:disabled {
    color: #f4f1e7 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-outline-dark {
    color: #444 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-dark:hover,
.btn-outline-dark:focus, .btn-outline-dark.focus,
.btn-outline-dark:active, .btn-outline-dark.active {
    color: #fff !important;
    background-color: #444 !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-dark.disabled, .btn-outline-dark:disabled {
    color: #444 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-outline-white {
    color: #fff !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-white:hover,
.btn-outline-white:focus, .btn-outline-white.focus,
.btn-outline-white:active, .btn-outline-white.active {
    color: #000 !important;
    background-color: #fff !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-white.disabled, .btn-outline-white:disabled {
    color: #fff !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-outline-black {
    color: #000 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-outline-black:hover,
.btn-outline-black:focus, .btn-outline-black.focus,
.btn-outline-black:active, .btn-outline-black.active {
    color: #fff !important;
    background-color: #000 !important;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) !important;
}
.btn-outline-black.disabled, .btn-outline-black:disabled {
    color: #000 !important;
    background: transparent none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-link {
    color: #757b95;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-link:hover,
.btn-link:focus, .btn-link.focus,
.btn-link:active, .btn-link.active {
    color: #4b5066;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}

.btn-link:disabled, .btn-link.disabled {
    color: #757b95;
    text-decoration: none;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn i {
    font-size: 21px;
}
.btn.has-icon-left i {
    margin-right: 8px;
}
.btn.has-icon-right i {
    margin-left: 8px;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
}


.btn-lg, .btn-group-lg > .btn {
    padding: 0 14px;
    font-size: 14px;
    border-radius: 0;
    height: 42px;
}
.btn-group-lg > .btn + .dropdown-toggle-split, .btn-lg + .dropdown-toggle-split {
    padding: 0 14px;
    height: 42px;
}
.btn-lg i, .btn-group-lg > .btn i {
    font-size: 24px;
}

.btn-sm, .btn-group-sm > .btn {
    padding: 0 10px;
    font-size: 10px;
    height: 28px;
    border-radius: 0;
}
.btn-group-sm > .btn + .dropdown-toggle-split, .btn-sm + .dropdown-toggle-split {
    padding: 0 10px;
    height: 28px;
}
.btn-sm i, .btn-group-sm > .btn i {
    font-size: 18px;
}

.btn-pills,
.btn-pills:after {
    border-radius: 18px;
}

.btn-pills.btn-sm,
.btn-pills:before {
    border-radius: 15px;
}

.btn-pills.btn-lg,
.btn-pills:before {
    border-radius: 21px;
}

.btn-circle {
    border-radius: 100%;
    width: 46px;
    height: 46px;
    padding: 0 !important;
}

.btn-circle:before {
    border-radius: 100%;
}

.btn-circle.btn-sm {
    width: 36px;
    height: 36px;
}
.btn-circle.btn-lg {
    width: 56px;
    height: 56px;
}

.btn-wave-light .wave {
    position: absolute;
    z-index: 1;
    background: rgba(255, 255, 255, .85);
    border-radius: 100%;
    -webkit-transform: scale(0.2);
    -ms-transform: scale(0.2);
    transform: scale(0.2);
    opacity: 0;
    -webkit-animation: wave .5s ease-out;
    animation: wave .5s ease-out;
}
.btn-wave-dark .wave {
    position: absolute;
    z-index: 1;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 100%;
    -webkit-transform: scale(0.2);
    -ms-transform: scale(0.2);
    transform: scale(0.2);
    opacity: 0;
    -webkit-animation: wave .5s ease-out;
    animation: wave .5s ease-out;
}
@-webkit-keyframes wave {
    from {
        opacity: 1;
    }
    to {
        -webkit-transform: scale(5);
        transform: scale(5);
        opacity: 0;
    }
}
@keyframes wave {
    from {
        opacity: 1;
    }
    to {
        -webkit-transform: scale(5);
        transform: scale(5);
        opacity: 0;
    }
}
.btn-flash-light .flash {
    position: absolute;
    z-index: 1;
    background: rgba(255, 255, 255, .85);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-animation: flash .5s ease-out;
    animation: flash .5s ease-out;
}
.btn-flash-dark .flash {
    position: absolute;
    z-index: 1;
    background: rgba(0, 0, 0, 0.2);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-animation: flash .5s ease-out;
    animation: flash .5s ease-out;
}
@-webkit-keyframes flash {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
@keyframes flash {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

*[role="button"]{
    cursor: pointer;
}

/*------------------------------------------------
- CARD -------------------------------------------
------------------------------------------------*/

.card {
    margin-bottom: 20px;
    border: 0;
    border-radius: 0;
    position: relative;
    background: #fff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.card.card-fluid{
    height: calc(100vh - 209px);
}

.card.card-justify{
    height: calc(100% - 20px) !important;
}

.card.card-fluid{
    min-height: calc(100vh - 208px);
    height: auto;
}

.card-bordred{
    border: 4px solid;
}

.card-columns .card{
    margin-bottom: 20px;
}

.card-light {
    color: #000;
}

.card-light a {
    color: #888;
}

.card-light a:hover {
    color: #aaa;
}

.card-dark {
    color: #fff;
}

.card-dark a {
    color: #fff;
}

.card-dark a:hover {
    color: rgba(255, 255, 255, 0.5);
}

.card .card-header {
    border-radius: 0;
    position: relative;
    padding: 10px 12px;
    background: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.card .card-body {
    border-radius: 0;
    position: relative;
    padding: 10px 12px;
    background: transparent;
}

.card .card-footer {
    border-radius: 0;
    position: relative;
    padding: 10px 12px;
    background: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.card-bordred .card-header,
.card-bordred .card-footer{
    border-color: inherit;
}

.card .card-title {
    text-transform: uppercase;
}

.card .card-header .card-title ,
.card .card-footer .card-title {
    margin-bottom: 0;
}

.card .card-img,
.card .card-img-top {
    border-radius: 0;
}

.card-img-overlay {
    padding: 10px 12px;
    z-index: 4;
}

.card-group {
    margin-bottom: 20px;
}

.card-group .card{
    margin-bottom: 0;
}

.card-header-tabs{
    margin-right: 0;
    margin-bottom: -10px;
    margin-left: 0;
}

.card-header-pills{
    margin-right: 0;
    margin-left: 0;
}

.card .btn-options {
    height: 24px !important;
    width: 24px !important;
}

.card-dark .form-control-search{
    color: #fff;
}

/*------------------------------------------------
- CANVAS -----------------------------------------
------------------------------------------------*/

canvas {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-family: "Montserrat", sans-serif;
}

/*------------------------------------------------
- CAROUSEL ---------------------------------------
------------------------------------------------*/

.carousel{
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.carousel-dark .carousel-control-next-icon{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}

.carousel-dark .carousel-control-prev-icon{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}

.carousel-dark .carousel-indicators li{
    background-color: rgba(0,0,0,.5);
}

.carousel-dark .carousel-indicators li.active{
    background-color: rgba(0,0,0,1);
}


/*------------------------------------------------
- CHIPS ------------------------------------------
------------------------------------------------*/

.chip {
    display: inline-block;
    padding: 0 12px;
    height: 36px;
    font-size: 12px;
    line-height: 36px;
    border-radius: 36px;
    background-color: #f1f1f1;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.chip.chip-dark {
    color:#fff;
}

.chip img {
    float: left;
    margin: 0 10px 0 -13px;
    height: 36px;
    width: 36px;
    border-radius: 50%;
    -webkit-box-shadow: 2px 0px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 2px 0px 5px rgba(0, 0, 0, 0.2);
}

.chip .chip-close {
    padding-left: 10px;
    opacity: 0.6;
    font-weight: bold;
    float: right;
    font-size: 20px;
    cursor: pointer;
    color: #000;
}

.chip .chip-close:hover {
    opacity: 1;

}

.chip.chip-dark .chip-close {
    color: #fff;
}

/*------------------------------------------------
- CURRENT TIME -----------------------------------
------------------------------------------------*/

.clock {
    position: relative;
    width: 60px;
    height: 60px;
    border: 7px solid #fff;
    border-radius: 50%;
}

.clock:before {
    content: '';
    position: absolute;
    background: #fff;
    height: 40%;
    left: 46%;
    top: 10%;
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    width: 8%;
    -webkit-animation: rotate 3600s infinite steps(60);
    animation: rotate 3600s infinite steps(60);
}

.clock:after {
    content: '';
    position: absolute;
    background: #fff;
    height: 20%;
    left: 46%;
    top: 30%;
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    width: 8%;
    -webkit-animation: rotate 43200s infinite steps(60);
    animation: rotate 43200s infinite steps(60);
}

.clock-axis {
    position: absolute;
    background: #fff;
    height: 8%;
    width: 8%;
    top: 46%;
    left: 46%;
    border-radius: 100%;
}

@-webkit-keyframes rotate {
    100% {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
    }
}

@keyframes rotate {
    100% {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
    }
}

/*------------------------------------------------
- DROPDOWNMENU -----------------------------------
------------------------------------------------*/

.dropdown-fluid{
    position: static;
}

.dropdown-menu {
    border: 0;
    border-radius: 0;
    padding: 0;
    font-size: inherit;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.dropdown-fluid .dropdown-menu {
    width: calc(100% - 30px);
    max-width: inherit;
    right: 15px;
}


.no-caret.dropdown-toggle::after {
    display: none;
}

.dropdown-toggle::after{
    content: "\f107";
    font-family: "FontAwesome";
    border: none !important;
    height: auto !important;
    width: inherit !important;
}

.dropup .dropdown-toggle::after{
    content: "\f106";
}

.dropleft .dropdown-toggle::before{
    content: "\f104";
    font-family: "FontAwesome";
    border: none !important;
    height: auto !important;
    width: inherit !important;
}

.dropright .dropdown-toggle::after{
    content: "\f105";
}

.dropdown-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    font-size: 12px;
    color:#000;
}

.dropdown-menu .dropdown-block {
    max-height: 357px;
    padding: 10px 12px;
}

.dropdown-menu .dropdown-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 0;
    padding: 10px 16px;
    border-top: 1px solid rgba(0, 0, 0, 0.125);
    font-size: 12px;
    color:#000;
}

.dropdown-menu .dropdown-divider{
    margin:0 ;
}

.dropdown-menu .dropdown-title {
    font-size: 12px;
    text-transform: uppercase;
}

.dropdown-menu .dropdown-header .dropdown-title,
.dropdown-menu .dropdown-footer .dropdown-title {
    margin-bottom: 0;
}

.dropdown-menu .dropdown-text {
    font-size: 12px;
}

.dropdown-menu .dropdown-link {
    color: #000;
}

.dropdown-item.disabled,
.dropdown-item:disabled {
    opacity: 0.5;
}

.dropdown-menu .dropdown-link:hover,
.dropdown-menu .dropdown-link:focus,

.dropdown-menu .dropdown-link:active{
    color: rgba(0,0,0,0.5);
}

.dropdown-menu .dropdown-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px 16px;
    color: #000;
    font-size: 12px;
}

.dropdown-menu .dropdown-item i {
    font-size: 21px;
    margin-right: 8px;
}

.dropdown-menu .dropdown-item i.flag-icon {
    margin: 1.5px 8px 1.5px 0;
    font-size: 18px
}

.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.dropdown-menu .dropdown-item:active{
    background-color: rgba(0,0,0,0.02);
    color: #000;
}

.dropdown-menu .dropdown-item.active{
    background-color: rgba(0,0,0,0.02);
    position: relative;
}

.dropdown-menu .dropdown-item.active:after{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 5px;
    height: 100%;
    background-color: #4b5066;

}

/*------------------------------------------------
- FORMS -----------------------------------------
------------------------------------------------*/

.form-control {
    color: #000;
    /**--font-size: 12px;
    border-radius: 0;
    border:2px solid rgba(0,0,0,0.2);
    padding: 0 8px !important;
    height: 35px;
    line-height: 35px;
    -webkit-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
        */
    border: 1px solid #c1c7d0;
    border-radius: 3.01px;
    box-sizing: border-box;
    font-size: inherit;
    margin: 0;
    /**max-width: 250px;**/
    vertical-align: baseline;
    width: 100%;
}
}

.form-control:focus {
    border-color: #000;
    color: #000;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.form-control::-webkit-input-placeholder{
    font-size: 12px;
    color: #666;
}
.form-control:-ms-input-placeholder{
    font-size: 12px;
    color: #666;
}
.form-control:-ms-input-placeholder {
    font-size: 12px;
    color: #666;
}
.form-control::-ms-input-placeholder {
    font-size: 12px;
    color: #666;
}
.form-control::placeholder {
    font-size: 12px;
    color: #666;
}


.form-control-sm::-webkit-input-placeholder{
    font-size: 10px;
}
.form-control-sm:-ms-input-placeholder{
    font-size: 10px;
}
.form-control-sm:-ms-input-placeholder {
    font-size: 10px;
}
.form-control-sm::-ms-input-placeholder {
    font-size: 10px;
}
.form-control-sm::placeholder {
    font-size: 10px;
}

.form-control-lg::-webkit-input-placeholder{
    font-size: 14px;
}
.form-control-lg:-ms-input-placeholder{
    font-size: 14px;
}
.form-control-lg:-ms-input-placeholder {
    font-size: 14px;
}
.form-control-lg::-ms-input-placeholder {
    font-size: 14px;
}
.form-control-lg::placeholder {
    font-size: 14px;
}

.form-control:disabled, .form-control[readonly]{
    border-color: #b6b3aa;
    background-color: #b6b3aa;
    color: #fff;
}

.form-group{
    position: relative;
}

select.form-control:not([size]):not([multiple]){
    height: 2rem;
}

select.form-control:focus::-ms-value {
    color: #000;
}

.form-control[type=color]{
    padding: 0 2px !important;
}
.form-control[multiple]{
    height: inherit !important;
}

.col-form-label-lg {
    font-size: 14px;
}

.col-form-label-sm {
    font-size: 10px;
}

.input-group-append, .input-group-prepend {
    z-index: 4;
}

.input-group-prepend{
    margin-right: -2px;
}
.input-group-append{
    margin-left: -2px;
}
.input-group-prepend + .form-control,
.input-group-prepend + .SumoSelect > .CaptionCont ,
.input-group-prepend + .custom-file .custom-file-label{
    padding-left: 12px ;
}
.input-group-text {
    border: 0;
    background-color: #000;
    color: #fff;
    border-radius: 0;
    font-size: 12px;
}
.input-group-text i{
    font-size: 18px;
}

.input-group-sm > .input-group-prepend > .input-group-text,
.input-group-sm > .input-group-append > .input-group-text{
    font-size: 10px;
    height: 28px !important;
    border-radius: 0;
}
.form-control-sm, .input-group-sm > .form-control{
    font-size: 10px;
    border-radius: 0;
    height: 28px !important;
    line-height: 28px;
    padding: 0;
}
.input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-append > .btn,
.input-group-sm > .custom-select + CaptionCont,
.input-group-sm > .custom-file,
.input-group-sm > .custom-file > .custom-file-label,
.input-group-sm > .custom-file > .custom-file-label:after{
    font-size: 10px;
    border-radius: 0;
    height: 28px !important;
    line-height: 28px;
    padding: 0 10px;
}
input-group-sm > .custom-select ~ .optWrapper{
    top:28px !important;
}

select.form-control-sm:not([size]):not([multiple]), .input-group-sm > select.form-control:not([size]):not([multiple]),
.input-group-sm > .input-group-prepend > select.input-group-text:not([size]):not([multiple]),
.input-group-sm > .input-group-append > select.input-group-text:not([size]):not([multiple]),
.input-group-sm > .input-group-prepend > select.btn:not([size]):not([multiple]),
.input-group-sm > .input-group-append > select.btn:not([size]):not([multiple]) {
    height: 28px !important;
    padding-left: 0;
}

.input-group-lg > .input-group-prepend > .input-group-text,
.input-group-lg > .input-group-append > .input-group-text{
    font-size: 14px;
    padding: 0 14px;
    border-radius: 0;
}
.form-control-lg, .input-group-lg > .form-control{
    height: 42px !important;
    line-height: 42px !important;
    font-size: 14px;
    padding: 0;
    border-radius: 0;
}
.input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-append > .btn,
.input-group-lg > .custom-select + CaptionCont,
.input-group-lg > .custom-file,
.input-group-lg > .custom-file > .custom-file-label,
.input-group-lg > .custom-file > .custom-file-label:after{
    height: 42px !important;
    line-height: 42px !important;
    font-size: 14px;
    padding: 0 14px;
    border-radius: 0;
}
.input-group-lg > .custom-select ~ .optWrapper{
    top:42px !important;
}

select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.form-control:not([size]):not([multiple]),
.input-group-lg > .input-group-prepend > select.input-group-text:not([size]):not([multiple]),
.input-group-lg > .input-group-append > select.input-group-text:not([size]):not([multiple]),
.input-group-lg > .input-group-prepend > select.btn:not([size]):not([multiple]),
.input-group-lg > .input-group-append > select.btn:not([size]):not([multiple]) {
    height: 42px !important;
    padding-left: 0;
}

.valid-feedback {
    color: #319d24;
}
.valid-tooltip {
    background-color: rgba(49,157,36,0.8);
    font-size: 10px;
    border-radius: 0;
}
.was-validated .form-control:valid, .form-control.is-valid, .was-validated .custom-select:valid  + .CaptionCont,
.custom-select.is-valid + .CaptionCont{
    border-color: #319d24;
}
.was-validated .form-control:valid:focus, .form-control.is-valid:focus, .was-validated .custom-select:valid:focus,.was-validated .custom-select:valid:focus + .CaptionCont,
.custom-select.is-valid:focus, .custom-select.is-valid:focus + .CaptionCont {
    -webkit-box-shadow: none;
    box-shadow: none;
}
.was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label {
    color: #319d24;
}
.was-validated .custom-control-input:valid ~ .custom-control-label, .custom-control-input.is-valid ~ .custom-control-label {
    color: #319d24;
}
.was-validated .custom-control-input:valid ~ .custom-control-label::before, .custom-control-input.is-valid ~ .custom-control-label::before {
    background-color: #319d24;
}
.was-validated .custom-control-input:valid:checked ~ .custom-control-label::before, .custom-control-input.is-valid:checked ~ .custom-control-label::before {
    background-color: #319d24;
}
.was-validated .custom-control-input:valid:focus ~ .custom-control-label::before, .custom-control-input.is-valid:focus ~ .custom-control-label::before {
    -webkit-box-shadow: none;
    box-shadow: none;
}
.was-validated .custom-file-input:valid ~ .custom-file-label, .custom-file-input.is-valid ~ .custom-file-label {
    border-color: #319d24;
}
.was-validated .custom-file-input:valid ~ .custom-file-label::before, .custom-file-input.is-valid ~ .custom-file-label::before {
    border-color: #319d24;
}
.was-validated .custom-file-input:valid:focus ~ .custom-file-label, .custom-file-input.is-valid:focus ~ .custom-file-label {
    -webkit-box-shadow: none;
    box-shadow: none;
}
.was-validated .switch-control > input:checked + .switch-lever,  .switch-control > input.is-valid + .switch-lever {
    background-color: #319d24;
}

.invalid-feedback {
    color: #ef2b41;
}
.invalid-tooltip {
    background-color: rgba(239,43,35,0.8);
    font-size: 10px;
    border-radius: 0;
}
.was-validated .SumoSelect[validation="false"] + .invalid-feedback,
.was-validated .SumoSelect[validation="false"] + .invalid-tooltip {
    display: block;
    margin-top: -3px;
}
.was-validated .switch-control > input:not(:checked) ~ .invalid-feedback,
.was-validated .switch-control > input:not(:checked) ~ .invalid-tooltip{
    display: block;
}
.was-validated .form-control:invalid, .form-control.is-invalid, .was-validated .custom-select:invalid, .was-validated .custom-select:invalid + .CaptionCont,
.custom-select.is-invalid + .CaptionCont {
    border-color: #ef2b41;
}
.was-validated .custom-control-input:invalid ~ .custom-control-label, .custom-control-input.is-invalid ~ .custom-control-label {
    color: #ef2b41;
}
.was-validated .custom-control-input:invalid ~ .custom-control-label::before, .custom-control-input.is-invalid ~ .custom-control-label::before {
    background-color: #ef2b41;
}
.was-validated .custom-control-input:invalid:checked ~ .custom-control-label::before, .custom-control-input.is-invalid:checked ~ .custom-control-label::before {
    background-color: #ef2b41;
}
.was-validated .custom-control-input:invalid:focus ~ .custom-control-label::before, .custom-control-input.is-invalid:focus ~ .custom-control-label::before {
    -webkit-box-shadow:  none;
    box-shadow:  none;
}
.was-validated .custom-file-input:invalid ~ .custom-file-label, .custom-file-input.is-invalid ~ .custom-file-label {
    border-color: #ef2b41;
}
.was-validated .custom-file-input:invalid ~ .custom-file-label::before, .custom-file-input.is-invalid ~ .custom-file-label::before {
    border-color: inherit;
}
.was-validated .custom-file-input:invalid:focus ~ .custom-file-label, .custom-file-input.is-invalid:focus ~ .custom-file-label {
    -webkit-box-shadow:  none;
    box-shadow:  none;
}
.was-validated .switch-control > input:not(:checked)+ .switch-lever,  .switch-control > input.is-invalid + .switch-lever {
    background-color: #ef2b41;
}

textarea.form-control{
    padding: 7px 0;
    height: auto;
    line-height: 1.6;
}

textarea.form-control-sm{
    padding: 5px 0;
    height: auto;
    line-height: 1.6;
}

textarea.form-control-lg{
    padding: 9px 0;
    height: auto;
    line-height: 1.6;
}

.form-control-search{
    background-color: transparent;
    color: #000;
    width: 100%;
    border: 0;
    padding: 0;
}

.form-control-search:focus{
    outline:0;
}

.switch-control{
    position: relative;
}

.switch-control input {
    display: none;
}
.switch-control input:checked + .switch-lever:after {
    left: inherit;
    right: 0;
    background-color: #ddd;
}
.switch-lever {
    display: inline-block;
    position: relative;
    width: 36px;
    height: 10px;
    background-color: #555;
    border-radius: 10px;
    margin: 0 10px;
    top: 1px;
    cursor: pointer;
}
.switch-lever:after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    left: 0;
    top: -3px;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.switch-control input:disabled + .switch-lever {
    opacity: 0.5;
    cursor: inherit;
}

.custom-control.custom-control-inline{
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.custom-control-input:checked ~ .custom-control-label::before {
    background-color: #000;
}
.custom-control-input:focus ~ .custom-control-label::before {
    -webkit-box-shadow: none;
    box-shadow: none;
}
.custom-control-input:active ~ .custom-control-label::before {
    background-color: #000;
}
.custom-control-input:not(:disabled) ~ .custom-control-label{
    cursor: pointer;
}
.custom-control-input:disabled ~ .custom-control-label {
    color: #888;
}
.custom-control-input:disabled ~ .custom-control-label::before {
    background-color: #888;
}
.custom-control-label {
    margin-top: 3px;
}
.custom-control-label::before {
    background-color: #000;
}
.custom-checkbox .custom-control-label::before {
    border-radius: 0;
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #000;
}
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
    background-color: #000;
}
.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #000;
}

.custom-select-lg + .CaptionCont{
    height: 42px !important;
    line-height: 42px !important;
    font-size: 14px !important;
}

.custom-select-sm + .CaptionCont{
    height: 28px !important;
    line-height: 28px !important;
    font-size: 10px !important;
}

.custom-file{
    height: 35px;
}

.custom-file-input {
    height: 2rem;
    min-width: 100%;
}
.custom-file-input:focus ~ .custom-file-label,
.custom-file-input:active ~ .custom-file-label {
    border-color: #000 !important;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.custom-file-input:focus ~ .custom-file-label::before {
    border-color: #000;
}
.custom-file-label {
    color: #212529; /* color of the label "choose file" in textbox */
    height: 35px;
    line-height: 31px;
    border-radius: 0;
    padding: 0 8px;
    border: 2px solid rgba(0,0,0,0.125);
}
    .custom-file-label::after {
        content: attr(data-browse);
        margin-top: -1px;
        margin-right: -2px;
        background-color: #afb0b2; /* color of button "choose file" */
        border-color: #afb0b2; /* bordercolor of button "choose file" */
        border-radius: 3.01px;
        color: #fff;
        height: 35px;
        line-height: 35px;
        padding: 0 12px;
    }

.custom-file-sm > .custom-file-label,
.custom-file-sm > .custom-file-label:after{
    height: 28px !important;
    line-height: 28px !important;
    font-size: 10px;
    border-radius: 0;
}

.custom-file-lg > .custom-file-label,
.custom-file-lg > .custom-file-label:after{
    height: 42px !important;
    line-height: 42px !important;
    font-size: 14px;
    border-radius: 0;
}

.wizard{
    padding: 30px;
}

.wizard .wizard-header{
    text-align: center;
    margin-bottom: 35px;
}

.wizard .wizard-status{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding: 0;
    margin: 0;
    list-style: none;
}

.wizard .wizard-item{
    position: relative;
    z-index: 1;
    width: 72px;
    height: 72px;
    border: 3px solid #e9e6dd;
    color: #e9e6dd;
    background-color: #fff;
    border-radius: 50%;
    text-align: center;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.wizard .wizard-item.active{
    background-color: #4b5066;
    border-color: #4b5066;
    color: #fff;
}

.wizard .wizard-item i{
    line-height: 62px;
    font-size: 32px;

}

.wizard .wizard-title {
    position: relative;
    top: 16px;
    font-size: 12px;
    font-weight: bold;
    text-transform: capitalize;
    /*letter-spacing: 1px;*/
}

.wizard .wizard-item.active .wizard-title{
    color: #4b5066;
}

.wizard .wizard-action{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.wizard .wizard-next,
.wizard .wizard-submit{
    margin-left: auto;
}

.wizard .tab-pane.active{
    display: block;
    opacity: 1;
}

.wizard .wizard-progress{
    position: absolute;
    height: 3px;
    width: 100%;
    left: 0;
    top:34px;
    z-index: 0;
}

.wizard .tab-pane{
    padding-top: 51px;
    padding-bottom: 35px;
}

@media (max-width: 575px){
    .wizard{
        padding: 10px;
    }
    .wizard .wizard-item{
        width: 48px;
        height: 48px;
    }
    .wizard .wizard-item i{
        line-height: 42px;
        font-size: 24px;
    }
    .wizard .wizard-progress{
        top:24px;
    }
    .wizard .wizard-title {
        font-size: 10px;
    }
}

.wizard-sm .wizard-header {
    text-align: center;
    margin-bottom: 15px;
}

.wizard-sm .wizard-status {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding: 0;
    margin: 0;
    list-style: none;
}

.wizard-sm .wizard-item {
    position: relative;
    z-index: 1;
    width: 34px;
    height: 34px;
    border: 2px solid #e9e6dd;
    color: #e9e6dd;
    background-color: #fff;
    border-radius: 50%;
    text-align: center;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

    .wizard-sm .wizard-item button {
        color: #e9e6dd;
        width: 30px;
        height: 30px;
    }

    .wizard-sm .wizard-item i {
        line-height: 30px;
        font-size: 15px;
        width: 100%;
        height: 100%;
    }

.wizard-sm .wizard-item-title-only {
    width: 100%;
    height: 34px;
    text-align: center;
}

    .wizard-sm .wizard-item-title-only .wizard-title {
        top: 15px;
        font-size: 10px;
        color: #4b5066;
    }

.wizard-sm .wizard-item.active {
    background-color: #4b5066;
    border-color: #4b5066;
    color: #fff;
}

    .wizard-sm .wizard-item.active:hover {
        background-color: #fff;
    }

    .wizard-sm .wizard-item.active button {
        color: #fff;
    }

        .wizard-sm .wizard-item.active button:hover {
            color: #4b5066
        }

.wizard-sm .wizard-item.inactive {
    background-color: #fff;
    border-color: #4b5066;
    color: #4b5066;
}

    .wizard-sm .wizard-item.inactive:hover {
        background-color: #4b5066;
        border-color: #4b5066;
    }

    .wizard-sm .wizard-item.inactive button {
        color: #4b5066;
    }

        .wizard-sm .wizard-item.inactive button:hover {
            color: #fff
        }

.wizard-sm .wizard-title {
    position: relative;
    top: 7px;
    font-size: 5px;
    font-weight: bold;
    text-transform: capitalize;
    letter-spacing: 1px;
}

.wizard-sm .wizard-item.active .wizard-title {
    color: #e9e6dd;
}

.wizard-sm .wizard-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.wizard-sm .wizard-next,
.wizard-sm .wizard-submit {
    margin-left: auto;
}

.wizard-sm .tab-pane.active {
    display: block;
    opacity: 1;
}

.wizard-sm .wizard-progress {
    position: absolute;
    height: 2px;
    width: 100%;
    left: 0;
    top: 17px;
    z-index: 0;
}

.wizard-sm .tab-pane {
    padding-top: 25px;
    padding-bottom: 15px;
}

@media (max-width: 575px) {
    .wizard-sm .wizard-item {
        width: 25px;
        height: 25px;
    }

        .wizard-sm .wizard-item i {
            line-height: 20px;
            font-size: 10px;
        }

    .wizard-sm .wizard-progress {
        top: 12px;
    }

    .wizard-sm .wizard-title {
        font-size: 5px;
    }
}

/*------------------------------------------------
- LIST -------------------------------------------
------------------------------------------------*/

.list-striped{
    padding-left: 0;
    list-style: none;
}

.list-striped li{
    padding: 10px 12px;
}

.list-striped li:nth-child(even){
    background-color:rgba(0,0,0,0.075);
}

.list-group-item {
    padding: 10px 14px;
}
.list-group-item:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.list-group-item:last-child {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.list-group-item.disabled, .list-group-item:disabled {
    color: rgba(0,0,0,0.5);
}
.list-group-item.active {
    background-color: #4b5066;
    border-color: #4b5066;
}
.list-group-item-action.active:focus, .list-group-item-action.active:hover {
    color: #fff;
    background-color: #353c43;
}
.list-group-item-action:focus, .list-group-item-action:hover {
    color: #323232;
    background-color: #fafafa;
}

.list-group-item-primary {
    background-color: #e8e9ec;
}
a.list-group-item-primary,
button.list-group-item-primary {
    color: #4b5066;
}
a.list-group-item-primary:focus, a.list-group-item-primary:hover,
button.list-group-item-primary:focus,
button.list-group-item-primary:hover {
    color: #4b5066;
    background-color: #c9cbd1;
}
a.list-group-item-primary.active,
button.list-group-item-primary.active {
    background-color: #4b5066;
    border-color: #4b5066;
}

.list-group-item-secondary {
    color: #b6b3aa;
    background-color:  #f9f8f7;
}
a.list-group-item-secondary,
button.list-group-item-secondary {
    color: #b6b3aa;
}
a.list-group-item-secondary:focus, a.list-group-item-secondary:hover,
button.list-group-item-secondary:focus,
button.list-group-item-secondary:hover {
    color: #b6b3aa;
    background-color: #f0efec;
}
a.list-group-item-secondary.active,
button.list-group-item-secondary.active {
    background-color:  #b6b3aa;
    border-color:  #b6b3aa;
}

.list-group-item-success {
    color: #319d24;
    background-color: #e5f3e3;
}
a.list-group-item-success,
button.list-group-item-success {
    color: #319d24;
}
a.list-group-item-success:focus, a.list-group-item-success:hover,
button.list-group-item-success:focus,
button.list-group-item-success:hover {
    color: #319d24;
    background-color: #c0e2bd;
}
a.list-group-item-success.active,
button.list-group-item-success.active {
    background-color: #319d24;
    border-color: #319d24;
}

.list-group-item-info {
    color: #888fa9;
    background-color: #f0f1f4;
}
a.list-group-item-info,
button.list-group-item-info {
    color: #888fa9;
}
a.list-group-item-info:focus, a.list-group-item-info:hover,
button.list-group-item-info:focus,
button.list-group-item-info:hover {
    color: #888fa9;
    background-color: #dbdee5;
}
a.list-group-item-info.active,
button.list-group-item-info.active {
    background-color: #888fa9;
    border-color: #888fa9;
}

.list-group-item-warning {
    color: #ff7400;
    background-color: #fff1e5;
}
a.list-group-item-warning,
button.list-group-item-warning {
    color:#ff7400;
}
a.list-group-item-warning:focus, a.list-group-item-warning:hover,
button.list-group-item-warning:focus,
button.list-group-item-warning:hover {
    color: #ff7400;
    background-color: #ffd8b7;
}
a.list-group-item-warning.active,
button.list-group-item-warning.active {
    background-color: #ff7400;
    border-color: #ff7400;
}

.list-group-item-danger {
    color: #ef2b41;
    background-color: #fde4e7;
}
a.list-group-item-danger,
button.list-group-item-danger {
    color: #ef2b41;
}
a.list-group-item-danger:focus, a.list-group-item-danger:hover,
button.list-group-item-danger:focus,
button.list-group-item-danger:hover {
    color: #ef2b41;
    background-color: #fbbfc6;
}
a.list-group-item-danger.active,
button.list-group-item-danger.active {
    background-color: #ef2b41;
    border-color: #ef2b41;
}

.list-group-item-light {
    color: #bdbab3;
    background-color: #f4f1e7;
}
a.list-group-item-light,
button.list-group-item-light {
    color: #bdbab3;
}
a.list-group-item-light:focus, a.list-group-item-light:hover,
button.list-group-item-light:focus,
button.list-group-item-light:hover {
    color: #bdbab3;
    background-color: #e0ddd4;
}
a.list-group-item-light.active,
button.list-group-item-light.active {
    background-color: #f4f1e7;
    border-color: #f4f1e7;
}

.list-group-item-dark {
    color: #444;
    background-color: #e8e8e8;
}
a.list-group-item-dark,
button.list-group-item-dark {
    color: #444;
}
a.list-group-item-dark:focus, a.list-group-item-dark:hover,
button.list-group-item-dark:focus,
button.list-group-item-dark:hover {
    color: #444;
    background-color: #c8c8c8;
}
a.list-group-item-dark.active,
button.list-group-item-dark.active {
    background-color: #444;
    border-color: #444;
}

.list-info{
    list-style: none;
    padding: 0;
    margin: 16px 0;
}
.list-info li{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 12px;
}

/*------------------------------------------------
- LOAD SPINNER -----------------------------------
------------------------------------------------*/

#wrapper-load:not(.end) .load-container {
    position: absolute;
    top:0;
    left:0;
    right: 0;
    bottom: 0;
    margin: auto;
    height: 100px;
    width: 180px;
    text-align: center;
    color: #fff;
}

#wrapper-load:not(.end) .load-container h6{
    font-size: 12px !important;
    letter-spacing: 2px;
}


#wrapper-load.end .load-container img,
#wrapper-load.end .load-container h6 {
    display: none;
}

#wrapper-load:not(.end) .load-container .load-bard{
    width: 20px;
    height: 1px;
    margin-bottom:8px;
    background-color: #fff;
    -webkit-animation: animate-load 0.8s  infinite;
    animation: animate-load 1s  infinite;
    margin-left:auto;
    margin-right: auto;
    position: relative;
}
#wrapper-load:not(.end) .load-container .load-bard:nth-of-type(2) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
    width: 14px;
}
#wrapper-load:not(.end) .load-container .load-bard:nth-of-type(3){
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
    width: 8px;
}

@-webkit-keyframes animate-load {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
@keyframes animate-load {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

/*------------------------------------------------
- NAV --------------------------------------------
------------------------------------------------*/

.nav-tabs .nav-link{
    border-radius: 0;
}

.nav-tabs .nav-link.disabled {
    color: white;
    background-color: lightgray;
    border-color: white;
}

.nav-pills .nav-link{
    border-radius: 0;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
    background-color: #4b5066;
}

/*------------------------------------------------
- MODAL ------------------------------------------
------------------------------------------------*/

.modal-content{
    border: 0;
    border-radius: 0;
    -webkit-box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.modal-backdrop.show{
    opacity: 0.3;
}

.modal-open{
    padding: 0 !important;
}

.modal-gallery .modal-content{
    margin-right: -17px;
    width: auto;
}

.modal-gallery .modal-dialog{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.close {
    z-index: 2;
    position: relative;
}

button.close.float{
    position: absolute;
    right: 14px;
    top: 14px;
    color: #000;
    background: #fff;
    opacity: 0.8;
    width: 24px;
    height: 24px;
    line-height: 24px;
    font-size: 22px;
    border-radius: 100%;
    outline: none !important;
}

/*------------------------------------------------
- PAGINATION -------------------------------------
------------------------------------------------*/

.pagination{
    border-radius: 0;
}

.page-item:first-child .page-link,
.page-item:last-child .page-link,
.pagination-sm .page-item:first-child .page-link,
.pagination-sm .page-item:last-child .page-link,
.pagination-lg .page-item:first-child .page-link,
.pagination-lg .page-item:last-child .page-link{
    border-radius: 0;
}

.page-item .page-link{
    color: #000;
    border-top: 0;
    border-bottom:0;
}

.pagination .page-item .page-link{
    border: 0;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1) !important;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1) !important;
}

.page-item .page-link:hover,
.page-item .page-link:focus{
    background-color: #f4f1e7;
    color: #000;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.page-item.active .page-link{
    background-color: #4b5066;
    border-color: #4b5066;
    color: #fff;
}

.page-item.active .page-link:hover,
.page-item.active .page-link:focus{
    background-color: #3a3d52;
    border-color: #3a3d52;
}

.pagination-sm .page-link{
    font-size: 10px;
}

.pagination-lg .page-link{
    font-size: 14px;
}

.pagination-circle .page-link{
    width: 36px;
    height: 36px;
    line-height: 36px;
    border-radius: 100% !important;
    text-align: center;
    padding: 0;
}

.pagination-sm.pagination-circle .page-link{
    width: 28px;
    height: 28px;
    line-height: 28px;
    border-radius: 100% !important;
    text-align: center;
    padding: 0;
}

.pagination-lg.pagination-circle .page-link{
    width: 44px;
    height: 44px;
    line-height: 44px;
    border-radius: 100% !important;
    text-align: center;
    padding: 0;
}

.pagination-circle .page-item + .page-item{
    margin-left: 5px;
}

/*------------------------------------------------
- POPOVER ----------------------------------------
------------------------------------------------*/

.popover{
    border-radius: 0;
    border: 0;
    -webkit-box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.popover-header{
    padding: 6px 10px;
    border-radius: 0;
    font-size: 14px;
    font-family: "Montserrat", sans-serif;
    background-color: #fff;
    border-bottom: 1px solid rgba(0,0,0,0.125);
}

.popover-body{
    font-family: "Montserrat", sans-serif;
    padding: 6px 10px;
    border-radius: 0;
    font-size: 12px;
}

.popover .arrow{
    width: 8px;
    height: 8px;
}

.popover .arrow::after{
    display: none;
}
.popover .arrow::before{
    border: 0;
    width: 8px;
    height: 8px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    background-color: #fff;
}

.popover.bs-popover-auto[x-placement^=top] .arrow::before,
.popover.bs-popover-top .arrow::before{
    bottom: 5px;
    margin-left: 0;
    -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.065);
    box-shadow: 1px 1px 1px rgba(0,0,0,0.065);
}

.popover.bs-popover-auto[x-placement^=bottom] .arrow::before,
.popover.bs-popover-bottom .arrow::before{
    top: 5px;
    margin-left: 0;
    -webkit-box-shadow: -1px -1px 1px rgba(0,0,0,0.065);
    box-shadow: -1px -1px 1px rgba(0,0,0,0.065);
}

.popover.bs-popover-auto[x-placement^=right] .arrow::before,
.popover.bs-popover-right .arrow::before{
    margin-top: 0;
    left: 5px;
    -webkit-box-shadow: -1px 1px 1px rgba(0,0,0,0.065);
    box-shadow: -1px 1px 1px rgba(0,0,0,0.065);
}

.popover.bs-popover-auto[x-placement^=left] .arrow::before,
.popover.bs-popover-left .arrow::before{
    margin-top: 0;
    right: 5px;
    -webkit-box-shadow: 1px -1px 1px rgba(0,0,0,0.065);
    box-shadow: 1px -1px 1px rgba(0,0,0,0.065);
}

/*------------------------------------------------
- PROGRESS ---------------------------------------
------------------------------------------------*/

.progress {
    height: 10px;
    border-radius: 0;
    background-color: #e9e6dd;
}

.progress-bar {
    background-color: #4b5066;
}

/*------------------------------------------------
- TOOLTIP ----------------------------------------
------------------------------------------------*/

.tooltip-inner {
    font-size: 10px !important;
    font-family: "Montserrat", sans-serif;
    border-radius: 0;
    padding: 0.5rem 1rem;
    background: rgba(0, 0, 0, 0.9);
}

.tooltip.bs-tooltip-auto[x-placement^="top"] .arrow::before,
.tooltip.bs-tooltip-top .arrow::before{
    border-top-color: rgba(0, 0, 0, 0.9);
}

.tooltip.bs-tooltip-auto[x-placement^="bottom"] .arrow::before,
.tooltip.bs-tooltip-bottom .arrow::before{
    border-bottom-color: rgba(0, 0, 0, 0.9);
}

.tooltip.bs-tooltip-auto[x-placement^="left"] .arrow::before,
.tooltip.bs-tooltip-left .arrow::before{
    border-left-color: rgba(0, 0, 0, 0.9);
}

.tooltip.bs-tooltip-auto[x-placement^="right"] .arrow::before,
.tooltip.bs-tooltip-right .arrow::before{
    border-right-color: rgba(0, 0, 0, 0.9);
}

/*===================================================================================================
- UTILITIES -----------------------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- BORDER  ----------------------------------------
------------------------------------------------*/

.border {
    border:1px solid rgba(0,0,0,0.125) !important;
}
.border-right {
    border-right: solid rgba(0,0,0,0.125) !important;
    border-width:1px !important;
}
.border-left {
    border-left: solid rgba(0,0,0,0.125) !important;
    border-width:1px !important;
}
.border-top {
    border-top: solid rgba(0,0,0,0.125) !important;
    border-width:1px !important;
}
.border-bottom {
    border-bottom: solid rgba(0,0,0,0.125) !important;
    border-width:1px !important;
}

.border-0{
    border:0 !important;
}
.border-left-0 {
    border-left: 0 !important;
}
.border-right-0 {
    border-right: 0 !important;
}
.border-top-0 {
    border-top: 0 !important;
}
.border-bottom-0 {
    border-bottom: 0 !important;
}

@media (min-width: 576px){
    .border-sm {
        border:1px solid rgba(0,0,0,0.125) !important;
    }
    .border-right-sm {
        border-right: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-left-sm {
        border-left: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-top-sm {
        border-top: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-bottom-sm {
        border-bottom: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-sm-0{
        border:0 !important;
    }
    .border-right-sm-0 {
        border-right: 0 !important;
    }
    .border-left-sm-0 {
        border-left: 0 !important;
    }
    .border-top-sm-0 {
        border-top: 0 !important;
    }
    .border-bottom-sm-0 {
        border-bottom: 0 !important;
    }
}
@media (min-width: 768px){
    .border-md {
        border:1px solid rgba(0,0,0,0.125) !important;
    }
    .border-right-md {
        border-right: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-left-md {
        border-left: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-top-md {
        border-top: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-bottom-md {
        border-bottom: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-md-0{
        border:0 !important;
    }
    .border-right-md-0 {
        border-right: 0 !important;
    }
    .border-left-md-0 {
        border-left: 0 !important;
    }
    .border-top-md-0 {
        border-top: 0 !important;
    }
    .border-bottom-md-0 {
        border-bottom: 0 !important;
    }
}
@media (min-width: 992px){
    .border-lg {
        border:1px solid rgba(0,0,0,0.125) !important;
    }
    .border-right-lg {
        border-right: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-left-lg {
        border-left: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-top-lg {
        border-top: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-bottom-lg {
        border-bottom: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-lg-0{
        border:0 !important;
    }
    .border-right-lg-0 {
        border-right: 0 !important;
    }
    .border-left-lg-0 {
        border-left: 0 !important;
    }
    .border-top-lg-0 {
        border-top: 0 !important;
    }
    .border-bottom-lg-0 {
        border-bottom: 0 !important;
    }
}
@media (min-width: 1200px){
    .border-xl {
        border:1px solid rgba(0,0,0,0.125) !important;
    }
    .border-right-xl {
        border-right: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-left-xl {
        border-left: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-top-xl {
        border-top: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-bottom-xl {
        border-bottom: solid rgba(0,0,0,0.125) !important;
        border-width:1px !important;
    }
    .border-xl-0{
        border:0 !important;
    }
    .border-right-xl-0 {
        border-right: 0 !important;
    }
    .border-left-xl-0 {
        border-left: 0 !important;
    }
    .border-top-xl-0 {
        border-top: 0 !important;
    }
    .border-bottom-xl-0 {
        border-bottom: 0 !important;
    }
}

.border-1{
    border-width: 1px !important;
}
.border-2{
    border-width: 2px !important;
}
.border-3{
    border-width: 3px !important;
}
.border-4{
    border-width: 4px !important;
}
.border-5{
    border-width: 5px !important;
}

.border-primary {
    border-color: #4b5066 !important;
}

.border-secondary {
    border-color: #b6b3aa !important;
}

.border-success {
    border-color: #319d24 !important;
}

.border-info {
    border-color: #888fa9 !important;
}

.border-warning {
    border-color: #ff7400 !important;
}

.border-danger {
    border-color: #ef2b41 !important;
}

.border-light {
    border-color: #f4f1e7 !important;
}

.border-dark {
    border-color: #464646 !important;
}

.border-white {
    border-color: #fff !important;
}

.border-black {
    border-color: #000 !important;
}

.border-fade{
    position: relative;
}

.border-fade:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.15)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: -o-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: linear-gradient(to right, rgba(0,0,0,0.15), rgba(0,0,0,0));
}

hr.border-fade{
    border-top-color:transparent;
}

/*------------------------------------------------
- FILTER ------------------------------------------
------------------------------------------------*/

.filter-opacity {
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.filter-opacity[data-opacity="0"] {
    opacity: 0;
}

.filter-opacity[data-opacity="10"] {
    opacity: 0.1;
}

.filter-opacity[data-opacity="20"] {
    opacity: 0.2;
}

.filter-opacity[data-opacity="30"] {
    opacity: 0.3;
}

.filter-opacity[data-opacity="40"] {
    opacity: 0.4;
}

.filter-opacity[data-opacity="50"] {
    opacity: 0.5;
}

.filter-opacity[data-opacity="60"] {
    opacity: 0.6;
}

.filter-opacity[data-opacity="70"] {
    opacity: 0.7;
}

.filter-opacity[data-opacity="80"] {
    opacity: 0.8;
}

.filter-opacity[data-opacity="90"] {
    opacity: 0.9;
}

.filter-opacity[data-opacity="100"] {
    opacity: 1;
}

/*------------------------------------------------
- ICON  ------------------------------------------
------------------------------------------------*/

.icon-xs{
    font-size: 14px !important;
}

.icon-sm{
    font-size: 18px !important;
}

.icon-md{
    font-size: 24px !important;
}

.icon-lg{
    font-size: 32px !important;
}

#icons h6{
    margin-top: 4px;
    font-family: Montserrat, Arial, Tahoma, sans-serif !important;
}

.flag-icon {
    -webkit-box-shadow: 0 0 1px rgba(0,0,0,0.125);
    box-shadow: 0 0 1px rgba(0,0,0,0.125);
}


/*------------------------------------------------
- PROTOTIPO FILE  --------------------------------
------------------------------------------------*/

.snazzy-file{
    font-family: Montserrat, Arial, Tahoma, sans-serif;
    position:relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width:24px;
    height:24px;
    background:#4b5066;
    color: white;
    font-weight: 500;
    font-size: 6px;
    margin-top:10px;
    margin-bottom: 4px;
    text-align: center;
    vertical-align: text-bottom;
    -webkit-box-shadow: 0.5px 1px 1px 0px rgba(0,0,0,0.55);
    box-shadow: 0.5px 1px 1px 0px rgba(0,0,0,0.55);
}
.snazzy-file:before{
    content:"";
    position:absolute;
    height:8px;
    width:16px;
    left:0;
    top: -8px;
    background-color:#4b5066;
}
.snazzy-file:after{
    content:"";
    position:absolute;
    height:0px;
    width:0px;
    right:0;
    top:-8px;
    border:4px solid #3b4052;
    border-top-color:transparent;
    border-right-color:transparent;
    -webkit-box-shadow: -1px 1px 1px rgba(0,0,0,0.125);
    box-shadow: -1px 1px 1px rgba(0,0,0,0.125);
}

.snazzy-file.snazzy-file-sm{
    width:12px;
    height:12px;
    margin-top:4px;
    font-size: 3px;
}
.snazzy-file.snazzy-file-sm:before{
    height:4px;
    width:8px;
    top: -4px;
}
.snazzy-file.snazzy-file-sm:after{
    border-width: 2px;
    top:-4px;
}

.snazzy-file.snazzy-file-lg{
    width:48px;
    height:48px;
    margin-top:20px;
    font-size: 12px;
}
.snazzy-file.snazzy-file-lg:before{
    height:16px;
    width:32px;
    top: -16px;
}
.snazzy-file.snazzy-file-lg:after{
    border-width: 8px;
    top:-16px;
}

.snazzy-file.snazzy-file-xl{
    width:96px;
    height:96px;
    margin-top:36px;
    font-size: 24px;
}
.snazzy-file.snazzy-file-xl:before{
    height:32px;
    width:64px;
    top: -32px;
}
.snazzy-file.snazzy-file-xl:after{
    border-width: 16px;
    top:-32px;
}

.snazzy-file.snazzy-file-primary, .snazzy-file.snazzy-file-primary:before{
    background-color:#4b5066;
}
.snazzy-file.snazzy-file-primary:after{
    border-left-color: #393c52;
    border-bottom-color:#393c52;
}

.snazzy-file.snazzy-file-secondary, .snazzy-file.snazzy-file-secondary:before{
    background-color:#b6b3aa;
}
.snazzy-file.snazzy-file-secondary:after{
    border-left-color: #a29f96;
    border-bottom-color:#a29f96;
}

.snazzy-file.snazzy-file-success, .snazzy-file.snazzy-file-success:before{
    background-color:#319d24;
}
.snazzy-file.snazzy-file-success:after{
    border-left-color: #2d8922;
    border-bottom-color:#2d8922;
}

.snazzy-file.snazzy-file-info, .snazzy-file.snazzy-file-info:before{
    background-color:#888fa9;
}
.snazzy-file.snazzy-file-info:after{
    border-left-color: #747b95;
    border-bottom-color:#747b95;
}

.snazzy-file.snazzy-file-warning, .snazzy-file.snazzy-file-warning:before{
    background-color:#ff7400;
}
.snazzy-file.snazzy-file-warning:after{
    border-left-color: #eb7300;
    border-bottom-color:#eb7300;
}

.snazzy-file.snazzy-file-danger, .snazzy-file.snazzy-file-danger:before{
    background-color:#ef2b41;
}
.snazzy-file.snazzy-file-danger:after{
    border-left-color: #db2b3f;
    border-bottom-color:#db2b3f;
}

.snazzy-file.snazzy-file-light, .snazzy-file.snazzy-file-light:before{
    background-color:#ececeb;
    color: #9f9f9e;
}
.snazzy-file.snazzy-file-light:after{
    border-left-color:#c2c2c1;
    border-bottom-color:#c2c2c1;
}

.snazzy-file.snazzy-file-dark, .snazzy-file.snazzy-file-dark:before{
    background-color:#121212;
}
.snazzy-file.snazzy-file-dark:after{
    border-left-color: #363636;
    border-bottom-color:#363636;
}

.snazzy-file.snazzy-file-red, .snazzy-file.snazzy-file-red:before{
    background-color:#f44336;
}
.snazzy-file.snazzy-file-red:after{
    border-left-color:#c62828;
    border-bottom-color:#c62828;
}

.snazzy-file.snazzy-file-pink, .snazzy-file.snazzy-file-pink:before{
    background-color:#e91e63;
}
.snazzy-file.snazzy-file-pink:after{
    border-left-color:#ad1457;
    border-bottom-color:#ad1457;
}

.snazzy-file.snazzy-file-purple, .snazzy-file.snazzy-file-purple:before{
    background-color:#9c27b0;
}
.snazzy-file.snazzy-file-purple:after{
    border-left-color:#6a1b9a;
    border-bottom-color:#6a1b9a;
}

.snazzy-file.snazzy-file-deep-purple, .snazzy-file.snazzy-file-deep-purple:before{
    background-color:#673ab7;
}
.snazzy-file.snazzy-file-deep-purple:after{
    border-left-color:#4527a0;
    border-bottom-color:#4527a0;
}

.snazzy-file.snazzy-file-indigo, .snazzy-file.snazzy-file-indigo:before{
    background-color:#3f51b5;
}
.snazzy-file.snazzy-file-indigo:after{
    border-left-color:#283593;
    border-bottom-color:#283593;
}

.snazzy-file.snazzy-file-blue, .snazzy-file.snazzy-file-blue:before{
    background-color:#2196f3;
}
.snazzy-file.snazzy-file-blue:after{
    border-left-color:#1565c0;
    border-bottom-color:#1565c0;
}

.snazzy-file.snazzy-file-light-blue, .snazzy-file.snazzy-file-light-blue:before{
    background-color:#03a9f4;
}
.snazzy-file.snazzy-file-light-blue:after{
    border-left-color:#0277bd;
    border-bottom-color:#0277bd;
}

.snazzy-file.snazzy-file-cyan, .snazzy-file.snazzy-file-cyan:before{
    background-color:#00bcd4;
}
.snazzy-file.snazzy-file-cyan:after{
    border-left-color:#00838f;
    border-bottom-color:#00838f;
}

.snazzy-file.snazzy-file-teal, .snazzy-file.snazzy-file-teal:before{
    background-color:#009688;
}
.snazzy-file.snazzy-file-teal:after{
    border-left-color:#00695c;
    border-bottom-color:#00695c;
}

.snazzy-file.snazzy-file-green, .snazzy-file.snazzy-file-green:before{
    background-color:#4caf50;
}
.snazzy-file.snazzy-file-green:after{
    border-left-color:#2e7d32;
    border-bottom-color:#2e7d32;
}

.snazzy-file.snazzy-file-light-green, .snazzy-file.snazzy-file-light-green:before{
    background-color:#8bc34a;
}
.snazzy-file.snazzy-file-light-green:after{
    border-left-color:#558b2f;
    border-bottom-color:#558b2f;
}

.snazzy-file.snazzy-file-lime, .snazzy-file.snazzy-file-lime:before{
    background-color:#cddc39;
}
.snazzy-file.snazzy-file-lime:after{
    border-left-color:#9e9d24;
    border-bottom-color:#9e9d24;
}

.snazzy-file.snazzy-file-yellow, .snazzy-file.snazzy-file-yellow:before{
    background-color:#ffeb3b;
    color: #c6b531;
}
.snazzy-file.snazzy-file-yellow:after{
    border-left-color:#f9a825;
    border-bottom-color:#f9a825;
}

.snazzy-file.snazzy-file-amber, .snazzy-file.snazzy-file-amber:before{
    background-color:#ffc107;
}
.snazzy-file.snazzy-file-amber:after{
    border-left-color:#ff8f00;
    border-bottom-color:#ff8f00;
}

.snazzy-file.snazzy-file-orange, .snazzy-file.snazzy-file-orange:before{
    background-color:#ff9800;
}
.snazzy-file.snazzy-file-orange:after{
    border-left-color:#ef6c00;
    border-bottom-color:#ef6c00;
}

.snazzy-file.snazzy-file-deep-orange, .snazzy-file.snazzy-file-deep-orange:before{
    background-color:#ff5722;
}
.snazzy-file.snazzy-file-deep-orange:after{
    border-left-color:#d84315;
    border-bottom-color:#d84315;
}

.snazzy-file.snazzy-file-brown, .snazzy-file.snazzy-file-brown:before{
    background-color:#795548;
}
.snazzy-file.snazzy-file-brown:after{
    border-left-color:#4e342e;
    border-bottom-color:#4e342e;
}

.snazzy-file.snazzy-file-grey, .snazzy-file.snazzy-file-grey:before{
    background-color:#9e9e9e;
}
.snazzy-file.snazzy-file-grey:after{
    border-left-color:#424242;
    border-bottom-color:#424242;
}

.snazzy-file.snazzy-file-blue-grey, .snazzy-file.snazzy-file-blue-grey:before{
    background-color:#607d8b;
}
.snazzy-file.snazzy-file-blue-grey:after{
    border-left-color:#37474f;
    border-bottom-color:#37474f;
}

/*===================================================================================================
- BOX -----------------------------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- BOX ACCOUNT ------------------------------------
------------------------------------------------*/

.box-account {
    padding: 36px;
    width: 340px;
}

.box-account .box-account-logo{
    display: block;
    margin: 0 auto 20px;
}

.box-account .box-account-img{
    position: relative;
    z-index: 2;
    width: 60px;
    height: 60px;
    -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1), 0 0 5px 0 rgba(0, 0, 0, 0.1), 0 0 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1), 0 0 5px 0 rgba(0, 0, 0, 0.1), 0 0 1px -2px rgba(0, 0, 0, 0.1);
}

.box-account .box-account-title {
    display: block;
    margin-bottom: 20px;
    text-align: center;
    text-transform: uppercase;
}

.box-account .box-account-text {
    margin-bottom: 20px;
}

.box-account .box-account-form {
    margin-bottom: 20px;
}

.box-account .form-control {
    margin-bottom: 20px;
}

.box-account .custom-control {
    margin-bottom: 20px;
}

.box-account .box-account-social {
    margin-bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.box-account .box-account-social .btn {
    width: 24%;
}

.box-account .box-account-social .btn i{
    font-size: 16px;
}

.box-account-or {
    margin-bottom: 20px;
    height: 1px;
    width: 100%;
    background: rgba(0, 0, 0, 0.125);
    position: relative;
}

.box-account-or:before {
    content: "OR";
    font-size: 10px;
    position: absolute;
    top: -7px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background: #fff;
    z-index: 1;
    width: 26px;
    padding-left: 6px;
}

.box-account-form-lock{
    border: 2px solid rgba(0,0,0,0.125);
    outline: none !important;
    padding-left: 12px;
    border-left: 0;
    height:45px ;
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 1%;
}

.box-account-form-lock + i{
    position: absolute;
    right: 8px;
    margin: auto;
    top:0;
    bottom: 0;
    font-size: 20px;
}

@media screen and (max-width: 575px) {
    .box-account {
        min-height: 100vh;
        height: 100%;
        width: 100%;
    }
}

/*---------------------
-  BOX ACTIVITIES -----
---------------------*/

.box-activities .activities-list{
    padding: 0;
    margin:0;
    list-style: none;
}

.box-activities .activities-item{
    position: relative;
    padding: 14px 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.box-activities .activities-item + .activities-item:after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.15)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: -o-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: linear-gradient(to right, rgba(0,0,0,0.15), rgba(0,0,0,0));
}

.box-activities .activities-icon{
    width: 40px;
    height: 40px;
    color: #fff;
    text-align: center;
}

.box-activities .activities-icon i{
    line-height: 40px;
    font-size: 24px;
}

.box-activities .activities-icon img{
    border:1px solid rgba(0,0,0,0.125);
}

.box-activities .activities-content{
    padding-left:10px;
    width: calc(100% - 47px);
}

.box-activities .activities-content p{
    margin-bottom: 4px !important;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

.box-activities .activities-content span{
    font-size: 8px;
    opacity: 0.75;
}

/*------------------------------------------------
- BOX CHAT ---------------------------------------
------------------------------------------------*/

.box-chat .chat-list {
    list-style: none;
    padding: 10px 6px;
    margin: 0;
}

.box-chat .chat-item {
    position: relative;
    margin: 0 10px;
    width: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.box-chat .chat-item + .chat-item {
    margin-top: -25px;
}

.box-chat .item-img {
    margin-bottom: 10px;
}

.box-chat .item-img img {
    width: 56px;
    position: relative;
    z-index: 2;
    border-radius: 100%;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.box-chat .item-message {
    padding: 14px 12px;
    position: relative;
    font-size: 12px;
    color: #fff;
    margin-top: 5px;
    border-radius: 5px;
}

.box-chat .item-message:before {
    content: "";
    position: absolute;
    top: -16px;
    width: 24px;
    height: 18px;
}

.box-chat .item-time {
    margin: 6px;
    font-size: 9px;
    opacity: 0.5;
}

.box-chat .item-left {
    float: left;
}

.box-chat .item-left .item-message {
    background-color: #313649;
    border-top-left-radius: 0;
    float: left;
}

.box-chat .item-left .item-message:before {
    background-image: url('data:image/svg+xml;utf8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 18" enable-background="new 0 0 24 18" xml:space="preserve"> <path fill="#313649" stroke="#313649" stroke-miterlimit="10" d="M0.5,3v14.5h19.6c-1.6-0.5-3.4-1.1-5.3-1.8 c-2.1-0.8-3.9-1.7-5.5-2.6c-1.3-0.8-3.1-2.1-4.8-4C2.4,6.8,1.2,4.6,0.5,3z"/></svg> ');
    left: 0;
}

.box-chat .item-right {
    float: right;
}

.box-chat .item-right .item-img {
    text-align: right;
}

.box-chat .item-right .item-message {
    background-color: #ef2b41;
    border-top-right-radius: 0;
    float: right;
}

.box-chat .item-right .item-message:before {
    background-image: url('data:image/svg+xml;utf8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 18" enable-background="new 0 0 24 18" xml:space="preserve"> <path fill="#ef2b41" stroke="#ef2b41" stroke-miterlimit="10" d="M0.5,3v14.5h19.6c-1.6-0.5-3.4-1.1-5.3-1.8 c-2.1-0.8-3.9-1.7-5.5-2.6c-1.3-0.8-3.1-2.1-4.8-4C2.4,6.8,1.2,4.6,0.5,3z"/></svg> ');
    -webkit-transform:  rotateY(180deg);
    transform:  rotateY(180deg);
    right: 0;
}

.box-chat .item-right .item-time {
    text-align: right;
}

/*------------------------------------------------
- BOX CONTACT ------------------------------------
------------------------------------------------*/

.box-contact .contact-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.box-contact .contact-item {
    position: relative;
    padding: 10px 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.box-contact .contact-item + .contact-item:after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.15)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: -o-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: linear-gradient(to right, rgba(0,0,0,0.15), rgba(0,0,0,0));
}

.box-contact .contact-img {
    width: 56px;
    height: 56px;
    position: relative;

}

.box-contact .contact-img img {
    border-radius: 100%;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.box-contact .contact-content {
    padding-left: 10px;
    text-align: left;
    width: calc(100% - 106px);
}

.box-contact .contact-link{
    font-size: 14px;
    margin-bottom: 8px;
    text-decoration: none;
}

.box-contact .contact-text {
    font-size: 10px;
    opacity: 0.8;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    margin-bottom: 0;
}

.box-contact .contact-time {
    font-size: 9px;
    opacity: 0.5;
    text-align: right;
    width: 50px;
}

/*------------------------------------------------
- BOX FILE ---------------------------------------
------------------------------------------------*/

.box-file {
    position: relative;
    padding: 14px;
}

.box-file .nav {
    margin-top: 12px;
}

.box-file .nav-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 16px;
    color: #000;
}

.box-file .nav-link.active {
    padding-left: 11px;
    border-left: 5px solid #ef2b41;
    background-color: rgba(0, 0, 0, 0.02);
}

.box-file .nav-link:hover {
    color: inherit;
    background-color: rgba(0, 0, 0, 0.02);
}

.box-file .nav-title {
    margin-left: 15px;
}

.box-file .file-container{
    width: 100%;
    display: inline-block;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.box-file .file-icon{
    height: 90px;
    background: #fefefe center;
    color: #fff;
    text-align: center;
}

.box-file .file-icon .sheet-icons{
    margin-top: 24px;
}

.box-file .file-info{
    padding: 8px;
    background-color:#f4f1e7;
    text-align: center;
}

.box-file .table th{
    border-width: 1px;
}

.box-file .table th +th{
    padding-left:0;
}

.box-file .table th +th:before{
    content:"";
    padding-right:.75rem;
    border-left: 1px solid rgba(0,0,0,0.125);
}

.box-file .table td{
    height: 96px !important;
}

/*------------------------------------------------
- BOX MAIL ---------------------------------------
------------------------------------------------*/

.box-mail {
    position: relative;
    padding: 14px;
}

.box-mail .nav {
    margin-top: 12px;
}

.box-mail .nav-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 16px;
    color: #000;
}

.box-mail .nav-link.active {
    padding-left: 11px;
    border-left: 5px solid #ef2b41;
    background-color: rgba(0, 0, 0, 0.02);
}

.box-mail .nav-link:hover {
    color: inherit;
    background-color: rgba(0, 0, 0, 0.02);
}

.box-mail .nav-title {
    margin-left: 15px;
}

.box-mail .mail-attachement{
    display: inline-block;
    margin: 12px;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.box-mail .attachement-content{
    width: 120px;
    height: 80px;
    background: #fefefe center;
    color: #fff;
    text-align: center;
}

.box-mail .attachement-content .sheet-icons{
    margin-top: 24px;
}

.box-mail .attachement-info{
    padding: 8px;
    font-size: 11px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color:#f4f1e7;
    text-align: left;
}

/*------------------------------------------------
- BOX MESSAGE ------------------------------------
------------------------------------------------*/

.box-message .message-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.box-message .message-item {
    position: relative;
    padding: 10px 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.box-message .message-item + .message-item:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.15)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: -o-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: linear-gradient(to right, rgba(0,0,0,0.15), rgba(0,0,0,0));
}

.box-message .message-img {
    width: 56px;
    height: 56px;
    position: relative;
}

.box-message .message-img img {
    border-radius: 100%;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.box-message .message-content {
    padding-left: 10px;
    text-align: left;
    width: calc(100% - 56px);
}

.box-message .message-link{
    font-size: 14px;
    margin-bottom: 8px;

    text-decoration: none;
}

.box-message .message-text {
    font-size: 10px;
    opacity: 0.8;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    margin-bottom: 0;
}

.box-message .message-time {
    font-size: 9px;
    opacity: 0.5;
    text-align: right;
}

/*------------------------------------------------
- BOX NOTES --------------------------------------
------------------------------------------------*/

.box-notes .notes-list{
    padding: 0;
    margin:0;
    list-style: none;
}

.box-notes .notes-item{
    position: relative;
    padding: 12px 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.box-notes .notes-item:after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.15)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: -o-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: linear-gradient(to right, rgba(0,0,0,0.15), rgba(0,0,0,0));
}

.box-notes .notes-content{
    padding-left:16px;
    width: calc(100% - 24px);
}

.box-notes .notes-content .notes-text{
    margin-bottom: 4px !important;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    cursor: pointer;
}

.box-notes .notes-content .notes-time{
    font-size: 8px;
    opacity: 0.75;
}

.box-notes .note-container{
    padding: 16px 16px 16px 32px;
    background-color: #fefaed;
}

.box-notes .note-container:after{
    content: "";
    position: absolute;
    top: 0;
    left: 16px;
    width: 1px;
    height: 100%;
    background-color: rgba(231, 192, 123, 0.6);
}

/*------------------------------------------------
- BOX NOTIFICATION -------------------------------
------------------------------------------------*/

.box-notification .notification-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.box-notification .notification-item {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 6px;
}

.box-notification .notification-item + .notification-item:after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.15)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: -o-linear-gradient(left, rgba(0,0,0,0.15), rgba(0,0,0,0));
    background: linear-gradient(to right, rgba(0,0,0,0.15), rgba(0,0,0,0));
}

.box-notification .notification-icon {
    width: 40px;
    height: 40px;
    text-align: center;
    color: #fff;
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.125);
}

.box-notification .notification-icon i{
    line-height: 40px;
    font-size: 24px
}

.box-notification .notification-content {
    padding-left: 10px;
    width: calc(100% - 30px);
}

.box-notification .notification-link{
    font-size: 14px;
    text-transform: capitalize;
    text-decoration: none;
}

.box-notification .notification-text {
    font-size: 10px;
    opacity: 0.8;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    margin-bottom: 0;
}

.box-notification .notification-time {
    font-size: 9px;
    opacity: 0.5;
    text-align: right;
    width: 50px;
}

.box-notification .notification-item .progress {
    height: 6px;
    margin-top: 2px;
}

/*------------------------------------------------
- BOX PLAN ---------------------------------------
------------------------------------------------*/

.box-plan{
    padding: 20px 0;
    text-align: center;
    width: 100%;
}

.box-plan .plan-cost{
    width: 120px;
    height: 120px;
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 20px auto;
    letter-spacing: 2px;
    font-size: 18px;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1) inset, 0 1px 5px 0 rgba(0, 0, 0, 0.1) inset, 0 3px 1px -2px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1) inset, 0 1px 5px 0 rgba(0, 0, 0, 0.1) inset, 0 3px 1px -2px rgba(0, 0, 0, 0.1) inset;
}

.box-plan .plan-list {
    list-style: none;
    margin-bottom: 35px;
    padding-left: 0;
}

.box-plan .plan-list li{
    position: relative;
}

.box-plan .plan-list li:after{
    content: "";
    position: absolute;
    bottom: -10px;
    left:30%;
    width: 40%;
    height: 1px;
    background: -webkit-gradient(linear, right top, left top, from(rgba(0,0,0,0.0)),  color-stop(rgba(0,0,0,0.2)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(right, rgba(0,0,0,0.0),  rgba(0,0,0,0.2), rgba(0,0,0,0));
    background: -o-linear-gradient(right, rgba(0,0,0,0.0),  rgba(0,0,0,0.2), rgba(0,0,0,0));
    background: linear-gradient(to left, rgba(0,0,0,0.0),  rgba(0,0,0,0.2), rgba(0,0,0,0));
}

.box-plan .plan-list li + li{
    margin-top: 25px;
}

.box-plan h6{
    margin-top: 8px;
    font-weight: bold;
}

/*------------------------------------------------
- BOX PRODUCT ------------------------------------
------------------------------------------------*/

.box-product{
    position: relative;
    overflow: hidden;
    width:100%;
    height: auto;
}

.box-product .product-img{
    position: relative;
    width: 100%;
}

.box-product .product-detail{
    position: absolute;
    z-index: 4;
    bottom: -110px;
    width: 100%;
    height: auto;
    background-color:  #fff;
    -webkit-transition: bottom 0.3s linear;
    -o-transition: bottom 0.3s linear;
    transition: bottom 0.3s linear;
    -webkit-box-shadow: 0 6px 21px rgba(0,0,0,0.5);
    box-shadow: 0 6px 21px rgba(0,0,0,0.5);
}

.box-product:hover .product-detail{
    bottom:0;
}

.box-product .product-title{
    position: relative;
    height: 82px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 16px;
}

.box-product:hover .product-title:after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.125)), color-stop(rgba(0,0,0,0.125)), to(rgba(0,0,0,0.01)));
    background: -webkit-linear-gradient(left, rgba(0,0,0,0.125), rgba(0,0,0,0.125), rgba(0,0,0,0.01));
    background: -o-linear-gradient(left, rgba(0,0,0,0.125), rgba(0,0,0,0.125), rgba(0,0,0,0.01));
    background: linear-gradient(to right, rgba(0,0,0,0.125), rgba(0,0,0,0.125), rgba(0,0,0,0.01));
}

.box-product .product-list{
    list-style: none;
    margin: 0;
    padding: 16px;
}

.box-product .product-list li + li{
    margin-top: 8px;
}

.box-product .badge + .badge{
    margin-left: 6px;
}

.box-product .product-btn{
    position: absolute;
    z-index: 3;
    bottom:212px;
    left: 0;
    right: 0;
    width: 150px;
    margin: auto;
    opacity: 0;
    font-weight: bold;
    -webkit-transition: opacity 0.3s linear;
    -o-transition: opacity 0.3s linear;
    transition: opacity 0.3s linear;
}

.box-product:hover .product-btn{
    opacity: 1;
}

.box-product .product-discount{
    position: absolute;
    z-index: 4;
    top: 0;
    left:16px;
    padding: 10px 12px;
    background-color: #ef2b41;
    color: #fff;
    font-weight: bold;
    text-align: center;
    letter-spacing: 1px;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1) , 0 1px 5px 0 rgba(0, 0, 0, 0.1) , 0 3px 1px -2px rgba(0, 0, 0, 0.1) ;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1) , 0 1px 5px 0 rgba(0, 0, 0, 0.1) , 0 3px 1px -2px rgba(0, 0, 0, 0.1) ;
}

.box-product .product-price{
    border-radius: 100%;
    width: 62px;
    height: 62px;
    line-height: 62px;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    letter-spacing: 1px;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1) inset, 0 1px 5px 0 rgba(0, 0, 0, 0.1) inset, 0 3px 1px -2px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1) inset, 0 1px 5px 0 rgba(0, 0, 0, 0.1) inset, 0 3px 1px -2px rgba(0, 0, 0, 0.1) inset;
}

.box-product .filter-opacity{
    -webkit-transition: opacity 0.3s linear;
    -o-transition: opacity 0.3s linear;
    transition: opacity 0.3s linear;
}

.box-product:hover .filter-opacity{
    opacity: 0.4;
}

/*------------------------------------------------
- BOX PROFILE ------------------------------------
------------------------------------------------*/

.box-profile {
    position: relative;
}

.box-profile .profile-header {
    position: relative;
    overflow: hidden;
    padding: 10px;
    height: 240px;
    color: #fff;
    background-position: top center;
}

.box-profile .profile-header-content {
    position: relative;
    z-index: 4;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.box-profile .profile-social a{
    color: #fff;
    font-size: 16px;
}

.box-profile .profile-social a + a{
    margin-left: 14px;
}

.box-profile .profile-social a:hover,
.box-profile .profile-social a:focus{
    color: rgba(255,255,255,0.8);
}

.box-profile .profile-block {
    margin-top: 30px;
    padding: 20px;
    position: relative;
    text-align: center;
    z-index: 2;
}

.box-profile .profile-img {
    position: absolute;
    z-index: 4;
    width: 80px;
    height: 80px;
    border: 5px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    top: -70px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.box-profile .profile-name {
    position: relative;
    margin-bottom: 0;
}

.box-profile .profile-name:after {
    content: '';
    position: absolute;
    bottom: -24px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 120px;
    height: 1px;
    background: -webkit-gradient(linear, right top, left top, from(rgba(0,0,0,0.0)), color-stop(rgba(0,0,0,0.2)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(right, rgba(0,0,0,0.0), rgba(0,0,0,0.2), rgba(0,0,0,0));
    background: -o-linear-gradient(right, rgba(0,0,0,0.0), rgba(0,0,0,0.2), rgba(0,0,0,0));
    background: linear-gradient(to left, rgba(0,0,0,0.0), rgba(0,0,0,0.2), rgba(0,0,0,0));
}

.box-profile .profile-status {
    margin-top: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.box-profile .status-item {
    padding: 6px 8px;
    width: 25%;
    position: relative;
}

.box-profile .status-item i {
    font-size: 32px;
}

.box-profile .status-item small {
    display: block;
}

/*------------------------------------------------
- BOX TASK ---------------------------------------
------------------------------------------------*/

.box-task .task-list {
    margin: 0;
    padding: 0 12px;
    list-style: none;
}

.box-task .task-item {
    padding: 8px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.box-task .task-item + .task-item {
    border-top: 1px solid rgba(0, 0, 0, 0.125);
}

.box-task .task-icon {
    text-align: center;
    width: 54px;
    height: 54px;
    background-color: #ef2b41;
    color: #fff;
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.125);
}

.box-task .task-icon i{
    line-height: 54px ;
    font-size: 24px;
}

.box-task .task-content {
    padding: 0 10px;
    width: calc(100% - 109px);
}

.box-task .task-time {
    height: 55px;
    width: 55px;
    border-left: 1px solid rgba(0, 0, 0, 0.125);
    padding: 0 5px;
    font-size: 10px;
    opacity: .75;
    text-transform: uppercase;
    text-align: right;
}

.box-task .task-time span + span {
    margin-top: 8px;
    display: block;
}

.box-task .task-content span{
    font-size: 13px;
}
.box-task .task-content p {
    font-size: 11px;
    margin-bottom: 6px;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    opacity: 0.95;
}

.box-task .task-item p {
    opacity:.8;
}

.box-task .task-item .progress {
    height: 0.5rem;
    border-radius: 0;
}

/*------------------------------------------------
- BOX TIMELINE --------------------------------------
------------------------------------------------*/

.list-timeline {
    padding: 12px;
    margin: 0;
    list-style: none;
}

.list-timeline:before {
    content: "";
    position: absolute;
    top: 0;
    height: 100%;
    padding-right: 8px;
    border-right: 2px solid rgba(0,0,0,0.115);
}

.list-timeline-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.list-timeline-item + .list-timeline-item {
    margin-top: 24px;
}

.list-timeline-marker {
    position: relative;
    display: block;
    height: 18px;
    width: 18px;
    min-width: 18px;
    min-height: 18px;
    border-radius: 50%;
}

.list-timeline-marker:after {
    content: "";
    position: absolute;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    height: 45%;
    width: 45%;
    background: #fff;
}

.list-timeline-time {
    font-size: 14px;
    padding: 0 32px;
    font-family: "Julius Sans One", sans-serif;
}

.list-timeline-title {
    display: block;
    font-size: 14px;
    font-weight: bold;
    font-family: "Julius Sans One", sans-serif;
}

.list-timeline-text{
    opacity: 0.6;
}

.box-timeline{
    padding: 20px 70px;
}

.box-timeline .timeline-list {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

.box-timeline .timeline-list:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 4px;
    height: 100%;
    background: rgba(0,0,0,0.115);
}

.box-timeline .timeline-list > li {
    position: relative;
}

.box-timeline .timeline-list > li:not(.timeline-item-divider){
    margin-right: calc(50% + 70px);
}

.box-timeline .timeline-item-right{
    margin-right:0 !important;
    margin-left: calc(50% + 70px);
}

.box-timeline .timeline-content:after {
    content:"";
    z-index: 0;
    position: absolute;
    right: -70px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 4px;
    width: 70px;
    background: rgba(0,0,0,0.115);
}

.box-timeline .timeline-item-right .timeline-content:after{
    right: inherit !important;
    left: -70px;
}

.box-timeline .timeline-info {
    position: absolute;
    top:0;
    bottom: 0;
    left: calc(100% + 70px);
    margin: auto;
    width: calc(100% + 140px);
    height: 148px;
    text-align: center;
}

.box-timeline .timeline-item-right .timeline-info {
    left: inherit !important;
    right: calc(100% + 70px );
}

.box-timeline .timeline-info i {
    font-size: 96px;
    color: #fff;
    text-shadow: 0 2px 5px rgba(0,0,0,0.3);
}

.box-timeline .timeline-marker{
    position: absolute;
    z-index: 1;
    top: 0;
    right:-80px;
    bottom: 0;
    margin: auto;
    width: 20px;
    height: 20px;
    border-radius: 12px;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.box-timeline .timeline-item-right .timeline-marker{
    right: inherit !important;
    left:-80px;
}

.box-timeline .timeline-content .card{
    margin-bottom: 0;
}

.box-timeline .timeline-item-divider{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;

}

.box-timeline .divider-title{
    padding: 10px 12px;
    font-size: 12px;
    color: #fff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

@media screen and (max-width: 576px) {
    .box-timeline {
        padding: 20px 40px;
    }
    .box-timeline .timeline-list:before{
        right: inherit;
    }

    .box-timeline .timeline-list > li:not(.timeline-item-divider){
        margin-right:inherit;
        margin-left: 40px;
        margin-top: 20px;
    }

    .box-timeline .timeline-content:after {
        position: absolute;
        right: inherit !important;
        left: -40px !important;
        width: 40px;
    }

    .box-timeline .timeline-marker{
        right: inherit !important;
        left:-48px !important;
    }

    .box-timeline .timeline-info{
        width: inherit;
        height: inherit;
        margin-bottom: 20px;
        position: static;
    }

    .box-timeline .timeline-item-divider{
        position: relative;
        margin-left: -24px;
        -webkit-box-pack: inherit;
        -ms-flex-pack: inherit;
        justify-content: inherit;
    }

}

/*------------------------------------------------
- BOX WEATHER ------------------------------------
------------------------------------------------*/

.box-weather .weather-info {
    padding: 12px 0;
    margin: 0 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.box-weather .weather-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.box-weather .weather-item {
    padding: 7px 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.box-weather .weather-day {
    width: 64px;
}

.box-weather .weather-value {
    width: calc(100% - 104px);
    text-align: right;
    padding: 0 12px;
    letter-spacing: 1px;
}

.box-weather .weather-icon {
    text-align: center;
    width: 48px;
    font-size: 21px;
    padding-left: 16px;
    border-left: 1px solid rgba(0, 0, 0, 0.125);
}

@media screen and (max-width: 350px) {
    .box-weather .display-icon {
        font-size: 78px;
    }
}

/*===================================================================================================
- PLUGINS -------------------------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- prototipo TIME PICKER -----------------------------
------------------------------------------------*/

.prototipoTimePicker-container .prototipoTimePicker-time{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.prototipoTimePicker-container .prototipoTimePicker-time div{
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
}

.prototipoTimePicker-container .prototipoTimePicker-time .prototipoTimePicker-divider{
    margin-bottom:20px;
    padding:0px 8px;
}

.prototipoTimePicker-container .prototipoTimePicker-time div span{
    font-size: 72px;
}

.prototipoTimePicker-container .prototipoTimePicker-time .up,
.prototipoTimePicker-container .prototipoTimePicker-time .down{
    position: absolute;
    cursor: pointer;
    width: 100%;
    left: 0;
    height: 24px;
    font-size: 18px;
    opacity: 0;
}

.prototipoTimePicker-container .prototipoTimePicker-time .up{
    top:0;
}

.prototipoTimePicker-container .prototipoTimePicker-time .down {
    bottom: 0;
}

.prototipoTimePicker-container .prototipoTimePicker-format{
    position: relative;
    margin: 0 auto;
}

.prototipoTimePicker-container .prototipoTimePicker-format .change{
    font-size: 18px;
    position: absolute;
    cursor: pointer;
    width: 100%;
    bottom:-14px;
    left:0;
    opacity: 0;
}

.prototipoTimePicker-container .prototipoTimePicker-hour:hover span:not(:nth-child(1)) ,
.prototipoTimePicker-container .prototipoTimePicker-minute:hover span:not(:nth-child(1)),
.prototipoTimePicker-container .prototipoTimePicker-format:hover span.change{
    opacity: 1;
}

.prototipoTimePicker-container .prototipoTimePicker-hour:hover span:not(:nth-child(1)):hover ,
.prototipoTimePicker-container .prototipoTimePicker-minute:hover span:not(:nth-child(1)):hover,
.prototipoTimePicker-container .prototipoTimePicker-format:hover span.change:hover{
    opacity: 0.5;
}

/*------------------------------------------------
- prototipo CALENDAR --------------------------------
------------------------------------------------*/

.prototipoCalendar{
    position: relative;
    overflow: hidden;
    height: 448px;
    padding: 12px;
}

.prototipoCalendar-header{
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 20px 8px;
}

.prototipoCalendar-header:after{
    content: "";
    position: absolute;
    width: 28%;
    height: 1px;
    bottom: 0px;
    left: 36%;
    background: -webkit-gradient(linear, right top, left top, from(rgba(0,0,0,0.0)), color-stop(rgba(0,0,0,0.2)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(right, rgba(0,0,0,0.0), rgba(0,0,0,0.2), rgba(0,0,0,0));
    background: -o-linear-gradient(right, rgba(0,0,0,0.0), rgba(0,0,0,0.2), rgba(0,0,0,0));
    background: linear-gradient(to left, rgba(0,0,0,0.0), rgba(0,0,0,0.2), rgba(0,0,0,0));
}

.prototipoCalendar-header h4{
    margin-bottom: 0;
}

.prototipoCalendar-header span{
    font-size: 48px;
    cursor: pointer;
    outline: none !important;
}

.prototipoCalendar-table{
    margin-top: 20px;
    margin-bottom: 0;
    border-collapse: collapse;
    width: 100%;
    text-align: center;
    font-size: 12px;
}

.prototipoCalendar-table th{
    width: calc(100% / 7);
    border-bottom: 0 !important;
    padding: 10px 0;
}

.prototipoCalendar-table td{
    padding: 0;
}

.prototipoCalendar-table .out{
    opacity: 0.5;
}

.prototipoCalendar-table .cell{
    position: relative;
    padding: 10px 0;
    cursor: pointer;
}

.prototipoCalendar-table .note .cell:after {
    position: absolute;
    width: 0;
    height: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 5px;
    content: "";
    border: 3px solid transparent;
    border-radius: 100%;
}

.prototipoCalendar-list {
    list-style: none;
    margin: 0;
    padding: 12px 0 0;
    position: absolute;
    top: 0;
    left:0;
    width: 100%;
    height: 400px;
    display: none;
    overflow: hidden;
}

.prototipoCalendar-list:before {
    content: "";
    display: block;
    width: 0;
    height: 100%;
    position: absolute;
    top: 0;
    left: 20px;
    border: 1px solid transparent;
}

.prototipoCalendar-list li {
    margin: 10px 35px 35px;
    position: relative;
    padding: 5px 8px;
    background-color:#fff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.prototipoCalendar-list li > span:first-child:before {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    position: absolute;
    left: -18px;
    top: 0;
    bottom: 0;
    margin: auto 0;
}

.prototipoCalendar-list li > span{
    display: block;
}

.prototipoCalendar-list .title {
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 5px;
    color: #000 !important;
}

.prototipoCalendar-list .info {
    color: #000 !important;
}

.prototipoCalendar-list .date {
    position: absolute;
    bottom: -22px;
    font-size: 10px;
    opacity: 0.75;
}

.prototipoCalendar-add {
    padding: 12px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    text-align: center;
    font-size: 24px;
}

.prototipoCalendar-add textarea {
    border: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    margin: 32px 0;
    line-height: 1;
    padding: 0;
    text-align: center;
    height: 32px;
    resize: none;
    font-size: 12px;
    width: 100%;
    background: transparent;
}

.prototipoCalendar-add textarea:focus {
    outline:0;
}

.prototipoCalendar-add input {
    border: 0;
    text-align: center;
    width: 100%;
}

.prototipoCalendar-actions{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.prototipoCalendar-actions span{
    cursor: pointer;
}

.prototipoCalendar-actions span + span{
    margin-left: 16px;
}

.prototipoCalendar-footer{
    position: absolute;
    bottom:12px;
    left:12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: calc( 100% - 24px);
}

.prototipoCalendar-footer span{
    cursor: pointer;
}

.prototipoCalendar-footer span + span{
    margin-left: 16px;
}

.prototipoCalendar .action:hover{
    opacity: 0.5;
}

.prototipoCalendar-dark{
    color:#000;

}

.prototipoCalendar-dark .prototipoCalendar-table .today .cell{
    background: #000;
    color: #fff;
}

.prototipoCalendar-dark .prototipoCalendar-table td:not(.today) .cell:hover{
    background: rgba(0,0,0,0.05);
}

.prototipoCalendar-dark .prototipoCalendar-table .note .cell:after {
    border-color: #000;
}

.prototipoCalendar-dark .prototipoCalendar-add textarea {
    color: #000;
}

.prototipoCalendar-dark .prototipoCalendar-add textarea::-webkit-input-placeholder{
    color: #000;
    opacity: 0.8;
}

.prototipoCalendar-dark .prototipoCalendar-add textarea:-ms-input-placeholder{
    color: #000;
    opacity: 0.8;
}

.prototipoCalendar-dark .prototipoCalendar-add textarea:-ms-input-placeholder {
    color: #000;
    opacity: 0.8;
}

.prototipoCalendar-dark .prototipoCalendar-add textarea::-ms-input-placeholder {
    color: #000;
    opacity: 0.8;
}

.prototipoCalendar-dark .prototipoCalendar-add textarea::placeholder {
    color: #000;
    opacity: 0.8;
}

.prototipoCalendar-dark .prototipoCalendar-list li > span:first-child:before {
    background: #000;
}

.prototipoCalendar-dark .prototipoCalendar-list:before {
    border-color:#000;
}

.prototipoCalendar-light{
    color:#fff;
}

.prototipoCalendar-light .prototipoCalendar-table .today .cell{
    background: #fff;
    color: #000;
}

.prototipoCalendar-light .prototipoCalendar-table td:not(.today) .cell:hover{
    background: rgba(255,255,255,0.05);
}

.prototipoCalendar-light .prototipoCalendar-table .note .cell:after {
    border-color: #fff;
}

.prototipoCalendar-light .prototipoCalendar-add textarea {
    color: #fff;
}

.prototipoCalendar-light .prototipoCalendar-add textarea::-webkit-input-placeholder{
    color: #fff;
    opacity: 0.8;
}

.prototipoCalendar-light .prototipoCalendar-add textarea:-ms-input-placeholder{
    color: #fff;
    opacity: 0.8;
}

.prototipoCalendar-light .prototipoCalendar-add textarea:-ms-input-placeholder {
    color: #fff;
    opacity: 0.8;
}

.prototipoCalendar-light .prototipoCalendar-add textarea::-ms-input-placeholder {
    color: #fff;
    opacity: 0.8;
}

.prototipoCalendar-light .prototipoCalendar-add textarea::placeholder {
    color: #fff;
    opacity: 0.8;
}

.prototipoCalendar-light .prototipoCalendar-list li > span:first-child:before {
    background: #fff;
}

.prototipoCalendar-light .prototipoCalendar-list:before {
    border-color:#fff;
}

/*===================================================================================================
- CUSTOM PLUGINS ------------------------------------------------------------------------------------
===================================================================================================*/

/*------------------------------------------------
- OVERLAYSCROLLBARS ------------------------------
------------------------------------------------*/

.os-host > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle,
.os-host > .os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle {
    opacity: 0;
}

.os-host:hover > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle{
    opacity: 0.2 !important;
}

.os-host-scrolling:hover  > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle{
    opacity: 1 !important;
}

.os-theme-dark > .os-scrollbar-vertical,
.os-theme-light > .os-scrollbar-vertical {
    width: 8px;
}

.os-theme-dark > .os-scrollbar-horizontal ,
.os-theme-light > .os-scrollbar-horizontal  {
    height: 8px;
}

/*------------------------------------------------
- JVECTORMAP -------------------------------------
------------------------------------------------*/

.jvectormap-tip{
    border: 4px solid #fff;
    border-radius: 0;
    background: #fff;
    color: #000;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.125), 0 1px 5px 0 rgba(0, 0, 0, 0.125), 0 3px 1px -2px rgba(0, 0, 0, 0.125);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.125), 0 1px 5px 0 rgba(0, 0, 0, 0.125), 0 3px 1px -2px rgba(0, 0, 0, 0.125);
    letter-spacing: 1px;
}

.jvectormap-zoomin,
.jvectormap-zoomout {
    border: 0 !important;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    background: #fff;
    color: #000;
    font-size: 18px;
    font-family: modern, serif;
    line-height: 1.4;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.125), 0 1px 5px 0 rgba(0, 0, 0, 0.125), 0 3px 1px -2px rgba(0, 0, 0, 0.125);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.125), 0 1px 5px 0 rgba(0, 0, 0, 0.125), 0 3px 1px -2px rgba(0, 0, 0, 0.125);
}

.jvectormap-zoomout {
    top:50px;
}

.jvectormap-legend-cnt-v{
    top: auto;
    bottom: 10px;
    left:10px;
    right: auto;
}

.jvectormap-legend{
    border: 0;
    border-radius: 0;
    padding: 10px !important;
    background: #fff;
    color: #000;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.125), 0 1px 5px 0 rgba(0, 0, 0, 0.125), 0 3px 1px -2px rgba(0, 0, 0, 0.125);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.125), 0 1px 5px 0 rgba(0, 0, 0, 0.125), 0 3px 1px -2px rgba(0, 0, 0, 0.125);
}

.jvectormap-legend-tick-sample{
    width: 16px !important;
    height: 16px !important;
    margin-right: 4px;
}

.jvectormap-legend-tick + .jvectormap-legend-tick{
    margin-top: 3px;
}

.chartjs-tooltip{
    position: absolute;
    z-index: 1;
    opacity: 1;
    padding: 10px;
    min-width: 120px !important;
    background: #fff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.125), 0 1px 5px 0 rgba(0, 0, 0, 0.125), 0 3px 1px -2px rgba(0, 0, 0, 0.125);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.125), 0 1px 5px 0 rgba(0, 0, 0, 0.125), 0 3px 1px -2px rgba(0, 0, 0, 0.125);
    border-radius: 0;
    color: #000;
    font-size: 10px;
    font-family: "Montserrat", sans-serif;
    letter-spacing: 1px;
    text-transform: capitalize;
    -webkit-transition: all .1s ease;
    -o-transition: all .1s ease;
    transition: all .1s ease;
    pointer-events: none;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

.chartjs-tooltip-key {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 10px;
}

#map-chart-visits {
    max-height: 160px;
    max-width: 160px;
    margin:-25px auto;
}

@media screen and (max-width: 575px) {
    #map-chart-visits {
        max-width: 110px;
        max-height: 110px;
        margin: 0 auto;
    }
    .jvectormap-legend-cnt-v{
        left: 0;
        right: 0;
        margin: 0 auto;
        text-align: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .jvectormap-legend-inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align:center ;
        -ms-flex-align:center ;
        align-items:center ;
    }

    .jvectormap-legend-tick + .jvectormap-legend-tick{
        margin-top: 0;
        margin-left: 3px;
    }
    .jvectormap-legend{
        margin: 0 !important;
    }
}

/*------------------------------------------------
- SUMMERNOTE -------------------------------------
------------------------------------------------*/

.note-editor.note-frame{
    border:2px solid rgba(0,0,0,0.125);
    -webkit-box-shadow: none;
    box-shadow: none;
    margin-bottom: 0;
}

.note-editor .card-header{
    padding: 0 0 5px 5px;
}

.note-editor .btn.active{
    background-color: #4b5066 !important;
    color: #fff !important;
}

.note-editor .btn i{
    font-size: 14px;
}

.note-editor .note-resizebar{
    display: none;
}

.note-toolbar.card-header{
    display: block !important;
}

/*------------------------------------------------
- NOTIFY -----------------------------------------
------------------------------------------------*/

.notify{
    border-radius: 0;
    box-shadow: 0 3px 10px rgba(0,0,0,.2);
    -webkit-box-shadow: 0 3px 10px rgba(0,0,0,.2);
}

.notify .icon {
    margin-right:15px;
}

.notify-info{
    color: #fff;
    background-color: #888fa9;
}

.notify-danger{
    color: #fff;
    background-color: #ef2b41;
}

.notify-warning{
    color: #fff;
    background-color: #ff7400;
}

.notify-success{
    color: #fff;
    background-color: #319d24;
}

.notify > button.close{
    top:11px;
    font-size: 24px;
}

/*------------------------------------------------
- SUMOSELECT -------------------------------------
------------------------------------------------*/

.SumoSelect{
    position: relative;
    display: inline-block;
    width: 100%;
}

.SumoSelect >.CaptionCont>label > i {
    background: none !important;
}

.SumoSelect >.CaptionCont>label:after {
    content: "\f107";
    font-family: "FontAwesome";
    font-weight: bold;
    margin-left: 8px;
}

.SumoSelect.open >.CaptionCont>label:after {
    content: "\f106";
}

.SumoSelect >.CaptionCont{
    border-radius: 0;
    padding:0 8px;
    border:2px solid rgba(0,0,0,0.125);
    font-size: 12px;
    height: 35px;
    line-height: 35px;
}

.SumoSelect:focus > .CaptionCont,
.SumoSelect:hover > .CaptionCont,
.SumoSelect.open > .CaptionCont {
    -webkit-box-shadow:none;
    box-shadow:none;
    border-color: rgba(0,0,0,0.125);
}

.SumoSelect.open > .CaptionCont{
    border-color: #000;
}

.SumoSelect>.optWrapper{
    border-radius: 0;
    border: 0;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
}

.SumoSelect>.optWrapper>.options li.opt{
    padding: 8px 6px;
}

.SumoSelect>.optWrapper>.options li label{
    margin-bottom: 0;
}

.SumoSelect>.CaptionCont>span{
    height: 31px;
    line-height: 31px;
}
.SumoSelect > .custom-select-sm + .CaptionCont>span{
    height: 24px;
    line-height: 24px;
}
.SumoSelect > .custom-select-lg + .CaptionCont>span{
    height: 38px;
    line-height: 38px;
}
.SumoSelect>.CaptionCont>span.placeholder{
    font-style:normal;
}

.SumoSelect .select-all>span i, .SumoSelect>.optWrapper.multiple>.options li.opt span i{
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    border: 0;
    background-color: black;
}

.SumoSelect .select-all.partial>span i, .SumoSelect .select-all.selected>span i, .SumoSelect>.optWrapper.multiple>.options li.opt.selected span i{
    background-color: #319D24;
}

.input-group>.SumoSelect{
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 1%;
    margin-bottom: 0;
}

/*------------------------------------------------
- BOOTSTRAP SLIDE --------------------------------
------------------------------------------------*/

.slider-disabled .slider-track{
    opacity: 0.65;
}

.slider.slider-horizontal{
    width: 100%;
}

.slider.slider-vertical {
    height: 100%;
}

.slider-track{
    background: rgba(0,0,0,0.125);
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1), 0 3px 1px -2px rgba(0, 0, 0, 0.1);
    border-radius: 0 !important;
}

.slider.slider-horizontal .slider-track{
    height: 8px!important;
}

.slider.slider-vertical .slider-track{
    width: 8px!important;
}

.slider-track-low, .slider-track-high, .slider-selection{
    border-radius: 0 !important;
}

.slider-selection {
    background: rgba(0,0,0,0.125);
}

.slider-handle{
    background: #4b5066 !important;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
}

.slider-disabled .slider-handle{
    background: #7b87aa !important;
}

.slider .tooltip.in{
    opacity: 1 !important;
}


input[type="radio"]
{
	margin: 4px 4px 4px 4px;    
}


input[type="checkbox"]
{
	margin: 4px 4px 4px 4px;    
}

.page-link {
    z-index: 0 !important;
}

.col-flex {
    display: flex;
    flex: auto;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color: #495057;
    background-color: #fff;
    border-color: #dee2e6 #dee2e6 #fff;
    border-top: 3px solid #93bd9e
}

.table td,
.table th {
    padding: .25rem;
}

.dropdown-toggle::after {
    vertical-align: 0;
}

/*===================================================================================================
- ---------------------------------------------------------------------------------------------------
===================================================================================================*/