@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,500,700);

@import url(https://fonts.googleapis.com/css?family=Karla:400,700);

@import url(https://fonts.googleapis.com/css?family=Rancho);

@import url('https://fonts.googleapis.com/css?family=Montserrat');

@import url('https://fonts.googleapis.com/css2?family=Jost&display=swap');



/* =============



  == Core List==







   - Common



   - Helper classes



   - Extra



   - Bootstrap Custom



   - Animation (Some loader)



   - Waves effect



   - Print (Invoice css)







============= */





/* =============



   Common



============= */



body {

    /* background-color: rgb(243 243 243); */

   font-family: 'Jost', sans-serif;

    margin: 0;

    padding-bottom: 60px;

    overflow-x: hidden;

    /* background-color: #f5f7ff;; */

    background-color: #f3f4f7;

    color: #797979;

    min-height: 750px !important;

}



html {

    position: relative;

    min-height: 100%;

    background: #ebeff2;

}



h1,

h2,

h3,

h4,

h5,

h6 {

    color: #2c2e31;

    font-family: 'Jost', sans-serif;

    margin: 10px 0;

}



h1 {

    line-height: 43px;

}



h2 {

    line-height: 35px;

}



h3 {

    line-height: 30px;

}



h3 small {

    color: #444444;

}



h4 {

    line-height: 22px;

}



h4 small {

    color: #444444;

}



h5 {

    font-size: 15px;

}



h5 small {

    color: #444444;

}



p {

    line-height: 1.6;

}



* {

    outline: none !important;

}



b {

    font-weight: 600;

}



a:hover {

    outline: 0;

    text-decoration: none;

}



a:active {

    outline: 0;

    text-decoration: none;

}



a:focus {

    outline: 0;

    text-decoration: none;

}



.container {

    width: auto;

}



.container-alt {

    margin-left: auto;

    margin-right: auto;

    padding-left: 15px;

    padding-right: 15px;

}





/* Footer */



.footer {

    border-top: 1px solid rgba(152, 166, 173, 0.2);

    bottom: 0px;

    color: #98a6ad;

    text-align: left !important;

    padding: 19px 30px 20px;

    position: absolute;

    right: 0px;

    left: 250px;

}



#wrapper {

    height: 100%;

    overflow: hidden;

    width: 100%;

}



.page {

    bottom: 0;

    left: 0;

    right: 0;

    top: 0;

}





/* Page titles */



.page-title {

    font-size: 20px;

    font-weight: 600;

    margin-bottom: 0px;

    margin-top: 0px;

    line-height: 70px;

}



.page-header {

    border-bottom: 1px solid #DBDDDE;

}



.header-title {

    font-size: 16px;

    font-weight: 600;

    line-height: 16px;

    margin-bottom: 8px;

}



.wrapper {

    padding-top: 0px;

    /* margin-top: 30px; */

}


/* @media (max-width:576px){
    .wrapper{
        padding-top: 0px;
    }
} */


.container {

    width: 90%;

}





/* =============



   Helper clasess



============= */



.p-0 {

    padding: 0px !important;

}



.p-20 {

    padding: 20px !important;

}



.p-30 {

    padding: 30px !important;

}



.p-l-0 {

    padding-left: 0px !important;

}



.p-r-0 {

    padding-right: 0px !important;

}



.p-t-0 {

    padding-top: 0px !important;

}



.p-b-0 {

    padding-bottom: 0px !important;

}



.p-t-10 {

    padding-top: 10px !important;

}



.p-b-10 {

    padding-bottom: 10px !important;

}



.p-l-r-10 {

    padding-left: 10px;

    padding-right: 10px;

}



.m-0 {

    margin: 0px !important;

}



.m-r-5 {

    margin-right: 5px !important;

}



.m-r-10 {

    margin-right: 10px !important;

}



.m-r-15 {

    margin-right: 15px !important;

}



.m-l-5 {

    margin-left: 5px !important;

}



.m-l-10 {

    margin-left: 10px !important;

}



.m-l-15 {

    margin-left: 15px !important;

}



.m-t-5 {

    margin-top: 5px !important;

}



.m-t-0 {

    margin-top: 0px !important;

}



.m-t-10 {

    margin-top: 10px !important;

}



.m-t-15 {

    margin-top: 15px !important;

}



.m-t-20 {

    margin-top: 20px !important;

}



.m-t-30 {

    margin-top: 30px !important;

}



.m-t-40 {

    margin-top: 40px !important;

}



.m-b-0 {

    margin-bottom: 0px !important;

}



.m-b-5 {

    margin-bottom: 5px !important;

}



.m-b-10 {

    margin-bottom: 10px !important;

}



.m-b-15 {

    margin-bottom: 15px !important;

}



.m-b-20 {

    margin-bottom: 20px !important;

}



.m-b-25 {

    margin-bottom: 25px !important;

}



.m-b-30 {

    margin-bottom: 30px !important;

}



.w-xs {

    min-width: 80px;

}



.w-sm {

    min-width: 95px;

}



.w-md {

    min-width: 110px;

}



.w-lg {

    min-width: 140px;

}



.m-h-40 {

    min-height: 40px;

}



.m-h-50 {

    min-height: 50px;

}



.l-h-34 {

    line-height: 34px;

}



.font-600 {

    font-weight: 600;

}



.font-bold {

    font-weight: 700;

}



.font-normal {

    font-weight: normal;

}



.font-light {

    font-weight: 300;

}



.font-13 {

    font-size: 13px !important;

}



.wrapper-md {

    padding: 20px;

}



.pull-in {

    margin-left: -20px;

    margin-right: -20px;

}



.b-0 {

    border: none !important;

}



.vertical-middle {

    vertical-align: middle;

}



.bx-shadow {

    -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);

    -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);

    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);

}



