/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 27 2026 | 02:56:09 */
/********** Page Banner **********/

#bg-container {
position: relative;
width: 100%;
overflow: hidden;
}

#bg-shell {
position: relative;
display: flex;
align-items: top;
width: 100%;
height: 100%;
padding: 0 6%;
background-image: url(/wp-content/uploads/our-services-banner.jpg);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
}

/********** Main Section **********/

.main-section {
width: 100%;
margin: 40px 0;
font-size: 18px;
line-height: 26px;
}

#page-heading {
display: flex;
justify-content: left;
width: 100%;
}

#heading-bullet {
box-sizing: border-box;
width: 30px;
line-height: 34px;
padding: 13px 0 7px 0;
margin-right: 5px;
font-size: 30px;
color: var(--burgundy1);
}

#heading {
box-sizing: border-box;
padding: 12px 0 8px 0;
}

.intro-wrapper {
width: 100%;
margin: 40px 0;
color: var(--gray2);
}

.intro-wrapper img {
vertical-align: bottom;
}

.intro-wrapper a:link, .intro-wrapper a:visited {
color: var(--brandBlue);
text-decoration: none;
outline: none;
}

.intro-wrapper a:hover {
color: var(--burgundy1);
text-decoration: underline;
outline: none;
}

.services-bullet {
font-size: 19px;
color: var(--gray3);
}

/********** Our Services Portfolio Container-Primary **********/

/********** UI Blocks **********/

.ui-wrapper {
position: relative;
width: 100%;
height: 70px;
margin-bottom: 10px;
overflow: hidden;
}

.ui-container {
position: relative;
padding: 15px;
border: 1px solid var(--gray1);
border-radius: 4px;
background-color: var(--lightBlue);
}

/********** Headers **********/

#gur-heading {
position: relative;
line-height: 30px;
font-size: 28px;
font-weight: bold;
text-align: center;
}

.service-header {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 60px;
margin-bottom: 10px;
line-height: 22px;
color: white;
background-color: var(--brandBlue);
border: 1px solid var(--gray1);
border-radius: 10px 10px 0 0;
box-shadow: none;
font-size: 22px;
font-weight: bold;
transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.service-header-cover {
position: absolute;
top: 0;
box-sizing: border-box;
width: 100%;
height: 60px;
box-shadow: 6px 6px 16px 0px rgba(0, 0, 0, .5);
border-bottom: 6px solid var(--brandBlue);
border-radius: 10px 10px 0 0;
opacity: 0;
transition: opacity 0.2s ease;
}

.service-header .header-label {
margin-top: 2px;
transform: scale(1);
transition: transform 0.2s ease;
}

.os-header-wrapper {
position: relative;
display: flex;
justify-content: center;
width: 100%;
padding: 8px;
background-color: var(--brandBlue);
box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.3);
border-radius: 14px 14px 0 0;
}

.os-header {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 11px 15px 9px;
border: 1.5px solid var(--white);
border-radius: 10px 10px 0 0;
font-size: 24px;
line-height: 28px;
font-weight: bold;
text-align: center;
color: var(--white);
}

/********** Tabs **********/

#gur-main {
width: 100%;
}

#gur-section-1 {
width: 100%;
padding-bottom: 40px;
}

#gur-tab-wrapper {
width: 100%;
}

#gur-section-1 .first {
margin-bottom: 15px;
}

#gur-tab-container {
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
height: 100%;
}

#gur-tab-container .tab-label {
position: absolute;
width: 100%;
line-height: 24px;
color: var(--white);
font-size: 18px;
text-align: center;
transition: color 0.2s ease, text-shadow 0.2s ease;
text-shadow: 1px 1px 0px var(--black);
}

#gur-section-1 .tab {
position: relative;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
width: calc(50% - 8px);
height: 70px;
background-color: var(--brandBlue);
border: var(--borderGray1);
border-radius: 4px;
transition: background-color 0.2s ease;
cursor: pointer;
}

#gur-section-1 .tab-button {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 70px;
}

#gur-section-1 .tab-cover {
position: absolute;
top: 0;
box-sizing: border-box;
width: 100%;
height: 70px;
text-align: center;
border-bottom: 8px solid var(--brandBlue);
border-radius: 10px 10px 0 0;
box-shadow: 4px 4px 12px 0 var(--blackTranslucent2);
opacity: 0;
transition: opacity 0.2s ease;
}

/********** Slide Section **********/

#gur-slide-holder {
box-sizing: border-box;
width: 100%;
height: 34vw;
overflow: hidden;
border: 1px solid var(--gray1);
border-radius: 4px;
transition: width 0.8s ease;
}

#gur-slide-wrapper {
position: relative;
box-sizing: border-box;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}

#gur-slide-container {
position: relative;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
width: 100%;
height: 100%;
z-index: 10;
}

