:root {
  /*  color names  */
  --black: #000000;
  --softblack: #444444;
  --white: #ffffff;
  --offwhite: #f0f0f0;
  --verylightgray: #e0e0e0;
  --darkred: #8b0000;
  --crimson: #bd092d;
  --red: red;
  --bg-gray: var(--verylightgray);
  --mrwblue-1: darkblue;
  --mrwblue-2: blue;
  --mrwred-1: var(--red);
  --mrwred-2: var(--crimson);
  --mrwred-3: var(--darkred);
}

html[color-scheme=scheme1] {
  --navbar-bg-color: var(--mrwblue-1);
  --navbar-bg-hover: var(--mrwred-2);
  --main-bg-color: var(--offwhite);
  --main-bg-color2: var(--bg-gray);
  --font-color-1: var(--black);
  --font-color-2: var(--white);
  --font-color-blue-1: var(--mrwblue-1);
  --font-color-blue-2: var(--mrwblue-2);
  --font-color-red-1: var(--mrwred-3);
  --font-color-red-2: var(--mrwred-1);
  --std-border-color: var(--mrwblue-1);
  --alt-border-color: darkgreen;
  --box-shadow-color-1: var(--mrwblue-2);
  --box-shadow-color-2: green;
  --btn-press-color-1: var(--mrwred-2);
  --btn-press-color-2: darkgreen;
  --btn-submit-bg: white;
  --btn-submit-fg: green;
  --btn-submit-bg-hover: green;
  --btn-submit-fg-hover: white;
  --btn-back-bg: white;
  --btn-back-fg: blue;
  --btn-back-bg-hover: blue;
  --btn-back-fg-hover: white;
}

html[color-scheme=scheme2] {
  --navbar-bg-color: var(--mrwblue-2);
  --btn-submit-bg: blue;
  --btn-submit-fg: white;
  --btn-submit-bg-hover: white;
  --btn-submit-fg-hover: blue;
  --btn-back-bg: white;
  --btn-back-fg: green;
  --btn-back-bg-hover: green;
  --btn-back-fg-hover: white;
}

:root {
  --font-size-100: clamp(1.9rem, 20vw / 3, 10.0rem);
  --font-size-90: clamp(1.8rem, 6vw , 9.0rem);
  --font-size-80: clamp(1.7rem, 16vw / 3, 8.0rem);
  --font-size-70: clamp(1.7rem, 14vw / 3, 7.0rem);
  --font-size-60: clamp(1.6rem, 4vw , 6.0rem);
  --font-size-50: clamp(1.6rem, 10vw / 3, 5.0rem);
  --font-size-45: clamp(1.5rem, 9vw / 3, 4.5rem);
  --font-size-40: clamp(1.5rem, 8vw / 3, 4.0rem);
  --font-size-35: clamp(1.4rem, 7vw / 3, 3.5rem);
  --font-size-30: clamp(1.4rem, 2vw , 3.0rem);
  --font-size-25: clamp(1.3rem, 5vw / 3, 2.5rem);
  --font-size-20: clamp(1.3rem, 4vw / 3, 2.0rem);
  --font-size-15: clamp(1.2rem, 1vw , 1.5rem);
  --font-size-10: 1.0rem;
  --h1-font-size: var(--font-size-50);
  --h2-font-size: var(--font-size-40);
  --h3-font-size: var(--font-size-30);
  --h4-font-size: var(--font-size-25);
  --h5-font-size: var(--font-size-20);
  --h6-font-size: var(--font-size-15);
}

h1 {
  font-size: var(--h1-font-size);
  font-weight: 400;
}

h2 {
  font-size: var(--h2-font-size);
  font-weight: 400;
}

h3 {
  font-size: var(--h3-font-size);
  font-weight: 400;
}

h4 {
  font-size: var(--h4-font-size);
  font-weight: 400;
}

h5 {
  font-size: var(--h5-font-size);
  font-weight: 400;
}

h6 {
  font-size: var(--h6-font-size);
  font-weight: 400;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  font-size: 10px;
}

body {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  background-color: var(--main-bg-color);
}

h1 {
  color: var(--darkred);
  text-align: center;
}

h2 {
  text-align: center;
}

.centered {
  text-align: center;
}

.tiny-text {
  font-size: 1.2rem;
}

.mab-italics {
  font-style: italic;
  font-weight: 600;
}

.mab-semibold {
  font-weight: 600;
}

.main-text-color {
  color: var(--font-color-blue-1);
}

.mabfa {
  color: offwhite;
  font-size: var(--font-size-20);
}

.mabfa:hover {
  color: rgb(255, 0, 40);
}

.propercaps {
  font-family: "Vollkorn SC", serif;
}

.red-star {
  color: var(--darkred);
}

