/* Your custom styles */


html{
    color: #828282;
}
body {
    background-color: #fff;
    color: #000;
    font-family: 'Rubik', Arial, sans-serif;
    font-size: 12px;
    font-weight: normal;
}

.fullcontent { min-height: calc(100vh - 100px); }
a {text-decoration: underline; color: var(--color-font-primary);}
a:hover {color: var(--color-font-primary);text-decoration: none; }

.steps input:not([type="submit"]):not([type="button"]):not([name*="sum_total"]),
.steps textarea.form-control,
.input-group-text{
    border:2px solid var(--color-border);
}
.steps input:not([type="submit"]):not([type="button"]):not([name*="sum_total"]),
.steps textarea.form-control:focus{
    border-color: var(--color-border);
}
.input-group-text{
    border-right: unset;
}
.btn,
.Button,
.ThemesBlueButton, .bulk_refunds.top_menu A, .bulk_refunds.top_item A, .bulk_instalments.top_menu A, .bulk_instalments.top_item A
#content form input[type="button"],
#content form input[type="submit"],
#content form input[type="reset"],
#colorbox form input[type="submit"] { border: 0; border-radius: 5px; box-shadow: none; color: #000; cursor: pointer; display: inline-block; font-size: 16px; padding: 8px 16px; text-decoration: none; text-transform: none; transition: background-color 0.3s; }
#colorbox form input[type="reset"] { cursor: pointer; }