.bx-shadow-none {

    box-shadow: none !important;

}



.mx-box {

    max-height: 380px;

    min-height: 380px;

}



.thumb-sm {

    height: 32px;

    width: 32px;

}



.thumb-md {

    height: 48px;

    width: 48px;

}



.thumb-lg {

    height: 88px;

    width: 88px;

}



.thumb-xl {

    height: 120px;

    width: 120px;

}



.add-new-plus {

    height: 32px;

    text-align: center;

    width: 32px;

    display: block;

    line-height: 32px;

    color: #98a6ad;

    font-weight: 700;

    background-color: #ebeff2;

    border-radius: 50%;

}





/* =============



   Extras



============= */





/* Table type box */



.table-box {

    display: table;

    height: 100%;

    width: 100%;

}



.table-box .table-detail {

    display: table-cell;

    vertical-align: middle;

}





/* Card Box */



.card-box {

    padding: 20px;

    box-shadow: none !important;

    -webkit-border-radius: 5px !important;

    border-radius: 5px !important;

    -moz-border-radius: 5px !important;

    background-clip: padding-box;

    border: 1px solid lightgrey;

    margin-bottom: 20px;

    background-color: #ffffff;

}



.card-box .card-drop {

    color: #98a6ad;

    font-size: 20px;

    line-height: 1px;

    padding: 0px 5px;

    display: inline-block;

}





/* Grid page */



.grid-structure .grid-container {

    background-color: #f4f8fb;

    margin-bottom: 10px;

    padding: 10px 20px;

}





/* Demo only */



.icon-list-demo div {

    cursor: pointer;

    line-height: 45px;

    white-space: nowrap;

    color: #75798B;

}



.icon-list-demo div p {

    margin-bottom: 0px;

    line-height: inherit;

}



.icon-list-demo i {

    display: inline-block;

    font-size: 18px;

    margin: 0;

    vertical-align: middle;

    width: 40px;

}



.icon-list-demo .col-md-4 {

    -webkit-border-radius: 3px;

    border-radius: 3px;

    -moz-border-radius: 3px;

    background-clip: padding-box;

}



.icon-list-demo .col-md-4:hover {

    background-color: rgba(113, 182, 249, 0.07);

}



.button-list {

    margin-left: -8px;

    margin-bottom: -12px;

}



