/******************************************************************************
   TAG STYLES
******************************************************************************/
html,body {
    overflow : hidden;
    height   : 100%;
}
/******************************************************************************
	GLOBAL STYLES
******************************************************************************/
/* #cover {
    position   : fixed;
    top        : 0px;
    left       : 0px;
    width      : 100%;
    height     : 100%;
    background : black;
    opacity    : 0.7;
    z-index  : 10000001;
} */

#loading {
    position   : absolute;
    top        : 10px;
    left       : 10px;
    background : white;
    z-index    : 10000004;
    padding    : 10px;
    font-size  : 16px;
}

/******************************************************************************
	DIALOG STYLES
******************************************************************************/
#insertimagedialog, #insertlinkdialog {
    position   : absolute;
    top        : 50%;
    left       : 50%;
    display    : none;
    background : white;
    border     : 5px solid #666;
    z-index    : 10000002;
    padding    : 8px;
}

/* .mclose {   */
/*     float : left; */
/*     color : red; */
/* } */
/* .cancel {  */
/*     color : red; */
/* } */

/* This class is the scrollable content inside of dialogues */

.scrollable {
    position           : relative;
    max-height         : inherit;
    max-width          : inherit;
    height             : auto;
    overflow-x         : auto;
    overflow-y         : scroll;
    margin             : 2px;
    border             : solid thin #808080;
}

#funwiz .scrollable, #hn_makeuserdeffns .scrollable {
    border: none;
}

.dialog .footer {
    min-height         : 4pt; /* TODO fix for columnmanager */
}

.resize {
          background         : url(/hypernumbers/sprite.png) -90px -1px;
          z-index            : 999999;
          height             : 10px;
          width              : 10px;
          float              : right;
          /*
             float              : right;
             vertical-align     : bottom;
             bottom             : 0px;
             */
          padding-bottom     : 4px;
          cursor             : se-resize;
          }

.resize:hover {
    color              : #666;
}

.resize {
    position           : absolute;
    right              : 0px;
    bottom             : -2px; /* FIXME? */
}

#columnmanagerdialog, #lineview {
    position           : static; /* changed dynamically */
    overflow           : visible;
    width              : auto;
    max-width          : none;
    min-width          : 260px;
    max-height         : none;
    height             : auto;
    display            : none;
    background         : white;
    border             : 2px solid #999;
    z-index            : 10000003;
    -moz-border-radius : 4px 4px 4px 4px;
    -moz-box-shadow    : 2px 2px 4px #AAA;
    -webkit-border-radius : 4px 4px 4px 4px;
    -webkit-box-shadow    : 2px 2px 4px #AAA;
}

#funwiz  {
    position           : static; /* changed dynamically */
    max-width          : none;
    min-width          : 500px;
    max-height         : none;
    height             : 320px;
}

#hn_makeuserdeffns  {
    position           : static; /* changed dynamically */
    max-width          : none;
    min-width          : 255px;
    max-height         : none;
    height             : 240px;
}

.hn_uf_inp {
             width: 60px;
             float: left;
             }

#hn_uf_params {
    -moz-border-radius : 4px 4px 4px 4px;
    -webkit-border-radius : 4px 4px 4px 4px;
    padding            : 2px 0px 4px 0px;
    margin             : 4px 2px 4px 2px;
    height             : 90px;
    width              : 225px;
    border             : solid thin #dddddd;
 }

.hn_uf_addparam, .hn_uf_delparam {
     position: relative;
     top: 2px;
 }

.hn_uf_txt, .hn_uf_insettxt {
             width: 150px;
             font-weight: bold;
             float: left;
             }

.hn_uf_txt {
             padding: 0px 0px 2px 4px;
             }

.hn_uf_insettxt {
             padding: 0px 0px 2px 2px;
             }


.hn_uf_subhead {
                 font-weight: bold;
                 color: #666;
}

#hn_makewikiselect div {
    margin: 5px;
}

#hn_makewikiselect {
    width    : 290px;
    height   : auto;
    left     : 350px;
    top      : 220px;
    position : absolute;
}

#funwiz, #hn_makewikiselect, #hn_makeuserdeffns {
    overflow           : visible;
    display            : none;
    background         : white;
    border             : 2px solid #999;
    z-index            : 10000003;
    -moz-border-radius : 4px 4px 4px 4px;
    -moz-box-shadow    : 2px 2px 4px #AAA;
    -webkit-border-radius : 4px 4px 4px 4px;
    -webkit-box-shadow    : 2px 2px 4px #AAA;
}


#functions {
    position           : absolute;
    overflow           : visible;
    width              : auto;
    max-width          : none;
    min-width          : 260px;
    max-height         : none;
    height             : auto;
    display            : none;
    background         : white;
    border             : 2px solid #999;
    z-index            : 10000003;
    -moz-border-radius : 4px 4px 4px 4px;
    -moz-box-shadow    : 2px 2px 4px #AAA;
    -webkit-border-radius : 4px 4px 4px 4px;
    -webkit-box-shadow    : 2px 2px 4px #AAA;
}