.navbar {
  background-color: var(--navbar-bg-color);
  height: 5rem;
  position: sticky;
  top: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.navbar__logo--img {
  margin: var(--font-size-10);
  height: var(--font-size-40);
}
.navbar__tags {
  width: 80%;
  display: flex;
  justify-content: space-between;
  justify-content: end;
  margin-right: var(--font-size-10);
}
.navbar__tags a {
  transition: all 0.25s ease-in;
  text-decoration: none;
  color: white;
  padding: var(--font-size-10) var(--font-size-20);
  font-size: var(--font-size-25);
}
.navbar__tags a:last-child {
  margin-right: var(--font-size-10);
}
.navbar__tags a:hover {
  transform: scaleX(1.1);
  background-image: linear-gradient(to right, var(--mrwred-3), var(--mrwred-1), var(--mrwred-3));
}
.navbar__tags--Info {
  display: flex;
  flex-direction: column;
}
.navbar__tags--Info__dropdown {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  margin-top: 1rem;
  left: 0;
  display: none;
}
.navbar__tags--Info__dropdown-1 {
  display: flex;
  flex-direction: column;
}
.navbar__tags--Info:hover > .navbar__tags--Info__dropdown {
  visibility: visible;
  opacity: 1;
  display: block;
  background-color: peachpuff;
}
.navbar__social {
  align-self: center;
}

.intro {
  padding: var(--font-size-20) 0;
  display: grid;
  gap: var(--font-size-20);
  justify-content: center;
}
.intro .separator {
  margin: 0 auto;
  width: 100%;
  border: 1px solid var(--font-color-blue-1);
}
.intro__mrw-title {
  background-image: linear-gradient(to right, var(--mrwred-3), var(--mrwred-1), var(--mrwred-3));
  font-size: var(--font-size-40);
  font-family: "Vollkorn SC", serif;
  border-radius: 5px;
  color: var(--font-color-2);
  text-align: center;
  padding: var(--font-size-20);
  letter-spacing: 1vw;
}
.intro__description {
  font-size: var(--font-size-30);
  color: var(--font-color-blue-1);
  color: white;
  border: 2px solid var(--verylightgray);
  border-radius: 5px;
  width: 80vw;
  padding: var(--font-size-30);
  margin: var(--font-size-10) auto;
}

.star {
  background-image: url("../images/woodenstar.jpg");
  background-size: cover;
  background-attachment: fixed;
  overflow: hidden;
}

.darkened {
  background-color: rgba(80, 80, 80, 0.6);
  background-blend-mode: darken;
}

.meeting {
  background-color: var(--main-bg-color);
  margin: 0 2vw;
  border-radius: 5px;
  color: var(--font-color-blue-1);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(4, auto);
  grid-template-areas: " info info info officials" " pic  text text officials" " pic  text text officials" "  .   text text officials";
  gap: 0 var(--font-size-10);
}
.meeting__info {
  grid-area: info;
}
.meeting__speaker-pic {
  grid-area: pic;
}
.meeting__officials {
  grid-area: officials;
}
.meeting__text {
  grid-area: text;
}
.meeting__info {
  margin: var(--font-size-20) 0;
  text-align: center;
}
.meeting__info h2 {
  padding-bottom: var(--font-size-10);
}
.meeting__speaker-pic {
  padding: var(--font-size-10) 0 var(--font-size-10) var(--font-size-30);
}
.meeting__speaker-pic img, .meeting__speaker-pic video {
  display: inline-block;
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 5px;
}
.meeting__speaker-pic__addr {
  font-size: var(--font-size-20);
}
.meeting__speaker-pic__addr address {
  font-size: var(--font-size-15);
  padding-left: var(--font-size-25);
}
.meeting__text h1, .meeting__text h2, .meeting__text h4 {
  text-align: center;
}
.meeting__text h1, .meeting__text h2 {
  color: var(--crimson);
  font-weight: 700;
  font-family: "Times New Roman", Times, serif;
}
.meeting__text--body {
  margin: var(--font-size-20) var(--font-size-40);
  font-size: var(--font-size-20);
  line-height: 1.25;
}
.meeting__text--body-text p:not(:first-child) {
  padding-top: var(--font-size-20);
}
.meeting__text--body-text ul {
  padding-left: var(--font-size-50);
}
.meeting__text--body__show {
  padding: 2rem;
}
.meeting__text--body__show hr {
  margin: 2rem;
  color: red;
}
.meeting__text--body__show div {
  margin-top: 2rem;
}
.meeting__text--body__show div p {
  padding-top: 1rem;
}
.meeting__text--body__show div ul {
  padding-left: 4rem;
  list-style-type: none;
}
.meeting__text h3 {
  color: var(--font-color-red-1);
  padding-bottom: var(--font-size-10);
}
.meeting__text--info {
  padding-top: var(--font-size-20);
  display: grid;
  grid-auto-columns: 42% 1fr;
  grid-template-areas: "header header" "title1 data1" "title2 data2" "title3 data3" "   .   data4" "   .   data5";
}
.meeting__text--info .title1 {
  grid-area: title1;
}
.meeting__text--info .title2 {
  grid-area: title2;
}
.meeting__text--info .title3 {
  grid-area: title3;
}
.meeting__text--info .data1 {
  grid-area: data1;
}
.meeting__text--info .data2 {
  grid-area: data2;
}
.meeting__text--info .data3 {
  grid-area: data3;
}
.meeting__text--info .data4 {
  grid-area: data4;
}
.meeting__text--info .data5 {
  grid-area: data5;
}
.meeting__text--info-header {
  grid-area: header;
  justify-self: center;
}
.meeting__text--info-title {
  justify-self: end;
  padding-right: 0.5em;
  font-size: var(--font-size-20);
  font-weight: 600;
}
.meeting__text--info-data {
  padding-right: 1em;
  font-size: var(--font-size-20);
}
.meeting__text--info-address {
  padding-left: 1em;
  font-size: var(--font-size-20);
}
.meeting__text .see-map {
  margin: 1em;
  font-size: var(--font-size-20);
}
.meeting__officials {
  padding: var(--font-size-20) 0 var(--font-size-30) var(--font-size-20);
  border-left: 2px solid var(--std-border-color);
  display: grid;
  gap: var(--font-size-20);
  grid-template-areas: "info" "sponsors" "others";
  font-size: var(--font-size-20);
}
.meeting__officials--info {
  grid-area: info;
}
.meeting__officials--sponsors {
  grid-area: sponsors;
}
.meeting__officials--others {
  grid-area: others;
}
.meeting__officials h4 {
  color: var(--font-color-red-1);
  margin-bottom: 2rem;
}
.meeting__officials--sponsors hr {
  margin: 2rem;
  color: var(--crimson);
}
.meeting__officials--sponsors-title {
  color: var(--mrwblue-1);
}
.meeting__officials--sponsors-men, .meeting__officials--sponsors-women {
  padding: 1rem;
  color: var(--darkred);
}
.meeting__officials--sponsors-men address, .meeting__officials--sponsors-women address {
  padding-left: 2rem;
  color: var(--mrwblue-1);
}
.meeting__officials--others {
  margin-top: var(--font-size-30);
  margin-right: var(--font-size-20);
  border-top: 2px solid var(--crimson);
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--font-color-blue-1);
}
.meeting__officials--others h5 {
  margin-top: var(--font-size-20);
}
.meeting__officials--others__links {
  margin-top: var(--font-size-20);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.yr50 {
  color: var(--darkred);
  font-weight: 600;
}

.fs-flyer {
  border-radius: 5px;
  margin: 2rem 0;
  border: var(--std-border-color) solid 2px;
  box-shadow: var(--box-shadow-color-1) 0.3rem 0.2rem 2rem;
  transition: all 0.5s ease-in-out;
}

.fs-flyer:hover {
  border: var(--alt-border-color) solid 2px;
  box-shadow: var(--box-shadow-color-2) 0.3rem 0.2rem 5rem;
  transform: scale(1.02) translateX(0.5vw);
}

.press-img {
  padding-bottom: 1rem;
  font-size: var(--font-size-15);
  text-align: center;
  color: var(--btn-press-color-1);
}

.fs-flyer:hover .press-img {
  color: var(--btn-press-color-2);
}

.map {
  background-color: var(--verylightgray);
  border-radius: 5px;
  padding: var(--font-size-20);
  margin: 2vw;
  display: grid;
  gap: 1vh;
  grid-auto-columns: 1fr;
  grid-template-areas: "title title title" "map map text";
}
@media screen and (max-width: 900px) {
  .map {
    grid-template-areas: "title title" "map map " "text text";
  }
}
.map__header {
  grid-area: title;
  display: flex;
  justify-content: center;
  color: var(--crimson);
}
.map__location {
  grid-area: map;
  overflow: hidden;
  padding-top: 56.25%; /* 16:9 */
  position: relative;
}
.map__location iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.map__info {
  grid-area: text;
  padding-top: var(--font-size-40);
}
.map__info--text {
  padding-left: var(--font-size-20);
}
.map__info--text h4 {
  color: var(--crimson);
}
.map__info--text div {
  font-size: 1.75rem;
  margin-top: var(--font-size-10);
  padding-left: var(--font-size-20);
}

@media screen and (max-width: 600px) {
  .meeting {
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas: "info info info" "pic  text text" "pic  text text" "pic  text text" " .   officials sponsors";
  }
}
@media screen and (max-width: 500px) {
  .meeting {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "info info" "text text" "text text" "text text" "pic  pic" "officials sponsors";
  }
}

@media screen and (max-width: 500px) {
  .intro__description {
    display: none;
  }
}

.fashion-show {
  display: grid;
  grid-auto-columns: 40% 1fr;
  gap: var(--font-size-20) 2%;
  grid-template-areas: "title title" "flyer tickets";
}
.fashion-show__title {
  grid-area: title;
}
.fashion-show__flyer {
  grid-area: flyer;
}
.fashion-show__tickets {
  grid-area: tickets;
}
.fashion-show h1, .fashion-show h2 {
  color: var(--crimson);
  font-weight: 700;
  font-family: "Times New Roman", Times, serif;
}
.fashion-show__title {
  background-color: var(--main-bg-color);
  text-align: center;
  justify-self: center;
  margin-top: var(--font-size-20);
  padding-bottom: var(--font-size-20);
  width: 95%;
  border-radius: 5px;
}
.fashion-show__flyer {
  margin-left: 6%;
  border-radius: 5px;
}
.fashion-show__flyer--img img, .fashion-show__flyer--img video {
  width: 100%;
  -o-object-fit: fill;
     object-fit: fill;
  border-radius: 5px;
}
.fashion-show__flyer--img img, .fashion-show__tickets {
  border-radius: 5px;
}

.fashion-show__tickets {
  background-color: rgb(238, 214, 187);
  padding: var(--font-size-20);
  margin: 0 5% var(--font-size-40) 2%;
  font-size: var(--font-size-20);
  color: var(--font-color-blue-1);
  display: grid;
  grid-auto-columns: 1fr;
  grid-template-areas: "title" "form";
}
.fashion-show__tickets--heading {
  grid-area: title;
}
.fashion-show__tickets--form {
  grid-area: form;
}
.fashion-show__tickets--heading {
  display: flex;
  flex-direction: column;
  text-align: center;
  padding-bottom: var(--font-size-15);
  color: var(--mrwblue-1);
}
.fashion-show__tickets--heading a {
  align-self: flex-start;
}
.fashion-show__tickets--heading button {
  padding: 0.5rem;
  background-color: var(--darkred);
  background-color: var(--font-color-blue-1);
  color: white;
  border-radius: 5px;
}
.fashion-show__tickets--form {
  display: grid;
  grid-auto-columns: 1fr;
  gap: var(--font-size-20);
  grid-template-areas: "info" "address" "buttons" "paypal";
}
.fashion-show__tickets--form__info {
  grid-area: info;
}
.fashion-show__tickets--form__address {
  grid-area: address;
}
.fashion-show__tickets--form__buttons {
  grid-area: buttons;
}
.fashion-show__tickets--form__paypal {
  grid-area: paypal;
}
.fashion-show__tickets--form__info {
  display: grid;
  gap: 0.2rem 0.5rem;
  grid-template-columns: 20% 1fr;
  grid-template-areas: "name-label    name-data" "email-label   email-data" "phone-label   phone-data" "tickets-label tickets-data" "cost-label    cost-data" "guests-label  guests-data";
}
.fashion-show__tickets--form__info--name-label {
  grid-area: name-label;
}
.fashion-show__tickets--form__info--name-data {
  grid-area: name-data;
}
.fashion-show__tickets--form__info--email-label {
  grid-area: email-label;
}
.fashion-show__tickets--form__info--email-data {
  grid-area: email-data;
}
.fashion-show__tickets--form__info--phone-label {
  grid-area: phone-label;
}
.fashion-show__tickets--form__info--phone-data {
  grid-area: phone-data;
}
.fashion-show__tickets--form__info--tickets-label {
  grid-area: tickets-label;
}
.fashion-show__tickets--form__info--tickets-data {
  grid-area: tickets-data;
}
.fashion-show__tickets--form__info--cost-label {
  grid-area: cost-label;
}
.fashion-show__tickets--form__info--cost-data {
  grid-area: cost-data;
}
.fashion-show__tickets--form__info--guests-label {
  grid-area: guests-label;
}
.fashion-show__tickets--form__info--guests-data {
  grid-area: guests-data;
}
.fashion-show__tickets--form__info--name-data {
  display: grid;
  grid-auto-columns: 1fr 1fr;
  gap: 0.25rem;
  grid-template-areas: "firstname lastname";
}
.fashion-show__tickets--form__info--name-data #lname {
  grid-area: lastname;
}
.fashion-show__tickets--form__info--name-data #fname {
  grid-area: firstname;
}
.fashion-show__tickets--form__info--tickets-data {
  display: grid;
  grid-auto-columns: 25% 1fr;
  -moz-column-gap: var(--font-size-50);
       column-gap: var(--font-size-50);
  grid-template-areas: "number surcharge";
}
.fashion-show__tickets--form__info--tickets-data input {
  grid-area: number;
}
.fashion-show__tickets--form__info--tickets-data label {
  grid-area: surcharge;
}
.fashion-show__tickets--form__info--name-data input, .fashion-show__tickets--form__info--guests-data textarea {
  text-transform: capitalize;
}
.fashion-show__tickets--form__info--email-data {
  display: flex;
}
.fashion-show__tickets--form__info--email-data input {
  flex: 1;
}
.fashion-show__tickets--form__info--guests-label-txt, .fashion-show__tickets--form__info #lbl_charge {
  font-size: var(--font-size-15);
}
.fashion-show__tickets--form__address {
  display: grid;
  gap: 0.2rem 0.5rem;
  grid-template-columns: 20% 1fr;
  grid-template-areas: "notice         notice" "addr-label     addr-data" "city-label     city-data" "state-label    state-data" "zipcode-label  zipcode-data" "job-label      job-data" "employer-label employer-data" "required       required" "warning        warning";
}
.fashion-show__tickets--form__address--addr-label {
  grid-area: addr-label;
}
.fashion-show__tickets--form__address--addr-data {
  grid-area: addr-data;
}
.fashion-show__tickets--form__address--city-label {
  grid-area: city-label;
}
.fashion-show__tickets--form__address--city-data {
  grid-area: city-data;
}
.fashion-show__tickets--form__address--state-label {
  grid-area: state-label;
}
.fashion-show__tickets--form__address--state-data {
  grid-area: state-data;
}
.fashion-show__tickets--form__address--zipcode-label {
  grid-area: zipcode-label;
}
.fashion-show__tickets--form__address--zipcode-data {
  grid-area: zipcode-data;
}
.fashion-show__tickets--form__address--job-label {
  grid-area: job-label;
}
.fashion-show__tickets--form__address--job-data {
  grid-area: job-data;
}
.fashion-show__tickets--form__address--employer-label {
  grid-area: employer-label;
}
.fashion-show__tickets--form__address--employer-data {
  grid-area: employer-data;
}
.fashion-show__tickets--form__address--required {
  grid-area: required;
}
.fashion-show__tickets--form__address--warning {
  grid-area: warning;
}
.fashion-show__tickets--form__address--notice {
  grid-area: notice;
  font-size: var(--font-size-20);
  font-weight: 700;
  font-style: italic;
  text-align: center;
  padding: 0.5rem 0;
}
.fashion-show__tickets--form__address--addr-data input, .fashion-show__tickets--form__address--city-data input, .fashion-show__tickets--form__address--job-data input, .fashion-show__tickets--form__address--employer-data input {
  text-transform: capitalize;
}
.fashion-show__tickets--form__address--state-data input {
  text-transform: uppercase;
}
.fashion-show__tickets--form__address--addr-data, .fashion-show__tickets--form__address--city-data, .fashion-show__tickets--form__address--state-data, .fashion-show__tickets--form__address--zipcode-data, .fashion-show__tickets--form__address--job-data, .fashion-show__tickets--form__address--employer-data {
  display: flex;
}
.fashion-show__tickets--form__address #address, .fashion-show__tickets--form__address #city, .fashion-show__tickets--form__address #state, .fashion-show__tickets--form__address #zipcode, .fashion-show__tickets--form__address #occupation, .fashion-show__tickets--form__address #employer {
  flex: 1;
}
.fashion-show__tickets--form__address--required {
  font-size: var(--font-size-20);
  color: var(--crimson);
}
.fashion-show__tickets--form__buttons {
  display: grid;
  grid-auto-columns: min-content;
  -moz-column-gap: var(--font-size-50);
       column-gap: var(--font-size-50);
  grid-template-areas: "submit exit";
}
.fashion-show__tickets--form__buttons #submitbtn, .fashion-show__tickets--form__buttons #backbtn {
  font-family: "Pridi", serif;
  font-weight: 200;
  border-radius: 5px;
  padding: 0.25rem var(--font-size-20);
  font-size: var(--font-size-30);
  transition: background-color 0.5s, color 0.5s;
}
.fashion-show__tickets--form__buttons #submitbtn {
  grid-area: submit;
  background-color: var(--btn-submit-bg);
  color: var(--btn-submit-fg);
}
.fashion-show__tickets--form__buttons #submitbtn:hover {
  background-color: var(--btn-submit-bg-hover);
  color: var(--btn-submit-fg-hover);
}
.fashion-show__tickets--form__buttons #backbtn {
  grid-area: exit;
  background-color: var(--btn-back-bg);
  color: var(--btn-back-fg);
}
.fashion-show__tickets--form__buttons #backbtn:hover {
  background-color: var(--btn-back-bg-hover);
  color: var(--btn-back-fg-hover);
}
.fashion-show__tickets--form__paypal {
  margin-top: var(--font-size-30);
  width: clamp(200px, 50%, 500px);
}
.fashion-show__tickets--form__paypal--form__buttons {
  text-align: center;
}

