separate All the styles in the css file so that it can override

[walkwel]

All the elements have position absolute which makes it difficult to integrate into other designs. Put all the styles into separate CSS file so that they can be overridable to integrate. Below is an example is given for Tournament.js file

Instead of this
<div style={{position:'absolute', zIndex:100, left:'50%', transform:'translate(-50%, 0%)', top:'145px'}}>

Use It as
<div className="tournament__container">

and styles will goes into tournament.css file or style.css

style.css

.tournament__container{
  position: absolute;
   zIndex:100;
  left:50%;
  transform:translate(-50%, 0%);
}

this file can be imported into react component directly.