Translation start

cinder_css.tw2

@@ -0,0 +1,430 @@
+::StoryCSS [stylesheet]
+body {margin:0;}
+
+/*Supress page-to-page transitions*/
+.transition-in[data-t8n^=dissolve] {
+	-webkit-animation:appear 0ms step-start;
+	animation:appear 0ms step-start
+}
+
+/*Layout*/
+.scene {
+	padding: 0;
+		white-space: normal; /*Needs compensating spaces for buttons*/
+		clear: both;
+		margin-bottom:20px; /*comp*/
+ }
+.s-dark {
+	background-color: #000;
+    color: #fff;
+}
+.sect-cont {
+    margin: auto;
+    max-width:640px;
+    padding: 0 20px 20px;
+}
+.sect-img {
+    margin: auto;
+    max-width:640px;
+    padding:0;
+		font-size: 0;
+  	line-height: 0;
+}
+
+.pull-right {
+	float: right;}
+.pull-left {
+	float: left;}
+.hidden {
+	display: none;
+}
+.block {
+	display: block;
+}
+
+/*Score*/
+img.star {
+    height: 50px;
+    width: 50px;
+	  vertical-align: bottom;
+}
+
+div.sect-img img{
+	white-space: normal;
+}
+
+/* Equip layout */
+#equipmenu {
+    white-space: normal;
+	  display: table;
+}/*tw-passage has pre-wrap as its setting, creates whitespace*/
+
+.row {
+	display: table-row; 
+	width: 100%;
+}
+div.col400 {
+    font-size: 0;
+    line-height: 0;
+    display: table-cell;
+}
+.col240 {
+	line-height: 0;
+    font-size: 0;
+    display: table-cell;
+    margin: 0; /*does nothing*/
+    padding: 0; /*does nothing*/
+}
+.row tw-link, .row .link, .row .enchantment-link {
+	margin: 0;
+	padding: 0;
+	line-height: 0;
+	border: 0;
+}
+
+.row::before, .row::after {
+    display: table;
+    line-height: 0;
+}
+.row::after {
+    clear: both;
+}
+.btn100 {
+	height: 100px;
+	display:block;
+	line-height: 1.3em;
+	padding: 25px;
+}
+
+/*Links*/
+tw-link, .link, .enchantment-link, .btn {
+    background-color: #000;
+    border: 1px solid #000;
+    border-radius: 5px;
+    color: #fff;
+    padding: 8px 16px;
+	display: block;
+    margin: 5px 0;  
+	cursor: pointer;
+	text-decoration: none;
+}
+a.btn:visited { 
+	color: #ffffff;
+}
+
+.enchantment-link:hover, tw-link:hover, .btn:hover {
+    background-color: #be1a00;
+    border-color: #be1a00;
+    color: #fff;
+	text-decoration: none;
+}
+.enchantment-link:focus, tw-link:focus, .btn:focus,
+.enchantment-link:active, tw-link:active, .btn:active,
+.enchantment-link:visited, tw-link:visited, .btn:visited {
+	  color: #000;
+}
+.s-dark tw-link, 
+.s-dark .link, 
+.s-dark .enchantment-link {
+    background-color: #000;
+    border: none;
+    border-radius: 0;
+    color: #be1a00;
+    cursor: pointer;
+    display: inline-block;
+    margin: 0;
+    padding: 0;
+}
+.s-dark .enchantment-link:hover, 
+.s-dark tw-link:hover {
+    background-color: #000;
+	text-decoration: underline;
+    color: #fff;
+}
+
+.s-dark #equipmenu .enchantment-link:hover,
+.s-dark #equipmenu tw-link:hover {
+	  border: 0;
+}
+
+.visited {
+	color: #fff;
+}
+.visited:hover{
+	color: #fff;
+}
+
+/*Walk compass links*/
+.cont-w-nav {
+	width:200px;
+	height:200px;
+	overflow: hidden;
+	margin: 20px auto; /*or 0 auto 20px if pre-wrap on tw-passage is on*/
+}
+.walk-nav {
+	width:200px;
+	height:200px;
+	transform:rotate(45deg);
+	-moz-transform:rotate(45deg);
+	-webkit-transform:rotate(45deg);
+	-o-transform:rotate(45deg);
+	-ms-transform:rotate(45deg);
+	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0.5);
+	line-height: 0;
+}
+.no-rotate {
+	transform:rotate(0deg);
+	-moz-transform:rotate(0deg);
+	-webkit-transform:rotate(0deg);
+	-o-transform:rotate(0deg);
+	-ms-transform:rotate(0deg);
+	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
+}
+
+.walk-nav tw-expression tw-link,
+.walk-nav tw-link{
+	display: inline-block;
+	width: 100px;
+	height:100px;
+	padding: 0;
+	margin: 0;
+	border: none;
+	background-color: #000;
+	background: url(walk-arrow.svg) 0 0 no-repeat;
+	text-indent: -10000px;
+	overflow: hidden;
+	cursor: pointer;
+}
+.walk-nav tw-expression tw-link:hover,
+.walk-nav tw-link:hover {
+	background-color: #cadbaa;
+	background: url(walk-arrow-h.svg) 0 0 no-repeat;
+}
+.walk-nav .w-r tw-expression tw-link,
+.walk-nav .w-r tw-link,
+.walk-nav .inactive.w-r {
+	transform:rotate(90deg);
+	-moz-transform:rotate(90deg);
+	-webkit-transform:rotate(90deg);
+	-o-transform:rotate(90deg);
+	-ms-transform:rotate(90deg);
+	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
+}
+.walk-nav .w-d tw-expression tw-link,
+.walk-nav .w-d tw-link, 
+.walk-nav .inactive.w-d{
+	transform:rotate(180deg);
+	-moz-transform:rotate(180deg);
+	-webkit-transform:rotate(180deg);
+	-o-transform:rotate(180deg);
+	-ms-transform:rotate(180deg);
+	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
+}
+.walk-nav .w-l tw-expression tw-link,
+.walk-nav .w-l tw-link,
+.walk-nav .inactive.w-l {
+	transform:rotate(270deg);
+	-moz-transform:rotate(270deg);
+	-webkit-transform:rotate(270deg);
+	-o-transform:rotate(270deg);
+	-ms-transform:rotate(270deg);
+	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+}
+.walk-nav .inactive {
+	background: url(walk-arrow-off.svg) 0 0 no-repeat;
+	display: inline-block;
+	width: 100px;
+	height:100px;
+	text-indent: -10000px;
+	overflow: hidden;
+} 
+.walk-nav .inactive:hover {
+	background: url(walk-arrow-off.svg) 0 0 no-repeat;
+}
+
+/*Social links*/
+.social {
+	padding: 8px 14px;
+	margin-left: 5px;
+	border-radius: 3px;
+	background-color: #000000;
+	transition: all .6s;
+	-moz-transition: all .6s;
+	-webkit-transition: all .6s;
+	-o-transition: all .6s;
+	color: #ffffff;
+	text-decoration: none;
+}
+.social:hover {
+	transition: all .3s;
+	-moz-transition: all .3s;
+	-webkit-transition: all .3s;
+	-o-transition: all .3s;
+	color: #ffffff;
+}
+.facebook:hover {
+	background-color: #435fa8;
+}
+.twitter:hover {
+	background-color: #39d2fe;
+}
+
+
+/*Inventory*/
+.inventory-content {
+	width: 210px;
+	height: 210px;
+}
+.slot {
+	width: 100px;
+	height: 100px;
+	background-color: #444;
+}
+.slotwide {
+	width: 200px;
+	height: 100px;
+	background-color: #cadbaa;
+}
+
+.slotfull {
+	width: 200px;
+	height: 200px;
+	background-color: red;
+}
+
+/*Twine items*/
+tw-passage{
+    white-space: normal;
+}
+
+tw-passage img {
+    max-width: 640px;
+		width: 100%;
+}
+tw-sidebar {
+    display: none;
+}
+tw-story {
+    width: 100%;
+	margin:0;
+}
+
+/*Fonts*/
+tw-story {
+    font-size: 19px;
+}
+
+h1 {
+    font-size: 2.5em;
+		text-align: center;
+	  margin: 0.3em 0;
+}
+.toph {
+		margin-top: 0;
+	  padding-top: 20px;
+}
+.char-name {
+    font-size: 60%;
+	  line-height: 0;
+    top: 0.3em;
+}
+.char-talk:before {
+	content: '\201C';
+	font-size: 200%;
+	line-height: 40%;
+  padding-right: 0.1em;
+  top: 0.4em;
+}
+.char-talk:after {
+	content: '\201D';
+	font-size: 200%;
+	line-height: 40%;
+	padding-left: 0.1em;
+	top: 0.4em;
+}
+.more-link tw-link{
+margin:0;
+padding: 0;
+	border: none;
+}
+.alert {
+	color: #ae0000;
+}
+
+.mapPin {
+	position: relative; 
+	top: 0; 
+	left: 0;
+}
+.mapPin tw-hook {
+	position: absolute; 
+	top: 0; 
+	left: 0;
+}
+
+/*Device sizes*/
+@media (max-width: 479px) {
+	tw-story {
+    	font-size: 17px;
+	}
+}
+@media (max-width: 640px) {
+  #equipmenu .row .col240:nth-child(3) {
+  display:none;
+  }
+}
+/*Was a test to fix zoom-level, now clips Cinder's dress att small sizes*/
+.scene.equip {
+	min-width: 300px;
+}
+
+::StoryJS [script]
+
+//From http://twinery.org/forum/index.php/topic,2450.0.html adding sounds, don't yet know where to place audio file
+$(document.body).on("mouseenter", "a", function () {
+	$("<audio></audio>").attr({
+		src      : "sound/transition1.ogg",
+		autoplay : "autoplay"
+	});
+});
+
+//http://twinery.org/forum/index.php/topic,2495.0.html Calling JS with a hack
+if (typeof Undo == "undefined") {
+	var Undo = {
+		hide: function() {
+			$('div[class="equip1"]').hide();
+		}
+	};
+	window.Undo = Undo;
+}
+
+window.onload = function() {
+$(function()
+{
+// disable :hover on touch devices - removes all rules that include a :hover, so isolate all :hover selectors
+// based on https://gist.github.com/4404503 
+// via https://twitter.com/javan/status/284873379062890496
+// + https://twitter.com/pennig/status/285790598642946048
+// re http://retrogamecrunch.com/tmp/hover
+	if ('createTouch' in document)
+	{
+		try
+		{
+			var ignore = /:hover\b/;
+			for (var i=0; i<document.styleSheets.length; i++)
+			{
+				var sheet = document.styleSheets[i];
+				for (var j=sheet.cssRules.length-1; j>=0; j--)
+				{
+					var rule = sheet.cssRules[j];
+					if (rule.type === CSSRule.STYLE_RULE && ignore.test(rule.selectorText))
+					{
+						sheet.deleteRule(j);
+					}
+				}
+			}
+		}
+		catch(e){}
+	}
+});
+}

walk-arrow-off.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 150 150" style="enable-background:new 0 0 150 150;" xml:space="preserve">
+<path style="fill:#AFE1FE;" d="M147,147V0C66.4,1.6,1.6,66.4,0.1,147H147z"/>
+</svg>

walk-arrow.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 150 150" style="enable-background:new 0 0 150 150;" xml:space="preserve">
+<path style="fill:#AFE1FE;" d="M147,147V0C66.4,1.6,1.6,66.4,0.1,147H147z"/>
+<path d="M147,147V0C66.4,1.6,1.6,66.4,0.1,147H147z"/>
+<path style="fill:#FFFFFF;" d="M121.4,73.1c-12.2,4.1-24,8-35.9,11.9c-4.2,12.5-12.7,36.5-13,36.7c-3.9-20-7.8-39.9-11.9-60.8
+	C81.3,65.1,101.2,69.1,121.4,73.1z"/>
+</svg>