/* Critical CSS: the theme rules needed to draw the first screen (header, banner, page titles) on every page type.
   Generated from the other theme CSS files (copies of their rules, same order) - do not edit by hand;
   regenerate after CSS changes. The full files load right after, without blocking the first paint. */
@font-face{font-family:"hgi-stroke-rounded";src:url("https://cdn.hugeicons.com/font/hgi-stroke-rounded.eot?t=1721855138058");src:url("https://cdn.hugeicons.com/font/hgi-stroke-rounded.eot?t=1721855138058#iefix") format("embedded-opentype"),url("https://cdn.hugeicons.com/font/hgi-stroke-rounded.woff2?t=1721855138058") format("woff2"),url("https://cdn.hugeicons.com/font/hgi-stroke-rounded.woff?t=1721855138058") format("woff"),url("https://cdn.hugeicons.com/font/hgi-stroke-rounded.ttf?t=1721855138058") format("truetype"),url("https://cdn.hugeicons.com/font/hgi-stroke-rounded.svg?t=1721855138058#hgi-stroke-rounded") format("svg")}
@font-face{font-family:"hgi-stroke-rounded";src:url("../fonts/hgi-stroke-rounded-subset.woff2") format("woff2");unicode-range:U+3AA2,U+3AA4,U+3ABA,U+3B03,U+3B34,U+3B44,U+3B4E,U+3B5A-3B5B,U+3B6A-3B6B,U+3B79-3B7A,U+3B86-3B87,U+3BBE,U+3C5C,U+3C63-3C64,U+3C67,U+3C8C,U+3C98,U+3CA2,U+3CC8,U+3CCC,U+3CE2,U+3CE6-3CE7,U+3D29,U+3D42,U+3D45,U+3D76,U+3D7E,U+3D8E,U+3D9C,U+3DA6-3DA7,U+3E05,U+3E0D-3E0E,U+3E1D,U+3E1F,U+3E59,U+3E70,U+3E74,U+3EDA,U+3EF1,U+3EF6,U+3F17,U+3F59,U+3F6B,U+3FBA,U+3FE6,U+3FE9,U+3FF0,U+3FF2,U+3FFA,U+401D,U+40C6,U+40EF-40F0,U+40FA,U+412F,U+4132,U+4134,U+413A,U+4193,U+4196,U+41BE,U+41CC,U+41E1,U+4235,U+4289,U+428C,U+4294,U+4296,U+429F,U+42C1,U+42EE,U+42F4,U+4305,U+4344,U+435A-435B,U+4386,U+4395,U+43B0,U+43E4,U+43F1,U+43FF,U+4407,U+440B,U+446B,U+4486,U+448D,U+454C,U+45C4,U+45EC,U+467C,U+4682,U+4695,U+46B0,U+46C8,U+46D0,U+46D8,U+4749,U+474B,U+475B,U+4777,U+4779,U+477E,U+47BE,U+47C9,U+47E3,U+4814,U+4825,U+4827-4828,U+489C,U+48A0,U+48B0,U+494E,U+4950,U+495E,U+49AE,U+49C2,U+49CD,U+49D6,U+49DF,U+4A02-4A03,U+4A50,U+4AAF,U+4AB7-4AB8}
.hgi-stroke{font-family:"hgi-stroke-rounded" !important;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:relative}
.hgi-stroke:after{opacity:.4;position:absolute;left:0}
.hgi-stroke.hgi-account-setting-02:before{content:"㪢"}
.hgi-stroke.hgi-android:before{content:"㬴"}
.hgi-stroke.hgi-apple:before{content:"㭄"}
.hgi-stroke.hgi-archive:before{content:"㭎"}
.hgi-stroke.hgi-arrow-left-02:before{content:"㭫"}
.hgi-stroke.hgi-book-open-01:before{content:"㱣"}
.hgi-stroke.hgi-briefcase-02:before{content:"㲢"}
.hgi-stroke.hgi-calendar-03:before{content:"㳦"}
.hgi-stroke.hgi-certificate-01:before{content:"㵶"}
.hgi-stroke.hgi-chatting-01:before{content:"㶜"}
.hgi-stroke.hgi-clock-01:before{content:"㸅"}
.hgi-stroke.hgi-computer:before{content:"㹙"}
.hgi-stroke.hgi-dashboard-browsing:before{content:"㻚"}
.hgi-stroke.hgi-database:before{content:"㻶"}
.hgi-stroke.hgi-facebook-02:before{content:"㿩"}
.hgi-stroke.hgi-favourite-circle:before{content:"㿰"}
.hgi-stroke.hgi-graduate-male:before{content:"䃯"}
.hgi-stroke.hgi-graduation-scroll:before{content:"䃰"}
.hgi-stroke.hgi-grid-view:before{content:"䃺"}
.hgi-stroke.hgi-instagram:before{content:"䇌"}
.hgi-stroke.hgi-job-search:before{content:"䇡"}
.hgi-stroke.hgi-link-01:before{content:"䊉"}
.hgi-stroke.hgi-link-04:before{content:"䊌"}
.hgi-stroke.hgi-mail-01:before{content:"䋮"}
.hgi-stroke.hgi-message-question:before{content:"䎆"}
.hgi-stroke.hgi-mortarboard-02:before{content:"䐋"}
.hgi-stroke.hgi-new-twitter:before{content:"䑫"}
.hgi-stroke.hgi-note-edit:before{content:"䒆"}
.hgi-stroke.hgi-school-01:before{content:"䙼"}
.hgi-stroke.hgi-school:before{content:"䚂"}
.hgi-stroke.hgi-search-01:before{content:"䚕"}
.hgi-stroke.hgi-share-knowledge:before{content:"䛘"}
.hgi-stroke.hgi-snapchat:before{content:"䝛"}
.hgi-stroke.hgi-students:before{content:"䠔"}
.hgi-stroke.hgi-user-add-01:before{content:"䧂"}
.hgi-stroke.hgi-user-group:before{content:"䧍"}
.hgi-stroke.hgi-user-settings-01:before{content:"䧟"}
.hgi-stroke.hgi-youtube:before{content:"䪯"}
:root{--blue:#007bff;--indigo:#6610f2;--purple:#6f42c1;--pink:#e83e8c;--red:#dc3545;--orange:#fd7e14;--yellow:#ffc107;--green:#28a745;--teal:#20c997;--cyan:#17a2b8;--white:#fff;--gray:#6c757d;--gray-dark:#343a40;--primary:#007bff;--secondary:#6c757d;--success:#28a745;--info:#17a2b8;--warning:#ffc107;--danger:#dc3545;--light:#f8f9fa;--dark:#343a40;--breakpoint-xs:0;--breakpoint-sm:576px;--breakpoint-md:768px;--breakpoint-lg:992px;--breakpoint-xl:1200px;--font-family-sans-serif:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-family-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
*,::after,::before{box-sizing:border-box}
html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}
hr{box-sizing:content-box;height:0;overflow:visible}
h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem}
p{margin-top:0;margin-bottom:1rem}
dl,ol,ul{margin-top:0;margin-bottom:1rem}
b,strong{font-weight:bolder}
small{font-size:80%}
sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}
sub{bottom:-.25em}
sup{top:-.5em}
a{color:#007bff;text-decoration:none;background-color:transparent}
a:hover{color:#0056b3;text-decoration:underline}
img{vertical-align:middle;border-style:none}
svg{overflow:hidden;vertical-align:middle}
label{display:inline-block;margin-bottom:.5rem}
button{border-radius:0}
button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}
button,input{overflow:visible}
button,select{text-transform:none}
[role=button]{cursor:pointer}
[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}
[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}
textarea{overflow:auto;resize:vertical}
fieldset{min-width:0;padding:0;margin:0;border:0}
legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}
[type=search]{outline-offset:-2px;-webkit-appearance:none}
[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}
[hidden]{display:none!important}
.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin-bottom:.5rem;font-weight:500;line-height:1.2}
.h1,h1{font-size:2.5rem}
.h2,h2{font-size:2rem}
.h3,h3{font-size:1.75rem}
.h4,h4{font-size:1.5rem}
.h6,h6{font-size:1rem}
hr{margin-top:1rem;margin-bottom:1rem;border:0;border-top:1px solid rgba(0,0,0,.1)}
.small,small{font-size:.875em;font-weight:400}
.container,.container-fluid,.container-lg,.container-md,.container-sm,.container-xl{width:100%;padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}
@media (min-width:576px){.container,.container-sm{max-width:540px}}
@media (min-width:768px){.container,.container-md,.container-sm{max-width:720px}}
@media (min-width:992px){.container,.container-lg,.container-md,.container-sm{max-width:960px}}
@media (min-width:1200px){.container,.container-lg,.container-md,.container-sm,.container-xl{max-width:1140px}}
.row{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-15px;margin-left:-15px}
.col,.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-auto,.col-lg,.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto,.col-md,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto,.col-sm,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto,.col-xl,.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{position:relative;width:100%;padding-right:15px;padding-left:15px}
.col{-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}
.row-cols-1>*{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}
.row-cols-2>*{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
@media (min-width:576px){.col-sm-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}}
@media (min-width:768px){.row-cols-md-2>*{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}}
@media (min-width:768px){.row-cols-md-3>*{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}}
@media (min-width:768px){.col-md-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}}
@media (min-width:768px){.col-md-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}}
@media (min-width:992px){.col-lg-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}}
@media (min-width:992px){.col-lg-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}}
@media (min-width:992px){.col-lg-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}}
@media (min-width:1200px){.row-cols-xl-4>*{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}}
@media (min-width:1200px){.row-cols-xl-6>*{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}}
@media (min-width:1200px){.col-xl-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}}
@media (min-width:1200px){.col-xl-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}}
.form-control{display:block;width:100%;height:calc(1.5em + .75rem + 2px);padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:#495057;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}
.form-control:focus{color:#495057;background-color:#fff;border-color:#80bdff;outline:0;box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}
.form-control::-webkit-input-placeholder{color:#6c757d;opacity:1}
.form-control::placeholder{color:#6c757d;opacity:1}
.form-text{display:block;margin-top:.25rem}
.form-check{position:relative;display:block;padding-left:1.25rem}
.form-check-input{position:absolute;margin-top:.3rem;margin-left:-1.25rem}
.form-check-label{margin-bottom:0}
.form-check-inline{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;padding-left:0;margin-right:.75rem}
.form-check-inline .form-check-input{position:static;margin-top:0;margin-right:.3125rem;margin-left:0}
.btn{display:inline-block;font-weight:400;color:#212529;text-align:center;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:transparent;border:1px solid transparent;padding:.375rem .75rem;font-size:1rem;line-height:1.5;border-radius:.25rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}
.btn:hover{color:#212529;text-decoration:none}
.btn.focus,.btn:focus{outline:0;box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}
.btn:not(:disabled):not(.disabled){cursor:pointer}
.btn-light{color:#212529;background-color:#f8f9fa;border-color:#f8f9fa}
.btn-light:hover{color:#212529;background-color:#e2e6ea;border-color:#dae0e5}
.btn-light.focus,.btn-light:focus{color:#212529;background-color:#e2e6ea;border-color:#dae0e5;box-shadow:0 0 0 .2rem rgba(216,217,219,.5)}
.btn-light:not(:disabled):not(.disabled).active,.btn-light:not(:disabled):not(.disabled):active,.show>.btn-light.dropdown-toggle{color:#212529;background-color:#dae0e5;border-color:#d3d9df}
.btn-light:not(:disabled):not(.disabled).active:focus,.btn-light:not(:disabled):not(.disabled):active:focus,.show>.btn-light.dropdown-toggle:focus{box-shadow:0 0 0 .2rem rgba(216,217,219,.5)}
.fade:not(.show){opacity:0}
.collapse:not(.show){display:none}
.dropdown,.dropleft,.dropright,.dropup{position:relative}
.dropdown-toggle{white-space:nowrap}
.dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}
.dropdown-menu{position:absolute;top:100%;left:0;z-index:1000;display:none;float:left;min-width:10rem;padding:.5rem 0;margin:.125rem 0 0;font-size:1rem;color:#212529;text-align:left;list-style:none;background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,.15);border-radius:.25rem}
.dropdown-item{display:block;width:100%;padding:.25rem 1.5rem;clear:both;font-weight:400;color:#212529;text-align:inherit;white-space:nowrap;background-color:transparent;border:0}
.input-group{position:relative;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:stretch;align-items:stretch;width:100%}
.input-group>.form-control, .input-group>.form-control-plaintext{position:relative;-ms-flex:1 1 auto;flex:1 1 auto;width:1%;min-width:0;margin-bottom:0}
.input-group>.form-control:focus{z-index:3}
.input-group>.form-control:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}
.input-group:not(.has-validation)>.form-control:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.input-group-text{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:.375rem .75rem;margin-bottom:0;font-size:1rem;font-weight:400;line-height:1.5;color:#495057;text-align:center;white-space:nowrap;background-color:#e9ecef;border:1px solid #ced4da;border-radius:.25rem}
.nav{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}
.nav-link{display:block;padding:.5rem 1rem}
.nav-link:focus,.nav-link:hover{text-decoration:none}
.nav-tabs{border-bottom:1px solid #dee2e6}
.nav-tabs .nav-link{margin-bottom:-1px;background-color:transparent;border:1px solid transparent;border-top-left-radius:.25rem;border-top-right-radius:.25rem}
.nav-tabs .nav-link:focus,.nav-tabs .nav-link:hover{isolation:isolate;border-color:#e9ecef #e9ecef #dee2e6}
.nav-tabs .nav-item.show .nav-link,.nav-tabs .nav-link.active{color:#495057;background-color:#fff;border-color:#dee2e6 #dee2e6 #fff}
.tab-content>.tab-pane{display:none}
.tab-content>.active{display:block}
.navbar{position:relative;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding:.5rem 1rem}
.navbar .container,.navbar .container-fluid,.navbar .container-lg,.navbar .container-md,.navbar .container-sm,.navbar .container-xl{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}
.navbar-brand{display:inline-block;padding-top:.3125rem;padding-bottom:.3125rem;margin-right:1rem;font-size:1.25rem;line-height:inherit;white-space:nowrap}
.navbar-brand:focus,.navbar-brand:hover{text-decoration:none}
.navbar-nav{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding-left:0;margin-bottom:0;list-style:none}
.navbar-nav .nav-link{padding-right:0;padding-left:0}
.navbar-collapse{-ms-flex-preferred-size:100%;flex-basis:100%;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center}
.navbar-toggler{padding:.25rem .75rem;font-size:1.25rem;line-height:1;background-color:transparent;border:1px solid transparent;border-radius:.25rem}
.navbar-toggler:focus,.navbar-toggler:hover{text-decoration:none}
@media (max-width:991.98px){.navbar-expand-lg>.container,.navbar-expand-lg>.container-fluid,.navbar-expand-lg>.container-lg,.navbar-expand-lg>.container-md,.navbar-expand-lg>.container-sm,.navbar-expand-lg>.container-xl{padding-right:0;padding-left:0}}
@media (min-width:992px){.navbar-expand-lg{-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-pack:start;justify-content:flex-start}}
@media (min-width:992px){.navbar-expand-lg .navbar-nav{-ms-flex-direction:row;flex-direction:row}}
@media (min-width:992px){.navbar-expand-lg .navbar-nav .nav-link{padding-right:.5rem;padding-left:.5rem}}
@media (min-width:992px){.navbar-expand-lg>.container,.navbar-expand-lg>.container-fluid,.navbar-expand-lg>.container-lg,.navbar-expand-lg>.container-md,.navbar-expand-lg>.container-sm,.navbar-expand-lg>.container-xl{-ms-flex-wrap:nowrap;flex-wrap:nowrap}}
@media (min-width:992px){.navbar-expand-lg .navbar-collapse{display:-ms-flexbox!important;display:flex!important;-ms-flex-preferred-size:auto;flex-basis:auto}}
@media (min-width:992px){.navbar-expand-lg .navbar-toggler{display:none}}
.card{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid rgba(0,0,0,.125);border-radius:.25rem}
.card-body{-ms-flex:1 1 auto;flex:1 1 auto;min-height:1px;padding:1.25rem}
.card-title{margin-bottom:.75rem}
.card-text:last-child{margin-bottom:0}
.card-img-overlay{position:absolute;top:0;right:0;bottom:0;left:0;padding:1.25rem;border-radius:calc(.25rem - 1px)}
.card-img, .card-img-top{-ms-flex-negative:0;flex-shrink:0;width:100%}
.card-img,.card-img-top{border-top-left-radius:calc(.25rem - 1px);border-top-right-radius:calc(.25rem - 1px)}
.accordion{overflow-anchor:none}
.close{float:right;font-size:1.5rem;font-weight:700;line-height:1;color:#000;text-shadow:0 1px 0 #fff;opacity:.5}
.close:not(:disabled):not(.disabled):focus,.close:not(:disabled):not(.disabled):hover{opacity:.75}
.modal{position:fixed;top:0;left:0;z-index:1050;display:none;width:100%;height:100%;overflow:hidden;outline:0}
.modal-dialog{position:relative;width:auto;margin:.5rem;pointer-events:none}
.modal.fade .modal-dialog{transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out,-webkit-transform .3s ease-out;-webkit-transform:translate(0,-50px);transform:translate(0,-50px)}
.modal.show .modal-dialog{-webkit-transform:none;transform:none}
.modal-dialog-centered{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:calc(100% - 1rem)}
.modal-dialog-centered::before{display:block;height:calc(100vh - 1rem);height:-webkit-min-content;height:-moz-min-content;height:min-content;content:""}
.modal-content{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%;pointer-events:auto;background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,.2);border-radius:.3rem;outline:0}
.modal-body{position:relative;-ms-flex:1 1 auto;flex:1 1 auto;padding:1rem}
.modal-footer{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;padding:.75rem;border-top:1px solid #dee2e6;border-bottom-right-radius:calc(.3rem - 1px);border-bottom-left-radius:calc(.3rem - 1px)}
@media (min-width:576px){.modal-dialog-centered::before{height:calc(100vh - 3.5rem);height:-webkit-min-content;height:-moz-min-content;height:min-content}}
.spinner-border{display:inline-block;width:2rem;height:2rem;vertical-align:-.125em;border:.25em solid currentcolor;border-right-color:transparent;border-radius:50%;-webkit-animation:.75s linear infinite spinner-border;animation:.75s linear infinite spinner-border}
.bg-white{background-color:#fff!important}
.border-0{border:0!important}
.d-none{display:none!important}
.d-flex{display:-ms-flexbox!important;display:flex!important}
@media (min-width:992px){.d-lg-none{display:none!important}}
@media (min-width:992px){.d-lg-flex{display:-ms-flexbox!important;display:flex!important}}
@media (min-width:992px){.d-lg-inline-flex{display:-ms-inline-flexbox!important;display:inline-flex!important}}
.flex-column{-ms-flex-direction:column!important;flex-direction:column!important}
.justify-content-center{-ms-flex-pack:center!important;justify-content:center!important}
.justify-content-between{-ms-flex-pack:justify!important;justify-content:space-between!important}
.align-items-center{-ms-flex-align:center!important;align-items:center!important}
@media (min-width:992px){.flex-lg-row{-ms-flex-direction:row!important;flex-direction:row!important}}
@media (min-width:992px){.flex-lg-column{-ms-flex-direction:column!important;flex-direction:column!important}}
@media (min-width:992px){.justify-content-lg-start{-ms-flex-pack:start!important;justify-content:flex-start!important}}
.h-100{height:100%!important}
.m-0{margin:0!important}
.mb-0,.my-0{margin-bottom:0!important}
.mt-2,.my-2{margin-top:.5rem!important}
.p-0{padding:0!important}
.pt-5,.py-5{padding-top:3rem!important}
.pb-5,.py-5{padding-bottom:3rem!important}
.text-center{text-align:center!important}
.text-muted{color:#6c757d!important}
.text-decoration-none{text-decoration:none!important}
:root{--text-default: #161616;
    --link-neutral: #384250;
    --colors-base-white: #ffffff;
    --colors-base-black: #000000;
    --colors-alpha-white: 0deg 0% 100%;
    --colors-alpha-black: 0deg 0% 0%;
    
    --display-2xl: 4.5rem;
    --display-xl: 3.75rem;
    --display-lg: 3rem;
    --display-md: 2.25rem;
    --display-sm: 1.875rem;
    --display-xs: 1.5rem;
    --text-xl: 1.25rem;
    --text-lg: 1.125rem;
    --text-md: 1rem;
    --text-sm: 0.875rem;
    --text-xs: 0.75rem;
    --text-2xs: 0.75rem;
    
    --regular: 400;
    --medium: 500;
    --semibold: 600;
    --bold: 700;
    
    --colors-gray-25: #fcfcfd;
    --colors-gray-50: #f9fafb;
    --colors-gray-100: #F3F4F6;
    --colors-gray-200: #E5E7EB;
    --colors-gray-300: #D2D6DB;
    --colors-gray-400: #9DA4AE;
    --colors-gray-500: #6C737F;
    --colors-gray-600: #4D5761;
    --colors-gray-700: #384250;
    --colors-gray-800: #1F2A37;
    --colors-gray-900: #111927;
    --colors-gray-950: #0D121C;
    
    --primary-green: #1B8354;
    --colors-brand-25: #f7fdf9;
    --colors-brand-50: #f3fcf6;
    --colors-brand-100: #dff6e7;
    --colors-brand-200: #b8eacb;
    --colors-brand-300: #88d8ad;
    --colors-brand-400: #54c08a;
    --colors-brand-500: #25935f;
    --colors-brand-600: #1b8354;
    --colors-brand-700: #166a45;
    --colors-brand-800: #14573a;
    --colors-brand-900: #104631;
    --colors-brand-950: #092a1e;
    
    --colors-error-25: #fffbfa;
    --colors-error-50: #fef3f2;
    --colors-error-100: #fee4e2;
    --colors-error-200: #fecdca;
    --colors-error-300: #fda29b;
    --colors-error-400: #f97066;
    --colors-error-500: #f04438;
    --colors-error-600: #d92d20;
    --colors-error-700: #b42318;
    --colors-error-800: #912018;
    --colors-error-900: #7a271a;
    --colors-error-950: #55160c;
    
    --colors-warning-25: #fffcf5;
    --colors-warning-50: #fffaeb;
    --colors-warning-100: #fef0c7;
    --colors-warning-200: #fedf89;
    --colors-warning-300: #fec84b;
    --colors-warning-400: #fdb022;
    --colors-warning-500: #f79009;
    --colors-warning-600: #dc6803;
    --colors-warning-700: #b54708;
    --colors-warning-800: #93370d;
    --colors-warning-900: #7a2e0e;
    --colors-warning-950: #4e1d09;
    
    --colors-info-25: #f5faff;
    --colors-info-50: #eff8ff;
    --colors-info-100: #d1e9ff;
    --colors-info-200: #b2ddff;
    --colors-info-300: #84caff;
    --colors-info-400: #53b1fd;
    --colors-info-500: #2e90fa;
    --colors-info-600: #1570ef;
    --colors-info-700: #175cd3;
    --colors-info-800: #1849a9;
    --colors-info-900: #194185;
    --colors-info-950: #102a56;
    
    --colors-success-25: #f6fef9;
    --colors-success-50: #ecfdf3;
    --colors-success-100: #dcfae6;
    --colors-success-200: #abefc6;
    --colors-success-300: #75e0a7;
    --colors-success-400: #47cd89;
    --colors-success-500: #17b26a;
    --colors-success-600: #079455;
    --colors-success-700: #067647;
    --colors-success-800: #085d3a;
    --colors-success-900: #074d31;
    --colors-success-950: #053321;
    
    --gradient-gray-600-500-90deg: linear-gradient(90deg, var(--colors-gray-600) 0%, var(--colors-gray-500) 100%);
    --gradient-gray-700-600-45deg: linear-gradient(45deg, var(--colors-gray-700) 0%, var(--colors-gray-600) 100%);
    --gradient-gray-800-600-45deg: linear-gradient(45deg, var(--colors-gray-800) 0%, var(--colors-gray-600) 100%);
    --gradient-gray-800-600-90deg: linear-gradient(90deg, var(--colors-gray-800) 0%, var(--colors-gray-600) 100%);
    --gradient-gray-800-700-26-5deg: linear-gradient(26.5deg, var(--colors-gray-600) 0%, var(--colors-gray-700) 100%);
    --gradient-gray-900-600-45deg: linear-gradient(45deg, var(--colors-gray-900) 0%, var(--colors-gray-600) 100%);
    --gradient-brand-600-500-90deg: linear-gradient(90deg, var(--colors-brand-600) 0%, var(--colors-brand-500) 100%);
    --gradient-brand-700-600-45deg: linear-gradient(45deg, var(--colors-brand-700) 0%, var(--colors-brand-600) 100%);
    --gradient-brand-800-600-45deg: linear-gradient(45deg, var(--colors-brand-800) 0%, var(--colors-brand-600) 100%);
    --gradient-brand-800-600-90deg: linear-gradient(90deg, var(--colors-brand-800) 0%, var(--colors-brand-600) 100%);
    --gradient-brand-800-700-26-5deg: linear-gradient(26.5deg, var(--colors-brand-600) 0%, var(--colors-brand-700) 100%);
    --gradient-brand-900-600-45deg: linear-gradient(45deg, var(--colors-brand-900) 0%, var(--colors-brand-600) 100%);
    --colors-text-primary: var(--colors-gray-950);
    --colors-text-primary_on-brand: var(--colors-base-white);
    --colors-text-secondary: var(--colors-gray-700);
    --colors-text-secondary_on-brand: hsla(var(--colors-alpha-white)/70%);
    --colors-text-tertiary: var(--colors-gray-600);
    --colors-text-quarterary: var(--colors-gray-500);
    --colors-text-white: var(--colors-base-white);
    --colors-text-disabled: var(--colors-gray-500);
    --colors-text-placeholder: var(--colors-gray-500);
    --colors-text-brand-primary: var(--colors-brand-800);
    --colors-text-brand-secondary: var(--colors-brand-700);
    --colors-text-error-primary: var(--colors-error-600);
    --colors-border-primary: var(--colors-gray-300);
    --colors-border-secondary: var(--colors-gray-200);
    --colors-border-disabled: var(--colors-gray-300);
    --colors-border-disabled_subtle: var(--colors-gray-200);
    --colors-border-brand: var(--colors-brand-300);
    --colors-border-error: var(--colors-error-300);
    --colors-fg-primary: var(--colors-gray-900);
    --colors-fg-quinary-400: var(--colors-gray-400);
    --colors-fg-tertiary-600: var(--colors-gray-600);
    -xs: 0 1px 2px 0 rgba(16, 24, 40, .05);
    --shadow-sm: 0px 1px 2px 0px rgba(16, 24, 40, 0.06), 0px 1px 3px 0px rgba(16, 24, 40, 0.1);
    --shadow-md: 0px 2px 4px -2px rgba(16, 24, 40, 0.06), 0px 4px 8px -2px rgba(16, 24, 40, 0.1);
    --shadow-lg: 0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08);
    --shadow-xl: 0px 8px 8px -4px rgba(16, 24, 40, 0.03), 0px 20px 24px -4px rgba(16, 24, 40, 0.08);
    --shadow-2xl: 0px 24px 48px -12px rgba(16, 24, 40, 0.18);
    --shadow-3xl: 0px 32px 64px -12px rgba(16, 24, 40, 0.14);
    --radius-none: 0;
    --radius-xxs: 2px;
    --radius-xs: 4px;
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 10px;
    --radius-xl: 12px;
    --radius-2xl: 16px;
    --radius-3xl: 20px;
    --radius-4xl: 24px;
    --radius-full: 9999px;
    --spacing-0: 0px;
    --spacing-0․5: 2px;
    --spacing-1: 4px;
    --spacing-1․5: 6px;
    --spacing-2: 8px;
    --spacing-3: 12px;
    --spacing-4: 16px;
    --spacing-5: 20px;
    --spacing-6: 24px;
    --spacing-8: 32px;
    --spacing-10: 40px;
    --spacing-12: 48px;
    --spacing-16: 64px;
    --spacing-20: 80px;
    --spacing-24: 96px;
    --spacing-32: 128px;
    --spacing-40: 160px;
    --spacing-48: 192px;
    --spacing-56: 224px;
    --spacing-64: 256px;
    --spacing-80: 320px;
    --spacing-96: 384px;
    --spacing-120: 480px;
    --spacing-140: 560px;
    --spacing-160: 640px;
    --spacing-180: 720px;
    --spacing-192: 768px;
    --spacing-256: 1024px;
    --spacing-320: 1280px;
    --spacing-360: 1440px;
    --spacing-400: 1600px;
    --spacing-480: 1920px;
    --spacing-none: var(--spacing-0);
    --spacing-xxs: var(--spacing-0․5);
    --spacing-xs: var(--spacing-1);
    --spacing-sm: var(--spacing-1․5);
    --spacing-md: var(--spacing-2);
    --spacing-lg: var(--spacing-3);
    --spacing-xl: var(--spacing-4);
    --spacing-2xl: var(--spacing-5);
    --spacing-3xl: var(--spacing-6);
    --spacing-4xl: var(--spacing-8);
    --spacing-5xl: var(--spacing-10);
    --spacing-6xl: var(--spacing-12);
    --spacing-7xl: var(--spacing-16);
    --spacing-8xl: var(--spacing-20);
    --spacing-9xl: var(--spacing-24);
    --spacing-10xl: var(--spacing-32);
    --spacing-11xl: var(--spacing-40);
    --width-xxs: var(--spacing-80);
    --width-xs: var(--spacing-96);
    --width-sm: var(--spacing-120);
    --width-md: var(--spacing-140);
    --width-lg: var(--spacing-160);
    --width-xl: var(--spacing-192);
    --width-2xl: var(--spacing-256);
    --width-3xl: var(--spacing-320);
    --width-4xl: var(--spacing-360);
    --width-5xl: var(--spacing-400);
    --width-6xl: var(--spacing-480);
    --paragraph-max-width: var(--spacing-180);
    --container-padding-mobile: var(--spacing-4);
    --container-padding-desktop: var(--spacing-8);
    --container-max-width-desktop: var(--spacing-320);
    --border-width: 3px;
    --border-radius: 17px;
    --br-lg: 28px;
    --border-radius-large: 32px;
    --border-radius-xlarge: 48px;
    --border-radius-full: 50%;
    --spacing-0: 0px;
    --spacing-0․5: 2px;
    --spacing-1: 4px;
    --spacing-1․5: 6px;
    --spacing-2: 8px;
    --spacing-3: 12px;
    --spacing-4: 16px;
    --spacing-5: 20px;
    --spacing-6: 24px;
    --spacing-8: 32px;
    --spacing-10: 40px;
    --spacing-12: 48px;
    --spacing-16: 64px;
    --spacing-20: 80px;
    --spacing-24: 96px;
    --spacing-32: 128px;
    --spacing-40: 160px;
    --spacing-48: 192px;
    --spacing-56: 224px;
    --spacing-64: 256px;
    --spacing-80: 320px;
    --spacing-96: 384px;
    --spacing-120: 480px;
    --spacing-140: 560px;
    --spacing-160: 640px;
    --spacing-180: 720px;
    --spacing-192: 768px;
    --spacing-256: 1024px;
    --spacing-320: 1280px;
    --spacing-360: 1440px;
    --spacing-400: 1600px;
    --spacing-480: 1920px;
    --spacing-none: var(--spacing-0);
    --spacing-xxs: var(--spacing-0․5);
    --spacing-xs: var(--spacing-1);
    --spacing-sm: var(--spacing-1․5);
    --spacing-md: var(--spacing-2);
    --spacing-lg: var(--spacing-3);
    --spacing-xl: var(--spacing-4);
    --spacing-2xl: var(--spacing-5);
    --spacing-3xl: var(--spacing-6);
    --spacing-4xl: var(--spacing-8);
    --spacing-5xl: var(--spacing-10);
    --spacing-6xl: var(--spacing-12);
    --spacing-7xl: var(--spacing-16);
    --spacing-8xl: var(--spacing-20);
    --spacing-9xl: var(--spacing-24);
    --spacing-10xl: var(--spacing-32);
    --spacing-11xl: var(--spacing-40);
    --width-xxs: var(--spacing-80);
    --width-xs: var(--spacing-96);
    --width-sm: var(--spacing-120);
    --width-md: var(--spacing-140);
    --width-lg: var(--spacing-160);
    --width-xl: var(--spacing-192);
    --width-2xl: var(--spacing-256);
    --width-3xl: var(--spacing-320);
    --width-4xl: var(--spacing-360);
    --width-5xl: var(--spacing-400);
    --width-6xl: var(--spacing-480);
    --paragraph-max-width: var(--spacing-180);
    --container-padding-mobile: var(--spacing-4);
    --container-padding-desktop: var(--spacing-8);
    --container-max-width-desktop: var(--spacing-320);
    --radius-none: 0;
    --radius-xxs: 2px;
    --radius-xs: 4px;
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 10px;
    --radius-xl: 12px;
    --radius-2xl: 16px;
    --radius-3xl: 20px;
    --radius-4xl: 24px;
    --radius-full: 9999px;
    --colors-base-white: #ffffff;
    --colors-base-black: #000000;
    --colors-alpha-white: 0deg 0% 100%;
    --colors-alpha-black: 0deg 0% 0%;
    --colors-gray-25: #FCFCFD;
    --colors-gray-50: #F9FAFB;
    --colors-gray-100: #F2F4F7;
    --colors-gray-200: #EAECF0;
    --colors-gray-300: #D0D5DD;
    --colors-gray-400: #98A2B3;
    --colors-gray-500: #667085;
    --colors-gray-600: #475467;
    --colors-gray-800: #182230;
    --colors-gray-900: #101828;
    --colors-gray-25: #FAFAFA;
    --colors-gray-50: #F5F5F6;
    --colors-gray-100: #F0F1F1;
    --colors-gray-200: #ECECED;
    --colors-gray-300: #CECFD2;
    --colors-gray-400: #94969C;
    --colors-gray-500: #85888E;
    --colors-gray-600: #61646C;
    --colors-gray-700: #333741;
    --colors-gray-800: #1F242F;
    --colors-gray-900: #161B26;
    --colors-gray-950: #0C111D;
    --colors-brand-25: #F7FDF9;
    --colors-brand-50: #F3FCF6;
    --colors-brand-100: #DFF6E7;
    --colors-brand-200: #B8EACB;
    --colors-brand-300: #88D8AD;
    --colors-brand-400: #54C08A;
    --colors-brand-500: #25935F;
    --colors-brand-600: #1B8354;
    --colors-brand-700: #166A45;
    --colors-brand-800: #14573A;
    --colors-brand-900: #104631;
    --colors-brand-950: #092A1E;
    --colors-error-25: #FFFBFA;
    --colors-error-50: #FEF3F2;
    --colors-error-100: #FEE4E2;
    --colors-error-200: #FECDCA;
    --colors-error-300: #FDA29B;
    --colors-error-400: #F97066;
    --colors-error-500: #F04438;
    --colors-error-600: #D92D20;
    --colors-error-700: #B42318;
    --colors-error-800: #912018;
    --colors-error-900: #7A271A;
    --colors-error-950: #55160C;
    --colors-warning-25: #FFFCF5;
    --colors-warning-50: #FFFAEB;
    --colors-warning-100: #FEF0C7;
    --colors-warning-200: #FEDF89;
    --colors-warning-300: #FEC84B;
    --colors-warning-400: #FDB022;
    --colors-warning-500: #F79009;
    --colors-warning-600: #DC6803;
    --colors-warning-700: #B54708;
    --colors-warning-800: #93370D;
    --colors-warning-900: #7A2E0E;
    --colors-warning-950: #4E1D09;
    --colors-success-25: #F6FEF9;
    --colors-success-50: #ECFDF3;
    --colors-success-100: #DCFAE6;
    --colors-success-200: #ABEFC6;
    --colors-success-300: #75E0A7;
    --colors-success-400: #47CD89;
    --colors-success-500: #17B26A;
    --colors-success-600: #079455;
    --colors-success-700: #067647;
    --colors-success-800: #085D3A;
    --colors-success-900: #074D31;
    --colors-success-950: #053321;
    --colors-info-25: #F5FAFF;
    --colors-info-50: #EFF8FF;
    --colors-info-100: #D1E9FF;
    --colors-info-200: #B2DDFF;
    --colors-info-300: #84CAFF;
    --colors-info-400: #53B1FD;
    --colors-info-500: #2E90FA;
    --colors-info-600: #1570EF;
    --colors-info-700: #175CD3;
    --colors-info-800: #1849A9;
    --colors-info-900: #194185;
    --colors-info-950: #102A56;
    --colors-gray-blue-25: #FCFCFD;
    --colors-gray-blue-50: #F8F9FC;
    --colors-gray-blue-100: #EAECF5;
    --colors-gray-blue-200: #D5D9EB;
    --colors-gray-blue-300: #B3B8DB;
    --colors-gray-blue-400: #717BBC;
    --colors-gray-blue-500: #4E5BA6;
    --colors-gray-blue-600: #3E4784;
    --colors-gray-blue-700: #363F72;
    --colors-gray-blue-800: #293056;
    --colors-gray-blue-900: #101323;
    --colors-gray-blue-950: #0D0F1C;
    --colors-gray-cool-25: #FCFCFD;
    --colors-gray-cool-50: #F9F9FB;
    --colors-gray-cool-100: #EFF1F5;
    --colors-gray-cool-200: #DCDFEA;
    --colors-gray-cool-300: #B9C0D4;
    --colors-gray-cool-400: #7D89B0;
    --colors-gray-cool-500: #5D6B98;
    --colors-gray-cool-600: #4A5578;
    --colors-gray-cool-700: #404968;
    --colors-gray-cool-800: #30374F;
    --colors-gray-cool-900: #111322;
    --colors-gray-cool-950: #0E101B;
    --colors-gray-modern-25: #FCFCFD;
    --colors-gray-modern-50: #F8FAFC;
    --colors-gray-modern-100: #EEF2F6;
    --colors-gray-modern-200: #E3E8EF;
    --colors-gray-modern-300: #CDD5DF;
    --colors-gray-modern-400: #9AA4B2;
    --colors-gray-modern-500: #697586;
    --colors-gray-modern-600: #4B5565;
    --colors-gray-modern-700: #364152;
    --colors-gray-modern-800: #202939;
    --colors-gray-modern-900: #121926;
    --colors-gray-modern-950: #0D121C;
    --colors-gray-neutral-25: #FCFCFD;
    --colors-gray-neutral-50: #F9FAFB;
    --colors-gray-neutral-100: #F3F4F6;
    --colors-gray-neutral-200: #E5E7EB;
    --colors-gray-neutral-300: #D2D6DB;
    --colors-gray-neutral-400: #9DA4AE;
    --colors-gray-neutral-500: #6C737F;
    --colors-gray-neutral-600: #4D5761;
    --colors-gray-neutral-700: #384250;
    --colors-gray-neutral-800: #1F2A37;
    --colors-gray-neutral-900: #111927;
    --colors-gray-neutral-950: #0D121C;
    --colors-gray-iron-25: #FCFCFC;
    --colors-gray-iron-50: #FAFAFA;
    --colors-gray-iron-100: #F4F4F5;
    --colors-gray-iron-200: #E4E4E7;
    --colors-gray-iron-300: #D1D1D6;
    --colors-gray-iron-400: #A0A0AB;
    --colors-gray-iron-500: #70707B;
    --colors-gray-iron-600: #51525C;
    --colors-gray-iron-700: #3F3F46;
    --colors-gray-iron-800: #26272B;
    --colors-gray-iron-900: #1A1A1E;
    --colors-gray-iron-950: #131316;
    --colors-gray-true-25: #FCFCFC;
    --colors-gray-true-50: #FAFAFA;
    --colors-gray-true-100: #F5F5F5;
    --colors-gray-true-200: #E5E5E5;
    --colors-gray-true-300: #D6D6D6;
    --colors-gray-true-400: #A3A3A3;
    --colors-gray-true-500: #737373;
    --colors-gray-true-600: #525252;
    --colors-gray-true-700: #424242;
    --colors-gray-true-800: #292929;
    --colors-gray-true-900: #141414;
    --colors-gray-true-950: #0F0F0F;
    --colors-gray-warm-25: #FDFDFC;
    --colors-gray-warm-50: #FAFAF9;
    --colors-gray-warm-100: #F5F5F4;
    --colors-gray-warm-200: #E7E5E4;
    --colors-gray-warm-300: #D7D3D0;
    --colors-gray-warm-400: #A9A29D;
    --colors-gray-warm-500: #79716B;
    --colors-gray-warm-600: #57534E;
    --colors-gray-warm-700: #44403C;
    --colors-gray-warm-800: #292524;
    --colors-gray-warm-900: #1C1917;
    --colors-gray-warm-950: #171412;
    --colors-moss-25: #FAFDF7;
    --colors-moss-50: #F5FBEE;
    --colors-moss-100: #E6F4D7;
    --colors-moss-200: #CEEAB0;
    --colors-moss-300: #ACDC79;
    --colors-moss-400: #86CB3C;
    --colors-moss-500: #669F2A;
    --colors-moss-600: #4F7A21;
    --colors-moss-700: #3F621A;
    --colors-moss-800: #335015;
    --colors-moss-900: #2B4212;
    --colors-moss-950: #1A280B;
    --colors-green-light-25: #FAFEF5;
    --colors-green-light-50: #F3FEE7;
    --colors-green-light-100: #E3FBCC;
    --colors-green-light-200: #D0F8AB;
    --colors-green-light-300: #A6EF67;
    --colors-green-light-400: #85E13A;
    --colors-green-light-500: #66C61C;
    --colors-green-light-600: #4CA30D;
    --colors-green-light-700: #3B7C0F;
    --colors-green-light-800: #326212;
    --colors-green-light-900: #2B5314;
    --colors-green-light-950: #15290A;
    --colors-green-25: #F6FEF9;
    --colors-green-50: #EDFCF2;
    --colors-green-100: #D3F8DF;
    --colors-green-200: #AAF0C4;
    --colors-green-300: #73E2A3;
    --colors-green-400: #3CCB7F;
    --colors-green-500: #16B364;
    --colors-green-600: #099250;
    --colors-green-700: #087443;
    --colors-green-800: #095C37;
    --colors-green-900: #084C2E;
    --colors-green-950: #052E1C;
    --colors-Teal-25: #F6FEFC;
    --colors-Teal-50: #F0FDF9;
    --colors-Teal-100: #CCFBEF;
    --colors-Teal-200: #99F6E0;
    --colors-Teal-300: #5FE9D0;
    --colors-Teal-400: #2ED3B7;
    --colors-Teal-500: #15B79E;
    --colors-Teal-600: #0E9384;
    --colors-Teal-700: #107569;
    --colors-Teal-800: #125D56;
    --colors-Teal-900: #134E48;
    --colors-Teal-950: #0A2926;
    --colors-cyan-25: #F5FEFF;
    --colors-cyan-50: #ECFDFF;
    --colors-cyan-100: #CFF9FE;
    --colors-cyan-200: #A5F0FC;
    --colors-cyan-300: #67E3F9;
    --colors-cyan-400: #22CCEE;
    --colors-cyan-500: #06AED4;
    --colors-cyan-600: #088AB2;
    --colors-cyan-700: #0E7090;
    --colors-cyan-800: #155B75;
    --colors-cyan-900: #164C63;
    --colors-cyan-950: #0D2D3A;
    --colors-blue-light-25: #F5FBFF;
    --colors-blue-light-50: #F0F9FF;
    --colors-blue-light-100: #E0F2FE;
    --colors-blue-light-200: #B9E6FE;
    --colors-blue-light-300: #7CD4FD;
    --colors-blue-light-400: #36BFFA;
    --colors-blue-light-500: #0BA5EC;
    --colors-blue-light-600: #0086C9;
    --colors-blue-light-700: #026AA2;
    --colors-blue-light-800: #065986;
    --colors-blue-light-900: #0B4A6F;
    --colors-blue-light-950: #062C41;
    --colors-blue-dark-25: #F5F8FF;
    --colors-blue-dark-50: #EFF4FF;
    --colors-blue-dark-100: #D1E0FF;
    --colors-blue-dark-200: #B2CCFF;
    --colors-blue-dark-300: #84ADFF;
    --colors-blue-dark-400: #528BFF;
    --colors-blue-dark-500: #2970FF;
    --colors-blue-dark-600: #155EEF;
    --colors-blue-dark-700: #004EEB;
    --colors-blue-dark-800: #0040C1;
    --colors-blue-dark-900: #00359E;
    --colors-blue-dark-950: #002266;
    --colors-indigo-25: #F5F8FF;
    --colors-indigo-50: #EEF4FF;
    --colors-indigo-100: #E0EAFF;
    --colors-indigo-200: #C7D7FE;
    --colors-indigo-300: #A4BCFD;
    --colors-indigo-400: #8098F9;
    --colors-indigo-500: #6172F3;
    --colors-indigo-600: #444CE7;
    --colors-indigo-700: #3538CD;
    --colors-indigo-800: #2D31A6;
    --colors-indigo-900: #2D3282;
    --colors-indigo-950: #1F235B;
    --colors-violet-25: #FBFAFF;
    --colors-violet-50: #F5F3FF;
    --colors-violet-100: #ECE9FE;
    --colors-violet-200: #DDD6FE;
    --colors-violet-300: #C3B5FD;
    --colors-violet-400: #A48AFB;
    --colors-violet-500: #875BF7;
    --colors-violet-600: #7839EE;
    --colors-violet-700: #6927DA;
    --colors-violet-800: #5720B7;
    --colors-violet-900: #491C96;
    --colors-violet-950: #2E125E;
    --colors-purple-25: #FAFAFF;
    --colors-purple-50: #F4F3FF;
    --colors-purple-100: #EBE9FE;
    --colors-purple-200: #D9D6FE;
    --colors-purple-300: #BDB4FE;
    --colors-purple-400: #9B8AFB;
    --colors-purple-500: #7A5AF8;
    --colors-purple-600: #6938EF;
    --colors-purple-700: #5925DC;
    --colors-purple-800: #4A1FB8;
    --colors-purple-900: #3E1C96;
    --colors-purple-950: #27115F;
    --colors-fuchsia-25: #FEFAFF;
    --colors-fuchsia-50: #FDF4FF;
    --colors-fuchsia-100: #FBE8FF;
    --colors-fuchsia-200: #F6D0FE;
    --colors-fuchsia-300: #EEAAFD;
    --colors-fuchsia-400: #E478FA;
    --colors-fuchsia-500: #D444F1;
    --colors-fuchsia-600: #BA24D5;
    --colors-fuchsia-700: #9F1AB1;
    --colors-fuchsia-800: #821890;
    --colors-fuchsia-900: #6F1877;
    --colors-fuchsia-950: #47104C;
    --colors-pink-25: #FEF6FB;
    --colors-pink-50: #FDF2FA;
    --colors-pink-100: #FCE7F6;
    --colors-pink-200: #FCCEEE;
    --colors-pink-300: #FAA7E0;
    --colors-pink-400: #F670C7;
    --colors-pink-500: #EE46BC;
    --colors-pink-600: #DD2590;
    --colors-pink-700: #C11574;
    --colors-pink-800: #9E165F;
    --colors-pink-900: #851651;
    --colors-pink-950: #4E0D30;
    --colors-rosé-25: #FFF5F6;
    --colors-rosé-50: #FFF1F3;
    --colors-rosé-100: #FFE4E8;
    --colors-rosé-200: #FECDD6;
    --colors-rosé-300: #FEA3B4;
    --colors-rosé-400: #FD6F8E;
    --colors-rosé-500: #F63D68;
    --colors-rosé-600: #E31B54;
    --colors-rosé-700: #C01048;
    --colors-rosé-800: #A11043;
    --colors-rosé-900: #89123E;
    --colors-rosé-950: #510B24;
    --colors-orange-dark-25: #FFF9F5;
    --colors-orange-dark-50: #FFF4ED;
    --colors-orange-dark-100: #FFE6D5;
    --colors-orange-dark-200: #FFD6AE;
    --colors-orange-dark-300: #FF9C66;
    --colors-orange-dark-400: #FF692E;
    --colors-orange-dark-500: #FF4405;
    --colors-orange-dark-600: #E62E05;
    --colors-orange-dark-700: #BC1B06;
    --colors-orange-dark-800: #97180C;
    --colors-orange-dark-900: #771A0D;
    --colors-orange-dark-950: #57130A;
    --colors-orange-25: #FEFAF5;
    --colors-orange-50: #FEF6EE;
    --colors-orange-100: #FDEAD7;
    --colors-orange-200: #F9DBAF;
    --colors-orange-300: #F7B27A;
    --colors-orange-400: #F38744;
    --colors-orange-500: #EF6820;
    --colors-orange-600: #E04F16;
    --colors-orange-700: #B93815;
    --colors-orange-800: #932F19;
    --colors-orange-900: #772917;
    --colors-orange-950: #511C10;
    --colors-yellow-25: #FEFDF0;
    --colors-yellow-50: #FEFBE8;
    --colors-yellow-100: #FEF7C3;
    --colors-yellow-200: #FEEE95;
    --colors-yellow-300: #FDE272;
    --colors-yellow-400: #FAC515;
    --colors-yellow-500: #EAAA08;
    --colors-yellow-600: #CA8504;
    --colors-yellow-700: #A15C07;
    --colors-yellow-800: #854A0E;
    --colors-yellow-900: #713B12;
    --colors-yellow-950: #542C0D;
    --radius-0: 0;
    --radius-2: 2px;
    --radius-4: 4px;
    --radius-8: 8px;
    --radius-16: 16px;
    --radius-24: 24px;
    --radius-9999: 9999px;
    --components-card-radius: var(--spacing-4);
    --radius-none: var(--radius-0);
    --radius-xs: var(--radius-2);
    --radius-sm: var(--radius-4);
    --radius-md: var(--radius-8);
    --radius-lg: var(--radius-16);
    --radius-xl: var(--radius-24);
    --radius-full: var(--radius-9999);
    --colors-base-white: #ffffff;
    --colors-base-black: #161616;
    --colors-primary-sa-flag-25: #f7fdf9;
    --colors-primary-sa-flag-50: #f3fcf6;
    --colors-primary-sa-flag-100: #dff6e7;
    --colors-primary-sa-flag-200: #b8eacb;
    --colors-primary-sa-flag-300: #88d8ad;
    --colors-primary-sa-flag-400: #54c08a;
    --colors-primary-sa-flag-500-alpha-10: #25935f19;
    --colors-primary-sa-flag-500: #25935f;
    --colors-primary-sa-flag-600-primary: #1b8354;
    --colors-primary-sa-flag-700: #166a45;
    --colors-primary-sa-flag-800: #14573a;
    --colors-primary-sa-flag-900: #104631;
    --colors-primary-sa-flag-950: #092a1e;
    --colors-secondary-gold-25: #fffef7;
    --colors-secondary-gold-50: #fffef2;
    --colors-secondary-gold-100: #fffce6;
    --colors-secondary-gold-200: #fcf3bd;
    --colors-secondary-gold-300: #fae996;
    --colors-secondary-gold-400: #f7d54d;
    --colors-secondary-gold-500: #f5bd02;
    --colors-secondary-gold-600-primary: #dba102;
    --colors-secondary-gold-700: #b87b02;
    --colors-secondary-gold-800: #945c01;
    --colors-secondary-gold-900: #6e3c00;
    --colors-secondary-gold-950: #472400;
    --colors-tertiary-lavendar-25: #fefcff;
    --colors-tertiary-lavendar-50: #f9f5fa;
    --colors-tertiary-lavendar-100: #f2e9f5;
    --colors-tertiary-lavendar-200: #e1cce8;
    --colors-tertiary-lavendar-300: #ccadd9;
    --colors-tertiary-lavendar-400: #a57bba;
    --colors-tertiary-lavendar-500-primary: #80519f;
    --colors-tertiary-lavendar-600: #6d428f;
    --colors-tertiary-lavendar-700: #532d75;
    --colors-tertiary-lavendar-800: #3d1d5e;
    --colors-tertiary-lavendar-900: #281047;
    --colors-tertiary-lavendar-950: #16072e;
    --colors-neutral-25: #fcfcfd;
    --colors-neutral-50: #f9fafb;
    --colors-neutral-100: #f3f4f6;
    --colors-neutral-200: #e5e7eb;
    --colors-neutral-300: #d2d6db;
    --colors-neutral-400: #9da4ae;
    --colors-neutral-500: #6c727e;
    --colors-neutral-600: #4d5761;
    --colors-neutral-700: #384250;
    --colors-neutral-800: #1f2a37;
    --colors-neutral-900: #111927;
    --colors-neutral-950: #0c111b;
    --colors-blue-25: #f5faff;
    --colors-blue-50: #eff8ff;
    --colors-blue-100: #d1e9ff;
    --colors-blue-200: #b2ddff;
    --colors-blue-300: #84caff;
    --colors-blue-400: #53b0fd;
    --colors-blue-500: #2e90fa;
    --colors-blue-600: #156fee;
    --colors-blue-700: #175cd3;
    --colors-blue-800: #1849a9;
    --colors-blue-900: #194084;
    --colors-blue-950: #102a56;
    --colors-green-25: #f6fef9;
    --colors-green-50: #ecfdf3;
    --colors-green-100: #dcfae6;
    --colors-green-200: #abefc6;
    --colors-green-300: #75dfa6;
    --colors-green-400: #47cd89;
    --colors-green-500: #17b169;
    --colors-green-600: #069454;
    --colors-green-700: #067647;
    --colors-green-800: #085d3a;
    --colors-green-900: #074c30;
    --colors-green-950: #053321;
    --colors-yellow-25: #fffcf5;
    --colors-yellow-50: #fffaeb;
    --colors-yellow-100: #fef0c7;
    --colors-yellow-200: #fedf89;
    --colors-yellow-300: #fec84b;
    --colors-yellow-400: #fdb022;
    --colors-yellow-500: #f79009;
    --colors-yellow-600: #dc6803;
    --colors-yellow-700: #b54707;
    --colors-yellow-800: #93370c;
    --colors-yellow-900: #7a2e0e;
    --colors-yellow-950: #4e1d09;
    --colors-red-25: #fffbfa;
    --colors-red-50: #fef3f2;
    --colors-red-100: #fee4e2;
    --colors-red-200: #fecdca;
    --colors-red-300: #fca19b;
    --colors-red-400: #f97066;
    --colors-red-500: #f04437;
    --colors-red-600: #d92c20;
    --colors-red-700: #b42318;
    --colors-red-800: #912018;
    --colors-red-900: #7a2619;
    --colors-red-950: #54150c;
    --colors-alpha-alpha-white-0: #ffffff00;
    --colors-alpha-alpha-white-10: #ffffff19;
    --colors-alpha-alpha-white-20: #ffffff33;
    --colors-alpha-alpha-white-30: #ffffff4c;
    --colors-alpha-alpha-white-40: #ffffff66;
    --colors-alpha-alpha-white-50: #ffffff7f;
    --colors-alpha-alpha-white-60: #ffffff99;
    --colors-alpha-alpha-white-70: #ffffffb2;
    --colors-alpha-alpha-white-80: #ffffffcc;
    --colors-alpha-alpha-white-90: #ffffffe5;
    --colors-alpha-alpha-white-100: #ffffff;
    --colors-alpha-alpha-black-0: #16161600;
    --colors-alpha-alpha-black-10: #16161619;
    --colors-alpha-alpha-black-20: #16161633;
    --colors-alpha-alpha-black-30: #1616164c;
    --colors-alpha-alpha-black-40: #16161666;
    --colors-alpha-alpha-black-50: #1616167f;
    --colors-alpha-alpha-black-60: #16161699;
    --colors-alpha-alpha-black-70: #161616b2;
    --colors-alpha-alpha-black-80: #161616cc;
    --colors-alpha-alpha-black-90: #161616e5;
    --colors-alpha-alpha-black-100: #161616;
    --colors-alpha-alpha-green-10: #1b835419;
    --colors-alpha-alpha-green-20: #1b835433;
    --colors-alpha-alpha-green-30: #1b83544c;
    --colors-alpha-alpha-green-40: #1b835466;
    --colors-alpha-alpha-green-50: #1b83547f;
    --colors-alpha-alpha-green-60: #1b835499;
    --colors-alpha-alpha-green-70: #1b8354b2;
    --colors-alpha-alpha-green-80: #1b8354cc;
    --colors-alpha-alpha-green-90: #1b8354e5;
    --gradient-gray-600-500-90deg: linear-gradient(90deg, var(--colors-gray-600) 0%, var(--colors-gray-500) 100%);
    --gradient-gray-700-600-45deg: linear-gradient(45deg, var(--colors-gray-700) 0%, var(--colors-gray-600) 100%);
    --gradient-gray-800-600-45deg: linear-gradient(45deg, var(--colors-gray-800) 0%, var(--colors-gray-600) 100%);
    --gradient-gray-800-600-90deg: linear-gradient(90deg, var(--colors-gray-800) 0%, var(--colors-gray-600) 100%);
    --gradient-gray-800-700-26-5deg: linear-gradient(26.5deg, var(--colors-gray-600) 0%, var(--colors-gray-700) 100%);
    --gradient-gray-900-600-45deg: linear-gradient(45deg, var(--colors-gray-900) 0%, var(--colors-gray-600) 100%);
    --gradient-brand-600-500-90deg: linear-gradient(90deg, var(--colors-brand-600) 0%, var(--colors-brand-500) 100%);
    --gradient-brand-700-600-45deg: linear-gradient(45deg, var(--colors-brand-700) 0%, var(--colors-brand-600) 100%);
    --gradient-brand-800-600-45deg: linear-gradient(45deg, var(--colors-brand-800) 0%, var(--colors-brand-600) 100%);
    --gradient-brand-800-600-90deg: linear-gradient(90deg, var(--colors-brand-800) 0%, var(--colors-brand-600) 100%);
    --gradient-brand-800-700-26-5deg: linear-gradient(26.5deg, var(--colors-brand-600) 0%, var(--colors-brand-700) 100%);
    --gradient-brand-900-600-45deg: linear-gradient(45deg, var(--colors-brand-900) 0%, var(--colors-brand-600) 100%);
    --colors-text-primary: var(--colors-gray-900);
    --colors-text-primary_on-brand: var(--colors-base-white);
    --colors-text-secondary: var(--colors-gray-700);
    --colors-text-secondary_on-brand: hsla(var(--colors-alpha-white)/70%);
    --colors-text-tertiary: var(--colors-gray-600);
    --colors-text-quarterary: var(--colors-gray-500);
    --colors-text-white: var(--colors-base-white);
    --colors-text-disabled: var(--colors-gray-500);
    --colors-text-placeholder: var(--colors-gray-500);
    --colors-text-brand-primary: var(--colors-brand-800);
    --colors-text-brand-secondary: var(--colors-brand-700);
    --colors-text-error-primary: var(--colors-error-600);
    --colors-border-primary: var(--colors-gray-300);
    --colors-border-secondary: var(--colors-gray-200);
    --colors-border-disabled: var(--colors-gray-300);
    --colors-border-disabled_subtle: var(--colors-gray-200);
    --colors-border-brand: var(--colors-brand-300);
    --colors-border-error: var(--colors-error-300);
    --colors-fg-primary: var(--colors-gray-900);
    --colors-fg-quinary-400: var(--colors-gray-400);
    --colors-fg-tertiary-600: var(--colors-gray-600);
    --background-white: var(--colors-base-white);
    --background-body: var(--colors-neutral-50);
    --background-menu: var(--colors-base-white);
    --background-card: var(--colors-base-white);
    --background-surface-oncolor: var(--colors-base-white);
    --background-black: var(--colors-base-black);
    --background-brand-light: var(--colors-primary-sa-flag-50);
    --background-neutral-800: var(--colors-neutral-800);
    --background-neutral-400: var(--colors-neutral-400);
    --background-neutral-300: var(--colors-neutral-300);
    --background-neutral-200: var(--colors-neutral-200);
    --background-neutral-100: var(--colors-neutral-100);
    --background-neutral-50: var(--colors-neutral-50);
    --background-neutral-25: var(--colors-neutral-25);
    --background-primary: var(--colors-primary-sa-flag-600-primary);
    --background-primary-400: var(--colors-primary-sa-flag-400);
    --background-primary-200: var(--colors-primary-sa-flag-200);
    --background-primary-50: var(--colors-primary-sa-flag-50);
    --background-primary-25: var(--colors-primary-sa-flag-25);
    --background-secondary: var(--colors-secondary-gold-600-primary);
    --background-secondary-50: var(--colors-secondary-gold-50);
    --background-secondary-25: var(--colors-secondary-gold-25);
    --background-tertiary: var(--colors-tertiary-lavendar-600);
    --background-tertiary-50: var(--colors-tertiary-lavendar-50);
    --background-tertiary-25: var(--colors-tertiary-lavendar-25);
    --background-success: var(--colors-green-600);
    --background-success-light: var(--colors-green-50);
    --background-success-50: var(--colors-green-50);
    --background-success-25: var(--colors-green-25);
    --background-info: var(--colors-blue-600);
    --background-info-light: var(--colors-blue-50);
    --background-info-50: var(--colors-blue-50);
    --background-info-25: var(--colors-blue-25);
    --background-warning: var(--colors-yellow-600);
    --background-warning-light: var(--colors-yellow-50);
    --background-warning-50: var(--colors-yellow-50);
    --background-warning-25: var(--colors-yellow-25);
    --background-error: var(--colors-red-600);
    --background-error-light: var(--colors-red-50);
    --background-error-50: var(--colors-red-50);
    --background-error-25: var(--colors-red-25);
    --background-sa-flag: var(--colors-green-900);
    --background-sa-flag-50: var(--colors-green-50);
    --background-sa-flag-25: var(--colors-green-25);
    --background-notification-white: var(--colors-base-white);
    --text-default: var(--colors-base-black);
    --text-primary: var(--colors-primary-sa-flag-600-primary);
    --text-secondary: var(--colors-secondary-gold-600-primary);
    --text-tertiary: var(--colors-tertiary-lavendar-500-primary);
    --text-primary-sa-flag: var(--colors-primary-sa-flag-800);
    --text-display: var(--colors-neutral-800);
    --text-primary-paragraph: var(--colors-neutral-700);
    --text-secondary-paragraph: var(--colors-neutral-500);
    --text-oncolor-primary: var(--colors-base-white);
    --text-oncolor-secondary: var(--alpha-white-80);
    --text-oncolor-tertiary: var(--alpha-white-70);
    --text-success: var(--colors-green-700);
    --text-info: var(--colors-blue-700);
    --text-warning: var(--colors-yellow-700);
    --text-error: var(--colors-red-700);
    --text-primary-light: var(--colors-primary-sa-flag-300);
    --text-secondary-light: var(--colors-secondary-gold-300);
    --text-tertiary-light: var(--colors-tertiary-lavendar-300);
    --text-default-disabled: var(--colors-neutral-400);
    --text-default-oncolor-disabled: var(--alpha-white-40);
    --border-white: var(--colors-base-white);
    --border-white-40: var(--alpha-white-40);
    --button-background-black-default: var(--colors-neutral-950);
    --button-background-black-hovered: var(--colors-neutral-800);
    --button-background-black-pressed: var(--colors-neutral-600);
    --button-background-black-selected: var(--colors-neutral-700);
    --button-background-black-focused: var(--colors-neutral-950);
    --button-background-primary-default: var(--colors-primary-sa-flag-600-primary);
    --button-background-primary-hovered: var(--colors-primary-sa-flag-700);
    --button-background-primary-pressed: var(--colors-primary-sa-flag-900);
    --button-background-primary-selected: var(--colors-primary-sa-flag-800);
    --button-background-primary-focused: var(--colors-primary-sa-flag-600-primary);
    --button-background-neutral-default: var(--colors-neutral-100);
    --button-background-neutral-hovered: var(--colors-neutral-100);
    --button-background-neutral-pressed: var(--colors-neutral-200);
    --button-background-neutral-selected: var(--colors-neutral-200);
    --button-background-neutral-focused: var(--colors-neutral-100);
    --button-background-danger-primary-default: var(--colors-red-600);
    --button-background-danger-primary-hovered: var(--colors-red-700);
    --button-background-danger-primary-pressed: var(--colors-red-900);
    --button-background-danger-primary-selected: var(--colors-red-800);
    --button-background-danger-primary-focused: var(--colors-red-600);
    --button-label-danger-primary-default-oncolor: var(--colors-red-200);
    --button-label-danger-primary-hovered-oncolor: var(--colors-red-300);
    --button-label-danger-primary-pressed-oncolor: var(--colors-red-400);
    --button-background-danger-secondary-default: var(--colors-red-50);
    --button-background-danger-secondary-hovered: var(--colors-red-100);
    --button-background-danger-secondary-pressed: var(--colors-red-200);
    --button-background-danger-secondary-selected: var(--colors-red-50);
    --button-background-danger-secondary-focused: var(--colors-red-50);
    --button-background-oncolor-default: var(--colors-base-white);
    --button-background-oncolor-hovered: var(--alpha-white-80);
    --button-background-oncolor-pressed: var(--alpha-white-60);
    --button-background-oncolor-selected: var(--alpha-white-70);
    --button-background-oncolor-focused: var(--alpha-white-100);
    --button-background-transparent-default: var(--alpha-white-0);
    --button-background-transparent-hovered: var(--alpha-white-20);
    --button-background-transparent-pressed: var(--alpha-white-40);
    --button-background-transparent-selected: var(--alpha-white-30);
    --button-background-transparent-focused: var(--alpha-white-0);
    --button-background-disabled-on-color: var(--alpha-white-20);
    --button-label-transparent-hovered-on-color: var(--colors-primary-sa-flag-400);
    --border-black: var(--colors-base-black);
    --border-primary: var(--colors-primary-sa-flag-600-primary);
    --border-primary-light: var(--colors-primary-sa-flag-200);
    --border-secondary: var(--colors-secondary-gold-600-primary);
    --border-secondary-light: var(--colors-secondary-gold-200);
    --border-tertiary: var(--colors-tertiary-lavendar-500-primary);
    --border-tertiary-light: var(--colors-tertiary-lavendar-200);
    --border-neutral-primary: var(--colors-neutral-300);
    --border-neutral-secondary: var(--colors-neutral-200);
    --border-neutral-tertiary: var(--colors-neutral-100);
    --border-background-white: var(--colors-neutral-100);
    --border-background-neutral: var(--colors-neutral-300);
    --border-transparent-10: var(--alpha-white-10);
    --border-oncolor-transparent-30: var(--colors-alpha-alpha-white-30);
    --border-success: var(--colors-green-700);
    --button-label-transparent-pressed-on-color: var(--colors-primary-sa-flag-300);
    --border-success-light: var(--colors-green-200);
    --border-info: var(--colors-blue-700);
    --button-label-transparent-selected-on-color: var(--colors-primary-sa-flag-400);
    --border-info-light: var(--colors-blue-200);
    --button-icon-transparent-hovered-on-color: var(--background-primary-400);
    --border-warning: var(--colors-yellow-700);
    --border-warning-light: var(--colors-yellow-200);
    --border-error: var(--colors-red-700);
    --button-icon-transparent-pressed-on-color: var(--colors-primary-sa-flag-300);
    --border-error-light: var(--colors-red-200);
    --button-icon-transparent-selected-on-color: var(--colors-primary-sa-flag-400);
    --border-disabled: var(--colors-neutral-400);
    --link-primary: var(--colors-primary-sa-flag-600-primary);
    --link-primary-hovered: var(--colors-primary-sa-flag-400);
    --link-primary-pressed: var(--colors-primary-sa-flag-300);
    --link-primary-focused: var(--colors-primary-sa-flag-600-primary);
    --link-primary-visited: var(--colors-primary-sa-flag-800);
    --link-icon-primary-hovered: var(--colors-primary-sa-flag-400);
    --link-icon-primary-pressed: var(--colors-primary-sa-flag-300);
    --link-icon-primary-focused: var(--colors-primary-sa-flag-600-primary);
    --link-icon-primary-visited: var(--colors-primary-sa-flag-800);
    --link-secondary: var(--colors-secondary-gold-600-primary);
    --link-secondary-hovered: var(--colors-secondary-gold-400);
    --link-secondary-pressed: var(--colors-secondary-gold-300);
    --link-secondary-focused: var(--colors-secondary-gold-600-primary);
    --link-secondary-visited: var(--colors-secondary-gold-900);
    --link-tertiary: var(--colors-tertiary-lavendar-500-primary);
    --link-tertiary-hovered: var(--colors-tertiary-lavendar-400);
    --link-tertiary-pressed: var(--colors-tertiary-lavendar-300);
    --link-tertiary-focused: var(--colors-tertiary-lavendar-500-primary);
    --link-tertiary-visited: var(--colors-tertiary-lavendar-800);
    --link-neutral: var(--colors-neutral-700);
    --link-neutral-hovered: var(--colors-neutral-500);
    --link-icon-neutral-hovered: var(--colors-neutral-500);
    --link-neutral-pressed: var(--colors-neutral-400);
    --link-icon-neutral-pressed: var(--colors-neutral-400);
    --link-neutral-focused: var(--colors-neutral-700);
    --link-icon-neutral-focused: var(--colors-neutral-700);
    --link-neutral-visited: var(--colors-neutral-600);
    --link-icon-neutral-visited: var(--colors-neutral-600);
    --link-danger: var(--colors-red-600);
    --link-danger-hovered: var(--colors-red-700);
    --link-icon-danger-hovered: var(--colors-red-700);
    --link-danger-pressed: var(--colors-red-900);
    --link-icon-danger-pressed: var(--colors-red-900);
    --link-danger-focused: var(--colors-red-600);
    --link-icon-danger-focused: var(--colors-red-600);
    --link-danger-visited: var(--colors-red-800);
    --link-icon-danger-visited: var(--colors-red-800);
    --link-oncolor: var(--colors-base-white);
    --link-oncolor-hovered: var(--colors-alpha-alpha-white-80);
    --link-icon-oncolor-hovered: var(--alpha-white-80);
    --link-oncolor-pressed: var(--colors-alpha-alpha-white-60);
    --link-icon-oncolor-pressed: var(--alpha-white-60);
    --link-oncolor-focused: var(--colors-base-white);
    --link-link-oncolor-focused: var(--colors-base-white);
    --link-oncolor-visited: var(--colors-alpha-alpha-white-90);
    --link-icon-oncolor-visited: var(--alpha-white-90);
    --link-oncolor-disabled: var(--colors-alpha-alpha-white-30);
    --link-icon-oncolor-disabled: var(--alpha-white-30);
    --icon-oncolor: var(--colors-base-white);
    --tag-background-neutral: var(--colors-neutral-600);
    --tag-background-neutral-light: var(--colors-neutral-50);
    --tag-background-on-color: var(--colors-alpha-alpha-white-20);
    --tag-text-neutral: var(--colors-neutral-800);
    --tag-text-success: var(--colors-green-800);
    --tag-text-info: var(--colors-blue-800);
    --tag-text-warning: var(--colors-yellow-800);
    --tag-text-error: var(--colors-red-800);
    --tag-icon-neutral: var(--colors-neutral-800);
    --tag-icon-success: var(--colors-green-800);
    --tag-icon-info: var(--colors-blue-800);
    --tag-icon-warning: var(--colors-yellow-800);
    --tag-icon-error: var(--colors-red-800);
    --tag-background-success: var(--colors-green-700);
    --tag-background-success-light: var(--colors-green-50);
    --tag-background-info: var(--colors-blue-600);
    --tag-background-info-light: var(--colors-blue-50);
    --tag-background-warning: var(--colors-yellow-700);
    --tag-background-warning-light: var(--colors-yellow-50);
    --tag-background-error: var(--colors-red-600);
    --tag-background-error-light: var(--colors-red-50);
    --tag-border-neutral: var(--colors-neutral-600);
    --tag-border-neutral-light: var(--colors-neutral-50);
    --tag-border-on-color: var(--colors-alpha-alpha-white-60);
    --tag-border-success: var(--colors-green-700);
    --tag-border-success-light: var(--colors-green-200);
    --tag-border-info: var(--colors-blue-700);
    --tag-border-info-light: var(--colors-blue-200);
    --tag-border-warning: var(--colors-yellow-700);
    --tag-border-warning-light: var(--colors-yellow-200);
    --tag-border-error: var(--colors-red-700);
    --tag-border-error-light: var(--colors-red-200);
    --tag-dot: var(--colors-alpha-alpha-white-60);
    --form-text-form-title: var(--text-default);
    --controls-control-primary: var(--alpha-white-0);
    --table-cell-border: var(--colors-neutral-300);
    --table-cell-border-inverse: var(--border-black);
    --table-text-head: var(--colors-neutral-700);
    --table-text-body: var(--text-default);
    --table-background-disabled: var(--background-disabled);
    --table-background-hover-selected: var(--colors-neutral-50);
    --table-background-header: var(--colors-neutral-100);
    --table-background-row: var(--colors-neutral-50);
    --controls-control-primary-checked: var(--colors-primary-sa-flag-600-primary);
    --controls-control-primary-hovered: var(--colors-primary-sa-flag-800);
    --controls-control-primary-pressed: var(--colors-primary-sa-flag-800);
    --controls-control-primary-focused: var(--colors-primary-sa-flag-600-primary);
    --controls-control-neutral-checked: var(--colors-neutral-950);
    --controls-control-neutral-hovered: var(--colors-neutral-600);
    --controls-control-neutral-pressed: var(--colors-neutral-600);
    --controls-control-neutral-focused: var(--colors-neutral-950);
    --controls-control-primary--readonly: var(--alpha-white-0);
    --controls-control-pressed: var(--colors-neutral-300);
    --controls-control-ripple-effect: var(--colors-neutral-200);
    --controls-control-border: var(--colors-neutral-500);
    --form-text-form-paragraph: var(--text-secondary-paragraph);
    --form-field-text-label: var(--text-default);
    --form-field-text-placeholder: var(--text-secondary-paragraph);
    --form-field-text-hovered: var(--text-default);
    --stepper-button-completed: var(--colors-primary-sa-flag-600-primary);
    --tooltip-background-light: var(--colors-base-white);
    --tooltip-text-heading-light: var(--text-display);
    --tooltip-text-paragraph-light: var(--text-primary-paragraph);
    --tooltip-background-dark: var(--colors-neutral-800);
    --tooltip-text-heading-dark: var(--colors-neutral-50);
    --tooltip-text-paragraph-dark: var(--colors-neutral-100);
    --alpha-white-0: var(--colors-alpha-alpha-white-0);
    --alpha-white-10: var(--colors-alpha-alpha-white-10);
    --alpha-white-20: var(--colors-alpha-alpha-white-20);
    --alpha-white-30: var(--colors-alpha-alpha-white-30);
    --alpha-white-40: var(--colors-alpha-alpha-white-40);
    --alpha-white-50: var(--colors-alpha-alpha-white-50);
    --alpha-white-60: var(--colors-alpha-alpha-white-60);
    --alpha-white-70: var(--colors-alpha-alpha-white-70);
    --alpha-white-80: var(--colors-alpha-alpha-white-80);
    --alpha-white-90: var(--colors-alpha-alpha-white-90);
    --alpha-white-100: var(--colors-alpha-alpha-white-100);
    --alpha-black-0: var(--colors-alpha-alpha-black-0);
    --alpha-black-10: var(--colors-alpha-alpha-black-10);
    --alpha-black-20: var(--colors-alpha-alpha-black-20);
    --alpha-black-30: var(--colors-alpha-alpha-black-30);
    --alpha-black-40: var(--colors-alpha-alpha-black-40);
    --alpha-black-50: var(--colors-alpha-alpha-black-50);
    --alpha-black-60: var(--colors-alpha-alpha-black-60);
    --alpha-black-70: var(--colors-alpha-alpha-black-70);
    --alpha-black-80: var(--colors-alpha-alpha-black-80);
    --alpha-black-90: var(--colors-alpha-alpha-black-90);
    --alpha-black-100: var(--colors-alpha-alpha-black-100);
    --background-disabled: var(--colors-neutral-200);
    --background-disabled-primary: var(--colors-primary-sa-flag-200);
    --background-inverse-disabled: var(--colors-neutral-100);
    --stepper-button-completed-hovered: var(--colors-primary-sa-flag-700);
    --stepper-button-current: var(--colors-primary-sa-flag-600-primary);
    --stepper-button-current-hovered: var(--colors-primary-sa-flag-700);
    --stepper-button-upcomming: var(--colors-neutral-300);
    --stepper-button-upcomming-hovered: var(--colors-neutral-400);
    --stepper-button-background: var(--colors-base-white);
    --stepper-text-primary: var(--text-display);
    --stepper-text-secondary: var(--text-primary-paragraph);
    --stepper-text-tertiary: var(--text-secondary-paragraph);
    --stepper-line-completed: var(--colors-primary-sa-flag-600-primary);
    --stepper-line-completed-hovered: var(--colors-primary-sa-flag-700);
    --stepper-line-current: var(--colors-neutral-300);
    --stepper-line-upcomming: var(--colors-neutral-300);
    --stepper-line-upcomming-hovered: var(--colors-neutral-400);
    --form-field-text-focused: var(--text-primary-paragraph);
    --form-field-text-pressed: var(--text-primary-paragraph);
    --form-field-text-filled: var(--text-default);
    --form-field-text-readonly: var(--text-default);
    --form-field-text-helper: var(--text-secondary-paragraph);
    --form-field-background-default: var(--background-card);
    --form-field-background-lighter: var(--colors-neutral-25);
    --form-field-background-darker: var(--colors-neutral-100);
    --form-field-background-pressed: var(--colors-neutral-100);
    --form-field-border-default: var(--colors-neutral-400);
    --form-field-border-hovered: var(--colors-neutral-700);
    --form-field-border-pressed: var(--colors-neutral-950);
    --form-field-border-error: var(--border-error);
    --form-option-background-hover: var(--colors-neutral-100);
    --form-option-background-pressed: var(--colors-neutral-200);
    --form-datecell-background-default: var(--colors-primary-sa-flag-600-primary);
    --form-datecell-background-hovered: var(--colors-primary-sa-flag-700);
    --icon-default: var(--colors-base-black);
    --form-datecell-background-pressed: var(--colors-primary-sa-flag-900);
    --form-datecell-background-focused: var(--colors-primary-sa-flag-600-primary);
    --form-datecell-today-background-default: var(--alpha-white-0);
    --form-datecell-today-background-hovered: var(--colors-neutral-200);
    --form-datecell-today-background-pressed: var(--colors-neutral-300);
    --icon-default-500: var(--colors-neutral-500);
    --form-datecell-today-background-focused: var(--alpha-white-0);
    --form-datecell-background-disabled: #ffffff;
    --form-datecell-background-600: var(--colors-primary-sa-flag-600-primary);
    --form-datecell-background-300: var(--colors-primary-sa-flag-300);
    --form-datecell-background-200: var(--colors-primary-sa-flag-200);
    --form-datecell-background-100: var(--colors-primary-sa-flag-100);
    --controls-control-icon-hovered: var(--icon-oncolor);
    --alpha-primary-10: #1b835419;
    --icon-default-400: var(--colors-neutral-400);
    --icon-primary: var(--colors-primary-sa-flag-600-primary);
    --alpha-primary-20: #1b835433;
    --icon-primary-light: var(--colors-primary-sa-flag-50);
    --alpha-warning-10: #dc680319;
    --icon-primary-400: var(--colors-primary-sa-flag-400);
    --alpha-warning-20: #dc680333;
    --alpha-error-10: #d92c2019;
    --alpha-error-20: #d92c2033;
    --alpha-info-10: #156fee19;
    --alpha-info-20: #156fee33;
    --alpha-success-10: #06945419;
    --alpha-success-20: #06945433;
    --icon-neutral: var(--colors-neutral-700);
    --icon-neutral-light: var(--colors-neutral-50);
    --icon-secondary: var(--colors-secondary-gold-600-primary);
    --icon-secondary-light: var(--colors-secondary-gold-50);
    --icon-tertiary: var(--colors-tertiary-lavendar-500-primary);
    --icon-tertiary-light: var(--colors-tertiary-lavendar-50);
    --icon-success: var(--colors-green-700);
    --icon-success-light: var(--colors-green-50);
    --icon-info: var(--colors-blue-700);
    --icon-info-light: var(--colors-blue-50);
    --icon-warning: var(--colors-yellow-700);
    --icon-warning-light: var(--colors-yellow-50);
    --icon-error: var(--colors-red-700);
    --icon-error-light: var(--colors-red-50);
    --icon-default-disabled: var(--colors-neutral-400);
    --icon-default-oncolor-disabled: var(--colors-alpha-alpha-white-40);
    --control-disabled: var(--colors-neutral-400);
    --featuredicons-icon-oncolor: var(--colors-base-white);
    --featuredicons-icon-success: var(--colors-green-700);
    --featuredicons-icon-default: var(--colors-base-black);
    --featuredicons-icon-error: var(--colors-red-700);
    --featuredicons-icon-secondary: var(--colors-secondary-gold-600-primary);
    --featuredicons-icon-default-500: var(--colors-neutral-500);
    --featuredicons-background-error-light: var(--colors-red-50);
    --featuredicons-background-info-light: var(--colors-blue-50);
    --featuredicons-background-warning-light: var(--colors-yellow-50);
    --featuredicons-background-success-light: var(--colors-green-50);
    --featuredicons-background-brand-light: var(--colors-primary-sa-flag-50);
    --featuredicons-background-default-light: var(--colors-neutral-50);
    --featuredicons-icon-default-400: var(--colors-neutral-400);
    --featuredicons-icon-primary: var(--colors-primary-sa-flag-600-primary);
    --featuredicons-icon-primary-light: var(--colors-primary-sa-flag-50);
    --featuredicons-icon-primary-400: var(--colors-primary-sa-flag-400);
    --featuredicons-icon-neutral: var(--colors-neutral-700);
    --featuredicons-icon-neutral-light: var(--colors-neutral-50);
    --featuredicons-icon-secondary-light: var(--colors-secondary-gold-50);
    --featuredicons-icon-tertiary: var(--colors-tertiary-lavendar-500-primary);
    --featuredicons-icon-tertiary-light: var(--colors-tertiary-lavendar-50);
    --featuredicons-icon-success-light: var(--colors-green-50);
    --featuredicons-icon-info: var(--colors-blue-700);
    --featuredicons-icon-info-light: var(--colors-blue-50);
    --featuredicons-icon-warning: var(--colors-yellow-700);
    --featuredicons-bg-icon-warning-light: var(--background-warning-50);
    --featuredicons-bg-icon-error-light: var(--background-error-50);
    --featuredicons-bg-icon-brand-light: var(--colors-primary-sa-flag-50);
    --featuredicons-bg-icon-info-light: var(--background-info-50);
    --featuredicons-bg-icon-success-light: var(--background-success-50);
    --controls-control-icon-pressed: var(--icon-oncolor);
    --controls-control-icon-disabled: var(--colors-base-white);
    --notification-background-error-light: var(--colors-red-50);
    --notification-background-info-light: var(--colors-blue-50);
    --notification-background-warning-light: var(--colors-yellow-50);
    --notification-background-success-light: var(--colors-green-50);
    --notification-background-brand-light: var(--colors-primary-sa-flag-50);
    --notification-background-default-light: var(--colors-neutral-50);
    --notification-background-default-50: var(--background-neutral-50);
    --notification-background-success-50: var(--background-success-50);
    --notification-background-warning-50: var(--background-warning-50);
    --notification-background-error-50: var(--background-error-50);
    --notification-background-brand-50: var(--colors-primary-sa-flag-50);
    --notification-background-info-50: var(--background-info-50);
    --notification-background-default-25: var(--background-neutral-25);
    --notification-background-success-25: var(--background-success-25);
    --notification-background-warning-25: var(--background-warning-25);
    --notification-background-error-25: var(--background-error-25);
    --notification-background-brand-25: var(--background-primary-25);
    --notification-background-info-25: var(--background-info-25);
    --notification-text-success: var(--text-success);
    --notification-text-error: var(--text-error);
    --notification-text-info: var(--text-info);
    --notification-text-warning: var(--text-warning);
    --notification-text-brand: var(--text-primary);
    --controls-control-text-error: var(--text-error) --shadow-xs: 0px 1px 2px 0px rgba(16, 24, 40, .05);
    --shadow-sm: 0px 1px 2px 0px rgba(16, 24, 40, .06), 0px 1px 3px 0px rgba(16, 24, 40, .1);
    --shadow-md: 0px 2px 4px -2px rgba(16, 24, 40, .06), 0px 4px 8px -2px rgba(16, 24, 40, .1);
    --shadow-lg: 0px 4px 6px -2px rgba(16, 24, 40, .03), 0px 12px 16px -4px rgba(16, 24, 40, .08);
    --shadow-xl: 0px 8px 8px -4px rgba(16, 24, 40, .03), 0px 20px 24px -4px rgba(16, 24, 40, .08);
    --shadow-2xl: 0px 24px 48px -12px rgba(16, 24, 40, .18);
    --shadow-3xl: 0px 32px 64px -12px rgba(16, 24, 40, .14);
    --spacing-0: 0px;
    --spacing-0-5: 2px;
    --spacing-1: 4px;
    --spacing-1-5: 6px;
    --spacing-2: 8px;
    --spacing-3: 12px;
    --spacing-4: 16px;
    --spacing-5: 20px;
    --spacing-6: 24px;
    --spacing-8: 32px;
    --spacing-10: 40px;
    --spacing-12: 48px;
    --spacing-16: 64px;
    --spacing-20: 80px;
    --spacing-24: 96px;
    --spacing-32: 128px;
    --spacing-40: 160px;
    --spacing-48: 192px;
    --spacing-56: 224px;
    --spacing-64: 256px;
    --spacing-96: 384px;
    --spacing-80: 320px;
    --spacing-120: 480px;
    --spacing-140: 560px;
    --spacing-160: 640px;
    --spacing-180: 720px;
    --spacing-192: 768px;
    --spacing-256: 1024px;
    --spacing-320: 1280px;
    --spacing-360: 1440px;
    --spacing-400: 1600px;
    --spacing-480: 1920px;
    --width-xxs: var(--spacing-80);
    --width-xs: var(--spacing-96);
    --width-sm: var(--spacing-120);
    --width-md: var(--spacing-140);
    --width-lg: var(--spacing-160);
    --width-xl: var(--spacing-192);
    --width-2xl: var(--spacing-256);
    --width-3xl: var(--spacing-320);
    --width-4xl: var(--spacing-360);
    --width-5xl: var(--spacing-400);
    --width-6xl: var(--spacing-480);
    --maxwidth-paragraph-max-width: var(--spacing-180);

    --ibmBold: var(--IBM-b);
    --ibmlight: "IBM Light";
    --ibmmedium: "IBM Medium";}
@media only screen and (min-width: 1025px){:root{--tooltip-padding: var(--spacing-2);
        --tooltip-gap: var(--spacing-2);
        --tab-button-gap: var(--spacing-1);
        --notification-gap: var(--spacing-4);
        --notification-padding: var(--spacing-4);
        --notification-h-padding: var(--spacing-6);
        --notification-alert-v-padding: var(--spacing-2);
        --notification-alert-h-padding: var(--spacing-6);
        --notification-toast-v-padding: var(--spacing-4);
        --notification-toast-desktop-h-padding: var(--spacing-6);
        --notification-toast-mobile-h-padding: var(--spacing-4);
        --tab-horizontal-tab-md-button-v-padding: var(--spacing-3);
        --tab-horizontal-tab-md-button-h-padding: var(--spacing-4);
        --tab-horizontal-tab-sm-button-v-padding: var(--spacing-2);
        --tab-horizontal-tab-sm-button-h-padding: var(--spacing-3);
        --tab-vertical-tab-md-button-v-padding: var(--spacing-1-5);
        --tab-vertical-tab-md-button-h-padding: var(--spacing-3);
        --tab-vertical-tab-sm-button-v-padding: var(--spacing-0-5);
        --tab-vertical-tab-sm-button-h-padding: var(--spacing-1-5);
        --table-cell-gap: var(--spacing-2);
        --table-cell-v-padding: var(--spacing-2);
        --table-cell-h-padding: var(--spacing-4);
        --control-vertical-gap: var(--spacing-1);
        --control-title-error-gap: var(--spacing-4);
        --control-switch-error-icon-gap: var(--spacing-2);
        --control-radio-error-icon-gap: var(--spacing-4);
        --control-switch-description-padding: var(--spacing-16);
        --control-radio-description-padding: var(--spacing-12);
        --form-label-gap: var(--spacing-1);
        --form-field-label-gap: var(--spacing-2);
        --form-input-padding: var(--spacing-0);
        --form-input-gap: var(--spacing-0);
        --form-textarea-padding: var(--spacing-0);
        --form-textarea-gap: var(--spacing-0);
        --form-select-padding: var(--spacing-0);
        --form-select-gap: var(--spacing-0);
        --accordion-lg-header-padding: var(--spacing-4);
        --accordion-lg-header-gap: var(--spacing-4);
        --accordion-md-header-padding: var(--spacing-3);
        --accordion-md-header-gap: var(--spacing-12);
        --accordion-sm-header-padding: var(--spacing-2);
        --accordion-sm-header-gap: var(--spacing-2);
        --card-lg-padding: var(--spacing-8);
        --section-padding: var(--spacing-8);
        --section-gap: var(--spacing-8);
        --text-content-gap: var(--spacing-2);
        --icon-text-gap: var(--spacing-2);
        --buttons-lg-gap: var(--spacing-1);
        --model-padding: var(--spacing-6);
        --buttons-lg-padding: var(--spacing-4);
        --model-gap: var(--spacing-2);
        --buttons-md-gap: var(--spacing-1);
        --buttons-md-padding: var(--spacing-3);
        --buttons-sm-gap: var(--spacing-1);
        --buttons-sm-padding: var(--spacing-2);
        --model-content-bottom-padding: var(--spacing-4);
        --buttons-group-gap: var(--spacing-2);
        --button-menu-gap: var(--spacing-2);
        --button-menu-v-padding: var(--spacing-2);
        --button-menu-h-padding: var(--spacing-2);
        --link-md-gap: var(--spacing-2);
        --link-sm-gap: var(--spacing-1);
        --link-links-group-gap: var(--spacing-3);
        --progressindicator-progress-indicator-gap: var(--spacing-2);
        --progressindicator-progress-text-content-side-padding: var(--spacing-4);
        --pagination-item-sm-padding: var(--spacing-1);
        --pagination-item-md-padding: var(--spacing-1-5);
        --pagination-item-lg-padding: var(--spacing-2);
        --pagination-items-padding: var(--spacing-2);
        --spacing-none: var(--spacing-0);
        --spacing-xxs: var(--spacing-0-5);
        --spacing-xs: var(--spacing-1);
        --spacing-sm: var(--spacing-1-5);
        --spacing-md: var(--spacing-2);
        --spacing-lg: var(--spacing-3);
        --spacing-xl: var(--spacing-4);
        --spacing-2xl: var(--spacing-5);
        --spacing-3xl: var(--spacing-6);
        --spacing-4xl: var(--spacing-8);
        --spacing-5xl: var(--spacing-10);
        --spacing-6xl: var(--spacing-12);
        --spacing-7xl: var(--spacing-16);
        --spacing-8xl: var(--spacing-20);
        --spacing-9xl: var(--spacing-24);
        --spacing-10xl: var(--spacing-32);
        --spacing-11xl: var(--spacing-40);
        --card-lg-gap: var(--spacing-6);
        --card-md-padding: var(--spacing-8);
        --card-md-gap: var(--spacing-6);
        --card-sm-padding: var(--spacing-8);
        --card-sm-gap: var(--spacing-6);}}
@media only screen and (min-width: 768px){:root{--tooltip-padding: var(--spacing-2);
        --tooltip-gap: var(--spacing-2);
        --tab-button-gap: var(--spacing-1);
        --notification-gap: var(--spacing-4);
        --notification-padding: var(--spacing-4);
        --notification-h-padding: var(--spacing-6);
        --notification-alert-v-padding: var(--spacing-2);
        --notification-alert-h-padding: var(--spacing-6);
        --notification-toast-v-padding: var(--spacing-4);
        --notification-toast-desktop-h-padding: var(--spacing-6);
        --notification-toast-mobile-h-padding: var(--spacing-4);
        --tab-horizontal-tab-md-button-v-padding: var(--spacing-3);
        --tab-horizontal-tab-md-button-h-padding: var(--spacing-4);
        --tab-horizontal-tab-sm-button-v-padding: var(--spacing-2);
        --tab-horizontal-tab-sm-button-h-padding: var(--spacing-3);
        --tab-vertical-tab-md-button-v-padding: var(--spacing-1-5);
        --tab-vertical-tab-md-button-h-padding: var(--spacing-3);
        --tab-vertical-tab-sm-button-v-padding: var(--spacing-0-5);
        --tab-vertical-tab-sm-button-h-padding: var(--spacing-1-5);
        --table-cell-gap: var(--spacing-2);
        --table-cell-v-padding: var(--spacing-2);
        --table-cell-h-padding: var(--spacing-4);
        --control-vertical-gap: var(--spacing-1);
        --control-title-error-gap: var(--spacing-3);
        --control-switch-error-icon-gap: var(--spacing-2);
        --control-radio-error-icon-gap: var(--spacing-4);
        --control-switch-description-padding: var(--spacing-16);
        --control-radio-description-padding: var(--spacing-12);
        --form-label-gap: var(--spacing-1);
        --form-field-label-gap: var(--spacing-2);
        --form-input-padding: var(--spacing-0);
        --form-input-gap: var(--spacing-0);
        --form-textarea-padding: var(--spacing-0);
        --form-textarea-gap: var(--spacing-0);
        --form-select-padding: var(--spacing-0);
        --form-select-gap: var(--spacing-0);
        --accordion-lg-header-padding: var(--spacing-4);
        --accordion-lg-header-gap: var(--spacing-4);
        --accordion-md-header-padding: var(--spacing-3);
        --accordion-md-header-gap: var(--spacing-3);
        --accordion-sm-header-padding: var(--spacing-2);
        --accordion-sm-header-gap: var(--spacing-2);
        --card-lg-padding: var(--spacing-6);
        --section-padding: var(--spacing-6);
        --section-gap: var(--spacing-6);
        --text-content-gap: var(--spacing-2);
        --icon-text-gap: var(--spacing-2);
        --buttons-lg-gap: var(--spacing-1);
        --model-padding: var(--spacing-6);
        --buttons-lg-padding: var(--spacing-4);
        --model-gap: var(--spacing-2);
        --buttons-md-gap: var(--spacing-1);
        --buttons-md-padding: var(--spacing-3);
        --buttons-sm-gap: var(--spacing-1);
        --buttons-sm-padding: var(--spacing-2);
        --model-content-bottom-padding: var(--spacing-4);
        --buttons-group-gap: var(--spacing-2);
        --button-menu-gap: var(--spacing-2);
        --button-menu-v-padding: var(--spacing-2);
        --button-menu-h-padding: var(--spacing-2);
        --link-md-gap: var(--spacing-2);
        --link-sm-gap: var(--spacing-1);
        --link-links-group-gap: var(--spacing-3);
        --progressindicator-progress-indicator-gap: var(--spacing-2);
        --progressindicator-progress-text-content-side-padding: var(--spacing-4);
        --pagination-item-sm-padding: var(--spacing-1);
        --pagination-item-md-padding: var(--spacing-1-5);
        --pagination-item-lg-padding: var(--spacing-2);
        --pagination-items-padding: var(--spacing-2);
        --spacing-none: var(--spacing-0);
        --spacing-xxs: var(--spacing-0-5);
        --spacing-xs: var(--spacing-1);
        --spacing-sm: var(--spacing-1-5);
        --spacing-md: var(--spacing-2);
        --spacing-lg: var(--spacing-3);
        --spacing-xl: var(--spacing-4);
        --spacing-2xl: var(--spacing-5);
        --spacing-3xl: var(--spacing-6);
        --spacing-4xl: var(--spacing-8);
        --spacing-5xl: var(--spacing-10);
        --spacing-6xl: var(--spacing-12);
        --spacing-7xl: var(--spacing-16);
        --spacing-8xl: var(--spacing-20);
        --spacing-9xl: var(--spacing-24);
        --spacing-10xl: var(--spacing-32);
        --spacing-11xl: var(--spacing-40);
        --card-lg-gap: var(--spacing-6);
        --card-md-padding: var(--spacing-6);
        --card-md-gap: var(--spacing-5);
        --card-sm-padding: var(--spacing-6);
        --card-sm-gap: var(--spacing-5);}}
@media only screen and (max-width: 767px){:root{--tooltip-padding: var(--spacing-2);
        --tooltip-gap: var(--spacing-2);
        --tab-button-gap: var(--spacing-1);
        --notification-gap: var(--spacing-2);
        --notification-padding: var(--spacing-3);
        --notification-h-padding: var(--spacing-4);
        --notification-alert-v-padding: var(--spacing-2);
        --notification-alert-h-padding: var(--spacing-4);
        --notification-toast-v-padding: var(--spacing-3);
        --notification-toast-desktop-h-padding: var(--spacing-4);
        --notification-toast-mobile-h-padding: var(--spacing-4);
        --tab-horizontal-tab-md-button-v-padding: var(--spacing-2);
        --tab-horizontal-tab-md-button-h-padding: var(--spacing-3);
        --tab-horizontal-tab-sm-button-v-padding: var(--spacing-1);
        --tab-horizontal-tab-sm-button-h-padding: var(--spacing-2);
        --tab-vertical-tab-md-button-v-padding: var(--spacing-1);
        --tab-vertical-tab-md-button-h-padding: var(--spacing-2);
        --tab-vertical-tab-sm-button-v-padding: var(--spacing-0-5);
        --tab-vertical-tab-sm-button-h-padding: var(--spacing-1);
        --table-cell-gap: var(--spacing-1);
        --table-cell-v-padding: var(--spacing-1);
        --table-cell-h-padding: var(--spacing-3);
        --control-vertical-gap: var(--spacing-1);
        --control-title-error-gap: var(--spacing-2);
        --control-switch-error-icon-gap: var(--spacing-1);
        --control-radio-error-icon-gap: var(--spacing-12);
        --control-switch-description-padding: var(--spacing-16);
        --control-radio-description-padding: var(--spacing-12);
        --form-label-gap: var(--spacing-1);
        --form-field-label-gap: var(--spacing-2);
        --form-input-padding: var(--spacing-0);
        --form-input-gap: var(--spacing-0);
        --form-textarea-padding: var(--spacing-0);
        --form-textarea-gap: var(--spacing-0);
        --form-select-padding: var(--spacing-0);
        --form-select-gap: var(--spacing-0);
        --accordion-lg-header-padding: var(--spacing-4);
        --accordion-lg-header-gap: var(--spacing-4);
        --accordion-md-header-padding: var(--spacing-3);
        --accordion-md-header-gap: var(--spacing-3);
        --accordion-sm-header-padding: var(--spacing-2);
        --accordion-sm-header-gap: var(--spacing-2);
        --card-lg-padding: var(--spacing-4);
        --section-padding: var(--spacing-4);
        --section-gap: var(--spacing-4);
        --text-content-gap: var(--spacing-1);
        --icon-text-gap: var(--spacing-1);
        --buttons-lg-gap: var(--spacing-1);
        --model-padding: var(--spacing-4);
        --buttons-lg-padding: var(--spacing-4);
        --model-gap: var(--spacing-1);
        --buttons-md-gap: var(--spacing-1);
        --buttons-md-padding: var(--spacing-3);
        --buttons-sm-gap: var(--spacing-1);
        --buttons-sm-padding: var(--spacing-2);
        --model-content-bottom-padding: var(--spacing-2);
        --buttons-group-gap: var(--spacing-1);
        --button-menu-gap: var(--spacing-2);
        --button-menu-v-padding: var(--spacing-2);
        --button-menu-h-padding: var(--spacing-2);
        --link-md-gap: var(--spacing-1);
        --link-sm-gap: var(--spacing-1);
        --link-links-group-gap: var(--spacing-2);
        --progressindicator-progress-indicator-gap: var(--spacing-4);
        --progressindicator-progress-text-content-side-padding: var(--spacing-3);
        --pagination-item-sm-padding: var(--spacing-1);
        --pagination-item-md-padding: var(--spacing-1-5);
        --pagination-item-lg-padding: var(--spacing-2);
        --pagination-items-padding: var(--spacing-1);
        --spacing-none: var(--spacing-0);
        --spacing-xxs: var(--spacing-0-5);
        --spacing-xs: var(--spacing-1);
        --spacing-sm: var(--spacing-1-5);
        --spacing-md: var(--spacing-2);
        --spacing-lg: var(--spacing-3);
        --spacing-xl: var(--spacing-4);
        --spacing-2xl: var(--spacing-5);
        --spacing-3xl: var(--spacing-6);
        --spacing-4xl: var(--spacing-8);
        --spacing-5xl: var(--spacing-10);
        --spacing-6xl: var(--spacing-12);
        --spacing-7xl: var(--spacing-16);
        --spacing-8xl: var(--spacing-20);
        --spacing-9xl: var(--spacing-24);
        --spacing-10xl: var(--spacing-32);
        --spacing-11xl: var(--spacing-40);
        --card-lg-gap: var(--spacing-4);
        --card-md-padding: var(--spacing-4);
        --card-md-gap: var(--spacing-3);
        --card-sm-padding: var(--spacing-4);
        --card-sm-gap: var(--spacing-3);}}
:root{--ink: #1f2328;
    --muted: #5b6470;
    --line: #e4e7eb;
    --card: #ffffff;
    --green: #3f7d5c;
    --green-dark: #33684c;
    --green-tint: #eaf3ee;
    --focus: #2f6fed;
    --overlay: rgba(15, 17, 20, .55);
    --radius: 10px;
    --shadow: 0 20px 60px rgba(0, 0, 0, .35);
    --IBM-b: "IBM Plex Bold";
    --IBM-regular: "IBM Plex Regular";
    --IBM-sb: "IBM Plex SemiBold";
    --blue-color: #22B0E9;
    --light-blue-color: #7cdaff7a;
    --blue-color-hover: #197ca3;
    --orange-color: #D37B60;
    --light-orange-color: #ffa589b3;
    --orange-color-hover: #a15d49;
    --purple-color: #77478E;
    --purple-color-hover: #553663;
    --red-color: #B62C3F;
    --red-color-hover: #9d2b3a;
    --light-red-color: #ff96a57a;
    --mint-green-color: #6AC6BB;
    --green-color: #0DA290;
    --bckground-green-color: #6effed54;
    --light-green-color: #5A935D;
    --green-color-hover-hover: #095e54;
    --green-color-hover: #0a786b;
    --navy-blue-color: #00162E;
    --txt-color: #7e7e7e;
    --light-grey-color: #efefef;
    --light-gray-background: #f8f8f8;
    --black-color: #545454;
    --grey-color: #6E96A2;
    --background: #FAFAFA;
    --dark-grey-color: #4D6C75;
    --transition: all .3s ease-in-out;
    --dark-background: #ECECEC;
    --tab-background-color: #efefef;}
@font-face{font-family: "IBM Plex Regular";
    src: url("../fonts/IBMPlexSansArabic-Regular.woff2") format("woff2"),
        url("../fonts/IBMPlexSansArabic-Regular.ttf") format("truetype");
    font-display: swap;}
@font-face{font-family: "IBM Plex Medium";
    src: url("../fonts/IBMPlexSansArabic-Medium.woff2") format("woff2"),
        url("../fonts/IBMPlexSansArabic-Medium.ttf") format("truetype");
    font-display: swap;}
@font-face{font-family: "IBM Plex SemiBold";
    src: url("../fonts/IBMPlexSansArabic-SemiBold.woff2") format("woff2"),
        url("../fonts/IBMPlexSansArabic-SemiBold.ttf") format("truetype");
    font-display: swap;}
@font-face{font-family: "IBM Plex Bold";
    src: url("../fonts/IBMPlexSansArabic-Bold.woff2") format("woff2"),
        url("../fonts/IBMPlexSansArabic-Bold.ttf") format("truetype");
    font-display: swap;}
@font-face{font-family: "IBM Plex Sans Arabic";
    font-weight: 400;
    src: url("../fonts/IBMPlexSansArabic-Regular.woff2") format("woff2"),
        url("../fonts/IBMPlexSansArabic-Regular.ttf") format("truetype");
    font-display: swap;}
@font-face{font-family: "IBM Plex Sans Arabic";
    font-weight: 500;
    src: url("../fonts/IBMPlexSansArabic-Medium.woff2") format("woff2"),
        url("../fonts/IBMPlexSansArabic-Medium.ttf") format("truetype");
    font-display: swap;}
@font-face{font-family: "IBM Plex Sans Arabic";
    font-weight: 600;
    src: url("../fonts/IBMPlexSansArabic-SemiBold-gf-arabic.woff2") format("woff2");
    font-display: swap;
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;}
@font-face{font-family: "IBM Plex Sans Arabic";
    font-weight: 600;
    src: url("../fonts/IBMPlexSansArabic-SemiBold-gf-cyrillic-ext.woff2") format("woff2");
    font-display: swap;
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family: "IBM Plex Sans Arabic";
    font-weight: 600;
    src: url("../fonts/IBMPlexSansArabic-SemiBold-gf-latin-ext.woff2") format("woff2");
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family: "IBM Plex Sans Arabic";
    font-weight: 600;
    src: url("../fonts/IBMPlexSansArabic-SemiBold-gf-latin.woff2") format("woff2");
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family: "IBM Plex Sans Arabic";
    font-weight: 700;
    src: url("../fonts/IBMPlexSansArabic-Bold.woff2") format("woff2"),
        url("../fonts/IBMPlexSansArabic-Bold.ttf") format("truetype");
    font-display: swap;}
.cc-overlay{position: fixed;
    inset: auto 0px 20px;
    align-items: flex-end;
    justify-content: center;
    z-index: 1000;
    height: fit-content;
    display: none;
    width: 100% !important;}
.cc-panel{width: fit-content;
    max-width: 80%;
    background: var(--card);
    border-radius: var(--radius);
    overflow: hidden;
    animation: 0.28s ease 0s 1 normal none running cc-rise;
    border: 1px solid var(--border-neutral-primary);}
.cc-body{padding: var(--spacing-4xl);
    text-align: right;}
.cc-head{display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: var(--spacing-xl);}
.cc-head-left{display: flex;
    align-items: center;
    gap: var(--spacing-md);}
.cc-icon{width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;}
p:has(.cc-link){text-align: start;
    margin-bottom: unset;}
.cc-title{margin-top: 0px;
    margin-right: 0px;
    margin-left: 0px;
    font-weight: 700;
    font-size: var(--text-lg) !important;
    font-family: var(--ibmsemibold) !important;
    margin-bottom: unset !important;}
.cc-close{background: none;
    border-width: medium;
    border-style: none;
    border-color: currentcolor;
    border-image: initial;
    cursor: pointer;
    color: var(--muted);
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    flex: 0 0 auto;}
.cc-close:hover{background: rgb(242, 243, 245);
    color: var(--ink);}
.cc-close:focus-visible{outline: 2px solid var(--focus);
    outline-offset: 2px;}
.cc-text{font-size: var(--text-md);
    line-height: 24px;
    color: var(--text-primary-paragraph);
    margin: 0 0 var(--spacing-md);
    text-align: start;}
.cc-link{color: var(--link-primary);
    font-size: var(--text-md);
    text-decoration: none;
    display: inline-block;
    margin-bottom: var(--spacing-xl);}
.cc-link:hover{text-decoration: underline;
    color: var(--link-primary-hovered);}
.cc-link:focus-visible{outline: 2px solid var(--focus);
    outline-offset: 2px;
    border-radius: 4px;}
.cc-btn{width: 100%;
    display: block;
    padding: 0 var(--buttons-md-padding);
    height: 40px;
    border-radius: var(--radius-sm);
    font-size: var(--text-md);
    cursor: pointer;
    text-align: center;
    border: 1px solid transparent;
    margin-bottom: 10px;
    font-family: inherit;}
.cc-btn:last-child{margin-bottom: 0px;}
.cc-btn:focus-visible{outline: 2px solid var(--focus);
    outline-offset: 2px;}
.cc-btn-primary{background: var(--button-background-primary-default);
    color: rgb(255, 255, 255);}
.cc-btn-primary:hover{background: var(--button-background-primary-hovered);}
@media (max-width: 480px){.cc-body{padding: 20px 18px 18px;}}
@media (max-width: 480px){.cc-title{font-size: 16px;}}
@media (max-width: 480px){.cc-overlay{padding: 0px;
        align-items: flex-end;}}
@media (max-width: 480px){.cc-panel{max-width: none;
        border-radius: 14px 14px 0px 0px;}}
ul li{position:relative;}
.nav-tabs{display: flex;}
.nav-tabs .nav-item{width:fit-content;}
.secondary-nav-content .navLinksContainer .nav-item .nav-link.is-active,
    .nav-item:has(.mega-links  a.is-active) > .nav-link{background-color: var(--button-background-primary-default);
        color: var(--text-oncolor-primary);}
.secondary-nav-content .navLinksContainer .nav-item .nav-link.is-active svg path,
    .nav-item:has(.mega-links  a.is-active) > .nav-link svg path{fill:white;}
.secondary-nav-content .navLinksContainer .nav-item .nav-link.is-active:hover,
    .nav-item:has(.mega-links  a.is-active):hover > .nav-link{background-color:var(--button-background-primary-hovered);
        color: #fff;}
.secondary-nav-content .navLinksContainer .nav-item .nav-link.is-active::after,
 .nav-item:has(.mega-links  a.is-active) > .nav-link::after,
.secondary-nav-content .navLinksContainer .nav-item .nav-link.is-active:hover::after,
    .nav-item:has(.mega-links  a.is-active):hover > .nav-link::after{background-color: var(--background-primary-400);}
.swiper-button-next:after, .swiper-button-prev:after{display:none;}
.eservices-container header{z-index: 0;
 width: fit-content;
 margin-inline-start: auto;
 position: absolute;
 left: 0;
 top: 0;}
.eservices-container .fieldgroup{height:fit-content;
    max-height: 4rem;
    margin-bottom: var(--spacing-4xl);}
.eservices-container .fieldgroup legend{display:none;}
.eservices-container .views-element-container{position:relative;}
.eservices-container header span{width: fit-content;
    margin-right:auto;
    position: relative;
    left:0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-md);
    padding: var(--spacing-0) var(--spacing-xl);
    height: 40px;}
.eservices-container .form-text{flex: 1;
    border: 1px solid #9DA4AE;
    outline: 0;
    background: transparent;
    color: #384250;
    font-size: 16px;
    padding:var(--spacing-0) var(--spacing-5xl);
    height:40px;
    border-radius:var(--radius-sm);
    position: relative;
    width: 100%;
    
    margin: 0;}
.eservices-container .js-form-item-title{position:relative;}
.eservices-container .js-form-item-title::after{content: "";
    position: absolute;
    bottom: -17px;
    right: 0;
    background-color: #000;
    width: 27.6rem;
    scale: 0;
    height: 2px;
    transition: all .6s ease-in-out;}
.eservices-container .js-form-item-title:has(.form-text){position:relative;
    width: fit-content;}
.eservices-container .js-form-item-title:has(.form-text)::before{content:"";
    position:absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0.7rem;
    background-image:url("/themes/uoj_theme/media/SearchTextbox.png");
    background-repeat:no-repeat;
    background-size:contain;
    background-position:center;
    height: 1rem;
    width: 1rem;}
.eservices-container header span i{display:none;}
.eservices-container .fieldset-wrapper>div:first-child{display: flex;
    align-items: center;
    margin-bottom: var(--spacing-5xl);}
.eservices-container .fieldset-wrapper>div:first-child .form-radios.form--inline{display:flex;
    overflow-x: auto;}
.eservices-container .fieldset-wrapper>div:first-child .js-form-item{background-color: white;
    color: var(--text-default);
    font-size: var(--text-sm);
    position: relative;}
.eservices-container .fieldset-wrapper>div:first-child .js-form-item::after{content: "";
    display: block;
    position: absolute;
    bottom: 1px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 3px;
    border-radius: var(--radius-full);
    background-color: var(--border-neutral-secondary);
    z-index: 1;}
.eservices-container .fieldset-wrapper>div:first-child .js-form-item:has([checked="checked"])::after{background-color: var(--border-primary);}
.eservices-container .fieldset-wrapper>div:first-child .js-form-item:hover::after{content: "";
    display: block;
    position: absolute;
    bottom: 1px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 3px;
    border-radius: var(--radius-full) !important;
    background-color: var(--border-black);
    z-index: 1;}
.eservices-container .fieldset-wrapper>div:first-child .js-form-item .form-radio{display: none;}
.eservices-container .fieldset-wrapper>div:first-child .js-form-item.js-form-type-radio label{padding: var(--spacing-xl);
    gap: var(--tab-button-gap);
    display: flex;
    flex-wrap: nowrap;
    width: fit-content;}
.page-header-section{padding: 0;
    background-color: var(--background-primary-25);}
.page-header-section img{width: calc(100% - 0rem);
    height: auto;}
.page-header-section .uj-container{display: flex;
    flex-direction: column;
    gap: var(--spacing-2xl);}
.supreme-president .uj-card .uj-card-img img{object-position: top;}
.nav-tabs li::before{display: none;}
p.description,
div.description p{color: var(--text-default);
    font-size: var(--text-md);
    line-height: 24px;
    text-align: inherit;}
.digital-stamp-card{padding: 8px 0px;
    background: #F3F4F6;
    z-index: 99;
    position: relative;}
.digital-stamp-card .digital-stamp-header{display: flex;
    align-items: center;
    gap: 10px;
    max-width: 1376px;
    max-width: var(--container-max-width-desktop);
    margin: auto;}
.digital-stamp-card .digital-stamp-header h6{margin: 0px;
    color: #161616;
    font-size: 14px;}
.digital-stamp-card .digital-stamp-header .btn-digital-stamp-card{cursor: pointer;}
.digital-stamp-card .digital-stamp-header .btn-digital-stamp-card:hover{text-decoration:underline;
    color:var(--link-primary-hovered);}
.digital-stamp-card .digital-stamp-header .btn-digital-stamp-card span{color: #1B8354;
    font-size: 14px;}
.digital-stamp-card .digital-stamp-header .btn-digital-stamp-card svg,
.digital-stamp-card .digital-stamp-header .btn-digital-stamp-card img{transition: 0.3s;}
.digital-stamp-card .digital-stamp-body{padding-top: var(--spacing-5xl);
    padding-bottom: var(--spacing-4xl);
    display: none;
    max-width: var(--container-max-width-desktop);
    margin: auto;}
.digital-stamp-card .digital-stamp-body .digital-stamp-container{margin-bottom: 32px;
    display: flex;
    gap: var(--spacing-xl);}
.digital-stamp-card .digital-stamp-body .digital-stamp-container .box{display: flex;
    align-items: flex-start;
    gap: var(--spacing-3xl);}
.digital-stamp-card .digital-stamp-body .digital-stamp-container .box .img-border-rounded{display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--icon-success);
    border-radius: 100%;
    height: 48px;
    width: 48px;
    min-width: 48px;}
.digital-stamp-card .digital-stamp-body .stamp-link-box{padding: var(--spacing-md) var(--spacing-3xl);
    display: flex;
    align-items: center;
    gap: var(--spacing-lg);
    border-radius: var(--radius-md);
    background: #FFF;}
.digital-stamp-card .digital-stamp-body .stamp-link-box a svg{margin-left: unset;
    height: 14.5px;}
.digital-stamp-card .digital-stamp-header .btn-digital-stamp-card:hover span{color: var(--link-primary-hovered);}
.digital-stamp-card .digital-stamp-header .btn-digital-stamp-card:hover svg path{fill: var(--link-primary-hovered);}
.stamp-ar{direction: rtl;}
.stamp-en{direction: ltr;}
.uj-container{width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding: var(--spacing-5xl) var(--container-padding-mobile);}
.uj-container:empty{display:none;
    padding:0!important;
    margin:0!important;}
.uj-container:not(:has(*)):not(:has(:not(:empty))){display: none !important;}
.care-tiles{display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:var(--spacing-xl);}
.description li{position: relative;
    margin: var(--spacing-xs) 0;
    list-style-type: disc;}
.available-programs .swiper-pagination{z-index: 1;}
html,
body{-webkit-user-select: text;
    user-select: text;}
a:focus-visible{outline: none;}
.tabpane-swiper .swiper-button-prev:after,
.tabpane-swiper .swiper-button-next:after,
.services-container .swiper-button-prev::after,
.services-container .swiper-button-next::after,
.quick-links.swiper .swiper-button-prev::after,
.quick-links.swiper .swiper-button-next::after{content: '' !important;}
.read-more .prompt{background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.05), rgba(255, 255, 255, .95), rgb(255, 255, 255)) !important;
    display: none;}
.read-more .prompt .button{text-shadow: unset !important;
    color: var(--link-primary);
    font-family: var(--IBM-sb);
    padding: 0 !important;
    text-decoration: underline;
    line-height: 3;
    transition: .3s all ease;}
.read-more .prompt .button:hover{color: var(--link-primary-hovered);}
ul{list-style-type: none;}
.profile .tab-content ul li{position: relative;
    color: var(--text-default);
    font-size: var(--text-md);
    line-height: 24px;
    list-style-type: disc;}
.agent-profile .tab-content ul{margin-bottom: 0;
    display: flex;
    flex-direction: column;
    row-gap: var(--spacing-xl);
    padding-inline-start: 1rem;}
.agent-profile .tab-content ul li{color: var(--text-display);}
html{overflow-x: hidden;}
html{margin: 0px;
    padding: 0px !important;}
a:hover{color: var(--link-primary-hovered);
    text-decoration: none;}
button{border: none;
    outline: none;}
.container.description{width: 100%;}
.container.description img{width: 100%;
    height: 100%;
    object-fit: cover;}
.profile .tabs-wrapper div:not(.tabbed-swiper) ul.nav.nav-tabs{display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: nowrap;}
.description.container ul{padding: 0;}
.Deanship-agencies.contact-information .agencies-tiles .uj-container{margin-top: 0;
    display: flex;
    flex-direction: column;}
.Deanship-agencies.contact-information .agencies-tiles .col-lg-6{padding: 0;
    max-width: 49%;
    margin-bottom: unset;}
.content-viewer-alt .research-production{display: flex;
    background-color: var(--background-neutral-50);}
.content-viewer-alt .research-production::before,
.content-viewer-alt-dark .research-production:before{content: unset;}
.care-tiles.policies .row-cards{display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: var(--spacing-xl);}
.uj-card.uj-card-noimg .uj-card-footer{display: flex;
    flex-direction: column;
    align-items: start;
    gap: var(--spacing-3xl);}
.uj-card.uj-card-noimg .uj-card-footer .uj-btn--neutral{margin-inline-start: auto;}
.care-tiles.policies .row-cards .col-lg-4{padding: 0;
    max-width: 100%;}
.leaflet-top{bottom: 0.5rem;
    left: 1rem !important;
    align-items: end;
    top: auto !important;
    display: flex;
    flex-direction: column-reverse;}
.leaflet-marker-icon{transition: .3s all ease;}
.leaflet-tile-pane{opacity: .8;
    transition: .3s all ease;}
.map-container #map{background-color: black;
    height: 30vh;}
#map{height: calc(100vh - 8rem);
    background-color: black;}
#map .leaflet-bar a{color: var(--blue-color);
    margin: 0.5rem 0;
    display: flex;
    background-color: #ffffffe6;
    backdrop-filter: blur(10px);
    -webskit-backdrop-filter: blur(10px);
    align-items: center;
    transition: .3s all ease;
    border: 1px solid #e2e2e2;
    justify-content: center;}
.hamburger-submenu .nav-item .head{display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-direction: row;
    font-size: 1.4rem;
    padding-right: 2rem;}
.hamburger-submenu{transform: translateX(-100%);
    width: 26.2rem;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99;
    background-color: rgb(242, 242, 242);
    transition: all .3s ease-in-out;
    padding-bottom: 6rem;
    overflow: auto;}
.hamburger-submenu::before{position: absolute;
    top: 0rem;
    left: -1rem;
    width: 77%;
    opacity: 0.5;
    height: 100%;
    transform: scale(0.9);
    background-image: url("/themes/uoj_theme/media/pattern-main-menu.svg");
    pointer-events: none;
    content: "";}
.hamburger-submenu .header{padding: 2rem 0.5rem;
    display: flex;
    align-items: baseline;
    background-color: white;}
.hamburger-submenu .go-back .icon{transform: scaleX(0);}
.hamburger-submenu .header .icon{height: 2rem;
    width: 2rem;}
.hamburger-submenu .close-btn{display: block !important;
    top: 1.7rem !important;
    left: 1.7rem;}
.hamburger-submenu ul li{display: block;
    font-size: 1.4rem;
    padding: 0.8rem 0rem;
    border-bottom: 1px solid rgb(208, 208, 207);}
.main-menu .menu-content .menu-links ul li.link{font-size: 1.5rem;
    margin-bottom: 1.8rem;
    display: flex;
    align-items: baseline;
    justify-content: space-between;}
.main-menu .menu-content .menu-links ul li .icon{height: 2rem;
    width: 2rem;}
.main-menu .menu-content .menu-links ul .go-back .icon{transform: scaleX(1) !important;}
.main-menu-container .main-menu .close-btn,
.hamburger-submenu .close-btn{position: absolute;
    top: 1rem;
    right: -4rem;
    z-index: 99;
    opacity: 1;
    transition: all 0.3s ease 0s;
    cursor: pointer;
    display: none;
    height: 3rem;
    width: 3rem;}
.main-menu-container .main-menu .close-btn svg,
.hamburger-submenu .close-btn svg{height: 100%;
    width: 100%;
    object-fit: cover;}
.story-img img{object-fit: cover !important;}
.filters-container{display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-top: 2rem;
    margin-bottom: var(--spacing-3xl);}
.filters-container .filter-btn{display: flex;
    align-items: center;
    cursor: pointer;}
.filters-container .search-box{width: 100%;}
.bg-light-gray{background-color: var(--background-neutral-50);}
.card{border: none;
    border-radius: 0;
    width: 100%;}
.filter-section{display: flex;
    align-items: center;
    justify-content: center;
    padding: 0rem 1rem 1rem;
    width: 100%;}
.filter-section .filter-btn{color: var(--txt-color);
    padding: .7rem 2rem;
    cursor: pointer;
    margin: 0 .3rem;
    transition: all .3s ease-in-out;}
.filter-section .filter-btn.active{color: var(--blue-color);
    border-bottom: 2px solid var(--blue-color);}
.filter-section .filter-btn.active:hover{border-bottom: 2px solid var(--blue-color);}
.filter-section .filter-btn:hover{color: var(--blue-color-hover);}
.aca-filter .dropdown button.btn.btn-light.dropdown-toggle{border: none;
    padding: .8rem .75rem;}
.aca-filter .filter-dp{display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 2rem;}
.aca-filter .dp-container{display: none;
    margin-bottom: var(--spacing-3xl);}
.aca-filter .filter-dp .dropdown{width: 100%;
    margin: .5rem 0;
    position: relative;
    background-color: white;
    height: 40px;}
.aca-filter .filter-dp .dropdown button{border: 1px solid #9DA4AE !important;
height: 40px;}
.details-panel .spinner-border{position: absolute;
    right: 45%;
    top: 50%;
    border: .25em solid var(--blue-color);
    border-right-color: transparent;}
.particles-container .contents{display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: center;
    padding: 0px;
    border-radius: 0;
    border: 1px solid #fff;}
.particles-container .contents .logo{width: 15rem;
    height: auto;}
.particles-container .contents .logo img{width: 100%;
    height: 100%;}
.particles-container .contents .txt{margin: 2.5rem 0;}
.contents .txt span{font-size: 1.8rem;
    color: var(--navy-blue-color);
    text-align: center;
    z-index: 1;
    display: block;
    line-height: 1.4;}
.masonry-grid_item.column{width: 100%;}
.container{max-width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;}
.form-check-inline .form-check-input{margin-left: 0.3rem;}
.dropdown-menu.radio{right: 0px;
    left: auto !important;
    width: 100%;
    border: none;
    box-shadow: rgba(177, 177, 177, 0.4) 0px 10px 20px;
    margin: 0;
    padding: var(--spacing-md);
    max-height: 14rem;
    height: auto;
    overflow: auto;
    top: .5rem!important;
    border: 1px solid var(--border-neutral-primary);}
.details-panel img{border: none;
    border-radius: 0;
    max-height: 20rem;
    object-fit: scale-down;}
.details-panel.uni-pillars .side-panel{height: 100%;
    width: 100%;}
.filter-colors{display: none;}
.national-priorities .tiles-container{display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xl);}
.national-priorities .tiles-container .col-lg-3{padding:0;
    max-width: 24%;}
.updated-policies{background-color: var(--background-neutral-50);}
.research-priorities .uj-container,
.updated-policies .uj-container{width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-5xl);}
.updated-policies .news-advertisements{background-color: unset;
    padding-top: unset;
    padding-bottom: unset;}
.research-production{background-color: white;
    position: relative;
    padding: 3rem 1rem 2rem;}
.research-production::before{content: '';
    top: 0;
    right: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(/themes/uoj_theme/media/research-pat.png);
    background-size: cover;}
.research-production img{height: 100%;}
.main-menu-container .main-menu{width: 32rem;
    height: 100%;
    position: fixed;
    left: 0px;
    transform: translateX(-100%);
    top: 0px;
    background-color: rgb(242, 242, 242);
    z-index: 101;
    display: flex;
    transition: all 0.3s ease 0s;}
.main-menu-container .dimmer{background-color: rgba(0, 0, 0, 0.47);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: -1;
    opacity: 0;
    transition: all 0.3s ease 0s;
    pointer-events: none;}
.main-menu-container .main-menu .right-options{width: 22%;
    background-color: white;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    border-left: 1px solid rgb(208, 208, 207);
    position: relative;
    overflow: hidden;}
.main-menu-container .main-menu .logo{display: flex;
    justify-content: center;
    align-items: center;}
.main-menu-container .main-menu .devider{height: 40%;
    width: 1px;
    background-color: rgb(208, 208, 207);}
.main-menu-container .main-menu .social-icons{height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;}
.main-menu-container .main-menu .social-icons a{display: flex;
    justify-content: center;
    margin-bottom: 1rem;
    opacity: 1;
    transition: all 0.3s ease 0s;}
.main-menu-container .main-menu .social-icons a svg{width: 4rem;
    height: auto;}
.main-menu-container .main-menu .menu-content{display: flex;
    justify-content: space-around;
    width: 100%;
    height: 87%;
    flex-direction: column;
    align-items: center;
    align-self: center;
    position: relative;
    overflow: hidden;}
.main-menu-container .main-menu .menu-content::after{position: absolute;
    top: 0rem;
    left: -1rem;
    width: 77%;
    opacity: 0.5;
    height: 100%;
    transform: scale(0.9);
    background-image: url("/themes/uoj_theme/media/pattern-main-menu.svg");
    pointer-events: none;
    content: "";}
.main-menu-container .main-menu .close-btn:hover{opacity: 0.7;}
.main-menu .menu-content .main-logo{display: flex;}
.main-menu .menu-content .sign-in,
.hamburger-submenu .sign-in{width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 1.5rem;
    margin-top: 1.8rem;
    border-top: 1px solid rgba(192, 192, 192, 0.46);}
.close{opacity: 1;
    transition: all 0.3s ease 0s;}
.weather-side-menu{position: fixed;
    top: 0px;
    left: 0px;
    transform: translateX(-100%);
    z-index: 5;
    height: 100vh;
    width: 100vw;
    transition: all 0.3s ease 0s;
    display: none;
    background-color: rgb(242, 242, 242);}
.weather-side-menu .feed .location-detail{padding: 1.5rem 1rem;
    background-color: white;
    display: flex;
    justify-content: space-between;
    margin-top: 1.5rem;}
.weather-side-menu .feed .location-detail .status{align-items: center;
    display: flex;}
.weather-side-menu .feed .location-detail .condition{align-items: center;
    display: flex;
    flex-direction: row-reverse;}
.weather-side-menu .feed .location-detail .condition .low{padding-left: 1rem;
    border-left: 1px solid rgb(221, 221, 221);
    font-size: 2rem;
    font-family: var(--IBM-sb);
    display: flex;
    align-items: center;
    font-size: 1.5rem;}
.weather-side-menu .feed .location-detail .condition .high{margin-right: 1rem;
    font-size: 1.5rem;
    font-family: var(--IBM-sb);
    display: flex;
    align-items: center;}
.notifications-side-menu .menu-container{background-color: rgb(244, 244, 244);
    width: 100vw;
    float: left;
    height: 100%;
    overflow-y: auto;}
.notifications-side-menu .notifications{display: flex;
    padding: 2rem 1rem;
    width: 100%;
    flex-direction: column;
    color: rgb(88, 88, 88);}
.notifications-side-menu .notifications .item .content{display: flex;
    flex-direction: row;
    margin-top: 1rem;
    background-color: white;
    width: 100%;
    padding: 1.2rem 2rem 1.2rem;
    justify-content: space-between;
    position: relative;
    align-items: center;}
.notifications-side-menu .notifications .item .content::after{position: absolute;
    top: 0px;
    right: 0px;
    content: "";
    width: 0.7rem;
    height: 100%;
    background-color: var(--button-background-primary-default);}
.side-menu,
.details-panel{position: fixed;
    top: 0px;
    left: 0px;
    transform: translateX(-100%);
    z-index: 1001;
    height: 100vh;
    transition: all 0.3s ease 0s;
    display: none;}
.polls-side-menu{display: none;}
.polls-side-menu .menu-container{background-color: rgb(244, 244, 244);
    width: 100vw;
    float: left;
    height: 100vh;
    overflow: auto;}
.polls-side-menu .answers-section{margin: 3rem 1.5rem;
    background-color: white;
    padding: 2rem 0px;
    flex-direction: column;
    transition: all 0.3s ease 0s;
    transform: translateX(0rem);
    justify-content: center;
    animation: 0.3s ease 0s 1 normal none running poll-answers-reveal;}
.twitter-side-menu .twitter-timeline-container{overflow: scroll;
    display: flex;
    width: 100%;}
.twitter-side-menu .twitter-timeline-container .main-jeddah,
.twitter-side-menu .twitter-timeline-container .jeddah-news{display: none;}
.twitter-side-menu .twitter-timeline-container .main-jeddah.active,
.twitter-side-menu .twitter-timeline-container .jeddah-news.active{display: block;
    width: 100%;}
.twitter-side-menu .accounts-handler{width: 15%;
    background-color: rgb(244, 244, 244);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;}
.twitter-side-menu .accounts-handler .account{width: 3rem;
    height: 3rem;
    background-color: white;
    border-radius: 50%;
    margin-top: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid silver;
    transition: all 0.3s ease 0s;
    cursor: pointer;}
.twitter-side-menu .accounts-handler .account img{width: 50%;
    height: 50%;}
.sidebuttons{left: 0px;
    top: 60%;
    z-index: 97;
    position: fixed;
    transition: all 0.3s ease 0s;}
.sidebuttons>div{cursor: pointer;}
.uoj-events{transform: scale(1) translateX(0px);
    transition: all 0.3s ease 0s;
    background-color: var(--button-background-primary-default);
    border-top-right-radius: var(--radius-lg);
    border-bottom-right-radius: var(--radius-lg);
    padding: var(--spacing-3xl) var(--spacing-xl);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: var(--spacing-lg);
    white-space: nowrap;
    min-width: fit-content;}
html .uoj-events svg.close{display: none;}
.sidebuttons>.other-toggles>div span{writing-mode: vertical-rl;
    transform: rotate(-180deg);
    transform-origin: center;
    font-size: var(--text-md);
    font-family: var(--IBM-sb);
    color: white;}
.sidebuttons>div.twitter-side:hover,
.sidebuttons>.other-toggles>div:hover{background-color: var(--button-background-primary-hovered);}
.twitter-side-menu button.close{right: 9px;
    top: 9rem;
    position: absolute;}
.uoj-notifcations{display: none !important;}
#block-universitystatistics{position: relative;}
.header .dimmer-mobile{position: fixed;
    top: 0px;
    left: 0px;
    height: 100vh;
    width: 100vw;
    z-index: 98;
    background-color: rgba(0, 0, 0, 0.6);
    display: none;}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{border-radius: 100%;
    opacity: 1 !important;
    position: relative !important;
    width: 12px;
    height: 12px;
    background-color: var(--background-neutral-200);
    margin: var(--spacing-lg) var(--spacing-xs)!important;}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet-active{background-color: var(--stepper-button-completed) !important;}
.about-swiper .swiper-pagination-bullet.swiper-pagination-bullet-active::after{background-color: var(--navy-blue-color);}
.about-swiper-section .about-swiper .swiper-wrapper{margin-bottom: var(--spacing-3xl);
    height: 17rem!important;}
.main-menu .menu-content .menu-links ul li .icon{transform: scaleX(-1) !important;}
.available-programs .swiper-pagination-bullet.swiper-pagination-bullet-active::after,
.competitions .swiper-pagination-bullet.swiper-pagination-bullet-active::after{position: absolute;
    top: 0.42rem;
    left: 0.4rem;
    background-color: white;}
.news-advertisements{width: 100%;}
h1.title{color: var(--text-default);
    font-family: var(--IBM-b);
    font-size: var(--display-sm);
    position: relative;}
.proxies .uj-card h3,
.proxies .uj-card p{text-align:center;}
.proxies .uj-card p{height:48px;}
.news-advertisements .items{display: flex;
    width: 100%;
    flex-direction: column;
    gap:var(--spacing-xl);}
.news-advertisements .row .col-lg-4{padding:0;
    max-width:32%;}
.updated-policies .items{width: 100% !important;}
.navbar .navbar-brand{display: flex;
    margin: 0;
    padding: 0;
    align-items: center;}
.navbar a.nav-link,
.navbar a.dropdown-toggle{transition: all 0.3s ease 0s;
    text-overflow: ellipsis;}
.static-slider .swiper-button-prev,
.static-slider .swiper-button-next{height: 48px;
    width: 48px;
    border-radius: var(--radius-full);
    border: 1px solid var(--border-neutral-primary);
    display: none;
    scale: -1;
    background-color: white;}
.static-slider .swiper-button-prev::after,
.static-slider .swiper-button-next::after{content: none;
    display: none;}
.leaflet-control-zoom .leaflet-control-zoom-in,
.leaflet-control-zoom .leaflet-control-zoom-out{width: 2.6rem !important;
    height: 2.6rem !important;
    display: flex;
    align-items: center;
    justify-content: center;}
.leaflet-control-zoom .leaflet-control-zoom-in span,
.leaflet-control-zoom .leaflet-control-zoom-out span{display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.3rem !Important;
    line-height: 0px;
    text-indent: 0;}
.tab-links a{color: var(--black-color);
    text-decoration: none;
    transition: all 0.3s ease 0s;}
.archiveNewsUrl{gap: var(--spacing-sm);}
.tab-links li{margin: 0px;
    float: right;
    list-style: none;
    color: rgb(130, 130, 130);
    font-size: 1rem;}
.tab-links li a.active,
li a.active:hover,
.tab-links li a.active,
li a.active:hover{color: var(--blue-color);}
.news-ads{display: flex;
    flex-direction: column;
    gap: var(--spacing-5xl);}
.news-ads .load-more{margin:auto;
    display:flex;}
.search .modal-dialog.modal-dialog-centered{max-width: 100%;
    width: 100vw;
    height: 100vh;
    padding: 0px;
    margin: 0px;
    flex-direction: column;}
.search .modal-dialog .modal-content::after{position: absolute;
    top: 0px;
    right: -27rem;
    content: "";
    width: 100%;
    height: 65%;
    background-image: url("/themes/uoj_theme/media/Repeat Grid 3.png");
    pointer-events: none;}
.search .modal-dialog .modal-content{border: none;
    width: 100%;
    height: 100%;
    position: relative;}
.search .modal-dialog .modal-content .logo{z-index: 10;
    height: 8rem;
    width: 8rem;
    margin-bottom: 1rem;}
.search .modal-dialog .modal-content .logo img{height: 100%;
    width: 100%;}
.search .modal-dialog .modal-body{width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0px;
    margin: 0px;
    background-color: var(--background);}
.search button.close{position: absolute;
    left: 1rem;
    top: 1rem;
    border-radius: 50%;
    z-index: 1;
    height: 3rem;
    width: 3rem;}
.search .search-btn{color: white;
    border: none;
    display: flex;
    align-items: center;
    height: 3rem;
    font-size: 1rem;
    font-family: var(--IBM-sb);
    margin: 0px;
    padding: 1.2rem;
    border-radius: 0px;
    transition: all 0.3s ease 0s;
    cursor: pointer;
    background-color: var(--blue-color);
    position: relative;
    width: 100%;
    justify-content: center;}
.associates-search .search-btn label{display: none;}
.right-panel{background-image: url("/themes/uoj_theme/media/pattern-main-menu.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 20%;
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    top: 5rem;
    left: 0px;
    opacity: 0.6;}
.search-footer{background-image: url("/themes/uoj_theme/media/Intersection 2.jpg");
    width: 100%;
    position: relative;
    display: flex;
    align-items: start;
    flex-direction: column;
    padding: 1.5rem 0px;
    overflow: hidden;
    justify-content: start;}
.search-footer::after{position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(153, 153, 153, 0);
    content: "";
    pointer-events: none;}
.search-footer .link{font-size: var(--text-md);
    font-family: var(--IBM-sb);
    display: flex;
    align-items: center;
    color: var(--text-default);
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease 0s;
    width: fit-content;}
.search-footer .link:hover{color: var(--link-primary-hovered);}
.search-footer .link.no-click{cursor: no-drop !important;}
.search-footer .link svg{width: 1rem;
    height: 1rem;
    margin-left: .7rem;
    transition: all 0.3s ease 0s;}
.std{font-size: 1.2rem;
    padding: 2rem 2rem;
    font-family: var(--IBM-sb);
    position: relative;
    min-width: max-content;}
.search button svg{height: 100%;
    width: 100%;}
.dropdown-menu.radio .dropdown-item{position: relative;
    overflow: hidden;
    cursor: pointer;
    padding: .3rem 1rem;
    padding: var(--spacing-md);
    border-radius: var(--spacing-sm);}
.dropdown-menu.radio input{visibility: hidden;
    position: absolute;
    left: -30px;}
.dropdown-menu.radio i{font-weight: normal;
    font-style: normal;
    display: block;
    text-align: right;}
.search input.form-control{border: none;
    border-radius: 0px;
    font-size: .9rem;
    height: 100%;
    padding: 0px 1rem;}
.search .input-group.mb-3{display: flex;
    align-items: flex-start;
    padding: 0px;
    margin: 3rem 0px 0px;
    height: 3rem;
    width: 24rem !important;
    z-index: 90;}
.search .input-group.mb-3{display: flex;
    align-items: flex-start;
    padding: 0px;
    margin: 3rem 0px 0px;
    height: auto !important;
    width: 24rem !important;
    z-index: 90;
    flex-direction: column;}
.search .input-group.mb-3,
.associates-search{display: flex;
    padding: 0px;
    height: 40px;
    width: 100%;
    gap: var(--spacing-3xl);}
.search .dropdown{border-radius: 0px;
    background-color: white;
    height: 3rem;
    margin: .5rem 0;
    width: 100%;
    display: flex;
    transition: all 0.3s ease 0s;}
.search .modal-dialog .input-group .form-control{padding-right: 3rem;
    border: none;
    outline: none;
    height: 3rem;
    width: 100%;}
.associates-search .form-control{height: 100%;
    border: 1px solid #9DA4AE;
    border-radius: var(--radius-sm)!important;
    height: 40px;}
.dropdown button.btn.btn-light.dropdown-toggle:focus{box-shadow: none;
    background-color: unset;
    border-top: none;
    border-bottom: none;}
.dropdown button.btn.btn-light.dropdown-toggle{background-color: white;
    height: 100%;
    min-width: 100%;
    font-size: 1rem;
    align-items: center;
    display: flex;
    border-radius: var(--radius-sm);
    color: var(
    --txt-color);
    padding: 0 1rem;
    position: relative;}
.dropdown button.btn.btn-light.dropdown-toggle::after{content:""!important;
    position:absolute;
    height:2px;
    width:100%;
    background-color:#000;
    border: none;
    bottom:0;
    right:0;
    scale:0;
    transition: all .6s ease-in-out;
    opacity:1;}
.dropdown button.btn.btn-light.dropdown-toggle::before{position: absolute;
    top: auto;
    left: 1rem;
    content: '';
    width: 10px;
    height: 10px;
    background: url('data:image/svg+xml,<svg width="10" height="10" viewBox="0 0 1024 1024" class="icon" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M903.232 256l56.768 50.432L512 768 64 306.432 120.768 256 512 659.072z" fill="%23000000"></path></svg>');}
.search .erase{position: absolute;
    right: 0rem;
    border: none;
    height: auto;
    width: 3rem;
    top: .5rem;
    border-radius: 100%;
    outline: none;
    text-align: center;
    font-weight: bold;
    padding: 2px;
    z-index: 3;
    background-color: transparent;}
.search .erase:hover svg{opacity: 0.7;}
.search .erase svg{width: 50%;
    height: 50%;
    opacity: 1;
    transition: all 0.3s ease 0s;}
.uoj-breadcrumb{display: none;
    align-items: center;}
.uoj-breadcrumb .page a{color: var(--link-neutral);
    font-size: var(--text-sm);
    transition: all 0.3s ease 0s;}
.uoj-breadcrumb .page:last-child a{color: var(--text-default-disabled);}
.uoj-breadcrumb .page a:hover{text-decoration: none;
    color: var(--link-neutral-hovered);}
.uoj-breadcrumb .icon{display: flex;
    margin: 0px 0.5rem;
    align-items: center;
    width: 0.5rem;}
.news-content .news-thumbnail img,
.news-thumbnail img{height: 28rem;
    width: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: var(--radius-lg);}
label{margin-bottom: unset;}
h1.section-title{font-family: var(--IBM-b);}
.our-story h1.section-title,
.bar-chart h1.section-title{padding: 0;}
.bar-chart h1.section-title::before{display: none;}
.about-us .description,
.contact-us-container .description,
.departments .description,
.open-data .description,
.bar-chart .content .description,
.future-leader .description,
.safe-speech .description,
.f-services .description,
.all-news-container .description{font-size: var(--text-sm);
    color: var(--text-default);
    line-height: 24px;
    width: 100%;}
.values .description{font-size: var(--text-md);
    line-height: 24px;
    color: var(--text-default);}
.uni-values .num{width: 3rem;
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;}
.all-news-container .topic{display: none;}
.all-news-container .topic::before{top: -0.2rem;
    right: 0px;
    position: relative;
    content: "";
    display: inline-block;
    margin: 0px 0px 0px 0.5rem;
    transition: all 0.2s ease 0s;
    height: 1px;
    width: 2rem;
    background-color: var(--blue-color);}
.deco2{background: linear-gradient(to left, transparent 0%, rgba(255, 255, 255, 1) 50%);
    height: 100%;
    width: 3rem;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 2;
    display: none;}
.faqs .faqs-search{width: 100%;
    background-color: rgb(240, 240, 240);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 2rem;}
.faqs .faqs-search input{width: 90%;
    padding: 2rem 1rem;
    border: none;
    font-size: 1rem;
    background: url("/themes/uoj_theme/media/Icon feather-search-alt.svg") 1rem center / 1.6rem no-repeat white;}
.faqs .faq-group{height: auto;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    column-gap: var(--spacing-xl);}
.faqs .faq-group .faq-item{height: fit-content;
    width: 100%;
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--border-neutral-primary);
    transition: all 0.3s ease;}
.faqs .faq-group .faq-item .expand{display: flex;
    align-items: center;
    transform: rotate(0);
    transition: all 0.3s ease 0s;}
.faqs .faq-group .faq-item .header{display: flex;
    justify-content: space-between;
    cursor: pointer;
    align-items: center;
    padding:var(--spacing-xl);
    gap:var(--spacing-xl);
    margin: 0;}
.faqs .faq-group .faq-item .header:hover,
.faqs .faq-group .faq-item .header[aria-expanded="true"]:hover,
.faqs .faq-group .faq-item .faq-subheader:hover{background-color:var(--button-background-neutral-hovered);}
.faqs .faq-group .faq-item .header .faq-title,
.faqs .faq-group .faq-item .header h6{font-size: var(--text-md);
    color: var(--text-display);
    font-family: var(--IBM-sb);}
.faqs .faq-group .faq-item .faq-details{padding: 0;
    font-family: var(--IBM-regular);
    color: var(--text-primary-paragraph);
    position: relative;
    font-size: var(--text-md);
    line-height: 24px;
    width: 100%;
    padding-top: var(--spacing-md);
    padding-inline-start: var(--spacing-xl);
    padding-inline-end: var(--spacing-6xl);
    padding-bottom: var(--spacing-xl);}
.faqs .faq-group .faq-item .collapse .toggle{height: fit-content;
    transition: all 0.3s ease 0s;}
.faqs .be-in-contact a:hover{text-decoration: none;}
.faqs .be-in-contact{display: flex;
    flex-direction: column;
    gap: var(--spacing-xl);
    padding: 0;}
.faqs .be-in-contact .main-desc{font-size: var(--text-lg);
    font-family: var(--IBM-sb);}
.faqs .be-in-contact .secondary-desc{font-size: var(--text-md);
    color: var(--text-default);
    line-height: 24px;
    gap: var(--spacing-md);}
.faqs .be-in-contact .secondary-desc a{color: var(--link-primary);
    transition: all 0.3s ease 0s;}
.faqs .be-in-contact .secondary-desc a:hover{color: var(--link-primary-hover);}
.faqs .be-in-contact .main-desc span>a{transition: all 0.3s ease 0s;
    font-family: var(--IBM-sb);}
.contact-us{background-image: url("/themes/uoj_theme/media/Repeat Grid 9.png");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center top;}
.contact-us .services{display: flex;
    flex-wrap: wrap;
    align-items: flex-start;}
.contact-us .services .service{width: fit-content;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 1rem 0;
    padding: 0 0 2rem 0;
    border-bottom: 1px solid #dfdfdf}
.contact-us .services .service:last-child{border-bottom: none;
    padding: 0;}
.contact-us .services .service:nth-child(3){border-left: none;}
.contact-us .services .service .description{color: var(--text-default);
    width: 88%;
    line-height: 24px;
    font-size: var(--text-md);
    text-align: center;}
.contact-us .services .service a.start{color: var(--link-primary);
    text-decoration: underline;
    cursor: pointer;
    margin-top: 1rem;
    transition: all 0.3s ease 0s;}
.contact-us .contact-infos{background-color: rgb(250, 250, 250);
    width: fit-content;
    display: flex;
    flex-wrap: wrap;
    color: rgb(104, 104, 104);
    font-size: 1.1rem;
    padding-bottom: 0;
    padding-top: 0;
    gap: var(--spacing-md);}
.contact-us .contact-infos .phone,
.contact-us .contact-infos .email,
.contact-us .contact-infos .fax{display: flex;
    flex-direction: row-reverse;
    align-items: center;
    width: 100%;
    font-size: var(--text-md);
    color: var(--text-default);
    justify-content: flex-end;
    background-color: white;
    padding: 1rem 1.5rem;}
.contact-us .contact-infos .email,
.contact-us .contact-infos .phone{border-bottom: 1px solid rgb(213, 213, 213);}
.contact-us .contact-infos .phone img,
.contact-us .contact-infos .email img,
.contact-us .contact-infos .fax img{margin-left: 1rem;
    height: 1.5rem;}
.contact-us .contact-infos .fax{position: relative;
    padding: 0.85rem 1.9rem;}
.contact-us .contact-infos .phone span,
.contact-us .contact-infos .fax span{direction: ltr;}
.contact-us .map{background-color: rgb(227, 227, 227);
    height: 55vh;
    width: 100%;
    z-index: 1;}
.contact-us .map-container{position: relative;
    padding-top: 0;
    padding-bottom: 0;}
.contact-us .map-container .zoom-controls{position: absolute;
    bottom: 5rem;
    right: 2rem;
    z-index: 2;}
.contact-us .map-container .zoom-controls .zoom-in,
.contact-us .map-container .zoom-controls .zoom-out{width: 2.5rem;
    height: 2.5rem;
    background-color: white;
    border: 1px solid rgba(192, 192, 192, 0.42);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.3s ease 0s;
    cursor: pointer;}
.contact-us .map-container .zoom-controls .zoom-in{border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;}
.contact-us .map-container .zoom-controls .zoom-out{border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;}
.contact-us .map-container .zoom-controls .zoom-in:hover,
.contact-us .map-container .zoom-controls .zoom-out:hover{background-color: rgb(226, 226, 226);}
.story .uj-container{display: flex;
    flex-direction: column-reverse;
    overflow: hidden;
    gap: var(--spacing-8xl);}
.story .uj-btn{width: fit-content;}
.story .image-container{height: 15rem;
    position: relative;
    margin-bottom: 2rem;}
.uni-values .column{display: flex;
    width: 100%;
    justify-content: space-around;}
.uni-values .column .val-content .content{color: var(--text-default);}
.uni-values .column .val-content .num{background-color: var(--border-primary);
    color: white;
    padding: 0rem 0.5rem;
    border-right: 10px solid var(--border-success);
    margin-left: 1rem;
    border-radius: var(--radius-md);}
.story .image-container img{height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: top;}
.story .image-container video{height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: var(--radius-lg);}
.all-news-container .topic::before{top: -0.2rem;
    right: 0px;
    position: relative;
    content: "";
    display: inline-block;
    margin: 0px 0px 0px 0.5rem;
    transition: all 0.2s ease 0s;
    height: 1px;
    width: 2rem;
    background-color: var(--blue-color);}
.all-news-container .card .img-container::after{background-color: rgba(0, 0, 0, 0.5);}
.our-story .subtitle{font-size: var(--text-lg);
    font-family: var(--IBM-sb);
    margin: 0;}
.our-story .description{font-size: var(--text-md);
    color: var(--text-default);
    line-height: 24px;
    text-align: justify;}
.show-button-true .our-story .description{margin-bottom:var(--spacing-3xl);}
.about-swiper{overflow: hidden;}
.about-swiper .swiper-wrapper .swiper-slide{display: flex;
    flex-direction: column;
    height: fit-content;
    gap: var(--spacing-xl);}
.particles-container{height: 62vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid white;}
.goals .card-text,
.goals .card-title,
.volunteering .volunteer-tiles .card .card-title{width: 95%;
    font-size: var(--text-lg);
    font-family: var(--ibmbold);}
.volunteering .tab-pane{width: 100% !important;}
.goals-container{background-color: var(--background-body);
    width: 100%;
    height: auto;
    background-size: cover;}
.goals-container .uj-card{gap:var(--spacing-xl);}
.goals li,
.volunteering .volunteer-tiles .card .card-text li,
.Deanship-agencies .agencies-tiles .card .card-text li{line-height: 24px;
    font-size: var(--text-md);
    color: var(--text-display);
    margin-inline-start: var(--spacing-md);
    list-style-type: disc;
    position: relative;
    width: fit-content;
    text-align: start;
    font-family: var(--ibmregular);}
.goals li:last-child,
.volunteering .volunteer-tiles .card .card-body .card-text li:last-child,
.Deanship-agencies .agencies-tiles .card .card-body .card-text li:last-child{margin-bottom: 0;}
.values{background-color: white;}
.values .uj-container{display: flex;
    flex-direction: column;
    gap: var(--spacing-3xl);}
.uni-values{padding: 2.5rem 0;
    font-size: 1.2rem;}
.uni-values .column .val-content{display: flex;
    flex-direction: row;
    align-items: center;
    font-size: var(--display-md);
    margin-bottom: 1.5rem;
    min-width: 9rem;}
.about-swiper{height: fit-content !important;
    z-index: 0;
    position: relative !important;}
.about-swiper .swiper-pagination{position:relative;bottom: unset!important;top:unset;display: flex;align-items: center;justify-content: center;}
.goals .card-text ul,
.volunteering .volunteer-tiles .card .card-text ul{display: flex;
    flex-direction: column;
    gap: var(--spacing-xl);}
.about-swiper-section{position: relative;
    background-color: var(--background-neutral-50);}
html:has(.open-data.page-header-section) .about-swiper-section{background-color:white;}
.details-panel{transform: translateX(-100%);
    width: 100%;
    height: 100vh;
    background-color: white;}
.details-panel .side-panel{overflow-y: auto;}
.form-actions.js-form-wrapper.form-wrapper{width: 100%;}
.details-panel .description{font-size: var(--text-md);
    padding: 0rem 2rem;
    line-height: 24px;
    text-wrap: wrap;
    word-wrap: break-word;}
.details-panel .close{position: absolute;
    top: 1.5rem;
    z-index: 99;
    left: 1.5rem;
    background-color: rgba(0, 0, 0, .5);
    border-radius: 50%;}
.details-panel .accordion-group .accordion{display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 1.2rem 2rem;
    border-top: 1px solid #e5e5e5;
    margin: 0;}
.details-panel .tabs{padding: 0 1rem;}
.details-panel .accordion-group .accordion svg{border-radius: 100%;
    background-color: var(--blue-color);
    stroke-width: 3;
    transition: all 0.3s ease-in-out 0s;}
.details-panel .accordion-group .accordion svg{transform: rotate(-90deg);}
.departments .cards-section,
.f-services .cards-section{display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    gap: var(--spacing-xl);}
.f-services .cards-section .col-lg-4{padding: 0 !important;}
.departments .cards-section a,
.f-services .cards-section a{width: 40px;
    padding: 0;}
.service.col-md-4 .image{margin-bottom: .8rem;
    width: 8rem;}
.service.col-md-4 .image img{height: 100%;
    width: 100%;
    object-fit: scale-down;}
#chartdiv{width: 100%;
    height: 700px;}
#chart_div{width: 100%;
    height: 300px;}
#chart_div svg>rect{fill: transparent}
.bar-chart{display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;}
.bar-chart h1.section-title,
.bar-chart p.description{text-align: center;}
.events-side-menu .close{position: absolute;
    top: 1.7rem;
    left: 1.7rem;}
.events-side-menu .menu-container{background-color: #F4F4F4;
    width: 100vw;
    float: left;
    height: 100%;
    overflow-y: auto;}
.show-calendar-page a{display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-neutral-primary);
    padding: var(--spacing-0) var(--buttons-lg-padding);
    border-radius: var(--radius-md);
    margin-top: var(--spacing-20);
    height: 50px;
    color: var(--text-default);
    font-weight: var(--IBM-sb);
    width: 100%;}
.events-side-menu .events{display: flex;
    padding: 2rem 1rem;
    width: 100%;
    flex-direction: column;
    color: rgb(88, 88, 88);}
.events-side-menu .events .item{width: 100%;
    height: 100%;
    margin-top: 1.5rem;
    border: 1px solid var(--border-neutral-primary);
    background-color: var(--background-card);
    padding: var(--spacing-xl);
    border-radius: var(--radius-xl);}
.events-side-menu .events .item .event-date{display: flex;
    font-size: 2rem;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    padding: var(--spacing-lg);
    color: var(--text-primary);
    font-family: var(--IBM-b);
    border: 1px solid var(--border-neutral-primary);
    border-radius: var(--radius-md);
    background: linear-gradient(211deg, rgba(217, 217, 217, 0) 1.37%, rgba(217, 217, 217, 0.2) 96.69%);}
.events-side-menu .events .item .content{display: flex;
    align-items: center;
    width: 100%;
    position: relative;
    gap: var(--card-lg-gap);}
.events-side-menu .events .item .content .detail{display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: var(--spacing-xl);
    color: rgb(155, 155, 155);
    align-items: flex-start;}
.swiper-slide .gridItems{position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: -webkit-fill-available;
    padding-top: 2rem;
    padding-bottom: 2rem;}
.swiper-slide .grid-item{width: 100%;}
.available-programs{background-color: var(--background-neutral-50);
    position: relative;
    overflow: hidden;}
.available-prog-swiper{height: 100% !important;}
.accordion{margin: 50px auto;}
.international-students{position: relative;
    height: 59.5vh;}
.international-students .card-img-overlay{top:50%;
    transform:translateY(-50%);}
.international-students .card-img-overlay .header .title{font-size: var(--text-lg);
    font-family: var(--IBM-b);
    color: var(--text-default);}
.international-students .card-img-overlay .body{font-size: var(--text-md);
    color: var(--text-default);
    font-family: var(--ibmregular);}
.international-students .card-img-overlay .txt-container{max-height: 14rem;
    overflow-y: auto;}
.international-students .card-img-overlay .footer a{background-color: var(--button-background-primary-default);
    color: white;
    width: fit-content;
    padding: var(--spacing-md) var(--spacing-xl);
    border-radius: var(--radius-sm);
    cursor: pointer;}
.international-students .card-img-overlay .footer a:hover{background-color: var(--button-background-primary-hovered);}
.head{font-size: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;}
.tabular-view .nav li:first-child a.nav-link::before{height: 1.6rem;
    width: 1.5rem;
    background-repeat: no-repeat;
    background-size: 100%;
    margin-left: 0.7rem;}
.tabular-view .nav li:nth-child(2) a.nav-link::before{background-image: url("/themes/uoj_theme/media/ic-security-unsecured.svg");
    height: 1.6rem;
    width: 1.5rem;
    background-repeat: no-repeat;
    background-size: 100%;
    margin-left: 0.7rem;}
.form-check-label{margin: 1rem 0rem 1rem 3rem;}
.form-check-label input{position: relative;
    margin-left: 1rem;}
::-webkit-input-placeholder{color: #999;}
.proxies .uj-container,
.f-services.talented-people,
.established-initiatives .uj-container{display:flex;
    flex-direction: column;
    gap:var(--spacing-3xl);}
.js-form-item.js-form-type-radio{box-sizing: border-box;
    background: #ffffff;
    color: #222;
    height: auto;
    width: 50%;
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    align-items: center;}
.js-form-item.js-form-type-radio *{box-sizing: border-box;}
.js-form-item.js-form-type-radio input.form-radio{appearance: none;
    background-color: #ffffff;
    width: 22px;
    height: 22px;
    border: 1px solid #cccfdb;
    margin: 0;
    border-radius: 50%;
    display: grid;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    cursor: pointer;}
.js-form-item.js-form-type-radio input.form-radio::before{content: "";
    width: 7.5px;
    height: 7.5px;
    border-radius: 50%;
    transform: scale(0);
    transition: 0.3s transform ease-in-out;
    box-shadow: inset 6px 6px #ffffff;}
.js-form-item.js-form-type-radio input.form-radio:checked::before{transform: scale(1);}
.js-form-item.js-form-type-radio label{cursor: pointer;
    padding: 6px 8px;}
.care-tiles .col-md-6{padding: 0;
    max-width: 32%;}
.quick-links{display: flex;
    overflow-x: auto;
    background-image: none;
    position: relative !important;}
.quick-links .swiper-slide{width: fit-content;}
.quick-links .link{display: flex;
    align-items: center;
    margin: .5rem 0;}
.quick-links .logo{position: absolute;
    left: 2rem;
    top: 1.5rem;
    width: 4rem;
    justify-content: center;
    display: none;}
.quick-links .link svg ellipse{transition: .3s all ease;}
.quick-links .link:nth-child(2n+1) svg ellipse{fill: var(--border-primary);}
.quick-links .link:hover svg ellipse{fill: var(--border-primary);}
.college .college-annual-report .item{display: flex;
    flex-direction: column;
    padding-bottom: var(--spacing-3xl);
    width: 100%;}
.college .college-annual-report .item .item-desc{display: flex;
    align-items: center;
    line-height: 2;
    gap: var(--spacing-md);}
.college .college-annual-report .item .item-desc .icon{display: none;}
.college .college-annual-report .item .item-desc .icon svg{width: 2rem;
    height: 2rem;
    filter: brightness(0) saturate(100%) invert(43%) sepia(89%) saturate(333%) hue-rotate(101deg) brightness(80%) contrast(100%);}
.steps-app{padding-top: 0;
    padding-bottom: 0;
    background-color: #ECECEC;}
.steps{display: flex;
    flex-direction: column;
    position: relative;
    padding: 2rem 0 0;
    margin: 0rem 0;}
.step{display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    margin-bottom: 1rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid #dfdfdf;}
.step:nth-child(even) .instruction{content: "";
    width: 100%;}
.instruction.no-date{font-weight: 600;}
.step:nth-child(even) .instruction.no-date{bottom: 98%;}
.step .instruction{min-height: fit-content;
    content: '';
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background-color: white;
    padding: var(--spacing-xl);
    gap: var(--spacing-lg);
    flex-direction: column;
    border-radius: var(--radius-md);}
.step .start-date,
.step .end-date{display: flex;
    justify-content: start;
    background-color: var(--tag-background-neutral-light);
    gap: var(--spacing-xs);
    padding: var(--spacing-0) var(--spacing-md);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-neutral-secondary);}
.step .from,
.step .to{font-size: var(--text-xs);}
.step .date{font-size: var(--text-xs);}
.step .schedule{display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-md);}
.step .instruction span{text-align: center;
    font-size: var(--text-md);
    font-family: var(--IBM-sb);}
.university-services .tab-pane{width: 100% !important;
    background-color: white;}
.nav-tabs .nav-item .nav-link,
.nav-tabs .nav-link.active,
.nav-tabs .nav-link:hover{border-radius: 0;
    transition: all .3s ease-in-out;}
.nav-tabs .nav-link.active,
.nav-tabs .nav-link{color: var(--text-default);
    font-size: var(--text-sm);
    padding: var(--spacing-xl);
    display: flex;
    width: fit-content;}
.pattern-before svg{height: 100%;
    width: 100%;
    position: absolute;
    right: 0;
    display: none;}
.volunteering .uj-container{display: flex;
    flex-direction: column;
    gap: var(--spacing-4xl);}
.volunteering .uj-container .uj-card{gap:var(--spacing-xl);
    height: fit-content;}
.volunteering .uj-container:empty{display:none;}
.volunteering .nav.nav-tabs{justify-content: center;}
.volunteering .volunteer-tiles,
.deanship-agencies .agencies-tiles{display: flex;
    flex-wrap: wrap;
    padding: 0;
    gap: var(--spacing-xl);}
.volunteering .volunteer-tiles .col-lg-6, 
.deanship-agencies .agencies-tiles .col-lg-6{padding:0!important;
    max-width:49%;}
.details-panel .apply-link{display: flex;
    align-items: center;
    padding: 0 1rem;
    color: var(--blue-color);}
.life-jeddah{margin-top: 2rem;
    background-color: var(--background-neutral-50);}
.life-jeddah .uj-container{display: flex;
    flex-direction: column;
    gap: var(--spacing-3xl);}
.life-jeddah .tiles-container{display: flex;
    flex-wrap: wrap;
    margin: 0 -15px;}
.tabular-view .tab-content .tab-pane .d-flex{flex-direction: column;}
.tab-pane .row{flex-direction: column;}
#chartdiv{height: 350px !important;}
fieldset legend{margin-bottom: 1.5rem;
    font-size: 1.1rem;
    line-height: 2;}
.map{width: 100%;
    margin: 0 auto;
    background-color: rgb(227, 227, 227);
    height: 100vh;
    z-index: 1;
    position: relative;}
.supreme-president .uj-container{display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;}
.uj-card-footer .social-icons{display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-xl);
    width: 100%;
    background-color: #fff;}
.uj-card .social-icons .icon{display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-neutral-primary);
    background-color: transparent;
    padding: var(--spacing-none) var(--buttons-md-padding);
    height: 40px;
    width: 40px;
    font-size: 1.4rem;}
.supreme-president .uj-card .social-icons .icon i::before,
.proxies .uj-card .social-icons .icon i::before{color:var(--icon-default);}
.supreme-president .president-informations::after{content: '';
    position: absolute;
    top: -5rem;
    left: 0rem;
    background-image: url('/themes/uoj_theme/media/Path\ 1702.png');
    height: 5rem;
    width: 5rem;
    background-size: 100%;
    background-position: top;
    background-repeat: no-repeat;}
.supreme-president .president-informations .president-name,
.agent-cv .agent-name{font-size: var(--display-sm);
    font-family: var(--IBM-b);
    text-align: start;}
.supreme-president .president-informations .position,
.agent-cv .position{color: var(--text-primary-sa-flag);
    font-size: var(--text-md);
    text-align: start;
    margin: var(--spacing-md) 0 var(--spacing-xl);}
.supreme-president .president-informations .description p{text-align: center;}
.supreme-president .president-informations .buttons-container{display: flex;
    flex-direction: column;
    margin-top: 2rem;
    gap: var(--spacing-xl);}
.proxies .cards-container,
.advisors .cards-container{display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--spacing-xl);}
.proxies .cards-container .uj-card .card-info,
.advisors .cards-container .uj-card .card-info{display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0;
    gap: var(--card-lg-gap);}
.proxies .cards-container .uj-card .card-info > div:has(.card-title), 
.advisors .cards-container .uj-card .card-info > div:has(.card-title){display:flex;
    flex-direction: column;
    gap:var(--spacing-md);}
.uj-card .social-icons{display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin: 0 auto;}
.agent-cv .uj-card .social-icons i::before,
.advisors .uj-card .social-icons i::before{color:var(--icon-default);}
.president-informations .bottom-section,
.agent-cv .bottom-section{display: flex;
    flex-direction: column;}
.president-informations .bottom-section>.level,
.agent-cv .bottom-section>.level,
.president-informations .bottom-section>.nationality,
.agent-cv .bottom-section>.nationality{width: auto;
    display: flex;
    flex-direction: column;
    align-items: center;}
.uj-card .social-icons .icon:hover{background-color: var(--button-background-neutral-hovered); 
    color: var(--link-primary) !important;}
.president-informations .bottom-section .title,
.agent-cv .bottom-section .title{color: var(--txt-color);
    margin-bottom: var(--spacing-xs);}
.agent-cv{display: flex;
    align-items: flex-start;
    padding-top: 4rem;
    flex-direction: column;
    padding-bottom: 4rem;}
.clearFContainer{display: flex;
    justify-content: flex-end;
    margin-bottom: 1rem;}
.clear-filter span{text-decoration: underline;
    color: var(--link-primary);
    cursor: pointer;}
.map-container .gotomap{position: absolute;
    bottom: 0;
    left: 1rem;
    z-index: 2;
    display: flex;
    align-items: baseline;
    background-color: var(--button-background-primary-default);
    padding: 1rem 1.5rem;
    transition: all .3s ease-in-out;}
.map-container .gotomap:hover{background-color: var(--button-background-primary-hovered);}
.profile .uj-container{display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    overflow: hidden;}
.profile .left-section .card .nav-tabs li:not(.swiper-slide-active):hover, 
.agent-profile .tabs-wrapper .nav-tabs li:not(.swiper-slide-active):hover{background-color: var(--button-background-neutral-hovered);}
#SearchLoadMore,
#UniversityPoliciesLoader{display: none;
    margin: 1rem auto;}
.details-panel .tabs{display: flex;
    flex-wrap: wrap;}
.details-panel .labels{display: flex;
    align-items: center;
    padding: 0 1rem 1rem;}
.details-panel .labels .label{display: flex;
    align-items: baseline;
    padding: .5rem 1.5rem;
    font-size: .8rem;
    margin-left: 1rem;}
.details-panel .labels .label:last-child .icon{margin-left: .4rem;
    height: 1rem;
    width: 1rem;}
.details-panel .labels .label:last-child .icon img{height: 100%;
    width: 100%;
    object-fit: cover;}
.details-panel .card-img-overlay{display: none !important;}
.details-panel .side-panel .card-img-overlay{display: flex;
    align-items: baseline;
    justify-content: flex-end;
    border: 1px solid white;
    height: fit-content;
    width: fit-content;
    padding: 0.3px .7rem;
    left: 4rem;
    right: auto;
    top: 3rem;
    z-index: 75;}
.details-panel .side-panel{position: relative;
    padding-bottom: 4rem;}
.details-panel .side-panel .card-img-overlay .icon svg{margin: 0 .5rem;
    height: .7rem;
    width: .7rem;
    position: relative;}
.empty{display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;}
.empty .icon{height: 8rem !important;
    width: 8rem !important;
    margin-bottom: 1rem;}
.empty .icon img{height: 100%;
    width: 100%;
    object-fit: cover;}
.details-panel .img-holder::after{content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgb(0 0 0 / 40%);
    z-index: 60;}
.details-panel .img-holder{position: relative;}
.f-services .spinner-border{right: 45%;
    position: relative;
    z-index: 3;
    margin-top: 5rem;
    margin-bottom: 2rem;
    display: none;}
.faq-loader.spinner-border{position: relative;
    right: 50%;
    display: none;}
.submit-button{border: none;
    outline: none;}
.beta-ribbon{width: 100%;
    background-color: #c5285a;
    text-align: center;
    padding: 0.5rem 0;
    color: white;
    position: relative;
    z-index: 5;
    display: none;}
.clear-filter{margin: var(--spacing-xl) 0;}
.aca-filter .dropdown::after{content: '';
    background-image: url('/themes/uoj_theme/media/chevron-down-green.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    left: 1rem;
    top: 50%;
    transform: translateY(-30%);
    height: 0.7rem;
    width: 0.7rem;
    position: absolute;}
#PoliciesContentTab{opacity: 1 !important;
    width: 100%;}
.quick-links .swiper-wrapper{height: 100%;
    width: 80%;
    position: relative;
    align-items: center;}
.quick-links.swiper .swiper-button-prev{height: 2rem;
    width: 2rem;
    display: none;
    right: 10.4rem;
    top: 2.6rem;
    transform: scaleX(-1) translate(0);}
.quick-links.swiper .swiper-button-next{height: 2rem;
    width: 2rem;
    left: 5rem;
    top: 2.6rem;
    transform: translate(0);
    display: none;}
.quick-links .swiper-button-prev.swiper-button-disabled,
.quick-links .swiper-button-next.swiper-button-disabled{display: none !important;}
.quick-links .swiper-button-prev svg,
.quick-links .swiper-button-next svg,
.quick-links .swiper-button-prev svg g,
.quick-links .swiper-button-next svg g{height: 100%;
    width: 100%;
    object-fit: cover;}
.quick-links-container{display: flex;
    align-items: center;
    background-color: white;
    border-top: 1px solid var(--background-neutral-300);}
.quick-links.swiper::before{content: "";
    position: absolute;
    z-index: 2;
    right: 0rem;
    top: 0;
    height: 100%;
    background: linear-gradient(45deg, white, transparent);
    width: 1rem;
    display: none;}
.quick-links.swiper::after{content: "";
    position: absolute;
    z-index: 2;
    left: 0rem;
    top: 0;
    height: 100%;
    background: linear-gradient(45deg, white, transparent);
    width: 1rem;}
.emerg-services ul{display:flex;
    flex-direction:column;
    gap:var(--spacing-md);}
.emerg-services ul li{list-style-type: disc;
    margin-inline-start: var(--spacing-2xl);}
.emerg-services ul li .ctopic{font-weight: 600;
    margin-left: 1rem;
    color: var(--black-color);}
input[type="checkbox"]{scale: 1.2;
    appearance: none;
    width: 1.125rem;
    height: 1.125rem;
    background-color: #fff;
    border: 1px solid #ccc;
    cursor: pointer;
    vertical-align: middle;
    margin-left: 1rem;
    border-radius: 2px;}
.eservices-container .fieldset-wrapper>div:first-child .form-radios.form--inline{display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-snap-type: x proximity;
    white-space: nowrap;}
.eservices-container .fieldset-wrapper>div:first-child .form-radios.form--inline::-webkit-scrollbar{display: none;}
.eservices-container .fieldset-wrapper>div:first-child .form-radios.form--inline .form-item{scroll-snap-align: start;}
.eservices-container .fieldset-wrapper>div:first-child .form-radios.form--inline label{white-space: nowrap;}
.pager__items{display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--pagination-items-padding);}
.pager__items .pager__item{position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    padding: var(--pagination-item-sm-padding);
    height: 24px;
    width: 24px;
    border-radius: var(--radius-sm);}
.pager__items .pager__item a{color:var(--text-default);
    width: 100%;
    text-align: center;}
.pager__items .pager__item:hover{background-color: var(--button-background-neutral-hovered);}
.pager__items .pager__item.is-active::after{content:"";
    position:absolute;
    bottom:0;
    right: 3px;
    height:3px;
    width:16px;
    border-radius:var(--radius-full);
    background-color:var(--background-primary);}
.all-news-container.achievements-innovation{margin-top:0;}
.story .our-story{display:flex;
flex-direction:column;
gap:var(--spacing-md);}
@media (max-width: 768px){.digital-stamp-card{padding: 8px 16px;}}
@media (max-width: 768px){.digital-stamp-card .digital-stamp-header{flex-wrap: wrap;}}
@media (max-width: 768px){.digital-stamp-card .digital-stamp-header .btn-digital-stamp-card{flex: 100%;
        margin-right: 33px;}}
.agent-cv .col-lg-4{align-self:flex-start;}
@media screen and (min-width: 600px){.story .image-container{margin-left: 0rem;}}
@media screen and (min-width: 600px){.details-panel .close{left: 4rem;
        background-color: unset;
        border-radius: unset;}}
@media screen and (min-width: 600px){.twitter-side-menu button.close{right: 15px;}}
@media screen and (min-width: 600px){.news-advertisements .items{flex-flow: row wrap;}}
@media screen and (min-width: 600px){.notifications-side-menu button.close,
    .weather-side-menu button.close,
    .polls-side-menu button.close{position: absolute;
        top: 1.5rem;
        left: 33.4rem;
        right: auto;}}
@media screen and (min-width: 600px){.search svg,
    .accessibility svg,
    .menu svg{height: 1.7rem;}}
@media screen and (min-width: 600px){.sidebuttons{top: 20rem;}}
@media screen and (min-width: 600px){.faqs .faqs-search input{width: 60%;}}
@media(min-width: 768px){.searchbox-container{top: 11.2rem;}}
@media(min-width: 768px){#map{height: calc(100vh - 8.6rem);}}
@media(min-width: 768px){.leaflet-top{bottom: 0.5rem;}}
@media(min-width: 768px){.news-advertisements .news-item.col-lg-4:last-child{display: none;}}
@media(min-width: 768px){#chart_div{height: 400px;}}
@media(min-width: 768px){.f-services .spinner-border{right: 50%;
        margin-top: unset;}}
@media(min-width: 768px){.js-form-item.js-form-type-radio{height: 40px;
        flex-flow: row wrap;}}
@media(min-width: 768px){fieldset legend{line-height: 2.2;}}
@media(min-width: 768px){.js-form-item.js-form-type-radio{height: 64px;}}
@media(min-width: 768px){.details-panel .spinner-border{right: 270px;}}
@media(min-width: 768px){.faqs .faqs-search input{width: 70%;}}
@media(min-width: 768px){.swiper-pagination-bullet.swiper-pagination-bullet-active::after{top: 0.3rem;
        left: 0.35rem;
        height: 0.4rem;
        width: 0.4rem;}}
@media(min-width: 768px){.search .erase{height: 100%;
        width: 3rem;
        top: unset;}}
@media(min-width: 768px){.dropdown button.btn.btn-light.dropdown-toggle::before{content: unset;}}
@media(min-width: 768px){.search .search-btn{width: auto;
        justify-content: unset;
        height: 100%;}}
@media(min-width: 768px){.dropdown button.btn.btn-light.dropdown-toggle{border-right: 1px solid #ebebeb;
        padding: .375rem .75rem;}}
@media(min-width: 768px){.search .dropdown{height: 100%;
        width: auto;
        margin: unset;}}
@media(min-width: 768px){.search .modal-dialog .input-group .form-control{height: 100%;
        padding-right: 4rem;
        width: auto;}}
@media(min-width: 768px){.notifications-side-menu button.close,
    .weather-side-menu button.close,
    .polls-side-menu button.close{top: 2.5rem;}}
@media(min-width: 768px){.search .erase{right: 0.5rem;}}
@media(min-width: 768px){.search .erase svg{width: 60%;
        height: 60%;}}
@media(min-width: 768px){.search .input-group.mb-3{height: 3.5rem !important;
        width: 40rem !important;
        flex-direction: row;}}
@media(min-width: 768px){.college .college-annual-report .item .item-desc .icon{display: block;}}
@media(min-width: 768px){.contact-us .services .service:last-child{border-bottom: none;
        padding: 15px;}}
@media(min-width: 768px){.map-container .gotomap{padding: 1rem;}}
@media(min-width: 768px){.contact-us .contact-infos .phone,
    .contact-us .contact-infos .email,
    .contact-us .contact-infos .fax{font-size: 1rem;
        padding: 1rem 3rem;}}
@media(min-width: 768px){.contact-us .contact-infos{margin: 3rem 0px 0px;}}
@media(min-width: 768px){.contact-us .services .service a.start{margin-top: 2rem;}}
@media(min-width: 768px){.service.col-md-4 .image{margin-bottom: 2rem;}}
@media(min-width: 768px){.contact-us .services .service{margin-bottom: 3rem;
        padding: 15px;
        border-bottom: none;}}
@media(min-width: 768px){.faqs .faq-group .faq-item .faq-details::after{right: 2rem;}}
@media(min-width: 768px){#PoliciesContentTab{width: auto;}}
@media(min-width: 768px){.care-tiles.policies{padding: 3rem 0;}}
@media(min-width: 768px){.aca-filter .dropdown button.btn.btn-light.dropdown-toggle{padding: 1rem;}}
@media(min-width: 768px){.aca-filter .filter-dp .dropdown{width: 33%;
        margin: 0;}}
@media(min-width: 768px){.aca-filter .filter-dp{display: flex;
        align-items: center;
        flex-direction: row;
        margin-bottom: 0rem;
        gap: var(--spacing-3xl);}}
@media(min-width: 768px){.filters-container{margin-top: unset;}}
@media(min-width: 768px){.step .instruction span{text-align: start;}}
@media(min-width: 768px){.step .end-date{margin-right: unset;}}
@media(min-width: 768px){.steps-app{padding-top: unset;
        padding-bottom: unset;}}
@media(min-width: 768px){.std{font-size: 1.1rem;}}
@media(min-width: 768px){.life-jeddah{margin-top: unset;}}
@media(min-width: 768px){.uoj-breadcrumb{display: flex;}}
@media(min-width: 768px){.about-swiper-section{padding-right: unset;}}
@media(min-width: 768px){.story .image-container{height: auto;}}
@media(min-width: 768px){.news-advertisements .news-item .card-img-top::after{height: 100%;}}
@media(min-width: 768px){.particles-container .contents .txt{margin: 2rem 0;}}
@media(min-width: 768px){.contents .txt span{font-size: 2.5rem;}}
@media(min-width: 768px){.particles-container .contents .logo{width: auto;}}
@media(min-width: 768px){.uni-values .column .val-content{margin-bottom: 2rem;}}
@media(min-width: 768px){.values{padding-bottom: 2rem;}}
@media(min-width: 768px){.gals .card-text ul,
    .volunteering .volunteer-tiles .card .card-text ul{padding-inline-start: 11px;}}
@media(min-width: 768px){.goals .card-text,
    .goals .card-title,
    .volunteering .volunteer-tiles .card .card-title{width: 100%;}}
@media(min-width: 768px){.story .uj-container{margin-bottom: unset;
        flex-direction: column;}}
@media(min-width: 768px){.contact-us .contact-infos .fax::after{top: 0px;
        left: 0px;
        position: absolute;
        height: 2rem;
        width: 2rem;
        content: "";
        border-width: 46px 34px 20px 15px;
        border-style: solid;
        border-color: #fafafa transparent transparent #fafafa;}}
@media(min-width: 768px){.contact-us .contact-infos{flex-wrap: nowrap;}}
@media(min-width: 768px){.contact-us .contact-infos .fax::after{top: 0px;
        left: 0px;
        position: absolute;
        height: 2rem;
        width: 2rem;
        content: "";
        border-width: 46px 34px 20px 15px;
        border-style: solid;
        border-color: #fafafa transparent transparent #fafafa;}}
@media screen and (min-width: 992px){.f-services .cards-section .col-lg-4{max-width: 32.4%;}}
@media screen and (min-width: 992px){.proxies .cards-container .col-lg-4,
.advisors .cards-container .col-lg-4{padding:0;
    max-width: 32.4%;}}
@media screen and (min-width: 992px){.eservices-container .form-text{width: 27.6rem;}}
@media screen and (min-width: 992px){.care-tiles.policies .row-cards{display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: var(--spacing-xl);}}
@media screen and (min-width: 992px){.static-slider .swiper-button-prev,
    .static-slider .swiper-button-next{display: flex;}}
@media screen and (min-width: 992px){.tabular-view .tab-content .tab-pane .d-flex{flex-direction: row;}}
@media screen and (min-width: 992px){p.description,
    div.description p{text-align: justify;}}
@media screen and (min-width: 992px){.js-form-item.js-form-type-radio{width: max-content;}}
@media screen and (min-width: 992px){.college .college-annual-report .item{display: flex;
        flex-direction: row;
        justify-content: space-between;}}
@media screen and (min-width: 992px){.images-holder.container.description img{object-fit: contain;
        margin: 0;
        padding: 1rem;
        display: inline-block;}}
@media screen and (min-width: 992px){.quick-links .logo{display: block;}}
@media screen and (min-width: 992px){.quick-links.swiper::before,
    .quick-links.swiper::after{display: none;}}
@media screen and (min-width: 992px){.quick-links.swiper .swiper-button-prev.swiper-button-disabled,
    .quick-links.swiper .swiper-button-next.swiper-button-disabled{display: none !important;}}
@media screen and (min-width: 992px){.quick-links.swiper .swiper-button-prev{height: 100%;
        width: 5rem;
        opacity: 1;
        display: flex !important;
        right: 0rem;
        top: 0rem;
        transform: scaleX(-1) translate(0);
        align-items: center;
        justify-content: center;
        bottom: 0;
        margin: 0;
        background-image: linear-gradient(90deg, rgb(255 255 255), 50%, rgb(255 255 255), rgb(255 255 255 / 0%));}}
@media screen and (min-width: 992px){.quick-links.swiper .swiper-button-prev svg circle,
    .quick-links.swiper .swiper-button-next svg circle{fill: transparent;}}
@media screen and (min-width: 992px){.quick-links.swiper .swiper-button-prev svg path,
    .quick-links.swiper .swiper-button-next svg path{fill: var(--blue-color);}}
@media screen and (min-width: 992px){.quick-links.swiper .swiper-button-prev svg,
    .quick-links.swiper .swiper-button-next svg{width: 3rem;}}
@media screen and (min-width: 992px){.quick-links.swiper .swiper-button-next{height: 100%;
        width: 5rem;
        display: flex !important;
        align-items: center;
        justify-content: center;
        left: 0;
        top: 0rem;
        opacity: 1;
        transform: translate(0);
        bottom: 0;
        margin: 0;
        background-image: linear-gradient(90deg, rgb(255 255 255), 50%, rgb(255 255 255), rgb(255 255 255 / 0%));}}
@media screen and (min-width: 992px){.quick-links.swiper .swiper-wrapper{padding: 0 4rem 0 3rem !important;}}
@media screen and (min-width: 992px){.president-informations .bottom-section .nationality,
    .president-informations .bottom-section>.level,
    .agent-cv .bottom-section>.level{align-items: flex-start;}}
@media screen and (min-width: 992px){.bar-chart{display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;}}
@media screen and (min-width: 992px){.bar-chart h1.section-title,
    .bar-chart p.description{text-align: right;}}
@media screen and (min-width: 992px){.story .image-container{margin-bottom: 0;}}
@media screen and (min-width: 992px){.beta-ribbon{position: fixed;
        top: 0;}}
@media screen and (min-width: 992px){.sub .beta-ribbon,
    body.toolbar-horizontal .beta-ribbon{position: relative;}}
@media screen and (min-width: 992px){.president-informations .bottom-section,
    .agent-cv .bottom-section{align-items: baseline;}}
@media screen and (min-width: 992px){.president-informations .bottom-section>.level,
    .agent-cv .bottom-section>.level{width: 30rem;}}
@media screen and (min-width: 992px){.map-container #map{background-color: black;
        height: 87vh;}}
@media screen and (min-width: 992px){.supreme-president .president-informations .buttons-container{flex-direction: row;}}
@media screen and (min-width: 992px){.story .image-container img{height: 80%;
        width: 50%;
        object-fit: contain;
        object-position: top;
        margin: auto;}}
@media screen and (min-width: 992px){.particles-container{height: 74vh;}}
@media screen and (min-width: 992px){.uni-values .column .val-content{margin-bottom: 2.5rem;}}
@media screen and (min-width: 992px){.uni-values .num{width: 3.5rem;
        height: 3.5rem;}}
@media screen and (min-width: 992px){.uni-values{padding: unset;}}
@media screen and (min-width: 992px){.uni-values .column{margin: 0 4rem;}}
@media screen and (min-width: 992px){.uni-values .column{width: fit-content;
        align-items: start;
        flex-direction: column;
        justify-content: flex-start;}}
@media screen and (min-width: 992px){.uni-values{flex-direction: row;
        display: flex;
        font-size: 2rem;
        width: 100%;
        margin: auto;
        justify-content: center;}}
@media screen and (min-width: 992px){.tab-pane .row{flex-direction: row;
        width: 100%;}}
@media screen and (min-width: 992px){.research-production{padding: 0;}}
@media screen and (min-width: 992px){.Deanship-agencies.contact-information .agencies-tiles .uj-container{flex-direction: row;}}
@media screen and (min-width: 992px){.supreme-president .president-informations .description p{text-align: right;}}
@media screen and (min-width: 992px){.pattern-before svg{display: block;}}
@media screen and (min-width: 992px){.steps{padding: 6rem 1rem;}}
@media screen and (min-width: 992px){.international-students{height: 50vh;}}
@media screen and (min-width: 992px){.swiper-slide .grid-item{max-width: 91%;}}
@media screen and (min-width: 992px){.swiper-slide .gridItems{padding-top: unset;}}
@media screen and (min-width: 992px){.story .image-container img{height: 100%;
        width: 100%;
        object-fit: cover;
        border-radius: var(--radius-lg);}}
@media screen and (min-width: 992px){.story.plan.show-button-true .image-container img,
    .show-button-true img{object-fit: cover;}}
@media screen and (min-width: 992px){.news-advertisements .news-item.col-lg-4:last-child{display: block;}}
@media screen and (min-width: 992px){.particles-container{height: 80vh;}}
@media screen and (min-width: 992px){.contact-us .map{height: 77vh;}}
@media screen and (min-width: 992px){.story.story-img{align-items: center;
        margin-bottom: 3rem;}}
@media screen and (min-width: 992px){.agent-cv .col-lg-4{max-width: 416px;
        width: 416px;
        flex: 0 0 416px;}}
@media screen and (min-width: 992px){.agent-cv{flex-direction: row;}}
@media screen and (min-width: 992px){.president-informations .bottom-section,
    .agent-cv .bottom-section{flex-direction: row;
        margin-top:var(--spacing-3xl);}}
@media screen and (min-width: 992px){.supreme-president .president-informations .buttons-container{justify-content: flex-start;
        margin-top: 3rem;}}
@media screen and (min-width: 992px){.supreme-president .president-informations,
    .agent-cv .agent-informations{width: 70%;
        margin-right: var(--spacing-6xl);
        position: relative;
        display: flex;
        flex-direction: column;}}
@media screen and (min-width: 992px){.supreme-president .uj-container{flex-direction: row;}}
@media screen and (min-width: 992px){.life-jeddah .tiles-container .col-lg-3:last-child{padding-left: 0;}}
@media screen and (min-width: 992px){#chartdiv{height: 700px !important;}}
@media screen and (min-width: 992px){.story .uj-container{flex-direction: row;}}
@media screen and (min-width: 992px){.step .start-date,
    .step .end-date{justify-content: center;}}
@media screen and (min-width: 992px){.search .search-btn,
    .associates-search .search-btn label{display: block;}}
@media screen and (min-width: 992px){.quick-links .link{margin: 0;}}
@media screen and (min-width: 992px){.quick-links{display: flex;
        align-items: center;
        padding: 0 0 0 6rem !important;}}
@media screen and (min-width: 992px){.dropdown button.btn.btn-light.dropdown-toggle label{display: block;}}
@media screen and (min-width: 992px){.std{border-left: 1.4px solid #e4e4e4;
        background-color: white;
        z-index: 2;}}
@media screen and (min-width: 992px){.std::before{content: "";
        position: absolute;
        width: 3.5rem;
        height: 2px;
        top: 2.9rem;
        right: -2.5rem;
        background-color: black;}}
@media screen and (min-width: 992px){.std::after{position: absolute;
        width: 1px;
        height: 4rem;
        top: -1rem;
        left: -2rem;
        background-color: rgb(222, 226, 230);}}
@media screen and (min-width: 992px){.chart-container{width: 60%;}}
@media screen and (min-width: 992px){.bar-chart .content{width: 40%;}}
@media screen and (min-width: 992px){.bar-chart{flex-direction: row;
        padding: 6rem 6rem 0;}}
@media screen and (min-width: 992px){.tabular-view .tab-content{width: 100%;}}
@media screen and (min-width: 992px){.swiper-slide .grid-item{max-width: 34%;
        width: 100%;
        padding: 1rem;}}
@media screen and (min-width: 992px){.swiper-slide .gridItems{flex-direction: row;}}
@media screen and (min-width: 992px){.international-students .card-img-overlay{height: 330px;
        width: 648px;}}
@media screen and (min-width: 992px){.story .image-container img{display: block;}}
@media screen and (min-width: 992px){.uoj-breadcrumb .icon{width: 0.4rem;
        margin: 0px 0.5rem;}}
@media screen and (min-width: 992px){.news-advertisements .news-item:last-child{margin-left: 0px;}}
@media screen and (min-width: 992px){.service.col-md-4 .image{width: 10rem;
        height: 10rem;}}
@media screen and (min-width: 992px){.goals .column{max-width: 50%;}}
@media screen and (min-width: 992px){.goals{gap:var(--spacing-2xl);
        display: flex;
        flex-wrap: wrap;}}
@media screen and (min-width: 992px){.story .our-story{width: 50%;
        flex: 1;}}
@media screen and (min-width: 992px){.story .image-container{width: 50%;
        max-height: 25rem;
        flex: 1;}}
@media screen and (min-width: 992px){.contact-us .contact-infos .email,
    .contact-us .contact-infos .phone{border-left: 1px solid rgb(213, 213, 213);
        border-bottom: none;}}
@media screen and (min-width: 992px){.contact-us .contact-infos .fax{position: relative;
        padding: 1rem 3rem 1rem 5rem;}}
@media screen and (min-width: 992px){.news-advertisements .items{flex-direction: row;}}
@media screen and (min-width: 992px){.search button.close{top: 3rem;
        left: 3rem;}}
@media screen and (min-width: 992px){.search-footer{flex-direction: row;
        align-items: center;
        justify-content: space-around;}}
@media screen and (min-width: 992px){.quick-links{justify-content: start;
        background-image: none;
        position: relative !important;}}
@media screen and (min-width: 992px){.tab-links li{font-size: 1.1rem;
        width: fit-content;}}
@media screen and (min-width: 992px){.steps-app .pattern-before{display: none;}}
@media screen and (min-width: 992px){.steps-app .steps{padding: 0;}}
@media screen and (min-width: 992px){h1.section-title::before{top: 3.3rem;
        right: 0px;
        position: absolute;
        content: "";
        display: inline-block;
        margin: 0px 0px 0px 1rem;
        transition: all 0.2s ease 0s;
        height: 5px;
        width: 5rem;
        background-color: var(--background-sa-flag);}}
@media screen and (min-width: 992px){.navbar-brand{display: flex;}}
@media screen and (min-width: 992px){.faqs .faqs-search input{width: 40%;}}
@media screen and (min-width: 992px){.international-students{height: 74vh;}}
@media screen and (min-width: 992px){.main-menu-container .main-menu .social-icons a svg,
    .main-menu-container .main-menu .logo img{width: 3rem;
        height: auto;}}
@media screen and (min-width: 992px){.quick-links .logo{left: 0;
        top: 2rem;
        display: none;}}
@media screen and (min-width: 1024px){#map{height: calc(100vh - 8.1rem);}}
@media screen and (min-width: 1024px){.beta-ribbon{position: fixed;}}
@media(min-width: 1200px){.uj-container{width: 100%;
        margin-right: auto;
        margin-left: auto;
        max-width: var(--container-max-width-desktop);
        padding: var(--spacing-5xl) 0;
        border-radius: var(--radius-md);}}
@media(min-width: 1200px){.international-students .card-img-overlay{right: 80px;}}
@media(min-width: 1200px){.step{margin-bottom: 3rem;
        padding-bottom: unset;
        border-bottom: unset;}}
@media(min-width: 1200px){.step:nth-child(even) .instruction{transform: translateY(-41.8rem);
        content: "";
        bottom: 8rem;
        right: 50%;
        transform: translate(106%, -50%);
        width: 100%;
        min-height: fit-content;}}
@media(min-width: 1200px){.step:nth-child(n)::before{content: '';
        background-size: 100%;
        background-position: top;
        background-repeat: no-repeat;
        position: absolute;
        max-height: 185px;
        height: 185px;
        width: 1rem;
        right: 50%;
        transform: translate(50%, -71%);
        background-image: url(/themes/uoj_theme/media/Step.svg);}}
@media(min-width: 1200px){.step:nth-child(even)::before{transform: translate(50%, -89%);}}
@media(min-width: 1200px){.step .instruction{transform: translateX(50%);
        width: 100%;
        right: 50%;
        transform: translate(106%, -50%);}}
@media(min-width: 1200px){.step .instruction{min-width: 329px;}}
@media(min-width: 1200px){.step .instruction{position: absolute;}}
@media(min-width: 1200px){.steps .step{flex-direction: row;
        margin-bottom: 0;
        align-items: center;}}
@media(min-width: 1200px){.steps{flex-direction: row;
        height: 50rem;
        padding: 0 6rem;
        justify-content: center;
        align-items: center;}}
@media(min-width: 1200px){.container{padding-left: 5rem;
        padding-right: 5rem;}}
@media(min-width: 1200px){.beta-ribbon,
    .sub .beta-ribbon,
    body.toolbar-horizontal .beta-ribbon{width: 10.5rem;
        padding: 9px;
        position: fixed;
        letter-spacing: .5px;
        font-size: .9rem;
        background-color: unset;
        background: url("/themes/uoj_theme/media/beta-ribbon.webp"), linear-gradient(45deg, #C61366, #C0163B) no-repeat fixed;
        top: 1.3rem;
        left: -2.9rem;
        background-size: 200%;
        background-position-x: 49%;
        background-position-y: center;
        transform: rotate(-45deg);
        font-family: var(--IBM-sb);}}
@media screen and (min-width: 1400px){#map{height: calc(100vh - 7.2rem);}}
@media screen and (min-width: 1400px){.search-footer .link svg{width: auto;
        height: auto;}}
@media screen and (min-width: 1400px){.beta-ribbon{top: 10px;
        left: -38px;}}
@media screen and (min-width: 1400px){.beta-ribbon{top: 1.2rem;
        left: -3rem;}}
@media screen and (min-width: 1400px){.step::after{height: 2.6rem;
        border-bottom: solid 1.3rem transparent;
        border-top: solid 1.3rem transparent;}}
@media only screen and (min-width: 1600px){.service.col-md-4 .image{width: 10vw;
        height: 10vw;}}
@media only screen and (min-width: 1600px){.story .image-container{max-height: 25vw;}}
@media only screen and (min-width: 1600px){.college.tabular-view .nav li a.nav-link::before{height: 1.6vw !important;
        width: 1.5vw !important;
        margin-left: 0.7vw !important;}}
@media only screen and (min-width: 1600px){.contact-us .contact-infos .phone img,
    .contact-us .contact-infos .email img,
    .contact-us .contact-infos .fax img{margin-left: 1vw;
        height: 1.5vw;}}
@media only screen and (min-width: 1600px){.contact-us .contact-infos .phone,
    .contact-us .contact-infos .email,
    .contact-us .contact-infos .fax{padding: 1vw 3vw;}}
@media only screen and (min-width: 1600px){.contact-us .services .service a.start{margin-top: 2vw;}}
@media only screen and (min-width: 1600px){.faqs .faqs-search input{padding: 2vw 1vw;
        font-size: 1vw;}}
@media only screen and (min-width: 1600px){.details-panel img{max-height: 20vw;}}
@media only screen and (min-width: 1600px){.details-panel .close{top: 2.3vw;}}
@media only screen and (min-width: 1600px){.contents .txt span{font-size: 2.5vw;}}
@media only screen and (min-width: 1600px){.uni-values{font-size: 2vw;}}
@media only screen and (min-width: 1600px){.goals .card ul li::before{height: 0.6vw;
        width: 0.6vw;}}
@media only screen and (min-width: 1600px){.story .image-container{max-height: 25vw;}}
@media only screen and (min-width: 1600px){.container.description.fade-left h6{font-size: 1vw;}}
@media only screen and (min-width: 1600px){.step:nth-child(even) .instruction{bottom: 111%;}}
@media only screen and (min-width: 1600px){.uoj-breadcrumb .icon{width: 0.4vw;
        margin: 0 0.5vw;}}
@media only screen and (min-width: 1600px){.search svg,
    .accessibility svg,
    .menu svg{height: 1.7vw;}}
@media only screen and (min-width: 1600px){.tab-links li{font-size: 1.1vw;}}
@media only screen and (min-width: 1600px){.beta-ribbon,
    .sub .beta-ribbon,
    body.toolbar-horizontal .beta-ribbon{width: 10.5vw;
        font-size: .9vw;
        top: 1.4vw;
        left: -2.8vw;
        background-size: 200%;
        background-position-x: 49%;
        transform: rotate(-45deg);}}
@media only screen and (min-width: 1600px){#map{height: calc(100vh - 6.7rem);}}
.available-programs .uj-container{display: flex;
    flex-direction: column;
    gap: var(--spacing-3xl);}
.available-prog-swiper{width: 100%;}
.available-prog-swiper .swiper-slide{height: auto;}
.available-programs .swiper-pagination{position: relative;
    bottom: auto;
    margin-top: 0;}
.available-programs .uj-container > .swiper-pagination.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left: auto;
    right: auto;
    transform: none;
    align-self: center;}
article.card.uj-card > .card-text.text-md ul{display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    margin-bottom: unset;}
@font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal}
:root{--swiper-theme-color:#007aff}
.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}
.swiper-vertical>.swiper-wrapper{flex-direction:column}
.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}
.swiper-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}
.swiper-pointer-events{touch-action:pan-y}
.swiper-pointer-events.swiper-vertical{touch-action:pan-x}
.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}
.swiper-slide-invisible-blank{visibility:hidden}
.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}
.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}
.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}
.swiper-3d,.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}
.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-wrapper{transform-style:preserve-3d}
.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}
.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}
.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}
.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}
.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}
.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}
.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}
.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}
.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}
.swiper-horizontal.swiper-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}
.swiper-vertical.swiper-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}
.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}
.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}
.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}
.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}
.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}
.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center}
.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}
.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}
.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}
.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}
:root{--swiper-navigation-size:44px}
.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}
.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}
.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}
.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}
.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}
.swiper-button-prev,.swiper-rtl .swiper-button-next{left:10px;right:auto}
.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}
.swiper-button-next,.swiper-rtl .swiper-button-prev{right:10px;left:auto}
.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}
.swiper-button-lock{display:none}
.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}
.swiper-pagination.swiper-pagination-hidden{opacity:0}
.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}
.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}
.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}
.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:50%;background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}
button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}
.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}
.swiper-pagination-bullet:only-child{display:none!important}
.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}
.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0px,-50%,0)}
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}
.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}
.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}
.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}
.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}
.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}
.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}
.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}
.swiper-pagination-lock{display:none}
.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}
.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}
.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}
.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}
.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}
.swiper-scrollbar-cursor-drag{cursor:move}
.swiper-scrollbar-lock{display:none}
.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}
.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}
.swiper-slide-zoomed{cursor:move}
.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}
.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}
.swiper-lazy-preloader-black{--swiper-preloader-color:#000}
.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}
.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}
.swiper-grid>.swiper-wrapper{flex-wrap:wrap}
.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}
.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}
.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}
.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}
.swiper-fade .swiper-slide-active,.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}
.swiper-cube{overflow:visible}
.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}
.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}
.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}
.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}
.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-next+.swiper-slide,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}
.swiper-cube .swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}
.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}
.swiper-flip{overflow:visible}
.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}
.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}
.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}
.swiper-flip .swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}
.swiper-cards{overflow:visible}
.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}
:root{--animate-duration:1s;--animate-delay:1s;--animate-repeat:1}
.animate__animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-duration:var(--animate-duration);animation-duration:var(--animate-duration);-webkit-animation-fill-mode:both;animation-fill-mode:both}
.animate__fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}
:root{--medium-green: #1b784a;
    --white: #ffffff;
    --black-01: #161616;
    --light-green: #4ab87f;
    --font-size-sm: clamp(0.75rem, 0.8vw, 0.875rem);
    --spacing: clamp(0.5rem, 2vw, 2.5rem);
    --ibmregular: "IBM Plex Regular";
    --ibmmedium: "IBM Plex Medium";
    --ibmsemibold: "IBM Plex SemiBold";
    --ibmbold: "IBM Plex Bold";}
