File: SoftMoon.rainbowmaker.css

/*  for rainbowmaker.php 4.1 release 1.0  1-22-2012  by Joe Golembieski, SoftMoon Webware  */

/*  character encoding: UTF-8 UNIX   tab-spacing: 2   word-wrap: no   standard-line-length: 120   */

body {
	color: white;
	background-color: black;
	font-size: 17px; }
input, select {
	font-size: 15px; }
input[size='17'] {
	width: 16.382em; }
input[size='7'] {
	width: 4em; }
input[size='4'] {
	width: 2.382em; }
li, input {
	margin: 0; }
input {
	padding: 1px; }
div#tester {
	position: fixed;
	bottom: 0;
	right: 0;
	width: 1em;
	height: 1.618em;
	background-color: yellow;
	border: 1px solid white; }
div#tester2 {
	position: fixed;
	bottom: 0;
	right: 1em;
	width: 1em;
	height: 1.618em;
	background-color: purple;
	border: 1px solid white; }
h1 {
	font-size: 2.618em;
	display: inline-block;
	position: relative;
	z-index: 7000; }
h1 a {
	color: white; }
h1 span {
	position: absolute;
	display: block;
	font-size: .618em;
	white-space: nowrap;
	overflow: hidden;
	left: 110%;
	bottom: 0;
	width: 0px;
	text-align: right; }
h1 img {
	position: fixed;
	left: 100%; }
h2 {
	font-size: 1.618em;
	color: lime;
	text-decoration: underline; }
h3 {
	font-size: 1.382em;
	color: lime; }
h4 {
	font-size: 1.618em;
	color: red;
	padding: 0 1.618em;
	border-left: 2px solid red;
	border-right: 2px solid red;
	width: 61.8%;
	margin: 1em auto; }
img {
	display: block; }
div#picker_select {
	position: fixed;
	top: 2%;
	right: .618em; }
div#picker_select select {
	color: white;
	margin-right: .618em; }
div#color_picker_wrap {
	display: block;
	position: absolute;
	top: 5.57%;  /* ≈ (100% - 85.4%) - (100% - 85.4%)*Φ */
	right: 2px;
	left: auto;
	max-width: 100%;
	max-height: 85.4%;  /* ≈ Φ + (1-Φ)*Φ */
	overflow: auto;
	background-color: black;
	padding: 0 0 0 1em;
	position: fixed;
	z-index: 3142; }
table.color_chart, table.palette {
	border: 1px solid white;
	margin-bottom: 1.618em; }
table.color_chart caption, table.palette caption {
	font-size: .764em }  /* ≈ Φ + ((1-Φ) - (1-Φ)*Φ) */
table.color_chart caption h6, table.palette caption h6 {
	font-size: 1.618em;  /*  ≈ 1/Φ = 1+Φ  */
	margin: 0;
	padding: 0; }
table.color_chart caption strong {
	color: red; }
table.color_chart td {
	white-space: nowrap;
	font-size: 1em; }
table.color_chart td:first-child {     /* javascript resets this:  IE6 doesn't do :first-child.  Then again, IE doesn't do anything right.  Use another browser! */
	width: 1.618em; }
table.color_chart td:nth-child(3) {
	font-family: monospace, sans-serif;
	padding-left: .382em;
	padding-right: .382em; }
table.color_chart tfoot td {
	font-size: .7em;
	white-space: normal; }
table.palette {
	border-spacing: 0;
	border-collapse: collapse;}
table.palette table tr:first-child { }
table.palette table td:first-child {
	font-weight: bold; }
table.palette table tr:first-child td:first-child {
	font-weight: normal; }
table.palette table tr:first-child td:first-child label {
	display: inline-block;
	width: 32%;
	text-align: center; }
table.palette > tbody td {
	height: .618em;
	margin: 0;
	padding: 0;
	line-height: 1em; }
table.palette {
	position: relative; }
