/**
  CSS rules for transliteration suggestion dropdowns, Hindi editor console and
  onscreen virtual keyboard.
 */

#t_button {
  cursor: pointer;
  cursor: hand;
  background-color: #f2f9ff;
  border: 1px solid;
  border-color: #BCCEDA #254480 #254480 #BCCEDA;
  margin-top: 4px;
  margin-bottom:2px;
}

#t_button.bdep, #t_button.bhvr .bdep {
  background-color: #e4edfd;
  border: 1px solid;
  border-color: #254480 #c5d4F0 #c5d4F0 #254480;
}

#t_button.bhvr {
  background-color: #d2d9ff;
}

.goog-transliterate-indic-suggestion-menu {
  position: absolute;
  border: 1px solid;
  background-color: #c3d9ff;
  border-color: #FFFFFF #999999 #999999 #FFFFFF;
  border-style: solid;
  border-width: 1px;
  cursor: default;
  font: Arial,Helvetica,sans-serif;
  margin: 0px;
  padding: 0px;
  outline: none;
}

.goog-transliterate-indic-suggestion-menuitem {
  padding: 2px 1em;
  margin: 0px;
  list-style: none;
}

.goog-transliterate-indic-suggestion-menuitem-highlight {
  background-color: #8ca6cd;
  border-color: #70a0b0;
}

.goog-transliterate-indic-suggestion-menuitem-disabled {
  color: #999;
}

.goog-transliterate-indic-overlay {
  position : absolute;
  z-index : -1000;
  overflow : auto;
  text-align : left;
}

.tr_help_class {
  position: relative;
  top: 1px;
  cursor: pointer;
  cursor: hand;
}

td.tcell {
  background: #E6F0F7;
  border: 1px solid;
  border-color: #BCCEDA #254480 #254480 #BCCEDA;
  font-size: 1em;
  line-height: normal;
  text-align: center;
}

td.tcell.chvr {
  background-color: #ACBCDC;
}

td.tcell.cclk {
  background-color: #9bbaf9;
  border: 1px inset #f5ede3;
}

td.tcell.alt {
  background-color: #b4cdca;
  border-color: #73a29d #552211 #552211 #73a29d;
}

td.tcell.alt.chvr {
  background-color: #8ab0ac;
}

td.tcell.alt.cclk {
  background-color: #BBCCBB;
  border: 1px inset;
  border-color: #F5EDE3;
}

table.ctabl {
  cursor: pointer;
  cursor: hand;
  width: 85%;
}

div#kbdiv {
  position: absolute;
  bottom:2px;
  right:2px;
  width: auto;
  cursor: pointer;
  cursor: hand;
  z-index:10000;
}

td.kbcell {
  background: #E6F0F7;
  border: 1px solid;
  border-color: #BCCEDA #254480 #254480 #BCCEDA;
  padding:2px;
  line-height:1em;
  width:1.5em;
  font-size:125%;
}

td.kbcell.chvr {
  background-color: #ACBCDC;
}
td.kbcell.cclk {
  background-color: #9bbaf9;
  border: 1px inset #f5ede3;
  color: white;
}

div#kbbar {
  text-align: right;
  cursor: move;
  left: 0;
  right: 0;
  background-color:#ccdcfc;
  height: 1.7em;
  color: #fff;
  padding:2px;
}

span#kbhide {
  cursor: pointer;
  text-decoration:underline;
  padding:1px;
  font-weight:bold;
  font-size:100%;
  float:right;
}

span#kbminimize {
  cursor: pointer;
  cursor: hand;
  text-decoration:underline;
  padding:1px;
  font-weight:bold;
  font-size:100%;
}

div#keyboard {
  border: 1px solid #a48863;
  background-color: #e8d4c0;
  z-index: 100000;
}

table#kbtable {
  background-color:#ccdcfc;
  color: black;
  width: auto;
}

table.staticTransTable {
  width: auto;
  background-color: transparent;
  font-size: 1em;
}

table.staticTransTable td {
  padding: 0px;
  line-height: normal;
  text-align: left;
}

textarea#hindiText {
  border: 1px solid;
  border-color: #B1A290 #F2E5D1 #F2E5D1 #B1A290;
  font-family: sans-serif;
  background-color: #F5F8FE;
  color: black;
  padding: 0px;
  line-height: normal;
  overflow:hidden;
  width : auto;
  height:auto;
}
input#hindiText {
  border: 1px solid;
  border-color: #B1A290 #F2E5D1 #F2E5D1 #B1A290;
  font-family: sans-serif;
  background-color: #F5F8FE;
  color: black;
  padding: 0px;
  line-height: 2em;
  overflow:hidden;
  width : auto;
  height: 2em;
}

td.labeltd {
  background-color:#FCF5F3;
  display:none;
}

img#kbshow {
  cursor: pointer;
  cursor: hand;
  border: 0px solid #fff8f6;
}

img#kbhelp {
  cursor: pointer;
  cursor: hand;
  border: 0px solid #fff8f6;
  position: relative;
  top: -4px;
}

