@font-face {
    font-family: 'GuardianSansMedium';
    src: url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Medium.eot");
    src: url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Medium.eot?") format("embedded-opentype"), url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Medium.woff") format("woff"), url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Medium.ttf") format("truetype"), url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Medium.svg") format("svg");
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
}
@font-face {
    font-family: 'GuardianSansRegular';
    src: url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Regular.eot");
    src: url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Regular.eot?") format("embedded-opentype"), url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Regular.woff") format("woff"), url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Regular.ttf") format("truetype"), url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Regular.svg") format("svg");
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
}
@font-face {
    font-family: 'GuardianSansSemibold';
    src: url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Semibold.eot");
    src: url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Semibold.eot?") format("embedded-opentype"), url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Semibold.woff") format("woff"), url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Semibold.ttf") format("truetype"), url("//s3-ap-southeast-2.amazonaws.com/news-networkeditorial/masthead/heraldsun/font/guardian/GuardianSans-Semibold.svg") format("svg");
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
}	
/* Page Design */
body { background-color: #fff; margin: 0; padding: 0; font-family: 'GuardianSans', sans-serif; color: #555; }
header { margin: 0; background: #0e0e0e; height: 57px; padding-left: 8px; border-bottom: #50e3c2 solid 5px; }
h1 { font-family: 'GuardianSans', sans-serif; font-size: 12px; line-height: 44px; color: #d6d6d6; font-weight: bold; margin: 0; margin-left: 10px; }
h4 { margin: -10px 0 10px 10px; font-size: 16px; font-weight: 300; color: #d6d6d6; }

/* Table Styles */
table#league { border-collapse: collapse; border:none; }
table#league th:nth-child(1), table#league td:nth-child(1) { width: 3%; text-align: center; padding-left: 5px; }
table#league th:nth-child(2), table#league td:nth-child(2) { display: block; width: 32%; text-align: left; margin-left: -14px;}
table#league th:nth-child(3), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(4), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(5), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(6), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(7), table#league td:nth-child(2) { width: 7%; text-align: center; }
table#league th:nth-child(8), table#league td:nth-child(2) { width: 6%; text-align: left; }
table#league th:nth-child(9), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(10), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(11), table#league td:nth-child(2) { width: 22%; text-align: left; }


table#league thead { font-size: 12px; text-transform: uppercase; }
table#league thead tr { background-color: #f9f9f9; border-bottom: 0.5px solid #D6D6D6; }
table#league thead th { padding: 10px; color: #0e0e0e; vertical-align: bottom; }
table#league thead th:first-child { padding-left: 20px; }


table#league tbody { font-size: .9em; line-height: 15px; }
/*table#league tbody tr { border-bottom: 1px solid #f4f4f4); } */
table#league tbody tr:nth-child(even) { background-color: #f4f4f4; border-bottom: 0.5px solid #D6D6D6; border-top: 0.5px solid #D6D6D6;}
/*table#league tbody tr:nth-child(8) {border-bottom: #F00 solid 1px; }*/
table#league tbody td { font-family: 'GuardianSansRegular', sans-serif;font-size: 14px; font-weight: normal; line-height: 20px; color: #000000; padding: 10px;}
table#league tbody td span { display: none; }
table#league tbody td:nth-child(2) {text-align: left;}
table#league tbody td:nth-child(7), table#league tbody td:nth-child(8), table#league tbody td:nth-child(9), table#league tbody td:nth-child(10) {text-align: right;}

table#league tbody td:last-child { text-align: left; }
table#league tbody td::after { content:''; display: block; clear: both; }

/*colours for Last 5 */
p.W { font-family: 'GuardianSansSemibold', sans-serif; display:inline-block; width: 15px; height: 15px; margin: 2px; padding: 2px 2px 4px 2px; border-radius: 2px; background-color: #96ddcc; font-size: 10px; font-weight: 600; color: #ffffff; text-align: center;}
p.L { font-family: 'GuardianSansSemibold', sans-serif;display:inline-block; width: 15px; height: 15px; margin: 2px; padding: 2px 2px 4px 2px; border-radius: 2px; background-color: #ea818f;  font-size: 10px; font-weight: 600; color: #ffffff; text-align: center;}
p.D { font-family: 'GuardianSansSemibold', sans-serif;display:inline-block; width: 15px; height: 15px; margin: 2px; padding: 2px 2px 4px 2px; border-radius: 2px; background-color: #6c6868; font-size: 10px; font-weight: 600; color: #ffffff;text-align: center; }

/* button */
.button { position:relative; margin-top: 5px; margin-left: auto; margin-right: auto; /*top: 10px; left: 300px; */width: 219px; height: 22px; -webkit-border-radius: 20; -moz-border-radius: 20; border-radius: 20px; color: #ffffff; font-size: 14px;background: #50e3c2; text-align: center; text-decoration: none;	padding-top: 5px; }
.button a { text-decoration: none; color: #ffffff; }
.button a:hover { opacity: 0.4; }

/* ellipsis */
.ellipsis {font-family: 'GuardianSansMedium', sans-serif; width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis;}

#footer {background-color:#000; height: 42px; margin-top: -17px; text-align: right; padding-right: 10px; padding-top: 10px;}
@media only screen and (min-width : 320px) {
	header { 
		padding-left: 1px !important;
	}
	.cf-dropdown.active .dropdown {
		width: 316px;
	    opacity: 1;
	    pointer-events: auto;
	    z-index: 10;
	}
}
@media only screen and (min-device-width : 371px) and (max-device-width : 600px) {
/* Page Design */
body { background-color: #fff; margin: 0; padding: 0; font-family: 'GuardianSans', sans-serif; color: #555; }
header { margin: 0; background: #0e0e0e; height: 57px; padding-left: 8px; border-bottom: #50e3c2 solid 5px; }
h1 { font-family: 'GuardianSans', sans-serif; font-size: 12px; line-height: 44px; color: #d6d6d6; font-weight: bold; margin: 0; }
h4 { margin: -10px 0 10px 0px; font-size: 16px; font-weight: 300; color: #d6d6d6; }

/* Table Styles */
table#league { border-collapse: collapse; border:none; }
table#league th:nth-child(1), table#league td:nth-child(1) { width: 3%; text-align: center; padding-left: 5px; }
table#league th:nth-child(2), table#league td:nth-child(2) { display: block; width: 32%; text-align: left; margin-left: -14px;}
table#league th:nth-child(3), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(4), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(5), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(6), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(7), table#league td:nth-child(2) { width: 8%; text-align: left; }
table#league th:nth-child(8), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(9), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(10), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(11), table#league td:nth-child(2) { width: 22%; text-align: left; }


table#league thead { font-size: 12px; text-transform: uppercase; }
table#league thead tr { background-color: #f9f9f9;border-bottom: 0.5px solid #D6D6D6; }
table#league thead th { padding: 10px; color: #0e0e0e; vertical-align: bottom; }
/*table#league thead th:hover { color: #000; background-color: #fff5e6; } */
table#league thead th:first-child { padding-left: 20px; }

table#league tbody { font-size: .9em; line-height: 15px; }
table#league tbody tr { border-bottom: 1px solid #f4f4f4); }
table#league tbody tr:nth-child(even) { background-color: #f4f4f4; border-bottom: 0.5px solid #D6D6D6; }
/*table#league tbody tr:nth-child(8) {border-bottom: #F00 solid 1px; }*/
table#league tbody td { font-family: 'GuardianSansRegular', sans-serif;font-size: 14px; font-weight: normal; line-height: 24px; color: #000000; padding: 10px;}
table#league tbody td span { display: none; }
table#league tbody td:nth-child(2) {text-align: left;}
table#league tbody td:nth-child(7), table#league tbody td:nth-child(8), table#league tbody td:nth-child(9), table#league tbody td:nth-child(10) {text-align: right;}
table#league tbody td:last-child { text-align: left; }
table#league tbody td::after { content:''; display: block; clear: both; }

/*colours for Last 5 */
p.W { display:inline-block; width: 15px; height: 15px; margin: 2px; padding: 2px 1px; border-radius: 2px; background-color: #96ddcc; font-family: GuardianSans; font-size: 10px; font-weight: 600; color: #ffffff; text-align: center;}
p.L { display:inline-block; width: 15px; height: 15px; margin: 2px; padding: 2px 1px; border-radius: 2px; background-color: #ea818f; font-family: GuardianSans; font-size: 10px; font-weight: 600; color: #ffffff; text-align: center;}
p.D { display:inline-block; width: 15px; height: 15px; margin: 2px; padding: 2px 1px; border-radius: 2px; background-color: #6c6868; font-family: GuardianSans; font-size: 10px; font-weight: 600; color: #ffffff;text-align: center; }

/* button */
.button { position:relative; margin-top: 5px; margin-left: auto; margin-right: auto; /*top: 10px; left: 300px; */width: 219px; height: 22px; -webkit-border-radius: 20; -moz-border-radius: 20; border-radius: 20px; color: #ffffff; font-size: 14px;background: #50e3c2; text-align: center; text-decoration: none;	padding-top: 5px; }
.button a { text-decoration: none; color: #ffffff; }
/* ellipsis */
.ellipsis {	width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis;
}	
/* Mobile */
	
table.responsive { margin-bottom: 0; }
	
.pinned { position: absolute; left: 0; top: 0; background: #fff; width: 39%; overflow: hidden; overflow-x: scroll; border-right: 2px solid #ccc; border-left: 1px solid #ccc; box-shadow: 0px 5px 5px 0px #ccc; }
.pinned table { border-right: none; border-left: none; width: 100%; }
.pinned table th, .pinned table td { white-space: nowrap; }
.pinned td:last-child { border-bottom: 0; }
	
div.table-wrapper { position: relative; margin-bottom: 20px; overflow: hidden; border-right: 1px solid #ccc; }
div.table-wrapper div.scrollable { margin-left: 11%; }
div.table-wrapper div.scrollable { overflow: scroll; overflow-y: hidden; }	
	
table.responsive td, table.responsive th { position: relative; white-space: nowrap; overflow: hidden; }
table.responsive th:first-child, table.responsive td:first-child, table.responsive td:first-child, table.responsive.pinned td { display: none; }
}

@media screen and (max-width: 370px) {
body { background-color: #fff; margin: 0; padding: 0; font-family: 'GuardianSans', sans-serif; color: #555; }
header { margin: 0; background: #0e0e0e; height: 57px; padding-left: 8px; border-bottom: #50e3c2 solid 5px; }
h1 { font-family: 'GuardianSans', sans-serif; font-size: 12px; line-height: 44px; color: #d6d6d6; font-weight: bold; margin: 0; }
h4 { margin: -10px 0 10px 0px; font-size: 16px; font-weight: 300; color: #d6d6d6; }
/*ladder { display:block; overflow-x:scroll; white-space:nowrap; }*/


/* Table Styles */
table#league { border-collapse: collapse; border:none; }

table#league th:nth-child(1), table#league td:nth-child(1) { width: 3%; text-align: center; padding-left: 5px; }
table#league th:nth-child(2), table#league td:nth-child(2) { display: block; width: 32%; text-align: left; margin-left: -14px;}
table#league th:nth-child(3), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(4), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(5), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(6), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(7), table#league td:nth-child(2) { width: 8%; text-align: center; }
table#league th:nth-child(8), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(9), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(10), table#league td:nth-child(2) { width: 5%; text-align: left; }
table#league th:nth-child(11), table#league td:nth-child(2) { width: 22%; text-align: left; }

table#league thead { font-size: 12px; text-transform: uppercase; }
table#league thead tr { background-color: #f4f4f4; border-bottom: 1px solid color: #f4f4f4; }
table#league thead th { padding: 10px; color: #0e0e0e; vertical-align: bottom; }
/*table#league thead th:hover { color: #000; background-color: #fff5e6; } */
table#league thead th:first-child { padding-left: 20px; }

table#league tbody { font-size: .9em; line-height: 15px; }
table#league tbody tr { border-bottom: 1px solid #f4f4f4); }

table#league tbody tr:nth-child(even) { background-color: #f4f4f4; border-bottom: 1px solid #f4f4f4; }
/*table#league tbody tr:hover { color: #000; background-color: rgba(156, 175, 255, 1); } */
/*table#league tbody tr:nth-child(8) {border-bottom: #F00 solid 1px; }*/
table#league tbody td { font-family: 'GuardianSansRegular', sans-serif; font-size: 14px; font-weight: normal; line-height: 24px; color: #000000; padding: 10px;}
table#league tbody td span { display: none; }
table#league tbody td:nth-child(2) {text-align: left;}
table#league tbody td:nth-child(7), table#league tbody td:nth-child(8), table#league tbody td:nth-child(9), table#league tbody td:nth-child(10) {text-align: right;}
table#league tbody td:last-child { text-align: left; }
table#league tbody td::after { content:''; display: block; clear: both; }

/*colours for Last 5 */
p.W { display:inline-block; width: 15px; height: 15px; margin: 2px; padding: 2px 1px; border-radius: 2px; background-color: #96ddcc; font-family: GuardianSans; font-size: 10px; font-weight: 600; color: #ffffff; text-align: center;}
p.L { display:inline-block; width: 15px; height: 15px; margin: 2px; padding: 2px 1px; border-radius: 2px; background-color: #ea818f; font-family: GuardianSans; font-size: 10px; font-weight: 600; color: #ffffff; text-align: center;}
p.D { display:inline-block; width: 15px; height: 15px; margin: 2px; padding: 2px 1px; border-radius: 2px; background-color: #6c6868; font-family: GuardianSans; font-size: 10px; font-weight: 600; color: #ffffff;text-align: center; }

/* button */
.button { position:relative; margin-top: 5px; margin-left: auto; margin-right: auto; width: 219px; height: 22px; -webkit-border-radius: 20; -moz-border-radius: 20; border-radius: 20px; color: #ffffff; font-size: 14px;background: #50e3c2; text-align: center; text-decoration: none;	padding-top: 5px; }
.button a { text-decoration: none; color: #ffffff; }
.ellipsis { width: 90px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis;
}
/* Mobile */
	
table.responsive { margin-bottom: 0; }
	
.pinned { position: absolute; left: 0; top: 0; background: #fff; width: 36%; overflow: hidden; overflow-x: scroll; border-right: 2px solid #ccc; border-left: 1px solid #ccc; box-shadow: 0px 5px 5px 0px #ccc; }
.pinned table { border-right: none; border-left: none; width: 100%; }
.pinned table th, .pinned table td { white-space: nowrap; }
.pinned td:last-child { border-bottom: 0; }
	
div.table-wrapper { position: relative; margin-bottom: 20px; overflow: hidden; border-right: 1px solid #ccc; }
div.table-wrapper div.scrollable { margin-left: 14%; }
div.table-wrapper div.scrollable { overflow: scroll; overflow-y: hidden; }	
	
table.responsive td, table.responsive th { position: relative; white-space: nowrap; overflow: hidden; }
table.responsive th:first-child, table.responsive td:first-child, table.responsive td:first-child, table.responsive.pinned td { display: none; }

}