:root{
  /*-- default*/
  --fontsize1: .8rem; /*header-info*/
  --fontsize2: .7rem; /*page > block text*/
  --color1: #ff0087; /*header-info bg; btn - success, outline success*/
  --color1-hover: #ff0087; /*hover - btn - success, outline success*/
  --color2: #650000; /*h1-6; nav-item*/
  --color2-2: #650000; /*home - title line*/
  --color3: #956757; /*btn - dark*/
  --color3-hover: #013333; /*hover - btn - dark*/
  --color4: #c7ffc2; /*home - section title*/
  --color5-1: #fe7773; /*home - fivecomponents #1 bg*/
  --color5-1-2: #ffbbba; /*home - fivecomponents #1 caption bg*/
  --color5-2: #ffb8d6; /*home - fivecomponents #2 bg*/
  --color5-2-2: #fedcec; /*home - fivecomponents #2 caption bg*/
  --color5-3: #fff873; /*home - fivecomponents #3 bg*/
  --color5-3-2: #fffcb9; /*home - fivecomponents #3 caption bg*/
  --color5-4: #c8f990; /*home - fivecomponents #4 bg*/
  --color5-4-2: #e4fcc8; /*home - fivecomponents #4 caption bg*/
  --color5-5: #c4f5fc; /*home - fivecomponents #5 bg*/
  --color5-5-2: #e2fafe; /*home - fivecomponents #5 caption bg*/
  --color5-6: #44210b; /*home - fivecomponenets subtitle*/
  --color6: #000065;
  --color7: #ff1868; /*carousel - dot active*/
  --color7-1: 74,0,1; /*carousel - subtitle left color*/
  --color7-2: 255,0,179; /*carousel - subtitle right color*/
  --color7-3: 255,0,255; /*carousel - subtitle outer glow*/
  --color8: #004233;
  --color9: #05916a;
  --color10: #36d867;
  --color11: #ffe254;
  --color12: #001f42;
  --color13: #ff1868; /*page - subtitle*/
  --color14: #42210b; /*page - subtitle span; contact*/
  --color15: #db243b; /*page - enrollment title*/
  --color16: #005490; /*page - enrollment btn text; r/e-mode subtitle*/
  --color17: #c61264; /*page - mamapapa subtitle*/
  --color18: #ff1868; /*page - contact-msg > Address*/
  --color19: #ff1868; /*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: #6d011b; /*home - awards > year*/
  --color23-1: #261908; /*home - awards > caption*/
  --color24: #ffe665; /*footer - subtitle*/
  --color25: 0, 54, 55; /*home - we offer > caption bg*/
  --color26: #0d2c27;
  --color27: #52f9e5; /*block-enrollment btn-warning*/
  --color28-1: 251, 132, 110; /*page (about) - banner*/
  --color28-1-text: var(--white); /*page (about) - banner > h1*/
  --color28-2: 255, 178, 0; /*page (program) - banner*/
  --color28-2-text: var(--white); /*page (program) - banner > h1*/
  --color28-3: 255,255,105; /*page (products) - banner*/
  --color28-3-2: 255,255,105; /*page (products) - banner line3*/
  --color28-3-text: #992e00; /*page (products) - banner > h1*/
  --color28-4: 87, 255, 178; /*page (news) - banner*/
  --color28-4-text: #003e55; /*page (news) - banner > h1*/
  --color28-5: 95, 248, 254; /*page (events) - banner*/
  --color28-5-text: #003e55; /*page (events) - banner > h1*/
  --color28-6: 37, 155, 255; /*page (gallery) - banner*/
  --color28-6-text: var(--white); /*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,130,130,1) 0%, rgba(255,178,155,1) 56.95%, rgba(255,250,192,1) 100%);
  --body-bg-position: bottom center;
  --page-banner-left-path: polygon( 103.181% 78.727%,103.181% 78.727%,102.505% 79.895%,100.489% 82.909%,97.151% 87.035%,92.512% 91.539%,86.59% 95.688%,79.404% 98.747%,70.973% 99.982%,61.316% 98.661%,50.452% 94.047%,38.401% 85.409%,38.401% 85.409%,30.089% 79.618%,22.01% 76.47%,14.28% 75.6%,7.011% 76.644%,0.319% 79.238%,-5.683% 83.017%,-10.881% 87.617%,-15.161% 92.674%,-18.408% 97.823%,-20.509% 102.7%,-20.567% -8.428%,103.181% -8.428%,103.181% 78.727% );
  --page-banner-right-path: polygon( -4.397% 78.727%,-4.397% 78.727%,-3.721% 79.895%,-1.704% 82.909%,1.633% 87.035%,6.272% 91.539%,12.195% 95.688%,19.381% 98.747%,27.812% 99.982%,37.468% 98.661%,48.332% 94.047%,60.383% 85.409%,60.383% 85.409%,68.696% 79.618%,76.774% 76.47%,84.505% 75.6%,91.773% 76.644%,98.466% 79.238%,104.468% 83.017%,109.666% 87.617%,113.945% 92.674%,117.193% 97.823%,119.293% 102.7%,119.352% -8.428%,-4.397% -8.428%,-4.397% 78.727% );
  --banner-line1-height: 100%;
  --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%);
  --block-fivecomponents-icon-top: -100%;
  --block-fivecomponents-icon-left: calc(-1*0.59em*7);
  --welcome-bg: url('/img/kids/welcome/bg.jpg');
  --welcome-top: url('/img/kids/welcome/top.jpg');
  --welcome-left: url('/img/kids/welcome/left.jpg');
  --welcome-right: url('/img/kids/welcome/right.jpg');
  --welcome-banner-text: 255, 84, 156;
  --welcome-banner-btn: #d40000;
  --welcome-btn: rgba(92, 0, 5, 0.7);
  --banner: url('/img/kids/banner.png');
  --smm-experiential: url('/img/kids/smm-experiential.jpg');
  --smm-intelligent: url('/img/kids/smm-intelligent.jpg');
  --testimonial-bg: url('/img/kids/testimonial-bg.png');
  --testimonial-title: url('/img/kids/testimonial-title.png');
  --testimonial-title-width: 460px;
  --testimonial-title-height: 117px;
  --awards-item: url('/img/kids/awards-border.png');
  --about-bg: url('/img/kids/about-msg.png');
  --about-width: 444px; /*579*/
  --about-height: 568px; /*620*/
  --about-padding: 31px 60px 21px 75px;
  --programme-details-width: 507px; /*591px*/
  --programme-details-height: 529px; /*612px*/
  --programme-details-padding: 31px 47px 52px 37px;
  --programme-details2-width: 472px; /*551px*/
  --programme-details2-height: 385px; /*466*/
  --programme-details2-padding: 32px 44px 49px 35px;
  --contact-form-bg: url('/img/kids/contact-form.png');
  --contact-msg-icon-top: calc(0.59em*2);
  --contact-form-width: 511px; /*614*/ 
  --contact-form-height: 447px; /*489*/
  --contact-form-padding: 12px 56px 30px 47px;
  --contact-form-icon-top: calc(-0.59em*6);
  --contact-form-icon-right: calc(-0.59em*5);
  --contact-msg-bg: url('/img/kids/contact-msg.png');
  --contact-msg-width: 288px; /*381*/
  --contact-msg-height: 364px; /*435*/
  --contact-msg-padding: 41px 51px 30px 42px;
  --contact-msg-icon-right: 52px;
  --subtitle-height: 88px;
  --subtitle-padding: 0 0 0 40px;
  --enrollment-title: url('/img/kids/enrollment-title.png');
  --enrollment-content-bg: url('/img/kids/enrollment-img.png');
  --prevarrow: url('/img/kids/prevarrow.png');
  --nextarrow: url('/img/kids/nextarrow.png');
  --prevarrow-active: url('/img/kids/prevarrow-active.png');
  --nextarrow-active: url('/img/kids/nextarrow-active.png');
  --programme-details-content1: url('/img/kids/programme-details-msg.png');
  --programme-details-content2: url('/img/kids/programme-details-msg2.png');
  --material-subtitle1: url('/img/kids/material/subtitle1.png');
  --material-subtitle2: url('/img/kids/material/subtitle2.png');

  /*-- extra --*/
  --body-wrapper-btm: url('/img/kids/bg-light-btm.png') center bottom repeat-x;
  --body-wrapper-bg: url('/img/kids/bg-light.png') center bottom repeat-x, url('/img/kids/bg-light-top.png') center top repeat-x;
  --body-wrapper-homebg: url('/img/kids/bg-light.png') center bottom repeat-x;
}

.body-wrapper{
  position: relative;
  z-index: 10;
  background: var(--body-wrapper-btm);
  background-size: contain;
}
.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);}
.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(255,0,135,.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-about .line2, .banner-about .line3{ display: none; }
.banner-content{  float: left; }
.banner-btn{  text-align: left; }