.button-list .btn {

    margin-bottom: 12px;

    margin-left: 8px;

}



.demo-dropdown {

    position: static;

    display: block;

    margin-bottom: 5px;

    clear: left;

}



#static-modal {

    position: relative;

    top: auto;

    right: auto;

    bottom: auto;

    left: auto;

    z-index: 1;

    display: block;

}





/* Switchery demo */



.switchery-demo .switchery {

    margin-bottom: 10px;

}





/* =============



   Bootstrap-custom



============= */



.row {

    margin-right: -10px;

    margin-left: -10px;

}



.col-lg-1,

.col-lg-10,

.col-lg-11,

.col-lg-12,

.col-lg-2,

.col-lg-3,

.col-lg-4,

.col-lg-5,

.col-lg-6,

.col-lg-7,

.col-lg-8,

.col-lg-9,

.col-md-1,

.col-md-10,

.col-md-11,

.col-md-12,

.col-md-2,

.col-md-3,

.col-md-4,

.col-md-5,

.col-md-6,

.col-md-7,

.col-md-8,

.col-md-9,

.col-sm-1,

.col-sm-10,

.col-sm-11,

.col-sm-12,

.col-sm-2,

.col-sm-3,

.col-sm-4,

.col-sm-5,

.col-sm-6,

.col-sm-7,

.col-sm-8,

.col-sm-9,

.col-xs-1,

.col-xs-10,

.col-xs-11,

.col-xs-12,

.col-xs-2,

.col-xs-3,

.col-xs-4,

.col-xs-5,

.col-xs-6,

.col-xs-7,

.col-xs-8,

.col-xs-9 {

    padding-left: 10px;

    padding-right: 10px;

}



.breadcrumb {

    background-color: transparent;

    margin-bottom: 15px;

    padding-top: 10px;

    padding-left: 0px;

}





/* Image Thumbnail */



.img-thumbnail {

    border: 1px solid #EBEFF2;

}





/* Dropdown */



.dropdown-menu {

    padding: 4px 0;

    transition: all 300ms ease;

    -moz-transition: all 300ms ease;

    -webkit-transition: all 300ms ease;

    -o-transition: all 300ms ease;

    -ms-transition: all 300ms ease;

    box-shadow: 0 0px 8px 0 rgba(0, 0, 0, 0.06), 0 1px 0px 0 rgba(0, 0, 0, 0.02);

    border: 1px solid rgba(152, 166, 173, 0.15);

}



.dropdown-menu>li>a {

    padding: 6px 20px;

}



.dropdown-menu>li>a:focus,

.dropdown-menu>li>a:hover {

    /* background-color: rgba(218, 230, 236, 0.3) !important; */

    background-color: rgb(37 39 46) !important;

    color: white;

}



.dropdown-menu>.active>a,

.dropdown-menu>.active>a:hover,

.dropdown-menu>.active>a:focus {

    background-color: rgba(152, 166, 173, 0.1);

    color: #435966;

}





/*Well */



.well {

    background-color: rgba(152, 166, 173, 0.15);

    border: rgba(152, 166, 173, 0.5);

    -webkit-box-shadow: inset 0 1px 1px rgba(152, 166, 173, 0.25);

    box-shadow: inset 0 1px 1px rgba(152, 166, 173, 0.25);

}





/* Background colors */



.bg-custom {

    background-color: #71b6f9 !important;

}



.bg-primary {

    background-color: #188ae2 !important;

}



.bg-success {

    background-color: #10c469 !important;

}



.bg-info {

    background-color: #35b8e0 !important;

}



.bg-warning {

    background-color: #f9c851 !important;

}



.bg-danger {

    background-color: #ff5b5b !important;

}



.bg-muted {

    background-color: #f4f8fb !important;

}



.bg-inverse {

    background-color: #3b3e47 !important;

}



.bg-purple {

    background-color: #5b69bc !important;

}



.bg-pink {

    background-color: #ff8acc !important;

}



.bg-white {

    background-color: #ffffff !important;

}



.bg-lightdark {

    background-color: #f4f8fb !important;

}





/* Text colors */



