
/* Base Elements */
.container {
    width: 95%;
    margin: 0 auto;
}

html, body {
    height: 99.4%;
}

h1, h2, h3, h4, h5, h6 {
    color: inherit;
    font-weight: bold;
}

h2 {
    color: #420611;
    margin-bottom: 15px;
}

p {
    margin-bottom: 0;
}

ul {
    padding-left: 0;
    margin: 0;
}

/* Utility Classes */
.center { text-align: center; }
.bold { font-weight: bold; }
.black { color: black; }

.quote {
    background: #DDDDDD;
    padding: 0.1em 0.8em;
}

.pointer {
    cursor: pointer;
}

/* Page Layout */
#page {
    position: relative;
    min-height: 100%;
    background: #eeeeee; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #eeeeee 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #eeeeee)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffffff 0%, #eeeeee 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffffff 0%, #eeeeee 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ffffff 0%, #eeeeee 100%); /* IE10+ */
    background: linear-gradient(top, #ffffff 0%, #eeeeee 100%); /* W3C */
    color: #555555;
}

#page.noBackground {
    background: none;
}

#content {
    padding-bottom: 50px;
}

#page.withSitemap #content {
    padding-bottom: 240px;
}

/* Forms */
div.form {
    text-align: left;
}

div.form form {
    padding: 0.4em 0;
    background: rgba(154, 154, 154, 0.8);
    border-radius: 1em;
    box-shadow: 0px 0px 5px 3px rgba(192, 192, 192, 1);
    font-size: 15px;
    color: white;
}

form div.row {
    margin: 0.3em 1em;
}

form label {
    display: block;
}

form label:after {
    content: " :";
}

form input[type="text"],
form input[type="password"],
form select {
    font-size: 1em;
    max-width: 100%;
}

form input[type="text"],
form input[type="password"] {
    width: 100%;
    border: black solid 1px;
}

form div.error input[type="text"],
form div.error input[type="password"],
form input[type="text"].error,
form input[type="password"].error {
    border: #bb0000 solid 1px;
}

form div.button {
    margin: 1em;
    text-align: right;
}

form div.button input {
    display: inline-block;
    font-weight: normal;
    color: #777777;
}

form div.hint,
form div.links {
    text-align: center;
    font-size: 0.7em;
}

form div.hint {
    margin: -0.2em 0 0.6em;
}

form div.links {
    clear: both;
    margin: 1.0em 0;
    padding: 0.2em 0;
    width: 100%;
    background-color: rgb(226, 226, 226);
    color: #333333;
}

form div.links a {
    margin: 0 0.4em;
}

.links a {
    color: #777777;
    text-decoration: none;
}

.links a:hover {
    text-decoration: underline;
}

/* Footer */
#footer {
    width: 100%;
    text-align: center;
    margin-top: auto;
}

#footer > ul {
    display: inline-block;
    border-top: #bb0000 solid 1px;
    text-align: left;
    font-size: 0.9em;
}

#footer > ul > li {
    float: left;
    margin: 18px 25px;
}

#footer ul ul > li {
    margin: 12px 0;
}

#footer li {
    list-style: none;
}

#footer > ul > li > a {
    font-weight: bold;
}

#footer p {
    font-size: 0.8em;
}

/* Main Menu */
#mainMenuWrapper {
    position: relative;
    height: 26px;
}

#mainMenuWrapper div {
    height: 22px;
    line-height: 22px;
    border-radius: 5px 5px 0px 0px;
}

#mainMenuRed {
    background-color: #bb0000;
}

#mainMenu {
    position: absolute;
    top: 4px;
    width: 100%;
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #dddddd)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ffffff 0%, #dddddd 100%); /* IE10+ */
    background: linear-gradient(top, #ffffff 0%, #dddddd 100%); /* W3C */
    box-shadow: 0px 4px 5px -5px rgba(0, 0, 0, 1);
}

#mainMenu > ul {
    margin: 0 15px;
    padding: 0;
    font-size: 12px;
    font-weight: bold;
}

#mainMenu > ul > li {
    display: block;
    float: left;
    height: 100%;
    border-right: white solid 1px;
    border-left: #dddddd solid 1px;
}

#mainMenu > ul > li:first-child {
    border-left: none;
}

#mainMenu > ul > li.right {
    border-right: none;
}

#mainMenu > ul > li.right ~ li.right {
    border-right: white solid 1px;
}

#mainMenu > ul > li.right {
    background-position: left;
}

#mainMenu > ul > li.tiny > a {
    margin: 0 10px;
}

#mainMenu ul ul {
    display: none;
    position: absolute;
    z-index: 1000;
    padding: 0;
    background-color: white;
    font-size: 11px;
    font-weight: normal;
    text-decoration: none;
    list-style-type: none;
    border-radius: 5px;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 1);
}

#mainMenu a,
#mainMenu span {
    margin: 0 25px;
}

li a,
li span {
    color: #555555;
    text-decoration: none;
}

li a:hover,
li.active > a {
    color: #bb0000;
}

#mainMenu span:after {
    content: url("../../majordome/images/downArrow.png");
    margin-left: 5px;
}

#mainMenu span:hover {
    cursor: pointer;
}

#mainMenu ul li:hover ul {
    display: inherit;
}

/* Menu */
#menu {
    margin: 0 8px;
    min-width: 950px;
    text-align: center;
}

div.home #menu {
    margin: 8px;
}

#menu #mainMenuWrapper {
    height: 36px;
}

#menu #mainMenuWrapper div {
    height: 32px;
    line-height: 32px;
}

#menu #mainMenu > ul {
    display: inline-block;
}

#menu #mainMenu > ul > li:last-of-type {
    border-right: none;
}

/* Connection */
#connection {
    float: right;
    position: relative;
    text-align: right;
    margin: 20px;
    font-size: 15px;
}

div.home #connection {
    float: none;
}

#connection > a {
    color: inherit;
    text-decoration: none;
}

#connection > a:hover {
    text-decoration: underline;
}

#connection > a img {
    vertical-align: bottom;
}

#connection #loginForm {
    display: none;
    position: absolute;
    right: 0;
    top: 30px;
    z-index: 1000;
}

