From d9ba6684839bbec670f1871a5e790179ed6b9d08 Mon Sep 17 00:00:00 2001
From: BeatnikAU <contact@beatnik.id.au>
Date: Sat, 14 Jun 2025 13:20:12 +0930
Subject: [PATCH 1/2] Added simple party browser source options

---
 .../Overlays/Simple Elements/README.md        |  24 +
 .../Simple Elements/Resources/party_1x6.css   | 362 ++++++++++++
 .../Simple Elements/Resources/party_2x3.css   | 374 ++++++++++++
 .../Simple Elements/Resources/party_3x2.css   | 370 ++++++++++++
 .../Simple Elements/Resources/party_6x1.css   | 530 ++++++++++++++++++
 .../Overlays/Simple Elements/party_1x6.html   | 275 +++++++++
 .../Overlays/Simple Elements/party_2x3.html   | 283 ++++++++++
 .../Overlays/Simple Elements/party_3x2.html   | 279 +++++++++
 .../Overlays/Simple Elements/party_6x1.html   | 275 +++++++++
 9 files changed, 2772 insertions(+)
 create mode 100644 Stream Tool/Overlays/Simple Elements/README.md
 create mode 100755 Stream Tool/Overlays/Simple Elements/Resources/party_1x6.css
 create mode 100755 Stream Tool/Overlays/Simple Elements/Resources/party_2x3.css
 create mode 100755 Stream Tool/Overlays/Simple Elements/Resources/party_3x2.css
 create mode 100755 Stream Tool/Overlays/Simple Elements/Resources/party_6x1.css
 create mode 100755 Stream Tool/Overlays/Simple Elements/party_1x6.html
 create mode 100755 Stream Tool/Overlays/Simple Elements/party_2x3.html
 create mode 100755 Stream Tool/Overlays/Simple Elements/party_3x2.html
 create mode 100755 Stream Tool/Overlays/Simple Elements/party_6x1.html

