/* 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 with generate-critical-css.js. The full files load right after, without blocking the first paint.
   Generated 2026-11-11 from 217 page/width checks (widths in px):
   /ar (1440/768/375), /ar/الأخبار-و-الإعلانات (375/1440/768), /ar/معالي-نائب-وزير-الحج-والعمرة-يزور-جناح-الجامعة-المشارك-في-معرض-الحج-والعمرة-2026 (375/1440/768), /ar/عن-الجامعة (375/1440/768), /ar/البرامج-الأكاديمية (375/1440/768), /ar/الكليات-والمعاهد-التعليمية (375/1440/768), /ar/تواصل-معنا (375/1440/768), /ar/الخدمات-الإلكترونية (375/1440/768), /ar/الأسئلة-الشائعة (375/1440/768), /en (375/1440/768), /ar/سياسات-البوابة-الإلكترونية (1440/375/768), /ar/التقويم-الجامعي (1440/375/768), /ar/القيادة-العليا (1440/375/768), /ar/دليل-الأكاديميين (1440/375/768), /ar/طلاب-المستقبل (1440/375/768), /ar/الطلاب-الحاليون (1440/375/768), /ar/الخريجون-0 (1440/375/768), /ar/المنسوبون (1440/375/768), /ar/سعادة-الأستاذ-الدكتور-عبيد-بن-علي-عطيان-آل-مظف (1440/375/768), /ar/سياسات-الجامعة (1440/375/768), /ar/البيانات-المفتوحة (1440/375/768), /ar/الهيكل-التنظيمي-للجامعة (1440/375/768), /ar/uj-vision2030 (1440/375/768), /ar/انضم-لفريقنا (1440/375/768), /ar/معلومات-الطوارئ (1440/375/768), /ar/خريطة-الموقع (1440/375/768), /ar/برامج-البكالوريوس (1440/375/768), /ar/برامج-الدبلوم (1440/375/768), /ar/انضم-لطلابنا (1440/375/768), /ar/innovate (1440/375/768), /ar/البحث-والابتكار (1440/375/768), /ar/الحياة-في-الجامعة (1440/375/768), /ar/Service-esp (1440/375/768), /ar/البرامج-الأكاديمية-0 (1440/375/768), /ar/البحث-والابتكار-1 (1440/375/768), /ar/الجاهزية-المهنية (1440/375/768), /ar/التحول-الرقمي-والذكاء-الاصطناعي (1440/375/768), /ar/الأثر-المجتمعي (1440/375/768), /ar/الشراكات-العالمية (1440/375/768), /ar/الإنجازات-والجوائز (1440/375/768), /ar/الموهبة-والإبداع (1440/375/768), /ar/الخريطة (1440/375/768), /ar/خدمات-الأشخاص-ذوي-الإعاقة (1440/375/768), /ar/إستطلاع-الرأي (1440/375/768), /ar/تقديم-بلاغ-أمني (1440/375/768), /ar/جامعة-جدة-تنظم-الورشة-التثقيفية-«اكتشف-متعة-الهايكينج» (1440/375/768), /en/‏-electronic-gate-policy (1440/768), /en/senior-leadership (1440/768), /en/academic-programs (1440/768), /en/academics-guide (1440/768), /en/e-services (1440/768), /en/future-students (1440/768), /en/current-students (1440/768), /en/alumni (1440/768), /en/university-staff (1440/768), /en/about-university (1440/768), /en/his-excellency-prof-obaid-bin-ali-atiyan-al-mudhaff (1440/768), /en/university-policies (1440/768), /en/open-data (1440/768), /en/university-organizational-structure (1440/768), /en/frequently-asked-questions (1440/768), /en/emergency-information (1440/768), /en/sitemap (1440/768), /en/diploma-programs (1440/768), /en/academic-calendar-0 (1440/768), /en/innovate (1440/768), /en/research-innovation (1440/768), /en/life-university (1440/768), /en/academic-excellence (1440/768), /en/research-and-innovation (1440/768), /en/career-readiness (1440/768), /en/digital-transformation-and-ai (1440/768), /en/community-impact (1440/768), /en/achievements-and-awards (1440/768), /en/global-partnerships (1440/768), /en/talent-and-creativity (1440/768), /en/news-and-announcements (1440/768), /en/university-jeddah-participates-16th-world-scout-moot (1440/768), /en/map (1440/768), /en/services-people-special-needs (1440/768), /en/poll (1440/768), /en/contact-us (1440/768), /en/submit-security-report (1440/768), /en/join-our-students (1440/768), /ar/login (1440/768/375) */