.slide-canvas-container {
display: flex;
flex-wrap: wrap;
width: 100%;
height: 100%;
}

.slide-canvas-dark {
width: 30%;
height: 50%;
background-color: var(--brandBlue);
transition: width 0.8s ease, background-color 0.2s ease;
}

.slide-canvas-light {
width: 70%;
height: 50%;
background-color: var(--blueGray);
transition: width 0.8s ease, background-color 0.2s ease;
}

#gur-slide-wrapper .slide {
display: flex;
align-items: center;
position: absolute;
top: 30px;
left: 32px;
padding: 0 20px;
width: calc(100% - 106px);
height: calc(100% - 60px);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
box-shadow: 0 0 10px 5px var(--blackTranslucent);
border: 1px solid white;
border-radius: 6px;
overflow: hidden;
}

#gur-section-1 .slide {
background-image: url(/wp-content/uploads/panel-background.jpg);
}

.slide-content-wrapper {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
left: 100%;
box-sizing: border-box;
width: 100%;
}

#gur-section-1 #slide-curtain {
position: absolute;
top: 0;
left: 0;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
/*width: 100%;*/
height: 100%;
padding: 0 60px;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 4px;
z-index: 10;
transition: top 0.8s ease;
}

#gur-section-1 #slide-curtain {
background-image: url(/wp-content/uploads/panel-background.jpg);
}

#slide-curtain-content {
box-sizing: border-box;
font-size: 18px;
color: var(--white);
text-align: center;
text-shadow: 1.5px 1.5px 0 black;
}

#slide-curtain-content {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 0 60px;
}

#slide-curtain-link {
display: flex;
align-items: center;
width: 100%;
height: 408px;
}

#slide-curtain-heading {
box-sizing: border-box;
line-height: 26px;
font-size: 22px;
font-weight: bold;
color: white;
text-align: center;
text-shadow: 1.5px 1.5px 0 black;
}

#slide-curtain-icon {
position: relative;
width: 100%;
height: 80px;
margin: 15px 0;
text-align: center;
}

#slide-curtain-icon img {
height: 80px;
}

#slide-curtain-desc {
line-height: 24px;
font-size: 18px;
color: var(--white);
text-align: center;
text-shadow: 1.5px 1.5px 0 black;
}

.slide-icon img {
height: 80px;
}

.slide-link {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 408px;
}

.slide a:link,
.slide a:visited,
.slide a:hover {
color: white;
text-decoration: none;
outline: none;
}

#gur-slide-holder {
box-sizing: border-box;
height: 34vw;
overflow: hidden;
border: 1px solid var(--gray1);
border-radius: 4px;
transition: width 0.8s ease;
}

#gur-slide-wrapper {
position: relative;
box-sizing: border-box;
margin: 0;
padding: 0;
height: 100%;
}

#gur-slide-container {
position: relative;
display: flex;
flex-wrap: wrap;
height: 100%;
z-index: 10;
}

.slide-canvas-container {
display: flex;
flex-wrap: wrap;
/*width: 100%;*/
height: 100%;
}

.slide-canvas-dark {
width: 30%;
height: 50%;
background-color: var(--brandBlue);
transition: width 0.8s ease, background-color 0.2s ease;
}

.slide-canvas-light {
width: 70%;
height: 50%;
background-color: var(--blueGray);
transition: width 0.8s ease, background-color 0.2s ease;
}

.slide-content-wrapper {
position: absolute;
left: 100%;
box-sizing: border-box;
width: 100%;
}

.slide-content {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 0 60px;
}

.slide-link {
display: flex;
align-items: center;
width: 100%;
height: 408px;
}

.slide-heading {
box-sizing: border-box;
line-height: 26px;
font-size: 22px;
font-weight: bold;
color: white;
text-align: center;
text-shadow: 1.5px 1.5px 0 black;
}

.slide-icon {
position: relative;
width: 100%;
height: 80px;
margin: 15px 0;
text-align: center;
}

.slide-icon img {
height: 80px;
}

.slide-desc {
line-height: 24px;
font-size: 18px;
color: var(--white);
text-align: center;
text-shadow: 1.5px 1.5px 0 black;
}

.curtain-content {
box-sizing: border-box;
font-size: 18px;
color: var(--white);
text-align: center;
text-shadow: 1.5px 1.5px 0 black;
}

/********** Callout Banner **********/

#iso-background-container {
display: flex;
align-items: center;
justify-content: center;
background-image: url(/wp-content/uploads/panel-background.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width: 100%;
height: 15vw;
box-shadow: 0px 0px 12px 0px var(--blackTranslucent);
border-radius: 4px;
overflow: hidden;
}

#iso-container {
position: relative;
width: 100%;
padding: 0 30px;
border-radius: 4px;
color: var(--white);
font-size: 36px;
line-height: 40px;
text-align: center;
text-shadow: 1px 1px 0px var(--black);
}

