* { box-sizing: border-box; }
img { max-width: 100%; }

:root {
    --primary-green: #00684B;
    --dark-green: #003D3D;
    --light-green: #88C697;
    --bg-green: #E9F4EA;
    --primary-orange: #F28B32;
    --primary-red: #E03A4C;
    --bright-green: #57AF80;
    --light-gray: #EFF2F4;
    --dark-gray: #1C2629;
}

body { font-family: "Roboto", Arial, sans-serif; font-size: 14px; margin: 0; min-height: 100vh; padding: 0;  height: 100%; display: flex; flex-direction: column;}
body.login,
body.intro { background: #00684B; background: radial-gradient(circle,rgba(0, 104, 75, 1) 0%, rgba(28, 38, 41, 1) 100%); }
a { color: var(--primary-green); text-decoration: none; }
a:hover { text-decoration: underline; }
h4 { font-size: 14px; }

.container { margin: 0 auto; max-width: 1200px; padding: 0 15px; width: 100%; }
header { background: var(--primary-green); border-radius: 0 0 15px 15px; padding: 15px; width: 100%; position: fixed; top: 0; left: 0; z-index: 999; }
body.login header { background: white; position: fixed; top: 0; width: 100%; z-index: 9; }
body.notfixed header { position: relative; }
header .container { display: flex; justify-content: space-between; align-items: center; }
header .logos { display: flex; align-items: center; gap: 15px; }
header .logos .sep { background: white; display: inline-block; height: 60px; width: 1px; }
body.login header .logos .sep { background: var(--primary-green); }
header .logos .mobile { display: none; }
header .meta { display: flex; justify-content: space-between; align-items: center; }
header .lang { position: relative; }
header .lang a { border: 1px solid white; border-radius: 5px; color: white; display: flex; align-items: center; gap: 10px; padding: 10px; transition: background 0.3s ease-in-out, color 0.3s ease-in-out; }
body.login header .lang a { border: 1px solid var(--primary-green); color: var(--primary-green); }
header .lang a.btn:after { background: url(../images/arrow-down-white.png) no-repeat center center; content: ""; display: inline-block; height: 7px; width: 10px; transition: transform 0.3s ease-in-out; }
body.login header .lang a.btn:after { background: url(../images/arrow-down.png) no-repeat center center; }
header .lang a.btn.active:after { transform: rotate(180deg); }
header .lang a:hover { background: var(--primary-green); color: white; text-decoration: none; }
body.login header .lang a:hover { background: #eee; }
header .lang ul { display: none; list-style: none; position: absolute; top: 100%; right: 0; background: white; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 5px; min-width: 125px; padding: 10px; width: 100%; }
header .lang ul a,
body.login header .lang ul a { border: 0; color: var(--primary-green); display: block; text-align: center; }
header a.logout { background: white; border: 1px solid white; border-radius: 5px; color: var(--primary-green); display: inline-block; margin: 0 0 0 15px; padding: 10px 15px; transition: background 0.3s ease-in-out; }
header a.logout:hover { background: transparent; border-color: white; color: white; text-decoration: none; }

main { background: url(../images/map-white.jpg) center 200px no-repeat; display: flex; justify-content: center; align-items: center; padding: 150px 30px 60px 30px; }
body.christmas-intro main{ background-position-y: bottom;}
body.login main,
body.intro main { background: url(../images/map.png) center center no-repeat; height: 100vh; }
body.notfixed main { height: auto; padding: 60px 30px; }
body.intro main { color: white; text-align: center; }
body main.form  { background: url(../images/map-white-form.jpg) center top no-repeat; }

.student_payment_instruction { font-size: 12px; }

main h1 { color: var(--primary-green); font-size: 32px; font-weight: 500; margin: 0; text-transform: uppercase; }
body.intro main h1 { color: white; font-size: 48px; margin: 0 0 50px 0; text-transform: none; }
main h4 { font-weight: normal; }

main .text-green { color: var(--primary-green); }
main p.goback a { background: transparent; border: 1px solid var(--primary-green); border-radius: 10px; color: var(--primary-green); display: inline-block; font-size: 14px; padding: 10px 15px; transition: background 0.3s ease-in-out, color 0.3s ease-in-out; }
main p.goback a:hover { background: var(--primary-green); color: white; text-decoration: none; }

body.intro main .boxes { display: flex; justify-content: center; align-items: center; gap: 50px; }
body.intro main .boxes a { background: rgba(255, 255, 255, 0.75); backdrop-filter: blur(5px); border-radius: 15px; font-size: 20px; padding: 40px; text-align: center; position: relative; top: 0; transition: background 0.3s ease-in-out, top 0.3s ease-in-out; }
body.intro main .boxes a:before { content: ''; display: block; height: 85px; margin: 0 auto 20px auto; width: 86px; }
body.intro main .boxes a.student:before { background: url(../images/icon-student.png) no-repeat center center; }
body.intro main .boxes a.sponsor:before { background: url(../images/icon-sponsor.png) no-repeat center center; }
body.intro main .boxes a:hover { background: var(--light-green); text-decoration: none; position: relative; top: -10px; }

main .loginbox .input-group { position: relative; display: block; flex-wrap: wrap; align-items: stretch; width: 100%; }
main .loginbox { background: rgba(255, 255, 255, 0.6); backdrop-filter: blur(5px); border-radius: 15px; margin: 0 auto; max-width: 400px; padding: 30px; text-align: center; }
main .loginbox h2, .page_header h2 { color: rgb(33, 37, 41); font-size: 22px!important; font-weight: normal; margin: 0 0 30px; text-transform: uppercase; }
main .loginbox .form-field { margin-bottom: 15px; padding-top: 10px; position: relative; }
main .loginbox .form-field.forgot { padding-top: 0; text-align: left; }
main .loginbox label { background: var(--dark-green); border-radius: 15px; color: white; display: inline-block; font-size: 11px; padding: 2px 8px; position: absolute; top: 0; left: 10px;  }
main .loginbox input[type="email"],
main .loginbox input[type="text"],
main .loginbox input[type="password"] { background: white; border: 0; border-radius: 10px; color: #686E71; font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 15px; width: 100%; }
main .loginbox input[type="submit"] { background: var(--primary-green); border: 1px solid var(--primary-green); border-radius: 10px; color: white; cursor: pointer; font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 15px 50px; transition: background 0.3s ease-in-out; }
main .loginbox input[type="submit"].disabled { background: #ccc; border-color: #ccc; cursor: not-allowed; }
main .loginbox input[type="submit"]:hover { background: white; color: var(--primary-green); }
main .loginbox .error-field { color: var(--primary-red); font-weight: bold; }

main .completebox { background: rgba(255, 255, 255, 0.6); backdrop-filter: blur(5px); border-radius: 15px; display: flex; justify-content: space-between; align-items: flex-start; margin: 0 auto; max-width: 1200px; padding: 30px; text-align: center; }
main .completebox .whitebox { background: white; border-radius: 15px; padding: 30px; text-align: left; width: 49%; }
main .completebox .whitebox h1 { color: var(--primary-green); font-size: 32px; font-weight: 500; margin: 0 0 15px 0; text-transform: uppercase; }
main .completebox .whitebox h4 { color: #1C2629; font-size: 20px; margin: 0 0 15px 0; }
main .completebox .whitebox h5 { font-size: 16px; margin: 0 0 15px 0; }
main .completebox .whitebox ul { list-style: disc inside; margin: 0; padding-inline-start: 0; }
main .completebox .whitebox li { margin: 5px 0; }
main .completebox .whitebox .form-field { margin-bottom: 15px; padding-top: 10px; position: relative; }
main .completebox .whitebox label { background: var(--dark-green); border-radius: 15px; color: white; display: inline-block; font-size: 11px; padding: 2px 8px; position: absolute; top: 0; left: 10px;  }
main .completebox .whitebox input[type="password"], main .completebox .whitebox input[type="text"] { background: white; border: 1px solid var(--light-green); border-radius: 10px; color: #686E71; font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 15px; width: 100%; }
main .completebox .whitebox input[type="text"] { background: none; border: 0; border-radius: 10px; color: black; font-family: "Roboto", Arial, sans-serif; font-size: 16px; font-weight: bold; padding: 15px 15px 15px 0px; width: 100%; }
main .completebox .whitebox .infobox { background: var(--bg-green); border-radius: 8px; font-size: 12px; margin: 0 0 15px 0; padding: 15px; }
main .completebox .whitebox .infobox p { margin: 0 0 15px 0; }
main .completebox .whitebox .infobox p:last-child { margin: 0; }
main .completebox .whitebox .checkbox-box { background: #EFF2F4; border-radius: 8px; margin: 0 0 15px 0; padding: 15px; }
main .completebox .whitebox .checkbox-box label { background: none; border-radius: 0; color: black; font-size: 14px; line-height: 1.25; padding: 0; position: static; }
main .completebox .whitebox .checkbox-box .checkbox-field { margin: 5px 0; padding-left: 25px; position: relative; }
main .completebox .whitebox .checkbox-box .checkbox-field input[type="checkbox"] { position: absolute; top: 0; left: 0; }
main .completebox .whitebox .submit-field { display: flex; justify-content: space-between; align-items: center; gap: 15px; }
main .completebox .whitebox .submit-field input[type="submit"] { background: var(--primary-green); border: 1px solid var(--primary-green); border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); color: white; cursor: pointer; font-family: "Roboto", Arial, sans-serif; font-size: 14px; font-weight: 500; padding: 15px 50px; transition: background 0.3s ease-in-out; }
main .completebox .whitebox .submit-field input[type="submit"]:hover { background: white; color: var(--primary-green); }
main .completebox .whitebox .submit-field button.back { background: white; border: 1px solid white; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); color: var(--primary-green); cursor: pointer; font-family: "Roboto", Arial, sans-serif; font-size: 14px; font-weight: 500; padding: 15px 50px; transition: background 0.3s ease-in-out; }
main .completebox .whitebox .submit-field button.back:hover { background: var(--primary-green); color: white; }

main nav.top-nav { margin: 25px 0 50px 0; }
main nav.top-nav ul { display: flex; gap: 15px; list-style: none; margin: 0; padding-inline-start: 0; }
main nav.top-nav ul li a { background: white; color: #686E71; display: inline-block; font-size: 14px; padding: 0 0 5px 0; transition: background 0.3s ease-in-out; }
main nav.top-nav ul li a.active { border-bottom: 5px solid var(--primary-green); color: black; font-weight: bold; }
main nav.top-nav ul li a:hover { color: black; text-decoration: none; }
main nav.top-nav.sponsors { display: flex; flex-wrap: wrap; align-items: center; }
main .company-wrapper {position: relative; cursor: default; color: #686E71; font-size: 0.9em; padding: 0.5em 1em 0.5em 2em; width: fit-content; border-radius: 5px; margin-left: auto; background-color: var(--bg-green);}
main .company-wrapper::before {content: ""; position: absolute; left: 1em; top: 50%; width: 0.4rem; height: 0.4rem; border-radius: 50%; background: var(--light-green); transform: translateY(-50%);}

main .list-top { display: flex; justify-content: space-between; align-items: center; margin: 0 0 30px 0; }
main .list-top.help-page{ margin: 0 0 20px 0; }
main .list-top.vertical { flex-direction: column; align-items: flex-start; }
main .list-top .settings { display: flex; gap: 15px; }
main .list-top .settings .toggle { color: #686E71; }
main .list-top .settings .toggle strong { background: #D5DADD; border-radius: 30px; display: inline-block; height: 40px; margin: 0 0 0 5px; padding: 4px; vertical-align: middle; width: 62px; transition: background 0.3s ease-in-out; }
main .list-top .settings .toggle strong span { background: white; border-radius: 50%; display: inline-block; height: 32px; overflow: hidden; text-indent: -9999px; vertical-align: middle; text-wrap: nowrap; width: 32px; position: relative; left: 0; transition: left 0.3s ease-in-out, opacity 0.3s ease-in-out; }
main .list-top .settings .toggle:hover { text-decoration: none; }
main .list-top .settings .toggle.active strong { background: var(--primary-green); }
main .list-top .settings .toggle.active strong span { opacity: 0.5; left: 22px; }
main .list-top .settings .open-filters { background: var(--primary-green); border-radius: 30px; color: white; display: inline-block; font-size: 14px; padding: 10px 15px; transition: background 0.3s ease-in-out; }
main .list-top .settings .open-filters:after { background: url(../images/arrow-down-white.png) no-repeat center center; content: ""; display: inline-block; height: 7px; margin: 0 0 0 10px; width: 10px; transition: transform 0.3s ease-in-out; }
main .list-top .settings .open-filters.active:after { transform: rotate(180deg); }
main .list-top .settings .open-filters:hover { text-decoration: none; }

main .filter-box { background: rgba(0, 0, 50, 0.15); border-radius: 15px; display: none; padding: 30px; margin-bottom: 1em;}
main .filter-box h4 { color: #888; font-weight: normal; margin: 0 0 15px 0; text-transform: uppercase; position: relative; }
main .filter-box h4:after { /*background: #888;*/ content: ''; display: inline-block; height: 2px; width: 87.5%; position: absolute; top: 7px; right: 0; }
main .filter-box .form-fields { display: flex; justify-content: space-between; flex-wrap: wrap; }
main .filter-box .form-field { margin-bottom: 15px; padding-top: 10px; width: 48%; position: relative; }
main .filter-box .form-field label { background: var(--dark-green); border-radius: 15px; color: white; display: inline-block; font-size: 11px; padding: 2px 8px; position: absolute; top: 0; left: 10px;  }
main .filter-box .form-field input[type="text"],
main .filter-box .form-field select { background: white; border: 0; border-radius: 10px; color: #686E71; font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 15px; width: 100%; }
main .filter-box .form-field select { padding: 15px 10px; }
main .filter-box input[type="submit"] { background: var(--primary-green); border: 0; border-radius: 10px; color: white; cursor: pointer; font-family: "Roboto", Arial, sans-serif; font-size: 14px; margin: 0 15px 0 0; padding: 10px 40px; transition: background 0.3s ease-in-out; }
main .filter-box input[type="submit"]:hover { background: var(--dark-green); }
main .filter-box input[type="reset"] { background: white; border: 0; border-radius: 10px; color: var(--primary-green); cursor: pointer; font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 10px 40px; transition: background 0.3s ease-in-out; }
main .filter-box input[type="reset"]:hover { background: #eee; }

/*main .summarized-view { display: none; }*/

main .summarized-view.active { display: block; }
main .payment-boxes { display: flex; flex-direction: column; gap: 15px; margin: 0 0 30px 0; }
main .payment-boxes .box { background: rgba(0, 0, 50, 0.15); border-radius: 15px; padding: 30px; position: relative;}
main .payment-boxes .box.processing { background: #FFF4E5;}
main .payment-boxes .box.completed { background: var(--bg-green);}
main .payment-boxes .box:has(> form#upload_files)  { background: unset; border-radius: 16px; padding: 30px; border: 1px solid #ddd; display: flex;}
main .payment-boxes .box .stats { position: absolute; top: 0; right: 0; background: white; padding: 5px 10px; border-bottom-right-radius: 15px; border-bottom-left-radius: 15px; box-shadow: 0px 2px 0px 1px var(--primary-green); width: 150px; text-align: center;	color: var(--primary-green); font-variant: small-caps; font-weight: bold; font-size: 14px; cursor: default; }

main .container .box-contact-us { background: rgb(239, 242, 244); border-radius: 15px; padding: 30px; font-size: 16px; }
main .container .box-contact-us h5 { color: var(--primary-green); font-size: 24px; margin: 0 0 15px 0; }
main .container .box-contact-us-sep { height: 15px; width: 50px; border-top: 1px solid var(--primary-green); }
main .container .request-a-callback-box { display: flex; margin-top: -25px; margin-bottom: 30px; }
main .container .request-a-callback-box a.request-a-callback { background: var(--primary-green); border: 1px solid var(--primary-green); border-radius: 8px; color: white; display: inline-block; margin: 0 0 0 15px; padding: 10px 15px; text-decoration: none; transition: background 0.3s ease-in-out; margin-left: auto; }
main .container .request-a-callback-box a.request-a-callback:hover { background: white; border: 1px solid var(--primary-green); border-radius: 8px; color: var(--primary-green); display: inline-block; margin: 0 0 0 15px; padding: 10px 15px; text-decoration: none; transition: background 0.3s ease-in-out; margin-left: auto; }

main .payment-boxes .student-name-display {color: var(--primary-green); font-size: 1.4em; font-weight: 600; }

main .payment-boxes .box.solid { background: #EFF2F4; }
main .payment-boxes .info { display: flex; justify-content: space-between; align-items: center; }
main .payment-boxes.video-element .info { gap:50px; }
main .payment-boxes h2 { margin: 0 0 15px 0; }
main .payment-boxes h3 { font-size: 22px; margin: 0; }
main .payment-boxes h4 { color: #686E71; margin: 0; }
main .payment-boxes h5 { color: var(--primary-green); font-size: 24px; margin: 0 0 15px 0; }
main .payment-boxes h5:after { background: #aaa; content: ''; display: block; height: 1px; margin: 15px 0 0 0; width: 50px; }
main .payment-boxes .details { color: #686E71; display: flex; gap: 10px; align-items: center; font-size: 16px; }
main .payment-boxes .details a { background: url(../images/arrow-togglebox.png) center center no-repeat; content: ''; display: inline-flex; height: 23px; overflow: hidden; text-indent: -9999px; text-wrap: nowrap; width: 23px; position: relative; top: 0; transition: transform 0.3s ease-in-out; }
main .payment-boxes .details a.active { transform: rotate(180deg); }
main .payment-boxes .table { padding-top: 15px; }
main .payment-boxes .hidden { display: none; }
main .payment-boxes .box:first-of-type .table {display: block;}
main .payment-boxes table,
main .tran-details table { background: white; border-radius: 15px!important; border-spacing: 0; border-collapse: collapse; font-size: 12px; }

#custom_label_field_india_top_label div { border-radius: 15px!important; }
#custom_label_field_india_top_label table { background: none; border-radius: 15px!important; }
main .modal { --bs-modal-border-radius: 15px; }
main .payment-boxes table td.header { background: var(--primary-green); border-right: 1px solid #aaa; color: white; font-weight: normal; padding: 10px; text-transform: uppercase; text-align: center;}
main .payment-boxes table td.header:first-child { border-radius: 15px 0 0 0; }
main .payment-boxes table td.header:last-child { border-right: 0; border-radius: 0 15px 0 0; }
main .payment-boxes table td { border-right: 1px solid var(--light-green); padding: 10px; text-align: center; }
main .payment-boxes table th,
main .tran-details table th { background: var(--primary-green); border-right: 1px solid #aaa;  text-align: center; color: white; font-weight: normal; padding: 10px; text-transform: uppercase; }
main .payment-boxes table th:first-child { border-radius: 15px 0 0 0; }
main .payment-boxes table th:last-child { border-right: 0; border-radius: 0 15px 0 0; }
main .payment-boxes table td { border-right: 1px solid var(--light-green); padding: 10px; text-align: center; }
main .payment-boxes form#upload_files table td { border-right: 1px solid var(--light-green); padding: 10px; text-align: left; }
main .payment-boxes table td:last-child { border-right: 0; }
main .payment-boxes table td:last-child { border-right: 0; }
main .payment-boxes table a,
main .tran-details table a { background: var(--primary-orange); border: 1px solid var(--primary-orange); border-radius: 5px; color: white; display: inline-block; font-size: 12px; padding: 5px 10px; /*text-align: right;*/ transition: background 0.3s ease-in-out, border-color 0.3s ease-in-out; }
main .payment-boxes table a.inactive { background: #777; border-color: #777; pointer-events: none; }
main .payment-boxes table a small { display: block; font-size: 10px; line-height: 0.9; }
main .payment-boxes table a:hover,
main .tran-details table a:hover { background: white; color: var(--primary-orange)!important; text-decoration: none; }
main .names-column { width: 150px; text-align: center!important; }
table.dataTable td.dt-type-numeric { text-align: center!important; }
table.dataTable thead th,
main .payment-boxes table th { text-align: center!important; }
main .payment-boxes .table-footer { display: flex; justify-content: flex-end; padding-top: 15px; }
main .payment-boxes table a.xls { background: var(--primary-green); border-color: var(--primary-green); }
main .payment-boxes a.xls:before { background: url(../images/icon-xls.png) no-repeat center center; content: ''; display: inline-block; height: 26px; margin: 0 10px 0 0; vertical-align: middle; width: 20px; }
main .payment-boxes a.xls:hover { text-decoration: underline; }
main .payment-boxes .border-box { border: 1px solid var(--primary-green); border-radius: 15px; margin: 0 0 30px 0; padding: 30px; }
main .payment-boxes .supported { border-top: 1px solid #eee; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; align-items: center; gap: 15px; margin: 0 auto; max-width: 800px; padding: 15px 0; }

main .tran-details button.btn-close { background: var(--primary-green)!important; border-radius: 50%; color: white!important; display: inline-block; font-size: 12px; height: 20px; line-height: 20px; text-align: center; position: absolute; right: 22px; top: 22px; width: 20px; }
main .btn-circle { width: 20px; height: 20px; text-align: center; padding: 0px!important; --bs-btn-close-opacity: 1; font-size: 12px; line-height: 1.428571429; border-radius: 15px; }

main .tran-details .popup { background: white; border-radius: 15px; }
main .tran-details h3.modal-title { margin: 0px; text-align: center!important; line-height: 100%; font-size: 22px; }
main .tran-details .modal-header { display: block; text-align: center!important; border-bottom: unset; padding-bottom: 5px; padding-top: 18px;}
main .tran-details .modal-footer { display: block; border: unset; padding-top: 0px; text-align: center!important; padding-bottom: 20px;  }
main .tran-details .popup h6 { font-size: 18px; font-weight: normal; margin: 0 0 15px 0; text-align: center; }
main .tran-details .popup h6:after { background: #aaa; content: ''; display: block; height: 1px; margin: 15px auto 0 auto; width: 50px; }
main .tran-details .popup table { margin: 0 0 15px 0; width: 100%; }
main .tran-details .popup table th { background: var(--primary-green); border-radius: 0; color: white; }
main .tran-details .popup table tr:first-child th { border-radius: 15px 0 0 0; }
main .tran-details .popup table tr:first-child td { border-radius: 0 15px 0 0;}
main .tran-details .popup table tr:not(:last-child) th,
main .tran-details .popup table td { border-bottom: 1px solid var(--light-green); }
main .tran-details .popup table th { padding: 15px; width: 40%; background-color: var(--primary-green);}
main .tran-details .popup table td { padding: 15px; text-align: left; background-color: #ddd; }
main .tran-details .popup table tr:last-child td { border-bottom: 0px; border-radius: 0 0 15px 0; }

main .payment-boxes.video-element .details { max-width: 600px; width: 100%;}
main .payment-boxes.video-element p { color: #1C2629; font-size: 16px;}
main .payment-boxes.video-element h2 { color: #1C2629; font-size: 26px;}
main .tran-details .popup table tr:last-child th { border-bottom: 0px; border-radius: 0 0 0 15px; }
main .tran-details .table-footer { display: flex; justify-content: center; gap: 15px; }
main .tran-details .table-footer a { box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); border-radius: 10px; display: inline-block; padding: 10px 20px; transition: background 0.3s ease-in-out, box-shadow 0.3s, color 0.3s; }
main .tran-details .table-footer a:hover { background: var(--dark-green); color: white; text-decoration: none; }
main .faq-section { display: flex; gap: 41px; flex-direction: column; margin-top: 70px;}
main .faq-section h2 { font-size: 26px; font-weight: 500; text-align: center; margin: 0;}
main .faq-section ul.questions { display: flex; flex-direction: column; margin: 0;  list-style-type: none; padding: 0; gap: 3px; }
main .faq-section ul.questions>li { background: var(--light-gray); border-radius: 10px; padding: 10px 20px; }
main .faq-section ul.questions>li p { margin: 5px 0; color: var(--dark-gray); }
main .faq-section ul.questions>li a { color: var(--dark-gray); text-decoration: underline;}
main .faq-section ul.questions>li h3{ font-size: 16px; font-weight: 500; color: var(--primary-green); margin: 0; }
main .faq-section ul.questions>li div.question{ display: flex; justify-content: space-between;}
main .faq-section ul.questions>li div.answer { margin: 0; display: none; font-size: 14px; font-weight: 400; color: var(--dark-gray); padding: 0 50px 0 0;}
main .faq-section ul.questions>li ul { list-style-type: disc; padding: 0 0 0 25px; }
main .faq-section  span { background: url(../images/arrow-togglebox.png) center center no-repeat; content: ''; display: inline-block; height: 25px; padding: 12px; overflow: hidden; text-indent: -9999px; text-wrap: nowrap; width: 30px; position: relative; top: 0; transition: transform 0.3s ease-in-out; }
main .faq-section  span.active { transform: rotate(180deg); }

/* Embedded video */
.video-card { max-width: 600px; width: 100%; font-family: "Roboto", sans-serif; position: relative; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); }
.video-frame { position: relative; width: 100%; aspect-ratio: 600 / 337.31; /* keeps correct ratio */ background: #000;}
.video-frame iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;}
.video-info { padding: 1rem 1.25rem; display: flex; flex-direction: column; gap: 0.5rem; position: absolute; bottom: 0; left: 0; color: #fff; background: #1C2629; opacity: 0.5; border-top-right-radius: 15px;}
.video-title { font-weight: 500; font-size: 20px; margin: 0; color: #ffffff;}
.youtube-link { font-size: 14px; font-weight: 500; text-decoration: none; color: #ff0000; transition: opacity 0.2s ease;}
.youtube-link:hover { opacity: 0.8;}

main .pagination { display: flex; justify-content: flex-end; align-items: center; gap: 15px; margin: 0 0 50px 0; }
main .pagination .dt-layout-cell { display: flex;  justify-content: flex-end; }
main .pagination ul { display: flex; gap: 15px; list-style: none; margin: 0; padding-inline-start: 0; }
main .pagination a { color: #686E71; display: inline-block; padding: 5px 8px; }
main .pagination a.prev,
main .pagination a.next { color: black; }
main .pagination a.active { background: white; border-bottom: 2px solid var(--primary-green); border-radius: 5px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); color: black; }

main .weaccept { display: flex; justify-content: space-between; align-items: flex-end; }
main .weaccept h4 { color: #686E71; font-size: 14px; font-weight: normal; margin: 0 0 15px 0; text-transform: uppercase; }
main .weaccept ul { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; color: #ddd; display: flex; align-items: center; gap: 15px; list-style: none; margin: 0; padding-inline-start: 0; padding: 15px 0; }
main .weaccept ul li { margin: 0 10px; }
h2 { font-size: 22px!important; font-weight: 500; }
main .payformbox form { /*background: rgba(200, 205, 210, 0.75);*/ border-radius: 15px; margin: 0 auto 50px auto; max-width: 700px;/* padding: 30px;*/ }
main .payformbox form h2 { font-size: 22px!important; font-weight: 500; margin: 0 0 15px 0; }
main .payformbox form h3 { color: #686E71; font-size: 16px; font-weight: 500; margin: 0 0 30px 0; }
main .payformbox form h4 { color: #1C2629; font-size: 20px; font-weight: 500; margin: 0 0 15px 0; position: relative; }
main .payformbox form h4:after { background: #aaa; content: ''; display: inline-block; height: 2px; width: 60%; position: absolute; top: 10px; right: 0; }

main .payformbox { background: rgba(200, 205, 210, 0.75); border-radius: 15px; margin: 0 auto 50px auto; max-width: 700px; padding: 30px; }
main .payformbox .details { margin: 0 0 15px 0; }
main .payformbox .details .item { border-bottom: 1px solid black; font-weight: 500; margin: 5px 0; padding: 10px 30px; }
main .payformbox .details .item .label { display: block; font-size: 10px; font-weight: normal; margin: 0 0 10px 0; }

main .payformbox form .form_under_text_paragraph { background: var(--bg-green); border-radius: 8px; font-size: 12px; line-height: 1.25; margin: 0 0 15px 0; padding: 15px 15px 15px 45px; position: relative; }
main .payformbox form .form_under_text_paragraph b { font-weight: normal;}
main .payformbox form .form_under_text_paragraph b span { margin: 0; }
main .payformbox form .form_under_text_paragraph:before { background: url(../images/icon-info.png) no-repeat center center; content: ''; display: inline-block; height: 19px; margin: 0 10px 0 0; vertical-align: middle; width: 19px; position: absolute; top: 15px; left: 15px; }

main .payformbox .form-field { margin-bottom: 15px; padding-top: 10px; position: relative; }
main .payformbox #sponsor_register_payment_whi_is_making_the_payment_row { display: none; }
/*main .payformbox .form-field label { background: var(--dark-green); border-radius: 15px; color: white; display: inline-block; font-size: 11px; padding: 2px 8px; position: absolute; top: 0; left: 10px;  }*/

main .payformbox .form-field select { background: white; border: 0; border-radius: 10px; color: #686E71; font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 15px 10px; width: 100%; }
main .payformbox .form-field input[type="text"] { background: white; border: 0; border-radius: 10px; color: #686E71; font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 15px 10px; width: 100%; }
main .payformbox .instalment { border: 1px solid var(--primary-green); border-radius: 10px; display: flex; justify-content: space-between; align-items: center; margin: 0 0 30px 0; }
main .payformbox .instalment .text { display: flex; justify-content: space-between; align-items: center; width: calc(100% - 125px); }
main .payformbox .instalment .text p { font-weight: 500; margin: 0; padding: 15px 10px; }
main .payformbox .instalment .text p:last-child { color: var(--primary-green); font-weight: bold; }
main .payformbox .instalment .value { border-left: 1px solid var(--primary-green); color: var(--primary-green); font-weight: bold; display: flex; justify-content: center; align-items: center; padding: 15px 10px; width: 125px; }

main .payformbox form div.steps-top ul { margin: 5px 0 15px 0; padding: 0; }
main .payformbox form div.steps-top li { display: inline-block; list-style: none; margin: 0 15px; vertical-align: center; }
main .payformbox form div.steps-top p { margin: 5px 0 15px 0; }
main .payformbox form .row.noline { background-color: #fff; }
main .payformbox form .total-label { float: left; font-weight: bold; width: 60px; }
main .payformbox form .total-label.fullwidth { width: 100%; }
main .payformbox form .total-text { color: #000; float: left; width: calc(100% - 60px); }
main .payformbox form .total-text em { color: var(--color-font-primary); display: block; font-size: 12px; }
main .payformbox form .payment-option,
main .payformbox form .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; }
main .payformbox form .payment-option-error { padding: 5px; }
main .payformbox form .payment-option:hover { border-color: #bbb; }
main .payformbox form .payment-option.disabled {pointer-events: none; cursor:default;}
main .payformbox form .payment-option.disabled:hover {pointer-events: none; cursor:default;}
main .payformbox form .payment-option.active,
main .payformbox form .payment-option.active:hover { border-color: var(--color-border);}
main .payformbox form .payment-option .icon { text-align: center; width: 36px; }

main .payformbox form .payment-option.active  { background: #c6e1c8; border: 2px solid var(--primary-green); }

main .payformbox form .payment-option .icon i { background: url(../images/check-inactive.png) center center no-repeat; display: inline-block; height: 20px; vertical-align: middle; width: 20px; }
main .payformbox form .payment-option.active .icon i { background: url(../images/check-active.png) center center no-repeat; }
main .payformbox form .payment-option .text { background-color: #fff; border-left: 1px solid #eee; padding: 10px; width: 100%; /* width: calc(100% - 36px); */ transition: border-color 0.3s; }
main .payformbox form .payment-option:hover .text { border-color: #bbb; }
main .payformbox form .payment-option.active .text,
main .payformbox form .payment-option.active:hover .text { border-color: var(--color-border);}
main .payformbox form .payment-option .text p {  font-size: 18px; margin: 0; }
main .payformbox form .payment-option .text h5 { font-size: 28px; font-weight: bold; line-height: 1; margin: 0; }
main .payformbox form .payment-option .text .wire-transfer { color: #4CA84C; font-size: 17px; line-height: 15px; font-weight: 500; }
main .payformbox form .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; }
main .payformbox form .payment-option .text .label { color: #4CA84C; font-size: 17px; line-height: 20px; font-weight: 500; }
main .payformbox form .payment-option .text .logo { width: 35px; margin:0px 5px 0px 0px; }
main .payformbox form .payment-option .text .logo.x2 { width: 70px; margin:0px 5px 0px 0px; }
main .payformbox form .payment-option .text small { font-style: italic; }
main .payformbox form .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; }
#payment-methods-wrapper .hidden {display: none !important; }
main .payformbox form .input-group-text { display: flex; align-items: center; padding-left:10px; padding-right:10px; background-color: unset; }
main .payformbox form .input-group-prepend { border-right: 2px solid var(--bg-green);  width: max-content; }
main .payformbox form .phone_number_separated.country { border-right: 2px solid var(--bg-green) !important; }
main .payformbox form .form_under_info { color: #686E71; font-size: 12px; font-weight: normal; margin: -10px 0px 10px 10px; }

main .payformbox form input[disabled], main .payformbox form input[readonly] {
  outline: none;
  box-shadow: none; /* optional, for browsers like Chrome */
}

main .payformbox .warningbox { background: rgba(224,58,76,0.25); border-radius: 10px; font-size: 12px; margin: 0 0 30px 0; padding: 15px 15px 15px 45px; position: relative; }
main .payformbox .warningbox p { margin: 0 0 15px 0; }
main .payformbox .warningbox p:last-child { margin: 0; }
main .payformbox .warningbox:before { background: url(../images/icon-warning.png) no-repeat center center; content: ''; display: inline-block; height: 19px; margin: 0 10px 0 0; vertical-align: middle; width: 19px; position: absolute; top: 15px; left: 15px; }
main .payformbox input[type="submit"] { background: var(--primary-green); border: 0; border-radius: 10px; color: white; cursor: pointer; font-family: "Roboto", Arial, sans-serif; font-size: 14px; margin: 0 15px 0 0; padding: 10px 40px; transition: background 0.3s ease-in-out; }
main .payformbox input[type="submit"]:hover { background: var(--dark-green); }


/* new 14.11.25 */
main .reviewbox { background: rgba(255,255,255,0.75); border: 1px solid #ddd; border-radius: 16px; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; margin: 0 0 50px 0; padding: 30px; }
main .reviewbox.noflex { display: block; }
main .reviewbox .left { width: 49%; }
main .reviewbox .right { width: 49%; }
main .reviewbox button,
button.cta, a.cta { display:inline-block; background: var(--primary-green); border: 0; border-radius: 10px; color: white; cursor: pointer; max-width: 217px; font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 10px 40px; transition: background 0.3s ease-in-out; }
.wrapper-centered button.cta:hover, .wrapper-centered a.cta:hover { background: var(--bright-green); text-decoration: none;}
a.white-shadow { text-decoration: none; background: white; color: var(--primary-green); border: 0; border-radius: 10px; cursor: pointer; font-family: "Roboto", Arial, sans-serif; font-size: 14px; margin: 0; font-weight: 600; padding: 10px 40px; transition: background 0.3s
ease-in-out; box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.1); }
a.white-shadow:hover{background: var(--light-gray);}
button.white-shadow { background: white; color: var(--primary-green); border: 0; border-radius: 10px; cursor: pointer; font-family: "Roboto", Arial, sans-serif; font-size: 14px; margin: 0; font-weight: 600; padding: 10px 40px; transition: background 0.3s
ease-in-out; box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.1); }
button.white-shadow:hover{background: var(--light-gray);}

.wrapper-contactus h3,
.wrapper-contactus p{ margin:0; }
.wrapper-centered { display:flex; flex-direction: column; justify-content: center; align-items: center; }
.wrapper-contactus { background: var(--light-gray); border-radius: 8px; margin: 0 0 15px 0; padding: 15px; display: flex; flex-direction: column; align-items: center; margin: 72px 0; gap: 20px; padding: 41px 0; }
.wrapper-contactus h3{ color: var(--primary-green);font-size: 20px;font-weight: 500;}
.wrapper-contactus h3:after {background: #969696;content: '';display: block;height: 1px;margin: 10px auto 0 auto;width: 50px;transition: background-color 0.3s;}

main .reviewbox button:hover,
button.cta:hover { background: var(--dark-green); }
main .reviewbox .innerbox { border: 1px solid #ddd; border-radius: 10px; margin: 0 0 30px 0; padding: 15px; }
main .reviewbox .greybox { background: #f5f5f5; border-radius: 10px; margin: 0 0 15px 0; padding: 15px; }
main .reviewbox .greybox td { padding: 10px; width: 50%; }
main .reviewbox .greybox h5 { font-size: 24px; margin: 0; }
main .reviewbox .greybox ul { list-style: disc outside; margin: 0 0 0 20px; padding: 0; }
main .reviewbox .greybox .form-field.upload { margin: 0 0 30px 0; }
main .reviewbox .greybox .form-field.upload:last-child { margin: 0; }
main .reviewbox .greybox .form-field.upload .box { background: white; border-radius: 15px; display: inline-block; margin: 0 0 5px 0; padding: 15px; }
main .reviewbox .greybox .form-field.upload label { display: block; font-size: 12px; margin: 0 0 10px 0; }
main .reviewbox .greybox .form-field.upload p { font-size: 12px; font-style: italic;}
main .reviewbox .infobox,
.infobox-label { background: var(--bg-green); border-radius: 8px; font-size: 12px; line-height: 1.25; margin: 0 0 20px 0; padding: 18px 15px 15px 45px; position: relative; }
main .reviewbox .infobox p { margin: 0; }
main .reviewbox .infobox:before,
.infobox-label:before { background: url(../images/icon-info.png) no-repeat center center; content: ''; display: inline-block; height: 19px; margin: 0 10px 0 0; vertical-align: middle; width: 19px; position: absolute; top: 15px; left: 15px; }
.infobox-label p { margin:0; }
/* end new */
main .student-options { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin: 0 0 50px 0; }
main .student-options.steps-boxes { margin: 72px 0 50px 0; }
main .student-options .item { position: relative; background: var(--bg-green); border-radius: 10px; color: black; display: inline-block; padding: 30px 15px; text-align: center; width: 20%; transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out; }
main .student-options .item3.icon-alert::before { background: url(../images/icon-alert.png) center center no-repeat; background-size: cover; content: ''; height: 30px; width: 30px; position: absolute; top: -14px; right: -14px; }
main .student-options .item h3 { font-size: 20px; margin: 0 0 10px 0; text-align: center; }
main .student-options .item h3:after { background: var(--primary-green); content: ''; display: block; height: 2px; margin: 10px auto 0 auto; width: 16px; transition: background-color 0.3s; }
main .student-options .item:hover h3:after { background: var(--light-green); }
main .student-options .item .icon {  display: inline-block; height: 100px; margin: 0 0 15px 0; overflow: hidden; text-indent: -9999px; white-space: nowrap; width: 100px; }
main .student-options .item.item1 .icon { background: url(../images/icon-payments.png) no-repeat 0 0; }
main .student-options .item.item2 .icon { background: url(../images/icon-history.png) no-repeat 0 0;}
main .student-options .item.item3 .icon { background: url(../images/icon-upload.png) no-repeat 0 0; }
main .student-options .item:hover { background: var(--primary-green); color: white; text-decoration: none; }
main .student-options .item:hover .icon { background-position: 0 -100px; }
main .student-options .faketoggle { background: white; border: 1px solid var(--primary-green); border-radius: 18px; display: flex; height: 18px; margin: 0 auto; width: 38px; }
main .student-options .faketoggle span { background: var(--primary-green); border-radius: 50%; display: inline-block; height: 12px; margin: 2px; overflow: hidden; text-indent: -9999px; white-space: nowrap; width: 13px; }
main .student-options .faketoggle strong { background: url(../images/arrow-right.png) no-repeat center center; display: inline-block; height: 14px; margin: 1px; overflow: hidden; text-indent: -9999px; white-space: nowrap; width: 12px; position: relative; animation: faketoggle 1s infinite; }

main .student-options.register-steps  { justify-content: center; gap: 15px; }
main .student-options.register-steps .item { height: 268px; transition: none;}
main .student-options.register-steps p { margin:0; }
main .student-options.register-steps p.icon { margin: 0; }
main .student-options.register-steps .text-green { color:var(--bright-green); text-transform: uppercase; margin:15px 0; transition: none; }
main .student-options.register-steps .item:hover{ background: var(--bg-green); }
main .student-options.register-steps .item:hover h3,
main .student-options.register-steps .item:hover p
{ color:black; }
main .student-options.register-steps .item:hover .text-green { color: var(--bright-green); }

main .student-options.register-steps .item { max-width: 268px; width: 100%; height: 358px; display: flex; flex-direction: column; align-items: center; }
main .student-options.register-steps .item.register .icon { background: url(../images/register.svg) no-repeat 0 0; }
main .student-options.register-steps .item.pay .icon { background: url(../images/pay.svg) no-repeat 0 0; }
main .student-options.register-steps .item.complete .icon { background: url(../images/complete.svg) no-repeat 0 0; }
main .student-options.register-steps .item h3 { font: 500 20px "Roboto", sans-serif; text-transform: uppercase; max-width: 70%;}

/*
.christmas-banner { display: none; background: url(../images/christmas-banner.png) bottom center no-repeat, linear-gradient( to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100% );  margin: 0 auto 30px; max-width: 1920px; position: relative; padding: 40px 0 120px 0; background-size: 100% auto; }
.christmas-banner .box_left { margin-left:-90px; margin-top:100px; transform: rotate(-270deg); text-transform: uppercase; float: left; color: silver; }
.christmas-banner .box { font-family: 'Rubik', Arial, sans-serif; border-radius: 0 0 50px 0; max-width: 100%; padding: 0px calc(50% - 640px) 0px calc(50% - 640px); }
.christmas-banner img { max-width: 200px; height: auto; }
.christmas-banner h5 { text-align: left; color: #1B1E51; font-size: 1.75rem; padding: 25px 10px 0px 5px; }
.christmas-banner h6 { text-align: left; color: #1B1E51; line-height: 150%; }
.christmas-banner p,
.christmas-banner span { text-align: justify;}
.christmas-banner p {font-weight: 400; font-size: 18px; margin:30px 0;}
.christmas-banner span { font-size:14px; color:var(--dark-green); }
.christmas-banner .box-inner { color: var(--color-font-primary); font-size: 12px; padding: 15px 10px 0px 5px; }
.christmas-banner .box-inner .div-img { margin-top: -15px; }
.christmas-banner .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; }
.christmas-banner .close span { display: inline-block; font-size: 12px; line-height: 1; text-transform: uppercase; vertical-align: middle; }

*/

.banner-text{ margin: 20px 0 ;}
    @keyframes faketoggle { 0% { left: 0; } 50% { left: 4px; } 100% { left: 0; }
}
main .student-options .faketoggle.active span { animation: faketoggle 0.3s ease-in-out; }

footer { background: #1C2629; border-radius: 15px 15px 0 0; color: #686E71; font-size: 12px; padding: 50px 0; text-align: center; margin-top: auto;}
body.login footer { /*position: fixed;*/ bottom: 0; width: 100%; }
body.notfixed footer { position: relative; }
footer a { color: white; display: inline-block; margin: 0 15px; }
footer p { margin: 0 0 30px 0; }
footer p:last-child { margin: 0; }

.bordered_input_group {border-radius: 8px !important; justify-items: start; align-items: center; background: white; }
#image_captcha_ximg { grid-column-start: 3; max-width: 100%; border-top-right-radius: 8px; border-bottom-right-radius: 8px; justify-self: end; }
.image_captcha { display: grid; grid-auto-flow: column; grid-template-columns: auto; }

.input_error { width: 100%; margin: 5px auto;  margin-left: auto; font-size: 14px; font-style: italic; }
.invalid > div.input_error { color: #D00000 !important;  /*! border-color: #D00000 !important; */ }

.mainCokiePolicyBox {font-family: "Roboto", Arial, sans-serif; font-size: 14px; font-size: 15px; color: #4F4F4F; margin-top: 5px; padding: 20px; }
#main_T_and_C { font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 20px; color: #4F4F4F;}
#main_T_and_C .title { font-weight: bold; text-align: center; font-size: 23px; margin: 10px; display: block; }
.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: 900; }
.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; }

main .dt-layout-end { display: flex; float: right !important; margin-top: 0px !important; font-size: 14px !important; }
main .paging .dt-info { padding: 0;}
main .paging .dt-layout-end,
main .paging .bottom { display: flex; align-items: center; }
main .paging .dt-length { padding: 0px 20px 0px 0px; }

main .paging .dt-layout-end .dt-length .dt-input,
main .paging .bottom .dt-length .dt-input { margin-right: 3px; background-color: var(--dark-green) !important; color: white !important; border-radius: 10px; padding: 5px; text-align: center; border: none; cursor: pointer;}

main .paging .dt-layout-end .dt-paging .dt-paging-button.current,
main .paging .bottom .dt-paging .dt-paging-button.current { background-color: white !important; border: none !important; font-weight: bold !important; }

main .paging .dt-paging .dt-paging-button { color: var(--tm-dark-grey) !important; border: none !important; background: none !important; background-color: rgba(0, 0, 0, 0); margin: 4px !important; transition: background-color 0.3s; border-radius: 5px; }

.livehelp > div  { text-align: left; position: relative; float:left; background: white;  border-radius: 20px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.08); color: black; margin: 15px  !important; text-align: left; text-decoration: none; width: 100%; }
.livehelp { overflow: hidden; }
.livehelp .item { max-width: 360px; min-height: 200px; display: inline-block; vertical-align: top; margin: 0 1px 30px 0; width: 100%; background: white; border-radius: 20px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.08); color: black; margin: 0px 15px 15px 0px; padding: 12px; text-decoration: none; }
.livehelp .item .flag { float: right; }
.livehelp .item h5 { color: #000; font-size: 16px; font-weight: bold;  margin: 0 0 10px 0;}

/* Upload Documents */
.student-upload-docs .upload_alert .invoice_cell .not_upload,
.student-upload-docs .upload_alert .receipt_cell .not_upload { color: #ff0000;  font-weight: normal; }

.btn_files_uploaded_close { padding: 5px 16px;}
.btn_files_uploaded_close:hover { background-color: #fff; color: var(--color-font-primary)!important; border: 2px solid; text-decoration: none;}

.student-upload-docs a.passport_upload { background:  var(--color-background-primary); border-radius: 5px; color: white; display: inline-block; padding: 10px 15px; text-decoration: none; }

.student-upload-docs .passport_upload::after { background: url(../images/icon-uploadpass.png) center center no-repeat; content: ''; display: inline-block; height: 20px; margin: 0 0 0 10px; vertical-align: middle; width: 15px; }

.passport_upload_wrap { width: 100%; float: left; }
#navigation_menu { margin: 0px; }

.passport_upload_wrap .wrapper_pre_text { width:100%; float: left; padding: 0px 0px 12px 0px; }
.passport_upload_wrap .wrapper_post_text { width:100%; float: left; padding: 12px 0px 12px 0px!important; }

.student-upload-docs .history_export a { float: right; display: inline-block; margin: 0px 0px 10px 0px; text-align: right!important; }

.student-upload-docs .form_table_row,.background_liteblue  { background: #F2F6F9; border-radius: 5px; color: #4f4f4f; margin: 0 0 15px 0; padding: 17px; font-size: 16px; }
.student-upload-docs .form_table_row.lbl_add_docs_row, .student-upload-docs .form_table_row.india_top_label_row, .student-upload-docs .form_table_row.payer_section_label_row  { background: none; padding: 17px 0;}
.student-upload-docs .form_text_paragraph .imp_note { padding:0px 5px; background-color:#f5d5d7; margin: 10px 0;}
.student-upload-docs .form_table_row { width: 100%; }
.student-upload-docs .form_text_paragraph { color: #4f4f4f; font-size: 16px; }
.student-upload-docs .form_text_paragraph p { line-height:150%; }

.student-upload-docs .form_under_text_paragraph,
.student-upload-docs .form_under_info { color: #4f4f4f!important; font-size: 11px!important; font-weight: normal!important; margin-top: 5px!important; }

.student-upload-docs .upload_receipt_form_text_paragraph { border:none; }

.student-upload-docs #student_upload_invoice_and_receipt_lbl_add_docs_row { background: none!important; border:none; color: #4f4f4f; font-size: 24px; font-weight: 400; padding:0px!important; margin: 15px 0; margin: 0!important; line-height: 1.2; width:100%; }

.student-upload-docs #student_upload_invoice_and_receipt_button_upload_row,
.student-upload-docs #student_upload_passport_button_upload_row { background: none!important; padding:0px!important; }

.student-upload-docs h5 { color: #4f4f4f!important; font-weight: normal; margin-bottom: .5rem; }
.student-upload-docs .page_header {  padding: 0px 0px 15px 0px; }
.student-upload-docs .page_header h2 { margin: 0px; color: #4f4f4f; font-weight: 400; font-size: 24px; }

.files_uploaded { font-size: 19px!important; display: flex; flex-wrap: wrap; align-items: center; justify-content: center !important; padding: 10px; width: auto; }
/*.files_uploaded p { width: 100%!important; color: #4f4f4f; margin: 15px 0px 25px 0px; text-align: center; }*/
.files_uploaded p, .files_uploading_wait p { /*color: #C30009;*/ margin: 5px 30px; text-align: center;}

.student-upload-docs .goback a { border: 2px solid var(--color-border); border-radius: 35px; color: var(--color-font-primary); display: inline-block; padding: 10px 20px; text-decoration: none; }

.student-upload-docs #upload_files_login_full_name_row,
.student-upload-docs #upload_files_login_email_row,
.student-upload-docs #upload_files_login_dob_row,
.student-upload-docs #upload_files_login_country_user_pay_from_row { display: none!important; }

main .student-upload-docs #upload_files .err { width: 100%; background: #ffe5e5 url(../images/icon-info-red.png) 10px center no-repeat; border: 2px solid #fd4d4d; border-radius: 5px; color: #fd4d4d; display: block; font-size: 14px; margin: 5px -15px 15px 0; padding: 8px 8px 8px 45px; }
main .student-upload-docs .input-group label { margin: 0 10px -10px 10px!important; background: var(--dark-green); z-index: 9; font-size: 13px; padding: 0 5px; padding-right: 5px; padding-left: 5px; border-radius: 15px !important; color: white; }
.form-control::file-selector-button { padding: .0rem .75rem; margin: -.375rem -.75rem; -webkit-margin-end: .75rem; margin-inline-end: .75rem; color: #4f4f4f; background-color: unset; pointer-events: none; border-color: inherit; border-style: solid; border-width: 0; border-inline-end-width: var(--bs-border-width); border-radius: 0; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; }
.form-control:hover:not(:disabled):not([readonly])::file-selector-button { background-color: unset; }
main .student-upload-docs .input-group input[type="file"] { background: white; border: 0; border-radius: 10px; color: #686E71;  font-family: "Roboto", Arial, sans-serif; font-size: 14px; padding: 15px 10px 5px; width: 100%; }

.print_box_wrapper { float: left; width:100%; }
#print_box { margin-left: 0px!important; }
.print_btn_confirm a { background-color: var(--color-background-primary); color: var(--primary-green); border-radius: 10px; padding: 8px 16px; margin-top: -20px; margin-bottom: 10px; text-decoration: none; font-size: 16px; border: 1px solid var(--primary-green); display: block; float: left; }

.container .top-nav ul li { list-style: none; }
.pages-content {font-size: 12px!important;}
.student-upload-docs input[type="submit"] { background-color: var(--primary-green) !important; border: 2px solid var(--color-border) !important; border-radius: 5px !important; color: white !important; cursor: pointer; height: 42px; font-size: 14px; padding: 5px 16px; transition: background-color 0.3s; display: inline-block; }

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

.payment_intro {font-size: 16px !important;}
.payment_details_title {  color: var(--primary-green); font-size: 32px !important; font-weight: 500;  margin: 0; text-transform: uppercase; }

main:has(#cc_payments_holder) { background: url(../images/map-white.jpg) center 200px no-repeat; display: flex; justify-content: center; align-items: center; padding: 150px 30px 60px 30px; }
main.form:has(.student_payment_instructions) { background: url(../images/map-white.jpg) center 200px no-repeat; display: flex; justify-content: center; }

.secure_payments_title { width: 0px; height: 0px; display: none; }
.payment_information { display: block; float: left; width: 100%; }

.payment_information legend { font-weight: bold; color: #404040; }
.payment_information fieldset { display: block; float: left; width: 100%;}

.payment_information .data { display: block; float: left; background: rgba(239, 242, 244, 0.623); border-radius: 16px; padding: 30px; height: 100%; width: 100%; margin-bottom: 30px; }
.payment_information .data .info_row { display: block; float: left; width: 25%; height: 55px!important; }

.payment_information .data .info_row span.left { font-weight: normal; font-size: 11px; line-height: 250%; }
.payment_information .data .info_row span.right { font-weight: bold; font-size: 14px; }

.payment_information #iframe_holder { display: block; float: left; width: 100%; }
/*.payment_information #iframe_holder .cc_payment_status_message { margin-top: 20px; font-size: 14px; line-height: 1.25; border:1px solid red; text-align: center; }*/

.payment_information #iframe_holder .cc_payment_status_message { display: block; background: rgba(239, 242, 244, 0.623); border-radius: 16px; padding: 30px; height: 100%; width: 100%; margin-bottom: 30px; margin-top: 20px; font-size: 14px; line-height: 1.25; text-align: center!important; }
.payment_information #iframe_holder .cc_payment_status_message .message { text-align: center!important; display: table;  max-width: fit-content; margin-left: auto; margin-right: auto; font-size: 18px; line-height: 250%; }

.cc_payment_status_message a { line-height: 100%; background: var(--primary-orange); border: 1px solid var(--primary-orange); border-radius: 5px; color: white; display: table ; font-size: 14px; padding: 10px 15px; transition: background 0.3s ease-in-out, border-color 0.3s ease-in-out; margin: 10px; text-decoration: none; clear:both!important;}
.cc_payment_status_message a:hover { background: white; color: var(--primary-orange) !important; text-decoration: none; }

.secure_payments_important_message { display: block; float: left; width: 50%; background: #ffe5e5; border-radius: 8px; font-size: 12px; line-height: 1.25; margin: 0 0 35px 0; padding: 15px 15px 15px 45px; position: relative; }
.secure_payments_important_message::before { background: url(../images/icon-warning.png) no-repeat center center; content: ''; display: inline-block; height: 19px; margin: 0 10px 0 0; vertical-align: middle; width: 19px; position: absolute; top: 15px; left: 15px; }

.secure_payments_note { display: block; float: left; width: 50%; box-sizing: 8px; font-size: 12px; line-height: 1.25; margin: 0 0 35px 0; padding: 18px 15px 15px 120px; position: relative; }
.secure_payments_note::before { background: url(../images/lock-icon.png) no-repeat center center; content: ''; display: inline-block; height: 90px; margin: -20px 10px 0 0; vertical-align: top; width: 89px; position: absolute; top: 15px; left: 15px; }

div.dt-container.dt-empty-footer tbody > tr:last-child > * { border-bottom: none !important; }

main .insead-user-pmt-data .toggle {  display: none; }

input.form-check-input { border: 2px solid var(--primary-green); left: 20px; }

@media (max-width: 1470px) {
    .termsfeed-pc1-sticky-element { margin-bottom: 0px!important; }
}

@media (max-width: 400px) {
    .termsfeed-pc1-sticky-element { height: 10px!important; }
}

@media (max-width: 1200px) {
    footer { line-height: 2; }
    /*
    main .tran-details .popup table th,
	main .tran-details .popup table td {
        padding: 7px;
    }
    */
}

@media (max-height: 530px) {
    footer { line-height: 2; }
    /*
    main .tran-details .popup table th,
	main .tran-details .popup table td {
        padding: 7px;
    }
    */
}

@media (max-width: 991px) {
    main nav.top-nav { margin: 60px 0 50px 0; }
    header .container { flex-direction: column; align-items: flex-start; gap: 15px; }
    header .meta { align-self: flex-end; }
    main .weaccept { flex-direction: column; align-items: center; gap: 15px; }
    main .weaccept h4 { text-align: center; }
    main .payment-boxes .info { flex-direction: column; justify-content: stretch; align-items: flex-start; gap: 15px; }
    main .payment-boxes .details { border-top: 2px solid #bbb; padding: 15px 0; width: 100%; }
    main .filter-box h4:after { display: none; }
    main .filter-box .form-field { width: 100%; }
    main .list-top { flex-direction: column; align-items: flex-start; gap: 15px; }
    main .weaccept ul { flex-wrap: wrap; justify-content: center; }
    main .completebox { flex-direction: column; align-items: flex-start; gap: 15px; }
    main .completebox .whitebox { width: 100%; }
    body.notfixed main { padding: 30px 15px; }
    main .payformbox h4:after { display: none; }
    main .reviewbox { flex-direction: column; align-items: flex-start; gap: 15px; }
    main .reviewbox .left,
    main .reviewbox .right { width: 100%; }
    main .student-options { flex-wrap: wrap; justify-content: center; gap: 30px; }
    main .student-options > img { display: none; }
    main .student-options .item { width: 40%; }
    main .payment-boxes .supported { flex-direction: column; }
}

@media (max-width: 768px) {

    .secure_payments_note { display: block; float: left; width: 100%; box-sizing: 8px; font-size: 12px; line-height: 1.25; margin: 0 0 35px 0; padding: 18px 15px 15px 120px; position: relative; }
    .secure_payments_note::before { background: url(../images/lock-icon.png) no-repeat center center; content: ''; display: inline-block; height: 90px; margin: 5px 10px 0 0; vertical-align: top; width: 89px; position: absolute; top: 15px; left: 15px; }
    .secure_payments_important_message { display: block; float: left; width: 100%; background: #ffe5e5; border-radius: 8px; font-size: 12px; line-height: 1.25; margin: 0 0 35px 0; padding: 15px 15px 15px 45px; position: relative; }
    .secure_payments_important_message::before { background: url(../images/icon-warning.png) no-repeat center center; content: ''; display: inline-block; height: 19px; margin: 0 10px 0 0; vertical-align: middle; width: 19px; position: absolute; top: 15px; left: 15px; }

    header .container { flex-direction: column; align-items: flex-end; }
    header .logos { justify-content: center; width: 100%; }
    header .lang > a { overflow: hidden; padding: 5px; gap: 5px; text-indent: -9999px; white-space: nowrap; }
    header .lang > a:before { background: url(../images/icon-globe-white.png) no-repeat center center; content: ""; display: inline-block; height: 32px; width: 32px; }
    body.login header .lang > a:before { background: url(../images/icon-globe.png) no-repeat center center; }
    main .payment-boxes .box,
    main .payment-boxes .table { overflow-x: auto; }
    main .payment-boxes .box table,
    main .payment-boxes .table table { min-width: 800px; }
    main .student-options { flex-direction: column; }
    main .student-options > img { display: block; }
    main .student-options .item { width: 100%; }
    main .payment-boxes .box table, main .payment-boxes .table table { min-width: 0;}

}

@media (max-width: 631px) {
    main .container .request-a-callback-box { display: flex; margin-top: 10px; margin-bottom: 30px; }
    main .container .request-a-callback-box a.request-a-callback { background: var(--primary-green); border: 1px solid var(--primary-green); border-radius: 8px; color: white; display: inline-block; margin: 0 0 0 15px; padding: 10px 15px; text-decoration: none; transition: background 0.3s ease-in-out; margin: 0 auto; }
    main .container .request-a-callback-box a.request-a-callback:hover { background: white; border: 1px solid var(--primary-green); border-radius: 8px; color: var(--primary-green); display: inline-block; margin: 0 0 0 15px; padding: 10px 15px; text-decoration: none; transition: background 0.3s ease-in-out; margin: 0 auto;  }

    main .insead-user-pmt-data .hide-block { display: block!important; }
    main .insead-user-pmt-data .toggle::after { content: ''; display: block;  height: 10px !important;  background: url(../images/arrow-down.png) center center no-repeat !important; }
    main .insead-user-pmt-data .toggle { text-align: center; display: block; margin-left: auto; margin-right: auto; }
}

@media (max-width: 630px) {
    .payment_information .data .info_row { display: block; float: left; width: 50%; height: 65px !important; }
    main .insead-user-pmt-data .hide-block { display: none; }
    main .insead-user-pmt-data .block { display: none; }
    main .insead-user-pmt-data .toggle::after { content: ''; display: block;  height: 10px !important;  background: url(../images/arrow-down.png) center center no-repeat !important; }
    main .insead-user-pmt-data .toggle { text-align: center; display: block; margin-left: auto; margin-right: auto; }
}

@media (max-width: 500px) {
    .payment_information .data .info_row { display: block; float: left; width: 100%; height: 65px !important; }
}

@media (max-width: 490px) {
    .company-wrapper {display: none;}
    /* main nav.top-nav { margin: 160px 0 50px 0; } */
    main.form:has(#cc_payments_holder) nav.top-nav { margin: 55px 0 50px 0; }
    .payment_information .data .info_row { display: block; float: left; width: 100%; height: 65px !important; }
}

@media (max-width: 480px) {
    main nav.top-nav { margin: 160px 0 50px 0; }
    header .logos { justify-content: space-around; }
    header .logos .mobile { display: block; }
    header .logos .desktop { display: none; }
    main { padding: 30px 0; }
    main h1 {color: var(--primary-green); font-size: 32px; font-weight: 500; margin-top: 25px; text-align: center; text-transform: uppercase; main .container .request-a-callback-box a.request-a-callback { background: var(--primary-green); border: 1px solid var(--primary-green); border-radius: 8px; color: white; display: inline-block; margin: 0 0 0 15px; padding: 10px 15px; text-decoration: none; transition: background 0.3s ease-in-out; margin: 0 auto;}
    main nav ul { flex-direction: column; align-items: center; }
    main .loginbox { padding: 30px 15px; width: auto; }
    body.intro main .boxes { gap: 25px; }
    main .payment-boxes .box { padding: 15px; }
    main .payment-boxes .info { flex-direction: column; justify-content: stretch; align-items: flex-start; gap: 15px; }
    main .payment-boxes .details { border-top: 2px solid #bbb; padding: 15px 0; width: 100%; }
    main .filter-box h4:after { display: none; }
    main .filter-box .form-field { width: 100%; }
    main .pagination { justify-content: center; }
    body.notfixed main { padding-left: 0; padding-right: 0; }
    main .completebox,
    main .completebox .whitebox,
    main .payformbox { padding: 15px; }
    main .payformbox .payment-methods .item .right p { display: none; }
    main .reviewbox { border: 0; padding: 0; }
    /*
	main .tran-details .popup { min-width: 0; padding: 15px; width: 100%; }
    main .tran-details .popup table th,
    main .tran-details .popup table td { display: block; padding: 5px; text-align: center; width: 100%; }
    */
}