@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&display=swap');

body {
    font-family: 'Poppins', sans-serif;
}

/**
NAVBAR
*/

.navbar .navbar-brand img {
    height: 40px;
}

.navbar-container {
    transition: all .5s ease;
}

.navbar-container.extended {
    max-width: 100%;
    padding: 0;
    transition: all .5s ease;
}

.navbar-container.extended .navbar {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
}



/**
FOOTER
*/

footer a {
    color: #bbb;
    display: block;
    font-weight: lighter;
    font-size: 90%;
}

footer a:hover {
    color: white;
}

/**
UTILITIES
*/

.rounded-xl{
    border-radius:1rem !important;
}

.text-soft-bookizon {
    color: #BFC5F5 !important;
}

.bg-soft-bookizon {
    background-color: #BFC5F5 !important;
}

.text-magenta {
    color: #e5007e !important;
}

.bg-magenta {
    background-color: #e5007e !important;
}

.bg-magenta-soft {
    background-color: #ffdaeb !important;
}

.text-blue {
    color: #35a8e0 !important;
}

.bg-blue {
    background-color: #35a8e0 !important;
}

.bg-blue-soft {
    background-color: #bce1fd !important;
}

.text-green {
    color: #5cb337 !important;
}

.bg-green {
    background-color: #5cb337 !important;
}

.bg-green-soft {
    background-color: #cae3bd !important;
}

.text-yellow {
    color: #d5b849 !important;
}

.bg-yellow {
    background-color: #d5b849 !important;
}

.bg-yellow-soft {
    background-color: #ffe1a7 !important;
}

.text-orange {
    color: #f4b942 !important;
}

.bg-orange {
    background-color: #f4b942 !important;
}

.bg-orange-soft {
    background-color: #ffcca7 !important;
}

.text-gray {
    color: #8a8a8a !important;
}

.bg-gray {
    background-color: #8a8a8a !important;
}

.bg-gray-soft {
    background-color: #e2e0e0 !important;
}

.text-red {
    color: #fb3a3a !important;
}

.bg-red {
    background-color: #fb3a3a !important;
}

.bg-red-soft {
    background-color: #ffb8b8 !important;
}


.bg-primary-soft {
    background-color: #b9bbce;
}

.bg-secondary-soft {
    background-color: #d3d1f6;
}

.bg-success-soft {
    background-color: #edfab7;
}

.bg-danger-soft {
    background-color: #fab7b7;
}

.bg-warning-soft {
    background-color: #ffe7ce;
}

.bg-info-soft {
    background-color: #dfeef7 !important;
}

.w-10{width:10% !important;}
.w-20{width:20% !important;}
.w-30{width:30% !important;}
.w-40{width:40% !important;}
.w-60{width:60% !important;}
.w-70{width:70% !important;}
.w-80{width:80% !important;}
.w-90{width:90% !important;}

.h-10{height:10% !important;}
.h-20{height:20% !important;}
.h-30{height:30% !important;}
.h-40{height:40% !important;}
.h-60{height:60% !important;}
.h-70{height:70% !important;}
.h-80{height:80% !important;}
.h-90{height:90% !important;}

/* Scrollable rows */

.row.row-scrollable {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
}

.row.row-scrollable.row-scrollable-nested .row {
    display: block;
    white-space: nowrap;
}

.row.row-scrollable > [class*="col"] {
    display: inline-block;
}

.row.row-scrollable.row-scrollable-nested [class*="col"] {
    display: inline-block;
}

