﻿.clearfix {
    display: inline-block;
}

.simulator-module .aa-simulator-holder {
    display: inline-block;
    width: calc(100% - 20px);
}

.simulator-module .aa-iglegend-holder,
.simulator-module .aa-clegend-holder {
    float: left;
    width: 35%;
    display: inline-block;
    text-align: center;
}

    .simulator-module .aa-iglegend-holder .aa-iglegend-title,
    .simulator-module .aa-clegend-holder .aa-clegend-title {
        float: none;
        display: block;
        min-height: 10px;
        font-size: 11px;
        line-height: 11px;
        overflow: hidden;
    }

    .simulator-module .aa-iglegend-holder .aa-iglegend-name,
    .simulator-module .aa-clegend-holder .aa-clegend-name {
        float: left;
        padding: 0 0 10px 22px;
    }

    .simulator-module .aa-iglegend-holder .aa-iglegend-percent,
    .simulator-module .aa-clegend-holder .aa-clegend-percent {
        float: right;
        padding: 0 5px 10px 0;
    }

    .simulator-module .aa-iglegend-holder ul,
    .simulator-module .aa-clegend-holder ul {
        text-transform: none;
        float: none;
        padding: 0;
    }

    .simulator-module .aa-iglegend-holder li,
    .simulator-module .aa-clegend-holder li {
        float: none;
        overflow: hidden;
        padding: 3px 5px 0px 20px;
        font-size: 11px;
        line-height: 11px;
    }

        .simulator-module .aa-iglegend-holder li .aa-iglegend-name-col span,
        .simulator-module .aa-clegend-holder li .aa-clegend-name-col span {
            display: inline-block;
            float: left;
            white-space: nowrap;
            overflow: hidden;
            -ms-text-overflow: ellipsis;
            -o-text-overflow: ellipsis;
            text-overflow: ellipsis;
            width: 90%;
            text-align: left;
            line-height: 15px;
            padding-left: 2px;
        }

        .simulator-module .aa-iglegend-holder li .aa-iglegend-percent-col span,
        .simulator-module .aa-clegend-holder li .aa-clegend-percent-col span {
            display: inline-block;
            float: right;
            line-height: 15px;
        }

    .simulator-module .aa-iglegend-holder .aa-iglegend-name-col,
    .simulator-module .aa-clegend-holder .aa-clegend-name-col {
        float: left;
        width: 80%;
        display: inline-block;
    }

    .simulator-module .aa-iglegend-holder .aa-iglegend-percent-col,
    .simulator-module .aa-clegend-holder .aa-clegend-percent-col {
        float: right;
        width: 20%;
        display: inline-block;
    }

    .simulator-module .aa-iglegend-holder .aa-iglegend-color,
    .simulator-module .aa-clegend-holder .aa-clegend-color {
        display: inline-block;
        float: left;
        width: 16px;
        height: 15px;
    }

.simulator-module .aa-igcharts-holder,
.simulator-module .aa-ccharts-holder {
    float: left;
    display: inline-block;
    width: 60%;
    margin-left: 15px;
}

@media (max-width: 900px) {
    .simulator-widget-container:not(.regular-view) .simulator-module .aa-igcharts-holder,
    .simulator-widget-container:not(.regular-view) .simulator-module .aa-ccharts-holder {
        min-width: initial;
        width: calc(100% - 20px);
        max-width: calc(100% - 20px);
        margin-top: 20px;
    }
}

.simulator-module .aa-igcharts-holder .aa-chart-title,
.simulator-module .aa-ccharts-holder .aa-chart-title {
    float: none;
    display: block;
    min-height: 10px;
    font-size: 11px;
    line-height: 11px;
    overflow: hidden;
    padding-top: 5px;
}

    .simulator-module .aa-igcharts-holder .aa-chart-title:first-of-type,
    .simulator-module .aa-ccharts-holder .aa-chart-title:first-of-type {
        border-top: none;
        padding-top: 0;
    }

    .simulator-module .aa-igcharts-holder .aa-chart-title span,
    .simulator-module .aa-ccharts-holder .aa-chart-title span {
        padding-left: 5px;
    }

.simulator-module .aa-igcharts-holder .aa-instruments-chart,
.simulator-module .aa-ccharts-holder .aa-currencies-chart {
    display: block;
    padding: 0 0 0 0;
}

.simulator-module .charts-border {
    float: left;
    width: calc(100% - 20px);
    margin: 15px 0 15px 10px;
    border-bottom: 1px solid #C7C7C7;
}

.combo-slider-holder {
    float: left;
    display: inline-block;
}

@media (max-width: 900px) {
    .simulator-widget-container:not(.regular-view) .simulator-module .aa-iglegend-holder,
    .simulator-widget-container:not(.regular-view) .simulator-module .aa-clegend-holder {
        width: calc(100% - 20px);
        min-width: 320px;
    }
}