diff --git a/Stream Tool/Overlays/Simple Elements/README.md b/Stream Tool/Overlays/Simple Elements/README.md
new file mode 100644
index 00000000..cd07b6fc
--- /dev/null
+++ b/Stream Tool/Overlays/Simple Elements/README.md	
@@ -0,0 +1,24 @@
+# Simple Elements
+
+This is a collection of elements from the example overlays, so that you can add them to existing scenes in your streaming software if you already have them. Like other overlays, just drag the html file into OBS.
+
+> [!NOTE]
+> These all use absolute sizing, so if you have any weird cropping, update the properties of the source with the width and height for the respective layout from the list below. 
+
+## Pokemon Party
+
+**3x2 layout**  
+width:  960  
+height: 337  
+
+**2X3 layout**  
+width:  640  
+height: 487 
+
+**6x1 layout**  
+width:  1970  
+height: 187  
+
+**1x6 layout**  
+width:  320  
+height: 880  
\ No newline at end of file
diff --git a/Stream Tool/Overlays/Simple Elements/Resources/party_1x6.css b/Stream Tool/Overlays/Simple Elements/Resources/party_1x6.css
new file mode 100755
index 00000000..78db8803
--- /dev/null
+++ b/Stream Tool/Overlays/Simple Elements/Resources/party_1x6.css	
@@ -0,0 +1,362 @@
+@font-face {
+    font-family: "FontBold";
+    src: url('../../../Resources/Fonts/RobotoCondensed-Bold.ttf');
+}
+@font-face {
+    font-family: "FontMain";
+    src: url('../../../Resources/Fonts/RobotoCondensed-SemiBold.ttf');
+}
+@font-face {
+    font-family: "FontMedium";
+    src: url('../../../Resources/Fonts/RobotoCondensed-Medium.ttf');
+}
+
+* {
+    box-sizing: border-box;
+}
+
+html, body {
+    padding: 0;
+    margin: 0;
+    font-family: "FontMain";
+}
+
+#content {
+    width: 320px;
+    height: 880px;
+}
+
+.absol {
+    position: absolute;
+}
+
+
+/* Non-Trainer battle pokemon Section */
+
+#colPokes {
+    position: absolute;
+    left: 10px;
+    top: 10px;
+    height: 860px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    gap: 30px;
+    color: #f8f8f8;
+}
+
+.pokeDiv {
+    --healthy: #337E11;
+    --warning: #7e7c11;
+    --danger: #7e1111;
+    --Par: var(--warning);
+    --Poi: #56117e;
+    --Fro: #1a8fa3;
+    --Bur: #7e4611;
+    --Sle: grey;
+    --activeColor: var(--healthy);
+    position: relative;
+    height: 120px;
+    width: 300px;
+    border: thick double var(--activeColor);
+    overflow: visible;
+    border-radius: 30% / 100% 100% 100% 100%;
+    transition: opacity .25s, margin-left .6s;
+}
+.pokeFai, .pokeDed {
+    --activeColor: var(--danger) !important;
+    filter: grayscale(.8) brightness(.8) !important;
+}
+.pokePar {
+    --activeColor: var(--warning) !important;
+}
+.pokePoi {
+    --activeColor: var(--Poi) !important;
+}
+.pokeFro {
+    --activeColor: var(--Fro) !important;
+}
+.pokeBur {
+    --activeColor: var(--Bur) !important;
+}
+.pokeSle {
+    --activeColor: var(--Sle) !important;
+}
+.pokeDivInCombat {
+    .pokeDivMask {
+        .pokeHpDiv {
+            transform: translateY(0px);
+        }
+    }
+    .pokeTexts {
+        transform: translateY(0px);
+    }
+}
+.pokeDivOutOfCombat { 
+    .pokeDivMask {
+        .pokeHpDiv {
+            transform: translateY(25px);
+        }
+    }
+    .pokeTexts {
+        transform: translateY(8px);
+    }
+}
+
+
+.pokeTexts {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    margin-left: 20px;
+    text-shadow: 0px 0px 5px black;
+    transition: transform .5s;
+}
+
+.pokeDivMask {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    border-radius: 27% / 100% 100% 100% 100%;
+    overflow: hidden;
+}
+
+.pokeLvlDiv {
+    display: flex;
+}
+
+.pokeLvlBefore {
+    background-color: var(--activeColor);
+    width: 26px;
+}
+.pokeLvlTexts {
+    display: flex;
+    gap: 3px;
+    background-color: var(--activeColor);
+    padding: 2px 0px 2px 5px;
+    align-items: center;
+    font-size: 16px;
+}
+.pokeLvlAfter {
+    background-color: var(--activeColor);
+    width: 20px;
+    border-bottom-right-radius: 100%;
+}
+
+
+.pokeNick {
+    font-size: 30px;
+}
+
+.pokeSubText {
+    display: flex;
+    gap: 6px;
+    font-size: 22px;
+    font-style: oblique 15deg;
+    padding-left: 5px;
+    margin-top: -3px;
+}
+
+
+.pokeHpDiv {
+    display: flex;
+    position: absolute;
+    bottom: 0px;
+    width: 100%;
+    --bacColor: #363636;
+    transition: transform .5s;
+}
+.pokeHpBefore {
+    background-color: var(--bacColor);
+    width: 26px;
+    flex-shrink: 0;
+}
+.pokeHpText {
+    display: flex;
+    justify-content: center;
+    width: 55px;
+    background-color: var(--bacColor);
+    padding: 2px 0px 1px 5px;
+    z-index: 2;
+    flex-shrink: 0;
+    text-wrap: nowrap;
+    color: #b6b6b6;
+    font-size: 16px;
+}
+.pokeHpAfter {
+    background-color: var(--bacColor);
+    width: 24px;
+    margin-left: -17px;
+    border-top-right-radius: 50%;
+    z-index: 1;
+    flex-shrink: 0;
+}
+
+.pokeHpBar {
+    background-color: var(--bacColor);
+    width: 50%;
+    height: 11px;
+    transform: translateY(12px);
+    border-radius: 10% / 0 100% 0 0;
+    border: 4px solid var(--bacColor);
+    border-right: 6px solid var(--bacColor);
+    border-left: none;
+    overflow: hidden;
+}
+.hpBar {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
+.pokeHpBarTotal {
+    background-color: grey;
+}
+.pokeHpBarCurrent {
+    background-color: var(--activeColor);
+    filter: brightness(1.7);
+}
+
+
+.pokeImgDiv {
+    position: absolute;
+    right: 30px;
+    display: flex;
+    justify-content: right;
+    align-items: center;
+    clip-path: inset(-100px -100px 0px -100px);
+    width: 200px;
+    height: 100%;
+}
+.pokeImg {
+    transform: scale(2);
+    image-rendering: pixelated;
+}
+
+
+/** Other */
+
+.flipBack {
+    transform: scaleX(-1);
+}
+
+#connErrorDiv {
+    display: none;
+    width: 100%;
+    height: 80px;
+    position: absolute;
+    bottom: 0;
+    background: linear-gradient(to top, black, rgba(0, 0, 0, 0));
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    font-size: 28px;
+    color: lightcoral;
+    text-shadow: 0px 0px 5px black;
+}
+
+
+/* Animations! */
+@keyframes slideOut {
+    from {
+        opacity: 1;
+        transform: translateX(0px);
+    }
+    to {
+        opacity: 0;
+        transform: translateX(-40px);
+    }
+}
+
+@keyframes slideIn {
+    from {
+        opacity: 0;
+        transform: translateX(-40px);
+    }
+    to {
+        opacity: 1;
+        transform: translateX(0px);
+    }
+}
+
+@keyframes hidePokes {
+    from {
+        opacity: 1;
+        transform: translateY(0px);
+    }
+    to {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+}
+@keyframes showPokes {
+    from {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0px);
+    }
+}
+
+@keyframes iDontFeelSoGood {
+    from {opacity: 1;}
+    to {opacity: 0;}
+}
+
+@keyframes shake {
+    0% { transform: translate(1px, 1px); filter: brightness(1.3); }
+    10% { transform: translate(1px, -2px); }
+    20% { transform: translate(-1px, 0px); }
+    30% { transform: translate(1px, 1px); }
+    40% { transform: translate(2px, -1px); }
+    50% { transform: translate(0px, 1px); }
+    60% { transform: translate(-1px, 0px); }
+    70% { transform: translate(1px, 1px); filter: brightness(1); }
+    80% { transform: translate(-1px, -1px); }
+    90% { transform: translate(1px, 0px); }
+    100% { transform: translate(0px, -1px); }
+}
+
+@keyframes megaAnim {
+    0% {filter: brightness(1);}
+    85% {filter: brightness(15);}
+    100% {filter: brightness(1);}
+}
+
+
+@keyframes trainerIntroFull {
+    0% {transform: translateY(20px);}
+    35% {transform: translateY(20px);}
+    45% {transform: translateY(0px);}
+}
+@keyframes trainerIntroTopBar {
+    0% {transform: translateX(-100%);}
+    15% {transform: translateX(0%);}
+    85% {transform: translateX(0%);}
+    100% {transform: translateX(100%);}
+}
+@keyframes trainerIntroBotBar {
+    0% {transform: translateX(100%);}
+    15% {transform: translateX(0%);}
+    85% {transform: translateX(0%);}
+    100% {transform: translateX(-100%);}
+}
+@keyframes trainerIntroTexts {
+    0% {transform: translateX(40px); opacity: 0;}
+    5% {transform: translateX(40px); opacity: 0;}
+    15% {transform: translateX(0px); opacity: 1;}
+    85% {transform: translateX(0px); opacity: 1;}
+    95% {transform: translateX(-40px); opacity: 0;}
+    100% {transform: translateX(-40px); opacity: 0;}
+}
+
+@keyframes trainerIntroCount {
+    0% {opacity: 0;}
+    35% {opacity: 0;}
+    45% {opacity: 1;}
+    90% {opacity: 1;}
+    100% {opacity: 0;}
+}
diff --git a/Stream Tool/Overlays/Simple Elements/Resources/party_2x3.css b/Stream Tool/Overlays/Simple Elements/Resources/party_2x3.css
new file mode 100755
index 00000000..cd41a08f
--- /dev/null
+++ b/Stream Tool/Overlays/Simple Elements/Resources/party_2x3.css	
@@ -0,0 +1,374 @@
+@font-face {
+    font-family: "FontBold";
+    src: url('../../../Resources/Fonts/RobotoCondensed-Bold.ttf');
+}
+@font-face {
+    font-family: "FontMain";
+    src: url('../../../Resources/Fonts/RobotoCondensed-SemiBold.ttf');
+}
+@font-face {
+    font-family: "FontMedium";
+    src: url('../../../Resources/Fonts/RobotoCondensed-Medium.ttf');
+}
+
+* {
+    box-sizing: border-box;
+}
+
+html, body {
+    padding: 0;
+    margin: 0;
+    font-family: "FontMain";
+}
+
+#content {
+    width: 100%;
+    height: 100%;
+}
+
+.absol {
+    position: absolute;
+}
+
+
+/* Non-Trainer battle pokemon Section */
+
+#topPokes, #midPokes, #botPokes {
+    position: absolute;
+    left: 0px;
+    width: 640px;
+    height: 187px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 15px;
+    color: #f8f8f8;
+}
+
+#topPokes {
+    top: 0px;
+}
+
+#midPokes {
+    top: 150px;
+}
+
+#botPokes {
+    top: 300px;
+}
+
+
+.pokeDiv {
+    --healthy: #337E11;
+    --warning: #7e7c11;
+    --danger: #7e1111;
+    --Par: var(--warning);
+    --Poi: #56117e;
+    --Fro: #1a8fa3;
+    --Bur: #7e4611;
+    --Sle: grey;
+    --activeColor: var(--healthy);
+    position: relative;
+    height: 120px;
+    width: 300px;
+    border: thick double var(--activeColor);
+    overflow: visible;
+    border-radius: 30% / 100% 100% 100% 100%;
+    transition: opacity .25s, margin-left .6s;
+}
+.pokeFai, .pokeDed {
+    --activeColor: var(--danger) !important;
+    filter: grayscale(.8) brightness(.8) !important;
+}
+.pokePar {
+    --activeColor: var(--warning) !important;
+}
+.pokePoi {
+    --activeColor: var(--Poi) !important;
+}
+.pokeFro {
+    --activeColor: var(--Fro) !important;
+}
+.pokeBur {
+    --activeColor: var(--Bur) !important;
+}
+.pokeSle {
+    --activeColor: var(--Sle) !important;
+}
+.pokeDivInCombat {
+    .pokeDivMask {
+        .pokeHpDiv {
+            transform: translateY(0px);
+        }
+    }
+    .pokeTexts {
+        transform: translateY(0px);
+    }
+}
+.pokeDivOutOfCombat { 
+    .pokeDivMask {
+        .pokeHpDiv {
+            transform: translateY(25px);
+        }
+    }
+    .pokeTexts {
+        transform: translateY(8px);
+    }
+}
+
+
+.pokeTexts {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    margin-left: 20px;
+    text-shadow: 0px 0px 5px black;
+    transition: transform .5s;
+}
+
+.pokeDivMask {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    border-radius: 27% / 100% 100% 100% 100%;
+    overflow: hidden;
+}
+
+.pokeLvlDiv {
+    display: flex;
+}
+
+.pokeLvlBefore {
+    background-color: var(--activeColor);
+    width: 26px;
+}
+.pokeLvlTexts {
+    display: flex;
+    gap: 3px;
+    background-color: var(--activeColor);
+    padding: 2px 0px 2px 5px;
+    align-items: center;
+    font-size: 16px;
+}
+.pokeLvlAfter {
+    background-color: var(--activeColor);
+    width: 20px;
+    border-bottom-right-radius: 100%;
+}
+
+
+.pokeNick {
+    font-size: 30px;
+}
+
+.pokeSubText {
+    display: flex;
+    gap: 6px;
+    font-size: 22px;
+    font-style: oblique 15deg;
+    padding-left: 5px;
+    margin-top: -3px;
+}
+
+
+.pokeHpDiv {
+    display: flex;
+    position: absolute;
+    bottom: 0px;
+    width: 100%;
+    --bacColor: #363636;
+    transition: transform .5s;
+}
+.pokeHpBefore {
+    background-color: var(--bacColor);
+    width: 26px;
+    flex-shrink: 0;
+}
+.pokeHpText {
+    display: flex;
+    justify-content: center;
+    width: 55px;
+    background-color: var(--bacColor);
+    padding: 2px 0px 1px 5px;
+    z-index: 2;
+    flex-shrink: 0;
+    text-wrap: nowrap;
+    color: #b6b6b6;
+    font-size: 16px;
+}
+.pokeHpAfter {
+    background-color: var(--bacColor);
+    width: 24px;
+    margin-left: -17px;
+    border-top-right-radius: 50%;
+    z-index: 1;
+    flex-shrink: 0;
+}
+
+.pokeHpBar {
+    background-color: var(--bacColor);
+    width: 50%;
+    height: 11px;
+    transform: translateY(12px);
+    border-radius: 10% / 0 100% 0 0;
+    border: 4px solid var(--bacColor);
+    border-right: 6px solid var(--bacColor);
+    border-left: none;
+    overflow: hidden;
+}
+.hpBar {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
+.pokeHpBarTotal {
+    background-color: grey;
+}
+.pokeHpBarCurrent {
+    background-color: var(--activeColor);
+    filter: brightness(1.7);
+}
+
+
+.pokeImgDiv {
+    position: absolute;
+    right: 30px;
+    display: flex;
+    justify-content: right;
+    align-items: center;
+    clip-path: inset(-100px -100px 0px -100px);
+    width: 200px;
+    height: 100%;
+}
+.pokeImg {
+    transform: scale(2);
+    image-rendering: pixelated;
+}
+
+
+/** Other */
+
+.flipBack {
+    transform: scaleX(-1);
+}
+
+#connErrorDiv {
+    display: none;
+    width: 100%;
+    height: 80px;
+    position: absolute;
+    bottom: 0;
+    background: linear-gradient(to top, black, rgba(0, 0, 0, 0));
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    font-size: 28px;
+    color: lightcoral;
+    text-shadow: 0px 0px 5px black;
+}
+
+
+/* Animations! */
+@keyframes slideOut {
+    from {
+        opacity: 1;
+        transform: translateX(0px);
+    }
+    to {
+        opacity: 0;
+        transform: translateX(-40px);
+    }
+}
+
+@keyframes slideIn {
+    from {
+        opacity: 0;
+        transform: translateX(-40px);
+    }
+    to {
+        opacity: 1;
+        transform: translateX(0px);
+    }
+}
+
+@keyframes hidePokes {
+    from {
+        opacity: 1;
+        transform: translateY(0px);
+    }
+    to {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+}
+@keyframes showPokes {
+    from {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0px);
+    }
+}
+
+@keyframes iDontFeelSoGood {
+    from {opacity: 1;}
+    to {opacity: 0;}
+}
+
+@keyframes shake {
+    0% { transform: translate(1px, 1px); filter: brightness(1.3); }
+    10% { transform: translate(1px, -2px); }
+    20% { transform: translate(-1px, 0px); }
+    30% { transform: translate(1px, 1px); }
+    40% { transform: translate(2px, -1px); }
+    50% { transform: translate(0px, 1px); }
+    60% { transform: translate(-1px, 0px); }
+    70% { transform: translate(1px, 1px); filter: brightness(1); }
+    80% { transform: translate(-1px, -1px); }
+    90% { transform: translate(1px, 0px); }
+    100% { transform: translate(0px, -1px); }
+}
+
+@keyframes megaAnim {
+    0% {filter: brightness(1);}
+    85% {filter: brightness(15);}
+    100% {filter: brightness(1);}
+}
+
+
+@keyframes trainerIntroFull {
+    0% {transform: translateY(20px);}
+    35% {transform: translateY(20px);}
+    45% {transform: translateY(0px);}
+}
+@keyframes trainerIntroTopBar {
+    0% {transform: translateX(-100%);}
+    15% {transform: translateX(0%);}
+    85% {transform: translateX(0%);}
+    100% {transform: translateX(100%);}
+}
+@keyframes trainerIntroBotBar {
+    0% {transform: translateX(100%);}
+    15% {transform: translateX(0%);}
+    85% {transform: translateX(0%);}
+    100% {transform: translateX(-100%);}
+}
+@keyframes trainerIntroTexts {
+    0% {transform: translateX(40px); opacity: 0;}
+    5% {transform: translateX(40px); opacity: 0;}
+    15% {transform: translateX(0px); opacity: 1;}
+    85% {transform: translateX(0px); opacity: 1;}
+    95% {transform: translateX(-40px); opacity: 0;}
+    100% {transform: translateX(-40px); opacity: 0;}
+}
+
+@keyframes trainerIntroCount {
+    0% {opacity: 0;}
+    35% {opacity: 0;}
+    45% {opacity: 1;}
+    90% {opacity: 1;}
+    100% {opacity: 0;}
+}
diff --git a/Stream Tool/Overlays/Simple Elements/Resources/party_3x2.css b/Stream Tool/Overlays/Simple Elements/Resources/party_3x2.css
new file mode 100755
index 00000000..99982443
--- /dev/null
+++ b/Stream Tool/Overlays/Simple Elements/Resources/party_3x2.css	
@@ -0,0 +1,370 @@
+@font-face {
+    font-family: "FontBold";
+    src: url('../../../Resources/Fonts/RobotoCondensed-Bold.ttf');
+}
+@font-face {
+    font-family: "FontMain";
+    src: url('../../../Resources/Fonts/RobotoCondensed-SemiBold.ttf');
+}
+@font-face {
+    font-family: "FontMedium";
+    src: url('../../../Resources/Fonts/RobotoCondensed-Medium.ttf');
+}
+
+* {
+    box-sizing: border-box;
+}
+
+html, body {
+    padding: 0;
+    margin: 0;
+    font-family: "FontMain";
+}
+
+#content {
+    width: 100%;
+    height: 100%;
+}
+
+.absol {
+    position: absolute;
+}
+
+
+/* Non-Trainer battle pokemon Section */
+
+#topPokes, #botPokes {
+    position: absolute;
+    left: 0px;
+    width: 960px;
+    height: 187px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 15px;
+    color: #f8f8f8;
+}
+
+#topPokes {
+    top: 0px;
+}
+
+#botPokes {
+    top: 150px;
+}
+
+
+.pokeDiv {
+    --healthy: #337E11;
+    --warning: #7e7c11;
+    --danger: #7e1111;
+    --Par: var(--warning);
+    --Poi: #56117e;
+    --Fro: #1a8fa3;
+    --Bur: #7e4611;
+    --Sle: grey;
+    --activeColor: var(--healthy);
+    position: relative;
+    height: 120px;
+    width: 300px;
+    border: thick double var(--activeColor);
+    overflow: visible;
+    border-radius: 30% / 100% 100% 100% 100%;
+    transition: opacity .25s, margin-left .6s;
+}
+.pokeFai, .pokeDed {
+    --activeColor: var(--danger) !important;
+    filter: grayscale(.8) brightness(.8) !important;
+}
+.pokePar {
+    --activeColor: var(--warning) !important;
+}
+.pokePoi {
+    --activeColor: var(--Poi) !important;
+}
+.pokeFro {
+    --activeColor: var(--Fro) !important;
+}
+.pokeBur {
+    --activeColor: var(--Bur) !important;
+}
+.pokeSle {
+    --activeColor: var(--Sle) !important;
+}
+.pokeDivInCombat {
+    .pokeDivMask {
+        .pokeHpDiv {
+            transform: translateY(0px);
+        }
+    }
+    .pokeTexts {
+        transform: translateY(0px);
+    }
+}
+.pokeDivOutOfCombat { 
+    .pokeDivMask {
+        .pokeHpDiv {
+            transform: translateY(25px);
+        }
+    }
+    .pokeTexts {
+        transform: translateY(8px);
+    }
+}
+
+
+.pokeTexts {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    margin-left: 20px;
+    text-shadow: 0px 0px 5px black;
+    transition: transform .5s;
+}
+
+.pokeDivMask {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    border-radius: 27% / 100% 100% 100% 100%;
+    overflow: hidden;
+}
+
+.pokeLvlDiv {
+    display: flex;
+}
+
+.pokeLvlBefore {
+    background-color: var(--activeColor);
+    width: 26px;
+}
+.pokeLvlTexts {
+    display: flex;
+    gap: 3px;
+    background-color: var(--activeColor);
+    padding: 2px 0px 2px 5px;
+    align-items: center;
+    font-size: 16px;
+}
+.pokeLvlAfter {
+    background-color: var(--activeColor);
+    width: 20px;
+    border-bottom-right-radius: 100%;
+}
+
+
+.pokeNick {
+    font-size: 30px;
+}
+
+.pokeSubText {
+    display: flex;
+    gap: 6px;
+    font-size: 22px;
+    font-style: oblique 15deg;
+    padding-left: 5px;
+    margin-top: -3px;
+}
+
+
+.pokeHpDiv {
+    display: flex;
+    position: absolute;
+    bottom: 0px;
+    width: 100%;
+    --bacColor: #363636;
+    transition: transform .5s;
+}
+.pokeHpBefore {
+    background-color: var(--bacColor);
+    width: 26px;
+    flex-shrink: 0;
+}
+.pokeHpText {
+    display: flex;
+    justify-content: center;
+    width: 55px;
+    background-color: var(--bacColor);
+    padding: 2px 0px 1px 5px;
+    z-index: 2;
+    flex-shrink: 0;
+    text-wrap: nowrap;
+    color: #b6b6b6;
+    font-size: 16px;
+}
+.pokeHpAfter {
+    background-color: var(--bacColor);
+    width: 24px;
+    margin-left: -17px;
+    border-top-right-radius: 50%;
+    z-index: 1;
+    flex-shrink: 0;
+}
+
+.pokeHpBar {
+    background-color: var(--bacColor);
+    width: 50%;
+    height: 11px;
+    transform: translateY(12px);
+    border-radius: 10% / 0 100% 0 0;
+    border: 4px solid var(--bacColor);
+    border-right: 6px solid var(--bacColor);
+    border-left: none;
+    overflow: hidden;
+}
+.hpBar {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
+.pokeHpBarTotal {
+    background-color: grey;
+}
+.pokeHpBarCurrent {
+    background-color: var(--activeColor);
+    filter: brightness(1.7);
+}
+
+
+.pokeImgDiv {
+    position: absolute;
+    right: 30px;
+    display: flex;
+    justify-content: right;
+    align-items: center;
+    clip-path: inset(-100px -100px 0px -100px);
+    width: 200px;
+    height: 100%;
+}
+.pokeImg {
+    transform: scale(2);
+    image-rendering: pixelated;
+}
+
+
+/** Other */
+
+.flipBack {
+    transform: scaleX(-1);
+}
+
+#connErrorDiv {
+    display: none;
+    width: 100%;
+    height: 80px;
+    position: absolute;
+    bottom: 0;
+    background: linear-gradient(to top, black, rgba(0, 0, 0, 0));
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    font-size: 28px;
+    color: lightcoral;
+    text-shadow: 0px 0px 5px black;
+}
+
+
+/* Animations! */
+@keyframes slideOut {
+    from {
+        opacity: 1;
+        transform: translateX(0px);
+    }
+    to {
+        opacity: 0;
+        transform: translateX(-40px);
+    }
+}
+
+@keyframes slideIn {
+    from {
+        opacity: 0;
+        transform: translateX(-40px);
+    }
+    to {
+        opacity: 1;
+        transform: translateX(0px);
+    }
+}
+
+@keyframes hidePokes {
+    from {
+        opacity: 1;
+        transform: translateY(0px);
+    }
+    to {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+}
+@keyframes showPokes {
+    from {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0px);
+    }
+}
+
+@keyframes iDontFeelSoGood {
+    from {opacity: 1;}
+    to {opacity: 0;}
+}
+
+@keyframes shake {
+    0% { transform: translate(1px, 1px); filter: brightness(1.3); }
+    10% { transform: translate(1px, -2px); }
+    20% { transform: translate(-1px, 0px); }
+    30% { transform: translate(1px, 1px); }
+    40% { transform: translate(2px, -1px); }
+    50% { transform: translate(0px, 1px); }
+    60% { transform: translate(-1px, 0px); }
+    70% { transform: translate(1px, 1px); filter: brightness(1); }
+    80% { transform: translate(-1px, -1px); }
+    90% { transform: translate(1px, 0px); }
+    100% { transform: translate(0px, -1px); }
+}
+
+@keyframes megaAnim {
+    0% {filter: brightness(1);}
+    85% {filter: brightness(15);}
+    100% {filter: brightness(1);}
+}
+
+
+@keyframes trainerIntroFull {
+    0% {transform: translateY(20px);}
+    35% {transform: translateY(20px);}
+    45% {transform: translateY(0px);}
+}
+@keyframes trainerIntroTopBar {
+    0% {transform: translateX(-100%);}
+    15% {transform: translateX(0%);}
+    85% {transform: translateX(0%);}
+    100% {transform: translateX(100%);}
+}
+@keyframes trainerIntroBotBar {
+    0% {transform: translateX(100%);}
+    15% {transform: translateX(0%);}
+    85% {transform: translateX(0%);}
+    100% {transform: translateX(-100%);}
+}
+@keyframes trainerIntroTexts {
+    0% {transform: translateX(40px); opacity: 0;}
+    5% {transform: translateX(40px); opacity: 0;}
+    15% {transform: translateX(0px); opacity: 1;}
+    85% {transform: translateX(0px); opacity: 1;}
+    95% {transform: translateX(-40px); opacity: 0;}
+    100% {transform: translateX(-40px); opacity: 0;}
+}
+
+@keyframes trainerIntroCount {
+    0% {opacity: 0;}
+    35% {opacity: 0;}
+    45% {opacity: 1;}
+    90% {opacity: 1;}
+    100% {opacity: 0;}
+}
diff --git a/Stream Tool/Overlays/Simple Elements/Resources/party_6x1.css b/Stream Tool/Overlays/Simple Elements/Resources/party_6x1.css
new file mode 100755
index 00000000..30baa7db
--- /dev/null
+++ b/Stream Tool/Overlays/Simple Elements/Resources/party_6x1.css	
@@ -0,0 +1,530 @@
+@font-face {
+    font-family: "FontBold";
+    src: url('../../../Resources/Fonts/RobotoCondensed-Bold.ttf');
+}
+@font-face {
+    font-family: "FontMain";
+    src: url('../../../Resources/Fonts/RobotoCondensed-SemiBold.ttf');
+}
+@font-face {
+    font-family: "FontMedium";
+    src: url('../../../Resources/Fonts/RobotoCondensed-Medium.ttf');
+}
+
+* {
+    box-sizing: border-box;
+}
+
+html, body {
+    padding: 0;
+    margin: 0;
+    font-family: "FontMain";
+}
+
+#content {
+    width: 100%;
+    height: 100%;
+}
+
+.absol {
+    position: absolute;
+}
+
+
+/* Non-Trainer battle pokemon Section */
+
+#botPokes {
+    position: absolute;
+    top: 0px;
+    width: 1920px;
+    height: 187px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 15px;
+    color: #f8f8f8;
+}
+
+
+.pokeDiv {
+    --healthy: #337E11;
+    --warning: #7e7c11;
+    --danger: #7e1111;
+    --Par: var(--warning);
+    --Poi: #56117e;
+    --Fro: #1a8fa3;
+    --Bur: #7e4611;
+    --Sle: grey;
+    --activeColor: var(--healthy);
+    position: relative;
+    height: 120px;
+    width: 300px;
+    border: thick double var(--activeColor);
+    overflow: visible;
+    border-radius: 30% / 100% 100% 100% 100%;
+    transition: opacity .25s, margin-left .6s;
+}
+.pokeFai, .pokeDed {
+    --activeColor: var(--danger) !important;
+    filter: grayscale(.8) brightness(.8) !important;
+}
+.pokePar {
+    --activeColor: var(--warning) !important;
+}
+.pokePoi {
+    --activeColor: var(--Poi) !important;
+}
+.pokeFro {
+    --activeColor: var(--Fro) !important;
+}
+.pokeBur {
+    --activeColor: var(--Bur) !important;
+}
+.pokeSle {
+    --activeColor: var(--Sle) !important;
+}
+.pokeDivInCombat {
+    .pokeDivMask {
+        .pokeHpDiv {
+            transform: translateY(0px);
+        }
+    }
+    .pokeTexts {
+        transform: translateY(0px);
+    }
+}
+.pokeDivOutOfCombat { 
+    .pokeDivMask {
+        .pokeHpDiv {
+            transform: translateY(25px);
+        }
+    }
+    .pokeTexts {
+        transform: translateY(8px);
+    }
+}
+
+
+.pokeTexts {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    margin-left: 20px;
+    text-shadow: 0px 0px 5px black;
+    transition: transform .5s;
+}
+
+.pokeDivMask {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    border-radius: 27% / 100% 100% 100% 100%;
+    overflow: hidden;
+}
+
+.pokeLvlDiv {
+    display: flex;
+}
+
+.pokeLvlBefore {
+    background-color: var(--activeColor);
+    width: 26px;
+}
+.pokeLvlTexts {
+    display: flex;
+    gap: 3px;
+    background-color: var(--activeColor);
+    padding: 2px 0px 2px 5px;
+    align-items: center;
+    font-size: 16px;
+}
+.pokeLvlAfter {
+    background-color: var(--activeColor);
+    width: 20px;
+    border-bottom-right-radius: 100%;
+}
+
+
+.pokeNick {
+    font-size: 30px;
+}
+
+.pokeSubText {
+    display: flex;
+    gap: 6px;
+    font-size: 22px;
+    font-style: oblique 15deg;
+    padding-left: 5px;
+    margin-top: -3px;
+}
+
+
+.pokeHpDiv {
+    display: flex;
+    position: absolute;
+    bottom: 0px;
+    width: 100%;
+    --bacColor: #363636;
+    transition: transform .5s;
+}
+.pokeHpBefore {
+    background-color: var(--bacColor);
+    width: 26px;
+    flex-shrink: 0;
+}
+.pokeHpText {
+    display: flex;
+    justify-content: center;
+    width: 55px;
+    background-color: var(--bacColor);
+    padding: 2px 0px 1px 5px;
+    z-index: 2;
+    flex-shrink: 0;
+    text-wrap: nowrap;
+    color: #b6b6b6;
+    font-size: 16px;
+}
+.pokeHpAfter {
+    background-color: var(--bacColor);
+    width: 24px;
+    margin-left: -17px;
+    border-top-right-radius: 50%;
+    z-index: 1;
+    flex-shrink: 0;
+}
+
+.pokeHpBar {
+    background-color: var(--bacColor);
+    width: 50%;
+    height: 11px;
+    transform: translateY(12px);
+    border-radius: 10% / 0 100% 0 0;
+    border: 4px solid var(--bacColor);
+    border-right: 6px solid var(--bacColor);
+    border-left: none;
+    overflow: hidden;
+}
+.hpBar {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
+.pokeHpBarTotal {
+    background-color: grey;
+}
+.pokeHpBarCurrent {
+    background-color: var(--activeColor);
+    filter: brightness(1.7);
+}
+
+
+.pokeImgDiv {
+    position: absolute;
+    right: 30px;
+    display: flex;
+    justify-content: right;
+    align-items: center;
+    clip-path: inset(-100px -100px 0px -100px);
+    width: 200px;
+    height: 100%;
+}
+.pokeImg {
+    transform: scale(2);
+    image-rendering: pixelated;
+}
+
+
+
+/** Main Info */
+/** I don't thin this is needed, but not sure
+.activeMainInfo {
+
+    --healthy: #337E11;
+    --warning: #7e7c11;
+    --danger: #7e1111;
+    --Par: var(--warning);
+    --Poi: #56117e;
+    --Fro: #1a8fa3;
+    --Bur: #7e4611;
+    --Sle: grey;
+    --activeColor: var(--healthy);
+
+    position: relative;
+    height: 126px;
+    width: 340px;
+    border: thick double var(--activeColor);
+    overflow: visible;
+    border-radius: 10% / 100% 100% 100% 100%;
+    transition: opacity .25s, margin-left .6s;
+
+}
+.activeMainInfoTiny {
+    width: 307px;
+}
+
+.activePokeImgDiv {
+    position: absolute;
+    right: 25px;
+    display: flex;
+    justify-content: right;
+    align-items: center;
+    clip-path: inset(-100px -100px 0px -100px);
+    width: 200px;
+    height: 100%;
+}
+.activePokeImg {
+    transform: scale(2);
+    image-rendering: pixelated;
+}
+
+.activeDivMask {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    border-radius: 7% / 100% 100% 100% 100%;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    align-items: start;
+}
+
+.activeLvlDiv {
+    display: inline-flex;
+    align-items: center;
+    gap: 5px;
+    border-bottom: 4px double var(--activeColor);
+    border-right: 4px double var(--activeColor);
+    padding: 0px 12px 0px 12px;
+    border-radius: 0% 0% 12% / 100% 0%;
+    background-color: #00000030;
+}
+.activeLvlTexts {
+    display: flex;
+    gap: 3px;
+    filter: drop-shadow(0px 0px 2px black);
+    font-size: 16px;
+    font-family: "FontBold";
+    padding: 3px 2px 2px 0px;
+}
+
+.activeTypeIcon {
+    width: 20px;
+    height: 20px;
+    filter: drop-shadow(0px 0px 2px black);
+    margin-top: -2px;
+    transform: scale(1.25);
+}
+
+.activeMainTexts {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: start;
+    margin-left: 10px;
+    text-shadow: 0px 0px 5px black;
+}
+.activeName {
+    font-size: 28px;
+}
+.activeSubText {
+    display: flex;
+    gap: 6px;
+    font-size: 20px;
+    align-items: center;
+    margin: -2px 0 0 5px;
+}
+
+.activeItemDiv {
+    display: flex;
+    gap: 6px;
+    align-items: center;
+}
+.activeItemImgDiv {
+    position: relative;
+    width: 24px;
+    height: 24px;
+    margin-left: 2px;
+}
+.activeItemImgBg {
+    position: absolute;
+    background-color: #ffffff30;
+    border: #d3d3d390 1px solid;
+    width: 100%;
+    height: 100%;
+    border-radius: 100%;
+    transform: scale(1.2);
+}
+.activeItemImgQue {
+    display: none;
+    width: 100%;
+    height: 100%;
+    align-items: center;
+    justify-content: center;
+    opacity: .7;
+}
+.activeItemImg {
+    width: 24px;
+    height: 24px;
+    position: absolute;
+    object-fit: none;
+    image-rendering: pixelated;
+    display: inline-block;
+}
+.activeItem {
+    display: none;
+}
+
+.activeHpDiv {
+    display: flex;
+    bottom: 0px;
+    width: 100%;
+    --bacColor: #363636;
+}
+.activeHpBefore {
+    background-color: var(--bacColor);
+    width: 10px;
+    flex-shrink: 0;
+}
+.activeHpText {
+    display: flex;
+    justify-content: center;
+    width: 55px;
+    background-color: var(--bacColor);
+    padding: 2px 0px 2px 0px;
+    z-index: 2;
+    flex-shrink: 0;
+    text-wrap: nowrap;
+    color: #b6b6b6;
+    font-size: 16px;
+    font-family: "FontBold";
+}
+
+
+
+/** Other */
+
+.flipBack {
+    transform: scaleX(-1);
+}
+
+#connErrorDiv {
+    display: none;
+    width: 100%;
+    height: 80px;
+    position: absolute;
+    bottom: 0;
+    background: linear-gradient(to top, black, rgba(0, 0, 0, 0));
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    font-size: 28px;
+    color: lightcoral;
+    text-shadow: 0px 0px 5px black;
+}
+
+
+/* Animations! */
+@keyframes slideOut {
+    from {
+        opacity: 1;
+        transform: translateX(0px);
+    }
+    to {
+        opacity: 0;
+        transform: translateX(-40px);
+    }
+}
+
+@keyframes slideIn {
+    from {
+        opacity: 0;
+        transform: translateX(-40px);
+    }
+    to {
+        opacity: 1;
+        transform: translateX(0px);
+    }
+}
+
+@keyframes hidePokes {
+    from {
+        opacity: 1;
+        transform: translateY(0px);
+    }
+    to {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+}
+@keyframes showPokes {
+    from {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0px);
+    }
+}
+
+@keyframes iDontFeelSoGood {
+    from {opacity: 1;}
+    to {opacity: 0;}
+}
+
+@keyframes shake {
+    0% { transform: translate(1px, 1px); filter: brightness(1.3); }
+    10% { transform: translate(1px, -2px); }
+    20% { transform: translate(-1px, 0px); }
+    30% { transform: translate(1px, 1px); }
+    40% { transform: translate(2px, -1px); }
+    50% { transform: translate(0px, 1px); }
+    60% { transform: translate(-1px, 0px); }
+    70% { transform: translate(1px, 1px); filter: brightness(1); }
+    80% { transform: translate(-1px, -1px); }
+    90% { transform: translate(1px, 0px); }
+    100% { transform: translate(0px, -1px); }
+}
+
+@keyframes megaAnim {
+    0% {filter: brightness(1);}
+    85% {filter: brightness(15);}
+    100% {filter: brightness(1);}
+}
+
+
+@keyframes trainerIntroFull {
+    0% {transform: translateY(20px);}
+    35% {transform: translateY(20px);}
+    45% {transform: translateY(0px);}
+}
+@keyframes trainerIntroTopBar {
+    0% {transform: translateX(-100%);}
+    15% {transform: translateX(0%);}
+    85% {transform: translateX(0%);}
+    100% {transform: translateX(100%);}
+}
+@keyframes trainerIntroBotBar {
+    0% {transform: translateX(100%);}
+    15% {transform: translateX(0%);}
+    85% {transform: translateX(0%);}
+    100% {transform: translateX(-100%);}
+}
+@keyframes trainerIntroTexts {
+    0% {transform: translateX(40px); opacity: 0;}
+    5% {transform: translateX(40px); opacity: 0;}
+    15% {transform: translateX(0px); opacity: 1;}
+    85% {transform: translateX(0px); opacity: 1;}
+    95% {transform: translateX(-40px); opacity: 0;}
+    100% {transform: translateX(-40px); opacity: 0;}
+}
+
+@keyframes trainerIntroCount {
+    0% {opacity: 0;}
+    35% {opacity: 0;}
+    45% {opacity: 1;}
+    90% {opacity: 1;}
+    100% {opacity: 0;}
+}
diff --git a/Stream Tool/Overlays/Simple Elements/party_1x6.html b/Stream Tool/Overlays/Simple Elements/party_1x6.html
new file mode 100755
index 00000000..d86c1351
--- /dev/null
+++ b/Stream Tool/Overlays/Simple Elements/party_1x6.html	
@@ -0,0 +1,275 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Pokemon 1x6 Overlay</title>
+    <script src="../../Resources/Scripts/Overlays.js" type="module"></script>
+    <link rel="stylesheet" href="Resources/party_1x6.css">
+</head>
+
+<body>
+
+<div id="content">
+
+    <div id="colPokes">
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+    </div>
+
+<div id="connErrorDiv" locText="connError">
+    Can't connect with GUI, attempting to reconnect every 5 seconds...
+</div>
+
+</body>
+</html>
diff --git a/Stream Tool/Overlays/Simple Elements/party_2x3.html b/Stream Tool/Overlays/Simple Elements/party_2x3.html
new file mode 100755
index 00000000..d9106e57
--- /dev/null
+++ b/Stream Tool/Overlays/Simple Elements/party_2x3.html	
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Pokemon 2x3 Overlay</title>
+    <script src="../../Resources/Scripts/Overlays.js" type="module"></script>
+    <link rel="stylesheet" href="Resources/party_2x3.css">
+</head>
+
+<body>
+
+<div id="content">
+
+    <div id="topPokes">
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+        
+    </div>
+
+    <div id="midPokes">
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+        
+    </div>
+
+    <div id="botPokes">
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+    </div>
+
+<div id="connErrorDiv" locText="connError">
+    Can't connect with GUI, attempting to reconnect every 5 seconds...
+</div>
+
+</body>
+</html>
diff --git a/Stream Tool/Overlays/Simple Elements/party_3x2.html b/Stream Tool/Overlays/Simple Elements/party_3x2.html
new file mode 100755
index 00000000..453282da
--- /dev/null
+++ b/Stream Tool/Overlays/Simple Elements/party_3x2.html	
@@ -0,0 +1,279 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Pokemon 3x2 Overlay</title>
+    <script src="../../Resources/Scripts/Overlays.js" type="module"></script>
+    <link rel="stylesheet" href="Resources/party_3x2.css">
+</head>
+
+<body>
+
+<div id="content">
+
+    <div id="topPokes">
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+        
+    </div>
+
+    <div id="botPokes">
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+    </div>
+
+<div id="connErrorDiv" locText="connError">
+    Can't connect with GUI, attempting to reconnect every 5 seconds...
+</div>
+
+</body>
+</html>
diff --git a/Stream Tool/Overlays/Simple Elements/party_6x1.html b/Stream Tool/Overlays/Simple Elements/party_6x1.html
new file mode 100755
index 00000000..7e8e7512
--- /dev/null
+++ b/Stream Tool/Overlays/Simple Elements/party_6x1.html	
@@ -0,0 +1,275 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Pokemon 6x1 Overlay</title>
+    <script src="../../Resources/Scripts/Overlays.js" type="module"></script>
+    <link rel="stylesheet" href="Resources/party.css">
+</head>
+
+<body>
+
+<div id="content">
+
+    <div id="botPokes">
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+        <div class="pokeDiv">
+
+            <div class="pokeImgDiv">
+                <img class="pokeImg">
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeLvlDiv">
+                    <div class="pokeLvlBefore"></div>
+                    <div class="pokeLvlTexts">
+                        <div class="pokeLvlText" locText="pokeLvl"></div>
+                        <div class="pokeLvlNum"></div>
+                    </div>
+                    <div class="pokeLvlAfter"></div>
+                    <div class="pokeLvlEnd"></div>
+                </div>
+            </div>
+
+            <div class="pokeDivMask">
+                <div class="pokeHpDiv">
+                    <div class="pokeHpBefore"></div>
+                    <div class="pokeHpText"></div>
+                    <div class="pokeHpAfter"></div>
+                    <div class="pokeHpBar">
+                        <div class="hpBar pokeHpBarTotal"></div>
+                        <div class="hpBar pokeHpBarCurrent"></div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="pokeTexts">
+                
+                <div class="pokeNick"></div>
+                <div class="pokeSubText">
+                    <div class="pokeGender"></div>
+                    <div class="pokeSpecies"></div>
+                </div>
+
+            </div>
+
+        </div>
+
+    </div>
+
+<div id="connErrorDiv" locText="connError">
+    Can't connect with GUI, attempting to reconnect every 5 seconds...
+</div>
+
+</body>
+</html>

