@import '@/global.less';

.configure-page {
    color: #fff;
    padding: 0 20px;
    z-index: 1000;
    position: relative;

    .top-menu {
        display: flex;
        flex-wrap: wrap;

        .item {
            width: 130px;
            height: 32px;
            margin-bottom: 15px;
            line-height: 32px;
            text-align: center;
            font-size: 14px;
            background-size: 100% 100%;
            cursor: pointer;
            transition: all .2s ease-in;
        }

        .item.active {
            color: @title-color;
        }

        .item0 {
            background-image: url('../../assets/images/Left_b_img.png');
        }

        .item1 {
            background-image: url('../../assets/images/between_b_img.png');
        }

        .item00 {
            background-image: url('../../assets/images/Right_b_img.png');
        }

        .item0.active {
            background-image: url('../../assets/images/Left_a_img.png');
        }

        .item1.active {
            background-image: url('../../assets/images/between_a_img.png');
        }

        .item00.active {
            background-image: url('../../assets/images/Right_a_img.png');
        }

        .item:first-child {
            background-image: url('../../assets/images/Left_b_img.png');
        }

        .item:first-child.active {
            background-image: url('../../assets/images/Left_a_img.png');
        }
    }

    input::-webkit-input-placeholder {
        color: #0ff !important;
    }

    input::-moz-input-placeholder {
        color: #0ff !important;
    }

    input::-ms-input-placeholder {
        color: #0ff !important;
    }
}