/*

    Copyright 2009 Brad Christie

    This file is part of TAMinations.

    TAMinations is free software: you can redistribute it and/or modify
    it under the terms of the GNU Affero General Public License as published
    by the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    TAMinations is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU Affero General Public License for more details.

    You should have received a copy of the GNU Affero General Public License
    along with TAMinations.  If not, see <http://www.gnu.org/licenses/>.

 */

/*  Force scrolling inside each table cell
    instead of overall page  */
html {
  overflow: hidden;
  margin: 0;
  padding: 0;
}

body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #fff8f0;
}

/*  Turn on scrolling for page sections  */
#definition, #calllist, #animationlist {
  overflow: auto;
}

/*  H2 is used for the title for each call  */
h2 {
  font: bold large Helvetica, Arial, Sans Serif;
  text-transform: uppercase;
  color: red;
}

/*  H3 is used for the title of call variations  */
h3 {
  font: bold large Helvetica, Arial, Sans Serif;
  color: red;

}

/*  B is used for call variations  */
b {
  font: medium Helvetica, Arial, Sans Serif;
  color: #008000;
}

div.intro,
div.starting-formations,
div.dance-action,
div.ending-formation,
div.timing,
div.styling,
div.comments,
div.command-examples
{
  margin: 10px;
}

div.command-examples
{
  font-style: italic;
  /*white-space: pre;*/
}

div.command-examples > p
{
  margin: 0 0 0 20px;
  text-indent: -20px;
}

div.starting-formations > b,
div.dance-action > b,
div.ending-formation > b,
div.timing > b,
div.styling > b,
div.comments > b,
div.command-examples > b
{
  font-family: Helvetica, Arial, Sans Serif;
  font-weight: bold;
  color: blue;
  display: block;
  text-indent: -10px;
}

p { margin: 0 0 10px 0 }

/*  Styling info on mainstream call definition  */
p.styling {
  color: maroon;
}
/*  Copyright info at the end of each definition   */
p.copyright {
  color: maroon;
  font-style: italic;
}
/*  Timing info at end of mainstream/plus/advanced calls  */
p.timing {
  font: bold small Helvetica, Arial, Sans Serif;
  color: navy;
}

/*  Comment after list of animations  */
.comment {
  color: maroon;
}

/*  "(DBD)" text */
span.dbd { font-family: Helvetica, Arial, Sans Serif;
            font-style: italic;
            color: maroon; }

/*  Highlight for call definition as it's animated  */
.definition-highlight { background-color: yellow; }

/*  Each animation list item is an anchor that selects itself  */
form a { color: black; text-decoration: none; }
.selectAnimation { color: black; text-decoration: none; }
.selectHighlight { background-color: yellow; }
.selectedHighlight { background-color: yellow; }

/*  Level text at top right of each call  */
.level {
  font: medium Helvetica, Arial, Sans Serif;
  text-transform: none;
  color: #008000;
  float: right;
}

/*  "TAMination" page title  */
.title {
  background-color: rgb(212,255,212);
  text-align: center;
  font-family: Arial, sans-serif;
  font-size: 50px;
  font-weight: bold;
  color: green;
  width: 100%;
  height: 72px;
}
/* Don't underline title  */
.title a {
  text-decoration: none;
  color: green;
}
/*  Table cell holding list of animations  */
.animation {
  background-color: rgb(212,255,212);
  font-family: Arial, sans-serif;
  color: green;
}

/*  Hints shown below animation  */
#taminatorsays {
  overflow: auto;
}

/*  Button style, used for svg  */
.appButton {
  color: white;
  background-color: #006000;
  border-color: green;
  border-style: outset;
  width: 14.28%;
  font-weight: bold;
}

#optionpanel .appButton {
  width: 15%;
}

.appButton:hover {
  background-color: #30a030;
}
.appButton.selected {
  color: green;
  background-color: white;
  border-color: green;
  border-style: inset;
  width: 14.28%;
  font-weight: bold;
}

/*  SVG popup  */
#popup, #titlepopup {
  color: white;
  background-color: green;
  border-color: green;
  border-width: 2px;
  border-style: outset;
  position: absolute;
}
#titlepopup a {
  color: white;
  text-decoration: none;
}
#closeDef {
  border-color: red;
  border-style: outset;
  margin: 10px;
  padding: 4px;
  color: white;
  background-color: red;
  font: medium Helvetica, Arial, Sans Serif;
  float: right;
}