From ffcc9192053b81193b674ac268237951d2ec1c83 Mon Sep 17 00:00:00 2001
From: BeatnikAU <contact@beatnik.id.au>
Date: Tue, 17 Jun 2025 08:19:02 +0930
Subject: [PATCH 2/2] Simplified party overlay element to a single responsive
 file

---
 .../Overlays/Simple Elements/README.md        |  20 +-
 .../Resources/{party_3x2.css => party.css}    |  15 +-
 .../Simple Elements/Resources/party_1x6.css   | 362 ------------
 .../Simple Elements/Resources/party_2x3.css   | 374 ------------
 .../Simple Elements/Resources/party_6x1.css   | 530 ------------------
 .../{party_6x1.html => party.html}            |   4 +-
 .../Overlays/Simple Elements/party_1x6.html   | 275 ---------
 .../Overlays/Simple Elements/party_2x3.html   | 283 ----------
 .../Overlays/Simple Elements/party_3x2.html   | 279 ---------
 9 files changed, 9 insertions(+), 2133 deletions(-)
 rename Stream Tool/Overlays/Simple Elements/Resources/{party_3x2.css => party.css} (98%)
 delete mode 100755 Stream Tool/Overlays/Simple Elements/Resources/party_1x6.css
 delete mode 100755 Stream Tool/Overlays/Simple Elements/Resources/party_2x3.css
 delete mode 100755 Stream Tool/Overlays/Simple Elements/Resources/party_6x1.css
 rename Stream Tool/Overlays/Simple Elements/{party_6x1.html => party.html} (99%)
 delete mode 100755 Stream Tool/Overlays/Simple Elements/party_1x6.html
 delete mode 100755 Stream Tool/Overlays/Simple Elements/party_2x3.html
 delete mode 100755 Stream Tool/Overlays/Simple Elements/party_3x2.html