div.resizer {
 padding-bottom: 2px;
 border-bottom: thin dotted gray;
}

/* for icon plus/minus buttons */
img.wizrep {
  vertical-align: middle;
  padding-left: 1px;
  padding-right: 1px;
}

.datastore { display: none; }

#funwizwrapper {
  padding: 4px;
}

#wizcatlist {
    font-size:inherit;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    width: 144px;
}

#wizfunlist {
              width       : 144px;
              font-size   : 9pt;
              line-height : 16px; /* set this or problems in Chrome returning "normal" */
}

#wizfunargs {
    overflow-y         : auto;
    min-width          : 270px;
    width              : auto;
    float              : left;
}

#wizfunargs div {
  padding-top: 2px;
}

#wizfunargs label {
  display: block;
  float: left;
  font-size: 10px;
  width: 100px;
}

#wizfunargs label.req {
  font-weight: bold;
}

#wizfunargs label:after { content: ':'; }

#wizfunargs input {
  font-size: 10px;
  border: solid thin #aaa;
}

#wizstatus {
  position: absolute;
  width: auto;
  padding-right: 4px;
  bottom: 0px; /* to be adjusted by script */
}

#wiztext {
  padding-top: 2px;
  font: 12px/1.7 Courier, monospace;
  width:  272px; /* wizselectedfun.width - 8px */
  height: 6ex;
  -moz-border-radius : 4px 4px 4px 4px;
  -webkit-border-radius : 4px 4px 4px 4px;
  border: solid thin #aab;
  background: #eef; /* read-only */
}

#wizbuttons {
  float: right;
  padding-right: 10px;
  padding-bottom: 5px;
}

#wizfunargs span.req:after { /* required argument flag */
  color: red;
  content: '*';
}

#functions h2, #funwiz h2, #columnmanagerdialog h2, #lineview h2, #hn_makewikiselect h2, #hn_makeuserdeffns h2 {
    display            : block;
    margin             : 0px;
    font               : bold 12px sans-serif;
    padding            : 4px;
    background         : #333;
    color              : #EEE;
    -moz-border-radius : 4px 4px 0px 0px;
    -webkit-border-radius : 4px 4px 0px 0px;
}

/* Styles for Line View Dialog */

#lineview tr th, #lineview tr td {
   text-align          : left;
   /*border: thin gray solid;*/
   font-size: 8pt;
}

#lineview tr td input {
  display: table-cell;
  width:   99%;
  border: thin gray solid;
  background: #ffffdf;
}

#lineviewnavigation {
  position:  relative;
  font-size: 8pt;
  text-align: center;
}

#lineviewnavigation a {
  vertical-align: -25%;
  text-decoration : none;
}

#lineviewnavigation input {
  height: 8pt;
  background: #ffffdf;
}

table.tablesorter tbody tr.highlight td {
  background: #ffcfcf;
}

/******************************************************************************
	TOP NAVIGATION STYLES
******************************************************************************/
#navigation {
    color      : #ddd;
    font-weight: bold;
    font-size  : 10px;
    float      : right;
    position   : absolute;
    top        : -2px;
    right      :5px;
    margin     : 0px;
    padding    : 0px;
}

#navigation li img {
    position:relative;
    top:3px;
}
#navigation li {
    float   : left;
    margin  : 0px 5px;
    color   : #ddd;
    display : none;
}
#navigation a {
    color           : darkorange;
    text-decoration : none;
    cursor          : pointer;
}
#languages {
    background : url(down.png) no-repeat right 1px;
    display:none;
    cursor     : pointer;
    padding    : 2px 16px 2px 2px;
    margin     : -3px 5px 0px 0px;
    border     : 1px solid transparent;
    float      : left;
}
#languages:hover {
    border : 1px solid #666;
}
#languages div {
    position   : absolute;
    background : #000;
    border     : 1px solid #666;
    top        : 18px;
    display    : none;
    z-index    : 99999999;
}
#navigation a#currentLanguage {
    text-decoration : none;
}
#lang a {
    padding         : 3px 5px;
    display         : block;
    color           : #BBB;
    text-decoration : none;
}
#lang a:hover {
    background-color : #444;
}
#languages .flag {
    margin           : 2px 3px 0px 0px;
    display          : block;
    float            : left;
    width            : 16px;
    height           : 11px;
    background-image : url(sprite.png);
}
#languages .flag.en_gb { background-position: -2px -179px; }
#languages .flag.fr    { background-position: -22px -179px; }
#languages .flag.ru    { background-position: -42px -179px; }
#languages .flag.de    { background-position: -62px -179px; }
#languages .flag.es    { background-position: -82px -179px; }
#languages .flag.it    { background-position: -122px -179px; }
#languages .flag.br    { background-position: -142px -179px; }
#languages .flag.en_us { background-position: -162px -179px; }
/******************************************************************************
	LAYOUT STYLES
******************************************************************************/
#hnheader {
    background : #000;
    height     : 32px;
}
#hnheader h1 {
    float  : left;
    height : 26px;
}

