* { padding: 0; margin: 0; box-sizing: border-box; }
BODY { font: 10.5pt "Open Sans"; color: #4c4c4c; background: #fff; }
TABLE { border-collapse: collapse; border: 0; }
IMG { border: 0; }
A { cursor: pointer; text-decoration: none }
EM { font-style: normal }

HEADER, SECTION, FOOTER { display: block; max-width: 1600px; min-width: 320px; margin: 0 auto; }
.container { width: 100%; max-width: 1190px; margin: 0 auto }
.container-min { width: 100%; max-width: 960px; margin: 0 auto }
.row { display: flex }

/*Бегущая строка*/
.marquee { height: 100%; display: inline-flex; align-items: center; justify-content: space-around; width: 100%; min-width: 960px }
.marquee_run {
    -webkit-animation: marquee 25s linear 0s infinite;
    -moz-animation: marquee 25s linear 0s infinite;
    -o-animation: marquee 25s linear 0s infinite;
    animation: marquee 25s linear 0s infinite;
}
.marquee_stop {
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -o-animation-play-state: paused;
    animation-play-state: paused;
}
@keyframes marquee {
    0% { transform: translate(0, 0) }
    100% { transform: translate(-100%, 0) }
}

/*Forms*/
INPUT[type='text'], TEXTAREA, DIV.input { border: 1px solid #d4d9de; padding: 6px 11px; font: 12pt "Open Sans"; color: #191919; background: #fff }
INPUT[type='text'].readonly { background: #f8f8f9; color: #7e8c8d }

::-webkit-input-placeholder { color: #95a4a7 }
::-moz-placeholder { color: #95a4a7 }
:-ms-input-placeholder { color: #95a4a7 }

.checkbox { width: 21px; height: 21px; border: 1px solid #cccccc; margin-right: 9px; cursor: pointer }
.checkbox.checked { background: url('../images/checkbox_checked.png') 4px 4px no-repeat; border: 1px solid #2c98dd }
.checkbox INPUT { display: none }

.select { display: flex; position: relative; cursor: pointer }
.select DIV.input { flex-grow: 1; width: 100px }
.select A { border-top: 1px solid #d4d9de; border-right: 1px solid #d4d9de; border-bottom: 1px solid #d4d9de; padding: 6px 0; width: 35px; color: #2c98dd; font-size: 12pt; text-align: center }
.select UL { display: none; position: absolute; top: 100%; left: 0; z-index: 1; width: 100%; padding: 7px 0 15px; background: #fff; box-shadow: 0 3px 8px 0 rgba(0,0,0,0.5); list-style-type: none; }
.select UL LI { font-size: 11.25pt; padding: 5px 0 5px 30px; cursor: pointer }
.select UL LI:hover, .select UL LI.selected { background: #dee4e8 }

.button { display: block; background: #2c98dd; color: #fff; font: bold 12pt "Open Sans"; text-align: center; border-radius: 3px; height: 46px; border: 0; width: 100%; margin: 0 auto; cursor: pointer }
A.button { padding-top: 11px }
.button_second { display: block; background: #fff; color: #2c98dd; font: normal 12pt "Open Sans"; text-align: center; border-radius: 3px; height: 46px; border: 1px solid #2c98dd; width: 100%; margin: 0 auto; cursor: pointer }

/*Grid
md - 1124px
smd - 960px
sm - 669px
xs - 480px
*/
@media (min-width: 1125px) {
    .hidden-lg { display: none }
}
@media (max-width: 1124px) {
    .hidden-md { display: none }
    .visible-md { display: block }
}
@media (max-width: 960px) {
    .hidden-smd { display: none; }
}
@media (max-width: 669px) {
    .hidden-sm { display: none }
    .visible-sm { display: block }
}

/*Context menu*/
.context { border-bottom: 1px solid #fff; margin-bottom: 59px }
.context UL { display:flex; justify-content: center; list-style-type: none }
.context LI { padding: 0 25px }
.context LI A { display: block; font: 12pt "Tahoma"; color: #2c98dd; padding: 13px 0 16px; margin-bottom: -1px }
.context LI A:hover, .context LI A.selected { border-bottom: 3px solid #2c98dd; color: #334960; padding: 13px 0; }

@media (max-width: 960px) {
    .context { margin-bottom: 30px }
    .context LI { padding: 0 15px }
    .context LI A { font-size: 10.5pt; padding: 12px 0 15px; }
    .context LI A:hover, .context LI A.selected { padding: 12px 0; }
}

.sm_context { border-bottom: 1px solid #fff; margin-bottom: 59px; position: relative }
.sm_context .sm_selected { display: none }
.sm_context UL { display:flex; justify-content: center; list-style-type: none }
.sm_context LI { padding: 0 25px }
.sm_context LI A { display: block; font: 12pt "Tahoma"; color: #2c98dd; padding: 13px 0 16px; margin-bottom: -1px }
.sm_context LI A:hover, .sm_context LI A.selected { border-bottom: 3px solid #2c98dd; color: #334960; padding: 13px 0; }

@media (max-width: 960px) {
    .sm_context { margin-bottom: 30px }
    .sm_context LI { padding: 0 15px }
    .sm_context LI A { font-size: 10.5pt; padding: 12px 0 15px; }
    .sm_context LI A:hover, .sm_context LI A.selected { padding: 12px 0; }
}
@media (max-width: 669px) {
    .sm_context .sm_selected { display: flex; justify-content: center; margin-bottom: -1px }
    .sm_context .sm_selected SPAN { font: 10.5pt "Tahoma"; border-bottom: 3px solid #2c98dd; color: #334960; padding: 12px 0; }
    .sm_context .sm_selected I { font-size: 18pt; color: #2c98dd; padding: 8px 0 0 15px }
    .sm_context UL { display: none; width: 55%; list-style-type: none; padding: 10px 0 10px 30px; position: absolute; top: 100%; left: 0; right: 0; margin: 0 auto; z-index: 1; background: #fff; box-shadow: 0 7px 5px -2px rgba(0,0,0,0.5) }
    .sm_context LI A { margin: 0; padding: 10px 0; }
    .sm_context LI A:hover, .sm_context LI A.selected { border: 0; padding: 10px 0; }
}
@media (max-width: 480px) {
    .sm_context UL { width: 75% }
}

/*Table Scrollbar*/
.table .mCSB_inside > .mCSB_container { margin-right: 14px }
.table .mCSB_scrollTools { width: 14px }
.table .mCSB_scrollTools .mCSB_draggerRail { width: 100%; border-radius: 0; background: #dde0e2 }
.table .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 100%; border-radius: 4px; background: #2c98dd url('../images/scroll_ico.gif') 3px 50% no-repeat !important; }

/*Chat Scrollbar*/
.chat .mCSB_inside > .mCSB_container { margin-right: 8px }
.chat .mCSB_scrollTools { width: 8px }
.chat .mCSB_scrollTools .mCSB_draggerRail { width: 100%; border-radius: 0; background: #dee4e8 }
.chat .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 6px; border-radius: 6px; background: #bec8d2 !important; }

/*Header*/
HEADER { border-top: 3px solid #2c98dd; height: 85px; padding: 0 10px }
HEADER .container { height: 100%; display: flex; }
HEADER .row { align-items: center; }

HEADER .logo { margin-right: 20px; font-size: 0; line-height: 0 }

HEADER .top_nav { display: flex; flex-grow: 1; }
HEADER .menu_dropdown { display: flex; width: 100%; justify-content: space-between }

HEADER .lang_list { position: relative; display: flex }
HEADER .lang_ico { margin-right: 9px }
HEADER .lang_list .lang_selected { width: 78px; display: flex; align-items: flex-start; justify-content: space-between; text-decoration: none }
HEADER .lang_list .lang_selected SPAN { font-size: 11.25pt; color: #2a3c50; border-bottom: 1px dotted #2a3c50; }
HEADER .lang_list .lang_selected I { font-size: 13.86pt; color: #2c98dd; margin-top: 3px }
HEADER .lang_list UL { display: none; width: 124px; list-style-type: none; padding: 7px 0 15px 30px; position: absolute; top: 100%; left: 20px; z-index: 10; background: #fff; box-shadow: 0 7px 5px -2px rgba(0,0,0,0.5);  }
HEADER .lang_list LI { font-size: 11.25pt; padding: 3px 0 }
HEADER .lang_list LI A { color: #2c98dd; text-decoration: underline }
HEADER .lang_list LI.selected A { text-decoration: none; cursor: default }

HEADER .menu { margin-right: 13px; display: flex }
HEADER .menu A { font-size: 12pt; color: #2a3c50; text-decoration: none; padding: 5px 15px 0; height: 33px; transition: all 0.1s ease-in-out 0s }
HEADER .menu A:hover,
HEADER .menu A.selected { background: #334960; color: #fff }
HEADER .auth { display: flex; }
HEADER .auth .login { font-size: 10.5pt; padding: 6px 12px 0 37px; border-right: 1px solid #9dc8e4; height: 33px; color: #fff; background: #2c98dd url('../images/login_ico.png') 15px 50% no-repeat; border-radius: 2px 0 0 2px }
HEADER .auth .invoice { font-size: 10.5pt; padding: 6px 18px 0 34px; height: 33px; color: #fff; background: #2c98dd url('../images/invoice_ico.png') 13px 50% no-repeat; border-radius: 0 2px 2px 0 }

@media (max-width: 960px) {
    HEADER { height: 75px }
    HEADER .menu_dropdown { display: none; position: absolute; flex-direction: column-reverse; top: 75px; left: 0; z-index: 10; background: #fff; border-top: 1px solid #d9e1e8; border-bottom: 3px solid #2c98dd; }
    HEADER .menu_dropdown.show {  display: flex }
    HEADER .menu_dropdown_header { display: block; padding-left: 23px; font-size: 13.5pt; color: #2a3c50; background: url('../images/menu_ico.png') 0 6px no-repeat }

    HEADER .lang_list { justify-content: center; background: #f0f1f2; padding: 13px 10px 10px }
    HEADER .lang_list .lang_selected { display: none }
    HEADER .lang_list UL { display: flex !important; align-items: center; box-shadow: none; background: none; padding: 0; position: static; width: auto }
    HEADER .lang_list LI { padding: 0 16px; border-right: 1px solid #95a4a7; line-height: 11.25pt }
    HEADER .lang_list LI:last-child { border: 0 }
    HEADER .lang_list LI.selected A { color: #2a3c50 }
    HEADER .menu { flex-direction: column; align-items: center; margin-right: 0; padding: 10px }
    HEADER .menu A { margin: 3px 0 }
}
@media (max-width: 480px) {
    HEADER .lang_list LI { padding: 0 10px }
    HEADER .auth .login { border: 0; border-radius: 2px }
    HEADER .auth .invoice { display: none }
}

/*Index*/
#banner-main { min-height: 670px; background: url('../images/main_bg.jpg') 50% 50% no-repeat; display: flex; flex-direction: column; align-items: center; padding-top: 227px }
#banner-main H1 { font: 33pt "Roboto Slab Regular"; color: #fff; margin-bottom: 37px; padding: 0 10px; text-align: center }
#banner-main H2 { font: 16.5pt "Open Sans"; color: #fff; margin-bottom: 5px }
#banner-main .rate { display: flex; align-items: center; flex-direction: column; position: relative; }
#banner-main .rate .value { font-size: 30pt; color: #fff; margin-bottom: 5px }
#banner-main .rate .growth { font-size: 11.25pt; font-weight: bold; color: #1ece6b; padding-left: 15px; background: url('../images/top_ico.png') 0 5px no-repeat; margin-left: 8px; position: absolute; left: 100%; top: 9px }
#banner-main .rate .drop { font-size: 11.25pt; font-weight: bold; color: #ea4a35; padding-left: 15px; background: url('../images/bottom_ico.png') 0 5px no-repeat; margin-left: 8px; position: absolute; left: 100%; top: 27px }
#banner-main .line { background: url('../images/line.png') 50% 0 no-repeat; width: 100%; max-width: 699px; height: 1px; margin: -4px 0 3px -9px; }
#banner-main .cur { font-size: 16.5pt; color: #848d99; text-transform: uppercase; margin-bottom: 29px; }
#banner-main .button_register { display: block; width: 302px; height: 53px; padding-top: 13px; background: url('../images/button_register.png') 0 0 no-repeat; text-align: center; font-size: 15pt; color: #fff; text-transform: uppercase }

@media (max-width: 669px) {
    #banner-main { min-height: 280px; background-image: url('../images/main_bg_mobile.jpg'); padding-top: 30px  }
    #banner-main H1 { font-size: 21.57pt; margin-bottom: 8px }
    #banner-main H2 { font-size: 10.79pt; }
    #banner-main .rate .value { font-size: 19.61pt }
    #banner-main .rate .growth { font-size: 9pt; padding-left: 11px; background: url('../images/top_mobile_ico.png') 0 6px no-repeat; margin-left: 6px; top: 3px }
    #banner-main .rate .drop { font-size: 9pt; padding-left: 11px; background: url('../images/bottom_mobile_ico.png') 0 6px no-repeat; margin-left: 6px; top: 15px }
    #banner-main .cur { font-size: 10.79pt; margin-bottom: 16px; }
    #banner-main .button_register { width: 230px; height: 44px; background-image: url('../images/button_register_mobile.png'); font-size: 11.42pt; }
}

#currency-line-1 { height: 45px; background: #121921; padding: 0 8.9% }
#currency-line-1 .inner { height: 100%; max-width: 1310px; overflow: hidden; white-space: nowrap; position: relative }
#currency-line-1 .inner A { font-size: 12pt; font-weight: bold; text-transform: uppercase; white-space: nowrap; color: #fff }

@media (max-width: 669px) {
    #currency-line-1 { height: 35px; padding: 0 10px }
    #currency-line-1 .inner A { font-size: 10.5pt }
}

#currency-line-2 { height: 35px; background: #334960; padding: 0 10px }
#currency-line-2 .container { height: 100%; position: relative; padding-left: 35px }
#currency-line-2 .currency_line_ico { position: absolute; left: 0; top: 0; bottom: 0; margin: auto }
#currency-line-2 .inner { height: 100%; overflow: hidden; white-space: nowrap; position: relative }
#currency-line-2 .inner A { font-size: 10.5pt; font-weight: bold; text-transform: uppercase; white-space: nowrap; color: #c9ccce }

@media (max-width: 669px) {
    #currency-line-2 .currency_line_ico { display: none }
    #currency-line-2 .container { padding: 0 }
    #currency-line-2 .inner { padding: 0 }
}

#main { background: #f0f1f2; padding: 60px 0 70px }
#main H1 { font: 33pt "Roboto Slab Light"; color: #334960; text-align: center; margin-bottom: 11px; padding: 0 10px }
#main .desc { font-size: 11.25pt; color: #7e8c8d; text-align: center; margin-bottom: 44px; padding: 0 10px }

@media (max-width: 669px) {
    #main { padding: 25px 0 15px }
    #main H1 { font-size: 21pt; margin-bottom: 5px }
    #main .desc { font-size: 10.5pt; margin-bottom: 24px }
}

.summary { margin-bottom: 53px; background: #fff; box-shadow: 0 2px 5px -1px rgba(122,122,122,0.25); }
.summary .part1 { border-bottom: 1px solid #dee5eb; display: flex; flex-wrap: wrap }
.summary .part1 .rate { padding: 17px 2% 0 2%; height: 101px; background: url('../images/summary_line.gif') 100% 47px no-repeat; flex-grow: 1; display: flex; justify-content: center }
.summary .part1 .rate:last-child { background: none }
.summary .part1 .rate .caption { font-size: 11.25pt; color: #334960; width: 100%; margin-bottom: 1px }
.summary .part1 .rate .value { display: flex; align-items: flex-start; }
.summary .part1 .rate .num { font-size: 24.75pt; color: #334960; font-weight: bold; white-space: nowrap }
.summary .part1 .rate .num.growth { color: #1ece6b; padding-left: 17px; background: url('../images/top_ico.png') 0 9px no-repeat; }
.summary .part1 .rate .num.drop { color: #ea4a35; padding-left: 17px; background: url('../images/bottom_ico.png') 0 24px no-repeat; }
.summary .part1 .rate .cur { font-size: 11.25pt; color: #7e8c8d; font-weight: bold; text-transform: uppercase; margin: 19px 0 0 4px }
.summary .part1 .rate .cur.growth,
.summary .part1 .rate .cur.drop { margin-top: 7px }
.summary .part1 .rate .cur.growth B { display: block; color: #1ece6b;  line-height: 11px }
.summary .part1 .rate .cur.drop B { display: block; color: #ea4a35;  line-height: 11px }
.summary .part2 { height: 49px; display: flex; justify-content: space-between; align-items: center; padding: 0 3.5% }
.summary .part2 DIV { font-size: 11.25pt; color: #7e8c8d }
.summary .part2 DIV EM { font-size: 16.5pt }

@media (max-width: 960px) {
    .summary .part2 { height: auto; flex-direction: column; padding: 10px 10px 5px }
    .summary .part2 DIV { margin-bottom: 5px }
}
@media (max-width: 669px) {
    .summary { margin-bottom: 30px }
    .summary .part1 .rate { padding: 17px 20px 0 20px; height: 80px; flex-grow: initial }
    .summary .part1 .rate .caption { font-size: 10.5pt; }
    .summary .part1 .rate .num { font-size: 19.5pt }
    .summary .part1 .rate .num.drop { background-position-y: 17px }
    .summary .part1 .rate .cur { font-size: 10.5pt; margin: 13px 0 0 3px }
    .summary .part1 .rate .cur.growth,
    .summary .part1 .rate .cur.drop { margin-top: 4px }
    .summary .part2 DIV { font-size: 10.5pt; }
    .summary .part2 DIV EM { font-size: 13.5pt; }
}

.graph1 { margin-bottom: 65px }
.graph1 .header { display: flex; justify-content: space-between }
.graph1 .header .currency { height: 33px; border-bottom: 1px solid #d9e1e8; width: 160px; background: #fff; font-size: 11.25pt; color: #334960; position: relative }
.graph1 .header .currency .cur_selected { display: flex; justify-content: space-between; align-items: center; padding: 0 10px 0 14px; height: 100%; text-decoration: none }
.graph1 .header .currency .cur_selected I { color: #95a4a7; font-size: 13.86pt }
.graph1 .header .currency UL { display: none; width: 100%; padding: 5px 0; position: absolute; top: 100%; left: 0; z-index: 1; list-style-type: none; background: #fff; border-top: 1px solid #d9e1e8; box-shadow: 0 5px 5px 1px rgba(122,122,122,0.25); }
.graph1 .header .currency LI { padding: 7px 15px; cursor: pointer }
.graph1 .header .currency LI:hover { background: #e0f0fa }
.graph1 .header .duration { height: 33px; display: flex; background: #fff; border-bottom: 1px solid #d9e1e8 }
.graph1 .header .duration A { padding: 6px 11px 0 11px; color: #7e8c8d }
.graph1 .header .duration A:hover,
.graph1 .header .duration A.selected { color: #fff; background: #2c98dd }
.graph1 .placeholder IMG { width: 100%; height: auto }

@media (max-width: 669px) {
    .graph1 { margin-bottom: 30px }
    .graph1 .header { flex-direction: column-reverse; border-bottom: 1px solid #d9e1e8; background: #fff }
    .graph1 .header .currency { border: 0 }
}

#news-context { padding: 50px 10px }
#news-context H1 { font: 33pt "Roboto Slab Light"; color: #334960; margin-bottom: 20px }
#news-context .row { margin-bottom: 23px }
#news-context .news { width: 33.3333%; padding-right: 4.5%; color: #334960 }
#news-context .news:last-child { padding-right: 0 }
#news-context .news .date { float: left; margin: 0 11px 5px 0; padding: 8px 0 0 12px; width: 92px; height: 71px; background: #1ece6b; color: #fff; }
#news-context .news .date EM { display: block; font-size: 24.75pt; line-height: 24.75pt }
#news-context .to_all_news { display: block; font-size: 12pt; color: #2a3c50; text-decoration: none }
#news-context .to_all_news:hover { text-decoration: underline }

@media (max-width: 669px) {
    #news-context { padding: 0 0 35px }
    #news-context H1 { font-size: 21pt; text-align:center; background: #f0f1f2; margin: 0; padding: 5px 0 25px 0 }
    #news-context .row { flex-direction: column; margin-bottom: 19px }
    #news-context .news { width: 100%; background: #fff; padding: 19px 10px 0 10px }
    #news-context .to_all_news { margin-left: 10px }
}

/*Footer*/
FOOTER .footer_menu { min-height: 260px; background: #334960; padding: 0 10px }
FOOTER .footer_menu .container { display: flex }
FOOTER .footer_menu .company { width: 33.3333%; padding-top: 12px }
FOOTER .footer_menu .company .row { flex-direction: column; max-width: 247px; }
FOOTER .footer_menu .company .logo { margin-bottom: 2px }
FOOTER .footer_menu .company .address { padding-left: 72px; margin-bottom: 17px; font-size: 9.75pt; color: #a5afb9 }
FOOTER .footer_menu .company .github { padding-left: 72px; margin-bottom: 19px; font-size: 9.75pt; color: #a5afb9 }
FOOTER .footer_menu .company .social { padding-left: 72px; display: flex; }
FOOTER .footer_menu .company .social A { margin-right: 10px }
FOOTER .footer_menu .menu { width: 66.6667%; display: flex; }
FOOTER .footer_menu .menu DIV { width: 33.3333%; display: flex; flex-direction: column; align-items: flex-start; padding: 23px 5px 0 }
FOOTER .footer_menu .menu H3 { font: 21pt "Roboto Slab Light"; color: #fff; margin-bottom: 17px }
FOOTER .footer_menu .menu A { font-size: 9.75pt; color: #a5afb9; margin-bottom: 12px }
FOOTER .footer_menu .menu A:hover { text-decoration: underline }

@media (max-width: 960px) {
    FOOTER .footer_menu { padding: 8px 10px 0 40px }
    FOOTER .footer_menu .container { flex-direction: column-reverse }
    FOOTER .footer_menu .company { width: auto; padding-bottom: 30px }
    FOOTER .footer_menu .menu { width: auto; flex-direction: column }
    FOOTER .footer_menu .menu DIV { width: auto }
}

FOOTER .copyright { height: 49px; background: #2c98dd; font-size: 9.75pt; color: #fff; padding: 0 10px }
FOOTER .copyright .container { height: 100%; display: flex; justify-content: space-between; align-items: center }
FOOTER .copyright .designer { color: #96ccee }
FOOTER .copyright .designer IMG { vertical-align: middle }

@media (max-width: 669px) {
    FOOTER .copyright .container { flex-direction: column; justify-content: center }
}

/*Second*/
#banner-second { display: flex; min-height: 110px; background: url('../images/second_bg.jpg') 50% 50% no-repeat; padding: 0 10px }
#banner-second .container { display: flex; flex-direction: column; justify-content: center }
#banner-second H1 { font: 25.5pt "Roboto Slab Regular"; color: #fff; margin-bottom: 5px; }
#banner-second NAV { color: #c0c5cb }
#banner-second NAV A,
#banner-second NAV SPAN { font-size: 9.75pt; color: #c9ccce; margin: 0 3px }
#banner-second NAV A:hover { text-decoration: underline }

@media (max-width: 669px) {
    #banner-second H1 { font-size: 21pt; line-height: 21pt }
}

#second { background: #f0f1f2; padding: 45px 0 }
#second H1 { font-size: 19.5pt; font-weight: normal; color: #334960; text-align: center; margin-bottom: 42px; padding: 0 10px }
#second H1 A { color: #2c98dd }
#second H1 A:hover { text-decoration: underline }
#second H1.left { text-align: left }

@media (max-width: 669px) {
    #second { padding: 30px 0 }
    #second H1 { font-size: 13.5pt; margin-bottom: 27px }
}

/*About*/
.advantages { overflow: hidden; margin-bottom: 30px }
.advantages .row { flex-wrap: wrap; margin: 0 -25px }
.advantages .item { width: 50%; position: relative; padding: 0 25px 35px 25px }
.advantages .icon { width: 25%; float: left; text-align: center; padding: 0 10px }
.advantages H4 { width: 75%; float: right; font-size: 13.5pt; font-weight: normal; color: #334960; margin-bottom: 12px; padding-left: 25px; }
.advantages P { width: 75%; float: right; padding-left: 25px; }

@media (max-width: 960px) {
    .advantages .item { width: 100% }
}
@media (max-width: 480px) {
    .advantages .item { display: flex; flex-wrap: wrap }
    .advantages .icon { width: 40% }
    .advantages H4 { width: 60%; display: flex; align-items: center; padding: 0 20px }
    .advantages P { width: 100%; margin-top: 20px; padding: 0 10px }
}

#about-video { min-height: 540px; padding-bottom: 24px; display: flex; flex-direction: column; align-items: center; background: url('../images/about_video_bg1.jpg') 0 0 no-repeat, url('../images/about_video_bg2.jpg') 100% 0 no-repeat; background-color: #fff  }
#about-video .player { margin: -40px 0 45px; max-width: 722px; width: 100% }
#about-video .player IMG { vertical-align: top; width: 100%; height: auto }
#about-video .button_register { font-size: 12.75pt; font-weight: bold; color: #fff; width: 330px; height: 89px; padding-top: 18px; text-transform: uppercase; background: url('../images/button_register2.png') 0 0 no-repeat; text-align: center }

@media (max-width: 669px) {
    #about-video { min-height: unset; background: #fff }
    #about-video .player { margin-bottom: 25px }
    #about-video .button_register { font-size: 11.52pt; width: 300px; height: 80px; background-image: url('../images/button_register2_mobile.png');  }
}

#about-info { background: #f0f1f2 }
#about-info H2 { font-size: 16.5pt; font-weight: normal; color: #7e8c8d; text-align: center; border-bottom: 1px solid #fff; padding: 40px 10px; margin-bottom: 60px }
#about-info .info { display: flex; padding-bottom: 70px; border-bottom: 1px solid #fff }
#about-info .info .icon { width: 25%; text-align: center }
#about-info .info .icon IMG { vertical-align: top }
#about-info .info .text { width: 75%; padding: 0 20px }
#about-info .info .text P { margin-top: 30px }
#about-info .caution { height: 133px; display: flex; align-items: center; justify-content: center; padding: 0 25px }
#about-info .caution DIV { font-size: 11.25pt; color: #95a4a7; padding-left: 50px; background: url('../images/caution.png') 0 5px no-repeat; min-height: 32px }

@media (max-width: 960px) {
    #about-info .info .icon { width: 35% }
    #about-info .info .text { width: 65% }
}
@media (max-width: 669px) {
    #about-info H2 { font-size: 13.5pt; padding-top: 30px; padding-bottom: 30px; margin-bottom: 5px }
    #about-info .info { flex-direction: column-reverse; flex-wrap: wrap; padding-bottom: 35px }
    #about-info .info .icon { width: 100%; margin-top: 30px }
    #about-info .info .text { width: 100% }
}

/*Help*/
.search { padding-bottom: 59px; border-bottom: 1px solid #fff }
.search H2 { font-size: 19.5pt; font-weight: normal; color: #334960; text-align: center; margin-bottom: 42px; padding: 0 10px }
.search .row { height: 50px }
.search INPUT { flex-grow: 1; display: block; padding: 6px 12px; font: 12pt "Open Sans"; line-height: 1.42857143; border: 0; background-color: #fff; background-image: none; border-radius: 3px; box-shadow: 0 3px 6px -1px rgba(122,122,122,0.25) }
.search BUTTON { width: 130px; border: 0; border-radius: 2px; background: #2c98dd; font: 12pt "Open Sans"; color: #fff; cursor: pointer; box-shadow: 0 3px 6px -1px rgba(122,122,122,0.25) }

@media (max-width: 960px) {
    .search { padding-left: 10px; padding-right: 10px  }
}
@media (max-width: 669px) {
    .search { padding: 0 10px 30px 10px  }
    .search H2 { font-size: 13.5pt; margin-bottom: 18px }
    .search .row { height: 44px }
    .search INPUT { font-size: 10.5pt }
    .search BUTTON { width: 45px; color: #b5dbf3 }
}

.help { display: flex; padding-bottom: 54px; border-bottom: 1px solid #fff }
.help H2 { font-size: 19.5pt; font-weight: normal; color: #334960; margin-bottom: 27px }
.help UL { flex-grow: 1; list-style-type: none; margin-bottom: 20px; padding-top: 7px }
.help LI { display: block; padding-left: 14px; background: url('../images/list_sqare.gif') 0 8px no-repeat; margin-bottom: 16px; font-size: 12pt }
.help .get_started { width: 50%; padding-right: 15px; }
.help .get_started .row { flex-wrap: wrap }
.help .get_started .row > DIV { width: 100%; display: flex }
.help .get_started .icon { padding-right: 20px; margin-bottom: 20px }
.help .faq { width: 50%; padding-left: 15px }
.help .faq .row { flex-direction: column; align-items: flex-start }
.help .faq .other_questions { font-size: 12pt }
.help .faq .other_questions I { color: #334960 }
.help .faq .other_questions SPAN { color: #2c98dd }
.help .faq .other_questions:hover SPAN { text-decoration: underline }

@media (max-width: 960px) {
    .help { flex-wrap: wrap; padding: 0 10px 54px 10px }
    .help UL { flex-grow: 0 }
    .help .get_started { width: 100% }
    .help .get_started .row { flex-wrap: nowrap; justify-content: space-between }
    .help .faq { width: 100% }
}
@media (max-width: 669px) {
    .help { padding-bottom: 30px }
    .help H2 { font-size: 13.5pt; margin-bottom: 20px }
    .help UL { flex-grow: 1; margin-bottom: 17px }
    .help LI { font-size: 10.5pt; background-position-y: 7px; margin-bottom: 13px }
    .help .get_started .row { flex-wrap: wrap }
    .help .faq .other_questions { font-size: 10.5pt }
}

.send_request { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 50px 0 }
.send_request .icon { margin-bottom: 20px }
.send_request .text { font-size: 16.5pt; color: #334960; margin-bottom: 20px; text-align: center }
.send_request .button { width: 250px; }

@media (max-width: 669px) {
    .send_request { padding: 30px 10px }
    .send_request .text { font-size: 12pt }
}

/*Trading*/
#banner-trading { background: #14202e; }
.graph2 { position: relative }
.graph2 .placeholder { min-height: 440px; background: url('../images/graph2_placeholder.jpg') 100% 0 no-repeat; background-size: cover }
.graph2 .plot { min-height: 440px; }
.graph2 .header { display: flex; position: absolute; top: 19px; left: 0; z-index: 1 }
.graph2 .header > DIV { display: flex; align-items: center }
.graph2 .header SPAN { font-size: 9pt; color: #95a4a7; margin-right: 10px }
.graph2 .header NAV { border: 1px solid #686f6f; border-radius: 3px; display: flex; align-items: center; margin-right: 24px }
.graph2 .header DIV:last-child NAV { margin: 0 }
.graph2 .header NAV A { font-size: 9pt; color: #95a4a7; white-space: nowrap; padding: 4px 10px 3px; border-right: 1px solid #686f6f; transition: all 0.1s ease-in-out 0s  }
.graph2 .header NAV A:last-child { border: 0 }
.graph2 .header NAV A.selected, .graph2 .header NAV A:hover { background: #95a4a7; color: #14202e }

@media (max-width: 960px) {
    .graph2 .header { padding-left: 10px }
    .graph2 .header > DIV { margin-bottom: 12px }
    .graph2 .header NAV A { padding-left: 8px; padding-right: 8px }
}
@media (max-width: 669px) {
    .graph2 .header { display: block; position: static; padding-top: 19px }
    .graph2 .header { position: static }
    .graph2 .placeholder { min-height: 340px; }
    .graph2 .plot { min-height: 340px; }
}
@media (max-width: 480px) {
    .graph2 .header NAV A { padding-left: 7px; padding-right: 7px }
}

#trading { background: #f0f1f2; padding: 10px 0 45px 0 }
#trading .context { margin-bottom: 30px }
#trading H1 { text-align: center; font-size: 19.5pt; font-weight: normal; color: #334960; margin-bottom: 35px }

.currency_context { margin-bottom: 35px; display: flex; justify-content: center }
.currency_context A { display: flex; flex-direction: column; align-items: center; margin: 0 2px; padding: 3px 18px; border: 1px solid #99a3af; border-radius: 3px; font-size: 9.75pt; color: #334960; background: #fff }
.currency_context A:hover, .currency_context A.selected { color: #fff; background: #334960 }

@media (max-width: 669px) {
    .currency_context { margin-bottom: 25px }
}

.price_ballance { display: flex; max-width: 565px; margin: 0 auto 40px }
.price_ballance .price { border-right: 1px solid #fff; width: 50%; display: flex; justify-content: center; padding: 0 10px }
.price_ballance .price .caption { font-size: 9.75pt; color: #334960; width: 100%; margin-bottom: 1px }
.price_ballance .price .value { display: flex; align-items: flex-start; }
.price_ballance .price .num { font-size: 24.75pt; color: #334960; white-space: nowrap }
.price_ballance .price .cur { font-size: 11.25pt; color: #7e8c8d; font-weight: bold; text-transform: uppercase; margin: 19px 0 0 4px }
.price_ballance .price .cur.growth { margin-top: 7px }
.price_ballance .price .cur.growth B { display: block; color: #1ece6b;  line-height: 11px }
.price_ballance .ballance { width: 50%; display: flex; justify-content: center; padding: 0 10px }
.price_ballance .ballance .caption { font-size: 9.75pt; color: #334960; width: 100%; margin-bottom: 5px }
.price_ballance .ballance .value { display: flex; align-items: flex-start; width: 160px }
.price_ballance .ballance .value B { white-space: nowrap; font-size: 11.25pt; font-weight: bold; color: #334960 }
.price_ballance .ballance .value SPAN { flex-grow: 1; border-bottom: 2px dotted #bec3c7; font-size: 11.25pt; margin-top: -5px }

@media (max-width: 669px) {
    .price_ballance { flex-direction: column; align-items: center }
    .price_ballance .price { width: auto; border-bottom: 1px solid #fff; border-right: 0; padding-bottom: 10px }
    .price_ballance .ballance { width: auto; padding-top: 16px }
}

.buy_form { max-width: 565px; margin: 0 auto 40px; background: #fff; color: #191919; box-shadow: 0 4px 6px 1px rgba(122,122,122,0.15); }
.buy_form NAV { display: flex; height: 50px; background: #dee4e8; margin-bottom: 3px }
.buy_form NAV A { width: 50%; font-size: 12pt; display: flex; align-items: center; justify-content: center }
.buy_form NAV A.selected { background: #fff }
.buy_form .items { max-width: 425px; margin: 0 auto }
.buy_form .change { padding: 29px 0; background: url('../images/dotted.png') 50% 100% repeat-x }
.buy_form .change > DIV { max-width: 261px; margin: 0 auto 22px; }
.buy_form .change > DIV:last-child { margin-bottom: 0 }
.buy_form .change .caption { color: #7e8c8d; margin-bottom: 7px; }
.buy_form .change INPUT { flex-grow: 1; width: 100px }
.buy_form .change A { border-top: 1px solid #d4d9de; border-right: 1px solid #d4d9de; border-bottom: 1px solid #d4d9de; padding: 6px 0; width: 35px; color: #2c98dd; font-size: 12pt; text-align: center }
.buy_form .change .value { display: flex; justify-content: space-between; font-size: 12pt }
.buy_form .change .text { display: block; font-size: 9.75pt; margin-bottom: 3px }
.buy_form .change .text:last-child { margin: 0 }

.buy_form .sum { padding: 20px 0; background: url('../images/dotted.png') 50% 100% repeat-x  }
.buy_form .sum > DIV { max-width: 261px; margin: 0 auto }
.buy_form .sum .option { display: flex; align-items: center; margin-bottom: 11px }
.buy_form .sum .option:last-child { margin-bottom: 0 }
.buy_form .sum .option .fade { color: #7e8c8d }
.buy_form .sum .main { display: flex; margin-bottom: 19px }
.buy_form .sum .main INPUT { flex-grow: 1 }
.buy_form .sum .main SPAN { font-size: 12pt; color: #7e8c8d; padding: 7px 12px 0 0; margin-left: -44px }

.buy_form .result { padding: 29px 0; background: url('../images/dotted.png') 50% 100% repeat-x }
.buy_form .result > DIV { display: flex; justify-content: space-between; max-width: 261px; margin: 0 auto 22px }
.buy_form .result > DIV:last-child { margin-bottom: 0 }

.buy_form .send { padding: 20px 0 40px; }
.buy_form .send > DIV { max-width: 261px; margin: 0 auto }
.buy_form .send .value { display: flex; justify-content: space-between; margin-bottom: 4px }
.buy_form .send .button { margin-top: 21px }
.buy_form .send .button_second { margin-top: 12px }

.bid_ask { margin-bottom: 55px }

@media (max-width: 960px) {
    .bid_ask { margin-bottom: 23px }
}

.chat_root { position: relative }
.chat { width: 258px; position: absolute; top: 0; right: 0; background: #f7f8f8 }
.chat.in_blog_post { position: static; margin-top: 40px }
.chat .caption { height: 51px; text-align: center; padding-top: 14px; font-size: 12pt; color: #334960; background: url('../images/dotted.png') 50% 100% repeat-x }
.chat .scroll_y { height: 409px; background: url('../images/dotted.png') 50% 100% repeat-x }
.chat .messages { padding: 11px 9px }
.chat .messages DIV { margin-bottom: 8px; font-size: 9pt }
.chat .send { height: 66px; padding: 15px 15px 0 }
.chat .send INPUT { width: 100% }

/*Tables*/
.table { display: flex }
.table H2 { font: 21pt "Roboto Slab Light"; color: #334960; text-align: center; padding-bottom: 25px }
.table .line { border-bottom: 1px solid #dee5eb }
.table .dotted TR { background: url('../images/dotted.png') 50% 100% repeat-x }
.table .dotted TR:last-child { background: none }
.table .shadow { box-shadow: 0 3px 6px 1px rgba(122,122,122,0.15); }
.table .grid2 TD { width: 50% }
.table .grid6 TD { width: 16.6666% }
.table .grid5 TD { width: 20% }
.table .grid3 TD { width: 33.3333%; text-align: center }
.table .grid3 TD:first-child { text-align: left }
.table .grid3 TD:last-child { text-align: right }
.table TABLE { width: 100%; background: #fff; }
.table TR.line { border: 0 }
.table TR.line > TD { border-bottom: 1px solid #dee5eb }
.table TD { padding: 0 14px; height: 41px; font-size: 9.75pt; vertical-align: middle; color: #191919; text-align: left }
.table TD.cont { padding: 0 }
.table TD.pad_r { padding-right: 14px }
.table .caption TD { color: #334960; font-weight: bold }
.table .center { text-align: center; }
.table .right { text-align: right; }
.table .empty { text-align: center; color: #7e8c8d }
.table .success { background-color: #c4fadc !important; }
.table .fail { background-color: #f6c3bc !important; }
.table .scroll_y { max-height: 250px }
.table .o_buy { color: #39c275; font-weight: bold }
.table .o_sell { color: #ea4a35; font-weight: bold }
.table .o_act A { color: #2c98dd }

.table .order_book { display: inline-flex; align-items: baseline; vertical-align: middle; padding: 2px 8px 2px 5px; margin-left: 19px; color: #fff; font-size: 9.75pt; background: #bec3c7; border-radius: 3px }
.table .order_book I { margin-right: 4px; font-size: 11.37pt }

.table NAV { justify-content: center; margin-top: 18px }
.table NAV A { width: 60px; height: 44px; margin: 0 11px }
.table NAV A.to_left { background: url('../images/table_nav_left.png') 0 0 no-repeat }
.table NAV A.to_right { background: url('../images/table_nav_right.png') 0 0 no-repeat }

.col1 { width: 100% }
.col2 { width: 50% }
.col2:first-child { padding-right: 2.2% }
.col2:last-child { padding-left: 2.2% }
.col2 .row > DIV { width: 50% }
.col2 .row > DIV:first-child { padding: 0 17px 0 0 }
.col2 .row > DIV:last-child { padding: 0 0 0 17px }

@media (max-width: 960px) {
    .table { flex-direction: column; align-items: center }
    .table H2 { padding-bottom: 22px }
    .col1 { width: 90% }
    .col2 { width: 90%; padding: 0; margin-bottom: 22px }
    .col2:first-child { padding: 0 }
    .col2:last-child { padding: 0 }
}
@media (max-width: 669px) {
    .table .hide { display: none !important; }
    .table H2.dotted { background: url('../images/dotted.png') 50% 100% repeat-x }

    .table .collapse { display: inline-block; vertical-align: middle; width: 35px; height: 35px; margin-right: 18px; background: url('../images/table_collapse.gif') 0 0 no-repeat }
    .table .expand { display: inline-block; vertical-align: middle; width: 35px; height: 35px; margin-right: 18px; background: url('../images/table_expand.gif') 0 0 no-repeat }

    .table .order_book { display: none }
    .table NAV { display: flex }

    .col1 { width: 100% }
    .col2 { width: 100% }
    .col2 .row { flex-direction: column }
    .col2 .row > DIV { width: 100%; margin-bottom: 6px }
    .col2 .row > DIV:first-child { padding: 0 }
    .col2 .row > DIV:last-child { padding: 0 }
}

/*Blog*/
.blog { overflow: hidden; border-bottom: 1px solid #fff; margin-bottom: 19px }
.blog.in_blog_post { margin: 0; border-top: 1px solid #fff; border-bottom: 0; padding-top: 30px }
.blog .items { display: flex; flex-wrap: wrap; margin: 0 -12.5px }
.blog .items .post { width: 33.3333%; padding: 0 12.5px; margin-bottom: 35px }
.blog .items .post .img { position: relative; margin-bottom: 15px; font-size: 0 }
.blog .items .post .img IMG { width: 100%; height: auto }
.blog .items .post .img .tag { position: absolute; top: 19px; left: 19px; padding: 5px 9px; font-size: 8.25pt; text-transform: uppercase; color: #fff; background: #2c98dd }
.blog .items .post .img H4 { font-size: 15pt; color: #fff; padding: 0 19px; position: absolute; height: 50px; bottom: 13px; left: 0 }
.blog .items .post .text { color: #191919 }
.more_news .button { width: 250px }

@media (max-width: 960px) {
    .blog .items .post { width: 50% }
}
@media (max-width: 669px) {
    .blog .items .post { margin-bottom: 29px }
    .blog .items { margin: 0 2.5px }
    .blog .items .post { width: 100% }
}
@media (max-width: 480px) {
    .blog .items .post .img H4 { font-size: 12pt }
}

/*Post*/
.post_body { display: flex; margin-bottom: 20px }

.post_body .lcol { padding-right: 52px; flex-grow: 1 }
.post_body .lcol .img { display: block; position: relative; margin-bottom: 40px; font-size: 0 }
.post_body .lcol .img IMG { width: 100%; height: auto }
.post_body .lcol .img .tag { position: absolute; top: 13px; left: 13px; padding: 5px 9px; font-size: 8.25pt; text-transform: uppercase; color: #fff; background: #2c98dd }
.post_body .lcol .content { padding-left: 67px; position: relative; font-size: 12pt; line-height: 18pt }
.post_body .lcol .content P { margin-bottom: 30px }
.post_body .lcol .content P.caption { font-size: 15pt; line-height: 21pt; padding-bottom: 30px; border-bottom: 1px solid #fff }
.post_body .lcol .content H3 { margin-bottom: 30px; font-size: 12pt; text-align: left }
.post_body .lcol .content OL { margin: 0 0 30px 40px }
.post_body .lcol .content LI { margin-bottom: 5px }
.post_body .lcol .content LI:last-child { margin-bottom: 0 }
.post_body .lcol .content A { color: #2c98dd }
.post_body .lcol .content A:hover { text-decoration: underline }
.post_body .lcol .content .social { position: absolute; top: 0; left: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }

.post_body .rcol { width: 258px }
.post_body .rcol .img { display: block; position: relative; margin-bottom: 20px; font-size: 0 }
.post_body .rcol .img IMG { width: 100%; height: auto }
.post_body .rcol .img .tag { position: absolute; top: 13px; left: 13px; padding: 5px 9px; font-size: 8.25pt; text-transform: uppercase; color: #fff; background: #2c98dd }
.post_body .rcol .img H4 { font-size: 12pt; color: #fff; padding: 0 19px; position: absolute; bottom: 13px; left: 0 }

@media (max-width: 960px) {
    .post_body .lcol { padding: 0 }
    .post_body .lcol .content { padding: 0 15px 0 83px }
    .post_body .lcol .content .social { left: 15px }
}
@media (max-width: 669px) {
    .post_body { margin: 0 }
    .post_body .lcol .content { padding: 0 15px }
    .post_body .lcol .content .social { display: none }
    .post_body .lcol .content { font-size: 10.5pt; line-height: normal }
    .post_body .lcol .content P.caption { font-size: 12pt; line-height: normal }
    .post_body .lcol .content H3 { font-size: 10.5pt }
}

/*Contacts*/
.contacts { display: flex }
.contacts .form { width: 50%; padding: 30px 30px 40px; box-shadow: 0 4px 6px 1px rgba(122,122,122,0.15); background: #fff }
.contacts .form .field { margin-bottom: 20px }
.contacts .form .caption { color: #334960; margin-bottom: 7px; }
.contacts .form INPUT { width: 100% }
.contacts .form TEXTAREA { width: 100%; height: 150px }
.contacts .form .button { width: 260px; margin-top: 28px }

.contacts .address { width: 50%; padding: 40px 0; border-top: 1px solid #fff; border-right: 1px solid #fff; border-bottom: 1px solid #fff; background: url('../images/contacts_bg.png') 100% 100% no-repeat }
.contacts .address .logo { margin-bottom: 25px; margin-left: 50px }
.contacts .address .info { font-size: 12pt; line-height: 18pt; color: #334960; margin-left: 120px }

@media (max-width: 960px) {
    .contacts { flex-direction: column }
    .contacts .form { width: 100% }
    .contacts .address { width: 100%; border: 0; margin-bottom: -45px }
}
@media (max-width: 669px) {
    .contacts .form { padding-left: 10px; padding-right: 10px }
    .contacts .address { margin-bottom: -30px }
}

/*Lk-in, Lk-out*/
.note { color: #7e8c8d; text-align: center }

/*Login, Logout, Recover*/
#banner-login { min-height: 803px; background: #3c4c64 url('../images/login_bg.jpg') 50% 0 no-repeat; display: flex; flex-direction: column; align-items: center; padding: 164px 0 18px; margin-bottom: 3px }
#banner-login H1 { font: 33pt "Roboto Slab Regular"; color: #fff; margin-bottom: 19px; padding: 0 10px; text-align: center }
#banner-login .form { width: 100%; max-width: 565px; background: #fff; padding: 40px 10px 56px; margin-bottom: 30px }
#banner-login .form .items { max-width: 300px; margin: 0 auto }
#banner-login .form .field { margin-bottom: 15px }
#banner-login .form .caption { margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center }
#banner-login .form .caption SPAN { font-weight: bold; color: #334960; }
#banner-login .form .caption A { color: #2c98dd }
#banner-login .form .caption A:hover { text-decoration: underline }
#banner-login .form .field INPUT { width: 100% }
#banner-login .form .text { color: #334960; text-align: center; margin-bottom: 22px }
#banner-login .form .button { margin-top: 20px }
#banner-login .form .option { display: flex; align-items: flex-start; margin-bottom: 11px }
#banner-login .form .option A { color: #2c98dd }
#banner-login .form .option A:hover { text-decoration: underline }
#banner-login .note { text-align: center; color: #fff }
#banner-login .note A { color: #fff; text-decoration: underline }

@media (max-width: 669px) {
    #banner-login { min-height: 405px; background-image: url('../images/login_bg_mobile.jpg'); padding-top: 24px  }
    #banner-login H1 { font-size: 21.57pt; margin-bottom: 19px }
    #banner-login .form { padding: 27px 10px 36px; margin-bottom: 20px }
}

/*Profile*/
.profile { max-width: 960px; color: #334960; margin: 0 auto 25px }
.profile .account { display: flex; margin-bottom: 17px }
.profile .account .lcol { flex-grow: 1; display: flex; justify-content: space-between; align-items: center; padding-right: 25px; border-right: 1px solid #fff }
.profile .account .lcol .avatar { font-size: 0; padding-right: 17px }
.profile .account .lcol .avatar IMG { vertical-align: top }
.profile .account .lcol .type { display: flex; align-items: center; font-size: 9.75pt; margin-bottom: 4px; padding-top: 8px }
.profile .account .lcol .type B { margin-right: 13px; padding: 2px 11px; background: #334960; color: #fff; border-radius: 4px }
.profile .account .lcol .type A { color: #2c98dd; border-bottom: 1px dotted #2c98dd }
.profile .account .lcol .name { font-size: 22.5pt }
.profile .account .lcol .price { display: flex; justify-content: center; padding: 0 10px }
.profile .account .lcol .price .caption { font-size: 11.25pt; color: #334960; width: 100%; margin-bottom: 1px }
.profile .account .lcol .price .value { display: flex; align-items: flex-start; }
.profile .account .lcol .price .num { font-size: 24.75pt; color: #334960; white-space: nowrap }
.profile .account .lcol .price .cur { font-size: 11.25pt; color: #7e8c8d; font-weight: bold; text-transform: uppercase; margin: 19px 0 0 4px }
.profile .account .rcol { display: flex; align-items: center; padding-left: 25px }
.profile .account .rcol UL { list-style-type: none; }
.profile .account .rcol LI { display: block; padding-left: 14px; background: url('../images/list_sqare.gif') 0 8px no-repeat; margin-bottom: 5px; font-size: 11.25pt }

.profile .message { background: #fff; display: flex; justify-content: space-between; align-items: center; font-size: 11.25pt; padding: 11px 9px 11px 19px; margin-bottom: 18px }
.profile .message SPAN A { color: #2c98dd; text-decoration: underline }
.profile .message .update { height: 38px; width: 188px; text-align: center; padding: 6px 17px 0; border: 2px solid #2c98dd; border-radius: 4px; font-size: 11.25pt; font-weight: bold; color: #2c98dd; margin-left: 20px }

.profile .ballance { border-top: 1px solid #fff }
.profile .ballance .item { display: flex; justify-content: space-between; align-items: center; padding: 13px 0; border-bottom: 1px solid #fff }
.profile .ballance .data { display: flex; align-items: center }
.profile .ballance .data .caption { font-size: 11.25pt; font-weight: bold; color: #334960; padding-right: 37px }
.profile .ballance .data .value { display: flex; align-items: flex-start; }
.profile .ballance .data .num { font-size: 24.75pt; color: #334960; white-space: nowrap }
.profile .ballance .data .cur { font-size: 11.25pt; color: #7e8c8d; font-weight: bold; text-transform: uppercase; margin: 19px 0 0 4px }
.profile .ballance .buttons { display: flex }
.profile .ballance .buttons A { width: 130px; height: 42px; border-radius: 3px; text-align: center; font-size: 12pt; color: #fff; padding-top: 10px; margin-left: 12px }
.profile .ballance .buttons A.cashin { background: #2c98dd }
.profile .ballance .buttons A.cashout { background: #334960 }

.account_setings H2 { font-size: 19.5pt; font-weight: normal; padding: 28px 0; border-bottom: 1px solid #fff; text-align: center; color: #334960 }
.account_setings .item { display: flex; padding: 13px 0; max-width: 960px; margin: 0 auto; border-bottom: 1px solid #fff }
.account_setings .item .caption { font-size: 11.25pt; font-weight: bold; color: #334960; padding-top: 11px; width: 166px }
.account_setings .item .fields { display: flex }
.account_setings .item .fields .text { padding: 11px 16px 0; font-size: 11.25pt; color: #334960 }
.account_setings .item .fields .text A { color: #2c98dd }
.account_setings .item .fields .text A:hover { text-decoration: underline }
.account_setings INPUT[type='text'] { height: 42px; width: 200px; display: block; padding: 6px 12px; font: 11.25pt "Open Sans"; color: #334960; line-height: 1.42857143; margin-left: 16px; border: 0; background-color: #fff; background-image: none; border-radius: 3px; box-shadow: 0 3px 6px -1px rgba(122,122,122,0.25) }
.account_setings INPUT[type='submit'] { width: 130px; height: 42px; border-radius: 3px; text-align: center; font-size: 12pt; color: #fff; padding-top: 2px; margin-left: 16px; border: 0; background: #2c98dd; cursor: pointer  }
.account_setings INPUT.error { border: 1px solid #d97f74 }
.account_setings .error_message { color: #c33725; font-size: 9.75pt; margin: 10px 0 0 16px }
.account_setings .error_message I { margin-right: 4px }

@media (max-width: 960px) {
    .profile { padding: 0 15px }
    .profile .account { display: block; border: 0 }
    .profile .account .lcol { border: 0; padding: 0; margin-bottom: 20px }
    .profile .account .rcol { justify-content: center; padding: 0 }

    .profile .ballance .buttons A { width: 61px; height: 56px }
    .profile .ballance .buttons A SPAN { display: none }
    .profile .ballance .buttons A.cashin { background: #2c98dd url('../images/cashin_ico.png') 0 0 no-repeat }
    .profile .ballance .buttons A.cashout { background: #334960 url('../images/cashout_ico.png') 0 0 no-repeat }

    .account_setings { padding: 0 15px }
    .account_setings H2 { font-size: 15pt; padding: 20px 0 }
    .account_setings .item { display: block; padding: 24px 0; }
    .account_setings .item .fields { display: block; }
    .account_setings .item .caption { text-align: center; margin: 0 auto 15px; padding: 0;  }

    .account_setings INPUT[type='text'] { margin: 0 auto 13px; width: 100%; max-width: 290px }
    .account_setings INPUT[type='submit'] { display: block; margin: 20px auto 0 }
    .account_setings .item .fields .text { text-align: center }
    .account_setings .error_message { text-align: center; margin: 0 0 13px }
}
@media (max-width: 669px) {
    .profile .account .lcol { flex-direction: column }
    .profile .account .lcol .row { padding-bottom: 17px; margin-bottom: 10px; border-bottom: 1px solid #fff }

    .profile .message { flex-direction: column; justify-content: center; padding: 20px }
    .profile .message SPAN { text-align: center; margin-bottom: 15px }
    .profile .message .update { margin: 0 }

    .profile .ballance .data { flex-direction: column; align-items: flex-start }
    .profile .ballance .data .caption { font-size: 10.5pt; font-weight: normal }
    .profile .ballance .data .caption B { margin-right: 4px }
    .profile .ballance .data .num { font-size: 15pt; font-weight: bold  }
    .profile .ballance .data .cur { font-size: 10.5pt; margin-top: 6px }
}

#chart1 { height: 336px }