diff --git a/Stream Tool/Overlays/Simple Elements/README.md b/Stream Tool/Overlays/Simple Elements/README.md
index cd07b6fc..f019b573 100644
--- a/Stream Tool/Overlays/Simple Elements/README.md	
+++ b/Stream Tool/Overlays/Simple Elements/README.md	
@@ -2,23 +2,9 @@
 
 This is a collection of elements from the example overlays, so that you can add them to existing scenes in your streaming software if you already have them. Like other overlays, just drag the html file into OBS.
 
-> [!NOTE]
-> These all use absolute sizing, so if you have any weird cropping, update the properties of the source with the width and height for the respective layout from the list below. 
+Currently this only has an element for the party, with the aim to add others in future.
 
-## Pokemon Party
-
-**3x2 layout**  
-width:  960  
-height: 337  
 
-**2X3 layout**  
-width:  640  
-height: 487 
-
-**6x1 layout**  
-width:  1970  
-height: 187  
+## Pokemon Party
 
-**1x6 layout**  
-width:  320  
-height: 880  
\ No newline at end of file
+The layout will adjust based on the width of your browser source. So 1920 width will have a single row of all 6 pokemon, 960 width will have two rows of 3, 320 width will have a vertical party, etc.
\ No newline at end of file
diff --git a/Stream Tool/Overlays/Simple Elements/Resources/party_3x2.css b/Stream Tool/Overlays/Simple Elements/Resources/party.css
similarity index 98%
rename from Stream Tool/Overlays/Simple Elements/Resources/party_3x2.css
rename to Stream Tool/Overlays/Simple Elements/Resources/party.css
index 99982443..92a53f1f 100755
--- a/Stream Tool/Overlays/Simple Elements/Resources/party_3x2.css	
+++ b/Stream Tool/Overlays/Simple Elements/Resources/party.css	
@@ -33,26 +33,19 @@ html, body {
 
 /* Non-Trainer battle pokemon Section */
 
-#topPokes, #botPokes {
+#partyPokes {
     position: absolute;
     left: 0px;
-    width: 960px;
-    height: 187px;
+    top: 20px;
+    height: 260px;
     display: flex;
+    flex-wrap: wrap;
     justify-content: center;
     align-items: center;
     gap: 15px;
     color: #f8f8f8;
 }
 
