#quotes-online {
    width: 700px;
    margin: auto;
    text-align:center;
    padding: 10px;
}
#quotes-online .row{
    margin: 0px;
}
#quotes-online .quotes-value-block{
    margin:0px;
} 
#quotes-online .quotes-value-block {
    display: flex;
    justify-content: center;
}
#quotes-online .quotes-value-block .value{
    font-size: 26pt;
    color: #00000;
    font-weight: bold;
    margin-left:10px;
}

#quotes-online .quotes-value-block .val, #quotes-online .quotes-value-block .pct{
    min-height: 25px;
    padding-top: 10px;
    margin-left: 10px;
    font-size: 18pt;
    font-weight: bold;
}

#quotes-online .quotes-bottom .date {
    font-size: 12px;
    margin-top:10px;
    font-weight: bold;
    color: #777;
}
#quotes-online .quotes-bottom .date i.fa{
    color:#42a782;
}

.quotes-bottom .refresh span {
    margin-bottom: 8px;
    cursor: pointer;
    color:#808080;
}
#quotes-online .quotes-value-block .fa-arrow-up{
    color:#42a782;
}
#quotes-online .quotes-value-block .fa-arrow-down{
    color:#f7533f;
}

#quotes-online .quotes-value-block.up .pct{
    color:#42a782;
}
#quotes-online .quotes-value-block.down .pct{
    color:#f7533f;
}

#quotes-online .quotes-value-block.up .val{
    color:#42a782;
}
#quotes-online .quotes-value-block.down .val{
    color:#f7533f;
}

@media(max-width: 800px){
    #quotes-online {
        width: 600px;
    }
}
@media(max-width: 600px){
    #quotes-online {
        width: 480px;
    }
    #quotes-online .quotes-value-block .value {
        display: flex;
        flex-direction: column;
    }
    #quotes-online .quotes-value-block .val, #quotes-online .quotes-value-block .pct {
        font-size: 14pt;
    }
}
@media(max-width: 500px){
    #quotes-online {
        width: 380px;
        padding: 0px;
    }
}
@media(max-width: 420px){
    #quotes-online {
        width: 330px;
        padding: 0px;
    }
    #quotes-online .quotes-bottom .date {
        font-size: 13px;
        margin-bottom:10px;
    }
    #quotes-online .quotes-value-block .value {
        font-size: 23pt;
        margin: 0px;
    }
    #quotes-online .quotes-value-block .val, #quotes-online .quotes-value-block .pct {
        font-size: 14pt;
    }
    #quotes-online .col-xs-12{
        padding:0px;
    }
}
@media(max-width: 360px){
    #quotes-online {
        width: 280px;
        padding: 0px;
    }
    #quotes-online .quotes-bottom .date {
        font-size: 10px;
        margin-bottom:10px;
    }
    #quotes-online .quotes-value-block .value {
        font-size: 21pt;
        margin: 0px;
    }
    #quotes-online .quotes-value-block .val, #quotes-online .quotes-value-block .pct {
        font-size: 11pt;
    }
    #quotes-online .col-xs-12{
        padding:0px;
    }
}