/*
 * Copyright (c)  2016, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
 *
 * WSO2 Inc. licenses this file to you under the Apache License,
 * Version 2.0 (the "License"); you may not use this file except
 * in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied. See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */

.contents {
    margin-top: -40px;
}

.image {
    /*noinspection CssOptimizeSimilarProperties*/
    background-image: url('../img/phone.png');
    background-size: 50px auto;
    /*noinspection CssOptimizeSimilarProperties*/
    background-repeat: no-repeat;
    /*noinspection CssOptimizeSimilarProperties*/
    background-position: 50% 50%;
    min-width: 50px;
    height: 100%;
}

body.dark .image {
    background-image: url('../img/phone-light.png');
}

.list-group {
    /*noinspection CssUnknownProperty*/
    transform: translate(0, 25%);
}

.list-group-item {
    background-color: transparent;
}

.list-group-item > .label {
    display: inline-block;
    vertical-align: text-bottom;
    float: right;
    font-size: 135%;
    font-weight: 300;
    margin-top: -2px;
    border-radius: 0;
    padding-right: 0;
    color: #808080;
}

.list-group-item > h1 {
    font-size: 20px;
    margin: 0;
}

.list-group-item > h2 > span {
    font-size: 35px;
    font-weight: 300;
    border-radius: 4px;
    padding: 2px 15px 3px 15px;
}

.list-group-item > h4 {
    margin-top: 0;
}

.list-group-item > h1 > .label {
    display: inline-block;
    vertical-align: text-bottom;
    border-radius: 0;
}

.list-group-item > .icon {
    margin-right: 5px;
    margin-bottom: 2px;
}

.list-group-item:hover {
    background-color: #e4e4e4;
    cursor: pointer;
}

body.dark .list-group-item {
    border-color: #353C48;
}

body.dark .list-group-item:hover {
    background-color: #353C48;
}

.progress-bg {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    display: block;
    background-color: #E3E5E6;
}

body.dark .progress-bg {
    background-color: #121822;
}