#formulabar {
    position:relative;
    height: 18px;
    line-height:18px;
}

#name {
    font-size  : 10px;
    border     : 0px;
    display    : block;
    float      : left;
    width      : 80px;
    height     : 20px;
    text-align : center;
    background : #FFFFFF;
}

#formulawrapper {
    position    : absolute;
    left        : 0px;
    right       : 0px;
    display     : block;
    top         : 0px;
    height      : 18px;
    margin-left : 59px;
    border      : 1px;
    background  : #FFF;
    max-height  : 100px;
    cursor      : text;
    overflow-y  : auto;
    overflow-x  : hidden;
    z-index     : 9999999;
    padding-left: 4px;
    outline     : none;
}

#formulawrapper.active {
    height:auto;
    border:1px solid #666;
}

#formula {
    min-height:18px;
    outline:none;
}

#functionsbtn, #wizbtn {
    font           : 11px sans-serif;
    background     : #F5F5F5;
    color          : blue;
    text-decoration: underline;
    border         : 1px solid #BBB;
    border-top     : 0px;
    border-bottom  : 0px;
    display        : block;
    line-height    : 18px;
    height         : 18px;
    width          : 50px; /* TODO */
    padding        : 0px 5px 2px 5px;
    float          : left;
    cursor         : pointer;
    outline        : none;
}

/* #functionsbtn:hover, #wizbtn:hover {  */
/*  background: #DDD; */
/*  border:     1px solid #888; */
/*  border-top: 0px; */
/*  border-bottom: 0px; */

/* } */

#corner {
 height:        19px;
 width:         25px;
 border-bottom: 1px solid #aaa;
 border-right:  1px solid #aaa;
 background:    #ddd;
}

/******************************************************************************
	    CELLS
******************************************************************************/
#spreadsheet {
    background: #FFF;
    position : relative;
}

#grid {
    position   : absolute;
    width      : 100%;
    top        : 0px;
    bottom     : 0px;
    background : #DDDDDD;
}

#tabs {
    position : absolute;
    bottom   : -3px;
    left     : 39px;
}

#pagemarker {
    color:       #ddd;
    font-weight: bold;
    font-size:   10px;
    position:    absolute;
    bottom:      2px;
    left:        3px;
}

#pagemarker div {
    position: static;
    height:   13px;
}

#pagemenu {
    background:white;
    position:relative;
    height:35px;
}

#tabs a {
    font-size:10px;
    margin          : 0px 5px;
    padding         : 0px 4px;
    text-decoration : none;
    /*font-weight     : bold;*/
    border          : 1px solid #dddddd;
    border-bottom   : 0px;
    background      : #f9f9f9;
    color           : darkorange;
    -moz-border-radius-topleft:2px;
    -moz-border-radius-topright:2px;
    -webkit-border-radius-topleft:2px;
    -webkit-border-radius-topright:2px;
    opacity:0.85;
}

#tabs a.current {
        opacity:1;
}

#test {
    position : relative;
    width    : 100%;
    height   : 100%;
    overflow : hidden;
}

#innergrid {
    position : absolute;
    top      : 20px;
    left     : 26px;
    bottom   : 15px;
    right    : 15px;
}

#scroller {
    position : relative;
    top      : 0px;
    cursor   : cell;
    height:100%;
    width:100%;
}

#up, #down {
    width    : 13px;
    height   : 13px;
    cursor   : default;
    border   : 1px solid #81756a;
    position : absolute;
    right    : -2px;
}

#right, #left {
    width    : 13px;
    height   : 13px;
    cursor   : default;
    border   : 1px solid #81756a;
    position : absolute;
    top: 0px;
}

#right { right  : 0px; background: url(sprite.png) -1px -32px; }
#left  { left   : 0px; background: url(sprite.png) -1px -47px; }
#up    { top    : 0px; background: url(sprite.png) -1px -1px; }
#down  { bottom : 0px; background: url(sprite.png) -1px -16px; }

#scrollbar-right {
    position:absolute;
    right:2px;
    top: 20px;
    bottom: 14px;
    width:13px;
}
#scrollbar-right-inner {
    height:100%;
    width:100%;
}
#right-gutter {
    border-left:  1px solid #81756a;
    border-right: 1px solid #81756a;
    position:absolute;
    top:15px;
    bottom:15px;
    background    : #cbc1b7;
    width        : 100%;
}
#right-bar {
    background    : url(sprite-y.png) 0px 0px;
    height        : 20px;
    width         : 13px;
    border-top    : 1px solid #81756a;
    border-bottom : 1px solid #81756a;
    position      : absolute;
    top           : 0px;
}