/* bootstrap.min.css */
@-webkit-keyframes spinner-border{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}
@keyframes spinner-border{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}
:root{--white:#fff}
*,::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}
ol ol,ol ul,ul ol,ul ul{margin-bottom:0}
dt{font-weight:700}
dd{margin-bottom:.5rem;margin-left:0}
b,strong{font-weight:bolder}
small{font-size:80%}
a{color:#007bff;text-decoration:none;background-color:transparent}
a:hover{color:#0056b3;text-decoration:underline}
a:not([href]):not([class]){color:inherit;text-decoration:none}
a:not([href]):not([class]):hover{color:inherit;text-decoration:none}
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}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}
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}
::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}
summary{display:list-item;cursor:pointer}
[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}
.h5,h5{font-size:1.25rem}
.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}
@media (min-width:576px){
.col-sm-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}
}
@media (min-width:768px){
.col-md-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}
.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%}
.col-lg-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}
.col-lg-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
}
@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}
@media (prefers-reduced-motion:reduce){
.form-control{transition:none}
}
.form-control::-ms-expand{background-color:transparent;border:0}
.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::-moz-placeholder{color:#6c757d;opacity:1}
.form-control:-ms-input-placeholder{color:#6c757d;opacity:1}
.form-control::-ms-input-placeholder{color:#6c757d;opacity:1}
.form-control::placeholder{color:#6c757d;opacity:1}
.form-text{display:block;margin-top:.25rem}
.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}
@media (prefers-reduced-motion:reduce){
.btn{transition:none}
}
.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)}
.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}
.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}
.navbar-expand-lg .navbar-nav{-ms-flex-direction:row;flex-direction:row}
.navbar-expand-lg .navbar-nav .nav-link{padding-right:.5rem;padding-left:.5rem}
.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}
.navbar-expand-lg .navbar-collapse{display:-ms-flexbox!important;display:flex!important;-ms-flex-preferred-size:auto;flex-basis:auto}
.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-title{margin-bottom:.75rem}
.card-text:last-child{margin-bottom:0}
.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)}
.modal{position:fixed;top:0;left:0;z-index:1050;display:none;width:100%;height:100%;overflow:hidden;outline:0}
.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}
@media (prefers-reduced-motion:reduce){
.spinner-border{-webkit-animation-duration:1.5s;animation-duration:1.5s}
}
.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}
.d-lg-flex{display:-ms-flexbox!important;display:flex!important}
}
.flex-column{-ms-flex-direction:column!important;flex-direction:column!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}
.flex-lg-column{-ms-flex-direction:column!important;flex-direction:column!important}
.justify-content-lg-start{-ms-flex-pack:start!important;justify-content:flex-start!important}
}
.m-0{margin:0!important}
.p-0{padding:0!important}
@media print{
*,::after,::before{text-shadow:none!important;box-shadow:none!important}
a:not(.btn){text-decoration:underline}
img,tr{page-break-inside:avoid}
h2,h3,p{orphans:3;widows:3}
h2,h3{page-break-after:avoid}
body{min-width:992px!important}
.container{min-width:992px!important}
.navbar{display:none}
}
/* style.css */
@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;}
@keyframes cc-rise{0% { transform: translateY(24px); opacity: 0; } 100% { transform: translateY(0px); opacity: 1; }}
:root{--text-default: #161616;--link-neutral: #384250;--colors-base-white: #ffffff;--colors-base-black: #000000;--display-lg: 3rem;--display-md: 2.25rem;--display-sm: 1.875rem;--display-xs: 1.5rem;--text-lg: 1.125rem;--text-md: 1rem;--text-sm: 0.875rem;--text-xs: 0.75rem;--regular: 400;--medium: 500;--bold: 700;--colors-brand-600: #1b8354;--colors-brand-700: #166a45;-xs: 0 1px 2px 0 rgba(16, 24, 40, .05);--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);--radius-xs: 4px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 10px;--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-320: 1280px;--spacing-none: var(--spacing-0);--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);--container-padding-mobile: var(--spacing-4);--container-max-width-desktop: var(--spacing-320);--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-320: 1280px;--spacing-none: var(--spacing-0);--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);--container-padding-mobile: var(--spacing-4);--container-max-width-desktop: var(--spacing-320);--radius-xs: 4px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 10px;--radius-4xl: 24px;--radius-full: 9999px;--colors-base-white: #ffffff;--colors-base-black: #000000;--colors-brand-600: #1B8354;--colors-brand-700: #166A45;--colors-gray-neutral-100: #F3F4F6;--colors-green-700: #087443;--colors-green-900: #084C2E;--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;--radius-2: 2px;--radius-4: 4px;--radius-8: 8px;--radius-16: 16px;--radius-9999: 9999px;--radius-xs: var(--radius-2);--radius-sm: var(--radius-4);--radius-md: var(--radius-8);--radius-lg: var(--radius-16);--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-400: #54c08a;--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-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-700: #384250;--colors-neutral-800: #1f2a37;--colors-green-700: #067647;--colors-green-900: #074c30;--colors-alpha-alpha-white-20: #ffffff33;--colors-alpha-alpha-white-30: #ffffff4c;--colors-alpha-alpha-white-60: #ffffff99;--colors-alpha-alpha-white-80: #ffffffcc;--colors-alpha-alpha-white-90: #ffffffe5;--background-white: var(--colors-base-white);--background-body: var(--colors-neutral-50);--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-50: var(--colors-neutral-50);--background-primary-400: var(--colors-primary-sa-flag-400);--background-primary-25: var(--colors-primary-sa-flag-25);--background-sa-flag: var(--colors-green-900);--text-default: var(--colors-base-black);--text-primary-sa-flag: var(--colors-primary-sa-flag-800);--text-display: var(--colors-neutral-800);--text-primary-paragraph: var(--colors-neutral-700);--text-oncolor-primary: var(--colors-base-white);--text-default-disabled: var(--colors-neutral-400);--border-white: var(--colors-base-white);--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-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-focused: var(--colors-neutral-100);--button-background-transparent-hovered: var(--alpha-white-20);--border-black: var(--colors-base-black);--border-primary: var(--colors-primary-sa-flag-600-primary);--border-neutral-primary: var(--colors-neutral-300);--border-neutral-secondary: var(--colors-neutral-200);--border-oncolor-transparent-30: var(--colors-alpha-alpha-white-30);--link-primary: var(--colors-primary-sa-flag-600-primary);--link-primary-hovered: var(--colors-primary-sa-flag-400);--link-neutral: var(--colors-neutral-700);--link-neutral-hovered: var(--colors-neutral-500);--link-oncolor: var(--colors-base-white);--link-oncolor-hovered: var(--colors-alpha-alpha-white-80);--link-oncolor-pressed: var(--colors-alpha-alpha-white-60);--link-oncolor-focused: var(--colors-base-white);--link-oncolor-visited: var(--colors-alpha-alpha-white-90);--tag-background-neutral-light: var(--colors-neutral-50);--tag-text-neutral: var(--colors-neutral-800);--controls-control-ripple-effect: var(--colors-neutral-200);--stepper-button-completed: var(--colors-primary-sa-flag-600-primary);--alpha-white-20: var(--colors-alpha-alpha-white-20);--icon-default: var(--colors-base-black);--icon-success: var(--colors-green-700);--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);--spacing-0: 0px;--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-320: 1280px;--ibmmedium: "IBM Medium"}
@media only screen and (min-width: 1025px){
:root{--tab-button-gap: var(--spacing-1);--tab-horizontal-tab-md-button-v-padding: var(--spacing-3);--tab-horizontal-tab-md-button-h-padding: var(--spacing-4);--buttons-lg-gap: var(--spacing-1);--buttons-lg-padding: var(--spacing-4);--buttons-md-padding: var(--spacing-3);--link-sm-gap: var(--spacing-1);--spacing-none: var(--spacing-0);--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);--card-lg-gap: var(--spacing-6)}
}
@media only screen and (min-width: 768px){
:root{--tab-button-gap: var(--spacing-1);--tab-horizontal-tab-md-button-v-padding: var(--spacing-3);--tab-horizontal-tab-md-button-h-padding: var(--spacing-4);--buttons-lg-gap: var(--spacing-1);--buttons-lg-padding: var(--spacing-4);--buttons-md-padding: var(--spacing-3);--link-sm-gap: var(--spacing-1);--spacing-none: var(--spacing-0);--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);--card-lg-gap: var(--spacing-6)}
}
@media only screen and (max-width: 767px){
:root{--tab-button-gap: var(--spacing-1);--tab-horizontal-tab-md-button-v-padding: var(--spacing-2);--tab-horizontal-tab-md-button-h-padding: var(--spacing-3);--buttons-lg-gap: var(--spacing-1);--buttons-lg-padding: var(--spacing-4);--buttons-md-padding: var(--spacing-3);--link-sm-gap: var(--spacing-1);--spacing-none: var(--spacing-0);--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);--card-lg-gap: var(--spacing-4)}
}
:root{--ink: #1f2328;--muted: #5b6470;--card: #ffffff;--focus: #2f6fed;--radius: 10px;--IBM-b: "IBM Plex Bold";--IBM-regular: "IBM Plex Regular";--IBM-sb: "IBM Plex SemiBold";--blue-color: #22B0E9;--blue-color-hover: #197ca3;--red-color: #B62C3F;--green-color: #0DA290;--navy-blue-color: #00162E;--txt-color: #7e7e7e;--black-color: #545454;--background: #FAFAFA;--transition: all .3s ease-in-out}
.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)}
@media (prefers-reduced-motion: reduce){
.cc-panel{animation: auto ease 0s 1 normal none running none}
}
.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;border-color: transparent!important}
.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)}
.cc-btn-primary:focus{background: var(--button-background-primary-pressed)!important;box-shadow: none!important}
@media (max-width: 480px){
.cc-body{padding: 20px 18px 18px}
.cc-title{font-size: 16px}
.cc-overlay{padding: 0px;align-items: flex-end}
.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)}
.div404 h5{margin: var(--spacing-7xl) 0 var(--spacing-xl);font-size: var(--display-xs);font-family: var(--IBM-sb)}
.div404 p:not(:last-child){margin-bottom: var(--spacing-4xl)}
.div404 .btn404:hover{background: var(--button-background-primary-hovered)}
.swiper-button-next:after, .swiper-button-prev:after{display:none}
.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;height:40px;margin-top:1rem!important}
.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 .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-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}
html, body{-webkit-user-select: text;user-select: text}
a:focus-visible{outline: none}
ul{list-style-type: none}
.goals.access{display: flex;flex-wrap: wrap;justify-content: flex-start;align-items: center}
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}
div#associatesLoader{right: 49%}
.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}
.survey-msg .survey-title{font-size: 1.4rem;font-family: var(--IBM-b);padding-bottom: 1.5rem;margin: 1.5rem 0;border-bottom: 1px solid #E0E0E0}
.survey-msg .msg-container{line-height: 2}
.map-filter{min-width: 7.4rem;text-align: right;position: relative;min-height: 3.5rem;opacity: 1;display: flex;flex-direction: column;border-radius: 0.8rem;background-color: white;border-left: 1px solid #e4e4e4}
.map-filter span:first-child{width: 100%;display: block;margin: auto;transition: all .3s ease-in-out}
.map-filter span:first-child::after{content: "";position: absolute;background-image: url('/themes/uoj_theme/media/Icon\ feather-arrow-down.svg');top: 0;left: 1rem;background-size: 100%;background-position: center;background-repeat: no-repeat;height: 100%;width: .75rem}
#map .leaflet-bar a:hover{background-color: #ebebeb}
#map .leaflet-control-fullscreen-button:hover{background-color: #ebebeb !important}
.dropdown .map-filter:hover{background-color: #ebebeb}
.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%}
.disabled .map-filter span{opacity: 0.6}
.dropdown.main .map-filter{border-top-left-radius: 0;border-bottom-left-radius: 0}
.select-department .dropdown .map-filter{border-left: none;border-top-right-radius: 0;border-bottom-right-radius: 0}
.select-location .dropdown .map-filter{border-radius: 0}
.map-filter span{font-weight: var(--default-font-sb)}
.disabled .map-filter span:first-child::after{background-image: url(/themes/uoj_theme/media/Icon\ feather-arrow-down-disabled.svg)}
.dropdown.clicked #clickedValue, #clickedFaculty, #clickedDepartment, #clickedBuilding{font-size: .9rem !important;color: black !important;max-width: 13ch;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;transition: .3s all ease}
.dropdown .dropdown-menu#departments{display: none}
.select-location.disabled, .select-department.disabled{pointer-events: none}
.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-control-zoom{border: none;outline: none;box-shadow: none}
#map .leaflet-control-fullscreen-button{border-radius: 0.8rem !important;color: var(--blue-color) !important;background-color: white !important;background-image: url(/themes/uoj_theme/media/fullscreen-svgrepo-com.svg);background-size: 50%;background-position: center;height: 2.4rem;width: 2.4rem}
.leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar{border: none !important;outline: none !important;box-shadow: none !important;margin-left: 0 !important}
#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}
#map .leaflet-control-fullscreen-button{border-radius: 0.8rem !important;color: var(--blue-color) !important;background-color: #ffffffe6 !important;background-image: url(/themes/uoj_theme/media/fullscreen-svgrepo-com.svg);background-size: 45%;background-position: center;height: 2.8rem;width: 2.6rem;backdrop-filter: blur(10px);-webskit-backdrop-filter: blur(10px)}
.leaflet-control-zoom .leaflet-control-zoom-in{margin-bottom: 0 !important;border-top-left-radius: .8rem !important;border-top-right-radius: .8rem !important}
.leaflet-control-zoom .leaflet-control-zoom-out{margin-top: 0 !important;border-bottom-left-radius: .8rem !important;border-bottom-right-radius: .8rem !important}
.dropdown .map-filter{padding: 0.3rem .6rem}
.dropdown .map-filter:hover{background-color: #ebebeb}
.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}
.main-menu-container .menu-links{padding: 0 5rem;width: 100%}
.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, .hamburger-submenu .header .title{cursor: pointer}
.hamburger-submenu .go-back .icon{transform: scaleX(0)}
.hamburger-submenu .header .icon{height: 2rem;width: 2rem}
.hamburger-submenu .header .title{color: var(--blue-color);font-size: 1.5rem}
.hamburger-submenu .close-btn{display: block !important;top: 1.7rem !important;left: 1.7rem}
.hamburger-submenu ul{list-style-type: none;padding: 0}
.hamburger-submenu ul li{display: block;font-size: 1.4rem;padding: 0.8rem 0rem;border-bottom: 1px solid rgb(208, 208, 207)}
.hamburger-submenu ul li:last-child{border-bottom: none}
.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}
.right-section img{transform: scaleX(-1)}
.filter-labels{display: flex;align-items: center;overflow-x: auto;overflow-y: hidden;margin: var(--spacing-4xl) 0 var(--spacing-5xl)}
.filter-labels span{margin-left: .4rem;min-width: max-content}
.filter-labels label{cursor: pointer;background-color: #f3f4f6;padding: var(--spacing-xs) var(--spacing-lg);margin: 0;width: 100%;border-radius: var(--radius-sm);font-size: var(--text-md);height: 40px;color: var(--text-default);flex-shrink: inherit;text-align: center;align-content: center}
.filters-container{display: flex;align-items: baseline;justify-content: space-between;margin-top: 2rem;margin-bottom: var(--spacing-3xl);gap: var(--spacing-xl)}
.filters-container .filter-btn{display: flex;align-items: center;cursor: pointer}
.filters-container .search-box{width: 100%}
.news-content .news-thumbnail{position: relative;z-index: 0}
.news-content .news-thumbnail img{z-index: 1}
.card{border: none;border-radius: 0;width: 100%}
#clickedValue, #clickedFaculty, #clickedBuilding{font-size: .7rem;padding-left: 2rem;color: #878787}
.menu-div{cursor: pointer;color: var(--black-color);transition: all .3s ease-in-out}
.menu-div:hover{color: var(--blue-color)}
.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}
.news-content h1{font-size: var(--display-xs);padding: 0!important;margin: var(--spacing-xl) 0;font-family: var(--IBM-b)}
.masonry-grid_item.column{width: 100%}
.container{max-width: 100%;padding-left: 1rem;padding-right: 1rem}
.vertical-line{border-left: 0.03rem solid rgba(54, 54, 54, 0.29)}
.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)}
.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}
.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 .logo img{width: 4rem}
.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 .social-icons a:first-child:hover svg g:first-child{fill: rgb(255 0 0 / 20%)}
.main-menu-container .main-menu .social-icons a:first-child:hover svg g:last-child path, .main-menu-container .main-menu .social-icons a:first-child:hover svg g:first-child circle:last-child{stroke: var(--red-color)}
.main-menu-container .main-menu .social-icons a:nth-child(2):hover svg g:first-child{fill: rgb(13 162 144 / 20%)}
.main-menu-container .main-menu .social-icons a:nth-child(2):hover svg path{fill: var(--green-color)}
.main-menu-container .main-menu .social-icons a:nth-child(2):hover svg g circle:last-child{stroke: var(--green-color)}
.main-menu-container .main-menu .social-icons a:nth-child(3):hover svg g:first-child ellipse:last-child{fill: rgb(0 34 71 / 20%);stroke: var(--navy-blue-color)}
.main-menu-container .main-menu .social-icons a:nth-child(3):hover svg g:last-child g>path{fill: var(--navy-blue-color);stroke: var(--navy-blue-color)}
.main-menu-container .main-menu .social-icons a:last-child:hover svg g:first-child path:first-child{fill: rgb(34 176 233 / 20%)}
.main-menu-container .main-menu .social-icons a:last-child:hover svg g:first-child path:last-child{fill: var(--blue-color)}
.main-menu-container .main-menu .social-icons a:last-child:hover svg>path{stroke: var(--blue-color)}
.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 .main-logo img{width: 90%}
.main-menu .menu-content .menu-links ul{list-style: none;margin: 0px;padding: 0px}
.main-menu .menu-content .menu-links ul a{color: var(--black-color);transition: all 0.3s ease 0s}
.main-menu .menu-content .menu-links ul a:hover{color: var(--blue-color);text-decoration: none;transition: all 0.3s ease 0s}
.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)}
.main-menu .menu-content .sign-in a.btn, .hamburger-submenu .sign-in a.btn{width: fit-content;background-color: var(--blue-color);padding: 1rem 4rem;font-family: var(--IBM-sb);color: white;transition: all 0.3s ease 0s;cursor: pointer}
.main-menu .menu-content .sign-in a.btn:hover, .hamburger-submenu .sign-in a.btn:hover{background-color: var(--blue-color-hover)}
.main-menu .social-icons a:last-child{margin-bottom: 0px}
.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}
.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)}
.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}
.news-advertisements{width: 100%}
h1.title{color: var(--text-default);font-family: var(--IBM-b);font-size: var(--display-sm);position: relative}
.news-detail-img img{height: 26.5rem !important;width: 100% !important;object-fit: cover}
.navbar .navbar-brand{display: flex;margin: 0;padding: 0;align-items: center}
.vertical-line{height: 3rem;margin: 0px 0.7rem}
.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}
.leaflet-control-zoom.leaflet-bar.leaflet-control{margin: 0 !important}
.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)}
.filters-container .filter-btn .icon svg path{stroke: var(--text-default)}
.associates-search .search-btn label{display: none}
.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 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 .input-group.mb-3, .associates-search{display: flex;padding: 0px;height: 40px;width: 100%;gap: var(--spacing-3xl)}
.associates-search .dropdown{border-radius: var(--radius-sm);background-color: white;height: 100%;display: flex;transition: all 0.3s ease 0s;border: 1px solid #9DA4AE}
.associates-search .dropdown button{padding: 0px 1rem;border: none}
.associates-search .form-control{height: 100%;border: 1px solid #9DA4AE;border-radius: var(--radius-sm)!important;height: 40px}
.uni-side ins, .users ins{display: none;width: 1.5rem;margin-right: 0.2rem;display: flex;align-items: center;position: relative}
.uni-side label, .users label{margin-right: -.7rem}
.uni-side button::before, .users button::before{display: none}
.uni-side ins::before{content: '';position: absolute;background-image: url('/themes/uoj_theme/media/chevron-down-green.svg');background-repeat: no-repeat;background-size: 100%;height: 0.5rem;width: 0.7rem;right: -10px;top: 50%;transform: translateY(-50%);display: block}
.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}
.associates-search .dropdown button.btn.btn-light.dropdown-toggle{border-right: none}
.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>')}
.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 .more-info{display: flex;flex-direction: column;align-items: start;margin: 1rem auto}
.news-content .more-info .date{display: flex;align-items: center;font-size: var(--text-md);flex-direction: row-reverse;gap: var(--spacing-sm)}
.news-content .more-info .date span{margin-left: 1rem;display: flex}
.news-content .more-info .share-options{display: flex;align-items: center;font-family: var(--IBM-sb);font-size: 0.9rem;color: rgb(107, 107, 107);display: none}
.news-content{margin-bottom: 3rem;min-height: 40rem;display: flex;flex-direction: row-reverse;flex-wrap: wrap;justify-content: space-between}
.news-content .news-thumbnail{margin-top: 2rem;display: flex;float: left;width: auto}
.news-content .news-thumbnail img, .news-thumbnail img{height: 28rem;width: 100%;object-fit: cover;object-position: center;border-radius: var(--radius-lg)}
.news-content .news-thumbnail img{object-fit: contain}
.news-thumbnail.news-detail-img{margin-top: 0rem}
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%}
.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 .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}
.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}
.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)}
.goals .card-text, .goals .card-title, .volunteering .volunteer-tiles .card .card-title{width: 95%;font-size: var(--text-lg);font-family: var(--ibmbold)}
.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}
.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}
.form-actions.js-form-wrapper.form-wrapper{width: 100%}
.login .left-section{margin-top: unset}
.login .right-section{top: 0}
.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}
.service.col-md-4 .image{margin-bottom: .8rem;width: 8rem}
.service.col-md-4 .image img{height: 100%;width: 100%;object-fit: scale-down}
.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}
.available-programs{background-color: var(--background-neutral-50);position: relative;overflow: hidden}
.available-prog-swiper{height: 100% !important}
.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}
::-webkit-input-placeholder{color: #999}
:-moz-placeholder{color: #999}
::-moz-placeholder{color: #999}
:-ms-input-placeholder{color: #999}
form .error-msg-span{color: red;margin-right: 1rem}
.loadMore.uj-btn{display: flex;margin: auto;width: fit-content}
.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 label{cursor: pointer;padding: 6px 8px}
#AdfsLoginSpinner, #NafathLoginSpinner{display: none}
.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)}
.login .code-verification{margin: 2rem 0;background-color: #FAFAFA;border: 1px solid #E8E8E8;border-radius: 0.6rem;padding: 1.2rem 0;display: flex;justify-content: center;flex-direction: column;align-items: center}
.spinner-loader-container .spinner-border{border: 0.25em solid var(--blue-color);border-right-color: transparent}
.spinner-loader-container{display: flex;justify-content: center;align-items: center;height: 100%}
.research-int .spinner-loader-container{height: unset;position: relative;display: block}
.research-int .spinner-loader-container .spinner-border.result{top: 50%;left: 46%;position: absolute}
.steps-app{padding-top: 0;padding-bottom: 0;background-color: #ECECEC}
.associates-tiles .spinner-border{position: absolute}
.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}
.associates-tiles{background-color: var(--background);padding-bottom: 6rem}
.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}
.life-jeddah{margin-top: 2rem;background-color: var(--background-neutral-50)}
.life-jeddah .uj-container{display: flex;flex-direction: column;gap: var(--spacing-3xl)}
.tabular-view .tab-content .tab-pane .d-flex{flex-direction: column}
.tab-pane .row{flex-direction: column}
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}
.test{position: absolute;top: 9rem;right: 1rem;display: flex;border: 1px solid #e2e2e2;border-radius: 1rem;transition: .3s all ease;align-items: center;z-index: 2}
.leaflet-control{border-radius: 0 !important}
.left-section{margin-top: 1.6rem}
.right-section{position: relative;top: -.7rem;padding: 0 2.2rem;display: flex;flex-direction: column;gap: var(--spacing-3xl)}
.details-div{width: 100%;height: 100%;background-color: white;z-index: 102;position: fixed;top: 0;left: 0;box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;transform: translateX(-130vw);transition: .3s all ease}
.map-location-details .details-div .close-btn:hover{opacity: .7}
.map-location-details .details-div .details-div-desc{padding: 2rem;line-height: 2.2;color: #585858}
.map-location-details .details-div-options{padding: 1.3rem 2rem;border-top: 1px solid #E8E8E8;border-bottom: 1px solid #E8E8E8}
.map-location-details .details-div-options a svg{width: 4.2rem;height: 4.2rem}
.map-location-details .details-div-options a:not(:last-child){margin-left: 1.5rem}
.details-div .cover{width: 100%;height: 18rem}
.details-div .cover img{width: 100%;height: 100%;object-fit: cover}
.details-div .details{padding: 1.8rem 1.5rem 1rem}
.details #detailsTitle{font-size: 1.8rem}
.details-div-options #Call ellipse, .details-div-options #Mail ellipse, .details-div-options #Direction ellipse, .details-div-options #Share ellipse{fill: rgba(34, 176, 233, 0.1);transition: .3s all ease}
.map-location-details .details-div-options{padding: 1.3rem 2rem;border-top: 1px solid #E8E8E8;border-bottom: 1px solid #E8E8E8}
.map-location-details .details-div-options a svg{width: 4.2rem;height: 4.2rem}
.map-location-details .details-div-options a:not(:last-child){margin-left: 1.5rem}
.details-div-options #Call:hover ellipse, .details-div-options #Mail:hover ellipse, .details-div-options #Direction:hover ellipse, .details-div-options #Share:hover ellipse, .details-div-options #Direction path{fill: var(--blue-color)}
.details-div-options #Call:hover path, .details-div-options #Mail:hover path, .details-div-options #Share:hover path{stroke: white}
.details-div-options #Call path, .details-div-options #Mail path, .details-div-options #Share path{stroke: var(--blue-color)}
.details-div-options #Direction:hover path{fill: white}
#departments{width: auto;padding: 0 .5rem;display: flex;outline: none;border: none;justify-content: center;align-items: center;height: 50px;background-color: white;z-index: 99 !important;border: 2px solid rgba(0, 0, 0, 0.2);font-family: var(--"IBM Plex Regular");font-size: 1rem;margin-left: 1rem}
.research-int .res-title{font-size: 2rem;margin-bottom: 0rem;padding: 1rem 2rem}
.research-int{transform: translateX(-100%);position: fixed;transition: all .3s ease-in-out;background-color: white;left: 0;height: 100vh;top: 0;width: 100%;z-index: 101}
.research-int .close-btn{position: absolute;top: 1rem;display: none;position: absolute;z-index: 99;left: 1.5rem}
.research-int .image-container{height: 11rem}
.research-int .image-container img{height: 100%;width: 100%;object-fit: cover}
.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;gap: var(--buttons-lg-gap);padding: var(--spacing-none) var(--spacing-xl);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-cv .president-informations::after{display: none}
.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)}
.uj-card .social-icons{display: flex;align-items: center;gap: var(--spacing-md);margin: 0 auto}
.president-informations .bottom-section, .agent-cv .bottom-section{display: flex;flex-direction: column}
.president-informations .bottom-section .nationality{margin-top: 1rem;display: flex;flex-direction: column;align-items: center}
.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)}
.clearFContainer{display: flex;justify-content: flex-end;margin-bottom: 1rem}
.clear-filter span{text-decoration: underline;color: var(--link-primary);cursor: pointer}
.map-location-details .details-div .details-div-desc{padding: 2rem;line-height: 2.2;color: #585858}
#SearchLoadMore, #UniversityPoliciesLoader{display: none;margin: 1rem auto}
.details #detailsTitle{margin-bottom: 0;font-size: 1.4rem}
.map-location-details .details-div-options{padding: 1rem 2rem;border-top: 1px solid #E8E8E8;border-bottom: 1px solid #E8E8E8}
.map-location-details .details-div-options a:not(:last-child){margin-left: 1.5rem}
.map-location-details .details-div .details-div-desc{padding: 1rem 2rem;line-height: 2.2;color: #585858}
.map-location-details .details-div-options a svg{width: 3rem;height: 3rem}
.map-location-details .details-div .close-btn{position: absolute;right: 1.5rem;top: 1.5rem;opacity: 1;border-radius: 50%;background-color: rgba(0, 0, 0, .5);transition: .3s all ease;cursor: pointer;height: 2.8rem;width: 2.8rem}
.map-location-details .details-div .close-btn svg{width: 100%;height: 100%;object-fit: cover}
.map-location-details .details-div .close-btn:hover{opacity: .7}
.empty{display: flex;flex-direction: column;align-items: center;justify-content: center}
.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}
.login{display: flex;flex-direction: column;align-items: flex-start;position: relative;background-color: white}
.login .right-section{position: relative;padding: 2rem 1rem;display: flex;flex-direction: column;height: auto;background: linear-gradient(196deg, #22B0E9, #187396, #013874, #77478E)}
.login .right-section h4.title{font-size: 1.8rem;color: white;margin-bottom: 1.5rem;margin-top: 4rem}
.login .right-section p.description{color: white;margin: 0;padding: 0;font-weight: 500}
.login .right-section .header .small-logo img{height: 4rem;width: 4rem}
.login .right-section .header .long-logo img{width: 11rem;height: 4.5rem;object-fit: contain}
.login .right-section img{transform: scaleX(1)}
.login .right-section .header{display: flex;align-items: center}
.login .right-section::before{content: "";position: absolute;top: 0;left: 0;background-image: url("/themes/uoj_theme/media/login-pattern.png");background-size: 100%;background-position: left bottom;height: 100%;width: 100%;background-repeat: no-repeat}
.login .left-section{padding: 2rem 1rem;position: relative;height: auto;overflow: auto;background-color: white}
.login .left-section form{width: 100%;position: relative}
.login .left-section form input{position: relative;width: 99%;color: rgb(35, 31, 32);font-weight: 400;border: 1px solid rgb(236, 237, 238);padding: 12px 20px;outline: 0px;z-index: 1;background: transparent}
.login .left-section form .text-box{position: relative;margin-bottom: 1.5rem}
.login .left-section .text-box .input__field:focus{border-color: var(--blue-color)}
.login .left-section form button{background-color: var(--blue-color);transition: all .3s ease-in-out;padding: 0.9rem 2.1rem;color: white;font-family: var(--"IBM Plex Regular");font-size: 1rem}
.login .left-section form button:hover{background-color: var(--blue-color-hover)}
.left-section .header{display: flex;align-items: center}
.left-section .header img{height: 3rem;width: 3rem;margin-left: 1rem}
.left-section .header .title{font-size: 1.4rem;font-weight: 600}
.left-section .body .choice-change{margin: 2rem auto;text-align: center;position: relative;color: var(--txt-color)}
.left-section .body .choice-change::before{content: "";position: absolute;height: 1px;width: 45%;top: .7rem;right: 0;background-color: lightgray}
.left-section .body .choice-change::after{content: "";position: absolute;height: 1px;width: 45%;top: .7rem;left: 0;background-color: lightgray}
.left-section p.description{margin: 1.2rem 0;width: 100%}
.left-section .title-section{display: flex;align-items: center}
.left-section .title-section .title{font-size: 1.4rem;font-weight: 600}
.left-section .title-section img{height: 2.5rem;width: 2.5rem;margin-left: 1rem}
.left-section .text-box .input__label{color: rgb(106, 121, 137);cursor: text;position: absolute;top: 3.6px;right: 20px;padding: 10px 5px;font-size: .9rem;background-color: white;z-index: 0;transition: var(--transition)}
.left-section .text-box .input__field:focus+.input__label, .left-section .text-box .input--filled{transform: translate3d(0px, -24px, 0px);background: white;color: var(--blue-color);font-size: 0.8rem;z-index: 1}
.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-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)}
.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}
.swiper-labels.swiper{margin: 0}
.story .our-story{display:flex;flex-direction:column;gap:var(--spacing-md)}
@media (max-width: 768px){
.digital-stamp-card{padding: 8px 16px}
.digital-stamp-card .digital-stamp-header{flex-wrap: wrap}
.digital-stamp-card .digital-stamp-header .btn-digital-stamp-card{flex: 100%;margin-right: 33px}
}
.uj-structure-page{direction: rtl;font-family: "IBM Plex Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;color: #1f2a37;background: #ffffff;max-width: 1180px;margin: 0 auto;padding: 24px 16px 44px}
.uj-structure-page *{box-sizing: border-box}
@media (max-width: 700px){
.uj-structure-page{padding: 16px 10px 34px}
}
@media screen and (min-width: 600px){
.story .image-container{margin-left: 0rem}
.sidebuttons{top: 20rem}
.vertical-line{height: 3.6rem}
.faqs .faqs-search input{width: 60%}
}
@media(min-width: 768px){
#map{height: calc(100vh - 8.6rem)}
.leaflet-top{bottom: 0.5rem}
.dropdown.clicked #clickedValue, #clickedFaculty, #clickedDepartment, #clickedBuilding{max-width: 26ch}
.test{top: 9.8rem}
.map-filter{min-width: 15.35rem}
.modal-content g#Ellipse_27, line#Line_135, line#Line_136{stroke: black}
.js-form-item.js-form-type-radio{height: 40px;flex-flow: row wrap}
fieldset legend{line-height: 2.2}
.js-form-item.js-form-type-radio{height: 64px}
.faqs .faqs-search input{width: 70%}
.introduction{margin-bottom: 4rem}
.left-section .header img{margin-left: 1.5rem}
.uni-side label, .users label{margin-right: unset}
.uni-side ins::before{right: 0}
.news-content{margin-bottom: 5rem}
.news-detail-img img{height: 32.5rem !important;width: 28rem !important}
.swiper-pagination-bullet.swiper-pagination-bullet-active::after{top: 0.3rem;left: 0.35rem;height: 0.4rem;width: 0.4rem}
.dropdown button.btn.btn-light.dropdown-toggle::before{content: unset}
.dropdown button.btn.btn-light.dropdown-toggle{border-right: 1px solid #ebebeb;padding: .375rem .75rem}
.associates-search button.btn.btn-light.dropdown-toggle{padding: var(--spacing-md)}
.contact-us .services .service:last-child{border-bottom: none;padding: 15px}
.contact-us .contact-infos .phone, .contact-us .contact-infos .email, .contact-us .contact-infos .fax{font-size: 1rem;padding: 1rem 3rem}
.contact-us .contact-infos{margin: 3rem 0px 0px}
.contact-us .services .service a.start{margin-top: 2rem}
.service.col-md-4 .image{margin-bottom: 2rem}
.contact-us .services .service{margin-bottom: 3rem;padding: 15px;border-bottom: none}
#PoliciesContentTab{width: auto}
.care-tiles.policies{padding: 3rem 0}
.aca-filter .dropdown button.btn.btn-light.dropdown-toggle{padding: 1rem}
.aca-filter .filter-dp .dropdown{width: 33%;margin: 0}
.aca-filter .filter-dp{display: flex;align-items: center;flex-direction: row;margin-bottom: 0rem;gap: var(--spacing-3xl)}
.filters-container{margin-top: unset}
.steps-app{padding-top: unset;padding-bottom: unset}
.std{font-size: 1.1rem}
.life-jeddah{margin-top: unset}
.uoj-breadcrumb{display: flex}
.about-swiper-section{padding-right: unset}
.story .image-container{height: auto}
.goals .card-text, .goals .card-title, .volunteering .volunteer-tiles .card .card-title{width: 100%}
.story .uj-container{margin-bottom: unset;flex-direction: column}
.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}
.contact-us .contact-infos{flex-wrap: nowrap}
.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){
.eservices-container .js-form-item-title:has(.form-text){margin-top:unset!important}
.eservices-container header{z-index: 0;width: fit-content;margin-inline-start: auto;position: absolute;left: 0;top: 0}
.f-services .cards-section .col-lg-4{max-width: 32.4%}
.eservices-container .form-text{width: 27.6rem}
.care-tiles.policies .row-cards{display: grid;grid-template-columns: repeat(3, 1fr);gap: var(--spacing-xl)}
.static-slider .swiper-button-prev, .static-slider .swiper-button-next{display: flex}
.news-content{flex-wrap: nowrap}
.tabular-view .tab-content .tab-pane .d-flex{flex-direction: row}
.filter-labels label{width: max-content}
p.description, div.description p{text-align: justify}
.research-int{width: 32rem}
.swiper-labels.swiper .swiper-wrapper .swiper-slide{flex-shrink: inherit}
.js-form-item.js-form-type-radio{width: max-content}
.news-content .news-detail-text{width: 53%;margin: 0}
.images-holder.container.description img{object-fit: contain;margin: 0;padding: 1rem;display: inline-block}
.quick-links .logo{display: block}
.quick-links.swiper::before, .quick-links.swiper::after{display: none}
.main-menu .menu-content .menu-links ul .head a{font-size: 1rem}
.quick-links.swiper .swiper-button-prev.swiper-button-disabled, .quick-links.swiper .swiper-button-next.swiper-button-disabled{display: none !important}
.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%))}
.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%))}
.quick-links.swiper .swiper-wrapper{padding: 0 4rem 0 3rem !important}
.president-informations .bottom-section .nationality, .president-informations .bottom-section>.level, .agent-cv .bottom-section>.level{align-items: flex-start}
.bar-chart{display: flex;flex-direction: column;align-items: center;justify-content: center}
.bar-chart h1.section-title, .bar-chart p.description{text-align: right}
.story .image-container{margin-bottom: 0}
.right-section{padding: 0 0.8rem}
.map-location-details .details-div .close-btn svg{width: auto;height: auto}
.map-location-details .details-div .close-btn{border-radius: unset;background-color: unset;height: auto}
.details-div .details{padding: 1.8rem 2rem 1rem}
.map-location-details .details-div .close-btn{right: -5.5rem;top: 2rem}
.details-div{width: 33vw;transform: translateX(-40vw)}
.dropdown.clicked #clickedValue, #clickedFaculty, #clickedDepartment, #clickedBuilding{font-size: 1rem !important;max-width: unset;overflow: unset;text-overflow: unset;white-space: unset}
.leaflet-control-zoom .leaflet-control-zoom-in, .leaflet-control-zoom .leaflet-control-zoom-out{width: 3rem !important;height: 2.8rem !important}
#map .leaflet-control-fullscreen-button{height: 3.2rem;width: 3rem}
.map-filter span:first-child::after{left: 1.5rem;width: 1rem}
.dropdown .map-filter{padding: 0.6rem 1.5rem}
.map-filter{min-width: 20rem;min-height: 4.4rem}
.test{right: 6rem}
.leaflet-top{left: 5rem !important}
.president-informations .bottom-section .nationality{margin-top: unset}
.president-informations .bottom-section, .agent-cv .bottom-section{align-items: baseline}
.president-informations .bottom-section>.level, .agent-cv .bottom-section>.level{width: 30rem}
.map-container #map{background-color: black;height: 87vh}
.supreme-president .president-informations .buttons-container{flex-direction: row}
.story .image-container img{height: 80%;width: 50%;object-fit: contain;object-position: top;margin: auto}
.tab-pane .row{flex-direction: row;width: 100%}
.left-section p.description{margin: 0 0 1.2rem}
.login .right-section h4.title{font-size: 2rem;margin-bottom: 2rem;margin-top: 2rem}
.right-section{border-left: 1px solid #dbdbdb;left: 3rem}
.news-content .more-info .date{margin-bottom: 1rem}
.research-production{padding: 0}
.Deanship-agencies.contact-information .agencies-tiles .uj-container{flex-direction: row}
.supreme-president .president-informations .description p{text-align: right}
.story .image-container img{height: 100%;width: 100%;object-fit: cover;border-radius: var(--radius-lg)}
.story.plan.show-button-true .image-container img, .show-button-true img{object-fit: cover}
.login .left-section{padding: 2rem 5rem}
.login .right-section h4.title{margin-bottom: 2rem;margin-top: 0}
.login .left-section, .login .right-section{width: 50%;height: 100%}
.login .right-section{padding: 2rem 6rem 2rem;justify-content: space-between}
.login{flex-direction: row;height: 100vh}
.contact-us .map{height: 77vh}
.president-informations .bottom-section, .agent-cv .bottom-section{flex-direction: row;margin-top:var(--spacing-3xl)}
.supreme-president .president-informations .buttons-container{justify-content: flex-start;margin-top: 3rem}
.supreme-president .president-informations, .agent-cv .agent-informations{width: 70%;margin-right: var(--spacing-6xl);position: relative;display: flex;flex-direction: column}
.supreme-president .uj-container{flex-direction: row}
.story .uj-container{flex-direction: row}
.search .search-btn, .associates-search .search-btn label{display: block}
.quick-links .link{margin: 0}
.quick-links{display: flex;align-items: center;padding: 0 0 0 6rem !important}
.associates-search .dropdown button{padding: 0px 2rem}
.uni-side ins, .users ins{width: 1rem;margin-left: 0}
.dropdown button.btn.btn-light.dropdown-toggle label{display: block}
.std{border-left: 1.4px solid #e4e4e4;background-color: white;z-index: 2}
.std::before{content: "";position: absolute;width: 3.5rem;height: 2px;top: 2.9rem;right: -2.5rem;background-color: black}
.std::after{position: absolute;width: 1px;height: 4rem;top: -1rem;left: -2rem;background-color: rgb(222, 226, 230)}
.bar-chart .content{width: 40%}
.bar-chart{flex-direction: row;padding: 6rem 6rem 0}
.tabular-view .tab-content{width: 100%}
.story .image-container img{display: block}
.uoj-breadcrumb .icon{width: 0.4rem;margin: 0px 0.5rem}
.service.col-md-4 .image{width: 10rem;height: 10rem}
.news-content .more-info .devider{width: 1px;background-color: rgb(199, 199, 199);margin: 0px 1.5rem;height: 1rem;display: none}
.news-content .more-info .date{margin-bottom: 0px}
.news-content .more-info{flex-direction: row;align-items: center;width: fit-content;margin: 1rem 0;padding: 0}
.goals .column{max-width: 50%}
.goals{gap:var(--spacing-2xl);display: flex;flex-wrap: wrap}
.story .our-story{width: 50%;flex: 1}
.story .image-container{width: 50%;max-height: 25rem;flex: 1}
.contact-us .contact-infos .email, .contact-us .contact-infos .phone{border-left: 1px solid rgb(213, 213, 213);border-bottom: none}
.contact-us .contact-infos .fax{position: relative;padding: 1rem 3rem 1rem 5rem}
.search-footer{flex-direction: row;align-items: center;justify-content: space-around}
.quick-links{justify-content: start;background-image: none;position: relative !important}
.tab-links li{font-size: 1.1rem;width: fit-content}
.vertical-line{border-left: 1px solid rgba(255, 255, 255, 0.51)}
.steps-app .pattern-before{display: none}
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)}
.navbar-brand{display: flex}
.faqs .faqs-search input{width: 40%}
.main-menu-container .main-menu .social-icons a svg, .main-menu-container .main-menu .logo img{width: 3rem;height: auto}
.quick-links .logo{left: 0;top: 2rem;display: none}
}
@media screen and (min-width: 1024px){
#map{height: calc(100vh - 8.1rem)}
.leaflet-top{bottom: 1.5rem}
.survey-msg .msg-container{line-height: 2.2}
.survey-msg .survey-title{font-size: 2.3rem;padding-bottom: 3rem;margin: 3rem 0}
}
@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)}
.news-content{flex-wrap: nowrap}
.container{padding-left: 5rem;padding-right: 5rem}
}
@media screen and (min-width: 1400px){
#map{height: calc(100vh - 7.2rem)}
.leaflet-top{bottom: 2.5rem}
.test{top: 8.5rem}
.right-section{left: 2.3rem;top: -1.1rem}
.search-footer .link svg{width: auto;height: auto}
}
@media only screen and (min-width: 1600px){
.service.col-md-4 .image{width: 10vw;height: 10vw}
.story .image-container{max-height: 25vw}
.college.tabular-view .nav li a.nav-link::before{height: 1.6vw !important;width: 1.5vw !important;margin-left: 0.7vw !important}
.hamburger-submenu{width: 26.2vw}
.main-menu-container .main-menu{width: 32vw}
.contact-us .contact-infos .phone img, .contact-us .contact-infos .email img, .contact-us .contact-infos .fax img{margin-left: 1vw;height: 1.5vw}
.contact-us .contact-infos .phone, .contact-us .contact-infos .email, .contact-us .contact-infos .fax{padding: 1vw 3vw}
.contact-us .services .service a.start{margin-top: 2vw}
.faqs .faqs-search input{padding: 2vw 1vw;font-size: 1vw}
.goals .card ul li::before{height: 0.6vw;width: 0.6vw}
.story .image-container{max-height: 25vw}
.uoj-breadcrumb .icon{width: 0.4vw;margin: 0 0.5vw}
.tab-links li{font-size: 1.1vw}
.leaflet-top{bottom: 1rem}
#map{height: calc(100vh - 6.7rem)}
.right-section{top: -1.4rem}
}
.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}
article.card.uj-card > .card-text.text-md ul{display: flex;flex-direction: column;gap: var(--spacing-md);margin-bottom: unset}
/* swiper-bundle.min.css */
: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-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-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}
.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}
: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-lock{display:none}
.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}
.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-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)}
.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}
.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}
.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 .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}
/* animate-lite.css */
@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}
@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}
:root{--animate-duration:1s}
.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}
@media (prefers-reduced-motion:reduce),print{
.animate__animated{-webkit-animation-duration:1ms!important;animation-duration:1ms!important;-webkit-transition-duration:1ms!important;transition-duration:1ms!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important}
}
.animate__fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}
/* headerstyle.css */
:root{--medium-green: #1b784a;--white: #ffffff;--black-01: #161616;--ibmregular: "IBM Plex Regular";--ibmmedium: "IBM Plex Medium";--ibmsemibold: "IBM Plex SemiBold";--ibmbold: "IBM Plex Bold"}
html{width: 100%;overflow-x: hidden}
.accessibility-dots{background-color: transparent;height: 40px;width: 40px}
.rightAlignedLinks{display: flex;flex-direction: column;align-items: flex-start;width: 100%}
.main-nav .utility-btn span, .contact-btn span{font-family: var(--IBM-sb);font-size: var(--text-sm)}
.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}
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}
.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 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)}
.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)}
@media (min-width: 992px){
header{z-index: 95}
.lang-dropdown .chevron-icon{display: block}
.contact-btn{padding: 0px var(--spacing-md) !important;height: 32px;min-height: 32px}
.lang-dropdown .utility-btn{padding: 0 var(--spacing-sm) !important}
.contact-btn img{filter: none}
.main-nav .utility-btn{color: white}
.rightAlignedLinks img.icons{filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(1%) hue-rotate(138deg) brightness(103%) contrast(101%)}
.rightAlignedLinks{flex-direction: row;align-items: center;width: fit-content;gap: var(--spacing-md)}
.main-nav{background-color: var(--medium-green);position: relative;top: unset}
.utility-btn{display: flex}
.myUJ{display: flex}
.myUJ span{color: var(--text-default) !important}
.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}
.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)}
.contact-btn span, .lang-dropdown button span{display: block;font-size: var(--text-md);color: white;font-family: var(--IBM-regular) !important}
.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}
.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%)}
.utility-btn{padding: var(--spacing-3xl) var(--spacing-2xl) !important}
.navLinksContainer .utility-btn{min-height: 72px;height: 72px}
.myUJ{background-color: transparent;text-align: inherit;border-radius: 0;margin-bottom: 0;color: var(--black-01)}
.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}
.main-nav .navbar.navbar-desktop.d-none.d-lg-flex{display: flex !important}
.top-links li.nav-item, .navbar-nav li.nav-item{border: none;width: fit-content}
}
.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}
.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)}
.utility-links span{font-family: var(--ibmmedium)}
.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}
@media (min-width: 992px){
header li.nav-item a.nav-link.active::before, header li.nav-item a.nav-link:hover::before{display: none}
.navbar-nav{width: fit-content}
header .secondary-nav-content .top-links .nav-item:hover a{color: rgb(255 255 255 /80%) !important}
.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)}
.secondary-nav-content .leftSection{justify-content: space-between;width: fit-content}
.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)}
.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}
.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%)}
.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%)}
.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%)}
img.icons{height: 1rem;width: 1rem;filter: none}
.top-links{display: flex;flex-direction: row;width: fit-content;padding: 0;margin: 0}
.top-links a{width: fit-content}
.utility-links button span{display: block}
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}
header .secondary-nav-content .top-links .nav-item .nav-link{padding: 0px var(--spacing-md) !important;min-height: 32px;height: 32px}
.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}
.utility-links{flex-direction: row;flex-wrap: nowrap}
}
/* css-dga/style.css */
*, p, h1{margin: 0;padding: 0;box-sizing: border-box}
html{scroll-behavior: smooth}
body{font-family: "IBM Plex Sans Arabic", sans-serif;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}
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}
.numbers-statistics p{color: var(--text-default);font-size: var(--text-md)}
.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)}
.uj-btn--neutral:has(i), .uj-btn-icon-only{width: 40px;min-width: 40px}
.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: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: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:hover, .uj-btn--primary-outline:hover{background: var(--button-background-neutral-default);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)}
.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%}
.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))}
.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 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)}
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)}
.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}
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)}
@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)}
.row > *{padding: 0 10px;margin-bottom: 20px}
.js-form-item.js-form-type-textfield, .js-form-item.js-form-type-email, .js-form-item.js-form-type-textarea{display: flex;flex-direction: column;gap: var(--spacing-md);margin: 0px !important;padding: 0}
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-choice input[type="radio"]{height: 0 !important;width: 0 !important;display: none !important}
.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 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)}
.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, #edit-summary-container, .webform-confirmation{margin-bottom: 0 !important;flex-direction: column}
.pf-summary{margin-top: 0 !important}
.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)}
.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}
.page-feedback > .pf-row fieldset{gap: var(--spacing-3xl) !important}
.page-feedback > .pf-row, .page-feedback > .pf-row:not(:has(.pf-panel[hidden])),#edit-summary-container, .webform-confirmation{margin-bottom: var(--spacing-4xl);flex-direction: row;align-items: center}
.page-feedback{padding: var(--spacing-3xl) 0 var(--spacing-3xl)}
footer .row .col-md-6:last-child{margin-bottom: 20px}
.nds-banner-section .banner-text p{width: 765px}
footer .row .col-md-6:not(:last-child){padding: 0;margin: 0;flex: 1}
}