https://turnbacktheblock.com/src/routes/get-involved/get-involved.styles.scss

1import { createHotContext as __vite__createHotContext } from "/@vite/client";import.meta.hot = __vite__createHotContext("/src/routes/get-involved/get-involved.styles.scss");import { updateStyle as __vite__updateStyle, removeStyle as __vite__removeStyle } from "/@vite/client"
2const __vite__id = "/var/www/html/turn-back-frontend/src/routes/get-involved/get-involved.styles.scss"
3const __vite__css = "* {\n  margin: 0;\n  padding: 0;\n  box-sizing: border-box;\n}\n\n@font-face {\n  font-family: \"Intro\";\n  src: url(\"/src/assets/Intro-Demo-Black-Inline-CAPS.woff2\") format(\"woff2\");\n  font-weight: 400;\n  font-style: normal;\n}\n\np {\n  font-family: \"Montserrat\", Arial, sans-serif;\n  line-height: 1.8;\n}\n\n.button {\n  width: 50%;\n  padding: 1vw 0;\n  font-family: \"Intro\", Arial, sans-serif;\n  font-size: clamp(12px, 1vw, 20px);\n  text-decoration: none;\n  border: 2px solid white;\n  text-align: center;\n  transition: letter-spacing 0.2s linear;\n  cursor: pointer;\n}\n\n.button.white {\n  background-color: #ffffff;\n  color: #ec1d25;\n}\n\n.button.red {\n  background-color: #ec1d25;\n  color: #ffffff;\n}\n\n.button.transparent {\n  background-color: transparent;\n  color: #ffffff;\n}\n\n.button:hover {\n  letter-spacing: 1px;\n}\n\n.inline-line {\n  height: 2px;\n  background: #231f20;\n  width: 100%;\n  flex-shrink: 1;\n  flex-grow: 0;\n}\n\n@media (max-width: 431px) {\n  .inline-line {\n    display: none;\n  }\n}\n\n.mobile-breaker {\n  display: none;\n}\n\n@media (max-width: 431px) {\n  .mobile-breaker {\n    display: block;\n  }\n}\n\n#get-involved-section {\n  width: 100%;\n  margin: 60px 0;\n}\n\n@media (max-width: 1100px) {\n  #get-involved-section {\n    margin: 30px 0;\n  }\n}\n\n@media (max-width: 768px) {\n  #get-involved-section {\n    margin-bottom: 0;\n  }\n}\n\n@media (max-width: 431px) {\n  #get-involved-section {\n    margin: 0;\n  }\n}\n\n#get-involved-section .container {\n  width: clamp(768px, 70vw, 70vw);\n  margin: 0 auto;\n  padding: 20px;\n}\n\n@media (max-width: 768px) {\n  #get-involved-section .container {\n    width: 100%;\n    grid-template-columns: 1fr;\n  }\n}\n\n@media (max-width: 431px) {\n  #get-involved-section #help-us {\n    padding: 0;\n  }\n}\n\n#get-involved-section #help-us #call-to-action {\n  position: relative;\n  padding: 60px 40px;\n  background: #7e6c2a;\n}\n\n@media (max-width: 431px) {\n  #get-involved-section #help-us #call-to-action {\n    padding: 0;\n  }\n}\n\n#get-involved-section #help-us #call-to-action #background-image {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: url(\"/src/assets/keys.jpg\");\n  background-size: cover;\n  z-index: 1;\n}\n\n@media (max-width: 1200px) {\n  #get-involved-section #help-us #call-to-action #background-image {\n    background-position: 40%;\n  }\n}\n\n@media (max-width: 700px) {\n  #get-involved-section #help-us #call-to-action #background-image {\n    background-position: 50%;\n  }\n}\n\n@media (max-width: 431px) {\n  #get-involved-section #help-us #call-to-action #background-image {\n    position: relative;\n    height: 200px;\n    background-position: 75% center;\n  }\n}\n\n#get-involved-section #help-us #call-to-action #donate-today {\n  position: relative;\n  z-index: 3;\n}\n\n@media (max-width: 431px) {\n  #get-involved-section #help-us #call-to-action #donate-today {\n    padding: 30px 40px;\n  }\n}\n\n#get-involved-section #help-us #call-to-action #donate-today h2 {\n  font-family: \"Intro\", Arial, sans-serif;\n  text-transform: uppercase;\n  font-size: 1.8vw;\n  font-size: clamp(32px, 1.8vw, 1.8vw);\n}\n\n@media (max-width: 360px) {\n  #get-involved-section #help-us #call-to-action #donate-today h2 {\n    font-size: 26px;\n  }\n}\n\n#get-involved-section #help-us #call-to-action #donate-today .link-container {\n  margin-top: 20px;\n}\n\n#get-involved-section #help-us #call-to-action #donate-today .link-container .link-icon {\n  color: #ffffff;\n  font-size: 12px;\n  margin-right: 5px;\n}\n\n#get-involved-section #help-us #call-to-action #donate-today .link-container a {\n  color: #ffffff;\n  text-underline-offset: 2px;\n  font-weight: 600;\n}\n\n#get-involved-section #help-us #call-to-action #donate-today .link-container a:hover {\n  

