:root{
  /*-- default*/
  --fontsize1: .8rem; /*header-info*/
  --fontsize2: .7rem; /*page > block text*/
  --color1: #006dc4; /*header-info bg; btn - success, outline success*/
  --color1-hover: #006dc4; /*hover - btn - success, outline success*/
  --color2: #541464; /*h1-6; nav-item*/
  --color2-2: #9d005d; /*home - title line*/
  --color3: #662d90; /*btn - dark*/
  --color3-hover: #480d73; /*hover - btn - dark*/
  --color4: #c7ffc2; /*home - section title*/
  --color5-1: #8d9fff; /*home - fivecomponents #1 bg*/
  --color5-1-2: #c6cfff; /*home - fivecomponents #1 caption bg*/
  --color5-2: #4aecec; /*home - fivecomponents #2 bg*/
  --color5-2-2: #a5f6f6; /*home - fivecomponents #2 caption bg*/
  --color5-3: #90ffd1; /*home - fivecomponents #3 bg*/
  --color5-3-2: #c8ffe8; /*home - fivecomponents #3 caption bg*/
  --color5-4: #ffea8b; /*home - fivecomponents #4 bg*/
  --color5-4-2: #fff5c5; /*home - fivecomponents #4 caption bg*/
  --color5-5: #ffa68b; /*home - fivecomponents #5 bg*/
  --color5-5-2: #ffd3c5; /*home - fivecomponents #5 caption bg*/
  --color5-6: #44210b; /*home - fivecomponenets subtitle*/
  --color6: #000065;
  --color7: #1b1464; /*carousel - dot active*/
  --color7-1: 0,0,0; /*carousel - subtitle left color*/
  --color7-2: 0,0,0; /*carousel - subtitle right color*/
  --color7-3: 0,0,0; /*carousel - subtitle outer glow*/
  --color7-4: #00ffff; /*carousel - dot normal*/
  --color8: #42210b;
  --color9: #05916a;
  --color10: #36d867;
  --color11: #ffe254;
  --color12: #001f42;
  --color13: #006dc4; /*page - subtitle*/
  --color14: #3d3d86; /*page - subtitle span; contact*/
  --color15: #1b1464; /*page - enrollment title*/
  --color16: #ffffff; /*page - enrollment btn text; r/e-mode subtitle*/
  --color17: #006dc4; /*page - mamapapa subtitle*/
  --color18: #006dc3; /*page - contact-msg > Address*/
  --color19: #006dc3; /*page - contact-form > button*/
  --color19-text: #ffffff; /*page - contact-form > button text*/
  --color20: #f4901e; /*page - contact-msg > phone, email*/
  --color21: #001827; /*page - banner h1*/
  --color22: #00365b; /*page - banner h1 @ events, gallery*/
  --color23: #002e40; /*home - awards > year*/
  --color23-1: #42210b; /*home - awards > caption*/
  --color24: #ffe765; /*footer - subtitle*/
  --color25: 102,45,144; /*home - we offer > caption bg*/
  --color26: #1b1464; /*home - we offer > caption border*/
  --color27: #f63469; /*block-enrollment btn-warning*/
  --color28-1: 124, 86, 255; /*page (about) - banner*/
  --color28-1-text: var(--white); /*page (about) - banner > h1*/
  --color28-2: 255, 186, 189; /*page (program) - banner*/
  --color28-2-text: #c0272d; /*page (program) - banner > h1*/
  --color28-3: 255,144,89; /*page (products) - banner*/
  --color28-3-2: 255,144,89; /*page (products) - banner line3*/
  --color28-3-text: var(--white); /*page (products) - banner > h1*/
  --color28-4: 255, 255, 151; /*page (news) - banner*/
  --color28-4-text: #9a2e00; /*page (news) - banner > h1*/
  --color28-5: 185, 255, 84; /*page (events) - banner*/
  --color28-5-text: #004737; /*page (events) - banner > h1*/
  --color28-6: 94, 255, 208; /*page (gallery) - banner*/
  --color28-6-text: #004737; /*page (gallery) - banner > h1*/
  --radius1: .75rem;
  --radius2: 1.2rem;
  --radius3: 1.5rem;
  --radius4: 2rem;
  --shadow1: 0px 11px 11px -1px rgba(0,0,0,0.4);
  --shadow2: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
  --shadow3: #2cff00;
  --shadow4: 0px 5px 10px 1px rgba(0,0,0,0.6);
  --opacity1: 20%;
  --body-gradient: linear-gradient(0deg, rgba(255,205,74,1) 0%, rgba(255,255,225,1) 100%);
  --body-bg-position: bottom center;
  --page-banner-left-path: unset;
  --page-banner-right-path: unset;
  --banner-line1-height: 307px;
  --footer-bg-display: none;
  --footer-bg: rgba(34,116,150,0.57);
  --footer-bg-gradient: linear-gradient(to top,black 10%, rgba(0,0,0,0.8) 50%, transparent 100%);
  --footer-text: #ffffff;
  --block-fivecomponents-icon-top: -100%;
  --block-fivecomponents-icon-left: calc(-1*0.59em*7);
  --welcome-bg: url('/img/jsp/welcome/bg.jpg');
  --welcome-top: url('/img/jsp/welcome/top.jpg');
  --welcome-left: url('/img/jsp/welcome/left.jpg');
  --welcome-right: url('/img/jsp/welcome/right.jpg');
  --welcome-banner-text: 0,86,255;
  --welcome-banner-btn: #d40000;
  --welcome-btn: rgba(255,146,0, 0.7);
  --banner: url('/img/jsp/banner.png');
  --smm-experiential: url('/img/jsp/smm-experiential.jpg');
  --smm-intelligent: url('/img/jsp/smm-intelligent.jpg');
  --testimonial-bg: url('/img/jsp/testimonial-bg.png');
  --testimonial-title: url('/img/jsp/testimonial-title.png');
  --testimonial-title-width: 460px;
  --testimonial-title-height: 117px;
  --awards-item: url('/img/jsp/awards-border.png');
  --about-bg: url('/img/jsp/about-msg.png');
  --about-width: 444px; /*579*/
  --about-height: 568px; /*620*/
  --about-padding: 31px 60px 21px 75px;
  --programme-details-width: 480px; /*575*/
  --programme-details-height: 340px; /*534*/
  --programme-details-padding: 83px 46px 111px 49px;
  --programme-details2-width: unset;
  --programme-details2-height: unset;
  --programme-details2-padding: unset;
  --date-semitrans-item-icon: url('/img/jsp/icon-date.png');
  --contact-form-bg: url('/img/jsp/contact-form.png');
  --contact-msg-icon-top: calc(0.59em*4);
  --contact-form-width: 497px; /*562*/
  --contact-form-height: 430px; /*499*/
  --contact-form-padding: 28px 34px 41px 31px;
  --contact-form-icon-top: calc(-0.59em*6);
  --contact-form-icon-right: calc(-0.59em*5);
  --contact-msg-bg: url('/img/jsp/contact-msg.png');
  --contact-msg-width: 274px; /*354*/
  --contact-msg-height: 334px; /*426*/
  --contact-msg-padding: 50px 29px 42px 51px;
  --contact-msg-icon-right: 52px;
  --contact-msg-text: #1b1464;
  --subtitle-height: 88px;
  --subtitle-padding: 0 0 0 40px;
  --enrollment-title: url('/img/jsp/enrollment-title.png');
  --enrollment-content-bg: url('/img/jsp/enrollment-img.png');
  --prevarrow: url('/img/jsp/prevarrow.png');
  --nextarrow: url('/img/jsp/nextarrow.png');
  --prevarrow-active: url('/img/jsp/prevarrow-active.png');
  --nextarrow-active: url('/img/jsp/nextarrow-active.png');
  --programme-details-content1: url('/img/jsp/programme-details-msg.png');
  --programme-details-content2: url('/img/jsp/programme-details-msg2.png');
  --material-subtitle1: url('/img/jsp/material/subtitle1.png');
  --material-subtitle1-text: #593191;
  --material-subtitle2: url('/img/jsp/material/subtitle2.png');
  --material-subtitle2-text: #593191;

  /*-- extra --*/
  --body-text: #3d3d86;
  --nav-item-active: white;
  --banner-text: #1b1464;
  --body-wrapper-btm: url('/img/jsp/bg-light-btm.jpg') center top repeat-x;
  --body-wrapper-bg: url('/img/jsp/bg-light.png') center bottom repeat-x, url('/img/jsp/bg-light-top.png') center top repeat-x;
  --body-wrapper-homebg: url('/img/jsp/bg-light.png') center bottom repeat-x;
  --gallery-caption: #ffffff;
  --caption-slider-item: #42210b;
  --enrollment-title-width: 516px; /*678*/
  --enrollment-title-height: 57px; /*107*/
  --enrollment-title-padding: 20px 107px 30px 55px;
  --slick-prev-disabled:  url('/img/jsp/prevarrow.png');
  --slick-next-disabled:  url('/img/jsp/nextarrow.png');
}

