﻿:root {
    box-sizing :border-box;
}

html {
position: relative;
min-height: 100%;
}

body {
    margin-bottom: 80px;
    margin-left:50px;
    margin-right:50px;
}

/* #region Footer styles */
.footer {
    position: absolute;
    bottom: 0;
    width: 95%;
    font-size: 0.85em;
}
/* #endregion */

/* #region custom Kendo UI styles */
#configure {
    display: none;
}

.k-panelbar .k-content {
    padding: 20px;
}

p .k-button {
    margin: 0 15px 0 0;
}

.k-state-active .label {
    font-size: 1em;
}
/* #endregion */

.clinical-pharmacy {
    font-size: 1rem
}
@media (max-width: 767px) {
    #responsive-panel {
        transition: all linear .2s;
    }

    #configure {
        display: block;
        float: right;
    }

    .k-rpanel {
        width: 100%;
    }

    .k-rpanel-expanded {
        margin-top: 1rem;
    }

    .navbar-header {
        width: 100%;
    }

    .footer {
        height: 60px;
    }

    .k-menu .k-item,
    .k-menu .k-link {
        width: 100%;
    }

    .k-menu .k-link {
        box-sizing: border-box;
    }
}

@media (max-width: 1024px) {
    body {
        font-size: 0.75rem;
        margin-left: 10px;
        margin-right: 10px;
    }

    .header__image > img {
        width: 75%;
    }

    .k-menu-group .k-menu-item {
        font-size: calc(14px * .75);
        line-height: calc(1.4285714286 * .75);
    }

    table {
        font-size: 0.75rem;
    }

    .form-control {
        font-size: 0.75rem;
    }

    .k-button {
        font-size: 0.75rem;
        line-height: 0.75rem;
        padding: 2px 4px;
    }

    h3 {
        font-size: 0.75rem;
    }

    h6 {
        font-size: 0.75rem;
    }

    .k-textbox, .k-input.k-textbox, .k-textarea {
        font-size: 0.75rem;
    }

    .btn-sm, .btn-group-sm > .btn {
        font-size: 0.75rem;
        line-height: 0.75rem;
    }

    .k-widget {
        font-size: 0.75rem;
        line-height: 0.75rem;
    }

    .k-dropdown, .k-dropdowntree {
        font-size: calc(14px * .75);
        line-height: calc(1.4285714286 * .75);
    }

    .k-window-title {
        font-size: 1em;
    }

    .header__image {
        width: 210px;
    }

    .k-grid th, .k-grid td {
        padding: 2px 4px;
    }

    .k-card {
        font-size: calc(14px * .75);
        line-height: calc(1.4285714286 * .75)
    }
    .clinical-pharmacy {
        font-size: 0.75rem
    }
    .k-switch-handle {
        border-radius: calc(6em * .75);
        width: calc(3em * .75);
        height: calc(3em * .75);
    }
    .k-widget .k-switch {
        font-size: calc(10px * .75);
    }
}

@media (min-width: 1025px) and (max-width: 1366px) {
    body {
        font-size: 0.85rem;
        margin-left: 10px;
        margin-right: 10px;
    }
    .header__image > img {
        width: 85%;
    }

    .k-menu-group .k-menu-item {
        font-size: calc(14px * .85);
        line-height: calc(1.4285714286 * .85);
    }

    table {
        font-size: 0.85rem;
    }

    .form-control {
        font-size: 0.85rem;
    }


    .k-button {
        font-size: 0.85rem;
        line-height: 0.85rem;
        padding: 2px 4px;
    }

    h3 {
        font-size: 0.85rem;
    }

    h6 {
        font-size: 0.85rem;
    }

    .k-textbox, .k-input.k-textbox, .k-textarea {
        font-size: 0.85rem;
    }

    .btn-sm, .btn-group-sm > .btn {
        font-size: 0.85rem;
        line-height: 0.85rem;
    }

    .k-widget {
        font-size: 0.85rem;
        line-height: 0.85rem;
    }

    .k-dropdown, .k-dropdowntree {
        font-size: calc(14px * .85);
        line-height: calc(1.4285714286 * .85);
    }

    .k-window-title {
        font-size: 1em;
    }

    .header__image {
        width: 224px;
    }

    .k-grid th, .k-grid td {
        padding: 2px 4px;
    }

    .k-card {
        font-size: calc(14px * .85);
        line-height : calc(1.4285714286 * .85)
    }

    .clinical-pharmacy {
        font-size: 0.85rem
    }

    .k-switch-handle {
        border-radius: calc(6em * .85);
        width: calc(3em * .85);
        height: calc(3em * .85);
    }

    .k-widget .k-switch {
        font-size: calc(10px * .85);
    }
}
