/* _______________________________________

Superawesome Industries reset and starter stylesheet
________________________________________*/



/* _________ TOC _____________

=1= Miscellaneous conveniences
=2= Reusable classes
=3= Clearing floats
=4= Debugging
=5= Forms (a light implementation of Uni-Form [http://dnevnikeklektika.com/uni-form/])
____________________________*/



html{ font-family: Arial, Helvetica, Verdana, "Trebuchet Ms", sans-serif; line-height: 1.5; color: #333; }

html, body, form, fieldset{ /* Resetting the browser defaults */
  margin: 0; padding: 0; 
}

* html{ font-size: 62.5%; } /* Make text resizeable in IE6 as well */
  * html body{ font-size: 1.2em; } /* Set it to 12px now */

html > body{ /* Set the starting font size for non-IE6 browsers */
  font-size: 12px;
}

select, input, textarea{ /* Form field text-scaling */
  font-size: 99%; line-height: inherit;
}

pre, code{ /* Fixing monospaced fonts */
  font: 100% monospace;
}

h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl{ /* Reset vertical margins and make them match the line height */
  margin: 1.5em 0; padding: 0;
}

h1, h2, h3, h4, h5, h6{ /* Default headings styles */
  text-align: left; font-size: 100%; font-weight: bold;
}

li, blockquote, dd{ /* Apply left margin only to the few elements that need it */
  margin-left: 1.5em; padding: 0; list-style: none;
}
ul li{ list-style: none; } /* Unordered lists are used for semantics most of the time any way */



/* _______________________

=1= Miscellaneous conveniences
_______________________ */



form label    { cursor: default;                                  }
fieldset      { border: none;                                     }
legend        { font-weight: bold; color: inherit; display: none; } /* Hide the legend element by default */
button        { cursor: pointer; font-size: 100%; display: inline }
input:focus, 
textarea:focus{ background: #ffffdf;                              }

a img{ border: none; }

abbr, acronym{ border-bottom: 1px dotted #dfdfdf; cursor: help; }



/*______________

=2= Reusable classes
______________*/



.hr{ /* Horizontal rules, ex. usage: <div class="hr"><hr /></div> */
	clear: both;	margin:10px 0 0 0; background: #fff; border: none; border-top: 1px dotted #dfdfdf;
}
	hr{
		visibility: hidden;	font-size: 0;	line-height: 0;	height: 0; border: none;
	}

.accent{ /* For visualy emphasizing content, ex. usage: <strong class="accent"></strong> or <em class="accent"></em> */
	background: #ffffbf; color: inherit; padding: .2em;
}

.caps{ /* Used on abbr and acronym elements */
  font-variant: small-caps;
}

.amp{ /* Pretty ampersands, ex. usage: <span class="amp">&amp;</span>, taken from Blueprint typography stylesheet */
  color: #666; font-family: "Warnock Pro", "Goudy Old Style","Palatino","Book Antiqua", serif; font-size: 1.1em; line-height:10%; font-style: italic;
}

.noShow{ /* Remove an element from the screen, but remain accessible to non-graphical browsers and handheld devices */
  position: absolute; top: -9999px; left: -9999px; visibility: none; display: block; height: 0; width: 0; overflow: hidden;
}

/* For images */
.left{ float: left; margin: 0 .75em 0 0; }
.right{ float: right; margin: 0 0 0 .75em; }
.center{ display: block; margin: 1.5em auto; }

/* Key-Value pairs */
.keyValue{
  margin: 1.5em 0;
}
  /* When in need of a more robust layout */
  ul.keyValue li{ overflow: hidden; margin: 0; padding: 0; width: 100%; }
    ul.keyValue .key{ float: left; width: 29%; }
    ul.keyValue .value{ float: right; width: 69%; }
  /* When you want more semantics, this layout can't handle multiple rows of text in "key" */
  dl.keyValue dt{ width: 29%; font-size: 100%; font-weight: normal; margin: 0; padding: 0; }
  dl.keyValue dd{ margin: -1.5em 0 0 0; padding: 0 0 0 69%; } /* The negative top margin must match the line-height being used */



/*_____________

=3= Clearing floats
_____________*/



.overflowClear{ overflow: hidden; }

.afterClear:after{
  content: "."; display: block; clear: both; height: 0; line-height: 0; font-size: 0; min-height: 0; visibility: hidden;
}

* html .overflowClear, * html .afterClear{ /* Trigger hasLayout for IE6 */
  zoom: 1;
}



/*_______

=4= Debugging
_______*/




.debug{ /* Used to outline an element on screen but don't mess with the box model */
  outline: 1px solid fuchsia;
  background: yellow;
  min-height: 1px;
}

.zoom{ zoom: 1; } /* Trigger hasLayout for IE */



/*_______

=5= Forms (a light implementation of Uni-Form to handle basic form elements [http://dnevnikeklektika.com/uni-form/])
_______*/



.uniForm{
}
  .uniForm .ctrlHolder{
    margin: 0 0 .75em 0;
  }
  .uniForm .ctrlHolder:after{
    content: "."; display: block; clear: both; height: 0; line-height: 0; font-size: 0; min-height: 0; visibility: hidden;
  }
    /* .inlineLabels */
    .uniForm .inlineLabels label, .uniForm.inlineLabels label{
      float: left; width: 38%;
    }
    .uniForm .inlineLabels .textInput, .uniForm.inlineLabels .textInput, .uniForm .inlineLabels select, .uniForm.inlineLabels select, .uniForm .inlineLabels textarea, .uniForm.inlineLabels textarea{
      float: right; width: 58%;
    }
    /* .blockLabels */
    .uniForm .blockLabels label, .uniForm.blockLabels label{
      display: block; margin: 0 0 .25em 0;
    }
    .uniForm .blockLabels .textInput, .uniForm.blockLabels .textInput, .uniForm .blockLabels select, .uniForm.blockLabels select, .uniForm .blockLabels textarea, .uniForm.blockLabels textarea{
      display: block; width: auto;
    }
    .uniForm .textInput, .uniForm select, .uniForm textarea{ 
      padding: 2px; 
    }
    .uniForm .inlineLabels .inlineLabel, .uniForm.inlineLabels .inlineLabel, .uniForm .blockLabels .inlineLabel, .uniForm.blockLabels .inlineLabel{
      float: none; display: inline; width: auto; margin: 0;
    }