/* Default CSS */
/* Generated by the CoffeeCup HTML Editor - www.coffeecup.com */

footer#newerplay, #newerplaybuttons {
   display: none;
 }

footer#oldplay, #oldplaybuttons {
   display: none;
 }

footer#olderplay, #olderplaybuttons {
   display: none;
 }

#submenu-icon {
    display: none;
    position: absolute; 
    right: 30px;
    top: 48px;
	width: 51px;
	height: 51px;
	background: transparent url(../Gifs/source-icon2.gif) center;

}

a:hover#submenu-icon {

	background-color:  	#FFFF00;
    
}

/*MEDIA QUERY*/
@media only screen and (max-width : 1000px) and (orientation : landscape) {

footer.play {
position: fixed;
height: 0;
top: 0;
right: 0;
 }

#submenu-icon {
	display:inline-block;
}
    
footer.play ul.smallbuttons, footer.play:active ul.smallbuttons { 

		display: none;
		position: fixed;
		padding: 20px;
		background-color: #FDFDED;
		border: 5px solid #006600;
        right: 82px;
		top: 0px;
		width: 160px;
	}

	ul.smallbuttons li {

        display: block;
        margin-right: 0;
        margin-bottom: 0;
		width: 100%;
        font-size: 20px;
        color: black;
        text-align: left;
		padding: 0px 30px 0px 10px;
		margin: 0;

	}

ul.smallbuttons img {
   width: 22px;
   height: 22px;
   vertical-align: -10%;
 }
 
 
footer.play:hover ul.smallbuttons {
   display: block;
 }
    
ul.smallbuttons a:link, ul.smallbuttons a:visited {
color: black;
}
 
ul.smallbuttons a:hover {
color: black;
text-decoration: none;
}
 
ul.smallbuttons a:active {
color: yellow;
background-color: #191970;
text-decoration: none;
}
 
} 
  
         
/*MEDIA QUERY*/
@media only screen and (max-width : 1000px) and (orientation : portrait) {

footer.play {
position: fixed;
height: 0;
top: 0;
right: 0;
 }

#submenu-icon {

    position: absolute;
	display:inline-block;
    right: 30px;
    top: 48px;

}
    
footer.play ul.smallbuttons, footer.play:active ul.smallbuttons { 

		display: none;
		position: fixed;
		padding: 20px;
		background-color: #FDFDED;
		border: 5px solid #006600;
        right: 30px;
		top: 84px;
		width: 280px;
	}

	ul.smallbuttons li {

        display: block;
        margin-right: 0;
		width: 100%;
        font-size: 46px;
        color: black;
        text-align: left;
		padding: 0px 30px 15px 10px;
		margin: 0;

	}

ul.smallbuttons img {
   width: 60px;
   height: 60px;
   vertical-align: -14%;
 }
 
	footer.play:hover ul.smallbuttons {
		display: block;
 }
    
ul.smallbuttons a:link, ul.smallbuttons a:visited {
color: black;
}
 
ul.smallbuttons a:hover {
color: black;
text-decoration: none;
}
 
ul.smallbuttons a:active {
color: yellow;
background-color: #191970;
text-decoration: none;
}
 
}