html{width: 100%;
    overflow-x: hidden;}
.closeMenu svg,
.closeAccessiblityMenu svg{width: 2rem;
    height: 2rem;}
.accessibility-dots{background-color: transparent;
    height: 40px;
    width: 40px;}
.rightAlignedLinks{display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;}
header .navbar.navbar-collapse .rightAlignedLinks .searchbtn-collapse,
header .navbar.navbar-collapse .rightAlignedLinks .lang-dropdown,
header .navbar.navbar-collapse .rightAlignedLinks .myUJ.d-flex.d-lg-none{border-bottom: 1px solid var(--border-neutral-primary);
    width: 100%;
    border-radius: 0;
    gap: var(--spacing-md) !important;
    display: flex !important;
    padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-xl) var(--spacing-xl);
    align-items: center;}
header .navbar.navbar-collapse .rightAlignedLinks .searchbtn-collapse .d-flex{width: 100%;
    border-radius: 0;
    height: 32px !important;
    gap: var(--spacing-md) !important;
    display: flex !important;
    align-items: center;
    padding: 0;}
.main-nav .utility-btn span,
.contact-btn span{font-family: var(--IBM-sb);
    font-size: var(--text-sm);}
header .navbar.navbar-collapse .rightAlignedLinks .lang-dropdown-mobile{display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;}
.closeMenu{display: flex;
    height: 40px;
    min-height: 40px;
    max-height: 40px;
    width: 40px;
    justify-content: center;
    align-items: center;
    padding: 0;
    border-radius: var(--radius-sm);
    background: var(--colors-gray-neutral-100) !important;}
