body {
    .ui-inputfield {
        background: white no-repeat;
        background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, #bdbdbd, #bdbdbd);
        background-size: 0 2px, 100% 1px;
        background-position: 50% 100%, 50% 100%;
        transition: background-size 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);
        border-width: 0;  
        padding: 2px 2px 2px 2px;
        font-size: $fontSize;
        @include border-radius(0px);
        
        &.ui-state-focus {
            border-width: 0;
            background-size: 100% 2px, 100% 1px;
            outline: none;
            padding-bottom: 2px;
        }

        &.ui-state-disabled {
            border-bottom: 1px dotted;
        }
        
        &.ui-widget-content {
            border-width: 1px;
            background: transparent;
            background-image: none;
        }
        
        &.ui-state-error {
            border-color: $inputInvalidBorderColor;
        }
    }
    
    .ui-inputfield:-webkit-autofill {
        border-color: #bdbdbd;
        border-style: solid;
        border-width: 0px 0px 1px 0px;

        &.ui-state-focus {
            padding-bottom: 0px;
        }
    }
    
    .md-inputfield {
        display: block;
        position:relative; 
        
        input:focus ~ label,
        input.ui-state-filled ~ label,
        textarea:focus ~ label,
        textarea.ui-state-filled ~ label,
        .md-inputwrapper-focus ~ label,
        .md-inputwrapper-filled ~ label {
          top:-20px;
          font-size:12px;
          color:$primaryColor;
        }

        input:-webkit-autofill ~ label {
          top:-20px;
          font-size:12px;
          color:$primaryColor;
        }
        
        label {
          color:#999; 
          font-weight:normal;
          position:absolute;
          pointer-events:none;
          left:5px;
          top:1px;
          transition: $transitionDuration ease all; 
          -moz-transition: $transitionDuration ease all; 
          -webkit-transition: $transitionDuration ease all;
        }
        
        input.ui-state-error ~ label {
            color: $inputErrorTextColor;
        }
    }
    
    .ui-selectonelistbox {
        background-color: $inputBgColor;
        border: 0 none;
        @include border-radius($borderRadius);
        
        &.ui-inputfield {
            padding: 0;
        }
        
        .ui-selectlistbox-list {
            padding: 0;
            border: 1px solid $contentBorderColor;
        }
        
        .ui-selectlistbox-item {
            overflow: hidden;
            padding: $listItemPadding;
            margin: 0;
            @include rippleitem();
            @include transition(background-color $transitionDuration);
            @include border-radius(0);

            &.ui-state-hover {
                @include hover-element();
            }
        }
        
        .ui-selectlistbox-filter-container {
            margin: 0;
            padding: $inputHeaderPadding;
            background-color: $primaryColor;
            @include border-radius-top($borderRadius);
                 
            .ui-inputfield {
                border-color: darken($headerTextColor, 15%);
                color: $headerTextColor;
                width: 100%;
                padding-left: 2px;
                padding-right: $iconWidth;                
                @include border-box-sizing();
                
                &.ui-state-focus {
                    border-color: $headerTextColor;
                }
            }         
            
            .ui-icon {
                color: $headerTextColor;
                top: 6px;
                right: 12px;
            }
        }
    }
    
    .ui-multiselectlistbox {   
        .ui-multiselectlistbox-header {
            padding: $inputHeaderPadding;
            position: relative;
            bottom: -1px;
        }
        
        .ui-multiselectlistbox-list {
            padding: 0;
            background-color: $contentBgColor;
        }
        
        li.ui-multiselectlistbox-item {
            padding: $listItemPadding;
            margin: 0;
            @include rippleitem();
            @include transition(background-color $transitionDuration);
            @include border-radius(0px);
            
            &.ui-state-hover {
                @include hover-element();
            }
        }
    }
    
    .ui-button {
        overflow: hidden;
        background-color: $primaryColor;
        color: $buttonTextColor;
        height: 30px;
        padding: 0 14px;
        border: 0 none;
        -moz-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
        -webkit-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
    	box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
        @include transition(background-color $transitionDuration);
        
        &.ui-state-hover {
            background-color: $primaryDarkColor;   
        }
        
        &.ui-state-focus {
            outline: 0 none;
            background-color: lighten($primaryColor,10%);
        }
        
        .ui-button-text {
            padding: 0;
            line-height: 30px;
            font-size: $fontSize;
        }
        
        .ui-icon {
            color: #ffffff;
        }
        
        &.ui-button-icon-only {
            @include border-radius(50%);
            width: 30px;
            height: 30px;
            
            .ui-icon {
                margin-top: -1 * $iconWidth / 2;
                margin-left: -1 * $iconHeight / 2;
            }
        }
        
        &.ui-button-text-icon-left,
        &.ui-button-text-icon-right {
            .ui-icon {
                margin-top: -1 * $iconWidth / 2;
            }
        }
        
        &.ui-button-text-icon-left {
            padding-left: 36px;
        }
        
        &.ui-button-text-icon-right {
            padding-right: 36px;
        }
                
        &.secondary-btn {
            background-color: $accentColor;
            color: $accentTextColor;
            
            &.ui-state-hover {
                background-color: $accentDarkColor;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten($accentColor,10%);
            }
            
            .ui-icon {
                //color: $accentTextColor;// Nicolas
                color: $accentTextColorCarDriver;// Ruben
            }
        }
        
        &.blue-grey-btn {
            background-color: #607D8B;
            
            &.ui-state-hover {
                background-color: #37474F;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#607D8B,10%);
            }
        }
        
        &.cyan-btn {
            background-color: #00BCD4;
            
            &.ui-state-hover {
                background-color: #00838F;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#00BCD4,10%);
            }
        }
        
        &.teal-btn {
            background-color: #009688;
            
            &.ui-state-hover {
                background-color: #00695C;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#009688,10%);
            }
        }
        
        &.red-btn {
            background-color: #F44336;
            
            &.ui-state-hover {
                background-color: #C62828;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#F44336,10%);
            }
        }
        
        &.green-btn {
            background-color: #4CAF50;
            
            &.ui-state-hover {
                background-color: #2E7D32;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#4CAF50,10%);
            }
        }
        
        &.deep-orange-btn {
            background-color: #FF5722;
            
            &.ui-state-hover {
                background-color: #D84315;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#FF5722,10%);
            }
        }
        
        &.purple-btn {
            background-color: #673AB7;
            
            &.ui-state-hover {
                background-color: #4527A0;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#673AB7,10%);
            }
        }
        
        &.pink-btn {
            background-color: #E91E63;
            
            &.ui-state-hover {
                background-color: #AD1457;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#E91E63,10%);
            }
        }
        
        &.amber-btn {
            background-color: #FFC107;
            color: #212121;
            
            &.ui-state-hover {
                background-color: #FF8F00;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#FFC107,10%);
            }
        }
        
        &.orange-btn {
            background-color: #FF9800;
            
            &.ui-state-hover {
                background-color: #EF6C00;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#FF9800,10%);
            }
        }
        
        &.brown-btn {
            background-color: #795548;
            
            &.ui-state-hover {
                background-color: #4E342E;   
            }
            
            &.ui-state-focus {
                outline: 0 none;
                background-color: lighten(#795548,10%);
            }
        }
        
        &.flat {
            @include no-shadow();
        }
    }
    
    .ui-buttonset {
        .ui-state-active {
            background-color: $accentColor;
            color: $accentTextColor;
        }
    }
    
    .ui-splitbutton {
        @include border-radius($borderRadius);
        -moz-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
        -webkit-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
    	box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);

        > .ui-button {
            @include no-shadow();
            
            &.ui-state-active {
                background-color: lighten($primaryColor,10%);
            }
        }
        
        .ui-splitbutton-menubutton {
            height: 30px;
            @include border-radius-left(0);
            @include border-radius-right(3px);
        }
    }
    
    .ui-selectbooleanbutton {
        &.ui-state-active {
            background-color: $accentColor;
            color: $accentTextColor;
            
            .ui-icon {
                color: $accentTextColor;
            }
        }
    }
    
    .ui-chkbox {
        display: inline-block;
        vertical-align: middle;
        width: $iconWidth - 2px;
        height: $iconHeight - 2px;
        cursor: default;
        margin: 0 4px 0 0;
        
        .ui-chkbox-box {
            border: 2px solid $checkboxBorderColor;
            width: $iconWidth - 6px;
            height: $iconHeight - 6px;
            
            @include transition(background-color $transitionDuration);
            
            .ui-chkbox-icon {
                font-size: $fontSize + 4;
                margin-left: -2px;
                margin-top: -2px;
            }
            
            &.ui-state-active {
                border-color: $primaryColor;
                background-color: $primaryColor;
                
                .ui-chkbox-icon {
                    color: $primaryTextColor;
                }
                
                &.ui-state-focus {
                    .ui-chkbox-icon {
                        color: $primaryTextColor;
                    } 
                }
            }
            
            &.ui-state-focus {
                border-color: $primaryColor;
                @include content-shadow();
                @include transition(box-shadow $transitionDuration);
                
                .ui-chkbox-icon {
                   color: $primaryColor; 
                }
            }
        }
    }
    
    .ui-radiobutton {
        position: relative;
        margin: 0 4px 0 0;
        display: inline-block;
        vertical-align: middle;
        
        .ui-radiobutton-box {
            width: $fontSize -1px;
            height: $fontSize -1px;
            border: 2px solid $radioButtonBorderColor;
            @include transition(box-shadow $transitionDuration);
            @include border-radius(50%);
            
            &.ui-state-focus {
                @include content-shadow();
            }
            
            &.ui-state-active {
                border-color: $primaryColor;
                background-color: transparent;
            }
    
            .ui-radiobutton-icon {
                top: 0;
                left: 0;
                width: 20px;
                height: 20px;
                display: block;
                box-sizing: border-box;
                position: absolute;
                @include border-radius(50%);
                transition: -webkit-transform ease .28s;
                transition: transform ease .28s;
                -webkit-transform: scale(0);
                transform: scale(0);
            }
            
            .ui-icon-bullet {
                background-color: $primaryColor;
                -webkit-transform: scale(0.5);
                transform: scale(0.5);
                margin-left: 0;
            }
        }
    }
    
    .ui-selectmanycheckbox, .ui-selectoneradio {
        &.ui-widget {
            label {
                display: inline-block;
                vertical-align: middle;
                margin-top: 0;
            }  
        }
    }
    
    .ui-autocomplete-panel {
        padding: 0;
        border: 0 none;
        @include border-radius(0);
        
        &.ui-shadow {
            @include overlay-input-shadow();
        }
        
        .ui-autocomplete-list {
            padding: 0;
            
            .ui-autocomplete-item {
                padding: $listItemPadding;
                margin: 0;
                @include border-radius(0);
                @include transition(background-color $transitionDuration);
                
                .ui-autocomplete-query {
                    font-weight: 700;
                }
            }
            
            .ui-autocomplete-group {
                padding: $listItemPadding;
            }
        }
    }
    
    .ui-autocomplete {
        .ui-autocomplete-dropdown {
            right: 0;
            margin-right: 0;
            
            &.ui-button.ui-button-icon-only {
                background-color: transparent;
                @include no-shadow();
                height: 20px;
                width: 20px;
                padding: 0;
                
                .ui-button-text {
                    display: none;
                }
                
                .ui-icon {
                    color: $textSecondaryColor;
                }
            }
        }
        
        &.ui-autocomplete-multiple {
            .ui-autocomplete-multiple-container {
                &.ui-inputfield {
                    @include border-box-sizing();
                    padding: 2px 2px 1px 2px;
                }
                
                &.ui-state-focus {
                    padding-bottom: 0;
                }
            }
            
            .ui-autocomplete-input-token {
                float: none;
                display: inline-block;
                margin: 0 1px;
                vertical-align: middle;
                
                > input {
                    padding: 0;
                    font-size: $fontSize;
                    margin: 0;
                }
            }
            
            .ui-autocomplete-token {
                display: inline-block;
                float: none;
                vertical-align: middle;
                
                .ui-autocomplete-token-icon {
                    margin-top: -10px;
                }
            }
        }
    }

    .ui-selectonemenu {
        border-width: 0;
        background: white no-repeat;
        background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, #bdbdbd, #bdbdbd);
        background-size: 0 2px, 100% 1px;
        background-position: 50% 100%, 50% 100%;
        transition: background-size 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);
        padding-bottom: 2px;
        box-sizing: border-box;
        @include border-radius(0);  
        
        &.ui-state-focus {
            border-width: 0;
            background-size: 100% 2px, 100% 1px;
            outline: none;
            padding-bottom: 2px;
        }
        
        .ui-selectonemenu-trigger {
            height: $iconHeight;
            width:  $iconWidth;
            font-size: $iconFontSize;
            margin-top: 0;
            padding: 0;
            top: 0;
            margin-right: 0;
            
            .ui-icon {
                height: $iconHeight;
                width: $iconWidth;
                margin-top: 0;
                color: $textSecondaryColor;
            }
        }
        
        .ui-selectonemenu-label {
            &.ui-inputfield {
                background: none;
                font-family: $fontFamily;
            }
        }
    }
    
    .ui-selectonemenu-panel {
        padding: 0;
        @include border-radius(0);

        .ui-selectonemenu-list {
            padding: 0;
        }
        
        .ui-selectonemenu-item {
            margin: 0;
            padding: $listItemPadding;
            @include transition(background-color $transitionDuration);
            @include border-radius(0);
            
            &.ui-state-hover {
                @include hover-element();
            }
        }
        
        .ui-selectonemenu-item-group {
            padding: 8px;
        }
        
        &.ui-shadow {
            @include overlay-input-shadow();
        }
        
        .ui-selectonemenu-filter-container {
            .ui-icon {
                top: 5px;
                right: 8px;
            }
        }
    }
    
    .ui-selectcheckboxmenu {
        border-bottom: 1px solid $inputBorderColor;
        @include border-box-sizing();
        @include border-radius(0);  
        
        .ui-selectcheckboxmenu-label-container {
            display: block;
            
            .ui-selectcheckboxmenu-label {
                padding-top: 2px;
                padding-bottom: 1px;
                padding-left: 2px;
            }
        }  
        
        .ui-selectcheckboxmenu-trigger {
            height: $iconHeight;
            width:  $iconWidth;
            font-size: $iconFontSize;
            padding: 0;
            
            .ui-icon {
                height: $iconHeight;
                width:  $iconWidth;
                margin-top: 0;
                color: $textSecondaryColor;
            }
        } 
    }
    
    .ui-selectcheckboxmenu-panel {
        padding: 0;
        border: 0 none;
        @include border-radius(0);
        @include overlay-input-shadow();
                
        .ui-selectcheckboxmenu-header {
            padding: $inputHeaderPadding;
            margin: 0;
            @include border-radius(0);
            
            .ui-chkbox {
                float: none;
                margin: 0 8px 0 1px;
                
                .ui-chkbox-box {
                    border-color: $headerTextColor;
                    
                    .ui-chkbox-icon {
                        border-color: $headerTextColor;
                    }
                    
                    &.ui-state-active {
                        .ui-chkbox-icon {
                            border-color: $headerTextColor;
                        }
                    }
                    
                    &.ui-state-focus {
                        background-color: $primaryLightColor;
                        @include transition(background-color $transitionDuration);
                    }
                }
            }

            .ui-selectcheckboxmenu-filter-container {
                width: 70%;
                display: inline-block;
                vertical-align: middle;
                float: none;
                
                .ui-icon {
                    top: -2px;
                    right: 0px;
                    color: $headerTextColor;
                }  
                
                .ui-inputfield {
                    border-color: darken($headerTextColor, 15%);
                    padding-right: 30px;
                    width: 100%;
                    border-color: $headerTextColor;
                    @include border-box-sizing();
                    
                    &:focus {
                        border-color: $headerTextColor;
                    }
                }  
            }
            
            .ui-selectcheckboxmenu-close {
                margin-right: -6px;
                
                span {
                    color: #ffffff;
                    @include transition(color $transitionDuration);
                }
                
                &.ui-state-hover {
                    padding: 1px;
                    
                    span {
                        color: $accentColor;
                    }
                }
            }
        }
        
        .ui-selectcheckboxmenu-items-wrapper {
            padding: 0;
            
            .ui-selectcheckboxmenu-items {
                padding: 0;
            }
        }
        
        .ui-selectcheckboxmenu-item {
            padding: $listItemPadding;
            
            label {
                vertical-align: middle;
                display: inline-block;
            }
            
            .ui-chkbox {
                margin-left: 2px;
            }
        }
    }
    
    .ui-fluid {
        .ui-selectonemenu {            
            .ui-selectonemenu-trigger {
                width: $iconWidth;
                padding: 0;
            }
        }
    }
    
    #keypad-div {
        @include border-radius(0);
        
        .keypad-key {
            border: 0 none;
            background-color: #ffffff;
            font-size: $fontSize;
            padding: 4px;
            @include border-radius(50%);
            @include transition(background-color $transitionDuration);
            
            &.ui-state-hover {
                @include hover-element();
            }
        }
        
        .keypad-shift, .keypad-enter, .keypad-spacebar, .keypad-back, .keypad-close, .keypad-clear {
            @include border-radius(0);
            background-color: $primaryColor;
            color: #ffffff;
            
            &.ui-state-hover {
                background-color: $primaryDarkColor;
                color: #ffffff;
            }
        }
        
        &.ui-shadow {
            @include overlay-input-shadow();
        }
    }
    
    .ui-selectmanymenu {
        padding: 0;
        background-color: $inputBgColor;
        @include border-radius($borderRadius);
        
        .ui-selectlistbox-item {
            padding: $listItemPadding;
            margin: 0;
            position: relative;
            overflow: hidden;
            @include border-radius(0);
            
            &.ui-state-hover {
                @include hover-element();
            }
            
            .ui-chkbox {
                background-color: transparent;
                margin: -2px 8px 0 0;
                
                .ui-chkbox-box {
                    &.ui-state-active {
                        border-color: #ffffff;
                        background-color: $accentColor;
                    }
                }
            }
        }
        
        .ui-selectlistbox-filter-container {
            margin: 0;
            padding: $inputHeaderPadding;
            background-color: $primaryColor;
            @include border-radius-top($borderRadius);

            .ui-inputfield {
                border-color: darken($headerTextColor, 15%);
                color: $headerTextColor;
                width: 100%;
                padding-left: 2px;
                padding-right: $iconWidth;                
                @include border-box-sizing();

                &.ui-state-focus {
                    border-color: $headerTextColor;
                }
            }         

            .ui-icon {
                color: $headerTextColor;
                top: 6px;
                right: 12px;
            }
        }
        
        tr {
            &.ui-selectlistbox-item {
                td {
                    padding: 6px;
                }
            }
        }
    }
    
    .ui-spinner {
        .ui-spinner-button {
            width: 18px;
            height: 10px;
            padding: 0;
            margin-right: 0;
            background-color: transparent;
            color: $textColor;
            z-index: auto;
            @include no-shadow();
            
            .ui-icon-triangle-1-n {
                color: $textColor;
            }
            
            .ui-icon-triangle-1-s {
                color: $textColor;
            }    
            
            .ui-icon {
                top: 0px;
                height: 12px;
                color: $textSecondaryColor;
            }
        }
        
        .ui-spinner-up {
            .ui-icon {
                top: 4px;
            }
        }
        
        .ui-spinner-down {
            .ui-icon {
                top: 2px;
            }
        }
        
        .ui-spinner-input {
            padding-right: 30px;
        }
    }
    
    .ui-fluid {
        .ui-spinner {
            .ui-spinner-button {
                width: 25px;
                height: 10px;
            }
            
            .ui-spinner-input {
                padding-right: 30px;
            }
        }
    }
    
    .ui-inputswitch {
        height: 14px;
        width: 34px !important;
        overflow: visible;
        background-color: rgb(158,158,158);
        border-color: rgb(158,158,158);
        padding: 0;
        @include border-radius(8px);
    
        .ui-inputswitch-handle {
            top: -3px;
            background-color: #ffffff;
            @include border-radius(50%);
            @include transition(background-color $transitionDuration);
            width: 20px !important;
            height: 20px !important;
            -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 3px 0px, rgba(0, 0, 0, 0.137255) 0px 1px 1px 0px, rgba(0, 0, 0, 0.117647) 0px 2px 1px -1px;
            -moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 3px 0px, rgba(0, 0, 0, 0.137255) 0px 1px 1px 0px, rgba(0, 0, 0, 0.117647) 0px 2px 1px -1px;
            box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 3px 0px, rgba(0, 0, 0, 0.137255) 0px 1px 1px 0px, rgba(0, 0, 0, 0.117647) 0px 2px 1px -1px;
        }
        
        .ui-inputswitch-on {
            visibility: hidden;
        }
        
        .ui-inputswitch-off, .ui-inputswitch-on {
            span {
                visibility: hidden;
            }
        }
        
        &.ui-inputswitch-checked {
            background-color: $accentLightColor;
            border-color: $accentLightColor;
            
            .ui-inputswitch-handle {
                background-color: $accentColor;
                color: $accentTextColor;
            }
        }
    }
    
    .ui-slider { 
        padding: 0;
               
        .ui-slider-handle {
            background-color: $accentColor;
            color: $accentTextColor;
            @include border-radius(50%);
            width: 20px;
            height: 20px; 
            transform: scale(.7);
            @include transition(all .4s cubic-bezier(.25,.8,.25,1));
            
            &.ui-state-hover,
            &.ui-state-focus {
                transform: scale(1);
            } 
            
            &:focus {
                outline: 0 none;
            }
        }
        
        &.ui-slider-horizontal {
            height: 2px;
            border: 0 none;
            background-color: #bdbdbd;
            
            .ui-slider-handle {
                top: -.65em;
            }
        }
        
        &.ui-slider-vertical {
            width: 2px;
            border: 0 none;
            background-color: #bdbdbd;
            
            .ui-slider-handle {
                left: -9px;
            }
        }
        
        .ui-slider-range {
            padding: 0;
            background-color: $accentColor;
            color: $accentTextColor;
        }
    }
    
    .ui-calendar {
        .ui-datepicker-trigger {
            top: 7px;
            right: 28px;
            background-color: transparent;
            color: $textColor;
            height: $iconHeight;
            width: $iconWidth;
            @include no-shadow();
            @include border-radius(0);
            
            .ui-icon {
                color: $textSecondaryColor;
            }
        }
    }
    
    .ui-datepicker {
        padding: 0;
        width: 275px;
        
        &.ui-shadow {
            @include overlay-input-shadow();
        }
        
        .ui-datepicker-header {
            padding: $headerPadding;
            background: $primaryDarkColor;
            border-color: $primaryDarkColor;
            @include border-radius-top(2px);
            @include border-radius-bottom(0);
                        
            .ui-datepicker-next {
                cursor: pointer;
                top: 8px;
                font-size: $iconFontSize;
                right: 8px;
                color: #ffffff;
                @include material-icon("\e039");
                
                .ui-icon {
                    display: none;
                }
                
                &.ui-datepicker-next-hover {
                    right: 8px;    
                }
            }
            
            .ui-datepicker-prev {
                cursor: pointer;
                top: 8px;
                font-size: $iconFontSize;
                @include material-icon("\e039");
                @include rotate(180deg);
                left: 8px;
                color: #ffffff;
                
                .ui-icon {
                    display: none;
                }
                
                &.ui-datepicker-prev-hover {
                    left: 8px;    
                }
            }
        }
        
        table {
            table-layout: fixed;
            border-spacing: 0;
            border-collapse: collapse;
        }
        
        thead {
            tr {
                color: #ffffff;
                background: $primaryColor;
            }
        }
        
        tbody {
            td {
                padding: 2px;
                box-sizing: border-box;
                
                a,span {
                    padding: .2em;
                    margin: 0;
                    text-align: center;
                    color: $textColor;
                    display: inline-block;
                    height: 28px;
                    width: 28px;
                    line-height: 28px;
                    @include border-radius(50%);
                    
                    &.ui-state-hover {
                        @include hover-element();
                    }
                    
                    &.ui-state-active {
                        color: #ffffff;
                        background-color: $accentColor;
                        color: $accentTextColor;
                    }
                }
                
                &.ui-datepicker-today {
                    a,span {
                        color: $textColor;
                        background-color: #ffffff;
                        border: 1px solid $accentColor;
                        
                        &.ui-state-active {
                            color: #ffffff;
                            background-color: $accentColor;
                            color: $accentTextColor;
                        }
                    }
                }
            }
        }
        
        &.ui-datepicker-multi {
            .ui-datepicker-header {
                @include border-radius(0);
            }
            
            .ui-datepicker-group {
                table {
                    width: 100%;
                    @include border-box-sizing();
                }
            }
        }
        
        .ui-timepicker-div {                      
            .ui_tpicker_time {
                input {
                    border-color: #bdbdbd;
                    @include transition(border-color $transitionDuration);
                    width: 100%;
                    position: relative;
                    top: 5px;
                    left: -5px;
                    
                    &.ui-state-focus {
                        border-width: 0 0 2px 0;
                        border-color: $primaryColor;  
                        padding-bottom: 0px;
                    }
                }
            }
            
            dl {
                margin: -16px 0 40px 0;
                
                dt {
                    padding: $listItemPadding;
                }
                
                dd {
                    margin-top: 42px;
                }
            }
        }
        
    }
    
    .ui-fluid {
        .ui-calendar {
            .ui-datepicker-trigger.ui-button {
                top: -4px;
                width: 24px;
            }
        }
    }
    
    .ui-rating {
        .ui-rating-cancel {
            text-indent: 0;
            
            a {
                color: $textSecondaryColor;
                background: none;
                @include material-icon("\e5c9");
                font-size: $iconFontSize;
            }
        }
        
        .ui-rating-star {
            text-indent: 0;
            
            a {
                font-size: $iconFontSize;
                color: $textSecondaryColor;
                background: none;
                @include material-icon("\e83a");
                font-size: $iconFontSize;
            }
            
            &.ui-rating-star-on {
                a {
                    color: $accentColor;
                    @include material-icon("\e838");
                    font-size: $iconFontSize;
                }
            }
        }
    }
    
    .ui-password-panel {
        &.ui-shadow {
            @include overlay-input-shadow();
        }
    }
    
    .ui-fileupload {
        .ui-fileupload-buttonbar {
            padding: $headerPadding;
            
            .ui-icon-arrowreturnthick-1-n {
                @include icon_override('file_upload');
            }
            
            .ui-button {
                background-color: $accentColor;
                color: $accentTextColor;
                margin-right: 6px;
                
                .ui-icon {
                    color: $accentTextColor;
                }
                
                &.ui-state-hover {
                    background-color: $accentDarkColor;
                }
            }
        }
        
        .ui-fileupload-content {
            .ui-messages-error {
                .ui-icon {
                    color: #ffffff;
                }
            }
        }
    }
    
    .ui-editor { 
        &.ui-widget-content {
            padding: 0px;
        }
    }

    .ui-inputgroup {
        height: 100%;

        .ui-inputgroup-addon,
        .ui-inputgroup-addon-checkbox {
            padding: $inputGroupPadding;
            border-color: $inputGroupBorderColor;
            background-color: $inputGroupBgColor;
            color: $inputGroupTextColor;
            min-width: $inputGroupAddonMinWidth;
            border-left: 0;
            border-right: 0;
            border-top: 0;

            &:first-child {
                @include border-radius-left(0);
            }

            &:last-child {
                @include border-radius-right($borderRadius);
            }
        }
        
        .ui-inputgroup-addon {
            align-self: flex-end;
            
            > i {
                @include flex();
                align-self: flex-end;
                font-size: $inputGroupIconFontSize;
            }
        }
        
        .ui-inputtext {
            align-self: flex-end;
        }

        .md-inputfield {
            -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            width: 1%;
            display: inherit;

            label {
                top: 5px;
            }
        }

        .ui-button {
            .ui-button-text {
                padding: 0;
            }
        }

        .ui-inputgroup-addon-checkbox {
            padding: 0;
            position: relative;
            
            .ui-chkbox {
                vertical-align: baseline;
                position: absolute;
                top: 50%;
                left: 50%;
                margin-top: -1 * $checkboxHeight / 2;
                margin-left: -1 * $checkboxWidth / 2;
            }
        }
    }
    
    .ui-fluid {
        .ui-inputgroup {
            .ui-button {
                &.ui-button-icon-only {
                    width: 1.643em;
                    height: 1.643em;
                    min-width: 0;
                    padding: 0;

                    .ui-button-icon-left {
                        margin-left: -.45em;
                    }
                }
            }
        }
    }
}