iPhone CSS no image

index.html

<div class="phone">
	<div id="case">
		<div id="earsection">
			<div id="camera"></div>
			<div id="speaker"></div>
		</div>
		<div id="screen"></div>
		<div id="button">
			<div id="buttonsquare"></div>
		</div>
	</div>
</div>

style.css

#case {
	/*wire frame*/
	height: 730px; width: 350px; border-radius: 40px 40px; border: 1px solid #000; margin: auto;
	/* color */
	-webkit-background-clip: border-box;
	-webkit-background-origin: padding-box;
	-webkit-background-size: auto;
	-webkit-box-shadow: rgb(102, 102, 102) 10px 10px 20px 0px;
	background-attachment: scroll;
	background-clip: border-box;
	background-color: rgba(0, 0, 0, 0);
	background-image: -webkit-linear-gradient(top, rgb(2, 2, 2) 9%, rgb(30, 30, 30) 63%, rgb(5, 5, 5) 97%);
	background-origin: padding-box;
	background-size: auto;
	border-bottom-color: rgb(51, 51, 51);
	border-bottom-left-radius: 40px;
	border-bottom-right-radius: 40px;
	border-bottom-style: double;
	border-bottom-width: 4px;
	border-image-outset: 0px;
	border-image-repeat: stretch;
	border-image-slice: 100%;
	border-image-source: none;
	border-image-width: 1;
	border-left-color: rgb(119, 119, 119);
	border-left-style: double;
	border-left-width: 4px;
	border-right-color: rgb(51, 51, 51);
	border-right-style: double;
	border-right-width: 4px;
	border-top-color: rgb(119, 119, 119);
	border-top-left-radius: 40px;
	border-top-right-radius: 40px;
	border-top-style: double;
	border-top-width: 4px;
	box-shadow: rgb(102, 102, 102) 10px 10px 20px 0px;
	color: rgb(58, 58, 58);
}
#earsection {margin-top: 36px; margin-left: 120px; height: 16px;}
#camera {float: left; width: 16px; height: 16px; border: 1px solid #000; border-radius: 9px 9px;
	-webkit-background-clip: border-box;
	-webkit-background-origin: padding-box;
	-webkit-background-size: auto;
	background-attachment: scroll;
	background-clip: border-box;
	background-color: rgb(17, 17, 17);
	background-image: none;
	background-origin: padding-box;
	background-size: auto;
	border-bottom-color: rgb(34, 34, 34);
	border-bottom-left-radius: 9px;
	border-bottom-right-radius: 9px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-image-outset: 0px;
	border-image-repeat: stretch;
	border-image-slice: 100%;
	border-image-source: none;
	border-image-width: 1;
	border-left-color: rgb(34, 34, 34);
	border-left-style: solid;
	border-left-width: 1px;
	border-right-color: rgb(34, 34, 34);
	border-right-style: solid;
	border-right-width: 1px;
	border-top-color: rgb(34, 34, 34);
	border-top-left-radius: 9px;
	border-top-right-radius: 9px;
	border-top-style: solid;
	border-top-width: 1px;
	color: rgb(58, 58, 58);
}
#speaker {float: left; width: 54px; height: 5px; margin-left: 15px; border: 1px solid #000; border-radius: 7px 7px;
	-webkit-background-clip: border-box;
	-webkit-background-origin: padding-box;
	-webkit-background-size: auto;
	background-attachment: scroll;
	background-clip: border-box;
	background-color: rgb(85, 85, 85);
	background-image: none;
	background-origin: padding-box;
	background-size: auto;
	border-bottom-color: rgb(51, 51, 51);
	border-bottom-left-radius: 7px;
	border-bottom-right-radius: 7px;
	border-bottom-style: solid;
	border-bottom-width: 4px;
	border-image-outset: 0px;
	border-image-repeat: stretch;
	border-image-slice: 100%;
	border-image-source: none;
	border-image-width: 1;
	border-left-color: rgb(34, 34, 34);
	border-left-style: solid;
	border-left-width: 4px;
	border-right-color: rgb(34, 34, 34);
	border-right-style: solid;
	border-right-width: 4px;
	border-top-color: rgb(17, 17, 17);
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
	border-top-style: solid;
	border-top-width: 4px;
	color: rgb(58, 58, 58);
}
#screen {clear: both; width: 330px; height: 568px; margin: auto; margin-top: 35px; border: 1px solid #000;
	-webkit-background-clip: border-box;
	-webkit-background-origin: padding-box;
	-webkit-background-size: auto;
	background-attachment: scroll;
	background-clip: border-box;
	background-color: rgba(0, 0, 0, 0);
	background-image: -webkit-linear-gradient(top, rgb(28, 28, 28) 1%, rgb(66, 66, 66) 63%, rgb(43, 43, 43) 100%);
	background-origin: padding-box;
	background-size: auto;
	border-bottom-color: rgb(51, 51, 51);
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-image-outset: 0px;
	border-image-repeat: stretch;
	border-image-slice: 100%;
	border-image-source: none;
	border-image-width: 1;
	border-left-color: rgb(34, 34, 34);
	border-left-style: solid;
	border-left-width: 1px;
	border-right-color: rgb(34, 34, 34);
	border-right-style: solid;
	border-right-width: 1px;
	border-top-color: rgb(17, 17, 17);
	border-top-style: solid;
	border-top-width: 1px;
	clear: both;
	color: rgb(255, 255, 255);
}
#button {height: 56px; width: 56px; border: 1px solid #000; border-radius: 28px 28px; margin: auto; margin-top: 10px;
	-webkit-background-clip: border-box;
	-webkit-background-origin: padding-box;
	-webkit-background-size: auto;
	background-attachment: scroll;
	background-clip: border-box;
	background-color: rgba(0, 0, 0, 0);
	background-image: -webkit-linear-gradient(top, rgb(51, 51, 51) 0%, rgb(15, 15, 15) 29%, rgb(38, 38, 38) 97%);
	background-origin: padding-box;
	background-size: auto;
	border-bottom-color: rgb(0, 0, 0);
	border-bottom-left-radius: 28px;
	border-bottom-right-radius: 28px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-image-outset: 0px;
	border-image-repeat: stretch;
	border-image-slice: 100%;
	border-image-source: none;
	border-image-width: 1;
	border-left-color: rgb(0, 0, 0);
	border-left-style: solid;
	border-left-width: 1px;
	border-right-color: rgb(0, 0, 0);
	border-right-style: solid;
	border-right-width: 1px;
	border-top-color: rgb(0, 0, 0);
	border-top-left-radius: 28px;
	border-top-right-radius: 28px;
	border-top-style: solid;
	border-top-width: 1px;
	color: rgb(58, 58, 58);
}
#buttonsquare {height: 17px; width: 17px; border: 1px solid #000; border-radius: 5px; margin: auto; margin-top: 18px; 
	border-bottom-color: rgb(136, 136, 136);
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-image-outset: 0px;
	border-image-repeat: stretch;
	border-image-slice: 100%;
	border-image-source: none;
	border-image-width: 1;
	border-left-color: rgb(136, 136, 136);
	border-left-style: solid;
	border-left-width: 1px;
	border-right-color: rgb(136, 136, 136);
	border-right-style: solid;
	border-right-width: 1px;
	border-top-color: rgb(136, 136, 136);
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	border-top-style: solid;
	border-top-width: 1px;
	color: rgb(58, 58, 58);
}

Tutorial from http://www.yarddigital.com/iphone4-css-noimage/