/*
 * suitpicker.com
 * Copyright @ 2013 Dan Mantyla, all rights reserved
 */ 

/* JS dependent classes */
canvas {border: 1px solid #000; display: block; margin: 5px;
  background: #fff url('images/graph.png');
}
.holders { display: block;}
.patternHolder{ display: block; width: 320px; height: 90px; border: 1px solid #666; margin-top: 5px; color: #333; text-shadow: 2px 1px #fff;}
.patternHolder:before {content: 'Drag and drop patterns here (any image will work)';}
.hover{ display: block; width: 320px; height: 90px; border: 1px solid #666; margin-top: 5px; color: #333; text-shadow: 2px 1px #fff;}
.paletteHolder{ display: inline;}


/* Main style & layout */
body { 
  background-color: #777;
  font-family: 'Actor', Helvetica, sans-serif;
  color: #333;
  margin: 0; padding: 0;
  padding-bottom: 20px;
  color: #bbb;
  font-size: 85%;
}

table, tbody, thead, tr, td {
  border-spacing: 0;
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: top;
}
 
.tippity-top-wrapper{
}
.tippity-top{
  margin: 0 auto;
  max-width: 1050px;
  font-size: 12px;
}
.tippity-top a, .tippity-top a:visited, .tippity-top a:hover {color: #bbb}

.tippity-top-left-column {
  width: 150px;
}

.tippity-top-inner{
  width: 900px;
  background: #666 url('images/bg.png');
  border-left: 1px solid #000;
  border-right: 1px solid #000;
  padding: 5px 15px;
  -webkit-box-shadow: inset 0px 3px 15px 3px rgba(0, 0, 0, .15);
  box-shadow: inset 0px 3px 15px 2px rgba(0, 0, 0, .12);
  margin: 0;
}


.header-wrapper{
  background: #333 url('images/bg-head.png');
  border-top: 1px dashed #666;
  border-bottom: 1px dashed #666;
  -webkit-box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, .3);
  box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, .3);
  z-index: 666;
  position: relative;
}
.header{
  margin: 0 auto;
  max-width: 1050px;
  padding-left: 100px;
}

.content-wrapper{}
.content {
  margin: 0 auto;
  max-width: 1050px;
  z-index: 1;
}

.content-left-column {
  width: 150px;
  margin: 0;
  padding-top: 10px;
}

.content-inner {
  margin: 0;
  width: 900px;
  background: #666 url('images/bg.png');
  border-left: 1px solid #000;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  padding: 15px;
  padding-top; 30px;
  -webkit-box-shadow: inset 0px 0px 15px 3px rgba(0, 0, 0, .15);
  box-shadow: inset 0px 0px 15px 3px rgba(0, 0, 0, .15);
}

.powered-by {
  cursor: pointer;
  z-index: 2;
  position: absolute;
  top: 28px;
  margin-left: 820px;
  transition:All 1s ease;
  -webkit-transition:All 1s ease;
  -moz-transition:All 1s ease;
  -o-transition:All 1s ease;
  transform: translate(0px);
  -webkit-transform: translate(0px);
  -moz-transform: translate(0px);
  -o-transform: translate(0px);
  -ms-transform: translate(0px);
}
.powered-by:hover {
  transform: translate(0,104px);
  -webkit-transform: translate(0,104px);
  -moz-transform: translate(0,104px);
  -o-transform: translate(0,104px);
  -ms-transform: translate(0,104px);
}
 

/* suit pickers */
.canvasandcontrols {
  border: 1px solid #000;
  background-color: white;	
  vertical-align: top;
  margin: 5px;
  padding: 5px;
  background-color: #333;
}

table#canvases {
  border-collapse: collapse;
  margin: 5px;
  padding: 5px;
  color: #444;
}


/* overrides for dojo theme 'claro' */

.nihilo .dijitAccordionTitle {
  color: #333;	
  text-shadow: 2px 1px #fff;
  font-size: 18pt;
  padding: 8px;
  background: #eee;
  border-top: 1px solid #bbb;
}

.nihilo .dijitAccordionInnerContainerSelected .dijitAccordionTitle {
  color: #000;	
  background: #ddd;
}

.nihilo .dijitAccordionContainer {
  padding: 5px;
  background: none;
  border: none;
}