body{margin: 0px; font-family: "Barlow, Oswald", sans-serif; align-items: center; align-content: center; align-items: center; justify-content:center; display: flex; }

a:link {text-decoration: none; color: #ffffff}
a:hover {text-decoration:none; cursor:pointer; color: #7ebc28}
.link_wht{color:#fff}

.responsive {width: 100%; height: auto;}

.container{width: 100%; align-content: center; align-items: center; justify-content:center; display: flex; position: relative }

.header{width:100%; top:0; background-color: antiquewhite; position: absolute}

.sch_container{width: 18%; background-color: aqua; margin-right: 2%}

.top{width:100%; position: relative; height:726px; overflow-y: hidden; align-content: center; align-items: center; justify-content:center; display: flex}
.allteam{width:100%; position: fixed; bottom:0; left:0; background-color: rgba(255, 255, 255, 0.7); display: flex; text-align: center; align-items: center; align-content: center; justify-content: center}
.break{width: 100; height: 1px; background-color: rgba(255, 255, 255, 0.5); margin-top: 4px; margin-bottom: 8px}
.logo{width:300px; position:absolute; display: flex; top:0; left: 10%; background-color: rgba(0,0,0,0.25); padding: 1%}
.sponsor{width:28%; padding: 0.5%; top:1%; right: 12%; position: absolute; justify-content: center; display: flex}
.spons{width:34.2%; background-color: rgba(0,0,0,0.25); justify-content: center; text-align: center; padding: 0.5%; margin-left:1%; margin-right: 1%}
.component{width:100%; text-transform: uppercase; color: #FAEA34; text-align: center; font-size:8px; padding-bottom: 8px; padding-top:2px}

.top_stories{width:30%; position:absolute; background-color: rgba(76, 126, 17, 0.75); padding: 1%; font-size:30px; font-family: Marcellus; line-height: 32px; text-align: center; color: #fff; left: 10%; margin-right: 1%; margin-top: 410px}
.all{width:23%; position: absolute; background-color: rgba(0, 0, 0, 0.5); margin-left: 10%; height: 450px; overflow-x: hidden; overflow-x: auto; padding-top: 10px; margin-top: 6.7%}
.story_im{width: 36%; float: left}
.story_txt{width: 56%; float: left; color: #fff; margin-left:3%; font-family: marcellus; font-size:16px;}
.section{background-color: chocolate; color: #fff; text-transform: uppercase; padding: 1%; margin-bottom: 4px; font-size:13px; font-weight: 600; padding-left: 8px}
.team_name{font-size:10px; text-transform: uppercase; color: #fff; font-weight: 600; margin-left: 8px; margin-right: 8px}
.right{width:20%; right:0; border:solid; border-width: 1px; border-color: antiquewhite; position: absolute; display: flex; margin-right: 12%; text-align: center; justify-content: center; top:25.5%;}
.threehunderd{width:300px; margin-top: 4px; margin-bottom: 4px; align-items: center; justify-content: center;}
.date{width:99%; background-color: gold; font-size:12px; color: #000; padding-top: 3px; padding-bottom: 3px; margin-top: 10px; margin-bottom: 10px; margin-left: 0.5%; margin-right: 0.5%}

.timer{width:300px; background-color: rgba(76, 126, 17, 0.5); margin-bottom: 10px; border-radius: 10px; padding-top: 4px; padding-bottom: 4px; align-items: center; justify-content: center}
.button{background-color: rgba(0, 0, 0, 0.7); font-size: 11px; text-transform: uppercase; padding: 5px; margin: 2px; color: #fff; font-weight: bold}

.clubl{width:6%; padding:0.75%; text-align: center; overflow: hidden; align-content: center; align-items: center; justify-content:center; display: flex; }
.text_big{font-size:26px; font-family: Marcellus; text-align: left}

.club{width:40%; font-family:Oswald; text-transform: uppercase; font-size:11px; text-align: center; background-color: #fff}

.vs{width:8%; text-align: center; overflow: hidden; align-content: center; align-items: center; justify-content:center; display: flex; font-family: Oswald; font-size: 10px;  text-transform: uppercase}

.content_area{width: 54%; background-color: rgba(0, 255, 255, 0.4); position: absolute; left:11%; display:grid}
.player{width: 15%; background-color: aliceblue; margin: 1%; float: left; align-content: center; align-items: center; justify-content: center; display: grid}
.profile{width:100px; height:100px; border-radius: 50px; background-color: #000;}
.name{font-size:12px; font-family:Oswald; text-transform: uppercase; font-weight:600; padding-top: 5px;}
.clubname{font-size:11px; font-family:Oswald; text-transform: uppercase; font-weight:600; padding-bottom: 5px}


@media only screen and (max-width: 620px) {
  /* For mobile phones: */
.header{width:100%;background-color:#000; position: absolute}	
.logo{width:78%; position:absolute; display: flex; top:0; padding: 1%; text-align: center}
.top{width:99%; position: relative; overflow-y: hidden; display: flex; height: 475px;}
.top_stories{width:98%; position:absolute; background-color: rgba(76, 126, 17, 0.75); padding: 1%; font-size:22px; font-family: Marcellus; line-height: 22px; text-align: center; color: #fff; left:0; height: 84px; margin-top: 295px} 
.right{width:99%; position: absolute; display: flex; text-align: center; justify-content: center; margin-top: 260px; left:0}
.all{width:100%; position: absolute; background-color: rgba(0, 0, 0, 0.5); height: 450px; overflow-x: hidden; overflow-x: auto; padding-top: 10px; right:0; top:0; margin-top: 840px}
.sponsor{width:99%; padding: 0.5%; position: absolute; justify-content: center; display: flex; left:0; margin-top: 82px}
.component{width:100%; text-transform: uppercase; color: #000; text-align: center; font-size:8px; padding-bottom: 8px; padding-top:2px}
	
}