* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    background: var(--bg-color);
}

#side-tags.animate {
    animation-name: showUp;
    animation-duration: 0.9s;
}

.side-tag-holder {
    transition: height 4s;
    display: inline-block;
    position: fixed;
    z-index: 10;
    top: -45px;
    right: -12px;
    transform: rotate(-90deg);
    transform-origin: bottom right;
    height: 45px;
    /*width: 375px;*/

    overflow: auto;
    white-space: nowrap;

    /*font-family: myFirstFont, sans-serif;*/
    /*position: fixed;*/
    /*z-index: 1;*/
    /*overflow: auto;*/
    /*white-space: nowrap;*/
    /*background: #1a1a18;*/
    /*transition: top 0.3s;*/
}

.side-tags {
    /*right: 0;
    position: fixed;*/
}

.side-tag {
    margin-left: 8px;
    display: inline-block;
    /*background: transparent;*/
    text-align: center;
    color: white;
    padding-right: 10px;
    padding-left: 10px;
    padding-top: 5px;
    /*float: right;*/
    /*   padding: 10px; */
    /*   transform: rotate(90deg);  */

    transform: skew(20deg);
    background: var(--side-tag-color);
    height: 35px;
    font-style: italic;

    /*border-bottom: 35px solid var(--side-tag-color);*/
    /*border-left: 25px solid transparent;*/
    /*border-right: 25px solid transparent;*/
    /*height: 0;*/

    /*width: auto;*/
    /*-webkit-filter: drop-shadow(0 1px 5px var(--menu-second-color));*/
    /*-moz-filter: drop-shadow(0 1px 5px var(--menu-second-color));*/
    /*-ms-filter: drop-shadow(0 1px 5px var(--menu-second-color));*/
    /*-o-filter: drop-shadow(0 1px 5px var(--menu-second-color));*/
    /*filter: drop-shadow(0 -5px 5px var(--menu-second-color));*/
    text-decoration: none;

}

.side-tag a {
    height: 100%;
    color: white;
    text-decoration: none;
}

.side-tag:active {
    border-bottom: 35px solid var(--second-color);
}