#connection #loginForm form input[type="text"],
#connection #loginForm form input[type="password"] {
    width: 208px;
}

/* Signin */
div.signin {
    margin: 20px auto;
    width: 800px;
    text-align: center;
}

#content.signin {
    border-top: #bb0000 solid 2px;
    padding-bottom: 0;
}

div.signin.noBorder {
    margin: 0 auto 30px;
    border-top: none;
}

div.signin h1.breadcrumbs {
    margin: 30px 0 0;
    font-size: 20px;
}

div.signin h1.breadcrumbs span {
    color: #bbbbbb;
    font-weight: normal;
}

div.signin h1.breadcrumbs span.active {
    color: inherit;
    font-weight: inherit;
}

div.signin p.message {
    margin: 20px auto 0;
    width: 300px;
    font-size: 15px;
}

div.signin div.message {
    margin: 20px auto 0;
    width: 400px;
    font-size: 15px;
}

div.signin div.message p {
    margin: 20px 0;
    text-align: left;
}

div.signin div.form {
    display: inline-block;
    margin-top: 20px;
}

#signinForm form > div.row:nth-of-type(6),
#signinForm form > div.row:nth-of-type(10) {
    margin-top: 2em;
}

#signinForm form > div.row:nth-of-type(18) > div.errorMessage {
    width: 100%;
    text-align: center;
}

#signinForm form div.links {
    background-color: white;
}

#signinForm form div.links div {
    margin-left: 35px;
    margin-right: 100px;
    text-align: left;
}

#signinForm form div.links div input,
#signinForm form div.links div a {
    margin: 0;
    padding: 0;
}

#signinForm div.terms label {
    display: inline;
}

#signinForm div.terms label:after {
    content: none;
}

#signinForm form div.links + div.row div.errorMessage {
    width: 100%;
    text-align: center;
}

/* Logo */
#logo {
    position: relative;
    margin: 10px 0;
    min-width: 950px;
}

#logo > a {
    position: relative;
    display: inline-block;
    margin-left: 20px;
}

#logo .right {
    float: right;
    text-align: right;
}

div.home #logo img {
    margin-right: 100px;
}

div.home #logo {
    margin-top: 147px;
    text-align: center;
}

/* Try */
#try {
    float: right;
    margin: 20px;
}

div.home #try {
    float: none;
    margin: 30px auto 180px;
    text-align: center;
}

div.home #slogan {
    text-align: center;
    margin: 0 300px 0 300px;
    font-size: 1.3em;
    color: gray;
}

div.home #follow {
    text-align: center;
    margin-bottom: 22px;
}

div.home #follow a {
    padding: 4px 10px 8px 25px;
    text-decoration: none;
}

/* Month Menu */
#monthMenuWrapper {
    margin-top: 15px;
}

#monthMenuWrapper .arrowWrapper {
    height: 43px;
}

#monthMenuWrapper .arrowWrapper img {
    cursor: pointer;
}

#monthMenuWrapper .arrowWrapper.left img {
    margin: 2px 10px 6px 0;
}

#monthMenuWrapper .arrowWrapper.right img {
    margin: 2px 0 6px 10px;
}

#monthMenuWrapper .arrowWrapper div {
    width: 100%;
    height: 14px;
    background-color: #bbbbbb;
}

#monthMenu {
    position: relative;
    overflow-x: hidden;
    white-space: nowrap;
    font-size: 0px;
    font-weight: bold;
}

#monthMenu ul {
    margin: 0;
    padding: 0;
}

#monthMenu ul li {
    display: inline-block;
}

#monthMenu ul ul {
    font-size: 12px;
}

#monthMenu ul ul li:nth-last-of-type(2) {
    margin-right: 80px;
}

#monthMenu ul li:last-of-type ul li {
    margin-right: 0;
}

#monthMenu ul ul li.year {
    display: block;
    margin: 5px 0 0;
    padding: 2px 0;
    width: 100%;
    background-color: #bbbbbb;
}

#monthMenu ul ul li a,
#monthMenu ul ul li span {
    display: block;
    padding: 3px 15px;
    color: #aaaaaa;
}

#monthMenu ul ul li a {
    border-radius: 9999px;
    color: #555555;
    text-decoration: none;
}

#monthMenu ul ul li a:hover,
#monthMenu ul ul li.active a {
    background-color: #dddddd;
    color: #bb0000;
}

#monthMenu > ul > li > span {
    display: none;
}

#monthMenu ul li.year span {
    display: inherit;
    margin-left: 15px;
    padding: 0;
    border-left: white solid 1px;
    padding-left: 15px;
    line-height: 10px;
    font-size: 10px;
    font-weight: normal;
    color: white;
}

