Simplified the introduction of images.

Doc/Generator/Input/Images.txt

@@ -1,10 +1,13 @@
 <- Manual.html | Back to main page
 
 Title: Images
-All image types are passed using reference counted handles so that they are automatically cleaned up when the last handle is freed.
-This does add a little allocation overhead compared to having them as value types, but generating mip-map pyramids require a unique identity to prevent aliasing.
-If a method doesn't allow the image handle to be null, it will give you a run-time warning about it in debug mode.
-You won't have to worry about if the image is a value, reference, raw pointer, shared pointer or unique, because it's always the same type of handle.
+All images are passed using reference counted handles so that they are automatically cleaned up when the last handle is freed.
+Only having one way to pass images hidden behind a referebce counted handle type removes the burden of remembering
+if you passed it as a value, reference, pointer, shared pointer or unique pointer.
+There's just one way to pass images, using the safe handles.
+By using global methods for all image operations, accidentally calling a method on a null objects
+can be caught safely instead of triggering undefined behaviour with random crashes.
+Always passing by reference for convenience however costs a little bit more to allocate, so don't create and destroy sub-images all the time.
 ---
 Title2: ImageU8
 The most basic image format used for 8-bit gray-scale images using 0 for black and 255 for white.
@@ -38,4 +41,4 @@ If you only need one channel, then use image_get_red on the result to extract th
 ---
 Title2: Saving images
 image_save can be used to save an RGBA image to a file.
----
+---

Doc/Generator/Input/Starting.txt

@@ -20,19 +20,18 @@ Select an SDK example and open its folder in a terminal.
 *
 Give permission to execute the build script.
 
-Code: chmod +x build.sh
+<PRE><BLOCKQUOTE>chmod +x build.sh</BLOCKQUOTE></PRE>
 
 *
 Run the build script.
 
-Code: ./build.sh
+<PRE><BLOCKQUOTE>./build.sh</BLOCKQUOTE></PRE>
 Title2: If no example runs, try regression tests to diagnose:
 *
 Open the source folder in a terminal and run the test script:
 
-<blockquote>chmod +x test.sh</blockquote>
-
-<blockquote>./test.sh</blockquote>
+<PRE><BLOCKQUOTE>chmod +x test.sh
+./test.sh</blockquote></BLOCKQUOTE></PRE>
 
 This will stop with a clearly visible error message if any of the tests fail.
 
@@ -85,4 +84,4 @@ Save your project, so that you can continue working on the project.
 Build and run the project.
 
 This is not an ideal solution for development if you plan to have multiple projects depending on the same library. A better solution would be to compile the whole dfpsr folder into a static library, link to it in each of your projects and refer to includeFramework.h.
----
+---

Doc/Generator/Resources/Default.css

@@ -1,22 +1,20 @@
-body { background-color: #EEFFEE; font-size: 16px; font-family: Arial;
-       color: #000000; margin: 0px;
-       padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-H1 { padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 26px; }
-H2 { padding-left: 10px; padding-top: 10px;  font-size: 20px; }
+body { background-color: #EEFFEE;  font-size: 1.0rem; font-family: Arial; max-width: 50rem;
+      color: #000000; margin: 0px;
+      padding-left:  0px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+H1 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom: 10px; font-size: 1.4rem; }
+H2 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom:  0px; font-size: 1.2rem; }
 blockquote {
   color: #FFFFFF; background: #000000;
-  font-size: 20px; font-family: monospace;
+  font-size: 1.2rem; font-family: monospace;
   padding-left: 5px; padding-right: 5px;
   padding-top: 5px; padding-bottom: 5px;
 }