.box-float {
  float: left;
  margin-right: 15px;
  border-radius: 5px;
  margin: 2rem;
  height: 15rem;
  width: 15rem;
}

.toggle-group {
  display: flex;
  gap: 0.5rem;
}

.toggle-option {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  background-color: #eee;
  border: 2px solid #ccc;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  cursor: pointer;
  font-weight: bold;
  transition: background-color 0.3s, border-color 0.3s;
}

.toggle-option:checked {
  background-color: #0078D7;
  color: white;
  border-color: #005A9E;
}

#selectedOption {
  margin-top: 1rem;
  font-weight: bold;
  width: 100px;
}

.sponsors {
  font-size: 1.5rem;
  display: grid;
  grid-auto-columns: 47% 1fr;
  gap: var(--font-size-20) 2%;
  grid-template-areas: "title title" "flyer tickets";
}
.sponsors__title {
  grid-area: title;
}
.sponsors__flyer {
  grid-area: flyer;
}
.sponsors__tickets {
  grid-area: tickets;
}
.sponsors h1, .sponsors h2 {
  color: var(--crimson);
  font-weight: 700;
  font-family: "Times New Roman", Times, serif;
}
.sponsors__title {
  background-color: var(--main-bg-color);
  text-align: center;
  justify-self: center;
  margin-top: var(--font-size-20);
  padding-bottom: var(--font-size-20);
  width: 95%;
  border-radius: 5px;
}
.sponsors__flyer {
  margin-left: 6%;
  margin-bottom: var(--font-size-40);
  border-radius: 5px;
  background-color: white;
  color: var(--mrwblue-1);
  font-family: Georgia, "Times New Roman", Times, serif;
}
.sponsors__flyer--img img, .sponsors__flyer--img video {
  width: 100%;
  -o-object-fit: fill;
     object-fit: fill;
  border-radius: 5px;
}
.sponsors__flyer--blurb {
  padding: 2rem;
}
.sponsors__flyer--blurb__intro {
  font-weight: bold;
}
.sponsors__flyer--blurb__info {
  margin-top: var(--font-size-20);
}
.sponsors__flyer--blurb__50yr {
  color: var(--crimson);
  margin-top: var(--font-size-20);
}
.sponsors__flyer--blurb ul {
  margin-left: 5rem;
}
.sponsors__flyer--blurb__addr {
  padding-left: var(--font-size-20);
}
.sponsors__flyer--blurb__levels {
  margin-left: 2rem;
  display: grid;
  grid-template-columns: 1fr 1fr 2fr;
}
.sponsors__flyer--img img, .sponsors__tickets {
  border-radius: 5px;
}

