diff --git a/gatsby-config.js b/gatsby-config.js
index be2acb86..34ade0e4 100644
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -4,7 +4,16 @@
 module.exports = {
   siteMetadata: {
     title: `medlem`,
-    siteUrl: `https://www.yourdomain.tld`
+    siteUrl: `https://medlem.d-sektionen.se`,
   },
-  plugins: ["gatsby-plugin-sass"]
-};
\ No newline at end of file
+  plugins: [
+    {
+      resolve: 'gatsby-plugin-sass',
+      options: {
+        sassOptions: {
+          silenceDeprecations: ['legacy-js-api', 'import'],
+        },
+      },
+    },
+  ],
+}
diff --git a/package.json b/package.json
index f5b4fe56..80aa60a1 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,7 @@
   "version": "1.0.0",
   "private": true,
   "description": "medlem",
-  "author": "Therese Selberg",
+  "author": "WebbU",
   "keywords": [
     "gatsby"
   ],
@@ -53,4 +53,4 @@
   "devDependencies": {
     "gh-pages": "^6.1.1"
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/ui/buttons.js b/src/components/ui/buttons.js
index b507450b..356fadd7 100644
--- a/src/components/ui/buttons.js
+++ b/src/components/ui/buttons.js
@@ -18,23 +18,63 @@ const IconButton = ({ onClick, iconComponent: Icon, text, disabled }) => {
   )
 }
 
