[logepoge1]

My Website

On my google chrome the menu floats over the youtube videos but on others' browsers and my other browsers in goes under the videos but over the articles. Any fix on this?

I figured all you need is the CSS:

/* Screen CSS */

body 
{
    background-image: url('wallpaper.jpg');
	background-repeat: no-repeat;
	background-attachment: fixed;
	
}

#ticker { width: 100%; left: 10px; top: 10px; color: white; }

#thanksarticle 
{
    background-color: grey;
    border-radius: 20px;
    padding-left: 1%;
    padding-right: 1%;
    float: left;
	margin-top: 2px;
}

#thanks { text-decoration: none;}

#title {background-color: grey;
    border-radius: 20px;
	text-align: center;
	margin-right: 40%;
	margin-left: 40%;
	font-size: 50px;}

#main 
{
    background-color: grey;
    border-radius: 20px;
    padding-left: 1%;
    padding-right: 1%;
    margin-top: 1%;
    width: 45%;
    float: left;
}

#vid { float:right;
        background-color: grey;
		width: 560px;
		padding: 1em;
		border-radius: 20px;
        margin-top: 10px;
        }
        
div.floating-menu 
{
    position:fixed;
    top: 20px; 
    right: 50px;
    background:grey;
    width:150px;
    z-index:100;
    text-align:right;
	border-radius: 20px;
}

div.floating-menu a, div.floating-menu h3 
{
    display:block;
    margin:0 0.5em; 
    text-decoration:none;
}

#artright 
{
    background-color: grey;
    border-radius: 20px;
    padding-left: 1%;
    padding-right: 1%;
    margin-top: 1%;
    width: 45%;
    float: right;
}

#article2
{
    clear: both;
    float: left;
    background-color: grey;
    border-radius: 20px;
    padding-left: 1%;
    padding-right: 1%;
    margin-top: 1%;
	margin-bottom: 10px;
    width: 45%;
    
}

a 
{
    color: black;
    text-decoration: none;
}

a:hover 
{
     color:#00A0C6; 
     text-decoration:none; 
     cursor:pointer;  
}
        
footer {background-color:grey;
		border-radius: 20px;
        text-align: center;
        margin-top: 20px;
        clear: both;}