.text-custom {

    color: #71b6f9 !important;

}



.text-white {

    color: #ffffff !important;

}



.text-danger {

    color: #ff5b5b !important;

}



.text-muted {

    color: #98a6ad !important;

}



.text-primary {

    color: #1077da !important;

}



.text-warning {

    color: #f9c851 !important;

}



.text-success {

    color: #10c469 !important;

}



.text-info {

    color: #35b8e0 !important;

}



.text-inverse {

    color: #3b3e47 !important;

}



.text-pink {

    color: #ff8acc !important;

}



.text-purple {

    color: #5b69bc !important;

}



.text-dark {

    color: #797979 !important;

}





/* Form components */



textarea.form-control {

    min-height: 90px;

}



.form-control {

    background-color: #FFFFFF;

    border: 1px solid #E3E3E3;

    border-radius: 0px;

    color: #565656;

    padding: 7px 12px;

    height: 38px;

    max-width: 100%;

    -webkit-box-shadow: none;

    box-shadow: none;

    -webkit-transition: all 300ms linear;

    -moz-transition: all 300ms linear;

    -o-transition: all 300ms linear;

    -ms-transition: all 300ms linear;

    transition: all 300ms linear;

}



.form-control:focus {

    background-color: #FFFFFF;

    border: 1px solid #AAAAAA;

    -webkit-box-shadow: none;

    box-shadow: none;

    outline: 0 !important;

    color: #333333;

}



.input-lg {

    height: 46px;

    padding: 10px 16px;

    font-size: 18px;

    line-height: 1.3333333;

    border-radius: 6px;

}



.input-sm {

    height: 30px;

    padding: 5px 10px;

    font-size: 12px;

    line-height: 1.5;

    border-radius: 3px;

}



.form-horizontal .form-group {

    margin-left: -10px;

    margin-right: -10px;

}



.form-control-feedback {

    line-height: 38px !important;

}



.input-group-btn .btn {

    padding: 8px 12px;

}



.input-group-btn .btn-sm {

    padding: 5px 10px;

}



.input-group-btn .btn-lg {

    padding: 10px 17px;

}





/* Labels */



.label {

    font-weight: 500;

    letter-spacing: 0.05em;

    padding: .3em .6em .3em;

}



.label-default {

    background-color: #71b6f9;

}



.label-primary {

    background-color: #188ae2;

}



.label-success {

    background-color: #10c469;

}



.label-info {

    background-color: #35b8e0;

}



.label-warning {

    background-color: #f9c851;

}



.label-danger {

    background-color: #ff5b5b;

}



.label-purple {

    background-color: #5b69bc;

}



.label-pink {

    background-color: #ff8acc;

}



.label-inverse {

    background-color: #3b3e47;

}





/* Badge */



.badge {

    text-transform: uppercase;

    font-weight: 500;

    padding: 3px 5px;

    font-size: 12px;

    margin-top: 1px;

    background-color: #71b6f9;

}



.badge-xs {

    font-size: 9px;

}



.badge-xs,

.badge-sm {

    -webkit-transform: translate(0, -2px);

    -ms-transform: translate(0, -2px);

    -o-transform: translate(0, -2px);

    transform: translate(0, -2px);

}



.badge-primary {

    background-color: #188ae2;

}



.badge-success {

    background-color: #10c469;

}



.badge-info {

    background-color: #35b8e0;

}



.badge-warning {

    background-color: #f9c851;

}



.badge-danger {

    background-color: #ff5b5b;

}



.badge-purple {

    background-color: #5b69bc;

}



.badge-pink {

    background-color: #ff8acc;

}



.badge-inverse {

    background-color: #3b3e47;

}





/* Pagination/ Pager */



.pagination>li:first-child>a,

.pagination>li:first-child>span {

    border-bottom-left-radius: 3px;

    border-top-left-radius: 3px;

}



.pagination>li:last-child>a,

.pagination>li:last-child>span {

    border-bottom-right-radius: 3px;

    border-top-right-radius: 3px;

}



.pagination>li>a,

.pagination>li>span {

    color: #636e7b;

}



