.not-logged-in .panel {
    height: 88vh;
    overflow-y: scroll;
}

.not-logged-in .panel::-webkit-scrollbar {
    display: none;
}

.xelion-bg {
    background-color: #00A9DA;
}

.skin-blue .main-header .navbar,
.skin-blue .main-header .logo {
    background-color: #00A9DA !important;
}

.dataTables_filter {
    text-align: right;
}

.block-container {
    width: 450px;
    margin: 0 auto;
}

a.block {
    display: block;
    height: 130px;
    width: 130px;
    background-color: grey;
    float: left;
    margin-right: 30px;
    margin-bottom: 30px;
    text-align: center;
    color: white;
    text-decoration: none;
}

a.block:nth-child(3),
a.block:nth-child(6),
a.block:nth-child(9) {
    margin-right: 0;
}

a.block.center {
    background-color: #EC1B30;
    font-size: 20px;
    cursor: pointer;
    position: relative;
}

a.block .text {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
}

.step-container {
    position: relative;
    text-align: center;
}

div.step {
    display: inline-block;
    height: 130px;
    width: 130px;
    background-color: grey;
    margin-right: 30px;
    margin-bottom: 30px;
    vertical-align: top;
    color: white;
    text-decoration: none;
}

div.step-active {
    background-color: red;
}

div.step .text {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
}

.not-logged-in {
    height: 100%;
}

.not-logged-in body,
.not-logged-in .wrapper {
    height: 100%;
}

.not-logged-in .content-wrapper {
    margin-left: 0;
}

.not-logged-in footer {
    margin-left: 0;
    position: fixed;
    bottom: 0;
    width: 100%;
}

/**
 * Caller ID fields on "incoming call" page.
 */

#noCallerForm input,
#callerForm input {
    font-size: 30px;
    border: none;
    outline:none;
}

#callerForm span {
    visibility: hidden;
}

#callerForm:hover input,
#callerForm input:focus
{
    border: 1px solid #d2d6de;
    color: #333;
}

#callerForm:hover span,
#callerForm input:focus + span {
    visibility: visible;
}

.caller-phone {
    margin-left:14px;
    color:gray;
}

.marker {
    background-color: yellow;
}

.panel-heading div {
    font-size: 18px;
}

.panel-heading img {
    float: right;
    margin-top: -10px;
    max-height: 46px;
}

.viewonly-label {
    text-align: right;
    margin-bottom: 0!important;
}

/**
 * Media Queries
 */
@media (max-width: 992px) {
    .not-logged-in body {
        height: auto;
    }

    .not-logged-in footer {
        position: relative;
    }
}