/* Buttons */
a.button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
    display: block;
    white-space: nowrap;
    padding: 0.1em 0.8em;
    border: none;
    border-radius: 0.5em;
    background: #eeeeee; /* Old browsers */
    background: -moz-linear-gradient(top, #eeeeee 0%, #cccccc 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #eeeeee 0%, #cccccc 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #eeeeee 0%, #cccccc 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #eeeeee 0%, #cccccc 100%); /* IE10+ */
    background: linear-gradient(top, #eeeeee 0%, #cccccc 100%); /* W3C */
    box-shadow: 0 0.2em 0.5em -0.2em rgba(0, 0, 0, 1);
    text-align: center;
    color: black;
    font-size: 15px;
    font-weight: bold;
    text-decoration: none;
    cursor: pointer;
}

a.button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
    background: #eeeeee; /* Old browsers */
    background: -moz-linear-gradient(top, #cccccc 0%, #eeeeee 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cccccc), color-stop(100%, #eeeeee)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #cccccc 0%, #eeeeee 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #cccccc 0%, #eeeeee 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #cccccc 0%, #eeeeee 100%); /* IE10+ */
    background: linear-gradient(top, #cccccc 0%, #eeeeee 100%); /* W3C */
    box-shadow: none;
}

a.redButton {
    display: inline-block;
    padding: 6px 40px;
    text-align: center;
    background: #bb0000; /* Old browsers */
    background: -moz-linear-gradient(top, #bb0000 50%, #660000 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #bb0000), color-stop(100%, #660000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #bb0000 50%, #660000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #bb0000 50%, #660000 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #bb0000 50%, #660000 100%); /* IE10+ */
    background: linear-gradient(top, #bb0000 50%, #660000 100%); /* W3C */
    box-shadow: 0 0.2em 0.5em -0.2em rgba(0, 0, 0, 1);
    border-radius: 0.5em;
    color: white;
    font-size: 15px;
    font-weight: bold;
    text-decoration: none;
}

div.home a.redButton {
    padding: 8px 40px;
}

a.redButton:hover {
    background: #bb0000; /* Old browsers */
    background: -moz-linear-gradient(bottom, #bb0000 50%, #660000 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left bottom, left top, color-stop(50%, #bb0000), color-stop(100%, #660000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(bottom, #bb0000 50%, #660000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(bottom, #bb0000 50%, #660000 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(bottom, #bb0000 50%, #660000 100%); /* IE10+ */
    background: linear-gradient(bottom, #bb0000 50%, #660000 100%); /* W3C */
    box-shadow: none;
}

/* Value Classes */
.value {
    font-size: 15px;
    color: black;
    font-weight: bold;
}

.main,
a.button.main {
    color: #0000bb;
}

.positive,
a.button.positive {
    color: #00bb00;
}

.negative,
a.button.negative {
    color: #bb0000;
}

/* Compartment */
div.compartment {
    color: #40434e;
    margin-top: 6px;
    padding: 10px 15px;
    background-color: white;
    border: #dddddd solid 1px;
    box-shadow: 4px 4px 10px -4px rgba(100, 100, 100, 1);
    text-decoration: none;
}

#resume div.compartment {
    padding: 0;
    height: 156px;
}

/* Accounts */
#accounts {
    width: 70%;
}

#accounts div.listAccounts {
    margin: 10px 15px;
}

#accounts div.listAccounts h2 {
    margin-bottom: 0;
}

#accounts ul {
    width: 416px;
}

#accounts ul li div.label {
    position: relative;
    width: 280px;
}

#accounts ul li div.label a {
    position: absolute;
    right: 0;
}

.listAccounts ul {
    color: black;
    font-weight: bold;
    list-style: none;
}

.listAccounts ul li {
    position: relative;
}

.listAccounts ul li div {
    display: inline-block;
    vertical-align: bottom;
    white-space: nowrap;
    overflow: hidden;
}

.listAccounts ul li div.balance {
    text-align: right;
    color: #002060;
}

.listAccounts ul li div.negative {
    color: #bb0000;
}

.listAccounts ul li > div.last {
    width: auto;
    position: absolute;
    right: 0;
}

.listAccounts ul li.wrongpass label,
.listAccounts ul li.wrongpass div.accountNumber {
    color: #bb0000;
}

#accounts > div.balance {
    float: right;
    margin-top: 55px;
    width: 174px;
    border-left: #bbbbbb solid 2px;
    text-align: center;
    font-size: 15px;
}

#accounts > div.balance > a.button {
    display: inline-block;
    margin-top: 15px;
    max-width: 120px;
}

#accounts > div.balance a.last {
    display: block;
    margin-top: 5px;
    font-size: 10px;
}

/* Remains */
#remains {
    display: table;
    float: right;
    margin-top: 0;
    width: 28%;
    text-align: center;
    font-size: 15px;
}

#remains div.alone {
    margin-top: 50px;
}

#remains.default > div:first-child {
    display: inline-block;
}

#remains.default > div:first-child > div {
    display: inline-block;
    text-align: left;
}

#remains.default > div:first-child > div div,
#remains.default > div:first-child > div a {
    margin: 15px 5px;
}

#remains div.button {
    max-width: 120px;
}

#remains.default > div.last {
    margin: 0 15px;
    padding: 0 25px;
    border-top: #bbbbbb solid 2px;
    text-align: left;
}

#remains .middle {
    display: table-cell;
    vertical-align: middle;
}

/* List Accounts */
#listAccounts {
    color: black;
}

#listAccounts h2 {
    margin: 10px 40px;
}

#listAccounts a.redButton {
    float: right;
    margin: 10px 40px;
    font-weight: normal;
}

#listAccounts span.bank {
    color: #555555;
    font-size: 18px;
}

#listAccounts > div {
    margin-top: 25px;
    padding-top: 15px;
    border-top: #bbbbbb solid 2px;
}

#listAccounts ul {
    padding: 0 50px 0 35px;
    font-size: 1.1em;
}

#listAccounts ul li {
    margin: 10px 0;
}

#listAccounts ul li div {
    margin: 0 10px;
}

#listAccounts ul li div {
    width: 130px;
}

#listAccounts ul li div.label {
    width: 330px;
}

#listAccounts ul li div.accountNumber {
    width: 200px;
}

#listAccounts ul li div.links {
    width: auto;
}

#listAccounts ul li.wrongpass label:before {
    content: '*';
}

div.list div.title {
    margin-left: 24px;
    margin-top: 15px;
    padding: 5px 5px 10px;
    width: 804px;
    text-align: center;
    background-color: #bb0000;
    border-radius: 5px 5px 0px 0px;
    color: white;
    font-weight: bold;
}

/* Transactions */
div.justify {
    display: inline-block;
}

div.justify > a {
    display: block;
}

div.subList > div:nth-of-type(2n) > div.transaction {
    background-color: #f2f2f2;
}

div.subList > div {
    overflow: hidden;
}

div.subList > div:hover > div.transaction {
    background-color: #cccccc !important;
}

div.subList > div:hover > div.desactive {
    visibility: visible;
}

img.regular {
    cursor: pointer;
}

div.new {
    padding: 4px 5px;
    color: #bb0000;
    overflow: hidden;
}

div.new.transaction {
    padding: inherit;
    color: inherit;
    overflow: inherit;
}

div.new > img {
    float: left;
}

div.transaction {
    float: left;
    width: 814px;
}

div.transaction.head,
div.transaction.foot {
    float: none;
    overflow: hidden;
}

div.transaction.new {
    font-weight: bold;
}