.sponsors__tickets {
  background-color: rgb(213, 208, 240);
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  padding: var(--font-size-20);
  margin: 0 5% var(--font-size-40) 2%;
  font-size: var(--font-size-20);
  color: var(--font-color-blue-1);
  display: flex;
  flex-direction: column;
}
.sponsors__tickets--heading {
  padding: 2rem 0;
  text-align: center;
}
.sponsors__tickets--form {
  display: grid;
  grid-auto-columns: 1fr;
  gap: var(--font-size-20);
  grid-template-areas: "info" "address" "buttons" "paypal";
}
.sponsors__tickets--form__info {
  grid-area: info;
}
.sponsors__tickets--form__address {
  grid-area: address;
}
.sponsors__tickets--form__buttons {
  grid-area: buttons;
}
.sponsors__tickets--form__paypal {
  grid-area: paypal;
}
.sponsors__tickets--form__info {
  display: grid;
  gap: 0.2rem 0.5rem;
  grid-template-columns: 20% 1fr;
  grid-template-areas: "name-label    name-data" "email-label   email-data" "phone-label   phone-data" "tickets-label tickets-data" "cost-label    cost-data" "guests-label  guests-data";
}
.sponsors__tickets--form__info--name-label {
  grid-area: name-label;
}
.sponsors__tickets--form__info--name-data {
  grid-area: name-data;
}
.sponsors__tickets--form__info--email-label {
  grid-area: email-label;
}
.sponsors__tickets--form__info--email-data {
  grid-area: email-data;
}
.sponsors__tickets--form__info--phone-label {
  grid-area: phone-label;
}
.sponsors__tickets--form__info--phone-data {
  grid-area: phone-data;
}
.sponsors__tickets--form__info--tickets-label {
  grid-area: tickets-label;
}
.sponsors__tickets--form__info--tickets-data {
  grid-area: tickets-data;
}
.sponsors__tickets--form__info--cost-label {
  grid-area: cost-label;
}
.sponsors__tickets--form__info--cost-data {
  grid-area: cost-data;
}
.sponsors__tickets--form__info--guests-label {
  grid-area: guests-label;
}
.sponsors__tickets--form__info--guests-data {
  grid-area: guests-data;
}
.sponsors__tickets--form__info--name-data {
  display: grid;
  grid-auto-columns: 1fr 1fr;
  gap: 0.25rem;
  grid-template-areas: "firstname lastname";
}
.sponsors__tickets--form__info--name-data #lname {
  grid-area: lastname;
}
.sponsors__tickets--form__info--name-data #fname {
  grid-area: firstname;
}
.sponsors__tickets--form__info--tickets-data {
  display: flex;
  flex-direction: column;
  padding: 1rem 3rem;
}
.sponsors__tickets--form__info--tickets-data__level {
  display: flex;
  justify-content: space-between;
}
.sponsors__tickets--form__info--name-data input, .sponsors__tickets--form__info--guests-data textarea {
  text-transform: capitalize;
}
.sponsors__tickets--form__info--email-data {
  display: flex;
}
.sponsors__tickets--form__info--email-data input {
  flex: 1;
}
.sponsors__tickets--form__info--guests-label-txt, .sponsors__tickets--form__info #lbl_charge {
  font-size: var(--font-size-15);
}
.sponsors__tickets--form__address {
  display: grid;
  gap: 0.2rem 0.5rem;
  grid-template-columns: 20% 1fr;
  grid-template-areas: "notice         notice" "addr-label     addr-data" "city-label     city-data" "state-label    state-data" "zipcode-label  zipcode-data" "job-label      job-data" "employer-label employer-data" "required       required" "warning        warning";
}
.sponsors__tickets--form__address--addr-label {
  grid-area: addr-label;
}
.sponsors__tickets--form__address--addr-data {
  grid-area: addr-data;
}
.sponsors__tickets--form__address--city-label {
  grid-area: city-label;
}
.sponsors__tickets--form__address--city-data {
  grid-area: city-data;
}
.sponsors__tickets--form__address--state-label {
  grid-area: state-label;
}
.sponsors__tickets--form__address--state-data {
  grid-area: state-data;
}
.sponsors__tickets--form__address--zipcode-label {
  grid-area: zipcode-label;
}
.sponsors__tickets--form__address--zipcode-data {
  grid-area: zipcode-data;
}
.sponsors__tickets--form__address--job-label {
  grid-area: job-label;
}
.sponsors__tickets--form__address--job-data {
  grid-area: job-data;
}
.sponsors__tickets--form__address--employer-label {
  grid-area: employer-label;
}
.sponsors__tickets--form__address--employer-data {
  grid-area: employer-data;
}
.sponsors__tickets--form__address--required {
  grid-area: required;
}
.sponsors__tickets--form__address--warning {
  grid-area: warning;
}
.sponsors__tickets--form__address--notice {
  grid-area: notice;
  font-size: var(--font-size-20);
  font-weight: 700;
  font-style: italic;
  text-align: center;
  padding: 0.5rem 0;
}
.sponsors__tickets--form__address--addr-data input, .sponsors__tickets--form__address--city-data input, .sponsors__tickets--form__address--job-data input, .sponsors__tickets--form__address--employer-data input {
  text-transform: capitalize;
}
.sponsors__tickets--form__address--state-data input {
  text-transform: uppercase;
}
.sponsors__tickets--form__address--addr-data, .sponsors__tickets--form__address--city-data, .sponsors__tickets--form__address--state-data, .sponsors__tickets--form__address--zipcode-data, .sponsors__tickets--form__address--job-data, .sponsors__tickets--form__address--employer-data {
  display: flex;
}
.sponsors__tickets--form__address #address, .sponsors__tickets--form__address #city, .sponsors__tickets--form__address #state, .sponsors__tickets--form__address #zipcode, .sponsors__tickets--form__address #occupation, .sponsors__tickets--form__address #employer {
  flex: 1;
}
.sponsors__tickets--form__address--required {
  font-size: var(--font-size-20);
  color: var(--crimson);
}
.sponsors__tickets--form__buttons {
  display: grid;
  grid-auto-columns: min-content;
  -moz-column-gap: var(--font-size-50);
       column-gap: var(--font-size-50);
  grid-template-areas: "submit exit";
}
.sponsors__tickets--form__buttons #submitbtn, .sponsors__tickets--form__buttons #backbtn {
  font-family: "Pridi", serif;
  font-weight: 200;
  border-radius: 5px;
  padding: 0.25rem var(--font-size-20);
  font-size: var(--font-size-30);
  transition: background-color 0.5s, color 0.5s;
}
.sponsors__tickets--form__buttons #submitbtn {
  grid-area: submit;
  background-color: var(--btn-submit-bg);
  color: var(--btn-submit-fg);
}
.sponsors__tickets--form__buttons #submitbtn:hover {
  background-color: var(--btn-submit-bg-hover);
  color: var(--btn-submit-fg-hover);
}
.sponsors__tickets--form__buttons #backbtn {
  grid-area: exit;
  background-color: var(--btn-back-bg);
  color: var(--btn-back-fg);
}
.sponsors__tickets--form__buttons #backbtn:hover {
  background-color: var(--btn-back-bg-hover);
  color: var(--btn-back-fg-hover);
}
.sponsors__tickets--form__paypal {
  margin-top: var(--font-size-30);
  width: clamp(200px, 50%, 500px);
}
.sponsors__tickets--form__paypal--form__buttons {
  text-align: center;
}

