diff --git a/components/ShoutBox/shoutbox.tsx b/components/ShoutBox/shoutbox.tsx
index b2592df..11f6df8 100644
--- a/components/ShoutBox/shoutbox.tsx
+++ b/components/ShoutBox/shoutbox.tsx
@@ -22,15 +22,14 @@ export const ChatWrapper = () => {
 
   return (
     <div
-      className={`w-full flex-col items-center ${
-        shoutboxOpen ? 'flex' : 'hidden'
-      }`}
+      className={`w-full flex-col items-center ${shoutboxOpen ? 'flex' : 'hidden'
+        }`}
     >
       <div className="flex w-full max-w-6xl items-end justify-end">
         <button
           onClick={handleClose}
           title="chat"
-          className="mr-5 mt-5 h-10 w-10 rounded-full bg-orange"
+          className="mr-5 mt-5 h-10 w-10 rounded-full bg-coral"
         >
           <GrFormClose size="1.7rem" className="mx-auto" />
         </button>
@@ -155,10 +154,10 @@ const Chat = ({ limit, isOpen }: ShoutBoxProps) => {
               message={message.message}
               name={message.name}
               timestamp={message.timestamp}
-              color={index % 2 === 0 ? 'bg-purple-dark' : 'bg-purple-light'}
+              color={index % 2 === 0 ? 'bg-blue' : 'bg-blue-light'}
               isAdmin={isAdmin}
               onBanClick={handleBanClick}
-              telegram={message.source === 'telegram'}
+              telegram={message.source === "telegram"}
             />
           ))}
           {!wsConnected && (
diff --git a/components/ShoutBox/textfield.tsx b/components/ShoutBox/textfield.tsx
index 3f43e31..4dfc433 100644
--- a/components/ShoutBox/textfield.tsx
+++ b/components/ShoutBox/textfield.tsx
@@ -18,7 +18,7 @@ const TextField = ({
   <div className="TextFieldArea mr-[16px] inline-flex w-full justify-around">
     {label}
     <input
-      className="TextField w-full rounded-none border-b-2 border-solid border-orange bg-transparent text-white"
+      className="TextField w-full rounded-none border-b-2 border-solid border-blue-lightest bg-transparent text-white"
       type={type || 'text'}
       placeholder={placeholder}
       value={value}
diff --git a/components/button.tsx b/components/button.tsx
index b4c861e..bb929f6 100644
--- a/components/button.tsx
+++ b/components/button.tsx
@@ -2,7 +2,7 @@ import Link from 'next/link';
 import { FC, ReactNode } from 'react';
 
 const buttonStyle =
-  'bg-orange px-6 md:px-8 py-2 md:py-3 text-blue font-bold hover:bg-coral transition ease-in-out rounded';
+  'bg-teal px-6 md:px-8 py-2 md:py-3 text-blue font-bold hover:bg-coral transition ease-in-out rounded';
 
 interface ButtonProps {
   children: ReactNode;
@@ -59,7 +59,7 @@ const ModeButton = ({ text, isActive, onClick, ...props }: ModeButton) => {
     <button
       {...props}
       className={`rounded-sm p-2 text-white ${
-        isActive ? 'bg-orange' : 'bg-purple-darkest hover:text-greyish'
+        isActive ? 'bg-coral' : 'bg-blue-darkest hover:text-coral'
       }`}
       onClick={onClick}
     >
diff --git a/components/calendar.tsx b/components/calendar.tsx
index 6692c4c..85d6e50 100644
--- a/components/calendar.tsx
+++ b/components/calendar.tsx
@@ -55,7 +55,7 @@ const Calendar: FC = () => {
         <Event key={idx} event={event} />
       ))}
       <a
-        className="ml-auto font-bold text-orange underline transition hover:text-coral"
+        className="ml-auto font-bold text-teal underline transition hover:text-coral"
         href={process.env.NEXT_PUBLIC_GOOGLE_CALENDAR_SHARE_URL || ''}
         target="_blank"
         rel="noreferrer"
@@ -85,13 +85,13 @@ const Event: FC<{ event: Event }> = ({ event }) => {
       : formatWithoutTime(start, end);
 
   return (
-    <div className="my-2 flex flex-row bg-purple-dark p-2 text-white">
+    <div className="my-2 flex flex-row bg-blue-darkest p-2 text-white">
       <div className="flex w-28 flex-col items-center justify-center p-2">
         <div className="text-3xl font-bold">{dateFormatted}</div>
         <div className="text-lg font-bold">{weekday}</div>
       </div>
       <div className="w-full p-2">
-        <h3 className="text-xl font-bold text-greyish">{event.summary}</h3>
+        <h3 className="text-xl font-bold text-coral">{event.summary}</h3>
         <div>{timeFormatted}</div>
         {event.location && <div>@ {event.location}</div>}
       </div>
diff --git a/components/controls.tsx b/components/controls.tsx
index 41afb76..144f055 100644
--- a/components/controls.tsx
+++ b/components/controls.tsx
@@ -27,7 +27,7 @@ const Controls = ({
         onClick={onPlayPause}
         title="Play/Pause"
         className={`flex h-12 w-12 items-center justify-center rounded-full ${
-          playing ? 'bg-purple-darkest' : 'bg-orange'
+          playing ? 'bg-teal' : 'bg-coral'
         }`}
       >
         {playing ? (
@@ -40,9 +40,7 @@ const Controls = ({
       <button
         onClick={onMute}
         title="Mute"
-        className={`h-12 w-12 rounded-full ${
-          muted ? 'bg-purple-darkest' : 'bg-orange'
-        }`}
+        className={`h-12 w-12 rounded-full ${muted ? 'bg-teal' : 'bg-coral'}`}
       >
         <MuteIcon size="1.7rem" className="mx-auto" />
       </button>
diff --git a/components/footer.tsx b/components/footer.tsx
index 4ae3e9d..153d186 100644
--- a/components/footer.tsx
+++ b/components/footer.tsx
@@ -16,12 +16,12 @@ interface FooterProps {
 
 const Footer = ({ navigationItems }: FooterProps) => {
   return (
-    <footer className="z-15 flex max-w-full flex-col flex-wrap items-center justify-center bg-purple-darkest py-14 pb-32 text-white lg:flex-row">
+    <footer className="z-15 flex max-w-full flex-col flex-wrap items-center justify-center bg-blue-darkest py-14 pb-32 text-white lg:flex-row">
       <div className="flex w-64 max-w-full justify-center lg:justify-start xl:w-128">
         <div className="flex w-fit flex-col items-center">
           <div className="relative flex h-36 w-36 md:h-52 md:w-52">
             <Image
-              src="/syssyleima.png"
+              src="/leima.svg"
               unoptimized={true}
               layout="fill"
               alt="Logo of Turun Wappuradio ry"
diff --git a/components/hero.tsx b/components/hero.tsx
index 9c4abfc..85716d0 100644
--- a/components/hero.tsx
+++ b/components/hero.tsx
@@ -87,15 +87,15 @@ const Hero: FC<HeroProps> = ({
             }`}
           >
             <Image
-              src="/syssyleima.png"
+              src="/leima.svg"
               layout="fill"
               priority={true}
               alt="Logo of Turun Wappuradio ry"
               unoptimized={true}
             />
           </div>
-          <div className="flex flex-col pb-6">
-            <h1 className="my-1 text-[1.2rem] font-bold text-greyish md:my-1 md:text-4xl">
+          <div className="flex flex-col">
+            <h1 className="my-1 text-[1.2rem] font-bold text-coral md:my-1 md:text-4xl">
               {title}
             </h1>
             <p className="text-md my-1 text-white md:text-xl">{subtext}</p>
@@ -131,7 +131,7 @@ const Hero: FC<HeroProps> = ({
 const NavLink = ({ href, name }: { href: string; name: string }) => (
   <li className="p-4">
     <Link href={href}>
-      <a className="text-xl text-white transition hover:text-greyish">{name}</a>
+      <a className="text-xl text-white transition hover:text-coral">{name}</a>
     </Link>
   </li>
 );
diff --git a/components/player.tsx b/components/player.tsx
index 2a868a0..1c7b8fe 100644
--- a/components/player.tsx
+++ b/components/player.tsx
@@ -36,8 +36,8 @@ const Player = ({ playing, onPlayPause, showsByDate }: PlayerProps) => {
   const url = name ? picture?.url ?? placeholderImage : testcard;
   return (
     <div className="flex justify-center p-6">
-      <div className="flex w-[21rem] max-w-[59rem] flex-wrap items-center rounded bg-purple-light md:w-full md:flex-nowrap md:justify-start">
-        <div className="rounded bg-gradient-to-t from-greyish via-orange to-purple-dark p-1.5">
+      <div className="flex w-[21rem] max-w-[59rem] flex-wrap items-center rounded bg-blue-darkest md:w-full md:flex-nowrap md:justify-start">
+        <div className="rounded bg-gradient-to-t from-coral via-blue-lightest to-teal p-1.5">
           <div className="relative aspect-[3/2] w-80 rounded md:w-[28rem] lg:w-128">
             <Image
               src={url}
@@ -51,7 +51,7 @@ const Player = ({ playing, onPlayPause, showsByDate }: PlayerProps) => {
         <div className="mx-6 flex flex-col justify-between py-4 text-white md:mx-10 md:h-full md:py-10">
           {name && (
             <div className="mb-4 flex flex-col">
-              <span className="text-greyish">Ohjelmassa nyt</span>
+              <span className="text-teal">Ohjelmassa nyt</span>
               <span className="text-lg font-bold">{name}</span>
               <span className="opacity-80">
                 Juontaa: {hosts ?? 'Haamujuontaja'}
@@ -64,7 +64,7 @@ const Player = ({ playing, onPlayPause, showsByDate }: PlayerProps) => {
               onClick={onPlayPause}
               title="Play/Pause"
               className={`flex h-20 w-20 items-center justify-center rounded-full ${
-                playing ? 'bg-purple-darkest' : 'bg-orange'
+                playing ? 'bg-teal' : 'bg-coral'
               }`}
             >
               {playing ? <FiPause size="3rem" /> : <FiPlay size="3rem" />}
@@ -75,7 +75,7 @@ const Player = ({ playing, onPlayPause, showsByDate }: PlayerProps) => {
                 onClick={handleShoutboxToggle}
                 title="chat"
                 className={`h-12 w-12 rounded-full ${
-                  shoutboxOpen ? 'bg-purple-darkest' : 'bg-orange'
+                  shoutboxOpen ? 'bg-teal' : 'bg-coral'
                 }`}
               >
                 <FiMessageSquare size="1.7rem" className="mx-auto" />
@@ -84,7 +84,7 @@ const Player = ({ playing, onPlayPause, showsByDate }: PlayerProps) => {
                 onClick={handleVideoToggle}
                 title="Webcam"
                 className={`h-12 w-12 rounded-full ${
-                  videoOpen ? 'bg-purple-darkest' : 'bg-orange'
+                  videoOpen ? 'bg-teal' : 'bg-coral'
                 }`}
               >
                 <FiVideo size="1.7rem" className="mx-auto" />
diff --git a/components/playerControlPanel.tsx b/components/playerControlPanel.tsx
index 70f75d0..53c007b 100644
--- a/components/playerControlPanel.tsx
+++ b/components/playerControlPanel.tsx
@@ -26,7 +26,7 @@ const PlayerControlPanel = ({
   const showMeta = new Date().getTime() > Date.parse(SHOW_START_TIME);
 
   return (
-    <div className="bg-purple-light px-4 text-white md:px-6">
+    <div className="bg-blue-darkestest px-4 text-white md:px-6">
       <div className="mx-auto flex max-w-4xl items-center justify-between">
         <div className="flex items-center py-6">
           <Controls
@@ -49,13 +49,11 @@ const PlayerControlPanel = ({
         <div className="hidden text-right lg:block">
           <span className="font-bold md:text-xl">Turun Wappuradio</span>
           {/* TODO: Uncomment me
-            <div>
               <span>Taajuudella</span> <b>93,8 MHz</b>
             </div>
             <div>
               <span>Studio</span> <b>02 3619 2819</b>
-            </div>
-          */}
+            </div> */}
         </div>
       </div>
     </div>
diff --git a/components/responsiveShowlist.tsx b/components/responsiveShowlist.tsx
index aacdbcf..d2f64e7 100644
--- a/components/responsiveShowlist.tsx
+++ b/components/responsiveShowlist.tsx
@@ -18,7 +18,7 @@ const NavButton = ({ value, onClick, text, alternate = false }: NavButton) => {
   return (
     <>
       <a
-        className={`${'flex py-8 font-bold text-greyish transition hover:text-orange'}
+        className={`${'flex py-8 font-bold text-teal transition hover:text-coral'}
         ${disabled ? 'hidden' : ''}
         ${alternate ? '' : ''}
         `}
@@ -44,9 +44,7 @@ const DateButton = ({ value, currentDate, onClick }: DateButton) => {
   return (
     <button
       className={`w-full rounded-sm p-2 text-left capitalize text-white ${
-        value === currentDate
-          ? 'bg-orange font-bold'
-          : 'bg-purple-darkest hover:text-greyish'
+        (value === currentDate) ? 'bg-coral font-bold' : 'bg-blue-darkest hover:text-coral'
       }`}
       onClick={() => onClick(value)}
     >
@@ -92,7 +90,7 @@ export const ResponsiveShowlist = ({
         id="showList"
       >
         <select
-          className="mb-4 ml-6 flex h-8 rounded-sm bg-purple-light px-2 font-bold text-white lg:hidden"
+          className="mb-4 ml-6 flex h-8 rounded-sm  bg-blue-dark px-2 font-bold text-coral lg:hidden"
           onChange={(event) => setSelectedDate(event.target.value)}
           value={selectedDate}
         >
diff --git a/components/richtext.tsx b/components/richtext.tsx
index afc7bcb..531cab8 100644
--- a/components/richtext.tsx
+++ b/components/richtext.tsx
@@ -32,22 +32,22 @@ const renderOptions = (links?: any): Options => {
     renderNode: {
       [BLOCKS.PARAGRAPH]: (node, children) => <p className="m-3">{children}</p>,
       [BLOCKS.HEADING_1]: (node, children) => (
-        <h1 className="mx-3 my-4 text-3xl font-bold text-greyish">{children}</h1>
+        <h1 className="mx-3 my-4 text-3xl font-bold text-coral">{children}</h1>
       ),
       [BLOCKS.HEADING_2]: (node, children) => (
-        <h2 className="m-3 text-3xl font-bold text-greyish">{children}</h2>
+        <h2 className="m-3 text-3xl font-bold text-coral">{children}</h2>
       ),
       [BLOCKS.HEADING_3]: (node, children) => (
-        <h3 className="m-3 text-2xl font-bold text-greyish">{children}</h3>
+        <h3 className="m-3 text-2xl font-bold text-coral">{children}</h3>
       ),
       [BLOCKS.HEADING_4]: (node, children) => (
-        <h4 className="m-3 text-xl font-bold text-greyish">{children}</h4>
+        <h4 className="m-3 text-xl font-bold text-coral">{children}</h4>
       ),
       [BLOCKS.HEADING_5]: (node, children) => (
-        <h5 className="m-3 text-lg font-bold text-greyish">{children}</h5>
+        <h5 className="m-3 text-lg font-bold text-coral">{children}</h5>
       ),
       [BLOCKS.HEADING_6]: (node, children) => (
-        <h6 className="m-3 text-lg font-bold text-greyish">{children}</h6>
+        <h6 className="m-3 text-lg font-bold text-coral">{children}</h6>
       ),
       [BLOCKS.UL_LIST]: (node, children) => (
         <ul className="ml-8 list-disc">{children}</ul>
@@ -80,7 +80,7 @@ const renderOptions = (links?: any): Options => {
         }
 
         return (
-          <a href={data.uri} className="font-bold text-orange underline">
+          <a href={data.uri} className="font-bold text-teal underline">
             {children}
           </a>
         );
diff --git a/components/showcard.tsx b/components/showcard.tsx
index 6c92b5c..17bcecf 100644
--- a/components/showcard.tsx
+++ b/components/showcard.tsx
@@ -76,7 +76,7 @@ const TitleInfo = ({ show, isExpanded, index }: TitleInfoProps) => {
     >
       <p
         className={`w-fit rounded-sm px-2 text-base font-bold md:text-lg ${
-          index % 2 === 0 ? 'bg-orange' : 'bg-purple-dark'
+          index % 2 === 0 ? 'bg-coral' : 'bg-teal'
         }`}
       >
         {show.name}
@@ -96,13 +96,11 @@ interface DescriptionsProps {
 const Descriptions = ({ show, isExpanded }: DescriptionsProps) => {
   return (
     <div
-      className={`z-10 mt-auto flex flex-col overflow-y-auto rounded bg-purple-light p-4 text-left transition ease-in-out md:ml-auto md:mt-0 md:h-[20rem] xl:h-[25rem] ${
+      className={`z-10 mt-auto flex flex-col overflow-y-auto rounded bg-blue-dark p-4 text-left transition ease-in-out md:ml-auto md:mt-0 md:h-[20rem] xl:h-[25rem] ${
         isExpanded ? 'opacity-100' : 'opacity-0'
       }`}
     >
-      <h2 className="text-base font-bold text-greyish sm:text-lg">
-        {show.name}
-      </h2>
+      <h2 className="text-base font-bold text-teal sm:text-lg">{show.name}</h2>
       <h3 className="mt-2 text-sm font-bold text-white sm:text-base">
         Juontaa: {show.hosts ?? 'Haamujuontaja'}
       </h3>
diff --git a/components/showlist.tsx b/components/showlist.tsx
index 22b4a5a..f7ff961 100644
--- a/components/showlist.tsx
+++ b/components/showlist.tsx
@@ -21,7 +21,7 @@ export const Showlist = ({ showsByDate, weekKeys }: ShowlistProps) => {
   return (
     <div className="mx-auto flex flex-col items-center py-6 pr-[25px] lg:pl-[25px]">
       <div className="flex w-full lg:max-w-[70%] xl:max-w-[57rem]">
-        <h1 className="mt-6 w-auto pl-6 text-xl font-bold text-greyish md:text-3xl lg:pl-0">
+        <h1 className="mt-6 w-auto pl-6 text-xl font-bold text-coral md:text-3xl lg:pl-0">
           Ohjelmistossa
         </h1>
         {isDesktop && (
diff --git a/components/sponsors.tsx b/components/sponsors.tsx
index 399dc76..3466e6f 100644
--- a/components/sponsors.tsx
+++ b/components/sponsors.tsx
@@ -8,8 +8,8 @@ const Sponsors = ({ sponsors = [] }: SponsorProps) => {
   }
 
   return (
-    <div className="flex max-w-full flex-col items-center bg-purple-light pb-14 pt-4">
-      <h2 className="w-full max-w-5xl px-8 py-4 text-2xl font-bold text-greyish">
+    <div className="flex max-w-full flex-col items-center bg-blue pb-14 pt-4">
+      <h2 className="w-full max-w-5xl px-8 py-4 text-2xl font-bold text-coral">
         Turun Wappuradion tukena
       </h2>
       <div className="flex w-full max-w-5xl flex-wrap justify-center">
diff --git a/components/videoPlayer.tsx b/components/videoPlayer.tsx
index 69c46f9..5c6f495 100644
--- a/components/videoPlayer.tsx
+++ b/components/videoPlayer.tsx
@@ -15,7 +15,7 @@ const VideoPlayer = () => {
           <button
             onClick={handleClose}
             title="chat"
-            className="mr-5 mt-5 h-10 w-10 rounded-full bg-orange"
+            className="mr-5 mt-5 h-10 w-10 rounded-full bg-coral"
           >
             <GrFormClose size="1.7rem" className="mx-auto" />
           </button>
diff --git a/components/volumeSlider.tsx b/components/volumeSlider.tsx
index 10145d6..408f136 100644
--- a/components/volumeSlider.tsx
+++ b/components/volumeSlider.tsx
@@ -22,8 +22,8 @@ const VolumeSlider = ({ volume, onVolumeChange, muted }: VolumeSliderProps) => {
       className={`transparent h-1 w-[6.66rem] appearance-none rounded-lg
           ${
             muted
-              ? 'bg-purple-darkest [&::-moz-range-thumb]:bg-purple-darkest [&::-webkit-slider-thumb]:bg-purple-darkest'
-              : 'bg-orange [&::-moz-range-thumb]:bg-orange [&::-webkit-slider-thumb]:bg-orange'
+              ? 'bg-teal [&::-moz-range-thumb]:bg-teal [&::-webkit-slider-thumb]:bg-teal'
+              : 'bg-coral [&::-moz-range-thumb]:bg-coral [&::-webkit-slider-thumb]:bg-coral'
           }
           [&::-moz-range-thumb]:h-5 [&::-moz-range-thumb]:w-5
           [&::-moz-range-thumb]:cursor-pointer [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-none
diff --git a/components/widescreen-card.tsx b/components/widescreen-card.tsx
index a65ee73..6254369 100644
--- a/components/widescreen-card.tsx
+++ b/components/widescreen-card.tsx
@@ -14,11 +14,11 @@ export const WideScreencard = ({
   showLength,
 }: WideScreenCardProps) => {
   const getBackgroundColor = () => {
-    if (!color) return 'bg-orange';
+    if (!color) return 'bg-coral';
     else if (color === Color.Promote) {
-      return 'bg-purple-dark';
+      return 'bg-teal';
     } else if (color === Color.Night) {
-      return 'bg-purple-light';
+      return 'bg-blue-lightest';
     }
   };
 
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 66f63b0..92bb4f4 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -50,7 +50,7 @@ const MyApp = ({ Component, pageProps }: AppProps) => {
         onPlayPause={handlePlayPause}
       />
       <div className="fixed bottom-0 z-50 w-full">
-        <div className="flex flex-col bg-purple-darkest md:flex-row">
+        <div className="flex flex-col bg-blue-darkest md:flex-row">
           <VideoPlayer />
           <ChatWrapper />
         </div>
diff --git a/pages/_document.tsx b/pages/_document.tsx
index 9238437..7564e6d 100644
--- a/pages/_document.tsx
+++ b/pages/_document.tsx
@@ -70,7 +70,7 @@ class MyDocument extends Document {
           <link rel="apple-touch-icon" sizes="192x192" href="/logo@192.png" />
           <link rel="apple-touch-icon" sizes="512x512" href="/logo@512.png" />
         </Head>
-        <body className="bg-purple-darkest bg-gradient-to-b from-purple-darkest to-purple-light">
+        <body className="bg-blue bg-gradient-to-b from-blue to-blue-light">
           <Main />
           <NextScript />
         </body>
diff --git a/pages/arkisto/[showlistId].tsx b/pages/arkisto/[showlistId].tsx
index 7e16a47..a502f38 100644
--- a/pages/arkisto/[showlistId].tsx
+++ b/pages/arkisto/[showlistId].tsx
@@ -64,7 +64,7 @@ export const ShowListPage: NextPage<ShowListPageProps> = ({
       />
       <div className="mx-auto flex max-w-6xl flex-col py-6">
         <Link href="/arkisto">
-          <a className="my-6 ml-28 mr-auto flex font-bold text-orange transition hover:text-coral">
+          <a className="my-6 ml-28 mr-auto flex font-bold text-teal transition hover:text-coral">
             <BsArrowLeft className="mr-2 h-6 w-6" />
             Kaikki ohjelmakartat
           </a>
diff --git a/pages/arkisto/index.tsx b/pages/arkisto/index.tsx
index f6a8f56..bfa5d6f 100644
--- a/pages/arkisto/index.tsx
+++ b/pages/arkisto/index.tsx
@@ -50,8 +50,8 @@ const ArchivePage: NextPage<ArchivePageProps> = ({
         navigationItems={navigationItems}
         isCompact={true}
       />
-      <article className="mx-auto max-w-4xl px-4 pb-20 pt-12 text-white">
-        <h1 className="my-4 text-3xl font-bold text-greyish">
+      <article className="mx-auto max-w-4xl px-4 pt-12 pb-20 text-white">
+        <h1 className="my-4 text-3xl font-bold text-coral">
           Menneet lähetykset
         </h1>
 
@@ -69,7 +69,7 @@ const ShowListCard = ({ showList }: { showList: ShowList }) => {
 
   return (
     <Link href={`/arkisto/${id}`}>
-      <a className="group my-4 flex flex-col overflow-hidden rounded bg-purple-darkest transition hover:scale-[1.03] md:flex-row">
+      <a className="group my-4 flex flex-col overflow-hidden rounded bg-blue-dark transition hover:scale-[1.03] md:flex-row">
         <div className="relative inline h-40 w-full max-w-full shrink-0 grow-0 md:h-48 md:w-64">
           <Image
             src={coverImage.url}
@@ -80,9 +80,9 @@ const ShowListCard = ({ showList }: { showList: ShowList }) => {
           />
         </div>
         <div className="flex flex-col p-4 md:p-6">
-          <h2 className="mb-2 text-xl font-bold text-greyish">{name}</h2>
+          <h2 className="mb-2 text-xl font-bold text-coral">{name}</h2>
           {shortDescription}
-          <div className="ml-auto mt-auto flex items-center pt-2 font-bold text-orange">
+          <div className="mt-auto ml-auto flex items-center pt-2 font-bold text-teal">
             Ohjelmakartta
             <BsArrowRight className="ml-2 h-6 w-6" />
           </div>
diff --git a/pages/index.tsx b/pages/index.tsx
index edb5bce..b62897f 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -7,15 +7,15 @@ import {
   NavigationItem,
   Show,
 } from 'contentful/client';
-// import { contentfulImageLoader } from 'contentful/contentfulImageLoader';
-// import RichText from 'components/richtext';
+import { contentfulImageLoader } from 'contentful/contentfulImageLoader';
+import RichText from 'components/richtext';
 import Hero from 'components/hero';
 import { IndexDocument, IndexQuery } from 'contentful/graphql/index.graphql';
 import Footer from 'components/footer';
-// import Image from 'next/image';
-// import Calendar from 'components/calendar';
+import Image from 'next/image';
+import Calendar from 'components/calendar';
 import Sponsors, { ISponsorData } from 'components/sponsors';
-import { Showlist } from 'components/showlist';
+// import { Showlist } from 'components/showlist';
 import Player from 'components/player';
 import { fetchShowlist } from 'google/client';
 
@@ -33,8 +33,8 @@ interface IndexProps {
   heroButtonText: string;
   heroButtonLink: string;
   navigationItems: NavigationItem[];
-  showsByDate: Record<string, Show[]>;
-  weekKeys: Record<string, string[]>;
+  // showsByDate: Record<string, Show[]>;
+  // weekKeys: Record<string, string[]>;
   firstDecorativeImage: {
     url?: string;
     width?: number;
@@ -63,18 +63,18 @@ const Index: NextPage<IndexProps & PlayerControls> = ({
   heroButtonText,
   heroButtonLink,
   navigationItems,
-  showsByDate,
-  weekKeys,
-  // firstDecorativeImage,
-  // secondDecorativeImage,
-  // firstContent,
-  // secondContent,
-  // thirdContent,
+  // showsByDate,
+  // weekKeys,
+  firstDecorativeImage,
+  secondDecorativeImage,
+  firstContent,
+  secondContent,
+  thirdContent,
   sponsors,
-  playing,
-  onPlayPause,
-  muted,
-  onMute,
+  // playing,
+  // onPlayPause,
+  // muted,
+  // onMute,
 }) => {
   return (
     <div className="min-h-screen w-full">
@@ -97,7 +97,7 @@ const Index: NextPage<IndexProps & PlayerControls> = ({
         navigationItems={navigationItems}
         isCompact={isPlayerLive}
       />
-      {isPlayerLive && (
+      {/* {isPlayerLive && (
         <Player
           playing={playing}
           onPlayPause={onPlayPause}
@@ -105,12 +105,12 @@ const Index: NextPage<IndexProps & PlayerControls> = ({
           onMute={onMute}
           showsByDate={showsByDate}
         />
-      )}
+      )} */}
 
-      <Showlist showsByDate={showsByDate} weekKeys={weekKeys} />
+      {/* <Showlist showsByDate={showsByDate} weekKeys={weekKeys} /> */}
 
       {/* First section */}
-      {/* <main className="flex flex-wrap-reverse items-center justify-center py-4 md:py-8">
+      <main className="flex flex-wrap-reverse items-center justify-center py-4 md:py-8">
         <div className="relative m-10 h-48 w-128 max-w-full md:m-8 md:h-96">
           <Image
             src={firstDecorativeImage.url}
@@ -124,18 +124,18 @@ const Index: NextPage<IndexProps & PlayerControls> = ({
         <section className="m-4 w-128 max-w-full text-lg text-white md:m-8">
           <RichText content={firstContent} />
         </section>
-      </main> */}
+      </main>
 
       {/* Second section */}
-      {/* <div className="min-h-32 flex w-full flex-wrap items-center justify-center bg-purple-darkest py-4 md:py-8">
+      <div className="min-h-32 flex w-full flex-wrap items-center justify-center bg-blue-dark py-4 md:py-8">
         <section className="m-4 w-128 max-w-full text-base text-white md:m-8">
           <RichText content={secondContent} />
         </section>
         <Calendar />
-      </div> */}
+      </div>
 
       {/* Third section */}
-      {/* <div className="flex flex-wrap items-center justify-center py-4 md:py-8">
+      <div className="flex flex-wrap items-center justify-center py-4 md:py-8">
         <section className="m-4 w-128 max-w-full text-base text-white md:m-8">
           <RichText content={thirdContent} />
         </section>
@@ -149,7 +149,7 @@ const Index: NextPage<IndexProps & PlayerControls> = ({
             alt=""
           />
         </div>
-      </div> */}
+      </div>
       <Sponsors sponsors={sponsors} />
       <Footer navigationItems={navigationItems} />
     </div>
@@ -176,7 +176,7 @@ export const getStaticProps: GetStaticProps<IndexProps> = async () => {
 
   const navigationItems = await fetchNavigationItems();
 
-  const { showsByDate, weekKeys } = await fetchShowlist();
+  // const { showsByDate, weekKeys } = await fetchShowlist();
 
   return {
     props: {
@@ -186,8 +186,8 @@ export const getStaticProps: GetStaticProps<IndexProps> = async () => {
       heroButtonText,
       heroButtonLink,
       navigationItems,
-      showsByDate,
-      weekKeys,
+      // showsByDate,
+      // weekKeys,
       firstDecorativeImage,
       secondDecorativeImage,
       firstContent,
diff --git a/tailwind.config.js b/tailwind.config.js
index f7fc65b..f93b439 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -19,6 +19,9 @@ module.exports = {
       orange: {
         DEFAULT: '#db8841',
       },
+      orange: {
+        DEFAULT: '#db8841',
+      },
       purple: {
         light: '#58265d',
         dark: '#9b3970',