/* COLOR VARIABLES */
/* orange */
/* blue */
/* other */
/* FUNCTIONAL COLOR ASSIGNMENTS */
/* SIZES & CALCULATIONS */
/* SHADOWS */
/* ROTATIONS */
/*---------------------------------------------------
    LESS Elements 0.9
  ---------------------------------------------------
    A set of useful LESS mixins. More info at: http://lesselements.com
  ---------------------------------------------------*/
/*already got this one 
---------------------------------
.box-shadow(@arguments) {
  -webkit-box-shadow: @arguments;
  -moz-box-shadow: @arguments;
  box-shadow: @arguments;
}
*/
/* NEW Buttons */
/* COLORS VARIETIES OF THE BUTTONS */
.blue {
  background: #168bfe;
}
.orange {
  background: #ff7c00;
}
.good {
  background: #01b709;
}
.bad {
  background: #f10000;
}
.grey {
  background: #b4b4b4;
}
.facebook {
  background: #56679f;
}
/* BUTTON BASICS */
a.momi-button,
button.momi-button,
input.momi-button {
  font-family: Arial, Helvetica, sans-serif;
  display: inline-block;
  white-space: nowrap;
  font-size: 13px;
  line-height: 20px;
  border: 1px solid rgba(0, 0, 0, 0.3);
  padding: 0 0.8em;
  text-decoration: none !important;
  color: #fff !important;
  /* radius for button */
  -moz-border-radius: 0.2em;
  -webkit-border-radius: 0.2em;
  border-radius: 0.2em;
  /* opacity for gradient button */
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.2)));
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.3);
  /* opacity for box-shadow */
  -moz-box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.7), inset 0px 1px 0px rgba(255, 255, 255, 0.7);
  -webkit-box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.7), inset 0px 1px 0px rgba(255, 255, 255, 0.7);
  box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.7), inset 0px 1px 0px rgba(255, 255, 255, 0.7);
  /* BIGGER BUTTONS */
  /* HEXADECIMAL ENTITIES FOR THE ICONS */
  /*or 2718*/
  /*or 279C*/
  /*or 279C with rotate*/
  /*or 272A*/
  /* EXTRA */
  /* AFTER */
}
a.momi-button:hover,
button.momi-button:hover,
input.momi-button:hover,
a.momi-button:active,
button.momi-button:active,
input.momi-button:active,
a.momi-button:focus,
button.momi-button:focus,
input.momi-button:focus {
  /* opacity for gradient button */
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.3)));
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
  background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
  background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
}
a.momi-button:before,
button.momi-button:before,
input.momi-button:before {
  background: #fff;
  background: rgba(255, 255, 255, 0.2);
  pointer-events: none;
  float: left;
  width: 0.9em;
  text-align: center;
  font-size: 1.3em;
  margin: 0 0.6em 0 -0.6em;
  padding: 0 .2em;
  /* opacity for box-shadow */
  -moz-box-shadow: 1px 0 0 rgba(0, 0, 0, 0.5), 2px 0 0 rgba(255, 255, 255, 0.5);
  -webkit-box-shadow: 1px 0 0 rgba(0, 0, 0, 0.5), 2px 0 0 rgba(255, 255, 255, 0.5);
  box-shadow: 1px 0 0 rgba(0, 0, 0, 0.5), 2px 0 0 rgba(255, 255, 255, 0.5);
  -moz-border-radius: 0.2em 0 0 0.2em;
  -webkit-border-radius: 0.2em 0 0 0.2em;
  border-radius: 0.2em 0 0 0.2em;
}
a.momi-button:after,
button.momi-button:after,
input.momi-button:after {
  background: none;
  float: none;
  font-size: 0.9em;
  margin: 0 -4px 0 5px;
  padding: 0;
  text-align: center;
  width: 0.5em;
}
a.momi-button.search,
button.momi-button.search,
input.momi-button.search {
  padding: 0.15em 0.8em;
  line-height: 1.8em;
  font-weight: bold;
  /* radius for button */
  -moz-border-radius: 0.5em;
  -webkit-border-radius: 0.5em;
  border-radius: 0.5em;
}
a.momi-button.medium,
button.momi-button.medium,
input.momi-button.medium {
  line-height: 1.6em;
  font-weight: bold;
  font-size: 1.1em;
  -moz-border-radius: 0.3em;
  -webkit-border-radius: 0.3em;
  border-radius: 0.3em;
}
a.momi-button.medium.goto,
button.momi-button.medium.goto,
input.momi-button.medium.goto {
  line-height: 1.8em;
}
a.momi-button.medium.goto:before,
button.momi-button.medium.goto:before,
input.momi-button.medium.goto:before {
  padding: 0 0.2em;
}
a.momi-button.large,
button.momi-button.large,
input.momi-button.large {
  line-height: 1.6em;
  font-weight: bold;
  font-size: 1.2em;
  -moz-border-radius: 0.3em;
  -webkit-border-radius: 0.3em;
  border-radius: 0.3em;
}
a.momi-button.large.goto:before,
button.momi-button.large.goto:before,
input.momi-button.large.goto:before {
  padding: 0 0.2em;
}
a.momi-button.extra-large,
button.momi-button.extra-large,
input.momi-button.extra-large {
  padding: 0.6em;
  font-weight: bold;
  font-size: 1.8em;
  -moz-border-radius: 0.3em;
  -webkit-border-radius: 0.3em;
  border-radius: 0.3em;
}
a.momi-button.xxl,
button.momi-button.xxl,
input.momi-button.xxl {
  padding: 0.8em;
  font-weight: bold;
  font-size: 2.0em;
  -moz-border-radius: 0.3em;
  -webkit-border-radius: 0.3em;
  border-radius: 0.3em;
}
a.momi-button.add:before,
button.momi-button.add:before,
input.momi-button.add:before {
  content: "\271A";
}
a.momi-button.edit:before,
button.momi-button.edit:before,
input.momi-button.edit:before {
  content: "\270E";
}
a.momi-button.delete:before,
button.momi-button.delete:before,
input.momi-button.delete:before {
  content: "\2716";
}
a.momi-button.save:before,
button.momi-button.save:before,
input.momi-button.save:before {
  content: "\2714";
}
a.momi-button.email:before,
button.momi-button.email:before,
input.momi-button.email:before {
  content: "\2709";
}
a.momi-button.unread:before,
button.momi-button.unread:before,
input.momi-button.unread:before {
  color: rgba(255, 255, 255, 0.2);
  text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.25);
}
a.momi-button.like:before,
button.momi-button.like:before,
input.momi-button.like:before {
  content: "\2764";
}
a.momi-button.next:before,
button.momi-button.next:before,
input.momi-button.next:before {
  content: "\00BB";
}
a.momi-button.previous:before,
button.momi-button.previous:before,
input.momi-button.previous:before {
  content: "\00AB";
}
a.momi-button.star:before,
button.momi-button.star:before,
input.momi-button.star:before {
  content: "\2605";
}
a.momi-button.spark:before,
button.momi-button.spark:before,
input.momi-button.spark:before {
  content: "\2737";
}
a.momi-button.goto:before,
button.momi-button.goto:before,
input.momi-button.goto:before {
  content: "\25B6";
}
a.momi-button.up:before,
button.momi-button.up:before,
input.momi-button.up:before {
  content: "\25B2";
}
a.momi-button.down:before,
button.momi-button.down:before,
input.momi-button.down:before {
  content: "\25BC";
}
a.momi-button.help:before,
button.momi-button.help:before,
input.momi-button.help:before {
  content: "\FFFD";
}
a.momi-button.facebook:before,
button.momi-button.facebook:before,
input.momi-button.facebook:before {
  content: url(/images/fb_icon_transp.png);
  padding: 0.1em 0.2em;
}
a.momi-button.after-up:after,
button.momi-button.after-up:after,
input.momi-button.after-up:after {
  content: "\25B2";
}
a.momi-button.after-down:after,
button.momi-button.after-down:after,
input.momi-button.after-down:after {
  content: "\25BC";
}
/* BUTTONS AND INPUTS */
button.momi-button,
input.momi-button {
  cursor: pointer;
  overflow: visible;
  /* removes extra side spacing in IE */
}
/* removes extra inner spacing in Firefox */
button::-moz-focus-inner {
  border: 0;
  padding: 0;
}
/* If line-height can't be modified, then fix Firefox spacing with padding */
input::-moz-focus-inner {
  padding: .4em;
}
/*  OLD BUTTONS
    This can probably removed when we are sure that all old buttons are gone */
