/* css for GC homepage - black-orange color scheme with blue highlight */

/* general text properties **************************************************************/

body {
  font-family      : Verdana, Arial, Helvetica, sans-serif;
  font-size        : 12px;
  font-weight      : normal;
  text-align       : left;

  margin           : 10px;
  padding          : 0px;

  color            : #FFFFFF;
  background       : #191919 url(images/gradient-530.png) left top repeat-x;
}

a {
  font-weight     : bold;
  text-decoration : none;
  color           : #F09000;
}

a:link, a:visited { text-decoration:none; }
a:hover, a:active { text-decoration:underline;  color:#FFFFFF; }


/* page header layout *******************************************************************/

#body {
  width            : 910px;
  padding          : 10px;
  margin           : 5px auto;
  background-color : #191919;
  border-left      : 1px solid #444;
  border-right     : 1px solid #000;
  border-top       : 1px solid #444;
  border-bottom    : 1px solid #000;
}

#header {
/*height           : 112px;*/
  width            : 910px;
  z-index          : 1;
}

#banner {
  display          : block;
  position         : relative;
  left             : 0px;
  top              : 0px;
  width            : 910px;
/*height           : 88px;*/
/*background       : #000000 url(images/banner_bg.png) top left repeat-x;*/
  text-align       : center;
}

#banner-left {
  display    : block;
/*background : url(images/banner_left.jpg) top left no-repeat;*/
}

#banner-right {
  display    : block;
/*background : url(images/banner_right.jpg) top right no-repeat;*/
}

#banner-logo { 
  display    : block;
  height     : 180px;
  border     : 0px;
/*
  background : url(images/gcbanner.png) center center no-repeat;
*/
  background : #F09000 url(images/banner-heavy-scaled.jpg) center center no-repeat;
}

#login {
  display          : block;
  padding          : 5px;
  margin           : 0;
  color            : #000000;
  text-align       : right;
  background       : #F09000 url(images/gradient-f90.png) left top repeat-x;
}

#login a {
  color : #000000;
}

#login a:hover, #login a:active {
  text-decoration:underline;  color:#FFFFFF;
}

#main {
  display          : block;
  position         : relative;
  top              : 0;
  left             : 0;
  width            : 900px;
  margin-top       : 10px;
  background-color : #191919;
}


/* page main menu ***********************************************************************/

#menu {
  display          : block;
  position         : absolute;
  left             : 0px;
  top              : 0px;

  width            : 100px;
  margin           : 0px;
  padding          : 0px;

  text-align       : left;
  z-index          : 2;
}

#menu li {
  display          : block;
  width            : 98px;  /* 100 - 2*1 (border)) */
  margin           : 0px 0px 1px 0px;
  padding          : 0;
  list-style-type  : none;
  border-left      : 1px solid #000;
  border-right     : 1px solid #444;
  border-top       : 1px solid #000;
  border-bottom    : 1px solid #444;
  background       : #191919 url(images/gradient-19.png) left top repeat-x;
}

#menu li.headline, #menu li.bottomline {
  display : none;
}

#menu li.title {
  width            : 50px;  /* 100 - 2*25 (padding) */
  height           : 17px;  /*  27 - 2* 5 (padding) */
  border           : 0;
  padding-left     : 25px;
  padding-right    : 25px;
  padding-top      : 6px;
  padding-bottom   : 4px;
  text-align       : center;
  font-size        : 14px;
  font-weight      : bold;
  color            : #F09000;
  background       : url(images/section-bar-100.png) left top no-repeat;
}

#menu li.separator {
  width            : 100px;
  height           : 8px;
  border           : 0;
  background       : #191919;
}

#menu li a {
  display          : block;
  text-align       : left;
  padding          : 5px 4px 5px 4px;
  color            : #F09000;
}

#menu li.default a {}

#menu li a:hover, #menu #menuactive a, #menu #menuactive.default a {
  color            : #FFFFFF;
  background       : #F09000 url(images/gradient-f90.png) left top repeat-x;
  text-decoration  : none;
}

#menu li.admin a {
  color            : #FF5050;
  background       : #191919 url(images/gradient-19.png) left top repeat-x;
}

#menu li.admin a:hover, #menu #menuactive.admin a {
  color            : #FFFFFF;
  background       : #AA2222 url(images/gradient-f55.png) left top repeat-x;
}

#menu li.special a {
  color            : #0550FF;
  background       : #191919 url(images/gradient-19.png) left top repeat-x;
}

#menu li.special a:hover, #menu #menuactive.special a {
  color            : #FFFFFF;
  background       : #033099 url(images/gradient-05f.png) left top repeat-x;
}



/* content layout ***********************************************************************/