@media screen and (max-width: 900px) {
  .fashion-show__tickets--form__info--email-data {
    width: 95%;
  }
  .fashion-show__tickets--form__info--name-data #fname, .fashion-show__tickets--form__info--name-data #lname {
    width: 90%;
  }
}
@media screen and (max-width: 750px) {
  .fashion-show {
    grid-auto-columns: 1fr;
    gap: var(--font-size-20);
    grid-template-areas: "title" "flyer" "tickets";
  }
  .fashion-show__flyer {
    margin: 0 var(--font-size-40);
  }
  .fashion-show__tickets {
    margin: 0 var(--font-size-40);
  }
  .fashion-show__tickets--form__info {
    grid-auto-columns: 15% 1fr;
  }
}
@media screen and (max-width: 500px) {
  .fashion-show__tickets--form__info {
    padding: 1% 3%;
    grid-auto-columns: 15% minmax(0, 1fr);
    gap: 0.25rem;
  }
  .fashion-show__tickets--form__info--name-data {
    grid-template-areas: "firstname" "lastname";
  }
  .fashion-show__tickets--form__info--tickets-data {
    grid-auto-columns: 50%;
    grid-template-areas: "number" "surcharge";
  }
  .fashion-show__tickets--form__info--guests-data textarea {
    width: 90%;
  }
}

@media screen and (max-width: 900px) {
  .sponsors {
    grid-template-columns: 1fr;
    grid-template-areas: "title" "flyer" "tickets";
  }
  .sponsors__flyer, .sponsors__tickets {
    margin-left: 2.5%;
    width: 95%;
  }
}

