Problema con submenu en PHP incluyo el CSS[Sin respuesta]

<nav id="menu">
<header class="major">
<h2>SPORTS</h2>
</header>
<ul>
<li><a href="index.php">SOCCER</a></li>
<li><a href="generic.php">Generic</a></li>
<li><a href="elements.html">Elements</a></li>
<li>
									
<span class="opener">SOCCER</span>
<span class="opener">EUROPE</span>
<span class="opener">TOP COUNTRIES</span>
<span class="opener">ENGLAND</span>
											
<input type="checkbox" id="btn-menu">
<label for="btn-menu">PREMIER LEAGUE</label>
<?php include('C:\xampp\htdocs\frogak\england\premier league.php');?>	
<input type="checkbox" id="btn-menu">
<label for="btn-menu">CHAMPIONSHIP</label>
<?php include('.php');?>
<input type="checkbox" id="btn-menu">
<label for="btn-menu">LEAGUE ONE</label>
<?php include('\league one.php');?>
<input type="checkbox" id="btn-menu">
<label for="btn-menu">LEAGUE TWO</label>
<?php include('league two.php');?>
<input type="checkbox" id="btn-menu">
<label for="btn-menu">NATIONAL LEAGUE</label>
<?php include('\national league.php');?>
<input type="checkbox" id="btn-menu">
<label for="btn-menu">FOOTBALL LEAGUE TROPHY</label>											
<li><a>TURKEY</a></li>
<li><a href="#">SCOTLAND</a></li>
<li><a href="#">SPAIN</a></li>
<span class="opener">NORTH AMERICA</span>
<span class="opener">SOUTH AMERICA</spa
<span class="opener">AFRICA</span>
<span class="opener">ASIA</span>
<span class="opener">OCEANIA</span>
<span class="opener">WORLD</span>

#menu ul {
		-moz-user-select: none;
		-webkit-user-select: none;
		-ms-user-select: none;
		user-select: none;
		color: #3d4449;
		font-family: "Roboto Slab", serif;
		font-family: 400;
		letter-spacing: 0.075em;
		list-style: none;
		margin-bottom: 0;
		padding: 0;
		text-transform: uppercase;
	}

		#menu ul a, #menu ul span {
			border-bottom: 0;
			color: inherit;
			cursor: pointer;
			display: block;
			font-size: 0.9em;
			padding: 0.625em 0;
		}

			#menu ul a:hover, #menu ul span:hover {
				color: #f56a6a;
			}

			#menu ul a.opener, #menu ul span.opener {
				-moz-transition: color 0.2s ease-in-out;
				-webkit-transition: color 0.2s ease-in-out;
				-ms-transition: color 0.2s ease-in-out;
				transition: color 0.2s ease-in-out;
				text-decoration: none;
				-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
				position: relative;
			}

				#menu ul a.opener:before, #menu ul span.opener:before {
					-moz-osx-font-smoothing: grayscale;
					-webkit-font-smoothing: antialiased;
					font-family: FontAwesome;
					font-style: normal;
					font-weight: normal;
					text-transform: none !important;
				}

				#menu ul a.opener:before, #menu ul span.opener:before {
					-moz-transition: color 0.2s ease-in-out, -moz-transform 0.2s ease-in-out;
					-webkit-transition: color 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
					-ms-transition: color 0.2s ease-in-out, -ms-transform 0.2s ease-in-out;
					transition: color 0.2s ease-in-out, transform 0.2s ease-in-out;
					color: #9fa3a6;
					content: '\f078';
					position: absolute;
					right: 0;
				}

				#menu ul a.opener:hover:before, #menu ul span.opener:hover:before {
					color: #f56a6a;
				}

				#menu ul a.opener.active + ul, #menu ul span.opener.active + ul {
					display: block;
				}

				#menu ul a.opener.active:before, #menu ul span.opener.active:before {
					-moz-transform: rotate(-180deg);
					-webkit-transform: rotate(-180deg);
					-ms-transform: rotate(-180deg);
					transform: rotate(-180deg);
				}

	#menu > ul > li {
		border-top: solid 1px rgba(210, 215, 217, 0.75);
		margin: 0.5em 0 0 0;
		padding: 0.5em 0 0 0;
	}

		#menu > ul > li > ul {
			color: #9fa3a6;
			display: none;
			margin: 0.5em 0 1.5em 0;
			padding-left: 1em;
		}

			#menu > ul > li > ul a, #menu > ul > li > ul span {
				font-size: 0.8em;
			}

			#menu > ul > li > ul > li {
				margin: 0.125em 0 0 0;
				padding: 0.125em 0 0 0;
			}

		#menu > ul > li:first-child {
			border-top: 0;
			margin-top: 0;
			padding-top: 0;
		}