.headerContainer { display: flex; flex-direction: row; padding-bottom: calc(24rem / 16); border-bottom: calc(1rem / 16) solid var(--purple-2); margin-bottom: calc(46rem / 16); } .nav { display: none; } .headerTextContainer { margin: auto 0 0 0; } .header { color: var(--purple-2); font-size: calc(48rem / 16); margin: 0 calc(53rem / 16) 0 0; } .subheading { color: var(--purple-2); font-size: calc(36rem / 16); font-weight: 600; padding-bottom: calc(22rem / 16); border-bottom: calc(1rem / 16) solid var(--purple-2); margin-bottom: calc(46rem / 16); } .codey { width: calc(360rem / 16); } .execsMobile { display: none; } .reset_button { /* reset default button styling */ background: transparent; border: 0px solid transparent; font-family: inherit; line-height: inherit; } .execButton { display: flex; justify-content: center; } .popup_background { position: fixed; background-color: var(--navbar-gray); width: 100%; height: 100%; top: 0; left: 0; } .popup_container { position: fixed; background-color: var(--off-white); padding: calc(20rem / 16) calc(40rem / 16); top: 0; left: 0; } .popup_content { display: flex; flex-direction: column; } .close { float: right; } .exec { display: flex; flex-direction: column; align-items: center; } .exec > p { font-size: calc(14rem / 16); } .execsDesktop { display: flex; flex-direction: column; gap: calc(26rem / 16); margin-bottom: calc(86rem / 16); } .members { display: grid; grid-template-columns: repeat(auto-fill, minmax(calc(100rem / 16), 1fr)); row-gap: calc(43rem / 16); column-gap: calc(53rem / 16); justify-items: center; } .members:last-child { margin-bottom: calc(86rem / 16); } .elections { margin-top: 6rem; } .electionSubheading { color: var(--blue-2); font-size: calc(36rem / 16); font-weight: 600; } .elections > p { margin: 0; line-height: 1.875; } @media only screen and (max-width: calc(768rem / 16)) { .headerContainer { flex-direction: column-reverse; padding-bottom: 1rem; } .nav { margin-top: calc(24rem / 16); margin-bottom: calc(46rem / 16); display: flex; flex-direction: column; justify-content: center; align-items: center; } .codey { width: calc(140rem / 16); align-self: center; } .header { font-size: calc(24rem / 16); margin: calc(10rem / 16) 0 0 0; text-align: center; } .subheading { font-size: calc(24rem / 16); padding-bottom: calc(15rem / 16); } .execsMobile { display: grid; grid-template-columns: repeat(auto-fill, minmax(calc(130rem / 16), 1fr)); row-gap: calc(24rem / 16); column-gap: calc(24rem / 16); } .execsDesktop { display: none; } .members { row-gap: calc(24rem / 16); column-gap: calc(1rem / 16); } .elections { padding: 2rem; } .electionSubheading { font-size: calc(24rem / 16); } }