@media (min-width: 576px) {
    .position-sm-static {
        position: static !important;
    }

    .fixed-bottom-sm {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1030;
    }

    .h-sm-100 {
        height: 100% !important;
    }

    .h-sm-75 {
        height: 75% !important;
    }

    .h-sm-50 {
        height: 50% !important;
    }

    .h-sm-25 {
        height: 25% !important;
    }

    .shadow-sm-show-sm {
        box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important
    }

    .shadow-show-sm {
        box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important
    }

    .shadow-lg-show-sm {
        box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important
    }

    .shadow-none-sm {
        box-shadow: none !important
    }

    /* Scrollable rows */
    .row.row-sm-scrollable:not(.row-sm-scrollable-none) {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .row.row-sm-scrollable:not(.row-sm-scrollable-none).row-scrollable-nested .row {
        display: block;
        white-space: nowrap;
    }

    .row.row-sm-scrollable:not(.row-sm-scrollable-none) > [class*="col"] {
        display: inline-block;
    }

    .row.row-sm-scrollable:not(.row-sm-scrollable-none).row-scrollable-nested [class*="col"] {
        display: inline-block;
    }

    /* Scrollable rows NONE */
    .row.row-sm-scrollable-none,
    .row.row-sm-scrollable-none.row-scrollable-nested .row {
        display: flex;
        overflow-x: initial;
        white-space: normal;
    }

    .row.row-sm-scrollable-none > [class*="col"],
    .row.row-sm-scrollable-none.row-scrollable-nested [class*="col"] {
        display: block;
    }

}

@media (min-width: 768px) {
    .position-md-static {
        position: static !important;
    }

    .fixed-bottom-md {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1030;
    }

    .h-md-100 {
        height: 100% !important;
    }

    .h-md-75 {
        height: 75% !important;
    }

    .h-md-50 {
        height: 50% !important;
    }

    .h-md-25 {
        height: 25% !important;
    }

    .shadow-sm-show-md {
        box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important
    }

    .shadow-show-md {
        box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important
    }

    .shadow-lg-show-md {
        box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important
    }

    .shadow-none-md {
        box-shadow: none !important
    }

    /* Scrollable rows */
    .row.row-md-scrollable:not(.row-md-scrollable-none) {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .row.row-md-scrollable:not(.row-md-scrollable-none).row-scrollable-nested .row {
        display: block;
        white-space: nowrap;
    }

    .row.row-md-scrollable:not(.row-md-scrollable-none) > [class*="col"] {
        display: inline-block;
    }

    .row.row-md-scrollable:not(.row-md-scrollable-none).row-scrollable-nested [class*="col"] {
        display: inline-block;
    }

    /* Scrollable rows NONE */
    .row.row-md-scrollable-none,
    .row.row-md-scrollable-none.row-scrollable-nested .row {
        display: flex;
        overflow-x: initial;
        white-space: normal;
    }

    .row.row-md-scrollable-none > [class*="col"],
    .row.row-md-scrollable-none.row-scrollable-nested [class*="col"] {
        display: block;
    }
}

@media (min-width: 992px) {
    .position-lg-static {
        position: static !important;
    }

    .fixed-bottom-lg {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1030;
    }

    .h-lg-100 {
        height: 100% !important;
    }

    .h-lg-75 {
        height: 75% !important;
    }

    .h-lg-50 {
        height: 50% !important;
    }

    .h-lg-25 {
        height: 25% !important;
    }

    .shadow-sm-show-lg {
        box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important
    }

    .shadow-show-lg {
        box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important
    }

    .shadow-lg-show-lg {
        box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important
    }

    .shadow-none-lg {
        box-shadow: none !important
    }

    /* Scrollable rows */
    .row.row-lg-scrollable:not(.row-lg-scrollable-none) {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .row.row-lg-scrollable:not(.row-lg-scrollable-none).row-scrollable-nested .row {
        display: block;
        white-space: nowrap;
    }

    .row.row-lg-scrollable:not(.row-lg-scrollable-none) > [class*="col"] {
        display: inline-block;
    }

    .row.row-lg-scrollable:not(.row-lg-scrollable-none).row-scrollable-nested [class*="col"] {
        display: inline-block;
    }

    /* Scrollable rows NONE */
    .row.row-lg-scrollable-none,
    .row.row-lg-scrollable-none.row-scrollable-nested .row {
        display: flex;
        overflow-x: initial;
        white-space: normal;
    }

    .row.row-lg-scrollable-none > [class*="col"],
    .row.row-lg-scrollable-none.row-scrollable-nested [class*="col"] {
        display: block;
    }
}

@media (min-width: 1200px) {
    .position-xl-static {
        position: static !important;
    }

    .fixed-bottom-xl {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1030;
    }

    .h-xl-100 {
        height: 100% !important;
    }

    .h-xl-75 {
        height: 75% !important;
    }

    .h-xl-50 {
        height: 50% !important;
    }

    .h-xl-25 {
        height: 25% !important;
    }

    .shadow-sm-show-xl {
        box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important
    }

    .shadow-show-xl {
        box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important
    }

    .shadow-lg-xl {
        box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important
    }

    .shadow-none-show-xl {
        box-shadow: none !important
    }

    /* Scrollable rows */
    .row.row-xl-scrollable:not(.row-xl-scrollable-none) {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .row.row-xl-scrollable:not(.row-xl-scrollable-none).row-scrollable-nested .row {
        display: block;
        white-space: nowrap;
    }

    .row.row-xl-scrollable:not(.row-xl-scrollable-none) > [class*="col"] {
        display: inline-block;
    }

    .row.row-xl-scrollable:not(.row-xl-scrollable-none).row-scrollable-nested [class*="col"] {
        display: inline-block;
    }

    /* Scrollable rows NONE */
    .row.row-xl-scrollable-none,
    .row.row-xl-scrollable-none.row-scrollable-nested .row {
        display: flex;
        overflow-x: initial;
        white-space: normal;
    }

    .row.row-xl-scrollable-none > [class*="col"],
    .row.row-xl-scrollable-none.row-scrollable-nested [class*="col"] {
        display: block;
    }
}

/** App Icon */

.app-icon{
    display: inline-block;
    border-radius: 4px;
    border: 1px solid #cdcdcd;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-color:#fff;
}

.app-icon.app-icon-xs{width:25px; height:25px;}
.app-icon.app-icon-sm{width:30px; height:30px;}
.app-icon.app-icon-md{width:45px; height:45px;}
.app-icon.app-icon-lg{width:70px; height:70px;}