table.palette input {
	margin: 2px;
	padding: 0;
}
table#Spectral caption > span {
	position: absolute;
	top: 1em;
	right: .618em;
	font-family: monospace, sans-serif;
	font-size: 1.618em; }
table#Spectral caption > span span {
	display: inline-block;
	width: 1.618em;
	height: 1em;
	border-bottom: 1px solid;
	border-left: 1px solid; }
.fd-slider {
  width: 10em;
	display: inline-block;
	top: .382em; }
table#Spectral table tr:first-child .fd-slider {
	top: 1em; }
.fd-form-element-hidden {
	display: inline;
	visibility: hidden;
	width: 0px; }
table.palette > tbody td#slide {
	width: 5em;
	height: 20em; }
table.palette > tbody td#picker {
	width: 20em;
	height: 20em; }
table.palette > tfoot td {
	text-align: center; }
span.colorSwatch  {
	display: inline-block;
	width: 1.618em;
	height: 1em;
	background-color: black;
	margin: 0 0 4px 4px;
	vertical-align: bottom; }
p { clear: left; }
form {
	float: left;
	padding-bottom: 2.618em;
	z-index: 618; }
fieldset {
	display: block; /*yet Firefox treats it as an "inline parent" of absolutely positioned children*/
	float: left;
	margin: 2px;
	padding: .382em;
	border: 1px solid white;
	width: auto;  }
legend, label {
	white-space: nowrap;
	color: inherit; /*fix IE8*/ }
fieldset#styler ul fieldset fieldset label:nth-child(2),
fieldset.background > label:nth-child(3),
fieldset.foreground > label:nth-child(3),
fieldset#dimensions > label:nth-child(2)  {
	position: absolute;
	top: 0em;
	left: auto;
	right: .382em;
	background-color: black;
	white-space: normal;
	}
fieldset.background > label:nth-child(4),
fieldset.foreground > label:nth-child(4)  {
	position: absolute;
	top: 0em;
	left: auto;
	right: 7em;
	background-color: black;
	white-space: normal;
	z-index: 1618;
	}
fieldset.background label span,
fieldset.foreground label span,
fieldset#dimensions > label span {
	display: none; }
fieldset.background label:hover span,
fieldset.foreground label:hover span,
fieldset#dimensions > label:hover span {
	display: block;
	position: absolute;
	top: 1.19em;
	left: -1.618em;
	width: 13em;
	padding: .382em 1.618em 1.618em 1.618em;
	text-align: justify;
	background-color: black; }
fieldset#styler,
fieldset#dimensions div,
fieldset.foreground fieldset,
fieldset.background fieldset,
fieldset#background>fieldset {
	border: none;
	margin: 0;
	padding: 0;
	display: inline-block;
	vertical-align: middle; }
fieldset#dimensions div {
	padding: 0 .382em; }
fieldset.foreground label,
fieldset.background label,
fieldset#background > fieldset label:last-child,
fieldset.foreground fieldset,
fieldset.background fieldset,
fieldset#dimensions div label {
	display: block;
	clear: left;
	margin-bottom: 2px; }
fieldset#background > fieldset label:last-child{
	margin-top: .382em; }
fieldset.foreground fieldset select+label,
fieldset.foreground fieldset select+label+label,
fieldset.foreground input,
fieldset.background fieldset select+label,
fieldset.background fieldset select+label+label,
fieldset.background input {
	display: inline;
	margin: 0 2px;
	position: relative; }
fieldset.foreground input,
fieldset.background input {
	position: static; }
fieldset#dimensions div fieldset legend {
	display: block;
	width: 100%; }
fieldset#dimensions div fieldset {
	display: inline-block;
	margin: 0 0 .382em 0; }
fieldset#dimensions div fieldset fieldset {
	display: block;
	width: auto;
	border: none;
	padding: .2em 0 0 0;
	margin: 0; }