div.transaction.gray,
div.transaction.gray div {
    color: #aaaaaa;
}

div.transaction.regular {
    background-color: #ddd9c3 !important;
}

#statement div.transaction.topBorder {
    border-top: black solid 1px;
}

div.transaction.head {
    margin-left: 24px;
    margin-top: -5px;
    background-color: black;
    border-radius: 5px;
    border-top: white solid 1px;
    color: white;
    font-weight: bold;
}

#incomes div.transaction.head {
    margin-top: 0;
}

div.transaction.foot {
    margin-left: 24px;
    background-color: #bbbbbb;
    color: black;
    font-weight: bold;
    border-bottom: black solid 1px;
}

div.transaction.foot div:first-child {
    padding-left: 100px;
    width: 402px;
}

div.transaction > div {
    float: left;
    width: 326px;
    padding: 5px;
    border-left: white solid 1px;
    white-space: nowrap;
    overflow-x: hidden;
}

div.transaction > div:first-child {
    border-left: none;
}

div.transaction div.date {
    width: 160px;
    text-align: center;
}

div.transaction div.wording {
    position: relative;
}

div.transaction div.wording div.icons {
    position: absolute;
    right: 0;
    top: 3px;
}

div.icons img {
    float: left;
    margin-right: 3px;
}

div.transaction div.number {
    width: 100px;
}

.number {
    text-align: right;
    font-weight: bold;
}

div.transaction div.category {
    padding: 4px 5px;
    width: 181px;
}

div.transaction.head div.category {
    padding: 5px;
}

/* Table */
#tableWrapper {
    margin-top: 15px;
    position: relative;
}

#table {
    font-size: 12px;
}

#table .value,
#table a.button {
    font-size: inherit;
}

#table > div,
#table div.inside > div {
    float: right;
}

#table > div,
#table div.inside > div {
    margin-left: 0.3em;
}

#table > div.objectiveBar {
    margin-left: 0;
}

#table > div > div,
#table div.inside > div > div {
    height: 1em;
    padding: 1.2em 0;
}

#table > div > div.inside {
    height: auto;
    padding: 0;
}

#table > div.category > div {
    height: 2em;
    padding: 0.8em 0 0.6em;
}

#table > div.category > div:first-child {
    height: 1em;
    padding: 0 0.5em 1.2em 0;
}

#table > div.category > div > div {
    display: table-cell;
    height: 2em;
    padding-right: 5px;
    vertical-align: middle;
}

#table > div.category > div.last > div {
    height: auto;
    vertical-align: middle;
}

#table > div.category > div > div.buffer {
    width: 16px;
}

#table div.total.value > div {
    position: relative;
    text-align: right;
}

#table div.total.value a.button {
    margin-top: -0.1em;
}

#table div.total.value > div img {
    position: absolute;
    top: 4px;
    right: -10px;
}

#table > div > div:first-child {
    padding: 0 0 1.2em;
}

#table > div.category > div {
    color: black;
    font-weight: bold;
}

#table > div.category > div.last {
    color: inherit;
    font-weight: inherit;
}

#table div.scroller {
    position: absolute;
    display: inline-block;
    width: 9px;
    height: 18px;
    bottom: 0.7em;
}

#table > div.category > div {
    padding-right: 0.5em;
    border-right: #bbbbbb solid 2px;
}

#table > div.category > div:first-child {
    border-right: none;
}

#table > div.balance,
#table > div.main {
    text-align: right;
}

#table > div > div.last {
    clear: both;
    position: relative;
    height: 1.8em;
    padding: 0.8em 0;
    text-align: center;
}

#table > div > div.last > div {
    display: inline-block;
    font-size: 0.9em;
}

#table > div > div.last > div {
    padding: 0.4em 1em;
    border-radius: 9999px;
}

#table > div > div.last > div.scroller {
    padding: 0;
    border-radius: 0;
}

#table > div > div.last > div:hover {
    background-color: #dddddd;
    color: #bb0000;
    cursor: pointer;
}

#table > div > div.last > div.scroller:hover {
    background-color: inherit;
    cursor: inherit;
}

#table > div.objectiveBar > div {
    width: 15em;
}

#table > div.objectiveBar > div.objectiveBar {
    position: relative;
    height: 1.2em;
    padding: 1.4em 0 0.8em;
}

#table > div.objectiveBar > div.objectiveBar > div > div {
    position: absolute;
    height: 1.2em;
    border-radius: 0px 9999px 9999px 0px;
}

#table > div.objectiveBar div.objective,
#table > div.objectiveBar div.total.positive,
#table > div.objectiveBar div.total.negative,
#table > div.total div.objective span {
    cursor: pointer;
}