table#tabinput {
  width:auto;
  padding:0px;
  background-color:#ccdcfc;
  border:1px solid;
  border-color: #BCCEDA #254480 #254480 #BCCEDA;
}

.tgray {
  color:#777777;
  text-decoration:none;
  border: 0px solid #777777;
}

.grayed {
  text-decoration:none;
  border: 0px solid #999999;
  color: #999999;
}

#tooltip{
/* @here */
  background-image:url(tooltip.gif);
}

#kbshow.pressed {
  background-color: #acbcdc;
  border: 1px inset #f5ede3;
}

#fontTipMessage {
  padding:2px 0px 2px 8px;
  background: #ededeb;
  min-width:700px;
  border:0px solid #ccc;
  border-left:1px solid #eee;
  width:710px;
}

.transliteration_error {
  background-color:#FFFFCC;
  width:675px;
  margin-left:auto;
  margin-right:auto;
  padding:3px;
  border:1px solid #FFDB00;
}

.transliteration_single_error {
  display: block;
}

#tr_d {
  width: 100%;
  height: 25em;
  background-color: white;
  border:1px solid black;
}

#tr_d.hide {
  display: none;
}

#tr_d .block {
  width: 100%;
  height:1.4em;
  vertical-align:middle;
  border-width:0 0 1px 0;
  border-style:solid;
  border-color:lightgray;
}
body {
  margin-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
}

.logo{
  margin-left:auto;
  margin-right:auto;
  width:336px;
}


.bluebase{
  background-color:#C3D9FF;
  width:681px;
  margin-left:auto;
  margin-right:auto;
  border: 1px solid #9BB7FF;
}

.supported_languages {
  margin-left:auto;
  margin-right:auto;
  text-align:center;
  width:681px;
}

.transliterate_text_ff_class{
  width:675px;
  height:250px;
  font-family:sans-serif;
  font-size:14px;
  border:1px solid gray;
}

.transliterate_text_ie_class{
  width:672px;
  height:250px;
  font-family:sans-serif;
  font-size:14px;
  border:1px solid gray;
}
.print_button {
  cursor: pointer;
  cursor: hand;
  border: 0px solid #fff8f6;
}

.tips_container_class {
  width:681px;
  height:25px;
  margin-left:auto;
  margin-right:auto;
  background-image:url(/transliterate/indic/img/tipbg.gif);
  overflow:hidden;
}

.tips_text_class {
  height:23px;
  width:600px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.tips_img_container_class {
  padding-top:2px;
}

.tips_img_class {
  cursor: pointer;
  cursor: hand;
}

#tipdiv{
  padding-top:5px;
}

.def {
  border : 1px solid #c3d8ff;
  width: 18px;
  height: 18px;
  background-color: #c3d8ff;
  background-repeat: no-repeat;
}

.down {
  border-bottom:1px solid #eee;
  border-right:1px solid #eee;
  border-top:1px solid #bbb;
  border-left:1px solid #bbb;
  background-color:#efefef;
  background-repeat: no-repeat;
}

.hvr {
  border-bottom:1px solid #bbb;
  border-right:1px solid #bbb;
  border-top:1px solid #eee;
  border-left:1px solid #eee;
  background-color: #c3d8ff;
  background-repeat: no-repeat;
}

/* Language menu styles */
.goog-menu {
  position: absolute;
  border: 1px solid;
  background-color: #c3d9ff;
  border-color: #FFFFFF #999999 #999999 #FFFFFF;
  border-style: solid;
  border-width: 1px;
  cursor: default;
  font: Arial,Helvetica,sans-serif;
  margin: 0px;
  padding: 0px;
  outline: none;
}

.goog-menuitem {
  position: relative;
  padding: 2px 1em;
  margin: 0px;
  list-style: none;
}

.goog-menuitem-highlight {
  background-color: #8ca6cd;
  border-color: #70a0b0;
}

.goog-menuitem-disabled {
  color: #999;
}

.goog-option {
  /* Selectable options should leave some room for the check mark. */
  padding-left: 15px !important;
}

.goog-option-selected {
  background-image: url(/transliterate/indic/img/check.gif);
  background-position: 4px 50%;
  background-repeat: no-repeat;
}

/* Gecko hack; Pre-FF3 Gecko uses -moz-inline-box instead of inline-block. */
html>body .goog-inline-block {
  display: -moz-inline-box; /* This is ignored by FF3 and later*/
  display: inline-block; /* This is ignored by pre-FF3 Gecko */
}

/* Default rule; only Safari, Webkit, and Opera handle it without hacks. */
.goog-inline-block {
  position: relative;
  display: inline-block;
}

/* Pre-IE7 IE hack.  On IE, "display: inline-block" only gives the element */
/* layout, but doesn't give it inline behavior.  Subsequently setting display */
/* to inline does the trick. */
* html .goog-inline-block {
  display: inline;
}

/* IE7-only hack.  On IE, "display: inline-block" only gives the element */
/* layout, but doesn't give it inline behavior.  Subsequently setting display */
/* to inline does the trick. */
*:first-child+html .goog-inline-block {
  display: inline;
}
