Initial import of preliminary tutorial pieces.

27 files changed, 3470 insertions, 0 deletions

diff --git a/doc/tutorial/slides/.cvsignore b/doc/tutorial/slides/.cvsignore
new file mode 100644
index 00000000..02a98448
--- /dev/null
+++ b/doc/tutorial/slides/.cvsignore
@@ -0,0 +1,7 @@
+tutorial-???.html
+tutorial-???.png
+tutorial-???.svg
+tutorial-index.xml
+tutorial.pdf
+index.html
+
diff --git a/doc/tutorial/slides/Makefile b/doc/tutorial/slides/Makefile
new file mode 100644
index 00000000..273cc3fb
--- /dev/null
+++ b/doc/tutorial/slides/Makefile
@@ -0,0 +1,7 @@
+PROJ=tutorial
+
+all: ${PROJ}.xml
+	svgslides $^
+
+clean:
+	rm -f ${PROJ}-index.xml index.html ${PROJ}-???.html ${PROJ}-???.svg *~
diff --git a/doc/tutorial/slides/cairo-blank.svg b/doc/tutorial/slides/cairo-blank.svg
new file mode 100644
index 00000000..88119811
--- /dev/null
+++ b/doc/tutorial/slides/cairo-blank.svg
@@ -0,0 +1,487 @@
+<?xml version="1.0" ?>
+<svg width="1024" height="768"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    xmlns:ss="http://www.svgslides.org/svgslides0.1"
+    fill="black">
+
+
+	<defs id="cairo-artwork_defs">
+		<g id="hacker_emblem">
+			<!-- Note: This is similar though not identical to Keith Packard's SVG version
+				of the hacker emblem (http://www.catb.org/hacker-emblem/glider.svg) -->
+			<g id="hacker_emblem_grid" fill="white" stroke="none">
+				<!-- Outside: Top, Right, Bottom, Left -->
+				<rect x="-2.95" y="-3.05" width="6"   height="0.1" />
+				<rect x="2.95"  y="-2.95" width="0.1" height="6" />
+				<rect x="-3.05" y="2.95"  width="6"   height="0.1" />
+				<rect x="-3.05" y="-3.05" width="0.1" height="6" />
+				<!-- Vertical: Left, Right -->
+				<rect x="-1.05" y="-2.95" width="0.1" height="5.9" />
+				<rect x="0.95"  y="-2.95" width="0.1" height="5.9" />
+				<!-- Horizontal: TopLeft, TopMiddle, TopRight -->
+				<rect x="-2.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="-0.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="1.05"  y="-1.05" width="1.9" height="0.1" />
+				<!-- Horizontal: BottomLeft, BottomMiddle, BottomRight -->
+				<rect x="-2.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="-0.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="1.05"  y="0.95"  width="1.9" height="0.1" />
+			</g>
+			<g id="hacker_emblem_dots" fill="white">
+				<circle cx="0"  cy="-2" r="0.7" />
+				<circle cx="2"  cy="0"  r="0.7" />
+				<circle cx="-2" cy="2"  r="0.7" />
+				<circle cx="0"  cy="2"  r="0.7" />
+				<circle cx="2"  cy="2"  r="0.7" />
+			</g>
+		</g>
+		<g id="scarab" fill="#3B80AE">
+			<g transform="translate(-150, -170)">
+			<path id="scarab_head" d="M205.599,94.567c0-11.668-24.914-21.129-55.628-21.129
+				c-30.723,0-55.624,9.46-55.624,21.129c0,10.203,24.901,7.346,55.624,7.346C180.685,101.913,205.599,104.233,205.599,94.567z"/>
+			<path id="scarab_torso" d="M136.423,161.506c0,0,12.751,12.577,13.547,13.362
+				c2.262-2.232,13.545-13.362,13.545-13.362c7.135-7.036,87.111-6.399,91.066-6.363c-0.469-6.298-1.254-12.472-2.325-18.519
+				c-15.183-19.279-42.811-32.225-74.485-32.225h-55.518c-31.745,0-59.439,13.011-74.598,32.37c-1.054,6-1.829,12.128-2.296,18.374
+				C49.321,155.106,129.288,154.47,136.423,161.506z"/>
+			<path id="scarab_spine" d="M149.97,301.187c2.005-24.729,8.386-103.483,8.405-103.721
+				c-0.09-0.219-6.478-15.578-8.405-20.214c-1.936,4.655-8.316,19.995-8.408,20.214C141.582,197.704,147.965,276.458,149.97,301.187z"/>
+			<path id="scarab_wing_left" d="M140.403,197.149l8.862-21.31l-13.686-13.499
+				c-5.65-5.573-67.074-6.235-90.259-6.019l-0.006-0.622c-0.154,2.144-0.271,4.302-0.35,6.475
+				c-0.076,2.207,10.392,4.706,10.392,6.717c0,2.319-10.457,5.084-10.359,7.631c2.993,73.349,48.53,131.631,104.372,132.048
+				l-9.02-111.29L140.403,197.149z"/>
+			<path id="scarab_wing_right" d="M244.585,168.891c0-2.011,10.467-4.506,10.391-6.715
+				c-0.079-2.174-0.195-4.332-0.351-6.479l-0.004,0.624c-23.186-0.216-84.608,0.445-90.26,6.017l-13.688,13.502l8.915,21.438
+				l-9.017,111.29c55.854-0.417,101.378-58.698,104.373-132.049C255.04,173.976,244.585,171.209,244.585,168.891z"/>
+			<path id="scarab_leg_front_left" d="M44.506,141.12c-4.135-0.856-4.895-1.54-7.935-2.92
+				c-9.59-3.364-10.376-5.481-16.08-11.86c-7.426-8.306-12.661-20.142-17.1-29.463c-3.576-7.525-3.984-16.409-2.86-24.273
+				c0.991-6.935,7.144-12.869,12.074-18.92c5.844-7.191,10.356-14.822,17.924-21.354c7.736-6.682,23.203-9.809,26.168-19.648
+				C57.86,8.819,54.334,1.766,61.482,0c-0.366,4.703,3.639,8.477,2.397,13.575c-1.129,4.627-4.368,5.811-9.611,9.099
+				c-7.564,4.746-18.366,8.779-24.748,13.965c-7.175,5.827-4.369,13.771-10.569,20.057c-2.001,2.03-7.901,4.706-9.137,6.83
+				c-1.861,3.199-0.297,9.572-0.116,13.12c0.425,8.284,5.588,14.244,9.555,22.045c4.152,8.141,6.429,15.409,13.411,22.519
+				c4.183,4.262,11.429,4.802,16.21,10.647l-3.555,4.186L44.506,141.12z"/>
+			<path id="scarab_leg_middle_left" d="M43.94,191.922l-0.809-7.346
+				c-9.506-4.579-10.339-9.772-20.738-12.466c-23.728-6.151-21.361,11.25-15.532,26.373c5.676,14.726,8.237,30.23,14.345,44.795
+				c2.805,6.688,6.919,13.213,14.298,15.127c0.372-8.435-0.917-10.651-6.113-16.919c-4.395-5.293-3.326-12.548-6.072-18.504
+				c-3.581-7.804-4.196-15.646-7.279-23.502c-1.363-3.479-8.33-13.966-6.452-17.861c3.183-6.603,9.178-0.083,12.179,2.077
+				c4.218,3.036,6.467,2.223,11.681,2.898C34.041,186.673,37.005,188.756,43.94,191.922z"/>
+			<path id="scarab_leg_back_left" d="M65.839,257.063l-2.771-4.837
+				c-6.68,8.928-6.993,16.228-10.056,23.347c-5.277,12.263-0.157,28.851,9.854,37.676c6.052,5.375,15.907,9.618,23.122,13.136
+				c10.035,4.892,20.113,11.286,31.336,13.396c2.482,0.466,8.798,1.295,6.693-3.522c-0.975-2.237-8.091-4.591-10.146-5.734
+				c-8.312-4.623-16.377-10.524-24.142-16.176c-9.498-6.862-20.843-11.186-28.311-20.684c-3.054-3.885-3.544-4.922-2.816-9.39
+				c0.693-4.263,1.344-9.174,2.241-13.439C61.855,266.029,63.274,261.378,65.839,257.063z"/>
+			<path id="scarab_leg_front_right" d="M255.487,141.12c4.134-0.856,4.896-1.54,7.936-2.92
+				c9.583-3.364,10.369-5.481,16.071-11.86c7.428-8.306,12.661-20.142,17.115-29.463c3.574-7.525,3.983-16.409,2.86-24.273
+				c-0.992-6.935-7.157-12.869-12.087-18.92c-5.843-7.191-10.356-14.822-17.919-21.354c-7.735-6.682-23.202-9.809-26.167-19.648
+				C242.135,8.819,245.66,1.766,238.511,0c0.366,4.703-3.637,8.477-2.396,13.575c1.131,4.627,4.368,5.811,9.611,9.099
+				c7.563,4.746,18.367,8.779,24.747,13.965c7.17,5.827,4.362,13.771,10.563,20.057c2.001,2.03,7.901,4.706,9.139,6.83
+				c1.859,3.199,0.295,9.572,0.113,13.12c-0.424,8.284-5.588,14.244-9.553,22.045c-4.152,8.141-6.431,15.409-13.404,22.519
+				c-4.184,4.262-11.429,4.802-16.211,10.647l3.556,4.186L255.487,141.12z"/>
+			<path id="scarab_leg_middle_right" d="M256.053,191.922l0.81-7.346
+				c9.507-4.579,10.34-9.772,20.73-12.466c23.741-6.151,21.374,11.25,15.534,26.373c-5.676,14.726-8.238,30.23-14.347,44.795
+				c-2.804,6.688-6.911,13.213-14.291,15.127c-0.371-8.435,0.918-10.651,6.113-16.919c4.39-5.293,3.319-12.548,6.066-18.504
+				c3.58-7.804,4.197-15.646,7.278-23.502c1.363-3.479,8.33-13.966,6.453-17.861c-3.184-6.603-9.179-0.083-12.181,2.077
+				c-4.217,3.036-6.458,2.223-11.672,2.898C265.951,186.673,262.986,188.756,256.053,191.922z"/>
+			<path id="scarab_leg_back_right" d="M234.155,257.063l2.771-4.837
+				c6.679,8.928,6.991,16.228,10.057,23.347c5.274,12.263,0.154,28.851-9.854,37.676c-6.055,5.375-15.903,9.618-23.117,13.136
+				c-10.034,4.892-20.127,11.286-31.351,13.396c-2.481,0.466-8.789,1.295-6.691-3.522c0.976-2.237,8.092-4.591,10.146-5.734
+				c8.312-4.623,16.392-10.524,24.155-16.176c9.498-6.862,20.838-11.186,28.305-20.684c3.055-3.885,3.543-4.922,2.818-9.39
+				c-0.696-4.263-1.346-9.174-2.244-13.439C238.137,266.029,236.718,261.378,234.155,257.063z"/>
+			</g>
+		</g>
+		<radialGradient id="gradient_radial_dung"
+				cx="0" cy="0" r="60"
+				fx="0" fy="0" gradientUnits="userSpaceOnUse"
+		>
+			<stop offset="0"    stop-color="#9a9a9a" />
+			<stop offset="0.70" stop-color="#bababa" />
+			<stop offset="0.95" stop-color="#FFFFFF" />
+		</radialGradient>
+		<g id="dung">
+			<circle cx="0" cy="0" r="60" fill="url(#gradient_radial_dung)" />
+			<g transform="translate(-61, -61)">
+				<!-- rough equivalent: <circle cx="0" cy="0" r="60" stroke="#8a8a8a" stroke-width="2" /> -->
+				<path fill="#8a8a8a" d="M0,61c0,33.636,27.364,61,61,61s61-27.364,61-61S94.636,0,61,0S0,27.364,0,61z
+							M2,61C2,28.467,28.467,2,61,2c32.532,0,59,26.467,59,59c0,32.533-26.468,59-59,59C28.467,120,2,93.533,2,61z"/>
+			</g>
+			<use xlink:href="#hacker_emblem" x="0" y="0" transform="scale(9)" />
+		</g>
+
+		<!-- scarab dimensions: 300x340 -->
+		<!-- dung dimensions: 120x120 (radius: 60) -->
+		<!-- scarab and dung dimensions: 300x400 -->
+
+		<g id="cairo_logo">
+			<!-- dimensions: 300x400, centered -->
+			<!-- The logo (scarab and dung), with the center-point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 30)" />
+		</g>
+		<g id="cairo_logo_dung-centered">
+			<!-- The logo (scarab and dung), with the dung at (0,0), the scarab below -->
+			<use xlink:href="#dung" x="0" y="0" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0,170)" />
+		</g>
+		<g id="cairo_logo_scarab-centered">
+			<!-- The logo (scarab and dung), with the scarab's rotational center at (0,0), the dung above -->
+			<!-- The scarab's rotational center in this case is not the center of its bounding box,
+				but is calculated to be the intersection-point of the torso, spine and wings -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -175.85)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -5.85)" />
+		</g>
+		<g id="cairo_logo_top-centered">
+			<!-- The logo (scarab and dung), with the top-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 230)" /><!-- (0,170+60) -->
+		</g>
+		<g id="cairo_logo_bottom-centered">
+			<!-- The logo (scarab and dung), with the bottom-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -170)" />
+		</g>
+		<g id="cairo_logo_right-centered">
+			<!-- The logo (scarab and dung), with the right-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 30)" />
+		</g>
+		<g id="cairo_logo_left-centered">
+			<!-- The logo (scarab and dung), with the left-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 30)" />
+		</g>
+		<g id="cairo_logo_topleft-centered">
+			<!-- The logo (scarab and dung), with the top-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 230)" /><!-- (150, 170+60) -->
+		</g>
+		<g id="cairo_logo_topright-centered">
+			<!-- The logo (scarab and dung), with the top-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 230)" /><!-- (-150,170+60) -->
+		</g>
+		<g id="cairo_logo_bottomleft-centered">
+			<!-- The logo (scarab and dung), with the bottom-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, -170)" />
+		</g>
+		<g id="cairo_logo_bottomright-centered">
+			<!-- The logo (scarab and dung), with the bottom-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, -170)" />
+		</g>
+
+		<g id="cairo_text" transform="translate(0,-97)">
+		    <g transform="scale(0.1484,0.1484)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(65,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(486.75,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1234.25,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1610,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<!-- scaled by 0.72, shifted around to hit pixel boundaries -->
+		<g id="cairo_text_small_spaced" transform="translate(0,-71)">
+		    <g transform="scale(0.085,0.085)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(-151,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(379.5,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1341.5,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1826,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+
+		<!-- scaled by 0.72, shifted around to hit pixel boundaries -->
+		<g id="cairo_text_small" transform="translate(0,-71)">
+		    <g transform="scale(0.085,0.085)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(-151,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(261.75,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(764.75)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(988.5,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1355.5,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<g id="cairo_logo_text_small">
+			<!-- The logo on the left, the text 'cairo' on the right -->
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(0, 78), scale(0.1944)" />
+			<use xlink:href="#cairo_text_small" transform="translate(175,82)"/>
+		</g>
+
+		<g id="cairo_logo_with_text">
+			<!-- The logo (scarab and dung), with the text 'cairo' below, the dot of the 'i' positioned between the hind legs of the scarab -->
+			<!-- dimensions: 300x490, centered -->
+			<use xlink:href="#cairo_logo_top-centered" transform="translate(0, -245)" />
+			<use xlink:href="#cairo_text" transform="translate(0, 245)" />
+		</g>
+
+		<g id="cairo_banner">
+			<!-- The logo on the left, the text 'cairo' in the center, and a mirror image of the logo on the right -->
+			<!-- The logos are scaled such that the scarab body nearly matches the height of the text characters (excepting the 'i')
+				and the dung should nearly aligns with the dot of the 'i'. The bottoms of the logos are aligned with the bottom of the text. -->
+			<!-- dimensions: 370x88, centered -->
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(-180, 40), scale(0.1944)" />
+			<use xlink:href="#cairo_text_small" transform="translate(0, 42)" fill="black" />
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(180, 40), scale(0.1944), scale(-1, 1)" />
+		</g>
+
+		<g id="freedesktop_org_logo" style="fill:#FFFFFF;stroke:#3B80AE;stroke-width:2.4588;">
+		  <g>
+		    <path style="stroke:#BABABA;" d="M85.277,40.796c2.058,7.884-2.667,15.942-10.551,17.999L27.143,71.21c-7.884,2.057-15.943-2.667-18-10.552
+						     l-7.448-28.55c-2.057-7.884,2.667-15.942,10.551-17.999L59.83,1.695c7.884-2.057,15.942,2.667,17.999,10.551
+						     l7.449,28.55z"/>>
+		    <path style="fill:#3B80AE;stroke:none;" d="M80.444,39.778c1.749,7.854-1.816,13.621-9.504,15.447l-42.236,11.02c-7.569,2.396-14.089-1.181
+							       -15.838-8.836L6.53,33.127c-1.749-8.145,0.709-12.889,9.503-15.447L58.27,6.661
+							       c8.144-1.826,14.089,1.363,15.838,8.835l6.336,24.282z"/>>
+		    </g>g>
+		    <path style="opacity:0.5;fill:none;stroke:#FFFFFF;" d="M45.542,51.793L24.104,31.102l38.1-4.393L45.542,51.793z"/>>
+		    <path d="M72.325,28.769c0.405,1.55-0.525,3.136-2.075,3.541l-12.331,3.217c-1.551,0.404-3.137-0.525-3.542-2.076l-2.295-8.801
+			     c-0.405-1.551,0.524-3.137,2.076-3.542l12.33-3.217c1.551-0.405,3.137,0.525,3.542,2.076l2.295,8.801z"/>>
+		    <path d="M36.51,33.625c0.496,1.9-0.645,3.844-2.545,4.34l-15.112,3.943c-1.901,0.496-3.845-0.644-4.34-2.544l-2.814-10.786
+			     c-0.496-1.901,0.644-3.844,2.544-4.34l15.113-3.942c1.901-0.496,3.845,0.643,4.34,2.544l2.814,10.786z"/>>
+		    <path d="M52.493,53.208c0.278,1.065-0.36,2.154-1.425,2.432L42.6,57.848c-1.064,0.277-2.153-0.36-2.431-1.426l-1.577-6.043
+			     c-0.277-1.064,0.36-2.153,1.425-2.432l8.468-2.209c1.064-0.277,2.154,0.361,2.431,1.426l1.577,6.043z"/>>
+		    </g>g>
+	</defs>
+
+  <g font-family="Frutiger">
+    <!-- Slide title -->
+    <g id="slide_title" transform="translate(512, 153)">
+      <rect stroke="#bababa" fill="none"
+	    x="-365.5"
+	    y="-55.5"
+	    width="731"
+	    height="81"
+	    rx="10" ry="10"
+	    />
+      <rect fill="#bababa" fill-opacity="0.3"
+	    x="-360"
+	    y="-50"
+	    width="720"
+	    height="70"
+	    rx="10" ry="10"
+	    />
+      <text text-anchor="middle"
+	    fill="black"
+	    x="0"
+	    y="4" font-size="55"
+	    ss:variable="title">Slide Title</text>
+    </g>
+    
+    <!-- Slide content -->
+    <g ss:region="default">
+      <rect x="112" y="200" width="800" height="480" fill="none" stroke="blue"/>
+      <text font-size="40" fill="black"
+	    x="112" y="232">Slide content</text>
+    </g>
+    
+    <!-- Footer -->
+    <text ss:variable="URL" x="1016" y="760" text-anchor="end" font-size="20">http://cairographics.org</text>
+  </g>
+
+</svg>
diff --git a/doc/tutorial/slides/cairo-code.svg b/doc/tutorial/slides/cairo-code.svg
new file mode 100644
index 00000000..297d4c74
--- /dev/null
+++ b/doc/tutorial/slides/cairo-code.svg
@@ -0,0 +1,508 @@
+<?xml version="1.0" ?>
+<svg width="1024" height="768"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    xmlns:ss="http://www.svgslides.org/svgslides0.1"
+    fill="black">
+
+
+	<defs id="cairo-artwork_defs">
+		<g id="hacker_emblem">
+			<!-- Note: This is similar though not identical to Keith Packard's SVG version
+				of the hacker emblem (http://www.catb.org/hacker-emblem/glider.svg) -->
+			<g id="hacker_emblem_grid" fill="white" stroke="none">
+				<!-- Outside: Top, Right, Bottom, Left -->
+				<rect x="-2.95" y="-3.05" width="6"   height="0.1" />
+				<rect x="2.95"  y="-2.95" width="0.1" height="6" />
+				<rect x="-3.05" y="2.95"  width="6"   height="0.1" />
+				<rect x="-3.05" y="-3.05" width="0.1" height="6" />
+				<!-- Vertical: Left, Right -->
+				<rect x="-1.05" y="-2.95" width="0.1" height="5.9" />
+				<rect x="0.95"  y="-2.95" width="0.1" height="5.9" />
+				<!-- Horizontal: TopLeft, TopMiddle, TopRight -->
+				<rect x="-2.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="-0.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="1.05"  y="-1.05" width="1.9" height="0.1" />
+				<!-- Horizontal: BottomLeft, BottomMiddle, BottomRight -->
+				<rect x="-2.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="-0.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="1.05"  y="0.95"  width="1.9" height="0.1" />
+			</g>
+			<g id="hacker_emblem_dots" fill="white">
+				<circle cx="0"  cy="-2" r="0.7" />
+				<circle cx="2"  cy="0"  r="0.7" />
+				<circle cx="-2" cy="2"  r="0.7" />
+				<circle cx="0"  cy="2"  r="0.7" />
+				<circle cx="2"  cy="2"  r="0.7" />
+			</g>
+		</g>
+		<g id="scarab" fill="#3B80AE">
+			<g transform="translate(-150, -170)">
+			<path id="scarab_head" d="M205.599,94.567c0-11.668-24.914-21.129-55.628-21.129
+				c-30.723,0-55.624,9.46-55.624,21.129c0,10.203,24.901,7.346,55.624,7.346C180.685,101.913,205.599,104.233,205.599,94.567z"/>
+			<path id="scarab_torso" d="M136.423,161.506c0,0,12.751,12.577,13.547,13.362
+				c2.262-2.232,13.545-13.362,13.545-13.362c7.135-7.036,87.111-6.399,91.066-6.363c-0.469-6.298-1.254-12.472-2.325-18.519
+				c-15.183-19.279-42.811-32.225-74.485-32.225h-55.518c-31.745,0-59.439,13.011-74.598,32.37c-1.054,6-1.829,12.128-2.296,18.374
+				C49.321,155.106,129.288,154.47,136.423,161.506z"/>
+			<path id="scarab_spine" d="M149.97,301.187c2.005-24.729,8.386-103.483,8.405-103.721
+				c-0.09-0.219-6.478-15.578-8.405-20.214c-1.936,4.655-8.316,19.995-8.408,20.214C141.582,197.704,147.965,276.458,149.97,301.187z"/>
+			<path id="scarab_wing_left" d="M140.403,197.149l8.862-21.31l-13.686-13.499
+				c-5.65-5.573-67.074-6.235-90.259-6.019l-0.006-0.622c-0.154,2.144-0.271,4.302-0.35,6.475
+				c-0.076,2.207,10.392,4.706,10.392,6.717c0,2.319-10.457,5.084-10.359,7.631c2.993,73.349,48.53,131.631,104.372,132.048
+				l-9.02-111.29L140.403,197.149z"/>
+			<path id="scarab_wing_right" d="M244.585,168.891c0-2.011,10.467-4.506,10.391-6.715
+				c-0.079-2.174-0.195-4.332-0.351-6.479l-0.004,0.624c-23.186-0.216-84.608,0.445-90.26,6.017l-13.688,13.502l8.915,21.438
+				l-9.017,111.29c55.854-0.417,101.378-58.698,104.373-132.049C255.04,173.976,244.585,171.209,244.585,168.891z"/>
+			<path id="scarab_leg_front_left" d="M44.506,141.12c-4.135-0.856-4.895-1.54-7.935-2.92
+				c-9.59-3.364-10.376-5.481-16.08-11.86c-7.426-8.306-12.661-20.142-17.1-29.463c-3.576-7.525-3.984-16.409-2.86-24.273
+				c0.991-6.935,7.144-12.869,12.074-18.92c5.844-7.191,10.356-14.822,17.924-21.354c7.736-6.682,23.203-9.809,26.168-19.648
+				C57.86,8.819,54.334,1.766,61.482,0c-0.366,4.703,3.639,8.477,2.397,13.575c-1.129,4.627-4.368,5.811-9.611,9.099
+				c-7.564,4.746-18.366,8.779-24.748,13.965c-7.175,5.827-4.369,13.771-10.569,20.057c-2.001,2.03-7.901,4.706-9.137,6.83
+				c-1.861,3.199-0.297,9.572-0.116,13.12c0.425,8.284,5.588,14.244,9.555,22.045c4.152,8.141,6.429,15.409,13.411,22.519
+				c4.183,4.262,11.429,4.802,16.21,10.647l-3.555,4.186L44.506,141.12z"/>
+			<path id="scarab_leg_middle_left" d="M43.94,191.922l-0.809-7.346
+				c-9.506-4.579-10.339-9.772-20.738-12.466c-23.728-6.151-21.361,11.25-15.532,26.373c5.676,14.726,8.237,30.23,14.345,44.795
+				c2.805,6.688,6.919,13.213,14.298,15.127c0.372-8.435-0.917-10.651-6.113-16.919c-4.395-5.293-3.326-12.548-6.072-18.504
+				c-3.581-7.804-4.196-15.646-7.279-23.502c-1.363-3.479-8.33-13.966-6.452-17.861c3.183-6.603,9.178-0.083,12.179,2.077
+				c4.218,3.036,6.467,2.223,11.681,2.898C34.041,186.673,37.005,188.756,43.94,191.922z"/>
+			<path id="scarab_leg_back_left" d="M65.839,257.063l-2.771-4.837
+				c-6.68,8.928-6.993,16.228-10.056,23.347c-5.277,12.263-0.157,28.851,9.854,37.676c6.052,5.375,15.907,9.618,23.122,13.136
+				c10.035,4.892,20.113,11.286,31.336,13.396c2.482,0.466,8.798,1.295,6.693-3.522c-0.975-2.237-8.091-4.591-10.146-5.734
+				c-8.312-4.623-16.377-10.524-24.142-16.176c-9.498-6.862-20.843-11.186-28.311-20.684c-3.054-3.885-3.544-4.922-2.816-9.39
+				c0.693-4.263,1.344-9.174,2.241-13.439C61.855,266.029,63.274,261.378,65.839,257.063z"/>
+			<path id="scarab_leg_front_right" d="M255.487,141.12c4.134-0.856,4.896-1.54,7.936-2.92
+				c9.583-3.364,10.369-5.481,16.071-11.86c7.428-8.306,12.661-20.142,17.115-29.463c3.574-7.525,3.983-16.409,2.86-24.273
+				c-0.992-6.935-7.157-12.869-12.087-18.92c-5.843-7.191-10.356-14.822-17.919-21.354c-7.735-6.682-23.202-9.809-26.167-19.648
+				C242.135,8.819,245.66,1.766,238.511,0c0.366,4.703-3.637,8.477-2.396,13.575c1.131,4.627,4.368,5.811,9.611,9.099
+				c7.563,4.746,18.367,8.779,24.747,13.965c7.17,5.827,4.362,13.771,10.563,20.057c2.001,2.03,7.901,4.706,9.139,6.83
+				c1.859,3.199,0.295,9.572,0.113,13.12c-0.424,8.284-5.588,14.244-9.553,22.045c-4.152,8.141-6.431,15.409-13.404,22.519
+				c-4.184,4.262-11.429,4.802-16.211,10.647l3.556,4.186L255.487,141.12z"/>
+			<path id="scarab_leg_middle_right" d="M256.053,191.922l0.81-7.346
+				c9.507-4.579,10.34-9.772,20.73-12.466c23.741-6.151,21.374,11.25,15.534,26.373c-5.676,14.726-8.238,30.23-14.347,44.795
+				c-2.804,6.688-6.911,13.213-14.291,15.127c-0.371-8.435,0.918-10.651,6.113-16.919c4.39-5.293,3.319-12.548,6.066-18.504
+				c3.58-7.804,4.197-15.646,7.278-23.502c1.363-3.479,8.33-13.966,6.453-17.861c-3.184-6.603-9.179-0.083-12.181,2.077
+				c-4.217,3.036-6.458,2.223-11.672,2.898C265.951,186.673,262.986,188.756,256.053,191.922z"/>
+			<path id="scarab_leg_back_right" d="M234.155,257.063l2.771-4.837
+				c6.679,8.928,6.991,16.228,10.057,23.347c5.274,12.263,0.154,28.851-9.854,37.676c-6.055,5.375-15.903,9.618-23.117,13.136
+				c-10.034,4.892-20.127,11.286-31.351,13.396c-2.481,0.466-8.789,1.295-6.691-3.522c0.976-2.237,8.092-4.591,10.146-5.734
+				c8.312-4.623,16.392-10.524,24.155-16.176c9.498-6.862,20.838-11.186,28.305-20.684c3.055-3.885,3.543-4.922,2.818-9.39
+				c-0.696-4.263-1.346-9.174-2.244-13.439C238.137,266.029,236.718,261.378,234.155,257.063z"/>
+			</g>
+		</g>
+		<radialGradient id="gradient_radial_dung"
+				cx="0" cy="0" r="60"
+				fx="0" fy="0" gradientUnits="userSpaceOnUse"
+		>
+			<stop offset="0"    stop-color="#9a9a9a" />
+			<stop offset="0.70" stop-color="#bababa" />
+			<stop offset="0.95" stop-color="#FFFFFF" />
+		</radialGradient>
+		<g id="dung">
+			<circle cx="0" cy="0" r="60" fill="url(#gradient_radial_dung)" />
+			<g transform="translate(-61, -61)">
+				<!-- rough equivalent: <circle cx="0" cy="0" r="60" stroke="#8a8a8a" stroke-width="2" /> -->
+				<path fill="#8a8a8a" d="M0,61c0,33.636,27.364,61,61,61s61-27.364,61-61S94.636,0,61,0S0,27.364,0,61z
+							M2,61C2,28.467,28.467,2,61,2c32.532,0,59,26.467,59,59c0,32.533-26.468,59-59,59C28.467,120,2,93.533,2,61z"/>
+			</g>
+			<use xlink:href="#hacker_emblem" x="0" y="0" transform="scale(9)" />
+		</g>
+
+		<!-- scarab dimensions: 300x340 -->
+		<!-- dung dimensions: 120x120 (radius: 60) -->
+		<!-- scarab and dung dimensions: 300x400 -->
+
+		<g id="cairo_logo">
+			<!-- dimensions: 300x400, centered -->
+			<!-- The logo (scarab and dung), with the center-point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 30)" />
+		</g>
+		<g id="cairo_logo_dung-centered">
+			<!-- The logo (scarab and dung), with the dung at (0,0), the scarab below -->
+			<use xlink:href="#dung" x="0" y="0" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0,170)" />
+		</g>
+		<g id="cairo_logo_scarab-centered">
+			<!-- The logo (scarab and dung), with the scarab's rotational center at (0,0), the dung above -->
+			<!-- The scarab's rotational center in this case is not the center of its bounding box,
+				but is calculated to be the intersection-point of the torso, spine and wings -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -175.85)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -5.85)" />
+		</g>
+		<g id="cairo_logo_top-centered">
+			<!-- The logo (scarab and dung), with the top-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 230)" /><!-- (0,170+60) -->
+		</g>
+		<g id="cairo_logo_bottom-centered">
+			<!-- The logo (scarab and dung), with the bottom-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -170)" />
+		</g>
+		<g id="cairo_logo_right-centered">
+			<!-- The logo (scarab and dung), with the right-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 30)" />
+		</g>
+		<g id="cairo_logo_left-centered">
+			<!-- The logo (scarab and dung), with the left-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 30)" />
+		</g>
+		<g id="cairo_logo_topleft-centered">
+			<!-- The logo (scarab and dung), with the top-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 230)" /><!-- (150, 170+60) -->
+		</g>
+		<g id="cairo_logo_topright-centered">
+			<!-- The logo (scarab and dung), with the top-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 230)" /><!-- (-150,170+60) -->
+		</g>
+		<g id="cairo_logo_bottomleft-centered">
+			<!-- The logo (scarab and dung), with the bottom-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, -170)" />
+		</g>
+		<g id="cairo_logo_bottomright-centered">
+			<!-- The logo (scarab and dung), with the bottom-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, -170)" />
+		</g>
+
+		<g id="cairo_text" transform="translate(0,-97)">
+		    <g transform="scale(0.1484,0.1484)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(65,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(486.75,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1234.25,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1610,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<!-- scaled by 0.72, shifted around to hit pixel boundaries -->
+		<g id="cairo_text_small_spaced" transform="translate(0,-71)">
+		    <g transform="scale(0.085,0.085)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(-151,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(379.5,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1341.5,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1826,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+
+		<!-- scaled by 0.72, shifted around to hit pixel boundaries -->
+		<g id="cairo_text_small" transform="translate(0,-71)">
+		    <g transform="scale(0.085,0.085)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(-151,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(261.75,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(764.75)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(988.5,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1355.5,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<g id="cairo_logo_text_small">
+			<!-- The logo on the left, the text 'cairo' on the right -->
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(0, 78), scale(0.1944)" />
+			<use xlink:href="#cairo_text_small" transform="translate(175,82)"/>
+		</g>
+
+		<g id="cairo_logo_with_text">
+			<!-- The logo (scarab and dung), with the text 'cairo' below, the dot of the 'i' positioned between the hind legs of the scarab -->
+			<!-- dimensions: 300x490, centered -->
+			<use xlink:href="#cairo_logo_top-centered" transform="translate(0, -245)" />
+			<use xlink:href="#cairo_text" transform="translate(0, 245)" />
+		</g>
+
+		<g id="cairo_banner">
+			<!-- The logo on the left, the text 'cairo' in the center, and a mirror image of the logo on the right -->
+			<!-- The logos are scaled such that the scarab body nearly matches the height of the text characters (excepting the 'i')
+				and the dung should nearly aligns with the dot of the 'i'. The bottoms of the logos are aligned with the bottom of the text. -->
+			<!-- dimensions: 370x88, centered -->
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(-180, 40), scale(0.1944)" />
+			<use xlink:href="#cairo_text_small" transform="translate(0, 42)" fill="black" />
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(180, 40), scale(0.1944), scale(-1, 1)" />
+		</g>
+
+		<g id="freedesktop_org_logo" style="fill:#FFFFFF;stroke:#3B80AE;stroke-width:2.4588;">
+		  <g>
+		    <path style="stroke:#BABABA;" d="M85.277,40.796c2.058,7.884-2.667,15.942-10.551,17.999L27.143,71.21c-7.884,2.057-15.943-2.667-18-10.552
+						     l-7.448-28.55c-2.057-7.884,2.667-15.942,10.551-17.999L59.83,1.695c7.884-2.057,15.942,2.667,17.999,10.551
+						     l7.449,28.55z"/>>
+		    <path style="fill:#3B80AE;stroke:none;" d="M80.444,39.778c1.749,7.854-1.816,13.621-9.504,15.447l-42.236,11.02c-7.569,2.396-14.089-1.181
+							       -15.838-8.836L6.53,33.127c-1.749-8.145,0.709-12.889,9.503-15.447L58.27,6.661
+							       c8.144-1.826,14.089,1.363,15.838,8.835l6.336,24.282z"/>>
+		    </g>g>
+		    <path style="opacity:0.5;fill:none;stroke:#FFFFFF;" d="M45.542,51.793L24.104,31.102l38.1-4.393L45.542,51.793z"/>>
+		    <path d="M72.325,28.769c0.405,1.55-0.525,3.136-2.075,3.541l-12.331,3.217c-1.551,0.404-3.137-0.525-3.542-2.076l-2.295-8.801
+			     c-0.405-1.551,0.524-3.137,2.076-3.542l12.33-3.217c1.551-0.405,3.137,0.525,3.542,2.076l2.295,8.801z"/>>
+		    <path d="M36.51,33.625c0.496,1.9-0.645,3.844-2.545,4.34l-15.112,3.943c-1.901,0.496-3.845-0.644-4.34-2.544l-2.814-10.786
+			     c-0.496-1.901,0.644-3.844,2.544-4.34l15.113-3.942c1.901-0.496,3.845,0.643,4.34,2.544l2.814,10.786z"/>>
+		    <path d="M52.493,53.208c0.278,1.065-0.36,2.154-1.425,2.432L42.6,57.848c-1.064,0.277-2.153-0.36-2.431-1.426l-1.577-6.043
+			     c-0.277-1.064,0.36-2.153,1.425-2.432l8.468-2.209c1.064-0.277,2.154,0.361,2.431,1.426l1.577,6.043z"/>>
+		    </g>g>
+		    <g id="bullet">
+		      <use x="0" y="0" xlink:href="#cairo_logo" transform="translate(-6,-2) scale(0.1, 0.1)"/>>
+		    </g>
+	</defs>
+
+  <g id="watermark" transform="translate(200, 185), rotate(-50), scale(2.5)">
+    <use xlink:href="#scarab" x="0" y="170" fill-opacity="0.08"/>
+  </g>
+
+  <!-- Blue bar at top of slide -->
+  <rect x="0" y="0" width="1024" height="50" fill="#3B80AE" fill-opacity="0.3" />
+
+  <!-- Scarab and "cairo" at upper-left -->
+  <g transform="translate(10,0)">
+    <use xlink:href="#cairo_logo_text_small"/>
+  </g>
+
+  <!-- Presentation title at upper-left -->
+  <text ss:variable="presentation-subtitle" x="260" y="50" font-size="20">Presentation Sub-title</text>
+
+  <!-- freedesktop.org logo at upper-right -->
+  <use xlink:href="#freedesktop_org_logo" transform="translate(910, 12)" />
+
+  <g font-family="Frutiger">
+    <!-- Slide title -->
+    <g id="slide_title" transform="translate(512, 138)">
+      <rect stroke="#bababa" fill="none"
+	    x="-365.5"
+	    y="-55.5"
+	    width="731"
+	    height="81"
+	    rx="10" ry="10"
+	    />
+      <rect fill="#bababa" fill-opacity="0.3"
+	    x="-360"
+	    y="-50"
+	    width="720"
+	    height="70"
+	    rx="10" ry="10"
+	    />
+      <text text-anchor="middle"
+	    fill="black"
+	    x="0"
+	    y="4" font-size="55"
+	    ss:variable="title">Slide Title</text>
+    </g>
+    
+    <!-- Slide content -->
+    <g ss:region="default" font-family="Mono">
+      <rect x="112" y="170" width="800" height="480" fill="none" stroke="blue"/>
+      <text font-size="20" fill="black"
+	    x="112" y="203">Slide content</text>
+    </g>
+    
+    <!-- Footer -->
+    <text ss:variable="URL" x="1016" y="760" text-anchor="end" font-size="20">http://cairographics.org</text>
+  </g>
+
+</svg>
diff --git a/doc/tutorial/slides/cairo-separator.svg b/doc/tutorial/slides/cairo-separator.svg
new file mode 100644
index 00000000..4fe41764
--- /dev/null
+++ b/doc/tutorial/slides/cairo-separator.svg
@@ -0,0 +1,491 @@
+<?xml version="1.0" ?>
+<svg width="1024" height="768"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    xmlns:ss="http://www.svgslides.org/svgslides0.1"
+    fill="black">
+
+
+	<defs id="cairo-artwork_defs">
+		<g id="hacker_emblem">
+			<!-- Note: This is similar though not identical to Keith Packard's SVG version
+				of the hacker emblem (http://www.catb.org/hacker-emblem/glider.svg) -->
+			<g id="hacker_emblem_grid" fill="white" stroke="none">
+				<!-- Outside: Top, Right, Bottom, Left -->
+				<rect x="-2.95" y="-3.05" width="6"   height="0.1" />
+				<rect x="2.95"  y="-2.95" width="0.1" height="6" />
+				<rect x="-3.05" y="2.95"  width="6"   height="0.1" />
+				<rect x="-3.05" y="-3.05" width="0.1" height="6" />
+				<!-- Vertical: Left, Right -->
+				<rect x="-1.05" y="-2.95" width="0.1" height="5.9" />
+				<rect x="0.95"  y="-2.95" width="0.1" height="5.9" />
+				<!-- Horizontal: TopLeft, TopMiddle, TopRight -->
+				<rect x="-2.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="-0.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="1.05"  y="-1.05" width="1.9" height="0.1" />
+				<!-- Horizontal: BottomLeft, BottomMiddle, BottomRight -->
+				<rect x="-2.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="-0.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="1.05"  y="0.95"  width="1.9" height="0.1" />
+			</g>
+			<g id="hacker_emblem_dots" fill="white">
+				<circle cx="0"  cy="-2" r="0.7" />
+				<circle cx="2"  cy="0"  r="0.7" />
+				<circle cx="-2" cy="2"  r="0.7" />
+				<circle cx="0"  cy="2"  r="0.7" />
+				<circle cx="2"  cy="2"  r="0.7" />
+			</g>
+		</g>
+		<g id="scarab" fill="#3B80AE">
+			<g transform="translate(-150, -170)">
+			<path id="scarab_head" d="M205.599,94.567c0-11.668-24.914-21.129-55.628-21.129
+				c-30.723,0-55.624,9.46-55.624,21.129c0,10.203,24.901,7.346,55.624,7.346C180.685,101.913,205.599,104.233,205.599,94.567z"/>
+			<path id="scarab_torso" d="M136.423,161.506c0,0,12.751,12.577,13.547,13.362
+				c2.262-2.232,13.545-13.362,13.545-13.362c7.135-7.036,87.111-6.399,91.066-6.363c-0.469-6.298-1.254-12.472-2.325-18.519
+				c-15.183-19.279-42.811-32.225-74.485-32.225h-55.518c-31.745,0-59.439,13.011-74.598,32.37c-1.054,6-1.829,12.128-2.296,18.374
+				C49.321,155.106,129.288,154.47,136.423,161.506z"/>
+			<path id="scarab_spine" d="M149.97,301.187c2.005-24.729,8.386-103.483,8.405-103.721
+				c-0.09-0.219-6.478-15.578-8.405-20.214c-1.936,4.655-8.316,19.995-8.408,20.214C141.582,197.704,147.965,276.458,149.97,301.187z"/>
+			<path id="scarab_wing_left" d="M140.403,197.149l8.862-21.31l-13.686-13.499
+				c-5.65-5.573-67.074-6.235-90.259-6.019l-0.006-0.622c-0.154,2.144-0.271,4.302-0.35,6.475
+				c-0.076,2.207,10.392,4.706,10.392,6.717c0,2.319-10.457,5.084-10.359,7.631c2.993,73.349,48.53,131.631,104.372,132.048
+				l-9.02-111.29L140.403,197.149z"/>
+			<path id="scarab_wing_right" d="M244.585,168.891c0-2.011,10.467-4.506,10.391-6.715
+				c-0.079-2.174-0.195-4.332-0.351-6.479l-0.004,0.624c-23.186-0.216-84.608,0.445-90.26,6.017l-13.688,13.502l8.915,21.438
+				l-9.017,111.29c55.854-0.417,101.378-58.698,104.373-132.049C255.04,173.976,244.585,171.209,244.585,168.891z"/>
+			<path id="scarab_leg_front_left" d="M44.506,141.12c-4.135-0.856-4.895-1.54-7.935-2.92
+				c-9.59-3.364-10.376-5.481-16.08-11.86c-7.426-8.306-12.661-20.142-17.1-29.463c-3.576-7.525-3.984-16.409-2.86-24.273
+				c0.991-6.935,7.144-12.869,12.074-18.92c5.844-7.191,10.356-14.822,17.924-21.354c7.736-6.682,23.203-9.809,26.168-19.648
+				C57.86,8.819,54.334,1.766,61.482,0c-0.366,4.703,3.639,8.477,2.397,13.575c-1.129,4.627-4.368,5.811-9.611,9.099
+				c-7.564,4.746-18.366,8.779-24.748,13.965c-7.175,5.827-4.369,13.771-10.569,20.057c-2.001,2.03-7.901,4.706-9.137,6.83
+				c-1.861,3.199-0.297,9.572-0.116,13.12c0.425,8.284,5.588,14.244,9.555,22.045c4.152,8.141,6.429,15.409,13.411,22.519
+				c4.183,4.262,11.429,4.802,16.21,10.647l-3.555,4.186L44.506,141.12z"/>
+			<path id="scarab_leg_middle_left" d="M43.94,191.922l-0.809-7.346
+				c-9.506-4.579-10.339-9.772-20.738-12.466c-23.728-6.151-21.361,11.25-15.532,26.373c5.676,14.726,8.237,30.23,14.345,44.795
+				c2.805,6.688,6.919,13.213,14.298,15.127c0.372-8.435-0.917-10.651-6.113-16.919c-4.395-5.293-3.326-12.548-6.072-18.504
+				c-3.581-7.804-4.196-15.646-7.279-23.502c-1.363-3.479-8.33-13.966-6.452-17.861c3.183-6.603,9.178-0.083,12.179,2.077
+				c4.218,3.036,6.467,2.223,11.681,2.898C34.041,186.673,37.005,188.756,43.94,191.922z"/>
+			<path id="scarab_leg_back_left" d="M65.839,257.063l-2.771-4.837
+				c-6.68,8.928-6.993,16.228-10.056,23.347c-5.277,12.263-0.157,28.851,9.854,37.676c6.052,5.375,15.907,9.618,23.122,13.136
+				c10.035,4.892,20.113,11.286,31.336,13.396c2.482,0.466,8.798,1.295,6.693-3.522c-0.975-2.237-8.091-4.591-10.146-5.734
+				c-8.312-4.623-16.377-10.524-24.142-16.176c-9.498-6.862-20.843-11.186-28.311-20.684c-3.054-3.885-3.544-4.922-2.816-9.39
+				c0.693-4.263,1.344-9.174,2.241-13.439C61.855,266.029,63.274,261.378,65.839,257.063z"/>
+			<path id="scarab_leg_front_right" d="M255.487,141.12c4.134-0.856,4.896-1.54,7.936-2.92
+				c9.583-3.364,10.369-5.481,16.071-11.86c7.428-8.306,12.661-20.142,17.115-29.463c3.574-7.525,3.983-16.409,2.86-24.273
+				c-0.992-6.935-7.157-12.869-12.087-18.92c-5.843-7.191-10.356-14.822-17.919-21.354c-7.735-6.682-23.202-9.809-26.167-19.648
+				C242.135,8.819,245.66,1.766,238.511,0c0.366,4.703-3.637,8.477-2.396,13.575c1.131,4.627,4.368,5.811,9.611,9.099
+				c7.563,4.746,18.367,8.779,24.747,13.965c7.17,5.827,4.362,13.771,10.563,20.057c2.001,2.03,7.901,4.706,9.139,6.83
+				c1.859,3.199,0.295,9.572,0.113,13.12c-0.424,8.284-5.588,14.244-9.553,22.045c-4.152,8.141-6.431,15.409-13.404,22.519
+				c-4.184,4.262-11.429,4.802-16.211,10.647l3.556,4.186L255.487,141.12z"/>
+			<path id="scarab_leg_middle_right" d="M256.053,191.922l0.81-7.346
+				c9.507-4.579,10.34-9.772,20.73-12.466c23.741-6.151,21.374,11.25,15.534,26.373c-5.676,14.726-8.238,30.23-14.347,44.795
+				c-2.804,6.688-6.911,13.213-14.291,15.127c-0.371-8.435,0.918-10.651,6.113-16.919c4.39-5.293,3.319-12.548,6.066-18.504
+				c3.58-7.804,4.197-15.646,7.278-23.502c1.363-3.479,8.33-13.966,6.453-17.861c-3.184-6.603-9.179-0.083-12.181,2.077
+				c-4.217,3.036-6.458,2.223-11.672,2.898C265.951,186.673,262.986,188.756,256.053,191.922z"/>
+			<path id="scarab_leg_back_right" d="M234.155,257.063l2.771-4.837
+				c6.679,8.928,6.991,16.228,10.057,23.347c5.274,12.263,0.154,28.851-9.854,37.676c-6.055,5.375-15.903,9.618-23.117,13.136
+				c-10.034,4.892-20.127,11.286-31.351,13.396c-2.481,0.466-8.789,1.295-6.691-3.522c0.976-2.237,8.092-4.591,10.146-5.734
+				c8.312-4.623,16.392-10.524,24.155-16.176c9.498-6.862,20.838-11.186,28.305-20.684c3.055-3.885,3.543-4.922,2.818-9.39
+				c-0.696-4.263-1.346-9.174-2.244-13.439C238.137,266.029,236.718,261.378,234.155,257.063z"/>
+			</g>
+		</g>
+		<radialGradient id="gradient_radial_dung"
+				cx="0" cy="0" r="60"
+				fx="0" fy="0" gradientUnits="userSpaceOnUse"
+		>
+			<stop offset="0"    stop-color="#9a9a9a" />
+			<stop offset="0.70" stop-color="#bababa" />
+			<stop offset="0.95" stop-color="#FFFFFF" />
+		</radialGradient>
+		<g id="dung">
+			<circle cx="0" cy="0" r="60" fill="url(#gradient_radial_dung)" />
+			<g transform="translate(-61, -61)">
+				<!-- rough equivalent: <circle cx="0" cy="0" r="60" stroke="#8a8a8a" stroke-width="2" /> -->
+				<path fill="#8a8a8a" d="M0,61c0,33.636,27.364,61,61,61s61-27.364,61-61S94.636,0,61,0S0,27.364,0,61z
+							M2,61C2,28.467,28.467,2,61,2c32.532,0,59,26.467,59,59c0,32.533-26.468,59-59,59C28.467,120,2,93.533,2,61z"/>
+			</g>
+			<use xlink:href="#hacker_emblem" x="0" y="0" transform="scale(9)" />
+		</g>
+
+		<!-- scarab dimensions: 300x340 -->
+		<!-- dung dimensions: 120x120 (radius: 60) -->
+		<!-- scarab and dung dimensions: 300x400 -->
+
+		<g id="cairo_logo">
+			<!-- dimensions: 300x400, centered -->
+			<!-- The logo (scarab and dung), with the center-point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 30)" />
+		</g>
+		<g id="cairo_logo_dung-centered">
+			<!-- The logo (scarab and dung), with the dung at (0,0), the scarab below -->
+			<use xlink:href="#dung" x="0" y="0" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0,170)" />
+		</g>
+		<g id="cairo_logo_scarab-centered">
+			<!-- The logo (scarab and dung), with the scarab's rotational center at (0,0), the dung above -->
+			<!-- The scarab's rotational center in this case is not the center of its bounding box,
+				but is calculated to be the intersection-point of the torso, spine and wings -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -175.85)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -5.85)" />
+		</g>
+		<g id="cairo_logo_top-centered">
+			<!-- The logo (scarab and dung), with the top-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 230)" /><!-- (0,170+60) -->
+		</g>
+		<g id="cairo_logo_bottom-centered">
+			<!-- The logo (scarab and dung), with the bottom-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -170)" />
+		</g>
+		<g id="cairo_logo_right-centered">
+			<!-- The logo (scarab and dung), with the right-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 30)" />
+		</g>
+		<g id="cairo_logo_left-centered">
+			<!-- The logo (scarab and dung), with the left-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 30)" />
+		</g>
+		<g id="cairo_logo_topleft-centered">
+			<!-- The logo (scarab and dung), with the top-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 230)" /><!-- (150, 170+60) -->
+		</g>
+		<g id="cairo_logo_topright-centered">
+			<!-- The logo (scarab and dung), with the top-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 230)" /><!-- (-150,170+60) -->
+		</g>
+		<g id="cairo_logo_bottomleft-centered">
+			<!-- The logo (scarab and dung), with the bottom-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, -170)" />
+		</g>
+		<g id="cairo_logo_bottomright-centered">
+			<!-- The logo (scarab and dung), with the bottom-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, -170)" />
+		</g>
+
+		<g id="cairo_text" transform="translate(0,-97)">
+		    <g transform="scale(0.1484,0.1484)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(65,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(486.75,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1234.25,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1610,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<!-- scaled by 0.72, shifted around to hit pixel boundaries -->
+		<g id="cairo_text_small_spaced" transform="translate(0,-71)">
+		    <g transform="scale(0.085,0.085)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(-151,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(379.5,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1341.5,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1826,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+
+		<!-- scaled by 0.72, shifted around to hit pixel boundaries -->
+		<g id="cairo_text_small" transform="translate(0,-71)">
+		    <g transform="scale(0.085,0.085)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(-151,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(261.75,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(764.75)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(988.5,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1355.5,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<g id="cairo_logo_text_small">
+			<!-- The logo on the left, the text 'cairo' on the right -->
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(0, 78), scale(0.1944)" />
+			<use xlink:href="#cairo_text_small" transform="translate(175,82)"/>
+		</g>
+
+		<g id="cairo_logo_with_text">
+			<!-- The logo (scarab and dung), with the text 'cairo' below, the dot of the 'i' positioned between the hind legs of the scarab -->
+			<!-- dimensions: 300x490, centered -->
+			<use xlink:href="#cairo_logo_top-centered" transform="translate(0, -245)" />
+			<use xlink:href="#cairo_text" transform="translate(0, 245)" />
+		</g>
+
+		<g id="cairo_banner">
+			<!-- The logo on the left, the text 'cairo' in the center, and a mirror image of the logo on the right -->
+			<!-- The logos are scaled such that the scarab body nearly matches the height of the text characters (excepting the 'i')
+				and the dung should nearly aligns with the dot of the 'i'. The bottoms of the logos are aligned with the bottom of the text. -->
+			<!-- dimensions: 370x88, centered -->
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(-180, 40), scale(0.1944)" />
+			<use xlink:href="#cairo_text_small" transform="translate(0, 42)" fill="black" />
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(180, 40), scale(0.1944), scale(-1, 1)" />
+		</g>
+
+		<g id="freedesktop_org_logo" style="fill:#FFFFFF;stroke:#3B80AE;stroke-width:2.4588;">
+		  <g>
+		    <path style="stroke:#BABABA;" d="M85.277,40.796c2.058,7.884-2.667,15.942-10.551,17.999L27.143,71.21c-7.884,2.057-15.943-2.667-18-10.552
+						     l-7.448-28.55c-2.057-7.884,2.667-15.942,10.551-17.999L59.83,1.695c7.884-2.057,15.942,2.667,17.999,10.551
+						     l7.449,28.55z"/>>
+		    <path style="fill:#3B80AE;stroke:none;" d="M80.444,39.778c1.749,7.854-1.816,13.621-9.504,15.447l-42.236,11.02c-7.569,2.396-14.089-1.181
+							       -15.838-8.836L6.53,33.127c-1.749-8.145,0.709-12.889,9.503-15.447L58.27,6.661
+							       c8.144-1.826,14.089,1.363,15.838,8.835l6.336,24.282z"/>>
+		    </g>g>
+		    <path style="opacity:0.5;fill:none;stroke:#FFFFFF;" d="M45.542,51.793L24.104,31.102l38.1-4.393L45.542,51.793z"/>>
+		    <path d="M72.325,28.769c0.405,1.55-0.525,3.136-2.075,3.541l-12.331,3.217c-1.551,0.404-3.137-0.525-3.542-2.076l-2.295-8.801
+			     c-0.405-1.551,0.524-3.137,2.076-3.542l12.33-3.217c1.551-0.405,3.137,0.525,3.542,2.076l2.295,8.801z"/>>
+		    <path d="M36.51,33.625c0.496,1.9-0.645,3.844-2.545,4.34l-15.112,3.943c-1.901,0.496-3.845-0.644-4.34-2.544l-2.814-10.786
+			     c-0.496-1.901,0.644-3.844,2.544-4.34l15.113-3.942c1.901-0.496,3.845,0.643,4.34,2.544l2.814,10.786z"/>>
+		    <path d="M52.493,53.208c0.278,1.065-0.36,2.154-1.425,2.432L42.6,57.848c-1.064,0.277-2.153-0.36-2.431-1.426l-1.577-6.043
+			     c-0.277-1.064,0.36-2.153,1.425-2.432l8.468-2.209c1.064-0.277,2.154,0.361,2.431,1.426l1.577,6.043z"/>>
+		    </g>g>
+		    <g id="bullet">
+		      <use x="0" y="0" xlink:href="#cairo_logo" transform="translate(-6,-2) scale(0.1, 0.1)"/>>
+		    </g>
+	</defs>
+
+  <g id="watermark" transform="translate(200, 185), rotate(-50), scale(2.5)">
+    <use xlink:href="#scarab" x="0" y="170" fill-opacity="0.08"/>
+  </g>
+
+  <!-- Blue bar at top of slide -->
+  <rect x="0" y="0" width="1024" height="50" fill="#3B80AE" fill-opacity="0.3" />
+
+  <!-- Scarab and "cairo" at upper-left -->
+  <g transform="translate(10,0)">
+    <use xlink:href="#cairo_logo_text_small"/>
+  </g>
+
+  <!-- Presentation title at upper-left -->
+  <text ss:variable="presentation-subtitle" x="260" y="50" font-size="20">Presentation Sub-title</text>
+
+  <!-- freedesktop.org logo at upper-right -->
+  <use xlink:href="#freedesktop_org_logo" transform="translate(910, 12)" />
+
+  <g font-family="Frutiger">
+    <text text-anchor="middle"
+	  fill="black"
+	  x="512"
+	  y="300" font-size="90"
+	  ss:variable="title">Slide Title</text>
+    
+    <!-- Slide content -->
+    <g ss:region="default">
+      <rect x="112" y="400" width="800" height="280" fill="none" stroke="blue"/>
+      <text font-size="40" fill="black"
+	    x="112" y="232">Slide content</text>
+    </g>
+    
+    <!-- Footer -->
+    <text ss:variable="URL" x="1016" y="760" text-anchor="end" font-size="20">http://cairographics.org</text>
+  </g>
+
+</svg>
diff --git a/doc/tutorial/slides/cairo-title.svg b/doc/tutorial/slides/cairo-title.svg
new file mode 100644
index 00000000..6e397e93
--- /dev/null
+++ b/doc/tutorial/slides/cairo-title.svg
@@ -0,0 +1,373 @@
+<?xml version="1.0" ?>
+<svg width="1024" height="768"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    xmlns:ss="http://www.svgslides.org/svgslides0.1"
+    fill="black">
+
+	<defs id="cairo-artwork_defs">
+		<g id="hacker_emblem">
+			<!-- Note: This is similar though not identical to Keith Packard's SVG version
+				of the hacker emblem (http://www.catb.org/hacker-emblem/glider.svg) -->
+			<g id="hacker_emblem_grid" fill="white" stroke="none">
+				<!-- Outside: Top, Right, Bottom, Left -->
+				<rect x="-2.95" y="-3.05" width="6"   height="0.1" />
+				<rect x="2.95"  y="-2.95" width="0.1" height="6" />
+				<rect x="-3.05" y="2.95"  width="6"   height="0.1" />
+				<rect x="-3.05" y="-3.05" width="0.1" height="6" />
+				<!-- Vertical: Left, Right -->
+				<rect x="-1.05" y="-2.95" width="0.1" height="5.9" />
+				<rect x="0.95"  y="-2.95" width="0.1" height="5.9" />
+				<!-- Horizontal: TopLeft, TopMiddle, TopRight -->
+				<rect x="-2.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="-0.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="1.05"  y="-1.05" width="1.9" height="0.1" />
+				<!-- Horizontal: BottomLeft, BottomMiddle, BottomRight -->
+				<rect x="-2.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="-0.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="1.05"  y="0.95"  width="1.9" height="0.1" />
+			</g>
+			<g id="hacker_emblem_dots" fill="white">
+				<circle cx="0"  cy="-2" r="0.7" />
+				<circle cx="2"  cy="0"  r="0.7" />
+				<circle cx="-2" cy="2"  r="0.7" />
+				<circle cx="0"  cy="2"  r="0.7" />
+				<circle cx="2"  cy="2"  r="0.7" />
+			</g>
+		</g>
+		<g id="scarab" fill="#3B80AE">
+			<g transform="translate(-150, -170)">
+			<path id="scarab_head" d="M205.599,94.567c0-11.668-24.914-21.129-55.628-21.129
+				c-30.723,0-55.624,9.46-55.624,21.129c0,10.203,24.901,7.346,55.624,7.346C180.685,101.913,205.599,104.233,205.599,94.567z"/>
+			<path id="scarab_torso" d="M136.423,161.506c0,0,12.751,12.577,13.547,13.362
+				c2.262-2.232,13.545-13.362,13.545-13.362c7.135-7.036,87.111-6.399,91.066-6.363c-0.469-6.298-1.254-12.472-2.325-18.519
+				c-15.183-19.279-42.811-32.225-74.485-32.225h-55.518c-31.745,0-59.439,13.011-74.598,32.37c-1.054,6-1.829,12.128-2.296,18.374
+				C49.321,155.106,129.288,154.47,136.423,161.506z"/>
+			<path id="scarab_spine" d="M149.97,301.187c2.005-24.729,8.386-103.483,8.405-103.721
+				c-0.09-0.219-6.478-15.578-8.405-20.214c-1.936,4.655-8.316,19.995-8.408,20.214C141.582,197.704,147.965,276.458,149.97,301.187z"/>
+			<path id="scarab_wing_left" d="M140.403,197.149l8.862-21.31l-13.686-13.499
+				c-5.65-5.573-67.074-6.235-90.259-6.019l-0.006-0.622c-0.154,2.144-0.271,4.302-0.35,6.475
+				c-0.076,2.207,10.392,4.706,10.392,6.717c0,2.319-10.457,5.084-10.359,7.631c2.993,73.349,48.53,131.631,104.372,132.048
+				l-9.02-111.29L140.403,197.149z"/>
+			<path id="scarab_wing_right" d="M244.585,168.891c0-2.011,10.467-4.506,10.391-6.715
+				c-0.079-2.174-0.195-4.332-0.351-6.479l-0.004,0.624c-23.186-0.216-84.608,0.445-90.26,6.017l-13.688,13.502l8.915,21.438
+				l-9.017,111.29c55.854-0.417,101.378-58.698,104.373-132.049C255.04,173.976,244.585,171.209,244.585,168.891z"/>
+			<path id="scarab_leg_front_left" d="M44.506,141.12c-4.135-0.856-4.895-1.54-7.935-2.92
+				c-9.59-3.364-10.376-5.481-16.08-11.86c-7.426-8.306-12.661-20.142-17.1-29.463c-3.576-7.525-3.984-16.409-2.86-24.273
+				c0.991-6.935,7.144-12.869,12.074-18.92c5.844-7.191,10.356-14.822,17.924-21.354c7.736-6.682,23.203-9.809,26.168-19.648
+				C57.86,8.819,54.334,1.766,61.482,0c-0.366,4.703,3.639,8.477,2.397,13.575c-1.129,4.627-4.368,5.811-9.611,9.099
+				c-7.564,4.746-18.366,8.779-24.748,13.965c-7.175,5.827-4.369,13.771-10.569,20.057c-2.001,2.03-7.901,4.706-9.137,6.83
+				c-1.861,3.199-0.297,9.572-0.116,13.12c0.425,8.284,5.588,14.244,9.555,22.045c4.152,8.141,6.429,15.409,13.411,22.519
+				c4.183,4.262,11.429,4.802,16.21,10.647l-3.555,4.186L44.506,141.12z"/>
+			<path id="scarab_leg_middle_left" d="M43.94,191.922l-0.809-7.346
+				c-9.506-4.579-10.339-9.772-20.738-12.466c-23.728-6.151-21.361,11.25-15.532,26.373c5.676,14.726,8.237,30.23,14.345,44.795
+				c2.805,6.688,6.919,13.213,14.298,15.127c0.372-8.435-0.917-10.651-6.113-16.919c-4.395-5.293-3.326-12.548-6.072-18.504
+				c-3.581-7.804-4.196-15.646-7.279-23.502c-1.363-3.479-8.33-13.966-6.452-17.861c3.183-6.603,9.178-0.083,12.179,2.077
+				c4.218,3.036,6.467,2.223,11.681,2.898C34.041,186.673,37.005,188.756,43.94,191.922z"/>
+			<path id="scarab_leg_back_left" d="M65.839,257.063l-2.771-4.837
+				c-6.68,8.928-6.993,16.228-10.056,23.347c-5.277,12.263-0.157,28.851,9.854,37.676c6.052,5.375,15.907,9.618,23.122,13.136
+				c10.035,4.892,20.113,11.286,31.336,13.396c2.482,0.466,8.798,1.295,6.693-3.522c-0.975-2.237-8.091-4.591-10.146-5.734
+				c-8.312-4.623-16.377-10.524-24.142-16.176c-9.498-6.862-20.843-11.186-28.311-20.684c-3.054-3.885-3.544-4.922-2.816-9.39
+				c0.693-4.263,1.344-9.174,2.241-13.439C61.855,266.029,63.274,261.378,65.839,257.063z"/>
+			<path id="scarab_leg_front_right" d="M255.487,141.12c4.134-0.856,4.896-1.54,7.936-2.92
+				c9.583-3.364,10.369-5.481,16.071-11.86c7.428-8.306,12.661-20.142,17.115-29.463c3.574-7.525,3.983-16.409,2.86-24.273
+				c-0.992-6.935-7.157-12.869-12.087-18.92c-5.843-7.191-10.356-14.822-17.919-21.354c-7.735-6.682-23.202-9.809-26.167-19.648
+				C242.135,8.819,245.66,1.766,238.511,0c0.366,4.703-3.637,8.477-2.396,13.575c1.131,4.627,4.368,5.811,9.611,9.099
+				c7.563,4.746,18.367,8.779,24.747,13.965c7.17,5.827,4.362,13.771,10.563,20.057c2.001,2.03,7.901,4.706,9.139,6.83
+				c1.859,3.199,0.295,9.572,0.113,13.12c-0.424,8.284-5.588,14.244-9.553,22.045c-4.152,8.141-6.431,15.409-13.404,22.519
+				c-4.184,4.262-11.429,4.802-16.211,10.647l3.556,4.186L255.487,141.12z"/>
+			<path id="scarab_leg_middle_right" d="M256.053,191.922l0.81-7.346
+				c9.507-4.579,10.34-9.772,20.73-12.466c23.741-6.151,21.374,11.25,15.534,26.373c-5.676,14.726-8.238,30.23-14.347,44.795
+				c-2.804,6.688-6.911,13.213-14.291,15.127c-0.371-8.435,0.918-10.651,6.113-16.919c4.39-5.293,3.319-12.548,6.066-18.504
+				c3.58-7.804,4.197-15.646,7.278-23.502c1.363-3.479,8.33-13.966,6.453-17.861c-3.184-6.603-9.179-0.083-12.181,2.077
+				c-4.217,3.036-6.458,2.223-11.672,2.898C265.951,186.673,262.986,188.756,256.053,191.922z"/>
+			<path id="scarab_leg_back_right" d="M234.155,257.063l2.771-4.837
+				c6.679,8.928,6.991,16.228,10.057,23.347c5.274,12.263,0.154,28.851-9.854,37.676c-6.055,5.375-15.903,9.618-23.117,13.136
+				c-10.034,4.892-20.127,11.286-31.351,13.396c-2.481,0.466-8.789,1.295-6.691-3.522c0.976-2.237,8.092-4.591,10.146-5.734
+				c8.312-4.623,16.392-10.524,24.155-16.176c9.498-6.862,20.838-11.186,28.305-20.684c3.055-3.885,3.543-4.922,2.818-9.39
+				c-0.696-4.263-1.346-9.174-2.244-13.439C238.137,266.029,236.718,261.378,234.155,257.063z"/>
+			</g>
+		</g>
+		<radialGradient id="gradient_radial_dung"
+				cx="0" cy="0" r="60"
+				fx="0" fy="0" gradientUnits="userSpaceOnUse"
+		>
+			<stop offset="0"    stop-color="#9a9a9a" />
+			<stop offset="0.70" stop-color="#bababa" />
+			<stop offset="0.95" stop-color="#FFFFFF" />
+		</radialGradient>
+		<g id="dung">
+			<circle cx="0" cy="0" r="60" fill="url(#gradient_radial_dung)" />
+			<g transform="translate(-61, -61)">
+				<!-- rough equivalent: <circle cx="0" cy="0" r="60" stroke="#8a8a8a" stroke-width="2" /> -->
+				<path fill="#8a8a8a" d="M0,61c0,33.636,27.364,61,61,61s61-27.364,61-61S94.636,0,61,0S0,27.364,0,61z
+							M2,61C2,28.467,28.467,2,61,2c32.532,0,59,26.467,59,59c0,32.533-26.468,59-59,59C28.467,120,2,93.533,2,61z"/>
+			</g>
+			<use xlink:href="#hacker_emblem" x="0" y="0" transform="scale(9)" />
+		</g>
+
+		<!-- scarab dimensions: 300x340 -->
+		<!-- dung dimensions: 120x120 (radius: 60) -->
+		<!-- scarab and dung dimensions: 300x400 -->
+
+		<g id="cairo_logo">
+			<!-- dimensions: 300x400, centered -->
+			<!-- The logo (scarab and dung), with the center-point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 30)" />
+		</g>
+		<g id="cairo_logo_dung-centered">
+			<!-- The logo (scarab and dung), with the dung at (0,0), the scarab below -->
+			<use xlink:href="#dung" x="0" y="0" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0,170)" />
+		</g>
+		<g id="cairo_logo_scarab-centered">
+			<!-- The logo (scarab and dung), with the scarab's rotational center at (0,0), the dung above -->
+			<!-- The scarab's rotational center in this case is not the center of its bounding box,
+				but is calculated to be the intersection-point of the torso, spine and wings -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -175.85)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -5.85)" />
+		</g>
+		<g id="cairo_logo_top-centered">
+			<!-- The logo (scarab and dung), with the top-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 230)" /><!-- (0,170+60) -->
+		</g>
+		<g id="cairo_logo_bottom-centered">
+			<!-- The logo (scarab and dung), with the bottom-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -170)" />
+		</g>
+		<g id="cairo_logo_right-centered">
+			<!-- The logo (scarab and dung), with the right-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 30)" />
+		</g>
+		<g id="cairo_logo_left-centered">
+			<!-- The logo (scarab and dung), with the left-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 30)" />
+		</g>
+		<g id="cairo_logo_topleft-centered">
+			<!-- The logo (scarab and dung), with the top-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 230)" /><!-- (150, 170+60) -->
+		</g>
+		<g id="cairo_logo_topright-centered">
+			<!-- The logo (scarab and dung), with the top-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 230)" /><!-- (-150,170+60) -->
+		</g>
+		<g id="cairo_logo_bottomleft-centered">
+			<!-- The logo (scarab and dung), with the bottom-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, -170)" />
+		</g>
+		<g id="cairo_logo_bottomright-centered">
+			<!-- The logo (scarab and dung), with the bottom-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, -170)" />
+		</g>
+
+		<g id="cairo_text" transform="translate(0,-97)">
+		    <g transform="scale(0.1484,0.1484)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(65,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(486.75,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1234.25,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1610,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<!-- scaled by 0.72, shifted around to hit pixel boundaries -->
+		<g id="cairo_text_small" transform="translate(0,-71)">
+		    <g transform="scale(0.085,0.085)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(-151,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(379.5,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1341.5,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1826,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<g id="cairo_logo_with_text">
+			<!-- The logo (scarab and dung), with the text 'cairo' below, the dot of the 'i' positioned between the hind legs of the scarab -->
+			<!-- dimensions: 300x490, centered -->
+			<use xlink:href="#cairo_logo_top-centered" transform="translate(0, -245)" />
+			<use xlink:href="#cairo_text" transform="translate(0, 245)" />
+		</g>
+
+		<g id="cairo_banner">
+			<!-- The logo on the left, the text 'cairo' in the center, and a mirror image of the logo on the right -->
+			<!-- The logos are scaled such that the scarab body nearly matches the height of the text characters (excepting the 'i')
+				and the dung should nearly aligns with the dot of the 'i'. The bottoms of the logos are aligned with the bottom of the text. -->
+			<!-- dimensions: 370x88, centered -->
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(-180, 40), scale(0.1944)" />
+			<use xlink:href="#cairo_text_small" transform="translate(0, 42)" fill="black" />
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(180, 40), scale(0.1944), scale(-1, 1)" />
+		</g>
+	</defs>
+
+<g fill="black">
+
+  <!-- freedesktop.org logo at upper-right -->
+  <use xlink:href="#freedesktop_org_logo" transform="translate(910, 12)" />
+
+  <g font-family="Frutiger">
+
+    <use xlink:href="#cairo_logo_with_text" transform="translate(256, 420)" />
+
+    <g id="slide_title" transform="translate(512, 80)">
+      <text text-anchor="middle"
+	    fill="black"
+	    x="0"
+	    y="10" font-size="55"
+	    ss:variable="presentation">Presentation Title</text>
+    </g>
+  
+    <g ss:region="default" text-anchor="middle">
+      <rect x="690" y="270" width="2" height="350" fill="none" stroke="blue"/>
+      <text font-size="40" fill="black"
+	    x="690" y="310">Slide content</text>
+    </g>
+  </g>
+
+</g>
+
+</svg>
diff --git a/doc/tutorial/slides/cairo.svg b/doc/tutorial/slides/cairo.svg
new file mode 100644
index 00000000..5a9449b7
--- /dev/null
+++ b/doc/tutorial/slides/cairo.svg
@@ -0,0 +1,508 @@
+<?xml version="1.0" ?>
+<svg width="1024" height="768"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    xmlns:ss="http://www.svgslides.org/svgslides0.1"
+    fill="black">
+
+
+	<defs id="cairo-artwork_defs">
+		<g id="hacker_emblem">
+			<!-- Note: This is similar though not identical to Keith Packard's SVG version
+				of the hacker emblem (http://www.catb.org/hacker-emblem/glider.svg) -->
+			<g id="hacker_emblem_grid" fill="white" stroke="none">
+				<!-- Outside: Top, Right, Bottom, Left -->
+				<rect x="-2.95" y="-3.05" width="6"   height="0.1" />
+				<rect x="2.95"  y="-2.95" width="0.1" height="6" />
+				<rect x="-3.05" y="2.95"  width="6"   height="0.1" />
+				<rect x="-3.05" y="-3.05" width="0.1" height="6" />
+				<!-- Vertical: Left, Right -->
+				<rect x="-1.05" y="-2.95" width="0.1" height="5.9" />
+				<rect x="0.95"  y="-2.95" width="0.1" height="5.9" />
+				<!-- Horizontal: TopLeft, TopMiddle, TopRight -->
+				<rect x="-2.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="-0.95" y="-1.05" width="1.9" height="0.1" />
+				<rect x="1.05"  y="-1.05" width="1.9" height="0.1" />
+				<!-- Horizontal: BottomLeft, BottomMiddle, BottomRight -->
+				<rect x="-2.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="-0.95" y="0.95"  width="1.9" height="0.1" />
+				<rect x="1.05"  y="0.95"  width="1.9" height="0.1" />
+			</g>
+			<g id="hacker_emblem_dots" fill="white">
+				<circle cx="0"  cy="-2" r="0.7" />
+				<circle cx="2"  cy="0"  r="0.7" />
+				<circle cx="-2" cy="2"  r="0.7" />
+				<circle cx="0"  cy="2"  r="0.7" />
+				<circle cx="2"  cy="2"  r="0.7" />
+			</g>
+		</g>
+		<g id="scarab" fill="#3B80AE">
+			<g transform="translate(-150, -170)">
+			<path id="scarab_head" d="M205.599,94.567c0-11.668-24.914-21.129-55.628-21.129
+				c-30.723,0-55.624,9.46-55.624,21.129c0,10.203,24.901,7.346,55.624,7.346C180.685,101.913,205.599,104.233,205.599,94.567z"/>
+			<path id="scarab_torso" d="M136.423,161.506c0,0,12.751,12.577,13.547,13.362
+				c2.262-2.232,13.545-13.362,13.545-13.362c7.135-7.036,87.111-6.399,91.066-6.363c-0.469-6.298-1.254-12.472-2.325-18.519
+				c-15.183-19.279-42.811-32.225-74.485-32.225h-55.518c-31.745,0-59.439,13.011-74.598,32.37c-1.054,6-1.829,12.128-2.296,18.374
+				C49.321,155.106,129.288,154.47,136.423,161.506z"/>
+			<path id="scarab_spine" d="M149.97,301.187c2.005-24.729,8.386-103.483,8.405-103.721
+				c-0.09-0.219-6.478-15.578-8.405-20.214c-1.936,4.655-8.316,19.995-8.408,20.214C141.582,197.704,147.965,276.458,149.97,301.187z"/>
+			<path id="scarab_wing_left" d="M140.403,197.149l8.862-21.31l-13.686-13.499
+				c-5.65-5.573-67.074-6.235-90.259-6.019l-0.006-0.622c-0.154,2.144-0.271,4.302-0.35,6.475
+				c-0.076,2.207,10.392,4.706,10.392,6.717c0,2.319-10.457,5.084-10.359,7.631c2.993,73.349,48.53,131.631,104.372,132.048
+				l-9.02-111.29L140.403,197.149z"/>
+			<path id="scarab_wing_right" d="M244.585,168.891c0-2.011,10.467-4.506,10.391-6.715
+				c-0.079-2.174-0.195-4.332-0.351-6.479l-0.004,0.624c-23.186-0.216-84.608,0.445-90.26,6.017l-13.688,13.502l8.915,21.438
+				l-9.017,111.29c55.854-0.417,101.378-58.698,104.373-132.049C255.04,173.976,244.585,171.209,244.585,168.891z"/>
+			<path id="scarab_leg_front_left" d="M44.506,141.12c-4.135-0.856-4.895-1.54-7.935-2.92
+				c-9.59-3.364-10.376-5.481-16.08-11.86c-7.426-8.306-12.661-20.142-17.1-29.463c-3.576-7.525-3.984-16.409-2.86-24.273
+				c0.991-6.935,7.144-12.869,12.074-18.92c5.844-7.191,10.356-14.822,17.924-21.354c7.736-6.682,23.203-9.809,26.168-19.648
+				C57.86,8.819,54.334,1.766,61.482,0c-0.366,4.703,3.639,8.477,2.397,13.575c-1.129,4.627-4.368,5.811-9.611,9.099
+				c-7.564,4.746-18.366,8.779-24.748,13.965c-7.175,5.827-4.369,13.771-10.569,20.057c-2.001,2.03-7.901,4.706-9.137,6.83
+				c-1.861,3.199-0.297,9.572-0.116,13.12c0.425,8.284,5.588,14.244,9.555,22.045c4.152,8.141,6.429,15.409,13.411,22.519
+				c4.183,4.262,11.429,4.802,16.21,10.647l-3.555,4.186L44.506,141.12z"/>
+			<path id="scarab_leg_middle_left" d="M43.94,191.922l-0.809-7.346
+				c-9.506-4.579-10.339-9.772-20.738-12.466c-23.728-6.151-21.361,11.25-15.532,26.373c5.676,14.726,8.237,30.23,14.345,44.795
+				c2.805,6.688,6.919,13.213,14.298,15.127c0.372-8.435-0.917-10.651-6.113-16.919c-4.395-5.293-3.326-12.548-6.072-18.504
+				c-3.581-7.804-4.196-15.646-7.279-23.502c-1.363-3.479-8.33-13.966-6.452-17.861c3.183-6.603,9.178-0.083,12.179,2.077
+				c4.218,3.036,6.467,2.223,11.681,2.898C34.041,186.673,37.005,188.756,43.94,191.922z"/>
+			<path id="scarab_leg_back_left" d="M65.839,257.063l-2.771-4.837
+				c-6.68,8.928-6.993,16.228-10.056,23.347c-5.277,12.263-0.157,28.851,9.854,37.676c6.052,5.375,15.907,9.618,23.122,13.136
+				c10.035,4.892,20.113,11.286,31.336,13.396c2.482,0.466,8.798,1.295,6.693-3.522c-0.975-2.237-8.091-4.591-10.146-5.734
+				c-8.312-4.623-16.377-10.524-24.142-16.176c-9.498-6.862-20.843-11.186-28.311-20.684c-3.054-3.885-3.544-4.922-2.816-9.39
+				c0.693-4.263,1.344-9.174,2.241-13.439C61.855,266.029,63.274,261.378,65.839,257.063z"/>
+			<path id="scarab_leg_front_right" d="M255.487,141.12c4.134-0.856,4.896-1.54,7.936-2.92
+				c9.583-3.364,10.369-5.481,16.071-11.86c7.428-8.306,12.661-20.142,17.115-29.463c3.574-7.525,3.983-16.409,2.86-24.273
+				c-0.992-6.935-7.157-12.869-12.087-18.92c-5.843-7.191-10.356-14.822-17.919-21.354c-7.735-6.682-23.202-9.809-26.167-19.648
+				C242.135,8.819,245.66,1.766,238.511,0c0.366,4.703-3.637,8.477-2.396,13.575c1.131,4.627,4.368,5.811,9.611,9.099
+				c7.563,4.746,18.367,8.779,24.747,13.965c7.17,5.827,4.362,13.771,10.563,20.057c2.001,2.03,7.901,4.706,9.139,6.83
+				c1.859,3.199,0.295,9.572,0.113,13.12c-0.424,8.284-5.588,14.244-9.553,22.045c-4.152,8.141-6.431,15.409-13.404,22.519
+				c-4.184,4.262-11.429,4.802-16.211,10.647l3.556,4.186L255.487,141.12z"/>
+			<path id="scarab_leg_middle_right" d="M256.053,191.922l0.81-7.346
+				c9.507-4.579,10.34-9.772,20.73-12.466c23.741-6.151,21.374,11.25,15.534,26.373c-5.676,14.726-8.238,30.23-14.347,44.795
+				c-2.804,6.688-6.911,13.213-14.291,15.127c-0.371-8.435,0.918-10.651,6.113-16.919c4.39-5.293,3.319-12.548,6.066-18.504
+				c3.58-7.804,4.197-15.646,7.278-23.502c1.363-3.479,8.33-13.966,6.453-17.861c-3.184-6.603-9.179-0.083-12.181,2.077
+				c-4.217,3.036-6.458,2.223-11.672,2.898C265.951,186.673,262.986,188.756,256.053,191.922z"/>
+			<path id="scarab_leg_back_right" d="M234.155,257.063l2.771-4.837
+				c6.679,8.928,6.991,16.228,10.057,23.347c5.274,12.263,0.154,28.851-9.854,37.676c-6.055,5.375-15.903,9.618-23.117,13.136
+				c-10.034,4.892-20.127,11.286-31.351,13.396c-2.481,0.466-8.789,1.295-6.691-3.522c0.976-2.237,8.092-4.591,10.146-5.734
+				c8.312-4.623,16.392-10.524,24.155-16.176c9.498-6.862,20.838-11.186,28.305-20.684c3.055-3.885,3.543-4.922,2.818-9.39
+				c-0.696-4.263-1.346-9.174-2.244-13.439C238.137,266.029,236.718,261.378,234.155,257.063z"/>
+			</g>
+		</g>
+		<radialGradient id="gradient_radial_dung"
+				cx="0" cy="0" r="60"
+				fx="0" fy="0" gradientUnits="userSpaceOnUse"
+		>
+			<stop offset="0"    stop-color="#9a9a9a" />
+			<stop offset="0.70" stop-color="#bababa" />
+			<stop offset="0.95" stop-color="#FFFFFF" />
+		</radialGradient>
+		<g id="dung">
+			<circle cx="0" cy="0" r="60" fill="url(#gradient_radial_dung)" />
+			<g transform="translate(-61, -61)">
+				<!-- rough equivalent: <circle cx="0" cy="0" r="60" stroke="#8a8a8a" stroke-width="2" /> -->
+				<path fill="#8a8a8a" d="M0,61c0,33.636,27.364,61,61,61s61-27.364,61-61S94.636,0,61,0S0,27.364,0,61z
+							M2,61C2,28.467,28.467,2,61,2c32.532,0,59,26.467,59,59c0,32.533-26.468,59-59,59C28.467,120,2,93.533,2,61z"/>
+			</g>
+			<use xlink:href="#hacker_emblem" x="0" y="0" transform="scale(9)" />
+		</g>
+
+		<!-- scarab dimensions: 300x340 -->
+		<!-- dung dimensions: 120x120 (radius: 60) -->
+		<!-- scarab and dung dimensions: 300x400 -->
+
+		<g id="cairo_logo">
+			<!-- dimensions: 300x400, centered -->
+			<!-- The logo (scarab and dung), with the center-point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 30)" />
+		</g>
+		<g id="cairo_logo_dung-centered">
+			<!-- The logo (scarab and dung), with the dung at (0,0), the scarab below -->
+			<use xlink:href="#dung" x="0" y="0" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0,170)" />
+		</g>
+		<g id="cairo_logo_scarab-centered">
+			<!-- The logo (scarab and dung), with the scarab's rotational center at (0,0), the dung above -->
+			<!-- The scarab's rotational center in this case is not the center of its bounding box,
+				but is calculated to be the intersection-point of the torso, spine and wings -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -175.85)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -5.85)" />
+		</g>
+		<g id="cairo_logo_top-centered">
+			<!-- The logo (scarab and dung), with the top-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, 230)" /><!-- (0,170+60) -->
+		</g>
+		<g id="cairo_logo_bottom-centered">
+			<!-- The logo (scarab and dung), with the bottom-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(0, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(0, -170)" />
+		</g>
+		<g id="cairo_logo_right-centered">
+			<!-- The logo (scarab and dung), with the right-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 30)" />
+		</g>
+		<g id="cairo_logo_left-centered">
+			<!-- The logo (scarab and dung), with the left-center point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -140)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 30)" />
+		</g>
+		<g id="cairo_logo_topleft-centered">
+			<!-- The logo (scarab and dung), with the top-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, 230)" /><!-- (150, 170+60) -->
+		</g>
+		<g id="cairo_logo_topright-centered">
+			<!-- The logo (scarab and dung), with the top-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, 60)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, 230)" /><!-- (-150,170+60) -->
+		</g>
+		<g id="cairo_logo_bottomleft-centered">
+			<!-- The logo (scarab and dung), with the bottom-left point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(150, -170)" />
+		</g>
+		<g id="cairo_logo_bottomright-centered">
+			<!-- The logo (scarab and dung), with the bottom-right point of the bounding box at (0,0) -->
+			<use xlink:href="#dung" x="0" y="0" transform="translate(-150, -340)" />
+			<use xlink:href="#scarab" x="0" y="0" transform="translate(-150, -170)" />
+		</g>
+
+		<g id="cairo_text" transform="translate(0,-97)">
+		    <g transform="scale(0.1484,0.1484)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(65,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(486.75,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1234.25,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1610,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<!-- scaled by 0.72, shifted around to hit pixel boundaries -->
+		<g id="cairo_text_small_spaced" transform="translate(0,-71)">
+		    <g transform="scale(0.085,0.085)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(-151,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(379.5,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(1000,0)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(1341.5,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1826,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+
+		<!-- scaled by 0.72, shifted around to hit pixel boundaries -->
+		<g id="cairo_text_small" transform="translate(0,-71)">
+		    <g transform="scale(0.085,0.085)"> <g transform="translate(-1139,-208.5)">
+			 <!-- 63 (c), advance 444, 0 horiBearing 38,522 -->
+			 <path transform="translate(-151,0)" d="
+			       M 412, 433 
+			       C 385, 422 336, 413 298, 413 
+			       C 142, 413 38, 525 38, 680 
+			       C 38, 826 144, 947 298, 947 
+			       C 332, 947 377, 944 416, 926 
+			       L 409, 842 
+			       C 380, 861 340, 871 308, 871 
+			       C 187, 871 138, 771 138, 680 
+			       C 138, 583 197, 489 302, 489 
+			       C 332, 489 368, 496 404, 511 
+			       L 412, 433 " />
+			 <!-- 61 (a), advance 556, 0 horiBearing 46,522 -->
+			 <path transform="translate(261.75,0)" d="
+			       M 109, 541 
+			       C 147, 509 204, 489 257, 489 
+			       C 351, 489 383, 534 383, 622 
+			       C 346, 620 320, 620 283, 620 
+			       C 186, 620 46, 660 46, 788 
+			       C 46, 899 123, 947 233, 947 
+			       C 319, 947 369, 900 391, 869 
+			       L 393, 869 
+			       L 393, 935 
+			       L 481, 935 
+			       C 479, 920 477, 893 477, 835 
+			       L 477, 624 
+			       C 477, 485 418, 413 272, 413 
+			       C 207, 413 151, 433 104, 461 
+			       L 109, 541 
+			       M 383, 737 
+			       C 383, 813 334, 871 241, 871 
+			       C 198, 871 146, 842 146, 788 
+			       C 146, 698 272, 690 323, 690 
+			       C 343, 690 363, 692 383, 692 
+			       L 383, 737 " />
+			 <!-- 69 (i), advance 278, 0 horiBearing 86,730 -->
+			 <path transform="translate(764.75)" d="
+			       M 92, 935 
+			       L 186, 935 
+			       L 186, 425 
+			       L 92, 425 
+			       L 92, 935 
+			       M 88, 261
+			       A 51, 51 0 1 1 190,261
+			       A 51, 51 0 1 1 88,261" />
+			 <!-- 72 (r), advance 389, 0 horiBearing 80,522 -->
+			 <path transform="translate(988.5,0)" d="
+			       M 80, 935 
+			       L 174, 935 
+			       L 174, 703 
+			       C 174, 575 229, 495 313, 495 
+			       C 329, 495 348, 497 365, 504 
+			       L 365, 420 
+			       C 345, 416 331, 413 303, 413 
+			       C 249, 413 195, 451 170, 504 
+			       L 168, 504 
+			       L 168, 425 
+			       L 80, 425 
+			       L 80, 935 " />
+			 <!-- 6f (o), advance 611, 0 horiBearing 46,522 -->
+			 <path transform="translate(1355.5,0)" d="
+			       M 46, 680 
+			       C 46, 826 152, 947 306, 947 
+			       C 459, 947 565, 826 565, 680 
+			       C 565, 525 461, 413 306, 413 
+			       C 150, 413 46, 525 46, 680 
+			       M 146, 680 
+			       C 146, 583 205, 489 306, 489 
+			       C 406, 489 465, 583 465, 680 
+			       C 465, 771 416, 871 306, 871 
+			       C 195, 871 146, 771 146, 680 " />
+			 <!-- bounds: 38, 205 <-> 2232, 947 -->
+		    </g> </g>
+		</g>
+
+		<g id="cairo_logo_text_small">
+			<!-- The logo on the left, the text 'cairo' on the right -->
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(0, 78), scale(0.1944)" />
+			<use xlink:href="#cairo_text_small" transform="translate(175,82)"/>
+		</g>
+
+		<g id="cairo_logo_with_text">
+			<!-- The logo (scarab and dung), with the text 'cairo' below, the dot of the 'i' positioned between the hind legs of the scarab -->
+			<!-- dimensions: 300x490, centered -->
+			<use xlink:href="#cairo_logo_top-centered" transform="translate(0, -245)" />
+			<use xlink:href="#cairo_text" transform="translate(0, 245)" />
+		</g>
+
+		<g id="cairo_banner">
+			<!-- The logo on the left, the text 'cairo' in the center, and a mirror image of the logo on the right -->
+			<!-- The logos are scaled such that the scarab body nearly matches the height of the text characters (excepting the 'i')
+				and the dung should nearly aligns with the dot of the 'i'. The bottoms of the logos are aligned with the bottom of the text. -->
+			<!-- dimensions: 370x88, centered -->
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(-180, 40), scale(0.1944)" />
+			<use xlink:href="#cairo_text_small" transform="translate(0, 42)" fill="black" />
+			<use xlink:href="#cairo_logo_bottomleft-centered" transform="translate(180, 40), scale(0.1944), scale(-1, 1)" />
+		</g>
+
+		<g id="freedesktop_org_logo" style="fill:#FFFFFF;stroke:#3B80AE;stroke-width:2.4588;">
+		  <g>
+		    <path style="stroke:#BABABA;" d="M85.277,40.796c2.058,7.884-2.667,15.942-10.551,17.999L27.143,71.21c-7.884,2.057-15.943-2.667-18-10.552
+						     l-7.448-28.55c-2.057-7.884,2.667-15.942,10.551-17.999L59.83,1.695c7.884-2.057,15.942,2.667,17.999,10.551
+						     l7.449,28.55z"/>>
+		    <path style="fill:#3B80AE;stroke:none;" d="M80.444,39.778c1.749,7.854-1.816,13.621-9.504,15.447l-42.236,11.02c-7.569,2.396-14.089-1.181
+							       -15.838-8.836L6.53,33.127c-1.749-8.145,0.709-12.889,9.503-15.447L58.27,6.661
+							       c8.144-1.826,14.089,1.363,15.838,8.835l6.336,24.282z"/>>
+		    </g>g>
+		    <path style="opacity:0.5;fill:none;stroke:#FFFFFF;" d="M45.542,51.793L24.104,31.102l38.1-4.393L45.542,51.793z"/>>
+		    <path d="M72.325,28.769c0.405,1.55-0.525,3.136-2.075,3.541l-12.331,3.217c-1.551,0.404-3.137-0.525-3.542-2.076l-2.295-8.801
+			     c-0.405-1.551,0.524-3.137,2.076-3.542l12.33-3.217c1.551-0.405,3.137,0.525,3.542,2.076l2.295,8.801z"/>>
+		    <path d="M36.51,33.625c0.496,1.9-0.645,3.844-2.545,4.34l-15.112,3.943c-1.901,0.496-3.845-0.644-4.34-2.544l-2.814-10.786
+			     c-0.496-1.901,0.644-3.844,2.544-4.34l15.113-3.942c1.901-0.496,3.845,0.643,4.34,2.544l2.814,10.786z"/>>
+		    <path d="M52.493,53.208c0.278,1.065-0.36,2.154-1.425,2.432L42.6,57.848c-1.064,0.277-2.153-0.36-2.431-1.426l-1.577-6.043
+			     c-0.277-1.064,0.36-2.153,1.425-2.432l8.468-2.209c1.064-0.277,2.154,0.361,2.431,1.426l1.577,6.043z"/>>
+		    </g>g>
+		    <g id="bullet">
+		      <use x="0" y="0" xlink:href="#cairo_logo" transform="translate(-6,-2) scale(0.1, 0.1)"/>>
+		    </g>
+	</defs>
+
+  <g id="watermark" transform="translate(200, 185), rotate(-50), scale(2.5)">
+    <use xlink:href="#scarab" x="0" y="170" fill-opacity="0.08"/>
+  </g>
+
+  <!-- Blue bar at top of slide -->
+  <rect x="0" y="0" width="1024" height="50" fill="#3B80AE" fill-opacity="0.3" />
+
+  <!-- Scarab and "cairo" at upper-left -->
+  <g transform="translate(10,0)">
+    <use xlink:href="#cairo_logo_text_small"/>
+  </g>
+
+  <!-- Presentation title at upper-left -->
+  <text ss:variable="presentation-subtitle" x="260" y="50" font-size="20">Presentation Sub-title</text>
+
+  <!-- freedesktop.org logo at upper-right -->
+  <use xlink:href="#freedesktop_org_logo" transform="translate(910, 12)" />
+
+  <g font-family="Frutiger">
+    <!-- Slide title -->
+    <g id="slide_title" transform="translate(512, 153)">
+      <rect stroke="#bababa" fill="none"
+	    x="-365.5"
+	    y="-55.5"
+	    width="731"
+	    height="81"
+	    rx="10" ry="10"
+	    />
+      <rect fill="#bababa" fill-opacity="0.3"
+	    x="-360"
+	    y="-50"
+	    width="720"
+	    height="70"
+	    rx="10" ry="10"
+	    />
+      <text text-anchor="middle"
+	    fill="black"
+	    x="0"
+	    y="4" font-size="55"
+	    ss:variable="title">Slide Title</text>
+    </g>
+    
+    <!-- Slide content -->
+    <g ss:region="default">
+      <rect x="112" y="200" width="800" height="480" fill="none" stroke="blue"/>
+      <text font-size="40" fill="black"
+	    x="112" y="232">Slide content</text>
+    </g>
+    
+    <!-- Footer -->
+    <text ss:variable="URL" x="1016" y="760" text-anchor="end" font-size="20">http://cairographics.org</text>
+  </g>
+
+</svg>
diff --git a/doc/tutorial/slides/circle-cairo-large.png b/doc/tutorial/slides/circle-cairo-large.png
new file mode 100644
index 00000000..a08e1193
--- /dev/null
+++ b/doc/tutorial/slides/circle-cairo-large.png
diff --git a/doc/tutorial/slides/circle-cairo.png b/doc/tutorial/slides/circle-cairo.png
new file mode 100644
index 00000000..f5d8cd43
--- /dev/null
+++ b/doc/tutorial/slides/circle-cairo.png
diff --git a/doc/tutorial/slides/circle-ooo-large.png b/doc/tutorial/slides/circle-ooo-large.png
new file mode 100644
index 00000000..dfa40997
--- /dev/null
+++ b/doc/tutorial/slides/circle-ooo-large.png
diff --git a/doc/tutorial/slides/circle-ooo.png b/doc/tutorial/slides/circle-ooo.png
new file mode 100644
index 00000000..eb90666e
--- /dev/null
+++ b/doc/tutorial/slides/circle-ooo.png
diff --git a/doc/tutorial/slides/expander-fuzzy-large.png b/doc/tutorial/slides/expander-fuzzy-large.png
new file mode 100644
index 00000000..3a485da6
--- /dev/null
+++ b/doc/tutorial/slides/expander-fuzzy-large.png
diff --git a/doc/tutorial/slides/expander-fuzzy.png b/doc/tutorial/slides/expander-fuzzy.png
new file mode 100644
index 00000000..b01fd636
--- /dev/null
+++ b/doc/tutorial/slides/expander-fuzzy.png
diff --git a/doc/tutorial/slides/expander-sharp-large.png b/doc/tutorial/slides/expander-sharp-large.png
new file mode 100644
index 00000000..f97fa06a
--- /dev/null
+++ b/doc/tutorial/slides/expander-sharp-large.png
diff --git a/doc/tutorial/slides/expander-sharp.png b/doc/tutorial/slides/expander-sharp.png
new file mode 100644
index 00000000..40759aef
--- /dev/null
+++ b/doc/tutorial/slides/expander-sharp.png
diff --git a/doc/tutorial/slides/fuzzies.svg b/doc/tutorial/slides/fuzzies.svg
new file mode 100644
index 00000000..df12b8a7
--- /dev/null
+++ b/doc/tutorial/slides/fuzzies.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg"
+     xmlns:xlink="http://www.w3.org/1999/xlink"
+     width="800" height="500">
+
+  <image xlink:href="expander-fuzzy.png" x="175" y="25" width="50" height="50"/>
+  <image xlink:href="expander-sharp.png" x="575" y="25" width="50" height="50"/>
+
+  <image xlink:href="expander-fuzzy-large.png" x="0" y="100" width="400" height="400"/>
+  <image xlink:href="expander-sharp-large.png" x="400" y="100" width="400" height="400"/>
+</svg>
diff --git a/doc/tutorial/slides/jaggies.svg b/doc/tutorial/slides/jaggies.svg
new file mode 100644
index 00000000..e99d07ba
--- /dev/null
+++ b/doc/tutorial/slides/jaggies.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg"
+     xmlns:xlink="http://www.w3.org/1999/xlink"
+     width="800" height="500">
+
+  <image xlink:href="circle-ooo.png" x="175" y="25" width="50" height="50"/>
+  <image xlink:href="circle-cairo.png" x="575" y="25" width="50" height="50"/>
+
+  <image xlink:href="circle-ooo-large.png" x="0" y="100" width="400" height="400"/>
+  <image xlink:href="circle-cairo-large.png" x="400" y="100" width="400" height="400"/>
+</svg>
diff --git a/doc/tutorial/slides/tutorial.xml b/doc/tutorial/slides/tutorial.xml
new file mode 100644
index 00000000..4b5248e0
--- /dev/null
+++ b/doc/tutorial/slides/tutorial.xml
@@ -0,0 +1,468 @@
+<?xml version="1.0" ?>
+<svgslides
+    xmlns="http://www.svgslides.org/svgslides0.1"
+    xmlns:svg="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    >
+
+  <slides theme="cairo"
+	  presentation="How to Recognize Ugly Graphics"
+	  presentation-subtitle="How to recognize ugly graphics—and what you can do about it."
+	  URL="http://cairographics.org"
+	  bullet="bullet">
+
+    <slide title="Tutorial Preparation" variant="blank" bullet="">
+      <lc></lc>
+      <lc align="center">http://cairographics.org/tutorial</lc>
+      <lc></lc>
+      <li>tar xzf tutorial.tar.gz</li>
+      <li>cd tutorial</li>
+      <li>make</li>
+      <lc></lc>
+      <lc align="center">IRC help: freenode.net #cairo</lc>
+    </slide>
+
+    <slide variant="title">
+      <lc>Carl Worth</lc>
+      <lc>Red Hat, Inc.</lc>
+      <lc></lc>
+      <lc>Ottawa Linux Symposium</lc>
+      <lc>2005-07-22</lc>
+      <lc>http://cairographics.org</lc>
+    </slide>
+
+    <slide title="Ugly Graphics" variant="separator">
+      <lc align="left">Jaggies</lc>
+      <lc align="center">Fuzzies</lc>
+      <lc align="right">Fireworks</lc>
+    </slide>
+
+    <slide title="Jaggies">
+      <img src="jaggies.svg"/>
+    </slide>
+
+    <slide title="Fuzzies">
+      <img src="fuzzies.svg"/>
+    </slide>
+
+    <slide title="Fireworks">
+    </slide>
+
+    <slide title="Getting Started" variant="separator">
+      <lc align="center">Various shell cairo program</lc>
+    </slide>
+
+    <slide title="Minimal cairo-xlib program" variant="code">
+      <lc>#include &lt;cairo.h&gt;</lc>
+      <lc>#include &lt;cairo-xlib.h&gt;</lc>
+      <lc>int main (void) {</lc>
+      <lc>    Display *dpy = XOpenDisplay (0);</lc>
+      <lc>    Window  w = XCreateSimpleWindow (dpy,RootWindow (dpy, 0),</lc>
+      <lc>                0, 0, WIDTH, HEIGHT, 0, 0, WhitePixel (dpy, 0));</lc>
+      <lc>    cairo_surface_t *surface = cairo_xlib_surface_create (dpy, w,</lc>
+      <lc>                        DefaultVisual (dpy, DefaultScreen (dpy)),</lc>
+      <lc>                                                   WIDTH, HEIGHT);</lc>
+      <lc>    XEvent  ev;</lc>
+      <lc>    XSelectInput (dpy, w, ExposureMask);</lc>
+      <lc>    XMapWindow (dpy, w);</lc>
+      <lc>    while (XNextEvent (dpy, &amp;ev) == 0)</lc>
+      <lc>        if (ev.type == Expose &amp;&amp; !ev.xexpose.count) {</lc>
+      <lc>            cairo_t *cr = cairo_create (surface);</lc>
+      <lc>            draw (cr);</lc>
+      <lc>            cairo_destroy (cr);</lc>
+      <lc>        }</lc>
+      <lc>}</lc>
+    </slide>
+
+    <slide title="Minimal cairo-gtk program" variant="code">
+      <lc>#include &lt;gtk/gtk.h&gt;</lc>
+      <lc>static gboolean</lc>
+      <lc>handle_expose (GtkWidget *widget, GdkEventExpose *event, gpointer data) {</lc>
+      <lc>    cairo_t *cr = gdk_cairo_create (widget->window);</lc>
+      <lc>    draw (cr);</lc>
+      <lc>    cairo_destroy (cr);</lc>
+      <lc>    return FALSE;</lc>
+      <lc>}</lc>
+      <lc>int main (int argc, char **argv) {</lc>
+      <lc>    GtkWidget *window, *drawing_area;</lc>
+      <lc>    gtk_init (&amp;argc, &amp;argv);</lc>
+      <lc>    window = gtk_window_new (GTK_WINDOW_TOPLEVEL);</lc>
+      <lc>    gtk_window_set_default_size (GTK_WINDOW (window), WIDTH, HEIGHT);</lc>
+      <lc>    drawing_area = gtk_drawing_area_new ();</lc>
+      <lc>    gtk_container_add (GTK_CONTAINER (window), drawing_area);</lc>
+      <lc>    g_signal_connect (drawing_area, "expose-event",</lc>
+      <lc>                      G_CALLBACK (handle_expose), NULL);</lc>
+      <lc>    gtk_widget_show_all (window);</lc>
+      <lc>    gtk_main ();</lc>
+      <lc>}</lc>
+    </slide>
+
+    <slide title="Minimal cairo-png program" variant="code">
+      <lc>#include &lt;cairo.h&gt;</lc>
+      <lc></lc>
+      <lc>int main (void)</lc>
+      <lc>{</lc>
+      <lc>    cairo_surface_t *surface;</lc>
+      <lc>    cairo_t *cr;</lc>
+      <lc></lc>
+      <lc>    surface = cairo_image_surface_create (CAIRO_FORMAT_ARGB32,</lc>
+      <lc>                                          WIDTH, HEIGHT);</lc>
+      <lc>    </lc>
+      <lc>    cr = cairo_create (surface);</lc>
+      <lc>    draw (cr);</lc>
+      <lc>    cairo_surface_write_to_png (surface, "foo.png");</lc>
+      <lc></lc>
+      <lc>    cairo_surface_destroy (surface);</lc>
+      <lc>    cairo_destroy (cr);</lc>
+      <lc></lc>
+      <lc>    return 0;</lc>
+      <lc>}</lc>
+    </slide>
+
+    <slide title="Minimal cairo-pdf program" variant="code">
+      <lc>#include &lt;cairo.h&gt;</lc>
+      <lc>#include &lt;cairo-pdf.h&gt;</lc>
+      <lc></lc>
+      <lc>int main (void)</lc>
+      <lc>{</lc>
+      <lc>    cairo_surface_t *surface;</lc>
+      <lc>    cairo_t *cr;</lc>
+      <lc></lc>
+      <lc>    surface = cairo_pdf_surface_create (foo.pdf, WIDTH, HEIGHT);</lc>
+      <lc>    </lc>
+      <lc>    cr = cairo_create (surface);</lc>
+      <lc>    draw (cr);</lc>
+      <lc>    cairo_show_page (cr);</lc>
+      <lc></lc>
+      <lc>    cairo_surface_destroy (surface);</lc>
+      <lc>    cairo_destroy (cr);</lc>
+      <lc></lc>
+      <lc>    return 0;</lc>
+      <lc>}</lc>
+    </slide>
+
+    <slide title="Minimal pycairo-gtk shell" variant="code">
+      <lc>import gtk</lc>
+      <lc>import cairo</lc>
+      <lc>import cairo.gtk</lc>
+      <lc></lc>
+      <lc>def handle_expose (widget, event):</lc>
+      <lc>    cr = cairo.gtk.gdk_cairo_create (widget.window)</lc>
+      <lc>    draw (c)</lc>
+      <lc></lc>
+      <lc>win = gtk.Window ()</lc>
+      <lc>win.connect ('destroy', lambda x: gtk.main_quit ())</lc>
+      <lc>drawingarea = gtk.DrawingArea ()</lc>
+      <lc>win.add (drawingarea)</lc>
+      <lc>drawingarea.connect ('expose_event', handle_expose)</lc>
+      <lc>drawingarea.set_size_request (WIDTH, HEIGHT)</lc>
+      <lc>drawingarea.set_double_buffered (False)</lc>
+      <lc>win.show_all ()</lc>
+      <lc>gtk.main ()</lc>
+    </slide>
+
+    <slide title="Minimal pycairo-png shell" variant="code">
+      <lc>import cairo</lc>
+      <lc></lc>
+      <lc>surface = cairo.ImageSurface (cairo.FORMAT_ARGB32, WIDTH, HEIGHT)</lc>
+      <lc>cr = cairo.Context (surface)</lc>
+      <lc></lc>
+      <lc>draw (cr)</lc>
+      <lc></lc>
+      <lc>surface.write_to_png ('foo.png')</lc>
+    </slide>
+
+    <slide title="Minimal nickle program" variant="code">
+      <lc>autoimport Cairo;</lc>
+      <lc></lc>
+      <lc>cairo_t cr = new (WIDTH, HEIGHT);</lc>
+      <lc>draw (cr);</lc>
+    </slide>
+
+    <slide title="Drawing" variant="separator">
+      <lc align="center">Here comes the fun part</lc>
+    </slide>
+
+    <slide title="Cairo API">
+      <ul>
+	<li>Paths</li>
+	<ul>
+	  <li>construction</li>
+	  <li>filling, stroking</li>
+	</ul>
+	<li>Images</li>
+	<ul>
+	  <li>loading from disk</li>
+	  <li>transforming</li>
+	  <li>using as pattern</li>
+	</ul>
+	<li>Text</li>
+	<ul>
+	  <li>Simple API example</li>
+	</ul>
+      </ul>
+      </slide>
+
+      <slide title="Paths">
+	<ul>
+	  <li>Built from lines and splines.</li>
+	  <ul>
+	    <li>cairo_move_to()	set current point</li>
+	    <li>cairo_line_to()	draw line</li>
+	    <li>cairo_curve_to()	draw Bézier spline</li>
+	    <li>cairo_close_path()	draw line to start</li>
+	  </ul>
+	  <li>Can also be built from glyphs</li>
+	  <ul>
+	    <li>cairo_text_path()	path from UTF-8</li>
+	    <li>cairo_glyph_path()	path from glyphs</li>
+	  </ul>
+	  <li>Part of graphics state</li>
+	  <ul>
+	    <li>cairo_save()/cairo_restore() affect path</li>
+	  </ul>
+	</ul>
+      </slide>
+
+      <slide title="Using Paths">
+	<ul>
+	  <li>Stroke or Fill</li>
+	  <ul>
+	    <li>cairo_stroke walks path outline with pen</li>
+	    <li>cairo_fill paints interior of path</li>
+	    <li>both operations consume the path, resetting the current path to empty</li>
+	  </ul>
+	  <li>Clip</li>
+	  <ul>
+	    <li>cairo_clip intersects interior of path with current clip</li>
+	  </ul>
+	  <li>Convert path to stroked version</li>
+	  <ul>
+	    <li>not yet named</li>
+	  </ul>
+	</ul>
+      </slide>
+
+      <slide title="Path Example">
+      </slide>
+
+      <slide title="Stroking Paths">
+	<ul>
+	  <li>Elliptical pen (line width radius)</li>
+	  <li>Join styles</li>
+	  <ul>
+	    <li>CAIRO_LINE_JOIN_MITER		with limit</li>
+	    <LI>CAIRO_LINE_JOIN_BEVEL</LI>
+	    <li>CAIRO_LINE_JOIN_ROUND	uses pen</li>
+	  </ul>
+	  <li>Cap styles</li>
+	  <ul>
+	    <LI>CAIRO_LINE_CAP_BUTT</LI>
+	    <LI>CAIRO_LINE_CAP_ROUND</LI>
+	    <LI>CAIRO_LINE_CAP_SQUARE</LI>
+	  </ul>
+	</ul>
+      </slide>
+
+      <slide title="Stroke Example">
+      </slide>
+
+      <slide title="Closing the Path">
+	<li>cairo_close_path</li>
+	<li>Draws a line (if necessary) to the start of the path</li>
+	<li>Draws a join from that line to the first element of the path</li>
+      </slide>
+
+      <slide title="Close Path Example">
+      </slide>
+
+      <slide title="Caps and Joins">
+	<ul>
+	  <li>cairo_set_line_cap</li>
+	  <ul>
+	    <LI>CAIRO_LINE_CAP_BUTT</LI>
+	    <LI>CAIRO_LINE_CAP_ROUND</LI>
+	    <LI>CAIRO_LINE_CAP_SQUARE</LI>
+	  </ul>
+	  <li>cairo_set_line_join</li>
+	  <ul>
+	    <LI>CAIRO_LINE_JOIN_BEVEL</LI>
+	    <LI>CAIRO_LINE_JOIN_ROUND</LI>
+	    <LI>CAIRO_LINE_JOIN_MITER</LI>
+	  </ul>
+	</ul>
+      </slide>
+
+      <slide title="Caps and Joins Setup">
+      </slide>
+
+      <slide title="Caps and Joins Example">
+      </slide>
+
+      <slide title="Filling Paths">
+	<ul>
+	  <li>Closes path with line_to if necessary</li>
+	  <ul>
+	    <li>line drawn from current point to last move_to location</li>
+	  </ul>
+	  <li>Fills interior</li>
+	  <li>Even/odd or winding fill rules</li>
+	</ul>
+      </slide>
+
+      <slide title="Fill Example">
+      </slide>
+
+      <slide title="Source color">
+	<li>cairo_set_source_rgb sets a solid color source</li>
+	<li>Source color is used for any drawing operation (stroke, fill, or</li>
+	<li>others)</li>
+      </slide>
+
+      <slide title="Fill and Stroke">
+	<li>cairo_stroke/fill_preserve preserve the path</li>
+	<li>Could just walk the figure twice</li>
+      </slide>
+
+      <slide title="Fill and Stroke Example">
+      </slide>
+
+      <slide title="Affine Transformations">
+	<ul>
+	  <li>Single matrix combines rotation, translation, scale and shear</li>
+	  <li>Non-projective transformations</li>
+	  <ul>
+	    <li>Pen doesn't change shape along the stroke</li>
+	  </ul>
+	  <li>Transformations are cumulative</li>
+	  <ul>
+	    <li>translate, scale != scale, translate</li>
+	  </ul>
+	</ul>
+      </slide>
+
+      <slide title="Affine Transform Example">
+      </slide>
+
+      <slide title="Even/Odd vs Winding">
+	<li>Even/Odd counts edges, fills when odd</li>
+	<li>Winding counts up for clockwise edges, down for counterclockwise, fills when !zero</li>
+      </slide>
+
+      <slide title="Combining Images">
+	<li>Cairo memory surfaces are images</li>
+	<li>cairo_show_surface paints one surface into another</li>
+	<li>Transformed through matrix</li>
+	<li>No projective transforms yet</li>
+      </slide>
+
+      <slide title="Loading an Image File">
+      </slide>
+
+      <slide title="Image Example">
+      </slide>
+
+      <slide title="Image Transformation">
+      </slide>
+
+      <slide title="Resampling Modes">
+	<li>Nearest Neighbor</li>
+      </slide>
+
+      <slide title="Patterns">
+	<li>Apply one surface as pattern on another</li>
+	<li>Pattern transformed through source surface matrix</li>
+	<li>Patterns may repeat</li>
+      </slide>
+
+      <slide title="Pattern Example">
+      </slide>
+
+      <slide title="Pattern Transformations">
+	<ul>
+	  <li>Source surface holds matrix</li>
+	  <li>Constructed with matrix operations</li>
+	  <li>Some thought to changing this API</li>
+	  <ul>
+	    <li>Need to add projective transformations</li>
+	    <li>May want procedural patterns</li>
+	  </ul>
+	</ul>
+      </slide>
+
+      <slide title="Pattern Transform">
+      </slide>
+
+      <slide title="Gradients">
+	<ul>
+	  <li>No primitive gradients in cairo</li>
+	  <ul>
+	    <li>Implemented as patterns</li>
+	    <li>Bilinear interpolation smooths result</li>
+	  </ul>
+	  <li>Future API may include more</li>
+	  <ul>
+	    <li>Procedural patterns</li>
+	    <li>Triangular patches</li>
+	  </ul>
+	</ul>
+      </slide>
+
+      <slide title="Gradient Setup">
+      </slide>
+
+      <slide title="Gradient Creation">
+      </slide>
+
+      <slide title="Gradient Example">
+      </slide>
+
+      <slide title="Text">
+	<ul>
+	  <li>API is getting replaced</li>
+	  <li>“Toy” API will be similar to current code</li>
+	  <li>“Full” API will have</li>
+	  <ul>
+	    <li>OS dependent font selection</li>
+	    <li>Use Glyph Ids instead of Unicode chars</li>
+	  </ul>
+	  <li>New implementation will provide device-independent fonts</li>
+	  <li>Old API worked only on X</li>
+	</ul>
+      </slide>
+
+      <slide title="“Toy” Text API"/>
+      <ul>
+	<li>Simple font selection</li>
+	<ul>
+	  <li>family, weight, slant</li>
+	  <li>OS independent</li>
+	  <li>No font listing support</li>
+	</ul>
+	<li>UTF-8 text drawing and extents functions</li>
+	<li>Still supports full font transformations</li>
+      </ul>
+
+      <slide title="“Toy” Text Example">
+      </slide>
+
+      <slide title="Error Handling in C">
+	<li>C has no exceptions</li>
+	<li>Checking each return is tedious</li>
+	<li>C programmers rarely bother</li>
+	<li>Lots of broken programs result</li>
+      </slide>
+      
+      <slide title="Cairo Error Handling">
+	<li>Cairo returns status</li>
+	<li>Status is “persistant”</li>
+	<li>cairo_status function returns error state</li>
+	<li>API “shuts down” when an error occurs</li>
+	<li>All cairo functions are benign (and well defined) after any error.</li>
+      </slide>
+
+      <slide title="Cairo Error Example">
+      </slide>
+
+  </slides>
+</svgslides>
diff --git a/doc/tutorial/src/.cvsignore b/doc/tutorial/src/.cvsignore
new file mode 100644
index 00000000..59488b84
--- /dev/null
+++ b/doc/tutorial/src/.cvsignore
@@ -0,0 +1,7 @@
+*-gtk
+*-pdf
+*-png
+*-xlib
+*.pdf
+*.png
+
diff --git a/doc/tutorial/src/Makefile b/doc/tutorial/src/Makefile
new file mode 100644
index 00000000..1d80f2c3
--- /dev/null
+++ b/doc/tutorial/src/Makefile
@@ -0,0 +1,30 @@
+MYCFLAGS=$(shell pkg-config --cflags --libs cairo gtk+-2.0) -Wall -g -Wpointer-arith -Wmissing-prototypes -Wmissing-declarations -Wnested-externs -fno-strict-aliasing
+
+# If you don't want to/can't compile all of these targets, then trim
+# this list.
+all: gtk xlib pdf png
+
+GTK_EXAMPLES=$(patsubst %.c,%-gtk,$(wildcard *.c))
+gtk: $(GTK_EXAMPLES)
+%-gtk:%.c cairo-tutorial-gtk.h
+	$(CC) -DCAIRO_TUTORIAL_GTK $(CFLAGS) $(MYCFLAGS) -o $@ $<
+
+XLIB_EXAMPLES=$(patsubst %.c,%-xlib,$(wildcard *.c))
+xlib: $(XLIB_EXAMPLES)
+%-xlib:%.c cairo-tutorial-xlib.h
+	$(CC) -DCAIRO_TUTORIAL_XLIB $(CFLAGS) $(MYCFLAGS) -o $@ $<
+
+PDF_EXAMPLES=$(patsubst %.c,%-pdf,$(wildcard *.c))
+pdf: $(PDF_EXAMPLES)
+%-pdf:%.c cairo-tutorial-pdf.h
+	$(CC) -DCAIRO_TUTORIAL_PDF $(CFLAGS) $(MYCFLAGS) -o $@ $<
+
+PNG_EXAMPLES=$(patsubst %.c,%-png,$(wildcard *.c))
+png: $(PNG_EXAMPLES)
+%-png:%.c cairo-tutorial-png.h
+	$(CC) -DCAIRO_TUTORIAL_PNG $(CFLAGS) $(MYCFLAGS) -o $@ $<
+
+clean:
+	rm -f $(GTK_EXAMPLES) $(XLIB_EXAMPLES) $(PDF_EXAMPLES) $(PNG_EXAMPLES)
+
+.PHONY: all gtk xlib pdf png clean
diff --git a/doc/tutorial/src/cairo-tutorial-gtk.h b/doc/tutorial/src/cairo-tutorial-gtk.h
new file mode 100644
index 00000000..adb10a05
--- /dev/null
+++ b/doc/tutorial/src/cairo-tutorial-gtk.h
@@ -0,0 +1,116 @@
+/* cairo-tutorial-gtk.h - a tutorial framework for cairo with gtk+
+ *
+ * Copyright © 2005, Carl Worth
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License version 2 as
+ * published by the Free Software Foundation.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
+ */
+
+#include <gtk/gtk.h>
+#include <cairo.h>
+
+#ifndef WIDTH
+#define WIDTH 400
+#endif
+
+#ifndef HEIGHT
+#define HEIGHT 400
+#endif
+
+static void
+draw (cairo_t *cr);
+
+#if ! GTK_CHECK_VERSION(2,7,0)
+/* copied from gtk+/gdk/gdkcairo.c and gtk+/gdk/x11/gdkdrawable-x11.c
+ * gdk_cairo_create() which is available in 2.7.0 and later.
+ */
+static cairo_t *
+gdk_cairo_create (GdkDrawable *drawable)
+{
+    int width, height;
+    cairo_t *cr = NULL;
+    cairo_surface_t *surface = NULL;
+    GdkVisual *visual = gdk_drawable_get_visual (drawable);
+
+    gdk_drawable_get_size (drawable, &width, &height);
+    if (visual) 
+	surface = cairo_xlib_surface_create (GDK_DRAWABLE_XDISPLAY (drawable),
+					     GDK_DRAWABLE_XID (drawable),
+					     GDK_VISUAL_XVISUAL (visual),
+					     width, height);
+    else if (gdk_drawable_get_depth (drawable) == 1)
+	surface = cairo_xlib_surface_create_for_bitmap 
+	    (GDK_PIXMAP_XDISPLAY (drawable),
+	     GDK_PIXMAP_XID (drawable),
+	     GDK_SCREEN_XSCREEN (gdk_drawable_get_screen (drawable)),
+	     width, height);
+    else {
+	g_warning ("Using Cairo rendering requires the drawable argument to\n"
+		   "have a specified colormap. All windows have a colormap,\n"
+		   "however, pixmaps only have colormap by default if they\n"
+		   "were created with a non-NULL window argument. Otherwise\n"
+		   "a colormap must be set on them with "
+		   "gdk_drawable_set_colormap");
+	return NULL;
+    }
+    if (surface) {
+	cr = cairo_create (surface);
+	cairo_surface_destroy (surface);
+    }
+    return cr;
+}
+#endif
+
+static gboolean
+handle_expose (GtkWidget      *widget,
+	       GdkEventExpose *event,
+	       gpointer	       data)
+{
+    cairo_t *cr;
+
+    cr = gdk_cairo_create (widget->window);
+
+    draw (cr);
+
+    cairo_destroy (cr);
+
+    return FALSE;
+}
+
+int 
+main (int argc, char **argv)
+{
+    GtkWidget *window, *drawing_area;
+
+    gtk_init (&argc, &argv);
+
+    window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
+
+    gtk_window_set_default_size (GTK_WINDOW (window), WIDTH, HEIGHT);
+    gtk_window_set_title (GTK_WINDOW (window), "cairo demo");
+
+    g_signal_connect (window, "destroy-event",
+		      G_CALLBACK (gtk_main_quit), NULL);
+
+    drawing_area = gtk_drawing_area_new ();
+    gtk_container_add (GTK_CONTAINER (window), drawing_area);
+
+    g_signal_connect (drawing_area, "expose-event",
+		      G_CALLBACK (handle_expose), NULL);
+
+    gtk_widget_show_all (window);
+
+    gtk_main ();
+    
+    return 0;
+}
diff --git a/doc/tutorial/src/cairo-tutorial-pdf.h b/doc/tutorial/src/cairo-tutorial-pdf.h
new file mode 100644
index 00000000..563ea763
--- /dev/null
+++ b/doc/tutorial/src/cairo-tutorial-pdf.h
@@ -0,0 +1,74 @@
+/* cairo-tutorial-png.h - a tutorial framework for cairo to write a PNG image
+ *
+ * Copyright © 2005, Carl Worth
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License version 2 as
+ * published by the Free Software Foundation.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
+ */
+
+#include <cairo.h>
+#include <cairo-pdf.h>
+
+#include <stdio.h>
+#include <stdlib.h>
+#include <assert.h>
+#include <string.h>
+
+#ifndef WIDTH
+#define WIDTH 400
+#endif
+
+#ifndef HEIGHT
+#define HEIGHT 400
+#endif
+
+static void
+draw (cairo_t *cr);
+
+int 
+main (int argc, char **argv)
+{
+    cairo_surface_t *surface;
+    cairo_t *cr;
+    char *filename, *dash;
+
+    filename = strdup (argv[0]);
+    assert (filename != NULL);
+
+    dash = strrchr (filename, '-');
+
+    if (strcmp (dash, "-pdf") == 0) {
+	*dash = '.';
+    } else {
+	char *new_filename;
+	new_filename = malloc (strlen (filename) + 5);
+	sprintf (new_filename, "%s.pdf", filename);
+	free (filename);
+	filename = new_filename;
+    }
+
+    surface = cairo_pdf_surface_create (filename, WIDTH, HEIGHT);
+    
+    cr = cairo_create (surface);
+
+    draw (cr);
+
+    cairo_show_page (cr);
+
+    cairo_surface_destroy (surface);
+    cairo_destroy (cr);
+
+    free (filename);
+
+    return 0;
+}
diff --git a/doc/tutorial/src/cairo-tutorial-png.h b/doc/tutorial/src/cairo-tutorial-png.h
new file mode 100644
index 00000000..a6800c8b
--- /dev/null
+++ b/doc/tutorial/src/cairo-tutorial-png.h
@@ -0,0 +1,74 @@
+/* cairo-tutorial-png.h - a tutorial framework for cairo to write a PNG image
+ *
+ * Copyright © 2005, Carl Worth
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License version 2 as
+ * published by the Free Software Foundation.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
+ */
+
+#include <cairo.h>
+
+#include <stdio.h>
+#include <stdlib.h>
+#include <assert.h>
+#include <string.h>
+
+#ifndef WIDTH
+#define WIDTH 400
+#endif
+
+#ifndef HEIGHT
+#define HEIGHT 400
+#endif
+
+static void
+draw (cairo_t *cr);
+
+int 
+main (int argc, char **argv)
+{
+    cairo_surface_t *surface;
+    cairo_t *cr;
+    char *filename, *dash;
+
+    surface = cairo_image_surface_create (CAIRO_FORMAT_ARGB32,
+					  WIDTH, HEIGHT);
+    
+    cr = cairo_create (surface);
+
+    draw (cr);
+
+    filename = strdup (argv[0]);
+    assert (filename != NULL);
+
+    dash = strrchr (filename, '-');
+
+    if (strcmp (dash, "-png") == 0) {
+	*dash = '.';
+    } else {
+	char *new_filename;
+	new_filename = malloc (strlen (filename) + 5);
+	sprintf (new_filename, "%s.png", filename);
+	free (filename);
+	filename = new_filename;
+    }
+
+    cairo_surface_write_to_png (surface, filename);
+
+    free (filename);
+
+    cairo_surface_destroy (surface);
+    cairo_destroy (cr);
+
+    return 0;
+}
diff --git a/doc/tutorial/src/cairo-tutorial-xlib.h b/doc/tutorial/src/cairo-tutorial-xlib.h
new file mode 100644
index 00000000..301b9524
--- /dev/null
+++ b/doc/tutorial/src/cairo-tutorial-xlib.h
@@ -0,0 +1,219 @@
+/* cairo-tutorial-xlib.h - a tutorial framework for cairo with xlib
+ *  
+ * Copyright © 2005, Keith Packard
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License version 2 as
+ * published by the Free Software Foundation.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
+ */
+
+#include    <stdio.h>
+#include    <stdlib.h>
+#include    <ctype.h>
+#include    <strings.h>
+#include    <X11/Xos.h>
+#include    <X11/Xlib.h>
+#include    <X11/Xutil.h>
+#include    <X11/Xatom.h>
+#include    <cairo.h>
+#include    <cairo-xlib.h>
+
+#ifndef WIDTH
+#define WIDTH 400
+#endif
+
+#ifndef HEIGHT
+#define HEIGHT 400
+#endif
+
+#ifndef DEFAULT_VISUAL
+#define DEFAULT_VISUAL 0
+#endif
+
+static void
+Usage (char *program)
+{
+    fprintf (stderr, "Usage: %s\n", program);
+    fprintf (stderr, "\t-display <display-name>\n");
+    fprintf (stderr, "\t-geometry <geometry>\n");
+    exit (1);
+}
+
+char	    *dpy_name;
+VisualID    vid = DEFAULT_VISUAL;
+Colormap    colormap;
+Visual	    *visual;
+int	    depth;
+unsigned int width = WIDTH, height = HEIGHT;
+
+static void
+draw (cairo_t *cr);
+
+static void
+handle_expose (Display *dpy, Drawable d)
+{
+    cairo_surface_t *surface;
+    cairo_t *cr;
+
+    surface = cairo_xlib_surface_create (dpy, d, visual,
+					 width, height);
+    cr = cairo_create (surface);
+
+    draw (cr);
+
+    cairo_destroy (cr);
+    cairo_surface_destroy (surface);
+}
+
+int
+main (argc, argv)
+    int	    argc;
+    char    **argv;
+{
+    Display *dpy;
+    Window  win;
+    Window  root = 0;
+    char    **init_argv = argv;
+    XSetWindowAttributes    attr;
+    int	    scr;
+    int	    x = 0, y = 0;
+    int	    geometryMask;
+    int	    border_width = 1;
+    XSizeHints	sizeHints;
+    XWMHints	wmHints;
+    XClassHint	classHints;
+    XEvent	ev;
+    XEvent	eev;
+    int		HasExpose = 0;
+    int		sync = 0;
+    XTextProperty   wm_name, icon_name;
+    Atom	wm_delete_window;
+    unsigned long   gc_mask;
+    char	quit_string[10];
+    unsigned long   window_mask;
+    int		has_colormap = 0;
+
+    wm_name.value = (unsigned char *) argv[0];
+    wm_name.encoding = XA_STRING;
+    wm_name.format = 8;
+    wm_name.nitems = strlen (argv[0]) + 1;
+    icon_name = wm_name;
+    gc_mask = 0;
+    while (*++argv) {
+	if (!strcmp (*argv, "-display"))
+	    dpy_name = *++argv;
+	else if (!strcmp (*argv, "-visual"))
+	    vid = strtol(*++argv, NULL, 0);
+	else if (!strcmp (*argv, "-geometry"))
+	    geometryMask = XParseGeometry (*++argv, &x, &y, &width, &height);
+	else if (!strcmp (*argv, "-sync"))
+	    sync = 1;
+	else if (!strcmp (*argv, "-bw"))
+	    border_width = strtol(*++argv, NULL, 0);
+	else if (!strcmp (*argv, "-root"))
+	    root = strtol (*++argv, NULL, 0);
+	else
+	    Usage (*init_argv);
+    }
+    sizeHints.flags = 0;
+    wmHints.flags = InputHint;
+    wmHints.input = True;
+    classHints.res_name = init_argv[0];
+    classHints.res_class = init_argv[0];
+    dpy = XOpenDisplay (dpy_name);
+    if (!dpy) {
+	fprintf (stderr, "Error: failed to open display: %s\n",
+		 XDisplayName (dpy_name));
+	exit (1);
+    }
+    if (sync)
+	XSynchronize (dpy, sync);
+    scr = DefaultScreen (dpy);
+    if (!root)
+	root = RootWindow (dpy, scr);
+    window_mask = CWBackPixel|CWBorderPixel|CWEventMask;
+    if (!has_colormap)
+	colormap = DefaultColormap (dpy, scr);
+    else
+    {
+	window_mask |= CWColormap;
+	attr.colormap = colormap;
+    }
+    visual = DefaultVisual (dpy, scr);
+    depth = DefaultDepth (dpy, scr);
+    if (vid)
+    {
+	XVisualInfo vi, *vi_ret;
+	int	    n;
+
+	vi.visualid = vid;
+	vi.screen = scr;
+	vi_ret = XGetVisualInfo (dpy, VisualIDMask|VisualScreenMask,
+				 &vi, &n);
+	if (vi_ret)
+	{
+	    visual = vi_ret->visual;
+	    if (!has_colormap)
+	    {
+		colormap = XCreateColormap (dpy, root, visual, AllocNone);
+		window_mask |= CWColormap;
+		attr.colormap = colormap;
+	    }
+	    depth = vi_ret->depth;
+	}
+    }
+    attr.background_pixel = WhitePixel (dpy, scr);
+    attr.border_pixel = 0;
+    attr.event_mask = ExposureMask|KeyPressMask|KeyReleaseMask;
+    wm_delete_window = XInternAtom(dpy, "WM_DELETE_WINDOW", False);
+    win = XCreateWindow (dpy, root, x, y, width, height, border_width,
+			 depth, InputOutput,
+			 visual,
+ 			 window_mask,
+			 &attr);
+    XSetWMProperties (dpy, win,
+		      &wm_name, &icon_name,
+		      init_argv, argc,
+ 		      &sizeHints, &wmHints, 0);
+    XSetWMProtocols (dpy, win, &wm_delete_window, 1);
+    XMapWindow (dpy, win);
+    for (;;) {
+	XNextEvent (dpy, &ev);
+	if (HasExpose && ev.type != Expose) {
+	    HasExpose = 0;
+	    handle_expose (dpy, eev.xexpose.window);
+	}
+	switch (ev.type) {
+	case Expose:
+	    if (QLength(dpy)) {
+		eev = ev;
+		HasExpose = 1;
+	    } else if (ev.xexpose.count == 0) {
+		handle_expose (dpy, ev.xexpose.window);
+	    }
+	    break;
+	case KeyPress:
+	    if (XLookupString ((XKeyEvent *) &ev, quit_string, sizeof (quit_string), 0, 0) == 1) {
+		switch (quit_string[0]) {
+		case 'q':
+		    exit (0);
+		case 'c':
+		    XClearArea (dpy, ev.xkey.window, 0, 0, 0, 0, True);
+		    break;
+		}
+	    }
+	    break;
+	case ClientMessage:
+	    exit (0);
+	}
+    }
+}
diff --git a/doc/tutorial/src/cairo-tutorial.h b/doc/tutorial/src/cairo-tutorial.h
new file mode 100644
index 00000000..65a431af
--- /dev/null
+++ b/doc/tutorial/src/cairo-tutorial.h
@@ -0,0 +1,41 @@
+/* cairo-tutorial-gtk.h - a tutorial framework for cairo
+ *
+ * Copyright © 2005, Carl Worth
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License version 2 as
+ * published by the Free Software Foundation.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
+ */
+
+#include <cairo.h>
+#include <math.h>
+
+/* The application program may override these before including
+ * cairo-tutorial.h in order to get a window of a different size. */
+#ifndef WIDTH
+#define WIDTH 400
+#endif
+
+#ifndef HEIGHT
+#define HEIGHT 400
+#endif
+
+#ifdef CAIRO_TUTORIAL_GTK
+#include "cairo-tutorial-gtk.h"
+#elif CAIRO_TUTORIAL_XLIB
+#include "cairo-tutorial-xlib.h"
+#elif CAIRO_TUTORIAL_PDF
+#include "cairo-tutorial-pdf.h"
+#elif CAIRO_TUTORIAL_PNG
+#include "cairo-tutorial-png.h"
+#endif
+
diff --git a/doc/tutorial/src/circle.c b/doc/tutorial/src/circle.c
new file mode 100644
index 00000000..06ca8fc9
--- /dev/null
+++ b/doc/tutorial/src/circle.c
@@ -0,0 +1,22 @@
+#define WIDTH 50
+#define HEIGHT 50
+
+#include "cairo-tutorial.h"
+
+static void
+draw (cairo_t *cr)
+{
+    cairo_set_source_rgb (cr, 1.0, 1.0, 1.0);
+    cairo_paint (cr);
+
+    cairo_move_to (cr, 47.5, 25);
+    cairo_arc (cr, 25, 25, 22.5,
+	       0.0, 2 * M_PI);
+
+    cairo_set_source_rgb (cr, 0.6, 0.8, 1.0);
+    cairo_fill_preserve (cr);
+
+    cairo_set_source_rgb (cr, 0.0, 0.0, 0.0);
+    cairo_set_line_width (cr, 1.0);
+    cairo_stroke (cr);
+}
diff --git a/doc/tutorial/src/expander.c b/doc/tutorial/src/expander.c
new file mode 100644
index 00000000..a00865fb
--- /dev/null
+++ b/doc/tutorial/src/expander.c
@@ -0,0 +1,16 @@
+#define WIDTH 50
+#define HEIGHT 50
+
+#include "cairo-tutorial.h"
+
+static void
+draw (cairo_t *cr)
+{
+    cairo_translate (cr, 24.5, 25);
+    cairo_move_to (cr, 5, -2.5);
+    cairo_line_to (cr, 0, 2.5);
+    cairo_line_to (cr, -5, -2.5);
+    cairo_close_path (cr);
+    cairo_set_line_width (cr, 1);
+    cairo_stroke (cr);
+}