#table div.objectiveBar > div > div.objective {
    background: #dddddd; /* Old browsers */
    background: -moz-linear-gradient(top, #dddddd 0%, #666666 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(100%, #666666)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #dddddd 0%, #666666 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #dddddd 0%, #666666 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #dddddd 0%, #666666 100%); /* IE10+ */
    background: linear-gradient(top, #dddddd 0%, #666666 100%); /* W3C */
}

#table div.objectiveBar > div:hover > div.objective {
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #aaaaaa 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #aaaaaa)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffffff 0%, #aaaaaa 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffffff 0%, #aaaaaa 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ffffff 0%, #aaaaaa 100%); /* IE10+ */
    background: linear-gradient(top, #ffffff 0%, #aaaaaa 100%); /* W3C */
}

#table div.objectiveBar > div > div.total {
    background: #888888; /* Old browsers */
    background: -moz-linear-gradient(top, #888888 0%, #000000 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #888888), color-stop(100%, #000000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #888888 0%, #000000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #888888 0%, #000000 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #888888 0%, #000000 100%); /* IE10+ */
    background: linear-gradient(top, #888888 0%, #000000 100%); /* W3C */
}

#table div.objectiveBar > div > div.total.positive {
    background: #88ff88; /* Old browsers */
    background: -moz-linear-gradient(top, #88ff88 0%, #008800 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #88ff88), color-stop(100%, #008800)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #88ff88 0%, #008800 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #88ff88 0%, #008800 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #88ff88 0%, #008800 100%); /* IE10+ */
    background: linear-gradient(top, #88ff88 0%, #008800 100%); /* W3C */
}

#table div.objectiveBar > div:hover > div.total.positive {
    background: #bbffbb; /* Old browsers */
    background: -moz-linear-gradient(top, #bbffbb 0%, #448844 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #bbffbb), color-stop(100%, #448844)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #bbffbb 0%, #448844 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #bbffbb 0%, #448844 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #bbffbb 0%, #448844 100%); /* IE10+ */
    background: linear-gradient(top, #bbffbb 0%, #448844 100%); /* W3C */
}

#table div.objectiveBar > div > div.total.negative {
    background: #ff8888; /* Old browsers */
    background: -moz-linear-gradient(top, #ff8888 0%, #880000 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ff8888), color-stop(100%, #880000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ff8888 0%, #880000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ff8888 0%, #880000 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ff8888 0%, #880000 100%); /* IE10+ */
    background: linear-gradient(top, #ff8888 0%, #880000 100%); /* W3C */
}

#table div.objectiveBar > div:hover > div.total.negative {
    background: #ffbbbb; /* Old browsers */
    background: -moz-linear-gradient(top, #ffbbbb 0%, #884444 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffbbbb), color-stop(100%, #884444)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffbbbb 0%, #884444 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffbbbb 0%, #884444 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ffbbbb 0%, #884444 100%); /* IE10+ */
    background: linear-gradient(top, #ffbbbb 0%, #884444 100%); /* W3C */
}

#table > div.objectiveBar {
    width: 0;
    overflow: hidden;
}

#table > div.objectiveBar.show {
    width: 15em;
}

#table > div.balance,
#table > div.main {
    width: 0;
    opacity: 0;
}

#table > div.balance.show1,
#table > div.main.show1 {
    width: auto;
}

#table > div.balance.show2,
#table > div.main.show2 {
    opacity: 1;
}

#table div.inside > div.objective {
    opacity: 0;
}

#table div.inside > div.objective.show {
    opacity: 1;
}

#table > div > div.last > div {
    display: none;
}

#table > div > div.last > div.show {
    display: inherit;
}

.hidden {
    display: none;
}

#indicator {
    width: 18px;
}

table {
    margin-bottom: 0;
}

/* Flash */
#flash {
    margin: 10px 200px 0;
    padding: 8px 75px;
    vertical-align: middle;
    background-color: #2222bb;
    color: white;
    font-size: 16px;
    font-weight: bold;
    border-radius: 9999px;
}

/* Objective Form */
#objectiveForm {
    display: none;
    position: absolute;
}

#objectiveForm form {
    padding: 0;
    font-size: 11px;
    border-radius: 0.3em;
    box-shadow: 0px 0px 3px 1px rgba(192, 192, 192, 1);
}

#objectiveForm form div.row {
    margin: 0;
    padding: 0.3em 0.8em;
}

#objectiveForm form label {
    display: inline;
}

#objectiveForm form div.row div {
    display: inline-block;
    margin-right: 0.4em;
    width: 7em;
}

#objectiveForm form input {
    text-align: center;
}

#objectiveForm form span.main {
    font-size: 0.9em;
}

/* Team */
div.team {
    display: inline-block;
}

div.team > div.block > p {
    text-align: justify;
}

div.block {
    margin: 50px;
    overflow: hidden;
}

div.block h1 {
    font-size: 1.8em;
}

div.block img {
    max-width: 400px;
}

div.team div.block {
    max-width: 260px;
    margin: 20px;
    float: left;
}

div.team img {
    max-width: 250px;
    max-height: 300px;
    margin-bottom: 20px;
}

div.block img.right {
    float: right;
    margin-left: 120px;
}

div.block img.left {
    float: left;
    margin-right: 120px;
}

div.block div {
    font-size: 14px;
    text-align: justify;
}

#contact.block div {
    text-align: center;
}

/* Popup */
.popup {
    z-index: 1000;
    display: none;
    position: absolute;
    overflow: hidden;
    padding: 15px;
    text-align: center;
    font-size: 12px;
    background-color: white;
    border-radius: 1em;
    box-shadow: 0px 0px 5px 3px rgba(192, 192, 192, 1);
}

.popup .errorMessage {
    margin-top: 0.2em;
    font-size: 0.9em;
    color: #ff0000;
}

.popup .submit {
    margin-top: 20px;
    display: inline-block;
}

.popup .submit input {
    width: 130px;
    margin: 0 auto;
}

/* Alerts & Profile */
#listAlerts h2 {
    margin: 10px 40px;
}

#alertsForm input[type="text"] {
    text-align: right;
}

#alertsForm form > div.row > div.errorMessage {
    width: 100%;
    text-align: center;
}

#alertsForm .alertBlock,
#profileChange .profileBlock {
    margin-top: 25px;
    padding-top: 15px;
    border-top: #bbb solid 2px;
}

#alertsForm .alertTitle,
#profileChange .profileTitle {
    color: #555;
    font-size: 18px;
}

#alertsForm .alertBlock ul,
#profileChange .profileBlock ul {
    color: black;
    font-weight: bold;
    list-style: none;
}

#alertsForm .errorMessage {
    color: red;
    margin-top: 0.2em;
    font-size: 0.7em;
}

#alertsForm .alertBlock ul li,
#profileChange .profileBlock ul li {
    margin: 10px 0;
    position: relative;
}

#alertsForm .alertBlock input,
#profileChange input {
    border: 1px solid white;
    width: 100px;
    font-weight: bold;
    color: #002060;
}

#alertsForm .alertBlock input:focus {
    border: 1px solid black;
}

#alertsForm .alertBlock .desactivatedAlert input:focus {
    border: 1px solid white;
}

#alertsForm .alertBlock input.validated {
    border: 1px solid green;
}

#alertsForm .row:not(.errorMessage) {
    margin-left: 20px;
    height: 23px;
    font-size: 13.2px;
}

#alertsForm div.value,
#alertsForm div.value > span {
    color: #002060;
    font-size: 13.2px;
    width: 150px;
}

