[css-round-display] Modify the explaining sentences in example1 (about shape MF)

Author: jihyerish

css-round-display/Overview.bs

@@ -110,8 +110,16 @@ It accepts the following values:
     </dl>
 
 <div class='example'>
-    The example below shows how a web page looks in the different shapes of displays. 
-    This is a simple clock written in HTML without 'shape'.
+	The following examples show what 'shape' media feature can do when the web page
+	is on the various shapes of displays.
+	The sample web page is a simple clock application written in HTML and seen through
+	the rectangular display and the rounded display.
+
+	In the first example, the clock application doesn't implemented with 'shape' media feature, 
+	so it can't deal with different types of displays. 
+	It only uses 'rectangle.css' which is designed for the rectangular display 
+	no matter what the type of the display is.
+	On the round display, some parts of the clock application would be clipped.
 
     <pre class="lang-html">
     &lt;!DOCTYPE html>
@@ -134,23 +142,23 @@ It accepts the following values:
 	<div class="figure">
 		<div class="example-table">
 			<div class="desc">
-				<img alt="An image of a rectangle clock within a rectangle display" src="images/device_radius_clock_a.png">
+				<img alt="An image of a clock within a rectangle display" src="images/device_radius_clock_a.png">
 				<p>(A) Rectangle Display</p>
 			</div>
 			<div class="desc">
-				<img alt="An image of a round clock within a rectangle display" src="images/device_radius_clock_b.png">
+				<img alt="An image of a clock within a round display" src="images/device_radius_clock_b.png">
 				<p>(B) Round Display</p>
 			</div>
 		</div>
 		<figcaption>
-			Devices where the 'shape' media feature is applicable
+			Clock Application without the 'shape' media feature
 		</figcaption>
 	</div>
 
-    On the other hand, the example below shows how the 'shape' media feature works 
-	in the different shapes of displays. 
-	This is the same as the code above except for Media Queries usage. 
-	The shape media feature can be used as follows:
+	On the other hand, in the second example, the clock application uses 'shape' media feature.
+	The following media queries are added to the code of the clock application from 
+	the first example.
+
     <pre class="lang-html">
     &lt;!-- index.html -->
     &lt;head>
@@ -159,22 +167,22 @@ It accepts the following values:
     &lt;/head>
     </pre>
 
-    If this example code is loaded in a round display, 'round.css' will be applied by the Media Queries 
-	mechanism.
+	If the clock application is loaded in a round display, 'round.css' which is the design for
+	the round display will be applied by the Media Queries mechanism.
 
 	<div class="figure">
 		<div class="example-table">
 			<div class="desc">
-				<img alt="An image of a rectangle clock within a rectangle display" src="images/device_radius_clock_a.png">
-				<p>(A) Rectangle Display<br>(when 'shape: rect' returns 'true')</p>
+				<img alt="An image of a clock within a rectangle display" src="images/device_radius_clock_a.png">
+				<p>(A) Rectangle Display<br>(when 'shape: rect' returns ''true'')</p>
 			</div>
 			<div class="desc">
-				<img alt="An image of a round clock within a round display" src="images/device_radius_clock_c.png">
-				<p>(B) Round Display<br>(when 'shape: round' returns 'true')</p>
+				<img alt="An image of a clock within a round display" src="images/device_radius_clock_c.png">
+				<p>(B) Round Display<br>(when 'shape: round' returns ''true'')</p>
 			</div>
 		</div>
 		<figcaption>
-			Devices where the 'shape' media feature is applicable
+			Clock Application with the 'shape' media feature
 		</figcaption>
 	</div>
 </div>