3color: #e7e7e7;\n}\n\n@media (max-width: 768px) {\n  #get-involved-section #volunteer {\n    padding: 20px 0 0 0;\n  }\n}\n\n#get-involved-section #volunteer img {\n  width: 100%;\n  height: auto;\n  object-fit: cover;\n  padding: 20px;\n  display: none;\n}\n\n@media (max-width: 768px) {\n  #get-involved-section #volunteer img {\n    display: block;\n  }\n}\n\n#get-involved-section #volunteer #heading-container {\n  display: flex;\n  align-items: center;\n  gap: clamp(10px, 1vw, 20px);\n  margin: 40px 0;\n}\n\n@media (max-width: 768px) {\n  #get-involved-section #volunteer #heading-container {\n    margin: 30px 0 10px 0;\n    padding: 0 20px;\n  }\n  #get-involved-section #volunteer #heading-container .inline-line {\n    display: none;\n  }\n}\n\n#get-involved-section #volunteer #heading-container h2 {\n  font-family: \"Montserrat\", Arial, sans-serif;\n  font-size: clamp(26px, 2vw, 2vw);\n  font-weight: 600;\n  color: #231f20;\n  flex-shrink: 0;\n  flex-grow: 1;\n}\n\n#get-involved-section #volunteer #heading-container .inline-line {\n  flex-shrink: 1;\n  flex-grow: 0;\n}\n\n#get-involved-section #volunteer #content-container {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 4vw;\n}\n\n@media (max-width: 768px) {\n  #get-involved-section #volunteer #content-container {\n    display: flex;\n    flex-direction: column-reverse;\n  }\n}\n\n@media (max-width: 768px) {\n  #get-involved-section #volunteer #content-container #image-and-schedule {\n    background: #e7e7e7;\n    padding: 40px 20px;\n  }\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule img {\n  width: 100%;\n  height: auto;\n  object-fit: cover;\n  margin-bottom: 40px;\n  padding: 0;\n  display: block;\n}\n\n@media (max-width: 768px) {\n  #get-involved-section #volunteer #content-container #image-and-schedule img {\n    display: none;\n  }\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container h3 {\n  font-family: \"Intro\", Arial, sans-serif;\n  font-size: clamp(26px, 1.1vw, 1.1vw);\n  color: #231f20;\n  margin-bottom: 20px;\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule {\n  display: flex;\n  flex-direction: column;\n  gap: clamp(20px, 1.5vw, 1.5vw);\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .schedule-item {\n  display: flex;\n  align-items: flex-start;\n  gap: clamp(20px, 1.5vw, 1.5vw);\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .schedule-item img {\n  flex: 0 0 80px;\n  width: 80px;\n  height: 80px;\n  object-fit: cover;\n  border-radius: 4px;\n}\n\n@media (max-width: 431px) {\n  #get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .schedule-item img {\n    display: none;\n  }\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .schedule-item .schedule-item-details {\n  flex: 1;\n  display: grid;\n  grid-template-columns: auto 1fr;\n  gap: clamp(20px, 1.5vw, 1.5vw);\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule p {\n  color: #231f20;\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .event {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .event .event-title {\n  font-weight: 600;\n  text-decoration: underline;\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .event .event-meta {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .event .event-icon {\n  width: 15px;\n  height: 15px;\n  flex-shrink: 0;\n  color: #ec1d25;\n}\n\n#get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .event .event-description {\n  margin-top: 4px;\n}\n\n@media (max-width: 431px) {\n  #get-involved-section #volunteer #content-container #image-and-schedule #schedule-container #schedule .event .event-description {\n    display: none;\n  }\n}\n\n@media (max-width: 768px) {\n  #get-involved-section #volunteer #content-container #form-container {\n    padding: 0 20px;\n  }\n}\n\n#get-involved-section #volunteer #content-container #form-container p {\n  color: #231f20;\n}\n\n#get-involved-section #volunteer #content-container #form-container form {\n  display: grid;\n  grid-template-columns: 1fr 1fr 1fr 1fr;\n  column-gap: 15px;\n  row-gap: 25px;\n  margin: 30px 0;\n}\n\n@media (max-width: 768px) {\n  #get-involved-section #volunteer #content-container #form-container form {\n    margin: 40px 0;\n  }\n}\n\n@media (max-width: 431px) {\n  #get-involved-section #volunteer #content-container #form-container form {\n    display: flex;\n    flex-direction: column;\n  }\n}\n\n#get-involved-section #volunteer #content-container #form-container form #referral {\n  grid-column: 1/5;\n}\n\n@media (max-width: 431px) {\n  #get-involved-section #volunteer #content-container #form-container form #referral {\n    grid-column: 1;\n  }\n}\n\n#get-involved-section #volunteer #content-container #form-container form label {\n  font-family: \"Montserrat\", Arial, sans-serif;\n  font-size: clamp(14px, 0.7vw, 0.7vw);\n  text-transform: uppercase;\n  font-weight: 600;\n  color: #231f20;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label .required {\n  color: #ec1d25;\n  margin-left: 3px;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label input,\n#get-involved-section #volunteer #content-container #form-container form label select {\n  display: block;\n  width: 100%;\n  margin-top: 5px;\n  padding: 5px;\n  color: #231f20;\n  border: 2px solid #e7e7e7;\n  background: #f4f4f4;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label .thin {\n  font-weight: 400;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label:nth-of-type(1) {\n  grid-column: 1/5;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label:nth-of-type(2) {\n  grid-column: 1/5;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label:nth-of-type(3) {\n  grid-column: 1/5;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label:nth-of-type(4) {\n  grid-column: 1/3;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label:nth-of-type(5) {\n  grid-column: 3/4;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label:nth-of-type(6) {\n  grid-column: 4/5;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label:nth-of-type(7) {\n  grid-column: 1/3;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label:nth-of-type(8) {\n  grid-column: 3/5;\n}\n\n#get-involved-section #volunteer #content-container #form-container form label:nth-of-type(9) {\n  grid-column: 1/5;\n}\n\n#get-involved-section #volunteer #content-container #form-container form .checkbox-container {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  grid-template-rows: 1fr;\n  grid-column: 1/5;\n  column-gap: 15px;\n  align-items: center;\n}\n\n#get-involved-section #volunteer #content-container #form-container form .checkbox-container input {\n  position: relative;\n  width: 30px;\n  height: 30px;\n  border: 2px solid #e7e7e7;\n  background: #f4f4f4;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n}\n\n#get-involved-section #volunteer #content-container #form-container form .checkbox-container input:checked::after {\n  