.main-nav .navbar{padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-5xl) var(--spacing-xl);
    gap: 1.7rem;
    width: 100%;}
.top-links li.nav-item{list-style-type: none;}
header{position: relative;
    width: 100%;
    z-index: 102;
    top: 0px;}
.main-nav{margin: auto;
    padding: 0;
    position: absolute;
    top: 4.5rem;
    background-color: white;}
.navbar .d-flex{justify-content: space-between;
    width: 100%;
    height: 72px;
    padding: 0 var(--spacing-xl);}
.contact-btn{background-color: transparent;
    color: var(--text-default);
    border: none;
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    cursor: pointer;
    position: relative;
    border-radius: var(--radius-sm);
    padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-xl) var(--spacing-xl);}
.contact-btn img{height: 1.1rem;
    filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(7500%) hue-rotate(288deg) brightness(92%) contrast(108%);}
.secondary-nav-content{width: 100%;
    margin: 0px auto;
    justify-content: flex-start;
    background-color: white;
    overflow: visible;
    transition: none;
    flex-direction: column;}
.secondary-nav-content .leftSection{display: flex;
    align-items: center;
    gap: var(--spacing-xl);
    overflow: visible;
    width: 100%;
    justify-content: space-between;}
.nav-menu{display: flex;
    gap: 0;
    list-style: none;
    margin: 0px;
    overflow-x: auto;
    width: 100vw;
    scrollbar-width: thin;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 4.5rem;
    background-color: white;
    z-index: 5;
    flex-direction: column;
    align-items: flex-start;
    max-height: calc(1dvh * 76.5);
    overflow: auto;
    padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-5xl);}