#scrollbar-bottom {
    height   : 13px;
    position : absolute;
    bottom   : 2px;
    width    : 100%;
}
#scrollbar-bottom-inner {
    margin-right : 14px;
    margin-left  : 26px;
    position     : relative;
    height       : 100%;
}
#bottom-gutter {
    border-top    : 1px solid #81756a;
    border-bottom : 1px solid #81756a;
    left   : 15px;
    right  : 15px;
    background    : #cbc1b7;
    height        : 100%;
    position:absolute;
}
#bottom-bar {
    background   : url(sprite-x.png) 0px -28px;
    height       : 13px;
    width        : 20px;
    border-left  : 1px solid #81756a;
    border-right : 1px solid #81756a;
    position     : absolute;
    left         : 0px;
}

#right:hover { background: url(sprite.png) -15px -32px; }
#up:hover    { background: url(sprite.png) -15px -1px; }
#left:hover  { background: url(sprite.png) -15px -47px; }
#down:hover  { background: url(sprite.png) -15px -16px; }
#bottom-bar:hover { background: url(sprite-x.png) 0px -30px; }
#right-bar:hover  { background: url(sprite-y.png) -28px 0px; }

#right.active { background: url(sprite.png) -29px -32px; }
#up.active    { background: url(sprite.png) -29px -1px; }
#left.active  { background: url(sprite.png) -29px -47px; }
#down.active  { background: url(sprite.png) -29px -16px; }
#bottom-bar.active { background: url(sprite-x.png) 0px -30px; }
#right-bar.active  { background: url(sprite-y.png) -28px 0px; }

#rowsout {
    position : absolute;
    top      : 20px;
    cursor   : e-resize;
    width    : 26px;
    overflow : hidden;
    bottom   : 14px;
}
#rows {
    position : absolute;
}
#columnsout {
    position:absolute;
    left:26px;
    height:20px;
    right: 15px;
    overflow:hidden;
}

#columns {
    position:absolute;
    cursor: s-resize;
    height: 20px;
}

#columns .handle {
 position: absolute;
 width:    8px;
 top:      0px;
 right:    -8px;
 height:   20px;
 z-index:  9999;
}

#rows .handle {
 position: absolute;
 width:    25px;
 bottom:   -8px;
 height:   8px;
 z-index:  9999;
}

#rows .handle:hover {
 cursor:     ns-resize;
 background: #FF9966;
}

#columns .handle:hover {
 cursor:     ew-resize;
 background: #FF9966;
}

#sheetwrapper {
    padding-left: 20px;
}
/******************************************************************************
		TOOLBAR
******************************************************************************/
#toolbar a {
    color:black;
}

#toolbar.disabled a.toolbar-item:hover, #toolbar.disabled .expand:hover {
    cursor: default;
    border:  1px solid transparent;
    background-color: transparent;
}


#toolbar {
    background: #EEE;
    background: -moz-linear-gradient(center top , #F9F9F9, #E3E3E3) repeat scroll 0 0 transparent;
    background: -webkit-gradient(linear, 0 40%, 0 70%, from(#F9F9F9), to(#E3E3E3));
    font : 11px sans-serif;
    height:        26px;
    overflow:      hidden;
    border-bottom: 1px solid #999;
    border-top:    1px solid #ddd;
}

.expand, .colormenu {
    background: url(down.png) no-repeat right 2px;
    cursor:     pointer;
    padding:    3px 16px 1px 3px;
    margin:     2px;
    height:     16px;
    border:     1px solid transparent;
    float:      left;
}

.fonts a, .site a {
 display: block;
 padding: 2px 5px;
}

.fonts a:hover, .site a:hover {
    background: -moz-linear-gradient(center top , #EEE, #BBB) repeat scroll 0 0 transparent;
    background: -webkit-linear-gradient(linear, 0 40%, 0 70% from(#EEE), to(#BBB));
}

.expandinner {
    background      : white;
    -moz-border-radius : 4px 4px 0px 0px;
    -moz-box-shadow : 2px 2px 4px #AAA;
    -webkit-border-radius : 4px 4px 0px 0px;
    -webkit-box-shadow : 2px 2px 4px #AAA;
    border          : 1px solid #999;
    position        : absolute;
    top             : auto;
    display         : none;
    padding         : 0px 0px;
    z-index         : 10000005;
}

#formats {
  font: 10px Arial,"Helvetica Neue", sans-serif;
 }

#fontsizelist h1, #fontsizelist h2, #fontsizelist h3,
#fontsizelist h4, #fontsizelist h5, #fontsizelist h6 {
    margin:0px;
 }


.expand:hover, .colormenu:hover,
.expand.active, .colormenu.active,
.toolbar-item:hover, .toolbar-item.active {
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border:           1px solid #CCC;
    background-color: transparent;
}


.separator {
 cursor:       default;
 margin:       3px;
 padding:      0px;
 height:       18px;
 float:        left;
 width:        0px !important;
 border-left:  1px solid #999;
 border-right: 1px solid #FFF;
}

#toolbar hr { background-color:#999; height:1px; border:0px; }
#formats {  width:180px;  }
#fstyle_serif { font:11px serif; }
#fstyle_monospace { font:11px monospace; }

#size_8  { font-size:8px; }
#size_11 { font-size:11px; }
#size_12 { font-size:12px; }
#size_16 { font-size:16px; }
#size_20 { font-size:20px; }

.desc { font-size: 9px; position:absolute; right:4px; }

#toolbar .icon {
 background-image: url(sprite.png);
 cursor:     pointer;
 display:    block;
 height:     16px;
 width:      16px;
}

a.toolbar-item {
 background-image: url(sprite.png);
 float:   left;
 cursor:  pointer;
 border:  1px solid transparent;
 padding: 2px;
 margin:  2px;
 display: block;
 height:  16px;
 width:   16px;
}

#toolbar a.color {
 float:       left;
 cursor:      pointer;
 border:      1px solid #AAAAAA;
 margin:      2px;
 display:     block;
 height:      10px;
 width:       10px;
}

#toolbar a.color:hover {
  border: 1px solid #666;
}