fieldset#dimensions div fieldset fieldset label {
	display: inline;
	padding: 0;
	margin: 0; }
fieldset#dimensions legend span,
fieldset#dimensions div fieldset fieldset div,
fieldset#dimensions div fieldset input[type='text'] {
	float: right;
	margin: 0;
	padding: 0; }
fieldset#dimensions legend span {
	margin: 0 .27em 0 0; }
fieldset#dimensions div fieldset label div {
	clear: right; }
fieldset#styler,
fieldset#styler label,
fieldset#styler ul,
fieldset#styler fieldset#hw fieldset,
fieldset#background,
fieldset.background,
fieldset.foreground,
fieldset#dimensions,
div#colorNodeWrap,
fieldset.colorNode,
div.colorSelect {
	float: left;
	clear: left;
	z-index: 1618;
	position: relative; }
fieldset#styler fieldset#superstyle {
	position: absolute;
	top: 11.618em;
	left: 61.8%;
	border: 1px solid;
	padding: 2px .382em; }
fieldset#styler fieldset#superstyle label:nth-child(4) {
	width: 100%;
	border-bottom: 1px solid; }
fieldset#styler fieldset#superstyle fieldset {
	position: absolute;
	left: -15.618em;
	bottom: 2.618em;
	top: auto;
	right: auto;
	border: 1px solid;
	padding: 2px .382em;
	white-space: nowrap;  }
fieldset#styler fieldset#superstyle fieldset label {
	display: inline;
	float: none;
	margin: 0;
	padding: 0;
}
fieldset#styler fieldset#hw fieldset {
	margin-top: 1em;
	margin-bottom: 0; }
fieldset#background {
	margin-top: 5.382em;
	margin-bottom: .618em;
	z-index: 2618; }
fieldset#styler fieldset#rotate {
	position: relative;
	padding: 0 0 .382em 0; }
fieldset#styler fieldset#rotate legend {
	margin-left: .382em; }
fieldset#styler fieldset#rotate div {  /* fix Firefox - but later changes make this no longer work.  This browser is the IE6 of 2011...and I'm tired of and unimpressed with it */
	display: block;
	padding: .382em;
	}
fieldset#styler fieldset#rotate fieldset {
	display: block;
	position: static;
	float: left;
	clear: left;
	width: auto;
	padding: .382em 0 0 0;
	margin: .618em 0 0 0;
	border: none;
	border-top: 1px solid;
	}
fieldset#styler fieldset#rotate fieldset:last-child {
	position: absolute;
	top: auto;
	bottom: -1px;
	left: 100%;
	padding: .382em .382em .382em 0;
	white-space: nowrap;
	border: 1px solid;
	border-left: none;
	background-color: black;
	}
fieldset#styler fieldset#rotate fieldset:last-child label {
	padding-left: .382em;
	border-left: 1px solid;
	}
fieldset#styler fieldset {
	position: relative;
	top: -.382em; }
fieldset#styler ul {
	position: static; /**/
	list-style-type: none;
	border: none;
	margin: 0;
	padding: 0 .382em 0 0; }
fieldset#styler ul fieldset {
	position: static;
	float: none;
	clear: left;
	margin: 0;
	padding: 0;
	border: none; }
fieldset#styler ul fieldset label {
	float: none;
	display: inline; }
fieldset#styler ul fieldset:last-child fieldset {  /* mask file */
	position: absolute;
	top: 100%;
	left: 0%;
	padding: .382em;
	border: 1px solid; }
fieldset#styler ul fieldset:last-child fieldset label {
	display: block;
	margin-bottom: .162em; }
fieldset#styler ul fieldset:last-child fieldset label:nth-child(4) {
	display: inline; }
fieldset#styler ul fieldset:hover fieldset {
	background-color: #802020; }
fieldset#styler ul fieldset:hover {
	border: 1px solid; }
fieldset#dimensions div fieldset,
fieldset#styler fieldset label input {
	float: none;
	z-index: 1; }
