﻿/* Tablets/Desktop */
@media only screen and (min-width:768px) {

    /*h1.underscore,
    h2.underscore { display: block; padding-bottom: 20px; border-bottom: 2px solid #e41b13; margin-bottom: 20px; }
    h2.underscore { padding-bottom: 15px; margin-bottom: 20px; }*/

    .page-content-split { display: flex; flex-flow: row nowrap; justify-content: stretch; align-items: stretch; min-height: calc(100vh - 71px - 88px - 137px); position: relative; }
    .page-content-split > * { flex: 1 1 auto; padding: 50px 0 60px; }
    .page-content-split .page-content { width: 100%; margin: 0; }
    .page-content-column-left { width: calc(50% + 265px); background-color: #fff; color: #3c3c3c; order: 1; flex-grow: 0; min-width: 768px; min-height: inherit; }
    .page-content-column-left .page-content { margin-left: auto; padding-right: 95px; margin-left: auto; }
    .page-content-column-right { background: url("../images/content-bg-1.jpg") no-repeat 0 0; background-size: cover; order: 2; position: fixed; right: 0; width: calc(50% - 265px); max-width: calc(100% - 768px); top: 70px; height: calc(100vh - 70px); min-height: inherit; }
    .page-content-column-right .page-content { padding: 0; margin: 0; }

    .unfix-pccr .page-content-split .page-content-column-right { position: absolute; top: auto; bottom: 0; }

    .page-steps li:before { display: inline-block; margin: 0 15px 0 0; }
    .steps-full li { padding-top: 50px; }
    .steps-full li .step-ico { display: block; }
    .steps-full li + li:after { top: calc(50% - 6px); }
    .steps-full { font-size: 16px; }

    .def-form .form-row,
    .def-form .label-row,
    .def-form .link-row,
    .def-form .form-btn-row { margin: 0 -15px 13px 0; max-width: 545px; }

    .def-form .form-row { align-items: flex-start; display: flex; flex-wrap: nowrap; justify-content: flex-start; }
    .def-form .form-row > * { flex-basis: 0; flex-grow: 1; }
    .def-form .inp-wrap { padding: 0 15px 0 0; margin: 0; }

    .def-form .form-btn-row { align-items: baseline; display: flex; flex-wrap: nowrap; justify-content: space-between; margin: 24px 0 0 0; max-width: 530px; }
    .def-form .form-btn-row .btn { order: 1; }
    .def-form .form-btn-row .btn-cancel,
    .def-form .form-btn-row .btn-back { order: 0; }

    .def-form .split-content { display: flex; justify-content: space-between; align-items: flex-start; }
    .def-form .split-content > * { flex: 1 1 auto; }
    .def-form .split-content > * + * { margin-left: 15px; }

    .btn-section .btn-row { align-items: baseline; display: flex; flex-wrap: nowrap; justify-content: space-between; margin-top: 22px; flex-direction: row-reverse; }
    .btn-section .btn-row form { display: flex; }
    .btn-section .btn { order: 0; margin: 0 0 0 auto; }
    .btn-section .btn-cancel,
    .btn-section .btn-back { order: 1; margin: 0 auto 0 0; }

    .per-detail-form { max-width: 545px; }
    .personal-detail-form .inp-phone { flex-basis: auto; flex-grow: 0; max-width: calc(545px / 2); width: 100%; }
    .chg-password-form { width: calc(50% - 7.5px); flex-shrink: 0 !important; }
    .page-login-activate .btn-section .btn-primary { min-width: 135px; }

    #site-head { border-bottom: 1px solid rgba(218, 218, 218, .4); background-color: #fff; color: #3c3c3c; margin: 0; padding: 0; position: fixed; left: 0; top: 0; width: 100%; z-index: 20; overflow: hidden; }
    #site-head .page-content { max-width: 100%; width: auto; }
    #site-head .head-content { display: flex; height: 70px; align-items: center; position: relative; justify-content: space-between; }
    #site-head .logos { display: flex; position: relative; }
    #site-head .logos:after { content: ''; position: absolute; top: -100%; bottom: -100%; right: 0; width: 1px; background-color: rgba(0, 0, 0, 0.05); }
    #site-head .logos .logo { display: inline-block; }
    #site-head .logos .logo > * { height: 30px; display: block; }
    #mobile-menu-display { display: none !important; }
    #site-head nav { flex: 1; font-size: 16px; font-weight: 700; }
    #site-head nav .content { height: 100%; max-width: 1100px; padding: 0 20px; margin: 0 auto; }
    #site-head nav ul { display: flex; align-items: center; align-content: space-around; height: 100%; max-width: 585px; }
    #site-head nav li { flex: 1 1 auto; }
    #site-head nav li + li { margin-left: 10px; }
    #site-head nav a { text-decoration: none; color: inherit; }
    #site-head nav a:hover,
    #site-head nav a:focus { text-decoration: underline; }
    #site-head .auth { line-height: 20px; }
    #site-head .auth:before { content: ''; position: absolute; top: 0; bottom: 0; width: 1px; background-color: rgba(0, 0, 0, 0.05); }
    #site-head .auth .name { font-size: 12px; line-height: inherit; opacity: 0.75; overflow: hidden; max-height: 40px; display: block; min-width: 130px; }
    #site-head .auth .btn-logout { font-size: 16px; line-height: inherit; color: inherit; }
    #site-head nav .auth,
    #site-head .burger { display: none !important; }

    #site-head .logos .logo + .logo { padding-left: 15px; }
    #site-head .logos .logo:last-child { margin-right: 20px; }
    #site-head .auth > * { margin-left: 20px; }

    main { padding-top: 70px; /* height of fixed header */ }

    .dashboard-foot:after { content: ''; clear: both; display: table; }
    .manage-currencies-section .manage-currencies,
    .dashboard-foot .transaction-hist-section { width: calc(100% - 275px); float: left; }
    .manage-currencies-section .mc-actions,
    .dashboard-foot .xchg-rate-section { width: 260px; float: right; }

    .card-panels { display: flex; flex-wrap: wrap; }
    .card-panels .card-panel { flex: 0 1 calc(50% - 7.5px); }
    .card-panels .card-panel:nth-of-type(even) { margin-left: 15px; }
    .card-panels .card-panel:nth-of-type(n+3) { margin-top: 15px; }

    .slim-card-panels .card-panel header { display: none; }
    .slim-card-panels .card-panel .content { padding: 0; }
    .slim-card-panels .card-panel .img { padding: 0 60px 0 0; width: 188px; float: left; }
    .slim-card-panels .card-panel .img:after { display: none; }
    .slim-card-panels .card-panel table { width: calc(100% - 188px); }
    .slim-card-panels .card-panel tr > * { padding: 10px 0; width: auto; }
    .slim-card-panels .card-panel th { padding-right: 20px; }
    .slim-card-panels .card-panel .status { display: inline-block; margin: 0 5px 0 0; }
    .slim-card-panels .card-panel time { display: inline-block; }

    .page-settings header h2 { font-size: 20px; margin-bottom: .5em; }
    .page-transactions header h2 { font-size: 20px; margin-bottom: .5em; }
    .no-results h2 { font-size: 20px; margin-bottom: .5em; }

    .select-currencies { display: flex; justify-content: space-between; flex-wrap: wrap; }
    .select-currencies .ccb-item { width: calc(50% - 9px); }
    .select-currencies > *:nth-of-type(n+3),
    .select-currencies .select-all-row { margin-top: 15px; }

    .page-reload .inp-cb + label { padding-left: 40px; }
    .page-reload .btn-section .btn-row { max-width: 100%; }
    .page-reload .form-row,
    .page-reload .label-row,
    .page-reload .link-row,
    .page-reload .form-btn-row,
    .page-reload header:not(.main-content-head) { width: auto; }
    .def-form .form-row,
    .def-form .label-row,
    .def-form .link-row,
    .def-form .form-btn-row { max-width: calc(100% + 15px); }

    .default-currency .ccb-item { width: calc(50% - 9px); }

    .currency-load-table { width: calc(100% + 50px); margin: 0 -50px 0 0; }
    .currency-tfr-table { width: calc(100% + 50px); margin: 0 -50px 0 0; }
    .currency-add-table { width: 100%; margin: 0 -50px 0 0; }

    .debit-card-payment-colums > .column:first-child { padding-right: 25px; border-right: 1px solid rgba(218, 218, 218, 0.4); }
    .debit-card-payment-colums > .column:last-child { width: 260px; flex: 0 0 auto; }
    .debit-card-payment-colums .load-detail-section header { margin-top: 0; }
    .debit-card-payment-colums .card-detail-form { max-width: 350px; margin-right: auto; }

    .load-detail-section header + .load-detail-items,
    .tfr-detail-section header + .tfr-detail-items { margin-top: 10px; }
    .load-detail-section header + .load-detail-items-compact { margin-top: 0; }

    .load-detail-items.load-detail-items-compact .load-detail-row td { padding: 12px 0 28px 0; width: auto; }
    .load-detail-row .currency-rate .content { bottom: 8px; }
    /* flag */
    .load-detail-items.load-detail-items-compact .load-detail-row td:nth-child(1) { width: 40px; padding: 15px 10px 15px 0; }
    /* cur desc */
    .load-detail-items.load-detail-items-compact .load-detail-row td:nth-child(2) { display: none; }
    /* = */
    .load-detail-items.load-detail-items-compact .load-detail-row td:nth-child(4) { padding-top: 11px; width: 30px; }
    /* amount */
    .load-detail-items.load-detail-items-compact .load-detail-row td:nth-child(3),
    .load-detail-items.load-detail-items-compact .load-detail-row td:nth-child(5) { font-size: 16px; }

    .bank-account-form .form-row { max-width: 365px; }
    .bank-account-form .form-row-dob { max-width: 100%; }

    .filters-wrap { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; }
    .filters-wrap > * { }

    .transaction-hist-table .th-view-all-row { display: none; }
}

@media only screen and (min-width:981px) {
    .page-content-column-left .page-content { max-width: 835px; }

    #site-head .logos .logo + .logo { padding-left: 22px; }
    #site-head .auth > * { margin-left: 40px; }
    #site-head .logos .logo:last-child { margin-right: 40px; }
}

/* Tablets/Mobile */
@media only screen and (max-width:1129px) {
}

/* Tablets only */
@media only screen and (min-width:768px) and (max-width:1129px) {
    .dtop-only,
    .tblt-hide,
    .mobi-only { display: none !important; }

    .columns-wrap-t { display: flex; justify-content: space-between; margin-left: -15px; margin-right: -15px; }
    .columns-wrap-t > * { flex: 1 1 0; margin: 0 15px; }
}
