/* 100players */
html,body 				{font-family: 'Inter', sans-serif; color: black; text-align: left;}
a						{font-family: 'Inter', sans-serif; font-weight: bold; color: black; text-decoration: none; text-align: center;}
footer 					{font-family: 'Inter', sans-serif; text-align: center; padding-bottom: 10px; background-color: black; color: white;}
footer a				{color: skyblue;}
footer p				{width: 50%; margin-left: 25%; padding-top: 5px; margin-bottom: 4px;}
img						{vertical-align: middle;}
.backto					{color: blue; padding: 0px 10px; text-decoration: none;}
.backto:hover			{background-color: black; color: #F3B02E; padding: 0px 10px;}
.halloffamer			{border: 5px solid black;}

.h1,
h1.shirtpageheading, 
h1.profilepageheading,
h2.positionheading,
.h3						{font-family: 'Inter', sans-serif; font-weight: 900; background-color: #F3B02E; margin: 1px;}

.positions				{padding-left: 4px; padding-right: 4px;}
.startshirtnumbers		{background-color: #F3B02E; text-align: center; width: 100%;}
.styleicons				{display: flex; width: 100%; text-align: center; align-content: center; justify-content: center;}

@media screen and (orientation: portrait)
{
	footer				{font-size: 10pt;}

	.appearancesummary 	{width: 50px; font-size: 1em; padding: 10px 10px;}
	.appearancesummary:hover	{color: #F3B02E; background-color: black; }
	.backroom	 		{width: auto; height: 65px;}
	.backto				{font-size: 1em;}
	.caslogo			{width: 35px; height: auto;}

	.h1,
	h1.shirtpageheading,
	h1.profilepageheading	{font-size: 2em;}

	h2					{font-size: 1em; margin: 5px 0px;}
	h2.positionheading	{position: -webkit-sticky; position: sticky; top: 40px; font-size: 1.5em; background-color: #F3B02E;}
	.h3 				{font-size: 1em;}
	.halloffamer		{width: 96%; height: auto; text-align: center;}
	.heritageheading	{width: 100%; font-size: 10pt; text-align: left;}
	.hr					{border: 1px solid black;}
	.backcolourplayer	{padding-top: 3px; padding-bottom: 2px; font-size: 0.8em;}

	.mugshot 			{width: 50px; height: auto;}
	.navbar				{padding: 4px 0px;}
	.positions 			{width: 80px; font-size: 0.8em; padding-top: 15px;}
	.positions6			{width: 80px; font-size: 0.8em; padding-top: 15px; padding-bottom: 30px; padding-right: 20px;}
	.positions7			{width: 80px; font-size: 0.8em; padding-top: 15px; padding-top: 60px; padding-left: 20px;}

	.shirt	 			{width: auto; height: 49px;}

	.positionsmenu		{display: inline-block; width: 65%; text-align: right; padding-right: 5px; font-size: 1em;}
	.positionsmenuitems	{font-family: 'Inter', sans-serif; font-size: 1em; padding: 15px 6px; color: white; font-weight: bold;}
	.positionsdropbtn 			{font-family: 'Inter', sans-serif; font-weight: bold; color: #FFFFFF; font-size: 0.9em; padding-right: 3px; background-color: black; border: none; cursor: pointer;} /* Style the dropdown button */
	.positionsdropbtn:hover 		{font-family: 'Inter', sans-serif; font-weight: bold; color: #F5B219; font-size: 0.9em; padding-right: 3px; background-color: black; border: none; cursor: pointer;} /* Style the dropdown button */
	.positionsdropdown-content	{min-width: 250px; overflow-y: auto; height: 300px;}
	.positionsdropdown-content a:hover {color: #F5B219; font-size: 0.9em;} /* Change color of dropdown links on hover */
}	
	
@media screen and (orientation: landscape)
{
	footer				{font-size: 12pt;}

	.appearancesummary 	{width: 100px; font-size: 1em; padding: 20px 50px;}
	.appearancesummary:hover	{color: #F3B02E; background-color: black; padding: 20px 50px;}
	.backroom 			{width: auto; height: 131px;}
	.backto				{font-size: 2em;}
	.caslogo			{width: 35px; height: auto;}

	.h1,
	h1.shirtpageheading,
	h1.profilepageheading	{font-size: 4em;}

	h2					{font-size: 1em; margin: 5px 0px;}
	h2.positionheading 	{position: -webkit-sticky; position: sticky; top: 40px; font-size: 3em; background-color: #F3B02E;}
	.h3 				{font-size: 2em;}
	.halloffamer		{width: 700px; height: auto;}
	.heritageheading	{width: 100%; font-size: 13pt; text-align: left; margin-bottom: 5px;}
	.hr					{border: 2px solid black;}
	.backcolourplayer	{padding-top: 3px; padding-bottom: 2px; font-size: 0.8em;}

	.mugshot 			{width: 100px; height: auto;}
	.navbar				{padding: 7px 0px;}
	.positions 			{width: 200px; font-size: 1em; padding-top: 20px;}
	.positions6 		{width: 200px; font-size: 1em; padding-top: 20px; padding-bottom: 30px; padding-right: 30px;}
	.positions7 		{width: 200px; font-size: 1em; padding-top: 20px; padding-top: 60px; padding-left: 30px;}
	.shirt	 			{width: auto; height: 98px;}

	.positionsmenu		{display: inline-block; width: 80%; text-align: right; padding-right: 20px; font-size: 1.3em;}
	.positionsmenuitems	{font-family: 'Inter', sans-serif; font-size: 1em; padding-right: 6px; color: white; font-weight: bold;}
	.positionsdropdown-content	 {min-width: 300px; overflow-y: auto; height: 400px;}
	.positionsdropdown-content a:hover {color: #F5B219; font-size: 1em;} /* Change color of dropdown links on hover */
	.positionsdropbtn 			{font-family: 'Inter', sans-serif; font-weight: bold; color: #FFFFFF; font-size: 1em; padding-right: 6px; background-color: black; border: none; cursor: pointer; margin-left: 5%; width: 90%; text-align: right;} /* Style the dropdown button */
	.positionsdropbtn:hover 		{font-family: 'Inter', sans-serif; font-weight: bold; color: #F5B219; font-size: 1em; padding-right: 6px; background-color: black; border: none; cursor: pointer;} /* Style the dropdown button */
}

/********************** Start of Heritage Branding Banner and Black Nave Bar ********************************/
.heritagebranding		{font-family: 'Inter', sans-serif; font-weight: bold; color: black; width: 100%; text-align: left;}
.heritagebrandinglogo	{width: 100%;}
.navbar 				{background-color: white; position: -webkit-sticky; position: sticky; top: 0px; z-index: 20;}
.navbarcaslogo 			{float: left; padding: 1px 5px;}
.navbarmenudropbtn 		{font-family: 'Inter', sans-serif; display: inline-block; font-weight: bold; font-size: 1.2em; color: white; text-align: center; padding: 12px 5px; text-decoration: none; z-index: 20;}
ul.navbaritems 			{list-style-type: none; margin: 0; padding: 0; overflow-x: auto; overflow-y: auto; background-color: black;}
li a:hover, .navbarmenudropdown:hover .navbarmenudropbtn {background-color: black; color: #F5B219;}
li.navbarmenudropdown 	{display: inline-block;}
.navbarmenudropdown-content 		{display: none; position: absolute; left: 50px; background-color: #222222; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1;}
.navbarmenudropdown-content a		{font-family: 'Inter', sans-serif; font-weight: bold; font-size: 14pt; display: block; padding: 5px 0px; margin: 10px; color: white; text-decoration: none; text-align: left;}
.navbarmenudropdown-content a:hover {background-color: black; color: #F5B219;}
.navbarmenudropdown:hover .navbarmenudropdown-content {display: block;}
/********************** End of Heritage Branding Banner and Black Nave Bar ********************************/
.positionsdropdown 		{font-family: 'Inter', sans-serif; display: inline-block; text-align: right;}
.positionsdropdown-content {display: none; font-size: 1em; position: absolute; right: 0; text-align: left;} /* Dropdown content */
.positionsdropdown-content a {padding: 3px 16px; text-decoration: none; display: block; background-color: #222222;} /* Links inside dropdown content */
.positionsdropdown-content span {padding: 5px 16px; text-decoration: none; display: block;} /* Links inside dropdown content */
.positionsdropdown:hover .positionsdropdown-content {display: block; background-color: #222222; color: #F5B219;} /* Show the dropdown content on hover */
.positionsmenuitems		{text-align: left}