#alertsForm .desactivatedAlert {
    opacity: 0.5;
    border: none;
    font-weight: bold;
}

#alertsForm .alertBlock input:focus,
#profileChange #coordoneesBlock input:focus {
    border: 1px solid black;
}

#alertsForm .alertBlock .desactivatedAlert input:focus {
    border: 1px solid white;
}

#alertsForm .alertBlock input.validated {
    border: 1px solid green;
}

#alertsForm .row,
#profileChange .row {
    margin-left: 20px;
    font-size: 16px;
}

#alertsForm .desactivatedAlert {
    opacity: 0.5;
}

#alertsForm .row div,
#alertsForm .row label,
#profileChange .row div,
#profileChange .row label {
    display: inline-block;
    vertical-align: bottom;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
}

#alertsForm .row label,
#profileChange .row label {
    width: 500px;
}

#alertsForm .editer_input_hidden {
    width: 23px;
    height: 23px;
}

#alertsForm .row .button {
    margin: 0px;
    margin-left: 20px;
    color: #a6a6a6;
    padding: 0.4em 1em;
    border-radius: 9999px;
    font-weight: bold;
    position: absolute;
}

#alertsForm .row .button:hover,
#alertsForm .row .button.active {
    background-color: #dddddd;
    cursor: pointer;
    color: #b00;
}

/* Profile Specific */
#profileChange input,
#profileChange select {
    width: 200px;
    margin-left: 1px;
}

#profileChange .messageRow {
    color: rgba(127, 127, 127, 0.5);
    text-align: center;
}

#profileChange div.form.wide {
    display: block;
    margin: auto;
    margin-top: 10px;
    width: 100%;
}

#profileChange div.form.wide div.row {
    display: block;
}

#profileChange div.form.wide div.row.button {
    text-align: center;
    position: relative;
    left: 50px;
}

#profileChange div.form.wide div.row label,
#profileChange div.form.wide div.row div {
    width: 50%;
}

#profileChange div.form.wide form {
    background-color: white;
    color: black;
    box-shadow: none;
}

#profileChange div.form.wide input {
    border-color: black;
    width: 51%;
}

#profileChange div.form.wide .button input {
    border: none; /*/-color: white;*/
    width: initial;
    margin-bottom: 10px;
    color: black;
}

#profileChange #coordoneesBlock div.error input {
    border: 1px solid red;
}

#profileChange #coordoneesBlock div.success input {
    border: 1px solid green;
}

#profileChange .pop_over {
    display: none;
    position: fixed;
    z-index: 10;
    top: 246px;
    left: 440px;
    border: 2px solid gray;
    border-radius: 10px;
    border-width: 5px;
    padding: 10px;
    background-color: white;
}

#profileChange .pop_over h3 {
    text-align: center;
}

#profileChange .pop_over .mail {
    color: rgba(127, 127, 127, 0.5);
    text-align: center;
    margin-bottom: 10px;
}

#profileChange #overlay {
    display: none;
    position: fixed;
    overflow: hidden;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: black;
    opacity: 0.7;
}

#changeMail div.row.errorMessage {
    left: 418px;
}

#coordoneesBlock .errorMessage {
    font-size: 0.8em;
    color: red;
    width: 50%;
    left: 243px;
}

/* Annual Table */
div#annualTable {
    width: 912px;
    overflow: hidden;
}

#annualTable div.month {
    width: 50px;
}

#annualTable div.total {
    font-weight: bold;
    overflow: hidden;
}

#annualTable div.total > div.unfold {
    background-color: #cccccc;
    border-radius: 5px 5px 5px 5px;
}

#annualTable a.folder {
    cursor: pointer;
    width: 15px;
    height: 20px;
    float: left;
}

#annualTable div.catLine {
    width: 732px;
}

#annualTable div.catName {
    float: left;
    white-space: nowrap;
    width: 150px;
    padding: 5px;
    overflow-x: hidden;
}

#annualTable div.number {
    font-weight: normal;
}

#annualTable div.positive,
#annualTable div.negative {
    font-weight: bold;
}

#annualTable div.monthsList {
    margin-left: 140px;
    overflow: hidden;
}

#annualTable > div.monthsList > div {
    float: left;
    width: 51px;
    padding: 5px;
    text-align: center;
    font-size: 11px;
    font-weight: bold;
}

#annualTable > div.monthsList > img {
    float: left;
    width: 10px;
    margin-left: 5px;
    margin-right: 5px;
    cursor: pointer;
}

#annualTable div.year {
    margin-left: 160px;
    width: 717px;
    background-color: #bbbbbb;
    font-size: 10px;
    color: white;
    padding-left: 15px;
}

#annualTable div.subList {
    display: none;
}

#annualTable div.month.number.filled {
    cursor: pointer;
}

#annualTable div.month.number.pointer:hover {
    background-color: #cccccc;
}

#annual div#chart {
    min-height: 400px;
}

/* Chart Switcher */
#chartSwitcher {
    overflow: hidden;
    margin: 30px 0 20px;
}

#chartSwitcher li {
    float: left;
    list-style-type: none;
}

#chartSwitcher li div {
    float: left;
    height: 20px;
}

#chartSwitcher li div.img {
    width: 30px;
    height: 20px;
    background-color: #cccccc;
    background-repeat: no-repeat;
    background-position: center center;
}

#chartSwitcher li:hover div.img,
#chartSwitcher li.active div.img {
    background-color: #999999;
}

#chartSwitcher #resultsButton div.img {
    background-image: url("../../../images/results.png");
}

#chartSwitcher #categoriesButton div.img {
    background-image: url("../../../images/categories.png");
}

#chartSwitcher #balancesButton div.img {
    background-image: url("../../../images/balances.png");
}

#chartSwitcher li div.txt {
    width: 84px;
    height: 18px;
    line-height: 18px;
    border: #cccccc solid 1px;
    text-align: center;
}

#chartSwitcher li:hover div.txt,
#chartSwitcher li.active div.txt {
    border-color: #999999;
    color: black;
}

/* Projection */
div#prj-resume {
    position: relative;
}