3content: \"\";\n  position: absolute;\n  background-color: #ec1d25;\n  mask-image: url(\"/src/assets/check-sharp-solid.svg\");\n  mask-size: cover;\n  width: 100%;\n  height: 100%;\n}\n\n#get-involved-section #volunteer #content-container #form-container form .checkbox-container input a,\n#get-involved-section #volunteer #content-container #form-container form .checkbox-container label a {\n  color: #231f20;\n}\n\n#get-involved-section #volunteer #content-container #form-container form .checkbox-container input:nth-of-type(1),\n#get-involved-section #volunteer #content-container #form-container form .checkbox-container label:nth-of-type(1) {\n  grid-column: auto;\n}\n\n#get-involved-section #volunteer #content-container #form-container form .checkbox-container input:nth-of-type(2),\n#get-involved-section #volunteer #content-container #form-container form .checkbox-container label:nth-of-type(2) {\n  grid-column: auto;\n}\n\n#get-involved-section #volunteer #content-container #form-container form input[type=submit] {\n  width: 100%;\n  grid-column: 1/3;\n  margin-top: 20px;\n  padding: 15px 0;\n  font-size: clamp(16px, 1vw, 20px);\n}\n\n@media (max-width: 1500px) {\n  #get-involved-section #volunteer #content-container #form-container form input[type=submit] {\n    grid-column: 1/4;\n  }\n}\n\n@media (max-width: 768px) {\n  #get-involved-section #volunteer #content-container #form-container form input[type=submit] {\n    grid-column: 1/5;\n  }\n}"
4__vite__updateStyle(__vite__id, __vite__css)
5import.meta.hot.accept()
6export default __vite__css
7import.meta.hot.prune(() => __vite__removeStyle(__vite__id))