-const Button = ({ onClick, to, href, target, children, type = 'button' }) => {
+const Button = ({
+  onClick,
+  to,
+  href,
+  target,
+  children,
+  disabled,
+  type = 'button',
+}) => {
   if (to)
     return (
-      <Link className={button} to={to} onClick={onClick}>
+      <Link
+        className={button}
+        to={disabled ? undefined : to}
+        onClick={
+          disabled
+            ? (e) => {
+                e.preventDefault()
+                e.stopPropagation()
+              }
+            : onClick
+        }
+        aria-disabled={disabled}
+        tabIndex={disabled ? -1 : undefined}
+      >
         {children}
       </Link>
     )
 
   if (href)
     return (
-      <a className={button} href={href} target={target} onClick={onClick}>
+      <a
+        className={button}
+        href={disabled ? undefined : href}
+        target={target}
+        onClick={
+          disabled
+            ? (e) => {
+                e.preventDefault()
+                e.stopPropagation()
+              }
+            : onClick
+        }
+        aria-disabled={disabled}
+        tabIndex={disabled ? -1 : undefined}
+      >
         {children}
       </a>
     )
 
   return (
-    <button className={button} type={type} onClick={onClick}>
+    <button
+      className={button}
+      type={type}
+      onClick={onClick}
+      disabled={disabled}
+    >
       {children}
     </button>
   )
diff --git a/src/components/ui/titleChooser.js b/src/components/ui/titleChooser.js
index 2da624c7..d791b2b1 100644
--- a/src/components/ui/titleChooser.js
+++ b/src/components/ui/titleChooser.js
@@ -15,6 +15,7 @@ const TitleChooser = ({
   choice = null,
   setChoice = () => {},
   label = '',
+  hintLabel = 'Välj ett objekt',
   action = null,
   actionLabel = '',
   noChoicesLabel = '',
@@ -91,7 +92,7 @@ const TitleChooser = ({
                   </optgroup>
                 ))}
             </select>
-            {choice === null && <div className={hint}>Välj ett objekt</div>}
+            {choice === null && <div className={hint}>{hintLabel}</div>}
           </div>
         ) : (
           <span>{noChoicesLabel}</span>
@@ -110,6 +111,7 @@ TitleChooser.propTypes = {
   choice: PropTypes.object,
   setChoice: PropTypes.func,
   label: PropTypes.string,
+  hintLabel: PropTypes.string,
   action: PropTypes.func,
   actionLabel: PropTypes.string,
   noChoicesLabel: PropTypes.string,
diff --git a/src/components/vote/meetingInfoPanel.js b/src/components/vote/meetingInfoPanel.js
index f851495b..70baa6c4 100644
--- a/src/components/vote/meetingInfoPanel.js
+++ b/src/components/vote/meetingInfoPanel.js
@@ -1,6 +1,7 @@
 import React from 'react'
 import { Button } from '../ui/buttons'
 import { post, del } from '../request'
+import { FiLogOut, FiLogIn } from 'react-icons/fi'
 
 export default function MeetingInfoPanel({
   currentMeeting,
@@ -34,6 +35,7 @@ export default function MeetingInfoPanel({
                 }
               }}
             >
+              <FiLogOut />
               Lämna röstlängden
             </Button>
           ) : (
@@ -49,6 +51,7 @@ export default function MeetingInfoPanel({
                 }
               }}
             >
+              <FiLogIn />
               Gå med i röstlängden
             </Button>
           )}
diff --git a/src/components/vote/page.js b/src/components/vote/page.js
index 2d910896..5878a303 100644
--- a/src/components/vote/page.js
+++ b/src/components/vote/page.js
@@ -7,6 +7,11 @@ import TitleChooser from '../ui/titleChooser'
 import SpeakerPanel from './speakerPanel'
 import MeetingInfoPanel from './meetingInfoPanel'
 import VotePanel from './votePanel'
+import {
+  currentMeetingContainer,
+  votePanelContainer,
+  othersContainer,
+} from '../../scss/votePage.module.scss'
 
 export default function VotePage({ pageContext: { title } }) {
   const [currentMeeting, setCurrentMeeting] = useState(null)
@@ -27,24 +32,23 @@ export default function VotePage({ pageContext: { title } }) {
             setChoice={setCurrentMeeting}
             choices={meetings}
             label="name"
+            hintLabel="Välj ett möte"
             noChoicesLabel="Det finns inga möten just nu."
           />
         </GridItem>
         {currentMeeting && (
-          <>
-            <GridItem>
+          <div className={currentMeetingContainer}>
+            <div className={votePanelContainer}>
+              <VotePanel meeting={currentMeeting} />
+            </div>
+            <div className={othersContainer}>
               <MeetingInfoPanel
                 currentMeeting={currentMeeting}
                 setCurrentMeeting={setCurrentMeeting}
               />
-            </GridItem>
-            <GridItem>
               <SpeakerPanel meeting={currentMeeting} />
-            </GridItem>
-            <GridItem>
-              <VotePanel meeting={currentMeeting} />
-            </GridItem>
-          </>
+            </div>
+          </div>
         )}
       </GridContainer>
     </BigPixels>
diff --git a/src/components/vote/speakerPanel.js b/src/components/vote/speakerPanel.js
index d5e333f9..c2c24397 100644
--- a/src/components/vote/speakerPanel.js
+++ b/src/components/vote/speakerPanel.js
@@ -1,10 +1,12 @@
 import React, { useState, useEffect, useContext } from 'react'
 
+import { MdOutlineFrontHand } from 'react-icons/md'
+import { RiMegaphoneLine } from 'react-icons/ri'
 import { FiTrash2 } from 'react-icons/fi'
 import { List, ListButton, ListItem } from '../ui/list'
 import { Button, ButtonGroup } from '../ui/buttons'
 import { UserContext } from '../layout/layout'
-import { speakerPanelList } from '../../scss/vote.module.scss'
+import { speakerPanelList } from '../../scss/voteSpeakerPanel.module.scss'
 
 import socket, { joinRoom, leaveRoom } from '../request/socket'
 import backendService from '../request/backendService'
@@ -80,6 +82,7 @@ const SpeakerPanel = ({ meeting }) => {
               })
             }}
           >
+            <MdOutlineFrontHand />
             Jag vill tala!
           </Button>
           <Button
@@ -90,6 +93,7 @@ const SpeakerPanel = ({ meeting }) => {
               })
             }}
           >
+            <RiMegaphoneLine />
             Replik!
           </Button>
         </ButtonGroup>
