body, h1, h2, h3, h4, form, ul, li { margin: 0; padding: 0; } body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } #contents { width: 750px; margin: 0 0 0 -375px; left: 50%; position: relative; /* background-color: #EEE;*/ } .inner-1 { /* margin: 2em;*/ } h1.artist { display: block; width: 100%; text-align: center; margin: 75px 0 0.5em 0; font-size: 3em; } h1.artist > span { width: auto; } .album { width: 100%; clear: both; } .album .pic { width: 250px; height: 250px; background-color: #DDD; float: left; margin: 0 20px 1em 0; } .album .name { display: block; float: left; width: 480px; font-size: 1.5em; margin: 0 0 0.5em 0; /* background-color: yellowgreen;*/ } .album .name span{ float: left; width: auto; } .album .tracks { display: block; float: left; width: 480px; margin-bottom: 1em; /* background-color: lightblue;*/ } .album .tracks li { display: block; float: left; width: 100%; line-height: 30px; margin: 0 0 0.2em 0; } .album .tracks li .duration { font-size: 0.5em; display: block; float: right; } span.play { display: block; float: left; width: 20px; height: 20px; border-radius: 20px; background-color: #081; margin: 0.4em 0.3em 0 0; cursor: pointer; line-height: 18px; } span.play img { width: 10px; height: 10px; margin: 0 0 0 5px; } span.play.disabled { background-color: #810; } .album h3.name span.play { display: block; width: 20px; line-height: 11px; margin: 0.2em 0 0 0.2em; background-color: #04A; } h1.artist > span > span.play { display: inline-block; float: none; width: 28px; height: 28px; line-height: 20px; margin: 0; background-color: #04A; } h1.artist > span > span.play img { margin: 10px 0 20px 0; } .search { width: 100%; text-align: center; margin-top: 200px; } .search #name { width: 300px; border: #AAA 3px solid; border-radius: 7px; font-size: 1.5em; padding: 0.2em; }