diff --git a/front/assets/basketball_court.svg b/front/assets/basketball_court.svg
index 25b6f6c..e0df003 100644
--- a/front/assets/basketball_court.svg
+++ b/front/assets/basketball_court.svg
@@ -1,44 +1,62 @@
-<svg class=".basketball-court-svg" width="995" height="500" viewBox="0 0 995 500" fill="white" xmlns="http://www.w3.org/2000/svg">
-    <rect x="992" y="497" width="494" height="494" transform="rotate(180 992 497)" stroke="black"
-          stroke-width="6"/>
-    <rect  x="3" y="3" width="494" height="494" stroke="black" stroke-width="6"/>
-    <circle cx="496.5" cy="245.5" r="134.5" stroke="black" stroke-width="6"/>
-    <path d="M137 337C184.496 337 223 298.496 223 251C223 203.504 184.496 165 137 165" stroke="black" stroke-width="6"/>
-    <path d="M858 163C810.504 163 772 201.504 772 249C772 296.496 810.504 335 858 335" stroke="black" stroke-width="6"/>
-    <g filter="url(#filter0_d_4_24)">
-        <circle cx="39" cy="251" r="19.5" stroke="black" stroke-width="3" shape-rendering="crispEdges"/>
+<svg xmlns="http://www.w3.org/2000/svg"
+     xmlns:xlink="http://www.w3.org/1999/xlink"
+     version="1.1"
+     width="100%"
+     viewBox="7.5 18.5 85.5 56"
+     style="enable-background:new 7.5 18.5 85.5 56;"
+     xml:space="preserve">
+
+    <style type="text/css">
+        .st0{fill:none;stroke:#000000;stroke-miterlimit:10;}
+        .st1{fill:none;stroke:#000000;stroke-miterlimit:10;stroke-dasharray:1.4358,1.4358;}
+        .st2{fill:none;stroke:#000000;stroke-width:0.5;stroke-miterlimit:10;}
+        .st3{fill:none;stroke:#000000;stroke-miterlimit:10;stroke-dasharray:1.4407,1.4407;}
+    </style>
+    <polygon class="st0" points="92.1,72.1 50.1,72.1 8.1,72.1 8.1,21.2 50.1,21.2 92.1,21.2 "/>
+    <line class="st0" x1="50.1" y1="21.2" x2="50.1" y2="72.1"/>
+    <circle class="st0" cx="50.1" cy="46.6" r="6.4"/>
+    <path class="st0" d="M8.1,66h7.2c10.1,0,18.2-8.7,18.2-19.3s-8.2-19.3-18.2-19.3H8.1"/>
+    <path class="st0" d="M8.1,40.2h19c3.6,0,6.4,2.9,6.4,6.4s-2.9,6.4-6.4,6.4h-19"/>
+    <line class="st0" x1="27.1" y1="40.2" x2="27.1" y2="53.1"/>
+    <g>
+        <g><path class="st0" d="M27.4,40.3c-0.3,0-0.5,0-0.7,0"/>
+            <path class="st1"
+                  d="M25.3,40.7c-2.5,0.9-4.3,3.3-4.3,6.1c0,3,2.2,5.6,5,6.2"/>
+            <path
+                    class="st0" d="M26.7,53c0.2,0,0.5,0,0.7,0"/>
+        </g>
     </g>
-    <g filter="url(#filter1_d_4_24)">
-        <circle cx="956" cy="250" r="19.5" stroke="black" stroke-width="3" shape-rendering="crispEdges"/>
+    <line class="st0" x1="16.2" y1="53.1" x2="16.2" y2="54.1"/>
+    <line class="st2" x1="19.3" y1="53.1" x2="19.3" y2="54.1"/>
+    <line class="st2" x1="22.4" y1="53.1" x2="22.4" y2="54.1"/>
+    <line class="st2" x1="25.7" y1="53.1" x2="25.7" y2="54.1"/>
+    <line class="st0" x1="16.1" y1="39.2" x2="16.1" y2="40.2"/>
+    <line class="st2" x1="19.2" y1="39.2" x2="19.2" y2="40.2"/>
+    <line class="st2" x1="22.3" y1="39.2" x2="22.3" y2="40.2"/>
+    <line class="st2" x1="25.6" y1="39.2" x2="25.6" y2="40.2"/>
+    <line class="st0" x1="27.1" y1="40.2" x2="27.1" y2="53.1"/>
+    <path class="st0" d="M92.1,66.1h-7.2c-10.1,0-18.2-8.7-18.2-19.3s8.2-19.3,18.2-19.3h7.2"/>
+    <path class="st0" d="M92.1,40.3h-19c-3.6,0-6.4,2.9-6.4,6.4s2.9,6.4,6.4,6.4h19"/>
+    <line class="st0" x1="84" y1="53.2" x2="84" y2="54.1"/>
+    <line class="st2" x1="80.9" y1="53.2" x2="80.9" y2="54.1"/>
+    <line class="st2" x1="77.9" y1="53.2" x2="77.9" y2="54.1"/>
+    <line class="st2" x1="74.5" y1="53.2" x2="74.5" y2="54.1"/>
+    <line class="st0" x1="84.1" y1="39.3" x2="84.1" y2="40.3"/>
+    <line class="st2" x1="81" y1="39.3" x2="81" y2="40.3"/>
+    <line class="st2" x1="77.9" y1="39.3" x2="77.9" y2="40.3"/>
+    <line class="st2" x1="74.6" y1="39.3" x2="74.6" y2="40.3"/>
+    <line class="st0" x1="73.1" y1="40.3" x2="73.1" y2="53.2"/>
+    <line class="st2" x1="36.2" y1="70" x2="36.2" y2="74.1"/>
+    <line class="st2" x1="63.5" y1="70" x2="63.5" y2="74.1"/>
+    <line class="st2" x1="36.2" y1="19.1" x2="36.2" y2="23.2"/>
+    <line class="st2" x1="63.5" y1="19.1" x2="63.5" y2="23.2"/>
+    <g xmlns="http://www.w3.org/2000/svg">
+        <g>
+            <path class="st0" d="M72.9,40.3c0.3,0,0.5,0,0.7,0"/>
+            <path class="st3"
+                  d="M75,40.7c2.5,0.9,4.3,3.3,4.3,6.1c0,3-2.2,5.6-5.1,6.2"/>
+            <path
+                    class="st0" d="M73.5,53.1c-0.2,0-0.5,0-0.7,0"/>
+        </g>
     </g>
-    <line x1="137" y1="165" x2="6" y2="165" stroke="black" stroke-width="6"/>
-    <line x1="137" y1="337" x2="6" y2="337" stroke="black" stroke-width="6"/>
-    <line x1="989" y1="335" x2="858" y2="335" stroke="black" stroke-width="6"/>
-    <line x1="989" y1="163" x2="858" y2="163" stroke="black" stroke-width="6"/>
-    <defs>
-        <filter id="filter0_d_4_24" x="14" y="230" width="50" height="50" filterUnits="userSpaceOnUse"
-                color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-                           result="hardAlpha"/>
-            <feOffset dy="4"/>
-            <feGaussianBlur stdDeviation="2"/>
-            <feComposite in2="hardAlpha" operator="out"/>
-            <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
-            <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4_24"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4_24" result="shape"/>
-        </filter>
-        <filter id="filter1_d_4_24" x="931" y="229" width="50" height="50" filterUnits="userSpaceOnUse"
-                color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-                           result="hardAlpha"/>
-            <feOffset dy="4"/>
-            <feGaussianBlur stdDeviation="2"/>
-            <feComposite in2="hardAlpha" operator="out"/>
-            <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
-            <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4_24"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4_24" result="shape"/>
-        </filter>
-    </defs>
-</svg>
+</svg>
\ No newline at end of file
diff --git a/front/components/editor/BasketCourt.tsx b/front/components/editor/BasketCourt.tsx
index d4b83d7..0819633 100644
--- a/front/components/editor/BasketCourt.tsx
+++ b/front/components/editor/BasketCourt.tsx
@@ -18,9 +18,7 @@ export function BasketCourt({players, onPlayerRemove}: { players: Player[], onPl
                              x={(bounds.width * player.right_percentage)}
                              y={(bounds.height * player.bottom_percentage)}
                              bounds={{bottom: bounds.height, top: 0, left: 0, right: bounds.width}}
-                             onRemove={() => {
-                                 onPlayerRemove(player)
-                             }}
+                             onRemove={() => onPlayerRemove(player)}
                 />
             )
         }))
diff --git a/front/style/basket_court.css b/front/style/basket_court.css
index 2e60cfd..920512b 100644
--- a/front/style/basket_court.css
+++ b/front/style/basket_court.css
@@ -2,13 +2,18 @@
 
 #court-container {
     display: flex;
+
+    background-color: var(--main-color);
 }
 
 #court-svg {
+    margin: 5%;
     user-select: none;
     -webkit-user-drag: none;
 }
 
+
+
 #court-svg * {
     stroke: var(--selected-team-secondarycolor);
 }
\ No newline at end of file
diff --git a/front/style/editor.css b/front/style/editor.css
index 4791022..e2d38c9 100644
--- a/front/style/editor.css
+++ b/front/style/editor.css
@@ -46,5 +46,9 @@
     display: flex;
     align-items: center;
     justify-content: center;
+    align-content: center;
 }
 
+#court-div-bounds {
+    width: 60%;
+}
diff --git a/front/views/Editor.tsx b/front/views/Editor.tsx
index d7dccaa..8636cad 100644
--- a/front/views/Editor.tsx
+++ b/front/views/Editor.tsx
@@ -96,7 +96,7 @@ export default function Editor({id, name}: { id: number, name: string }) {
                           onElementDetached={onElementDetach}/>
                 </div>
                 <div id="court-div">
-                    <div ref={courtDivContentRef}>
+                    <div id="court-div-bounds" ref={courtDivContentRef}>
                         <BasketCourt
                             players={players}
                             onPlayerRemove={(player) => {