#lui-fancy-card{
    padding: 20px;
    width: 100%;
    overflow: visible;
    position: relative;
    .lui-fancy-card-tools{
        position: absolute;
        right: 20px;
        top: 20px;
    }
    
    .lui-fancy-card-inner{
        padding: 0px;
        overflow: visible;
         
        .lui-fancy-card-header{
            height: 130px;
            text-align: center;
            padding-top: 20px; 
            transition: all 0.3s ease;
            margin-top: 0px;  
            overflow: hidden;
            position: relative;

            &.default{
                background: $grey-200;
                
                .lui-fancy-card-header-title{
                    color: $grey-800;
                }
                .lui-fancy-card-header-subtitle{
                    color: $grey-600;
                }
                .lui-fancy-card-header-statusbar{
                    background: $grey-300;
                    color: $grey-500;
                    
                    &:hover{
                        background: $grey-500;
                        color: $grey-700;
                    }
                }
            }  

            &.primary{
                background: $light-blue-700;
                
                .lui-fancy-card-header-title{
                    color: $light-blue-50;
                }
                .lui-fancy-card-header-subtitle{
                    color: $light-blue-900;
                }
                .lui-fancy-card-header-statusbar{
                    background: $light-blue-900;
                    color: $light-blue-200;
                    
                    &:hover{
                        background: $light-blue-800;
                        color: $light-blue-100;
                    }
                }
            }                

            &.warning{
                background: $orange-500;

                .lui-fancy-card-header-title{
                    color: $orange-50;
                }
                .lui-fancy-card-header-subtitle{
                    color: $orange-900;
                }
                .lui-fancy-card-header-statusbar{
                    background: $orange-800;
                    color: $orange-200;
                    
                    &:hover{
                        background: $orange-700;
                        color: $orange-100;
                    }
                }
            }
            
            &.success{
                background: $teal-500;

                .lui-fancy-card-header-title{
                    color: $teal-50;
                }
                .lui-fancy-card-header-subtitle{
                    color: $teal-800;
                }
                .lui-fancy-card-header-statusbar{
                    background: $teal-800;
                    color: $teal-200;
                    
                    &:hover{
                        background: $teal-700;
                        color: $teal-100;
                    }
                }
            }
            .lui-fancy-card-header-title-group{
                    height:100%;
                    transition: all 0.15s ease;                     

                .lui-fancy-card-header-container{
                    height: 50%;
                }
            }
        }
        .lui-fancy-card-header-statusbar{
            transition: all 0.3s ease;
            padding: 10px;

            text-align: center;

            &:hover{
                cursor: pointer;
            }
        }
        .lui-fancy-card-body{
            overflow: visible;
            padding: 25px;

        }

    }

}