-P { padding-left: 10px; }
-IMG { padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-
-A { font-size: 18px; font-family: Arial; color: #0000A0; text-decoration: none; }
-A:hover { color: #000070; background: #AAffAA; }
-A:active { color: #00A0A0; }
-.normal { font-size: 18px; color: #00A0A0; }
-.sub { font-size: 18px; color: #ffffdf; }
+P {   padding-left: 20px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+IMG { padding-left:  0px; padding-right:  0px; padding-top:  2px; padding-bottom:  0px;
+      max-width: 100%; }
+A { display: inline; border-radius: 4px;
+    font-size: 1.0rem; font-family: Arial; color: #000044; text-decoration: none;
+    padding-left: 4px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; }
+A:hover { color: #FFFF00; background: #000044; }
+A:active { color: #FFFFFF; background: #444444; }
 

Doc/Generator/main.cpp

@@ -16,7 +16,7 @@ void processContent(String &target, String content) {
 	string_split_callback([&target](ReadableString section) {
 		//printText(U"Processing: ", section, U"\n");
 		if (string_length(section) == 0) {
-			//printText(U"    Break\n");
+			//printText(U"    Break\n");+
 			string_append(target, U"\n</P><P>\n");
 		} else if (string_match(section, U"*")) {
 			//printText(U"    Dot\n");
@@ -61,6 +61,7 @@ void processContent(String &target, String content) {
 			//printText(U"    Title3: ", title, U"\n");
 			string_append(target, U"</P><H3>", title, U"</H3><P>");
 		} else if (string_beginsWith(section, U"Code:")) {
+            // TODO: Find a clean syntax for multi-line quotes in <PRE><BLOCKQUOTE>...</PRE></BLOCKQUOTE>
 			ReadableString code = string_from(section, 5);
 			//printText(U"    Code: ", code, U"\n");
 			string_append(target, U"<blockquote>", code, U"</blockquote>");

Doc/Images.html

@@ -1,35 +1,36 @@
 <!DOCTYPE html> <HTML lang=en> <HEAD> <STYLE>
-body { background-color: #EEFFEE; font-size: 16px; font-family: Arial;
-       color: #000000; margin: 0px;
-       padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-H1 { padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 26px; }
-H2 { padding-left: 10px; padding-top: 10px;  font-size: 20px; }
+body { background-color: #EEFFEE;  font-size: 1.0rem; font-family: Arial; max-width: 50rem;
+      color: #000000; margin: 0px;
+      padding-left:  0px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+H1 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom: 10px; font-size: 1.4rem; }
+H2 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom:  0px; font-size: 1.2rem; }
 blockquote {
   color: #FFFFFF; background: #000000;
-  font-size: 20px; font-family: monospace;
+  font-size: 1.2rem; font-family: monospace;
   padding-left: 5px; padding-right: 5px;
   padding-top: 5px; padding-bottom: 5px;
 }
-P { padding-left: 10px; }
-IMG { padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-
-A { font-size: 18px; font-family: Arial; color: #0000A0; text-decoration: none; }
-A:hover { color: #000070; background: #AAffAA; }
-A:active { color: #00A0A0; }
-.normal { font-size: 18px; color: #00A0A0; }
-.sub { font-size: 18px; color: #ffffdf; }
+P {   padding-left: 20px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+IMG { padding-left:  0px; padding-right:  0px; padding-top:  2px; padding-bottom:  0px;
+      max-width: 100%; }
+A { display: inline; border-radius: 4px;
+    font-size: 1.0rem; font-family: Arial; color: #000044; text-decoration: none;
+    padding-left: 4px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; }
+A:hover { color: #FFFF00; background: #000044; }
+A:active { color: #FFFFFF; background: #444444; }
 
 </STYLE> </HEAD> <BODY>
 <IMG SRC="Images/Title.png" ALT="Images/Title.png">
 <P>
 <A href="Manual.html">Back to main page</A>
 </P><P>
-</P><H1> Images</H1><P>All image types are passed using reference counted handles so that they are automatically cleaned up when the last handle is freed.
-This does add a little allocation overhead compared to having them as value types, but generating mip-map pyramids require a unique identity to prevent aliasing.
-If a method doesn't allow the image handle to be null, it will give you a run-time warning about it in debug mode.
-You won't have to worry about if the image is a value, reference, raw pointer, shared pointer or unique, because it's always the same type of handle.
+</P><H1> Images</H1><P>All images are passed using reference counted handles so that they are automatically cleaned up when the last handle is freed.
+Only having one way to pass images hidden behind a referebce counted handle type removes the burden of remembering
+if you passed it as a value, reference, pointer, shared pointer or unique pointer.
+There's just one way to pass images, using the safe handles.
+By using global methods for all image operations, accidentally calling a method on a null objects
+can be caught safely instead of triggering undefined behaviour with random crashes.
+Always passing by reference for convenience however costs a little bit more to allocate, so don't create and destroy sub-images all the time.
 </P><IMG SRC="Images/Border.png"><P>
 </P><H2> ImageU8</H2><P>The most basic image format used for 8-bit gray-scale images using 0 for black and 255 for white.
 Can be displayed by drawing it using draw_copy onto a color image for automatic conversion.

Doc/License.html

@@ -1,25 +1,23 @@
 <!DOCTYPE html> <HTML lang=en> <HEAD> <STYLE>
-body { background-color: #EEFFEE; font-size: 16px; font-family: Arial;
-       color: #000000; margin: 0px;
-       padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-H1 { padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 26px; }
-H2 { padding-left: 10px; padding-top: 10px;  font-size: 20px; }
+body { background-color: #EEFFEE;  font-size: 1.0rem; font-family: Arial; max-width: 50rem;
+      color: #000000; margin: 0px;
+      padding-left:  0px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+H1 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom: 10px; font-size: 1.4rem; }
+H2 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom:  0px; font-size: 1.2rem; }
 blockquote {
   color: #FFFFFF; background: #000000;
-  font-size: 20px; font-family: monospace;
+  font-size: 1.2rem; font-family: monospace;
   padding-left: 5px; padding-right: 5px;
   padding-top: 5px; padding-bottom: 5px;
 }
-P { padding-left: 10px; }
-IMG { padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-
-A { font-size: 18px; font-family: Arial; color: #0000A0; text-decoration: none; }
-A:hover { color: #000070; background: #AAffAA; }
-A:active { color: #00A0A0; }
-.normal { font-size: 18px; color: #00A0A0; }
-.sub { font-size: 18px; color: #ffffdf; }
+P {   padding-left: 20px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+IMG { padding-left:  0px; padding-right:  0px; padding-top:  2px; padding-bottom:  0px;
+      max-width: 100%; }
+A { display: inline; border-radius: 4px;
+    font-size: 1.0rem; font-family: Arial; color: #000044; text-decoration: none;
+    padding-left: 4px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; }
+A:hover { color: #FFFF00; background: #000044; }
+A:active { color: #FFFFFF; background: #444444; }
 
 </STYLE> </HEAD> <BODY>
 <IMG SRC="Images/Title.png" ALT="Images/Title.png">

Doc/Manual.html

@@ -1,25 +1,23 @@
 <!DOCTYPE html> <HTML lang=en> <HEAD> <STYLE>
-body { background-color: #EEFFEE; font-size: 16px; font-family: Arial;
-       color: #000000; margin: 0px;
-       padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-H1 { padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 26px; }
-H2 { padding-left: 10px; padding-top: 10px;  font-size: 20px; }
+body { background-color: #EEFFEE;  font-size: 1.0rem; font-family: Arial; max-width: 50rem;
+      color: #000000; margin: 0px;
+      padding-left:  0px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+H1 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom: 10px; font-size: 1.4rem; }
+H2 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom:  0px; font-size: 1.2rem; }
 blockquote {
   color: #FFFFFF; background: #000000;
-  font-size: 20px; font-family: monospace;
+  font-size: 1.2rem; font-family: monospace;
   padding-left: 5px; padding-right: 5px;
   padding-top: 5px; padding-bottom: 5px;
 }
-P { padding-left: 10px; }
-IMG { padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-
-A { font-size: 18px; font-family: Arial; color: #0000A0; text-decoration: none; }
-A:hover { color: #000070; background: #AAffAA; }
-A:active { color: #00A0A0; }
-.normal { font-size: 18px; color: #00A0A0; }
-.sub { font-size: 18px; color: #ffffdf; }
+P {   padding-left: 20px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+IMG { padding-left:  0px; padding-right:  0px; padding-top:  2px; padding-bottom:  0px;
+      max-width: 100%; }
+A { display: inline; border-radius: 4px;
+    font-size: 1.0rem; font-family: Arial; color: #000044; text-decoration: none;
+    padding-left: 4px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; }
+A:hover { color: #FFFF00; background: #000044; }
+A:active { color: #FFFFFF; background: #444444; }
 
 </STYLE> </HEAD> <BODY>
 <IMG SRC="Images/Title.png" ALT="Images/Title.png">

Doc/Security.html

@@ -1,25 +1,23 @@
 <!DOCTYPE html> <HTML lang=en> <HEAD> <STYLE>
-body { background-color: #EEFFEE; font-size: 16px; font-family: Arial;
-       color: #000000; margin: 0px;
-       padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-H1 { padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 26px; }
-H2 { padding-left: 10px; padding-top: 10px;  font-size: 20px; }
+body { background-color: #EEFFEE;  font-size: 1.0rem; font-family: Arial; max-width: 50rem;
+      color: #000000; margin: 0px;
+      padding-left:  0px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+H1 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom: 10px; font-size: 1.4rem; }
+H2 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom:  0px; font-size: 1.2rem; }
 blockquote {
   color: #FFFFFF; background: #000000;
-  font-size: 20px; font-family: monospace;
+  font-size: 1.2rem; font-family: monospace;
   padding-left: 5px; padding-right: 5px;
   padding-top: 5px; padding-bottom: 5px;
 }
-P { padding-left: 10px; }
-IMG { padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-
-A { font-size: 18px; font-family: Arial; color: #0000A0; text-decoration: none; }
-A:hover { color: #000070; background: #AAffAA; }
-A:active { color: #00A0A0; }
-.normal { font-size: 18px; color: #00A0A0; }
-.sub { font-size: 18px; color: #ffffdf; }
+P {   padding-left: 20px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+IMG { padding-left:  0px; padding-right:  0px; padding-top:  2px; padding-bottom:  0px;
+      max-width: 100%; }
+A { display: inline; border-radius: 4px;
+    font-size: 1.0rem; font-family: Arial; color: #000044; text-decoration: none;
+    padding-left: 4px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; }
+A:hover { color: #FFFF00; background: #000044; }
+A:active { color: #FFFFFF; background: #444444; }
 
 </STYLE> </HEAD> <BODY>
 <IMG SRC="Images/Title.png" ALT="Images/Title.png">

Doc/Starting.html

@@ -1,25 +1,23 @@
 <!DOCTYPE html> <HTML lang=en> <HEAD> <STYLE>
-body { background-color: #EEFFEE; font-size: 16px; font-family: Arial;
-       color: #000000; margin: 0px;
-       padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-H1 { padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 26px; }
-H2 { padding-left: 10px; padding-top: 10px;  font-size: 20px; }
+body { background-color: #EEFFEE;  font-size: 1.0rem; font-family: Arial; max-width: 50rem;
+      color: #000000; margin: 0px;
+      padding-left:  0px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+H1 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom: 10px; font-size: 1.4rem; }
+H2 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom:  0px; font-size: 1.2rem; }
 blockquote {
   color: #FFFFFF; background: #000000;
-  font-size: 20px; font-family: monospace;
+  font-size: 1.2rem; font-family: monospace;
   padding-left: 5px; padding-right: 5px;
   padding-top: 5px; padding-bottom: 5px;
 }
-P { padding-left: 10px; }
-IMG { padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-
-A { font-size: 18px; font-family: Arial; color: #0000A0; text-decoration: none; }
-A:hover { color: #000070; background: #AAffAA; }
-A:active { color: #00A0A0; }
-.normal { font-size: 18px; color: #00A0A0; }
-.sub { font-size: 18px; color: #ffffdf; }
+P {   padding-left: 20px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+IMG { padding-left:  0px; padding-right:  0px; padding-top:  2px; padding-bottom:  0px;
+      max-width: 100%; }
+A { display: inline; border-radius: 4px;
+    font-size: 1.0rem; font-family: Arial; color: #000044; text-decoration: none;
+    padding-left: 4px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; }
+A:hover { color: #FFFF00; background: #000044; }
+A:active { color: #FFFFFF; background: #444444; }
 
 </STYLE> </HEAD> <BODY>
 <IMG SRC="Images/Title.png" ALT="Images/Title.png">
@@ -50,20 +48,20 @@ Select an SDK example and open its folder in a terminal.
 Give permission to execute the build script.
 
 </P><P>
-<blockquote> chmod +x build.sh</blockquote>
+<PRE><BLOCKQUOTE>chmod +x build.sh</BLOCKQUOTE></PRE>
+
 </P><P>
 <IMG SRC="Images/SmallDot.png">
 Run the build script.
 
 </P><P>
-<blockquote> ./build.sh</blockquote></P><H2> If no example runs, try regression tests to diagnose:</H2><P><IMG SRC="Images/SmallDot.png">
+<PRE><BLOCKQUOTE>./build.sh</BLOCKQUOTE></PRE>
+</P><H2> If no example runs, try regression tests to diagnose:</H2><P><IMG SRC="Images/SmallDot.png">
 Open the source folder in a terminal and run the test script:
 
 </P><P>
-<blockquote>chmod +x test.sh</blockquote>
-
-</P><P>
-<blockquote>./test.sh</blockquote>
+<PRE><BLOCKQUOTE>chmod +x test.sh
+./test.sh</blockquote></BLOCKQUOTE></PRE>
 
 </P><P>
 This will stop with a clearly visible error message if any of the tests fail.

Doc/Strings.html

@@ -1,25 +1,23 @@
 <!DOCTYPE html> <HTML lang=en> <HEAD> <STYLE>
-body { background-color: #EEFFEE; font-size: 16px; font-family: Arial;
-       color: #000000; margin: 0px;
-       padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-H1 { padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 26px; }
-H2 { padding-left: 10px; padding-top: 10px;  font-size: 20px; }
+body { background-color: #EEFFEE;  font-size: 1.0rem; font-family: Arial; max-width: 50rem;
+      color: #000000; margin: 0px;
+      padding-left:  0px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+H1 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom: 10px; font-size: 1.4rem; }
+H2 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom:  0px; font-size: 1.2rem; }
 blockquote {
   color: #FFFFFF; background: #000000;
-  font-size: 20px; font-family: monospace;
+  font-size: 1.2rem; font-family: monospace;
   padding-left: 5px; padding-right: 5px;
   padding-top: 5px; padding-bottom: 5px;
 }
-P { padding-left: 10px; }
-IMG { padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-
-A { font-size: 18px; font-family: Arial; color: #0000A0; text-decoration: none; }
-A:hover { color: #000070; background: #AAffAA; }
-A:active { color: #00A0A0; }
-.normal { font-size: 18px; color: #00A0A0; }
-.sub { font-size: 18px; color: #ffffdf; }
+P {   padding-left: 20px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+IMG { padding-left:  0px; padding-right:  0px; padding-top:  2px; padding-bottom:  0px;
+      max-width: 100%; }
+A { display: inline; border-radius: 4px;
+    font-size: 1.0rem; font-family: Arial; color: #000044; text-decoration: none;
+    padding-left: 4px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; }
+A:hover { color: #FFFF00; background: #000044; }
+A:active { color: #FFFFFF; background: #444444; }
 
 </STYLE> </HEAD> <BODY>
 <IMG SRC="Images/Title.png" ALT="Images/Title.png">

Doc/StyleGuide.html

@@ -1,25 +1,23 @@
 <!DOCTYPE html> <HTML lang=en> <HEAD> <STYLE>
-body { background-color: #EEFFEE; font-size: 16px; font-family: Arial;
-       color: #000000; margin: 0px;
-       padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-H1 { padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-size: 26px; }
-H2 { padding-left: 10px; padding-top: 10px;  font-size: 20px; }
+body { background-color: #EEFFEE;  font-size: 1.0rem; font-family: Arial; max-width: 50rem;
+      color: #000000; margin: 0px;
+      padding-left:  0px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+H1 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom: 10px; font-size: 1.4rem; }
+H2 {  padding-left: 10px; padding-right:  0px; padding-top: 10px; padding-bottom:  0px; font-size: 1.2rem; }
 blockquote {
   color: #FFFFFF; background: #000000;
-  font-size: 20px; font-family: monospace;
+  font-size: 1.2rem; font-family: monospace;
   padding-left: 5px; padding-right: 5px;
   padding-top: 5px; padding-bottom: 5px;
 }
-P { padding-left: 10px; }
-IMG { padding-left: 0px; padding-right: 0px;
-       padding-top: 0px; padding-bottom: 0px; }
-
-A { font-size: 18px; font-family: Arial; color: #0000A0; text-decoration: none; }
-A:hover { color: #000070; background: #AAffAA; }
-A:active { color: #00A0A0; }
-.normal { font-size: 18px; color: #00A0A0; }
-.sub { font-size: 18px; color: #ffffdf; }
+P {   padding-left: 20px; padding-right:  0px; padding-top:  0px; padding-bottom:  0px; }
+IMG { padding-left:  0px; padding-right:  0px; padding-top:  2px; padding-bottom:  0px;
+      max-width: 100%; }
+A { display: inline; border-radius: 4px;
+    font-size: 1.0rem; font-family: Arial; color: #000044; text-decoration: none;
+    padding-left: 4px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; }
+A:hover { color: #FFFF00; background: #000044; }
+A:active { color: #FFFFFF; background: #444444; }
 
 </STYLE> </HEAD> <BODY>
 <IMG SRC="Images/Title.png" ALT="Images/Title.png">