
#eventnavbar {
    display: inline-flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    background-color: var(--bg-b);
    box-shadow: 0em 0em 0.2em 0.1em var(--shadow);
    width: 100%;
    padding: 0.7em 0vw;
}

.c_fixed #eventnavbar {
    box-shadow: 0em 0em 0.2em 0.1em var(--clear);
    padding: 0.2em 0vw;
}

#discounttopicon {
    display: none;
    position: absolute;
    left: 1em;   
}
#discounttopicon img {
    width: 3em;
    height: 3em;
}
.c_fixed #discounttopicon img {
    width: 2.5em;
    height: 2.5em;
}

#discountbottomicon {
    float: left;
    left: 1em;
}
#discountbottomicon img {
    width: 2em;
    height: 2em;
}

#toppadding {
}

#eventdiscounts {
    padding: 1em 0em 1em 0em;
}

#eventstickyheader {
    background-color: var(--bg-a);
    z-index: 4;
}

#eventnavigation {
    display: flex;
    padding: 0.8em;
    align-items: center;
    height: 3.7rem;
}

.c_fixed #eventnavigation {
    display: flex;
    padding: 0.2em;
    align-items: center;
}

.c_fixed #infotitle {
    padding: 0.3em;
    border-bottom: solid 0.1em var(--bg-c);
}

.c_fixed #titlename{
    font-size: 1em;
}

.c_fixed #brandname {
    font-size: 0.8em;
    margin-top: 0.3em;
}

#infotitle {
    transition: all 0.2s;
    display: flex;
    flex-direction: column;
    padding: 1em;
    border-bottom: solid 0em var(--clear);
    min-height: 6.5rem;
    align-items: center;
    justify-content: center;
}

#titlename{
    transition: all 0.2s;
    font-size: 125%;
    font-weight: bold;
}

#brandname {
    transition: all 0.2s;
    font-size: 95%;
    margin-top: 0.7em;
}

#eventinfotitle {
    display: flex;
    flex-direction: row;
}

.eventinfosubtitle {
    font-weight: bold;
    font-size: 1.1em;
    color: var(--bg-d);
    text-align: left;
    padding: 0.3em;
}

.eventinfosection {
    margin: 0.2em 1.3em 0.5em 1.3em;
}

.tapShowMore {
    color: var(--accent);
}

#editeventbtn {
    margin: 0vw 3vw 0vw auto;
}

#eventinfotext {

}

#editeventbtn img {
    transition: all 0.2s;
    width: 1.2em;
    transform: scale(1.4, 1.4) rotateZ(45deg) translate(0vw, 0.2em);
}

#editeventbtn.clicked img {
    transform: scale(1.4, 1.4) rotateZ(15deg) translate(0vw, -2vw);
}

#participationicon{

}

#eventnavholder{
    display: flex;
    flex-direction: column;
    margin: 0em 2em;
}

#prevEvent{
}

#nextEvent{
}

.navbutton{
    transition: filter 0.15s, transform 0.15s;
    height: 2.3em;
    margin: auto;
    vertical-align: middle;
}

#prevEvent .navbutton:active{
    filter: opacity(0.5);
    transform: scale(1.5,1.5);
}

#nextEvent .navbutton:active{
    filter: opacity(0.5);
    transform: scale(-1.5,1.5);
}

.event__eventdetails {
    background-color: var(--bg-c);
}

#place{
    display: inline;
    font-size: 100%;
}

#info{
    display: flex;
    flex-direction: column;
    background-color: var(--bg-a);
    text-align: left;
    align-items: left;
}



#info .details {
    font-size: 100%;
    padding: 0.5em 1.5em 0.5em 1.5em;
}

#date{
    font-size: 110%;
    background-color: var(--clear);
}

.eventdetailbutton {
    display: inline-block;

    font-size: 100%;
    background-color: var(--bg-c);
    padding: 0.5vw 5vw;
}

#synctobtn {
    width: 40%;
    margin-top: 1.5vh;
}

#submitter {
    display: flex;
    justify-content: center;
    margin-bottom: 0.5em;

}

.eventdetailsection {
    margin: 0em auto;
    max-width: 60rem;
    width: 95%;
}

#participation {
    padding: 1.4em 0em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#participationstatus {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 110%;
    margin: 0em 0em 1em 0em;
}

#participationstatus_text {
    margin-left: 1.2em;
}

#participationbuttonsection {
    display: flex;
    justify-content: center;    
    width: 95%;
    max-width: 50rem;
}



.participationbutton {
    display: inline-flex;
    transition: all 0.25s;
    background-color: var(--bg2-a);
    box-shadow: 0em 0em 0.2em 0.1em var(--shadow);
    padding: 0.5em 0.5em;
    font-size: 110%;
    width: 45%;
    border-left: 0.3em solid var(--accent);
    justify-content: center;
    align-items: center;
}

#part_notgoing {

}

#part_interested {

}

#part_going {

}


#participation .selected {
    border: 0.09em solid var(--accent);
    border-left: 0.3em solid var(--accent);
    background-color: var(--bg2-a);
}

#participation #part_going.selected {
    border: 0.09em solid var(--accent2);
    border-left: 0.3em solid var(--accent2);
    background-color: var(--bg2-a);
}

#participation #part_notgoing.selected {
    background-color: var(--bg2-a);
    border: none;
    border-left: 0.3em solid var(--accent);
}

#counts {
    display: flex;
    justify-content: center;
    gap: 1rem;
    padding: 0.5em 0em;
}

#counts div {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    height: 100%;
    width: 45%;
}

#mydatadivider {
    margin: 0.2em 0em 0.8em 0em;
}


#volunteercheckbox {

}

#volunteertoggle {

}

.weathersponsortext {
    font-size: 0.8em;
}

.participationcountimg {
    height: 3rem;
    width: 3rem;
    padding: 0.5vw;
    margin: auto 0.5vw;
}

#eventresults{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#lengthsentrytitle {
    margin: 1.2em 0em 0em 0em;
}

#eventlink_text {
    background-color: var(--bg-a);
    color: var(--accent);
    border: none;
    font-style: italic;
    font-size: 90%;
}

.volunteerdetails {
    display: flex;
    justify-content: space-evenly;
    height: 3em;
    align-items: center;
}

#volunteercount{
    display: flex;
    align-items: center;
}

#volunteercountcontainer{
    display: flex;
    width: 35%;
}

#volunteerswitchcontainer{
    display: flex;
    width: 50%;
}

#volunteerimg {
    height: 2.5em;
}

#tagimages {
    display: flex;
    justify-content: space-evenly;
    padding: 0.5em 1em;
}

.tagimage {
    height: 4em;
    box-shadow: 0em 0em 0.2em 0.1em var(--shadow);
    background-color: var(--bg-b);
    margin: 0em 0.5em;
    border-radius: 2.5em;
    border: solid 0.1em var(--accent);
}

#externalbuttons {
    margin: 2em 0em;
}

#tool_edit .c_roundbutton img {
    transform: rotateZ(45deg);
}