.pagination>li>a:hover,

.pagination>li>span:hover,

.pagination>li>a:focus,

.pagination>li>span:focus {

    background-color: #e4e7ea;

}



.pagination-split li {

    margin-left: 5px;

    display: inline-block;

    float: left;

}



.pagination-split li:first-child {

    margin-left: 0;

}



.pagination-split li a {

    -moz-border-radius: 3px;

    -webkit-border-radius: 3px;

    border-radius: 3px;

}



.pagination>.active>a,

.pagination>.active>span,

.pagination>.active>a:hover,

.pagination>.active>span:hover,

.pagination>.active>a:focus,

.pagination>.active>span:focus {

    background-color: #71b6f9;

    border-color: #71b6f9;

}



.pager li>a,

.pager li>span {

    -moz-border-radius: 3px;

    -webkit-border-radius: 3px;

    border-radius: 3px;

    color: #636e7b;

}





/* Tabs */



.tab-content {

    padding: 20px;

    border: 2px solid #eeeeee;

    border-top: none;

}



.nav-tabs>.active>a,

.nav-tabs>.active>a:focus,

.nav-tabs>.active>a:hover {

    border: 2px solid #eeeeee !important;

    border-bottom-color: #ffffff !important;

}



.nav-tabs {

    border-bottom: 2px solid #eeeeee;

}



.nav-tabs>li {

    margin-bottom: -2px;

}



.nav-tabs a {

    color: #435966;

    font-size: 15px;

    font-weight: 600;

    font-family: 'Montserrat', sans-serif;

}



.nav>li>a:focus,

.nav>li>a:hover {

    text-decoration: none;

    background-color: #f4f8fb;

}



.nav .open>a,

.nav .open>a:focus,

.nav .open>a:hover {

    border-color: #eeeeee;

}





/* List group */



.list-group-item {

    border: 1px solid #ebeff2;

    border-left: none;

    border-right: none;

}



.list-group-item:hover {

    background-color: rgba(152, 166, 173, 0.1);

}



.list-group-item:first-child {

    border-top: none;

}



.list-group-item:last-child {

    border-bottom: none;

}



.list-no-border .list-group-item {

    border: none;

}





/* Dropcap */



.dropcap {

    font-size: 3.1em;

}



.dropcap,

.dropcap-circle,

.dropcap-square {

    display: block;

    float: left;

    font-weight: 400;

    line-height: 36px;

    margin-right: 6px;

    text-shadow: none;

}





/* Alert */



.alert .btn {

    margin-top: 10px;

}



.alert-success {

    background-color: rgba(95, 190, 170, 0.3);

    border-color: rgba(95, 190, 170, 0.4);

    color: #5fbeaa;

}



.alert-info {

    background-color: rgba(52, 211, 235, 0.2);

    border-color: rgba(52, 211, 235, 0.3);

    color: #35b8e0;

}



.alert-warning {

    background-color: rgba(255, 189, 74, 0.2);

    border-color: rgba(255, 189, 74, 0.3);

    color: #f9c851;

}



.alert-danger {

    background-color: rgba(240, 80, 80, 0.2);

    border-color: rgba(240, 80, 80, 0.3);

    color: #ff5b5b;

}





/* Modals */



.modal .modal-dialog .modal-content {

    -moz-box-shadow: none;

    -webkit-box-shadow: none;

    border-color: #DDDDDD;

    border-radius: 2px;

    box-shadow: none;

    padding: 25px;

}



.modal .modal-dialog .modal-content .modal-header {

    border-bottom-width: 2px;

    margin: 0;

    /* padding: 0; */

    padding-bottom: 15px;

}



.modal .modal-dialog .modal-content .modal-body {

    padding: 20px 0;

}



.modal .modal-dialog .modal-content .modal-footer {

    padding: 0;

    padding-top: 15px;

}



.modal-full {

    width: 98%;

}



.modal-content .nav.nav-tabs+.tab-content {

    margin-bottom: 0px;

}



.modal-content .panel-group {

    margin-bottom: 0px;

}



.modal-content .panel {

    border-top: none;

}