fieldset#styler fieldset label {
	display: block;
	white-space: nowrap; /*attempt to fix Opera - to no avail*/
	z-index: 1; }
fieldset#styler input[type='text'] {
	margin: 0 0 0 .27em; }
fieldset#styler fieldset:nth-child(4) label:nth-child(2),
fieldset#styler fieldset:nth-child(4) label:nth-child(4) {
	float: right; }
fieldset#styler fieldset:nth-child(4) label:nth-child(4) input {
	width: 1.5em;
	margin: 0 .27em 0 0; }
fieldset#styler label {
	position: relative; }
fieldset#styler label:hover {
	z-index: 2618; }
fieldset#styler legend span,
fieldset#styler label span {
	display: none;  }
fieldset#styler legend:hover span,
fieldset#styler label:hover span {
	display: block;
	position: absolute;
	top: -7px;
	left: 100%;
	padding: 7px 7px 7px 0;
	background-color: black;
	color: red;
	font-weight: bold;
	white-space: nowrap;
	z-index: 2618; }
fieldset#styler legend:hover span,
fieldset#styler fieldset label:hover span {
	top: 100%;
	left: -5px;
	padding: 4px .618em 7px .618em;
	min-width: 97%;
/*	min-width: calc(100%-14px);  */  }
fieldset#styler legend:hover span {
	top: 1.2em; }
fieldset#styler legend span strong,
fieldset#styler label span strong {
	font-size: 120%; }
fieldset#styler .disabled label:hover span,
fieldset#styler label.disabled span {
	display: none; }
fieldset#styler input[name="hw[ratio_1]"],
fieldset#styler input[name="hw[ratio_2]"],
fieldset#styler input[name="hw[swell]"],
fieldset#styler input[name="hw[depth]"],
fieldset#styler input[name="hw[span]"],
fieldset#styler input[name="hw[size_2]"],
fieldset#styler input[name="hw[shift_2]"],
fieldset#styler input[name="spiral[factor]"],
fieldset#styler input[name="rotate[pinwheel]"],
fieldset#styler #rotate fieldset input,
fieldset#background > fieldset input,
.background > label:last-child input,
.foreground > label:last-child input,
fieldset#dimensions div:nth-child(2) input,
fieldset#dimensions input[name="dimension[scale]"],
fieldset.colorNode div.colorSelect input[size="3"] {
	text-align: right;
	margin-right: 2px;  }
fieldset#styler #rotate fieldset input[name="rotate[shimmer][wiggles]"],
fieldset#background > fieldset label:first-child input {
	text-align: center;
	margin-right: 0;  }
fieldset#dimensions select {
	margin: 0 0 .618em 0; }
fieldset#styler fieldset#pie {
	position: absolute;
	top: 110.618%;
	right: 0;
}
fieldset#styler fieldset#pie table {
	clear: both;
	margin: 0;
	padding: 0;
	border: none; }
fieldset#styler fieldset#pie th {
	margin: 0;
	padding: 0 0 0 .382em; }
fieldset#styler fieldset#pie tr:first-child th {
	border-bottom: 1px dotted;
	padding: .382em 0 0 0; }
fieldset#styler fieldset#pie tr th:first-child {
	border-bottom: none; }
fieldset#pie table,  /*attempt to fix MSIE and others*/
fieldset#pie td:last-child {    /*  only Opera’s browser supports this */
	position: relative;
	width: 0px; }
fieldset#pie td {
	margin: 0; }
fieldset#pie tr td.formOptions span,
fieldset > div.formOptions {
	display: none; }
fieldset#pie tr:hover td.formOptions span,
fieldset:hover > div.formOptions {
	display: block;
	position: absolute;
	left: 100%;
	top: 38.2%;
	right: auto;
	bottom: auto;
	margin: 0;
	padding: 0; }
