@import url('https://fonts.googleapis.com/css?family=Cairo:700,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');

body {
      animation: colorchange 20s infinite; /* animation-name followed by duration in seconds*/
         /* you could also use milliseconds (ms) or something like 2.5s */
      -webkit-animation: colorchange 20s infinite; /* Chrome and Safari */
}

@keyframes colorchange
    {
      0%   {background: #00a2e5;}
      25%  {background: #ffd101;}
      50%  {background: #00a651;}
      75%  {background: #f58220;}
      100% {background: #ee287e;}
    }

@-webkit-keyframes colorchange /* Safari and Chrome - necessary duplicate */
    {
      0%   {background: #00a2e5;}
      25%  {background: #ffd101;}
      50%  {background: #00a651;}
      75%  {background: #f58220;}
      100% {background: #ee287e;}
    }

h2,table,tr,th,td{
	font-family: 'Montserrat', sans-serif;
}	
h1{
	font-family: 'Cairo', sans-serif;
	font-weight:900;
	font-size: 8rem;
}
.light-color{
	color:#fff;
}
.header-col{
	   padding: 15px 20px 0px;
}
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td{
    border: 1px solid #fff;
    text-align: left;
    padding: 8px;
    color: #fff;
	font-size: 1.5rem;
	font-weight:500;
	 letter-spacing: 0.3px;
}
th {
    border: 1px solid #fff;
    text-align: left;
    padding: 8px;
    color: #fff;
	font-size: 1.5rem;
	font-weight:700;
	letter-spacing: 0.3px;
}

.trophy{
	max-width: 40px;
}
.winners-col{
	padding: 0px 20px 35px;
}
.winners-col h2{
	 margin-top: 0px;
    margin-bottom: 40px;
    font-weight: 500;
    font-size: 4rem;
    text-transform: lowercase;
}
@media screen and (min-width: 800px) {
  table {
    width: 70%;
	margin: 0 auto;
  }
}