div#prj-resume div.content {
    text-align: center;
    position: absolute;
    top: 30px;
    left: 0;
    width: 100%;
}

div#prj-resume div.content h3 {
    font-size: 16px;
    color: #888888;
    margin-top: 10px;
    margin-bottom: 5px;
    font-weight: normal;
}

div#prj-resume div.compartment {
    height: 156px;
    position: relative;
    padding: 0 0 0 10px;
}

div#prj-resume div#current {
    width: 32%;
}

div#prj-resume div#planned {
    width: 30%;
    margin-top: 0;
    float: right;
}

div#prj-resume div#amount {
    width: 32%;
    margin-top: 0;
    margin-left: 11px;
    float: right;
}

div#prj-resume img#projarrow1 {
    position: absolute;
    top: 65px;
    left: 300px;
    height: 30px;
}

div#prj-resume img#projarrow2 {
    position: absolute;
    top: 65px;
    left: 605px;
    height: 30px;
}

/* Warning Popup */
#warningPopup {
    max-width: 300px;
}

#warningPopup p {
    text-align: justify;
}

/* Projection Table */
#projection > table > tbody > tr > td {
    width: 450px;
}

#projection td.title {
    font-size: 19px;
    font-weight: bold;
}

#projection td.title.positive {
    color: #009900;
}

#projection td.title.negative {
    color: #990000;
}

#projection td.subtitle {
    border-top: 2px solid #aaaaaa;
    font-size: 19px;
    color: #888888;
    vertical-align: top;
}

#projection td.bold {
    font-size: 16px;
    font-weight: bold;
    color: black;
}

#projection span.notice {
    color: #aaaaaa;
    cursor: pointer;
}

#projection td.notice {
    color: #aaaaaa;
    font-style: italic;
    text-align: center;
}

#projection span.number {
    font-size: 14px;
    float: right;
    padding-right: 10px;
    margin-top: 4px;
    color: black;
}

#projection table.clusters {
    padding-left: 10px;
    font-size: 13px;
    color: black;
}

#projection table.clusters tr.category td {
    border-bottom: 1px solid black;
    font-weight: bold;
    padding-top: 2px;
    padding-bottom: 2px;
    font-size: 12px;
}

#projection table.clusters tr.category td.label {
    padding-left: 20px;
}

#projection table.clusters tr.debited {
    color: #888888;
}

#projection table.clusters tr.expired {
    color: #bb0000;
}

#projection table.clusters tr > td.number {
    font-size: 14px;
}

#projection table.clusters tr > td.label > div.wording {
    overflow-x: hidden;
    white-space: nowrap;
    width: 210px;
}

#projection table.clusters tr.expired > td.label > div.warning {
    font-size: 8pt;
}

#projection table.clusters tr.gray {
    background-color: #f2f2f2;
}

/* Refund */
.refund {
    width: 500px;
}

.refund form > div {
    width: 100%;
}

.refund form > * {
    clear: both;
}

.refund div.refundTransaction {
    margin-top: 20px;
}

.refund div.refundTransaction div {
    float: left;
    padding: 5px;
    background-color: #f2f2f2;
    border-top: black solid 1px;
    border-bottom: black solid 1px;
}

.refund div.refundTransaction img {
    padding: 5px;
}

.refund div.refundTransaction div.category {
    float: right;
    background: none;
    border: none;
}

.refund div.refundTransaction div.wording {
    width: 170px;
    text-align: left;
    white-space: nowrap;
    overflow-x: hidden;
}

.refund div.refundTransaction div.number {
    width: 100px;
}

.refund div.label {
    margin-top: 20px;
    font-size: 18px;
    font-weight: bold;
    color: black;
}

.refund div.label:first-of-type {
    margin-top: 0;
}

.refund label:after,
.all label:after {
    content: none;
}

.refund .year,
.all {
    font-size: 14px;
    color: black;
}

.refund .month {
    margin: 0 auto;
    width: 150px;
    overflow: hidden;
}

.refund .month img {
    margin-top: 6px;
}

.refund .month ul {
    text-decoration: none;
    font-weight: bold;
}

.refund .month li {
    float: left;
    display: none;
    width: 130px;
    font-size: 20px;
}

.all label {
    display: inline;
}

.all input:not(:last-of-type) {
    margin-right: 30px;
}

.all .errorMessage {
    display: none;
}

/* Change Code Form */
#changeCodeForm .buttonWrapper {
    overflow: hidden;
    margin-left: 35px;
}

#changeCodeForm div.warning {
    margin: 0 1em;
    padding: 0.4em 0;
    font-size: 0.9em;
}

#changeCodeForm .buttonWrapper .button {
    float: right;
    margin: 0 45px;
    padding: 0.4em 1em;
    border-radius: 9999px;
    color: #bb0000;
}

#changeCodeForm .button:hover,
#changeCodeForm .button.active {
    background-color: #dddddd;
    cursor: pointer;
}

#changeCodeForm form {
    padding: 0;
    background: none;
    box-shadow: none;
    color: black;
}

#changeCodeForm form div {
    text-align: center;
}

#changeCodeForm form div > .row {
    display: inline-block;
}

#changeCodeForm .message {
    width: 450px;
    margin: 0 auto 20px;
    text-align: center;
    color: #555555;
}

/* Add Form */
#addForm div.button {
    text-align: left;
}

#addForm div.row.button input.cancel {
    margin-left: 3em;
}

#addForm div.row.button input.submit {
    float: right;
    margin-right: 3em;
    margin-top: 0;
}

div.noCancel #addForm form > div.row.button,
div.noCancel #addForm div.row.button input.cancel {
    display: none;
}

div.form#addForm form,
div.form#signinForm form {
    background: none;
    border-radius: 0;
    box-shadow: 0 0 0 0 white;
    color: black;
}

div.form#signinForm {
    width: 650px;
    padding-right: 0;
}

div.form.wide#signinForm div.row {
    width: 350px;
}

div.form#signinForm div.hint {
    color: rgb(126, 126, 126);
    text-align: left;
}

#signinForm div.hint {
    margin-left: 110px;
}

div.popup#addForm {
    position: relative;
}

#addInvite #addForm div.row.button {
    text-align: right;
}