#combocolorsbg a {
    display:block;
    width:20px;
    overflow:hidden;
    text-align:center;
    border:2px solid transparent;
    margin:1px;
    padding:2px;

}
#combocolorsbg a.title {
    width:100px;
}

#combocolorsbg a:hover {
    font-weight:bold;
}

#left-head      { background-position: -2px -63px; }
#border-head    { background-position: -68px -85px; }
#bgcolor-head   { background-position: -68px -63px; }
#fontcolor-head { background-position: -46px -107px; }

#align_left   { background-position: -0px -61px; }
#align_center { background-position: -44px -61px; }
#align_right  { background-position: -0px -83px; }
#bold       { background-position: -22px -83px; }
#italic     { background-position: -44px -83px; }
#strike     { background-position: -0px -105px; }
#format     { background-position: -44px -105px; }

#border_surround { background-position: -66px -83px; }
#border_inside   { background-position: -88px -61px; }
#border_none     { background-position: -66px -105px; }
#border_all      { background-position: -88px -83px; }
#border_left     { background-position: -110px -83px; }
#border_top      { background-position: -88px -105px; }
#border_right    { background-position: -110px -105px; }
#border_bottom   { background-position: -110px -61px; }
#wordwrap      { background-position: -138px -82px; }
#insertimage  { background-position: -161px -104px; }
#insertlink  { background-position:  -138px -104px; }

#forminput  { background-position:  -205px -82px; }
#formtextarea  { background-position:  -205px -61px; }
#formfixedval  { background-position:  -228px -61px; }
#formselect  { background-position: -183px -104px; }
#formradio  { background-position:  -161px -61px; }
#formbutton  { background-position: -183px -82px; }

#inlineinput { background-position: -205px -104px; }
#inlinedropdown { background-position: -228px -103px; }
#hn_userdeffns { background-position: -228px -82px; }

/* used in the tour */
.inlineinput {
               background-position: -205px -104px;
               background-image: url(sprite.png);
               padding: 2px;
               margin:  2px;
               height:  16px;
               width:   16px;
               display: inline-block;
               }

#mergecells  { background-position:  -183px -61px; }

#selection {
 display:    none;
 position:   absolute;
 background: #CCCCFF;
 border:     2px solid black;
 opacity:    0.2;
 z-index:    99999;
 overflow:   visible;
}

#copied, #highlightpainter {
 display:  none;
 position: absolute;
 border:   2px solid orange;
 z-index:    99998 ;
 overflow: visible;
}

#highlightpainter {
 border:   2px solid green;
}

#dragfill {
 display:  none;
 position: absolute;
 border:   1px dashed #000;
 z-index:    99998 ;
 overflow: visible;
}


#dragger {
 height:     6px;
 width:      6px;
 position:   absolute;
 background: #000;
 bottom:     -5px;
 right:      -5px;
 z-index:    150000;
 cursor:     pointer;
}

#dragged {
    position: absolute;
    border:   2px dashed black;
    z-index:  100001;
    display:  none;
    opacity:  0.8;
}

#input {
    z-index  : 10000000;
    height   : 18px;
    width    : 78px;
    border   : 1px solid blue;
    position : absolute;
    overflow : hidden;
    display  : none;
    padding: 1px 0px 1px 0px;
}

#editor {
    width:100%;
    height:100%;
    padding:0px;
    margin:0px;
    background:green;
    cursor:text;
}

#hidden_input {
    position: absolute;
    top:      -10000px;
    left:     0px;
}

#paste {
    position   : absolute;
    top        : 0px;
    left       : 0px;
    background : transparent;
    width      : 1px;
    height     : 1px;
    border     : 0px;
    outline    : none;
    resize     : none;
}