#content {
  position       : relative;
  left           : 110px;
  top            : 0;
  width          : 800px;
  min-height     : 500px;
  padding        : 0;
  margin         : 0;
  background-color : #191919;
  text-align     : justify;
}

h1 {
  display          : block;
  width            : 750px;  /* 800 - 2*25 (padding) */
  height           : 17px;   /*  27 - 2* 5 (padding) */
  border           : 0;
  background       : url(images/section-bar-800.png) left top no-repeat;
  padding-left     : 25px;
  padding-right    : 25px;
  padding-top      : 6px;
  padding-bottom   : 4px;
  margin           : 0;
  text-align       : center;
  font-size        : 14px;
  font-weight      : bold;
  color            : #F09000;
}

h2 {
  display          : block;
  width            : 750px;  /* 800 - 2*25 (padding) */
  height           : 15px;   /*  27 - 2* 6 (padding) */
  border           : 0;
  background       : url(images/section-bar-800.png) left top no-repeat;
  padding-left     : 25px;
  padding-right    : 25px;
  padding-top      : 7px;
  padding-bottom   : 5px;
  margin           : 0;
  margin-top       : 10px;
  text-align       : center;
  font-size        : 12px;
  font-weight      : bold;
  color            : #F09000;

/*
  display          : block;
  font-size        : 12px;
  font-weight      : bold;
  text-align       : left;
  text-decoration  : underline;
  color            : #F09000;
  margin           : 1em;
*/
}

h3 {
  display          : block;
  border           : 0;
  padding          : 0;
  margin           : 1em;
  margin-bottom    : 0;
  text-align       : left;
  font-size        : 12px;
  font-weight      : normal;
  color            : #F09000;
}

p {
  padding : 1em;
  margin  : 0;
  /* border : 1px solid #000000; */
  border-left      : 1px solid #000;
  border-right     : 1px solid #444;
  border-top       : 1px solid #000;
  border-bottom    : 1px solid #444;
  background       : #191919 url(images/gradient-19.png) left top repeat-x;
}

p.warning {
  background       : #AA2222 url(images/gradient-f55.png) left top repeat-x;
}

div.pbox {
  border-left      : 1px solid #000;
  border-right     : 1px solid #444;
  border-top       : 1px solid #000;
  border-bottom    : 1px solid #444;
  background       : #191919 url(images/gradient-19.png) left top repeat-x;
}

div.pbox p {
  border           : 0;
  background       : transparent;
}

ul {
  margin : 1em;
}

li {
  margin : 0em;
}

ul.download {
  margin : 1em;
  padding-left        : 0em;
  list-style-position : outside;
  list-style          : none;
}

ul.download li {
  margin : 1em 0em 1em 0em;
}

ul.download li span.name {
  display     : block;
  font-family : Courier, monospace;
  font-weight : bold;
  color       : #F09000;
  background  : #000000;
}

ul.download li span.link {
  display : block;
  padding-left : 1em;
}

ul.download li span.desc {
  display : block;
  padding-left : 1em;
}