.register {
  display: grid;
  grid-auto-columns: 10% 1fr 10%;
  grid-template-areas: ". container .";
}
.register__container {
  background-color: var(--main-bg-color2);
  margin: var(--font-size-30) 0;
  border-radius: 5px;
  grid-area: container;
  display: flex;
  flex-direction: column;
}
.register__container--header {
  align-self: center;
  color: var(--darkred);
}
.register__container--text h4 {
  margin: var(--font-size-20) 0 0 var(--font-size-20);
  color: var(--mrwblue-1);
  font-weight: 600;
}
.register__container--text__requirements {
  font-size: var(--font-size-20);
}
.register__container--text__requirements li {
  margin-left: var(--font-size-70);
  padding-bottom: 0.5rem;
}
.register__container--moreinfo {
  margin: var(--font-size-30);
  font-size: var(--font-size-20);
}
.register__container--moreinfo p {
  margin-bottom: var(--font-size-20);
}

.voting {
  display: grid;
  grid-auto-columns: 10% 1fr 10%;
  grid-template-areas: ". container .";
}
.voting__container {
  background-color: var(--main-bg-color2);
  margin: var(--font-size-30) 0;
  border-radius: 5px;
  grid-area: container;
  display: flex;
  flex-direction: column;
}
.voting__container--header {
  align-self: center;
  color: var(--darkred);
}
.voting__container--info h2 {
  margin: var(--font-size-20) 0 0 var(--font-size-20);
  color: var(--mrwblue-1);
}
.voting__container--info__text {
  padding-left: 3rem;
  font-size: var(--font-size-25);
  line-height: var(--font-size-30);
  color: var(--mrwblue-1);
}
.voting__container--info__text p {
  margin-top: 2rem;
}
.voting__container--moreinfo {
  margin: var(--font-size-30);
  font-size: var(--font-size-20);
}
.voting__container--moreinfo h3 {
  color: var(--mrwblue-1);
}
.voting__container--moreinfo-candidates, .voting__container--moreinfo-ballots {
  margin-left: var(--font-size-30);
  font-size: 1.6rem;
}

.about {
  display: grid;
  grid-auto-columns: 5vw 90vw 5vw;
  grid-template-areas: ". container ." ". officers  ." ". gallery   .";
}
.about__intro {
  background-color: var(--main-bg-color2);
  margin: var(--font-size-30) 0;
  border-radius: 5px;
  grid-area: container;
  display: flex;
  flex-direction: column;
}
.about__intro--header {
  align-self: center;
}
.about__intro--info {
  font-size: var(--font-size-30);
  line-height: var(--font-size-40);
  color: var(--mrwblue-1);
}
.about__intro--info p {
  padding: var(--font-size-20);
}
.about__officers {
  grid-area: officers;
  background-color: var(--main-bg-color2);
  background-color: cornflowerblue;
  background-color: transparent;
  margin: var(--font-size-30) 0;
  padding: 1rem;
  border-radius: 5px;
  display: grid;
  grid-auto-columns: 21.5vw;
  gap: var(--font-size-10);
  grid-template-areas: "off1 off2 off3 off4" "off5 off6 off7 off8";
}
.about__officers .officer-pic {
  padding: 1rem;
  width: 100%;
  height: 80%;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 5px;
}
.about__officers--figure {
  background-color: darkgray;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
}
.about__officers .office-1 {
  grid-area: off1;
}
.about__officers .office-2 {
  grid-area: off2;
}
.about__officers .office-3 {
  grid-area: off3;
}
.about__officers .office-4 {
  grid-area: off4;
}
.about__officers .office-5 {
  grid-area: off5;
}
.about__officers .office-6 {
  grid-area: off6;
}
.about__officers .office-7 {
  grid-area: off7;
}
.about__officers .office-8 {
  grid-area: off8;
}
@media screen and (max-width: 500px) {
  .about__officers {
    grid-template-areas: "officers" "names";
  }
}
.about__gallery {
  grid-area: gallery;
  background-color: var(--main-bg-color2);
  margin: var(--font-size-30) 0;
  border-radius: 5px;
  padding: 1rem;
  display: grid;
  grid-template-columns: auto;
  gap: 1rem;
  grid-template-areas: "title title title" "pic1  pic2  pic3 " "pic4  pic5  pic6" "pic7  pic8  pic9" "pic10  pic11  pic12";
}
.about__gallery h2 {
  font-family: "Pridi", serif;
  color: var(--mrwblue-1);
}
.about__gallery--title {
  grid-area: title;
  text-align: center;
}
.about__gallery--photo {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  overflow: hidden;
}
.about__gallery--photo:nth-child(2) {
  height: 300px;
  grid-area: pic1;
  background-image: url("../images/meetings/mrw-1.jpg");
}
.about__gallery--photo:nth-child(3) {
  height: 300px;
  grid-area: pic2;
  background-image: url("../images/meetings/mrw-2.jpg");
}
.about__gallery--photo:nth-child(4) {
  height: 300px;
  grid-area: pic3;
  background-image: url("../images/meetings/mrw-3.jpg");
}
.about__gallery--photo:nth-child(5) {
  height: 300px;
  grid-area: pic4;
  background-image: url("../images/meetings/mrw-4.jpg");
}
.about__gallery--photo:nth-child(6) {
  height: 300px;
  grid-area: pic5;
  background-image: url("../images/meetings/mrw-5.jpg");
}
.about__gallery--photo:nth-child(7) {
  height: 300px;
  grid-area: pic6;
  background-image: url("../images/meetings/mrw-6.jpg");
}
.about__gallery--photo:nth-child(8) {
  height: 300px;
  grid-area: pic7;
  background-image: url("../images/meetings/mrw-7.jpg");
}
.about__gallery--photo:nth-child(9) {
  height: 300px;
  grid-area: pic8;
  background-image: url("../images/meetings/mrw-8.jpg");
}
.about__gallery--photo:nth-child(10) {
  height: 300px;
  grid-area: pic9;
  background-image: url("../images/meetings/mrw-9.jpg");
}
.about__gallery--photo:nth-child(11) {
  height: 300px;
  grid-area: pic10;
  background-image: url("../images/meetings/mrw-10.jpg");
}
.about__gallery--photo:nth-child(12) {
  height: 300px;
  grid-area: pic11;
  background-image: url("../images/meetings/mrw-11.jpg");
}
.about__gallery--photo:nth-child(13) {
  height: 300px;
  grid-area: pic12;
  background-image: url("../images/meetings/mrw-12.jpg");
}
@media screen and (max-width: 750px) {
  .about__gallery {
    grid-template-areas: "title title" "pic1  pic2" "pic3  pic4" "pic5  pic6" "pic7  pic8" "pic9  pic10" "pic11 pic12";
  }
}
@media screen and (max-width: 400px) {
  .about__gallery {
    grid-template-areas: "title" "pic1" "pic2" "pic3" "pic4" "pic5" "pic6" "pic7" "pic8" "pic9" "pic10" "pic11" "pic12";
  }
}