.navbar-nav{padding: 0px;
    width: 100%;}
.nav-menu .nav-item:last-child{position: relative;}
.mega-dropdown-grid{display: flex;
    flex-direction: column;}
header .nav-link,
header .secondary-nav-content .top-links .nav-item .nav-link{text-decoration: none;
    align-items: center;
    gap: 0.5rem;
    transition: 0.3s;
    white-space: nowrap;
    position: relative;
    border-radius: 0.3rem;
    display: flex;
    justify-content: space-between;
    width: 100%;
    text-align: inherit;
    font-family: var(--IBM-sb);
    font-size: var(--text-sm);
    color: var(--text-default);
    padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-xl) var(--spacing-xl);}
header .secondary-nav-content .top-links .nav-item .nav-link{padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-xl) var(--spacing-xl);
    border-radius: var(--radius-sm);
    gap: var(--spacing-2);}
.navbar .container.mega-dropdown{position: relative;
    left: 0px;
    right: 0px;
    background: var(--white);
    display: none;
    z-index: 1;
    width: 100%;
    top: 0;}
.mega-section-title{margin: 0;
    text-align: right;
    background-color: transparent !important;
    display: flex;
    gap: var(--spacing-md);
    font-size: var(--text-sm);
    color: var(--text-default);
    font-family: var(--ibmmedium);
    padding: var(--spacing-md) var(--spacing-xl) var(--spacing-md) var(--spacing-xl);
    padding-inline-start: var(--spacing-xl);
    border: none;
    width: 100%;
    position: relative;
    line-height: 24px;
    transition: none !important;}