/* Custom-modal */



.modal-demo {

    background-color: #FFF;

    width: 600px;

    -webkit-border-radius: 4px;

    border-radius: 4px;

    -moz-border-radius: 4px;

    background-clip: padding-box;

    display: none;

}



.modal-demo .close {

    position: absolute;

    top: 15px;

    right: 25px;

    color: #eeeeee;

}



.custom-modal-title {

    padding: 15px 25px 15px 25px;

    line-height: 22px;

    font-size: 18px;

    background-color: #36404a;

    color: #ffffff;

    text-align: left;

    margin: 0px;

}



.custom-modal-text {

    padding: 20px;

}



.custombox-modal-flash .close,

.custombox-modal-rotatedown .close {

    top: 20px;

    z-index: 9999;

}





/* Tabs-Accordions */



.tabs-vertical-env .tab-content {

    margin-bottom: 0px;

}



.table>thead>tr>td.middle-align,

.table>tbody>tr>td.middle-align,

.table>.tfood>tr>td.middle-align,

.table>thead>tr>th.middle-align,

.table>tbody>tr>th.middle-align,

.table>.tfood>tr>th.middle-align {

    vertical-align: middle;

}



.list-group-item.active,

.list-group-item.active:hover,

.list-group-item.active:focus {

    background-color: #71b6f9;

    border-color: #71b6f9;

}



.nav-pills>.active>a>.badge {

    color: #71b6f9;

}



.has-success .form-control {

    border-color: #10c469;

    box-shadow: none !important;

}



.has-warning .form-control {

    border-color: #f9c851;

    box-shadow: none !important;

}



.has-error .form-control {

    border-color: #ff5b5b;

    box-shadow: none !important;

}



.input-group-addon {

    border-radius: 2px;

    border: 1px solid #eeeeee;

}





/* Tooltips */



.tooltip-inner {

    border-radius: 1px;

    padding: 6px 10px;

}



.jqstooltip {

    -webkit-box-sizing: content-box;

    -moz-box-sizing: content-box;

    box-sizing: content-box;

    width: auto!important;

    height: auto!important;

}





/* Popover */



.popover {

    font-family: inherit;

    border: none;

    -webkit-border-radius: 3px;

    border-radius: 3px;

    -moz-border-radius: 3px;

    background-clip: padding-box;

}



.popover .popover-title {

    background-color: transparent;

    color: #71b6f9;

    font-weight: 600;

}





/* Code */



code {

    color: #188ae2;

    background-color: #f4f8fb;

    border-radius: 4px;

}





/* Pre */



pre {

    background-color: #f4f8fb;

    border: 1px solid #d4d8da;

}





/* Carousel */



.carousel-control {

    width: 10%;

}



.carousel-control span {

    position: absolute;

    top: 50%;

    /* pushes the icon in the middle of the height */

    z-index: 5;

    display: inline-block;

    font-size: 30px;

}





/* Owl */



.slider-bg {

    background-size: cover !important;

    padding: 5.5% 4.5%;

}





/* Media */



.media {

    margin-bottom: 20px;

}



.media .media-heading {

    font-weight: 600;

    font-size: 16px;

}



.media:last-of-type {

    margin-bottom: 0px;

}





/* =============



   Animation



============= */





/* Progressbar Animated */



@-webkit-keyframes animationProgress {

    from {

        width: 0;

    }

}



@keyframes animationProgress {

    from {

        width: 0;

    }

}





/* Portlets loader */



@-webkit-keyframes sk-rotateplane {

    0% {

        -webkit-transform: perspective(120px);

    }

    50% {

        -webkit-transform: perspective(120px) rotateY(180deg);

    }

    100% {

        -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg);

    }

}



@keyframes sk-rotateplane {

    0% {

        transform: perspective(120px) rotateX(0deg) rotateY(0deg);

        -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);

    }

    50% {

        transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);

        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);

    }

    100% {

        transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);

        -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);

    }

}





/*!



 * Waves v0.6.0



 * http://fian.my.id/Waves



 *



 * Copyright 2014 Alfiana E. Sibuea and other contributors



 * Released under the MIT license



 * https://github.com/fians/Waves/blob/master/LICENSE



 */



