.xmasTreecontainer {
    position: relative;
    width: 40px;
    height: 40px;
    xmargin: auto;
    xbackground: #0b1a5e;
    border-radius: 120px;
    z-index: -2;
    display: inline-block;
}

.tree {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 13%;
    top: 5%;
}

.tree-triangle3 {
    position: absolute;
    width: 66%;
    height: 36%;
    bottom: 20%;
    left: 3.5%;
    background: #034f33;
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}

.tree-triangle2 {
    position: absolute;
    width: 53%;
    height: 33%;
    bottom: 35%;
    left: 10%;
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
    background: #046944;
    z-index: 2;
}

.tree-triangle1 {
    position: absolute;
    width: 42%;
    height: 25%;
    bottom: 50%;
    left: 15.5%;
    background: #038052;
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
    z-index: 3;
}

.trunk {
    position: absolute;
    width: 10%;
    height: 16%;
    background: #66503e;
    z-index: -1;
    bottom: 5%;
    left: 32%;
}

.ornament {
    position: absolute;
    width: 10%;
    height: 10%;
    border-radius: 50%;
    box-shadow: 0 0 3px #033b26;
    /*   background: #eb5252; */
    z-index: 4;
}

.shine {
    position: absolute;
    width: 55%;
    height: 55%;
    top: 10%;
    right: 11%;
    border-radius: 50%;
    background: white;
    filter: opacity(60%);
}

.or1 {
    left: 28%;
    top: 34%;
    background: #0742d9;
}

.or2 {
    left: 40%;
    top: 45%;
    background: #c91212;
}

.or3 {
    left: 20%;
    top: 49%;
    background: #dbb700;
}

.or4 {
    left: 34%;
    top: 62%;
    background: #0742d9;
}

.or5 {
    left: 50%;
    top: 69%;
    background: #dbb700;
}

.or6 {
    left: 15%;
    top: 68%;
    background: #c91212;
}

.star {
    position: absolute;
    width: 20%;
    height: 20%;
    background: #ffe380;
    clip-path: polygon( 50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35% );
    left: 26.5%;
    top: 11%;
    z-index: 4;
}

.star-highlight {
    position: absolute;
    width: 20%;
    height: 20%;
    background: #fff1bf;
    clip-path: polygon( 50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 50% 70%, 50% 60%, 50% 46%, 50% 36% );
    left: 26.5%;
    top: 11%;
    z-index: 4;
}

.star-light {
    position: absolute;
    width: 20%;
    height: 20%;
    background: #fff1bf;
    filter: opacity(0.7);
    border-radius: 50%;
    left: 26.5%;
    top: 11%;
    z-index: 3;
    animation: star 3s ease-in-out infinite;
}

@keyframes star {
    100% {
        transform: scale(0.5);
    }

    50% {
        transform: scale(1.1);
    }

    0% {
        transform: scale(0.5);
    }
}