.mega-links li{display: flex;
    justify-content: flex-start;}
.utility-btn{font-family: var(--ibmmedium);
    background: none;
    border: none;
    color: var(--black-01);
    font-size: var(--text-md);
    cursor: pointer;
    align-items: center;
    padding: 0px;
    display: none;
    border-radius: var(--radius-sm) !important;
    gap: var(--spacing-xs) !important;}
.navLinksContainer .utility-btn{border-radius: var(--radius-sm) !important;
    display: flex;
    position: relative;
    cursor: pointer;
    height: 40px;
    min-width: 40px;
    gap: var(--spacing-xs);}
.navLinksContainer .utility-btn svg{width:1rem;
    height:auto;}
.main-nav .utility-btn{display: flex;
    justify-content: unset;
    padding: 0;
    width: 100%;}
.myUJ{text-align: center;
    align-items: center;
    justify-content: center;
    padding: 0.7rem 1rem;
    border-radius: 0.5rem;
    padding-left: 1.5rem;
    display: none;
    height: 65px !important;}
img.icons{height: 1.1rem;
    width: auto;}
img.chevron-icon{width: 11.24px;
    margin-right: 0.3rem;
    height: 6.25px;
    transition: transform 0.4s;
    transform-origin: center center;}
.lang-dropdown .chevron-icon{filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(1%) hue-rotate(138deg) brightness(103%) contrast(101%);
    display: none;}
