img.preloadImg {
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
    visibility: collapse;
}

icon {
    /* border: solid 1px green; */
    position: relative;
}
iconFrame {
    position: absolute;
    left:50%;
    top: 50%;
    transform:
    translate(-50%,-50%);
    z-index: 2;
    /* box-shadow: .2vw .2vw darkblue; */
    /* border: 0.25vw solid #f9e18d; */
    border-radius: 0.5vw;
    zoom: 1;
}
.circleImg {
    position: absolute;
    left:50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 1;
}
@keyframes rotateCircle {
    0% {transform: translate(-50%,-50%) rotate(0deg);} 
    100% {transform: translate(-50%,-50%) rotate(360deg);}
}
img.circleImg.isNow {
    animation: rotateCircle 5s linear infinite;
}
icon number {
    color: #f9e18d;
    font-size: 3vw;
    font-weight: bold;
    z-index: 4;
    position: absolute;
    right: .25vw;
    top: 0;
    text-shadow: .1vw .05vw darkblue;
}
img.iconImg {
    z-index: 2;
    position: relative;
}
iconlabel {
    font-size: 2vw;
    color: #f1d989;
    text-shadow: .1vw .05vw darkblue;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    z-index: 4;
}
icon.featured iconLabel, icon.featured number {
    color: #f3ad2d;
}

icon {
    cursor: pointer;
}


/* move to vsChart's css file */

#vsChart dayelement {
    padding: 1vw;
    border-left: solid .25vw #fcb32e;
}



icon.squish {
    margin-right: -2vw;
}


icon[decoration="VSday"].isNow.featured iconFrame {
    background-image: linear-gradient(#0154a9, #0174ea);
}
icon.featured[decoration="VSday"] iconframe {
    border: solid .25vw #f3ad2d;
}

icon[decoration="ARpart"].isNow.featured iconFrame {
    background-image: linear-gradient(#8e56bf, #9c5ed2);
}
icon.featured[decoration="ARpart"] iconframe {
    border: solid .25vw #fed535;
}





icon[decoration="VSday"] iconframe {
    border: solid .25vw #ffe691;
}


icon.featured[decoration="VSday"] .iconImg {
    filter: opacity(.75) drop-shadow(0 0 0 #fcb32e);
}