.button {
  font-family: arial, helvetica, sans-serif;
  margin: 0px;
  padding: 0px;
  border: 0;
  white-space: nowrap;
  background: none;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
  width: auto;
  overflow: visible;
  vertical-align: top;
  text-shadow: none;
}
.button:hover {
  text-decoration: none;
}
/* Mozilla padding fix */
.button::-moz-focus-inner {
  margin: 0px;
  padding: 0px;
}
.button .left,
.button .right,
.button .middle {
  bottom: 1px;
}
.button .left,
.button .right {
  position: relative;
  vertical-align: top;
  display: inline-block;
  font-size: 0;
}
.button .middle {
  padding: 0 5px;
  display: inline-block;
  position: relative;
  background-repeat: repeat-x;
}
.button .middle:hover {
  text-decoration: none;
}
/* Standard blue style */
.button.standard_blue {
  font-size: 12px;
  height: 26px;
}
.button.standard_blue .left,
.button.standard_blue .right {
  width: 5px;
  height: 26px;
}
.button.standard_blue .left {
  background-image: url(/images/standard_blue_left.png);
}
.button.standard_blue .right {
  background-image: url(/images/standard_blue_right.png);
}
.button.standard_blue .middle {
  height: 26px;
  line-height: 26px;
  background-image: url(/images/standard_blue_middle.png);
  color: #fff;
}
/* Standard disabled button */
.button.standard_disabled .left {
  display: inline-block;
  background-image: url(/images/standard_disabled_left.png);
}
.button.standard_disabled .right {
  display: inline-block;
  background-image: url(/images/standard_disabled_right.png);
}
.button.standard_disabled .middle {
  height: 26px;
  line-height: 26px;
  background-image: url(/images/standard_disabled_middle.png);
  color: #ccc;
}
.button.standard_disabled {
  font-size: 12px;
  height: 26px;
  cursor: default;
}
.button.standard_disabled .left,
.button.standard_disabled .right {
  width: 5px;
  height: 26px;
}
/* Standard blue arrow style */
.button.standard_blue_arrow {
  font-size: 12px;
  height: 26px;
}
.button.standard_blue_arrow .left {
  width: 32px;
  height: 26px;
  background-image: url(/images/standard_blue_arrow_left.png);
}
.button.standard_blue_arrow .right {
  width: 20px;
  height: 26px;
  background-image: url(/images/standard_blue_arrow_right.png);
}
.button.standard_blue_arrow .middle {
  padding-left: 0px;
  height: 26px;
  line-height: 26px;
  background-image: url(/images/standard_blue_arrow_middle.png);
  color: #fff;
}
/* Standard orange style */
.button.standard_orange {
  font-size: 11px;
  height: 26px;
}
.button.standard_orange .left,
.button.standard_orange .right {
  width: 5px;
  height: 26px;
}
.button.standard_orange .left {
  background-image: url(/images/standard_orange_left.png);
}
.button.standard_orange .right {
  background-image: url(/images/standard_orange_right.png);
}
.button.standard_orange .middle {
  height: 26px;
  line-height: 26px;
  background-image: url(/images/standard_orange_middle.png);
}
/* small_orange_arrow */
.button.small_orange_arrow {
  font-size: 12px;
  height: 21px;
  line-height: 21px;
}
.button.small_orange_arrow .left {
  width: 19px;
  height: 21px;
  background-image: url(/images/small_orange_arrow_left.png);
}
.button.small_orange_arrow .right {
  width: 5px;
  height: 21px;
  background-image: url(/images/small_orange_arrow_right.png);
}
.button.small_orange_arrow .middle {
  padding-left: 0px;
  height: 21px;
  line-height: 21px;
  background-image: url(/images/small_orange_arrow_middle.png);
}
/* List type */
.button.list_button {
  font-size: 10px;
  height: 22px;
  line-height: 22px;
}
.button.list_button .left {
  width: 24px;
  height: 22px;
  background-image: url(/images/list_button_left.png);
}
.button.list_button .right {
  width: 3px;
  height: 22px;
  background-image: url(/images/list_button_right.png);
}
.button.list_button .middle {
  padding-left: 5px;
  height: 22px;
  line-height: 22px;
  background-image: url(/images/list_button_middle.png);
}
/* Fold type */
.button.fold_button_down,
.button.fold_button_up {
  font-size: 10px;
  height: 22px;
  line-height: 22px;
}
.button.fold_button_down .left,
.button.fold_button_up .left {
  width: 24px;
  height: 22px;
  background-image: url(/images/small_blue_fold_down_left.png);
}
.button.fold_button_up .left {
  background-image: url(/images/small_blue_fold_up_left.png);
}
.button.fold_button_down .right,
.button.fold_button_up .right {
  width: 3px;
  height: 22px;
  background-image: url(/images/list_button_right.png);
}
.button.fold_button_down .middle,
.button.fold_button_up .middle {
  padding-left: 5px;
  height: 22px;
  line-height: 22px;
  background-image: url(/images/list_button_middle.png);
}
/* Standard blue style */
.button.big_blue {
  font-size: 12px !important;
  font-weight: bold;
  height: 31px;
}
.button.big_blue .left,
.button.big_blue .right {
  width: 6px;
  height: 31px;
}
.button.big_blue .left {
  background-image: url(/images/buttons/big_blue_left.png);
}
.button.big_blue .right {
  background-image: url(/images/buttons/big_blue_right.png);
}
.button.big_blue .middle {
  height: 31px;
  line-height: 31px;
  background-image: url(/images/buttons/big_blue_middle.png);
  color: #fff;
}
/* Buttons */
.button {
  line-height: 26px;
  cursor: pointer;
  color: #ffffff !important;
  text-align: center;
  background-color: transparent;
  border: 0 none;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px !important;
  vertical-align: top;
}
.button.s88x26 {
  width: 88px;
  height: 26px;
  background-image: url("/images/design/button_88x26.png");
}
.button.s128x26 {
  width: 128px;
  height: 26px;
  background-image: url("/images/design/button_128x26.png");
}
.button.s168x26 {
  width: 168px;
  height: 26px;
  background-image: url("/images/design/button_168x26.png");
}
/* MM Button */
#button_inner {
  vertical-align: middle;
  display: table-cell;
  height: 20px;
}
#button_start {
  height: 30px;
  padding-left: 10px;
  padding-bottom: 4px;
  border: none;
  background: url("/images/submit_button_left.gif");
  background-repeat: no-repeat;
  background-position: left;
  float: left;
  color: #ffffff;
  cursor: pointer;
  overflow: visible;
}
#button_end {
  height: 30px;
  width: 9px;
  background: url("/images/submit_button_right.gif");
  background-repeat: no-repeat;
  background-position: right;
  float: left;
}
