/* ---- Base CSS for Colour Matcher ---- */
/* ------ last altered 08 April 2017 ------ */
/* ----- this version is located on Smudge --- */

body {font-family:Verdana,Geneva,Helvetica,Arial,sans-serif;padding:0px;}

#pageHeading {margin-top:0;padding-top:0;text-align:left;}

p {font-size:1.2em;}

h1 {font-size:1.7em;font-weight:bold;text-align:center;font-variant:small-caps;}

h2 {font-size:1.1em;font-weight:bold;color:#a90303;}

h3 {font-size:0.8em;font-weight:normal;}

ul li {font-size:1.2em;}

a {font-weight:bold;}

/* hr {height:2px;} */

/* ---------------- IE6 Error page ----------------------*/

.ie6Error {font-family:Verdana,Geneva,Helvetica,Arial,sans-serif;font-size:1.3em;font-weight:bold;
    			text-align:center;}

.ie6Info {font-size:0.9em;text-align:center;width:500px;}


/* -------------- top Table, Mascot styling ------------------ */

.topTable {padding:5px;margin-left:20px;margin-right:0px;width:84%;vertical-align:top;}

.mascotCell {width:45%;vertical-align:top;}

.mascotImage {padding:0px;text-align:center;vertical-align:top;}

a:link img {border-style:outset;}

a:visited img {border-style:outset;}

/* ------ steampunk Machine, URL entry, user options, pony profile styling --------- */

.steampunkMachine {width:55%;vertical-align:top;padding:2px;}

.enterOptions {font-size:0.55em;font-weight:bold;margin:0px;text-align:left;width:450px;}

.machineContainer {padding:10px;font-size:1.2em;}

.groupSelect {width:100%;}

.matcherForm {font-size:1.2em;font-weight:normal;}

.outline {border:1px solid #000080;}

.ponyProfileTable {font-size:0.85em;padding:0px;border-collapse:separate;border-spacing:5px;
    						margin-left:0px;margin-right:0px;margin-top:0px;margin-bottom:0px;
    						width:450px;border:1px solid #000080;}

td.border  {border-top:1px solid #000080;}

.mascotBorder {border:1px solid #000080;}

.slot {padding:0px;margin:0px;font-weight:bold;font-size:0.7em;width:22%;}

.colourCode {font-size:0.6em;font-weight: bold;width:14%;}

.colourblock {font-size:0.75em;font-weight:bold;width:14%;}

.topSpot {vertical-align:top;padding:0;margin:0;font-weight:bold;font-size:0.75em;width:22%;}

.colourbox {border: 1px solid black;width: 50px;margin-left: 5px;padding: 1px;margin-top: 0px;
    			  margin-bottom: 0px;}

.hexDecProfile {font-size:0.7em;font-weight:bold;}

.darkProfile {font-size:0.7em;font-weight:bold;color:black;}

.lightProfile {font-size:0.7em;font-weight:bold;color:white;}

.leftSide {text-align:left;padding:2px;font-size:1.2em;}
					
.groupsLink {background-color:#000080;color:#fefefe;padding-left:4px;padding-right:4px;padding-top:2px;padding-bottom:2px;}

/* --------------- main text styling ------------- */

.title {font-size:1.3em;font-weight:bold;}

.notice {font-size:1.4em;font-weight:bold;color:#c40202;}

.contest {font-size:0.75em;padding:5px;}

.mainText {font-size:0.8em;padding:0px;vertical-align:top;padding-top:0;}

.quote {border:1px dotted #000080;padding:5px;font-family:Arial,Geneva,Helvetica,Verdana,sans-serif;
    		font-size:0.8em;}

.colourTable {font-size:0.9em;border:1px solid #000080;border-collapse:collapse;padding:8px;width:650px;}

.colourTableborder {border:1px solid #000080;padding:8px;}

/* ------------------ links styles ------------------- */

a.groupsButton:link {background:#b7cfff;color:#30127c;border-radius:15px;text-decoration:none;
				font-weight:bold;border-style:solid;border-width:2px;border-color:#30127c;
				padding-top:3px;padding-bottom:3px;padding-left:5px;padding-right:6px;
				font-variant:small-caps;
				font-size:0.9em;text-align:center;box-shadow:inset -1px -1px 5px 0 rgba(50,0,79,.5);}
				
a.groupsButton:hover {color:#fefefe;}

a.groupsLink:link {font-size:0.7em;color:#fefefe;text-decoration:none;}
a groupsLink:visited {color:#fefefe;text-decoration:none;}

a.colourLink:link {font-size:0.95em;color:#800000;text-decoration:none;font-family:Arial,Geneva,Helvetica,sans-serif;}
a.colourLink:visited {color:#1d5fcd;font-size:0.95em;text-decoration:none;font-family:Arial,Geneva,Helvetica,sans-serif;}

a.topLink:link {font-size:0.85em;text-decoration:underline;color:#000080;}
a.topLink:visited {font-size:0.85em;text-decoration:underline;color:#000080;}

a.returnIndex:link {font-size:0.85em;text-decoration:none;color:#000080;font-family:Arial,Geneva,Helvetica,sans-serif;}

a.returnIndex:visited {font-size:0.85em;text-decoration:none;color:#000080;font-family:Arial,Geneva,Helvetica,sans-serif;}

/* ---------------- results output ---------------- */

.resultsTable {padding:0px;margin-left:20px;vertical-align:top;width:84%;font-size:1.0em;
    					font-weight:bold;border-collapse:separate;border-spacing:10px 10px;}

.resultsHeading {font-size:0.95em;font-weight:bold;}

.originalSlot {width:10%;padding:0px;border-bottom:1px solid;vertical-align:top;}

.originalColour {width:25%;font-size:0.7em;text-align:right;border-bottom:1px solid;vertical-align:top;}

td.colourblockOriginal {width:20%;font-size:0.75em;border-bottom:1px solid;}

td.hexDecOriginal {width:25%;font-weight:bold;font-size:0.75em;border-bottom:1px solid;}

.slotResults {vertical-align:top;border-collapse:collapse;border:2px solid;width:450px;}

.slotArea {vertical-align:top;}

.topAlign {vertical-align:top;}

.resultsLeft {width:50%;}

.resultsRight {width:50%;}

td.stats {width:10%;font-size:0.7em;font-weight: bold;padding-left:5px;}

td.colourgroups {width:60%;font-size:0.7em;font-weight:bold;}

td.colourblock {font-size:0.75em;width:15%;}

td.hexDec {width:15%;font-weight: bold;font-size:0.75em;}

.light {color: white;font-size:1.0em;}

.dark {color: black; font-size:1.0em;}

.red {color: red;font-size:1.0em;font-weight: bold;}

.green {color: green;font-size:1.0em;font-weight: bold;}

.blue {color: blue;font-size:1.0em;font-weight: bold;}

.codematch {font-weight: bold;font-size:1.1em;}

.matching {font-weight: bold;font-size:1.1em;}

.group {font-weight: bold;padding-bottom:1px;}

.groupSuper {padding:1px;}

div.resultsSlot {font-size:0.75em;font-weight:bold;border:1px dotted black;}

table.resultsSlot {font-size:0.9em;width:100%;}

span.resultsSlot {padding:2px;}

td.resultsSlot {width:50%;}

.colourName {font-weight:bold;width:30%;}

.colourGroup {font-weight:normal;font-style:italic;width:30%;}

.groupBanner {width:100%;}

.centerH3 {text-align:center;font-size:0.8em;font-weight: bold;}

.centerH4 {text-align:center;font-size:0.75em;font-weight: bold;}

.ponyName {vertical-align:top;font-size:0.7em;font-weight: bold;}

.name {text-align:left;font-size:0.6em;vertical-align:top;font-weight:bold;padding-left:0;}

.eyes {padding:2px;width:50%;}

.hair {padding:2px;width:50%;}

.hairEx {padding:2px;width:50%;}

.body {padding:2px;width:50%;}

.extra1 {padding:2px;width:50%;}

.extra2 {padding:2px;width:50%;}

/* **************** Matcher Unavailable ******************* */

#central {width:600px;text-align:center;color:#000080;border:1px solid black;}

#unavailable {padding:10px;background-color:#fefefe;font-size:0.9em;
					 text-align:center;border:1px dotted blue;}
					 
.groupsButtonUnavail {font-size:0.8em;}	

.unavailLegal {font-size:0.75em;}				

/* *************** acknowledgements and legal *************** */

.acknowledgements {width: 84%;padding: 2px;margin-top: 10px;margin-left:20px;font-size:0.75em;}

.legalBlurb {font-size:0.9em;font-weight:bold;}

/* ~~~~~~~~~ just for debugging! ~~~~~~~~~~~~~~~ */

.debug {border: 1px dotted red;background-color: #ffeeee;padding: 3px;}