.lang-dropdown{position: relative;}
.lang-dropdown .utility-btn{position: relative;
    min-height: 32px;
    height: 32px;
    align-items: center;
    border-radius: var(--radius-sm) !important;}
.lang-dropdown .utility-btn .d-flex{padding: 0;
    width: 100%;
    height: unset;
    gap: var(--spacing-md) !important;}
.lang-dropdown button{color: var(--text-default);}
.lang-menu.lang-menu-desktop{position: absolute;
    top: 100%;
    right: 0px;
    background: var(--white);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-xl);
    min-width: clamp(8rem, 5vw, 12rem);
    margin-top: 1rem;
    display: none;
    z-index: 1001;
    border: 1px solid var(--border-neutral-primary);
    padding: var(--spacing-md);}
.lang-menu.lang-menu-mobile{position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;}
.lang-menu a{display: block;
    padding: var(--spacing-md);
    color: var(--black-01);
    text-decoration: none;
    font-size: var(--text-sm);
    position: relative;
    border-radius: var(--radius-sm);
    cursor: pointer;}
.lang-menu a.active::after{content: "";
    position: absolute;
    inset-inline-end: var(--spacing-xl);
    top: 50%;
    transform: translateY(-50%);
    height: 1rem;
    width: 1rem;
    background-image: url("/themes/uoj_theme/media/lang-tick.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;}
.searchbox-container-desktop{position: absolute;
    top: 12.8rem;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    z-index: 9;
    display: none;
    border-top: none;
    overflow: hidden;
    padding: 0;
    box-shadow: var(--shadow-lg);}
.searchbox-container .search-box{display: flex;
    align-items: center;
    background-color: white;
    padding: 1rem;
    justify-content: space-between;
    width: 100%;
    height: fit-content;
    z-index: 1;
    position: relative;
    flex-direction: column;
    gap: var(--spacing-2xl);}
.search-box .uj-container .search-box-wrapper{gap: var(--spacing-xl);
    display: flex;
    flex-direction: column;
    position: relative;}
.search-box .uj-container .search-box-wrapper svg{position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 1rem;}
.searchbox-container.mobile-search-container .uj-container{display: flex;
    flex-direction: column;
    gap:var(--spacing-xl);}
.searchbox-container.mobile-search-container .search-box .d-flex{padding: 0;
    height: unset;}
@media (min-width: 992px){header{z-index: 95;}}
@media (min-width: 992px){.lang-dropdown .chevron-icon{display: block;}}
@media (min-width: 992px){.contact-btn{padding: 0px var(--spacing-md) !important;
        height: 32px;
        min-height: 32px;}}
@media (min-width: 992px){.lang-dropdown .utility-btn{padding: 0 var(--spacing-sm) !important;}}
@media (min-width: 992px){.contact-btn img{filter: none;}}
@media (min-width: 992px){.main-nav .utility-btn{color: white;}}
@media (min-width: 992px){.rightAlignedLinks img.icons{filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(1%) hue-rotate(138deg) brightness(103%) contrast(101%);}}
@media (min-width: 992px){.rightAlignedLinks{flex-direction: row;
        align-items: center;
        width: fit-content;
        gap: var(--spacing-md);}}
@media (min-width: 992px){.main-nav{background-color: var(--medium-green);
        position: relative;
        top: unset;}}
@media (min-width: 992px){.search-box .uj-container .search-box-wrapper{display: flex;
        gap: var(--spacing-xl);
        padding: 0;
        flex-direction: row;}}
@media (min-width: 992px){.utility-btn{display: flex;}}
@media (min-width: 992px){.myUJ{display: flex;}}
@media (min-width: 992px){.myUJ span{color: var(--text-default) !important;}}
@media (min-width: 992px){.navbar .d-flex{border: 1px solid rgb(255 255 255 / 25%);
        border-top: 0;
        padding: 0;
        gap: var(--spacing-xl);
        max-width: var(--container-max-width-desktop);
        margin: auto;}}
@media (min-width: 992px){.mega-links.collapse:not(.show){margin-top: var(--spacing-lg);}}
@media (min-width: 992px){.mega-dropdown-grid{display: grid;
        grid-template-columns: repeat(5, 1fr);
        max-width: var(--container-max-width-desktop);
        margin: auto;}}
@media (min-width: 992px){.mega-section--full .mega-links,
    .mega-section--full .mega-links.collapse:not(.show){display: grid;
        grid-template-columns: repeat(4, 1fr);
        column-gap: 0;}}
@media (min-width: 992px){.mega-section--full .mega-links li{max-width: 100%;
        height: fit-content;}}
@media (min-width: 992px){.secondary-nav-content .navbar-nav .nav-item:not(.open):has(.mega-links a.is-active) > .nav-link:hover{background-color: var(--button-background-primary-hovered);}}
@media (min-width: 992px){.contact-btn span,
    .lang-dropdown button span{display: block;
        font-size: var(--text-md);
        color: white;
        font-family: var(--IBM-regular) !important;}}
@media (min-width: 992px){.secondary-nav-content .navLinksContainer .nav-item .nav-link{border-radius: var(--radius-sm);
        display: flex;
        position: relative;
        cursor: pointer;
        height: 72px;
        min-width: 72px;
        gap: var(--spacing-xs);
        padding: var(--spacing-3xl) var(--spacing-xl) !important;}}
@media (min-width: 992px){.secondary-nav-content .navLinksContainer .nav-item.open .nav-link::after,
    .utility-btn:hover::after{background-color: var(--background-neutral-400);
        content: "" !important;
        height: 6px;
        position: absolute;
        bottom: 0rem;
        border-radius: var(--radius-full);
        width: 90%;
        left: 50%;
        transform: translateX(-50%);}}
@media (min-width: 992px){.utility-btn{padding: var(--spacing-3xl) var(--spacing-2xl) !important;}}
@media (min-width: 992px){.navLinksContainer .utility-btn{min-height: 72px;
        height: 72px;}}
@media (min-width: 992px){.myUJ{background-color: transparent;
        text-align: inherit;
        border-radius: 0;
        margin-bottom: 0;
        color: var(--black-01);}}
@media (min-width: 992px){.main-nav .navbar{justify-content: space-between;
        gap: var(--spacing-xl);
        max-width: var(--container-max-width-desktop);
        margin: auto;
        padding: var(--spacing-md) 0;
        display: none !important;}}
@media (min-width: 992px){.main-nav .navbar.navbar-desktop.d-none.d-lg-flex{display: flex !important;}}
@media (min-width: 992px){.top-links li.nav-item,
    .navbar-nav li.nav-item{border: none;
        width: fit-content;}}
@media (min-width: 1600px){:root{--font-size-sm: 0.75vw;
        --spacing: 1.2vw;}}
@media (min-width: 1600px){.navbar .container.mega-dropdown{max-height: calc(1dvh * 100);}}
.navbar-brand{margin: 0px;}
.closeMenu,
.closeAccessiblityMenu{height: 40px;
    min-height: 40px;
    max-height: 40px;
    width: 40px;
    justify-content: center;
    align-items: center;
    padding: 0;
    border-radius: var(--radius-sm);
    background: var(--colors-gray-neutral-100) !important;
    display: none;
    overflow: hidden;}
button.navbar-toggler{flex-direction: column;
    display: flex;
    right: 30px;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;}
button.navbar-toggler svg path{fill: var(--icon-default);}
.top-links{flex-flow: column wrap;
    gap: 0 var(--spacing-md);
    width: 100%;
    display: none;}
.nav-menu .top-links{display: flex;}
.contact-btn:hover,
.lang-dropdown:hover{background-color: var(--button-background-transparent-hovered);
    border-radius: var(--radius-sm);}
header .nav-item{position: static;
    width: 100%;
    border-bottom: 1px solid var(--border-neutral-primary);}
header .top-links .nav-item:last-child{border: none;}
header .secondary-nav-content .top-links .nav-item .nav-link:hover{background-color: var(--button-background-transparent-hovered);}
header li.nav-item a.nav-link{width: 100%;
    text-align: inherit;
    font-family: var(--IBM-sb);
    font-size: var(--text-sm);
    color: var(--text-default);
    padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-xl) var(--spacing-xl);
    gap: var(--spacing-md);
    border-radius: var(--radius-md);}
.mega-section-title::after{content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 1rem;
    background: url("/themes/uoj_theme/media/blackchevron.png");
    height: 0.7rem;
    width: 0.7rem;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 0.3s ease-in-out;}
.mega-section-title::before{content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-image: url("/themes/uoj_theme/media/icon.png");
    background-size: contain;
    background-repeat: no-repeat;
    height: 1.6rem;
    width: 1.7rem;
    right: 0px;
    display: none;}
.utility-links span{font-family: var(--ibmmedium);}
.mega-links a{text-align: start;
    font-size: var(--text-sm);
    color: var(--text-display);
    font-family: var(--ibmregular);
    padding: var(--spacing-md) var(--spacing-xl) var(--spacing-md) var(--spacing-xl);
    border: none;
    width: 100%;
    display: block;
    position: relative;
    line-height: 24px;
    transition: none !important;}
.mega-links li.external-link a:after{content: "";
    display: inline-block;
    width: 20px;
    height: 13.5px;
    background-image: url('data:image/svg+xml,<svg width="21" height="22" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M13.2632 2.31579C12.6527 2.31579 12.1579 1.79738 12.1579 1.15789C12.1579 0.518413 12.6527 0 13.2632 0H19.8947C20.5052 0 21 0.518413 21 1.15789V8.10526C21 8.74477 20.5052 9.26316 19.8947 9.26316C19.2843 9.26316 18.7895 8.74477 18.7895 8.10526V3.9533L10.7289 12.3977C10.2973 12.8499 9.59744 12.8499 9.16584 12.3977C8.7342 11.9455 8.7342 11.2124 9.16584 10.7602L17.2264 2.31579H13.2632ZM3.31579 4.63158C2.70537 4.63158 2.21053 5.14999 2.21053 5.78947V18.5263C2.21053 19.1658 2.70537 19.6842 3.31579 19.6842H15.4737C16.0841 19.6842 16.5789 19.1658 16.5789 18.5263V13.2434C16.5789 12.6039 17.0738 12.0855 17.6842 12.0855C18.2946 12.0855 18.7895 12.6039 18.7895 13.2434V18.5263C18.7895 20.4448 17.305 22 15.4737 22H3.31579C1.48453 22 0 20.4448 0 18.5263V5.78947C0 3.87102 1.48453 2.31579 3.31579 2.31579H8.35855C8.96899 2.31579 9.46382 2.8342 9.46382 3.47368C9.46382 4.11317 8.96899 4.63158 8.35855 4.63158H3.31579Z" fill="%23363636"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;}
.mega-links a:hover::before,
.mega-links a:active::before{content: "";
    background-color: var(--background-neutral-800);
    width: 6px;
    height: 24px;
    border-radius: var(--radius-full);
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    display: none;}
.utility-links{display: flex;
    gap: 0;
    align-items: center;
    flex-flow: wrap;
    justify-content: flex-start;
    width: fit-content;}
.utility-links button span{display: none;}
html body header .lang-dropdown .utility-btn::after{content: none !important;}
.searchbox-container .search-box svg{position: absolute;
    top: 0.5rem;
    right: 0.7rem;}
.searchbox-container .search-box input{background-color: transparent;
    outline: none;
    border: 1px solid #9daaae;
    font-size: var(--text-md);
    width: 100%;
    padding: var(--spacing-md);
    padding-inline-start: var(--spacing-12);
    border-radius: var(--radius-4);
    position: relative;}
.searchbox-container .search-box-wrapper::after{content: "";
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 93.8%;
    scale: 0;
    height: 2px;
    transition: 0.6s ease-in-out;
    border-bottom-right-radius: var(--radius-sm);
    border-bottom-left-radius: var(--radius-sm);
    background-color: rgb(0, 0, 0) !important;}
.seach-button-container{width: 100%;
        margin-right: auto;
        margin-left: auto;
        max-width: var(--container-max-width-desktop);
        border-radius: var(--radius-md);
        justify-content: flex-end;
        display: flex;}
.searchbox-container .search-box button svg,
.searchbox-container .search-box .close-search svg{height: auto;
    width: auto;
    padding: var(--spacing-md);}
@media (min-width: 992px){.searchbox-container .search-box svg{position: relative;
        top:unset;
        left:unset;
        right:unset;}}
@media (min-width: 992px){header li.nav-item a.nav-link.active::before,
    header li.nav-item a.nav-link:hover::before{display: none;}}
@media (min-width: 992px){.navbar-nav{width: fit-content;}}
@media (min-width: 992px){header .secondary-nav-content .top-links .nav-item:hover a{color: rgb(255 255 255 /80%) !important;}}
@media (min-width: 992px){.mega-links a:hover::before,
    .mega-links a:active::before{display: none;}}
@media (min-width: 992px){.mega-section-title::after{display: none;}}
@media (min-width: 992px){.mega-links.collapse:not(.show){display: flex;
        flex-direction: column;
        padding: 0;}}
@media (min-width: 992px){.mega-section--full .mega-links{display: grid;
        grid-auto-flow: column;
        grid-template-rows: repeat(6, auto);
        column-gap: 0rem;}}
@media (min-width: 992px){.navbar .container.mega-dropdown{position: fixed;
        left: 0px;
        right: 0px;
        background: var(--white);
        display: none;
        z-index: 1;
        width: 100%;
        max-height: 100vh;
        overflow: auto;
        height: auto;
        max-height: calc(1dvh * 78);
        box-shadow: var(--shadow-lg);}}
@media (min-width: 992px){.searchbox-container{top: 10rem;}}
@media (min-width: 992px){.searchbox-container .search-box button{background-color: var(--button-background-primary-default);
        color: white;
        width: fit-content;
        border-radius: var(--radius-4);
        padding: 0 var(--spacing-xl);
        height: 40px;}}
@media (min-width: 992px){.secondary-nav-content .leftSection{justify-content: space-between;
        width: fit-content;}}
@media (min-width: 992px){.secondary-nav-content .navbar-nav .nav-item a.nav-link:hover,
    .utility-btn.searchButton:not(.active):hover,
    .utility-btn.myUJ:hover{background-color: var(--button-background-neutral-hovered);}}
@media (min-width: 992px){.navbar .container.mega-dropdown{top: unset;
        padding: var(--spacing-4xl) !important;}}
@media (min-width: 992px){.secondary-nav-content .nav-menu .nav-item .nav-link{color: var(--black-01);
        font-family: var(--ibmmedium);
        font-size: var(--text-md);
        border: 2px solid transparent;}}
@media (min-width: 992px){.secondary-nav-content .navbar-nav .nav-item .nav-link::after,
    .utility-btn::after{content: "" !important;
        height: 6px;
        background-color: transparent;
        position: absolute;
        bottom: 0rem;
        border-radius: var(--radius-full);
        width: 90%;
        left: 50%;
        transform: translateX(-50%);}}
@media (min-width: 992px){.secondary-nav-content .navLinksContainer .nav-item.open .nav-link::after,
    .secondary-nav-content .navLinksContainer .nav-item:hover .nav-link::after,
    .secondary-nav-content .navLinksContainer .navbar-nav .nav-item.open a.nav-link::after,
    .secondary-nav-content .navLinksContainer .navbar-nav .nav-item.open a.nav-link::after,
    .secondary-nav-content .navLinksContainer .navbar-nav .nav-item.open a.nav-link::after,
    .utility-btn:hover::after{background-color: var(--background-neutral-800);
        content: "" !important;
        height: 6px;
        position: absolute;
        bottom: 0rem;
        border-radius: var(--radius-full);
        width: 90%;
        left: 50%;
        transform: translateX(-50%);}}
@media (min-width: 992px){.secondary-nav-content .navLinksContainer .nav-item .nav-link:hover::after,
    .secondary-nav-content .navLinksContainer .nav-item .nav-link.active:hover::after,
    .utility-btn:hover::after,
    .secondary-nav-content .nav-item .nav-link.active:hover::after,
    .secondary-nav-content .nav-item:hover .nav-link.active:hover::after,
    .secondary-nav-content .navbar-nav .nav-item a.nav-link:focus:hover::after,
    .secondary-nav-content .navbar-nav .nav-item a.nav-link:hover:focus-visible::after,
    .secondary-nav-content .navbar-nav .nav-item a.nav-link:focus-within:hover::after{content: "" !important;
        height: 6px;
        position: absolute;
        bottom: 0rem;
        border-radius: var(--radius-full);
        width: 90%;
        left: 50%;
        transform: translateX(-50%);}}
@media (min-width: 992px){img.icons{height: 1rem;
        width: 1rem;
        filter: none;}}
@media (min-width: 992px){.top-links{display: flex;
        flex-direction: row;
        width: fit-content;
        padding: 0;
        margin: 0;}}
@media (min-width: 992px){.top-links a{width: fit-content;}}
@media (min-width: 992px){.utility-links button span{display: block;}}
@media (min-width: 992px){header .nav-link,
    header .secondary-nav-content .top-links .nav-item .nav-link{color: var(--white);
        text-decoration: none;
        font-size: var(--text-md);
        font-family: var(--ibmregular);
        padding: 0 !important;
        width: fit-content;}}
@media (min-width: 992px){header .secondary-nav-content .top-links .nav-item .nav-link{padding: 0px var(--spacing-md) !important;
        min-height: 32px;
        height: 32px;}}
@media (min-width: 992px){.nav-menu{position: relative;
        left: unset;
        right: unset;
        top: 0rem;
        background-color: transparent;
        z-index: 0;
        flex-direction: row;
        align-items: center;
        padding: 0px;
        height: unset;
        width: fit-content;}}
@media (min-width: 992px){.utility-links{flex-direction: row;
        flex-wrap: nowrap;}}
*,
p,
h1{margin: 0;
  padding: 0;
  box-sizing: border-box;}
html{scroll-behavior: smooth;}
body{font-family: var(--ibmregular);
  color: var(--text-default);
  background-color: var(--background-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size:var(--text-md);
  position: relative;
  width: 100%;
  padding: 0;
  margin: 0;
  text-align: start;}
.font-regular{font-weight: var(--regular);}
.font-medium{font-weight: var(--medium);}
.font-bold{font-weight: var(--bold);}
.display-lg{font-size: var(--display-lg);
  line-height: 60px;}
.display-md{font-size: var(--display-md);
  line-height: 44px;}
.display-sm{font-size: var(--display-sm);
  line-height: 38px;}
.text-lg{font-size: var(--text-lg);
  line-height: 28px;}
.text-md{font-size: var(--text-md);
  line-height: 24px;}
.text-sm{font-size: var(--text-sm);
  line-height: 20px;}
.news-advertisements .row{margin:0;}
footer h6, footer .footer-heading{font-size: var(--text-md);
    padding-bottom: var(--spacing-md);
    font-family: var(--IBM-sb);
    margin: 0px;}
footer .uj-container{padding-top: var(--spacing-6xl);
    padding-bottom: var(--spacing-6xl);
    gap: var(--spacing-3xl);
    display: flex;
    flex-direction: column;}
.services-slider .swiper-pagination{position:relative;}
.numbers-statistics p{color: var(--text-default);
  font-size: var(--text-md);
  font-family: var(--ibmregular);}
.numbers-statistics .uj-container,
.goals-container .uj-container,
.uni-programs{display: flex;
  flex-direction: column;
  gap: var(--spacing-5xl);}
.news-advertisements .uj-container,
.news-ads .uj-container{display: flex;
     flex-direction: column;
	 gap:var(--spacing-4xl);}
.tabular-view .uj-container,
.library-tabs .tabular-view{display: flex;
  flex-direction: column;
  gap: var(--spacing-3xl);}
.tabular-view .nav-tabs{margin-top:var(--spacing-7xl);}
.tabular-view .nav-tabs .nav-link{padding: var(--tab-horizontal-tab-md-button-v-padding) var(--tab-horizontal-tab-md-button-h-padding);
  gap: var(--tab-button-gap);}
.eservices-section .uj-container,
.university-message .uj-container,
.our-advantage-section .uj-container,
.roles.uj-container{display: flex;
  flex-direction: column;
  gap: var(--spacing-4xl);}
.eservices-section .swiper-wrapper{display: flex; align-items: stretch;}
.serviceDetails{padding: 0px;
    display: flex;
    gap: var(--spacing-xl);}
.eservices-section .uj-btn{padding:var(--spacing-none) var(--buttons-lg-padding);
    gap:var(--buttons-lg-gap);}
.numbers-statistics .uj-container .stat-slider-content{align-items: center;
  justify-content: center;}
.card-text ul{padding-inline-start: 11px;}
a{text-decoration: none;
  color: var(--link-primary);}
.nds-banner-section{display: flex;
  align-items: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  position: relative;
  height: 550px;
  padding: 0 0 var(--spacing-7xl);}
.nds-banner-section>img,
.nds-banner-section>video{position: absolute;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 550px;
  -o-object-fit: fill;
  object-fit: cover;
  z-index: -1;}
.video-overlay{position: absolute;
  inset: 0;
  z-index: 2;}
.nds-banner-section .banner-text{z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
    width: 100%;
    gap: var(--spacing-3xl);
    padding-bottom: unset;}
.nds-banner-section .banner-text h1{color: var(--text-oncolor-primary);}
.nds-banner-section .banner-text p{color: var(--text-oncolor-primary);
  width: 100%;}
.uj-title-section{display: flex;
  flex-direction: column;
  gap: var(--spacing-3xl);}
.uj-title-section-top{display: flex;
  align-items: flex-start;
  justify-content: space-between;}
.uj-title-section-top h1{color: var(--text-default);}
.uj-btn{appearance: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  border: 0px;
  outline: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--buttons-lg-gap);
  box-sizing: border-box;
  overflow: hidden;}
.uj-btn--lg{height: 40px;
  min-height: 40px;
  max-height: 40px;
  padding-inline: var(--buttons-lg-padding);
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;}
.nav-tabs{border-bottom: 3px solid var(--border-neutral-primary);   
	width: fit-content;}
.uj-btn--primary{background-color: var(--button-background-primary-default);
  color: var(--text-oncolor-primary);}
.uj-btn--primary:hover{background: var(--button-background-primary-hovered);
  color: var(--text-oncolor-primary);}
.uj-btn--primary:active{background: var(--button-background-primary-pressed);
  color: var(--text-oncolor-primary);
  outline: none;}
.uj-btn--primary:disabled,.uj-btn--primary.disabled{background: var(--background-disabled);
  color: var(--text-default-disabled);}
.uj-btn--primary:focus-visible{background-color: var(--button-background-primary-focused);
  color: var(--text-oncolor-primary);
  border:2px solid var(--border-black)}
.uj-btn--neutral{background-color: var(--button-background-neutral-default);
  color: var(--text-default);}
.uj-btn--neutral:has(i){width: 40px;
	 min-width: 40px;}
.uj-btn--neutral:hover{background: var(--button-background-neutral-pressed);
  color: var(--text-default);}
.uj-btn--neutral:active{background: var(--button-background-neutral-pressed);
  color: var(--text-default);
  outline: none;}
.uj-btn--neutral:focus-visible{background-color: var(--button-background-neutral-focused);
  color: var(--text-default);
  border:2px solid var(--border-black)}
.uj-btn--primary-outline{outline: 1px solid var(--border-neutral-primary);
  background-color: transparent;
  color: var(--text-default);
  font-family: var(--IBM-sb);}
.uj-btn--secondary-outline{outline: 1px solid var(--border-neutral-secondary);
  background-color: transparent;
  color: var(--text-default);}
.uj-btn--secondary-outline:hover,  .uj-btn--primary-outline:hover{background: var(--button-background-neutral-default);
  color: var(--text-default);}
.uj-btn--secondary-outline:active{background: var(--button-background-neutral-selected);
  outline: 1px solid var(--border-neutral-primary);}
.uj-btn--secondary-outline:focus-visible{outline: 2px solid var(--border-black);
  background-color: transparent;
  color: var(--text-default);}
.uj-btn i{font-size: 24px;}
.link{display: inline-flex;
  padding: var(--spacing-none);
  align-items: center;
  gap: 8px;
  border-radius: var(--radius-xs);}
.link,
.link--brand{color: var(--colors-brand-600);}
.link,
.link--primary{color: var(--link-primary);}
.link:hover,
.link--brand:hover{color: var(--colors-brand-700);}
.link:hover,
.link--primary:hover{color: var(--link-primary-hovered, var(--colors-primary-sa-flag-400));}
.uj-tag,
.tags .tag{height: var(--radius-4xl);
    border-radius: var(--radius-sm);
    padding: var(--spacing-none) var(--spacing-md);
    gap: var(--spacing-xs);
    display: flex;
    font-size: var(--text-xs);
    align-items: center;
    font-weight: var(--medium);
    justify-content: center;
    font-family: var(--ibmmedium);
    background-color: var(--tag-background-neutral-light);
    border: 1px solid var(--border-neutral-secondary);
    color: var(--tag-text-neutral);}
.tags-flex,
.tags{display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-md);}
.numbers-statistics .fa-chevron-left img, .our-advantage-section .fa-chevron-left img{transform: scaleX(-1);}
.uj-static-card{display: flex;
  flex-direction: column;
  position: relative;
  align-items: center;
  justify-content: center;
  gap: var(--card-lg-gap);}
.uj-static-card .stat-slider-content{display:flex;
	flex-direction:column;
	gap:var(--spacing-md);}
.uj-static-card-icon{display: flex;
  min-width: 56px;
  width: 56px;
  height: 56px;
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  color: var(--icon-success);
  background-color: var(--background-brand-light);}
.uj-static-card-icon i{font-size: 28px;}
.uj-static-card .uj-static-card-number{color: var(--text-primary-sa-flag);
  margin-bottom: 0;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  text-align: center;
  font-family: var(--ibmregular);}
.uj-static-card .uj-static-card-title{color: var(--text-display);
  font-family: var(--ibmregular);
  text-align: center;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  margin: 0;}
.uj-cards-wrapper{width: 100%;}
.eservices-container .col-md-4{padding:0;
	max-width:32%;}
.eservices-container .row{gap:var(--spacing-xl);
	margin: 0;}
.university-message .col-12, 
.news-advertisements .col-sm-12, 
.news-advertisements .col-12{margin-bottom: unset;
    padding: 0;}
.news-advertisements .col-sm-12.col-md-4{flex:1;}
.uj-card{display: flex;
  flex-direction: column;
  flex: 1;
  border: 1px solid var(--border-neutral-primary);
  padding: var(--spacing-xl);
  border-radius: var(--radius-lg);
  row-gap: var(--card-lg-gap);
  height: 100%;}
.bg-white{--tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));}
.bg-neutral{background-color: var(--background-neutral-50);}
.uj-card .uj-card-icon{display: flex;
	width: 48px;
	height: 48px;
	justify-content: center;
	align-items: center;
	border-radius: var(--radius-full);
	color: var(--icon-success);
	background-color: var(--background-brand-light);}
