html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address,
code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, table, caption, tbody, tfoot, thead, tr, th, td {

    border: 0 none;
    font-size: 100%;
    font-style: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline;

}

* {
    box-sizing: content-box;
}

*:focus {
    outline: none !important;
}

body {

    font-size: 14px;
    line-height: 1.3em;
    letter-spacing: 1px;
    margin: 0;
    min-height: 100%;
    padding: 0;
    color: #000;
    font-family: 'Helvetica Neue', 'Helvetica', Lucida Sans Unicode, Lucida Grande, sans-serif;
    font-weight: 300;
    top: 0px !important;
}

/*input, select, textarea boxes*/

input, select, textarea {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 1em;
    margin: 0;
    outline: medium none;
    padding: 0;
    max-width: 460px;
    font-weight: inherit;
    letter-spacing: 1px;
    border: none;
    border-radius: 2px;
    line-height: normal;
    color: #000;
}

input[type="submit"] {
    -webkit-appearance: none;
}

input:focus {
    border: 1px solid #22BEB3 !important;

}

label {
    font-weight: 300;
}

/*general */

.cb {
    clear: both;
}

.logged-container {
    width: 1000px;
    margin: 0 auto;
}

.onHover {
    background-color: #DDFAF6 !important;
}

.even {
    background-color: #e0e0e1;
}

.spinner {
    height: 100%;
    background: url('../images/Microsoft.svg') no-repeat center !important;
    background-size: 15% !important;
    position: relative;
    z-index: 999;
}

.spinner-small {
    height: 100%;
    background: url('../images/Microsoft.svg') no-repeat center !important;
    position: relative;
    z-index: 999;
    background-size: 10% !important;
}

.active-button {
    background-color: #6fe570 !important;
}

.hotspot-holder {
    width: 30px;
    height: 30px;
    position: absolute;
    right: -12px;
    top: -9px;
    cursor: pointer;

}

#positions .hotspot-holder, #scanner .hotspot-holder {
    top: 17px;

}

.hotspot-holder .pulse {
    width: 10px;
    height: 10px;
    border: 5px solid #E54D3E;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    background-color: #716f42;
    z-index: 10;
    position: absolute;

}

.hotspot-holder .dot {
    border: 5px solid #E54D3E;
    background: transparent;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    height: 30px;
    width: 30px;
    -webkit-animation: pulsate 3s ease-out;
    -moz-animation: pulsate 3s ease-out;
    animation: pulsate 3s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    position: absolute;
    top: -10px;
    left: -10px;
    z-index: 1;
    opacity: 0;
}

@-moz-keyframes pulsate {
    0% {
        -moz-transform: scale(0.1, 0.1);
        opacity: 0.0;
    }
    50% {
        opacity: 1.0;
    }
    100% {
        -moz-transform: scale(1.2, 1.2);
        opacity: 0.0;
    }
}

@-webkit-keyframes pulsate {
    0% {
        -webkit-transform: scale(0.1, 0.1);
        opacity: 0.0;
    }
    50% {
        opacity: 1.0;
    }
    100% {
        -webkit-transform: scale(1.2, 1.2);
        opacity: 0.0;
    }
}

#success {

    margin: 50px auto;
    padding: 35px;
    position: relative;
    color: #FFF;
    background: #283D4F url("../images/tick-two.svg") no-repeat scroll 14px center / 80px auto;
    padding-left: 115px;
}

#success-no {

    margin: 50px auto;
    padding: 35px;
    position: relative;
    width: 70%;
    color: #FFF;
    background: #283D4F url("../images/cross-five.svg") no-repeat scroll 14px center / 80px auto;
    padding-left: 115px;
}

rect {
    cursor: pointer;
}

#success a:hover {

    color: #ff780b;
}

#success h4, #success-no h4, #stock-analysis #success-no h4 {
    color: #7D9D00;
    font-size: 1.4em;
    font-weight: normal;
    text-align: center;
    height: inherit;
    background-color: transparent;
    line-height: inherit;
}

.up-arrow {
    background: url("../images/up-arrow.svg") no-repeat center bottom;
    background-size: auto;
}

.tick {
    background: url("../images/tick.svg") no-repeat center;
    background-size: auto;
}

.cross {
    background: url("../images/cross.svg") no-repeat center;
    background-size: auto;
}

.bear-mild {
    background: url("../images/bear-mild.svg") no-repeat center;
    background-size: auto;
}

.bull-mild {
    background: url("../images/bull-mild.svg") no-repeat center;
    background-size: auto;
}

.bear {
    background: url("../images/BearRed.svg") no-repeat center;
    background-size: auto;
}

.bull {
    background: url("../images/BullGreen.svg") no-repeat center;
    background-size: auto;
}
.neutral {
    background: url("../images/Bull-BearOrange.svg") no-repeat center;
    background-size: auto;
}

.low, .undervalued {
    background: url("../images/low.svg") no-repeat center;
    background-size: auto;
}

.medium-low {
    background: url("../images/medium-low.svg") no-repeat center;
    background-size: auto;
}

.medium,
.medium-high,
.fair {
    background: url("../images/medium.svg") no-repeat center;
    background-size: auto;
}

.high, .overvalued {
    background: url("../images/high.svg") no-repeat center;
    background-size: auto;
}

ul {
    list-style-type: none;
}

h3 {
    font-size: 1.5em;
}

.rounded {
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.center {
    margin: 0 auto;
    text-align: center;
}

.no-report {
    margin: 200px auto;
    vertical-align: middle;
    width: 80%;
    text-align: center;
}

a {
    text-decoration: none;
    color: #22BEB3;
}

a:hover {
    color: #ff780b;
}

* {
    outline: none;
}

.popover-navigation > button {
    background-color: #22BEB3;
}

#trading-view-data {
    height: 700px;
}

/*privacy */

#privacy .grayText, #privacy .blueText {
    color: #22BEB3;
}

/*video*/

#video-container {

    min-width: 100%;
    min-height: 100%;
}

#video-container video {
    height: auto;
    min-height: 100%;
    min-width: 100%;
    width: auto;
    z-index: -100;
}

#video-container #controls {
    position: absolute;
    z-index: 99;
    background: url("../images/play_button.png") no-repeat center;
    display: block;
    width: 250px;
    height: 250px;
    left: 38%;
    top: 25%;
    cursor: pointer;
}

#video-container .vjs-no-js {
    position: absolute;
    bottom: 20%;
    left: 20%;
    color: #fff;
    font-size: 1.2em;
    display: none;
}

/*home page */

#home #main {
    padding: 0;
}

#home #main .owl-item > div {
    display: block;
    width: 100%;
    height: 613px;
    position: relative;
    background: url("../images/splash.jpg") no-repeat center top /cover;

}

#home #blurb {
    color: #fff;
    margin: 0 auto;
    position: relative;
    text-align: center;
    top: 250px;
    width: 50%;
}

#home #blurb > p:first-child {
    font-size: 3.2em;
    line-height: 1.2em;
}

#home #blurb > p:nth-child(2) {
    font-size: 1.4em;
    line-height: 1.5em;
    margin: 20px auto;
}

#home #blurb > p:nth-child(3) {
    font-size: 1.4em;
}

#home #blurb > p:nth-child(3) a {
    background-color: #22beb3;
    border: 1px solid #22beb3;
    border-radius: 2px;
    color: #fff;
    display: block;
    height: 65px;
    line-height: 3em;
    margin: 0 auto;
    text-transform: uppercase;
    width: 55%;
}

#home #blurb > p:nth-child(3) a:hover {
    background-color: #fff;
    color: #22beb3;

}

/*,main login*/

#main-login .form-holder {
    background-color: #283d4f;
    margin: 50px auto;
    padding: 25px;
    width: 42%;
    color: #fff;
}

#main-login .form-holder input {
    border: none;
    max-width: inherit;
}

#main-login .form-holder input[type='submit'] {
    background-color: #22beb3;
    color: #fff;
    margin-top: 20px;
    cursor: pointer;
}

#main-login .form-holder input[type='submit']:hover {
    background-color: #dcdcdc;
    color: #6d6e70;
    margin-top: 20px;
    cursor: pointer;
}

#main-login .form-holder .error {
    color: red;
}

/* csv user import */

#users-csv .form-holder {
    background-color: #283d4f;
    margin: 50px auto;
    padding: 25px;
    width: 42%;
    color: #fff;
}

#users-csv #csv-error {
    color: red;
    background-color: #d4d4d4;
    margin: 10px;
    padding: 10px;
}

#users-csv .form-holder input {
    border: none;
}

#users-csv .form-holder input[type='submit'] {
    background-color: #22beb3;
    color: #fff;
    margin-top: 20px;
    cursor: pointer;
}

#users-csv .form-holder input[type='submit']:hover {
    background-color: #dcdcdc;
    color: #6d6e70;
    margin-top: 20px;
    cursor: pointer;
}

#users-csv .form-holder .error {
    color: red;
}

#users-csv #results, #users-csv #info {
    background-color: #d4d4d4;
    margin: 10px;
    padding: 10px;

}

#users-csv #info.ignition {
    background-color: #ff780b;
}

#users-csv #results li {
    padding: 10px;

}

#users-csv #results li span {
    color: #ffffff !important;

}

#users-csv #results li.error {
    color: red;
    margin: 15px auto;
    position: relative;
    background: #c2c2c2 url("../images/cross-five.svg") no-repeat scroll 14px center / 30px auto;
    padding-left: 60px;

}

#users-csv #results li.success {
    color: green;
    margin: 15px auto;
    position: relative;
    background: #c2c2c2 url("../images/tick-two.svg") no-repeat scroll 14px center / 30px auto;
    padding-left: 60px;

}

/*password resets*/
#password-reset .form-holder, #password-reset-confirm .form-holder {
    background-color: #283d4f;
    margin: 50px auto;
    padding: 25px;
    width: 42%;
    color: #fff;
}

#password-reset .form-holder input, #password-reset-confirm .form-holder input {
    border: none;
}

#password-reset .form-holder input[type='submit'], #password-reset-confirm .form-holder input[type='submit'] {
    background-color: #22beb3;
    color: #fff;
    margin-top: 20px;
    cursor: pointer;
}

#password-reset .form-holder input[type='submit']:hover, #password-reset-confirm .form-holder input[type='submit']:hover {
    background-color: #dcdcdc;
    color: #6d6e70;
    margin-top: 20px;
    cursor: pointer;
}

#password-reset .error, #password-reset-confirm .form-holder .error {
    color: red;
}

#password-reset .form-holder input {
    max-width: inherit;
}

/* broker signup */

#broker-signup #success {
    float: left;
}

#broker-signup .promo-highlight {
    color: #7D9D00;
}

#broker-signup #brokers {
    float: left;
    width: 100%;
    background-color: #C9D6D6;
    margin-top: 20px;
    color: #000;
}

#broker-signup #brokers .broker {
    float: left;
    width: 40%;
    height: 150px;
    padding: 10px;
    margin: 5px;
    position: relative;
}

#broker-signup #brokers .blurb {
    float: left;
    width: 52%;
    padding: 10px;
    margin: 5px;
    position: relative;
}

#broker-signup #brokers .blurb p {
    margin-bottom: 5px;
}

#broker-signup #brokers .blurb .promo-cost {
    color: #7D9D00;
}

#broker-signup #brokers .blurb .promo-code {
    color: red;
    font-weight: 400;
}

#broker-signup #brokers #tradier {
    background: url("../images/tradier-white.jpg") center center no-repeat;
    background-size: 100%;
}

#broker-signup #brokers .signup {
    color: #fff;
    z-index: 999;
    padding: 9px;
    text-align: center;
    display: inline-block;
    background-color: red;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: 0;
    border: 2px solid #fff;
    margin: 10px;
    float: right;
}

#broker-signup #brokers .signup:hover {
    background-color: #c4c4c4;
}

/* dialogs */

.dialog {
    display: none;
}

.dialog a {
    color: #31b7ae;
}

#dialog-errors p {
    text-align: left;
}

#dialog-health p {
    margin: 25px;
    padding-bottom: 20px;
    border-bottom: 1px solid #C6C6C6;
}

.email-input {
    background-color: #FFFFFF;
    border: 2px solid #C8C8C8;
    padding: 10px;
    width: 100%;
    margin-top: 25px;
}

#dialog-confirm-email #send-info {

    margin-top: 20px;
}

.dialog .spinner {
    height: 20%;
    background: url('../images/Microsoft.svg') no-repeat center !important;
    background-size: 10% !important;
    position: relative;
    z-index: 999;
}

#test-error p {
    margin: 10px;
    text-align: left;
}

.proxy-filter-dialog {
    border: none !important;
}

/* upper container */
#upper-container {
    height: 130px;
    background-color: #ffffff;
    width: 100%;
    z-index: 999;
    position: fixed;
}

.public #upper-container {
    height: 50px;
}

#upper-container ul {
    list-style: none;
    position: relative;
}

/*close form and transfer form */
.closing-dialog {
    display: none;
    position: absolute;
    bottom: 75px;
    left: 168px;
    height: 434px;
    width: 404px;
    background-color: #fff;
    z-index: 999;
    font-size: 1em;
    opacity: 1 !important;

}

.closing-dialog .contents {
    height: 70%;
    overflow-x: hidden;
    overflow-y: scroll;

}

.closing-dialog h3 {
    color: #7d9d00;
    font-weight: 300;
    margin: 15px 0;
    text-align: center;

}

.closing-dialog .divider {
    border-top: 2px solid #d4d4d4;
}

.closing-dialog a {
    margin: .9em .5em .5em 1em;
    cursor: pointer;
    border-radius: 4px;
    height: 53px;
    width: 157px;
    font-size: 1.3em;
    background-color: #283d4f;
    border: 1px solid #283d4f;
    display: inline-block;
    text-align: center;
    color: #fff;
    line-height: 2.1em;
}

.closing-dialog a:hover {
    background-color: #31b7ae;
    border: 1px solid #31b7ae;
}

.dialog-confirm-close h4,
.dialog-confirm-earlyexit h4 {
    margin: 10px;
    text-align: center;
}

.closing-dialog p {
    padding: 0.5em 1em;
    text-align: center;
}

.closing-form, .transfer-form {
    margin: 20px 20px 10px;
    border: 1px solid #e3e3e3;
    padding: 10px;
    background-color: #e6eaec;

}
.transfer-form #id_position_type, .transfer-form #id_account{
    width:40%;

}
.dialog-confirm-close .all-close-errors,
.dialog-confirm-earlyexit .all-close-errors,
.dialog-confirm-transfer .all-transfer-errors,
.dialog-confirm-copy .all-copy-errors{
    color: #801A1D;
    min-height: 40px;
    text-align: center;
}

.closing-form p,
.transfer-form p,
.close-form .fieldWrapper {
    text-align: left;
    margin-bottom: 10px;
    clear: both;

}

.closing-form ul,
.transfer-form ul {
    display: block;
    height: 30px;
}

.closing-form ul li,
.transfer-form ul li {
    float: left;
}

.closing-form label,
.transfer-form label {
    display: inline-block;
    line-height: 1.7em;
}

.closing-form .cancel-button {
    height: 30px;
    width: 60px;
    display: inline-block;
    right: 10px;
}

.closing-form input[type='text'],
.closing-form input[type='number'],
.transfer-form input[type='number'],
.transfer-form input[type='text'] {
    width: 110px;
    height: 30px;
    padding: 2px;
    border-radius: 2px;
    float: right;
}

.transfer-form input[type='number'],
.transfer-form input[type='text'] {
    float: none;
}

.closing-form input[type="radio"], .transfer-form input[type="radio"] {
    position: fixed;
    top: -1000px;

}

.closing-form input[type="radio"] ~ label span,
.transfer-form input[type="radio"] ~ label span {
    display: inline-block;
    width: 19px;
    height: 19px;
    background: url("../images/radio-one.svg") center top no-repeat;
    background-size: 200% 200%;
    margin: -1px 4px 0 0;
    vertical-align: middle;
    cursor: pointer;
}

.closing-form input[type="radio"]:checked ~ label span,
.transfer-form input[type="radio"]:checked ~ label span {
    background-position: center bottom;
}

.transfer-form #id_share_type {
    display: none;
}

.closing-form .check-holder, .transfer-form .check-holder {
    width: 100%;
    text-align: left;
}

.transfer-form .check-holder {
    margin-bottom: 10px;
}

.closing-form .check-holder .check div, .transfer-form .check-holder .check div {
    top: -20px;
}

/*market ticker*/
#market-ticker {
    width: 100%;
    display: flex;
    flex-wrap: wrap; /* allow it to break lines if needed */
    justify-content: space-between; /* spacing */
    gap: 10px;
    flex-direction: column;
}

#market-ticker ul#active-account {
    left: 10px;
    top: 9px;
    float: left;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: uppercase;
    height: inherit;
}

#market-ticker ul#active-account.up-arrow {
    background-position: 164px 22px;
    background-size: 23% 23%;
}

#market-ticker ul#active-account li:first-child {
    font-size: 1.6em;
    font-family: "Oswald", sans-serif;
    margin-right: 20px;
    margin-top: 2px;
}

#market-ticker ul#active-account li:nth-child(2) {
    font-size: 0.8em;
    font-weight: bold;
}

#market-ticker ul#active-account li:nth-child(2) > span {
    font-size: 1.6em;
    padding-left: 20px;
    background: url("../images/divider.png") no-repeat 8px center;
    position: relative;
    top: 2px;

}

#market-ticker ul#active-account li:nth-child(3) {
    font-size: 1em;
    text-transform: uppercase;
    margin-left: 15px;
}

#market-ticker ul#active-account a {
    background: url("../images/active-account.svg") no-repeat scroll center bottom rgba(0, 0, 0, 0);
    background-size: auto 305%;
    display: inline-block;
    height: 22px;
    left: 4px;
    position: relative;
    width: 36px;
}

#market-ticker #active_account_form {
    height: 40px;
    position: absolute;
    top: 40px;
    width: 100%;
    background-color: #283d4f;
    z-index: 99;
    color: #fff;
    display: none;
}

#market-ticker #active_account_form ul {
    top: 8px;

}

#market-ticker #active_account_form ul li {
    background: url("../images/divider.png") no-repeat scroll right top rgba(0, 0, 0, 0);
    padding-right: 20px;
    margin-right: 15px;
    height: 26px;
    line-height: 1.6em;

}

#market-ticker #active_account_form input[type="submit"] {
    position: relative;
    top: 10px;
    cursor: pointer;
    background: url("../images/active-account.svg") no-repeat scroll center bottom / auto 305% rgba(0, 0, 0, 0);
    height: 22px;
    width: 36px;
    border: none;

}

#market-ticker #active_account_form input[type="submit"]:hover {
    background-position: center top !important;

}

#market-ticker ul#active-account a:hover {
    background-position: center top;
}

#market-ticker #active_account_form input[type="radio"] {
    position: fixed;
    top: -1000px;

}

#market-ticker #active_account_form input[type="radio"] ~ label span {
    display: inline-block;
    width: 19px;
    height: 19px;
    background: url("../images/radio-one.svg") center top no-repeat;
    background-size: 200% 200%;
    margin: -1px 4px 0 0;
    vertical-align: middle;
    cursor: pointer;
}

#market-ticker #active_account_form input[type="radio"]:checked ~ label span {
    background-position: center bottom;
}

#market-ticker ul#market-infos {
    float: right;
    font-size: 0.8em;
    font-weight: bold;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #b7b9b9;
    text-align: left;
    padding-right: 10px;
}

#market-ticker ul#market-infos li {
    padding-left: 20px;
    background: url("../images/divider.png") no-repeat 8px 9px;
}

#market-ticker ul#market-infos li:first-child {
    background: transparent;
}

#market-ticker ul#market-infos li > span {
    float: left;
    line-height: 2.2em;
    min-width: 40px;
    height: 40px;
    text-align: center;
}

#market-ticker ul#market-infos li > span:first-child {
    margin-right: 15px;
}

#market-ticker ul#market-infos li span span {
    display: block;
    color: #fff;
    height: 18px;
}

#market-ticker ul#market-infos li span.change {
    line-height: 5.3em;
    min-width: 40px;
    height: 40px;
    text-align: center;

}

#market-ticker ul#market-infos li span.change .add {
    background: url("../images/plus-two.svg") no-repeat 5px -27px;
    background-size: 24px 60px;
    display: inline-block;
    width: 100%;
    height: 100%;

}

#market-ticker ul#market-infos li span.change .add:hover {
    background-position: 5px 7px;

}

#market-ticker ul#market-infos li span.change.bright-green-font {
    background: url("../images/green-arrow.png") no-repeat 15px 7px;
}

#market-ticker ul#market-infos li span.change.red-font {
    background: url("../images/red-arrow.png") no-repeat 15px 9px;
}

#market-ticker > div {
    height: 40px;
    background-color: #808080;
    color: #fff;
}

#market-ticker > div .holder {
    display: inline-block;
    height: 20px;
    min-width: 100px;
}

#market-ticker ul li {
    float: left;
}

#market-ticker ul#timezone {
    float: left;
    font-size: 0.8em;
    font-weight: bold;
    left: 35px;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #31b7ae;
    text-align: left;
    position: relative;
    height: 40px;
    top: 4px;
}

#market-ticker ul#timezone li {
    margin-right: 20px;
}

#market-ticker ul#market-date {
    float: left;
    font-size: 0.8em;
    font-weight: bold;
    left: 35px;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #31b7ae;
    text-align: left;
    position: relative;
    height: 40px;
    top: 4px;
}

#market-ticker ul#market-date li {
    margin-right: 20px;
}

#market-ticker ul#timezone span, #market-ticker ul#market-date span {
    display: block;
    color: #fff;
}

#market-ticker ul#timezone span.red-font {
    color: #801A1D;
}

#market-ticker ul#timezone span.orange-font {
    color: #ff780b;
}

#market-ticker ul#timezone span.bright-green-font {
    color: #6F0;
}

/* user info */

#user-info{
    display: flex;
    flex-wrap:nowrap;
}
#user-info > div {
    height: 40px;
    background-color: #C9D6D6;
    color: #fff;
    width: 100%;
    font-size: 1.12em;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: uppercase;
    position: relative;
}

#user-info > div > div {
    float: left;
    height: 100%;
    border-collapse: collapse;
}

#user-info > div #membership {
    width: 30%;
}

#user-info > div #membership > div:first-child {
    width: 35%;
    padding-left: 10px;
    padding-right: 10px;
}

#user-info > div #trade {
    float: right;
    margin-right: 20px;

}

#user-info > div > div > div {
    display: inline-block;
}

#user-info > div #one-on-one > div:first-child {
    text-align: right;
    padding-right: 10px;
}

#user-info .membership > div {
    padding: 11px;
    display: inline-block;
}

#user-info .membership.staff > div {
    background-color: #000;
}

#user-info .membership.trial > div {
    background-color: #FFF135;
}

#user-info .membership.lifetime-membership > div {
    background-color: red;
}

#user-info .membership.ignition-membership > div,
#user-info .membership.lifetime-ignition > div,
#user-info .membership.tradier-competition > div{
    background-color: #ff780b;
}

#user-info .membership.beginner-membership > div,
#user-info .membership.yearly-beginner-membership > div {
    background-color: #7D9D00;
}

#user-info .membership.intermediate-membership > div,
#user-info .membership.yearly-intermediate-membership > div {
    background-color: #EB6702;
}

#user-info .membership.advanced-membership > div,
#user-info .membership.yearly-advanced-membership > div {
    background-color: #004B80;
}

#user-info .membership a {
    color: #fff;
    text-align: center;
    background-color: #22beb3;
    text-decoration: none;
    display: inline-block;
    padding: 9px;
    border: 2px solid #6AD5CB;

}

#user-info .membership a:hover {
    color: #22beb3;
    background-color: #fff;

}

#user-info #trial-expiry.days-green {
    background-color: #74BF4E;

}

#user-info #trial-expiry.days-orange {
    border: none;
    background-color: #f68d2e !important;
    color: #fff;

}

#user-info #trial-expiry.days-blue {
    border: none;
    background-color: #5ca49f !important;
    color: #fff;
}

#user-info #trial-expiry.days-red {
    border: none;
    background-color: #931a1d !important;
    color: #fff;
}

#user-info #Setmore_button_iframe {
    color: #fff;
    z-index: 999;
    padding: 9px;
    text-align: center;
    display: inline-block;
    background-color: rgba(132, 191, 218, 0.9);
    text-decoration: none;
    border: 2px solid #6AD5CB;
}

#user-info #Setmore_button_iframe:hover {
    color: #84BFDA;
    background-color: #fff;
}

#user-info #tipranks-button {
    color: #fff;
    z-index: 999;
    padding: 9px;
    text-align: center;
    display: inline-block;
    background-color: #edc71c;
    text-decoration: none;
    border: 2px solid #fff;
    margin-left: 15px;
}

#user-info #tipranks-button:hover {
    color: #edc71c;
    background-color: #fff;
    border: 2px solid #edc71c;
}
#user-info #grok-pop {
    color: #fff;
    z-index: 98;
    padding: 20px;
    text-align: center;
    display: inline-block;
    text-decoration: none;
    margin-left: 8px;
    background: url("../images/AI.svg") no-repeat;
    background-size: 80%;
    position: relative;
    top: 4px;
}

#user-info #grok-pop:hover {
    background: url("../images/AI Hover.svg") no-repeat;
    background-size: 80%;
}
.tipranks-secondary-header {
    width: 100%;
    background-color: #283d4f;
    height: 295px !important;
    position: absolute;
    top: 40px;
    color: #8a8b8d;
    font-size: .9em;
    display: none;
    z-index: 9999;
    text-align: center;
}

.tipranks-secondary-header > div {
    width: 100%;
    height: inherit;

}

.tipranks-secondary-header #tips-error {
    width: 100%;
    margin-top: 10%;
    height: 100%;

}

.tipranks-secondary-header .col {
    float: left;
    width: 30%;
    color: #fff;
    margin-top: 20px;
    height: 93%;
}

.tipranks-secondary-header .col:nth-of-type(2) .body {
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;

}

.tipranks-secondary-header .col .tips-header {
    font-size: 1.2em;
    margin-bottom: 20px;

}

.tipranks-secondary-header .col .tips-header span {
    color: #6fe670;

}

.tipranks-secondary-header .col .body {
    height: 85%;
    overflow: scroll;
    padding-left: 15px;
}

.tipranks-secondary-header .col ul li {
    float: none;
    display: block;
    height: 50px;
    font-weight: 100;
    text-align: left;
    margin-top: 10px;
}

.tipranks-secondary-header .col ul li a:hover {
    color: #6fe670;
    text-decoration: none;
}

.tipranks-secondary-header .col h3 {
    font-size: 1.1em;
    text-transform: initial;

}

#user-info #broker-token a.broker-expiry {
    color: #fff;
    padding: 9px;
    text-align: right;
    text-decoration: none;
    cursor: pointer;
    z-index: 999;
    display: inline-block;
    border: 2px solid #fff;

}

#user-info #broker-token a.broker-expiry.Ally,
#user-info #broker-token a.broker-expiry.ETrade,
#user-info #broker-token a.broker-expiry.Dummy {
    background: url("../images/tradeit_logo.jpeg") 0 -10px no-repeat;
    background-size: 53%;
}

#user-info #broker-token a.broker-expiry.Tradier {
    background: url("../images/tradier-white.jpg") -4px -4px no-repeat;
    background-size: 55%;
}

#user-info #trade a#broker-signup {
    color: #fff;
    z-index: 999;
    padding: 9px;
    text-align: center;
    display: inline-block;
    background-color: #5ca49f;
    text-decoration: none;
    border: 2px solid #fff;
}

#user-info #broker-token a.dash {
    color: #fff;
    padding: 9px;
    text-align: right;
    text-decoration: none;
    cursor: pointer;
    z-index: 999;
    display: inline-block;
    border: 2px solid #fff;
    background-color: #edc71c;

}

#user-info #broker-token a.broker-expiry:hover,
#user-info #broker-token a.dash:hover,
#user-info #broker-token a.trade:hover,
#user-info #trade a#broker-signup:hover {
    background-color: #c4c4c4 !important;
}

#user-info #broker-token a.broker-expiry.none {
    text-align: center;
    background-color: #edc71c;
}

#user-info #broker-token a.broker-expiry.expired {
    background-color: #84bfda;

}

#user-info #broker-token a.broker-expiry.active {
    background-color: #7d9f00;

}

#user-info #broker-token a.broker-expiry.active-low {
    background-color: red;

}

#user-info #broker-token a.extend {
    display: inline-block;
    height: 27px;
    width: 35px;
    background: url("../images/clock.svg") no-repeat;
    background-position: bottom center;
    background-size: 70%;
    cursor: pointer;
    position: relative;
    top: 5px;

}

#user-info #broker-token a.extend:hover {
    background-position: center 3px;
    background-color: transparent !important;

}

#user-info .trade {
    color: #fff;
    z-index: 999;
    padding: 9px;
    text-align: center;
    display: inline-block;
    background-color: #ff780b;
    text-decoration: none;
    border: 2px solid #fff;
}

#user-info .trade.live {
    background-color: red;
}

#user-info #change {
    color: #fff;
    text-align: center;
    position: relative;
    display: block;
    margin-left: 12px;
}

#user-info #change input[type=text] {
    margin-right: 10px;
    padding: 3px;
    position: relative;
    border: 1px solid #fff;
    top: 0px;
    left: 4px;
    font-weight: 200;
    text-transform: uppercase;
}

#user-info #change input[type=submit] {
    background-color: #22beb3;
    border: 2px solid #fff;
    color: #fff;
    padding: 7px;
    cursor: pointer;
}

#user-info #change input[type=submit]:hover {
    background-color: #fff;
    color: #22beb3;

}

/*header*/
#header {
    position: relative;
    font-size: 1.12em;
    font-weight: 200;
}

/*nav*/
#nav {
    float: left;

}

#nav #gorilla-tag {
    background: url("../images/tc-logo-gray-small.png") no-repeat center;
    background-size: 42px 42px;
    width: 50px;

}

#user {
    float: right;
    font-size: .9em;
    line-height: 3.3em;
}

#header ul li {
    float: left;
    height: 50px;
}

#header ul li > a {
    text-decoration: none;
    color: #6D6E70;

    display: inline-block;
    height: 50px;
    line-height: 3em;
}

#user ul li a.button {
    background-color: #dcdcdc;
    color: #6D6E70;
    width: 70px;
    height: 73%;
    text-align: center;
    line-height: 2.5em;
    top: 1px;
    border-radius: 3px;
    position: relative;
    border: 1px solid #dcdcdc;
}

#user ul li > a {
    padding: 0 3px;
}

#user ul li a:hover {
    color: #22beb3;
}

#user ul li img {
    position: relative;
    top: 9px;
    border-radius: 50%;
    border: 1px solid #6d6e70;
    margin-right: 10px;
}

#user ul li a#profile {
    background: url("../images/gears.svg") no-repeat scroll center top rgba(0, 0, 0, 0);
    background-size: 240% 240% !important;
    display: inline-block;
    height: 29px;
    top: 9px;
    position: relative;
    width: 30px;
    margin: 0 10px 0 5px;
    -webkit-transform: translate(0px, 0);
    -webkit-transition: -webkit-transform 0.5s ease;
    -moz-transform: translate(0px, 0);
    -moz-transition: -moz-transform 0.5s ease;
    transform: translate(0px, 0);
    transition: transform 0.5ms ease;
}


#user ul li a#profile:hover {
    background-position: center bottom;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    transform: scale(0.9);
}

#user ul li a#settings-help {
    background: url("../images/question.svg") no-repeat scroll center top rgba(0, 0, 0, 0);
    background-size: 240% 240%;
    display: inline-block;
    height: 29px;
    top: 9px;
    position: relative;
    width: 29px;
    -webkit-transform: translate(0px, 0);
    -webkit-transition: -webkit-transform 0.5s ease;
    -moz-transform: translate(0px, 0);
    -moz-transition: -moz-transform 0.5s ease;
    transform: translate(0px, 0);
    transition: transform 0.5s ease;
}

#user ul li a#settings-help:hover {
    background-position: center -41px;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    transform: scale(0.9);
}

#user ul li.up-arrow {
    background-position: center 34px;
    background-size: 50% 50%;
}

#nav ul li a {
    height: 47px;
    margin: 0 14px;
}

#nav ul li a:hover {
    color: #22beb3;
}

#nav ul li a.active {
    color: #22beb3;
    border-bottom: 3px solid #22beb3;
}

.secondary-header {
    width: 100%;
    background-color: rgba(40, 61, 79, 1);
    height: 131px;
    position: absolute;
    top: 126px;
    color: #8A8B8D;
    font-size: 0.9em;
    display: none;
    z-index: 9998;
    text-align: center;;
}

#nav ul li a.up-arrow {
    background-position: center 36px;
    background-size: 33% 33%;
}

/* trade ticket */

.trade-ticket {
    position: relative;
    width: 100%;
    clear: both;
    padding: 20px;
    background-color: #333333 !important;
    display: none;
}

.trade-ticket h4 {
    height: 40px;
    background-color: #00a896;
    color: #fff;
    text-align: center;
    line-height: 1.8em;
    font-size: 1.4em;
    font-weight: 200;
    margin-bottom: 20px;
}

.trade-ticket h4.first {
    background-color: #028090;
}

.trade-ticket h4.second {
    background-color: #00a896;
}

.trade-ticket h4.third {
    background-color: #02c39a;
}

.trade-ticket h4 span.numbering {
    border: 5px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    background-color: #35D7D2;
    color: #fff;
    display: inline-block;
    vertical-align: middle;
    line-height: 1.1em;
    margin: 9px;
    position: absolute;
    left: 2px;
    top: 2px;
    font-size: 1em;
}

.trade-ticket h4 span.stopwatch {

    display: none;
    vertical-align: middle;
    margin-left: 1em;
    font-size: 0.8em;
    border: 2px solid #fff;
    background-color: #35D7D2;
    color: #fff;
    padding: 0.3em;
    height: 25px;
    line-height: 1.6em;
}

.trade-ticket h4 span.delay {

    display: none;
    vertical-align: middle;
    margin-left: 1em;
    font-size: 0.8em;
    padding: 0.3em;
    height: 25px;
    line-height: 1.6em;
    color: #fff;
    border: 2px solid #fff;
    background-color: #7D9F00;
}

.trade-ticket .trade-ticket-order .option-leg h4,
.trade-ticket .trade-ticket-order .equity-leg h4 {
    height: 30px;
    font-size: 1em;
}

.trade-ticket .trade-ticket-order .option-leg.sto h4,
.trade-ticket .trade-ticket-order .option-leg.stc h4,
.trade-ticket .trade-ticket-order .equity-leg.sell h4,
.trade-ticket .trade-ticket-order .equity-leg.sell_short h4 {
    background-color: #7D9F00;
}

.trade-ticket .trade-ticket-order .option-leg.bto h4,
.trade-ticket .trade-ticket-order .option-leg.btc h4,
.trade-ticket .trade-ticket-order .equity-leg.buy h4,
.trade-ticket .trade-ticket-order .equity-leg.buy_cover h4 {
    background-color: #801A1B;
}

.trade-ticket form > div {
    display: table;
    border-spacing: .5em;
    width: 98%;
}

.trade-ticket form > div > div {
    display: table-cell;
    width: 33%;
    height: 100%;
    padding: .5em;
    color: #fff;
    position: relative;
}

.trade-ticket .info {
    text-align: center;
}

.trade-ticket p label {
    margin-bottom: 10px;
    display: inline-block;
}

.trade-ticket .trade-ticket-order p,
.trade-ticket .trade-ticket-market p {
    display: inline-block;
    width: 47%;
}

.trade-ticket .trade-ticket-order .option-leg,
.trade-ticket .trade-ticket-order .equity-leg {
    border: 2px dashed #fff;
    padding: 5px;
    margin: 10px 0;
    height: 206px;
}

.trade-ticket .trade-ticket-order .equity-leg {
    background-color: #028090;
}

.trade-ticket .trade-ticket-order .option-leg {
    background-color: #00A89D;
}

.trade-ticket .trade-ticket-order p.option-equity {
    display: block;
}

.trade-ticket .trade-ticket-order .option-leg p {
    width: 32%;
    text-align: center;
}

.trade-ticket .ticket-hide {
    visibility: hidden;
}

.trade-ticket .trade-ticket-order input,
.trade-ticket .trade-ticket-market input {
    height: 40px;
    border: 2px solid #fff;
    border-radius: 2px;
    padding-left: 10px;
    color: #575756;
    width: 100%;
    margin: 20px 0;
    background-color: #d4d4d4;
    cursor: pointer;
}

.trade-ticket .trade-ticket-order input#id_equity {
    text-transform: uppercase;
}

.trade-ticket input.limit_price.net-buy,
.trade-ticket input.limit_price.buy {
    border: 2px solid #801A1B;
    color: #801A1B;
}

.trade-ticket input.limit_price.net-sell,
.trade-ticket input.limit_price.sell {
    border: 2px solid #7D9F00;
    color: #7D9F00;
}

.trade-ticket .net-quote {
    background-color: #d4d4d4;
    border: 2px solid #fff;
    border-radius: 2px;
    width: 99%;
    visibility: hidden;
    margin-bottom: 74px;
}

.trade-ticket .net-quote.no-margin {
    margin-bottom: 0;
}

.trade-ticket .net-quote > div {
    display: table-cell;
    text-align: center;
    width: 25%;
}

.trade-ticket .net-quote > div.as-row {
    display: table-row;
}

.trade-ticket .net-quote > div.as-row > div {
    display: table-cell;
}

.trade-ticket .net-quote .net-spread,
.trade-ticket .net-quote .net-mid {
    color: #46494C;
}

.trade-ticket .net-quote > div .net-label {
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    background-color: #ff780b;
    color: #fff;
    vertical-align: middle;
    line-height: 1.6em;
    margin-right: .3em;
    display: inline-block;
}

.trade-ticket .net-quote > div .value {
    color: #fff;
    border: 2px solid #fff;
    border-radius: 2px;
    padding: 4px;
    cursor: pointer;
    background-color: #ff780b;
    line-height: 1.7em;
}

.trade-ticket .net-quote > div .value.net-buy {
    background-color: #801A1B;

}

.trade-ticket .net-quote > div .value.net-sell {
    background-color: #7D9F00;
}

.trade-ticket .net-quote > div .value.net-buy:hover {
    background-color: #fff;
    border: 2px solid #801A1B;
    color: #801A1B;

}

.trade-ticket .net-quote > div .value.net-sell:hover {
    background-color: #fff;
    border: 2px solid #7D9F00;
    color: #7D9F00;
}

.trade-ticket .trade-ticket-market .market-prices {
    margin: 20px 0;
}

.trade-ticket .trade-ticket-market .prices-refresh {
    display: none;
    height: 30px;
    width: 30px;
    top: 12px;
    right: 12px;
    position: absolute;
    background: url("../images/refresh-one.svg") no-repeat;
    background-position: top center;
    background-size: cover;
    cursor: pointer;
}

.trade-ticket .trade-ticket-market .prices-refresh:hover {
    background-position: bottom center;

}

.trade-ticket .trade-ticket-market .market-prices .results .result {
    min-height: 196px;
    margin: 14px 0;
    padding: 10px;
    visibility: hidden;
}

.trade-ticket .trade-ticket-market .market-prices .results .error {
    text-align: center;
}

.trade-ticket .trade-ticket-market .market-prices .results .result.stock-quote {
    min-height: 172px;
}

.s-trade-ticket .trade-ticket-market .market-prices .results .result.stock-quote,
.cc-trade-ticket .trade-ticket-market .market-prices .results .result.stock-quote,
.ccc-trade-ticket .trade-ticket-market .market-prices .results .result.stock-quote {
    margin-top: 98px;
}

.trade-ticket-market .push-market-data {
}

.trade-ticket .trade-ticket-market .market-prices .results .result.net-quote {
    border: 2px dashed #ff780b;
}

.trade-ticket .trade-ticket-market .market-prices .results .result.net-quote > div {
    display: block;
}

.trade-ticket .trade-ticket-market .market-prices .results .result .ticker-bar {
    text-align: center;
    font-size: 0.7em;
}

.trade-ticket .trade-ticket-market .market-prices .results .result .ticker-bar span:first-child {
    font-size: 2em;
    color: #22BEB3;
    text-transform: uppercase;
}

.trade-ticket .trade-ticket-market .results .result .ticker-bar span:nth-child(2) {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 30%;
    display: inline-block;
    vertical-align: top;
    font-size: 1.5em;
}

.trade-ticket .trade-ticket-market .results .result.sto .ticker-bar span:nth-child(2),
.trade-ticket .trade-ticket-market .results .result.bto .ticker-bar span:nth-child(2),
.trade-ticket .trade-ticket-market .results .result.stc .ticker-bar span:nth-child(2),
.trade-ticket .trade-ticket-market .results .result.btc .ticker-bar span:nth-child(2) {
    width: inherit;

}

.trade-ticket .trade-ticket-market .ticker-bar span:nth-child(3) {
    font-weight: 400;
    font-size: 2em;
}

.trade-ticket .trade-ticket-market .ticker-bar span:nth-child(4) {
    font-weight: 400;
    font-size: 2em;
}

.trade-ticket .trade-ticket-market .ticker-bar span:nth-child(5) {
    font-weight: 400;
    font-size: 2em;
    padding-left: 18px;
    background-position: -2px 2px;
    background-size: 27%;
}

.trade-ticket .trade-ticket-market .ticker-bar span:nth-child(6) {
    font-size: 2em;
    padding-right: 50px;
    background-position: 122px center;
}

.trade-ticket .trade-ticket-market .market-price-bar {
    margin: 40px 0;
    position: relative;
}

.trade-ticket .trade-ticket-market .btc .market-price-bar,
.trade-ticket .trade-ticket-market .bto .market-price-bar,
.trade-ticket .trade-ticket-market .stc .market-price-bar,
.trade-ticket .trade-ticket-market .sto .market-price-bar {
    margin: 32px 0 20px 0;

}

.trade-ticket .trade-ticket-market .market-price-bar .low-value {
    top: -25px;
    left: 0;
    position: absolute;
    width: 20%;
    text-align: center;
}

.trade-ticket .trade-ticket-market .market-price-bar .high-value {
    top: -25px;
    right: 0;
    position: absolute;
    width: 20%;
    text-align: center;
}

.trade-ticket .trade-ticket-market .market-price-bar .bar {
    height: 6px;
    width: 60%;
    margin: 20px auto;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

.trade-ticket .trade-ticket-market .market-price-bar .bar .inner {
    background-color: #00AECC;
    height: inherit;
}

.trade-ticket .trade-ticket-market .market-price-bar .bar .inner.option {
    background-color: #ff780b;
}

.trade-ticket .trade-ticket-market .openint-vol {
    display: table;
    width: 100%;
    font-size: 1.3em;
    position: relative;
}

.trade-ticket .trade-ticket-market .openint-vol > div {
    display: table-cell;
    vertical-align: middle;
    height: 100%;
    font-size: 1.3em;
    text-align: center;
    width: 50%;
}

.trade-ticket .trade-ticket-market .openint-vol .info {
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 33px;
    height: 33px;
    background-color: #35D7D2;
    color: #fff;
    vertical-align: middle;
    line-height: 1.3em;
    margin-right: 10px;
    display: inline-block;
}

.trade-ticket .trade-ticket-market .bidask {
    margin-top: 20px;
    display: table;
    width: 100%;
    font-size: 0.9em;
    background-color: #d4d4d4;
    border: 2px solid #fff;
    border-radius: 2px;
    position: relative;
}

.trade-ticket .trade-ticket-market .bidask > div {
    display: table-cell;
    vertical-align: middle;
    height: 100%;
    color: #00AECC;
    font-size: 1.3em;
    text-align: center;
}

.trade-ticket .trade-ticket-market .bidask .spread,
.trade-ticket .trade-ticket-market .bidask .mid {
    color: #46494C;
    font-weight: 400;
    font-size: 1em;
}

.trade-ticket .trade-ticket-market .bidask > div .price {
    color: #fff;
    border: 2px solid #fff;
    border-radius: 2px;
    padding: 4px;
    cursor: pointer;
}

.trade-ticket .trade-ticket-market .bidask .bid .info {
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    background-color: #ff780b;
    color: #fff;
    vertical-align: middle;
    line-height: 1.3em;
    margin-right: 10px;
    display: inline-block;
}

.trade-ticket .trade-ticket-market .bidask .ask .info {
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    background-color: #ff780b;
    color: #fff;
    vertical-align: middle;
    line-height: 1.3em;
    margin-right: 10px;
    display: inline-block;
}

.trade-ticket .trade-ticket-market .bidask .bid .price {
    background-color: #ff780b;
}

.trade-ticket .trade-ticket-market .bidask .bid .price:hover {
    background-color: #fff;
    color: #7D9F00;
    border: 2px solid #7D9F00;
}

.trade-ticket .trade-ticket-market .bidask .ask .price {
    background-color: #ff780b;
}

.trade-ticket .trade-ticket-market .bidask .ask .price:hover {
    background-color: #fff;
    color: #801A1B;
    border: 2px solid #801A1B;
}

.trade-ticket #preview input {
    width: 40%;
    height: 40px;
    color: #fff;
    background-color: #7d9f00;
    border-radius: 2px;
    font-size: 1.4em;
    cursor: pointer;
    border: none;
    padding: 0;
    text-align: center;
    margin: 0 auto 0;
    display: block;
}

.trade-ticket #preview input:hover {
    color: #7d9f00;
    background-color: #fff;
}

.trade-ticket #preview .cancel-order {
    width: 40%;
    height: 40px;
    color: #fff;
    background-color: #35D7D2;
    border-radius: 2px;
    font-size: 1.4em;
    cursor: pointer;
    border: none;
    padding: 0;
    text-align: center;
    margin: 0;
    display: none;
    line-height: 2em;
    text-decoration: none;
    float: right;
}

.trade-ticket #preview .cancel-order:hover {
    color: #35D7D2;
    background-color: #fff;
    text-decoration: none;
}

.trade-ticket #preview #preview-results {
    padding: 10px 0;
    margin: 10px 0;
    text-align: center;
}

.trade-ticket #preview #preview-results h4 {
    background-color: #00a896;
    color: #fff;
}

.trade-ticket #preview #preview-results h4.live {
    background-color: red;
}

.trade-ticket #preview #preview-results h4 span {
    position: relative;
    border: none;
    background-color: transparent;
    vertical-align: baseline;
    display: inline;
    margin: 0;
    line-height: 1em;
    top: 0;
    left: 0;
}

.trade-ticket #preview #preview-results #orderdetails {
    background-color: #fff;
    border: 2px solid #fff;
    border-radius: 2px;
    padding: 10px;
    margin: 10px 0;
    color: #57574E;
    display: none;
}

.trade-ticket #preview #preview-results #orderdetails #warnings {
    padding: 10px 10px 10px 45px;
    margin: 20px 0;
    background: url("../images/exclaim.svg") no-repeat;
    background-position: 0 -40px;
    background-size: 11%;
}

.trade-ticket #preview #preview-results #orderdetails #warnings p {
    margin-bottom: 5px;
}

.trade-ticket #preview #preview-results #orderdetails #order-info {
    background-color: #F7B305;
    color: #fff;
    padding: 10px;
    margin: 20px 0;
}

.trade-ticket #preview #preview-results #orderdetails #order-legs > div {
    margin-bottom: 10px;
    padding: 5px;
    color: #fff;

}

.trade-ticket #preview #preview-results #orderdetails #order-legs .sell {
    background-color: #7d9f00;
}

.trade-ticket #preview #preview-results #orderdetails #order-legs .buy {
    background-color: #801A1B;
}

.trade-ticket #preview #preview-results #orderdetails #order-numbers,
.trade-ticket #preview #preview-results #orderdetails #broker-details {
    color: #9aa3a8;
    width: 100%;
    display: table;
    border-collapse: separate;
    border-spacing: 0px;
}

.trade-ticket #preview #preview-results #orderdetails #order-numbers > div,
.trade-ticket #preview #preview-results #orderdetails #broker-details > div {
    width: 100%;
    display: table-row;
    text-align: left;
    line-height: 2em;
    font-size: 0.9em;
}

.trade-ticket #preview #preview-results #orderdetails #order-numbers #margin {
    display: none;
}

.trade-ticket #preview #preview-results #orderdetails #order-numbers > div > div,
.trade-ticket #preview #preview-results #orderdetails #broker-details > div > div {
    width: 50%;
    display: table-cell;
    border-bottom: 1px solid #e1e4e5;
    text-align: left;
}

.trade-ticket #preview #preview-results #orderdetails #order-numbers .value,
.trade-ticket #preview #preview-results #orderdetails #broker-details .value {
    text-align: right;
    font-weight: 500;
}

.trade-ticket #preview #preview-results #orderdetails #estimatedtotalvalue {
    padding-top: 15px;
    border-top: 2px dashed #fff;
}

.trade-ticket #preview .place-order {
    width: 40%;
    height: 40px;
    color: #fff;
    background-color: #ff780b;
    border-radius: 2px;
    font-size: 1.4em;
    cursor: pointer;
    border: none;
    padding: 0;
    text-align: center;
    margin: 0;
    display: none;
    line-height: 2em;
    text-decoration: none;
}

.trade-ticket #preview .place-order:hover {
    color: #ff780b;
    background-color: #fff;
}

#dialog-confirm-order .dialog-info {
    padding: 35px;
    position: relative;
    top: 50px;
}

#dialog-confirm-order .dialog-info.success {
    background: url("../images/tick-two.svg") no-repeat scroll 14px center / 80px auto;
    padding-left: 115px;

}

#dialog-confirm-order .dialog-info.error {
    background: url("../images/cross-five.svg") no-repeat scroll 14px center / 80px auto;
    padding-left: 115px;

}

.trade-ticket .select-theme {
    overflow: hidden;
    width: 95%;
    -moz-border-radius: 9px 9px 9px 9px;
    -webkit-border-radius: 9px 9px 9px 9px;
    border-radius: 9px 9px 9px 9px;
    border: 1px solid #575756;
    background: url("../images/updown.svg") no-repeat;
    background-position: 97% center;
    background-size: 18px 25px;
    background-color: #fff;
    display: inline-block;
    margin-bottom: 10px;
    margin-top: 10px;
    cursor: pointer;
}

.trade-ticket .select-theme select {
    width: 110%;
    height: 32px;
    background: transparent;
    -webkit-appearance: none;
    padding-left: 5px;
    font-size: 0.8em;
}

.trade-ticket .select-theme.short {
    width: 30.6%;
}

.trade-ticket .select-theme.long {
    width: 46.5%;
}

/* tabs */
#tabs-help {
    width: 100%;
    background-color: rgba(40, 61, 79, 1);
    height: 74px;
    position: absolute;
    top: 130px;
    color: #8A8B8D;
    display: none;

}

#tabs-help ul li a.play {
    background: url("../images/play.svg") no-repeat scroll center 13px rgba(0, 0, 0, 0);
    background-size: 49px 112px;
}

#tabs-help ul li a.play:hover {
    background-position: center -51px;
}

#tabs-help .help-container {
    height: 540px;
    overflow-x: hidden;
    overflow-y: scroll;
    background-color: #687783;
    background-color: rgba(40, 61, 79, 0.7);
    color: #6D6E70;
    border: 2px solid #283D4F;
    -webkit-border-bottom-left-radius: 7px;
    -webkit-border-bottom-right-radius: 7px;
    -moz-border-radius-bottomleft: 7px;
    -moz-border-radius-bottomright: 7px;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    width: 996px;
    font-size: 1.4em;
    line-height: 2em;
    position: relative;
    z-index: 999;
    padding: 0;
}

#tabs-help .help-container p {
    color: #fff;
    text-align: center;
    background-color: #333;
}

#position-edit #tabs-help .help-container,
#position-create #tabs-help .help-container {
    height: 554px;
}

.video-holder {
    position: relative;
    margin-right: 8px;
    width: 38.5%;
    height: 46.7%;
    top: 6px;
    left: 10.3%;
    display: inline-block;

}

#tabs-help ul {
    background-color: inherit;
    margin: 0 auto;
}

#tabs-help ul li {
    background: transparent;
    border: none;
    float: left;
}

#tabs-help ul li > a {
    display: inline-block;
    width: 36px;
    height: 68px;
    padding-right: 48px;
}

#tabs-help #dialog-health .pic {
    background-size: 100% 244%;
    display: inline-block;
    width: 50px;
    height: 50px;
    margin: 0 67px 10px 67px;
    float: left;
}

/*command center tabs */

#tabs-help ul li#bar-graph-help a {
    background: url("../images/command-help.svg") no-repeat -68px 16px;
}

#tabs-help ul li#bar-graph-help.ui-tabs-active a,
#tabs-help ul li#bar-graph-help a:hover {
    background-position: -68px -65px;
}

#tabs-help ul li#pie-chart-help a {
    background: url("../images/command-help.svg") no-repeat -148px 16px;
}

#tabs-help ul li#pie-chart-help.ui-tabs-active a,
#tabs-help ul li#pie-chart-help a:hover {
    background-position: -148px -65px;
}

#tabs-help ul li#icon-help a {
    background: url("../images/help-smiley.svg") no-repeat center 10px;
    background-size: 62%;
}

#tabs-help ul li#icon-help.ui-tabs-active a,
#tabs-help ul li#icon-help a:hover {
    background-position: center -104px;
}

#tabs-help ul li#refresh-help a {
    background: url("../images/command-help.svg") no-repeat -316px 16px;
}

#tabs-help ul li#refresh-help.ui-tabs-active a,
#tabs-help ul li#refresh-help a:hover {
    background-position: -316px -65px;
}

#tabs-help ul li#expiry-help a {
    background: url("../images/command-help.svg") no-repeat -398px 16px;
}

#tabs-help ul li#expiry-help.ui-tabs-active a,
#tabs-help ul li#expiry-help a:hover {
    background-position: -398px -65px;
}

#tabs-help ul li#profile-help a {
    background: url("../images/command-help.svg") no-repeat -481px 16px;
}

#tabs-help ul li#profile-help.ui-tabs-active a,
#tabs-help ul li#profile-help a:hover {
    background-position: -481px -65px;
}

#tabs-help ul li#block-help a {
    background: url("../images/command-help.svg") no-repeat -666px 16px;
    width: 72px;
    margin-left: 20px;
}

#tabs-help ul li#block-help.ui-tabs-active a,
#tabs-help ul li#block-help a:hover {
    background-position: -666px -65px;
}

#tabs-help ul li#break-even-help a {
    background: url("../images/command-help.svg") no-repeat -821px 16px;
    width: 72px;
    margin-left: 40px;
}

#tabs-help ul li#break-even-help.ui-tabs-active a,
#tabs-help ul li#break-even-help a:hover {
    background-position: -821px -65px;
}

#tabs-help ul li#active-account-help a {
    background: url("../images/command-help.svg") no-repeat -869px 16px;
}

#tabs-help ul li#active-account-help.ui-tabs-active a,
#tabs-help ul li#active-account-help a:hover {
    background-position: -869px -65px;
}

#tabs-help .symbols {
    background: url("../images/symbols-expl.png") no-repeat center;
    background-size: 98% 98%;
    background-color: #fff;
}

/*open positions tabs */

#tabs-help ul li#reset-help.ui-tabs-active a,
#tabs-help ul li#reset-help a:hover {
    background-position: 15px -92px;
}

#tabs-help ul li#plus-help a {
    background: url("../images/open-help.svg") no-repeat -77px 16px;
}

#tabs-help ul li#plus-help.ui-tabs-active a,
#tabs-help ul li#plus-help a:hover {
    background-position: -77px -92px;
}

#tabs-help ul li#email-help a {
    background: url("../images/open-help.svg") no-repeat -156px 16px;
}

#tabs-help ul li#email-help.ui-tabs-active a,
#tabs-help ul li#email-help a:hover {
    background-position: -156px -92px;
}

#tabs-help ul li#delete-help a {
    background: url("../images/open-help.svg") no-repeat -234px 16px;
}

#tabs-help ul li#delete-help.ui-tabs-active a,
#tabs-help ul li#delete-help a:hover {
    background-position: -234px -92px;
}

#tabs-help ul li#close-help a {
    background: url("../images/open-help.svg") no-repeat -309px 16px;
}

#tabs-help ul li#close-help.ui-tabs-active a,
#tabs-help ul li#close-help a:hover {
    background-position: -309px -92px;
}

#tabs-help ul li#notes-help a {
    background: url("../images/open-help.svg") no-repeat -387px 16px;
}

#tabs-help ul li#notes-help.ui-tabs-active a,
#tabs-help ul li#notes-help a:hover {
    background-position: -387px -91px;
}

#tabs-help ul li#icon-position-help a {
    background: url("../images/open-help.svg") no-repeat -470px 16px;
}

#tabs-help ul li#icon-position-help.ui-tabs-active a,
#tabs-help ul li#icon-position-help a:hover {
    background-position: -470px -91px;
}

#tabs-help ul li#refresh-position-help a {
    background: url("../images/open-help.svg") no-repeat -550px 16px;
}

#tabs-help ul li#refresh-position-help.ui-tabs-active a,
#tabs-help ul li#refresh-position-help a:hover {
    background-position: -550px -91px;
}

#tabs-help ul li#expiry-position-help a {
    background: url("../images/open-help.svg") no-repeat -739px 16px;
    width: 75px;
    margin-left: 30px;
}

#tabs-help ul li#expiry-position-help.ui-tabs-active a,
#tabs-help ul li#expiry-position-help a:hover {
    background-position: -739px -89px;
}

#tabs-help ul li#profile-position-help a {
    background: url("../images/open-help.svg") no-repeat -618px 16px;
}

#tabs-help ul li#profile-position-help.ui-tabs-active a,
#tabs-help ul li#profile-position-help a:hover {
    background-position: -618px -92px;
}

.secondary-header ul {
    list-style-type: none;
    top: 31px;
    display: flex;
}

.secondary-header ul li {
    float: left;
    min-width: 70px;
    margin-right: 10px;
    text-align: left;
}

.secondary-header ul li span {
    display: block;
    text-align: center;
}

#nav-secondary-positions ul li a#all-open {
    background: url("../images/open.svg") no-repeat center top;
}

#nav-secondary-positions ul li a#all-closed {
    background: url("../images/closed.svg") no-repeat center top;
}

ul li a#import {
    background: url("../images/import.svg") no-repeat center top;
}

ul li a#covered-call {
    background: url("../images/covered-call.svg") no-repeat center top;
}

ul li a#collar {
    background: url("../images/collar.svg") no-repeat center top;
}

ul li a#covered-call-fokas {
    background: url("../images/covered-call-fokas.svg") no-repeat center top;
    -webkit-background-size: cover;
    background-size: cover;
}

ul li a#collar-fokas {
    background: url("../images/collar-fokas.svg") no-repeat center top;
    -webkit-background-size: cover;
    background-size: cover;
}

ul li a#naked-put-fokas {
    background: url("../images/collar-fokas.svg") no-repeat center top;
    -webkit-background-size: cover;
    background-size: cover;
}

ul li a#naked-call {
    background: url("../images/naked-call.svg") no-repeat center top;
}

ul li a#naked-put {
    background: url("../images/naked-put.svg") no-repeat center top;
}

ul li a#long-call {
    background: url("../images/LC_gray.svg") no-repeat center;
}

ul li a#long-put {
    background: url("../images/LP_gray.svg") no-repeat center;
}

ul li a#stock {
    background: url("../images/stock.svg") no-repeat center top;
}
ul li a#short-stock {
    background: url("../images/stock.svg") no-repeat center top;
}
ul li a#cryptocurrency {
    background: url("../images/CR-Grey.svg") no-repeat center top;
}

ul li a#cryptocurrency:hover {
    background: url("../images/CR-Green.svg") no-repeat center top;
}

ul li a#debit-call-spread, ul li a#debit-put-spread {
    background: url("../images/DS-Grey.svg") no-repeat center top;
}

ul li a#debit-call-spread:hover, ul li a#debit-put-spread:hover {
    background: url("../images/DS-Green.svg") no-repeat center top;
}

ul li a#credit-call-spread, ul li a#credit-put-spread {
    background: url("../images/CS-Grey.svg") no-repeat center top;
}

ul li a#credit-call-spread:hover, ul li a#credit-put-spread:hover {
    background: url("../images/CS-Green.svg") no-repeat center top;
}

.secondary-header ul li a {
    display: inline-block;
    height: 50px;
    width: 50px;
    cursor: pointer;
    position: relative;
    left: 18px;
}

.secondary-header ul li a#covered-call-fokas {
    left: 38px;

}

.secondary-header ul li a:hover {
    background-position: center bottom !important;
}

ul li a#long-call:hover {
    background: url("../images/LC_green.svg") no-repeat center !important;
}

ul li a#long-put:hover {
    background: url("../images/LP_green.svg") no-repeat center !important;

}
ul li a#iron-condor {
    background: url("../images/IC.svg") no-repeat center !important;
}

ul li a#iron-condor:hover {
    background: url("../images/IC Hover.svg") no-repeat center !important;
}

.secondary-header ul li a:hover ~ span {
    color: #45E2FF;
}

.secondary-header ul li a.pricer:hover ~ span {
    color: #6FE670;
}

/*lower  container */

#lower-container {
    background-color: #edf0f1;
    height: inherit;
    min-height: 560px;
    position: relative;
    top: 130px;
    z-index: 9;
}

/*500 page */

#server.public #nav {
    margin-left: 0;
}

/*public stuff*/
.public #nav {
    margin-left: 244px;
}

.public #logo {
    font-family: Helvetica, sans-serif;
    font-size: 1.6em;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0;
    line-height: 1.7em;
    float: left;
    color: #a5a5a5;
    margin-left: 20px;

}

.navbar-default .navbar-nav > li > a.standard-login {
    width: 84px;
    border-width: 1px;
    border-style: solid;
    border-color: #22BFB2;
    background-color: #22BFB2;
    border-radius: 3px;
    text-align: center;
    margin-top: 5px;
    padding: 10px;
    color: #fff;
    font-weight: 400;

}

.navbar-default .navbar-nav > li > a.standard-login:hover {
    background-color: #fff;
    color: #22BFB2;

}

.public .navbar-default {
    background-color: #fff;
}

.public .navbar-brand {

    padding: 0 0 0 10px;
    margin: 0 10px;
    font-family: Helvetica, sans-serif;
    font-size: 1.6em;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0;
    line-height: 2.2em;
    color: #a5a5a5;

}

.public .navbar-brand:hover {
    color: #22beb3;
}

.public .navbar-text {
    margin: 0 5px 0 0;
}

.public #user {
    margin-right: 15px;
}

.public #lower-container {
    top: 20px;
    overflow: hidden;
}

.public #footer {
    top: 70px;
    margin: 0 auto;
}

/*main*/

#main {
    padding: 20px;
}
.public #main {
    margin: 0 auto;
}
/*footer*/

#footer {
    clear: both;
    color: #A6A8AB;
    font-size: 12px;
    height: 165px;
    font-family: 'Open Sans', sans-serif;
    position: relative;
    top: 150px;
    z-index: 8;

}

#footer p {
    margin-bottom: 10px;
    padding-left: 5px;
}

#footer #patent {
    color: #22beb3;
}

#footer ul li {
    float: left;
}

#footer ul li > a {
    text-decoration: none;
    margin: 0 5px;
}

#footer ul li > a:hover {
    color: #ff780b;
}

#footer ul li a.twitter {
    background: url("../images/x.png") no-repeat center bottom;
    width: 40px;
    height: 40px;
    display: inline-block;
    margin-top: -9px;
    background-size: 100%  ;
}

#footer ul li a.twitter:hover {
    background-position: center top;

}

#footer ul li.qmc-footer-text {
    width: 74%;
    margin-top: 10px;
}

#footer ul li:first-child a {
    margin: 0;
}

/*view dialog*/
#viewDialog {
    display: none;
}

/*login dialog ajax*/
#login_form {
    position: relative;
    right: 0;
    top: 2px;
    z-index: 99;
    height: 100%;

}

#login_form input {
    height: 76%;
    border-radius: 3px;
    border: 1px solid #808080;
    padding-left: 10px;
    cursor: pointer;
    width: 200px;
}

#login_form input#id_password {
    padding-right: 28px;
}

#login_form input[type='submit'] {
    background-color: #22BCB1;
    color: #fff;
    width: 70px;
    padding-left: 0;
    top: 0;
    position: relative;
    margin-right: 5px;
    border: 1px solid #22BCB1;
}

#login_form input[type='submit']:hover {
    background-color: #fff;
    color: #22BCB1;
}

#login_form #all-errors {
    color: #801A1D;
    position: relative;
    top: -12px;
}

#login_form #password-reset-button {
    position: absolute;
    right: 85px;
    top: 14px;
    z-index: 999;
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../images/exclaim-three.svg") no-repeat center top;
    background-size: 85%;
}

#login_form #password-reset-button:hover {
    background-position: center -32px;
}

/*form errors*/

.errorlist {
    color: red;
}

/* name change form */

#change-user .helptext {
    display: none;
}

/* free trial page and login page */
.form-holder {
    position: relative;

}

.form-holder form p {

    margin-top: 20px;

}

.form-holder form #meter {

    width: 35%;
    margin-top: 20px;
    display: none;

}

.form-holder label {
    display: block;
    margin-bottom: 10px;
    color: #cbcbcb;
}

.form-holder input {

    background-color: #FFFFFF;
    border: 2px solid #C8C8C8;
    padding: 10px;
    width: 100%;
}

#free-subs .dialog #dialog-email-value {
    border: 1px solid #575756;
    border-radius: 2px;
    font-weight: 100;
    height: 35px;
    margin-top: 20px;
    padding-left: 10px;
    width: 80%;

}

#free-subs #lower-container {
    z-index: 2;
    background: transparent url("../images/themes/kane/shutterstock_2370763221.png") no-repeat center center;
    background-size: cover;
}

#free-subs #lower-container #main #iframe-holder {
    position: relative;
    padding-bottom: 56.25%; /* proportion value to aspect ratio 16:9 (9 / 16 = 0.5625 or 56.25%) */
    height: 0;
    overflow: hidden;
    margin-right: 10px;
    margin-bottom: 10px;
}

#free-subs #lower-container #main iframe {

    background-color: #8E8E8E;
    background-color: rgba(0, 0, 0, 0.44);
    border-radius: 5px;
    -pie-background: rgba(0, 0, 0, 0.44);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#free-subs #lower-container #main .g-recaptcha iframe {

    position: relative;
    width: inherit;
    height: 73px;
    background-color: transparent;
}

#free-subs #lower-container #main .product {
    z-index: 6;
    background-color: #8E8E8E;
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 5px;
    padding: 12px 53px 10px;
    -pie-background: rgba(0, 0, 0, 0.7);
    width: 55%;
    margin-left:auto;
}

#free-subs #form-holder #terms {
    margin-top: 30px;
}

#free-subs #form-holder #terms a {
    text-decoration: none;
    color: #48b2cf;
}

.helptext {
    display: none;
    position: relative;
    top: 5px;
}

#free-form .errorlist {
    margin-top: -18px;
}

#free-subs-success #lower-container p {
    margin: 20px auto;
}

#free-subs #free-form {
    width: 100%;
    margin: 0 auto;
    position: relative;
}

#free-subs #free-form h3 {
    text-align: center;
    font-weight: 400;
    font-size: 3.2em;
    color: #fff;
    font-family: Helvetica, sans-serif;
    position: relative;
    top: 20px;

}

#free-subs #free-form h4 {
    font-size: 1.24em;
    font-weight: 300;
    margin-top: 30px;
    text-align: center;
    color: #fff;
    font-family: open-sans, sans-serif;
    line-height: 1.3em;
    position: relative;
    top: 20px;

}

#free-subs #free-form input {
    color: #b2b2b2;
    font-family: open-sans, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    min-height: 31px;
    width: 100%;
    background-color: #f2f2f2;
    border-color: #c4c4c4;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
    max-width: inherit;
}

#free-subs #free-form input:hover {
    background-color: #fff;
    color: #4f4f4f;

}

#free-subs #free-form select {
    height: 50px;
    font-weight: 400;
    font-size: 1.2em;
    background-color: #f2f2f2;
    border-radius: 5px;
    width:40%;
    padding:5px;
}

#free-subs #free-form input[type='submit'] {
    background-color: #22beb3;
    border: 1px solid #22beb3;
    color: #4f4f4f;
    display: block;
    width: 100%;
    cursor: pointer;
    margin-top: 20px;
}

#free-subs #free-form input[type='submit']:hover {
    background-color: #fff;
    color: #22beb3;

}

#free-subs #terms {
    font-size: 0.95em;
    color: #cbcbcb;
    padding-bottom: 20px;
}

#free-subs #terms a {
    color: #32fcee;
    cursor: pointer;
}

#free-subs .helptext {
    color: #cbcbcb;
}

/*features*/

#features #main {
    display: table;
}

#features #main > div {
    display: table-cell;
    width: 33%;
}

#features #main > div p {
    position: absolute;
    color: #fff;
    font-size: 2em;
    text-align: center;
    line-height: 2em;
    width: 100%;
}

#features #main p#hello {
    top: 140px;
}

#features #main .holder {
    position: relative;
    cursor: pointer;
    z-index: 9;
}

#features #main .holder .info {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    padding: 5px;
    width: 97%;
    height: 97%;
    display: none;
    z-index: 10;
    background-color: #fff;
    color: #000;
}

#features #main > div:first-child > div,
#features #main > div:nth-child(3) > div {
    height: 180px;
}

#features #main > div:first-child > div:first-child {
    background: url("../images/bullseye.svg") no-repeat center / 101px 101px;
    background-color: #DA3417;
}

#features #main > div:first-child > div:last-child {
    background-color: #266F87;
}

#features #main > div:nth-child(2) > div:first-child {
    height: 360px;
    background-color: #8BC839;
}

#features #main > div:nth-child(2) > div:last-child {
    height: 180px;
    background-color: #A0CDE8;
}

#features #main > div:nth-child(3) > div:first-child {
    background-color: #22B7AC;
}

#features #main > div:nth-child(3) > div:nth-child(2) {
    background-color: #207280;
}

#features #main > div:nth-child(3) > div:last-child {
    background-color: #22beb3;
}

/*subs page*/

#subs #main #top {
    height: 250px;
    background-color: #f4f4f4;
    display: table;
    width: 100%;
    position: relative;
}

#subs #main #top > div {
    display: table-cell;
    width: 33%;
    height: 100%;
    position: relative;
}

#subs #main #top > div:first-child {
    position: absolute;
    top: 73px;
    left: 25px;
}

#subs #main #top > div:nth-child(2) {
    position: absolute;
    top: 88px;
    left: 305px;
}

#subs #main #top > div:nth-child(3) {
    position: absolute;
    top: 39px;
    left: 580px;
}

#subs #main #top > div img {
    position: absolute;
}

#subs #main #bottom p {
    color: #474747;
    font-size: 2em;
    position: absolute;
    top: 51px;
    width: 100%;
    left: 13px;
}

#subs #main #bottom {
    height: 585px;
    background-color: #fff;
    width: 100%;
}

#subs #main #bottom > div {
    position: relative;
    left: 48px;
    top: 107px;
}

#subs #main #bottom .form-holder {
    float: left;
    width: 30%;
    color: #fff;
    bottom: 17px;
}

#subs #main #bottom .form-holder form span {
    display: block;
    margin: 0 auto;
    padding: 18px 0;
    text-align: center;
    width: 90%;
}

#subs #main #bottom .form-holder form span:nth-of-type(1) {
    font-size: 2em;
}

#subs #main #bottom .form-holder form span:nth-of-type(2) {
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    font-size: 1.5em;
}

#subs #main #bottom .form-holder form span#sub-price {
    display: inline;
    font-size: 1em;
    border: none;

}

#subs #main #bottom .form-holder form span#sub-price.discount {
    color: red;
    text-decoration: line-through;

}

#subs #main #bottom .form-holder form span#sub-discount {
    display: inline;
    font-size: 1em;
    border: none;
    color: #6FE570;

}

#subs #main #bottom .form-holder form input {
    position: fixed;
    top: -1000px;
}

#subs #main #bottom .form-holder form label {
    background-color: #474747;
    color: #fff;
    cursor: pointer;
    position: relative;
    min-height: 219px;
}

#subs #main #bottom .form-holder:nth-of-type(1) form label {
    background-color: #7D9D00;
}

#subs #main #bottom .form-holder:nth-of-type(2) form label {
    background-color: #EB6702;
}

#subs #main #bottom .form-holder:nth-of-type(3) form label {
    background-color: #004B80;
}

#subs #main #bottom .form-holder form label:hover {
    background-color: #474747;
    color: #32fcee;
}

/*checkout*/
#checkout #payment,
#checkout label[for="id_paymentmethod"] {
    display: none;
}

#checkout #lower-container,
#pay-confirm #lower-container {
    padding-bottom: 50px;
}

#checkout #main {
    top: 20px;
    padding: 0;
    position: relative;
    background-color: #F4F4F4;
}

#checkout #main .dialog {
    display: none;
}

#checkout #main > div > div:first-child,
#pay-confirm #main > div > div:first-child {
    background-color: #fff;
}

.fake-checkout-header {
    background-color: #283d4f;
    color: #fff;
    font-size: 1.2em;
    height: 42px;
    line-height: 2.3em;
    text-align: center;
}
.checkout-error{
    color: red;
    text-align: center;
    padding: 20px;
}
.checkout-error p{
    margin-bottom: 20px;
}


#pay-confirm #main #beginner-monthly-image,
#pay-confirm #main #beginner-yearly-image{
    background: url("../images/gorilla-beginner.png") no-repeat center;
    width: 335px;
    height: 268px;
    position: relative;
    top: 0;
    left: 36px;
    background-size: 120% 120%;
}

#pay-confirm #main #intermediate-monthly-image,
#pay-confirm #main #intermediate-yearly-image{
    background: url("../images/gorilla-int.png") no-repeat center;
    width: 348px;
    height: 287px;
    position: relative;
    top: 0;
    background-size: 120%;
    right: -14px;
}

#pay-confirm #main #advanced-monthly-image,
#pay-confirm #main #advanced-yearly-image{
    background: url("../images/gorilla-advanced.png") no-repeat center;
    width: 430px;
    height: 268px;
    position: relative;
    top: 0;
    background-size: 120%;
    left: 7px;
}

#checkout #main .info,
#confirm #main .info,
#pay-confirm #main .info {
    bottom: 0;
    margin: 14px auto 0;
    padding: 10px;
    position: relative;
    width: 60%;
    color: #fff;
}

#checkout #main #choose {
    background-color: #22bcb1;
}

#checkout #main .info > span,
#confirm #main .info > span,
#pay-confirm #main .info > span {
    display: block;
    text-align: center;
    padding: 10px 0;
}

#checkout #main .info > span #highlight,
#confirm #main .info > span #highlight,
#pay-confirm #main .info > span #highlight {
    color: #6FE570;
}

#checkout #main .info > span:nth-child(1),
#confirm #main .info > span:nth-child(1),
#pay-confirm #main .info > span:nth-child(1) {
    font-size: 1.5em;
    text-transform: uppercase;
}

#checkout #main .info > span:nth-child(2),
#confirm #main .info > span:nth-child(2),
#pay-confirm #main .info > span:nth-child(2) {
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

#checkout #main .info > span:nth-child(3),
#confirm #main .info > span:nth-child(3),
#pay-confirm #main .info > span:nth-child(3) {
    font-size: 1.4em;
    text-transform: uppercase;
}

#checkout #main .info > span:nth-child(3) > span.discount,
#confirm #main .info > span:nth-child(3) > span.discount,
#pay-confirm #main .info > span:nth-child(3) > span.discount {
    color: red;
    text-decoration: line-through;
}

#checkout #main .info > span:nth-child(3) > span#sub-discount,
#confirm #main .info > span:nth-child(3) > span#sub-discount,
#pay-confirm #main .info > span:nth-child(3) > span#sub-discount {
    color: #6FE570;
    margin-right: 7px;

}

#pay-confirm #main #beginner-monthly.info,
#pay-confirm #main #beginner-yearly.info{
    background-color: #7D9D00;
}


#pay-confirm #main #intermediate-monthly.info,
#pay-confirm #main #intermediate-yearly.info{
    background-color: #EB6702;
}

#pay-confirm #main #advanced-monthly.info,
#pay-confirm #main #advanced-yearly.info{
    background-color: #004B80;
}
#pay-confirm #main #blank-membership.info{
    background-color: #004B80;
}
#checkout #main #discount-info,
#confirm #main #discount-info,
#pay-confirm #main #discount-info {
    text-align: center;
    color: red;
    margin-top: 20px;
    font-weight: 400;
}

#checkout #main #pay-delay,
#confirm #main #pay-delay {
    text-align: center;
    color: red;
    margin-top: 20px;
    font-weight: 400;
}

#checkout #main form {
    margin-left: 53px;
    margin-top: 40px;
    position: relative;
    width: 90%;
}

#checkout #main table {
    width: 82%;
    margin-top: 30px;
}

#checkout #main form input, #checkout #main form select, .checkout-input {
    height: 35px;
    width: 100%;
    padding-left: 10px;
    color: #b2b2b2;
    font-family: open-sans, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    min-height: 31px;
    background-color: #f2f2f2;
    border-color: #c4c4c4;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
}

#checkout #main form input:hover, .checkout-input:hover {
    background-color: #fff;
    color: #4f4f4f;
}

#checkout #main form input[type="radio"] {
    width: inherit;
    height: inherit;

}

#checkout #main form input[type="submit"] {
    background-color: #22bcb1;
    border: 1px solid #22bcb1;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    font-weight: 400;
    height: 45px;
    margin: 30px 0 30px 0;
}

#checkout #main form input[type="submit"]:hover {
    background-color: #fff;
    color: #22BCB1;

}

.checkout-btn {
    background-color: #22bcb1;
    border: 1px solid #22bcb1;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    font-size: 1.5em;
    height: 35px;
    margin: 25px 0 25px 0;
    padding: 10px;
}

.checkout-btn:hover {
    background-color: #fff;
    color: #22BCB1;

}

#checkout #main form table th {
    font-size: 2em;
    color: #7D9D00;
    font-weight: normal;
    height: 40px;
}

#checkout #main form table .checkout-header {
    font-size: 2em;
    color: #7D9D00;
    font-weight: normal;
    height: 40px;
    text-align: center;
}

#checkout #main form table tr {
    height: 35px;
}

#checkout #main form table td {
    vertical-align: middle;
    font-weight: 100;
}

#checkout #main form table td span {
    color: #7D9D00;
    font-size: 1.5em;
}

#checkout #main form table #payment li {
    float: left;
    margin-right: 5px;
}

#checkout .dialog #dialog-email-value {
    border: 1px solid #575756;
    border-radius: 2px;
    font-weight: 100;
    height: 35px;
    margin-top: 20px;
    padding-left: 10px;
    width: 80%;

}
#phase-1 .form-group {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    flex-wrap: wrap;
}

#phase-1 .form-group label {
    width: 180px;
    text-align: right;
    padding-right: 15px;
    flex-shrink: 0;
}

#phase-1 .form-group input {
    flex: 1;
    margin-right: 10px;
}

.form-section-label {
    text-align: center;
    margin-bottom: 15px;
    font-weight: bold;
}
#phase-1 .field-error {
    width: 100%;
    padding-left: 195px;  /* line up with the input, not the label */
    color: #df1b41;
    font-size: 13px;
    margin-top: 4px;
}
/*pay confirm*/

#pay-confirm #main {
    padding: 0;
    position: relative;
    top: 20px;
    background-color: #fff;

}
#pay-confirm #phase-1{
    margin-top: 20px;
}
#pay-confirm #email-error{
    padding-top: 10px;
    color: red;
}
#pay-confirm h4{
    margin-bottom: 10px;
    margin-top: 20px;
    text-align: center;
}
.public .error,
.logged .error {
    color: red;
}

#pay-confirm #main #locker {
    background: url("../images/padlock-one.svg") no-repeat right top;
    background-size: auto;
    position: absolute;
    top: 70px;
    right: 35px;
    width: 117px;
    height: 158px;
}

#pay-confirm #main #card-logo {
    position: absolute;
    bottom: 25px;
    right: 35px;
}

#pay-confirm #main #header {
    height: 40px;
    color: #fff;
    text-align: center;
    background-color: #283D4F;
    font-size: 1.2em;
    line-height: 2em;
}

#pay-confirm #main div:nth-of-type(2) {

    text-align: center;
    background-color: #fff;
}

#pay-confirm #main .col-md-5,
#checkout #main .col-md-5 {

    background-color: #f2f2f2 !important;
}

#pay-confirm #main form {
    width: 80%;
    margin: 30px auto;
}

#pay-confirm #main form table {
    width: 100%;
}

#pay-confirm #main form table tr {
    height: 35px;
}

#pay-confirm #main form table td {
    vertical-align: middle;
    font-weight: 100;
    padding-right: 20px;
}

#pay-confirm #main form #error-message {
    color: red;
    font-size: 0.8em;
    margin: 0;
    padding-bottom: 20px;
}

#pay-confirm #main form input[type="submit"] {
    background-color: #22bcb1;
    border: 1px solid #22bcb1;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    font-size: 1.5em;
    font-weight: 400;
    height: 45px;
    width: 280px;
    margin: 30px 15px 30px 0;
    position: relative;
    left: 0;
    padding: 9px;
}

.payment-form input[type="submit"]:hover {
    background-color: #fff;
    color: #22BCB1;

}

.payment-form input, .payment-form form select {
    height: 35px;
    padding-left: 10px;
    color: #b2b2b2;
    font-family: open-sans, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    min-height: 31px;
    background-color: #f2f2f2;
    border-color: #c4c4c4;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
}

.payment-form input#id_credit_number {
    background-image: url("../images/cc-images.png"), url("../images/cc-images.png");
    background-position: 2px -92px, 315px -44px;
    background-size: 120px 361px, 120px 361px;
    background-repeat: no-repeat;
    padding-left: 55px;
    padding-right: 23px;
}

.payment-form input#id_credit_number.visa {
    background-position: 2px -126px, 260px -44px;
}

.payment-form input#id_credit_number.visa_electron {
    background-position: 2px -205px, 260px -44px;
}

.payment-form input#id_credit_number.mastercard {
    background-position: 2px -193px, 260px -44px;
}

.payment-form input#id_credit_number.maestro {
    background-position: 2px -289px, 260px -44px;
}

.payment-form input#id_credit_number.discover {
    background-position: 2px -261px, 261px -44px;
}

.payment-form input#id_credit_number.amex {
    background-position: 2px -295px, 260px -44px;
}

.payment-form input#id_credit_number.jcb {
    background-position: 2px -331px, 260px -44px;
}

.payment-form input#id_credit_number.valid.visa {
    background-position: 2px -126px, 260px -66px;
}

.payment-form input#id_credit_number.valid.visa_electron {
    background-position: 2px -205px, 260px -66px;
}

.payment-form input#id_credit_number.valid.mastercard {
    background-position: 2px -193px, 260px -66px;
}

.payment-form input#id_credit_number.valid.maestro {
    background-position: 2px -289px, 260px -66px;
}

.payment-form input#id_credit_number.valid.discover {
    background-position: 2px -261px, 261px -66px;
}

.payment-form input#id_credit_number.valid.amex {
    background-position: 2px -295px, 260px -66px;
}

.payment-form input#id_credit_number.valid.jcb {
    background-position: 2px -331px, 260px -66px;
}

.payment-form form input:hover {
    background-color: #fff;
    color: #4f4f4f;
}

#pay-confirm #main form select {
    border: 1px solid #575756;
    border-radius: 2px;
    height: 35px;
    width: 50%;
    padding-left: 10px;
}

#pay-confirm #main form #divider {
    font-weight: 400;
    font-size: 2em;
    vertical-align: middle;
}

/*confirm*/
#confirm #lower-container {
    padding-bottom: 50px;
}

#confirm #main {
    padding: 0;
    position: relative;
    top: 20px;
    background-color: #f4f4f4;

}

#confirm #main > div > div:first-child {
    background-color: #fff;
}

#confirm #main h4 {
    color: #ffffff;
    font-size: 1.4em;
    text-align: center;
    height: 30px;
    font-weight: normal;
    margin-top: 10px;
    line-height: 1.4em;
    background-color: #7d9d00;
}

#confirm .error {
    color: red;
}

#confirm #terms,
#pay-confirm #terms {
    padding: 20px;
}

#confirm #main #header {
    height: 40px;
    color: #fff;
    text-align: center;
    background-color: #283D4F;
    font-size: 1.2em;
    line-height: 2em;
}

#confirm #main form input[type="submit"] {
    background-color: #22bcb1;
    border: 1px solid #22bcb1;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    font-size: 1.5em;
    font-weight: 400;
    height: 45px;
    width: 25%;
    margin: 30px 15px 30px 0;
    position: relative;
    left: 242px;
    padding: 5px;
}

#confirm #main form input[type="submit"]:hover {
    background-color: #fff;
    color: #22BCB1;

}

#confirm #main table {
    width: 65%;
    margin: 0 auto;
    font-weight: 100;
}

#confirm #main table tr {
    height: 30px;
}

#confirm #main table td {
    vertical-align: middle;
}

#confirm #main table tr.discount-row {
    color: red;
    font-weight: 800;
}

#confirm #main #payment {
    text-align: center;
    margin: 20px;
}

#confirm.public #main .info {
    margin: 43px auto 0;
}

#confirm.public #main #beginner-image {
    top: 30px;
}

#confirm.public #main #intermediate-image {
    top: 20px;
}

#confirm.public #main #advanced-image {
    top: 7px;
}

/*subscription not allowed */
#no-subs #info {
    background: url("../images/signup-bg.png") repeat scroll center center rgba(0, 0, 0, 0);
    margin: 50px auto;
    padding: 35px;
    position: relative;
    width: 70%;
}

#no-subs #lower-container p {
    margin: 20px auto;
}

/*groupings and user stock */

#accounts, #user-tracked-stock {
    position: relative;
}

#accounts #parent-form .helptext,
#user-tracked-stock #parent-form .helptext {
    display: none;
    left: 0;
    position: absolute;
    top: 80px;
    width: 100%;
}

#accounts #parent-form .inline,
#user-tracked-stock #parent-form .inline,
#user-brokers #parent-form .inline {
    background-color: #e6eaec;
    border: 1px solid #878787;
    float: left;
    margin-bottom: 20px;
    margin-right: 20px;
    width: 30%;
    position: relative;
}

#user-brokers #parent-form .inline.login-active {
    background-color: #ff780b;

}

#user-brokers #parent-form .inline.broker-active {
    background-color: #7d9f00;

}

#accounts #parent-form .inline.trade-plan {
    background-color: #C2BCA9;
}
#accounts #parent-form .inline.competitive {
    background-color: #74bf4e;
    min-height: 617px;
}
#accounts #parent-form span.tooltips {
    background: url(../images/info.svg) no-repeat 100% 0;
    background-size: 30px 66px;
    cursor: pointer;
    position: absolute;
    top: -12px;
    right: 21px;
    width: 33px;
    height: 28px;
    z-index: 9999;
}

#accounts #parent-form span.tooltips:hover {
    background-position: center bottom;
}

#accounts #parent-form .active-account {
    background-color: #84bfda !important;
}

#accounts #parent-form input {

    background-color: #FFFFFF;
    border: 2px solid #C8C8C8;
    padding: 10px;
    width: 100%;
}

#accounts #parent-form label,
#user-tracked-stock #parent-form label,
#user-brokers #parent-form label {

    margin-bottom: 10px;
    display: inline-block;
}

#accounts #parent-form .fees-month-label label {
    margin-bottom: 0;
}

#accounts #parent-form,
#user-tracked-stock #parent-form,
#user-brokers #parent-form {
    position: relative;
}

#accounts #parent-form fieldset .fieldWrapper,
#user-tracked-stock #parent-form fieldset .fieldWrapper,
#user-brokers #parent-form fieldset .fieldWrapper {
    position: relative;
}

#user-tracked-stock #parent-form fieldset .fieldWrapper.inline-value {
    display: inline-block;
    width: 48%;
}

#accounts #parent-form .inline fieldset .fieldWrapper input,
#user-tracked-stock #parent-form .inline fieldset .fieldWrapper input,
#user-brokers #parent-form .inline fieldset .fieldWrapper input {
    border: medium none;
    color: #7d9f00;
    font-size: 1.6em;
    height: 45px;
    margin-bottom: 15px;
    width: 93%;
}

#accounts #parent-form .inline fieldset .fieldWrapper input[readonly] {
    background-color: #c2c4c4;
}

#accounts #parent-form .inline fieldset .fieldWrapper-small {
    display: inline-block;
    width: 46%;
}

#accounts #parent-form .inline fieldset .fixed-amount.fieldWrapper-small {
    top: -14px;
    position: relative;
}

#accounts #parent-form .inline fieldset .fieldWrapper-small-labelfloat {
    display: inline-block;
    margin-top: 10px;
    width: 46%;
}

#accounts #parent-form .inline fieldset .fieldWrapper-small input {
    width: 98%;
    border: medium none;
    color: #7d9f00;
    font-size: 1.6em;
    height: 48px;
    margin-bottom: 15px;
}

#accounts #parent-form .inline fieldset input.disabled {
    background-color: #c2c4c4;
}

#accounts #parent-form .fieldWrapper-small label {
    display: block;
}

#accounts #parent-form .inline fieldset .fieldWrapper-small-labelfloat input {
    border: medium none;
    color: #7d9f00;
    font-size: 0.7em;
    height: 32px;
    margin-bottom: 25px;
    padding-left: 4px;
    padding-right: 4px;
    width: 38%;
}

#accounts #parent-form .fieldWrapper-small-labelfloat label {
    background-color: #283d4f;
    color: #fff;
    font-size: 0.6em;
    height: 31px;
    line-height: 3.5em;
    padding: 0;
    text-align: center;
    width: 57%;
}

#accounts #parent-form .inline fieldset .check-holder {
    width: 93%;
    margin-bottom: 20px;

}

#accounts #parent-form .inline fieldset .check-holder .check label {
    top: 0;
}

#accounts #parent-form fieldset #forms {
    width: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
}

#accounts #parent-form fieldset #forms fieldset,
#user-tracked-stock #parent-form fieldset #forms fieldset,
#user-brokers #parent-form fieldset #forms fieldset {
    position: relative;
    left: 10px;
    margin: 20px 0;
}

#user-tracked-stock #parent-form fieldset #forms fieldset {
    width: 96%;
}

#accounts #parent-form .delete-row:hover {
    background-color: #fff;
    color: #22beb3;
}

#accounts #parent-form .add-row,
#user-tracked-stock #parent-form .add-row,
#user-brokers #parent-form .add-row {
    background: url("../images/plus-four.svg") no-repeat center #fff;
    background-size: 146px 147px;
    border: 1px dashed #878787;
    color: #878787;
    cursor: pointer;
    float: left;
    height: 599px;
    padding: 10px;
    text-align: center;
    text-decoration: none;
    width: 28%;
    font-size: 1.4em;
    line-height: 9em;
    margin-bottom: 10px;
}

#accounts #parent-form .add-row:hover,
#user-tracked-stock #parent-form .add-row:hover,
#user-brokers #parent-form .add-row:hover {
    background: url("../images/plus-five.svg") no-repeat center #fff;

}

#accounts #parent-form .inline-taxes {
    background-color: #22beb3;
    color: #fff;
    padding: 13px;
    cursor: pointer;
    text-align: center;
    font-size: 1.3em;
    border-radius: 2px;
    margin-left: 10px;
    position: relative;
    top: 2px;
    left: 123px;
    font-weight: 200;
    text-decoration: none;
}

#accounts #parent-form .inline-taxes:hover {
    background-color: #fff;
    color: #22beb3;
}
#accounts #parent-form #competition-image {
    margin-left: 10px;
    position: relative;
    top: -15px;
    left: -15px;
    background: url(../images/trophy.svg)top left no-repeat;
    background-size: 20%;
    height: 60px;
}
#matrix #y_axis #accounts {
    position: relative;
    top: 7px;
    font-size: 0.9em;
    height: 479px;
    overflow-x: hidden;
    overflow-y: scroll;
    line-height: 1.7em;
}

#matrix #y_axis #accounts .desc {
    background-color: #5F707D;
    color: #FFFFFF;
    display: inline-block;
    width: 100%;
    height: 33px;
    border-radius: 2px;
    font-weight: 400;
}

#matrix #y_axis #accounts .desc:hover {
    background-color: #B0B5BC;
}

#matrix #x_axis #tax-rates {
    border: medium none;
    min-height: 560px;
    left: 17px;
    position: relative;
    top: 11px;
    width: 96%;
}

#matrix #x_axis #tax-rates #data {
    background-color: #e6eaec;
    height: 100%;
    min-height: 490px;
    float: left;
    width: 100%;
}

#matrix #x_axis #tax-rates #data > form {
    left: 25px;
    position: relative;
    top: 16px;
    width: 93%;
    padding-bottom: 30px;
}

#matrix #x_axis #tax-rates .form-holder {
    margin-bottom: 15px;
}

#matrix #x_axis #tax-rates .header {
    background-color: #f2f2f2;
    color: #283d4f;
    font-size: 1.7em;
    font-weight: 400;
    height: 45px;
    line-height: 1.8em;
    padding-left: 20px;
    position: relative;
    border: none;
    cursor: pointer;
}

#matrix #x_axis #tax-rates #footer {
    background-color: #283d4f;
    clear: both;
    height: 40px;
    top: 0;
    font-size: 1em;
    line-height: 2.5em;
    color: #fff;
    padding-left: 10px;
    margin-bottom: 30px;
}

#matrix #x_axis #tax-rates .header .ui-accordion-header-icon {
    display: inline-block;
    height: 100%;
    position: absolute;
    right: 0;
    width: 50px;
    background: url(../images/plus-two.svg) no-repeat center 3px #283d4f;
    background-size: 44px 90px;
}

#matrix #x_axis #tax-rates .header .ui-accordion-header-icon:hover {
    background-position: center -48px;
}

#matrix #x_axis #tax-rates .header.ui-state-active {
    background-color: #98d5cf;
    background-image: none;
    border: none;
}

#profile .dialog .success {
    background: url("../images/tick-two.svg") no-repeat scroll 14px center / 80px auto;
    padding: 35px 35px 35px 115px;
    position: relative;
    top: 50px;

}

#profile .dialog .success-no {
    background: url("../images/cross-five.svg") no-repeat scroll 14px center / 80px auto;
    padding: 35px 35px 35px 115px;
    position: relative;
    top: 50px;

}

/*positions*/

.calc-error {
    background-color: #ff780b !important;
    color: #fff;
    padding: 5px;
}

.red {
    background-color: #801A1D !important;
    color: #fff;
    padding: 5px;
}

.red-font {
    color: #801A1D !important;
}

.green-font {
    color: #7D9F00 !important;
}

.bright-green-font {
    color: #66FF00;
}

.bright-red-font {
    color: red;
}

.green {
    background-color: #66FF00 !important;
    color: #fff;
    padding: 5px;
}
.dark-green-radius {
    background-color: darkgreen !important;
    color: #fff;
    padding: 7px;
    line-height:4em;
    border-radius: 5px;
    border: 2px solid gray;
}
.dark-red-radius {
    background-color: darkred !important;
    color: #fff;
    padding: 7px;
    line-height:4em;
    border-radius: 5px;
    border: 2px solid gray;
}
.green-arrow-two {
    background: url("../images/up-arrow-two.svg") no-repeat center;
    -webkit-background-size: 20% !important;
    background-size: 20% !important;
}

.red-arrow-two {
    background: url("../images/down-arrow-two.svg") no-repeat center;
    -webkit-background-size: 20% !important;
    background-size: 20% !important;
}

.green-arrow-three {
    background: url("../images/down-arrow-three.svg") no-repeat center;
    -webkit-background-size: 20% !important;
    background-size: 20% !important;
}

.red-arrow-three {
    background: url("../images/up-arrow-three.svg") no-repeat center;
    -webkit-background-size: 20% !important;
    background-size: 20% !important;
}

.orange {
    background-color: #ff780b !important;
    color: #fff;
    padding: 5px;
}

/* health dialogs */

.dialog .pic {
    float: left;
    margin-right: 10px;
    width: 30px;
    height: 30px;
}

/*tooltips*/

.tooltip {
    position: absolute;
    display: none;
    border: 1px solid #333;
    background-color: #ffed8a;
    padding: 2px 6px;
    z-index: 999;
    font-size: 10px;
    background: rgba(255, 255, 255, 1);
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed', GradientType=0);
    -webkit-box-shadow: -3px 3px 5px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: -3px 3px 5px 0px rgba(0, 0, 0, 0.5);
    box-shadow: -3px 3px 5px 0px rgba(0, 0, 0, 0.5);

}

/*health symbols */
.dollar {
    background: url("../images/dollar.svg") no-repeat center top;
}

#positions-detail .dollar {
    background: url("../images/dollar-three.svg") no-repeat center top;
}

.flame {
    background: url("../images/red-circle-smiley.svg") no-repeat center top;
}

#positions-detail .flame {
    background: url("../images/red-circle-smiley-two.svg") no-repeat center top;
}

.flame.orange-triangle-exclaim {
    background: url("../images/flame-orange-exclaim.svg") no-repeat center top;
}

#positions-detail .flame.orange-triangle-exclaim {
    background: url("../images/flame-orange-exclaim-two.svg") no-repeat center top;
}

.flame.red-triangle-exclaim {
    background: url("../images/red-triangle-exclaim-flame.svg") no-repeat center top;
}

#positions-detail .flame.red-triangle-exclaim {
    background: url("../images/flame-red-exclaim-two.svg") no-repeat center top;
}

.flame.question-red {
    background: url("../images/red-question-flame.svg") no-repeat center top;
}

#positions-detail .flame.question-red {
    background: url("../images/red-question-flame-two.svg") no-repeat center top;
}

.smile {
    background: url("../images/smiley.svg") no-repeat center top;
}

#positions-detail .smile {
    background: url("../images/smiley-two.svg") no-repeat center top;
}

.smile.green-triangle-exclaim {
    background: url("../images/smile-exclaim-green.svg") no-repeat center top;
}

#positions-detail .smile.green-triangle-exclaim {
    background: url("../images/smile-exclaim-green-two.svg") no-repeat center top;
}

.smile.question-green {
    background: url("../images/smile-question-green.svg") no-repeat center top;
}

#positions-detail .smile.question-green {
    background: url("../images/smile-question-green-two.svg") no-repeat center top;
}

.orange-exclaim-circle {
    background: url("../images/orange-circle-smiley.svg") no-repeat center top;
}

#positions-detail .orange-exclaim-circle {
    background: url("../images/orange-circle-smiley-two.svg") no-repeat center top;
}

.orange-exclaim-circle.question-orange {
    background: url("../images/orange-exclaim-question-orange.svg") no-repeat center top;
}

#positions-detail .orange-exclaim-circle.question-orange {
    background: url("../images/orange-exclaim-question-orange-two.svg") no-repeat center top;
}

.question-orange {
    background: url("../images/orange-question-circle.svg") no-repeat center top;
}

#positions-detail .question-orange {
    background: url("../images/orange-question-circle-two.svg") no-repeat center top;
}

.question-green {
    background: url("../images/question-green.svg") no-repeat center top;
}

#positions-detail .question-green {
    background: url("../images/question-green-two.svg") no-repeat center top;
}

.orange-triangle-exclaim {
    background: url("../images/orange-triangle-exclaim.svg") no-repeat center top;
}

#positions-detail .orange-triangle-exclaim {
    background: url("../images/orange-triangle-exclaim-two.svg") no-repeat center top;
}

.red-triangle-exclaim {
    background: url("../images/red-triangle-exclaim.svg") no-repeat center top;
}

#positions-detail .red-triangle-exclaim {
    background: url("../images/red-triangle-exclaim-two.svg") no-repeat center top;
}

.red-triangle-exclaim.smile {
    background: url("../images/red-triangle-exclaim-smile.svg") no-repeat center top;
}

#positions-detail .red-triangle-exclaim.smile {
    background: url("../images/red-triangle-exclaim-smile-two.svg") no-repeat center top;
}

.red-triangle-exclaim.orange-exclaim-circle {
    background: url("../images/red-triangle-exclaim-orange.svg") no-repeat center top;
}

#positions-detail .red-triangle-exclaim.orange-exclaim-circle {
    background: url("../images/red-triangle-exclaim-orange-two.svg") no-repeat center top;
}

.red-triangle-exclaim.flame {
    background: url("../images/red-triangle-exclaim-flame.svg") no-repeat center top;
}

#positions-detail .red-triangle-exclaim.flame {
    background: url("../images/red-triangle-exclaim-flame-two.svg") no-repeat center top;
}

.green-triangle-exclaim {
    background: url("../images/green-triangle-exclaim.svg") no-repeat center top;
}

#positions-detail .green-triangle-exclaim {
    background: url("../images/green-triangle-exclaim-two.svg") no-repeat center top;
}

.green-triangle-exclaim.smile {
    background: url("../images/green-triangle-exclaim-smile.svg") no-repeat center top;
}

#positions-detail .green-triangle-exclaim.smile {
    background: url("../images/green-triangle-exclaim-smile-two.svg") no-repeat center top;
}

.green-triangle-exclaim.orange-exclaim-circle {
    background: url("../images/green-triangle-exclaim-orange.svg") no-repeat center top;
}

#positions-detail .green-triangle-exclaim.orange-exclaim-circle {
    background: url("../images/green-triangle-exclaim-orange-two.svg") no-repeat center top;
}

.green-triangle-exclaim.flame {
    background: url("../images/green-triangle-exclaim-flame.svg") no-repeat center top;
}

#positions-detail .green-triangle-exclaim.flame {
    background: url("../images/green-triangle-exclaim-flame-two.svg") no-repeat center top;
}

.question-green.orange-exclaim-circle {
    background: url("../images/green-question-orange.svg") no-repeat center top;
}

#positions-detail .question-green.orange-exclaim-circle {
    background: url("../images/green-question-orange-two.svg") no-repeat center top;
}

.question-green.flame {
    background: url("../images/green-question-flame.svg") no-repeat center top;
}

#positions-detail .question-green.flame {
    background: url("../images/green-question-flame-two.svg") no-repeat center top;
}

.question-red.smile {
    background: url("../images/red-question-smile.svg") no-repeat center top;
}

#positions-detail .question-red.smile {
    background: url("../images/red-question-smile-two.svg") no-repeat center top;
}

.question-red.orange-exclaim-circle {
    background: url("../images/red-question-orange.svg") no-repeat center top;
}

#positions-detail .question-red.orange-exclaim-circle {
    background: url("../images/red-question-orange-two.svg") no-repeat center top;
}

.question-red.flame {
    background: url("../images/red-question-flame.svg") no-repeat center top;
}

#positions-detail .question-red.flame {
    background: url("../images/red-question-flame-two.svg") no-repeat center top;
}

.closed {
    background: url("../images/closed.png") no-repeat center;
}

.no-health {
    background: transparent !important;
}

.closed-call, .closed-put, .long-closed-call, .long-closed-put {
    background: url("../images/market-closed.svg") no-repeat center top;
}

#positions-detail .closed-call, #positions-detail .closed-put, #positions-detail .no-stock,
#positions-detail .long-closed-call, #positions-detail .long-closed-put {
    background: url("../images/market-closed-two.svg") no-repeat center top;
}

.no-stock {
    background: url("../images/market-closed.svg") no-repeat center top;
}

.no-stock.long-put {
    background: url("../images/closed-put.svg") no-repeat center top;
}

.closed-call.long-put {
    background: url("../images/closed-put.svg") no-repeat center top;
}

#positions-detail .closed-call.long-put {
    background: url("../images/closed-put-two.svg") no-repeat center top;
}

.closed-call.closed-put {
    background: url("../images/market-closed.svg") no-repeat center top;
}

.closed-call.long-call {
    background: url("../images/closed-long-call.svg") no-repeat center top;
}

#positions-detail .closed-call.long-call {
    background: url("../images/closed-long-call-two.svg") no-repeat center top;
}

.closed-call.long-closed-call {
    background: url("../images/market-closed.svg") no-repeat center top;
}

#positions-detail .closed-call.closed-put {
    background: url("../images/market-closed-two.svg") no-repeat center top;
}

#positions-detail .no-stock.long-put {
    background: url("../images/closed-put-two.svg") no-repeat center top;
}

/*profile */

#profile .errorlist {
    color: #000;
}

#profile #nav-profile {
    background-color: transparent;
    padding-bottom: 20px;

}

#profile #nav-profile #fake-header {
    background-color: rgba(40, 61, 79, 1);
    color: #8a8b8d;
    height: 74px;
    position: absolute;
    width: 100%;
    z-index: 8
}

#profile #nav-profile .info-container {
    background-color: #f6f6f6;
    border: 2px solid #283d4f;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    color: #000;
    font-size: 1em;
    min-height: 395px;
    line-height: 1em;
    overflow-x: hidden;
    overflow-y: scroll;
    width: 924px;
    padding: 36px;
    margin: 0 auto;
}

#profile .form-holder form {
    margin-top: 20px;
}

#profile ul#tabs-profile {
    margin: 0 auto;
    width: 702px;
    position: relative;
    z-index: 9;

}

#profile ul#tabs-profile li {
    background: none;
    border: none;
    float: left;
}

#profile ul#tabs-profile li > a {
    display: inline-block;
    height: 68px;
    padding-right: 48px;
    width: 36px;
    background-size: auto;
}

#profile ul#tabs-profile li > a:focus {
    outline: none;
}

#profile #nav-profile ul li#profile-settings a {
    background: url("../images/profile-tab-help-three.svg") no-repeat scroll 18px 16px rgba(0, 0, 0, 0);
}

#profile #nav-profile ul li#profile-settings.ui-tabs-active a,
#profile #nav-profile ul li#profile-settings a:hover {
    background-position: 18px -67px;
}

#profile #nav-profile ul li#profile-sub a {
    background: url("../images/profile-tab-help-three.svg") no-repeat scroll -66px 16px rgba(0, 0, 0, 0);
}

#profile #nav-profile ul li#profile-sub.ui-tabs-active a,
#profile #nav-profile ul li#profile-sub a:hover {
    background-position: -66px -67px;
}

#profile #nav-profile ul li#profile-notification a {
    background: url("../images/profile-tab-help-three.svg") no-repeat scroll -148px 16px rgba(0, 0, 0, 0);
}

#profile #nav-profile ul li#profile-notification.ui-tabs-active a,
#profile #nav-profile ul li#profile-notification a:hover {
    background-position: -148px -67px;
}

#profile #nav-profile ul li#profile-accounts a {
    background: url("../images/profile-tab-help-three.svg") no-repeat scroll -246px 16px rgba(0, 0, 0, 0);
    width: 96px;
    margin-left: 10px;
}

#profile #nav-profile ul li#profile-accounts.ui-tabs-active a,
#profile #nav-profile ul li#profile-accounts a:hover {
    background-position: -246px -67px;
}

#profile #nav-profile ul li#profile-user-tracked-stock a {
    background: url("../images/profile-tab-help-three.svg") no-repeat scroll -399px 16px rgba(0, 0, 0, 0);
    width: 96px;
    margin-left: 3px;
}

#profile #nav-profile ul li#profile-user-tracked-stock.ui-tabs-active a,
#profile #nav-profile ul li#profile-user-tracked-stock a:hover {
    background-position: -399px -67px;
}

#profile #nav-profile ul li#profile-user-brokers a {
    background: url("../images/profile-tab-help-three.svg") no-repeat scroll -540px 16px rgba(0, 0, 0, 0);
    width: 96px;
    margin-left: -9px;
}

#profile #nav-profile ul li#profile-user-brokers.ui-tabs-active a,
#profile #nav-profile ul li#profile-user-brokers a:hover {
    background-position: -540px -67px;
}

#profile #nav-profile .container > div {
    float: left;
    width: 33%;
    margin-top: -17px;
}

#profile #nav-profile #first.container > div:nth-child(1) {
    width: 40%;
}

#profile #nav-profile #first.container > div:nth-child(2) {
    width: 30%;
}

#profile #nav-profile #first.container > div:nth-child(3) {
    margin-top: 23px;
    position: relative;
    width: 30%;
    left: 30px;
}
#profile #nav-profile #second.container .header {

    margin-top: 40px;
}
#profile #nav-profile #second.container #auto-renew-info {
    position: relative;
    top: 368px;
}

#profile #nav-profile #second.container > div {
    width: 100%;
    text-align: center;
}

#profile #nav-profile #second.container > div #sub-info {
    width: 43%;
    margin: 30px auto 0;
}

#profile #nav-profile #second.container > div #sub-info p {
    height: 32px;
    margin-bottom: 13px;
    text-align: left;
    line-height: 2em;
}

#profile #nav-profile #second.container > div #sub-info p span {
    float: right;
}

#profile #nav-profile #second.container > div #sub-info p span.date {
    background-color: #283d4f;
    color: #fff;
    display: inline-block;
    height: 100%;
    line-height: 2em;
    padding-left: 10px;
    text-align: left;
    width: 180px;
}

#profile #nav-profile #second.container > div #sub-info p span.info {
    background-color: #fff;
    display: inline-block;
    height: 100%;
    line-height: 2em;
    padding-left: 10px;
    text-align: left;
    width: 180px;
    border-radius: 2px;
    border: 1px solid #575756;

}

#profile #nav-profile #second.container form {
    margin-top: 40px;
}

#profile #nav-profile #second.container #sub-info form input[type="submit"] {
    margin-top: 40px;
    position: relative;
    left: 35px;
}

#profile #nav-profile #second.container #payment-info input[type="text"] {
    background-color: #fff;
}

#profile #nav-profile #second.container #payment-info input[type="submit"] {
    margin-top: 65px;
    position: relative;
    right: 223px;
}

#profile #nav-profile #second.container form > div.check-holder > label {
    font-weight: bold;
    font-size: 1.4em;
    position: relative;
    top: 6px;
}

#profile #nav-profile #second.container .profile-para {
    line-height: 1.7em;
    text-align: left;
}

#profile #nav-profile #second.container .profile-para p span {
    font-weight: bold;
}

#profile #nav-profile #second.container #payment-info form > div {
    float: left;
    width: 50%;
}

#profile #nav-profile #second.container #payment-info label {
    display: block;
    margin-bottom: 10px;
}

#profile #nav-profile #second.container #payment-info .select-theme {
    width: 370px;
    background-position: 344px center;
    margin: 0;
    position: relative;
    left: 45px;
}
#profile #nav-profile #second.container #add-ons{
    border: 1px solid #cdcecf;
    margin: 10px 0;
    padding: 10px;
}
#profile #nav-profile #second.container #add-ons h3{
    margin-bottom: 10px;
}
#profile #nav-profile #second.container #add-ons label{

}
#profile #nav-profile #second.container #add-ons input{
    width: 20%;
}
#profile #nav-profile #second.container #add-ons form .add-on-blurb{
    display: inline-block;
    width: 48%;
    line-height: 1.7em;
    text-align: left;
}

#profile #nav-profile #second.container #add-ons form .add-on-buttons{
    display: inline-block;
    width: 48%;
    vertical-align: top;
}
#profile #nav-profile #second.container #add-ons #addons-submit{
    margin-top:20px;
}
#profile #nav-profile #second.container .button:hover {
    border: none;
}
#profile #nav-profile #second.container #payment-info .select-theme select {
    width: 385px;
}

.toggle-switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 26px;
    margin-left: 12px;
    vertical-align: middle;
}

.toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: #ccc;
    border-radius: 34px;
    transition: 0.3s;
}

.toggle-slider::before {
    content: "";
    position: absolute;
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    border-radius: 50%;
    transition: 0.3s;
}

.toggle-switch input:checked + .toggle-slider {
    background-color: #edc71c; /* Indigo */
}

.toggle-switch input:checked + .toggle-slider::before {
    transform: translateX(24px);
}

#profile #nav-profile #second.container #payment-info #current-payment {
    margin: 20px 0;
    float: left;
    width: 100%;
}

#profile #nav-profile #second.container #payment-info h3 {
    color: #7D9F00;
    font-size: 1.5em;
    font-weight: 200;
    height: 40px;
}

#profile #nav-profile #second.container #payment-info #current-payment > div {
    float: left;
    width: 50%;
}

#profile #nav-profile #second.container #payment-info #new-payment {
    clear: both;
}

#profile #nav-profile #second.container input#id_credit_number {
    background-position: -3px -94px, 337px -44px;
    padding-left: 55px;
}

#profile #nav-profile #second.container input#id_credit_number.visa {
    background-position: -3px -126px, 337px -44px;
}

#profile #nav-profile #second.container input#id_credit_number.visa_electron {
    background-position: -3px -205px, 337px -44px;
}

#profile #nav-profile #second.container input#id_credit_number.mastercard {
    background-position: -3px -193px, 337px -44px;
}

#profile #nav-profile #second.container input#id_credit_number.maestro {
    background-position: -3px -289px, 337px -44px;
}

#profile #nav-profile #second.container input#id_credit_number.discover {
    background-position: -3px -261px, 337px -44px;
}

#profile #nav-profile #second.container input#id_credit_number.amex {
    background-position: -3px -295px, 337px -44px;
}

#profile #nav-profile #second.container input#id_credit_number.jcb {
    background-position: -3px -331px, 337px -44px;
}

#profile #nav-profile #second.container input#id_credit_number.valid.visa {
    background-position: -3px -126px, 337px -66px;
}

#profile #nav-profile #second.container input#id_credit_number.valid.visa_electron {
    background-position: -3px -205px, 337px -66px;
}

#profile #nav-profile #second.container input#id_credit_number.valid.mastercard {
    background-position: -3px -193px, 337px -66px;
}

#profile #nav-profile #second.container input#id_credit_number.valid.maestro {
    background-position: -3px -289px, 337px -66px;
}

#profile #nav-profile #second.container input#id_credit_number.valid.discover {
    background-position: -3px -261px, 337px -66px;
}

#profile #nav-profile #second.container input#id_credit_number.valid.amex {
    background-position: -3px -295px, 337px -66px;
}

#profile #nav-profile #second.container input#id_credit_number.valid.jcb {
    background-position: -3px -331px, 337px -66px;
}

#profile #nav-profile #third.container > div {
    width: 100%;
    text-align: center;
}

#profile #nav-profile #third.container > div > div:last-child {
    width: 100%;
    background-color: #fff;
    float: left;
}

#profile #nav-profile #third.container > div > div:last-child form {
    width: 90%;
    margin: 0 auto;
    padding-top: 30px;
    text-align: left;
    position: relative;
    float: left;
    left: 2.5%;
}

#profile #nav-profile #third.container > div > div:last-child form > div {
    float: left;
    width: 100%;
    padding: 15px;
    border: 1px solid #CDCECF;
    margin-top: 20px;
}

#profile #nav-profile #third.container > div > div:last-child form input[type="submit"] {
    position: relative;
    margin: 20px auto;
}

#profile #nav-profile #third.container > div > div:last-child form > div > div {
    float: left;
    margin-bottom: 30px;
}

#profile #nav-profile .info-container .header {
    color: #7D9F00;
    font-size: 2.5em;
    height: 40px;
    border: none !important;
    margin-top: 30px;
}

#profile #nav-profile .info-container .header-small {
    font-size: 1.5em;
    font-weight: 400;
    border: none !important;

}

#profile #nav-profile #third.container > div > div:last-child form div.check-holder {
    width: 40%;
}

#profile #nav-profile #third.container > div > div:last-child form div.check-holder > label {
    line-height: 2em;
}

#profile #nav-profile #third.container > div > div:last-child form div.slider-info {
    width: 60%;
    position: relative;
    top: -10px;
    left: 41px;
}

#profile #nav-profile #third.container > div > div:last-child form div.slider-info > input {
    border: none;
    margin-bottom: 0;
    height: inherit;
    width: inherit;
    font-size: 1.5em;
}

#profile #nav-profile #third.container > div > div:last-child form div.slider-info > input:focus {
    border: none !important;
}

#profile #nav-profile #third.container > div > div:last-child form #active-account {
    bottom: 0;
    display: block;
    left: 0;
    position: relative;
    width: 240px;
    border: none;
    padding: 0;
}

#profile #nav-profile #third.container > div > div:last-child form #active-account label {
    margin: 20px 0;
}

#profile .ui-slider .ui-slider-handle:before {
    bottom: -1px;
    content: "|||||";
    font-size: 0.6em;
    left: 3px;
    position: absolute;
    width: 100%;
}

#profile .ui-slider:after {
    content: "days before date";
    position: absolute;
    top: -2px;
    right: -137px;
    color: #8D8F92;
}

#profile #nav-profile #fourth.container {
    background-color: #fff;
}

#profile #nav-profile #fourth.container > div,
#profile #nav-profile #fifth.container > div,
#profile #nav-profile #sixth.container > div {
    width: 108%;
    right: 20px;
}

#profile #nav-profile #sixth.container > div:first-child {
    margin-left: 0;
}

#profile #nav-profile #sixth.container > div .header {
    height: 45px;
    font-size: 1.9em;
    margin: 0;
    position: relative;
    background-color: #283d4f;
    color: #FFFFFF;
    line-height: 1.5em;
    padding-left: 8px;
    -webkit-border-top-left-radius: 7px;
    -webkit-border-top-right-radius: 7px;
    -moz-border-radius-topleft: 7px;
    -moz-border-radius-topright: 7px;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

#profile #nav-profile #sixth.container form > div {
    height: 340px;
    overflow-x: hidden;
    overflow-y: scroll;
    border: 1px solid #9d9d9c;
    -webkit-border-bottom-left-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -moz-border-radius-bottomleft: 8px;
    -moz-border-radius-bottomright: 8px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    margin-bottom: 10px;

}

#profile #nav-profile #sixth.container form .check-holder {
    height: 30px;
    background-color: #fff;
    width: 96%;
    margin: 7px;
}

#profile #nav-profile #sixth.container form .check-holder > label {
    line-height: 2em;
    padding-left: 5px;
}

#profile .helptext {
    top: -15px;
    color: #8d8f92;
}

#profile .profile-form {
    margin-top: 40px;
    position: relative;
}

#profile .profile-form #filename {
    position: absolute;
    top: 96px;
    color: #8D8F92;
}

#profile #nav-profile input {
    width: 100%;
    height: 32px;
    border: 1px solid #575756;
    border-radius: 2px;
    margin-bottom: 28px;
    padding-left: 10px;
}

#profile #nav-profile .button,
#profile #nav-profile .delete-row {
    width: 138px;
    height: 40px;
    color: #fff;
    background-color: #22BEB3;
    border-radius: 2px;
    font-size: 1.4em;
    cursor: pointer;
    border: none;
    padding: 0;
    margin-bottom: 0;
    text-align: center;
}

#profile #nav-profile .button:hover {
    color: #22BEB3;
    background-color: #fff;
    border: 1px solid #22BEB3;

}

#profile .select-theme {
    overflow: hidden;
    width: 246px;
    -moz-border-radius: 9px 9px 9px 9px;
    -webkit-border-radius: 9px 9px 9px 9px;
    border-radius: 9px 9px 9px 9px;
    border: 1px solid #575756;
    background: url("../images/updown.svg") no-repeat;
    background-position: 223px center;
    background-size: 18px 25px;
    background-color: #fff;
    vertical-align: center;
    margin-bottom: 30px;
    margin-top: 10px;
    cursor: pointer;
}

#profile select {
    width: 266px;
    height: 32px;
    background: transparent;
    -webkit-appearance: none;
    padding-left: 5px;
}

#profile #first input,
#profile #second input {
    width: 80%;
}

#profile #dialog-multiple-security .select-theme {
    width: 74%;
    background-position: 99% center;
}

#profile #dialog-multiple-security select {
    width: 100%;
}

#profile #accounts .select-theme {
    width: 45%;
    background-position: 95% center;
    float: left;
    margin-right: 5px;

}

#profile #accounts select {
    width: 100%;
    height: 46px;
}

#profile #avatar-form .help {
    color: #8D8F92;
    margin: -10px 0 20px 0;
    line-height: 1.5em;
    padding: 2px;
}

#profile #phone input {
    margin-left: 10px;
}

#profile #avatar-form select#id_phone_number_0 {
    margin: 20px 0;
}

#profile #avatar-form input#id_phone_number_1 {
    width: 150px;
}

#profile #avatar-form input[type="checkbox"] {
    width: 13px;
    height: 13px;
}

#profile .profile-form #holder {
    float: left;
    width: 100%;
    margin-bottom: 35px;
}

#profile .profile-form #holder > div {
    float: right;
    width: 65%;
    margin-right: 38px;
}

#profile .profile-form #holder > div > div {
    margin: 0 0 13px 0;
}

#profile .profile-form #holder > div > div:last-child {
    color: #8D8F92;
}

#profile .profile-form img,
#profile .profile-form #holder #empty-avatar-holder {
    border-radius: 50%;
    width: 82px;
    height: 82px;
    float: left;
}

#profile .profile-form #holder #empty-avatar-holder {
    background: url("../images/default-avatar.svg") no-repeat center;
    background-size: auto;
}

#profile .profile-form p label {
    margin-bottom: 10px;
    display: inline-block;
}

#profile .form-holder {
    width: 50%;
}

#profile .profile-form label[for="id_avatar"] {
    width: 108px;
    height: 30px;
    color: #fff;
    background-color: rgba(64, 79, 92, 1);
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    line-height: 2em;
    letter-spacing: 0;

}

#profile .profile-form label[for="id_avatar"]:hover {
    color: #22beb3;

}

#profile .profile-form label[for="id_avatar"] input {
    position: fixed;
    top: -1000px;
}

#profile .form-holder .upgrade {
    background-color: #4f4f4f;
    border: 2px solid #4f4f4f;
    color: #fff;
    margin-left: 20px;
    margin-top: 11px;
    padding: 5px;
    width: 35%;
    cursor: pointer;
}

#profile .form-holder .upgrade:hover {
    color: #ff780b;
}

#profile #passwords > div:last-child {
    margin-top: 40px;
}

#profile #user-read-only {
    margin-top: 40px;
}

#profile #user-read-only label {
    margin-bottom: 10px;
    display: block;
}

#profile #user-read-only div {
    border: 1px solid #575756;
    border-radius: 2px;
    height: 25px;
    margin-bottom: 30px;
    padding-left: 10px;
    padding-top: 5px;
    width: 246px;
    background-color: #fff;
    color: #d4d4d4;
}

/* stock tracking */

#user-tracked-stock #parent-form .inline {
    height: 520px;
}

#user-tracked-stock #parent-form .add-row {
    height: 500px;
}

#profile #nav-profile #user-tracked-stock #forms input {
    width: 97%;
}

#profile #nav-profile #user-tracked-stock #forms .inline-value input {
    width: 97%;
}

#profile #user-tracked-stock-formset .stock-name {
    height: 40px;
    background-color: #22beb3;
    color: #fff;
    text-align: center;
    line-height: 1.8em;
    font-size: 1.4em;
}

#profile #user-brokers-formset .broker-name {
    height: 40px;
    background-color: #00AECC;
    color: #fff;
    text-align: center;
    line-height: 1.8em;
    font-size: 1.4em;
}

#profile #user-brokers-formset .broker-name span {
    color: #edc71c;

}

#profile #user-tracked-stock-formset .stock-name .ticker {
    display: none;
}

#user-tracked-stock #parent-form fieldset .fieldWrapper.ping {
    left: 9px;
    top: 10px;
    margin-bottom: 10px;
    display: inline-block;
}

#user-tracked-stock #parent-form fieldset .fieldWrapper.ping span {
    color: #7d9f00;
    font-size: 1.6em;

}

#user-tracked-stock .check-holder {
    margin-bottom: 10px;
    width: 96%;
}

#user-tracked-stock .check-holder label {
    line-height: 2em;
}

/* user brokers */

#profile #user-brokers .blurb {
    width: 92%;
    margin: 10px;
    position: relative;
    height: 80px;
    line-height: 1.2em;
    text-align: center;
}

#profile #user-brokers .blurb.active {
    color: #fff;
}

#profile #user-brokers .blurb span {
    font-weight: 600;
    color: #fff;
}

#profile #user-brokers .broker-expiry-iso {
    display: none;
}

#profile #user-brokers .activate_deactivate,
#profile #user-brokers .broker-info {
    width: 92%;
    margin: 16px 10px 42px 10px;
    height: 50px;
    border: 1px dashed #333;
    position: relative;
}

#profile #user-brokers .activate_deactivate .button {
    position: absolute;
    top: 5px;
    left: 5px;
    width: 96%;
    line-height: 1.8em;
    text-decoration: none;
}

#profile #user-brokers #parent-form .inline {
    height: 400px;
}

#profile #user-brokers #parent-form .add-row {
    height: 380px;

}

#profile #user-brokers .broker-info {
    font-size: 3em;
    color: #00AECC;
    text-align: center;
    vertical-align: middle;
    line-height: 1em;
    background-color: #fff;
}

#profile #user-tracked-stock .delete-row,
#profile #user-brokers .delete-row,
#profile #accounts .delete-row {
    display: inline-block;
    position: absolute;
    bottom: 10px;
    left: 20px;
    line-height: 1.8em;
    text-align: center;
    background-color: #000;
    text-decoration: none;
}

#profile #user-brokers .delete-row {
    bottom: 23px;
}

#profile #user-tracked-stock .delete-row:hover,
#profile #user-brokers .delete-row:hover {
    background-color: #fff;
    color: #000;
}

#profile .dialog-security form p {
    padding: 10px;

}

#profile .dialog-security form label {
    padding: 10px;

}

#profile .dialog-security form input[type="text"] {
    height: 35px;
    width: 100%;
    color: #b2b2b2;
    font-size: 20px;
    font-weight: 300;
    border-color: #c4c4c4;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    background-color: #f2f2f2;
    padding-left: 10px;
}

#profile .dialog-security form input[type="submit"] {
    width: 30%;
    height: 40px;
    color: #fff;
    background-color: #22BEB3;
    border-radius: 2px;
    font-size: 1.4em;
    cursor: pointer;
    border: none;
    padding: 0;
    margin-bottom: 0;
    margin-top: 20px;
    text-align: center;
}

#profile .dialog-security form input[type="submit"]:hover {
    color: #22BEB3;
    background-color: #fff;
    border: 1px solid #22BEB3;

}

/*fancy checkboxes */
.check-holder {
    clear: both;
    position: relative;
}

.check-holder > div:last-child {
    float: right;
}

.check-holder > div:first-child {

    margin-left: 10px;
    margin-top: 12px;
    float: left;
}

.check-holder .check input[type="checkbox"] {
    visibility: hidden;
    padding: 0;
    margin: 0;

}

.check-holder .check {
    width: 55px;
    height: 30px;
    position: relative;
}

.check-holder .check div {
    background: none repeat scroll 0 0 #821A1D;
    height: 100%;
    position: relative;
    top: -62px;
    width: 100%;
    border-radius: 3px;
}

.check-holder .check:before {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 transparent;
    border-color: #fff;
    border-image: none;
    border-style: none none solid solid;
    border-width: medium medium 3px 3px;
    color: #fff;
    content: "";
    font-size: 14px;
    height: 6px;
    left: 5px;
    position: absolute;
    top: 8px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    width: 14px;
    z-index: 9;
}

.check-holder .check:after {
    color: #fff;
    content: "x";
    font-size: 1.7em;
    left: 35px;
    position: absolute;
    top: 1px;
    z-index: 9;
}

.check-holder .check label {
    display: block;
    width: 26px;
    height: 26px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -ms-transition: all .5s ease;
    transition: all .5s ease;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 2px;
    background: #fff;
    font-size: 0 !important;
    z-index: 9;
}

.check-holder .check input[type="checkbox"]:checked + label {
    left: 27px;
    background: #fff;
}

.check-holder .check input[type="checkbox"]:checked ~ div {
    background: none repeat scroll 0 0 #7D9F00 !important;
}

#profile .form-holder #id_expiry_threshold {
    background-color: rgba(0, 0, 0, 0);
    border: medium none;
    font-weight: 700;
    width: 9%;
}

#profile .form-holder #account {
    margin: 10px 0;
}

#profile .form-holder #account p {
    margin: 20px 10px;
}

/*all positions page*/

#matrix {
    background-color: #fff;
    border-radius: 8px;
    position: relative;
    min-height: 515px;
    border: 2px solid #283D4F;
    overflow: hidden;
}

#matrix a {
    text-decoration: none;
}

#matrix #x_axis ul {
    position: relative;
    left: 4px;
    float: left;
    width: 100%;
}

#matrix #x_axis {
    border-left: 1px solid #283D4F;
    float: left;
    min-height: 515px;
    width: 86.8%;
    position: relative;

}

.no-positions {
    vertical-align: middle;
    width: 100%;
    height: 515px;
    background: url("../images/tc-logo-gray-medium.png") no-repeat center;
    background-size: 38%;
    opacity: 0.4;

}

.no-positions-small {
    vertical-align: middle;
    width: 100%;
    height: 454px;
    background: url("../images/tc-logo-gray-medium.png") no-repeat center;
    background-size: 38%;
    opacity: 0.4;

}

.no-positions-quote {
    vertical-align: middle;
    width: 100%;
    height: inherit;
    background: url("../images/tc-logo-gray-medium.png") no-repeat center;
    background-size: 60%;
    opacity: 0.4;
    position: relative;

}

.no-positions-chain {
    vertical-align: middle;
    width: 100%;
    height: inherit;
    background: url("../images/tc-logo-gray-medium.png") no-repeat center 20px;
    background-size: 30%;
    opacity: 0.4;
    position: relative;

}

.no-positions p {
    position: absolute;
    bottom: 48px;
    width: 100%;
    text-align: center;
}

.no-positions-small p {
    position: absolute;
    bottom: 79px;
    width: 100%;
    text-align: center;
}

.no-positions-quote p {
    position: absolute;
    bottom: -9px;
    width: 100%;
    text-align: center;
}

.no-positions-chain p {
    position: absolute;
    bottom: -40px;
    width: 100%;
    text-align: center;
}

#matrix #x_axis #positions-detail li,
#matrix #x_axis #positions-detail li.trade-plan li {
    background-color: #F6F6F6;
    border: 1px solid #9d9d9c;
    float: left;
    list-style: none outside none;
    margin: 8px 0 8px 5px;
    width: 32%;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    position: relative;
    color: #404041;
}

#matrix #x_axis #positions-detail li.trade-plan {
    background-color: transparent;
    border: none;
    list-style: none outside none;
    margin: 0;
    width: 100%;
    border-radius: 0;
    position: relative;
    color: #404041;
    opacity: 1;
}

#matrix #x_axis #positions-detail li.trade-plan ul {
    left: 0;
}

.position-active {
    border: 1px solid #283d4f !important;
    opacity: 1 !important;
}

#matrix #x_axis #positions-detail li:hover {
    cursor: pointer;
}

#matrix #x_axis #positions-detail li > a {
    color: #404041;
}

#matrix #x_axis #positions-detail .position .position-header {
    height: 58px;
    margin: 0;
    position: relative;
    background-color: #283D4F;
    color: #FFFFFF;
    -webkit-border-top-left-radius: 7px;
    -webkit-border-top-right-radius: 7px;
    -moz-border-radius-topleft: 7px;
    -moz-border-radius-topright: 7px;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

#matrix #x_axis #positions-detail .position.edit .position-header .health {
    right: 51%;
    background-size: 68%;
}
#matrix #x_axis #positions-detail .position .position-header .health{
    display: inline-block;
    height: 42px;
    position: absolute;
    right: 29%;
    top: 5px;
    width: 58px;
    background-size:68%;
}
#matrix #x_axis #positions-detail .position .position-header .sentiment {
    display: inline-block;
    height: 30px;
    position: absolute;
    right: 7px;
    top: 8px;
    width: 30px;
}
#matrix #x_axis #positions-detail .position .position-header.position-header-active {
    background-color: #2B7098;
    z-index: 99;

}

.position-header-active.trade-plan {
    background-color: #C2BCA9 !important;

}

.position-header-active.trade-plan-eod {
    background-color: #C2BCA9 !important;

}

.position-header-active.trade-plan-difference {
    background-color: #C2BCA9 !important;

}

#matrix #x_axis #positions-detail .position .position-body {
    height: 413px;
    overflow-y: scroll;
    overflow-x: hidden;
    position: relative;
}

#matrix #x_axis #positions-detail .position .basic-info {
    position: absolute;
    top: 64px;
    width: 98%;
    left: 4px;
}

#matrix #x_axis #positions-detail .position .position-header .ticker {

    font-size: 30px;
    left: 5px;
    position: absolute;
    top: 8px;
    text-transform: uppercase;
}

#matrix #x_axis #positions-detail .position .position-header .company {
    left: 125px;
    position: absolute;
    top: 5px;
    font-size: 1em;
}
#matrix #x_axis #positions-detail .position.edit .position-header .company {
    left: 184px;
}
#matrix #x_axis #positions-detail .position .position-header .prob {
    right: 16%;
    position: absolute;
    top: 5px;
    font-size: 1.3em;
    border-radius: 50%;
    border: 2px solid #fff;
    height: 34px;
    width: 34px;
    background-color: #27e1ab;
    line-height: 1.9em;
    text-align: center;
}
#matrix #x_axis #positions-detail .position .position-header .prob.top{
    top: 3px;
    font-size: 0.9em;
    height:  24px;
    width: 24px;
}
#matrix #x_axis #positions-detail .position .position-header .prob.bottom{
    top: 25px;
    font-size: 0.9em;
    height:  24px;
    width: 24px;
}
#matrix #x_axis #positions-detail .position .position-header .type {
    right: 49%;
    position: absolute;
    top: 5px;
    font-size: 0.9em;
    border-radius: 50%;
    border: 2px solid #fff;
    height: 26px;
    width: 26px;
    background-color: #808080;
    color: #fff;
    line-height: 1.9em;
    text-align: center;
    padding: 5px;
}
#positions-closed #matrix #x_axis #positions-detail .position .position-header .type{
    right: 44%;
}
#matrix #x_axis #positions-detail .position .position-header .last-modified {
    bottom: 3px;
    left: 7px;
    position: absolute;
    font-size: 0.9em;
}

/* notes in wallet */
#matrix #x_axis #positions-detail .position .position-header .note-button {
    background: url("../images/notes-arrow-two.svg") no-repeat scroll center top;
    background-size: 30px 60px;
    bottom: -2px;
    display: inline-block;
    height: 30px;
    position: absolute;
    left: 18%;
    width: 30px;

}

#positions-closed #matrix #x_axis #positions-detail .position .inlines-position {
    background-size: 26px 51px;
    height: 26px;
    right: 4%;
    width: 10%;
    bottom: 25px;
}

#positions-closed #matrix #x_axis #positions-detail .position .inlines-position:hover {
    background-position: center -26px;
}

#positions-closed #matrix #x_axis #positions-detail .position .position-header .note-button {
    left: 0%;
}

#position-edit #matrix #x_axis #positions-detail .position .position-header .note-button {
    left: 71%;
}

#matrix #x_axis #positions-detail .position .position-header .note-button:hover {
    background-position: center bottom;
    cursor: pointer;
}

#position-edit #matrix #x_axis #positions-detail .position .position-header .copy-button {
    background: url("../images/copy.svg") no-repeat scroll center top;
    background-size: cover;
    bottom: 4px;
    display: inline-block;
    height: 24px;
    position: absolute;
    right: 32%;
    width: 24px;
}

#position-edit #matrix #x_axis #positions-detail .position .position-header .copy-button:hover {
    background-position: center bottom;
    cursor: pointer;
}

#matrix #x_axis #positions-detail .position .wallet {
    background: url("../images/up-arrow.svg") no-repeat scroll 215px top rgba(0, 0, 0, 0);
    background-size: 7% auto;
    display: none;
    left: 0;
    padding-top: 3px;
    position: absolute;
    width: 100%;
    z-index: 21;
}

#positions-closed #matrix #x_axis #positions-detail .position .wallet,
#positions #matrix #x_axis #positions-detail .position .wallet {
    background-position: 138px top;
    height: 411px;
    overflow-y: scroll;
    overflow-x: hidden;

}

#matrix #x_axis #positions-detail .position .wallet-contents {

    background-color: rgba(40, 61, 79, 0.8);
    position: relative;
    top: 5px;
    padding-top: 8px;
}

#matrix #x_axis #positions-detail .position .notes {
    padding: 1px 0;
    position: relative;
}

#matrix #x_axis #positions-detail .position .note {
    margin: 10px 10px;
    padding: 3px;
    background-color: #283D4F;
    overflow-y: scroll;
    overflow-x: hidden;
    color: #fff;
}

#matrix #x_axis #positions-detail .position .note .note-timestamp {
    color: #22BEB3;
    margin: 5px;
}

#matrix #x_axis #positions-detail .position .note > p {
    padding: 10px;
    background-color: #fff;
    color: #000;
    min-height: 80%;
}

#matrix #x_axis #positions-detail .position .note:first-child {
    margin-top: 0;
}

#position-edit #matrix #x_axis #positions-detail .position .note {

    height: 280px;
    position: relative;
    overflow: inherit;
}

#position-edit #matrix #x_axis #positions-detail .position .position-body .note input[type="text"] {
    border: none;
    padding: 5px;
    background-color: #fff;
    width: 130px;
    border-radius: 2px;
}

#position-edit #matrix #x_axis #positions-detail .position .position-body .note input[type="text"]:focus {
    border: none !important;
}

#position-edit #matrix #x_axis #positions-detail .position .note .date {
    position: absolute;
    right: 32px;
    top: 14px;
    color: #22BEB3;
}

#position-edit #matrix #x_axis #positions-detail .position .note textarea {
    width: 100%;
    padding: 5px;
    height: 200px;
    border-radius: 0;
    max-height: 200px;
}

#position-edit #matrix #x_axis #positions-detail .position .note fieldset .fieldWrapper:nth-of-type(2) {
    position: relative;
    top: 9px;
    left: 7px;
}

#position-edit #matrix #x_axis #positions-detail .position .note fieldset .fieldWrapper:nth-of-type(3) {
    margin: 16px 0;
}

#position-edit #matrix #x_axis #positions-detail .position .note .delete-row {

    border: medium none;
    border-radius: 2px;
    bottom: 5px;
    left: 4px;
    color: #fff;
    margin: 0 1px;
    position: absolute;
    background-color: red;
    padding: 5px;
    font-size: 0.6em;
}

#position-edit #matrix #x_axis #positions-detail .position .note .delete-row:hover {
    background-color: #fff;
    color: red;
}

#position-edit #matrix #x_axis #positions-detail .position .notes .add-row {
    border: medium none;
    border-radius: 2px;
    bottom: 43px;
    color: #fff;
    cursor: pointer;
    display: block;
    float: left;
    left: 102px;
    position: relative;
    background-color: green;
    padding: 5px;
    font-size: 0.6em;
}

#position-edit #matrix #x_axis #positions-detail .position .notes .add-row:hover {
    background-color: #fff;
    color: green;
}

#matrix #x_axis #positions-detail .position .button {
    color: #fff;
    display: inline-block;
    font-size: 0.7em;
    position: absolute;
    text-align: center;
    line-height: 0.6em;
    background-color: #edc71c;
    padding: 5px;
}

#matrix #x_axis #positions-detail .position .position-header .edit-position {
    bottom: 2px;
    left: 1%;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    font-size: 1em;
}

#matrix #x_axis #positions-detail .position .position-header .edit-position:hover {
    background-color: #fff;
    color: #edc71c;
}

#matrix #x_axis #positions-detail .position .position-header .golive {
    bottom: 5px;
    right: 5px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    padding: 3px;
    font-size: 0.8em;
}

#matrix #x_axis #positions-detail .position .position-header .golive:hover {
    background-color: #fff;
    color: #edc71c;
}

#matrix #x_axis #positions-detail .position .position-header .refresh-position {
    background: url("../images/refresh-four.svg") no-repeat scroll center top rgba(0, 0, 0, 0);
    background-size: 20px 64px;
    bottom: 4px;
    display: inline-block;
    height: 20px;
    position: absolute;
    right: 11px;
    width: 20px;
    z-index: 11;

}

#position-edit #matrix #x_axis #positions-detail .position .position-header .refresh-position {
    right: 57px;
}

#matrix #x_axis #positions-detail .position .position-header .refresh-position:hover {
    background-position: center bottom;
}

#matrix #x_axis #positions-detail .position .position-footer {
    background-color: #283D4F;
    height: 24px;
    -webkit-border-bottom-right-radius: 7px;
    -webkit-border-bottom-left-radius: 7px;
    -moz-border-radius-bottomright: 7px;
    -moz-border-radius-bottomleft: 7px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 7px;
    position: relative;
    border-top: 1px solid #AFAFB1;
}

#matrix #x_axis #positions-detail .position .position-footer.position-footer-active {
    background-color: #2B7098;
}

.position-footer-active.trade-plan {
    background-color: #C2BCA9 !important;
}

.position-footer-active.trade-plan-eod {
    background-color: #C2BCA9 !important;
}

.position-footer-active.trade-plan-difference {
    background-color: #C2BCA9 !important;
}

#matrix #x_axis #positions-detail .position input.close-position {
    bottom: 3px;
    height: 17px;
    right: 7px;
    cursor: pointer;
    padding: 2px;
    background-color: #fff;
    line-height: 1.1em;
}

#matrix #x_axis #positions-detail .position .close-position:hover,
#matrix #x_axis #positions-detail .position .position-footer .toggle-info:hover {
    background-color: #fff !important;
    color: #edc71c;
}

#matrix #x_axis #positions-detail .position .position-footer .delete-position {
    background: url("../images/bin-two.svg") no-repeat scroll center top;
    background-size: 20px 50px;
    display: inline-block;
    height: 25px;
    position: absolute;
    right: 20%;
    width: 10%;
    z-index: 11;
    top: 1px;
}
#matrix #x_axis #positions-detail .position .position-footer .email-position {
    background: url("../images/email-arrow-two.svg") no-repeat scroll center top;
    background-size: 21px 32px;
    bottom: 3px;
    display: inline-block;
    height: 16px;
    position: absolute;
    right: 34%;
    width: 10%;
    z-index: 11;
}

#matrix #x_axis #positions-detail .position .position-footer .close-position {
    bottom: 3px;
    right: 2%;
    z-index: 11;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

#matrix #x_axis #positions-detail .position .position-footer .toggle-info {
    bottom: 3px;
    left: 7px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

#matrix #x_axis #positions-detail .position .position-footer .delete-position:hover {
    background-position: center -29px;
}

#matrix #x_axis #positions-detail .position .position-footer .email-position:hover {
    background-position: center bottom;
}

#matrix #x_axis #positions-detail .position .cell {
    width: 100%;
    position: relative;
    float: left;
}

#matrix #x_axis #positions-detail .position .basic-info .cell:nth-child(even) > div {
    margin-bottom: 5px;
    border-top: 1px solid #CCD1D3;
}

#matrix #x_axis #positions-detail .position .cell.cell-hidden,
#matrix #x_axis #positions-detail .position span.cell-hidden {
    display: none;
}

#matrix #x_axis #positions-detail .position .show-history {
    position: absolute;
    display: inline-block;
    height: 22px;
    width: 22px;
    left: 50%;
    top: 3px;
    background: url("../images/exclaim.svg") no-repeat center top;
    background-size: 200% 200%;
}

#matrix #x_axis #positions-detail .position .show-history:hover {
    background-position: center bottom;
}

#matrix #x_axis #positions-detail .position .pee {
    position: absolute;
    height: 22px;
    width: 22px;
    left: 50%;
    top: 3px;
    background: url("../images/exclaim.svg") no-repeat center top;
    background-size: 200% 200%;
}

#matrix #x_axis #positions-detail .position .pee:hover {
    background-position: center bottom;
}

#matrix #x_axis #positions-detail .position .income-include {
    background: url(../images/exclaim.svg) no-repeat;
    background-position: center -22px;
    background-size: 100%;
    display: inline-block;
    width: 22px;
    height: 22px;
    vertical-align: middle;
}

#matrix #x_axis #positions-detail .position .income-include:hover {
    background-position: center top;
}

#matrix #x_axis #positions-detail .position .basic-info .cell div {
    overflow: hidden;

}

#matrix #x_axis #positions-detail .position .cell > div:first-child {
    width: 60%;
    border-bottom: 1px solid #C6C6C7;
    border-right: 1px solid #9B9B9B;
    background-color: #C2FED0;
}

#matrix #x_axis #positions-detail .position .cell.form > div:first-child {
    background-color: #daf9ff;
}

#matrix #x_axis #positions-detail .position .cell > div:last-child {
    border-bottom: 1px solid #C6C6C7;
    width: 35%;

}

#matrix #x_axis #positions-detail .position .context .cell > div:last-child {
    padding-top: 6px;

}

#matrix #x_axis #positions-detail .position .cell div {
    height: 26px;
    padding-left: 5px;
    padding-top: 6px;
    width: 100%;
    float: left;
    overflow: hidden;
}
#matrix #x_axis #positions-detail .position .cell .infinite {
    font-size: 2em;
    line-height: 0.5em!important;
}
#matrix #x_axis #positions-detail .position .cell.market div:first-child {
    background-color: #BCD4E6;
}

#matrix #x_axis #positions-detail .position .cell.display > div:first-child {
    background-color: #BEDFD1;
}

#matrix #x_axis #positions-detail .position .cell.days-held > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ms > div:first-child,
#matrix #x_axis #positions-detail .position .cell.entry-date > div:first-child,
#matrix #x_axis #positions-detail .position .cell.cash-secured > div:first-child,
#matrix #x_axis #positions-detail .position .cell.income > div:first-child,
#matrix #x_axis #positions-detail .position .cell.income-cl > div:first-child,
#matrix #x_axis #positions-detail .position .cell.income-ex > div:first-child,
#matrix #x_axis #positions-detail .position .cell.income-latest > div:first-child,
#matrix #x_axis #positions-detail .position .cell.income-ex-cl > div:first-child,
#matrix #x_axis #positions-detail .position .cell.income-long-ex > div:first-child,
#matrix #x_axis #positions-detail .position .cell.income-ex-stc > div:first-child,
#matrix #x_axis #positions-detail .position .cell.income-ee > div:first-child {
    background-color: #BEDFD1;
}

#matrix #x_axis #positions-detail .position .cell.account > div:first-child,
#matrix #x_axis #positions-detail .position .cell.sector > div:first-child,
#matrix #x_axis #positions-detail .position .cell.industry > div:first-child,
#matrix #x_axis #positions-detail .position .cell.spp > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ssp > div:first-child,
#matrix #x_axis #positions-detail .position .cell.cpp > div:first-child,
#matrix #x_axis #positions-detail .position .cell.crsp > div:first-child,
#matrix #x_axis #positions-detail .position .cell.shares > div:first-child,
#matrix #x_axis #positions-detail .position .cell.call-strike > div:first-child,
#matrix #x_axis #positions-detail .position .cell.put-strike > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ditm-strike > div:first-child,
#matrix #x_axis #positions-detail .position .cell.call-expiry > div:first-child,
#matrix #x_axis #positions-detail .position .cell.put-expiry > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ditm-expiry > div:first-child,
#matrix #x_axis #positions-detail .position .cell.sc > div:first-child,
#matrix #x_axis #positions-detail .position .cell.oc > div:first-child,
#matrix #x_axis #positions-detail .position .cell.rf > div:first-child,
#matrix #x_axis #positions-detail .position .cell.spap > div:first-child {
    background-color: #daf9ff;
}

#matrix #x_axis #positions-detail .position .cell.contracts > div:first-child,
#matrix #x_axis #positions-detail .position .cell.long-contracts > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ci > div:first-child,
#matrix #x_axis #positions-detail .position .cell.cc > div:first-child,
#matrix #x_axis #positions-detail .position .cell.cic > div:first-child,
#matrix #x_axis #positions-detail .position .cell.cv > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ci-ex > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ccps > div:first-child,
#matrix #x_axis #positions-detail .position .cell.call-intrinsic > div:first-child,
#matrix #x_axis #positions-detail .position .cell.put-intrinsic > div:first-child,
#matrix #x_axis #positions-detail .position .cell.total-fees > div:first-child,
#matrix #x_axis #positions-detail .position .cell.share-dividend > div:first-child,
#matrix #x_axis #positions-detail .position .cell.itm-call-loss > div:first-child,
#matrix #x_axis #positions-detail .position .cell.itm-put-loss > div:first-child,
#matrix #x_axis #positions-detail .position .cell.cg > div:first-child,
#matrix #x_axis #positions-detail .position .cell.acg > div:first-child,
#matrix #x_axis #positions-detail .position .cell.cgas > div:first-child,
#matrix #x_axis #positions-detail .position .cell.cgps > div:first-child,
#matrix #x_axis #positions-detail .position .cell.sc > div:first-child,
#matrix #x_axis #positions-detail .position .cell.c_comm > div:first-child,
#matrix #x_axis #positions-detail .position .cell.oc > div:first-child,
#matrix #x_axis #positions-detail .position .cell.rf > div:first-child,
#matrix #x_axis #positions-detail .position .cell.synsp > div:first-child,
#matrix #x_axis #positions-detail .position .cell.tsp > div:first-child,
#matrix #x_axis #positions-detail .position .cell.position-costs > div:first-child,
#matrix #x_axis #positions-detail .position .cell.mr > div:first-child{
    background-color: #FDFEDA;
}

#matrix #x_axis #positions-detail .position .cell.roi > div:first-child {
    background-color: #c2fed0;
}

#matrix #x_axis #positions-detail .position .cell.epps > div:first-child,
#matrix #x_axis #positions-detail .position .cell.epps-ex > div:first-child,
#matrix #x_axis #positions-detail .position .cell.be > div:first-child,
#matrix #x_axis #positions-detail .position .cell.be-put > div:first-child,
#matrix #x_axis #positions-detail .position .cell.be-call > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ier > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ier-call > div:first-child,
#matrix #x_axis #positions-detail .position .cell.ier-put > div:first-child,
#matrix #x_axis #positions-detail .position .cell.pd > div:first-child{
    background-color: #9BE5DB;
}

#matrix #x_axis #positions-detail .position .basic-info .cell.be > div:first-child,
#matrix #x_axis #positions-detail .position .basic-info .cell.be-put > div:first-child,
#matrix #x_axis #positions-detail .position .basic-info .cell.be-call > div:first-child,
#matrix #x_axis #positions-detail .position .basic-info-edit .cell.be > div:first-child,
#matrix #x_axis #positions-detail .position .basic-info .cell.spp > div:first-child,
#matrix #x_axis #positions-detail .position .basic-info .cell.ssp > div:first-child,
#matrix #x_axis #positions-detail .position .basic-info .cell.cpp > div:first-child,
#matrix #x_axis #positions-detail .position .basic-info .cell.income-latest > div:first-child,
#matrix #x_axis #positions-detail .position .basic-info-edit .cell.income-latest > div:first-child {
    font-weight: bold;
}

#matrix #x_axis #positions-detail .position .basic-info .cell.be > div:last-child,
#matrix #x_axis #positions-detail .position .basic-info .cell.spp > div:last-child {
    color: #2E7292
}

#matrix #x_axis #positions-detail .position .cell.mdr > div:first-child,
#matrix #x_axis #positions-detail .position .cell.mdr-p > div:first-child,
#matrix #x_axis #positions-detail .position .cell.mdtr > div:first-child,
#matrix #x_axis #positions-detail .position .cell.tax > div:first-child,
#matrix #x_axis #positions-detail .position .cell.tax-ex > div:first-child,
#matrix #x_axis #positions-detail .position .cell.tax-long-ex > div:first-child,
#matrix #x_axis #positions-detail .position .cell.tax-closed > div:first-child,
#matrix #x_axis #positions-detail .position .cell.tax-ex-stc > div:first-child,
#matrix #x_axis #positions-detail .position .cell.tax-ee > div:first-child {
    background-color: #F79292;
}

#matrix #x_axis #positions-detail .position .cell.ocs > div:first-child,
#matrix #x_axis #positions-detail .position .cell.opoe > div:first-child,
#matrix #x_axis #positions-detail .position .cell.opoe-call > div:first-child ,
#matrix #x_axis #positions-detail .position .cell.opoe-put > div:first-child {
    background-color: #80ccf3;
}

#matrix #x_axis #positions-detail .position .cell.ee > div:first-child,
#matrix #x_axis #positions-detail .position #early-exit .cell > div:first-child,
#matrix #x_axis #positions-detail .position #early-exit .cell > div:first-child,
#matrix #x_axis #positions-detail .position .cell.income.ee > div:first-child,
#matrix #x_axis #positions-detail .position .cell.roi.ee > div:first-child {
    background-color: #27e1ab;
}

#matrix #x_axis #positions-detail .position .cell.cost-btc > div:first-child {
    background-color: #F79292;
}

#matrix #x_axis #positions-detail .position .cell.profit-sto > div:first-child {
    background-color: #27e1ab;
}

#matrix #x_axis #positions-detail .position .cell.cost-bto > div:first-child {
    background-color: #ff7a73;
}

#matrix #x_axis #positions-detail .position .cell.profit-stc > div:first-child {
    background-color: #02c28a;
}

#matrix #x_axis #positions-detail .position .cell.profit-two > div:first-child {
    background-color: #16f1b1;
}

#matrix #x_axis #positions-detail .position .cell.profit-dividend > div:first-child {
    background-color: #35d7d4;
}

#matrix #x_axis #positions-detail .position .basic-info .cell > div:first-child {
    border-right: none;
    border-bottom: none;
}

#matrix #x_axis #positions-detail .position .cell .market-status {
    background-color: #fff !important;
    font-weight: bold;
}

#matrix #x_axis #positions-detail .position .cell .market-status > div {
    background-position: 27px 1px;
    background-size: 20px 20px;
    display: inline-block;
    padding: 4px 0 0 1px;
    width: 47%;
    text-align: left;
    line-height: 0.8em;
}

#matrix #x_axis #positions-detail .ss .position .cell .market-status > div {
    background-position: 30px 1px;
    width: 48%;

}
#matrix #x_axis #positions-detail .cr .position .cell .market-status > div {
    background-position: 25px 1px;
    width: 48%;
}
#matrix #x_axis #positions-detail .position .cell.cash-secured .value {
    background-size:16px 20px;
    background-position:22%;
}
#matrix #x_axis #positions-detail .position .cell .market-status.multiple > div {
    background-position: 30px 1px;
    width: 48%;

}

#matrix #x_axis #positions-detail .position .cell.exercised > div:last-child {
    background-size: 37px 21px;

}

#matrix #x_axis #positions-detail .position .cell.exercised .multiple > div {
    background-position: 30px 1px;
    background-size: 16px 20px;
    display: inline-block;
    padding: 4px 0 0 1px;
    width: 48%;
    text-align: left;
    line-height: 0.8em;
    font-weight: bold;
}

#matrix #x_axis #positions-detail .position .cell.status.days-none div:first-child {
    border-right: 1px solid #808184;
}

#matrix #x_axis #positions-detail .position .cell.days-green div:last-child,
#matrix #x_axis #positions-detail .position .cell.Low div:last-child {
    border: none;
    background-color: #74BF4E !important;
    color: #fff;
}

#matrix #x_axis #positions-detail .position .cell.days-orange div:last-child,
#matrix #x_axis #positions-detail .position .cell.Moderate div:last-child {
    border: none;
    background-color: #f68d2e !important;
    color: #fff;

}

#matrix #x_axis #positions-detail .position .cell.days-none div:last-child {
    border: none;
    background-color: #5ca49f !important;
    color: #fff;
}

#matrix #x_axis #positions-detail .position .cell.days-red div:last-child,
#matrix #x_axis #positions-detail .position .cell.High div:last-child {
    border: none;
    background-color: #931a1d !important;
    color: #fff;
}

#matrix #x_axis #positions-detail .position .cell.Critical div:last-child {
    border: none;
    background-color: black !important;
    color: #fff;
}

#matrix #x_axis #positions-detail .position .cell.days-blue div:last-child {
    border: none;
    background-color: #80CCF3 !important;
    color: #fff;

}

#matrix #x_axis #positions-detail .position .basic-info .cell > div:first-child {
    width: 50%;
}

#matrix #x_axis #positions-detail .position .basic-info .cell > div:last-child {
    background-color: #fff;
    text-align: right;
    border-bottom: none;
    font-size: 1.3em;
    padding-right: 5px;
    width: 44%;
}

/*history cells*/
#matrix #x_axis #positions-detail .position .cell.history {
    border-bottom: 1px solid #C6C6C7;
    background-color: #fff;
    padding: 5px 0;
}

#matrix #x_axis #positions-detail .position .cell.history.no-padding {
    padding: 0;
}

#matrix #x_axis #positions-detail .position .cell.history div {
    border-bottom: none;
    border-right: none;
}

#matrix #x_axis #positions-detail .position .cell.history div div {
    float: none;
}

#matrix #x_axis #positions-detail .position .cell.history div:last-child {
    background-color: inherit;
    width: inherit !important;
    overflow: scroll;
}

#matrix #x_axis #positions-detail .position .cell.history.no-padding div:last-child {
    padding: 0;
}

#matrix #x_axis #positions-detail .position .cell.history div.opt-total {
    width: 48%;
    float: left;
    background-color: #DAF9FF;
    text-align: center;
    line-height: 1.4em;
}

#matrix #x_axis #positions-detail .position .cell.history div.opt-total:nth-of-type(2) {
    background-color: #FDFEDA;
}

#matrix #x_axis #positions-detail .position .cell.history span {
    position: relative;
    left: 2px;
    bottom: 1px;
    font-size: 0.85em;
}

#matrix #x_axis #positions-detail .position .cell.history span > span {
    background-size: auto auto;
    display: inline-block;
    height: 19px;
    position: relative;
    margin-right: 11px;
    top: 3px;
    width: 19px;
}

#matrix #x_axis #positions-detail .position .cell.history span.plus {
    background-image: url("../images/plus-three.svg");
    background-repeat: no-repeat;
}

#matrix #x_axis #positions-detail .position .cell.history span.minus {
    background-image: url("../images/minus-three.svg");
    background-repeat: no-repeat;
}

#matrix #y_axis {
    float: left;
    width: 13%;
    position: relative;
}

#matrix #y_axis #y_header {
    height: 30px;
    background-color: #283d4f;
    font-size: 1.8em;
    color: #fff;

}

#matrix #y_axis #y_header > span {
    position: relative;
    left: 10px;
    top: 4px;

}

#matrix #y_footer {
    background-color: #283d4f;
    border-top: 1px solid #AFAFB1;
    font-size: 13px;
    height: 30px;
    line-height: 2.3em;
    position: relative;
    z-index: 99;
}

#matrix #y_footer_fake {
    position: absolute;
    width: 13%;
    bottom: 0;
    background-color: #283d4f;
    font-size: 13px;
    height: 30px;
    line-height: 2.3em;
    z-index: 99;
}

#matrix #y_footer a, #matrix #y_footer_fake a {
    display: inline-block;
    height: 13px;
    width: 80%;
    text-align: center;
    line-height: 1em;
    color: #fff;
    background-color: #5ca49f;
    border-radius: 2px;
    padding: 4px;
    position: relative;
    left: 10px;
    bottom: -1px;
}

#matrix #y_footer a:hover, #matrix #y_footer_fake a:hover {
    color: #5ca49f;
    background-color: #fff;
}

#matrix #y_footer a, #matrix #y_footer_fake a.hidden {
    display: none;
}

#matrix #y_axis #positions {
    position: relative;
    top: 7px;
    font-size: 0.9em;
}

#matrix #y_axis .year-positions {
    height: 455px;
    overflow-y: scroll;
    overflow-x: hidden;
}

#matrix #y_axis #positions li,
#matrix #y_axis .year-positions li,
#matrix #y_axis #accounts li {
    height: 31px;
    border-bottom: 1px solid #C6C6C7;
    padding: 3px 0;
    border-bottom: 1px solid #C6C6C7;
}
#matrix #y_axis #accounts li {
    line-height: 1.8em;
    font-size: 1.3em;
    height: 40px;
}
#matrix #y_axis .year-positions li:first-child {
    border-top: 1px solid #C6C6C7;
}

#matrix #y_axis #positions li > a,
#matrix #y_axis .year-positions li > a,
#matrix #y_axis #accounts li > a {
    border: 1px solid #5F707D;
    border-radius: 3px;
    display: block;
    font-weight: 700;
    height: 20px;
    left: 7px;
    position: relative;
    text-align: center;
    top: 4px;
    width: 88%;
}

#matrix #y_axis .year-positions li > a {
    border: 1px solid #80CCF3;
}
#matrix #y_axis #accounts li > a{
    border:none;
}

#matrix #y_axis #positions .liActive,
#matrix #y_axis .year-positions .liActive,
#matrix #y_axis #accounts .liActive {
    background-color: #7AD8D1 !important;
}

#matrix #y_axis #positions li a > div {
    text-transform: uppercase;
    line-height: 1.6em;
    background-color: #5F707D;
}

#matrix #y_axis .ticker {
    background-color: #5F707D;
    color: #FFFFFF;
    display: inline-block;
    width: 50%;
    height: 20px;
    border-radius: 2px;
}

#matrix #y_axis .cr .ticker {
    width: 70% !important;
}

#matrix #y_axis .trade-plan .ticker {
    background-color: #C2BCA9;

}

#matrix #y_axis .type {
    background-color: #FFFFFF;
    color: #5F707D;
    display: inline-block;
    width: 50%;
    height: 20px;
    -webkit-border-top-right-radius: 2px;
    -moz-border-radius-topright: 2px;
    border-top-right-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    -moz-border-radius-bottomright: 2px;
    border-bottom-right-radius: 2px;
}

#matrix #y_axis .cr .type {
    width: 30% !important;

}

#matrix #y_axis #positions li:hover a > div {
    background-color: #B0B5BC;
}

#matrix #y_axis #positions li:hover .ticker {
    background-color: #B0B5BC;

}

#matrix #y_axis #positions li:hover .type {
    color: #B0B5BC;
}

#matrix #y_axis #positions li:hover > a,
#matrix #y_axis .year-positions li:hover > a {
    border: 1px solid #B0B5BC;
}

#matrix #y_axis #add_position {
    background: url("../images/plus-two.svg") no-repeat center top;
    color: #FFFFFF;
    display: inline-block;
    height: 26px;
    position: absolute;
    right: 6px;
    top: 3px;
    width: 24px;
    background-size: 24px 51px;
}

#matrix #y_axis #add_position:hover {
    background-position: center -29px;
}

#matrix #y_axis #filter {
    background: url("../images/filter-buttons.svg") no-repeat center top;
    display: inline-block;
    height: 24px;
    position: absolute;
    right: 8px;
    top: 3px;
    width: 20px;
    background-size: 20px 46px;
}

#matrix #y_axis #filter:hover {
    background-position: center -24px;
}

#matrix #y_axis #activate {
    display: inline-block;
    height: 20px;
    width: 26px;
    position: absolute;
    right: 35px;
    top: 2px;
    text-align: center;
    line-height: 1.1em;
    color: #fff;
    background-color: #edc71c;
    border-radius: 2px;
    font-size: 0.7em;
    padding: 2px;
}

#matrix #y_axis #activate:hover {
    background-color: #fff;
    color: #edc71c;
}

#matrix #y_axis #activate.on {
    color: #fff;
    background-color: #27e1ab;

}

#matrix #y_axis .position-filter {
    z-index: 999;
    position: absolute;
    top: 30px;
    height: 50px;
    width: 100%;
    background-color: #22BEB3;
    display: none;
}

#matrix #y_axis .position-filter select {
    width: 90%;
    font-size: 0.5em;
    position: relative;
    left: 7px;
    top: 10px;
    height: 30px;
    padding: 5px;
}

#matrix #y_axis #y_header ul {
    height: 100px;
    width: 100%;
    position: absolute;
    z-index: 999;
    top: 30px;
    right: 0;
    display: none;
}

#matrix #y_axis #y_header ul li {
    position: relative;
    border-bottom: 2px solid #8A8B8D;
    width: 100%;
}

#matrix #y_axis #y_header ul li:last-child {
    border-bottom: none;
}

#matrix #y_axis #y_header ul li a {
    display: inline-block;
    height: 86px;
    width: 100%;
    cursor: pointer;
    font-size: 0;
    background-color: rgba(40, 61, 79, 0.9);
    background-position: center 10px;
}

#matrix #y_axis #y_header ul li span {
    bottom: 12px;
    display: inline-block;
    font-size: 0.4em;
    left: 0;
    top: 62px;
    position: absolute;
    text-align: center;
    width: 100%;
    color: #8A8B8D;

}

#matrix #y_axis #y_header li a:hover {
    background-position: center -132px;
}

/* closed positions */

#positions-closed #matrix #y_axis .ticker {

    width: 60%;
}

#positions-closed #matrix #y_axis .type {

    width: 40%;
    color: #2b7094;
}

#positions-closed #matrix #y_axis #y_header {
    background-color: #2b7094;

}

#matrix #y_axis .year-positions li ul li > a {
    border-color: #2b7094;
}

#positions-closed #matrix #y_axis .year-positions li ul li .type {
    color: #2b7094;
}

#positions-closed #matrix #y_axis .year-positions li > a {
    border: 1px solid #2b7094;
}

#positions-closed #matrix #y_axis .year-positions li a > div {

    text-transform: uppercase;
    background-color: #2b7094;
}

#positions-closed #matrix #y_axis #years {
    color: #fff;
    font-size: 0.7em;
    height: 25px;
    left: 5px;
    line-height: 1.5em;
    position: relative;
    top: 1px;
}

#positions-closed #matrix #y_axis #years select {
    font-size: 0.8em;
    height: 20px;
    position: relative;
    right: 0;
    padding: 2px;
    width: 50%;
}

#positions-closed #matrix #y_axis #positions li {
    border-bottom: 1px solid #D3D3D3;
    height: 30px;
    padding: 2px 0;
}

#positions-closed #matrix #y_axis .year-positions .month-positions {
    margin-top: 10px;
}

#positions-closed #matrix #y_axis .year-positions .month-positions li:last-child {
    border-bottom: none;
}

#positions-closed #matrix #y_axis .ticker {
    background-color: #2b7094;
}

#positions-closed #matrix #y_axis .month-positions .ticker {
    background-color: #2b7094;
}

#positions-closed #matrix #y_axis .month-positions li:hover .ticker {
    background-color: #B0B5BC !important;

}

#positions-closed #matrix #y_footer_fake {
    background-color: #2b7094;
}

#positions-closed #matrix #y_footer_fake #search-closed {
    margin: 0 5px;
}

#positions-closed #matrix #y_footer_fake #search-closed input[type="text"] {
    width: 78%;
    color: #9B9B9B;
    border: none;
    border-radius: 2px;
    padding-left: 4px;
    height: 22px;
    position: relative;
    top: 2px;
    font-size: 1.2em;
}

#positions-closed #matrix #y_footer_fake #search-closed input[type="submit"] {
    background: url(../images/search.svg) no-repeat scroll left center / 200% 200% rgba(0, 0, 0, 0);
    border: medium none;
    bottom: 4px;
    font-size: 0;
    height: 23px;
    position: relative;
    right: -1px;
    width: 17%;
}

#positions-closed #matrix #y_footer_fake #search-closed input[type="submit"]:hover {
    background-position: -21px center;
}

#positions-closed #matrix #y_axis #positions .liActive,
#positions-closed #matrix #y_axis .year-positions .liActive {
    background-color: #C2FED0 !important;
}

#positions-closed #matrix #y_footer_fake #search-closed input[type="submit"]:hover {
    cursor: pointer;
}

#positions-closed .position-active {
    border: 1px solid #2b7094 !important;
}

#positions-closed .position-header {
    background-color: #2b7094 !important;
}

#positions-closed .position-footer {
    background-color: #2b7094 !important;
}

#positions-closed .position-header-active {
    background-color: #283D4F !important;
}

#positions-closed .position-footer-active {
    background-color: #283D4F !important;
}

#positions-closed .highlight .position-header {
    background-color: orangered !important;
}

#positions-closed .highlight .position-footer {
    background-color: orangered !important;
}

#positions-closed #matrix #x_axis #positions-detail .position .position-header .when-closed {
    bottom: 3px;
    right: 4px;
    position: absolute;
    font-size: 0.85em;
}

#positions-closed #matrix #x_axis #positions-detail .position .position-header .company {
    left: 5px;
    top: 35px;
}

#positions-closed #matrix #x_axis #positions-detail .position .position-footer .delete-position {
    right: 2%;
}

#positions-closed #matrix #x_axis #positions-detail .position .position-footer .email-position {
    bottom: 4px;
    right: 14%;
}

#positions-closed #matrix #x_axis #positions-detail .position .position-footer .undo-position {
    border-radius: 2px;
    bottom: 3px;
    left: 2%;
}

#positions-closed #matrix #x_axis #positions-detail .position .position-footer .undo-position:hover {
    background-color: #fff;
    color: #edc71c;
}

#positions-closed #matrix #x_axis #positions-detail .position .position-footer .undo-position-no {
    background: url("../images/cross-five.svg") no-repeat center top;
    bottom: 2px;
    height: 10px;
    left: 3%;
    width: 10px;
    background-size: cover;
}

#positions-closed #matrix #x_axis #positions-detail .position .position-footer .toggle-info {
    left: 25%;
}

#positions-closed #matrix #x_axis #positions-detail .position .note {
    background-color: #2B7094;

}

/*command center */
#positions-overview #matrix {
    border: none;
}

#positions-overview #y_axis {
    height: 590px;
    width: 7.8%;
}

#positions-overview #y_axis #tabs.ui-widget-header {
    background-color: transparent;
}

#positions-overview #y_axis #tabs li.ui-state-default {
    background: transparent;

}

#positions-overview #x_axis {
    width: 91%;
    height: 590px;
    box-shadow: none;
    border-left: 5px solid #283d4f;

}

#positions-overview #x_axis #positions-pane.ui-widget-content {
    background: none;

}

#positions-overview #x_axis #container {
    height: 93.3%;

}

#positions-overview #x_axis .ui-tabs-panel {
    height: 100%;
    background: none;
}

#positions-overview #matrix #x_axis #footer {
    background-color: #283d4f;
    clear: both;
    width: 102%;
    height: 40px;
    top: 0;
    font-size: 1em;
}

#positions-overview #matrix #x_axis #footer ul {
    color: #fff;
    top: 9px;
    display: none;
}

#positions-overview #matrix #x_axis #footer ul li {
    margin-right: 10px;
}

#positions-overview #matrix #x_axis #footer ul li span {
    color: #31b7ae;
}

#positions-overview #matrix #y_axis #tabs {
    height: 464px;
    width: 98.8%;

}

#positions-overview #matrix #y_axis #tabs li {
    font-weight: inherit;
    height: 14.3%;
    border-bottom: 1px solid #edf0f1;
    border-left: none;
    border-right: none;
    border-top: none;
    position: relative;
}

#positions-overview #matrix #y_axis #tabs li span {
    position: absolute;
    top: 4px;
    left: 3px;
    z-index: 999;
    color: #fff;
    padding: 5px;
    background-color: #2B7094;
    border-radius: 50%;
    height: 10px;
    width: 10px;
    vertical-align: middle;
    line-height: .8em;
    display: none;
    border: 1px solid #fff;
    cursor: pointer;
}

#positions-overview #matrix #y_axis #tabs li span:hover {
    cursor: pointer;
    color: #31b7ae;
}

#positions-overview #matrix #y_axis div#count {
    height: 52px;
    outline: 1px solid #edf0f1;
    width: 98.8%;
}

#positions-overview #matrix #y_axis #tabs li.ui-tabs-active {
    background: transparent;
    outline: none;
}

#positions-overview #matrix #y_axis div#count span {
    display: block;
    font-size: 2em;
    color: #6D6E70;
    font-weight: 600;
    margin: 0 auto;
    position: relative;
    text-align: center;
    top: 15px;
    width: 60%;
}

#positions-overview #matrix #y_axis #tabs li#positions-list a {
    background: url("../images/positions.svg") no-repeat;

}

#positions-overview #matrix #y_axis #tabs li#bar-graph a {
    background: url("../images/graph-one.svg") no-repeat;
}

#positions-overview #matrix #y_axis #tabs li#bar-graph-percent a {
    background: url("../images/graph-two.svg") no-repeat;
}

#positions-overview #matrix #y_axis #tabs li#bar-graph-three a,
#positions-overview #matrix #y_axis #tabs li#bar-graph-fees a {
    background: url("../images/graph-three.svg") no-repeat;
}

#positions-overview #matrix #y_axis #tabs li#pie-one a {
    background: url("../images/pie-one.svg") no-repeat;
}

#positions-overview #matrix #y_axis #tabs li#pie-two a {
    background: url("../images/pie-two.svg") no-repeat;
}

#positions-overview #matrix #y_axis #tabs li#pie-three a {
    background: url("../images/pie-three.svg") no-repeat;
}

#positions-overview #7_axis #bar-graph-percent-pane {
    background: url("../images/test-bar.png") no-repeat;
}

#positions-overview #matrix #y_axis #tabs a {
    display: inline-block;
    width: 101%;
    height: 102%;
    background-size: 295% 295% !important;
    background-position: center 5px !important;
    position: relative;
    z-index: 2;
}

#positions-overview #matrix #y_axis #tabs a:hover {
    background-position: center -57px !important;
}

#positions-overview #matrix #y_axis #tabs .ui-state-active a {
    background-position: center bottom !important;
    background-color: #22BEB3 !important;
}

#positions-overview #matrix #y_axis #tabs a:focus {
    outline: none;
}

/* positions overview positions */
#positions-overview #x_axis #positions-pane #header {
    background-color: #283d4f;
    height: 52px;
    /*stupid rounding error with percent widths means we have to add 1% here */
    width: 102%;
    border-top-right-radius: 16px;
}

#positions-overview #x_axis #positions-pane #header li {

    color: #fff;
    display: table-cell;
    font-size: 1.2em;
    font-weight: 300;
    height: 52px;
    line-height: 2.8em;
    text-align: center;
    text-transform: uppercase;
    width: 19.3%;
    border-right: 1px solid #a1aab2;
    position: relative;
    letter-spacing: 2px;
}

#positions-overview #x_axis #positions-pane #header li:last-child {

    border-right: none;
}

#positions-overview #x_axis #positions-pane #header li a {

    color: #fff;
    cursor: pointer;
    line-height: inherit;
}

#positions-overview #x_axis #positions-pane #header li a:hover {

    color: #22BEB3;
}

#positions-overview #x_axis #positions-pane #header li.sorting {

    background: url("../images/updown.png") no-repeat 91% center;
}

#positions-overview #x_axis #positions-pane #data #no-positions {
    margin: 200px auto;
    text-transform: none;
    width: 40%;

}

#positions-overview #x_axis #positions-pane #data #new-user {
    text-transform: none;
    width: 100%;
    height: 100%;
    background-color: rgba(40, 61, 79, 0.7);

}

#new-user .video-holder {
    left: 55px;
    top: 15px;
    width: 44.5%;
}

#positions-overview #x_axis #positions-pane #data #new-user p {
    padding: 20px;
    line-height: 1.9em;
    color: #fff;

}

#positions-overview #x_axis #positions-pane #data #new-user p #gears {
    background: url("../images/gears.svg") no-repeat scroll center top rgba(0, 0, 0, 0);
    background-size: 200% 200%;
    display: inline-block;
    height: 24px;
    top: 9px;
    position: relative;
    width: 24px;

}

#positions-overview #x_axis #positions-pane #data #new-user p #help {
    background: url("../images/question.svg") no-repeat scroll center top rgba(0, 0, 0, 0);
    background-size: 200% 200%;
    display: inline-block;
    height: 24px;
    top: 9px;
    position: relative;
    width: 24px;

}

#positions-overview #x_axis #positions-pane #data #new-user p:first-child::first-letter {
    font-size: 3em;

}

#positions-overview #x_axis #positions-pane #data #new-user p a {
    color: #22BEB3;

}

#positions-overview #x_axis #positions-pane #data #new-user p a:hover {
    color: #ff780b;

}

#positions-overview #x_axis #positions-pane #data .health-info {
    height: inherit;
}

#positions-overview #x_axis #positions-pane #data .health-info .info {

    background-color: rgba(0, 0, 0, 0);
    background-image: url("../images/dividers-two.png");
    border: medium none;
    color: #404041;
    display: none;
    font-weight: 400;
    height: 50px;
    position: absolute;
    left: 1px;
    top: 1px;
    width: 100%;
    z-index: 19;
}

#positions-overview #x_axis #positions-pane #data .health-info .info.green-info {
    background-color: #c9eeb7;
}

#positions-overview #x_axis #positions-pane #data .health-info .info.red-info {
    background-color: #ea7d80;
}

#positions-overview #x_axis #positions-pane #data .health-info .info.orange-info {
    background-color: #f4c08f;
}

#positions-overview #x_axis #positions-pane #data .health-info .info.blue-info {
    background-color: #84bfda;
}

#positions-overview #x_axis #positions-pane #data .health-info .info > span {
    background-color: rgba(0, 0, 0, 0);
    color: inherit;
    height: 50%;
    width: 100%;
    display: table-row;
    font-size: 11px;
    line-height: 2.5em;
}

#positions-overview #x_axis #positions-pane #data .health-info .info > span > span {
    background-color: inherit;
    color: inherit;
    display: table-cell;
    height: 26px;
    text-align: center;
    width: 91px;
}

#positions-overview #x_axis #positions-pane #data .health {
    display: inline-block;
    width: 72px;
    height: 37px;
    position: relative;
    top: 12px;
    background-color: transparent;
    z-index: 20;
}

#positions-overview #x_axis #positions-pane #data .health:hover {
    background-position: center -42px;
    cursor: pointer;
}

#positions-overview #x_axis #positions-pane #data {
    text-transform: uppercase;
    overflow-y: scroll;
    overflow-x: hidden;
    width: 101%;
    height: 90.3%;
}

#positions-overview #x_axis #positions-pane #data ul {
    left: 0;
}

#positions-overview #x_axis #positions-pane #data a {
    color: #6D6E70;
    display: inline-block;
    position: relative;
    z-index: 19;
}

#positions-overview #x_axis #positions-pane #data li {
    list-style: none;
    height: 55px;
    padding-left: 6px;
    width: 100%;
    position: relative;
}

#positions-overview #x_axis #positions-pane #data li > span {
    display: inline-block;
    height: 53px;
    width: 100%;
}

#positions-overview #x_axis #positions-pane #data .expiries {
    background: url("../images/exclaim-two.svg") no-repeat scroll center top rgba(0, 0, 0, 0);
    background-size: auto 231%;
    height: 19px;
    right: 4px;
    width: 18px;
    top: 0;
    position: absolute;
}

#positions-overview #x_axis #positions-pane #data .expiries:hover {
    background-position: center -26px;
    box-shadow: none;
}

#positions-overview #x_axis #positions-pane #data .expiry-info {
    position: absolute;
    background: url("../images/grey-bg.svg") no-repeat center;
    background-size: cover;
    display: none;
    z-index: 99;
    top: 34px;
    right: 0;
    width: 185px;
    height: 116px;
}

#positions-overview #x_axis #positions-pane #data .expiry-info ul {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    top: 38px;
    left: 18px;
    width: 74%;
}

#positions-overview #x_axis #positions-pane #data .expiry-info li {
    height: 25px;
}

#positions-overview #x_axis #positions-pane #data .expiry-info li:last-child {
    padding-top: 10px;
}

#positions-overview #x_axis #positions-pane #data li > span > span {
    display: inline-block;
    text-align: center;
    width: 19%;
    position: relative;
}

#positions-overview #x_axis #positions-pane #data li span.date-info > span {
    cursor: pointer;
}

#positions-overview #x_axis #positions-pane #data li span.date-display {
    position: absolute;
    top: -21px;
    left: 26px;
    width: 108px;
    padding: 0 5px;
    height: 22px;
    display: none;
    color: #fff;
}

#positions-overview #x_axis #positions-pane #data li span.date-display.days-red {
    background-color: #801a1d;
    border: 1px solid #801a1d;
}

#positions-overview #x_axis #positions-pane #data li span.date-display.days-green {
    background-color: #7d9f00;
    border: 1px solid #7d9f00;
}

#positions-overview #x_axis #positions-pane #data li span.date-display.days-orange {
    background-color: #e1802e;
    border: 1px solid #e1802e;
}

#positions-overview #x_axis #positions-pane #data li span.date-display.days-blue {
    background-color: #84bfda;
    border: 1px solid #84bfda;
}

#positions-overview #x_axis #positions-pane #data li span.date-display.days-none {
    background-color: #5ca49f;
    border: 1px solid #5ca49f;
}

#positions-overview #x_axis #positions-pane #data li span a.refresh-position {
    background: url("../images/refresh-three.svg") no-repeat scroll center top rgba(0, 0, 0, 0);
    background-size: 250% 250%;
    bottom: -3px;
    height: 24px;
    right: -6px;
    text-align: center;
    width: 24px;
    z-index: 20;
}

#positions-overview #x_axis #positions-pane #data li span a.refresh-position:hover {
    background-position: center -39px;
}

#positions-overview #x_axis #positions-pane li > span > span > span,
#positions-overview #x_axis #positions-pane #data .expiry-info li > span {

    display: inline-block;
    height: 22px;
    line-height: 1.5em;
    background-color: #fff;
    position: relative;
    bottom: 5px;
    border-radius: 3px;
}

#positions-overview #x_axis #positions-pane #data .expiry-info li > span:first-child {
    width: 86%;
}

#positions-overview #x_axis #positions-pane li .info {
    border: 1px solid #5f707d;
    font-weight: bold;
    display: inline-block;
    height: 22px;
    line-height: 1.6em;
    background-color: #fff;
    position: relative;
    bottom: 5px;
    border-radius: 3px;
}

#positions-overview #x_axis #positions-pane .info span:first-child {
    background-color: #5f707d;
    color: #fff;
}

#positions-overview #x_axis #positions-pane .trade-plan .info span:first-child {
    background-color: #C2BCA9;
}

#positions-overview #x_axis #positions-pane .info span:first-child:hover {
    background-color: #B0B5BC;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    -webkit-border-bottom-left-radius: 2px;
    -webkit-border-top-left-radius: 2px;
}

#positions-overview #x_axis #positions-pane .info span:last-child {
    color: #5f707d;
}

#positions-overview #x_axis #positions-pane .days > span,
#positions-overview #x_axis #positions-pane .info > span,
#positions-overview #x_axis #positions-pane #data .expiry-info li > span > span {
    display: inline-block;
    height: 100%;
    width: 54px;
}

#positions-overview #x_axis #positions-pane .info.CR span.ticker {
    width: 80px
}

#positions-overview #x_axis #positions-pane .info.CR span.type {
    width: 28px
}

#positions-overview #x_axis #positions-pane #data .expiry-info li > span:last-child {
    border: 1px solid #6d6e70;
    border-radius: 50%;
    font-weight: 500;
    line-height: 1.6em;
    width: 16%;
    position: absolute;
    right: -19px;
    bottom: 6px;
}

#positions-overview #x_axis #positions-pane .days-blue > span:first-child {
    width: 50px;
}

#positions-overview #x_axis #positions-pane .days-blue > span:last-child {
    width: 58px;
}

#positions-overview #x_axis #positions-pane .days span:first-child {
    color: #fff;
}

#positions-overview #x_axis #positions-pane .days span:last-child {
    background-color: transparent;
    padding-right: 4px;
}

#positions-overview #x_axis #positions-pane .days-green > span {
    background-color: #7d9f00;

}

#positions-overview #x_axis #positions-pane .days-green {
    border: 1px solid #7d9f00;
}

#positions-overview #x_axis #positions-pane .days-orange > span {
    background-color: #e1802e;

}

#positions-overview #x_axis #positions-pane .days-orange {
    border: 1px solid #e1802e;
}

#positions-overview #x_axis #positions-pane .days-red > span {
    background-color: #801a1d;

}

#positions-overview #x_axis #positions-pane .days-red {
    border: 1px solid #801a1d;
}

#positions-overview #x_axis #positions-pane .days-blue > span {
    background-color: #84bfda;

}

#positions-overview #x_axis #positions-pane .days-none > span {
    background-color: #5ca49f;
}

#positions-overview #x_axis #positions-pane .days-blue {
    border: 1px solid #84bfda;
}

#positions-overview #x_axis #positions-pane .days-none {
    border: 1px solid #5ca49f;
}

/*positions inlines */
#position-edit-inlines.closed #y_axis #y_header {
    background-color: #2b7094;
}

#position-edit-inlines.closed #y_footer_fake {
    background-color: #2b7094;
}

#position-edit-inlines #y_axis #positions {
    height: 539px;
    overflow-x: hidden;
    overflow-y: scroll;
}

#position-edit-inlines #x_axis #data {
    border: medium none;
    min-height: 560px;
    left: 17px;
    position: relative;
    top: 11px;
    width: 96%;
}

#position-edit-inlines #x_axis {
    min-height: 600px;
}

#position-edit-inlines #x_axis ul#tabs {
    background-color: transparent;
    float: none;
    height: 43px;
    left: 0;
}

#position-edit-inlines #x_axis ul#tabs li {
    background-color: #d1d1d1;
    border: medium none;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff;
    float: left;
    height: inherit;
    margin-right: 4px;
    text-align: center;
    width: 24.63%;
}

#position-edit-inlines #x_axis ul#tabs.five li {
    width: 19.53%;
}

#position-edit-inlines #x_axis ul#tabs li:last-child {
    margin-right: 0;
}

#position-edit-inlines #x_axis ul#tabs li a {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #9d9d9c;
    display: inline-block;
    height: 93%;
    padding-top: 3px;
    width: 100%;
}

#position-edit-inlines #x_axis ul#tabs li.ui-state-active a, #position-edit-inlines #x_axis ul#tabs li a:hover {
    background-color: #283d4f;
    color: #35d7d4;
}

#position-edit-inlines.closed #x_axis ul#tabs li.ui-state-active a, #position-edit-inlines.closed #x_axis ul#tabs li a:hover {
    background-color: #2b7094;
}

#position-edit-inlines #x_axis ul#tabs li.ui-tabs-active a {
    font-weight: normal;
}

#position-edit-inlines #x_axis #tab-data {
    min-height: 490px;
    position: relative;
}

#position-edit-inlines #matrix #x_axis #footer {
    background-color: #283d4f;
    clear: both;
    height: 40px;
    top: 0;
    font-size: 1em;
    line-height: 2.5em;
    color: #fff;
    padding-left: 10px;
    margin-bottom: 30px;
}

#position-edit-inlines.closed #matrix #x_axis #footer {
    background-color: #2b7094;
}

#position-edit-inlines #matrix #x_axis .position-button,
#tax-rates-edit-inlines .profile-button {
    background-color: #22beb3;
    color: #fff;
    padding: 5px;
    cursor: pointer;
    text-align: center;
    font-size: 1.1em;
    border-radius: 2px;
    margin-left: 10px;
    position: relative;
    top: 2px;
    font-weight: normal;
}

#position-edit-inlines #matrix #x_axis .position-button:hover,
#tax-rates-edit-inlines .profile-button:hover {
    background-color: #fff;
    color: #22beb3;
}

#position-edit-inlines #x_axis #tab-data > div {
    background-color: #e6eaec;
    height: 100%;
    min-height: 490px;
    float: left;
    width: 100%;
}

#position-edit-inlines #x_axis #tab-data > div > form {
    left: 25px;
    position: relative;
    top: 16px;
    width: 93%;
    padding-bottom: 30px;
}

#position-edit-inlines .form-holder {
    margin-bottom: 15px;
}

#position-edit-inlines .form-holder .form-input,
#position-edit-inlines .form-holder .form-input-read,
#tax-rates-edit-inlines .form-holder .form-input {
    display: inline-block;
    width: 48%;
    margin-left: 8px;
    font-size: 1.3em;
    font-weight: 500;
}

#position-edit-inlines .form-holder .form-input.hidden {
    display: none;
}

#position-edit-inlines #matrix #x_axis .form-holder .position-button {
    margin-left: 0;
    font-size: .9em;
    font-weight: 200;
}

#position-edit-inlines #matrix #x_axis .form-holder .position-button:hover {
    background-color: #c2c4c4;
    color: #22beb3;
}

#position-edit-inlines .form-holder .form-input input,
#position-edit-inlines .form-holder .form-input-read > div,
#tax-rates-edit-inlines .form-holder .form-input input {
    background-color: #f2f2f2;
    border-color: #c4c4c4;
    border: none;
    font-weight: 100;
    font-size: 1em;
    margin-bottom: 10px;
    width: 91%;

}

#position-edit-inlines .form-holder .form-input input {
    width: 97%;
}

#position-edit-inlines .form-holder .form-input-read > div,
#position-edit-inlines .form-holder .form-input input[readonly] {
    padding: 10px;
    background-color: #c2c4c4;
}

#position-edit-inlines .form-holder .form-input input:hover {
    background-color: #e4e4e4;
}

#position-edit-inlines form input.button,
#tax-rates-edit-inlines form input.button {
    background-color: #22beb3;
    color: #fff;
    padding: 5px;
    cursor: pointer;
    text-align: center;
    font-size: 1.1em;
    height: 32px;
    margin-bottom: 10px;
}

#position-edit-inlines form input.button:hover,
#tax-rates-edit-inlines form input.button:hover {
    background-color: #fff;
    color: #22beb3;
}

#position-edit-inlines .check-holder,
#tax-rates-edit-inlines .check-holder {
    margin-left: 25px;
    width: 48%;
    display: inline-block;
}

#position-edit-inlines .check-holder > label,
#tax-rates-edit-inlines .check-holder > label {
    color: #000;
    font-size: 1.3em;
    font-weight: 500;
}

#position-edit-inlines .check-holder .check div,
#tax-rates-edit-inlines .check-holder .check div {
    top: -20px;
}

#position-edit-inlines .check-holder > div:last-child,
#tax-rates-edit-inlines .check-holder > div:last-child {
    float: none;
    bottom: 7px;
}

#position-edit-inlines .check-holder .check:after,
#tax-rates-edit-inlines .check-holder .check:after {
    font-size: 1.7em;
    left: 36px;
    line-height: 0.7em;
}

#position-edit-inlines .header {
    background-color: #f2f2f2;
    color: #283d4f;
    font-size: 1.7em;
    font-weight: 400;
    height: 45px;
    line-height: 1.8em;
    padding-left: 20px;
    position: relative;
    border: none;
    cursor: pointer;
}

#position-edit-inlines .header:hover {
    background-color: #e4e4e4;
}

#position-edit-inlines .header.error,
#tax-rates-edit-inlines .header.error {
    background-color: rgba(229, 70, 60, 0.9) !important;

}

#position-edit-inlines .header.delete {
    outline: 2px solid rgba(229, 70, 60, 0.9) !important;

}

#position-edit-inlines .header.ui-state-active {
    background-color: #98d5cf;
    background-image: none;
    border: none;
}

#position-edit-inlines .header .ui-accordion-header-icon {
    display: inline-block;
    height: 100%;
    position: absolute;
    right: 0;
    width: 50px;
    background: url("../images/plus-two.svg") no-repeat center 3px #283d4f;
    background-size: 44px 90px;
}

#position-edit-inlines .header.ui-state-active .ui-accordion-header-icon {
    background: url("../images/minus-two.svg") no-repeat center 3px #283d4f;
    background-size: 44px 90px;
}

#position-edit-inlines .header .ui-accordion-header-icon:hover {
    background-position: center -48px;
}

#position-edit-inlines form .inline-form {
    margin-bottom: 10px;
}

#position-edit-inlines .trade-open {
    color: #7d9f00;
}

#position-edit-inlines .trade-closed {
    color: #84bfda;
}

#position-edit-inlines #x_axis #bars-holder {
    height: 100%;
    left: 0;
    position: relative;
    width: 100%;
    margin-bottom: 30px;
}

#position-edit-inlines #x_axis #included-positions a {
    border: 1px solid #5F707D;
    border-radius: 3px;
    display: inline-block;
    font-weight: bold;
    height: 20px;
    left: 7px;
    position: relative;
    text-align: center;
    top: -12px;
    width: 15%;
}

#position-edit-inlines #x_axis #included-positions a > div {
    text-transform: uppercase;
    background-color: #5F707D;


}

#position-edit-inlines #x_axis #included-positions a .ticker {
    background-color: #5F707D;
    color: #FFFFFF;
    display: inline-block;
    width: 50%;
    height: 20px;
    border-radius: 2px;
}

#position-edit-inlines #x_axis #included-positions a .type {
    background-color: #FFFFFF;
    color: #5F707D;
    display: inline-block;
    width: 50%;
    height: 20px;
    -webkit-border-top-right-radius: 2px;
    -moz-border-radius-topright: 2px;
    border-top-right-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    -moz-border-radius-bottomright: 2px;
    border-bottom-right-radius: 2px;
}

#position-edit-inlines #x_axis #included-positions a:hover > div {
    background-color: #B0B5BC;
}

#position-edit-inlines #x_axis #included-positions a:hover .ticker {
    background-color: #B0B5BC;

}

#position-edit-inlines #x_axis #included-positions a:hover .type {
    color: #B0B5BC;
}

#position-edit-inlines #x_axis #included-positions a:hover {
    border: 1px solid #B0B5BC;
}

/* command center report labs stuff */
#positions-overview #x_axis .report .google-command-chart {
    float: left;
    margin: 5px;
    cursor: pointer;
    position: relative;
    left: 30px;
    width: 45%;
}

#positions-overview #x_axis .report,
#position-edit-inlines #x_axis .report {
    position: relative;
    text-align: center;
    top: 8px;
    left: 17px;
    width: 95%;
    font-size: 0.9em;
    -webkit-border-top-left-radius: 8px;
    -webkit-border-top-right-radius: 8px;
    -moz-border-radius-topleft: 8px;
    -moz-border-radius-topright: 8px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;
    -moz-border-radius-bottomright: 8px;
    -moz-border-radius-bottomleft: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    border: 1px solid #283D4F;
    background-color: #fff;
    margin-bottom: 13px;
    clear: both;

}

#positions-overview #x_axis .report p.title,
#position-edit-inlines #x_axis .report p.title {
    height: 28px;
    background-color: #283D4F;
    color: #fff;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    line-height: 1.9em;

}

#positions-overview #x_axis .report.closed-graph p.title,
#position-edit-inlines.closed #x_axis .report p.title {
    background-color: #207092;
}

#positions-overview #x_axis .report .footer,
#position-edit-inlines #x_axis .report .footer {
    height: 13px;
    background-color: #283D4F;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    -moz-border-radius-bottomright: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    clear: both;
}

#positions-overview #x_axis .report.closed-graph .footer,
#position-edit-inlines.closed #x_axis .report .footer {
    background-color: #207092;
}

#positions-overview #x_axis .bar-report-scroll {
    overflow-x: scroll;
    overflow-y: hidden;
}

#positions-overview #x_axis #bars-holder {
    height: 100%;
    left: 0;
    overflow-x: hidden;
    overflow-y: scroll;
    position: relative;
    width: 101%;
}

#positions-overview #x_axis .bar-report-scroll-vertical {
    overflow-x: hidden;
    overflow-y: scroll;
}

#positions-overview #x_axis .report > p.info {
    margin: 5px;
}

#positions-overview #x_axis .report > img {
    float: left;
    margin: 5px;
}

#positions-overview #x_axis .report #legend {
    float: right;
    margin: 15px;
    width: 45%;
}

#positions-overview #x_axis .report #legend #header {
    background-color: #283D4F;
    height: 25px;
    left: 0;
    list-style: none outside none;
    width: 100%;
    color: #fff;
    font-weight: 100;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

#positions-overview #x_axis .report #legend #header > div {
    float: left;
    padding: 3px 0;
}

#positions-overview #x_axis .report #legend #header > div:first-child {
    width: 47%;
}

#positions-overview #x_axis .report #legend #header > div#amount {
    width: 31%;
}

#positions-overview #x_axis .report #legend #header > div:last-child {
    border-right: none;
    width: 21%;
}

#positions-overview #x_axis .report #legend #body {
    background-color: #f1f1f2;
    max-height: 335px;
    overflow-x: hidden;
    overflow-y: scroll;
}

#positions-overview #x_axis .report #legend #body ul {
    width: 101%;
    left: 0;
    background-color: #fff;
}

#positions-overview #x_axis .report #legend #body li {
    clear: both;
}

#positions-overview #x_axis .report #legend #body li > div {
    float: left;
    height: 28px;
    line-height: 2em;
    outline: 1px solid #BBBDBF;
}

#positions-overview #x_axis .report #legend #body li div.id {
    width: 7%;
    color: #fff;
    outline: none;
}

#positions-overview #x_axis .report #legend #body li div.stock {
    width: 37%;
    padding: 0 5px;
    background-color: #fff;
}

#positions-overview #x_axis .report #legend #body li div.amount {
    width: 32%;
    background-color: #F0FDFF;
}

#positions-overview #x_axis .report #legend #body li div.percent {
    width: 20.3%;
    background-color: #E7FFEC;

}

#positions-overview #x_axis .report #legend #footer {
    background-color: #283D4F;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top: 1px solid #283D4F;
    height: 16px;
    width: 100%;
    top: 0;
}

#positions-overview #x_axis #pie-holder {
    height: 97%;
    padding-top: 10px;
    left: 16px;
    overflow-x: hidden;
    overflow-y: scroll;
    position: relative;
    width: 99%;
}

#positions-overview #x_axis #pie-holder .report {
    top: 0;
    left: 0;
    overflow: hidden;
}

.btc-values {
    display: none;
}

.report .scroller {
    position: absolute;
    bottom: 34px;
    right: 17px;
    width: 34px;
    height: 45px;
    background: url(../images/scroll_up_down.svg) no-repeat center top;
    background-size: 60%;
    cursor: pointer;

}

.report .scroller:hover {

    background-position: center -43px;
}

/*Single position edit pages */
#position-edit #matrix {
    min-height: 600px;
}

#position-edit #matrix #y_axis #positions {
    height: 545px;
    overflow-x: hidden;
    overflow-y: scroll;

}

#position-edit #matrix #x_axis {
    min-height: 600px;
}

#position-edit #matrix #x_axis #positions-detail {
    width: 41%
}

#position-edit #matrix #x_axis #positions-detail li {
    background-color: #f1f1f2;
    width: 95%;
    font-size: 1.2em;
    opacity: 1;
}

#position-edit #matrix #x_axis #positions-detail ul#id_buy_sell li,
#position-edit #matrix #x_axis #positions-detail ul#id_sell_buy li{
    background-color: transparent;
    font-size: 1em;
    opacity: 1;
    display: inline-block;
    width: 43%;
    border: none;
    height: 5px;
    top: -5px;
}

#position-edit #matrix #x_axis #positions-detail ul#id_buy_sell li input,
#position-edit #matrix #x_axis #positions-detail ul#id_sell_buy li input{
    position: fixed;
    top: -1000px;
}

#position-edit #matrix #x_axis #positions-detail ul#id_buy_sell li label,
#position-edit #matrix #x_axis #positions-detail ul#id_sell_buy li label{
    font-size: 0.8em;
    width: 60px;

}

#position-edit #matrix #x_axis #positions-detail input[type="radio"] ~ label span {
    background: url("../images/radio-one.svg") no-repeat scroll center top / 200% 200% rgba(0, 0, 0, 0);
    cursor: pointer;
    display: inline-block;
    height: 19px;
    margin: -1px 4px 0 0;
    vertical-align: middle;
    width: 19px;
}

#position-edit #matrix #x_axis #positions-detail input[type="radio"]:checked ~ label span {
    background-position: center bottom;
}

#position-edit #matrix #x_axis #positions-detail .position .cell > div:last-child {
    width: 36%;
}

#position-edit #matrix #x_axis #positions-detail .position .position-header #all-notes {
    display: none;
    left: 0;
    position: absolute;
    top: 42px;
    width: 275px;
}

#position-edit #matrix #x_axis #positions-detail .position .wallet {
    background-position: 234px top;
}

#position-edit #matrix #x_axis #positions-detail .position .position-button {
    background-color: #edc71c;
    border: medium none;
    border-radius: 2px;
    cursor: pointer;
    display: block;
    font-size: 0.6em;
    color: #fff;
    height: 15px;
    line-height: 1.4em;
    z-index: 999;
    position: absolute;
    text-align: center;
}

#position-edit #matrix #x_axis #positions-detail .position .save-position,
#position-edit #matrix #x_axis #positions-detail .position .create-position {
    width: 55px;
    right: 4px;
    top: 37px;
    height: 25px;
    font-size: 0.9em;
    line-height: 1.7em;
}

#position-edit #matrix #x_axis #positions-detail .position .exit-position {
    bottom: 6px;
    left: 84px;
    width: 73px;
}

#position-edit #matrix #x_axis #positions-detail .position .calc-position {
    bottom: 6px;
    left: 8px;
    width: 68px;
}

#position-edit #matrix #x_axis #positions-detail .position .position-button:hover {
    background-color: #fff;
    color: #edc71c;
    cursor: pointer;
}

#position-edit #matrix #x_axis #positions-detail .position .close-position {

    bottom: 4px;
    right: 2%;
    padding: 2px;
}

#position-edit #matrix #x_axis #positions-detail .position .close-position:hover {
    background-position: center -39px;
    cursor: pointer;
}

#position-edit #matrix #x_axis #positions-detail .position .delete-position {
    top: 3px;
    right: 18%;
}

#matrix #x_axis #positions-detail .position .scenario-tool-position {
    background: url("../images/rolling.svg") no-repeat center top;
    background-size: 22px 40px;
    border: medium none;
    bottom: 4px;
    cursor: pointer;
    font-size: 0;
    height: 20px;
    position: absolute;
    right: 39%;
    width: 7%;
    z-index: 999;
}

#matrix #x_axis #positions-detail .position .inlines-position {
    background: url("../images/gears-two.svg") no-repeat center top;
    background-size: 22px 40px;
    border: medium none;
    bottom: 4px;
    cursor: pointer;
    font-size: 0;
    height: 20px;
    position: absolute;
    right: 28%;
    width: 7%;
    z-index: 999;
}

#position-edit #matrix #x_axis #positions-detail .position .transfer-position:hover,
#position-edit #matrix #x_axis #positions-detail .position .transpose-position:hover,
#position-edit #matrix #x_axis #positions-detail .position .scenario-tool-position:hover {
    background-position: center bottom;
    cursor: pointer;
}

#position-edit #matrix #x_axis #positions-detail .position .transfer-position,
#position-edit #matrix #x_axis #positions-detail .position .transpose-position {
    background: url("../images/transfer.svg") no-repeat center top;
    background-size: 22px 40px;
    border: medium none;
    bottom: 3px;
    cursor: pointer;
    font-size: 0;
    height: 20px;
    position: absolute;
    right: 37%;
    width: 20px;
    z-index: 999;
}


#position-edit #matrix #x_axis #positions-detail .position .transpose-position {
    right: 45%;
}

#position-edit #matrix #x_axis #positions-detail .position .inlines-position:hover {
    background-position: center bottom;
}

#position-edit #matrix #x_axis #positions-detail .position .position-footer .toggle-info {

    bottom: 6px;
    height: 15px;
    left: 81px;
    width: 72px;
}

#position-edit #matrix #x_axis #positions-detail .position.create .position-footer .toggle-info {

    display: none;
}

#position-edit #matrix #x_axis #positions-detail .position .undo-position {
    background: url("../images/undo.svg") no-repeat scroll center top rgba(0, 0, 0, 0);
    background-size: cover;
    bottom: 34px;
    display: inline-block;
    height: 26px;
    position: absolute;
    right: 21%;
    width: 28px;
    z-index: 11;
}

#position-edit #matrix #x_axis #positions-detail .position .undo-position:hover {
    background-position: center -72px;
    cursor: pointer;
}

#position-edit #matrix #x_axis #positions-detail .position .position-header .prob {
    right: 40%;
    font-size: 1em;
}
#position-edit #matrix #x_axis #positions-detail .position .position-header .prob.top,
#position-edit #matrix #x_axis #positions-detail .position .position-header .prob.bottom {

    font-size: 0.9em;
    line-height: 1.5em;
}
#position-edit #matrix #x_axis #positions-detail .position .position-body {
    height: 493px;
    position: relative;
}

#position-edit #matrix #x_axis #positions-detail .position .advanced-info {
    display: none;
    visibility: visible;
}

#position-edit #matrix #x_axis #positions-detail .position .cell div {
    height: 31px;
}

#position-edit #matrix #x_axis #positions-detail .position .cell.history span {
    font-size: 1em;
}

#position-edit #matrix #x_axis #positions-detail .position .context .cell div,
#position-edit #matrix #x_axis #positions-detail .position .basic-info-edit .cell div,
#position-edit #matrix #x_axis #positions-detail .position #early-exit .cell div,
#position-edit #matrix #x_axis #positions-detail .position .cell.ocs div {
    line-height: 2em;
}

#position-edit #matrix #x_axis #positions-detail .position.create .basic-info-edit {
    display: none;
}

#position-edit #matrix #x_axis #positions-detail .position .position-header {
    height: 66px;
}

#position-edit #matrix #x_axis #positions-detail .position .position-header.position-header-active {
    background-color: #283d4f;
}

#position-edit #matrix #x_axis #positions-detail .position .cell .market-status > div {
    background-position: 30px 2px;
    line-height: 1.3em;
    width: 40%;
}

#position-edit #matrix #x_axis #positions-detail .position .cell .market-status > div.crypto {
    background-position: 30px 2px;
    width: 40%;
}

#position-edit #matrix #x_axis #positions-detail .position .cell .market-status > div.spread {
    background-position: 30px 2px;
    width: 40%;
}

#position-edit #matrix #x_axis #positions-detail .position .position-body input[type="text"],
#position-edit #matrix #x_axis #positions-detail .position .position-body input[type="number"] {

    background-color: #fff;
    width: 98%;
    height: 30px;
    border: none;
    position: relative;
    top: -3px;
    padding-left: 5px;
}

#position-edit #matrix #x_axis #positions-detail .position .position-body input.datepicker {

    background-color: #fff;
}

#position-edit #matrix #x_axis #positions-detail .position .position-body .status input[type="text"] {

    width: 119px;
}

#position-edit #matrix #x_axis #positions-detail .position .position-body input#id_stock {

    text-transform: uppercase;
}

#position-edit #matrix #x_axis #positions-detail .position .position-body select {
    width: 100%;
    height: inherit;
    margin-top: -4px;
    padding-left: 1px;
}

#position-edit #matrix #x_axis #positions-detail .position .position-body input[readonly="True"] {
    background-color: #f4f4f4;
}

#position-edit #matrix #x_axis #positions-detail .position .show-history,
#position-edit #matrix #x_axis #positions-detail .position .pee {
    top: 7px;
}

#position-edit #matrix #x_axis #positions-detail .position .cell.premium-his {

    height: 30px;
}

#position-edit #matrix #x_axis #positions-detail .position #early-exit {
    display: none;
}

#position-edit #matrix #x_axis #positions-detail .position .position-footer {
    height: 28px;
    position: relative;
}

#position-edit #matrix #x_axis #positions-detail .position .position-footer.position-footer-active {
    background-color: #283d4f;
}

/*csv importing */

#position-edit.csv-import #matrix #x_axis #positions-detail .position .create-position {
    width: 130px;
}

#position-edit.csv-import #matrix #x_axis #positions-detail li {
    background-color: #fff;
}

#position-edit.csv-import #matrix #x_axis #positions-detail #inputs {
    background-color: #536472;
    height: 100px;
    color: #fff;
    font-size: 0.8em;
    width: 101%;

}

#position-edit.csv-import #matrix #x_axis #positions-detail #inputs .fieldWrapper {
    padding: 3px 0 3px 10px;
    height: 23px;
    margin-bottom: 15px;
}

#position-edit.csv-import #matrix #x_axis #positions-detail #inputs .fieldWrapper input {
    width: 80%;
    margin-left: 3px;
}

#position-edit.csv-import #matrix #x_axis #positions-detail #inputs label {
    vertical-align: middle;
}

#position-edit.csv-import #matrix #x_axis #positions-detail #inputs .select-theme {
    overflow: hidden;
    width: 176px;
    border-radius: 6px;
    background: url("../images/updown.svg") no-repeat;
    background-position: 156px center;
    background-size: 14px 17px;
    background-color: #fff;
    float: right;
    margin-right: 5px;
    cursor: pointer;
}

#position-edit.csv-import #matrix #x_axis #positions-detail #inputs .select-theme:hover {
    cursor: pointer;
}

#position-edit.csv-import #matrix #x_axis #positions-detail #inputs select {
    width: 194px;
    background: transparent;
    -webkit-appearance: none;
    padding-left: 5px;
    line-height: 2.4em;
    height: 30px;
}

#position-edit.csv-import #matrix #x_axis #positions-detail .position .position-header .ticker {
    font-size: 24px;
}

#position-edit.csv-import #matrix #position #warnings p {
    background-color: #5FE8FF;
    padding: 8px;
    text-align: center;
    color: #fff;
    font-size: 1.5em;
}

#position-edit.csv-import #matrix #position #warnings .sanity {
    padding: 8px;
    height: 35px;
    line-height: 2.3em;
    font-size: 0.9em;
    border-bottom: 1px solid #ccc;
    color: rgba(0, 0, 0, 0.3);
}

#position-edit.csv-import #matrix #position #warnings .sanity.no-opacity {
    color: rgba(0, 0, 0, 1);
}

#position-edit.csv-import #matrix #position #warnings .sanity.cross {
    background: url("../images/cross-five.svg") no-repeat scroll 96% center / 45px auto;
}

#position-edit.csv-import #matrix #position #warnings .sanity.tick {
    background: url("../images/tick-two.svg") no-repeat scroll 96% center / 45px auto;

}

#position-edit.csv-import #matrix #position #warnings ul {
    left: 0;
    width: 100%;
    counter-reset: item;
}

#position-edit.csv-import #matrix #position #warnings ul li {
    list-style-type: none;
    font-size: inherit;
    border: none;
    width: 94%;
    counter-increment: item;
    border-top: 1px solid #BBBDBF;
    margin: 0;
    border-radius: 0;
    padding: 10px;
}

#position-edit.csv-import #matrix #position #warnings ul li:first-child {
    border: none;
}

#position-edit.csv-import #matrix #position #warnings ul li:before {
    display: inline-block;
    padding-right: 0.5em;
    font-weight: bold;
    text-align: right;
    content: counter(item) ".";
}

/*market data section */

#market-data {
    float: right;
    height: 585px;
    width: 59%;
    margin-top: 8px;
    position: relative;
    left: 4px;
}

#market-data #market-tabs > ul {
    background-color: #283d4f;
    height: 28px;
    left: 0;
    list-style: none outside none;
    width: 100%;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
#market-data .payoff-position{
    position: absolute;
    right: 11px;
    width: 25%;
    display: inline-block;
    text-align: center;
    color: #fff;
    font-weight: lighter;
    line-height: 1.7em;
    font-size: 1.1em;
}
#market-data .payoff-position:hover{
    color: #6FE670;
    background-color: transparent;
}
#market-data #quote-lists {
    height: 57%;
    width: 98%;
    margin-bottom: 10px;

}

#market-data #option-chain {
    display: none;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border: 1px solid #283d4f;
    height: 57%;
    width: 97%;
    margin-bottom: 8px;

}

#market-data .quote-body {
    height: 75%;
    overflow-x: hidden;
    overflow-y: scroll;
}

#market-data .quote-body ul {
    left: 0 !important;
    list-style: none outside none;
    width: 100%;
    display: table;
}

#market-data .quote-body ul li {
    clear: both;
    display: table-row;
    width: 100%;
}

#market-data #option-chain .quote-body ul#call {
    width: 56.5%;
}

#market-data #option-chain .quote-body ul#put {
    width: 43.5%;
}

#market-data .quote-body ul li > div {
    text-align: center;
    display: table-cell;
    font-size: 0.8em;
    width: 19%;
    line-height: 4em;
    margin: 1px;
    border-right: 1px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
    -webkit-transition: font-size .1s; /* Safari */
    transition: font-size .1s;
    vertical-align: top;
    height: 49px;
}

#market-data .quote-body ul li > div.subdued {
    color: #84bfda;

}

#market-data .quote-body ul li > div.moderate {
    color: #edc71c;

}

#market-data .quote-body ul li > div.elevated {
    color: #801a1d;

}

#market-data .quote-body ul li .quote-list-stock-lab {
    z-index: 999;
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    background-color: #c5c5c5;
    color: #fff;

}

#market-data .quote-body ul li .quote-list-stock-lab:hover {
    color: #ff780b;

}

#market-data .quote-body ul li > .time-tooltip {
    display: none;
    position: absolute;
    top: 5px;
    left: 10px;
    padding: 10px;
    background-color: #d4d4d4;
}

#market-data #quote-lists .quote-body ul li > div {
    background-color: #f4f4f4;
}

#market-data #quote-lists .quote-body ul li div.odd {
    background-color: #e0e0e1;
}

#market-data #quote-lists .quote-body ul li > div:last-child {
    border-right: none;
    font-weight: bold;
}

#market-data #quote-lists .quote-body ul li:hover > div {
    background-color: #27e1ab;
}

#market-data #option-chain .quote-body ul#put li > div:last-child {
    border-right: none;
}

#market-data #option-chain .quote-body ul#call li > div {
    width: 20%;
    cursor: pointer;
}

#market-data #option-chain .quote-body ul#call li > div.itm {
    background-color: #DFF2F7;
}

#market-data #option-chain .quote-body ul#put li > div {
    width: 25%;
    cursor: pointer;
}

#market-data #option-chain .quote-body ul#put li > div.itm {
    background-color: #DFF2F7;
}

#market-data #option-chain .quote-body ul li .strike {
    background-color: #546573;
    color: #fff;
    font-weight: 800;
}

#market-data #option-chain .quote-body ul li .strike:hover {
    background-color: #27e1ab !important;
}

#market-data #option-chain .quote-body li > div.bid.transient-active,
#market-data #option-chain .quote-body li > div.bid.permanent-active{
    border: 1px solid #27e1ab!important;
}

#market-data #option-chain .quote-body li > div.ask.transient-active,
#market-data #option-chain .quote-body li > div.ask.permanent-active{
    border: 1px solid #ff7a73!important;
}

#market-data #quote-lists .quote-body ul li.line-active div {
    background-color: #c2fed0;
}

#market-data #option-chain .quote-body ul li > div.bid:hover{
    background-color: #27e1ab !important;
}
#market-data #option-chain .quote-body ul li > div.ask:hover {
    background-color: #ff7a73 !important;
}

#market-data .quote-list {
    float: left;
    width: 48.2%;
    height: 100%;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border: 1px solid #283d4f;
    border-collapse: separate;
}

#market-data .quote-list:first-child {
    margin-right: 11px;
}

#market-data .quote-header {
    background-color: #283d4f;
    height: 66px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    font-size: 11px;
    color: #fff;

}

#market-data .upper {
    height: 61%;
    padding-left: 5px;
    position: relative;
    line-height: 2em;
}

#market-data .upper .chains-button {
    background-color: #edc71c;
    border-radius: 2px;
    border: none;
    color: #fff;
    height: 21px;
    line-height: 2em;
    font-size: 1em;
    padding: 5px;
    position: absolute;
    right: 1%;
    text-align: center;
    top: 4px;
    width: 15%;
    cursor: pointer;
}

#market-data .upper .chains-button:hover {
    background-color: #fff;
    color: #edc71c;
}

#market-data #option-chain .upper .chains-button {
    width: 7%;
}

#market-data .quote-list .quote-header .upper form {
    position: absolute;
    left: 12px;
    top: 5px;
    width: 225px;
}

#market-data #option-chain .quote-header .upper form {
    position: absolute;
    left: 6px;
    top: 5px;
    width: 87%;
}

#market-data .upper form input[type="text"] {
    bottom: -3px;
    float: left;
    left: -3%;
    position: relative;
    width: 40%;
    padding: 5px;

}

#market-data #option-chain .upper form label {
    bottom: 5px;
    float: left;
    left: 0;
    position: relative;
}

#market-data #option-chain .upper form label:nth-of-type(2) {
    left: 15px;
}

#market-data #option-chain .upper form label:nth-of-type(3) {
    left: 17px;
}

#market-data #option-chain .upper form select {
    bottom: -3px;
    float: left;
    left: 20px;
    position: relative;
    margin-right: 10px;
    padding: 5px;
}

#market-data #option-chain .upper form input[type="text"] {
    left: 8px;
    width: 18%;

}

#market-data .upper form .inputs {
    float: right;
    height: 12px;
    position: absolute;
    right: 50px;

}

#market-data #option-chain .upper form .inputs {

    right: 29px;
}

#market-data .quote-header .upper form .inputs .refresh {
    background: url("../images/refresh-four.svg") no-repeat center top;
    background-size: 13px 42px;
    width: 13px;
    height: 13px;
}

#market-data .quote-header .upper form .inputs .refresh:hover {
    background-position: center bottom;
    background-color: transparent;
}

#market-data .quote-header .upper form input[type="submit"] {
    background-color: #fff;
    border: medium none;
    border-radius: 2px;
    color: #fff;
    height: 28px;
    width: 28px;
    position: relative;
    cursor: pointer;
    font-size: 1.5em;
}

#market-data #option-chain .quote-header .upper form input.add {
    background-color: #edc71c;
    border-radius: 2px;
    border:none;
    color: #fff;
    height: 30px;
    line-height: 0.6em;
    font-size: 1em;
    padding: 5px;
    position: absolute;
    right: 8px;
    text-align: center;
    top: 0px;
    width: 40px;
    cursor: pointer;
}

#market-data #option-chain .quote-header .upper form input.refresh {
    background-color: #fff;
    background-image: none;
    border-radius: 2px;
    border: none;
    color: #8a8b8d;
    height: 17px;
    line-height: 0.6em;
    font-size: 0.9em;
    padding: 2px;
    position: absolute;
    right: -40px;
    text-align: center;
    top: -3px;
    width: 50px;
    cursor: pointer;
}

#market-data .quote-header .upper form input.delete {
    background-color: red;
}

#market-data .quote-header .upper form input.add {
    background-color: green;
}

#market-data .quote-header .upper form input[type="submit"]:hover,
#market-data #option-chain .quote-header .upper form input.add:hover,
#market-data #option-chain .quote-header .upper form input.refresh:hover {
    background-color: #fff;
    color: #edc71c;
}

#market-data .lower {
    height: 37%;
    border-top: 1px solid #B7B9BA;
    position: relative;
    z-index: 99;
}

#market-data .lower > div {
    float: left;
    font-size: 10px;
    text-align: center;
    width: 20%;
}

#market-data #option-chain .lower > div {
    width: 11.11%;
}

#market-data .quote-header .lower > div:last-child {
    border: none;
}

#market-data .option-chain {
    float: left;
    width: 60%;
    height: 98%;
    position: relative;
    left: 10px;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border: 2px solid #80CCBE;
}

#market-data .option-chain .option-header {
    background-color: #283d4f;
    height: 36px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    position: relative;
}

#market-data #market-tabs {
    height: 41.6%;
    width: 97%;
    border: 1px solid #283d4f;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    background: #F1F1F2;

}

#market-data #market-tabs #data {
    clear: both;
    height: 81.2%;
}

#market-data #quote-footer {
    background-color: #283d4f;
    height: 17px;
    border-top: 1px solid #afafb1;
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    color: #fff;
}

#market-data #quote-footer div:first-child {
    float: left;
    position: relative;
    width: 33%;
    text-align: center;
    font-size: 11px;
}

#market-data #quote-footer #stock-info {
    float: left;
    position: relative;
    width: 33%;
    text-align: center;
    font-size: 11px;
}

#market-data #quote-footer div:last-child {
    float: left;
    position: relative;
    width: 33%;
    text-align: center;
    font-size: 11px;
}

#market-data #market-tabs #data > div {
    height: 100%;
    width: 100%;
}

#market-data #market-tabs #data #console {
    overflow-y: scroll;
    overflow-x: hidden;
    background: url("../images/calc.svg") no-repeat center;
    -webkit-background-size: 15%;
    background-size: 15%;
}

#market-data #market-tabs #data #market {
    overflow-y: scroll;
    overflow-x: hidden;
    background: url("../images/globe.svg") no-repeat center;
    -webkit-background-size: 15%;
    background-size: 15%;
}

#market-data #market-tabs #data #quote {
    overflow-y: scroll;
    overflow-x: hidden;
    background: url("../images/wallet.svg") no-repeat center;
    -webkit-background-size: 15%;
    background-size: 15%;
}

#market-data #market-tabs #data #chart {
    overflow-x: hidden;
    background: url("../images/charts-two.svg") no-repeat center;
    -webkit-background-size: 15%;
    background-size: 15%;
}

#market-data #market-tabs #data #console > div {
    display: table;
    border-spacing: 6px;
    border-collapse: separate;
    width: 98%;
    padding: 5px
}

#market-data #market-tabs #data #console .console-result.active,
#market-data #market-tabs #data #console .console-result.active:hover {
    background-color: #6AD5CB;

}

#market-data #market-tabs #data #console .console-result:hover {
    background-color: #c5c5c5;
    cursor: pointer;
}

#market-data #market-tabs #data div p {
    text-align: center;
    position: relative;
    top: 152px;
    padding: 5px;
    font-size: 1.2em;
    color: #b2b2b2;

}

#market-data #market-tabs #data #console > div > div {
    display: table-row;
    font-size: 0.7em;
}

#market-data #market-tabs #data #console > div > div > div {
    display: table-cell;
    height: 55px;
    text-align: center;
}

#market-data #market-tabs #data #console > div > div > div > div:first-child {
    height: 40%;
    color: #000;
    text-transform: uppercase;
    cursor: pointer;
    line-height: 2.5em;
    font-size: 0.8em;
    font-weight: bold;
}

#market-data #market-tabs #data #console > div > div > div > div.income {
    background-color: #BEDFD1;
}

#market-data #market-tabs #data #console > div > div > div > div.strike,
#market-data #market-tabs #data #console > div > div > div > div.strikes,
#market-data #market-tabs #data #console > div > div > div > div.spp,
#market-data #market-tabs #data #console > div > div > div > div.ssp,
#market-data #market-tabs #data #console > div > div > div > div.prem {
    background-color: #daf9ff;
}

#market-data #market-tabs #data #console > div > div > div > div.risk {
    background-color: #F79292;
}

#market-data #market-tabs #data #console > div > div > div > div.pe {
    background-color: #27e1ab;
}

#market-data #market-tabs #data #console > div > div > div > div.pe span {
    position: absolute;
    top: 3px;
    font-size: 1.1em;
    border-radius: 50%;
    border: 2px solid #fff;
    height: 30px;
    width: 30px;
    background-color: #27e1ab;
    line-height: 1.9em;
    text-align: center;
}

#market-data #market-tabs #data #console > div > div > div > div.be,
#market-data #market-tabs #data #console > div > div > div > div.health {
    background-color: #9BE5DB;
}

#market-data #market-tabs #data #console > div > div > div > div.roi-li,
#market-data #market-tabs #data #console > div > div > div > div.shares {
    background-color: #C2FED0;
}

#market-data #market-tabs #data #console > div > div > div > div.income {
    background-color: #BEDFD1;
}

#market-data #market-tabs #data #console > div > div > div > div.capital {
    background-color: #FDFEDA;
}

#market-data #market-tabs #data #console > div > div > div > div.margin {
    background-color: #FDFEDA;
}

#market-data #market-tabs #data #console > div > div > div > div:last-child {
    height: 60%;
    background-color: #fff;
    line-height: 2.5em;
    font-weight: 400;
    font-size: 1.3em;
    position: relative;
}

#market-data #market-tabs #data #console .circle {
    position: absolute;
    left: 37%;
    top: 2px;
    border-radius: 50%;
    border: 2px solid #d4d4d4;
    height: 25px;
    width: 25px;
    background-color: #27e1ab;
    color: #fff;
    text-align: center;
    font-size: 0.9em;
    line-height: 2.2em;
}
#market-data #market-tabs #data #console  .circle.first {

    left: 1%;

}
#market-data #market-tabs #data #console  .circle.last {

    left: 71%;

}
#market-data #market-tabs #data #console .infinite{
    font-size:3em!important;
    line-height:1em!important;
}
#market-data #market-tabs #data #console .pee {
    position: absolute;
    height: 20px;
    width: 20px;
    top: 6px;
    background: url(../images/exclaim.svg) no-repeat center top;
    background-size: 200% 200%;
    right: 3px;
}

#market-data #market-tabs #data #console > div > div > div > div.strikes ~ div {
    height: 30%;
    line-height: 1.5em;
    font-weight: 400;
    background-color: #fff;
    font-size: 1.2em;
}

#market-data #market-tabs #data #console > div > div > div > div.console-health {

    background-position: center bottom;
}

#market-data #market-tabs #data #console > div > span {
    color: #7d9f00;
    font-weight: 400;
}

#market-data #market-tabs #data #console > div > span.red-font {
    color: #801a1d;
}

#market-data #market-tabs #data #quote-data {
    height: 100%;
}
#market-data #market-tabs #data #console .multiple ~ div{
    height: 30%!important;
    line-height: 1.5em!important;
    font-weight: 400!important;
    background-color: #fff!important;
    font-size: 1.2em!important;
    position: relative;
}
#market-data #market-tabs #data > div.ui-widget-content {
    background: inherit;
}

.header-chart-panel .right {
    float: right;
    position: relative;
    right: 82px;
    top: 134px;
}

#market-data #market-tabs #data #chart img {
    width: 100%;
    height: auto;
    position: relative;
}

#market-data #market-tabs #data #chart {
    overflow: hidden;
}

#market-data #market-tabs > ul li {
    border: medium none;
    float: left;
    font-size: 0.8em;
    font-weight: 100;
    height: 100%;
    width: 20%;
}

#market-data #market-tabs ul li.ui-state-default {
    background: none;

}

#widget-container .header-chart-panel {
    display: none;
}

#market-data #market-tabs ul li.ui-state-active a {

    color: #6FE670;
}

#market-data #market-tabs ul li.ui-state-active {
    background: #536472;

}

#market-data #market-tabs ul li a {
    color: #fff;
    display: inline-block;
    font-size: 1.4em;
    height: 30px;
    line-height: 1.6em;
    text-align: center;
    width: 100%;
}

#market-data #market-tabs ul li a:hover {
    color: #6FE670;
    background-color: transparent;
}

#market-data #market-tabs ul li a.tradingview-popup {
    position: absolute;
    left: 15%;
    top: 2px;
    background: url("../images/expand-black.svg") no-repeat center top;
    background-size: cover;
    height: 22px;
    width: 22px;
    z-index: 999;
    background-color: #CCD9D9;
    border: 2px solid #000;
}

#market-data #market-tabs ul li a.tradingview-popup:hover {
    background-position: center bottom;
    background-color: #fff;
}

#market-data #market-tabs #data #market #rss ul {
    float: none;
    left: 0;
}

#market-data #market-tabs #data #market #rss ul li {
    float: none;
    display: block;
    height: 66px;
    background: url("../images/rss.svg") no-repeat -75px 13px;
    background-size: 42% 42%;
    padding-left: 14%;
    color: #575756;
    font-size: 12px;
    font-weight: 100;
}

#market-data #market-tabs #data #market #rss ul li a:hover {
    color: #6fe670;
}

#market-data #market-tabs #data #market #rss ul li.even {
    background-color: #dfdfdf;
}

#market-data #market-tabs #data #market #rss ul li h3 {
    font-size: 1em;
    padding-top: 7px;
}

#market-data #market-tabs #data #market #rss ul li a {
    width: 100%;
    height: 100%;
    text-align: left;
    color: #283D4F;
    font-size: 1.1em;
}

#market-data #market-tabs #data #quote #quote-data > div {
    float: left;
    width: 49.8%;
    text-align: center;
    font-size: 1.1em;
    height: inherit;
}

#market-data #market-tabs #data #quote #quote-data > div > div {
    height: 20%;
    text-transform: uppercase;
    line-height: 2.7em;
}

#market-data #market-tabs #data #quote #quote-data > div > div.even {
    background-color: rgba(223, 223, 223, .5);
}

#market-data #market-tabs #data #quote #quote-data > div#first-col {
    background-color: #F0FDFF;
    border-right: 1px solid #808184;
}

#market-data #market-tabs #data #quote #quote-data > div#second-col {
    background-color: #E7FFEC;
}

/* compound calculator */

#compound-calc #matrix #y_axis #y_header {
    color: #fff;
    font-size: inherit;
    line-height: 1.8em;
    text-align: center;
}

#compound-calc #matrix #y_axis #positions {

    overflow-x: hidden;
    overflow-y: scroll;
    height: 454px;
}

#compound-calc #matrix #y_footer {
    text-align: center;
}

#compound-calc #matrix #x_axis > div {
    float: left;
    position: relative;
    top: 7px;
    left: 10px;
}

#compound-calc #matrix #x_axis #results {
    height: 498px;
    overflow-x: hidden;
    overflow-y: hidden;
    width: 60%;
}

#compound-calc #matrix #x_axis #params {
    width: 36.5%;
}

#compound-calc #matrix #x_axis #results .result-table {
    margin-bottom: 50px;
}

#compound-calc #matrix #x_axis #results .result-table ul {
    list-style-type: none;
    float: none;
    left: 0;
}

#compound-calc #matrix #x_axis .head {
    width: 100%;
    background-color: #283d4f;
    height: 30px;
    line-height: 2.5em;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    position: relative;
    z-index: 20;
    font-size: 0.85em;
    color: #fff;
}

#compound-calc #matrix #x_axis #params .head {
    border-bottom: 1px solid #b7b9ba;
    height: 28px;
}

#compound-calc #matrix #x_axis #results .result-table .head ul li {
    float: left;
    border-right: 1px solid #B7B9BA;
    height: 30px;
    text-align: center;
}

#compound-calc #matrix #x_axis #results .result-table .head ul li#month {
    width: 9%;
}

#compound-calc #matrix #x_axis #results .result-table .head ul li#balance {
    width: 26%;
}

#compound-calc #matrix #x_axis #results .result-table .head ul li#new-balance {
    width: 25%;
}

#compound-calc #matrix #x_axis #results .result-table .head ul li#withdraw {
    width: 13%;
}

#compound-calc #matrix #x_axis #results .result-table .head ul li#total {
    width: 25%;
}

#compound-calc #matrix #x_axis #results .result-table .head ul li:last-child {
    border-right: none;
}

#compound-calc #matrix #x_axis #results .result-table .main {
    clear: both;
    font-size: 0.85em;
    border-right: 1px solid #B7B9BA;
    border-left: 1px solid #B7B9BA;
}

#compound-calc #matrix #x_axis #results .result-table .main ul li {
    height: 36px;
    line-height: 2.9em;
}

#compound-calc #matrix #x_axis #results .result-table .main ul li > div {
    float: left;
    height: inherit;
    text-align: center;
    background-color: #DFDFDF;
    outline: 1px solid #B7B9BA;
}

#compound-calc #matrix #x_axis #results .result-table .main .month {
    width: 9%;
    font-weight: bold;

}

#compound-calc #matrix #x_axis #results .result-table .main .balance {
    width: 26.5%;
    background-color: #F0FDFF;
}

#compound-calc #matrix #x_axis #results .result-table .main .new-bal {
    width: 25.5%;
}

#compound-calc #matrix #x_axis #results .result-table .main .payment {
    width: 13%;
    background-color: #E7FFEC;
}

#compound-calc #matrix #x_axis #results .result-table .main .total {
    width: 26%;
}

#compound-calc #matrix #x_axis #results .result-table .footer > span {
    top: 2px;
    position: relative;
}

#compound-calc #matrix #x_axis #results .result-table .footer .year {
    left: 20px;
    font-weight: 400;
}

#compound-calc #matrix #x_axis #results .result-table .footer .tat {
    left: 51px;
}

#compound-calc #matrix #x_axis #results .result-table .footer .income {
    left: 37px;
}

#compound-calc #matrix #x_axis #params {
    background-color: #536472;
    margin-left: 12px;
    color: #fff;
}

#compound-calc #matrix #x_axis #params a {
    color: #333;
}

#compound-calc #matrix #x_axis #params #top {
    clear: both;
}

#compound-calc #matrix #x_axis #params .head ul {
    left: 0;
    width: 100%;
}

#compound-calc #matrix #x_axis #params .head ul li {
    float: left;
    height: 30px;
    padding: 0 2px;
    position: relative;
}

#compound-calc #matrix #x_axis #params .head ul li:first-child {
    left: 39%;
}

#compound-calc #matrix #x_axis #params .head ul li:last-child {
    left: 48%;
}

#compound-calc #matrix #x_axis #params #param-body {
    clear: both;
    padding-top: 6px;
    font-size: 0.9em;
    float: left;
    border-bottom: 1px solid #AFAFB1;
}

#compound-calc #matrix #x_axis #params #calc p {
    width: 44%;
    float: left;
    height: 28px;
    margin: 0 5px 10px;
    letter-spacing: 0px;
}

#compound-calc #matrix #x_axis #params #calc label {
    float: left;
    width: 45%;
}

#compound-calc #matrix #x_axis #params #calc input[type="submit"] {
    background-color: #22beb3;
    border: medium none;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    padding: 4px;
    position: relative;
}

#compound-calc #matrix #x_axis #params #calc input[type="submit"]:hover {
    background-color: #fff;
    color: #22beb3;

}

#compound-calc #matrix #x_axis #params #calc #param-body input {
    float: right;
    width: 55%;
    height: 22px;
    padding-left: 3px;
}

#compound-calc #matrix #x_axis #params #bottom {
    clear: both;
}

#compound-calc #matrix #x_axis #params #bottom > div {
    float: left;
}

#compound-calc #matrix #x_axis #taxes {
    width: 50%;
    background-color: #e7ffec;
}

#compound-calc #matrix #x_axis #params .bottom-head {
    background-color: #283d4f;
    height: 30px;
    width: 100%;
    position: relative;
    z-index: 20;
    font-size: 0.8em;
}

#compound-calc #matrix #x_axis #params #taxes .bottom-head {
    border-left: 1px solid #d6d7d7;
    width: 99.3%;
}

#compound-calc #matrix #x_axis #params .bottom-head ul {
    float: right;
    left: -4px;
    width: 70%;
}

#compound-calc #matrix #x_axis #params .bottom-head ul li {
    float: left;
    font-size: 11px;
    height: 30px;
    line-height: 1.3em;
    text-align: center;
    width: 50%;
    border: none;
    background: none;
}

#compound-calc #matrix #x_axis #params .bottom-head ul li a {
    display: inline-block;
    width: 100%;
    height: 100%;
    font-weight: 300;
    color: #fff;
}

#compound-calc #matrix #x_axis #params .bottom-head ul li a:hover,
#compound-calc #matrix #x_axis #params .bottom-head ul li.ui-state-active a {
    color: #6fe670;
    background-color: #536472;
}

#compound-calc #matrix #x_axis #params .bottom-body {
    height: 281px;
    font-size: 0.85em;
    color: #000;
}

#compound-calc #matrix #x_axis #params .bottom-body ul {
    left: 0;
    width: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
    height: inherit;
}

#compound-calc #matrix #x_axis #params .bottom-body ul.ui-widget-content {
    background-color: inherit;
}

#compound-calc #matrix #x_axis #params .bottom-body ul li {
    height: 25px;
    border-bottom: 1px solid #d6d7d7;
}

#compound-calc #matrix #x_axis #params .bottom-body ul li > div {
    float: left;
    text-align: center;
    height: 100%;
    line-height: 2em;

}

#compound-calc #matrix #x_axis #params .bottom-body ul li div:first-child {
    width: 20%;
    font-weight: bold;
    background-color: #DFDFDF;
}

#compound-calc #matrix #x_axis #params .bottom-body ul li div:last-child {
    width: 80%;
}

#compound-calc #matrix #x_axis .footer {
    background-color: #283d4f;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top: 1px solid #AFAFB1;
    height: 35px;
    line-height: 2.5em;
    width: 100%;
    clear: both;
    color: #fff;
    font-size: 0.85em;
}

#compound-calc #matrix #x_axis #yearly {
    width: 50%;
    background-color: #f0fdff;
}

#compound-calc #matrix #x_axis #yearly .bottom-head {
    font-size: 0.9em;
    color: #fff;
    line-height: 2em;
    padding-left: 5px;
}

#compound-calc #matrix #x_axis #yearly .bottom-body {
    border-right: 1px solid #AFAFB1;
    border-left: 1px solid #AFAFB1;
}

#compound-calc #matrix #x_axis #taxes .bottom-head div:first-child {
    text-align: center;
    position: relative;
    bottom: 2px;
}

#compound-calc #matrix #x_axis #taxes #head-lower {
    width: 100%;
}

#compound-calc #matrix #x_axis #taxes #head-lower > div {
    float: left;
    height: 100%;
    line-height: 1em;
}

#compound-calc #matrix #x_axis #taxes #head-lower > div:first-child {
    width: 20%;
}

#compound-calc #matrix #x_axis #taxes #head-lower > div:last-child {
    bottom: 2px;
    position: relative;
    text-align: center;
    width: 80%;
}

#compound-calc #matrix #x_axis #taxes .bottom-body {
    border-right: 1px solid #AFAFB1;

}

/* scanner */

#scanner #tabs-help .help-container p#intro {
    font-size: 0.9em;
    text-align: center;
    padding: 10px;
    margin-bottom: 25px;

}

#scanner #matrix #x_axis .head {
    width: 100%;
    height: 30px;
    background-color: #283d4f;
    line-height: 2em;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    position: relative;
    z-index: 20;
}

#scanner.scanner-ccc #matrix #x_axis .head {
    background-color: #31860D;
}

#scanner.scanner-np #matrix #x_axis .head {
    background-color: #00AECC;
}

#scanner.scanner-nc #matrix #x_axis .head {
    background-color: #777777;
}

#scanner.scanner-s #matrix #x_axis .head {
    background-color: #009C98;
}

#scanner.scanner-scc #matrix #x_axis .head {
    background-color: #98d5cf;
}

#scanner.scanner-ccs #matrix #x_axis .head {
    background-color: #5AC18E;
}

#scanner.scanner-cps #matrix #x_axis .head {
    background-color: #606c38;
}

#scanner.scanner-dps #matrix #x_axis .head {
    background-color: #83c5be;
}

#scanner #matrix #x_axis #results .table .main {
    clear: both;
    border-left: 1px solid #283d4f;
    border-right: 1px solid #283d4f;
    height: 429px;
    background-color: #E4E8EA;
}

#scanner #matrix #x_axis #results .watermark.table .main {
    background: url("../images/tc-logo-gray-medium.png") no-repeat center;
    background-size: 50%;
    opacity: 0.4;
}

#scanner #matrix #x_axis #results .watermark.table .main p#spinner {
    position: relative;
    margin: 0 auto;
    top: 186px;
    opacity: 1;
    width: 70px;
    height: 70px;
}

#scanner #matrix #x_axis #results .watermark.table .main p#help-text {
    position: relative;
    margin: 0 auto;
    top: 75%;
    opacity: 1;
    width: 80%;
    height: 70px;
    text-align: center;
}

#scanner #matrix #x_axis #results .watermark.table .main #scannerprogressbar {
    position: relative;
    margin: 0 auto;
    top: 372px;
    width: 350px;

}

#scanner #matrix #x_axis #results .mini-table {
    display: table;
    width: 100%;
    border-spacing: 0;
    height: 65%;
    font-size: 0.9em;
    position: relative;
}

#scanner #matrix #x_axis #results .strike .mini-table {
    text-align: left;
}

#scanner #matrix #x_axis #results .mini-table > div {
    display: table-row;
    width: 100%;
}

#scanner #matrix #x_axis #results .mini-table > div > div {
    display: table-cell;
    width: 50%;
    color: #2b7092;
    font-size: 1.2em;
}

#scanner #matrix #x_axis #results .strike .mini-table > div > div:first-child {

    width: 40%;
    padding-left: 4px;

}

#scanner #matrix #x_axis #results .strike .mini-table > div > div:last-child {

    width: 60%;

}

#scanner #matrix #x_axis #results .inner-table {
    display: table;
    width: 100%;
    border-spacing: 0;
    height: 100%;
}

#scanner #matrix #x_axis #results .inner-table > div {
    display: table-row;
    width: 100%;
    height: 100%;
}

#scanner #matrix #x_axis #results .inner-table > div > div {
    display: table-cell;
    width: 50%;
    color: #2b7092;
    height: 100%;
}

#scanner #matrix #x_axis #results .inner-table > div > div:first-child {
    border-right: 1px solid #e6eaec;
}

#scanner #matrix #x_axis #results .table .cell .inner-table .inner-cell .value {
    line-height: 2.25em;
    font-size: 1.3em;

}

#scanner #matrix #x_axis #results .table .cell .inner-table .inner-cell.expire .value {
    font-size: 0.9em;
    line-height: 1.6em;
    font-weight: bold;
}

#scanner #matrix #x_axis #results .table .main .top div.front > div {
    display: table-row;
    margin-bottom: 5px;
    height: 32%;
}

#scanner #matrix #x_axis #results .table .main .cell {

    background-color: #fffff8;
    text-align: center;
    display: table-cell;
    width: 33.3%;
    height: 60px;
}

#scanner #matrix #x_axis #results .table .main .cell .header {

    height: 35%;
    background-color: #25d7d5;
    color: #fff;
    text-transform: uppercase;
    line-height: 1.5em;
    cursor: pointer;
}

#scanner #matrix #x_axis #results .table .main .cell.scanner-colour-one .header,
#scanner #matrix #x_axis #results .table .main .cell.stock-price .header,
#scanner #matrix #x_axis #results .table .main .cell.returns .header,
#scanner #matrix #x_axis #results .table .main .cell.sector .header,
#scanner #matrix #x_axis #results .table .main .cell.cap .header,
#scanner #matrix #x_axis #results .table .main .cell.atr .header,
#scanner #matrix #x_axis #results .table .main .cell.iv .header,
#scanner #matrix #x_axis #results .table .main .cell.iv-skew .header {
    background-color: #27e1ab;
}

#scanner #matrix #x_axis #results .table .main .cell.scanner-colour-two .header,
#scanner #matrix #x_axis #results .table .main .cell.strike .header,
#scanner #matrix #x_axis #results .table .main .cell.annual .header,
#scanner #matrix #x_axis #results .table .main .cell.industry .header,
#scanner #matrix #x_axis #results .table .main .cell.year .header,
#scanner #matrix #x_axis #results .table .main .cell.fiftyma .header,
#scanner #matrix #x_axis #results .table .main .cell.twoma .header,
#scanner #matrix #x_axis #results .table .main .cell.rsi .header,
#scanner #matrix #x_axis #results .table .main .cell.iv-rank .header {
    background-color: #22bcb1;
}

#scanner #matrix #x_axis #results .table .main .cell.scanner-colour-three .header,
#scanner #matrix #x_axis #results .table .main .cell.option-price .header,
#scanner #matrix #x_axis #results .table .main .cell.value .header,
#scanner #matrix #x_axis #results .table .main .cell.ranking .header,
#scanner #matrix #x_axis #results .table .main .cell.pe .header {
    background-color: #5ca49f;
}

#scanner #matrix #x_axis #results .table .main .cell.scanner-colour-four .header,
#scanner #matrix #x_axis #results .table .main .inner-cell.expire .header,
#scanner #matrix #x_axis #results .table .main .cell.earnings .header,
#scanner #matrix #x_axis #results .table .main .inner-cell.pro .header,
#scanner #matrix #x_axis #results .table .main .cell.dividend .header {
    background-color: #2b7092;
}

#scanner #matrix #x_axis #results .table .main .cell.scanner-colour-five .header,
#scanner #matrix #x_axis #results .table .main .cell.share-volume .header,
#scanner #matrix #x_axis #results .table .main .cell.liquid .header,
#scanner #matrix #x_axis #results .table .main .inner-cell.rating .header,
#scanner #matrix #x_axis #results .table .main .inner-cell.days .header,
#scanner #matrix #x_axis #results .table .main .cell.range .header,
#scanner #matrix #x_axis #results .table .main .cell.earnings-date .header,
#scanner #matrix #x_axis #results .table .main .cell.div-date .header,
#scanner #matrix #x_axis #results .table .main .cell.sixmove .header,
#scanner #matrix #x_axis #results .table .main .cell.yearmove .header,
#scanner #matrix #x_axis #results .table .main .cell.ytdmove .header {
    background-color: #293d4f;
}

#scanner #matrix #x_axis #results .table .main .inner-cell.days .value,
#scanner #matrix #x_axis #results .table .main .inner-cell.risk .value {
    color: #fff;
}

#scanner #matrix #x_axis #results .table .main .cell.earnings-date .value-small,
#scanner #matrix #x_axis #results .table .main .cell.div-date .value-small {
    color: #fff;
    background-color: #4fba6f;
}

#scanner.scanner-s #matrix #x_axis #results .table .main .cell.earnings-date .value-small,
#scanner.scanner-s #matrix #x_axis #results .table .main .cell.div-date .value-small {
    color: #fff;
    background-color: transparent;
}

#scanner #matrix #x_axis #results .table .main .cell.earnings-date .value-small.red,
#scanner #matrix #x_axis #results .table .main .cell.div-date .value-small.red {
    color: #fff;
    background-color: #E54D3C !important;
}

#scanner #matrix #x_axis #results .table .main .cell.iv-rank .value,
#scanner #matrix #x_axis #results .table .main .cell.iv-skew-rank .value,
#scanner #matrix #x_axis #results .table .main .cell.short-int-p .value,
#scanner #matrix #x_axis #results .table .main .cell.relative-strength .value{
    color: #fff;
}

#scanner #matrix #x_axis #results .header.tooltips {
    background: url("../images/info.svg") no-repeat 97% 1px;
    background-size: 18px 43px;

}

#scanner #matrix #x_axis #results .header.tooltips:hover {
    background-position: 97% -24px;

}

#scanner #matrix #x_axis #results .table .main .cell .value {
    line-height: 1.5em;
    font-size: 1.9em;
    color: #2b7092;
    position: relative;
}

#scanner #matrix #x_axis #results .table .main .cell .value .small {
    font-size: 0.7em;
    vertical-align: top;
}

#scanner #matrix #x_axis #results .table .main .cell.stock-price .value {
    font-size: 1.6em;
    line-height: 2em;
}

#scanner.scanner-s #matrix #x_axis #results .table .main .cell.stock-price .value {
    font-size: 1.4em;
    line-height: 2em;
}

#scanner #matrix #x_axis #results .table .main .cell.stock-price .value span {
    font-size: 0.55em;
    padding-left: 14px;
    background-position: -2px 4px;
    background-size: 18% auto;
    vertical-align: top;
}

#scanner.scanner-s #matrix #x_axis #results .table .main .cell.stock-price .value span {
    font-size: 0.75em;
    background-position: -2px 4px;
    background-size: 18% auto;
}

#scanner #matrix #x_axis #results .table .main .cell .value-small {
    color: #2b7092;
    font-size: 1.2em;
    line-height: 2.4em;
    padding: 0;
}

#scanner #matrix #x_axis #results .table .main .cell.range .value {
    color: #fff;
    font-size: 1.3em;
    line-height: 2.25em;
}

#scanner #matrix #x_axis #results .table .main .cell .days-none,
#scanner #matrix #x_axis #results .table .main .cell .result-none,
#scanner #matrix #x_axis #results .table .main .cell .days-blue,
#scanner #matrix #x_axis #results .table .main .cell .result-blue {
    background-color: #84bfda !important;
}

#scanner #matrix #x_axis #results .table .main .cell .days-green,
#scanner #matrix #x_axis #results .table .main .cell .result-green {
    background-color: #4FBA6F !important;
}

#scanner #matrix #x_axis #results .table .main .cell .days-orange,
#scanner #matrix #x_axis #results .table .main .cell .result-orange {
    background-color: #e1802e !important;
}

#scanner #matrix #x_axis #results .table .main .cell .days-red,
#scanner #matrix #x_axis #results .table .main .cell .result-red {
    background-color: #E54D3C !important;
}

#scanner #matrix #x_axis #results .table .main .cell.sector > div:last-child,
#scanner #matrix #x_axis #results .table .main .cell.industry > div:last-child {
    color: #7d9e00;
}

#scanner #matrix #x_axis #results .table .main .empty {
    background-color: #fff;
    height: 78px;
    margin-left: -6px;
    position: absolute;
    top: 6px;
    width: 34px;
}

#scanner #matrix #x_axis #results .table .main .top {
    height: 50%;
    width: 100%;
    position: relative;
}

/*first row top*/

#scanner #matrix #x_axis #results .table .main .bottom {
    width: 100%;
    height: 50%;
    position: relative;
}

#scanner #matrix #x_axis #results .table .main .front {
    display: table;
    border-spacing: 6px;
    border-collapse: separate;
    width: 100%;
    height: 100%;
}

#scanner #matrix #x_axis #results .table .main .hidden-div.profile,
#scanner #matrix #x_axis #results .table .main .hidden-div.more-info {
    background-color: #e4e8ea;
}

#scanner #matrix #x_axis #results .table .main .profile-table {
    display: table;
    border-spacing: 4px;
    border-collapse: separate;
    width: 100%;
}

#scanner #matrix #x_axis #results .table .main .profile-table > div {
    display: table-row;
    height: 25%;
}

#scanner #matrix #x_axis #results .table .main .company {
    background-color: #fffff8;
    left: 4px;
    position: relative;
    text-align: center;
    width: 98.5%;
}

#scanner #matrix #x_axis #results .table .main .company .header {
    background-color: #293d4f;
    color: #fff;
    height: 23px;
    line-height: 1.7em;
    text-transform: uppercase;
}

#scanner #matrix #x_axis #results .table .main .company .header span {
    color: #22beb3;
}

#scanner #matrix #x_axis #results .table .main .company .value {
    font-size: 1em;
    line-height: 1.2em;
    padding: 5px;
    height: 120px;
    overflow-x: hidden;
    overflow-y: scroll;
}

#scanner #matrix #x_axis .footer {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top: 1px solid #AFAFB1;
    height: 30px;
    line-height: 2em;
    width: 100%;
    clear: both;
    background-color: #283d4f;
}

#scanner.scanner-ccc #matrix #x_axis .footer {
    background-color: #31860D;
}

#scanner.scanner-np #matrix #x_axis .footer {
    background-color: #00AECC;
}

#scanner.scanner-nc #matrix #x_axis .footer {
    background-color: #777777;
}

#scanner.scanner-s #matrix #x_axis .footer {
    background-color: #009C98;
}

#scanner.scanner-scc #matrix #x_axis .footer {
    background-color: #98d5cf;
}

#scanner.scanner-ccs #matrix #x_axis .footer {
    background-color: #5AC18E;
}

#scanner.scanner-dps #matrix #x_axis .footer {
    background-color: #83c5be;
}

#scanner.scanner-cps #matrix #x_axis .footer {
    background-color: #606c38;
}

#scanner #matrix #x_axis .footer ul {
    width: 200px;
}

#scanner.scanner-s #matrix #x_axis .footer ul {
    left: 240px;
}

#scanner #matrix #x_axis #filters {
    height: 488px;
    margin-right: 10px;
    position: relative;
    top: 4px;
    width: 36.7%;
    border-radius: 5px;
    border: 1px solid #283d4f;
    background-color: #e4e8ea;
    float: right;
    left: 4px;
    margin-top: 8px;

}

#scanner #filters > ul {
    background-color: #283d4f;
    height: 28px;
    left: 0;
    list-style: outside none none;
    width: 99.5%;
    position: relative;
    z-index: 10;
    border: 1px solid #293d4f;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

#scanner #filters #data {
    position: relative;
    top: 14px;
    margin: 0 auto;
    width: 95%;
    z-index: 9;
}

#scanner #filters > ul li {
    border: medium none;
    float: left;
    font-size: 12px;
    font-weight: 100;
    height: 100%;
    width: 33.3%;
    position: relative;
}

#scanner.scanner-ccc #filters > ul li {
    background-color: #31860D;
}

#scanner.scanner-np #filters > ul li {
    background-color: #00AECC;
}

#scanner.scanner-nc #filters > ul li {
    background-color: #777777;
}

#scanner.scanner-s #filters > ul li {
    background-color: #009C98;
}

#scanner.scanner-scc #filters > ul li {
    background-color: #98d5cf;
}

#scanner.scanner-ccs #filters > ul li {
    background-color: #5AC18E;
}

#scanner.scanner-cps #filters > ul li {
    background-color: #606c38;
}

#scanner.scanner-dps #filters > ul li {
    background-color: #83c5be;
}

#scanner #filters .alert {
    color: #E54D3C !important;
    padding: 0;
    margin: 0;
    border: none;
}

#scanner #filters ul li.ui-state-active {
    background: none repeat scroll 0 0 #536472;
}

#scanner #filters ul li.ui-state-active a {
    color: #6FE570;

}

#scanner #filters ul li a {
    color: #fff;
    display: inline-block;
    font-size: 1.1em;
    height: 25px;
    line-height: 1.9em;
    text-align: center;
    width: 100%;
}

#scanner #filters ul li.ui-state-hover {
    background-color: transparent;
}

#scanner #filters ul li.ui-state-hover a {
    color: #6FE570;
}

#scanner #filters ul li a:focus {
    outline: none;
}

#scanner #filters form .inputs > div {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

#scanner #filters form .inputs .filter-filler {
    margin-bottom: 60px;
}

#scanner #filters form .inputs #expiries-holder {
    outline: 1px solid #d4d4d4;
    position: relative;
    width: 97%;
    padding: 4px;
}

#scanner #filters form .inputs #expiries-holder p {
    font-size: 0.8em;
    float: left;
    line-height: 2em;
    padding: 5px;
}

#scanner #filters form .inputs .expire {
    float: right;
    width: 100%;
}

#scanner #filters form .inputs .expire select {
    margin-left: 5px;
    float: left;
    padding: 5px;
    width:25%;
    background-color: #fff;
}

#scanner #filters form .inputs .expire label {
    margin-right: 5px;
}

#scanner #filters form .inputs input {
    width: 25%;
    height: 25px;
    float: right;
    margin-right: 10px;
    color: #B0B0B0;
    text-align: center;
    font-size: 0.7em;
}

#scanner #filters form .inputs label {
    font-size: 0.8em;
    float: left;
    line-height: 2em;
}
#scanner #filters form .inputs #growth label {
    float: none;
    line-height: 4em;
}
#scanner #filters .check-holder .check label {
    font-size: 0;
}

#scanner .check-holder .check div {
    top: -2px;
}

#scanner #filters form .inputs input:nth-of-type(1) {
    margin-right: 0;
}

#scanner #filters form .inputs select {
    float: right;
    height: 25px;
    margin-right: 10px;
}

#scanner #filters form .inputs select#id_stock_price {
    width: 27%;
}

#scanner #filters form .inputs select:nth-of-type(1) {
    margin-right: 0;
}

#scanner #filters form input[type="submit"] {
    background-color: #22beb3;
    border: 1px solid #22beb3;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    height: 30px;
    line-height: 2em;
    margin: 0 100px;
    position: relative;
    bottom: 0;
    right: 32%;
    text-align: center;
    text-transform: uppercase;
    width: 33%;
    z-index: 11;
}

#scanner #filters form #advanced input[type="submit"] {
    bottom: 23px;
}

#scanner #filters form input[type="submit"]:hover {
    background-color: #fff;
    color: #22beb3;
}

#scanner #filters form .inputs .slider-holder {
    outline: 1px solid #d4d4d4;
    position: relative;
    width: 97%;
    height: 45px;
    padding: 4px;
}

#scanner #filters form .inputs .accordian .slider-holder {
    background-color: #e4e8ea;
}

#scanner .slider-holder > div:first-child {
    height: 26px;
}

#scanner #filters form .slider-holder input {
    padding: 2px;
    width: 14%;
}

#scanner #filters form input[type="radio"] ~ label span {
    background: url("../images/radio-one.svg") no-repeat scroll center top / 200% 200% rgba(0, 0, 0, 0);
    cursor: pointer;
    display: inline-block;
    height: 19px;
    margin: -1px 4px 0 0;
    vertical-align: middle;
    width: 19px;
}

#scanner #filters form input[type="radio"]:checked ~ label span {
    background-position: center bottom;
}

#scanner #filters form textarea {
    width: 100%;
}

#scanner .ui-slider {
    top: 8px;
    height: 7px;
    left: 7px;
    width: 96%;
    position: relative;
}

#scanner #vol-slider.ui-slider, #scanner #open-slider.ui-slider {
    width: 45%;
    left: 73px;

}

#scanner .ui-slider .ui-widget-header {
    min-height: 0;
    height: inherit;
    background-color: #5fe8ff;
    opacity: 0.8;
}

#scanner .ui-slider .ui-slider-handle {
    position: absolute;
    top: -5px;
    width: 15px;
    height: 15px;
    background-color: #5fe8ff;
    border-radius: 15px;
    background-image: -moz-linear-gradient(top, #149bdf, #5fe8ff);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#149bdf), to(#5fe8ff));
    background-image: -webkit-linear-gradient(top, #149bdf, #5fe8ff);
    background-image: -o-linear-gradient(top, #149bdf, #5fe8ff);
    background-image: linear-gradient(to bottom, #149bdf, #5fe8ff);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff149bdf', endColorstr='#ff0480be', GradientType=0);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    opacity: 0.8;
    border: 0px solid transparent;
}

#scanner #filters #include-only .header {
    background-color: #283d4f;
    color: #fff;
    height: 20px;
    padding-left: 10px;
    font-size: 0.9em;
}

#scanner.scanner-ccc #filters #include-only .header {
    background-color: #31860D;
}

#scanner.scanner-np #filters #include-only .header {
    background-color: #00AECC;
}

#scanner.scanner-nc #filters #include-only .header {
    background-color: #777777;
}

#scanner.scanner-s #filters #include-only .header {
    background-color: #009C98;
}

#scanner.scanner-scc #filters #include-only .header {
    background-color: #98d5cf;
}

#scanner.scanner-ccs #filters #include-only .header {
    background-color: #5AC18E;
}

#scanner.scanner-cps #filters #include-only .header {
    background-color: #606c38;
}

#scanner.scanner-dps #filters #include-only .header {
    background-color: #83c5be;
}

#scanner #filters #include-only textarea {
    height: 40px;
    min-height: 40px;
    max-height: 270px;
    width: 100%;
    padding: 10px;

}

#scanner .accordian {
    position: absolute;
    top: 26px;
    z-index: 10;

}

#scanner #lower-accordian {
    position: relative;
    top: 275px;
    z-index: 9;
    padding-bottom: 202px;
}

#scanner #lower-accordian > div,
#scanner #extra-lower-accordian > div {
    float: left;
    margin-bottom: 10px;
    width: 100%;
}

#scanner #extra-lower-accordian {
    position: relative;
    top: 245px;
    z-index: 9;
    padding-bottom: 130px;
}

#scanner.scanner-s #lower-accordian {
    top: 215px;
}

#scanner.scanner-s #extra-lower-accordian {
    top: 220px;
}

#scanner.scanner-scc #extra-lower-accordian {
    top: 240px;
}

#scanner .accordian > div {
    margin-bottom: 5px;
    top: 5px;
}

#scanner #filters .accordian .header {
    background-color: #2B7092;
    color: #fff;
    height: 25px;
    position: relative;
    padding-left: 20px;
    font-weight: 400;
    line-height: 1.6em;
    cursor: pointer;
    border: none;
}

#scanner .accordian .header:hover {
    color: #6fe570;
}

#scanner .accordian .holder,
#scanner #has-divs .holder,
#scanner #has-options .holder {
    padding: 5px;
    font-size: 0.8em;
    max-height: 230px;
    overflow-y: scroll;
}

#scanner #has-divs .holder,
#scanner #has-options .holder {
    background-color: #fff;
}

#scanner .accordian #moving-averages .holder {
    height: 180px;
}

#scanner #filters form .inputs #earnings-divs .check-holder > label,
#scanner #filters form .inputs #moving-averages .check-holder > label {
    font-size: 1.1em;
}

#scanner .accordian #earnings-divs .check,
#scanner .accordian #moving-averages .check {
    margin-bottom: 10px;
}

#scanner .accordian #earnings-divs .check:after,
#scanner .accordian #moving-averages .check:after {
    top: 1px;
}

#scanner .accordian .holder p,
#scanner #has-divs .holder p,
#scanner #has-options .holder p {
    color: #2B7092;
    text-align: center;
    margin-bottom: 5px;
}

#scanner #x_axis .accordian .holder ul,
#scanner #x_axis ul#id_has_dividends,
#scanner #x_axis ul#id_has_options {
    float: none;
}

#scanner .accordian .holder ul li,
#scanner .holder ul#id_has_dividends li,
#scanner .holder ul#id_has_options li {
    display: inline-block;
    width: 49%;
    margin-bottom: 5px;

}

#scanner .accordian .holder ul#id_earnings li,
#scanner .accordian .holder ul#id_dividends li,
#scanner .accordian .holder ul#id_weeklies li,
#scanner .accordian .holder ul#id_day180 li,
#scanner .accordian .holder ul#id_day360 li,
#scanner .accordian .holder ul#id_day30 li,
#scanner .accordian .holder ul#id_day7 li,
#scanner .accordian .holder ul#id_ytd_trend li,
#scanner .accordian .holder ul#id_fifty_above_two li,
#scanner .holder ul#id_has_dividends li,
#scanner .holder ul#id_has_options li {
    width: 31%;

}

#scanner .holder p.bold {
    font-weight: bold;
    margin: 5px 0;

}

#scanner .accordian .holder ul li input,
#scanner .holder ul#id_has_dividends li input,
#scanner .holder ul#id_has_options li input,
.proxy-filter-form input {
    position: fixed;
    top: -1000px;
}

#scanner .accordian .holder input[type="checkbox"] ~ span,
.proxy-filter-form input[type="checkbox"] ~ span {
    background: url("../images/radio-one.svg") no-repeat scroll center top / 200% 200% rgba(0, 0, 0, 0);
    cursor: pointer;
    display: inline-block;
    height: 19px;
    margin: -1px 4px 0 0;
    vertical-align: middle;
    width: 19px;
}

#scanner .accordian .holder input[type="checkbox"]:checked ~ span,
.proxy-filter-form input[type="checkbox"]:checked ~ span {
    background-position: center bottom;
}

#scanner .accordian #pe-values {
    margin-top: 20px;
}

#scanner .accordian #pe-values select {
    background-color: #e4e8ea;
}

.proxy-filter-form {
    overflow-x: hidden;
    overflow-y: scroll;
    max-height: 400px;
    margin: 20px 20px 10px;
    border: 1px solid #e3e3e3;
    padding: 10px;
    background-color: #e6eaec;
}

.proxy-filter-form div {
    clear: both;
    margin-bottom: 20px;
}

.proxy-filter-form div:first-child ul li:first-child label:after {
    content: "";
    background: url("../images/blue-circle-two.svg") no-repeat 3px 3px;
    height: 20px;
    width: 20px;
    display: inline-block;
    padding-right: 20px;
    vertical-align: -5px;
}

#scanner .proxy-filter-form .ui-slider {
    left: 10px;
    top: 10px;
}

.proxy-filter-form div:first-child ul li:nth-child(2) label:after {
    content: "";
    background: url("../images/green-circle.svg") no-repeat 3px 3px;
    height: 20px;
    width: 20px;
    display: inline-block;
    padding-right: 20px;
    vertical-align: -5px;
}

.proxy-filter-form div:first-child ul li:last-child label:after {
    content: "";
    background: url("../images/orange-circle.svg") no-repeat 3px 3px;
    height: 20px;
    width: 20px;
    display: inline-block;
    padding-right: 20px;
    vertical-align: -5px;
}

.proxy-filter-form ul {
    height: inherit;
}

.proxy-filter-form p {
    font-weight: 400;
}

.proxy-filter-form div:last-child ul {
    display: table;
    width: 100%;
}

.proxy-filter-form div:last-child ul li {
    display: table-cell;
    width: 33%;
    text-align: left;
    vertical-align: top;
}

.proxy-filter-form > div:first-child ul li {
    float: none;
    text-align: left;
}

.proxy-filter-form .slider-holder {
    outline: 1px solid #d4d4d4;
    position: relative;
    width: 97%;
    height: 50px;
    padding: 4px;
    top: 20px;
}

.proxy-filter-form .slider-holder > div {
    margin-bottom: 0;
}

.proxy-filter-form .slider-holder input {
    position: relative;
    top: 0;
    width: 50px;
    color: #B0B0B0;
    font-size: 0.7em;
}

.proxy-filter-form .slider-holder input:nth-of-type(2) {
    margin-right: 5px;
}

#scanner .accordian .header.ui-state-active {
    background-color: #283D4F;
    background-image: none;
    border: medium none;
}

#scanner .accordian .header .ui-accordion-header-icon {
    background: url("../images/plus.svg") no-repeat scroll 4px center / 60% 60% #fff;
    display: inline-block;
    height: 100%;
    position: absolute;
    right: 0;
    width: 25px;
}

#scanner .accordian .header.ui-state-active .ui-accordion-header-icon {
    background: url("../images/minus.svg") no-repeat scroll 4px center / 60% 60% #6FE570;
}

#scanner #matrix #y_axis #y_header > span {
    font-size: 0.7em;
    top: -3px;
}

#scanner #matrix #y_axis #y_header {
    height: 20px;
}

#scanner.scanner-ccc #matrix #y_axis #y_header {
    background-color: #31860D;
}

#scanner.scanner-np #matrix #y_axis #y_header {
    background-color: #00AECC;
}

#scanner.scanner-nc #matrix #y_axis #y_header {
    background-color: #777777;
}

#scanner.scanner-s #matrix #y_axis #y_header {
    background-color: #009C98;
}

#scanner.scanner-scc #matrix #y_axis #y_header {
    background-color: #98d5cf;
}

#scanner.scanner-ccs #matrix #y_axis #y_header {
    background-color: #5AC18E;
}

#scanner.scanner-dps #matrix #y_axis #y_header {
    background-color: #83c5be;
}

#scanner.scanner-cps #matrix #y_axis #y_header {
    background-color: #606c38;
}


#scanner #matrix #y_axis #positions {
    height: 464px;
    overflow-y: scroll;
    overflow-x: hidden;
    top: 0;
}

#scanner #matrix #y_axis #y_footer {
    color: #fff;
    font-size: 0.8em;
    text-align: center;

}

#scanner.scanner-ccc #matrix #y_axis #y_footer {
    background-color: #31860D;

}

#scanner.scanner-np #matrix #y_axis #y_footer {
    background-color: #00AECC;

}

#scanner.scanner-nc #matrix #y_axis #y_footer {
    background-color: #777777;

}

#scanner.scanner-s #matrix #y_axis #y_footer {
    background-color: #009C98;

}

#scanner.scanner-scc #matrix #y_axis #y_footer {
    background-color: #98d5cf;

}

#scanner.scanner-ccs #matrix #y_axis #y_footer {
    background-color: #5AC18E;

}

#scanner.scanner-cps #matrix #y_axis #y_footer {
    background-color: #606c38;

}

#scanner.scanner-dps #matrix #y_axis #y_footer {
    background-color: #83c5be;

}

#scanner #matrix #y_axis #y_footer span {
    color: #25d7d5;
}

#scanner #y_axis #filter {
    height: 20px;
    right: 10px;
    top: -2px;
    width: 20px;

}

#scanner #y_axis #filter:hover {
    background-position: center -24px;
}

#scanner #y_axis .position-filter {
    top: 20px;
}

#scanner #y_axis #positions li {
    height: 66px;
    padding: 0;
    font-weight: 400;
    cursor: pointer;
    position: relative;
    z-index: 9;
}

#scanner #y_axis #positions li .result-url {
    display: none;
}

#scanner #y_axis #positions li.active {
    background-color: #7AD8D1;
}

#scanner #y_axis #positions li:hover {
    background-color: #b0b5bc;
}

#scanner .cell .itm,
#scanner #y_axis .result.itm > div:last-child > div:nth-child(3) div {
    background-color: #5FE8FF;
}

#scanner .cell .otm,
#scanner #y_axis .result.otm > div:last-child > div:nth-child(3) div {
    background-color: #E57E22;
}

#scanner .cell .atm,
#scanner #y_axis .result.atm > div:last-child > div:nth-child(3) div {
    background-color: #24FF4D;
}

#scanner #y_axis #positions li > div {
    background-color: #fff;
    display: table;
    left: 4px;
    position: relative;
    text-align: center;
    top: 4px;
    width: 91%;
    z-index: 10;
    border-radius: 3px;
}

#scanner.scanner-s #y_axis #positions li > div {
    border: 1px solid #5f707d;
}

#scanner #y_axis #positions li div.dates {
    display: table;
    width: 100%;
}

#scanner #y_axis #positions li div.inline {
    display: table-cell;
    width: 50%;
    color: #fff;
    background-color: #4FBA6F;
    padding: 0;
}

#scanner #y_axis #positions li div.inline:last-child {
    -webkit-border-top-right-radius: 2px;
    -moz-border-radius-topright: 2px;
    border-top-right-radius: 2px;
}

#scanner #y_axis #positions li div.inline.red {
    background-color: #E54D3C !important;
}

#scanner #y_axis #positions li > div > div {
    display: table-row;

}

#scanner.scanner-s #y_axis #positions li > div > div {
    background-color: #009C98;
    color: #fff;

}

#scanner #y_axis #positions li > div > div.price {
    display: none;

}

#scanner #y_axis #positions li > div > div:nth-child(2) {
    background-color: #283D4F;
    color: #fff;
    font-size: 0.8em;
}

#scanner.scanner-s #y_axis #positions li > div > div:nth-child(2) {
    font-size: 1.5em;
    line-height: 2em;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-left-radius: 3px;
    border-left: 1px solid #5f707d;
    border-bottom: 1px solid #5f707d;
    background-color: #d9d9d9;
}

#scanner #y_axis #positions li > div > div:nth-child(2) > div:first-child {
    border-right: 1px solid #fff;
}

#scanner.scanner-s #y_axis #positions li > div > div:nth-child(2) > div:first-child {
    border-right: none;
}

#scanner #y_axis #positions li > div > div > div {
    display: table-cell;
    width: 50%;
}

#scanner #y_axis #positions li > div > div:first-child > div:first-child {
    -webkit-border-top-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    border-top-left-radius: 3px;
    border-left: 1px solid #5f707d;
    border-top: 1px solid #5f707d;
}

#scanner #y_axis #positions li > div > div:first-child > div:last-child {
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    border-top-right-radius: 3px;
    border-right: 1px solid #5f707d;
    border-top: 1px solid #5f707d;
}

#scanner.scanner-s #y_axis #positions li > div > div:first-child > div:last-child {
    border: none;
    border-radius: 0;
}

#scanner #y_axis #positions li > div > div:nth-child(3) > div:first-child {
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-left-radius: 3px;
    border-left: 1px solid #5f707d;
    border-bottom: 1px solid #5f707d;
}

#scanner #y_axis #positions li > div > div:nth-child(3) > div:last-child {
    -webkit-border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    border-bottom-right-radius: 3px;
    border-right: 1px solid #5f707d;
    border-bottom: 1px solid #5f707d;
}

#scanner #matrix #x_axis #results {
    height: 490px;
    width: 60%;
    float: left;
    left: 10px;
    position: relative;
    top: 12px;
}

#scanner #matrix #x_axis #results .result {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
}

#scanner #matrix #x_axis #results .result.watermark {
    z-index: 9;
}

#scanner #matrix #x_axis #results .table {
    margin-bottom: 50px;
}

#scanner #results p#empty {
    margin: 230px auto;
    text-align: center;
}

#scanner #results .result .head .company {
    margin-left: 10px;
    font-size: 1.7em;
}

#scanner #results .result .head .lab {
    position: relative;
    left: 7px;
    top: 3px;
    background: url("../images/lab-white.svg") no-repeat center;
    background-size: 22px auto;
    background-position: center 0;
    width: 24px;
    height: 24px;
    display: inline-block;
}

#scanner #results .result .head .lab:hover {
    background-position: center -24px;

}

#scanner #results .result .prob {
    right: 0px;
    position: absolute;
    top: 4px;
    font-size: 0.6em;
    border-radius: 50%;
    border: 2px solid #fff;
    height: 30px;
    width: 30px;
    background-color: #27e1ab;
    line-height: 1.9em;
    text-align: center;
    color: #fff;
    cursor: pointer;
}

#scanner #results .result .strike .mini-table .prob {
    font-size: inherit;

}

#scanner #results .result .head ul {
    list-style-type: none;
    float: right;
    width: 57%;
    left: 0;
}

#scanner #results .result .head ul li {
    float: left;
    color: #fff;
    margin-right: 6px;
}

#scanner #results .result .head ul li .add {
    background-color: #27E1B0;
    color: #fff;
}

#scanner #results .result .head ul li .add:hover {
    background-color: #fff;
    color: #27E1B0;
}

#scanner #results .result .head ul li:nth-child(0) {
    font-size: 1.7em;
}

#scanner #results .result .head #chain_form .hidden {
    display: none;
}

#scanner #results .result a.button {
    background-color: #fff;
    color: #000;
    font-size: 0.85em;
    padding: 3px 5px;
    position: relative;
    text-align: center;
    cursor: pointer;
    border: 1px solid #fff;
}

#scanner #results .result a.info {
    background-color: #7d9f00;
    color: #fff;
    top: -3px;
}

#scanner #results .result a.more-info {
    background-color: #7d9f00;
    color: #fff;
    top: -3px;
}

#scanner #results .result a.company-news {
    background-color: #edc71c;
    color: #fff;
}

#scanner #results .result a.chain {
    background-color: #ff780b;
    color: #fff;
}

#scanner #results .result a.button:hover, #scanner #results .result ul li form input:hover {
    background-color: #6FE570;
    color: #000;
}

#scanner #results .result a.on {
    border: 1px solid #ff780b;
    color: #ff780b;
}

#scanner #results .result ul li form input {
    background-color: #fff;
    color: #000;
    cursor: pointer;
    font-size: 0.85em;
    padding: 0 2px;
    border-radius: 0;
    height: 21px;
    border: 1px solid #fff;
}

#scanner #results .footer span {
    float: left;
    color: #fff;
    padding-left: 56px;
    background-size: 21px 21px;
}

#scanner #results .footer span:nth-child(1) {
    background: url("../images/blue-circle-two.svg") no-repeat center;
}

#scanner #results .footer span:nth-child(2) {
    background: url("../images/green-circle.svg") no-repeat center;
}

#scanner #results .footer span:nth-child(3) {
    background: url("../images/orange-circle.svg") no-repeat center;
}

#scanner #results .footer ul li {
    float: left;
    color: #fff;
    padding-left: 56px;
    background-size: 21px 21px;
}

#scanner #results .footer ul li a {
    background-color: transparent;
    cursor: pointer;
    color: #fff;
}

#scanner #results .footer ul li a:hover {
    color: #ff780b;
}

#scanner #results .footer ul li#create-new {
    position: relative;
    left: 75px;
    padding-left: 0;
    top: 0;
}

#scanner #results .footer ul li#create-new select {
    font-size: 0.85em;
    height: 21px;
    width:130px;
    padding-left:5px;
}

#scanner #results .footer ul li#create-new input {
    background-color: #edc71c;
    color: #fff;
}

#scanner #results .footer ul li#create-new input:hover {
    background-color: #fff;
    color: #edc71c;
}

#scanner #results .footer ul li#reset-list {
    position: relative;
    left: 39px;
    padding-left: 0;
    bottom: 1px;
}

#scanner #matrix #x_axis #results .table .main div.hidden-div {
    background-color: #fff;
    display: none;
    height: 85.3%;
    left: 6px;
    margin-bottom: 5px;
    overflow: hidden;
    position: absolute;
    top: 36px;
    width: 97.8%;
    z-index: 99;
}

#scanner #matrix #x_axis #results .table .main .bottom .chart {
    height: 100%;
    left: 6px;
    position: relative;
    width: 97.8%;
}

#scanner #matrix #x_axis #results .table .main .bottom .charts {
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%;
    display: none;
}

#scanner #matrix #x_axis #results .table .main .bottom .charts#img-bar-six {
    display: block;
}

#scanner .chart-header {
    width: 100%;
    height: 20px;
    background-color: #283d4f;
    color: #fff;
}

#scanner .chart-header form {
    position: relative;
    left: 3px;
    top: 1px;
    font-size: 0.9em;

}

#scanner .chart-header form li {
    float: left;
    margin-right: 5px;
}

#scanner .chart-header form input[type="radio"] {
    position: fixed;
    top: -1000px;
}

#scanner .chart-header form input[type="radio"]:checked ~ label span {
    background-position: center bottom;
}

#scanner .chart-header form input[type="radio"] ~ label span {
    background: url("../images/radio-one.svg") no-repeat scroll center top / 200% 200% rgba(0, 0, 0, 0);
    cursor: pointer;
    display: inline-block;
    height: 17px;
    margin: -3px 4px 0 0;
    vertical-align: middle;
    width: 17px;
}

#scanner #results .chart-header a.tradingview-popup {
    left: 11px;
    top: 0px;
    font-size: 0.7em;
}

#scanner #matrix #x_axis #results .table .main .bottom img {
    width: 100%;
    height: 88%;
}

#scanner #matrix #x_axis #results #market-data {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    top: 28px;
}

#scanner #matrix #x_axis #results #market-data .quote-body {
    height: 87.3%;
}

#scanner #matrix #x_axis #results #option-chain {
    display: block;
    height: 100%;
    width: 100%;
    border: none;
    padding: 0;
}

#scanner #matrix #x_axis #results #company-news {
    overflow-x: hidden;
    overflow-y: scroll;
}

#scanner #matrix #x_axis #results #company-news ul {
    float: none;
    left: 0;
}

#scanner #matrix #x_axis #results #company-news ul li {
    background: url("../images/rss.svg") no-repeat scroll -75px 13px / 42% 42% rgba(0, 0, 0, 0);
    color: #575756;
    display: block;
    float: none;
    font-size: 12px;
    font-weight: 100;
    height: 70px;
    padding-left: 55px;
}

#scanner #matrix #x_axis #results #company-news ul li a {
    color: #283d4f;

}

#scanner #matrix #x_axis #results #company-news ul li a:hover {
    color: #ff780b;

}

#scanner #matrix #x_axis #results #company-news ul li.even {
    background-color: #dfdfdf;
}

#scanner #matrix #x_axis #results #company-news ul h3 {
    font-size: 1em;
    padding-top: 7px;
}

/*fokas scanner */

#scanner.fokas #matrix #x_axis .head {
    background-color: #423B67;
}

#scanner.fokas #matrix #x_axis .footer {
    background-color: #423B67;
}

#scanner.fokas #matrix #y_axis #y_header {
    background-color: #423B67;
}

#scanner.fokas #matrix #y_axis #y_footer {
    background-color: #423B67;
}

#scanner.fokas #matrix #x_axis #results .watermark.table .main {
    background: url("../images/fokas-logo_expanded.svg") no-repeat center;
    background-size: 80%;
}

#scanner.fokas #filters > ul {
    background-color: #423B67;
}

#scanner.fokas #filters > ul li {
    width: 100%;
}

#scanner.fokas #filters ul li.ui-state-active {
    background-color: #423B67;
}

#scanner.fokas #filters ul li.ui-state-active a {
    color: #fff;
}

#scanner.fokas #filters form input[type="submit"] {
    background-color: #423B67;
    border: 1px solid #423B67;
}

/*bridge */
#bridge #y_axis {
    border: 1px solid #283d4f;
    border-radius: 5px;
    height: 498px;
    left: 7px;
    position: relative;
    top: 7px;
    width: 31%;
    background-color: #E6EAEC;
}

#bridge #tabs-help .help-container p#intro {
    font-size: 0.9em;
    margin-bottom: 25px;
    padding: 10px;
    text-align: center;
}

#bridge #y_axis #y_header {
    height: 0;
}

#bridge #y_axis #y_header > div {
    display: inline-block;
    height: 100%;
    line-height: 1.4em;
    text-align: center;
    width: 100%
}

#bridge #y_axis #params {
    margin-bottom: 5px;
    position: relative;
}
#bridge.competitive #y_axis #params {
    margin-bottom: 43px;
    position: relative;
}
#bridge #y_axis .holder {
    left: 12px;
    position: relative;
    top: 10px;
    width: 96%;
    height: 360px;

}

#bridge #y_axis .notes-holder {
    height: 360px;

}

#bridge #y_axis .trans-holder {
    height: 360px;
}

#bridge #y_axis #notes #double-holder {
    height: 300px;
    overflow-x: hidden;
    overflow-y: scroll;
    width: 95%;
}

#bridge #y_axis #trans #double-holder {
    height: 305px;
    overflow-x: hidden;
    overflow-y: scroll;
    margin-top: 0;
    width: 95%;
}

#bridge #y_axis .holder.ui-widget-content {
    background-color: inherit;
}

#bridge #y_axis .update {
    width: 120px;
    height: 22px;
    margin: 5px;
    background-color: #22BEB3;
    text-align: center;
    font-size: 1.1em;
    color: #fff;
    cursor: pointer;
}

#bridge #y_axis .update:hover {
    background-color: #fff;
    color: #22BEB3;
}

#bridge #y_axis #params #inputs {
    float: left;
}

#bridge #y_axis #params #trans {
    float: left;
    width: 94%;
    border: 1px solid #22BEB3;
    padding: 5px;
    margin-top: 10px;
}

#bridge #y_axis #params #inputs > div {
    float: left;
    margin-right: 4px;
    width: 48.2%;
    margin-bottom: 8px;
}

#bridge #y_axis #params label {
    font-size: 0.85em;
}

#bridge #y_axis #params input,
#bridge #y_axis #params select,
#bridge #y_axis #trans input {
    width: 98%;
    height: 32px;
    padding-left: 10px;
    margin-top: 10px;
}

#bridge #y_axis #params input#id_starting_capital {
    font-size: 1.4em;
    color: #7d9f00;
}
#bridge #y_axis #params input.disabled{
    background-color: #c2c4c4;
}
#bridge #y_axis #params input#id_reserved_capital {
    font-size: 1.4em;
    color: #22beb3;
}

#bridge #y_axis #params input[type='checkbox'] {
    display: none;
}

#bridge #y_axis #params label[for='id_trans-0-DELETE'] {
    display: none;
}

#bridge #y_axis #params input[type='submit'],
#bridge #y_axis #notes input[type='submit'],
#bridge #y_axis #trans input[type='submit'] {
    width: 35%;
    padding: 0;
    position: relative;
    height: 32px;
    left: -5px;
}

#bridge #y_axis #params #trans input {
    width: 98%;
}

#bridge #y_axis #notes {
    clear: both;
    position: relative;
    margin-bottom: 5px;
}

#bridge #y_axis .note,
#bridge #y_axis .trans {
    clear: both;
    position: relative;
    width: 100%;
    margin-bottom: 5px;
}

#bridge #y_axis .note textarea {
    width: 100%;
    height: 190px;
    padding: 5px;
}

#bridge #y_axis .note input {
    width: 98%;
    margin-left: 3px;
    padding: 10px;
    background-color: #DADFE1;
}

#bridge #y_axis .note .delete-row,
#bridge #y_axis .trans .delete-row {
    display: inline-block;
    font-size: 0;
    height: 23px;
    position: absolute;
    right: 24px;
    top: 0;
    width: 23px;
    background: url("../images/cross-three.svg") no-repeat center #d1d1d1;
    background-size: 50% 50%;
}

#bridge #y_axis .note .ui-state-active ~ .delete-row,
#bridge #y_axis .trans .ui-state-active ~ .delete-row,
#bridge #y_axis .note .delete-row:hover,
#bridge #y_axis .trans .delete-row:hover {
    background: url("../images/cross-four.svg") no-repeat center #98d5cf;
    background-size: 50% 50%;
}

#bridge #y_axis .note .title,
#bridge #y_axis .trans .title {
    background-color: #D1D1D1;
    font-size: 0.9em;
    height: 23px;
    line-height: 1.7em;
    padding-left: 6px;
    border: none;
    color: inherit;
    position: relative;
    cursor: pointer;
}

#bridge #y_axis .note .title > span.date,
#bridge #y_axis .trans .title > span.date {
    font-weight: 800;
    color: #283d4f;
}

#bridge #y_axis .note .title.ui-state-active,
#bridge #y_axis .trans .title.ui-state-active,
#bridge #y_axis .note .title:hover,
#bridge #y_axis .trans .title:hover {
    background-color: #98d5cf;
    background-image: none;
}

#bridge .note .ui-accordion-header-icon,
#bridge .trans .ui-accordion-header-icon {
    display: inline-block;
    height: 100%;
    position: absolute;
    right: 0;
    width: 23px;
    background: url("../images/plus-white.svg") no-repeat center #283d4f;
    background-size: 50% 50%;
    cursor: pointer
}

#bridge .note .ui-state-active .ui-accordion-header-icon,
#bridge .trans .ui-state-active .ui-accordion-header-icon {
    background: url("../images/minus-white.svg") no-repeat center #767A8D;
    background-size: 50% 50%;
}

#bridge #y_axis #trans a.add-row,
#bridge #y_axis #notes a.add-row {
    display: none;
}

#bridge #y_axis .header {
    font-size: 1.1em;
    height: 30px;
    background-color: #283d4f;
    color: #fff;
    line-height: 2em;
}

#bridge #y_axis .header .count {
    color: #EDC717;
}

#bridge #y_axis .header .ui-accordion-header-icon {
    background: url("../images/plus-two.svg") no-repeat scroll center top/ 30px 69px #283d4f;
    width: 30px;
}

#bridge #y_axis .header.ui-state-active .ui-accordion-header-icon {
    background: url("../images/minus-two.svg") no-repeat center top #283d4f;
    background-size: 30px 69px;
}

#bridge #y_axis .header .ui-accordion-header-icon:hover {
    background-position: center -39px;
}

#bridge #y_axis #trans {
    clear: both;
    position: relative;
    margin-bottom: 5px;
}
#bridge #y_axis #trans .recur{
    background-color: #276c8d;
    color:#fff;
    padding: 3px;
}
#bridge #y_axis #trans .trans-content {
    padding: 12px;
}

#bridge #y_axis #trans .trans-content label {
    margin: 5px;
}

#bridge #y_axis #trans .trans-content input {
    width: 90%;
    background-color: #f2f2f2;
    position: relative;
    bottom: 5px;
    left: 13px;
}

#bridge #y_axis #trans .trans-content input[readonly] {
    background-color: #c2c4c4;

}

#bridge #y_axis #trans .trans-content .check-holder {
    width: 95%;
    margin-top: 10px;
    margin-bottom: 10px;
}

#bridge #y_axis #trans .trans-content .check-holder .check div {
    top: -38px;
}

#bridge #y_axis #trans .trans-content .check-holder .check input {
    margin: 0;
    height: 33px;
}

#bridge #y_axis #trans .trans-content .check-holder .check:after {
    top: -4px;
    width: 17px;
}

#bridge #y_axis #trans .trans-content .check-holder label {
    margin: 0;
}

#bridge #y_axis #refresh p {
    background-color: transparent;
    padding: 10px;
}

#bridge #y_axis #refresh a {
    width: 35%;
    height: 22px;
    margin: 10px;
    background-color: #22BEB3;
    text-align: center;
    font-size: 1.1em;
    color: #fff;
    cursor: pointer;
    display: block;
    padding: 5px;
    border: none;
    border-radius: 2px;
}

#bridge #y_axis #refresh a:hover {
    background-color: #fff;
    color: #22BEB3;

}

#bridge #x_axis {
    border: medium none;
    height: 487px;
    left: 17px;
    min-height: 0;
    position: relative;
    top: 20px;
    width: 66%;
}

#bridge #x_axis ul#tabs {
    float: none;
    left: 0;
    height: 43px;
    background-color: transparent;
}

#bridge #x_axis ul#tabs li {
    float: left;
    height: inherit;
    background-color: #D1D1D1;
    border: none;
    color: #fff;
    margin-right: 3px;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    position: relative;
}

#bridge #x_axis ul#tabs li:last-child {
    margin-right: 0;
}

#bridge #x_axis ul#tabs li span {
    position: absolute;
    top: 21px;
    left: 7px;
    z-index: 999;
    color: #fff;
    padding: 5px;
    background-color: #2B7094;
    border-radius: 50%;
    height: 8px;
    width: 8px;
    vertical-align: middle;
    line-height: .7em;
    display: none;
    border: 1px solid #fff;
    cursor: pointer;
    font-weight: 400;
}

#bridge #x_axis ul#tabs li span:hover {
    cursor: pointer;
    color: #31b7ae;
}

#bridge #x_axis ul#tabs li a {
    color: #9d9d9c;
    display: inline-block;
    height: 72%;
    padding: 0.53em;
    font-size: 0.8em;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

#bridge #x_axis ul#tabs li.ui-state-active a,
#bridge #x_axis ul#tabs li a:hover {
    background-color: #283d4f;
    color: #35d7d4;
}

#bridge #x_axis ul#tabs li.ui-tabs-active a {
    font-weight: normal;
}

#bridge #x_axis ul#tabs li a:focus {
    outline: none;
}

#bridge #x_axis #tab-data {
    height: 444px;
}

#bridge #x_axis #tab-data .no-positions-small p {
    bottom: 31px;
}

#bridge #x_axis #tab-data > div {
    background-color: #e6eaec;
    height: 100%;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    -moz-border-radius-bottomright: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

#bridge #x_axis #tab-data > div > div {
    left: 25px;
    position: relative;
    top: 25px;
    width: 93%;
    float: left;
}

#bridge #x_axis #tab-data #bars-holder {
    top: 10px;
    height: 95%;
    overflow-x: hidden;
    overflow-y: scroll;
}

#bridge #x_axis #tab-data > div .google-chart {
    display: inline-block;
    width: 49%;
    background-color: #fff;
    left: 4px;
    top: 5px;
    float: none;
    margin-bottom: 5px;
}

#bridge #x_axis #tab-data > div #bar-graph {
    background-color: #fff;
    margin-bottom: 5px;
    position: relative;

}

#bridge .report .scroller {
    bottom: 18px;
    right: 9px;
}

#bridge #x_axis #tab-data > div .google-chart.big-chart {
    width: 98.7%;
}

#bridge #x_axis #tab-data > div .google-chart .title,
#bridge #x_axis #tab-data > div #bars-holder .title {
    text-align: center;
    margin-bottom: 10px;
    border-bottom: 1px solid #dadfe1;
    padding: 5px 0;
    color: #fff;
    background-color: #283d4f;
}

#bridge #x_axis #tab-data > div #bars-holder .title.current {
    background-color: #7D9F00;
}

#bridge .number-green {
    color: #7D9F00;
    font-size: 1.7em;
}

#bridge #capital-data .number-green,
#bridge #fees-data #to .number-green {
    font-size: 1.2em;
}

#bridge #capital-top .number-red {
    font-size: 1.2em;
}

#bridge #capital-data .oie .number-green,
#bridge #capital-data .oi .number-green,
#bridge #capital-data .ci .number-green {
    font-size: 1.7em;
}

#bridge .number-blue {
    color: #2B7094;
    font-size: 1.7em;
}

#bridge .number-red {
    color: #801A1D;
    font-size: 1.7em;
}

#bridge .number-small-green {
    color: #7D9F00;
    font-size: 1.1em;
    font-weight: 500;
}

#bridge .number-small-red {
    color: #801A1D;
    font-size: 1.1em;
    font-weight: 500;
}

#bridge #x_axis #tab-data .info {
    height: 90px;
    text-align: center;
    line-height: 2.9em;
    color: #fff;
}

#bridge #x_axis #tab-data .info.oi > div:first-child,
#bridge #x_axis #tab-data .info.cie > div:first-child {
    background-color: #2c7192;
}

#bridge #x_axis #tab-data .info.oie > div:first-child,
#bridge #x_axis #tab-data .info.ci > div:first-child {
    background-color: #293d4e !important;
}

#bridge #x_axis #tab-data .info#pvbe > div:first-child {
    background-color: #61c1a0;
}

#bridge #x_axis #tab-data .info#pvn > div:first-child {
    background-color: #5ca4a0;
}

#bridge #x_axis #tab-data .info#pve > div:first-child {
    background-color: #25baaf;
}

#bridge #x_axis #tab-data .info#tr > div:first-child {
    background-color: #7f1b20;
}
#bridge #x_axis #tab-data .borrowed{
    background-color: #ff780b;
    color: #fff;
}

#bridge #x_axis #tab-data .info#capital {
    font-size: 0.9em;
    display: table;
    height: 190px;
}

#bridge #x_axis #tab-data .info#cap-inv,
#bridge #x_axis #tab-data .info#to {
    display: table;
}

#bridge #x_axis #tab-data > div .info#capital > div,
#bridge #x_axis #tab-data > div .info#to > div {
    height: 21%;
    border-bottom: none;
    display: table-row;
}

#bridge #x_axis #tab-data > div .info#capital > div > div,
#bridge #x_axis #tab-data > div .info#to > div > div {
    display: table-cell;
    width: 50%;
    position: relative;
}

#bridge #x_axis #tab-data .info#rc {
    height: 23%;
    font-size: 0.9em;
    line-height: 2em;
}

#bridge #x_axis #tab-data .info#rc div:first-child {
    background-color: #2c7192;
    height: 100%;
    line-height: 4em;
}

#bridge #x_axis #tab-data > div .info#capital > div > span {
    display: table-cell;
}

#bridge #x_axis #tab-data > div .info#capital > div:first-child > div:nth-of-type(1) {
    background-color: #2c7192;
}

#bridge #x_axis #tab-data #capital-data .tooltips {
    background: url(../images/info.svg) no-repeat;
    background-size: 100%;
    cursor: pointer;
    display: inline-block;
    width: 16px;
    height: 16px;
    position: absolute;
    right: 5%;
    top: 30%;

}

#bridge #x_axis #tab-data #capital-data .tooltips:hover {
    background-position: 0 -23px;

}

#bridge #x_axis #tab-data > div .info#capital > div:nth-child(2) > div:nth-of-type(1) {
    background-color: #25bab0;
}

#bridge #x_axis #tab-data > div .info#capital > div:nth-child(3) > div:nth-of-type(1) {
    background-color: #35d7d4;
}

#bridge #x_axis #tab-data > div #cap-inv > div:first-child > div:nth-of-type(1),
#bridge #x_axis #tab-data > div .info#to > div:first-child > div:nth-of-type(1) {
    background-color: #5ca4a0;
}

#bridge #x_axis #tab-data > div #cap-inv > div:nth-child(2) > div:nth-of-type(1),
#bridge #x_axis #tab-data > div .info#to > div:nth-child(2) > div:nth-of-type(1) {
    background-color: #35d7d4;
}

#bridge #x_axis #tab-data > div #capital-top > div,
#bridge #x_axis #tab-data #cg-div-data .info,
#bridge #x_axis #tab-data #acc-val-data .info {
    background-color: #fff;
    float: left;
    width: 47.7%;
    margin: 4px;
}

#bridge #x_axis #tab-data #risk-income-data .info-top {
    background-color: #fff;
    float: left;
    width: 47.7%;
    margin: 4px;
    text-align: center;
    line-height: 2.9em;
    height: 188px;
    position: relative;
}

#bridge #x_axis #tab-data .info.left {
    text-align: left;
    padding-left: 10px;
    width: 46.7% !important;
}

#bridge #x_axis #tab-data .info.left span {
    position: relative;
    left: 5px;
}

#bridge #x_axis #tab-data .info#cgop > div:first-child {
    background-color: #61c1a0;
}

#bridge #x_axis #tab-data .info#dop > div:first-child {
    background-color: #283d4f;
}

#bridge #x_axis #tab-data .info#dcp > div:first-child {
    background-color: #2c7192;
}

#bridge #x_axis #tab-data .info#cgcp > div:first-child {
    background-color: #25baaf;
}

#bridge #x_axis #tab-data .info#toc > div:first-child {
    background-color: #5cc09e;
}

#bridge #x_axis #tab-data .info#toce > div:first-child {
    background-color: #25bab0;
}

#bridge #x_axis #tab-data .info#tfop > div:first-child {
    background-color: #2a3d4e;
}

#bridge #x_axis #tab-data .info#tfcp > div:first-child {
    background-color: #2c7192;
}

#bridge #x_axis #tab-data .info#tfc > div:first-child {
    background-color: #0778aa;
}

#bridge #x_axis #tab-data .info-top.risk > div > div:first-child,
#bridge #x_axis #tab-data .info-top.risk-cap > div:first-child{
    background-color: darkred;
}

#bridge #x_axis #tab-data .info.logo {
    background: url("../images/tc-logo-gray-medium.png") no-repeat center #fff;
    background-size: 58% 98%;
}

#bridge #x_axis #tab-data .info#tcp > div:first-child {
    background-color: #5ca4a0;
}
#bridge #x_axis #tab-data #risk-income-data .infinite {
    position: relative;
    font-size: 7em;
    bottom:15px;
}
#bridge #x_axis #tab-data #risk-income-data .sharpe-ratio{
    background: url("../images/exclaim-two.svg") no-repeat scroll center top rgba(0, 0, 0, 0);
    background-size: auto 240%;
    height: 30px;
    right: 73px;
    width: 30px;
    top: 148px;
    position: absolute;
}
#bridge #x_axis #tab-data #risk-income-data .sharpe-ratio:hover {
    background-position: center -43px;
    box-shadow: none;
    cursor:pointer;
}
#bridge #x_axis #tab-data #risk-income-data .poor {
    color: darkred;
    font-size: 1.7em;
}
#bridge #x_axis #tab-data #risk-income-data .good {
    color: #ff780b;
    font-size: 1.7em;
}
#bridge #x_axis #tab-data #risk-income-data .vgood {
    color: green;
    font-size: 1.7em;
}
#bridge #x_axis #tab-data #risk-income-data .excellent {
    color: purple;
    font-size: 1.7em;
}
#bridge #x_axis #tab-data .info#atr > div:first-child {
    background-color: #25bab0;
}
#bridge #x_axis #tab-data .info#cg-total > div:first-child {
    background: url("../images/moneybags.svg") no-repeat -85px center #98d5cf;
    background-size: 75% 75%;
}

#bridge #x_axis #tab-data .info#div-total > div:first-child {
    background: url("../images/piggy.svg") no-repeat -81px center #7aacc0;
    background-size: 75% 75%;
}

#bridge #x_axis #tab-data .info#drda > div:first-child {
    background: url("../images/dollar-four.svg") no-repeat 13px center #7f1b20;
    background-size: 10%;
}

#bridge #x_axis #tab-data .info#tr > div:first-child {
    background: url("../images/dollar-four.svg") no-repeat 13px center #7f1b20;
    background-size: 10%;
}

#bridge #x_axis #tab-data > div .info > div {
    background-color: #fff;
}

#bridge #x_axis #tab-data > div .info > div:first-child {
    height: 47%;
    position: relative;
}

#bridge #x_axis #tab-data > div .info > div:last-child {
    height: 53%;
}

#bridge #x_axis #tab-data > div .info#to > div:first-child,
#bridge #x_axis #tab-data > div .info#capital > div:nth-child(1),
#bridge #x_axis #tab-data > div .info#capital > div:nth-child(3) {
    outline: 1px solid #e6eaec;
}

#bridge #x_axis #tab-data > div .info#drda-p > div {
    float: left;
    height: 100%;
}

#bridge #x_axis #tab-data > div .info#drda-p > div:first-child {
    width: 30%;
}

#bridge #x_axis #tab-data > div .info#drda-p > div:last-child {
    width: 65%;
    color: #000;
}

#bridge #x_axis #tab-data > div .info.fees-total > div > div:last-child {
    position: relative;
    top: 10px;
}
#bridge #x_axis #tab-data .bp{
    font-size: 1.2em;
}

#bridge #x_axis #tab-data .bp > div:first-child{
    color:#fff;
    background-color: #2c7192;
    position: relative;
}

#bridge #x_axis #tab-data .bp > div:last-child{
    line-height: 2em;
}

#bridge #x_axis #tab-data #progress-info {
    height: 190px;
    margin: 5px;
    text-align: center;
    line-height: 2.5em;
    font-size: 0.8em;
}

#bridge #x_axis #tab-data #progress-info .capital-bar {
    height: 33%;
    position: relative;
    margin-top: 0;
    border-bottom: 1px solid #dadfe1;
}

#bridge #x_axis #tab-data #progress-info .capital-bar:last-child {
    border-bottom: none;
}

#bridge #x_axis #tab-data #progress-info .progress-number {
    position: absolute;
    right: 2px;
    top: 21px;
    color: #8A8B8D;
}

#bridge #x_axis #tab-data .progress-bar {
    background-color: #dadfe1;
    border-bottom: medium none;
    height: 13px;
    left: 8px;
    top: 0;
    position: relative;
    width: 80%;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    line-height: inherit;
}

#bridge #x_axis #tab-data #progress-bar-ye {

    width: 78%;
    top: 8px;
}

#bridge #progress-bar-ye:before {
    color: #8a8b8d;
    content: "0";
    left: -18px;
    position: absolute;
    top: -3px;
}

#bridge #progress-bar-ye:after {
    content: "365";
    position: absolute;
    right: -32px;
    top: -3px;
    color: #8A8B8D;
}

#bridge .progress-bar#progress-bar-actual .ui-widget-header {
    background-color: #2c7192;
    min-height: 13px;
}

#bridge .progress-bar#progress-bar-potential .ui-widget-header {
    background-color: #25bab0;
    min-height: 13px;
}

#bridge .progress-bar#progress-bar-potential-ex .ui-widget-header {
    background-color: #35d7d4;
    min-height: 13px;
}

#bridge #progress-bar-ye .ui-widget-header {
    background-color: #35d7d4;
    min-height: 13px;
}

#bridge .progress-bar .ui-progressbar-value {
    width: 90%;
    transition: width 4s;
    -webkit-transition: width 4s;
}

#bridge #x_axis #tab-data > div #capital-top {
    float: left;
    width: 100%;
}

#bridge #x_axis #tab-data > div #capital-bottom {
    float: left;
    width: 100%;
}

#bridge #x_axis #tab-data > div #capital-bottom > div {
    float: left;
    height: 188px;
    margin: 4px;
    text-align: center;
    line-height: 2.5em;
    vertical-align: top;
}

#bridge #x_axis #tab-data > div #capital-bottom > div > div:first-child {
    margin-bottom: 5px;
}

#bridge #x_axis #tab-data > div #capital-bottom > div:nth-child(1) {
    width: 22.5%;
}

#bridge #x_axis #tab-data > div #capital-bottom > div:nth-child(2) {
    width: 35.5%;
}

#bridge #x_axis #tab-data > div #capital-bottom > div:nth-child(3) {
    width: 36%;
}

#bridge #x_axis #tab-data > div #risk-top {
    float: left;
    width: 100%;
    color: #fff;
}

#bridge #x_axis #tab-data > div #risk-bottom {
    float: left;
    width: 100%;
    color: #fff;
}

#bridge #x_axis #tab-data > div #risk-bottom > div {
    width: 31.3%;
    float: left;
    height: 90px;
    margin: 4px;
    text-align: center;
    line-height: 2.9em;
    vertical-align: top;
    background-color: #fff;
}

#bridge #x_axis #tab-data .dark-blue {
    background-color: #2c7192;
}

#bridge #x_axis #tab-data .medium-blue {
    background-color: #25bab0;
}

#bridge #x_axis #tab-data .light-blue {
    background-color: #35d7d4;
}

#bridge #dialler {
    background-color: #fff;
    padding-left: 7px;
    height: 73%;
}

#bridge #risk-dialler-parent {
    height: 188px !important;
    color: #000;
}

#bridge #risk-dialler {
    background-color: #fff;
    padding-left: 10px;
    padding-top: 10px;
    height: 70%;
    float: left;
}

#bridge #rp {
    float: right;
    width: 40%;
    padding-top: 35px;
    line-height: 2.9em;
    font-size: 1.7em;
}

#bridge .tr {
    padding-top: 10px;
}

#bridge #dialler table {
    width: 100%;
}

#bridge #dialler .dial {
    font-size: 0.7em !important;
}

#bridge #dialler > div:first-child {
    position: relative;
    top: 10px;
}

#bridge #drda-p #dialler > div:first-child {
    position: relative;
    top: 5px;
}

#bridge #x_axis .holder {
    background-color: #fff;
    padding: 7px;
}

#bridge #x_axis .holder ul {
    float: none;
    width: 99%;
    left: 0;
}

#bridge #x_axis .holder ul li a {
    color: inherit;
    padding-left: 10px;
}

#bridge #x_axis .holder ul li {
    float: none;
    background-color: #EDEDED;
    margin-bottom: 5px;
    height: 20px;
}

#bridge #x_axis .holder ul li:hover {
    background-color: #f4f4f4;

}

#bridge #x_axis .holder ul li span {
    color: #283d4f;
    font-weight: 800;
}

#bridge #x_axis .holder ul li.trans span:last-child {
    color: inherit;
}

#bridge #x_axis .holder span.withdraw,
#bridge #x_axis span.withdraw,
#bridge #y_axis span.withdraw {
    color: #801A1D;
}

#bridge #x_axis .holder span.deposit,
#bridge #x_axis span.deposit,
#bridge #y_axis span.deposit {
    color: #7D9F00 !important;
}

#bridge #pos-trans-data {
    height: 415px;
    overflow-x: hidden;
    overflow-y: scroll;
}

#bridge #pos-trans-data > div {
    margin-bottom: 11px;
}

#bridge .header {
    background-color: #fff;
    color: #283d4f;
    font-size: 1.4em;
    font-weight: 400;
    height: 45px;
    line-height: 2.2em;
    padding-left: 20px;
    position: relative;
    border: none;
    cursor: pointer;
}

#bridge #pos-trans-data .header:hover {
    background-color: #f4f4f4;

}

#bridge .header.ui-state-active {
    background-color: #98d5cf;
    background-image: none;
    border: none;
}

#bridge .header .ui-accordion-header-icon {
    display: inline-block;
    height: 100%;
    position: absolute;
    right: 0;
    width: 50px;
    background: url("../images/plus-two.svg") no-repeat center 3px #283d4f;
    background-size: 44px 90px;
}

#bridge .header.ui-state-active .ui-accordion-header-icon {
    background: url("../images/minus-two.svg") no-repeat center 3px #283d4f;
    background-size: 44px 90px;
}

#bridge .header .ui-accordion-header-icon:hover {
    background-position: center -48px;
}

#bridge #pos-trans-data .position.liActive {
    background-color: #DAF9FF;
}

#bridge #x_axis #tab-data #capital-top #tax-info {
    height: 90px;
}

#bridge #x_axis #tab-data #capital-top #tax-info > div {
    text-align: center;
}

#bridge #x_axis #tab-data #capital-top #tax-info > div:nth-child(1) {
    position: relative;
    top: 0;
    background-color: #35d7d4;
    height: 47%;
    color: #fff;
    line-height: 2.9em;
}

#bridge #x_axis #tab-data #capital-top #tax-info > div:nth-child(3) {
    position: relative;
    top: 13px;
    width: 80%;
    left: 22px;
}

/*order success */

#success #ordersuccess {
    background: url("../images/signup-bg.png") repeat scroll center center rgba(0, 0, 0, 0);
    margin: 50px auto;
    padding: 35px;
    position: relative;
    width: 70%;
}

/*forums*/

body#forum {
    font-size: 14px;
    background-color: #fafafa;
    color: #000;
}

#forum .entry-content ul, #forum .markItUpHeader ul {
    list-style-type: disc;
}

#forum #brd-wrap {
    position: relative;
    top: 30px;
    margin-bottom: 2em;
}

#forum .brd a:link, #forum .brd a:visited {
    color: #000;
}

#forum .brd a:hover {
    color: #ff780b;
    text-decoration: none;
}

#forum #forum-welcome {
    background: url("../images/signup-bg.png") repeat scroll center center rgba(0, 0, 0, 0);
    margin: 30px auto;
    padding: 35px;
    position: relative;
}

#forum .brd .main-head, #forum .brd .main-pagehead {
    background-color: #eaff94;
    height: 52px;
    color: #000;
}

#forum .brd .main-pagehead {

    margin: -3.1em 1.5em 0 0;
}

#forum .brd .main-head {
    padding: 0 1.417em;
    border: none;
}

#forum .brd .main-head .hn {
    padding: .6em 10em 0.426em 0;
    font-size: 1.8em;
}

#forum .brd {
    width: inherit;
}

#forum .brd .main-content, #forum .brd .gen-content {
    border-style: none;
    background-color: #f1f1f2;
}

#forum .brd-page {
    font: inherit;
    float: none;
}

.brd * {
    margin: 0;
    outline: medium none;
    padding: 0;
}

#forum .brd .main-subhead {
    background: url("../images/green-gradient-large.png") repeat-x scroll center bottom #DFDFDF;
    height: 52px;
}

#forum .brd .main-subhead {
    border-style: solid;
    border-width: 1px;
    margin-bottom: -1px;
    position: relative;
    font-family: "Open Sans", sans-serif;
}

#forum .brd .main-subhead .hn {
    padding: 1.062em 1.417em;
}

#forum #brd-index .item-summary {
    margin-top: -3em;
}

#forum .brd span.submit input, .brd span.cancel input {
    background-color: #4f4f4f;
    border: 2px solid #4f4f4f;
    color: #fff;
    margin-bottom: 20px;
    padding: 10px;
    width: 28%;
    cursor: pointer;
    font-family: inherit;
    font-weight: inherit;
}

#forum .brd span.submit input:hover, .brd span.cancel input:hover {
    color: #ff780b;
}

#forum .brd .main-content .main-item .icon {
    margin-top: 1.17em;
}

#forum .newpost {
    background-color: #4f4f4f;
    border: 2px solid #4f4f4f;
    color: #fff !important;
    display: inline-block;
    padding: 10px;
    cursor: pointer;
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
}

#forum .newpost:hover {
    color: #ff780b !important;
}

#forum .brd .main-content .sticky {
    background: none repeat scroll 0 0 #ddfaf6;
}

#forum .brd .content-options, #forum .brd .ct-options {
    margin-top: -4.5em;
}

#forum .brd .postbody {
    margin-right: 20px;
}

#forum .brd .postfoot {
    margin-right: 20px;
}

#forum .brd .frm-group, #forum .brd .mf-set, #forum .brd .sf-set, #forum .brd .sf-box, #forum .brd .mf-box, #forum .brd .txt-set, #forum .brd .txt-box {
    background: none repeat scroll 0 0 #ddfaf6;
    border-color: #dbe0e4;
}

#forum #brd-visit, #forum #brd-qpost {
    margin-bottom: 3em;
}

/*contact page*/
#contact #lower-container {
    padding-bottom: 50px;
    background: transparent url("../images/themes/kane/shutterstock_2626342545.png") no-repeat center center;
    background-size: cover;
}

#contact #main {
    background-color: rgba(0, 0, 0, 0.7);
    padding: 0;
    position: relative;
    top: 20px;
    display: table;
    color: #fff;
}

#contact #main > div {
    display: table-cell;
}

#contact #main > div:first-child {
    width: 55%;
    background-color: #fff;
}

#contact #main > div:last-of-type {
    width: 45%;
    /*background: url("../images/gorilla-contact.png") no-repeat center; */
    background-size: 130%;
}

#contact #main > div:last-of-type p {
    font-size: 1.3em;
    padding: 10px;
    position: relative;
    text-align: left;
    top: -4px;
    line-height: 1.2em;
}

#contact #main #header {
    color: #7d9d00;
    font-size: 2em;
    font-weight: normal;
    height: 40px;
    text-align: center;
    margin-top: 60px;
}

#contact #main form {
    font-weight: 100;
    width: 80%;
    margin: 0 auto;
}

#contact #main form p {
    margin-bottom: 20px;
}


#contact #main form label {
    display: block;
    color: #000;
}
#contact select {
    background-color: #f2f2f2;
    border-radius: 5px;
    width: 40%;
    padding: 5px;
}
#contact #main form input {
    color: #b2b2b2;
    font-family: open-sans, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    min-height: 31px;
    width: 100%;
    background-color: #f2f2f2;
    border-color: #c4c4c4;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
    padding-left: 5px;
}

#contact #main form input:hover {
    background-color: #fff;
    color: #4f4f4f;
}

#contact #main form textarea {
    border: 1px solid #c4c4c4;
    border-radius: 5px;
    padding: 10px;
    width: 100%;
    min-height: 250px;
    background-color: #f2f2f2;
    font-size: 20px;
    color: #b2b2b2;
    font-weight: 300;
}

#contact #main form input[type="submit"] {
    background-color: #22bcb1;
    border: 1px solid #22bcb1;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    font-size: 1.5em;
    font-weight: 400;
    height: 45px;
    margin: 30px 15px 30px 0;
    width: 155px;
    padding-left: 0;
}

#contact #main form input[type="submit"]:hover {
    background-color: #fff;
    color: #22bcb1;
}

.chain-popup {
    position: relative;
    left: 82%;
    display: block;
    background: url(../images/expand-black.svg) no-repeat center top;
    background-size: cover;
    height: 28px;
    width: 28px;
    background-color: #CCD9D9;
    top: 3px;
    border: 2px solid #000;
}

.chain-popup:hover {
    background-position: center bottom;
    background-color: #fff;
}
#view-option-chain #market-data {
    width: 96%;
    float: none;
    height: 90%;
    position: relative;
    top: 5px;
    left: 22px;
}

#view-option-chain #market-data .upper,
#stock-analysis .upper {
    margin: 15px 0;

}

#view-option-chain #market-data .upper div > span {
    font-size: 2em;
}

#view-option-chain #market-data .upper div > span:first-child {
    font-size: 2em;
    color: #22BEB3;
}

#view-option-chain #market-data .upper div > span:nth-child(3) {
    font-weight: 400;
    font-size: 2em;
}

#view-option-chain #market-data .upper div > span:nth-child(4) {
    font-weight: 400;
    font-size: 2em;
}

#view-option-chain #market-data .upper div > span:nth-child(5) {
    font-weight: 400;
    font-size: 2em;
    padding-left: 31px;
    background-position: -2px 4px;
    background-size: 22%;
}

#view-option-chain #market-data .upper div > span:nth-child(6) {
    font-size: 2em;
    padding-right: 50px;
    background-position: 122px center;
}

#view-option-chain #market-data .upper div .range span {
    font-weight: 400;
}

#view-option-chain #market-data .upper #vol-surfaces a {
    background-color: #edc71c;
    border-radius: 2px;
    border: 2px solid #fff;
    color: #fff;
    line-height: 1.3em;
    font-size: 1.2em;
    padding: 5px;
    position: relative;
    text-align: center;
    width: 70px;
    cursor: pointer;
    display: block;

}

#view-option-chain #market-data .upper #vol-surfaces a:hover {
    background-color: #fff;
    color: #edc71c;
    border: 2px solid #edc71c;
}

#view-option-chain #market-data .upper #description {
    background-color: #edf0f1;
    padding: 10px;
    margin: 10px 0;
}

#view-option-chain #market-data .lower {
    background-color: #283d4f;
    height: 40px;
    color: #fff;
    border-top: none;
}

#view-option-chain #market-data .lower #call-header {
    width: 54%;
    font-size: inherit;

}

#view-option-chain #market-data .lower #put-header {
    width: 46%;
    font-size: inherit;

}

#view-option-chain #market-data .lower #call-header > div {
    font-size: 1.1em;
    line-height: 2.5em;
    width: 11.1%;
    float: left;

}

#view-option-chain #market-data .lower #put-header > div {
    font-size: 1.1em;
    line-height: 2.5em;
    width: 12.5%;
    float: left;
}

#view-option-chain #market-data #option-chain {
    border: none;
}

#view-option-chain #market-data #results {
    width: 100%;
    clear: both;
}

#view-option-chain #market-data #tabs {
    height: 41.6%;
    border: 1px solid #283d4f;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background: #F1F1F2;

}

#view-option-chain #market-data #option-chain {
    display: block;
    width: 100%;
    height: 100%;
}

#view-option-chain #market-data #tabs > ul {
    background-color: #22bcb1;
    left: 0;
    list-style: none outside none;
    width: 100%;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

#view-option-chain #market-data #tabs > ul li {
    border: medium none;
    float: left;
    font-size: 11px;
    font-weight: 100;
    height: 100%;
    position: relative;
}

#view-option-chain #market-data #tabs > ul li.earnings:after {
    content: "E";
    color: #fff;
    position: absolute;
    top: -20%;
    left: 0;
    font-weight: 400;
    border-radius: 50%;
    border: 2px solid #edf0f1;
    height: 16px;
    width: 16px;
    background-color: red;
    line-height: 1.5em;
    text-align: center;
}

#view-option-chain #market-data #tabs ul li.ui-state-default {
    background: none;

}

#view-option-chain #market-data #tabs ul li.ui-state-active a {

    color: #6FE670;
}

#view-option-chain #market-data #tabs ul li.ui-state-active {
    background: #536472;

}

#view-option-chain #market-data #tabs ul li a {
    color: #fff;
    display: inline-block;
    height: 55px;
    line-height: 4.8em;
    text-align: left;
    width: 100%;
    padding: 0 5px;
}

#view-option-chain #market-data #tabs ul li a:hover {
    color: #6FE670;
    background-color: transparent;
}

#view-option-chain #market-data ul#call {
    width: 54% !important;
    float: left;
}

#view-option-chain #market-data ul#put {
    float: left;
    width: 46% !important;
}

#view-option-chain #market-data #option-chain .quote-body ul#call li > div {
    width: 11.1%;
    cursor: pointer;
    position: relative;
}

#view-option-chain #market-data #option-chain .quote-body ul#put li > div {
    width: 12.5%;
}

#view-option-chain #market-data .quote-body {
    border-right: 1px solid #000;
    border-left: 1px solid #000;
    height: 426px;
    overflow-x: hidden;
    overflow-y: scroll;
}

#view-option-chain #market-data .quote-body ul li > div {
    text-align: center;
    display: table-cell;
    font-weight: 400;
    width: 25%;
    height: 60px;
    line-height: 4em !important;
    font-size: 1em;

}

#view-option-chain #market-data .quote-body ul li > div.std-barrier {
    border-bottom: 2px dashed #31b7ae;

}

#view-option-chain #market-data .quote-body ul li > .strike.std-barrier::after {
    content: "68%";
    color: #31b7ae;
    position: absolute;
    top: 35%;
    left: 35%;

}

#view-option-chain #market-data #quote-footer {
    height: 45px;
}

#view-option-chain #market-data #quote-footer > div {
    font-size: 1.5em;
    line-height: 2em;
}

#view-option-chain #market-data #quote-footer #stock-info-filler {
    float: left;
    position: relative;
    width: 33%;
    visibility: hidden;
}

/* tips and tricks */

#walk {
    position: fixed;
    left: 0;
    top: 50px;
    z-index: 999;

}

#walk a {
    position: absolute;
    left: -51px;
    top: 150px;
    color: #fff;
    padding: 10px;
    width: 120px;
    font-size: 1.3em;
    text-align: center;
    background-color: rgba(51, 51, 51, 0.9);
    -webkit-transform: rotate(-270deg);
    -moz-transform: rotate(-270deg);
    -ms-transform: rotate(-270deg);
    border: 1px solid #333;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    text-decoration: none;

}

#tips-tricks {
    position: fixed;
    right: 0;
    top: 50px;
    z-index: 999;

}

#profile #tips-tricks,
#profile #walk {
    top: 113px;
}

#tips-tricks #tab {
    position: absolute;
    left: -91px;
    top: 150px;
    color: #fff;
    padding: 10px;
    width: 120px;
    font-size: 1.3em;
    text-align: center;
    background-color: rgba(51, 51, 51, 0.9);
    -webkit-transform: rotate(-270deg);
    -moz-transform: rotate(-270deg);
    -ms-transform: rotate(-270deg);
    border: 1px solid #333;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    text-decoration: none;

}

#tips-tricks #tab:hover,
#walk a:hover {
    cursor: pointer;
    color: #22BEB3;
    text-decoration: none;

}

#tips-tricks #tab:active,
#tips-tricks #tab:visited,
#walk a:active,
#walk a:visited {
    text-decoration: none;

}

#tips-tricks #info {
    width: 400px;
    height: 560px;
    background-color: rgba(51, 51, 51, 0.5);
    display: none;
    position: relative;
    top: 80px;
}

#profile #tips-tricks #info {
    top: 91px;
}

#tips-tricks #info #inner-info {
    width: 94%;
    height: 95%;
    background-color: #333;
    position: relative;
    left: 12px;
    top: 12px;
}

#tips-tricks #info #inner-info h3 {
    color: #22BEB3;
    text-align: center;
    padding: 10px;
    font-weight: 300;
}

#tips-tricks #info #inner-info p {
    padding: 10px;
    color: #ffffff;

}

#tips-tricks #info #inner-info #start {
    background: url("../images/backward.svg") no-repeat center right;
    background-size: cover;
    float: left;
    margin-left: 10px;
    display: inline-block;
    height: 20px;
    width: 27px;
    position: relative;
    top: -28px;
}

#tips-tricks #info #inner-info #start:hover {
    background-position: center left;
}

#tips-tricks #info #inner-info #nav {
    width: 100%;
    margin-bottom: 10px;
    position: absolute;
    z-index: 9;
}

#tips-tricks #info #nav a {
    display: inline-block;
    height: 20px;
    width: 27px;
}

#tips-tricks #info #nav #prev {
    background: url("../images/backward.svg") no-repeat center right;
    background-size: cover;
    float: left;
    margin-left: 10px;
}

#tips-tricks #info #nav #next {
    background: url("../images/forward.svg") no-repeat center right;
    background-size: cover;
    float: right;
    margin-right: 10px;
}

#tips-tricks #info #nav a:hover {
    background-position: center left !important;

}

#tips-tricks #info #inner-info #panels-container {
    float: left;
    overflow-x: hidden;
    overflow-y: visible;
    width: 376px;
    color: #ffffff;
    padding-top: 10px;
}

#tips-tricks #info #inner-info #panels {
    float: left;
    height: 73%;
    position: relative;
    padding: 10px;
}

#tips-tricks.covered-tips #info #inner-info #panels {
    min-width: 5430px;
}

#tips-tricks.collar-tips #info #inner-info #panels {
    min-width: 2534px;
}

#tips-tricks.np-tips #info #inner-info #panels {
    min-width: 2534px;
}

#tips-tricks.nc-tips #info #inner-info #panels {
    min-width: 2534px;
}

#tips-tricks.stock-tips #info #inner-info #panels {
    min-width: 3258px;
}

#tips-tricks.bridge-tips #info #inner-info #panels {
    min-width: 7602px;
}

#tips-tricks.calc-tips #info #inner-info #panels {
    min-width: 2534px;
}

#tips-tricks.profile-tips #info #inner-info #panels {
    min-width: 4706px;
}

#tips-tricks.command-tips #info #inner-info #panels {
    min-width: 6878px;
}

#tips-tricks.open-pos-tips #info #inner-info #panels {
    min-width: 2534px;
}

#tips-tricks.closed-pos-tips #info #inner-info #panels {
    min-width: 3258px;
}

#tips-tricks.trade-plan-pos-tips #info #inner-info #panels {
    min-width: 3258px;
}

#tips-tricks.import-tips #info #inner-info #panels {
    min-width: 5430px;
}

#tips-tricks.create-tips #info #inner-info #panels {
    min-width: 6154px;
}

#tips-tricks.edit-tips #info #inner-info #panels {
    min-width: 9050px;
}

#tips-tricks.inlines-tips #info #inner-info #panels {
    min-width: 4706px;
}

#tips-tricks #info #inner-info #panels .tips-header {
    color: #4fba6f;
    text-align: center;
    width: 83%;
    position: relative;
    top: -18px;
    left: 25px;
    font-size: 1.2em;
}

#tips-tricks #info #inner-info #panels > div {
    float: left;
    width: 362px;
    height: 100%;
    margin-right: 362px;

}

#tips-tricks #info #inner-info #panels > div:last-child {
    margin-right: 0;

}

#tips-tricks #info #inner-info #panels > div h4 {
    color: #4FBA6F;
    margin: 3px 0;
    font-weight: 200;
}

#tips-tricks #info #inner-info #panels > div#one h4:hover {
    color: #fff;
    cursor: pointer;
}

/* scenario tool */

#scenario #matrix #y_axis #positions {
    top: 0;
}

#scenario #matrix #y_axis #positions li.inactive {
    cursor: default;
    background-color: rgba(212, 212, 212, 1);

}

#matrix #y_axis #positions li.inactive > a {
    cursor: default;
}

#scenario #matrix #x_axis #results {
    width: 98%;
    left: 10px;
    position: relative;
    top: 12px;
}

#scenario #matrix #x_axis #scenario-result .quote-info {
    background-color: #edf0f1;
    padding: 5px;
    margin-bottom: 5px;
    text-align: center;
}

#scenario #matrix #x_axis #scenario-result .quote-info .upper > div {
    display: inline-block;
    width: 29%;
    height: 100px;
    border: 1px solid #d4d4d4;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background-color: #DFDFDF;
    vertical-align: bottom;
    position: relative;
}

#scenario #matrix #x_axis #scenario-result .quote-info .upper > div#position-info {
    width: 40%;
}

#scenario #matrix #x_axis #scenario-result .quote-info p {

    margin: 3px;

}

#scenario #matrix #x_axis #scenario-result .quote-info .chain-popup {
    display: inline-block;
    left: 0;
    top: -1px;
    height: 18px;
    width: 18px;
}

#scenario #matrix #x_axis #scenario-result .quote-info a {
    vertical-align: middle;
}

#scenario #matrix #x_axis #scenario-result {
    left: 0;
    position: relative;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 10;
    display: none;
}

#scenario #matrix #x_axis #scenario-result #tabs {
    height: 45px;
    border: 1px solid #283d4f;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background: #F1F1F2;

}

#scenario #matrix #x_axis #scenario-result #tabs > ul {
    background-color: #22bcb1;
    height: 45px;
    left: 0;
    list-style: none outside none;
    width: 100%;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

#scenario #matrix #x_axis #scenario-result #tabs > ul li {
    border: medium none;
    float: left;
    font-size: 0.85em;
    font-weight: 100;
    height: 100%;
}

#scenario #matrix #x_axis #scenario-result #tabs ul li.ui-state-default {
    background: none;

}

#scenario #matrix #x_axis #scenario-result #tabs ul li.ui-state-active a {

    color: #6FE670;
}

#scenario #matrix #x_axis #scenario-result #tabs ul li.ui-state-active {
    background: #536472;

}

#scenario #matrix #x_axis #scenario-result #tabs ul li a {
    color: #fff;
    display: inline-block;
    height: 45px;
    line-height: 3.8em;
    text-align: left;
    width: 100%;
    padding: 0 5px;
}

#scenario #matrix #x_axis #scenario-result #tabs ul li a:hover {
    color: #6FE670;
    background-color: transparent;
}

#scenario #matrix #x_axis #scenario-result .dataTables_wrapper {
    border-right: 1px solid #000;
    border-left: 1px solid #000;
    border-bottom: 1px solid #000;

}

#scenario #matrix #x_axis #scenario-result #datatable {
    width: 100%;
    display: table;
    margin-bottom: 20px;
}

#scenario #matrix #x_axis #scenario-result #datatable tbody {
    float: left;
    width: 99.7%;
    position: relative;
    left: 1px;
    outline: 1px solid #333;
    min-height: 252px;
}

#scenario #matrix #x_axis #scenario-result #datatable tbody td {
    font-size: 1.3em;
}

#scenario #matrix #x_axis #scenario-result #datatable thead {
    background-color: #283d4f;
    color: #fff;
    float: left;
    width: 100%;
}

#scenario #matrix #x_axis #scenario-result #datatable th {
    cursor: pointer;
    height: 40px;
    font-weight: 100;
    text-align: center;
    width: 141px;
    line-height: 3em;
    background: url("../images/updown.png") no-repeat 112px center;
}

#scenario #matrix #x_axis #scenario-result #datatable th:hover {
    color: #22BCA5;
}

#scenario #matrix #x_axis #scenario-result #datatable tbody td {
    padding: 9px 10px;
    text-align: center;
    cursor: pointer;
    background-position: center 5px;
    width: 121px;
}

#scenario #matrix #x_axis #scenario-result #datatable tbody tr.itm {
    background-color: #DFF2F7;
}

#scenario #matrix #x_axis #scenario-result #datatable tbody tr.itm-dark {
    background-color: #edf8fb;
}

#scenario #matrix #x_axis #scenario-result #datatable tbody tr.obl-strike-active {
    outline: 1px dashed #7D9F00;
    background-color: rgba(125, 159, 0, 0.3);
}

#scenario #matrix #x_axis #scenario-result #datatable tbody tr.obl-strike-inactive {
    outline: 1px dashed #801A1D;
    background-color: rgba(128, 26, 29, 0.3);
}

#scenario #matrix #x_axis #scenario-result #datatable tbody td.strike {
    color: #22bcb1;
    font-weight: 500;
}

#scenario #matrix #x_axis #scenario-result #datatable tfoot {
    background-color: #283d4f;
    color: #fff;
    float: left;
    width: 100%;
    height: 30px;
}

#scenario #matrix #x_axis .result.watermark {
    z-index: 11;
    display: block;
}

#scenario #matrix #x_axis .upper span {
    margin-left: 5px;
}

#scenario #matrix #x_axis .upper #days-obl span {
    min-width: 14px;
    min-height: 14px;
    display: inline-block;
}

#scenario #matrix #x_axis .upper span#btc_bid {
    position: absolute;
    left: 5px;
}

#scenario #matrix #x_axis .upper span#btc_ask {
    position: absolute;
    right: 5px;
}

#scenario #matrix #x_axis .upper #scenario-stock-price span:last-child {
    padding-left: 18px;
    background-position: -1px 2px;
    background-size: 22%;
}

#scenario #matrix #x_axis .upper .sanity.cross {
    background: url("../images/cross-five.svg") no-repeat scroll 115px 0px / 17px auto;
    padding-right: 60px;
}

#scenario #matrix #x_axis .upper .sanity.tick {
    background: url("../images/tick-two.svg") no-repeat scroll 115px 0px / 17px auto;
    padding-right: 60px;

}

#scenario #matrix #x_axis #results .table .main {
    clear: both;
    border-left: 1px solid #283d4f;
    border-right: 1px solid #283d4f;
    min-height: 429px;
    background-color: #E4E8EA;
}

#scenario #matrix #x_axis #results .watermark.table .main {
    background: url("../images/tc-logo-gray-medium.png") no-repeat center;
    background-size: 30%;
    opacity: 0.4;
}

#scenario #matrix #x_axis #results .watermark.table .main p#spinner {
    position: relative;
    margin: 0 auto;
    top: 186px;
    opacity: 1;
    width: 70px;
    height: 70px;
}

#scenario #matrix #x_axis #results .watermark.table .main p#help-text {
    position: relative;
    margin: 0 auto;
    top: 290px;
    opacity: 1;
    width: 300px;
    height: 70px;
    text-align: center;
}

#scenario #matrix #x_axis .head {
    width: 100%;
    height: 30px;
    background-color: #283d4f;
    line-height: 2em;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    position: relative;
    z-index: 20;
}

#scenario #matrix #x_axis .footer {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top: 1px solid #AFAFB1;
    height: 30px;
    line-height: 2em;
    width: 100%;
    clear: both;
    background-color: #283d4f;
}

#scenario .upper .sanity {

}

#scenario .upper .sanity.inline {
    display: inline-block;
}

#scenario #matrix #x_axis .upper #scenario-obl-strike span,
#scenario #matrix #x_axis .upper #scenario-break-even span,
#scenario #matrix #x_axis .upper #scenario-purchase-price span {
    color: #22beb3;
}

#scenario .upper span.days-green {
    color: #74BF4E !important;
}

#scenario .upper span.days-orange {
    color: #f68d2e !important;
}

#scenario .upper span.days-none {
    color: #5ca49f !important;
}

#scenario .upper span.days-red {
    color: #931a1d !important;
}

#scenario .upper span.days-blue {
    color: #80CCF3 !important;
}

#scenario .upper .check-holder .check label {
    font-size: 0;
}

#scenario .check-holder .check div {
    top: -18px;
}

#scenario .upper .slider-holder {
    outline: 1px solid #d4d4d4;
    position: absolute;
    left: 4px;
    bottom: -4px;
    width: 94%;
    height: 40px;
    padding: 4px;
    margin: 7px 0;
    text-align: center;
    font-size: 0.9em;
}

#scenario .upper .ui-slider {
    top: 8px;
    height: 7px;
    left: 5px;
    width: 96%;
    position: relative;
}

#scenario .upper .ui-slider .ui-widget-header {
    min-height: 0;
    height: inherit;
    background-color: #5fe8ff;
    opacity: 0.8;
}

#scenario #matrix #x_axis .upper .ui-slider span.ui-slider-handle {
    position: absolute;
    margin-left: -0.6em;
    padding-left: 0;
    top: -5px;
    width: 15px;
    height: 15px;
    background-color: #5fe8ff;
    border-radius: 15px;
    cursor: pointer;
    background-image: -moz-linear-gradient(top, #149bdf, #5fe8ff);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#149bdf), to(#5fe8ff));
    background-image: -webkit-linear-gradient(top, #149bdf, #5fe8ff);
    background-image: -o-linear-gradient(top, #149bdf, #5fe8ff);
    background-image: linear-gradient(to bottom, #149bdf, #5fe8ff);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff149bdf', endColorstr='#ff0480be', GradientType=0);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    opacity: 0.8;
    border: 0px solid transparent;
}

#scenario .upper .slider-holder #btc-slider:before,
#scenario .upper .slider-holder #sto-slider:before {
    color: #8a8b8d;
    content: "Bid";
    left: 0;
    position: absolute;
    top: -26px;
}

#scenario .upper .slider-holder #btc-slider:after,
#scenario .upper .slider-holder #sto-slider:after {
    color: #8a8b8d;
    content: "Ask";
    right: 0;
    position: absolute;
    top: -26px;
}

/* stock analysis */

#stock-analysis .upper,
#stock-analysis .lower {
    margin: 15px;
}

#stock-analysis #earnings-beats,
#stock-analysis #pe,
#stock-analysis #shorting,
#stock-analysis #analyst-trends,
#stock-analysis #om {
    margin-bottom: 10px;
    clear: both;
}

#stock-analysis #same-ind {
    margin-bottom: 10px;
    float: left;
}

#stock-analysis h4 {
    height: 43px;
    background-color: #5ca49f;
    color: #fff;
    text-align: center;
    font-size: 1.4em;
    line-height: 2em;
    clear: both;
}

#stock-analysis #info {
    color: #fff;
    text-align: center;
    font-size: 2em;
    line-height: 2em;
    background-color: #333;
    position: relative;
    display: block;
    margin-bottom: 10px;
}

#stock-analysis #info span:nth-of-type(1) {
    color: #22BEB3;
}

#stock-analysis #stock-lab-header {
    color: #fff;
    text-align: center;
    font-size: 1.4em;
    line-height: 2em;
    background-color: #333;
    padding: 10px;
    position: relative;
    display: block;
}

#stock-analysis #stock-lab-header #stock-change.change,
#stock-analysis #stock-lab-header #stock-change-percent.change,
#stock-analysis #stock-lab-header #sector-performance.change {
    background-position: -1px 3px;

}

#stock-analysis #stock-lab-header #chain {
    background-color: #ff780b;
    border: 2px solid #fff;
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
    color: #fff;
    z-index: 999;
    text-align: center;
    padding: 5px;
    line-height: 1em;
    font-size: 0.7em;
}

#stock-analysis #stock-lab-header #chain:hover {
    background-color: #fff;
    color: #ff780b;
}

#stock-analysis #stock-lab-header #chart {
    background-color: #edc71c;
    border: 2px solid #fff;
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
    color: #fff;
    z-index: 999;
    text-align: center;
    padding: 5px;
    line-height: 1em;
    font-size: 0.7em;
}

#stock-analysis #stock-lab-header #chart:hover {
    background-color: #fff;
    color: #edc71c;
}

#stock-analysis #info #bg {
    background: url(../images/lab-white.svg) no-repeat center;
    background-size: 100%;
    background-position: center top;
    display: inline-block;
    width: 10%;
    height: 100px;
    position: absolute;
    top: 8px;
    left: 35px;
}
#stock-analysis #info #stock-logos{
    position: absolute;
    right: 10px;
    top: 11px;

}
#stock-analysis #info #stock-logos img{
    width: 90px;
    height: 90px;

}

#stock-analysis #info #save-stock {
    font-size: 0.7em;
}

#stock-analysis #info #save-stock > div {
    display: inline-block;
}

#stock-analysis #info #save-stock > div .add {
    background-color: #27e1b0;
    color: #fff;
    padding: 4px;
    border-radius: 2px;
    cursor: pointer;
    border: 2px solid #fff;
}

#stock-analysis #info #save-stock > div .add:hover {
    background-color: #fff;
    color: #27e1b0;
    border: 2px solid #27e1b0;
}

#stock-analysis #stock-lab-header #dates {
    display: inline-block;
    font-size: 0.8em;
    line-height: 1.4em;
    width: 18%;
}

#stock-analysis #stock-lab-header #general {
    display: inline-block;
    width: 80%;
    vertical-align: top;
    font-size: 1.5em;
    line-height: 1.8em;
    margin-top: 10px;

}

#stock-analysis #stock-lab-header #gauges {
    height: 136px;
    width: 100%;
    margin: 15px 0 40px 0;
    text-align: center;
    border-top: 1px solid #fff;
}

#stock-analysis #stock-lab-header #gauges > div {
    display: inline-block;
    width: 30%;
}

#stock-analysis #stock-lab-header .gauge-header {
    position: relative;
    left: 70px;
}

#stock-analysis #stock-lab-header #dates .date {
    padding: 5px;
}

#stock-analysis #stock-lab-header #dates .days-green {
    background-color: #74BF4E;
}

#stock-analysis #stock-lab-header #dates .days-blue {
    background-color: #80CCF3
}

#stock-analysis #stock-lab-header #dates .days-orange {
    background-color: #f68d2e;
}

#stock-analysis #stock-lab-header #dates .days-red {
    background-color: red;
}

#stock-analysis #stock-lab-header #dates .days-none {
    background-color: #C9D6D6;
}

#stock-analysis #lower-container .change {
    padding-left: 23px;
    background-position: -1px 5px;
    font-size: 0.7em;
    vertical-align: top;

}

#stock-analysis #stock-lab-header #description {
    background-color: #edf0f1;
    font-size: 0.8em;
    line-height: 1.3em;
    color: #000;
    padding: 5px;
    text-align: left;
    margin-top: 10px;
    width: 99%;
}

#stock-analysis .upper #lab-welcome {
    background-color: #edf0f1;
    padding: 10px;
    margin: 10px 0;
}

#stock-analysis .graph-container {
    padding-left: 0px;
    margin: 20px 0;
    background-color: transparent !important;

}

#stock-analysis .lower .description {
    padding: 10px;
    background-color: #edf0f1;
    clear: both;
}

#stock-analysis .lower .earnings-date {
    padding: 10px;
    background-color: #85BFD7;
    color: #fff;
    font-size: 1.5em;
    margin-top: 10px;
    text-align: center;
}

#stock-analysis .lower #ind-stocks-table {
    background-color: #edf0f1;
    float: left;
    width: 100%;
}

#stock-analysis .lower .ind-stock {
    float: left;
    width: 21.7%;
    color: #fff;
    text-align: center;
    line-height: 1.4em;
    background-color: #333;
    padding: 10px;
    margin: 5px;
    position: relative;
}

#stock-analysis .lower .ind-stock span:nth-of-type(5) {
    padding-right: 30px;
    background-position: 35px center;
}

#stock-analysis .lower .ind-stock .rankings {
    display: table;
    width: 100%;
    margin-top: 5px;
}

#stock-analysis .lower .ind-stock .rankings > div {
    display: table-cell;
    width: 50%;
}

#stock-analysis .lower .ind-stock .rankings .header {
    color: #22BEB3;
}

#stock-analysis .lower .ind-stock .rankings .value {
    color: #fff;
    height: 30px;
    line-height: 2em;
    margin-top: 2px;
}

#stock-analysis .lower .description h5 {
    margin-bottom: 10px;
}

#stock-analysis .lower #pagination {
    margin-bottom: 15px;
    clear: both;
    position: relative;
    top: 10px;
}

#stock-analysis .graph-title {
    margin: 10px 0;
    background-color: #333;
    padding: 5px;
    color: #fff;
    text-align: center;
}

#stock-analysis .indicator-diagrams {
    width: 100%;
    height: 100px;
    margin-top: 20px;
    clear: both;
}

#stock-analysis .indicator-diagrams .diagram-header {
    color: #fff;
    background-color: #333;
    padding: 5px;
    text-align: center;
}

#stock-analysis .indicator-diagrams .info {
    text-align: center;
    font-size: 3em;
    vertical-align: middle;
    background-position: 95% 9px;
    height: 100%;
    padding: 5px;
    background-size: 7% auto;
    line-height: 1.3em;
    font-weight: 200;
}

#stock-analysis #earnings-beats .indicator-diagrams .info {
    background-size: 17%;
}

#stock-analysis .indicator-diagrams .info span.small {
    text-align: center;
    font-size: 0.3em;
    vertical-align: middle;
    height: 100%;
}

#stock-analysis .indicator-diagrams > div {
    background-color: #edf0f1;
    float: left;
    width: 32.6%;
    height: 100%;
    position: relative;

}

#stock-analysis .indicator-diagrams > div.small {
    width: 24.2%;
    font-size: 1em;
    font-weight: 200;

}

#stock-analysis .indicator-diagrams > div .rank-indicator {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 63%;

}

#stock-analysis .indicator-diagrams > div .rank-indicator .value {
    float: left;
    width: 50%;
    height: 72%;
    font-size: 1.7em;
    line-height: 2.7em;
    text-align: center;

}

#stock-analysis .indicator-diagrams > div .rank-indicator .desc {
    float: left;
    width: 50%;
    height: 72%;
    font-size: 1.1em;
    line-height: 4.5em;
    text-align: center;
    color: #fff;
    background-image: none;

}

#stock-analysis .indicator-diagrams .floating {
    float: left;
    width: 48.4%;
    height: 72%;
    text-align: center;
    background-image: none;

}
#stock-analysis .indicator-diagrams .desc.floating {

    font-size: 1.1em;
    line-height: 4.5em;
    text-align: center;
    color: #fff;
    background-image: none;

}
#stock-analysis .indicator-diagrams > div .rank-indicator .desc.elevated,
#stock-analysis .indicator-diagrams .desc.bearish,
#stock-analysis .lower .ind-stock .rankings .value.elevated,
#stock-analysis .lower .ind-stock .rankings .value.bearish,
#stock-analysis .lower .desc.poor,
#stock-analysis .lower #pe_gauge .rank-indicator .desc.expensive,
#stock-analysis .lower #rs_gauge .rank-indicator .desc.weak,
#scanner #matrix #x_axis #results .table .main .cell .value.weak,
#scanner #matrix #x_axis #results .table .main .cell .value.elevated,
#scanner #matrix #x_axis #results .table .main .cell .value.bearish {
    background-color: #801a1d;
}

#stock-analysis .indicator-diagrams .desc.bullish,
#stock-analysis .indicator-diagrams > div .rank-indicator .desc.low,
#stock-analysis .lower .ind-stock .rankings .value.bullish,
#stock-analysis .lower .desc.excellent,
#stock-analysis .lower #pe_gauge .rank-indicator .desc.cheap,
#stock-analysis .lower #rs_gauge .rank-indicator .desc.strong,
#scanner #matrix #x_axis #results .table .main .cell .value.strong,
#scanner #matrix #x_axis #results .table .main .cell .value.bullish,
#scanner #matrix #x_axis #results .table .main .cell .value.low {
    background-color: green;
    background-image: none;
}

#stock-analysis .lower .ind-stock .rankings .value.moderate,
#stock-analysis .indicator-diagrams > div .rank-indicator .desc.moderate,
#stock-analysis .lower .desc.good,
#stock-analysis .lower #pe_gauge .rank-indicator .desc.fair,
#scanner #matrix #x_axis #results .table .main .cell .value.fair,
#stock-analysis .lower #rs_gauge .rank-indicator .desc.average,
#scanner #matrix #x_axis #results .table .main .cell .value.moderate {
    background-color: #edc71c
}

#stock-analysis .indicator-diagrams > div .rank-indicator .desc.subdued,
#stock-analysis .indicator-diagrams .desc.neutral,
#stock-analysis .lower .ind-stock .rankings .value.subdued,
#stock-analysis .lower .ind-stock .rankings .value.neutral,
#scanner #matrix #x_axis #results .table .main .cell .value.subdued,
#scanner #matrix #x_axis #results .table .main .cell .value.neutral {
    background-color: #84bfda;
}

#stock-analysis .indicator-diagrams #rsi_gauge {
    background-color: transparent;
    float: left;
    width: 40%;
    height: 100px;

}

#stock-analysis .indicator-diagrams #rsi_gauge #gauge {
    width: 37%;
    height: 100px;
    float: left;

}

#stock-analysis .indicator-diagrams #rsi_gauge span {
    text-transform: capitalize;
    font-size: 2em;
    position: relative;
    right: 8%;
    bottom: 10px;
    line-height: 4em;

}

#stock-analysis .indicator-diagrams #rsi_gauge span.overbought {
    color: #801a1d;

}

#stock-analysis .indicator-diagrams #rsi_gauge span.mild-overbought {
    color: #ff780b;

}

#stock-analysis .indicator-diagrams #rsi_gauge span.mild-oversold {
    color: #ff780b;

}

#stock-analysis .indicator-diagrams #rsi_gauge span.oversold {
    color: #5ca49f;

}

#stock-analysis .indicator-diagrams #rsi_gauge span.ok {
    color: green;

}

#stock-analysis .indicator-diagrams > div:nth-child(2) {
    margin: 0 1%;
}

#stock-analysis .indicator-diagrams > div.small:nth-child(4) {
    margin: 0 0 0 1%;
}

#stock-analysis #dcf .analysis {
    margin-top: 20px;
    margin-bottom: 20px;
    clear: both;
    background-color: #edf0f1;
    padding: 10px;
    float: left;
    width: 98%;
}

#stock-analysis #dcf .analysis #dcf-table {
    float: left;
    width: 55%;
    font-size: 1.3em;
}

#stock-analysis #dcf .analysis #dcf-table .green-value {
    color: green;
}

#stock-analysis #dcf .analysis #dcf-table .red-value {
    color: red;
}

#stock-analysis #dcf .analysis #dcf-value {
    float: left;
    width: 45%;
}

#stock-analysis #dcf .analysis #dcf-value .slider-holder {
    margin-top: 20px;
}

#stock-analysis #dcf .analysis #dcf-value #mos-slider {
    width: 90%;
    margin-top: 20px;
    margin-bottom: 20px;
}

#stock-analysis #dcf .analysis #dcf-value #mos-value, #stock-analysis #dcf .analysis #dcf-value #mos-stock-price {
    font-size: 1.5em;
    vertical-align: top;
    padding-left: 5px;
}

#stock-analysis #dcf .analysis .dataframe td {
    padding: 5px;
}

#stock-analysis #dcf .analysis .dataframe th {
    background-color: #fff;
    padding: 5px;
}

#stock-analysis #analyst-trends .analyst-rating {
    float: left;
    width: 75%;
}

#stock-analysis #analyst-trends .analyst-value {
    width: 25%;
    height: 100px;
    font-size: 2em;
    float: left;
    line-height: 4.2em;
    text-align: center;
}

#stock-analysis #analyst-trends .analyst-rating .bg-hold {
    background-color: #007bff;
}

#stock-analysis #analyst-trends .broker-rating-bar {
    height: 20px;
    position: relative;
}

#stock-analysis #analyst-trends .rating-numbers {
    width: 100%;
    height: 30px;
    margin-top: 20px;
    text-align: center;
}

#stock-analysis #analyst-trends .rating-numbers > div {
    float: left;
    width: 24.8%;
    height: 100%;
    position: relative;
    top: -4px;
    text-align: right;
}

#stock-analysis #analyst-trends .rating-numbers > div .border-right {
    border-right: 1px solid;
}

#stock-analysis #analyst-trends .rating-numbers > div span {
    border-radius: 50%;
    border: 1px solid #d4d4d4;
    height: 100%;
    width: 17%;
    color: #fff;
    text-align: center;
    line-height: 1.5em;
    font-size: 1.3em;
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
}

#stock-analysis #analyst-trends .rating-numbers .one span {
    background-color: #28a745;
}

#stock-analysis #analyst-trends .rating-numbers .two span {
    background-color: #17a2b8;
}

#stock-analysis #analyst-trends .rating-numbers .three span {
    background-color: #007bff;
}

#stock-analysis #analyst-trends .rating-numbers .four span {
    background-color: #ffc107;
}

#stock-analysis #analyst-trends .rating-numbers .four:before {
    border-radius: 50%;
    border: 1px solid #d4d4d4;
    height: 100%;
    width: 17%;
    color: #fff;
    text-align: center;
    line-height: 1.5em;
    font-size: 1.3em;
    position: absolute;
    top: 0;
    content: "4";
    right: 0;
    background-color: #ffc107;
}

#stock-analysis #analyst-trends .rating-numbers .four:after {
    border-radius: 50%;
    border: 1px solid #d4d4d4;
    height: 100%;
    width: 17%;
    color: #fff;
    text-align: center;
    line-height: 1.5em;
    font-size: 1.3em;
    position: absolute;
    top: 0;
    content: "5";
    left: 0;
    background-color: #dc3545;
}

#stock-analysis #analyst-trends .rating-numbers .four-bottom:before {
    position: absolute;
    top: 0;
    content: "Underperform";
    right: -30px;

}

#stock-analysis #analyst-trends .rating-numbers .four-bottom:after {
    position: absolute;
    top: 0;
    content: "Sell";
    left: 0;
}

/* broker services */
#broker-services {
    background-color: #edf0f1;
}

#broker-services .service-issue {
    margin: 20px;

}

#broker-services .service-issue h4 {
    background-color: #35D7D2;
    color: #333;
}

#broker-services .service-issue p {
    color: #000;
    margin: 20px;

}

#broker-services #broker-data {

    background-color: #fff;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    min-height: 515px;
    border: 2px solid #283D4F;
    margin: 20px;

}

#broker-services .upper,
#broker-services .lower {
    margin: 15px;
}

#broker-services .upper h4 {
    height: 43px;
    background-color: #5ca49f;
    color: #fff;
    text-align: center;
    font-size: 1.4em;
    line-height: 2em;
}

#broker-services #services-header {
    color: #fff;
    text-align: center;
    font-size: 1.4em;
    line-height: 2em;
    background-color: #333;
    padding: 10px;
    position: relative;
}

#broker-services #services-header #bg {
    background: url("../images/dashboard.svg") no-repeat center;
    background-size: 100%;
    background-position: center top;
    position: absolute;
    display: inline-block;
    width: 100px;
    height: 100px;
    top: 10px;
    left: 10px;
}

#broker-services #services-header .select-theme {
    overflow: hidden;
    border-radius: 6px;
    background: url("../images/updown.svg") no-repeat;
    background-position: 98% center;
    background-size: 14px 17px;
    background-color: #fff;
    cursor: pointer;
    display: inline-block;
    height: 30px;
    width: 20%;
    position: relative;
    top: 7px;
}

#broker-services #services-header .select-theme:hover {
    cursor: pointer;
}

#broker-services #services-header select {
    background: transparent;
    -webkit-appearance: none;
    padding-left: 5px;
    vertical-align: top;
    height: 30px;
    width: 320px;
}

#broker-services #services-header span {
    color: #22BEB3;
}

#broker-services #services-header a.refresh {
    display: inline-block;
    height: 50px;
    width: 50px;
    top: 15px;
    right: 15px;
    position: absolute;
    background: url("../images/refresh-one.svg") no-repeat;
    background-position: bottom center;
    background-size: cover;
    cursor: pointer;

}

#broker-services #services-header a.refresh:hover {
    background-position: bottom center;

}

#broker-services #services-header a.extend {
    display: inline-block;
    height: 50px;
    width: 50px;
    top: 15px;
    right: 90px;
    position: absolute;
    background: url("../images/clock.svg") no-repeat;
    background-position: bottom center;
    background-size: cover;
    cursor: pointer;

}

#broker-services #services-header a.extend:hover {
    background-position: bottom center;

}

#broker-services #services-header #description {
    background-color: #edf0f1;
    font-size: 0.8em;
    line-height: 1.3em;
    color: #000;
    padding: 5px;
    text-align: left;
    margin-top: 30px;
}

#broker-services #services-header .account-info {
    display: none;

}

#broker-services #services-header .account-info span:nth-child(3) {
    padding-right: 50px;
    background-position: 100px center;
    color: #fff;
}

#broker-services .lower .results-none {
    color: #000;
    height: 100%;
    position: absolute;
    top: 50%;
    margin: 0 auto;
    width: 100%;

}

#broker-services .lower > div {
    margin: 10px 0;
    background-color: rgba(92, 163, 158, 0.56);
    color: #fff;
    text-align: center;
    font-size: 1.4em;
    line-height: 2em;
    position: relative;
    clear: both;
    float: left;
    width: 100%;

}

#broker-services .lower > div a.refresh {
    display: inline-block;
    height: 30px;
    width: 30px;
    top: 5px;
    right: 10px;
    position: absolute;
    background: url("../images/refresh-one.svg") no-repeat;
    background-position: bottom center;
    background-size: cover;
    cursor: pointer;

}

#broker-services .lower > div a.refresh:hover {
    background-position: top center;

}

#broker-services .lower > div h4 {
    font-weight: 400;
    color: #000;

}

#broker-services .lower > div h4 > span.order-number {
    border: 5px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    color: #000;
    display: inline-block;
    vertical-align: middle;
    line-height: 1.5em;
    margin: 5px;

}

#broker-services .lower > div > .results {
    display: table;
    background-color: #edf0f1;
    width: 100%;
}

#broker-services .lower > div .results .ajax-results {
    display: table-cell;
    width: 80%;
    vertical-align: top;

}

#broker-services .lower > div .results .tips {
    display: table-cell;
    width: 20%;
    background-color: #000;
    color: #fff;
    vertical-align: top;

}

#broker-services .lower > div .results .tips h4 {
    color: #ff780b;
    font-size: 0.9em;
    line-height: 1.4em;
    margin: 5px;

}

#broker-services .lower > div .results .tips div {
    font-size: 0.7em;
    line-height: 1.6em;
    margin: 5px 5px 30px 5px;
    position: relative;

}

#broker-services .lower > div .results .tips .legend > div {
    font-size: 1em;
    text-align: left;
    margin-bottom: 5px;
    display: table;

}

#broker-services .lower > div .results .tips .legend > div > div {
    display: table-cell;

}

#broker-services .lower > div .results .tips .legend > div > div:last-child {
    vertical-align: middle;
    padding-left: 10px;
    font-size: 0.9em;

}

#broker-services .lower > div .results .tips .legend .bg-legend {
    border: 5px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    color: #fff;
    vertical-align: middle;
    line-height: 1.2em;
    margin: 5px;
    font-size: 1.5em;
    text-align: center;
}

#broker-services .lower > div .results .pending .color {
    background-color: #EC9F05 !important;
}

#broker-services .lower > div .results .open .color {
    background-color: #fff !important;
}

#broker-services .lower > div .results .filled .color {
    background-color: #8EA604 !important;
}

#broker-services .lower > div .results .part_filled .color {
    background-color: #F5BB00 !important;
}

#broker-services .lower > div .results .rejected .color {
    background-color: #BF3100 !important;
}

#broker-services .lower > div .results .canceled .color {
    background-color: #00A9B8 !important;
}

#broker-services .lower > div .results .not-found .color {
    background-color: #2DE0EB !important;
}

#broker-services .lower > div .results .pending_cancel .color {
    background-color: #D76A03 !important;
}

#broker-services .lower > div .results .expired .color,
#broker-services .lower > div .results .option-exp .color {
    background-color: #B5F0F2 !important;
}

#broker-services .lower > div .results .option .color {
    background-color: #ff780b !important;
}

#broker-services .lower > div .results .stock .color {
    background-color: #35D7CD !important;
}

#broker-services .lower > div .results .trade .color {
    background-color: #FDEB6C !important;
}

#broker-services .lower > div .results .dividend .color,
#broker-services .lower > div .results .divadj .color,
#broker-services .lower > div .results .divpay .color {
    background-color: #3AB795 !important;
}

#broker-services .lower > div .results .fee .color {
    background-color: #FDEB6C !important;
}

#broker-services .lower > div .results .interest .color {
    background-color: #9AC4F8 !important;
}

#broker-services .lower > div .results .reinvestment .color {
    background-color: #FFD9DA !important;
}

#broker-services .lower > div .results .transfer .color {
    background-color: #ADEDE2 !important;
}

#broker-services .lower > div .results .journal .color {
    background-color: #BCF3FF !important;
}

#broker-services .lower > div .results .corp_action .color {
    background-color: #BFCCFC !important;
}

#broker-services .lower > div .results .conversion .color {
    background-color: #B788E2 !important;
}

#broker-services .lower > div .results .withdrawal .color {
    background-color: green !important;
}

#broker-services .lower > div .results .unknown .color,
#broker-services .lower > div .results .mmt .color,
#broker-services .lower > div .results .adjustments .color,
#broker-services .lower > div .results .movements .color,
#broker-services .lower > div .results .cshgen .color,
#broker-services .lower > div .results .dri .color,
#broker-services .lower > div .results .cri .color,
#broker-services .lower > div .results .actmvd .color {
    background-color: #CE4BD1 !important;
}

#broker-services .lower #balance .ajax-results > div > div {
    float: left;
    width: 47%;
    margin: 1%;

}

#broker-services .lower .ajax-results > div > div > div {
    background-color: #fff;

}

/*broker balance */
#broker-services .lower #balance .ajax-results h4 {
    background-color: #35D7D2;
    color: #333;

}

#broker-services .lower #balance .ajax-results > div > div > div {
    font-size: 1.5em;
}

/* broker orders */

#broker-services .lower #orders .ajax-results .orders {
    line-height: 1.5em;
    width: 97%;

}

#broker-services .lower #orders .ajax-results .order {
    display: table;
    width: 100%;
    margin-bottom: 20px;

}

#broker-services .lower #orders .ajax-results .order .order-row {
    display: table-row;
    width: 100%;
}

#broker-services .lower #orders .ajax-results .order-info {
    display: table-cell;
    width: 30%;
    background-color: #777;
    position: relative;
    vertical-align: top;

}

#broker-services .lower #orders .ajax-results .order-info .cancel-order {
    display: inline-block;
    position: absolute;
    top: 10px;
    left: 10px;
    line-height: 1.8em;
    text-align: center;
    background-color: #00A9B8;
    color: #fff;
    text-decoration: none;
    border: 2px solid #fff;
    cursor: pointer;
    padding: 5px;
    font-size: 0.6em;

}

#broker-services .lower #orders .ajax-results .order-info .cancel-order:hover {
    background-color: #fff;
    color: #00A9B8;
    border: 2px solid #00A9B8;

}

#broker-services .lower #orders .ajax-results .order-info .change-order-button {
    display: inline-block;
    position: absolute;
    top: 10px;
    right: 10px;
    line-height: 1.8em;
    text-align: center;
    background-color: #7D9F00;
    color: #fff;
    text-decoration: none;
    border: 2px solid #fff;
    cursor: pointer;
    padding: 5px;
    font-size: 0.6em;
}

#broker-services .lower #orders .ajax-results .order-info .change-order-button:hover {
    background-color: #fff;
    color: #7D9F00;
    border: 2px solid #00A9B8;

}

#dialog-confirm-cancel #cancel-order-no {
    color: #ff780b;
}

#broker-services .dialog-info {
    padding: 35px;
    position: relative;
    top: 50px;

}

#broker-services .dialog-info.success {
    background: url("../images/tick-two.svg") no-repeat scroll 14px center / 80px auto;
    padding-left: 115px;

}

#broker-services .dialog-info.error {
    background: url("../images/cross-five.svg") no-repeat scroll 14px center / 80px auto;
    padding-left: 115px;

}

#broker-services .lower #orders .ajax-results .order-info > div {
    margin-bottom: 10px;

}

#broker-services .lower #orders .ajax-results .order-info > div > div {
    border: 1px solid #fff;
    background-color: #5cc09e;
    margin: 5px;

}

#broker-services .lower #orders .ajax-results .order-info .bg {
    background: url("../images/phone-order.svg") no-repeat center;
    background-size: cover;
    background-position: center top;
    position: relative;
    width: 60px;
    height: 60px;
    top: 10px;
    left: 40%;
    margin-bottom: 20px;
}

#broker-services .lower #orders .ajax-results .order-legs {
    display: table-cell;
    width: 70%;
    vertical-align: top;

}

#broker-services .lower #orders .ajax-results .order-legs .legs .leg {
    display: table;
    width: 97%;
    margin: 10px;

}

#broker-services .lower #orders .ajax-results .order-legs .legs .leg .leg-info {
    display: table-cell;
    width: 35%;
    background-color: #d4d4d4;
    position: relative;
    vertical-align: top;
    font-size: 0.8em;

}

#broker-services .lower #orders .ajax-results .change-order {
    vertical-align: top;
    background-color: #333;
    position: relative;
    top: -20px;
    display: none;
    font-size: 0.9em;

}

#broker-services .lower #orders .ajax-results .change-order .ticket-nodisplay {
    display: none;
}

#broker-services .lower #orders .ajax-results .change-order .trade-ticket {
    width: inherit;
    background-color: #333333;
    padding: 0;
    font-size: 0.8em;
    line-height: 1.3em;
    display: block;

}

#broker-services .lower #orders .ajax-results .change-order .trade-ticket h4 {
    color: #fff;
    font-weight: 200;

}

#broker-services .lower #orders .ajax-results .change-order .prices-refresh {
    display: inline-block;
}

#broker-services .lower #orders .ajax-results .change-order .place-order {
    background-color: #7D9F00;
    color: #fff;
    padding: 0;

}

#broker-services .lower #orders .ajax-results .change-order .place-order:hover {
    background-color: #fff;
    color: #7D9F00;
    border: 1px solid #7D9F00;
}

#broker-services .lower #orders .ajax-results .change-order form .trade-ticket-order {
    width: 33%;
}

#broker-services .lower #orders .ajax-results .change-order form .trade-ticket-market {
    width: 67%;
}

#broker-services .lower #orders .ajax-results .order .buy {
    border: 1px solid #fff;
    background-color: #801A1D;
    margin: 5px;
}

#broker-services .lower #orders .ajax-results .sell {
    border: 1px solid #fff;
    background-color: #7D9F00;
    margin: 5px;
}

#broker-services .lower #orders .ajax-results .symbol div {
    border: 1px solid #fff;
    background-color: #35D7D0;
    margin: 5px;
}

#broker-services .lower #orders .ajax-results .symbol div.option-info {
    background-color: #00A894;
}

#broker-services .lower #orders .ajax-results .orderedQuantity div {
    border: 1px solid #35D7D0;
    background-color: #fff;
    margin: 5px;
    color: #000;
}

#broker-services .lower #orders .ajax-results .legType {
    background-color: transparent;
}

#broker-services .lower #orders .ajax-results .leg-info .legType div {
    background-color: #5cc09e;
    margin: 5px;
    border: 1px solid #fff;
}

#broker-services .lower #orders .ajax-results .legType.even div {
    background-color: #ff780b !important;
}

#broker-services .lower #orders .ajax-results .legType.debit div {
    background-color: #801A19 !important;
}

#broker-services .lower #orders .ajax-results .legType.credit div {
    background-color: #7D9F00 !important;
}

#broker-services .lower #orders .ajax-results .legType.market div {
    background-color: #edc71c !important;
}

#broker-services .lower #orders .ajax-results .leg-info .bg {
    background: url("../images/leg.svg") no-repeat center;
    background-size: 50%;
    background-position: center top;
    position: relative;
    width: 66px;
    height: 46px;
    top: 10px;
    left: 33%;
    margin-bottom: 20px;
}

#broker-services .lower #orders .ajax-results .leg-info .parent-price-info {
    background-color: #fff;
    color: #000;
    border: 1px solid #d4d4d4;
    margin: 5px;
}

#broker-services .lower #orders .ajax-results .leg-info .price-info > div {
    font-size: 1.3em;
}

#broker-services .lower #orders .ajax-results .leg-info .price-info h4 {
    background-color: #000;
    color: #fff;
}

#broker-services .lower #orders .ajax-results .order-legs .leg-fills {
    display: table-cell;
    width: 65%;
    vertical-align: top;

}

#broker-services .lower #orders .ajax-results .order-legs .leg-fills .fill {
    margin: 10px;
    display: table;
    width: 94%;
    background-color: #f1f1f2;
    font-size: 0.9em;

}

#broker-services .lower #orders .ajax-results .order-legs .leg-fills .fill h4 {
    background-color: #000;
    color: #fff;

}

#broker-services .lower #orders .ajax-results .order-legs .leg-fills .fill > div {
    display: table-cell;
    width: 25%;
    vertical-align: top;

}

#broker-services .lower #orders .ajax-results .order-legs .leg-fills .fill > div > div {
    color: #000;
    line-height: 1.5em;

}

#broker-services .lower #orders .ajax-results .order-legs .leg-fills .fill > div:nth-child(2) > div,
#broker-services .lower #orders .ajax-results .order-legs .leg-fills .fill > div:nth-child(3) > div {
    font-size: 1.5em;

}

#broker-services .lower #orders .ajax-results .leg-fills .bg {
    background: url("../images/fill.svg") no-repeat center;
    background-size: 40%;
    background-position: center 13px;
    position: relative;
    top: 0;
    left: 0;
}

/* broker positions */

#broker-services .lower #positions .ajax-results #positions-detail {
    width: 100%;
    vertical-align: top;
    float: left;
    font-size: 0.9em;;

}

#broker-services .lower #positions .ajax-results > div > div > div {
    background-color: inherit;
}

#broker-services .lower #positions .ajax-results #positions-detail .position {
    float: left;
    width: 30.7%;
    vertical-align: top;
    margin: 1%;
    position: relative;
    background-color: #d4d4d4;

}

#broker-services .lower #positions .ajax-results .position .bg {
    border: 5px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    background-color: #35D7D2;
    color: #fff;
    display: inline-block;
    vertical-align: middle;
    line-height: 0.65em;
    margin: 5px;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 2em;
}

#broker-services .lower #positions .ajax-results .position .bg.option {
    background-color: #ff780b;
}

#broker-services .lower #positions .ajax-results .position div div {
    border: 2px solid #000;
    background-color: #fff;
    margin: 0.1em;
}

#broker-services .lower #positions .ajax-results .position div.value div {
    color: #000;
}

#broker-services .lower #positions .ajax-results .position .sell {
    border: 1px solid #fff;
    background-color: #7D9F00;
    margin: 5px;
    font-size: 1em;
}

#broker-services .lower #positions .ajax-results .position .buy {
    border: 1px solid #fff;
    background-color: #801A1D;
    margin: 5px;
    font-size: 1em;
}

#broker-services .lower #positions .ajax-results .position div.quantity div {
    border: 1px solid #fff;
    background-color: #5cc09e;
    margin: 5px;
    font-size: 1em;
}

#broker-services .lower #positions .ajax-results .position div.symbolClass div {
    border: 1px solid #fff;
    background-color: #5cc09e;
    margin: 5px;
    font-size: 1em;
}

#broker-services .lower #positions .ajax-results .position div.symbol div {
    background-color: transparent;
    color: #5cc09e;
    font-size: 1.7em;
    border: none;

}

#broker-services .lower #positions .ajax-results .position div.symbol div span {

    font-size: 1em;

}

/* broker transactions */

#broker-services .lower #transactions .ajax-results #transactions-detail {
    width: 100%;
    vertical-align: top;
    float: left;
    font-size: 0.9em;;

}

#broker-services .lower #transactions .ajax-results > div > div > div {
    background-color: inherit;
}

#broker-services .lower #transactions .ajax-results #transactions-detail .date {
    background-color: #d4d4d4;
    clear: both;
    width: 97%;

}

#broker-services .lower #transactions .ajax-results #transactions-detail .date span {
    border: 5px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    color: #000;
    display: inline-block;
    vertical-align: middle;
    line-height: 1.5em;
    margin: 5px;

}

#broker-services .lower #transactions .ajax-results #transactions-detail .transactions-date {
    float: left;
    width: 97%;
    clear: both;

}

#broker-services .lower #transactions .ajax-results #transactions-detail .transaction {
    float: left;
    width: 30.7%;
    vertical-align: top;
    margin: 1%;
    position: relative;
    background-color: #5cc09e;

}

#broker-services .lower #transactions .ajax-results #transactions-detail .bg {
    border: 5px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    color: #fff;
    display: inline-block;
    vertical-align: middle;
    line-height: 1.2em;
    margin: 5px;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 1.5em;
}

#broker-services .lower #transactions .ajax-results .transaction .sell {
    border: 1px solid #fff;
    background-color: #7D9F00;
    margin: 5px;
    font-size: 0.9em;
    color: #fff;
}

#broker-services .lower #transactions .ajax-results .transaction .buy {
    border: 1px solid #fff;
    background-color: #801A1D;
    margin: 5px;
    font-size: 0.9em;
    color: #fff;
}

#broker-services .lower #transactions .ajax-results .transaction .default {
    border: 2px solid #000;
    background-color: #d4d4d4;
    margin: 5px;
    font-size: 1em;
}

#broker-services .lower #transactions .ajax-results .transaction div div {
    border: 2px solid #000;
    background-color: #fff;
    margin: 5px;
}

#broker-services .lower #transactions .ajax-results .transaction div.symbol div {
    background-color: transparent;
    color: #fff;
    font-size: 2em;
    border: none;

}

#broker-services .lower #transactions .ajax-results .transaction div.quantity div {
    color: #000;
}

#broker-services .lower #transactions .ajax-results .transaction div.price div {
    color: #000;
}

#broker-services .lower #transactions .ajax-results .transaction div.description div {
    border: 2px solid #000;
    background-color: #fff;
    margin: 5px;
    font-size: 1em;
    color: #000;

}

#view-vol-surfaces {
    margin: 2em;
    line-height: 2em;
}

#view-vol-surfaces #blurb {
    background-color: #edf0f1;
    padding: 1em;
    margin-bottom: 1em;
}

#view-vol-surfaces #price {
    font-size: 2em;
    margin-bottom: 10px;
}

#view-vol-surfaces #price > span:first-child {
    color: #22BEB3;
}

#view-vol-surfaces #price > span:nth-child(3) {
    font-weight: 400;
}

#view-vol-surfaces #price > span:nth-child(4) {
    font-weight: 400;
}

#view-vol-surfaces #price > span:nth-child(5) {
    font-weight: 400;
    padding-left: 31px;
    background-position: -2px 4px;
    background-size: 22%;
}

/* portfolio opt */

#optimisation .upper {
    margin: 15px;
    background-color: #333;
    padding: 10px;
}

#optimisation .upper #info {
    font-size: 2em;
    position: relative;
    display: block;
    height: 110px;
    text-align: center;
    color: #fff;
}

#optimisation .upper #info span {
    top: 10px;
    position: relative;
}

#optimisation .upper #info #background {
    background: url(../images/lab-white.svg) no-repeat center;
    background-size: 100%;
    background-position: center top;
    display: inline-block;
    width: 10%;
    height: 100px;
    position: absolute;
    top: 8px;
    left: 35px;
}

#optimisation .upper #welcome {
    background-color: #edf0f1;
    padding: 10px;
    margin: 0 auto;
    width: 98%;
}

#optimisation .lower #inputs {
    background-color: #edf0f1;
    width: 97%;
    margin: 0 auto;
}

#optimisation .lower #inputs h5 {
    padding: 10px;
    text-align: center;
    background-color: #c8d6d6;
    position: relative;
}

#optimisation .lower #inputs > div {
    display: inline-block;
    width: 35%;
    padding: 10px;
    vertical-align: top;
    position: relative;
    top: 10px;
}

#optimisation .lower #inputs form {
    padding: 10px;
    display: inline-block;
    width: 60%;
}

#optimisation .lower #inputs form .header {
    padding: 10px 0;
}

#optimisation .lower #inputs form #include-only {
    margin-bottom: 6px;
}

#optimisation .lower #inputs form textarea {
    width: 80%;
    text-transform: uppercase;
    padding: 5px;
}

#optimisation .lower #inputs form input {
    background-color: #edc71c;
    border: 2px solid #fff;
    color: #fff;
    padding: 7px;
    cursor: pointer;
    text-transform: uppercase;
}

#optimisation .lower #inputs form input:hover {
    background-color: #fff;
    border: 2px solid #edc71c;
    color: #edc71c;

}

#optimisation .lower #inputs form input[type="text"] {
    width: 220px;
    background-color: #22beb3;
}
#optimisation .lower #inputs form input[type="text"]:hover {
    background-color: #fff;
    border: 2px solid #22beb3;
    color: #22beb3;
}
#optimisation #data .floating {

    width: 100%;
}

#optimisation #data .floating > div:first-child,
#sharpe-results {
    width: 60%;
    display: inline-block;
    position: relative;
    right: 70px;
    z-index: 1;
}

#optimisation #data .floating > div:last-child {
    width: 36%;
    display: inline-block;
    vertical-align: top;
    background-color: #edf0f1;
    position: relative;
    z-index: 2;
    left: 23px;
    margin-bottom: 10px;
    top: 60px;
}

#optimisation #data .floating > div:first-child.no-data {

    background: url(../images/tc-logo-gray-medium.png) no-repeat center;
    background-size: 60%;
    opacity: .4;
    height: 500px;
    vertical-align: baseline;
    right: 0;
    top: 100px;

}

#optimisation #data .floating h5 {
    padding: 10px;
    text-align: center;
    background-color: #C8D6D6;
    position: relative;
}

#optimisation #data .floating h5.low-vol {
    background-color: gray;
}

#optimisation #data .floating > div:last-child div {
    padding: 10px;
}

#optimisation #data #efficient.floating > div:first-child {
    right: 0px;

}

#optimisation #data #sharpe .sub {
    color: red
}

#optimisation #data #sharpe .good {
    color: orange;
}

#optimisation #data #sharpe .vgood {
    color: green;
}

#optimisation #data #sharpe .excellent {
    color: purple;
}

#optimisation #data #sharpe {
    margin-top: 60px;
}

#optimisation #data #sharpe.floating > div:first-child,
#sharpe-results {
    right: 0px;
    left: 10px;

}

#sharpe-results > div {
    line-height: 1.5em;
    padding: 10px 5px;

}

#optimisation #data #sharpe.floating > div:last-child {
    top: 0px;
}

#optimisation #data #sharpe .float {
    display: inline-block;
    width: 46%;
}

#optimisation #data #sharpe span {
    font-size: 2em;
}

.five-pointed-star {
    --star-color: red;
    font-size: 0.75em !important;
    position: absolute;
    display: block;
    width: 0px;
    height: 0px;
    border-right: 1em solid transparent;
    border-bottom: 0.7em solid var(--star-color);
    border-left: 1em solid transparent;
    transform: rotate(35deg);
    line-height: 1em;
    bottom: 14px;
}

.five-pointed-star:before {
    border-bottom: 0.8em solid var(--star-color);
    border-left: 0.3em solid transparent;
    border-right: 0.3em solid transparent;
    position: absolute;
    height: 0;
    width: 0;
    top: -0.45em;
    left: -0.65em;
    display: block;
    content: "";
    transform: rotate(-35deg);
}

.five-pointed-star:after {
    position: absolute;
    display: block;
    top: 0.03em;
    left: -1.05em;
    width: 0;
    height: 0;
    border-right: 1em solid transparent;
    border-bottom: 0.7em solid var(--star-color);
    border-left: 1em solid transparent;
    transform: rotate(-70deg);
    content: "";
}

.five-pointed-star-green {
    --star-color: green;
    font-size: 0.75em !important;
    position: absolute;
    display: block;
    width: 0px;
    height: 0px;
    border-right: 1em solid transparent;
    border-bottom: 0.7em solid var(--star-color);
    border-left: 1em solid transparent;
    transform: rotate(35deg);
    line-height: 1em;
    bottom: 14px;
}

.five-pointed-star-green:before {
    border-bottom: 0.8em solid var(--star-color);
    border-left: 0.3em solid transparent;
    border-right: 0.3em solid transparent;
    position: absolute;
    height: 0;
    width: 0;
    top: -0.45em;
    left: -0.65em;
    display: block;
    content: "";
    transform: rotate(-35deg);
}

.five-pointed-star-green:after {
    position: absolute;
    display: block;
    top: 0.03em;
    left: -1.05em;
    width: 0;
    height: 0;
    border-right: 1em solid transparent;
    border-bottom: 0.7em solid var(--star-color);
    border-left: 1em solid transparent;
    transform: rotate(-70deg);
    content: "";
}

.copy-position-form select{
    width: 50%;
    padding: 10px;
}
.payoff #blurb, .payoff #transient-blurb{
    padding: 15px;
}
.payoff .strategy{
    display: inline-block;
    vertical-align: middle;
    height: 40px;
    width: 40px;
}
.payoff #no-payoff{
    margin: 0 auto;
    width: 100%;
    background: url(../images/tc-logo-gray-medium.png)no-repeat center;
    background-size: 15%;
    height: 300px;
    text-align: center;
    line-height: 45em;
    position: relative;
    top: 200px;
}
.payoff #payoff-status{
    padding-left: 15px;
    font-size: 0.9em;
}