#axiscontextmenucol ul, #axiscontextmenurow ul, #gridcontextmenu ul {
    margin          : 0px;
    padding         : 0px;
    list-style-type : none;
}

#gridcontextmenu .disabled a.hover {
 background: #f8f7f6;
}

#gridcontextmenu .disabled a {
 color: #AAA;
}

#axiscontextmenucol, #axiscontextmenurow, #gridcontextmenu {
 position:   absolute;
 display:    none;
 font-size:  11px;
 padding:    3px 2px;
 border:     1px outset #666;
 background: #FFF;
z-index     : 10000002;
}
#axiscontextmenucol, #axiscontextmenurow {
 width:      120px;
}

#gridcontextmenu {
 width:      160px;
}

#axiscontextmenucol li, #axiscontextmenurow li, #gridcontextmenu li {
    margin-left: 0px;
}

#axiscontextmenucol a, #axiscontextmenurow a, #gridcontextmenu a {
    display  : block;
    position : relative;
    font-size: 10px;
    color    : #000;
    padding  : 1px 3px 1px 18px;
    cursor   : pointer;
}

#axiscontextmenucol a:hover, #axiscontextmenurow a:hover, #gridcontextmenu a:hover {
 background: #ffc47e;
}

#axiscontextmenucol li.seperator, #axiscontextmenurow li.seperator, #gridcontextmenu li.seperator {
 height:     0px;
 border-top: 1px solid #CCC;
 margin:     3px 0px;
}

#axiscontextmenucol .desc, #axiscontextmenurow .desc, #gridcontextmenu .desc {
 font-size: 10px;
 position:absolute;
 color:grey;
 right:4px;
 top:4px;
}

#colselection, #rowselection {
 position:   absolute;
 background: black;
 opacity:    0.2;
 z-index:    9990;
}

#colselection {
 cursor: s-resize;
 height: 20px;
}

#rowselection {
 cursor: e-resize;
 width: 26px;
}

#rsel, #csel {
 position:absolute;
}

#overlay {
 background: transparent;
 position:   fixed;
 top:        0px;
 left:       0px;
 height:     100%;
 width:      100%;
 z-index:    99999;
 display:    none;
}
#current {
    position:   absolute;
    background: transparent;
    border:     1px solid blue;
    z-index:    100000;
}

/******************************************************************************/
/* Functions Dialog
/******************************************************************************/
#functions {
    width : 340px;
}

#funwrapper {
    margin : 10px;
    width  : 140px;
    float  : left;
}

#catlist {
    width : 140px;
}

#funlist {
    background : #EEE;
    border     : 1px solid #666;
}

#funlist li {
    margin-left:0px;
}

#funlist a {
    display : block;
    padding : 2px;
    margin  : 1px;
    cursor  : pointer;
}

#funlist a:hover {
    background : #FFF;
}

#funlist {
    overflow : auto;
}
#funlist ul {
    list-style-type : none;
    margin          : 0px;
    padding         : 0px;
}

#funwizwrapper {
    float      : left;
}

#selectedfun {
    float      : right;
    width      : 175px;
    margin-top : 15px;
    margin-right:5px;
}

#wizselectedfun {
    float      : left;
    width      : 330px; /* TODO */
    min-width  : 330px;
    margin-top : 4px;
    margin-right:4px;
}

#selectedfun p, #wizselectedfun p {
    margin : 0px 0px 10px 0px;
}

.hn_documentation {
                    color           : darkorange;
                    font-weight     : bold;
                    font-size       : 70%;
                    text-decoration : none;
                    line-height     : 14px;
                    vertical-align  : top;
                  }

.hn_wiz_emphasis {
                   font-size       : 80%;
                   font-weight     : bold;
                   color           : #200;
 }

[readonly] {
             background-color: #eee;
             width: 30px;
             }

.hn_warn {
           font-weight : bold;
           color       : red;
}
.hn_warn:before {
                  content: ' (';
}
.hn_warn:after {
                 content: ')';
}

#selectedfun h4, #wizselectedfun h4 {
    margin : 0px;
}

#ctrlpanel {
    display     : none;
    z-index     : 10000002;
    position    : absolute;
    top         : 50%;
    left        : 50%;
    height      : 400px;
    width       : 600px;
    margin-left : -300px;
    margin-top  : -201px;
	border      : 2px solid #999;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
}

#ctrltabs {
    background:#333;
    border-bottom:1px solid #666;
    margin: 0px 0px 0px 0px;
    padding:0px;
    padding-top:5px;
    height:20px;
    position:relative;
    -moz-border-radius:4px 4px 0px 0px;
    -webkit-border-radius:4px 4px 0px 0px;
}

#ctrltabs li {
    display:inline;
    line-height:20px;
    margin-left:5px;
}