fieldset#pie tr:hover td.formOptions span {
	left: 97%;
	top: 16.18%; }
fieldset.colorNode:first-child > div.formOptions {
	top: 16.18%; }
.formOptions span {
	display: block;
	font-weight: bold;
	text-align: center;
	white-space: nowrap;
	background-color: black;
	border: 1px solid black; }
.formOptions span:hover {
	color: yellow;
	border: 1px solid yellow; }
fieldset.colorNode {
	border: none;
	margin: 2px 0;
	position: relative; }
fieldset.colorNode:hover {
	background-color: #202040; }
fieldset.colorNode fieldset {
	vertical-align: middle; }
fieldset.colorNode:first-child .hiddenWhenFirst {
	display: none;
}
fieldset.transp_curve {
	border: none;
	border-top: 1px solid white;
	border-left: 1px solid white;
	margin: 0 .382em .382em 0;
	padding: 0 0 0 .618em;
	float: left; }
label+fieldset.transp_curve {
	border-left: none;
	margin: 0 0 .382em .382em;
	padding: 0 .618em 0 .618em;
	clear: left; }
fieldset.transp_apply {
	border: none;
	margin: 0;
	padding: 0;
	float: left;
	clear: left; }
fieldset.colorNode label {
	display: block;
	float: left;
	clear: left; }
fieldset.colorNode label:first-child {
	float: none; }
fieldset.colorNode div.colorSelect {
	white-space: nowrap; }
fieldset.colorNode div.colorSelect label {
	display: inline;
	float: none;
	margin-right: 1.618em;
	}
fieldset.colorNode div.colorSelect label:first-child {
	margin-right: .618em; }
input, select {
	color: aqua;
	background-color: black;
	text-align: center; }
button,
input.submit,
div#fileinfo input[type='submit'] {
	color: white;
	background-color: darkblue;
	font-weight: bold;
	margin: 0;
	padding: .27em;  }
span button {
	font-size: 138%;
	font-family: serif;
	padding: 0 .15em;
	vertical-align: middle;  }
.submit {
	display: block;
	position: fixed;
	font-size: .8em;
	z-index: 1;
	bottom: 1.618em;
	right: 16.8em; }
button[name='gallery'] {
	margin: 0;
	bottom: 3.382em;
	right: 7.618em; }
button[name='gallery'] span {
	display: none; }
button[name='gallery']:hover span {
	display: block;
	position: absolute;
	bottom: 138.2%;
	top: auto;
	width: auto;
	white-space: nowrap;
	color: red;
	font-weight: bold; }
input[value='view Gallery'] {
	margin: 0;
	bottom: .618em;
	right: 7.618em; }
.disabled {
	color: #404040;
	border-color: #404040; }
.disabled input, .disabled select, input.disabled {
	color: #001000;
	background-color: #202020; }
label.password {
	display: block;
	float: left;
	clear: left;
	border: 1px solid white;
	margin: .618em 1.618em; }
img {
	margin: 10px;
	vertical-align: top; }
div#fileinfo {
	display: none;
	position: absolute;
	right: 1.618em;
	bottom: 6.618em;
	border: 1px solid; }
div#fileinfo label,
div#fileinfo select {
	display: inline;
	margin: 0 0 0 .382em }
div#fileinfo p {
	display: block;
	margin: .382em 0 0 0;
	padding: 0;
	width: 21em;
	text-align: center; }
div#fileinfo label span {
	padding: 0 0 0 1.618em;
	font-size: 80%;
	color: red; }
div#gallery {
	display: block;
	clear: left; }
div#gallery img {
	display: block;
	margin-top: 2.618em; }
div#gallery p {
	margin-top: 0;
	padding-top: 0;
	text-align: center; }
div#gallery hr {
	width: 61.8%;
	margin: 0 auto 1.618em auto; }
div#ms_internet_exploder, div#apple_suckari, div#burning_bronto {
	color: red;
	font-size: 1.382em; }