-#topPokes {
-    top: 0px;
-}
-
-#botPokes {
-    top: 150px;
-}
-
 
 .pokeDiv {
     --healthy: #337E11;
diff --git a/Stream Tool/Overlays/Simple Elements/Resources/party_1x6.css b/Stream Tool/Overlays/Simple Elements/Resources/party_1x6.css
deleted file mode 100755
index 78db8803..00000000
--- a/Stream Tool/Overlays/Simple Elements/Resources/party_1x6.css	
+++ /dev/null
@@ -1,362 +0,0 @@
-@font-face {
-    font-family: "FontBold";
-    src: url('../../../Resources/Fonts/RobotoCondensed-Bold.ttf');
-}
-@font-face {
-    font-family: "FontMain";
-    src: url('../../../Resources/Fonts/RobotoCondensed-SemiBold.ttf');
-}
-@font-face {
-    font-family: "FontMedium";
-    src: url('../../../Resources/Fonts/RobotoCondensed-Medium.ttf');
-}
-
-* {
-    box-sizing: border-box;
-}
-
-html, body {
-    padding: 0;
-    margin: 0;
-    font-family: "FontMain";
-}
-
-#content {
-    width: 320px;
-    height: 880px;
-}
-
-.absol {
-    position: absolute;
-}
-
-
-/* Non-Trainer battle pokemon Section */
-
-#colPokes {
-    position: absolute;
-    left: 10px;
-    top: 10px;
-    height: 860px;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    gap: 30px;
-    color: #f8f8f8;
-}
-
-.pokeDiv {
-    --healthy: #337E11;
-    --warning: #7e7c11;
-    --danger: #7e1111;
-    --Par: var(--warning);
-    --Poi: #56117e;
-    --Fro: #1a8fa3;
-    --Bur: #7e4611;
-    --Sle: grey;
-    --activeColor: var(--healthy);
-    position: relative;
-    height: 120px;
-    width: 300px;
-    border: thick double var(--activeColor);
-    overflow: visible;
-    border-radius: 30% / 100% 100% 100% 100%;
-    transition: opacity .25s, margin-left .6s;
-}
-.pokeFai, .pokeDed {
-    --activeColor: var(--danger) !important;
-    filter: grayscale(.8) brightness(.8) !important;
-}
-.pokePar {
-    --activeColor: var(--warning) !important;
-}
-.pokePoi {
-    --activeColor: var(--Poi) !important;
-}
-.pokeFro {
-    --activeColor: var(--Fro) !important;
-}
-.pokeBur {
-    --activeColor: var(--Bur) !important;
-}
-.pokeSle {
-    --activeColor: var(--Sle) !important;
-}
-.pokeDivInCombat {
-    .pokeDivMask {
-        .pokeHpDiv {
-            transform: translateY(0px);
-        }
-    }
-    .pokeTexts {
-        transform: translateY(0px);
-    }
-}
-.pokeDivOutOfCombat { 
-    .pokeDivMask {
-        .pokeHpDiv {
-            transform: translateY(25px);
-        }
-    }
-    .pokeTexts {
-        transform: translateY(8px);
-    }
-}
-
-
-.pokeTexts {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    margin-left: 20px;
-    text-shadow: 0px 0px 5px black;
-    transition: transform .5s;
-}
-
-.pokeDivMask {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    border-radius: 27% / 100% 100% 100% 100%;
-    overflow: hidden;
-}
-
-.pokeLvlDiv {
-    display: flex;
-}
-
-.pokeLvlBefore {
-    background-color: var(--activeColor);
-    width: 26px;
-}
-.pokeLvlTexts {
-    display: flex;
-    gap: 3px;
-    background-color: var(--activeColor);
-    padding: 2px 0px 2px 5px;
-    align-items: center;
-    font-size: 16px;
-}
-.pokeLvlAfter {
-    background-color: var(--activeColor);
-    width: 20px;
-    border-bottom-right-radius: 100%;
-}
-
-
-.pokeNick {
-    font-size: 30px;
-}
-
-.pokeSubText {
-    display: flex;
-    gap: 6px;
-    font-size: 22px;
-    font-style: oblique 15deg;
-    padding-left: 5px;
-    margin-top: -3px;
-}
-
-
-.pokeHpDiv {
-    display: flex;
-    position: absolute;
-    bottom: 0px;
-    width: 100%;
-    --bacColor: #363636;
-    transition: transform .5s;
-}
-.pokeHpBefore {
-    background-color: var(--bacColor);
-    width: 26px;
-    flex-shrink: 0;
-}
-.pokeHpText {
-    display: flex;
-    justify-content: center;
-    width: 55px;
-    background-color: var(--bacColor);
-    padding: 2px 0px 1px 5px;
-    z-index: 2;
-    flex-shrink: 0;
-    text-wrap: nowrap;
-    color: #b6b6b6;
-    font-size: 16px;
-}
-.pokeHpAfter {
-    background-color: var(--bacColor);
-    width: 24px;
-    margin-left: -17px;
-    border-top-right-radius: 50%;
-    z-index: 1;
-    flex-shrink: 0;
-}
-
-.pokeHpBar {
-    background-color: var(--bacColor);
-    width: 50%;
-    height: 11px;
-    transform: translateY(12px);
-    border-radius: 10% / 0 100% 0 0;
-    border: 4px solid var(--bacColor);
-    border-right: 6px solid var(--bacColor);
-    border-left: none;
-    overflow: hidden;
-}
-.hpBar {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-}
-.pokeHpBarTotal {
-    background-color: grey;
-}
-.pokeHpBarCurrent {
-    background-color: var(--activeColor);
-    filter: brightness(1.7);
-}
-
-
-.pokeImgDiv {
-    position: absolute;
-    right: 30px;
-    display: flex;
-    justify-content: right;
-    align-items: center;
-    clip-path: inset(-100px -100px 0px -100px);
-    width: 200px;
-    height: 100%;
-}
-.pokeImg {
-    transform: scale(2);
-    image-rendering: pixelated;
-}
-
-
-/** Other */
-
-.flipBack {
-    transform: scaleX(-1);
-}
-
-#connErrorDiv {
-    display: none;
-    width: 100%;
-    height: 80px;
-    position: absolute;
-    bottom: 0;
-    background: linear-gradient(to top, black, rgba(0, 0, 0, 0));
-    justify-content: center;
-    align-items: center;
-    text-align: center;
-    font-size: 28px;
-    color: lightcoral;
-    text-shadow: 0px 0px 5px black;
-}
-
-
-/* Animations! */
-@keyframes slideOut {
-    from {
-        opacity: 1;
-        transform: translateX(0px);
-    }
-    to {
-        opacity: 0;
-        transform: translateX(-40px);
-    }
-}
-
-@keyframes slideIn {
-    from {
-        opacity: 0;
-        transform: translateX(-40px);
-    }
-    to {
-        opacity: 1;
-        transform: translateX(0px);
-    }
-}
-
-@keyframes hidePokes {
-    from {
-        opacity: 1;
-        transform: translateY(0px);
-    }
-    to {
-        opacity: 0;
-        transform: translateY(30px);
-    }
-}
-@keyframes showPokes {
-    from {
-        opacity: 0;
-        transform: translateY(30px);
-    }
-    to {
-        opacity: 1;
-        transform: translateY(0px);
-    }
-}
-
-@keyframes iDontFeelSoGood {
-    from {opacity: 1;}
-    to {opacity: 0;}
-}
-
-@keyframes shake {
-    0% { transform: translate(1px, 1px); filter: brightness(1.3); }
-    10% { transform: translate(1px, -2px); }
-    20% { transform: translate(-1px, 0px); }
-    30% { transform: translate(1px, 1px); }
-    40% { transform: translate(2px, -1px); }
-    50% { transform: translate(0px, 1px); }
-    60% { transform: translate(-1px, 0px); }
-    70% { transform: translate(1px, 1px); filter: brightness(1); }
-    80% { transform: translate(-1px, -1px); }
-    90% { transform: translate(1px, 0px); }
-    100% { transform: translate(0px, -1px); }
-}
-
-@keyframes megaAnim {
-    0% {filter: brightness(1);}
-    85% {filter: brightness(15);}
-    100% {filter: brightness(1);}
-}
-
-
-@keyframes trainerIntroFull {
-    0% {transform: translateY(20px);}
-    35% {transform: translateY(20px);}
-    45% {transform: translateY(0px);}
-}
-@keyframes trainerIntroTopBar {
-    0% {transform: translateX(-100%);}
-    15% {transform: translateX(0%);}
-    85% {transform: translateX(0%);}
-    100% {transform: translateX(100%);}
-}
-@keyframes trainerIntroBotBar {
-    0% {transform: translateX(100%);}
-    15% {transform: translateX(0%);}
-    85% {transform: translateX(0%);}
-    100% {transform: translateX(-100%);}
-}
-@keyframes trainerIntroTexts {
-    0% {transform: translateX(40px); opacity: 0;}
-    5% {transform: translateX(40px); opacity: 0;}
-    15% {transform: translateX(0px); opacity: 1;}
-    85% {transform: translateX(0px); opacity: 1;}
-    95% {transform: translateX(-40px); opacity: 0;}
-    100% {transform: translateX(-40px); opacity: 0;}
-}
-
-@keyframes trainerIntroCount {
-    0% {opacity: 0;}
-    35% {opacity: 0;}
-    45% {opacity: 1;}
-    90% {opacity: 1;}
-    100% {opacity: 0;}
-}
diff --git a/Stream Tool/Overlays/Simple Elements/Resources/party_2x3.css b/Stream Tool/Overlays/Simple Elements/Resources/party_2x3.css
deleted file mode 100755
index cd41a08f..00000000
--- a/Stream Tool/Overlays/Simple Elements/Resources/party_2x3.css	
+++ /dev/null
@@ -1,374 +0,0 @@
-@font-face {
-    font-family: "FontBold";
-    src: url('../../../Resources/Fonts/RobotoCondensed-Bold.ttf');
-}
-@font-face {
-    font-family: "FontMain";
-    src: url('../../../Resources/Fonts/RobotoCondensed-SemiBold.ttf');
-}
-@font-face {
-    font-family: "FontMedium";
-    src: url('../../../Resources/Fonts/RobotoCondensed-Medium.ttf');
-}
-
-* {
-    box-sizing: border-box;
-}
-
-html, body {
-    padding: 0;
-    margin: 0;
-    font-family: "FontMain";
-}
-
-#content {
-    width: 100%;
-    height: 100%;
-}
-
-.absol {
-    position: absolute;
-}
-
-
-/* Non-Trainer battle pokemon Section */
-
-#topPokes, #midPokes, #botPokes {
-    position: absolute;
-    left: 0px;
-    width: 640px;
-    height: 187px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    gap: 15px;
-    color: #f8f8f8;
-}
-
-#topPokes {
-    top: 0px;
-}
-
-#midPokes {
-    top: 150px;
-}
-
-#botPokes {
-    top: 300px;
-}
-
-
-.pokeDiv {
-    --healthy: #337E11;
-    --warning: #7e7c11;
-    --danger: #7e1111;
-    --Par: var(--warning);
-    --Poi: #56117e;
-    --Fro: #1a8fa3;
-    --Bur: #7e4611;
-    --Sle: grey;
-    --activeColor: var(--healthy);
-    position: relative;
-    height: 120px;
-    width: 300px;
-    border: thick double var(--activeColor);
-    overflow: visible;
-    border-radius: 30% / 100% 100% 100% 100%;
-    transition: opacity .25s, margin-left .6s;
-}
-.pokeFai, .pokeDed {
-    --activeColor: var(--danger) !important;
-    filter: grayscale(.8) brightness(.8) !important;
-}
-.pokePar {
-    --activeColor: var(--warning) !important;
-}
-.pokePoi {
-    --activeColor: var(--Poi) !important;
-}
-.pokeFro {
-    --activeColor: var(--Fro) !important;
-}
-.pokeBur {
-    --activeColor: var(--Bur) !important;
-}
-.pokeSle {
-    --activeColor: var(--Sle) !important;
-}
-.pokeDivInCombat {
-    .pokeDivMask {
-        .pokeHpDiv {
-            transform: translateY(0px);
-        }
-    }
-    .pokeTexts {
-        transform: translateY(0px);
-    }
-}
-.pokeDivOutOfCombat { 
-    .pokeDivMask {
-        .pokeHpDiv {
-            transform: translateY(25px);
-        }
-    }
-    .pokeTexts {
-        transform: translateY(8px);
-    }
-}
-
-
-.pokeTexts {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    margin-left: 20px;
-    text-shadow: 0px 0px 5px black;
-    transition: transform .5s;
-}
-
-.pokeDivMask {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    border-radius: 27% / 100% 100% 100% 100%;
-    overflow: hidden;
-}
-
-.pokeLvlDiv {
-    display: flex;
-}
-
-.pokeLvlBefore {
-    background-color: var(--activeColor);
-    width: 26px;
-}
-.pokeLvlTexts {
-    display: flex;
-    gap: 3px;
-    background-color: var(--activeColor);
-    padding: 2px 0px 2px 5px;
-    align-items: center;
-    font-size: 16px;
-}
-.pokeLvlAfter {
-    background-color: var(--activeColor);
-    width: 20px;
-    border-bottom-right-radius: 100%;
-}
-
-
-.pokeNick {
-    font-size: 30px;
-}
-
-.pokeSubText {
-    display: flex;
-    gap: 6px;
-    font-size: 22px;
-    font-style: oblique 15deg;
-    padding-left: 5px;
-    margin-top: -3px;
-}
-
-
-.pokeHpDiv {
-    display: flex;
-    position: absolute;
-    bottom: 0px;
-    width: 100%;
-    --bacColor: #363636;
-    transition: transform .5s;
-}
-.pokeHpBefore {
-    background-color: var(--bacColor);
-    width: 26px;
-    flex-shrink: 0;
-}
-.pokeHpText {
-    display: flex;
-    justify-content: center;
-    width: 55px;
-    background-color: var(--bacColor);
-    padding: 2px 0px 1px 5px;
-    z-index: 2;
-    flex-shrink: 0;
-    text-wrap: nowrap;
-    color: #b6b6b6;
-    font-size: 16px;
-}
-.pokeHpAfter {
-    background-color: var(--bacColor);
-    width: 24px;
-    margin-left: -17px;
-    border-top-right-radius: 50%;
-    z-index: 1;
-    flex-shrink: 0;
-}
-
-.pokeHpBar {
-    background-color: var(--bacColor);
-    width: 50%;
-    height: 11px;
-    transform: translateY(12px);
-    border-radius: 10% / 0 100% 0 0;
-    border: 4px solid var(--bacColor);
-    border-right: 6px solid var(--bacColor);
-    border-left: none;
-    overflow: hidden;
-}
-.hpBar {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-}
-.pokeHpBarTotal {
-    background-color: grey;
-}
-.pokeHpBarCurrent {
-    background-color: var(--activeColor);
-    filter: brightness(1.7);
-}
-
-
-.pokeImgDiv {
-    position: absolute;
-    right: 30px;
-    display: flex;
-    justify-content: right;
-    align-items: center;
-    clip-path: inset(-100px -100px 0px -100px);
-    width: 200px;
-    height: 100%;
-}
-.pokeImg {
-    transform: scale(2);
-    image-rendering: pixelated;
-}
-
-
-/** Other */
-
-.flipBack {
-    transform: scaleX(-1);
-}
-
-#connErrorDiv {
-    display: none;
-    width: 100%;
-    height: 80px;
-    position: absolute;
-    bottom: 0;
-    background: linear-gradient(to top, black, rgba(0, 0, 0, 0));
-    justify-content: center;
-    align-items: center;
-    text-align: center;
-    font-size: 28px;
-    color: lightcoral;
-    text-shadow: 0px 0px 5px black;
-}
-
-
-/* Animations! */
-@keyframes slideOut {
-    from {
-        opacity: 1;
-        transform: translateX(0px);
-    }
-    to {
-        opacity: 0;
-        transform: translateX(-40px);
-    }
-}
-
-@keyframes slideIn {
-    from {
-        opacity: 0;
-        transform: translateX(-40px);
-    }
-    to {
-        opacity: 1;
-        transform: translateX(0px);
-    }
-}
-
-@keyframes hidePokes {
-    from {
-        opacity: 1;
-        transform: translateY(0px);
-    }
-    to {
-        opacity: 0;
-        transform: translateY(30px);
-    }
-}
-@keyframes showPokes {
-    from {
-        opacity: 0;
-        transform: translateY(30px);
-    }
-    to {
-        opacity: 1;
-        transform: translateY(0px);
-    }
-}
-
-@keyframes iDontFeelSoGood {
-    from {opacity: 1;}
-    to {opacity: 0;}
-}
-
-@keyframes shake {
-    0% { transform: translate(1px, 1px); filter: brightness(1.3); }
-    10% { transform: translate(1px, -2px); }
-    20% { transform: translate(-1px, 0px); }
-    30% { transform: translate(1px, 1px); }
-    40% { transform: translate(2px, -1px); }
-    50% { transform: translate(0px, 1px); }
-    60% { transform: translate(-1px, 0px); }
-    70% { transform: translate(1px, 1px); filter: brightness(1); }
-    80% { transform: translate(-1px, -1px); }
-    90% { transform: translate(1px, 0px); }
-    100% { transform: translate(0px, -1px); }
-}
-
-@keyframes megaAnim {
-    0% {filter: brightness(1);}
-    85% {filter: brightness(15);}
-    100% {filter: brightness(1);}
-}
-
-
-@keyframes trainerIntroFull {
-    0% {transform: translateY(20px);}
-    35% {transform: translateY(20px);}
-    45% {transform: translateY(0px);}
-}
-@keyframes trainerIntroTopBar {
-    0% {transform: translateX(-100%);}
-    15% {transform: translateX(0%);}
-    85% {transform: translateX(0%);}
-    100% {transform: translateX(100%);}
-}
-@keyframes trainerIntroBotBar {
-    0% {transform: translateX(100%);}
-    15% {transform: translateX(0%);}
-    85% {transform: translateX(0%);}
-    100% {transform: translateX(-100%);}
-}
-@keyframes trainerIntroTexts {
-    0% {transform: translateX(40px); opacity: 0;}
-    5% {transform: translateX(40px); opacity: 0;}
-    15% {transform: translateX(0px); opacity: 1;}
-    85% {transform: translateX(0px); opacity: 1;}
-    95% {transform: translateX(-40px); opacity: 0;}
-    100% {transform: translateX(-40px); opacity: 0;}
-}
-
-@keyframes trainerIntroCount {
-    0% {opacity: 0;}
-    35% {opacity: 0;}
-    45% {opacity: 1;}
-    90% {opacity: 1;}
-    100% {opacity: 0;}
-}
diff --git a/Stream Tool/Overlays/Simple Elements/Resources/party_6x1.css b/Stream Tool/Overlays/Simple Elements/Resources/party_6x1.css
deleted file mode 100755
index 30baa7db..00000000
--- a/Stream Tool/Overlays/Simple Elements/Resources/party_6x1.css	
+++ /dev/null
@@ -1,530 +0,0 @@
-@font-face {
-    font-family: "FontBold";
-    src: url('../../../Resources/Fonts/RobotoCondensed-Bold.ttf');
-}
-@font-face {
-    font-family: "FontMain";
-    src: url('../../../Resources/Fonts/RobotoCondensed-SemiBold.ttf');
-}
-@font-face {
-    font-family: "FontMedium";
-    src: url('../../../Resources/Fonts/RobotoCondensed-Medium.ttf');
-}
-
-* {
-    box-sizing: border-box;
-}
-
-html, body {
-    padding: 0;
-    margin: 0;
-    font-family: "FontMain";
-}
-
-#content {
-    width: 100%;
-    height: 100%;
-}
-
-.absol {
-    position: absolute;
-}
-
-
-/* Non-Trainer battle pokemon Section */
-
-#botPokes {
-    position: absolute;
-    top: 0px;
-    width: 1920px;
-    height: 187px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    gap: 15px;
-    color: #f8f8f8;
-}
-
-
-.pokeDiv {
-    --healthy: #337E11;
-    --warning: #7e7c11;
-    --danger: #7e1111;
-    --Par: var(--warning);
-    --Poi: #56117e;
-    --Fro: #1a8fa3;
-    --Bur: #7e4611;
-    --Sle: grey;
-    --activeColor: var(--healthy);
-    position: relative;
-    height: 120px;
-    width: 300px;
-    border: thick double var(--activeColor);
-    overflow: visible;
-    border-radius: 30% / 100% 100% 100% 100%;
-    transition: opacity .25s, margin-left .6s;
-}
-.pokeFai, .pokeDed {
-    --activeColor: var(--danger) !important;
-    filter: grayscale(.8) brightness(.8) !important;
-}
-.pokePar {
-    --activeColor: var(--warning) !important;
-}
-.pokePoi {
-    --activeColor: var(--Poi) !important;
-}
-.pokeFro {
-    --activeColor: var(--Fro) !important;
-}
-.pokeBur {
-    --activeColor: var(--Bur) !important;
-}
-.pokeSle {
-    --activeColor: var(--Sle) !important;
-}
-.pokeDivInCombat {
-    .pokeDivMask {
-        .pokeHpDiv {
-            transform: translateY(0px);
-        }
-    }
-    .pokeTexts {
-        transform: translateY(0px);
-    }
-}
-.pokeDivOutOfCombat { 
-    .pokeDivMask {
-        .pokeHpDiv {
-            transform: translateY(25px);
-        }
-    }
-    .pokeTexts {
-        transform: translateY(8px);
-    }
-}
-
-
-.pokeTexts {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    margin-left: 20px;
-    text-shadow: 0px 0px 5px black;
-    transition: transform .5s;
-}
-
-.pokeDivMask {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    border-radius: 27% / 100% 100% 100% 100%;
-    overflow: hidden;
-}
-
-.pokeLvlDiv {
-    display: flex;
-}
-
-.pokeLvlBefore {
-    background-color: var(--activeColor);
-    width: 26px;
-}
-.pokeLvlTexts {
-    display: flex;
-    gap: 3px;
-    background-color: var(--activeColor);
-    padding: 2px 0px 2px 5px;
-    align-items: center;
-    font-size: 16px;
-}
-.pokeLvlAfter {
-    background-color: var(--activeColor);
-    width: 20px;
-    border-bottom-right-radius: 100%;
-}
-
-
-.pokeNick {
-    font-size: 30px;
-}
-
-.pokeSubText {
-    display: flex;
-    gap: 6px;
-    font-size: 22px;
-    font-style: oblique 15deg;
-    padding-left: 5px;
-    margin-top: -3px;
-}
-
-
-.pokeHpDiv {
-    display: flex;
-    position: absolute;
-    bottom: 0px;
-    width: 100%;
-    --bacColor: #363636;
-    transition: transform .5s;
-}
-.pokeHpBefore {
-    background-color: var(--bacColor);
-    width: 26px;
-    flex-shrink: 0;
-}
-.pokeHpText {
-    display: flex;
-    justify-content: center;
-    width: 55px;
-    background-color: var(--bacColor);
-    padding: 2px 0px 1px 5px;
-    z-index: 2;
-    flex-shrink: 0;
-    text-wrap: nowrap;
-    color: #b6b6b6;
-    font-size: 16px;
-}
-.pokeHpAfter {
-    background-color: var(--bacColor);
-    width: 24px;
-    margin-left: -17px;
-    border-top-right-radius: 50%;
-    z-index: 1;
-    flex-shrink: 0;
-}
-
-.pokeHpBar {
-    background-color: var(--bacColor);
-    width: 50%;
-    height: 11px;
-    transform: translateY(12px);
-    border-radius: 10% / 0 100% 0 0;
-    border: 4px solid var(--bacColor);
-    border-right: 6px solid var(--bacColor);
-    border-left: none;
-    overflow: hidden;
-}
-.hpBar {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-}
-.pokeHpBarTotal {
-    background-color: grey;
-}
-.pokeHpBarCurrent {
-    background-color: var(--activeColor);
-    filter: brightness(1.7);
-}
-
-
-.pokeImgDiv {
-    position: absolute;
-    right: 30px;
-    display: flex;
-    justify-content: right;
-    align-items: center;
-    clip-path: inset(-100px -100px 0px -100px);
-    width: 200px;
-    height: 100%;
-}
-.pokeImg {
-    transform: scale(2);
-    image-rendering: pixelated;
-}
-
-
-
-/** Main Info */
-/** I don't thin this is needed, but not sure
-.activeMainInfo {
-
-    --healthy: #337E11;
-    --warning: #7e7c11;
-    --danger: #7e1111;
-    --Par: var(--warning);
-    --Poi: #56117e;
-    --Fro: #1a8fa3;
-    --Bur: #7e4611;
-    --Sle: grey;
-    --activeColor: var(--healthy);
-
-    position: relative;
-    height: 126px;
-    width: 340px;
-    border: thick double var(--activeColor);
-    overflow: visible;
-    border-radius: 10% / 100% 100% 100% 100%;
-    transition: opacity .25s, margin-left .6s;
-
-}
-.activeMainInfoTiny {
-    width: 307px;
-}
-
-.activePokeImgDiv {
-    position: absolute;
-    right: 25px;
-    display: flex;
-    justify-content: right;
-    align-items: center;
-    clip-path: inset(-100px -100px 0px -100px);
-    width: 200px;
-    height: 100%;
-}
-.activePokeImg {
-    transform: scale(2);
-    image-rendering: pixelated;
-}
-
-.activeDivMask {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    border-radius: 7% / 100% 100% 100% 100%;
-    overflow: hidden;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    align-items: start;
-}
-
-.activeLvlDiv {
-    display: inline-flex;
-    align-items: center;
-    gap: 5px;
-    border-bottom: 4px double var(--activeColor);
-    border-right: 4px double var(--activeColor);
-    padding: 0px 12px 0px 12px;
-    border-radius: 0% 0% 12% / 100% 0%;
-    background-color: #00000030;
-}
-.activeLvlTexts {
-    display: flex;
-    gap: 3px;
-    filter: drop-shadow(0px 0px 2px black);
-    font-size: 16px;
-    font-family: "FontBold";
-    padding: 3px 2px 2px 0px;
-}
-
-.activeTypeIcon {
-    width: 20px;
-    height: 20px;
-    filter: drop-shadow(0px 0px 2px black);
-    margin-top: -2px;
-    transform: scale(1.25);
-}
-
-.activeMainTexts {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: start;
-    margin-left: 10px;
-    text-shadow: 0px 0px 5px black;
-}
-.activeName {
-    font-size: 28px;
-}
-.activeSubText {
-    display: flex;
-    gap: 6px;
-    font-size: 20px;
-    align-items: center;
-    margin: -2px 0 0 5px;
-}
-
-.activeItemDiv {
-    display: flex;
-    gap: 6px;
-    align-items: center;
-}
-.activeItemImgDiv {
-    position: relative;
-    width: 24px;
-    height: 24px;
-    margin-left: 2px;
-}
-.activeItemImgBg {
-    position: absolute;
-    background-color: #ffffff30;
-    border: #d3d3d390 1px solid;
-    width: 100%;
-    height: 100%;
-    border-radius: 100%;
-    transform: scale(1.2);
-}
-.activeItemImgQue {
-    display: none;
-    width: 100%;
-    height: 100%;
-    align-items: center;
-    justify-content: center;
-    opacity: .7;
-}
-.activeItemImg {
-    width: 24px;
-    height: 24px;
-    position: absolute;
-    object-fit: none;
-    image-rendering: pixelated;
-    display: inline-block;
-}
-.activeItem {
-    display: none;
-}
-
-.activeHpDiv {
-    display: flex;
-    bottom: 0px;
-    width: 100%;
-    --bacColor: #363636;
-}
-.activeHpBefore {
-    background-color: var(--bacColor);
-    width: 10px;
-    flex-shrink: 0;
-}
-.activeHpText {
-    display: flex;
-    justify-content: center;
-    width: 55px;
-    background-color: var(--bacColor);
-    padding: 2px 0px 2px 0px;
-    z-index: 2;
-    flex-shrink: 0;
-    text-wrap: nowrap;
-    color: #b6b6b6;
-    font-size: 16px;
-    font-family: "FontBold";
-}
-
-
-
-/** Other */
-
-.flipBack {
-    transform: scaleX(-1);
-}
-
-#connErrorDiv {
-    display: none;
-    width: 100%;
-    height: 80px;
-    position: absolute;
-    bottom: 0;
-    background: linear-gradient(to top, black, rgba(0, 0, 0, 0));
-    justify-content: center;
-    align-items: center;
-    text-align: center;
-    font-size: 28px;
-    color: lightcoral;
-    text-shadow: 0px 0px 5px black;
-}
-
-
-/* Animations! */
-@keyframes slideOut {
-    from {
-        opacity: 1;
-        transform: translateX(0px);
-    }
-    to {
-        opacity: 0;
-        transform: translateX(-40px);
-    }
-}
-
-@keyframes slideIn {
-    from {
-        opacity: 0;
-        transform: translateX(-40px);
-    }
-    to {
-        opacity: 1;
-        transform: translateX(0px);
-    }
-}
-
-@keyframes hidePokes {
-    from {
-        opacity: 1;
-        transform: translateY(0px);
-    }
-    to {
-        opacity: 0;
-        transform: translateY(30px);
-    }
-}
-@keyframes showPokes {
-    from {
-        opacity: 0;
-        transform: translateY(30px);
-    }
-    to {
-        opacity: 1;
-        transform: translateY(0px);
-    }
-}
-
-@keyframes iDontFeelSoGood {
-    from {opacity: 1;}
-    to {opacity: 0;}
-}
-
-@keyframes shake {
-    0% { transform: translate(1px, 1px); filter: brightness(1.3); }
-    10% { transform: translate(1px, -2px); }
-    20% { transform: translate(-1px, 0px); }
-    30% { transform: translate(1px, 1px); }
-    40% { transform: translate(2px, -1px); }
-    50% { transform: translate(0px, 1px); }
-    60% { transform: translate(-1px, 0px); }
-    70% { transform: translate(1px, 1px); filter: brightness(1); }
-    80% { transform: translate(-1px, -1px); }
-    90% { transform: translate(1px, 0px); }
-    100% { transform: translate(0px, -1px); }
-}
-
-@keyframes megaAnim {
-    0% {filter: brightness(1);}
-    85% {filter: brightness(15);}
-    100% {filter: brightness(1);}
-}
-
-
-@keyframes trainerIntroFull {
-    0% {transform: translateY(20px);}
-    35% {transform: translateY(20px);}
-    45% {transform: translateY(0px);}
-}
-@keyframes trainerIntroTopBar {
-    0% {transform: translateX(-100%);}
-    15% {transform: translateX(0%);}
-    85% {transform: translateX(0%);}
-    100% {transform: translateX(100%);}
-}
-@keyframes trainerIntroBotBar {
-    0% {transform: translateX(100%);}
-    15% {transform: translateX(0%);}
-    85% {transform: translateX(0%);}
-    100% {transform: translateX(-100%);}
-}
-@keyframes trainerIntroTexts {
-    0% {transform: translateX(40px); opacity: 0;}
-    5% {transform: translateX(40px); opacity: 0;}
-    15% {transform: translateX(0px); opacity: 1;}
-    85% {transform: translateX(0px); opacity: 1;}
-    95% {transform: translateX(-40px); opacity: 0;}
-    100% {transform: translateX(-40px); opacity: 0;}
-}
-
-@keyframes trainerIntroCount {
-    0% {opacity: 0;}
-    35% {opacity: 0;}
-    45% {opacity: 1;}
-    90% {opacity: 1;}
-    100% {opacity: 0;}
-}
diff --git a/Stream Tool/Overlays/Simple Elements/party_6x1.html b/Stream Tool/Overlays/Simple Elements/party.html
similarity index 99%
rename from Stream Tool/Overlays/Simple Elements/party_6x1.html
rename to Stream Tool/Overlays/Simple Elements/party.html
index 7e8e7512..1e9fbc6b 100755
--- a/Stream Tool/Overlays/Simple Elements/party_6x1.html	
+++ b/Stream Tool/Overlays/Simple Elements/party.html	
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <title>Pokemon 6x1 Overlay</title>
+    <title>Pokemon 3x2 Overlay</title>
     <script src="../../Resources/Scripts/Overlays.js" type="module"></script>
     <link rel="stylesheet" href="Resources/party.css">
 </head>
