@charset "utf-8";
/* CSS Document */
html{min-height: 100%;}
body{background-image:linear-gradient(to bottom, black, grey, black);}
@media(max-width:899px){
	#pagina{height: 100%; max-width: 90vw; width:100%; padding:20px;}
	#titulo{
		color: white;
		font-size: 3vw;
		float:left;
		width: 35vw;
		height:10vw;
		line-height: 10vw;
		background-image:linear-gradient(red, darkred);
		border-radius: 10px;
		padding:0px 10px 0px 10px;}
	#logo img{height: 10vw; float:right;}
	#desktabela{display:none;}
	#mobtabela{font-size: 3vw; width: 100%;}
	.linha:after {
		content: "";
  		display: table;
  		clear: both;
		margin-bottom: 1vw;}
	.coluna-esq{
		float:left;
		padding: 10px;
		width: 72%;
		background-image:linear-gradient(white, lightgrey);
		border-radius:10px;
		line-height: 8vw;
		height: 8vw;}
	.esporte{height: 100%;vertical-align: middle;margin: 0 2vw 0 2vw;}
	.coluna-dir{
		float:right;
		padding: 10px;
		width:20%;
		background-image:linear-gradient(red, darkred);
		border-radius:10px;
		display:block;
		line-height: 8vw;
		height: 8vw;
		text-align: center;}
	a.ctlg:link, .ctlg:hover, .ctlg:visited{text-decoration: none; color:white;display:block;}
	#rodape{float:center;color:white;text-align: center;font-size:2vw; max-width: 980px; width:100%;}
	.col-rodape{float:left; width:50%; text-align: center;}
	a.ic:link, .ic:hover, .ic:visited{text-decoration: none;display:inline-block;}
	.icone{width: 6vw; margin:0 5px 0 5px; vertical-align: middle;}}
@media(min-width:900px) and (max-width:1080px){
	#pagina{height: 100%; max-width: 90vw; width:100%; padding:20px;}
	#titulo{
		color: white;
		font-size: 3vw;
		float:left;
		width: 35vw;
		height:10vw;
		line-height: 10vw;
		background-image:linear-gradient(red, darkred);
		border-radius: 10px;
		padding:0px 10px 0px 10px;}
	#logo img{height: 10vw; float:right;}
	#desktabela{display:none;}
	#mobtabela{font-size: 3vw; width: 100%;}
	.linha:after {
		content: "";
  		display: table;
  		clear: both;
		margin-bottom: 1vw;}
	.coluna-esq{
		float:left;
		padding: 10px;
		width: 74%;
		background-image:linear-gradient(white, lightgrey);
		border-radius:10px;
		line-height: 8vw;
		height: 8vw;}
	.esporte{height: 100%;vertical-align: middle;margin: 0 2vw 0 2vw;}
	.coluna-dir{
		float:right;
		padding: 10px;
		width:20%;
		background-image:linear-gradient(red, darkred);
		border-radius:10px;
		display:block;
		line-height: 8vw;
		height: 8vw;
		text-align: center;}
	a.ctlg:link, .ctlg:hover, .ctlg:visited{text-decoration: none; color:white;display:block;}
	#rodape{float:center;color:white;text-align: center;font-size:2vw; max-width: 980px; width:100%;}
	.col-rodape{float:left; width:50%; text-align: center;}
	a.ic:link, .ic:hover, .ic:visited{text-decoration: none;display:inline-block;}
	.icone{width: 6vw; margin:0 5px 0 5px; vertical-align: middle;}}
@media(min-width:1081px) and (max-width: 1279px){
	#pagina{height: 100%; max-width: 1000px; width:100%; padding:20px;margin: auto;}
	#titulo{
		color: white;
		font-size: 32px;
		float:left;
		width: 720px;
		height: 80px;
		line-height: 80px;
		background-image:linear-gradient(red, darkred);
		border-radius: 10px;
		padding:0px 10px 0px 10px;}
	#logo img{vertical-align: middle; height: 80px; float:right;}
	#mobtabela{display:none;}
	#desktabela{font-size: 32px; width: 100%; margin: auto;}
	.linha:after {
		content: "";
  		display: table;
  		clear: both;
		margin-bottom: 15px;
	}
	.colinha{
		float:left;
		max-width: 170px;
		width:100%;
		margin: 0 5px 0 5px;
		padding: 10px;
		border-radius: 10px;
		background-image:linear-gradient(white, lightgrey);
	}
	.tablinha{margin: auto;}
	.tablinha:after{
		content: "";
  		display: flex;
		flex-direction: row;
  		clear: both;
		margin:0 0 10px 0;}
	
	.linha1{
		display:inline-block;
		overflow-wrap: wrap;
		text-align: center;
		max-width: inherit;
		border-radius:10px;
		height: 200px;}
	.esporte{width: 80%;vertical-align: middle;}
	.linha2{
		padding: 10px;
		background-image:linear-gradient(red, darkred);
		border-radius:10px;
		margin: auto;
		display:block;
		width: 80%;
		height: 30px;
		line-height: 30px;
		text-align: center;}
	a.ctlg:link, .ctlg:hover, .ctlg:visited{text-decoration: none; color:white;display:block;}
	#rodape{float:center;color:white;text-align: center;font-size:18px; max-width: 1200px; width:100%;margin:auto;}
	.col-rodape{float:left; width:50%; text-align: center;}
	a.ic:link, .ic:hover, .ic:visited{text-decoration: none;display:inline-block;}
	.icone{width: 50px; margin:0 5px 0 5px; vertical-align: middle;}}
@media(min-width:1280px){
	#pagina{height: 100%; max-width: 1280px; width:100%; padding:20px;margin: auto;}
	#titulo{
		color: white;
		font-size: 32px;
		float:left;
		width: 720px;
		height: 80px;
		line-height: 80px;
		background-image:linear-gradient(red, darkred);
		border-radius: 10px;
		padding:0px 10px 0px 10px;}
	#logo img{vertical-align: middle; height: 80px; float:right;}
	#mobtabela{display:none;}
	#desktabela{font-size: 32px; width: 100%; margin: auto;}
	.linha:after {
		content: "";
  		display: table;
  		clear: both;
		margin-bottom: 15px;
	}
	.colinha{
		float:left;
		max-width: 200px;
		width:100%;
		margin: 0 5px 0 5px;
		padding: 10px;
		border-radius: 10px;
		background-image:linear-gradient(white, lightgrey);
	}
	.tablinha{margin: auto;}
	.tablinha:after{
		content: "";
  		display: flex;
		flex-direction: row;
  		clear: both;
		margin:0 0 10px 0;}
	
	.linha1{
		display:inline-block;
		overflow-wrap: wrap;
		text-align: center;
		max-width: inherit;
		border-radius:10px;
		height: 200px;}
	.esporte{width: 80%;vertical-align: middle;}
	.linha2{
		padding: 10px;
		background-image:linear-gradient(red, darkred);
		border-radius:10px;
		margin: auto;
		display:block;
		width: 80%;
		height: 30px;
		line-height: 30px;
		text-align: center;}
	a.ctlg:link, .ctlg:hover, .ctlg:visited{text-decoration: none; color:white;display:block;}
	#rodape{float:center;color:white;text-align: center;font-size:18px; max-width: 1200px; width:100%;margin:auto;}
	.col-rodape{float:left; width:50%; text-align: center;}
	a.ic:link, .ic:hover, .ic:visited{text-decoration: none;display:inline-block;}
	.icone{width: 50px; margin:0 5px 0 5px; vertical-align: middle;}}