.thumbnail {
  cursor: pointer;
  transition: transform 0.2s;
}

.thumbnail:hover {
  transform: scale(1.05);
}

.main-contact {
  color: var(--mrwblue-1);
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

.contact-wrapper {
  padding-bottom: var(--font-size-30);
  display: grid;
  grid-auto-columns: 5vw 90vw 5vw;
  grid-template-areas: ". container .";
}
.contact-wrapper .contact {
  background-color: var(--main-bg-color2);
  margin: var(--font-size-30) 0;
  border-radius: 5px;
  padding: var(--font-size-25);
  grid-area: container;
}
.contact-wrapper .contact__form {
  margin-top: var(--font-size-20);
  color: var(--mrwblue-1);
  display: grid;
  align-items: stretch;
  gap: 0.2rem 1.5rem;
  grid-template-columns: 15% 1fr;
  grid-template-areas: "name-label     name-data" "email-label    email-data" "subject-label  subject-data" "comment-label  comment-data" "buttons        buttons";
}
.contact-wrapper .contact__form--name-label {
  grid-area: name-label;
}
.contact-wrapper .contact__form--name-data {
  grid-area: name-data;
}
.contact-wrapper .contact__form--email-label {
  grid-area: email-label;
}
.contact-wrapper .contact__form--email-data {
  grid-area: email-data;
}
.contact-wrapper .contact__form--subject-label {
  grid-area: subject-label;
}
.contact-wrapper .contact__form--subject-data {
  grid-area: subject-data;
}
.contact-wrapper .contact__form--comment-label {
  grid-area: comment-label;
}
.contact-wrapper .contact__form--comment-data {
  grid-area: comment-data;
}
.contact-wrapper .contact__form--buttons {
  grid-area: buttons;
}
.contact-wrapper .contact__form label {
  justify-self: end;
  font-size: var(--font-size-25);
}
.contact-wrapper .contact__form input, .contact-wrapper .contact__form textarea {
  color: var(--mrwblue-1);
}
.contact-wrapper .contact__form--buttons {
  margin-top: var(--font-size-30);
  height: var(--font-size-50);
  display: grid;
  gap: var(--font-size-20);
  grid-template-columns: 10% 10% 1fr;
  grid-template-areas: "send exit msg";
}
.contact-wrapper .contact__form--buttons__sendbtn {
  grid-area: send;
}
.contact-wrapper .contact__form--buttons__backbtn {
  grid-area: exit;
}
.contact-wrapper .contact__form--buttons__msg {
  grid-area: msg;
}
.contact-wrapper .contact__form--buttons__sendbtn input, .contact-wrapper .contact__form--buttons__backbtn input {
  width: 100%;
  height: 100%;
  font-family: Arial, Helvetica, sans-serif;
  border-radius: 5px;
  transition: 0.4s ease-in-out;
}
.contact-wrapper .contact__form--buttons__sendbtn #sendbtn, .contact-wrapper .contact__form--buttons__backbtn #sendbtn {
  border: 2px solid green;
}
.contact-wrapper .contact__form--buttons__sendbtn #backbtn, .contact-wrapper .contact__form--buttons__backbtn #backbtn {
  border: 2px solid var(--mrwblue-1);
}
.contact-wrapper .contact__form--buttons__sendbtn #sendbtn:hover, .contact-wrapper .contact__form--buttons__backbtn #sendbtn:hover {
  background-color: green;
  color: white;
}
.contact-wrapper .contact__form--buttons__sendbtn #backbtn:hover, .contact-wrapper .contact__form--buttons__backbtn #backbtn:hover {
  background-color: var(--mrwblue-1);
  color: white;
}
.contact-wrapper .contact__form--buttons__msg {
  display: flex;
  align-items: center;
  color: var(--crimson);
}
.contact-wrapper .contact__phone {
  margin-top: 5rem;
  background-color: whitesmoke;
  border-radius: 10px;
  margin: 3rem 0;
  display: grid;
  align-items: stretch;
  gap: 0.2rem 1.5rem;
  grid-template-columns: 15% 1fr 1fr 15%;
  grid-template-areas: ". header header ." ". . pic ." ". name pic ." ". phone pic ." ". title pic ." ". . pic .";
}
.contact-wrapper .contact__phone--header {
  grid-area: header;
  padding: 2rem 0;
}
.contact-wrapper .contact__phone--name {
  grid-area: name;
  justify-self: right;
  padding: 0 2rem 0 0;
}
.contact-wrapper .contact__phone--phone {
  grid-area: phone;
  justify-self: right;
  padding: 0 2rem 0 0;
}
.contact-wrapper .contact__phone--title {
  grid-area: title;
  justify-self: right;
  padding: 0 2rem 0 0;
}
.contact-wrapper .contact__phone--pic {
  grid-area: pic;
  padding: 1rem 0;
}
.contact-wrapper .contact__phone img {
  width: 40%;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 50%;
}

.main-join {
  color: var(--mrwblue-1);
}

.join-address-block {
  background-color: var(--main-bg-color);
  margin: 0 3vw;
  border-radius: 5px;
  color: var(--font-color-blue-1);
  font-size: var(--font-size-25);
  display: grid;
  grid-template-columns: 65% 1fr;
  -moz-column-gap: var(--font-size-20);
       column-gap: var(--font-size-20);
  grid-template-areas: "ways addr";
}
.join-address-block__ways {
  grid-area: ways;
}
.join-address-block__address {
  grid-area: addr;
}
.join-address-block__ways {
  margin: 1vh 2vw;
}
.join-address-block__ways ul {
  margin-left: var(--font-size-40);
}
.join-address-block__address {
  margin: 1vh 2vw;
}
.join-address-block__address p {
  margin-left: var(--font-size-25);
}

