/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)

a:link {
	color:white;
  text-decoration: none;
}

a:visited {
	color:white;
  text-decoration: none;
}

a:hover {
	color:white;
  text-decoration: underline;
}

a:active {
	color:white;
  text-decoration: underline;
}
*/
figure{
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
aside, details, figcaption, figure {
  display: block; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after {
  content: '';
  content: none; }

q:before, q:after {
  content: '';
  content: none; }

/*/////////////////////////////////////////////////////////////////////////////
    Colors
//////////////////////////////////////////////////////////////////////////////*/

.smallspace{
	margin-bottom:-20px;
	margin-top:-25px;
}

.smallspace_topmin10{
	margin-top:-10px;
}

.smallspace_wallettxt{
	margin-top:-10px;
	margin-left:-30px;
	
}
.tutsmargin{
	margin-top:-10px;
	margin-left:-56px;
}

.text_red {
      color: #ff0000;
   }

.text_orange {
      color: #ff9d00;
   }

.text_yellow {
      color: #ffff00;
   }

.text_green {
      color: #07ff00;
   }

.text_blue {
      color: #0013ff;
   }
   
figure, figcaption, aside {
  font-size: 13pt;
  padding-bottom: 8pt; }

.block.chart {
  padding: 8pt;
  font-size: 0px;
  display: block;
  cursor: pointer;
  -o-transition: all 250ms ease-in-out;
  -ms-transition: all 250ms ease-in-out;
  -webkit-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out; }
  .block.chart:after {
    content: "";
    display: table;
    clear: both; }
  .block.chart div {
    display: inline-block;
    max-width: calc( 250px + 440pt - 15px); }
  .block.chart label {
    cursor: pointer; }

a.block.chart:hover {
  background: #fff;
  -webkit-box-shadow: 0px 0px 5px 0px #ddd;
  -moz-box-shadow: 0px 0px 5px 0px #ddd;
  box-shadow: 0px 0px 5px 0px #ddd; }

.color {
  position: relative; }
  .color span {
    display: none;
    color: #444; }
  .color:hover span {
    display: block; }

.bar {
  position: relative;
  padding: 10pt 0; }
  .bar .grid {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0; }
  .bar .barColumn {
    height: 21pt;
    margin-bottom: 6pt; }
    .bar .barColumn .color {
      height: 100%;
      width: .75px;
      display: inline-block; }
      .bar .barColumn .color span {
        top: 21pt;
        left: 0px; }
    .bar .barColumn .barCount {
      font-family: Roboto, "sans-serif";
      font-size: 8pt;
      display: inline-block;
      vertical-align: middle;
      margin-left: 3pt;
      position: relative;
      top: -3pt;
      background: #f0f0f0;
      line-height: 100%;
      color: #444; }
  .bar .tickMark {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #ddd; }
    .bar .tickMark.labeled {
      background: #ccc; }
  .bar .scaleLabel {
    position: absolute;
    width: 100px;
    text-align: center;
    margin-left: -50px;
    bottom: -13pt;
    font-size: 8pt; }

svg {
  width: 100%; }

.hoverColor, .color span {
  position: absolute;
  background: #fff;
  padding: 5px;
  top: 13pt;
  left: 13pt;
  z-index: 5;
  font-size: 13pt;
  white-space: nowrap;
  -webkit-box-shadow: 0px 0px 5px 0px #ddd;
  -moz-box-shadow: 0px 0px 5px 0px #ddd;
  box-shadow: 0px 0px 5px 0px #ddd; }
  .hoverColor .fanCount, .color span .fanCount {
    display: block;
    font-size: 8pt; }

.color.listing {
  display: inline-block;
  width: 10pt;
  height: 10pt;
  line-height: 0px;
  position: relative; }

#conversionTable td {
  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; }
#conversionTable td:first-of-type {
  text-align: right; }
  #conversionTable td:first-of-type:not(.ellipsis):after {
    content: '\2192';
    padding: 8pt 6pt;
    font-family: Roboto, "sans-serif";
    color: #444; }
#conversionTable td.ellipsis {
  text-align: center;
  font-family: Roboto, "sans-serif"; }

code {
  background: #ddd;
  padding: 0px;
  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
  font-size: 10pt;
  padding: 3px 4px;
  white-space: nowrap; }

.color-preview {
  height: 10pt;
  width: 10pt;
  border: 1pt solid #f0f0f0;
  display: inline-block;
  position: relative;
  top: 2pt;
  margin-right: 6pt; }

pre {
  display: block; }
  pre * {
    font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; }
  pre ol {
    font-size: 10pt;
    padding: 0; }
    pre ol li {
      clear: both;
      padding: 0;
      padding-bottom: 0px;
      font-size: 10pt; }

.javascript .st0 {
  color: #C54E2C; }
.javascript .kw1 {
  color: #0B24FB; }
.javascript .de1 {
  color: #444; }
.javascript .me1 {
  color: #80a; }
.javascript .br0, .javascript .sy0 {
  color: #222; }

.codeFigure {
  max-height: 1000px;
  overflow: hidden;
  -o-transition: all 600ms;
  -ms-transition: all 600ms;
  -webkit-transition: all 600ms;
  transition: all 600ms; }
  .codeFigure.hiddenHeight {
    max-height: 0;
    padding: 0;
    margin: 0; }

#mc_embed_signup h2, #mc_embed_signup .indicates-required {
  display: none; }

.colorPicker .colorBlock {
  border-width: 13pt;
  text-align: center;
  padding: 3pt 0px;
  border-style: solid;
  margin-bottom: 6pt;
  background: #fff;
  display: block;
  font-size: 8pt; }
.colorPicker .colorNames {
  width: 100%;
  padding: 10px; }

figcaption {
  display: block; }

@media (max-width: 900px) {
 

  .color.listing {
    width: 6pt;
    height: 6pt; }
@media (min-width: 901px) {

  aside {
    width: 200px; }
    aside * {
      font-size: 10pt; }
    aside.left {
      float: left;
      clear: left;
      margin-left: -250px; }
      aside.left figure {
        float: right; }
    aside.right {
      float: right;
      clear: right;
      margin-right: -250px; }

  .block.chart label {
    text-align: right;
    width: calc( 250px - 10px - 10pt);
    display: inline-block;
    font-size: 10pt;
    vertical-align: top;
    padding-right: 10pt; }

  .chart aside {
    text-align: right;
    margin-left: calc( (200px + 10px) * -1 ); }

  figure.large {
    width: calc(250px + 440pt); }
    figure.large.left, figure.large.extra {
      margin-left: -250px; }
    figure.large.extra {
      width: calc( (250px * 2) + 440pt ); }

@media (max-width: 1140px) and (min-width: 901px) {
  .hide-on-medium-small {
    display: none; }

  figure.large.right, figure.extra.large {
    width: 440pt; }

  aside.right {
    float: left;
    margin-left: -250px;
    margin-right: auto; }

  figure.listings.large {
    margin-left: 0; }
    figure.listings.large label {
      text-align: left; } }
@media (min-width: 1300px) {
  main {
    margin-top: 0px; }

  header nav {
    right: 0;
    bottom: 0;
    left: auto;
    background: #ddd;
    padding: 16pt; }
    header nav a {
      display: block; }

  footer nav {
    display: none; } }

/*# sourceMappingURL=style.css.map */