* {margin:0;
padding:0;
}


body {
font-family: Arial, Helvetica, sans-serif;
    font-size: 87.5%;
    margin: .5em 15em;
}

#jukebox {margin: 1em}

body header {	
background-color:teal;
height:5em;
width:auto;	
}

body header h1 {
	font-size: 200%;
	text-align:center;
	color: rgb(80%, 80%, 20%); 	
}   

#nav_bar ul {
	
	list-style: none;
	padding: .5em 0em;
	background-color: green;
	border-bottom: 5px solid olive;
	margin-top: .5em;
}

#nav_bar li { display:inline; 
              text-align: center;
              padding: 0 1em;}

#nav_bar a {
	padding: .5em 3em;
	text-decoration: none;
	color: maroon;
	font-weight: bold;
	border-right: 2px solid white; }

#nav_bar a.current { color: yellow;}

#nav_bar a:hover, a:focus {background-color:olive;}


#main{
     width: 40%;
     height: auto;
     float: right;
     background-color: teal; 		
}

section h1 {
	font-size: 120%;
	padding: 1em;
	text-align: center;	
	
}                    

section h2 {
	font-size: 120%;
	padding: 1em;
	text-align: center;	
	
}

section p {
	padding: 1em;
	margin-left: 0em;
}

img {vertical-align: middle;}
#BPM {margin: 1em}

.video_container {
    height: auto;
    overflow-x: scroll;
    overflow-y: hidden;
    width: 95%;
    background-color:teal;
    white-space: nowrap;
    margin: 1em;
}

.video_container li { 
	display: inline-block;
    border: 1px solid maroon;
    height: 175px;
    padding: 5px;
    width: auto;
	
	}

#sidebarA {float: left;
           height:35.5em;
           width: 32%;
           background-color: teal;
           margin-bottom: 1em;
}

h2 {padding-bottom: .5em;
     margin: .5em;
     text-align: center;}

ol {margin: 0em 1em;
    padding-left: 1em;}

#sidebarA li {padding-bottom: .5em;
    text-decoration: underline;
    font-weight: bold}

#theatre {
     height:35em;
     width: 67%;
     border-left: 2px solid olive;    
     float:left;
     margin-bottom: 1em;
     border: 2px solid green;
     box-radius: 10px;
     box-shadow: 1px 1px 4px 4px olive;    		
}

#theatre h2 {
	         font-size:120%;
	         font-weight: bold;
             text-align: center;
             color: maroon;}
     
#imgDisp {width: 500px;
                      height: auto;
            margin: 0em 3em;
            text-align: center;
             }

/* the styles for the footer */
footer {
	clear: both;
}
footer p {
	margin: 5em 4em;
	padding: 1em 0;
	text-align: center;
	border-top: 2px solid teal;
}