#ctrltabs li a.selected {
    color:darkorange;
    font-weight: bold;
    background:#f9f9f9;
    border-bottom:2px solid #EBEAEB;
}

#ctrltabs li a {
    color:#999999;
    position:relative;
    top:-2px;
    cursor:pointer;
    background:#DDD;
    border:1px solid #666;
    border-bottom:2px solid #666;
    -moz-border-radius:5px 5px 0px 0px;
    -webkit-border-radius:5px 5px 0px 0px;
    padding:3px 10px;
    margin-left:7px;
    font-size:11px;
    font-weight:bold;
}

#ctrltabdivs h4 {
    font-weight: bold;
}

#sitetour p {
              margin: 0 0 .5em 0
}

#sitetour ul {
               margin: 0 0 .5em 0;
}

#sitetour li {
               margin-left: 0px;
}

.lineviewbutton {
    cursor:pointer;
}

#ctrlclose, #funsclose, #dialogclose, #lineviewclose, #wizclose, #hn_makewikiselectclose, #hn_makeuserdeffnsclose {
    cursor:pointer;
    color:white;
    font-weight:bold;
    font-size:14px;
    background:transparent;
    border:1px solid transparent;
    position:absolute;
    padding:0px;
    top:-3px;
    right:5px;
    z-index:99;
}

#ctrlclose:hover,#funsclose:hover, #dialogclose:hover, #lineviewclose:hover {
    color:#CCC;
}

#sitemypages {
    padding: 10px 20px 20px 20px;
}

#finder {
    font-size: 11px;
    margin:    0px auto 0px auto;
    border:    1px inset #666;
}

#ctrltabdivs td {
                  vertical-align: middle;
                  padding:     2px 5px;
                  line-height: 18px;
                  font-size:   12px;
                  }

#ctrltabdivs #hnexemplar td {
                              line-height: 10px;
                              }

#ctrltabdivs #hnexemplar td small {
                                  padding: 2px 0px 0px 2px;
                                  }

#ctrltabdivs .content {
    width:270px;
}

#ctrltabdivs .label {
    /*vertical-align: middle;*/
    text-align:     right;
    color:          #555;
    font-style:     italic;
}

#doupload, .hn-maprows, .hn-mapsheet, .hn-mapcustom, .hn-loadtemplate, .hn-webcontrol, .hn_userdef_btn {
    cursor:pointer;
}

.hn_userdef_btn {
                  position: relative;
                  left: 160px;
                  }

#users {
    width:300px;
    margin:100px auto;
}

#newpage, #templatename
{
  width: 96px;
  padding: 2px 0px 0px 0px;
}

#newviewas a:hover {
    text-decoration:underline;
}

#newviewas td {
    padding:    0px 2px 0px 2px;
    text-align: center;
}

.publicoption  {
    background: #FFF;
}

.publicoption  small {
    color: #000;
}

.defaultoption {
    border-right: 1px solid;
}

#newviewas {
    -moz-border-radius:8px 0px 0px 8px;
    -webkit-border-radius:8px 0px 0px 8px;
    right:0px;
}

#newviewas .viewlink {
    padding:4px;
    text-align:left;
}

#typepanel {
    position:absolute;
    top:36px;
    right:0px;

}
#typepanel a {
    color:blue;
    text-decoration:none;
}

#tourpager {
    width:       150px;
    text-align:  center;
    padding-top: 4px;
    float:       right;
}

.tournavigate {
     float : right;
     color : orange;
     font-weight: bold;
}

#tourwrapper, .sitedialogwrapper {
   padding: 10px 10px 0px 20px;
   height:  330px;
}

.hn_dialog_subhead {
                     size        : 120%;
                     font-weight : bold;
                     }

.hn_dialog_grayhead {
                      color       : #999;
                      size        : 120%;
                      font-weight : bold;
                     }

.hn_panel {
            -webkit-border-radius : 3px 3px 3px 3px;
            -moz-border-radius    : 3px 3px 3px 3px;
            padding               : 2px;
            margin                : 3px 0px;
            width                 : 330px;
            }

#hn_data_mapper input[type = button] {
   font   : 12px/1.7 Verdana,Tahoma,sans-serif;
}

#hn_add_val {
              margin: 52px 0px 0px 0px;
}

#hn_add_map {
              margin: 28px 0px 0px 0px;
}

#hn_data_upload_ctrls input[type = button] {
  float : right;
  font  : 12px/1.7 Verdana, Tahoma, sans-serif;
  width : 60px;
}

#hn_data_upload_ctrls {
                        float  : right;
                        margin : 0px 0px 10px 0px
                        }

.hn_panel div {
                margin: 3px 0px;
}

.hn_panel input {
                  width : 60px;
                  font  : 12px/1.7 Courier, monospace;
                  }

.hn_selected {
               background-color : #ddd;
               }

#hn_map_head {
               height : 50px;
               }

#hn_map_body {
               height   : 100px;
               overflow : auto;
               }

