/* makes everything fit inside a set width */
*,
*::before,
*::after {
    /* default val is content-box */
    box-sizing: border-box;
}

/* TEMPORARY */
h2.coming-soon{
    text-align: center;
}


body{
    font-family: Karla, sans-serif;
    font-size: 20px;
    
    color: rgb(203, 198, 198);
    background-color: rgb(65, 66, 67);
    /* background-color: rgb(220, 200, 223); */

    /* background-image: url('/images/peach-background.jpg'); */
    margin: 0;

}
p{
    margin: 0;
}

ul.star-list li::marker{
    content: "\2605   "; /* filled star */
    font-size: 10px;
}

ul.star-list ul{
    padding-left: 16px;
    column-count: 1;
}

ul.star-list ul li::marker{
    content: "\2606   "; /* empty star */
    font-size: 9px;
}

li.break-before{
    break-before: column;
}


.heading{ 
    display: inline-block;
    /* font-family: Verdana, Geneva, Tahoma, sans-serif; */
    font-family: "Gaegu", sans-serif;
    font-size: 40px;
    font-weight: 700;
    
    border: 3px dashed rgb(237, 188, 54);

    border-radius: 4px;
    padding: 20px;
    margin-bottom: 10px;
}
.heading-container{
    text-align: center;
}

.highlight{
    font-weight: 700; /* maybe not working with this font */
    color: rgb(230, 149, 227);
    font-style: italic;
}

.divider{ 
    text-align: center; 
    font-weight: 700;
    margin-bottom: 10px;
}

.to-do{
    font-family: 'Space Mono';
    position: absolute;
    bottom: 4px;
    padding-right: 15px;
    display: inline-block;
    background-color: rgba(216, 90, 216, 0.8);
    width: 30%;
    overflow-wrap: break-word;
    border-radius: 2px;
    font-size: 16px;
    max-height: 40%;
    cursor: pointer;
}


@media (max-width: 900px){
    .to-do{
        position: relative;
        width: 45%;
        margin-left: 25%;
    }

}

a{
    text-decoration: none;
    transition: color 0.5s;
}
a:link,
a:visited{
    color: rgb(237, 188, 54);
}

a:hover{
    color: rgb(119, 151, 15);
    text-decoration: underline;
}

a:active{
    color: green;
}

.related-pages{
    margin: 15px;
    text-align: center;
}