.uj-card .card-info{display:flex;
	flex-direction:column;
	gap:var(--spacing-md);}
.all-news-container .uj-card .card-info{padding: 0;}
.uj-card .uj-card-img{margin-right: auto;
  margin-left: auto;
  width: 100%;
  height: 270px;
  border-radius: var(--radius-md);
  overflow: hidden;}
.uj-card .uj-card-img img{width: 100%;
  height: 100%;
  object-fit: cover;}
.uj-card .uj-card-icon i{font-size: 24px;}
.uj-card h3{color: var(--text-display);
	text-align: start;
	margin: 0;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;}
p:empty{display:none!important;}
.uj-card .line-clamp-2{line-clamp: 2;
  -webkit-line-clamp: 2;}
.uj-card p{margin: 0;
  color: var(--text-display);}
.eservices-section .uj-card p,
.eservices-container .uj-card p{margin: 0;
  color: var(--text-display);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  height: 48px;}
.uj-card-date-content{display: flex;
  align-items: center;
  gap: var(--spacing-md);}
.hgi-stroke.hgi-link-04:before{font-size: 1rem;
    content: "";
    display: inline-block;
    width: 20px;
    height: 15px;
    background-image: url('data:image/svg+xml,<svg width="21" height="22" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M13.2632 2.31579C12.6527 2.31579 12.1579 1.79738 12.1579 1.15789C12.1579 0.518413 12.6527 0 13.2632 0H19.8947C20.5052 0 21 0.518413 21 1.15789V8.10526C21 8.74477 20.5052 9.26316 19.8947 9.26316C19.2843 9.26316 18.7895 8.74477 18.7895 8.10526V3.9533L10.7289 12.3977C10.2973 12.8499 9.59744 12.8499 9.16584 12.3977C8.7342 11.9455 8.7342 11.2124 9.16584 10.7602L17.2264 2.31579H13.2632ZM3.31579 4.63158C2.70537 4.63158 2.21053 5.14999 2.21053 5.78947V18.5263C2.21053 19.1658 2.70537 19.6842 3.31579 19.6842H15.4737C16.0841 19.6842 16.5789 19.1658 16.5789 18.5263V13.2434C16.5789 12.6039 17.0738 12.0855 17.6842 12.0855C18.2946 12.0855 18.7895 12.6039 18.7895 13.2434V18.5263C18.7895 20.4448 17.305 22 15.4737 22H3.31579C1.48453 22 0 20.4448 0 18.5263V5.78947C0 3.87102 1.48453 2.31579 3.31579 2.31579H8.35855C8.96899 2.31579 9.46382 2.8342 9.46382 3.47368C9.46382 4.11317 8.96899 4.63158 8.35855 4.63158H3.31579Z" fill="white"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;}
footer hr{margin: 0 0  var(--spacing-lg);
    background-color: var(--border-oncolor-transparent-30);}
.uj-card-date-content span{display: block;
    width: 10px;
    height: 10px;
    border-radius: 99999px;
    background-color: var(--button-background-primary-default);}
.uj-card-footer{display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;}
html:has(.news-home) :is(
    #block-universitystatistics,
    #block-universityeserviceshome,
    #block-universitymessage,
    #block-universityprograms,
    #block-universitynews,
    #block-universitytestimonials
) .uj-title-section-top > h1{display: inline-flex;
    align-items: center;
    gap: var(--spacing-2);}
.ul-footer i{display: flex;}
.js-form-item.js-form-type-radio:has(input[type="radio"]:checked):hover::before{content: "";
    position: absolute;
    top: 50%;
    right: -0.7rem;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background-color: var(--controls-control-ripple-effect);
    border-radius: var(--radius-full);
    z-index: 0;}
.eservices-container .js-form-item.js-form-type-radio:has(input[type="radio"]:checked):hover::before{display:none;}
.static-slider .swiper-pagination{margin-top:var(--spacing-7xl);}
.static-slider .swiper-pagination,
.advantage-slider .swiper-pagination,
.services-container .swiper .swiper-pagination,
.facilities .swiper-pagination,
.uni-programs .swiper-pagination{position:relative;
    bottom:0;
    left: 0;
    transform: none;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;}
.static-slider .swiper-button-prev{left:0px;}
.static-slider .swiper-button-next{left: 0px;}
.static-slider .swiper-button-prev:hover, .static-slider .swiper-button-next:hover{background-color: var(--button-background-neutral-hovered);}
footer{background-color: var(--background-sa-flag);
  color: var(--text-oncolor-primary);}
footer .row:first-of-type{margin: 0;
  gap: 24px;}
footer .row .col-md-6:last-child{padding: 0;
    padding-left: 0 !important;
    margin-bottom: unset;
    flex-wrap: wrap;
    gap: var(--spacing-4xl);}
.ul-footer{display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  margin: 0;}
footer ul{list-style: none;
  padding: 0;
  margin: 0 0 16px 0;}
footer ul li a{color: var(--link-oncolor);
  font-size: var(--text-sm);
  line-height: 20px;
  display: flex;
  gap: var(--link-sm-gap);}
footer ul li a:hover{color: var(--link-oncolor-hovered);
  text-decoration: underline;}
footer ul li a:active{color: var(--link-oncolor-pressed);
  text-decoration: underline;}
footer ul li a:focus-visible{color: var(--link-oncolor-focused);
  text-decoration: underline;
  outline: 2px solid var(--border-white);}
footer ul li a:visited{color: var(--link-oncolor-visited);}
.link-flex{display: flex;
  line-height: unset;}
.footer-icons{display: flex;
  gap: var(--spacing-md);
  margin-bottom: unset;}
.footer-icons a{text-decoration: none;
  width: 32px !important;
  height: 32px !important;
  display: flex;
  background-color: rgba(0, 0, 0, 0);
  border-radius: 4px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border-oncolor-transparent-30);}
.footer-icons a:hover{background-color: var(--button-background-transparent-hovered) !important;}
.footer-icons a:active{background-color: var(--button-background-transparent-pressed) !important;}
.footer-icons a:focus-visible{outline: none;
border: 2px solid var(--icon-oncolor);}
.footer-icons a i{font-size: 20px !important;
  color: var(--icon-oncolor);}
.footer-bottom{margin-top: var(--spacing-4xl);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-2xl);
  flex-wrap: wrap;}