.highlight { color:#6666FF; }

.red { color:#FF5555;  font-weight:bold; }
.yellow { color:#FFFF55;  font-weight:bold; }
.green { color:#55FF55;  font-weight:bold; }

tr.win, td.win {
  background-color : #306030;
}

tr.lost, td.lost {
  background-color : #603030;
}

tr.draw, td.draw { }

tr.active {
  color            : #FF6A00;
  background-color : #000000;
}

tr.inactive {
  color            : #CCCCCC;
  background-color : #303030;
}

/*
tr.active.squadred    { background-color : #903030; }
tr.inactive.squadred  { background-color : #600000; }

tr.active.squadblu    { background-color : #303090; }
tr.inactive.squadblu  { background-color : #000060; }

tr.active.teamthree   { background-color : #309030; }
tr.inactive.teamthree { background-color : #006000; }

tr.active.teamsix     { }
tr.inactive.teamsix   { }
*/

tr.squadred td.squadred { color : #F00000; }
tr.squadblu td.squadblu { color : #0000F0; }
tr.teamthree td.teamthree { color : #00F000; }
tr.active.training { background-color : #006000; }
tr.inactive.training { background-color : #003000; }
tr.active.etf2l, tr.active.eslwar { background-color : #600030; }
tr.inactive.etf2l, tr.inactive.eslwar { background-color : #300000; }

.indent { padding-left:2em;  padding-right:2em; }

p.lastchanged {
  text-align : center;
  font-size  : 10px;
  padding    : 0;
  margin     : 0;
  border     : 0;
  background : #191919;
}

.command {
  font-family : Courier, monospace;
  font-weight : bold;
  color       : #F09000;
}

div.editcontrol {
  display : block;
  float   : right;
  width   : 200px;
  margin  : 1em;
  padding : 2px;
  background-color : #303030;
  border  : 1px solid #9DA6B3;
}

div.editcontrol:hover {
  border  : 1px solid #6666FF;
}

div.editcontrol ul {
  display      : block;
  list-style   : disc inside none;
  margin       : 0px;
  margin-left  : 0.4em;
  padding      : 0px;
  white-space  : nowrap;
}

div.contentactive {
/*  background-color : #505050;*/
  background       : #AA2222 url(images/gradient-f55.png) left top repeat-x;
}

/*
div.contentactive p {
  background       : #AA2222 url(images/gradient-f55.png) left top repeat-x;
}
*/

div.contententry {
}

span.editlink {
  float : right;
}

span.editlink img {
  border : 2px transparent;
  margin-left : 4px;
}

span.title {
  color      : #F09000;
}

hr {
  height            : 1px;
  margin            : 5px;
  color             : #F09000;
  background-color  : #F09000;
  border            : none;
}

div.editbox {
  margin : 0;
  padding : 5px;
  border : 1px solid #FF6A00;
}

div.editbox h2 {
  width            : 739px;  /* 798 - 2*25 (padding) */
  border           : 0;
  background       : url(images/section-bar-789.png) left top no-repeat;
}

div.imagethumb {  /* see div.pbox */
  border-left      : 1px solid #000;
  border-right     : 1px solid #444;
  border-top       : 1px solid #000;
  border-bottom    : 1px solid #444;
  background       : #191919 url(images/gradient-19.png) left top repeat-x;
  min-height       : 90px;
}

div.imagethumb + p {
  clear  : both;
}

div.imagethumb > a {
  display : block;
  float  : left;
  width  : 80px;
  height : 60px;
  margin : 1em;
  border : 2px solid #FF6A00;
}

div.imagethumb > a > img {
  display : block;
  float   : none;
  width   : 80px;
  height  : 60px;
  border  : none;
}

div.imagethumb > img {
  float  : left;
  width  : 80px;
  height : 60px;
  margin : 1em;
  border : 2px solid #FF6A00;
}

div.imagethumb p {
  border           : 0;
  background       : transparent;
}

ul.thumblist {
  margin  : 1em;
  padding : 0;
}

ul.thumblist li {
  display          : block;
  list-style-type  : none;
  float            : left;
  width            : 80px;
  margin-right     : 10px;
}

ul.thumblist li a {
  display : block;
}

span.clear {
  display : block;
  clear   : both;
  padding-bottom : 1em;
}

span.thumbdetails {
  display   : none;
  position  : absolute;
  left      : 0px;
  top       : 0px;
  width     : 350px;
  background-color : #505050;
  border    : 2px solid #FF6A00;
}

ul.thumblist li:hover span.thumbdetails {
  display : block;
}

/* form layout *****************************************/

form {
  display     : block;
  margin      : 1em;
  text-align  : left;
}

form.row {
  margin-top    : 1em;
  margin-bottom : 0em;
}

form.row+form.row {
  margin-top    : 0em;
}

form:after {
  clear : both;
}

form span.line {
  display : block;
  clear   : both;
}

form div.line {
  display : block;
  clear   : both;
}

form span.label {
  clear       : left;
  display     : block;
  float       : left;
  width       : 120px;
  margin      : 2px;
  padding     : 2px;
}

form span.longlabel {
  display     : block;
  float       : left;
  width       : 488px;
  margin      : 2px;
  padding     : 2px;
}

form div.double span.longlabel {
  width       : 239px;
}

form input {
  display     : block;
  float       : left;
  margin      : 2px;
  padding     : 1px;
}

form textarea {
  display     : block;
  float       : left;
  width       : 490px;
  margin      : 2px;
  padding     : 1px;
}

form select {
  display     : block;
  float       : left;
  width       : 494px;
  margin      : 2px;
  padding     : 1px;
}

form input[type="hidden"] {
  display : none;
  border  : 0px;
  margin  : 0px;
  padding : 0px;
}

form input[type="text"], form input[type="password"] {
  width       : 490px;
}

form input[type="submit"] {
  width       : 100px;
}

/* form font *******************************************/

form span.longlabel {
  font-family : Courier, monospace;
  font-weight : normal;
  font-size   : 12px;
}

form input {
  font-family : Verdana, Arial, Helvetica, sans-serif;
  font-weight : normal;
  font-size   : 12px;
}

form textarea {
  font-family : Verdana, Arial, Helvetica, sans-serif;
  font-weight : normal;
  font-size   : 10px;
}

form select {
  font-family : Courier, monospace;
  font-weight : normal;
  font-size   : 12px;
}

form input[type="text"], form input[type="password"] {
  font-family : Courier, monospace;
}

form input[type="submit"] {
  font-weight : bold;
}

/* form color ******************************************/

form span.label {
  color       : #F09000;
  /*border      : 1px solid #9DA6B3;*/
}

form span.label .highlight {
  color       : #FFFFFF;
}

form span.longlabel {
  color       : #CCCCCC;
  border      : 1px solid #9DA6B3;
}

form input, form textarea, form select {
  color       : #FF6A00;
  background  : #000000;
  border      : 1px solid #9DA6B3;
}

form input[type="submit"] {
  color       : #F09000;
  background  : #000000;
}

form span.longlabel:hover {
  border      : 1px solid #6666FF;
}

form input:hover, form textarea:hover, form select:hover, form input[type="submit"]:hover{
  color       : #FFFFFF;
  border      : 1px solid #6666FF;
}

form input[type="submit"][disabled="true"] {
  color       : #808080;
  background  : #303030;
}


/* tables **********************************************/

table {
  margin          : 1em;
  border-collapse : collapse;
/*
  color            : #CCCCCC;
  background-color : #303030;
*/
}

thead tr {
  color       : #000000;
  background  : #F09000 url(images/gradient-f90.png) left top repeat-x;
}

thead tr th {
  border      : 1px solid #6666FF;
  padding     : 2px;
  font-weight : bold;
  text-align  : center;
}

tbody tr {
  background  : transparent;
}

tbody tr td {
  border      : 1px solid #6666FF;
  padding     : 2px;
}


tr.user td.privileges, tr.user td.count, tr.access td.privileges {
  font-family : Courier, monospace;
  font-weight : normal;
  text-align  : right;
}

tr.user td.privileges, tr.access td.privileges {
  color            : #FFFFFF;
}

tr.user td.privileges .highlight, tr.access td.privileges .highlight {
  color            : #FF6A00;
}

tr.access {
  color            : #FFFFFF;
  background-color : #000000;
}

/* old file table
table tr td.filename {
}

table tr td.filesize, table tr td.count {
  text-align  : right;
}
*/


tr.timerow {
  margin  : 0;
  padding : 0;
}

tr.timerow td {
  padding        : 0;
  margin         : 0;
  border-spacing : 0;
  text-align     : center;
}

tr.timerow td.red, tr.timerow td.gre, tr.timerow td.yel, tr.timerow td.blu {
  width  : 25px;
  height : 20px;
  color  : #000000;
  vertical-align : bottom;
}

tr.timerow td.red {
  background : #FF0000 url(gcsred.png) left no-repeat;
}

tr.timerow td.gre {
  background : #00FF00 url(gcsgre.png) left no-repeat;
}

tr.timerow td.yel {
  background : #FFFF00 url(gcsyel.png) left no-repeat;
}

tr.timerow td.blu {
  background : #0000FF url(gcsblu.png) left no-repeat;
}

table tr.timerow td a {
  display : block;
  width   : 25px;
  height  : 20px;
  color   : #000000;
  vertical-align : bottom;
}

table tr.timerow td.text {
  padding     : 2px;
  font-weight : bold;
  color       : #000000;
  background  : #F09000 url(images/gradient-f90.png) left top repeat-x;
}


div.calendar {
  display     : block;
}

div.monthclear {
  clear : both;
}

div.month {
  display     : block;
  float       : left;
  width       : 242px;
  border      : 1px solid #FF6A00;
  padding     : 2px;
  margin      : 1em;
}

div.month div.head {
  border      : 1px solid #FF6A00;
  text-align : center;
}

div.month div.head .prev {
  display : block;
  float   : left;
  width   : 34px;
  border-right : 1px solid #FF6A00;
  text-align : center;
}

div.month div.head .next {
  display : block;
  float   : right;
  width   : 34px;
  border-left : 1px solid #FF6A00;
  text-align : center;
}

div.month div.head .title {
}

div.month div.week {
  display    : block;
  clear      : both;
  border     : 1px solid #FF6A00;
  border-top : 0px;
  text-align : center;
}

div.month div.week .day {
  display : table-cell;
  width   : 30px;
  margin  : 0px;
  padding : 2px;
  color            : #FFFFFF;
  background-color : #000000;
}

div.month div.week .active {
  color            : #000000;
  background-color : #FF6A00;
}

div.month div.week .active a {
  color            : #000000;
}

div.month div.week .today {
  color            : #000000;
  background-color : #FFA040;
}

div.month div.week .selected {
  color            : #000000;
  background-color : #6AFF00;
}