#hn_map_body div {
                   border-bottom: 1px solid #ddd;
                   }

#hn_map_head, #hn_map_body {
                             font                  : 9px Courier, monospace;
                             padding               : 2px;
                             width                 : 175px;
                             background-color      : #fff;
                             -webkit-border-radius : 3px 3px 3px 3px;
                             -moz-border-radius    : 3px 3px 3px 3px;
                             border                : 1px solid #ddd;
                             float                 : right;
                             }

#hn_data_mapper {
                  background-color      : #eee;
                  padding : 5px;
                  -webkit-border-radius : 3px 3px 3px 3px;
                  -moz-border-radius    : 3px 3px 3px 3px;
                  border                : 1px solid #ddd;
                  width : 375px;
                  float : left;
                  }

#hn_data_upload_ctrls input {
                              font-size : 90%;
                              width     : 105px;
                              float     : left;
                              }

.hn_panel select {
                   float     : right;
                   width     : 100px;
                   }


#hn_data_upload_ctrls select, .hn_panel select, #hn_map_select select {
                               margin           : 5px 0px 0px 0px;
                               background-color : #ffffff;
                               font-size        : 80%;
                               color            : #555555;
                              }

#hn_data_upload_ctrls select, #hn_map_select select {
                               width            : 109px;
                               }

#hn_map_select select {
                        float : left;
                        }

#hn_tourfooter {
                 padding: 0px 20px 0px 0px;
}

#hn_previewlink {
                  padding: 4px;
                  }

#doupload, #ctrldelete, #saveastemplate, #pdvisit, #newspreadsheet {
    width: 100px
}

.button, .tournavigate, .hn-maprows, .hn-mapsheet, .hn-mapcustom, .hn-loadtemplate, .hn-webcontrol, .hn_userdef_btn,  #doupload, #ctrldelete, #saveastemplate, #pdvisit, #newspreadsheet, #wizdone, #wizcanc {
    background:#EEE;
    -webkit-border-radius:3px 3px 3px 3px;
    -moz-border-radius:3px 3px 3px 3px;
    background: -webkit-gradient(linear, 0 40%, 0 70%, from(#F9F9F9),
                                 to(#E3E3E3));
    background: -moz-linear-gradient(center top , #F9F9F9,
                                     #E3E3E3) repeat scroll 0 0 transparent;
    border:1px solid #BBBBBB;
    margin:0 0px 0 0;
    outline:medium none;
    padding:3px 6px;
    text-align:center;
    white-space:nowrap;
}

.input {
    border:1px solid #BBBBBB;
    color:#000000;
    padding:4px 6px;
}

.button:hover {
    cursor:pointer;
    border:1px solid #939393 !important;
}

#signupfeedback {
    padding:5px;
}

#signupfeedback img {
    position:relative;
    top:3px;
}

#signupfeedback.error, #resetmsg.error {
    color:red;
}

#signupform {
    padding-left:15px;
}

#borders {
    display:none;
}

#powered {
    text-align:center;
    width:110px;
    padding: 2px;
    float:left;
}
#powered a {
    text-decoration:none;
    text-align:center;
}

.hyper {
    color:black;
    font:13px georgia,garamond,serif;
    text-decoration:none;
}

.numbers {
    color:darkorange;
    font:12px sans-serif;
    font-weight:bold;
    text-decoration:underline;
}

.hn_settings_feedback {
    height:50px;
}

#hn_pwd_feedback .error {
    color:white;
    font-weight:bold;
    padding:5px;
    background:red;
}

#hn_pwd_feedback .success {
    color:white;
    font-weight:bold;
    padding:5px;
    background:green;
}

.beta {display:none;}

.sans-serif { font-family: sans-serif; }
.serif      { font-family: serif; }
.monospace  { font-family: monospace; }
.arial      { font-family: Helvetica, Arial, serif; }
.georgia    { font-family: georgia, serif; }
.garamond   { font-family: garamond, serif; }
.trebuchet  { font-family: trebuchet ms, sans-serif; }
.tahoma     { font-family: tahoma, sans-serif; }

.innercolor {
    position : relative;
    padding  : 5px 0px 0px 7px;
    width    : 230px;
    height   : 145px;
}

#tour {
   padding: 20px;
}

#tour p {
    color:#666;
    margin-bottom:5px;
}

#combo_colourbg .button {
                          font-size: 98%;
                          width:     162px;
}

#bgcolor, #forecolor {
                       width        : 65px;
                       padding      : 3px;
                       margin       : 4px;
                       border       : 1px solid #999;
                       font         : monospace;
}

#insertimageinput, #insertlinkinput {
    width:200px;
}

#funname {
    line-height:100%;
}

#subtext {
    position:absolute;
    bottom:0px;
    font-size:90%;
    color:#999;
    line-height:120%;
}
#subtext a {
    color:blue;
    text-decoration:underline;
}