.footer-bottom div:first-child{display:flex;
	flex-direction: column;
	gap: var(--spacing-xl);}
.footer-bottom ul{display: flex;
  gap: var(--spacing-xl);
  margin: unset;}
.footer-bottom ul li a{font-size: 14px;
 color: var(--link-oncolor);
 text-decoration: underline;}
.footer-img-log{display: flex;
    gap: var(--spacing-4xl);
    align-items: center;}
.footer-img-log a{height: 50px;
    width:auto;}
.footer-img-log a:first-child{width: 48.3875px;}
.footer-img-log a svg,
.footer-img-log a img{height:100%;
 width:100%;
    object-fit:contain;}
@media screen and (max-width: 991px){.tab-content{min-height: auto;
    padding: 10px 0;}}
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active{font-family: var(--IBM-b);
  background-color: transparent;
  border-color: transparent;
  border-radius: var(--radius-sm);
  
  gap: var(--tab-button-gap);}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover{isolation: isolate;
  border-color: transparent;}
.uj-tabs2-list__item{display: flex;
  padding: 16px;
  justify-content: center;
  align-items: center;
  border-radius:var(--radius-4) var(--radius-sm);
  color: var(--text-primary-paragraph);
  position: relative;
  white-space: nowrap;
  cursor: pointer;}
.uj-tabs2-list__item::after{content: "";
  display: block;
  position: absolute;
  bottom: -2px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 3px;
  border-radius: var(--radius-full);
  
  z-index: 1;}
.uj-tabs2-list__item:hover::after,
.uj-tabs2-list__item:active::after,
.uj-tabs2-list__item.active::after{content: "";
  display: block;
  position: absolute;
  bottom: -2px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 3px;
  border-radius: var(--radius-full)!important;
  background-color: var(--border-black);
  z-index: 1;}
.uj-tabs2-list__item.active::after{background-color: var(--border-primary);
  width: calc(100% - (2 * var(--spacing-xl)));}
.uj-tabs2-list__item.active:hover{background-color: transparent;
  color: var(--text-default);}
.uj-tabs2-list__item:hover{background-color: var(--button-background-neutral-hovered);
  color: var(--text-default);}
.pf-close{color: rgb(22, 22, 22);
	opacity: 1;
	background: 0px 0px;
	outline: none;
	align-items: center;
	width: max-content;
	margin-inline-start: auto;
	padding: 0 var(--buttons-lg-padding);
	height: 40px;
	gap: var(--buttons-lg-gap);
	border-radius: var(--radius-sm);
	font-size: var(--text-md);
	font-family: var(--ibmmedium);
	
	
	
	box-shadow: none !important;}
input[type="checkbox"]:not(:checked){appearance: none;
    position: relative;
    margin: 0px;
    background: transparent !important;
    border-radius: var(--radius-xs);
    border-color: #6C737F;
    box-shadow: none!important;}
html .js-form-item label{font-size: var(--text-sm);
    color: var(--text-default);
    width: fit-content;
    font-family: var(--ibmmedium);
    line-height: 24px;
    margin-bottom: 0px !important;}
.pf-check{display: flex;
	flex-direction: row;
	gap: var(--spacing-xl);
	padding: 0px;
	margin: 0px !important;
	font-family: 'IBM Plex Medium';
	font-size: var(--text-md);
	position: relative;
	z-index:1;
	width: fit-content;}
input[type="radio"]{appearance: none;
    cursor: pointer;
    z-index: 3;
    box-shadow: none;
    background-color: transparent;
    border: 1px solid rgb(108, 115, 127);
    border-radius: 999px;
    outline: none;
    transition: border-color 0.2s, background-color 0.2s, transform 0.1s;
    position: relative;
    width: 24px !important;
    height: 24px !important;
    margin: 0px !important;
    z-index: 4;}
.pf-choice input[type="radio"]{height: 0!important;
	width: 0!important;
	display: none!important;}
.pf-reasons-yes,
.pf-reasons-no{flex-direction: column;
	gap: var(--spacing-xl);
	display: flex !important;
	margin-bottom: 0!important;}
.pf-reasons-yes legend::after,
.pf-reasons-no legend::after{content: "\0028\064A\0645\0643\0646\0643\0020\062A\062D\062F\064A\062F\0020\062E\064A\0627\0631\0627\062A\0020\0645\062A\0639\062F\062F\0629\0029";
    color: var(--text-secondary-paragraph);
    font-size: var(--text-sm);
    font-weight: 500;
    font-family: var(--ibmRegular);
	margin-inline-start:.4rem;}
.page-feedback fieldset:has([type="radio"]){display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--spacing-xl);
	margin-top: var(--spacing-4xl);
	margin-bottom: var(--spacing-4xl);}
.page-feedback textarea{border: 1px solid var(--form-field-border-default);
	border-radius:var(--radius-sm);
	padding: var(--spacing-lg) var(--spacing-xl);
	position: relative;}
.page-feedback div:has(> textarea){height:fit-content;
	position:relative;}
.pf-check:hover::before{content: "";
    position: absolute;
    top: 50%;
    right: -0.5rem;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background-color: var(--controls-control-ripple-effect);
    border-radius: var(--radius-full);
    z-index: -1;}
.pf-check:has(input[type="checkbox"]):hover::before, 
input[type="checkbox"]:checked:hover::before{background-color: var(--controls-control-ripple-effect);
    right: -0.7rem;}
.page-feedback div:has(> textarea)::after{content: "";
	position: absolute;
	bottom: 6px;
	left: 0px;
	width: 100%;
	height: 2px;
	scale: 0;
	border-bottom-right-radius: var(--radius-sm);
	border-bottom-left-radius: var(--radius-sm);
	transition: 0.6s ease-in-out;
	background-color: rgb(0, 0, 0) !important;}
.page-feedback fieldset:has([type="radio"]) legend{width: fit-content;
	display: contents;}
.page-feedback{border:none;
	border-top: 2px solid var(--border-primary);
	margin-bottom: 0px !important;
	width: 100%;
	max-width: 100%;
	margin: 0;
	border-radius:0;
	line-height: unset;
	padding: var(--spacing-3xl) var(--spacing-xl);}
.feedback-widget__status{color:var(--text-default);
	font-size: var(--text-md);
	display:flex;
	align-items:center;
	gap:24px;}
.page-feedback > .pf-row{max-width: var(--container-max-width-desktop);
	 gap: 24px;
	 justify-content: space-between;
	 display: flex;
	 flex-direction: column-reverse;
	 margin-left: auto;
	 margin-right: auto;
	 align-items: flex-start;
	 margin-bottom: var(--spacing-4xl);
	 position: relative;
	 width: 100%;}
.page-feedback > .pf-row:not(:has(.pf-panel[hidden])){padding-bottom:0;}
.page-feedback:has(.pf-panel[hidden]) .pf-row{margin-bottom:0!important;
	flex-direction: column;}
.pf-summary{margin-top:0!important;}
.page-feedback .pf-footer,.pf-error{margin-top: var(--spacing-4xl);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;}
.page-feedback .pf-footer p{color:var(--text-default);
	font-size:var(--text-md);
	display: flex;
	flex-direction: column;}
.pf-submit{height: 40px;
    color: white;
    background-color: var(--button-background-primary-default);
    border-width: medium;
    border-style: none;
    border-color: currentcolor;
    border-image: initial;
    padding: 0 var(--buttons-lg-padding);
    border-radius: var(--radius-sm);
    cursor: pointer;
    display: flex;
    font-size: var(--text-md);
    line-height: 38px;}
.page-feedback:has(.pf-close[hidden]) > .pf-row fieldset{display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--spacing-xl);
	margin-bottom: unset !important;}
.page-feedback > .pf-row fieldset legend{display: contents;
	font-size: var(--text-md);
    color: var(--text-default);
    direction: initial;
    font-family: var(--ibmregular) !important;}
.page-feedback .pf-summary small{font-size:var(--text-sm);
	color:var(--text-default);
	margin:unset;}
.page-feedback > .pf-row .pf-choice{gap: var(--spacing-md);}
.pf-choice label{height: 40px;
	color: white;
	background-color: var(--button-background-primary-default);
	border-width: medium;
	border-style: none;
	border-color: currentcolor;
	border-image: initial;
	padding: 0 var(--buttons-lg-padding);
	border-radius: var(--radius-sm);
	cursor: pointer;
	display: flex;
	font-size: var(--text-md);
	line-height: 38px;
	min-width: fit-content;}
.pf-choice label:hover{background-color: var(--button-background-primary-hovered);
    color: white;}
@media(min-width:992px){.page-feedback > .pf-row .pf-choice{gap: var(--spacing-xl);}}
@media(min-width:992px){.page-feedback > .pf-row fieldset, .page-feedback:has(.pf-close[hidden]) > .pf-row fieldset,.page-feedback fieldset:has([type="radio"]){flex-direction:row;
	align-items:center;}}
@media(min-width:992px){.page-feedback > .pf-row fieldset{gap: var(--spacing-3xl)!important;}}
@media(min-width:992px){.page-feedback > .pf-row,.page-feedback > .pf-row:not(:has(.pf-panel[hidden])){margin-bottom: var(--spacing-4xl);
	flex-direction: row;
	align-items: center;}}
@media(min-width:992px){.pf-close{top:unset;}}
@media(min-width:992px){.page-feedback{padding: var(--spacing-3xl) 0 var(--spacing-3xl);}}
@media(min-width:992px){.page-feedback{}}
@media(min-width:992px){footer .row .col-md-6:last-child{margin-bottom: 20px;}}
@media(min-width:992px){.footer-icons{margin-bottom: var(--spacing-4xl);}}
@media(min-width:992px){.footer-bottom{margin-top: var(--spacing-4xl);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-2xl);
  flex-wrap: wrap;}}
@media(min-width:992px){.nds-banner-section .banner-text p{width: 765px;}}
@media(min-width:992px){footer .row .col-md-6:not(:last-child){padding: 0;
    margin: 0;
    flex: 1;}}
html:not(.uoj-css-ready) .swiper{min-width:0;max-width:100%}