*{
    outline: none;
    border: none;
}

.container{
    gap: calc(var(--gap) * 10);
}

#cms > div:nth-child(3) > nav > div:nth-child(2){
    display: none;
}

#cms{
    background-color: var(--secondary);
    display: flex;
    flex-direction: column;
    align-items: center;
}

#main > p {
    margin: 3em 5em;
}

#filters{
    background-color: var(--primary);
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 2em 0;
}

#search-bar{
    display: grid;
    grid-template-columns: 1fr min-content;
    background-color: var(--secondary);
    border-radius: 2em;
    overflow: hidden;
    width: 80%
}

#search-bar input{
    width: 100%;
    border: none;
    background: none;
    padding: 1em;
    color: white;
}

#search-bar > div.icon{
    margin: 0.5em;
}

#search-bar > div.icon > svg{
    fill: var(--accent);
}

#date-filter{
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 1em;
}

#date-filter input{
    width: auto;
    background-color: var(--secondary);
    color: white;
}

#date-filter > input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

#date-filter > div.icon{
    cursor: unset;
}

#date-filter > div.icon > svg{
    fill: var(--accent);
}

#filters .tags .tag svg{
    fill: var(--primary);
}

.tags{
    width: 80%;
    display: flex;
    margin: 1em 0;
    margin-top: 1em;
    gap: calc(var(--gap) * 5);
    flex-wrap: wrap;
}

.tag{
    display: flex;
    background-color: var(--accent);
    align-items: center;
    color: white;
    padding: 0.5em;
    border-radius: 2em;
    gap: unset;
}

.tag > span{
    padding-left: unset;
    font-family: var(--font-family-general);
}

#info{
    font-size: var(--font-size-h3);
    color: white;
    font-family: var(--font-family-general);
}
#cms > div.container > p{
    color: white;
    font-size: var(--font-size-h4);
}
#cms > .container{
    margin: 3em 3em;
    padding: var(--container-padding);
}
#cms > div:nth-child(3){
    color: white;
}

#motivation{
    width: 100%;
    max-width: var(--content-max-width);
    margin: 2em auto;
    display: flex;
    flex-direction: column;
    gap: calc(var(--gap) * 5);
    padding: var(--container-padding);
}

#motivation > *{
    padding: 0;
}