.welcome-banner{ height: calc(100vh - 1.5em); }
.welcome-banner-inner{ padding-bottom: 3em; }

body{ color: var(--body-text); }
.body-wrapper{
  position: relative;
  z-index: 10;
  background: var(--body-wrapper-btm);
  background-size: auto;
  background-position: center top;
}
.body-wrapper::before{
  content: ' ';
  position: absolute;
  width: 100%;
  height: 100%;
  background: var(--body-wrapper-bg);
  z-index: -1;
}
body:not(.no-page) .body-wrapper::before{  background: var(--body-wrapper-homebg);}


.nav-item.active a{ color: var(--nav-item-active); }
.btn-outline-success:not(:disabled):not(.disabled).active:focus, .btn-outline-success:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-success.dropdown-toggle:focus{
  box-shadow: 0 0 0 0.2rem rgba(0,109,196,.5);
}

.btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active, .show>.btn-outline-success.dropdown-toggle {
  background-color: var(--color1);
  border-color: var(--color1);
}
.banner h1{ float: right; color: white; text-shadow: 0 3px 10px rgba(0,0,0,0.7);text-align: right;}
.banner-content{  float: right; }
.banner-btn{  text-align: right; }
h2.title.text-white{
  color: var(--color2) !important;
}
h2.text-white .title-line, h2.text-white .title-line::before, h2.text-white .title-line::after{ background: var(--color2-2) !important; }
.block-gallery-caption{ color: var(--gallery-caption); }
.about-img2{  bottom: -120px;}
footer, footer a, footer a.text-white, .copyright{ color: var(--footer-text) !important; }
.subtitle1{ color: var(--material-subtitle1-text); }
.subtitle2{ color: var(--material-subtitle2-text); }
.caption-slider-item{ color: var(--caption-slider-item); }
.block-material, .block-material .text-white{ color:#42210b !important; }
.contact-msg-icon{ max-width:50px; }
body.page-contact .page-banner{ height: unset; }
body.page-contact .banner-about .line2 {
    background: rgb(183, 255, 255);
    background: linear-gradient(90deg, rgba(183, 255, 255,1) 0%, rgba(255,255,255,0) 98.1%);
}
body.page-contact .banner-about .line3 {
    background: rgb(183, 255, 255);
    background: linear-gradient(90deg, rgba(255,255,255,0) 1.9%, rgba(183, 255, 255,0.5) 100%);
}

.enrollment-title{
  width: var(--enrollment-title-width);
  height: var(--enrollment-title-height);
  padding: var(--enrollment-title-padding);
}
.slick-prev.slick-disabled { background: var(--slick-prev-disabled) center center no-repeat !important; }
.slick-next.slick-disabled { background: var(--slick-next-disabled) center center no-repeat !important; }
.slick-dots li button:before{ color: var(--color7-4); }
.contact-msg-inner{ color: var(--contact-msg-text); }
.contact-form::after{
  content: ' ';
  width:300px;
  height:266px;
  background: url('/img/jsp/contact-form-icon.png') center center no-repeat;
  position: absolute;
  bottom: -110px;
  left: -100px;
}