.waves-effect {

    position: relative;

    cursor: pointer;

    display: inline-block;

    overflow: hidden;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

    -webkit-tap-highlight-color: transparent;

    vertical-align: middle;

    z-index: 1;

    will-change: opacity, transform;

    -webkit-transition: all 0.3s ease-out;

    -moz-transition: all 0.3s ease-out;

    -o-transition: all 0.3s ease-out;

    -ms-transition: all 0.3s ease-out;

    transition: all 0.3s ease-out;

}



.waves-effect .waves-ripple {

    position: absolute;

    border-radius: 50%;

    width: 20px;

    height: 20px;

    margin-top: -10px;

    margin-left: -10px;

    opacity: 0;

    background: rgba(0, 0, 0, 0.2);

    -webkit-transition: all 0.7s ease-out;

    -moz-transition: all 0.7s ease-out;

    -o-transition: all 0.7s ease-out;

    -ms-transition: all 0.7s ease-out;

    transition: all 0.7s ease-out;

    -webkit-transition-property: -webkit-transform, opacity;

    -moz-transition-property: -moz-transform, opacity;

    -o-transition-property: -o-transform, opacity;

    transition-property: transform, opacity;

    -webkit-transform: scale(0);

    -moz-transform: scale(0);

    -ms-transform: scale(0);

    -o-transform: scale(0);

    transform: scale(0);

    pointer-events: none;

}



.waves-notransition {

    -webkit-transition: none !important;

    -moz-transition: none !important;

    -o-transition: none !important;

    -ms-transition: none !important;

    transition: none !important;

}



.waves-circle {

    -webkit-transform: translateZ(0);

    -moz-transform: translateZ(0);

    -ms-transform: translateZ(0);

    -o-transform: translateZ(0);

    transform: translateZ(0);

    text-align: center;

    width: 2.5em;

    height: 2.5em;

    line-height: 2.5em;

    border-radius: 50%;

    -webkit-mask-image: none;

}



.waves-input-wrapper {

    border-radius: 0.2em;

    vertical-align: bottom;

}



.waves-input-wrapper .waves-button-input {

    position: relative;

    top: 0;

    left: 0;

    z-index: 1;

}



.waves-block {

    display: block;

}



.waves-effect.waves-light .waves-ripple {

    background-color: rgba(255, 255, 255, 0.4);

}



.waves-effect.waves-custom .waves-ripple {

    background-color: rgba(113, 182, 249, 0.4);

}



.waves-effect.waves-primary .waves-ripple {

    background-color: rgba(24, 138, 226, 0.4);

}



.waves-effect.waves-success .waves-ripple {

    background-color: rgba(16, 196, 105, 0.4);

}



.waves-effect.waves-info .waves-ripple {

    background-color: rgba(53, 184, 224, 0.4);

}



.waves-effect.waves-warning .waves-ripple {

    background-color: rgba(249, 200, 81, 0.4);

}



.waves-effect.waves-danger .waves-ripple {

    background-color: rgba(255, 91, 91, 0.4);

}



.waves-effect.waves-pink .waves-ripple {

    background-color: rgba(255, 138, 204, 0.4);

}



.waves-effect.purple .waves-ripple {

    background-color: rgba(91, 105, 188, 0.2);

}



.waves-effect.waves-inverse .waves-ripple {

    background-color: rgba(59, 62, 71, 0.4);

}





/* =============



   Print css



============= */



@media print {

    .page-title-box,

    .topbar-left,

    .hidden-print,

    .breadcrumb,

    .page-title,

    .footer,

    #topnav,

    .btn-custom {

        display: none;

        margin: 0px;

        padding: 0px;

    }

    .left,

    .right-bar {

        display: none;

    }

    .wrapper {

        margin-top: 0px !important;

        padding-top: 0px;

    }

    .content-page {

        margin-left: 0px;

        margin-top: 0px;

    }

}



table.pretty thead th {

    background: #900C3F;

    color: #fff;

}