#addInvite #addForm div.row.button input.submit {
    float: none;
    margin: 0;
}

div#addInvite {
    width: 700px;
    margin-bottom: 20px;
}

#addInvite #addForm {
    display: none;
}

#addForm {
    padding: 0;
    color: black;
}

#addForm div.row {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 2px;
}

#addForm label,
#signinForm div.row label {
    font-weight: bold;
    font-size: 12px;
}

#addInvite h4 {
    display: block !important;
}

#addForm h4 {
    text-align: center;
    font-size: 14px;
}

#addInvite > div.compartment {
    text-align: left;
    margin-top: 2em;
    padding-right: 0;
}

#addInvite a.redButton {
    margin-right: 2em;
    font-weight: normal;
}

#addInvite > div.compartment > div:first-child {
    text-align: right;
}

#addInvite > div.compartment > div {
    clear: both;
    margin: 1em 0;
}

#addInvite > div.compartment > div > div > div h1 {
    font-size: 18px;
    color: black;
}

#addInvite > div.compartment > div > div > div {
    margin: 2em 0;
}

#addInvite > div.compartment > div > div > div > p {
    margin-top: 10px;
    text-align: justify;
}

/* Security */
p#secureBanner {
    text-align: center;
}

p#secureBanner a {
    margin-right: 20px;
    margin-left: 20px;
}

div.compartment > div > div.right {
    margin: 40px 0 40px 3em;
    color: rgb(89, 89, 89);
    font-size: 11px;
    text-align: left;
    width: 150px;
    padding: 10px 10px 10px 30px;
    background-color: #e2e2e2;
}

div.compartment > div > div.right a {
    text-decoration: underline;
}

div.right h1 {
    font-size: 1.2em;
    color: black;
    font-style: italic;
    font-weight: bold;
}

div.right li {
    margin: 1em 0;
}

div.freeze {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
}

div#security img {
    margin-left: 180px;
    margin-right: 100px;
}

div#encryption h1,
div#readonly h1,
div#partner_secu h1,
div#confidential h1,
div#unsubscribe h1 {
    text-align: left;
}

div#partner_secu div,
div#confidential div,
div#unsubscribe div {
    float: right;
}

div#encryption div,
div#readonly div,
div#partner_secu div,
div#confidential div,
div#unsubscribe div {
    width: 400px;
}

div#encryption {
    margin-right: 100px;
}

div#encryption img {
    margin-left: 0;
}

div#readonly {
    margin-right: 150px;
}

div#confidential img {
    margin-left: 70px;
    margin-right: 0;
}

div#unsubscribe img {
    margin-left: 120px;
    margin-right: 0;
}

div#partner_secu img {
    margin-left: 80px;
}

/* Premium */
a.premium {
    font-style: italic;
}

#premiumEnd p {
    line-height: 1;
    color: #bb0000;
}

#premiumEnd a {
    margin-top: 5px;
    padding: 4px 16px;
}

#premiumEnd a img {
    vertical-align: bottom;
    margin-bottom: 2px;
}

#premiumPopup > div:not(:last-of-type) {
    margin-bottom: 1em;
}

#premiumPopup h3 {
    color: black;
}

#premiumPopup a.button,
#premiumPopup a.redButton {
    margin: 1em 0;
    font-size: 1em;
}

#premiumPopup a.button {
    color: #555555;
}

#premiumPopup p,
#premiumPopup ul {
    margin: 1em auto 0; 
    width: 380px;
    text-align: left;
}

#premiumPopup ul li {
    list-style-position: inside;
}

#premiumForm {
    display: inline-block;
    width: 280px;
}

#addEmailLink > a {
    float: right;
}

#premiumForm div.row {
    margin: 0.3em 0;
}

#premiumPopup #inviteThanks {
    display: none;
    text-align: center;
}

#premiumPopup div.soon {
    display: none;
    color: #ff0000;
    font-size: 0.8em;
    margin-top: -7px;
}


/* Menu FG */
.fg-menu a.manualHover {
    border: 1px solid #999999;
    background: #dadada url(/css/theme/images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;
    font-weight: normal;
    color: #212121;
}

.fg-menu li a,
.fg-menu li span {
    color: inherit;
}

/* Menu flottant */
.floating-menu {
    position: fixed !important;
    top: auto !important;
    left: auto !important;
    right: 20px !important;
    bottom: 20px !important;
    width: 50px;
    height: 50px;
    margin: 0;
    z-index: 99999 !important;
}

.floating-menu-toggle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: linear-gradient(top, #bb0000 50%, #660000 100%);
    background: -moz-linear-gradient(top, #bb0000 0%, #660000 100%);
    background: -webkit-linear-gradient(top, #bb0000 0%, #660000 100%);
    background: linear-gradient(to bottom, #bb0000 0%, #660000 100%);
    box-shadow: 0 0.2em 0.6em -0.1em rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s;
}

.floating-menu-icon {
    color: white;
    font-size: 28px;
    font-weight: bold;
    line-height: 1;
    margin-top: -3px;
}

.floating-menu.open .floating-menu-toggle {
    transform: rotate(45deg);
}

.floating-menu-panel {
    display: none;
    position: absolute;
    bottom: 60px;
    right: 0;
    min-width: 200px;
    max-width: 280px;
    max-height: 70vh;
    overflow-y: auto;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 0.2em 0.8em -0.1em rgba(0, 0, 0, 0.5);
    padding: 8px 0;
}

.floating-menu.open .floating-menu-panel {
    display: block;
}

.floating-menu-panel ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.floating-menu-panel > ul > li {
    border-bottom: 1px solid #eeeeee;
}

.floating-menu-panel > ul > li:last-child {
    border-bottom: none;
}

.floating-menu-panel ul li span {
    display: block;
    padding: 8px 15px;
    font-weight: bold;
    color: #555555;
}

.floating-menu-panel ul ul {
    display: block;
}

.floating-menu-panel ul ul li a {
    display: block;
    padding: 6px 25px;
    font-size: 0.9em;
}

.floating-menu-panel ul ul li a:hover {
    background-color: #f5f5f5;
    color: #bb0000;
}