@@ -11,7 +11,7 @@
 
 <div id="content">
 
-    <div id="botPokes">
+    <div id="partyPokes">
 
         <div class="pokeDiv">
 
diff --git a/Stream Tool/Overlays/Simple Elements/party_1x6.html b/Stream Tool/Overlays/Simple Elements/party_1x6.html
deleted file mode 100755
index d86c1351..00000000
--- a/Stream Tool/Overlays/Simple Elements/party_1x6.html	
+++ /dev/null
@@ -1,275 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Pokemon 1x6 Overlay</title>
-    <script src="../../Resources/Scripts/Overlays.js" type="module"></script>
-    <link rel="stylesheet" href="Resources/party_1x6.css">
-</head>
-
-<body>
-
-<div id="content">
-
-    <div id="colPokes">
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-    </div>
-
-<div id="connErrorDiv" locText="connError">
-    Can't connect with GUI, attempting to reconnect every 5 seconds...
-</div>
-
-</body>
-</html>
diff --git a/Stream Tool/Overlays/Simple Elements/party_2x3.html b/Stream Tool/Overlays/Simple Elements/party_2x3.html
deleted file mode 100755
index d9106e57..00000000
--- a/Stream Tool/Overlays/Simple Elements/party_2x3.html	
+++ /dev/null
@@ -1,283 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Pokemon 2x3 Overlay</title>
-    <script src="../../Resources/Scripts/Overlays.js" type="module"></script>
-    <link rel="stylesheet" href="Resources/party_2x3.css">
-</head>
-
-<body>
-
-<div id="content">
-
-    <div id="topPokes">
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-        
-    </div>
-
-    <div id="midPokes">
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-        
-    </div>
-
-    <div id="botPokes">
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-    </div>
-
-<div id="connErrorDiv" locText="connError">
-    Can't connect with GUI, attempting to reconnect every 5 seconds...
-</div>
-
-</body>
-</html>
diff --git a/Stream Tool/Overlays/Simple Elements/party_3x2.html b/Stream Tool/Overlays/Simple Elements/party_3x2.html
deleted file mode 100755
index 453282da..00000000
--- a/Stream Tool/Overlays/Simple Elements/party_3x2.html	
+++ /dev/null
@@ -1,279 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Pokemon 3x2 Overlay</title>
-    <script src="../../Resources/Scripts/Overlays.js" type="module"></script>
-    <link rel="stylesheet" href="Resources/party_3x2.css">
-</head>
-
-<body>
-
-<div id="content">
-
-    <div id="topPokes">
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-        
-    </div>
-
-    <div id="botPokes">
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="pokeDiv">
-
-            <div class="pokeImgDiv">
-                <img class="pokeImg">
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeLvlDiv">
-                    <div class="pokeLvlBefore"></div>
-                    <div class="pokeLvlTexts">
-                        <div class="pokeLvlText" locText="pokeLvl"></div>
-                        <div class="pokeLvlNum"></div>
-                    </div>
-                    <div class="pokeLvlAfter"></div>
-                    <div class="pokeLvlEnd"></div>
-                </div>
-            </div>
-
-            <div class="pokeDivMask">
-                <div class="pokeHpDiv">
-                    <div class="pokeHpBefore"></div>
-                    <div class="pokeHpText"></div>
-                    <div class="pokeHpAfter"></div>
-                    <div class="pokeHpBar">
-                        <div class="hpBar pokeHpBarTotal"></div>
-                        <div class="hpBar pokeHpBarCurrent"></div>
-                    </div>
-                </div>
-            </div>
-
-            <div class="pokeTexts">
-                
-                <div class="pokeNick"></div>
-                <div class="pokeSubText">
-                    <div class="pokeGender"></div>
-                    <div class="pokeSpecies"></div>
-                </div>
-
-            </div>
-
-        </div>
-
-    </div>
-
-<div id="connErrorDiv" locText="connError">
-    Can't connect with GUI, attempting to reconnect every 5 seconds...
-</div>
-
-</body>
-</html>