@media all and (max-width: 991px) {
    .navbar-button{
        margin:auto;
    }
}

@media all and (min-width: 415px) {
    .list-group-item {
        padding: .75rem .25rem !important;
    }
    .main-panel {
        margin-top: 30px;
    }
    p,
    option {
        font-size: 15px;
    }
}

@media all and (max-width: 414px) {
    .tab-content {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
    .form-item {
        margin-top: 5px !important;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    .form-content {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    .form-check-label {
        margin-left: 3px !important;
    }
    h6 {
        font-size: 12px;
    }
}

@media all and (min-width: 321px) and (max-width: 414px) {
    .list-group-item {
        padding: .50rem .25rem !important;
    }
    .main-panel {
        margin-top: 45px;
    }
    span.top-bar,
    p,
    option {
        font-size: 13px;
    }
}

@media all and (max-width: 320px) {
    .list-group-item {
        padding: .40rem .25rem !important;
    }
    .main-panel {
        margin-top: 45px;
    }
    span.top-bar,
    h6,
    p,
    option {
        font-size: 11px !important;
    }
    .note {
        font-size: 9px;
    }
    .form-group {
        font-size: 13px;
    }
    #message p {
        padding: 5px 6px;
    }
    .valid:before {
        left: -5px;
    }
    .invalid:before {
        left: -5px;
    }
}