.bulk_refunds { margin: 15px 0px 15px 0px; }
.bulk_refunds.top_menu A, .bulk_refunds.top_item A { border: 2px solid black; border-radius: 5px;  padding: 5px; font-size: 14px; color: black; text-decoration: none; display: inline-block;}
.bulk_refunds.top_menu A:HOVER, .bulk_refunds.top_item A:HOVER { color: #666; }
.bulk_refunds.top_menu.unrelated A { border: 1px outset black; }
.bulk_refunds.top_menu.unrelated A:HOVER { color: #666; font-weight: bold; }
.bulk_refunds.top_menu.unrelated A:active { border-style: inset;}
.bulk_refunds.top_menu .clear_refunds, .bulk_instalments.top_menu .clear_refunds { /*display: none;*/ }

#content form input[type="reset"] { background-color: #eee; border: 2px solid #ddd; }
#content form input[type="reset"]:hover { background-color: #ddd; }
.btn:focus,
.btn:active,
.btn:hover { box-shadow: none!important; }
.btn.login { background: #f1f1f1; background: linear-gradient(180deg, #f1f1f1 0%, #fff 100%); border: 2px solid #f2f2f2; color: #828282; padding: 8px; }
.btn.login:after { vertical-align: middle;}
.btn.login:hover { border: 2px solid #ccc; }
.btn.login.log-out { padding-left: 20px; padding-right: 20px; }
.btn.login.log-out:after { display: none; }
.ThemesBlueButton,
#content form input[type="button"],
#content form input[type="submit"],
#colorbox form input[type="submit"]  { background-color: var(--color-background-primary); color: #fff;margin: 0; border: 2px solid var(--color-border); }
/* #content form input[type="submit"] { margin-right: 10px; } */
#content form input[type="submit"].connect { background: #12255F url(../images/ajax-loader-blue.gif) 99% center no-repeat !important; }
.ThemesBlueButton:hover,
/*.btn.signup:hover,.btn.signup, */
.print_box_wrapper a:hover,
#content form input[type="button"]:hover,
#content form input[type="submit"]:hover,
.btn.calc:hover,
.Button:hover { background-color: #fff;color: var(--color-font-primary);border: 2px solid;text-decoration: none;}
.btn.more { background: #f9ae2e; background: linear-gradient(180deg, #F2D376 0%,#f9ae2e 100%); color: #4f4f4f !important; font-weight: 500; padding: 8px 20px; }
.btn.more:hover { color: #000 !important; }
.btn.calc,
.Button { background-color: var(--color-background-primary); color: #fff; padding: 8px 40px;border: 2px solid var(--color-border);}

/* .btn.calc:hover { background-color: #12255F; color: #fff; } */
.btn.disabled { background-color: #ccc; color: #333; }
#contact_form .ThemesBlueButton.outer { padding: 0; }
#contact_form .ThemesBlueButton.outer input { margin: 0; }
.button_all_student_docs .ThemesBlueButton, .button_all_uni_docs .ThemesBlueButton { font-size: 12px; text-transform: none; margin: 10px 0; padding: 10px; color: #fff;}

.dropdown-menu a { text-decoration: none; }
/*
#content .err { background: #ffe5e5 url(../images/icon-info.png) 10px center no-repeat; border: 2px solid #fd4d4d; border-radius: 5px; color: #fd4d4d; display: block; float: left; font-size: 14px; margin: 5px -15px 0 0; max-width: 347px; padding: 8px 8px 8px 45px; }
#content .err br { display: none; }
fix into www_div_forms.css
*/
.alert-success { background: #CAEFCA url(../images/icon-success.png) 20px center no-repeat; border-color: #1C337B; color: #1C337B; font-size: 14px; padding: 8px 8px 8px 65px; }
.is-invalid + label { color: #fd4d4d!important; }

/* header { box-shadow: 0 4px 10px rgba(0,0,0,0.1); padding: 15px 0; } */
header .buttons { display: inline-block;}
/* header .buttons .btn { margin: 0 0 0 30px; }
header .buttons .btn.log-out { margin: 0 0 0 10px; } */
header .buttons .btn.signup { background-color: var(--color-background-primary);  color: #fff; }
header .buttons .btn.signup:hover { background-color: #f1f1f1;  color: #000;text-decoration: none;}
header img {max-height: 80px;max-width: 100%;}
header .logo {height: 80px;}

nav { display: inline-block; vertical-align: top; }
/* nav ul { margin: 8px 0 0 0; padding: 0; } */
nav li { display: inline-block; list-style: none; margin: 0 0 0 30px; position: relative; }
nav a { color: #aaa; font-size: 16px; text-decoration: none; }
nav a:hover { color: #000; }

.livechat { position: fixed; bottom: 40px; right: 50px; z-index: 99; color: transparent; font-size: 0;}
.livechat a { float: left; margin: 10px 0px 0px 0px;}
.livechat a:hover { opacity: 0.75; }

.hero { /* background: url(../images/bg-hero.png) top center no-repeat; */ color: #c2c2c2; font-size: 18px; padding: 0px;/* padding: 50px 0; */}
#content_page_797 .hero { padding: 50px 0; }
.hero h1 { font-size: 40px; font-weight: bold; margin: 0px 0 20px 0; }
.hero .video { position: relative; left: -90px; z-index: 2; }
.hero .video_popup img { display: none; }
.video_popup:after {
    content: url(../images/tm_logo-big.png);
}
.steps-top ul li a.video_popup:after {  content: unset; }
#content_page_580 .steps-top p a.video_popup:after, #content_page_557 .steps-top p a.video_popup:after {  content: unset; }
.howto_video_button { margin: 0 15px; }
.howto_video_button img { height: 40px; }

main { background: url(../images/world.png) center -30px no-repeat;   min-height: 500px;margin-top: 97px;padding-bottom: 100px;}
main h2 { color: var(--color-font-primary); font-size: 28px; font-weight: bold; margin: 0 0 30px 0; }
main h4 { color: #828282; font-size: 18px; margin: 0 0 30px 0; }

section.features { background: #12255F; background: linear-gradient(180deg, #1C337B 15%,#12255F 85%); color: #fff; font-size: 16px; padding: 50px 0; text-align: center; }
section.features .row { margin-bottom: 30px; }
section.features .row:last-child { margin-bottom: 0; }
section.features h3 { font-weight: bold; }
section.features2 { padding: 50px 0; text-align: center; }
section.features2 .row { margin: 0 0 25px 0; }

section.calc { padding: 0 0 50px 0; text-align: center; }
section.calc .form-field { border: 2px solid #E0E0E0; border-radius: 10px; display: inline-block; margin: 0 15px; padding: 10px; position: relative; }
section.calc .form-field span { background-color: #fff; color: #999; padding: 0 5px; position: absolute; top: -10px; left: 10px; }
section.calc select,
section.calc input { border: 0; color: #666; font-size: 16px; }
section.calc .note { color: #ccc; margin: 15px 0; }
section.calc .btn.calc { margin: 30px 0 0 0; }


section.steps-top ul { float: right; margin: 0 0 15px 0; padding: 0; }
section.steps-top li { display: inline-block; list-style: none; margin: 0 15px; vertical-align: center; }

section.steps .container { position: relative; }
/* need uset relative when calendar... */
.body_pageid_569 section.steps .container
, .body_pageid_572 section.steps .container
, .body_pageid_602 section.steps .container
, .body_pageid_767 section.steps .container
, .body_pageid_795 section.steps .container
, .body_pageid_815 section.steps .container
, .body_pageid_826 section.steps .container
, .body_pageid_828 section.steps .container
{ position: unset; }

section.steps div.steps-top {border: 2px solid #BDBDBD;
    border-radius: 10px;
    padding: 15px;
    position: absolute;
    top: 30px;
    right: 0;
    z-index: 2;}

section.steps div.steps-top ul { margin: 5px 0 15px 0; padding: 0; }
section.steps div.steps-top li { display: inline-block; list-style: none; margin: 0 15px; vertical-align: center; }
section.steps div.steps-top p { margin: 5px 0 15px 0; }
section.steps .row.noline { background-color: #fff; }
section.steps .total-label { float: left; font-weight: bold; width: 60px; }
section.steps .total-label.fullwidth { width: auto; }
section.steps .total-text { color: #000; float: left; width: calc(100% - 60px); }
section.steps .total-text em { color: var(--color-font-primary); display: block; font-size: 12px; }
section.steps .payment-option, section.steps .payment-option-error { align-items: center; border: 2px solid #eee; border-radius: 10px; cursor: pointer; display: flex; margin: 0 0 5px 0; overflow: hidden; transition: border-color 0.3s; }
section.steps .payment-option-error { padding: 5px; }
section.steps .payment-option:hover { border-color: #bbb; }
section.steps .payment-option.disabled {pointer-events: none; cursor:default;}
section.steps .payment-option.disabled:hover {pointer-events: none; cursor:default;}
section.steps .payment-option.active,
section.steps .payment-option.active:hover { border-color: var(--color-border);}
section.steps .payment-option .icon { text-align: center; width: 36px; }
section.steps .payment-option.active  { background-color: var(--color-background-secondary); }
section.steps .payment-option .icon i { background: url(../images/check-inactive.png) center center no-repeat; display: inline-block; height: 20px; vertical-align: middle; width: 20px; }
section.steps .payment-option.active .icon i { background: url(../images/check-active.png) center center no-repeat; }
section.steps .payment-option .text { background-color: #fff; border-left: 1px solid #eee; padding: 10px; width: calc(100% - 36px); transition: border-color 0.3s; }
section.steps .payment-option:hover .text { border-color: #bbb; }
section.steps .payment-option.active .text,
section.steps .payment-option.active:hover .text { border-color: var(--color-border);}
section.steps .payment-option .text p {  font-size: 18px; margin: 0; }
section.steps .payment-option .text h5 { font-size: 28px; font-weight: bold; line-height: 1; margin: 0; }
section.steps .payment-option .text .wire-transfer { color: #4CA84C; font-size: 17px; line-height: 15px; font-weight: 500; }
section.steps .payment-option .text .wire-transfer:before { background: url(../images/wire-transfer-left.png) center center no-repeat; content: ''; display: inline-block; height: 15px; margin: 0 5px 0 0; width: 13px; }
section.steps .payment-option .text .label { color: #4CA84C; font-size: 17px; line-height: 20px; font-weight: 500; }
section.steps .payment-option .text .logo { width: 35px; margin:0px 5px 0px 0px; }
section.steps .payment-option .text .logo.x2 { width: 70px; margin:0px 5px 0px 0px; }
section.steps .payment-option .text small { font-style: italic; }
section.steps .payment-option .text small.star:before { background: url(../images/star.png) center center no-repeat; content: ''; display: inline-block; height: 13px; margin: 0 5px 0 0; width: 13px; }
#payment-methods-wrapper {margin: 0px 0px 10px 0px;}
#payment-methods-wrapper .notification_box {margin: 10px 0px 10px 0px; background-position-y: center;}
#payment-methods-wrapper .notification_box.center-content {text-align: center;}

section.steps input[type="text"]:focus,
section.steps input[type="password"]:focus,
section.confirmed input[type="text"]:focus { box-shadow: none; outline: 0; }

section.steps #pp_number { padding: 0px; }

#calc_div select { padding: 0px; font-size: 13px; color: #000;}
.form-control.search { background: url(../images/icon-search.png) 95% center no-repeat; padding-right: 35px!important; }

/*
section.steps .form-field.amount label { left: 50px; z-index: 9; }
section.steps .form-field.amount .input-group { float: left; margin-right: 30px; width: 200px; position: relative; }
section.steps .form-field.amount .input-group-text { background-color: transparent; color: #999; }
section.steps .form-field.amount input { width: calc(100% - 35px); }
section.steps .form-field.amount + p { color: #999; float: left; font-size: 16px; padding: 10px 0; }
*/
.loginbox {margin: 0 auto;max-width: 550px;padding: 50px 0;}
section.steps .required { color: red; }
section.steps .form-group.valid { position: relative; }
section.steps .form-group.valid:after { background: url(../images/icon-valid.png) center center no-repeat; content: ''; display: inline-block; height: 20px; width: 20px; position: absolute; top: 13px; right: 0; }
section.steps .step.inner { display: none; }
section.steps .step.inner.active { display: block; }

.form-group { margin-bottom: 15px; position: relative; }

#search_form_rep_date_from.form-control-placeholder
, #bulk_refunds_period_date_to.form-control-placeholder
, #search_form_rep_date_to.form-control-placeholder
, #student_upload_passport_natid_expiration_date.form-control-placeholder
, #bulk_refunds_period_date_from.form-control-placeholder
{  background: #fff; font-size: 13px; z-index: 10; }

#search_form_rep_show_inactive_row { height: 30px; }
#search_form_rep_show_agent_payments_row { height: 60px; }
/* #search_form_rep_show_inactive, #search_form_rep_show_agent_payments {  margin: 19px 0 0 0; font-size: 16px; } */
/* #show_agent_payments {  margin: 3px 0px 0 160px; } */

/*.input-group-prepend + * + .form-control-placeholder { left: 45px; }*/
.form-control ~ .form-control-placeholder, #representer_contacts_notifications_products_ids { background-color: #fff; /*color: #999;*/ font-size: 13px; z-index: 10; }
#representer_contacts_notifications_products_ids { transform: translate3d(0, -4px, 0); }
.private_code_row { padding-top: 25px !important; }
/* .form-control:valid + .form-control-placeholder { background-color: #fff; color: #999; font-size: 13px; transform: translate3d(0, -20px, 0); z-index: 10; } */
.form-control:disabled, .form-control[readonly] { background-color: transparent; color: #ccc;}

#student_upload_invoice_and_receipt_upload_invoice_row,
#student_upload_invoice_and_receipt_upload_receipt_row { margin-left: 0; margin-right: 0; }
#student_upload_invoice_and_receipt_upload_receipt_form_text_paragraph,
#student_upload_invoice_and_receipt_upload_invoice_form_text_paragraph { margin-bottom: 20px; }
#student_upload_invoice_and_receipt_upload_invoice_row .col-lg-10,
#student_upload_invoice_and_receipt_upload_receipt_row .col-lg-10 { padding-right: 0; padding-left: 0; }

section.steps .ssl { background: url(../images/icon-lock.png) center top no-repeat; color: #b2b2b2; font-size: 12px; padding-top: 30px; }

section.confirmed { font-size: 14px; line-height: 1.5; }
section.confirmed .top button { float: right; margin: 0 0 0 15px; }
section.confirmed .top .form-group { float: right; }
section.confirmed h5 {  font-size: 16px; font-style: italic; font-weight: bold; }
section.confirmed h5:before { background-color: var(--color-background-primary); border-radius: 50%; color: #fff; content: attr(data-count); display: inline-block; height: 32px;  font-size: 20px; font-style: normal; line-height: 30px; margin: 0 10px 0 0; text-align: center; width: 32px; }
section.confirmed p { line-height: 2; margin: 0 0 15px 40px; }
section.confirmed ul { margin: 0 0 15px 60px; padding: 0; }
section.confirmed .alert ul { margin: 0 0 0 20px; }
section.confirmed ul li { line-height: 1.5; margin: 8px 0; }
section.confirmed .bank-details { background-color: #E5F6FF; border: 2px solid #0078BC; border-radius: 5px; color: #333; padding: 18px; }
section.confirmed .bank-details h4 { color: #333; }
section.confirmed table { width: 100%; }
section.confirmed table td { padding: 5px; vertical-align: top; }
section.confirmed table strong { font-weight: bold; }
section.confirmed .history thead th { background-color: #555; color: #fff; font-weight: bold; padding: 5px; text-align: center; vertical-align: middle; }

footer {background-color: #4F4F4F;color: #aaa;height: 100px;padding: 25px 0;text-align: center;display: block;box-shadow: 0px -1px 0px rgba(51, 51, 51, 0.16);clear: both;}
footer nav a {font-size: 12px;}
footer a { color: #fff;text-decoration: none;}
footer a:hover {color: #fff;text-decoration: underline;}

/* STUDENT CALCULATOR START */
#studentCalculatorCCcards, .section-calculator-result{ display: none; }

.table-comparison { color: #4d555a; font-size: 1.4em; margin: 0 0 30px 0; }
.table-comparison th { font-weight: bold; padding: 10px; text-transform: uppercase; }
.table-comparison td { padding: 10px; }

#studentCurrConverter, .student-calculator .col-xs-12 { width: 100%; }
.student-calculator { text-align: center; padding-top: 50px;}
.student-calculator input { cursor: pointer; }
.calculator .form-row-display-block { display: block;}
.student-calculator .tab-hero {display: none;}
.calculator .form-holder{ padding: 0px; }
.calculator .form-row:first-child { border-bottom: 1px solid #ddd; margin-bottom: 30px;}
.calculator .form-field { float: left; width: 50%; }
.calculator .form-field:first-child { text-align: right; }
.calculator .form-field:last-child { text-align: left; }
.calculator label { background-color: #fff; color: #999; padding: 0 2px; position: absolute; top: -10px; font-size: 12px; }
.calculator .form-element-wrapper {border: 2px solid #E0E0E0; border-radius: 10px; display: inline-block; margin: 0 15px; padding: 10px; position: relative;}
.calculator select { border: 0; color: #666; font-size: 16px;height: 30px; }
.calculator select.currency { margin: 0 15px 0 0; }
.calculator input[type="text"] { padding: 0px; border: none; font-size: 1.7em; }
.calculator input[type="text"]:focus {outline: none;}
.calculator input[type="reset"],
.calculator input[type="submit"] { background: #4d555a; border: 0; border-radius: 3px; color: #fff; float: left; font-size: 1.3em; padding: 15px 80px 15px 15px; text-align: left; text-transform: uppercase;  transition: background-color 0.3s; }
.calculator input[type="reset"]:hover { color: #fff; background-color: #1C337B; }
.calculator input[type="submit"] { background: #4d555a url(../images/icon-calc.png) 95% center no-repeat;}
.calculator input[type="submit"]:hover { background-color: #1C337B; }
.calculator .calculating  { background:  #1C337B url(../images/ajax-loader.gif) 95% center no-repeat !important; border: 0; border-radius: 3px; color: #fff; float: right; font-size: 1.3em; min-width: 270px; padding: 15px 80px 15px 15px; text-align: left; text-transform: uppercase;  transition: background-color 0.3s; }

.student-calculator  H2 { margin-bottom: 0px; }
.student-calculator  .note , .section-calculator-result  .note {	font-size: 1.1em; text-align: center; margin-bottom: 40px; }

.calculator input[type="text"][readonly] { border: 0; }
.calculator .ui-widget.ui-widget-content { background-color: #d7d7d7; border: 0; height: 4px; margin-bottom: 30px; }
.calculator .ui-widget-header { background-color: #1C337B;; border: 0; }
.calculator .ui-slider-horizontal .ui-slider-handle { background-color: #e4e6e6; border: 0; border-radius: 50%; box-shadow: 2px 2px 10px rgba(0,0,0,0.25); height: 32px; width: 32px; top: -16px; }

.section.grey { background: #e4e6e6 !important; }

.section-calculator-result .col-xs-12{ width: 100%; text-align: center; font-size: 1em; }
.section-calculator-result .white-box { background: #fff; color: #4d555a; font-size: 1.6em; font-weight: bold; margin-top: 50px; padding: 30px; }
.section-calculator-result .white-box strong { color: #1C337B;
    display: block;
    font-size: 1.5em;
    line-height: 1;
    margin: 0 0 5px 0;}
/* STUDENT CALCULATOR END */

/* Payment hitory comments modal */
tr.lines{
    border-bottom: 1px solid #C2C2C2;
}
tr.lines td, tr.lines th{
    padding: 10px;
}
tr.lines td:first-child, tr.lines th:first-child{
    border-right:  1px solid #C2C2C2;
}

.modal {
  /* --bs-modal-width: 800px; */
  max-width: 100%;
  padding: 0 10px;
}
/* END Payment hitory comments modal */

/* Label floating */
.label-floating label {
    position: absolute;
    color: #BDBDBD;
    bottom: 5px;
    left: 0;
    font-size: 16px;
    line-height: 1.42857143;
    z-index: 4;
    height: max-content;
    transition: 0.2s ease all;
    pointer-events: none;
    will-change: left, top, contents;
}

.label-floating.not-empty label{
    top: -10px;
    font-size: 12px;
}

.label-floating input:focus ~ label,
.label-floating textarea:focus ~ label {
    top: -10px;
    font-size: 12px;
    color: #009688;
}

.label-floating input,
.label-floating textarea{
    background: transparent !important;
    outline: none;
    box-shadow: none !important;
    border-radius: 0;
}
.label-floating input,
.label-floating textarea {
    border: 0;
    background-image: linear-gradient(#009688, #009688), linear-gradient(#D2D2D2, #D2D2D2) !important;
    background-size: 0 2px, 100% 1px !important;
    background-repeat: no-repeat !important;
    background-position: center bottom, center calc(100% - 1px) !important;
    background-color: rgba(0, 0, 0, 0) !important;
    transition: background 0s ease-out;
    float: none;
    box-shadow: none !important;
    border-radius: 0 !important;
}

.label-floating input:focus,
.label-floating textarea:focus{
    outline: none!important;
background-image: linear-gradient(#009688, #009688), linear-gradient(#D2D2D2, #D2D2D2)!important;
background-size: 100% 2px, 100% 1px!important;
box-shadow: none!important;
transition-duration: 0.3s!important;
}

/* </Label Floating  */

/*===== CC Payments Styles START*/

#cc_payments_holder {
    margin-top: 20px;
    font-size: 11px;
}

#cc_payments_holder .secure_payments_note {
    border-bottom: 1px solid #F0EFEF;
    padding-bottom: 10px;
    height: 45px;
    width: 100%;
    border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -webkit-border-radius: 0px 0px 5px 5px;
    margin-top:-10px;
    margin-bottom: 10px;
}

#cc_payments_holder .secure_payments_title {
    text-transform: uppercase;
    float: left;
    width: 90px;
    padding-left: 60px;
    background: url("../images/lock_icon_blue.png") no-repeat scroll 15px 0 transparent;
    height: 60px;
    line-height: 15px;
    vertical-align: middle;
    font-weight: bold;
    color: #3BB3DE;
    font-family: Calibri, Verdana,​Geneva,​Arial,​Helvetica,​sans-serif;
    cursor: default;
}

#cc_payments_holder .secure_payments_message {
	display: block;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    font-family: Calibri, Verdana,​Geneva,​Arial,​Helvetica,​sans-serif;
    font-weight: bold;
    color: #333;
    font-size: 14px;
    line-height: 16px;
    vertical-align: middle;
}

#cc_payments_holder .secure_payments_important_message {
    width: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 12px;
    padding: 10px 0px;
    margin-bottom: 20px;
    vertical-align: middle;
    background: #F7E1E1;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    border:1px solid #aaa;
}

#cc_payments_holder .payment_information {
    border-bottom: 1px solid #F0EFEF;
    border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -webkit-border-radius: 0px 0px 5px 5px;
    width: 100%;
    float: left;
    clear:both;
}

#cc_payments_holder .payment_information fieldset {
    border: none;
    border-top: 1px solid #F0EFEF;
    padding: 20px 0px 0px 0px;
    margin: 40px 0px 0px 0px 0px;
}

#cc_payments_holder .payment_information fieldset legend {
    font-family: ​Helvetica, Calibri, Verdana,​Geneva,​Arial,​sans-serif;
    font-weight: bold;
    font-size: 20px;
    text-align: center;
    padding: 0px 5px 0px 5px;
    width: 100%;
    clear: both;
}

#cc_payments_holder .data {
    width: 100%;
    float: left;
    clear:both;
}

#cc_payments_holder .data .info_row {
    padding: 5px 0px 5px 20px;
    background: url("../images/arrow_left.gif") no-repeat scroll 5px center transparent;
    vertical-align: middle;
    line-height: 20px;
    float: left;
    border-bottom: 1px solid #F0EFEF;
}

#cc_payments_holder .data .info_row .left {
    width: 110px;
    float: left;
}

#cc_payments_holder .data .info_row .right {
    width: 180px;
    float: left;
    font-weight: bold;
}

#cc_payments_holder #iframe_holder {
    float: left;
    width: 100%;
    min-height: 300px;
    text-align: center;
    clear: both;
    margin: 50px auto;
}

#gs-status-message, .cc_payment_status_message {
    width: 100%;
    padding: 10px 0px 10px 0px;
    margin: 20px 0px 20px 0px;
    background-color: #F0EFEF;
    border-radius: 5px;
    font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
    font-size: 14px;
    text-align: center;
    vertical-align: middle;
    line-height: 20px;
}

.gs-pay-button {
    border-radius: 5px;
    width: 200px;
    height: 40px;
    cursor: pointer;
    font-weight: bold;
    background-color:#26a926;
    color:#fff;
    margin: 10px;
}

#gs-preloader-holder {
    width: 100%;
    clear: both;
    margin: 10px 0px 10px 0px;
    text-align: center;
}
/*===== CC Payments Styles END */

/* Schedule an online demo today START */
#demo #__image_captcha_text{
    width: 100px;
    min-width: 100px;
	position: inherit;
}

#demo #__image_captcha_redraw{
    width: 32px;
    min-width: 32px;
    height: 32px;
    float: right;
    margin: 5px 0px 0px 0px;
    padding: 0px;
    color: transparent;
    background: url(../images/redraw_button.png) no-repeat scroll center center transparent!important;
    border:none;
}

#demo #image_captcha_ximg{
    float: right !important;
    margin-top: 7px;
    margin-left: 0px;
}

  #content #demo .err
, #content #contact_form .err{
    clear: both;
				float: left;
				color: #c00;
				font-size: 14px;
				font-weight: bold;
				text-align: left;
				background: none;
				border: 0px;
				padding: 0px;
				margin: 0px;
}

section.demo .submit-row .col-xs-12 { margin: auto; text-align: center; }

section.demo input[type="submit"], section.contact input[type="submit"], section.contact .contactchat {
    background:  var(--color-background-primary);
    border: 0;
				border-radius: 10px;
    color: #fff;
    font-size: 1.2em;
    padding: 10px 20px;
    text-transform: none !important;
				text-decoration: none !important;
    transition: background 0.3s;
				text-align: center;
}
/* need fix for chrome */
section.demo input[type="submit"]{
    display: block;
}

section.demo input[type="submit"]:HOVER, section.contact input[type="submit"]:HOVER, section.contact .contactchat:HOVER {
    background: #12255F;
}
/* Schedule an online demo today END */



.err, .error{
    color: #c00;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

.error{
    font-size: 16px;
}

.empty_message{
    color: #c00;
    font-size: 22px;
	font-weight: normal;
    text-align: center;
	line-height: 25px;
    padding: 80px;
	min-height: 200px !important;
}

.result_message{
    color: #c00;
    font-size: 1.5em;
    text-align: center;
    padding: 0px 0px 10px 0px;
}

.attention_message{
    color: #c00;
	   font-size: 0.9em;
	   padding: 0px 50px 20px 50px;
	   max-width: 800px;
	   margin: auto;
    margin-bottom: -50px;
}

.thanks_message{
    color: #c00;
    text-align: center;
    display: table;
    margin: auto;
    font-size: 16px;
    font-weight: 700;
}
/* Schedule an online demo today END */

/* MAIN CONTACT FORM */
section.contact FORM { width: 90%; }
section.contact .form-control {width: 100%; max-width: 100%;}
section.contact #comments { height: 100px; }
section.contact .ThemesBlueButton { text-align: center; }
section.contact #button_subscribe { width: auto; padding: 8px 40px; text-transform: capitalize !important; }
::-webkit-input-placeholder { /* WebKit browsers */
    text-transform: none;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    text-transform: none;
}

::-ms-input-placeholder { /* Recent browsers */
    text-transform: none;
}
::placeholder { /* Recent browsers */
    text-transform: none;
}
/* END OF MAIN CONTACT FORM */


section.benefits { font-size: 18px; padding: 75px 0; }
section.benefits h2 { text-align: center; }
section.benefits ul { margin: 0; padding: 0; text-align: center; }
section.benefits li { display: inline-block; list-style: none; padding: 10px; vertical-align: top; width: 175px; }
section.benefits img { display: block; margin: 0 auto 10px auto; }

section.security { background-color: #F2F2F2; font-size: 18px; padding: 50px 0; }
section.security h2 { text-align: center; }

section.regulation {font-size: 18px; padding: 50px 0; }
section.regulation h2 { text-align: center; }


.text-green {color: #0d9341;}
.text-blue {color: #1C337B;}

.features-top,
.features-bottom,
.footer-top { display: none; }

.section_form_signup {
    display: grid;
    grid: auto / calc(33% - 50px) calc(66% - 50px);
    grid-gap: 100px;
    justify-content: space-between;
    grid-template-areas: "aside form";
  }
  .section_form_signup .form{
    grid-area: form;
    /* justify-self: end;
    width: 100%; */
    border-radius: 16px;
  }

.section_form_signup ol li.current.valid::before {
    border-color: var(--color-border-primary);
    color: var(--color-font-primary);
  }

.section_form_signup h3{
    font-size 24px;
    color: #4F4F4F;
    margin-bottom: 30px;
}

.section_form_signup aside {
    background: #FFF;
    border-radius: 16px;
    font-size: 20px;
    padding: 24px;
    height: max-content;
    display: grid;
    overflow-y: auto;
    overflow-x: hidden;
    overflow-wrap: break-word;
    position: -webkit-sticky;
    position: sticky;
    top: 150px;
    grid-area: aside;
    user-select: none;
    width: 100%;
}

.section_form_signup aside .text_block{
    font-size: small;
    margin-top: 10px;
}

.section_form_signup aside .text_block h3{
    font-size: medium;
    margin-bottom: 10px;
}

.section_form_signup aside h1 { font-weight: bold;}
.section_form_signup ol {list-style: none;margin: 0;padding: 0;}
.section_form_signup aside .navigation li { margin-bottom: 15px; }
.section_form_signup aside .navigation li::before { float: left; content: counter(list-item); border: 2px solid #ccc; border-radius: 50%; color: #ccc; display: inline-block; font-size: 14px; font-weight: bold; height: 24px; line-height: 22px; margin-right: 10px; text-align: center; width: 24px; position: relative; top: -2px; }
.section_form_signup aside .navigation li { color: #ccc; font-weight: bold; pointer-events: none; text-decoration: none;cursor: pointer; }
.section_form_signup aside .navigation li h4 {
    margin: unset;
  }
.section_form_signup aside .navigation li.current,
.section_form_signup aside .navigation li.valid.current,
.section_form_signup aside .navigation li.current h4,
.section_form_signup aside .navigation li.valid.current h4
 { color: var(--color-font-primary); }

.section_form_signup aside .navigation li.valid.current::before{
    content: counter(list-item);
}
.section_form_signup aside .navigation li.current::before,
.section_form_signup aside .navigation li.current.valid::before { border-color: var(--color-font-primary); color: var(--color-font-primary); }
.section_form_signup aside .navigation li.valid,
.section_form_signup aside .navigation li.valid h4 { color: #4EA01C; pointer-events: initial; }
.section_form_signup aside .navigation li h4 { color: #CCC;}
.section_form_signup aside .navigation li.valid::before { content:"✔️";border-color: #4EA01C; color: #4EA01C; }
.section_form_signup aside .navigation li.valid:hover { text-decoration: underline; }

.input_error {
    width: 100%;
    margin: 5px auto;
    font-size: 12px;
    font-style: italic;
  }

.invalid, .invalid > * {
    color: #D00000 !important;
    border-color: #D00000 !important;
}
.bordered_input_group{
    position: relative;
}

.btn{
    border: 2px solid var(--color-border);
    border-radius: 5px;
    box-shadow: none;
    color: #000;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    padding: 8px 16px;
    text-decoration: none;
    text-transform: none;
    transition: background-color 0.3s;
}

.btn_primary,.btn_secondary:hover{
    background: var(--color-background-primary);
    color: #FFF;
}

.btn_secondary,.btn_primary:hover{
    background: #FFF;
    color: var(--color-font-primary);
    border: 2px solid var(--color-border);
}

#username_info {
    background: lightgray;
    padding: 15px;
    border-radius: 4px;
  }

  .howto_video_wrap iframe {
  max-width: 100%;
}

@media (max-width: 1200px) {
  section.demo .col-sm-6, section.demo .col-lg-3 { width: 50%; max-width: 50%; flex: none; }
  section.demo .form-field { display: block; margin: 0 0 15px 0; text-align: left; }
  section.demo .form-field.captcha { display: inline-block; }
  section.demo input { width: 100%; max-width:100%; }
  section.unis li { margin: 15px; }
  /* section.steps .container { background-position: 78px 0; } */

  .section_form_signup {width: 100%;}
}
@media (max-width: 991px) {

    nav li {
        margin: 0 0 10px;
      }
  header { text-align: center; }
  header .menu { text-align: center; }
  .hero { padding: 50px 0; }
  .hero h1 { margin: 20px 0; }
  section.features { padding: 50px 0; position: static; }
  section.calc { padding: 50px 0; }
  section.calc .form-field { display: block; margin: 0 0 15px 0; text-align: left; }
  section.calc input, section.calc select { width: 100%; }
  section.contact .form-field { width: 100%; }
  section.steps-top { text-align: center; }
  section.steps-top ul { float: none; padding-top: 30px; }
  /* section.steps .container { background: none; } */
  section.steps .form-field.amount label { left: 40px; }
  section.confirmed .top button { float: none; margin: 0 0 30px 0; }

  section.demo .col-sm-6, section.demo .col-lg-3 { width: 100%; max-width: 100%; flex: none; }
  section.security img { margin-bottom: 30px; }
  section.steps div.steps-top, section.steps div.steps-top-right { text-align: center; position: static; }

  /* exceptions to fix label misalignment */
  #student_sign_up_sum_total_eur_form_input label { top: 0px !important;}
  #agent_pay_student_fees_sum_total_eur_form_input label { top: 0px; }
  #forgotten_password_image_captcha_form_input label, #student_sign_up_india_fee_exceed_form_input label { top: 0px; }
  #search_form_rep_date_from, #search_form_rep_date_to { top: 0px; }
/*  #agent_pay_student_fees_cu_id_number_form_input label { top: 0px; } */
  #uni_representative_reg_private_code { /*width: 450px !important;  max-width: initial;*/ top: -30px; }
  #request_refund_ref_number, #request_refund_student_name {top: -1px;}

  section.steps .student_payment_instructions h4 { line-height: 1.1; /*margin: 0 0 50px 0 !important;*/}
}


/* google translation fix */
#google_translate_element { height: 30px;overflow: hidden;margin-left: 10px;}
#google_translate_element select { background-color: rgba(255,255,255,0.20)!important; border: 1px solid #6a6a6a !important; border-radius: 4px!important; display: inline-block; cursor: pointer; padding: 3px;}
#popup_window #google_translate_element { float: left; width: 100%; clear: both; margin-bottom: 20px; height: 25px; }
/* END OF google translation fix */

/* overwrite www_div_forms.css */
#content .form_table_outframe { border: 0; }
#content .section_label { background: transparent; min-height: 64px; line-height: 1; overflow: hidden; position: relative; }
#content .section_label h4 { position: absolute; top: 0; left: 50px; }

/* Section label 1 note text paragraph added */

.section-form-label-text span.section-form-text,#content .section-form-text, #content .section-text { color: #828282; display: block; font-size: 28px; font-weight: 700; margin: 15px 0px 0px 16.667%; text-transform: none; }
.section-form-note-text { font-size: 13px;
    background: linear-gradient(0deg, rgba(0, 210, 174, 0.2), rgba(0, 210, 174, 0.2)), #FFFFFF url(../images/icon-info2.png) 10px 10px no-repeat;
    border-radius: 5px;
    padding: 8px 8px 8px 45px;
    margin-bottom: 20px;
    color: #4F4F4F;
    line-height: 1.6em;
    text-transform: none !important;}
.section-form-note-text a { text-decoration: none;}



/* #content .form_under_text_paragraph { margin-left: 16.667%; } */
#content .form-control { border-radius: 5px;}

/* Fix for Safari drop-downs only start */
@supports (-webkit-backdrop-filter: blur(1px)) {
    #content select.form-control { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 98% 50%; min-height: 30px;}
}

#content textarea.form-control { height: 100px !important; }
/* Fix for Safari drop-downs only end */
#content .input-group .input-group-text { background: transparent; height: 100%; }


/* #content .name_of_payer .form-control,
#content .nationality_of_payer .form-control,
#content .relationship_to_student .form-control,
#content .contact_address_linked .form-control,
#content .contact_telephone_number .form-control,
#content .contact_email_linked .form-control { border-radius: 0 5px 5px 0; }
#content .tuition_fees label,
#content .accommodation_service label,
#content .enrolment_fee label,
#content .pay_other label, */
#content .sum_total_eur label
/* #content .name_of_payer label,
#content .nationality_of_payer label,
#content .relationship_to_student label,
#content .contact_address_linked label,
#content .contact_telephone_number label,
#content .contact_email_linked label*/
 { margin-left: 19px; }
#content .sum_total_eur label {  font-size: 16px; font-weight: bold;color: var(--color-font-primary); }
/*
#content .wiretransferpaymentinfo { margin-left: 80px; }
#content .wiretransferpaymentinfo,
#content .ccpaymentinfo { background: transparent; border-top: 0; float: none; overflow: hidden; padding: 0 0 0 15px; width: auto; }
#content .ccpaymentinfo { padding: 0; }
#content .ccpaymentinfo label { margin-top: 10px; }
#content .rate_live_calc_form_left_info { margin-right: 0; }
#content .rate_live_calc label { display: inline-block; margin-top: 15px; }
#content .cc_transfer_label.selected,
#content .wire_transfer_label.selected { background-position: center left; }
#content .cc_transfer_label,
#content .wire_transfer_label { background-position: center left; }
*/

#content .form_under_text_paragraph,
#content .form_under_info { color: var(--color-font-primary); font-size: 12px; font-weight: normal; margin-top: 5px;}
/* #content .form_under_text_paragraph { padding: 0 15px; } fixed into www_div_forms.css */
/* #__home_phone_number_mobile_phone + label { padding: 10px 25px; } */


/* UPDATED SITE TEMPLATES */
/* how it works */
.how_it_works_holder { display: flex; justify-content: space-between; padding: 50px 0; text-align: center; }
.how_it_works_box_model { vertical-align: top; width: 30%; position: relative; }
.how_it_works_box_model .header {  font-size: 18px; font-weight: 500; }
.how_it_works_box_model .header h5 { font-size: 18px; font-weight: bold; margin: 0 0 15px 0; }
.how_it_works_box_model .header h6 { font-size: 18px; font-weight: bold; }
.how_it_works_box_model .header i { display: block; height: 60px; margin: 0 0 15px 0; }
.how_it_works_box_model.box1 .header i { background: url(../images/icon-register.png) top center no-repeat; }
.how_it_works_box_model.box2 .header i { background: url(../images/icon-payment-how.png) top center no-repeat; }
.how_it_works_box_model.box3 .header i { background: url(../images/icon-completed.png) top center no-repeat; }
.how_it_works_box_model .footer { padding: 15px; }
.how_it_works_holder .spacer { display: none; }
.howto_video_wrap { margin: 0px auto 20px;   display: table; }
#content_page_547 .button_wrap { text-align: center; }
#pages_content_929 h1 {text-align: center; margin: 50px 0 0 0; }

/* contacts */
h1,
#pages_content_902 {color: #4F4F4F;font-size: 34px;font-weight: unset;}
.phones_row { clear: both; overflow: hidden; }
.skype_link { float: right; margin: 0px 60px 10px 0px; }
.div_contact_col { float: left; padding: 15px 0; width: 33%; }
.div_contact_col strong { color: #000; }
.separator { display: none; }




/* security */
/* .hero { background: none; } */
main h2 { color: #000; }
section.blue { background-color: transparent!important; }
section.steps h3.green { background-color: transparent!important; color: #5bba44; }
.faq .logos ul { text-align: center; }
.faq .logos li { display: inline-block; margin: 10px; }

/* faq */
#faq_head { padding: 30px 0; }
#faq_head a { display: block; margin: 0 0 10px 0; }
#faq_head br { display: none; }
.faq_title { color: #0ca1d6; font-weight: bold; height: 100%; margin: 1.5em 0 5px; padding-top: 5px; }
.faq_separator { display: none; }
.faq_separator_top { background-color: #fff; float: right; font-size: 13px; padding: 5px; text-align: right; position: relative; }
.faq_separator_top a { text-decoration: none; }

/* forgotten password */
#image_captcha_ximg {grid-column-start: 3;border-left: 2px solid var(--color-border);max-width: 100%;border-top-right-radius: 5px;border-bottom-right-radius: 5px;justify-self: end;}
/* terms and conditions */
#popup_window { /* background-color: #eff2f4;*/ padding: 10px; }
#popup_window > br { display: none; }
#inner_text { background-color: #fff; display: block; padding: 10px; }

#main_T_and_C { padding: 10px; color: #486182; }
#main_T_and_C .title { font-family:  'Rubik', Arial, sans-serif; font-size: 15px; color: #486182; font-weight: bold; text-align: center;  font-size: 23px; margin: 10px; display: block;}
#main_T_and_C table, #main_T_and_C td, #main_T_and_C th {border: 2px solid black !important;}
#main_T_and_C table.striped{
    color: #568AC2;
    font-size: 12px;
}

#popup_window #google_translate_element { margin-left: 0; padding-left: 10px; height: 28px; }

/* register_uni */
#uni_representative_reg_private_code BR {display: none; }

/* student welcome */

/* manage products */
#pages_content_931 #navigation_menu { margin-bottom: 15px; }

/*===== Payment Summary Table */

#paymentSummaryTable .grid_title h2 {
    font-size:22px;color:#bbb;margin:0;font-weight:700;border:none;width:100%;background-color:transparent;text-align:center;
    height: 64px;line-height: 55px;
}

#paymentSummaryTable table.striped {

border-top:1px solid #274185;border-bottom:2px solid #274185;font-size:16px;width:100%
}

#paymentSummaryTable table.striped tr td {
padding:0 0 10px 0;text-align:center
}

#paymentSummaryTable .striped thead tr td {
color:#274185;font-weight:bold;padding-top:10px;text-align:center
}





.cclogos {
    margin: 10px 0px;
}

/*===== Payment Summary Table END */


.print_box_wrapper {
    float: right;
}

#print_box {
    float: right;
    margin: 10px 0px 10px 0px;
}

.print_btn_confirm {
    cursor: pointer;
    font-weight: bold;
    font-size: 12px;
    padding: 0 5px;
}

.print_btn_confirm a {
    background-color: var(--color-background-primary);
    color: #fff;
    border-radius: 10px;
    padding: 8px 16px;
    text-decoration: none;
    font-size: 16px;

    display: block;
    float: left;
}

#content .calendarButton {
    background-color: transparent!important;
    margin: 10px 0 0 10px!important;
}

#navigation_menu a { display: inline-block; margin-right: 15px; }
#navigation_menu a img { margin-right: 5px; }

.hidden { display:none!important ;}

.student-welcome { overflow: hidden; /*padding: 25px 0 50px 0;*/ text-align: center; }
#content_page_554 .student-welcome, #content_page_586 .student-welcome, #content_page_598 .student-welcome, #content_page_829 .student-welcome { padding: 25px 0 50px 0; }
.student-welcome .box { display: inline-block; text-align: center; width: 360px; vertical-align: top; padding: 0;}
#content_page_773 .student-welcome .box { width: 270px; }
#pages_content_1088 .student-welcome .box { width: 230px; }
#content_page_811 .student-welcome .box, #content_page_894 .student-welcome .box { width: 230px; margin-bottom: 0px; }
#content_page_811 .student-welcome .Button, #content_page_894 .student-welcome .Button { margin: 15px 0 0 0; }
.student-welcome .box p { color: #BDBDBD; margin: 0 auto 15px auto; max-width: 215px; }
.student-welcome .Button { margin: 15px 0 25px 0; }
.student-welcome A { min-width: 50%; }

.student-welcome .alert .Button:after { background: url(../images/icon-alert.png) center center no-repeat; content: ''; display: inline-block; height: 24px; width: 24px; margin: -20px 0 0 27px; position: absolute; }

.last-payment { text-align: center; margin: 50px 0 0 0;}
.last-payment h2 { color: #c2c2c2; font-size: 24px; font-weight: bold; margin: 0 0 10px 0; }
.last-payment table { border-top: 1px solid #274185; border-bottom: 3px solid #274185; }
.last-payment table th,
.last-payment table td { padding: 5px 10px; width: 28%; }
.last-payment table th { color: #274185; font-size: 16px; font-weight: bold; padding-top: 10px; }
.last-payment table tr:last-child td { padding-bottom: 10px; }
.last-payment .next-step.right { float: none;   display: inline-block;  margin: 0px 0px 0 10px;   vertical-align: middle; }
.last-payment td a.details i { background: none !important; border: 2px solid #274185; width: auto; border-radius: 5px; color: #274185; display: inline-block; margin-left: 2px; padding: 0 5px; text-decoration: none; line-height: 21px; font-size: 12px;}
.last-payment td a.details i:HOVER { border-color: #f9ae2e; color: #f9ae2e;}
.last-payment .cc_payment, .last-payment .invalid_payment { display: none; }



.trust_encription { clear:both; padding:120px 0px 50px 0px;}

#pages_content_1043 #transfer_order_wrapper {
    display: none !important;
}

.student_payment_instructions .info_table UL { padding-left: 15px; }

/*
.details_wrapper { padding: 10px 0px 10px 0px; width: 100%; position: relative; }
.details_row { overflow: hidden; width: 100%; position: relative; }
.details_row .details_label { float: left; font-weight: bold; margin: 5px 0 0 20px; width: 30%; position: relative; }
.details_row .details_value { float: left; margin: 5px 0 0 10px; width: 60%; position: relative; }
*/
.refund_bank_details { table-layout: fixed; width: 100%; font-size: 10px; }
.refund_bank_details .left_column { font-weight: bold; color: #000; }
table.refund_bank_details { border-spacing: 0px; margin-top: -20px;}
table.refund_bank_details  td { float: left; padding: 0px !important; clear: both; padding: 0px; }
table.refund_bank_details  td.left_column { padding-top: 20px !important;  }

.details_wrapper { display: flex; justify-content: space-between; }
.details_wrapper span { display: flex; justify-content: space-between; }
.details_wrapper .item { background-color: #fff; border: 2px solid #eee; margin: 0 10px; padding: 0 10px; flex-basis: 50%; flex-grow: 0; }
.details_wrapper table { width: 100%; }
.details_wrapper table th { border-bottom: 1px solid #eee; color: #000; font-size: 21px; padding: 10px; text-align: center; }
.details_wrapper table td { color: #898989; font-size: 14px; padding: 10px; }
.details_wrapper table td strong { color: #000; display: block; }
.details_wrapper table td .amount { color: #274185; display: block; font-size: 18px; }
.details_wrapper table td input.btn { border: 2px solid #274185; border-radius: 5px; color: #274185; display: inline-block; margin-left: 5px; padding: 0 5px; text-decoration: none; }
.details_wrapper table td input:hover { border-color: #000 !important; }
input.transactions_details_button:hover {  border-color: #f3b02f !important; }
.details_wrapper table td b { font-weight: bold; }
.details_wrapper table td input { color: black; width: 100%; text-align: left; border-radius: 5px; color: #000; display: block; margin: 0 0 5px 0; padding: 10px 15px 10px 40px; text-decoration: none;}
.details_wrapper table td input.confirm { background: url(../../../../images/transfermateeducation/icon-confirm.png) 10px center no-repeat; border: 2px solid #274185; }
.details_wrapper table td input.extend { background: url(../../../../images/transfermateeducation/icon-extend.png) 10px center no-repeat; border: 2px solid #f3b02f; }
.details_wrapper table td input.cancel { background: url(../../../../images/transfermateeducation/icon-cancel.png) 10px center no-repeat; border: 2px solid #9e0b0f; }
.details_wrapper table td .confirmed { color: darkred; font-weight: bold; }
.details_wrapper .next-step a i { background: none !important; border: 2px solid #274185; width: auto; border-radius: 5px; color: #274185; display: inline-block; margin-left: 5px; padding: 0 5px; text-decoration: none; height: auto;}
.details_wrapper .next-step a i:HOVER { border-color: #f9ae2e; color: #f9ae2e;}
.details_wrapper .next-step.right { float: none; display: inline-flex; }
.transaction_paid_confirmation_msg .ThemesBlueButton input, input.transactions_details_button { border-radius: 5px; ; display: inline; margin: 0 0 5px 0; text-decoration: none;}
.transaction_paid_confirmation_msg .ThemesBlueButton input.confirm, input.transactions_details_button { background-color: white; border: 2px solid #274185; }
.transaction_paid_confirmation_msg .ThemesBlueButton input.extend {  background-color: white; border: 2px solid #f3b02f; }
.transaction_paid_confirmation_msg .ThemesBlueButton input.cancel {  background-color: white; border: 2px solid #9e0b0f; }

.paid_confirmation_cell { text-align: center; }
.paid_confirmation_cell .ThemesBlueButton { font-size: 12px; margin: 0; }
.transaction_paid_confirmation_msg .ThemesBlueButton { margin: 0 20px; }
.transaction_paid_confirmation_msg { text-align: center;  margin: 10px; }
.transaction_paid_confirmation_msg p {  margin: 20px 10px; font-size: 16px; font-weight: normal; }
.transaction_paid_confirmation_msg input[type="submit"].Confirm {background-color: white; border: 2px solid #274185; color: #274185 !important; }
.transaction_paid_confirmation_msg input[type="submit"].extend {background-color: white; border: 2px solid #f3b02f; color: #f3b02f !important; }
.transaction_paid_confirmation_msg input[type="submit"].Cancel {background-color: white; border: 2px solid #9e0b0f; color: #9e0b0f !important; }
.transaction_paid_confirmation_msg input[type="submit"]:hover { color: black !important; visibility: 10%; }
.get_payment_details { float: left;	padding: 10px; clear: both; display: block; }
.get_payment_details a { color: #000; font-size: 14px; }

/*
.transaction_paid_confirmation_msg
.details_wrapper table td input.confirm:hover,
.details_wrapper table td input.extend:hover,
.details_wrapper table td input.cancel:hover { border-color: #000; }
.details_wrapper table td p { margin: 0 0 5px 0; }
*/

#comments { width: 100%; }
#comments h2 { color: #fff; }
#comments .noCommentsContent { text-align: center; }
#addNewComment, #editComment, #deleteComment, #downloadXLS { border: 0; cursor: pointer; height: 40px; margin: 5px; padding: 0; }
#addNewComment { background: url(../images/comments-add-icon.png) no-repeat center center; width: 40px; }
#downloadXLS { width: 40px; background: url(../images/export-excel-icon.png) no-repeat center center; }
#downloadXLS:disabled { background: url(../images/export-excel-icon-disabled.png) no-repeat center center; cursor: not-allowed; }


.key-stats { display: flex; justify-content: space-between; overflow: hidden; padding: 25px 0 50px 0; width: 100%;}
.key-stats img { max-width: 100%; }
.key-stats .box { border: 2px solid #BDBDBD; margin: 5px; overflow: hidden; padding: 15px;  width: 350px; }
.key-stats .box .icon { float: left; width: 35%; }
.key-stats .box .right { float: right; text-align: left; width: 60%; color: var(--color-font-primary); font-size: 16px;}
.key-stats .box strong { display: block; font-size: 35px; line-height: 1; margin-top: 10px; }
.key-stats .box1 strong { color: #FD4D4D; }
.key-stats .box2 strong { color: #0078BC; }
.key-stats .box3 strong { color: #F2C94C; }
.key-stats .box em { color: #BDBDBD; font-size: 16px; }





#pages_content_2908 #navigation_menu
{
    height: 100%;
}

#pages_content_2908 #navigation_menu A
{
    margin: 7px;
}


.passport_upload {color: #ffffff!important}
.passport_upload_wrap {float: left; font-size: 14px;}
.excel_download_wrap {float: right;}

.files_uploaded_wrap {display:none;}
.files_uploaded {font-size: 19px;}
.files_uploaded p, .files_uploading_wait p {margin: 5px 30px; text-align: center;}
.files_uploaded .btn_files_uploaded_close {float: right;}

.rebranding_msg_img {
    float: left;
    margin: 50px 25px;
}
.rebranding_msg {
    margin: 10px;
    font-family: 'Rubik';
}

.message-box {
    padding: 10px 0px 10px 0px;
    width: 100%;
    font-size: 16px;
    line-height: 30px;
    text-align: center;
    border-radius: 5px;
    background-color: #ffffff;
}

.message-box.success {
     background: repeating-linear-gradient(
        -45deg,
        #DFF2D5,
        #DFF2D5 10px,
        #DFF2D0 10px,
        #DFF2D0 20px
    );
}

#form_notes {
    position: relative;
    float: left;
/*    padding-top: 20px;*/
    margin: 0px;
    width: 100%;
}

/* Password Policy (Form Fields) START */
.password_requirements {
    font-size: 11px;
    margin-top: 10px;
}

.password_requirements_title {
    font-weight: bold;
    text-decoration: underline;
}

.password_requirements_rules ol {
  margin-left:20px;
  padding-left: 0px;
  font-weight: normal;
}
/* Password Policy (Form Fields) END*/

/* .header.transaction_status_header {width: 100px;} */
.details_row { overflow: inherit; }
.details_row:after { clear: both; content: ''; display: block; height: 1px; width: 1px; }
.next-step { font-style: normal; position: relative; }
.next-step.right { float: right; }
.details_row .next-step.right { float: none; display: inline; }
.next-step a { color: #000; text-decoration: none; }
.next-step a i { display: inline-block; height: 20px; margin-right: 5px; vertical-align: text-bottom; width: 20px; }
.next-step.step_pending a i { background: url(../images/icon-progress.png) center center no-repeat; }
.next-step.step_received a i { background: url(../images/icon-inprogress.png) center center no-repeat; }
.next-step.step_successful a i { background: url(../images/icon-complete.png) center center no-repeat; }
.next-step.step_refused a i { background: url(../images/icon-not_complete.png) center center no-repeat; }
.next-step.step_not_complete a i { background: url(../images/icon-not_complete.png) center center no-repeat; }
.next-step.step_invalid a i { background: url(../images/icon-not_complete.png) center center no-repeat; }

.next-step.step1 a i { background: url(../images/icon-progress.png) center center no-repeat; }
.next-step.step2 a i { background: url(../images/icon-inprogress.png) center center no-repeat; }
.next-step.step22 a i { background: url(../images/icon-inprogress2.png) center center no-repeat; }
.next-step.step3 a i { background: url(../images/icon-complete.png) center center no-repeat; }
.next-step.step33 a i { background: url(../images/icon-complete2.png) center center no-repeat; }
.next-step .box { display: none; background-color: rgba(0,0,0,0.8); border-radius: 5px; font-size: 13px; width: 320px; position: absolute; z-index: 200; }
.next-step .box.left { right: 102%; top: 0; transform: translateY(-50%); }
.next-step .box.right { left: 100%; top: 0; transform: translateX(10px) translateY(-50%); }
.next-step .box:before { border-style: solid; content: ''; height: 0; width: 0; position: absolute; top: 50%; }
.next-step .box.left:before { border-width: 10px 0 10px 10px; border-color: transparent transparent transparent rgba(0,0,0,0.8); left: 100%; }
.next-step .box.right:before { border-width: 10px 10px 10px 0; border-color: transparent rgba(0,0,0,0.8) transparent transparent; right: 100%; }
.next-step .box .title { background-color: #000; border-radius: 5px 5px 0 0; color: #fff; font-size: 13px; line-height: 1.2; padding: 15px; }
.next-step .box .title strong { color: #ffae00; display: block; font-size: 10px; margin-bottom: 5px; text-transform: uppercase; }
.next-step .box .stages { padding: 15px; }
.next-step .box .stages p { background: url(../images/icon-progress.png) top left no-repeat; color: #808080; padding: 0 0 0 30px; }
.next-step .box .stages p.inprogress { background: url(../images/icon-inprogress.png) top left no-repeat; color: #ffae00; }
.next-step .box .stages p.not_complete { background: url(../images/icon-not_complete.png) top left no-repeat; color: #ff0054; }
.next-step .box .stages p.complete { background: url(../images/icon-complete.png) top left no-repeat; /*text-decoration: line-through;*/ color: #2CEEAC; /*#52B600;*//*#ff0054;*/ }

/* BULK PAYMENTS CSS START, will be delete after finish project
.bulk_refunds { display: none !important; }
#body_linkid_2020 .bulk_refunds { display: block !important; }
#body_linkid_2118 .bulk_refunds { display: block !important; }
#body_linkid_601 .bulk_refunds { display: block !important; }
BULK PAYMENTS CSS END, will be delete after finish project */
.bulk_refunds img.bulk_refunds_example {width: 100%;}




body.knowledge_base .header {
    /*background: url("https://transfermateeducation.com/templates/partners/images/header-faq.jpg") center top no-repeat;*/
    background-size: cover;
    min-height: 459px;
}
body.knowledge_base .header h2 {
    margin-top: 5rem;
}

main section{
   padding: 25px 0;
}

.main section.page_tpl h2 {
    font-size: 3rem;
    margin-bottom: 2rem;
}
.main section.page_tpl h3 {
    font-size: 2.4rem;
    font-weight: normal;
    text-align: inherit;
    color: #000;
}
.main section.page_tpl.page_tpl_top { text-align: center; }
.main section.page_tpl_main {
    background-color: #f8f9fb;
    color: #000;
}
.main .page_tpl img {
    margin: 0.75rem 0.75rem 1.2rem;
    border-radius: 0px;
    box-shadow: 6px 6px 8px #d3d4d5,
                -6px -6px 8px #ffffff;
}
.main .page_tpl ul {
    list-style: disc;
    padding-top: 0;
}
.main .page_tpl ul li { margin-left: 2rem; }
.main .page_tpl ul li:first-child {
    margin-left: 0;
    padding-bottom: 0.35rem;
    list-style: none;
    font-weight: bold;
}
.main .page_tpl ul.list-special { list-style: none; }
.main .page_tpl ul.list-special li:first-child::before { display: none; }
.main .page_tpl ul.list-special li::before {
    content: "";
    display: block;
    float: left;
    width: 0.8rem;
    height: 0.8rem;
    background: #f9ae2e;
    border-radius: 0.5rem;
    margin-top: 0.5rem;
    margin-left: -1.5rem;
}
.main .page_tpl ul.list-special li:last-child { clear: both; }


#content_page_815 .form_holder { display: none; }
#bulk_refunds_period { padding: 10px; margin: 10px; }
#bulk_refunds_period .form_table_outframe { padding: 10px; margin: 0px; }
#bulk_refunds_period #button_subscribe { cursor: pointer; }


/* Modal Info start */
#modalWrapper {display: none;}
.excelInfoBtn { background-color: #0ca1d6; border-radius: 50%; color: #fff; cursor: pointer; display: inline-block; font-family: serif; font-size: 16px; font-style: italic; font-weight: bold;
    height: 24px; line-height: 24px; text-align: center; width: 24px; margin: 0 10px; /*margin: 5px 0px 0px -10px;*/ }
.overlay, .infoOverlay { display: none; background: rgba(0,0,0,0.75); height: 100%; width: 100%; position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 99; }
#infoHolder { display: none; background-color: #fff; max-width: 480px; padding: 30px; width: 100%; position: fixed; top: 5%; left: 50%; transform: translateX(-50%); z-index: 100; border: 3px solid #00b1d2; border-radius: 10px; line-height: 20px; font-size: 12px;
max-height: 90%;  padding: 20px 0 20px 30px; /*overflow: auto;*/}
#infoBox { /*height: 400px;*/ overflow: auto; padding: 0 30px 0 0; }
#infoHolder .close { background-color: #d1182d; border-radius: 50%; color: #fff; font-size: 22px; font-weight: bold; height: 30px; line-height: 28px; text-align: center; text-decoration: none; width: 30px; position: absolute; top: -15px; right: -15px; z-index: 101; opacity: 1; transition: transform 0.3s; }
#infoHolder .close:hover { transform: rotate(180deg); }
#infoLogo { background: rgba(0, 0, 0, 0) url("/images/logo.png") no-repeat scroll 0 0 / 60% auto; float: left; height: 30px; position: relative; width: 45%; }
#infoUD { color: #454e66; cursor: default; float: right;font-family: "Trebuchet MS","lucida grande",Calibri,verdana,sans-serif; font-size: 17px; position: relative; width: 45%;}
#infoUD .L1 { clear: both; float: right; margin-bottom: 13px; position: relative;}
#infoUD .L2 { clear: both; color: #788d78; float: right; font-size: 14px; font-variant: small-caps; position: relative;}
#infoHolder .piSectionTitle { background-color: #cee1ed; clear: both; float: left; font-family: "Trebuchet MS","lucida grande",Calibri,verdana,sans-serif; font-size: 14px; font-weight: bold;
    padding: 5px;  position: relative; width: 100%;}
#infoFooter { text-align: center; }
#infoClose { background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #6abed8 0%, #408197 100%) repeat scroll 0 0;  border: medium none !important; border-radius: 5px; color: white; cursor: pointer;
    display: inline-block;  font-family: Helvetica,Arial; font-size: 11px; font-weight: bold; line-height: 20px; margin: 0; outline: medium none; overflow: hidden; text-align: center;
    text-decoration: none; vertical-align: middle; padding: 3px 5px;}
.piSectionInfo { clear: both; margin: 8px 0; text-align: justify; /*float: left;*/}
#infoHolder .piSectionTitle { margin: 10px 0; }
/* Modal Info end */
.bulk_refunds_excel_note { margin: 10px 0; }

/* BULK INSTALMENTS CSS */
.bulk_instalments { margin: 15px 0px 15px 0px; }
.bulk_instalments.top_menu A, .bulk_instalments.top_item A { border: 2px solid black; border-radius: 5px;  padding: 5px; font-size: 14px; color: black; text-decoration: none; display: inline-block;}
.bulk_instalments.top_menu A:HOVER, .bulk_instalments.top_item A:HOVER { color: #666; }
.bulk_instalments.top_menu.unrelated A { border: 1px outset black; }
.bulk_instalments.top_menu.unrelated A:HOVER { color: #666; font-weight: bold; }
.bulk_instalments.top_menu.unrelated A:active { border-style: inset;}
.bulk_instalments.top_menu .clear_refunds { /*display: none;*/ }

#content_page_824 .form_holder { display: none; }
#bulk_refunds_period { padding: 10px; margin: 10px; }
#bulk_refunds_period .form_table_outframe { padding: 10px; margin: 0px; }
#bulk_refunds_period #button_subscribe { cursor: pointer; }

.bulk_instalments_excel_note { margin: 10px 0; }
.bulk_instalments img.bulk_instalments_example {width: 100%;}
.bulk_refunds.top_menu .back_to_home, .bulk_instalments.top_menu .back_to_home { clear: both; float: right;}

/* ADD NEW PAYEE / BENEFICIERIES  */
  #add_beneficiaries_button_subscribe_input_cell, #add_beneficiaries_button_subscribe_form_input
, #add_beneficiaries_bank_validate_button_form_input, #add_beneficiaries_bank_validate_button_input_cell
, #bank_details_student_refund_button_subscribe_input_cell, #bank_details_student_refund_button_subscribe_form_input
, #bank_details_student_refund_bank_validate_button_form_input, #bank_details_student_refund_bank_validate_button_input_cell
, #make_a_payment_next_subscribe_input_cell
, #make_a_payment_next_subscribe_input_cell {width: 100%; text-align: center;}

.add_beneficiaries input[readonly=""], .add_beneficiaries input[readonly="readonly"] { border: none; }
#bank_details_student_refund input[readonly=""], #bank_details_student_refund input[readonly="readonly"] { border: none; }
/* END OF ADD NEW PAYEE / BENEFICIERIES */

span.key_stats { font-size: 28px;    font-weight: bold; color: #4F4F4F;}

/* REPRESENTER ADD SUBACCOUNTS - REFUNDS USER & DOWNLOAD USER CHECKBOXES */

label#representer_register_subaccount_refunds_user.form-control-placeholder, label#representer_register_subaccount_downloads_user.form-control-placeholder {
    margin-top: 13px !important;
    padding: 0px;
    position: absolute;
    top: 0;
    transition: all 200ms;
}

input#refunds_user.form-control.form_fields {
    display: inline-block;
    flex: auto;
    padding: 0;
    width: auto !important;
    position: relative;
    border-radius: 5px;
}
/*
#representer_set_regular_admin_pass_form_accept_terms_form_input {
    height:30px!important;
}

label#representer_set_regular_admin_pass_form_accept_terms.form-control-placeholder.form_label {
    margin-left:10px!important;
    width:100%;
    top: 0;
    height:20px!important;
}
*/


/* END REPRESENTER ADD SUBACCOUNTS - REFUNDS USER & DOWNLOAD USER CHECKBOXES */


/* START REPRESENTER WELCOME PAGE */
.setup-acc .box .warning { font-size: 14px; max-width: 100%; }

.welcome-page h2 { color: #4F4F4F; font-size: 32px; }
.welcome-page h3 { color: #4F4F4F!important; font-size: 24px!important; }
.welcome-page .options { display: flex; justify-content: space-between; margin: 30px 0; overflow: hidden; padding: 0; }
.welcome-page .options a { background: #F2F6F9; border-radius: 16px; display: block; padding: 15px; text-align: center; text-decoration: none; vertical-align: top; width: 200px; }
.welcome-page .options h5 {  font-size: 16px; font-weight: bold; line-height: 1.5; }
.welcome-page .options p { margin: 0 0 15px 0; }
.welcome-page .options p:first-child { height: 35px; }
.welcome-page .options p:last-child { margin: 0; }
.welcome-page .options a:hover { background: #D1ECF1; }
.welcome-page .stats { display: flex; justify-content: space-around; margin: 0; padding: 0; }
.welcome-page .stats li { background: #F2F6F9; border-radius: 16px; list-style: none; padding: 15px; vertical-align: top; width: 32%; }
.welcome-page .stats li .icon { float: left; width: 35%; }
.welcome-page .stats li .right { float: right; width: 62%; }
.welcome-page .stats li strong { display: block; font-size: 30px; font-weight: bold; }
.welcome-page .stats li:nth-child(1) strong { color: #fe4c4c; }
.welcome-page .stats li:nth-child(2) strong { color: #0079bc; }
.welcome-page .stats li:nth-child(3) strong { color: #f1c94d; }
.welcome-page .stats li em { color: #bbb; display: block; font-size: 14px; }


/* .staff-listing { margin: 50px auto;} */
.staff-listing h2 { color: #4F4F4F; font-size: 32px; }
.staff-listing .add-new, .staff-listing .contacts, .staff-listing .add-new-contact { background: #fff; border: 2px solid var(--color-border); border-radius: 3px; display: inline-block; margin: 0 0 15px 0; padding: 8px 16px; text-decoration: none; }
.staff-listing .add-new span, .staff-listing .contacts span, .staff-listing .add-new-contact span { display: inline-block; font-size: 26px; line-height: 20px; margin: 0 0 0 5px; vertical-align: text-bottom; }
.staff-listing .add-new:hover, .staff-listing .contacts:hover, .staff-listing .add-new-contact:hover { background:  var(--color-background-primary); color: #fff; }
.staff-listing table.dataTable { font-size: 14px; }
.staff-listing table.dataTable th { background:  var(--color-background-primary); border: 2px solid var(--color-border); color: #fff; font-size: 12px; padding: 5px; text-transform: uppercase; font-family: Arial, sans-serif!important; }
.staff-listing table td { border: 2px solid #C2C2C2; padding: 10px 5px; }
.staff-listing table.dataTable td { padding: 10px 5px; }

.staff-listing table.dataTable { border-collapse: collapse; }
.staff-listing table.dataTable .inactive td { opacity: 0.5; }
.staff-listing table.dataTable .inactive td:last-child { opacity: 1; }
.staff-listing table.dataTable td.check { text-align: center!important; }

.staff-listing table.dataTable td.del { text-align: center; }
.staff-listing table.dataTable td.del a { display: inline-block; }
.switch { background: #C2C2C2; border-radius: 15px; cursor: pointer; display: inline-block; height: 20px; margin: 0 5px 0 0; vertical-align: text-bottom; width: 34px; position: relative; }
.switch.active { background: #219653; }
.switch i { background: #fff; border-radius: 50%; display: inline-block; height: 18px; width: 18px; position: absolute; top: 1px; left: 1px; transition: left 0.3s; }
.switch.active i { left: 15px; }
.staff-listing .dataTables_wrapper  { width: 100%; }
.staff-listing .dataTables_wrapper div.top { display: flex; margin: 10px 0; }
.staff-listing .dataTables_wrapper div.bottom { width: auto; background: #F2F6F9; display: flex; justify-content: flex-end; float: right; margin: 20px 0;  padding: 15px; }

.staff-listing .dataTables_wrapper .dataTables_info { width: auto; margin: 0 10px 0 0; }

.staff-listing .dataTables_paginate span { display: inline-block; margin: 0 10px!important; }

.staff-listing .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.staff-listing .dataTables_paginate a.paginate_button,
.staff-listing .dataTables_paginate a.paginate_button:hover,
.staff-listing .dataTables_paginate span .paginate_button,
.staff-listing .dataTables_paginate span .paginate_button:hover { margin-right:5px!important; color: var(--color-font-primary)!important; text-decoration: underline!important; cursor:pointer!important; }

.staff-listing .dataTables_paginate span .paginate_button.current,
.staff-listing .dataTables_paginate span .paginate_button.current:hover { margin-right:5px!important; color: var(--color-font-primary)!important; text-decoration: underline!important; cursor:pointer!important; }

.save-cancel { clear: both; margin: 0 0 5px 0; text-align: right; }
.save-cancel .disabled-changes { opacity: 0.5;}
.save-cancel .btn.cancel-changes { background: #fff; border: 2px solid var(--color-border); border-radius: 3px; display: inline-block; margin: 0 15px 0 0; padding: 8px 16px; text-decoration: none; vertical-align: top; }
.save-cancel .btn.cancel-changes:hover { background:  var(--color-background-primary); color: #fff; }
.save-cancel .btn.save-changes { background:  var(--color-background-primary); border: 2px solid var(--color-border); border-radius: 3px; color: #fff; display: inline-block; padding: 8px 16px; text-decoration: none; vertical-align: top; }
.save-cancel .btn.save-changes:hover { background: #fff;  }

.staff-listing .export { margin: 0 0 15px 0; text-align: right; }
.staff-listing .export a { display: inline-block; margin: 0 0 0 15px; }
.staff-listing .export a.xls:before { background: url(../images/icon-xls.png) center left no-repeat; content: ''; display: inline-block; height: 20px; margin: 0 5px 0 0; vertical-align: middle; width: 15px; }
.staff-listing .export a.csv:before { background: url(../images/icon-csv.png) center left no-repeat; content: ''; display: inline-block; height: 20px; margin: 0 5px 0 0; vertical-align: middle; width: 15px; }

.staff-listing .strikethrough { background: repeating-linear-gradient( 180deg, red 0%, red 100% ); background-size: 100% 2px; background-position: center; background-repeat: no-repeat; }

.upload-block { background:#7f7f7f; background:rgba(255,255,255,0.5); display: none; height: 100%; width: 100%; position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 10010; }
.upload-block .loader-img { background: transparent url("../images/ajax-loader2.gif") no-repeat; width: 100px; height: 100px; position: absolute; top: 50%; left: 50%; margin: -50px 0px 0px -50px; }

.doc-upload-btn { padding:14px; }

.page-title-cust h2 {
    color: #c2c2c2;
}

/* END REPRESENTER STAFF LISTING */



/*PAY STUDENT FEES NEW STYLES */

section.demo { background-color: #F2F2F2; text-align: center; }
section.demo FORM { text-align: left; }
section.demo h4 { position: relative; top: -15px; }
section.demo .form-holder .row { margin: 0 0 30px 0; }
section.demo .form-field { background-color: #fff; border: 2px solid #E0E0E0; border-radius: 10px; display: inline-block; margin: 0 15px; padding: 10px; }
section.demo input { border: 0; color: #666; font-size: 16px; min-width: 250px; }

section.unis { background-color: #1C337B; padding: 25px 0; text-align: center; }
section.unis ul { margin: 0; padding: 0; }
section.unis li { display: inline-block; list-style: none; margin: 0 15px; }

section.stats { color: #4F4F4F; font-size: 16px; padding: 50px 0; }
section.stats strong { display: block; font-size: 40px; }

section.contact { background-color: #F2F2F2; padding: 50px 0; }
section.contact .form { border-right: 1px solid #ccc; margin-top: -20px;  }
section.contact h2,
section.contact h4 { text-align: center; }
section.contact h4 { position: relative; top: -15px; }
section.contact .form-holder { text-align: center; }
section.contact .form-field { background-color: #fff; border: 2px solid #E0E0E0; border-radius: 10px; margin: 0 auto 15px auto; padding: 10px; width: 75%; }
section.contact select,
section.contact input { border: 0; color: #666; font-size: 16px; width: 100%; }
section.contact .btn { margin: 0 auto; }
section.contact ul { font-size: 14px; margin: 0; padding: 0; }
section.contact li { float: left; list-style: none; margin: 0 0 5px 0; width: 50%; }
section.contact li:nth-child(odd) { clear: left; width: 25%; }

section.steps-top { /* padding: 50px 0; */ padding: 50px 0px 0px 0px; }
section.steps-top ul { float: left; font-size: 18px!important; margin: 0 0 15px 0; padding: 0; }
section.steps-top li { display: inline-block; list-style: none; margin: 0 15px 0 0; vertical-align: center; }
section.steps-top li a { font-size: 18px!important; color: #6a6a6a!important; text-decoration: none!important; }
section.steps-top li.active a { font-size: 18px!important; color: var(--color-font-primary)!important; text-decoration: underline!important; }
section.steps-top li a:hover { font-size: 18px!important; text-decoration: underline!important; }
section.steps-top a.tutorial { background: #fff; border: 2px solid var(--color-border); border-radius: 3px;  display: inline-block; font-size: 16px; margin: 0 0 0 15px; padding: 8px 16px; text-decoration: none; }
section.steps-top a.tutorial:after { background: url(../images/icon-watch.png) center center no-repeat; content: ''; display: inline-block; height: 18px; margin: 0 0 0 5px; vertical-align: text-top; width: 22px; }

section.steps {font-size: 16px;color: #4F4F4F;padding-top: 20px; }
section.steps .container { position: relative; }

section.steps-content-box .form-control-placeholder,
section.steps-content-box + SCRIPT + .form-control-placeholder {
    background-color: #fff;
    color: var(--color-font-primary);
    font-size: 13px;
    z-index: 10;
}

section.steps-content-box .form_under_text_paragraph, #content .form_under_info {

    font-size: 12px;
    font-weight: normal;
    margin-top: 5px;
}


section.steps-content-box #content .input-group .input-group-text {
    background: transparent;
    border: 2px solid var(--color-border);
    border-right-color: var(--color-border);
    border-right-style: solid;
    border-right-width: 2px;
    border-right: 0;
    color: #4f4f4f;
}

#student_upload_invoice_and_receipt_lbl_add_docs_row #custom_label_field_lbl_add_docs {
    font-weight: bold;
    border-top:1px solid silver;
    padding-top: 10px;
}

.footer-menu-box div.footer_menu a { font-size:12px!important; }
.top-menu-nav-buttons nav { display: block!important; }
.steps-content-box .page_header h2 { color: #4F4F4F!important; font-size: 32px!important; }

section.steps:not(section.steps-content-box) select {
    font-size: 16px;
    height: auto !important;
}

#content_page_894 .form_holder {
    display: none;
}

#representer_contacts, #representer_contacts_holder {
    padding: 10px;
    /*margin: 10px;*/
}

#representer_contacts #__home_phone_number_international_dialing_code {
    margin: 0px;
    padding-left: 5px;
    height: auto;
}

#representer_contacts .form_input__.button_subscribe , #representer_contacts .form_brother_input_cell { width: 47%; float: left;  margin: 5px;}
#representer_contacts .form_input__.button_subscribe input , #representer_contacts .form_brother_input_cell input { width: 100%; }

div.global-acc-info-box { font-size: 13px; width: auto; background: linear-gradient(0deg, rgba(0, 210, 174, 0.2), rgba(0, 210, 174, 0.2)), #FFFFFF url(../images/icon-info2.png) 16px 16px no-repeat; border-radius: 5px; padding: 5px 5px 5px 45px; margin: -10px 0 25px 0; color: #4F4F4F;  text-transform: none!important; }
#pages_content_10034 .global-acc-info-box { margin: 20px 0 15px 0px!important; }
div.global-acc-info-box h3 { margin: 9px 0px 10px!important; font-weight: 400;color: #4F4F4F !important; font-size: 24px !important; }
div.global-acc-info-box a { text-decoration: none; color: #008AFF; }
div.global-acc-info-box .global-acc-info-btn { background:  var(--color-background-primary) !important; height: 42px; border: 0;  border-radius: 20px !important; box-shadow: none; color: #000; cursor: pointer; display: inline-block; font-size: 16px; margin: 12px 0px 10px 0px!important; text-decoration: none; text-transform: none; width: auto; transition: background-color 0.3s; line-height: 160%; }
div.global-acc-info-box .global-acc-link-arrow { float: right; margin: 8px 8px; width: 9px; height: 9px; border-left: 2px solid rgba(255,255,255,255); border-bottom: 2px solid rgba(255,255,255,255); transform: rotate(225deg); }

#pay-full-amount-btn {
    cursor:pointer;
    color: #008AFF;
    font-size: 14px;
    margin-left: 40px;
    display: none;
}

#pay-full-amount-btn:hover {
    text-decoration: underline;
}

.borderless_children * {
    border: unset !important;
}

.form_table_frame_2727 #student_sign_up_instalment_amount_row,
.form_table_frame_2727 #student_sign_up_deposit_amount_row,
.form_table_frame_2727 #student_sign_up_miscellaneous_amount_row,
.form_table_frame_2727 #student_sign_up_outstanding_amount_row,
.form_table_frame_2728 #pay_student_fees_instalment_amount_row,
.form_table_frame_2728 #pay_student_fees_deposit_amount_row,
.form_table_frame_2728 #pay_student_fees_miscellaneous_amount_row,
.form_table_frame_2728 #pay_student_fees_outstanding_amount_row,

.form_table_frame_3057 #student_sign_up_instalment_amount_row,
.form_table_frame_3057 #student_sign_up_deposit_amount_row,
.form_table_frame_3057 #student_sign_up_miscellaneous_amount_row,
.form_table_frame_3057 #student_sign_up_outstanding_amount_row,
.form_table_frame_3058 #pay_student_fees_instalment_amount_row,
.form_table_frame_3058 #pay_student_fees_deposit_amount_row,
.form_table_frame_3058 #pay_student_fees_miscellaneous_amount_row,
.form_table_frame_3058 #pay_student_fees_outstanding_amount_row,

.form_table_frame_3119 #student_sign_up_instalment_amount_row,
.form_table_frame_3119 #student_sign_up_deposit_amount_row,
.form_table_frame_3119 #student_sign_up_miscellaneous_amount_row,
.form_table_frame_3119 #student_sign_up_outstanding_amount_row,
.form_table_frame_3118 #pay_student_fees_instalment_amount_row,
.form_table_frame_3118 #pay_student_fees_deposit_amount_row,
.form_table_frame_3118 #pay_student_fees_miscellaneous_amount_row,
.form_table_frame_3118 #pay_student_fees_outstanding_amount_row {
    display:none;
}

section.steps .steps-top-right { position: absolute; right: 0; }
section.steps .steps-top-right .top-tutorial-bar-logos { border: 2px solid #BDBDBD; border-radius: 10px; padding: 15px; }
section.steps .steps-top-right .top-tutorial-bar-logos ul { margin: 5px 0 15px 0; padding: 0; }
section.steps .steps-top-right .top-tutorial-bar-logos li { display: inline-block; list-style: none; margin: 0 15px; vertical-align: center; }
section.steps .top-tutorial-bar { position: relative; width: auto; margin-bottom: 20px; }
section.steps .top-tutorial-title { position: relative; }
section.steps .top-tutorial-title h1 { font-weight: bold; margin: 0 0 15px 0; }
section.steps .top-tutorial-video { position: relative; right: 0; z-index: 1200; }
section.steps .top-tutorial-video a.tutorial { background: #fff; border: 1px solid var(--color-border); border-radius: 3px; color: var(--color-font-primary); display: inline-block; font-size: 16px; margin: 0 0 0 15px; padding: 8px 16px; text-decoration: none; }
section.steps .top-tutorial-video a.tutorial:after { background: url(../images/icon-watch.png) center center no-repeat; content: ''; display: inline-block; height: 18px; margin: 0 0 0 5px; vertical-align: text-top; width: 22px; }
section.steps-top-right-login { padding: 50px 0; padding: 50px 0px 0px 0px; }

.plantatree { display:none; background: url(../images/bg-plantatree.jpg) center right no-repeat; height: 320px; margin: 0 auto; max-width: 1920px;width: 100%; position: relative;}
.plantatree .box_left { margin-left:-90px; margin-top:100px; transform: rotate(-270deg); text-transform: uppercase; float: left; color: silver; }
.plantatree .box { background: rgba(255,255,255,0.75); border-radius: 0 0 50px 0; max-width: 800px; padding: 15px 30px 30px calc(50% - 640px); }
.plantatree img { max-width: 150px; }
.plantatree h2 { background: url(../images/underline-element.png) bottom left no-repeat; color: var(--color-font-primary); font-weight: bold; padding: 0 0 20px 0; text-transform: uppercase; }
.plantatree h5 { bottom left no-repeat; color: var(--color-font-primary); font-weight: bold; padding: 0 0 3px 0; }
.plantatree h6 { bottom left no-repeat; color: silver;  }
.plantatree h6 a { font-size: 12px; }
.plantatree .close { background: rgba(255,255,255,0.75); border-radius: 10px; font-size: 14px; padding: 0 8px; text-decoration: none; position: absolute; top: 15px; right: 15px; }
.plantatree .close span { display: inline-block; font-size: 34px; line-height: 1; text-transform: uppercase; vertical-align: middle; }
/*
.christmas-banner { background: url(../images/christmas-banner.jpg) bottom center no-repeat; height: 420px; margin: 0 auto; max-width: 1920px; position: relative; }
.christmas-banner .box { font-family: 'Rubik', Arial, sans-serif; border-radius: 0 0 50px 0; max-width: 100%; padding: 0px calc(50% - 640px) 30px calc(50% - 640px); }
.christmas-banner img { max-width: 250px; height: auto; }
.christmas-banner h5 { text-align: left; color: #1B1E51; font-size: 1.75rem;padding: 30px 10px 0px 5px; }
.christmas-banner h6 { text-align: left; color: #1B1E51; font-size: normal; line-height: 150%; padding: 15px 20px 3px 5px; }
.christmas-banner p { text-align: left; font-size: 12px; padding: 0px 10px 3px 10px; }
.christmas-banner p a { color: #0099DC; }
.christmas-banner .box-inner { color: var(--color-font-primary); font-size: 16px; padding: 15px 10px 0px 5px; }
*/
.skiptranslate:not([style*="display: none"]) ~ .fullcontent header{
    margin-top: 40px;
}

@media (max-width: 1400px) {
    .christmas-banner { background: url(../images/christmas-banner.jpg) bottom center no-repeat; height: 490px; margin: 0 auto; max-width: 1920px; position: relative; }
    .christmas-banner .box { font-family: 'Rubik', Arial, sans-serif; border-radius: 0 0 50px 0; max-width: 100%; padding: 0px calc(50% - 640px) 30px calc(50% - 640px); }
    .christmas-banner img { max-width: 250px; height: auto; }
    .christmas-banner h5 { font-weight: bold; text-align: center; color: #1B1E51; font-size: 24px; padding: 10px 10px 3px 10px; }
    .christmas-banner h6 { text-align: center; color: #1B1E51; font-size: 18px; padding: 15px 20px 3px 20px; }
    .christmas-banner p { text-align: center; font-size: 12px; padding: 0px 10px 3px 10px; }
    .christmas-banner p a { color: #0099DC; }
    .christmas-banner .box-inner { color: var(--color-font-primary); font-size: 16px; padding: 15px 10px 3px 10px; }
}

@media (max-width: 900px) {
    .christmas-banner { background: url(../images/christmas-banner.jpg) bottom center no-repeat; height: 500px; margin: 0 auto; max-width: 1920px; position: relative; }
}

@media (max-width: 700px) {
    .christmas-banner { background: url(../images/christmas-banner.jpg) bottom center no-repeat; height: 550px; margin: 0 auto; max-width: 1920px; position: relative; }
}
*/
@media (max-width: 1400px) {
    .plantatree .box {
        max-width: 600px;
        padding-left: calc(50% - 550px);
    }
}

@media (max-width: 1200px) {
    .plantatree .box {
        padding-left: calc(50% - 460px);
    }
}

@media (max-width: 1000px) {
    .plantatree {
        background-size: cover;
    }
    .plantatree .box {
        padding-left: calc(50% - 340px);
    }
    .plantatree .close {
        font-size: 16px;
        padding: 3px 10px;
    }
}

@media (max-width: 768px) {
    .plantatree .box { margin: 0 auto; padding: 30px; text-align: center; }
    .plantatree h2 { background-position: bottom center; }
    .plantatree .close { top: auto; bottom: 15px; right: auto; left: 50%; transform: translateX(-50%); }
}

@media (max-width: 1500px) {
    .next-step .box.right { left: auto; right: 102%; transform: translateX(-10px) translateY(-50%); }
    .next-step .box.right:before { border-width: 10px 0 10px 10px; border-color: transparent transparent transparent rgba(0,0,0,0.8); left: 100%; right: auto; }
}
@media (max-width: 1200px) {
    .key-stats .box strong { font-size: 36px; }

    .details_wrapper { display: block; }
    .details_wrapper .item { float: left; margin-bottom: 20px; width: calc(50% - 20px); }
    .details_wrapper .item:nth-child(odd) { clear: both; }

}

@media (max-width: 991px) {
    .how_it_works_holder { flex-direction: column; }
    .how_it_works_box_model { padding: 15px 0; width: 100%; }
    .div_contact_col { width: 50%; }
    .payment_details_wrap table {width: 100%; margin: 0 0 10px 0;}
    .key-stats { display: block; }
    .key-stats .box { width: auto; }
    .key-stats .box .icon { width: 110px; }
    .key-stats .box .right { width: calc(100% - 120px); }
    .next-step .box.left{ right: 100%; top: auto; bottom: 100%; transform: translateX(50%) translateY(-15px); }
    .next-step .box.left:before { border-width: 10px 10px 0 10px; border-color: rgba(0,0,0,0.8) transparent transparent transparent; top: auto; top: 100%; left: 50%; }
    label#representer_register_subaccount_refunds_user.form-control-placeholder, label#representer_register_subaccount_downloads_user.form-control-placeholder {
        margin-top: 2px !important;
        padding: 0px;
        position: absolute;
        top: 0;
        transition: all 200ms;
    }

    label#representer_set_regular_admin_pass_form_user_email_set_acc_pass.form-control-placeholder.form_label {
        top: 0;
    }
    .welcome-page .stats li .icon { display: none; }
    .welcome-page .stats li .right { float: none; width: 100%; }
    div.global-acc-info-box .global-acc-info-btn {
        height: auto;
    }
}

@media (max-width: 767px) {
    #navbarSupportedContent.show {margin-top: 10px;}
    #google_translate_element{margin:5px auto;}
    .section_form_signup aside h1 { text-align: center;}
    section.steps{padding-top: 20px;}
    .section_form_signup aside{z-index: 9;justify-items: center;padding: 15px 0 5px;border-bottom: 1px solid lightgray;border-radius: unset;width: 100%;}
    .section_form_signup aside{top:95px;}
    .skiptranslate:not([style*="display: none"]) ~ .fullcontent main .section_form_signup aside{top:135px;}
    .section_form_signup aside .navigation li.current{margin-right: 10px;}
    .section_form_signup aside .navigation li { margin: 10px 0; }
    .section_form_signup aside ol li:not(.current) > * {display: none !important;}
    .section_form_signup aside ol{display: grid;grid-auto-flow: column;justify-content: center;}
    .section_form_signup {grid: auto / 100%;grid-template-areas:"aside" "form";margin: unset;grid-gap: 50px;}
    header .buttons { padding-top: 15px;}
    section.stats { text-align: center; }
    section.contact .form { border-right: 0; margin-bottom: 50px;border-right: none; }
    section.contact .form-holder { text-align: left; }
    .skype_link { display: block; float: none; margin: 10px 0; }
    .div_contact_col { float: none; width: 100%; }

    table.striped td { display:block; }
    table.striped .ref_number_cell { text-align: left; }
    table.striped td.date_header { width: auto; text-align: center; }
    #pages_content_7329 table.striped td.date_header { text-align: left; }
    table.striped td.active_header { width: auto !important; }
    table.striped td.date_cell { width: auto !important; }
    .details_wrapper { display: inline;  }
    .details_wrapper .item { float: left; margin: 0 0 20px 0; width: 95%; margin: 0px 0px 10px 0px; }
    .livechat { display: none; }
}

@media (max-width: 568px) {
    section.features br { display: none; }
    section.features .item { margin-bottom: 15px; }
}

@media (max-width: 500px) {
    #content .section_label_note div.section-form-note-text { margin: 15px 0 15px 0px !important; }
    .details_row .details_value,
    .next-step { position: static; }
    .next-step .box.left { width: 100%; right: 0; transform: translateX(0); }
    .next-step .box.left:before { display: none; }
}

#popup_window #google_translate_element div {
    overflow: hidden;
    clear: both;
    height: 30px!important;
    margin-left: 0;
    padding-left: 10px;
}
#popup_window #google_translate_element select {
    float: right;
    background-color: rgba(255,255,255,0.20) !important;
    border: 1px solid #6a6a6a !important;
    border-radius: 4px !important;
    cursor: pointer;
    padding: 3px;
    margin-right:20px;
}
.mainCokiePolicyBox { font-family: sans-serif, 'Rubik', Arial; font-size: 15px; line-height: 25px; color: #4F4F4F; margin-top: 5px; padding: 10px; }