/********** Global University Rankings Flip-Card Section **********/

.card-wrapper {
position: relative;
flex-basis: 28%;
height: 250px;
perspective: 120vw;
}

.back-card {
position: absolute;
top: 0;
display: flex;
align-items: center;
box-sizing: border-box;
width: 100%;
height: 100%;
padding: 25px;
margin: 0;
background-color: var(--lightBlue);
transform: rotateY(-180deg);
border: 2px solid white;
border-radius: 4px;
backface-visibility: hidden;
}

.card {
position: relative;
box-sizing: border-box;
width: 100%;
height: 100%;
border: 6px solid var(--burgundy1);
border-radius: 10px;
transform-style: preserve-3d;
transform-origin: right center;
transition: transform 0.8s ease;
}

.card-bg-shell {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url("/wp-content/uploads/panel-background.jpg");
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-color: transparent;
border-radius: 4px;
}

.card-cover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 250px;
cursor: pointer;
z-index: 10;
}

.card-cover a {
display: block;
text-decoration: none;
}

.card-cover a:hover {
text-decoration: none;
}

.card-desc {
position: relative;
width: 100%;
line-height: 22px;
color: white;
font-size: 18px;
text-align: center;
text-shadow: 2px 2px 4px var(--black);
opacity: 0;
transition: opacity 0.5s ease 0.5s;
}

#card-holder {
position: relative;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
row-gap: 40px;
}

.card-label {
line-height: 22px;
color: var(--gray4);
font-size: 20px;
margin-top: 10px;
}

.content-container {
width: 100%;
}

.front-card {
position: absolute;
display: flex;
align-items: center;
box-sizing: border-box;
width: 100%;
height: 100%;
padding: 20px;
margin: 0;
background-color: var(--lightBlue);
text-align: center;
border: 2px solid white;
border-radius: 4px;
}

.card-number-wrapper {
position: relative;
display: flex;
flex-wrap: wrap;
justify-content: center;
}

.card-number {
position: relative;
height: 60px;
width: 60px;
line-height: 24px;
text-align: center;
color: white;
border-radius: 50%;
background-color: var(--burgundy1);
}

.card-number span {
position: relative;
top: 20px;
font-size: 30px;
text-align: center;
}


/********** Responsive Styling **********/

@media (min-width: 2500.01px) {
.slide-heading { font-size: 28px; line-height: 32px; }
.slide-icon, .slide-icon img { height: 90px; }
.slide-desc { font-size: 24px; line-height: 30px; }
.card-wrapper { flex-basis: 13%; height: 330px; margin: 0; }
.card-label { font-size: 22px; line-height: 24px; }
.card-desc { font-size: 22px; line-height: 24px; }
.card-icon { height: 120px; }
.card-icon img { height: 120px; }
}

@media (min-width: 1900.01px) and (max-width: 2500px) {
.slide-heading { font-size: 26px; line-height: 30px; }
.slide-icon, .slide-icon img { height: 80px; }
.slide-desc { font-size: 22px; line-height: 28px; }
.card-wrapper { height: 330px; }
.card-label,
.card-desc { font-size: 24px; line-height: 28px; }
.card-icon { height: 120px; }
.card-icon img { height: 120px; }
}

@media (max-width: 1900px) {
#qas-tab-container .tab-label { text-align: center;}
}

@media (min-width: 1500.01px) and (max-width: 1900px) {
.slide-heading { font-size: 24px; line-height: 28px; }
.slide-icon, .slide-icon img { height: 70px; }
.slide-desc { font-size: 20px; line-height: 26px; }
.card-wrapper { height: 330px; }
.card-label,
.card-desc { font-size: 24px; line-height: 28px; }
.card-icon img { height: 120px; }
.card-icon { height: 120px; }
}

@media (min-width: 1070.01px) and (max-width: 1180px) {
.card-label { font-size: 18px; line-height: 20px; }
}

@media (min-width: 680.01px) and (max-width: 1070px) {
.card-wrapper { flex-basis: 48%; }
}

@media (max-width: 680px) {
.card-wrapper { flex-basis: 100%; }
.vbes-card-wrapper { display: none; }
}

@media (max-width: 1180px) {
#os-main { display: none; }
#contents-menu-block { display: none; }
#btmb-last { display: none; }
#iso-background-container { margin-top: 40px; }
}

@media (max-width: 680px) {
#explore-container { font-size: 30px; line-height: 34px; }
}

@media (min-width: 900.01px) and (max-width: 1080px) {
#heading-bullet { font-size: 26px; line-height: 30px; }
}

@media (min-width: 360.01px) and (max-width: 900px) {
#heading-bullet { font-size: 24px; line-height: 28px; }
}


@media (max-width: 360px) {
#heading-bullet { display: none; }
#heading { flex-basis: 100%; height: auto; padding: 0; text-align: center; }
}

