ul.mycardusage {
    padding: 0 0 0 2em;
    margin: 0;
    list-style: square;
    font-size: 0.9em;
}
ul.mycardusage > li {

}
ul.mycardusage > li.door {
    color: #ccf;
}

.ursshomemaxhight {
    overflow-y: auto;
    max-height: 200px;
}
.ursshomemaxhight .scroller {
    overflow-y: auto;
    max-height: calc(200px - 4 * var(--skin-gap));
}


.ursshomemaxhight .scroller::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
    border-radius: var(--skin-radius);
}

.ursshomemaxhight .scroller::-webkit-scrollbar {
    width: 10px;
    background-color: #F5F5F5;
}

.ursshomemaxhight .scroller::-webkit-scrollbar-thumb {
    background-color: #99a;

    background-image: -webkit-gradient(linear, 0 0, 0 100%,
        color-stop(.5, rgba(255, 255, 255, .2)),
        color-stop(.5, transparent), to(transparent));
    border-radius: var(--skin-radius);
}



section.URSSstartpage .TODO {

}
section.URSSstartpage .TODO ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
section.URSSstartpage .TODO ul li p {
    margin: 3px;
}

section.URSSstartpage .TODO ul li p:first-child > a:before {
    font-family: var(--system-icons);
    content: "\f100";
    color: red;
    padding-right: 0.5em;
}


section.URSSpagegroup {
    margin: 1px;
    padding: 1px;
}
section.URSSpagegroup div.submenu {
    display: flex;
    justify-content: space-between;
    align-items: center;

    color: var(--skin-colorP2);
    border-radius: var(--skin-radius);

    /*    background-color: var(--skin-colorG2); */
    /*
    background: rgb(28,28,28);
    background: linear-gradient(180deg, rgba(28,28,28,1) 0%, rgba(28,28,28,1) 68%, rgba(12,54,97,1) 90%);
    */
    text-transform: uppercase;

}
section.URSSpagegroup div.submenu .buttons {
    display: flex;
    gap: 5px;
    font-size: 0.85em;    
}
section.URSSpagegroup div.submenu .buttons a {
    background-color: var(--skin-colorG3);
    color: var(--skin-colorB);
}
section.URSSpagegroup div.submenu .buttons a:hover {
    background-color: var(--skin-colorP2);
    color: var(--skin-colorW);
}
section.URSSpagegroup div.submenu .buttons a:hover > i:first-child {
    filter: invert(1);
}
section.URSSpagegroup div.submenu .buttons a > i:first-child {
    height: 1em;
    width: 1em;
    position: relative;
}
section.URSSpagegroup div.submenu .buttons a.selected > i:first-child {
    filter: invert(1);
}
section.URSSpagegroup div.submenu .buttons a > i:first-child img {
    height: 200%;
    width: 200%;
    display: flex;
    inset: -50%;
    position: absolute;
}



section.URSSpagegroup div.submenu .buttons a.selected:hover > i:first-child {
    filter: invert(1);
}
section.URSSpagegroup div.submenu .buttons a.selected {
    background-color: transparent;
    color: var(--skin-colorP2);
    border-bottom: 2px solid var(--skin-colorP2);
    cursor: default;
}
section.URSSpagegroup div.submenu .buttons a.selected > i:first-child,
section.URSSpagegroup div.submenu .buttons a.selected:hover > i:first-child {
    filter: invert(0);
}


section.URSSpagegroup div.submenu .title {
    font-size: 1.2em;
    font-weight: normal;
    display: flex;
    align-items: center;   
    gap:3px;
}
section.URSSpagegroup div.submenu .title i {
    height: 2.5em;
    aspect-ratio: 1;
    margin-right: -0.2em;
    margin-top: -2px;    
}
section.URSSpagegroup div.submenu .title i img {
    height: 100%;
    object-fit: contain;
    filter: invert(22%) sepia(82%) saturate(2199%) hue-rotate(189deg) brightness(94%) contrast(99%);
}
section.URSSpagegroup div.submenu .title .sub {
    font-weight: 900;
    position: relative;
    top: -1px;
}
section.URSSpagegroup div.content {
    padding: 5px 10px;
}
@media screen
and (max-width: 768px) {
    section.URSSpagegroup div.submenu {
        display: flex;
        flex-direction: column;
    }
}
@media screen
and (min-width: 769px) {
    section.URSSpagegroup div.submenu {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 5px 10px;
        margin: 5px;
    }
}


/* detailed responsive */
@media screen
and (max-width: 360px) {
    section.URSSpagegroup div.submenu .buttons a span {
        display: none;
    }
    section.URSSpagegroup div.submenu .buttons a i {
        font-size: 1.3em;
        padding: 0.5em;
        margin: 0;
    }
}
@media screen
and (min-width: 361px)
and (max-width: 768px) {
    section.URSSpagegroup div.submenu .buttons a span {
        display: none;
    }
    section.URSSpagegroup div.submenu .buttons a i {
        font-size: 1.3em;
        padding: 0.5em;
        margin: 0;
    }
}

@media only screen
and (min-width : 769px) 
and (max-width : 993px) {
    section.URSSpagegroup div.submenu .buttons a span {
        display: none;
    }
    section.URSSpagegroup div.submenu .buttons a i {
        font-size: 1.3em;
        padding: 0.5em;
    }
}

@media only screen
and (min-width : 994px)
and (max-width : 1169px) {
    section.URSSpagegroup div.submenu .buttons a span {
        display: none;
    }
    section.URSSpagegroup div.submenu .buttons a i {
        font-size: 1.3em;
        padding: 0.5em;
    }

}
@media only screen
and (min-width : 1170px)
and (max-width : 1699px) {
    section.URSSpagegroup {
        font-size: 0.8em;
    }
}

@media only screen
and (min-width : 1700px) {
    section.URSSpagegroup {
        font-size: 1em;
    }
}