.join-wrapper {
  padding-bottom: var(--font-size-30);
  display: grid;
  grid-auto-columns: 3vw 1fr 3vw;
  grid-template-areas: ". container .";
}
.join-wrapper .join {
  background-color: var(--main-bg-color2);
  margin: var(--font-size-30) 0;
  border-radius: 5px;
  padding: var(--font-size-25);
  grid-area: container;
}
.join-wrapper .join h2 {
  color: var(--darkred);
}
.join-wrapper .join textarea {
  border-radius: 3px;
}
.join-wrapper .join__form {
  margin-top: var(--font-size-20);
  font-size: var(--font-size-25);
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.join-wrapper .join__form fieldset {
  border-radius: 3px;
  padding: 0.5rem 1rem;
  margin-top: 1rem;
}
.join-wrapper .join__form label, .join-wrapper .join__form input[type=radio], .join-wrapper .join__form input[type=checkbox] {
  cursor: pointer;
}
.join-wrapper .join__form--info {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-areas: "date     ." "left     right" "required required";
  gap: 1vw 3vw;
}
.join-wrapper .join__form--info .formdate {
  grid-area: date;
}
.join-wrapper .join__form--info__left {
  grid-area: left;
}
.join-wrapper .join__form--info__right {
  grid-area: right;
}
.join-wrapper .join__form--info__required {
  grid-area: required;
  font-size: 1.25rem;
  padding: 0 0 1rem 1rem;
}
.join-wrapper .join__form--info .formprompt {
  display: grid;
  grid-template-columns: 25% 1fr;
  grid-template-areas: "label data";
  margin-bottom: 0.25rem;
}
.join-wrapper .join__form--info .formprompt label {
  grid-area: label;
}
.join-wrapper .join__form--info .formprompt input:not(#email, #state) {
  grid-area: data;
  text-transform: capitalize;
}
.join-wrapper .join__form--info .formprompt #state {
  text-transform: uppercase;
}
.join-wrapper .join__form--type {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "left   right" "bottom bottom";
}
.join-wrapper .join__form--type__left {
  grid-area: left;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.join-wrapper .join__form--type__left-title {
  font-weight: 600;
  font-size: var(--font-size-30);
}
.join-wrapper .join__form--type__left-note {
  font-size: var(--font-size-20);
  padding-left: 2rem;
  margin-bottom: 0.5rem;
}
.join-wrapper .join__form--type__left-type {
  padding-left: 2rem;
}
.join-wrapper .join__form--type__right {
  grid-area: right;
}
.join-wrapper .join__form--type__right #otherclubs {
  margin-top: 1rem;
  width: 90%;
}
.join-wrapper .join__form--type__bottom {
  grid-area: bottom;
  margin: 1rem;
  display: flex;
  gap: 2rem;
}
.join-wrapper .join__form--committees {
  display: grid;
  grid-template-areas: "title" "boxes";
}
.join-wrapper .join__form--committees__title {
  grid-area: title;
}
.join-wrapper .join__form--committees__checkboxes {
  grid-area: boxes;
}
.join-wrapper .join__form--committees__title p {
  font-weight: 600;
  font-size: var(--font-size-30);
}
.join-wrapper .join__form--committees__title span {
  font-weight: 300;
  font-size: var(--font-size-25);
  padding-left: 1rem;
}
.join-wrapper .join__form--committees__checkboxes {
  margin: 1rem 2rem;
  display: grid;
  gap: 0.25rem;
  grid-template-areas: "library     campaigns  community" "fundraising america    legislative" "hospitality membership publicity" "santacop    education  other";
}
.join-wrapper .join__form--committees__checkboxes #library {
  grid-area: library;
}
.join-wrapper .join__form--committees__checkboxes #campaigns {
  grid-area: campaigns;
}
.join-wrapper .join__form--committees__checkboxes #community {
  grid-area: community;
}
.join-wrapper .join__form--committees__checkboxes #fundraising {
  grid-area: fundraising;
}
.join-wrapper .join__form--committees__checkboxes #america {
  grid-area: america;
}
.join-wrapper .join__form--committees__checkboxes #legislative {
  grid-area: legislative;
}
.join-wrapper .join__form--committees__checkboxes #hospitality {
  grid-area: hospitality;
}
.join-wrapper .join__form--committees__checkboxes #membership {
  grid-area: membership;
}
.join-wrapper .join__form--committees__checkboxes #publicity {
  grid-area: publicity;
}
.join-wrapper .join__form--committees__checkboxes #santacop {
  grid-area: santacop;
}
.join-wrapper .join__form--committees__checkboxes #education {
  grid-area: education;
}
.join-wrapper .join__form--committees__checkboxes #other {
  grid-area: other;
}
.join-wrapper .join__form--talents__title p, .join-wrapper .join__form--issues__title p {
  font-weight: 600;
  font-size: var(--font-size-30);
}
.join-wrapper .join__form--talents__title span, .join-wrapper .join__form--issues__title span {
  font-weight: 300;
  font-size: var(--font-size-25);
  padding-left: 1rem;
}
.join-wrapper .join__form--talents textarea, .join-wrapper .join__form--issues textarea {
  width: 95%;
  margin: 1rem 2rem;
}
.join-wrapper .join__form--buttons {
  margin: var(--font-size-30);
  display: grid;
  gap: var(--font-size-30);
  grid-template-columns: 10% 10% 1fr;
  grid-template-areas: "send exit msg";
}
.join-wrapper .join__form--buttons__sendbtn {
  grid-area: send;
}
.join-wrapper .join__form--buttons__backbtn {
  grid-area: exit;
}
.join-wrapper .join__form--buttons__msg {
  grid-area: msg;
}
.join-wrapper .join__form--buttons__sendbtn input, .join-wrapper .join__form--buttons__backbtn input {
  width: 100%;
  height: 100%;
  font-family: Arial, Helvetica, sans-serif;
  border-radius: 5px;
  transition: 0.4s ease-in-out;
}
.join-wrapper .join__form--buttons__sendbtn #sendbtn, .join-wrapper .join__form--buttons__backbtn #sendbtn {
  border: 2px solid green;
}
.join-wrapper .join__form--buttons__sendbtn #backbtn, .join-wrapper .join__form--buttons__backbtn #backbtn {
  border: 2px solid var(--mrwblue-1);
}
.join-wrapper .join__form--buttons__sendbtn #sendbtn:hover, .join-wrapper .join__form--buttons__backbtn #sendbtn:hover {
  background-color: green;
  color: white;
}
.join-wrapper .join__form--buttons__sendbtn #backbtn:hover, .join-wrapper .join__form--buttons__backbtn #backbtn:hover {
  background-color: var(--mrwblue-1);
  color: white;
}
.join-wrapper .join__form--buttons__msg {
  display: flex;
  align-items: center;
  color: var(--crimson);
}

@media print {
  .noprint {
    display: none;
  }
}
@media screen and (max-width: 600px) {
  .main-join .join-address-block {
    grid-template-columns: 1fr;
    grid-template-areas: "ways" "addr";
  }
  .main-join .join__form--info {
    grid-template-columns: 1fr;
    grid-template-areas: "date" "left" "right" "required" "required";
  }
  .main-join .join__form--type {
    grid-template-columns: 1fr;
    grid-template-areas: "left" "right" "bottom";
  }
  .main-join .join__form--type__right {
    margin-top: 2rem;
  }
  .main-join .join__form--type__bottom {
    display: grid;
    gap: 1rem;
    grid-template-areas: "total" "checknbr" "cash";
  }
  .main-join .join__form--type__bottom-total {
    grid-area: total;
  }
  .main-join .join__form--type__bottom-checknbr {
    grid-area: checknbr;
  }
  .main-join .join__form--type__bottom-cash {
    grid-area: cash;
  }
  .main-join .join__form--committees__checkboxes {
    grid-template-areas: "library     campaigns" "community   fundraising" "america     legislative" "hospitality membership" "publicity   santacop" "education   other";
  }
}
@media screen and (max-width: 500px) {
  .main-join .join__form--committees__checkboxes {
    grid-template-areas: "library" "campaigns" "community" "fundraising" "america" "legislative" "hospitality" "membership" "publicity" "santacop" "education" "other";
  }
}

footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: var(--navbar-bg-color);
  color: white;
  padding: var(--font-size-20);
}/*# sourceMappingURL=style.css.map */