@@ -101,7 +105,7 @@ const SpeakerPanel = ({ meeting }) => {
           speakers.map((s) => (
             <ListItem
               title={s.user.pretty_name}
-              subtitle={s.prioritized ? 'Replik' : null}
+              subtitle={s.prioritized ? 'Replik' : 'Tala'}
               key={s.id}
               buttons={[
                 <ListButton
diff --git a/src/components/vote/voteForm.js b/src/components/vote/voteForm.js
index 18632a40..1d69a58f 100644
--- a/src/components/vote/voteForm.js
+++ b/src/components/vote/voteForm.js
@@ -1,5 +1,15 @@
-import React, { Component, useState } from 'react'
+import React, { useState } from 'react'
 import { post } from '../request'
+import { Button } from '../ui/buttons'
+import { MdOutlineHowToVote } from 'react-icons/md'
+import {
+  questionHeader,
+  votesContainer,
+  voteInput,
+  voteLabel,
+  placeVoteContainer,
+  alreadyVotedClass,
+} from '../../scss/voteForm.module.scss'
 
 const VoteForm = ({ vote, setErrors }) => {
   const [checkedId, setCheckedId] = useState(-1)
@@ -17,42 +27,52 @@ const VoteForm = ({ vote, setErrors }) => {
     }
 
     await post('/voting/made_votes/', voteData)
-    .then(() => setSuccessfullyVoted(true))
-    .catch(err => {
-      setSentVote(false)
-      setErrors({ voteError: err.response.data.error })
-    })
+      .then(() => setSuccessfullyVoted(true))
+      .catch((err) => {
+        setSentVote(false)
+        setErrors({
+          voteError:
+            err.response?.data?.error ?? 'Ett fel uppstod vid röstningen.',
+        })
+      })
   }
   const votingDisabled = checkedId === -1
-  const buttonText = votingDisabled ? 'Välj ett alternativ' : 'Rösta'
+  const placeVoteButtonText = votingDisabled ? 'Välj ett alternativ' : 'Rösta'
   const alreadyVotedText = successfullyVoted
     ? 'Tack för din röst!'
     : 'Du har röstat i omröstningen.'
 
   return (
     <div>
-      <strong>{vote.question}</strong>
+      <h3 className={questionHeader}>
+        <strong>{vote.question}</strong>
+      </h3>
       {vote.has_voted || successfullyVoted ? (
-        <p>{alreadyVotedText}</p>
+        <p className={alreadyVotedClass}>{alreadyVotedText}</p>
       ) : (
         <>
-          <ul>
+          <div className={votesContainer}>
             {vote.alternatives.map(({ text, id }) => (
-              <li key={id}>
-                <label>
-                  <input
-                    type="radio"
-                    checked={checkedId === id}
-                    onChange={() => setCheckedId(id)}
-                  />
-                  {` ${text}`}
-                </label>
-              </li>
+              <label key={id} className={voteLabel}>
+                <input
+                  type="radio"
+                  checked={checkedId === id}
+                  onChange={() => setCheckedId(id)}
+                  className={voteInput}
+                />
+                {` ${text}`}
+              </label>
             ))}
-          </ul>
-          <button type="button" disabled={votingDisabled || successfullyVoted || sentVote} onClick={placeVote}>
-            {buttonText}
-          </button>
+          </div>
+          <div className={placeVoteContainer}>
+            <Button
+              disabled={votingDisabled || successfullyVoted || sentVote}
+              onClick={placeVote}
+            >
+              <MdOutlineHowToVote />
+              {placeVoteButtonText}
+            </Button>
+          </div>
         </>
       )}
     </div>
diff --git a/src/components/vote/votePanel.js b/src/components/vote/votePanel.js
index 11887f5e..17345f4f 100644
--- a/src/components/vote/votePanel.js
+++ b/src/components/vote/votePanel.js
@@ -1,8 +1,12 @@
 import React, { useEffect, useState } from 'react'
 import VoteForm from './voteForm'
-import { formError } from '../../scss/vote.module.scss'
 import backendService from '../request/backendService'
 import socket, { joinRoom, leaveRoom } from '../request/socket'
+import {
+  formError,
+  votePanelHeader,
+  noActiveVoting,
+} from '../../scss/votePanel.module.scss'
 
 const VotePanel = ({ meeting }) => {
   const [votes, setVotes] = useState([])
@@ -116,11 +120,13 @@ const VotePanel = ({ meeting }) => {
 
   return (
     <div>
-      <h2>Rösta</h2>
-      {errors && <div className={formError}>{errors.voteError}</div>}
+      <h2 className={votePanelHeader}>Rösta</h2>
+      {errors.voteError && <div className={formError}>{errors.voteError}</div>}
       {votes && (
         <>
-          {votes.length === 0 && <p>Det finns ingen aktiv omröstning</p>}
+          {votes.length === 0 && (
+            <h3 className={noActiveVoting}>Det finns ingen aktiv omröstning</h3>
+          )}
           {votes.map((vote) => (
             <VoteForm key={vote.id} vote={vote} setErrors={setFormErrors} />
           ))}
diff --git a/src/components/votingAdmin/addVote.js b/src/components/votingAdmin/addVote.js
index dd1724f8..a408f626 100644
--- a/src/components/votingAdmin/addVote.js
+++ b/src/components/votingAdmin/addVote.js
@@ -14,8 +14,11 @@ const AddVote = ({ currentMeeting, create, updateData, update }) => {
   )
   const [alternatives, setAlternatives] = useState(
     updateData
-      ? updateData.alternatives.map(alt => createAlternative(alt))
-      : [createAlternative({text: 'Vakant'}), createAlternative({text: 'Blankt'})]
+      ? updateData.alternatives.map((alt) => createAlternative(alt))
+      : [
+          createAlternative({ text: 'Vakant' }),
+          createAlternative({ text: 'Blankt' }),
+        ]
   )
   const [currentQuestion, setCurrentQuestion] = useState(
     updateData ? updateData.open : true
@@ -27,7 +30,7 @@ const AddVote = ({ currentMeeting, create, updateData, update }) => {
         Fråga
         <input
           value={question}
-          onChange={e => {
+          onChange={(e) => {
             setQuestion(e.target.value)
           }}
         />
@@ -38,9 +41,9 @@ const AddVote = ({ currentMeeting, create, updateData, update }) => {
           <li key={alt.key}>
             <input
               value={alt.text}
-              onChange={e => {
+              onChange={(e) => {
                 const newVal = e.target.value
-                setAlternatives(prev => [
+                setAlternatives((prev) => [
                   ...prev.slice(0, i),
                   { ...prev[i], text: newVal },
                   ...prev.slice(i + 1),
@@ -50,7 +53,7 @@ const AddVote = ({ currentMeeting, create, updateData, update }) => {
             <button
               type="button"
               onClick={() => {
-                setAlternatives(prev => [
+                setAlternatives((prev) => [
                   ...prev.slice(0, i),
                   ...prev.slice(i + 1),
                 ])
@@ -64,7 +67,7 @@ const AddVote = ({ currentMeeting, create, updateData, update }) => {
       <button
         type="button"
         onClick={() => {
-          setAlternatives(prev => [...prev, createAlternative()])
+          setAlternatives((prev) => [...prev, createAlternative()])
         }}
       >
         Lägg till alternativ
@@ -74,7 +77,7 @@ const AddVote = ({ currentMeeting, create, updateData, update }) => {
         <input
           type="checkbox"
           checked={currentQuestion}
-          onChange={() => setCurrentQuestion(prev => !prev)}
+          onChange={() => setCurrentQuestion((prev) => !prev)}
         />
         Nuvarande frågan
       </label>
diff --git a/src/components/votingAdmin/page.js b/src/components/votingAdmin/page.js
index c9c5fcbf..55585008 100644
--- a/src/components/votingAdmin/page.js
+++ b/src/components/votingAdmin/page.js
@@ -19,18 +19,20 @@ const VotingAdminPage = ({ pageContext: { title } }) => {
   const [openCreateModal] = useModal(AddMeeting)
   const closeModal = useCloseModal()
 
-  const create = async data => {
+  const create = async (data) => {
     const { data: newMeeting } = await post('/voting/admin-meetings/', data)
     mutate([...unorderedMeetings, newMeeting])
   }
 
-  const updatePatch = async data => {
+  const updatePatch = async (data) => {
     const { data: updatedMeeting } = await patch(
       `/voting/admin-meetings/${currentMeeting.id}/`,
       data
     )
     mutate([
-      ...unorderedMeetings.filter(meeting => meeting.id !== currentMeeting.id),
+      ...unorderedMeetings.filter(
+        (meeting) => meeting.id !== currentMeeting.id
+      ),
       updatedMeeting,
     ])
   }
@@ -40,7 +42,7 @@ const VotingAdminPage = ({ pageContext: { title } }) => {
   // sync currentMeeting with updated meetings
   useEffect(() => {
     if (currentMeeting)
-      setCurrentMeeting(meetings.find(m => m.id === currentMeeting.id))
+      setCurrentMeeting(meetings.find((m) => m.id === currentMeeting.id))
   }, [meetings])
 
   return (
@@ -53,9 +55,10 @@ const VotingAdminPage = ({ pageContext: { title } }) => {
             setChoice={setCurrentMeeting}
             choices={meetings}
             label="name"
+            hintLabel="Välj ett möte"
             action={() => {
               openCreateModal('Nytt möte', {
-                create: async data => {
+                create: async (data) => {
                   await create(data)
                   closeModal()
                 },
diff --git a/src/components/votingCounter/page.js b/src/components/votingCounter/page.js
index f100dc40..6f830417 100644
--- a/src/components/votingCounter/page.js
+++ b/src/components/votingCounter/page.js
@@ -17,18 +17,20 @@ const VotingAdminPage = ({ pageContext: { title } }) => {
   const { data: unorderedMeetings, mutate } = useSWR('/voting/admin-meetings/')
   const closeModal = useCloseModal()
 
-  const create = async data => {
+  const create = async (data) => {
     const { data: newMeeting } = await post('/voting/admin-meetings/', data)
     mutate([...unorderedMeetings, newMeeting])
   }
 
-  const updatePatch = async data => {
+  const updatePatch = async (data) => {
     const { data: updatedMeeting } = await patch(
       `/voting/admin-meetings/${currentMeeting.id}/`,
       data
     )
     mutate([
-      ...unorderedMeetings.filter(meeting => meeting.id !== currentMeeting.id),
+      ...unorderedMeetings.filter(
+        (meeting) => meeting.id !== currentMeeting.id
+      ),
       updatedMeeting,
     ])
   }
@@ -36,13 +38,10 @@ const VotingAdminPage = ({ pageContext: { title } }) => {
   const meetings = unorderedMeetings ? [...unorderedMeetings].reverse() : null
 
   // sync currentMeeting with updated meetings
-  useEffect(
-    () => {
-      if (currentMeeting)
-        setCurrentMeeting(meetings.find(m => m.id === currentMeeting.id))
-    },
-    [meetings]
-  )
+  useEffect(() => {
+    if (currentMeeting)
+      setCurrentMeeting(meetings.find((m) => m.id === currentMeeting.id))
+  }, [meetings])
 
   return (
     <BigPixels>
@@ -54,6 +53,7 @@ const VotingAdminPage = ({ pageContext: { title } }) => {
             setChoice={setCurrentMeeting}
             choices={meetings}
             label="name"
+            hintLabel="Välj ett möte"
             noChoicesLabel="Det finns inga möten just nu."
           />
         </GridItem>
diff --git a/src/scss/_vars.scss b/src/scss/_vars.scss
index 1963e6d3..26a0b971 100644
--- a/src/scss/_vars.scss
+++ b/src/scss/_vars.scss
@@ -1,5 +1,8 @@
+@use 'sass:color';
+
 // Breakpoints
 $small-mobile-breakpoint: 480px;
+$large-mobile-breakpoint: 996px; // chosen after deep considerations
 
 // Colors
 $dsek-brown: #754022;
@@ -25,10 +28,9 @@ $foreground-color-4: #fff;
 // $gray: #999;
 // $dark-gray: #555;
 // $very-dark-gray: #333;
-// $black: #000;
 
-$link-color: lighten($dsek-blue, 30%); //#428bca;
-$link-color-visited: lighten($dsek-blue, 15%);
+$link-color: color.adjust($dsek-blue, $lightness: 30%, $space: hsl);
+$link-color-visited: color.adjust($dsek-blue, $lightness: 15%, $space: hsl);
 $red: red;
 
 $dsek-colors: $dsek-brown, $dsek-cerise, $dsek-yellow, $dsek-green, $dsek-blue;
@@ -42,6 +44,9 @@ $base-animation-time: 0.3s;
 $dsek-font-order: 'Asap', Arial, sans-serif;
 
 // Shadows
-$box-shadow-default: 0 1px 3px rgba(0, 0, 0, 0.12),
+$box-shadow-default:
+  0 1px 3px rgba(0, 0, 0, 0.12),
   0 1px 2px rgba(0, 0, 0, 0.24);
-$box-shadow-raised: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
+$box-shadow-raised:
+  0 3px 6px rgba(0, 0, 0, 0.16),
+  0 3px 6px rgba(0, 0, 0, 0.23);
diff --git a/src/scss/form.module.scss b/src/scss/form.module.scss
index 0badd59a..9894b656 100644
--- a/src/scss/form.module.scss
+++ b/src/scss/form.module.scss
@@ -23,4 +23,4 @@ option {
 option::selection {
   background-color: $dsek-blue;
   border: 1px dotted $foreground-color-1;
-}
\ No newline at end of file
+}
diff --git a/src/scss/lock.module.scss b/src/scss/lock.module.scss
index 21d03e28..b46ac730 100644
--- a/src/scss/lock.module.scss
+++ b/src/scss/lock.module.scss
@@ -56,6 +56,6 @@
   svg {
     width: 1.3em;
     height: 1.3em;
-    margin-left:6px;
+    margin-left: 6px;
   }
 }
diff --git a/src/scss/ui.module.scss b/src/scss/ui.module.scss
index e0e3972c..758a68ea 100644
--- a/src/scss/ui.module.scss
+++ b/src/scss/ui.module.scss
@@ -6,7 +6,6 @@
   border: none;
   background-color: $background-color-3;
   color: $foreground-color-3;
-  cursor: pointer;
   padding: $base-padding $base-padding * 2;
   margin-bottom: $base-padding;
 
@@ -16,10 +15,23 @@
   justify-content: center;
   gap: calc($base-padding / 2);
 
-  &:hover {
+  > svg {
+    height: calc(1.5 * $base-padding);
+    width: calc(1.5 * $base-padding);
+  }
+
+  cursor: pointer;
+
+  &:not([disabled]):not([aria-disabled='true']):hover {
     background-color: $dsek-blue;
   }
 
+  &[disabled],
+  &[aria-disabled='true'] {
+    cursor: not-allowed;
+    opacity: 0.6;
+  }
+
   &:focus {
     outline-width: 0;
     box-shadow: 0 0 2px 2px $dsek-blue;
@@ -89,7 +101,6 @@
 .gridItem {
   background-color: rgba($background-color-2, 0.95);
   padding: $base-padding;
-  // z-index: 10;
   backdrop-filter: blur(5px);
 }
 
@@ -119,7 +130,7 @@
 
   h3 {
     margin: 0;
-    font-size: 1rem;
+    font-size: 1.2rem;
   }
   p {
     font-size: 0.9rem;
@@ -293,11 +304,8 @@
     bottom: 0;
     left: 0;
     right: 0;
-    background: linear-gradient(
-        0deg,
-        rgba(0, 0, 0, 0.6) 0%,
-        rgba(0, 0, 0, 0) 100%
-      ),
+    background:
+      linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%),
       linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 30%);
   }
 }
diff --git a/src/scss/voteForm.module.scss b/src/scss/voteForm.module.scss
new file mode 100644
index 00000000..dc91542f
--- /dev/null
+++ b/src/scss/voteForm.module.scss
@@ -0,0 +1,68 @@
+@import 'vars';
+
+.votesContainer {
+  display: grid;
+  gap: $base-padding;
+  grid-template-columns: 1fr;
+
+  @media screen and (min-width: $large-mobile-breakpoint) {
+    grid-template-columns: 1fr 1fr;
+
+    &:has(> :nth-child(3)) {
+      grid-template-columns: 1fr 1fr 1fr;
+    }
+
+    // When a single item is alone in the last row of a 3-column grid
+    // (positions 4, 7, 10, … that are also the last child),
+    // shift it to column 2 so it sits centred under the second column.
+    > .voteLabel:nth-child(3n + 4):last-child {
+      grid-column: 2;
+    }
+  }
+}
+
+.voteInput {
+  /* hide the radio button */
+  /* https://stackoverflow.com/questions/18078871/hide-check-radio-button-with-css */
+  position: fixed;
+  opacity: 0;
+  pointer-events: none;
+}
+
+.voteLabel {
+  text-align: center;
+  font-size: 1.2em;
+  padding: $base-padding calc($base-padding / 2);
+  background-color: $background-color-4;
+  cursor: pointer;
+
+  word-break: normal;
+  overflow-wrap: anywhere;
+  hyphens: auto;
+
+  &:hover,
+  &:focus-within {
+    background-color: $dsek-blue;
+  }
+
+  &:has(.voteInput:checked) {
+    background-color: $dsek-green !important;
+    color: $background-color-2;
+    font-weight: 800;
+  }
+}
+
+.placeVoteContainer {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-top: $base-padding;
+}
+
+.questionHeader {
+  text-align: center;
+}
+
+.alreadyVotedClass {
+  text-align: center;
+}
diff --git a/src/scss/votePage.module.scss b/src/scss/votePage.module.scss
new file mode 100644
index 00000000..395a83b9
--- /dev/null
+++ b/src/scss/votePage.module.scss
@@ -0,0 +1,33 @@
+@import 'vars';
+
+.currentMeetingContainer {
+  grid-column: 1 / -1;
+  background-color: transparent;
+  display: grid;
+  gap: $base-padding;
+  grid-template-columns: 1fr 1fr;
+}
+
+.votePanelContainer {
+  background-color: $background-color-2;
+  grid-column: 1 / -1;
+  padding: $base-padding;
+}
+
+.othersContainer {
+  display: grid;
+  grid-template-columns: repeat(var(--cols), 1fr);
+  --cols: 1;
+
+  @media screen and (min-width: $large-mobile-breakpoint) {
+    --cols: 2;
+  }
+
+  grid-column: 1 / -1;
+  gap: $base-padding;
+}
+
+.othersContainer > * {
+  background-color: $background-color-2;
+  padding: $base-padding;
+}
diff --git a/src/scss/votePanel.module.scss b/src/scss/votePanel.module.scss
new file mode 100644
index 00000000..e5db913b
--- /dev/null
+++ b/src/scss/votePanel.module.scss
@@ -0,0 +1,14 @@
+@import 'vars';
+
+.votePanelHeader {
+  text-align: center;
+}
+
+.noActiveVoting {
+  text-align: center;
+  font-style: italic;
+}
+
+.formError {
+  color: $red;
+}
diff --git a/src/scss/vote.module.scss b/src/scss/voteSpeakerPanel.module.scss
similarity index 51%
rename from src/scss/vote.module.scss
rename to src/scss/voteSpeakerPanel.module.scss
index 7acf4d6a..15cc8840 100644
--- a/src/scss/vote.module.scss
+++ b/src/scss/voteSpeakerPanel.module.scss
@@ -1,9 +1,3 @@
-@import 'vars';
-
-.formError {
-    color: $red;
-}
-
 .speakerPanelList {
   li {
     min-height: 3em;