Видосы и параметризованный выбор кол-ва рас

app/assets/stylesheets/main.css

@@ -20,6 +20,13 @@
   -webkit-filter: grayscale(1); /* Webkit браузеры */
 }
 
+.bannedRace {
+  height: 96px;
+  background-color: red;
+  clip-path: polygon(20% 0%, 0% 20%, 30% 50%, 0% 80%, 20% 100%, 50% 70%, 80% 100%, 100% 80%, 70% 50%, 100% 20%, 80% 0%, 50% 30%);
+  border: 2px solid red;
+}
+
 .mapSelect{
   margin: 4px;
   position:relative;
@@ -29,6 +36,39 @@
   overflow: hidden;
 }
 
+.raceIcon{
+  width: 90px;
+  border-radius: 5px;
+  margin: 3px;
+  border: 1px solid;
+}
+
+.raceNotSelected{
+  -webkit-filter: grayscale(1); /* Webkit браузеры */
+}
+
+.raceNotSelected:hover{
+  -webkit-filter: grayscale(0); /* Webkit браузеры */
+}
+
+.raceSelected{
+  -webkit-filter: brightness(1.3);
+}
+
+.tooltip span{
+  border-radius: 5px 5px 5px 5px;
+  visibility: hidden;
+  position: absolute;
+  left: 200px;
+  background: #fff;
+  box-shadow: -2px 2px 10px -1px #333;
+  border-radius: 2px;
+}
+
+.tooltip:hover span{
+  visibility: visible;
+}
+
 @keyframes glowing {
   0% {
     box-shadow: 0 0 2px #074673;