/* Candara Regular */

@font-face {

  font-family: "Candara";

  src: url("../fonts/Candara.ttf") format("truetype");

  font-weight: normal;

  font-style: normal;

}



/* Candara Bold */

@font-face {

  font-family: "Candara";

  src: url("../fonts/Candara_Bold.ttf") format("truetype");

  font-weight: bold;

  font-style: normal;

}



/* Candara Italic */

@font-face {

  font-family: "Candara";

  src: url("../fonts/Candara_Italic.ttf") format("truetype");

  font-weight: normal;

  font-style: italic;

}



/* Candara Bold Italic */

@font-face {

  font-family: "Candara";

  src: url("../fonts/Candara_Bold_Italic.ttf") format("truetype");

  font-weight: bold;

  font-style: italic;

}



/* Aquarion */

@font-face {

  font-family: "Aquarion";

  src: url("../fonts/aquarion.otf") format("opentype");

}



/* back to top starts  */

.back_to_top.show {

  display: block;

  opacity: 0.8;

  bottom: 72px;

}



.back_to_top.show:hover {

  opacity: 1;

}



.back_to_top {

  position: fixed;

  display: none;

  right: 65px;

  bottom: 15px;

  z-index: 99;

  background-color: #424849;

  color: rgb(255, 255, 255) !important;

  padding: 15px 21px;

  opacity: 0;

  border-radius: 20px;

  border: 2PX solid #469AD6;

}



.back_to_top:hover {

  background-color: #424849;

  color: rgb(0, 0, 0);

  transition: 800ms;

}



.back_to_top:hover i {

  color: rgb(255, 255, 255);

  transition: 800ms;

}



.back_to_top i {

  font-size: 28px;

}



/* back to top ends  */

/* Hamburger styles start*/

.navbar .navbar-toggler {

  color: transparent;

  border-color: transparent;

}



.hamburger-button {

  stroke: white;

  overflow: hidden;

}



.hamburger-button .hamburger {

  transition: translate 1s, rotate 1s;

}



.hamburger-button[aria-expanded=true] .hamburger {

  translate: 3px -3px;

  rotate: 0.125turn;

}



.hamburger-button .line {

  transition: 1s;

  stroke-dasharray: 60 31 60 300;

}



.hamburger-button[aria-expanded=true] .line {

  stroke-dasharray: 60 105 60 300;

  stroke-dashoffset: -90;

}



/* Hamburger styles end*/

.btn-button {

  margin-bottom: 0px !important;

  width: -moz-fit-content !important;

  width: fit-content !important;

}



.btn-button a {

  position: relative;

  color: #469AD6;

  display: inline-flex;

  flex-direction: row;

  align-items: center;

  background-color: #FFF1A8;

  padding: 17px 45px 17px 45px !important;

  outline: 5px solid #F3C400;

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 20px;

  line-height: 20px;

  border-radius: 5px;

  text-decoration: none;

  transition: 0.5s;

}



.btn-button a::before {

  content: "";

  background-image: url(../images/smiling.svg);

  background-size: 100% 100% !important;

  font-size: 20px;

  display: inline-block;

  width: 20px;

  height: 20px;

  position: absolute;

  right: 28px !important;

  top: calc(50% - 10px) !important;

  transition: 0.5s !important;

  opacity: 0;

}



.btn-button a:hover {

  outline: 5px solid #469AD6;

  padding: 17px 55px 17px 35px !important;

  background-color: #CDE7F0;

}



.btn-button a:hover:before {

  opacity: 1;

  right: 20px !important;

}



header {

  position: fixed;

  top: 0px;

  z-index: 7;

  width: 100%;

}



.top-section {

  background-image: url(../images/top-back.svg);

  background-size: auto 100%;

  background-repeat: repeat-x;

  padding: 25px 0px 43px 0px;

  animation: moveBackground 30s linear infinite;

  transition: all 0.4s ease;

}



@keyframes moveBackground {

  0% {

    background-position-x: 0;

  }



  100% {

    background-position-x: -1000px;

  }

}



.top-section .container {

  display: flex;

  flex-direction: row;

  justify-content: space-between;

  padding-left: 268px;

}



.top-section .container i {

  font-size: 18px;

  color: #F3C400;

  margin-right: 2px;

  width: 20px !important;

}



.top-section .container .address {

  display: flex;

  flex-direction: row;

  align-items: center;

}



.top-section .container .address i {

  margin-right: 10px;

}



.top-section .container .mail {

  display: flex;

  flex-direction: row;

  gap: 60px;

}



.top-section .container .mail a {

  font-family: "Candara", sans-serif;

  font-weight: bold;

  color: #595959;

  font-size: 18px;

  line-height: 20px;

  transition: 0.5s;

}



.top-section .container .mail a:hover {

  color: black;

  text-decoration: none;

}



.top-section .container p {

  font-family: "Candara", sans-serif;

  font-weight: bold;

  color: #595959;

  font-size: 18px;

  line-height: 20px;

  margin-bottom: 0px;

}



.nav-section .logo {

  display: block;

  width: 191px;

  height: 219px;

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  background-image: url(../images/logo-back.webp);

  background-size: 100% 100%;

  padding: 0px 5px;

  transition: all 0.4s ease;

}



.nav-section .container {

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin-top: -65px;

  transition: all 0.4s ease;
  padding: 0px;

}



.nav-section .container nav {

  padding: 0px;

  background-image: url(../images/nav-back.webp);

  background-size: 100% 100%;

  padding-top: 15px;

  width: calc(100% - 191px);

  padding-right: 15px;

  transition: all 0.4s ease;

}



.nav-section .container .navbar-nav li {

  display: inline-flex;

  position: relative;

}



.nav-section .container .navbar-nav li::before {

  position: absolute;

  content: "";

  top: 0px;

  right: 0px;

  width: 2px;

  height: 41px;

  background-color: #F3C400;

}



.nav-section .container .navbar-nav li:last-child::before {

  display: none;

}



.nav-section .container .navbar-nav li a {

  font-family: "Fredoka", sans-serif;

  font-weight: 600;

  font-size: 16px;

  line-height: 18px;

  letter-spacing: 0.5px;

  margin-bottom: 0px;

  color: #469AD6;

  transition: 0.5s;

  text-align: center;

  padding: 0px 6px 15px 6px;

  display: inline-flex;

  align-items: center;

  position: relative;

  transition: all 0.4s ease;

  text-decoration: none;

}



.nav-section .container .navbar-nav li a:hover,

.nav-section .container .navbar-nav li a.active {

  color: #1D0E37;

  text-decoration: none;

}



.nav-section .container .navbar-nav li a::before {

  content: "";

  position: absolute;

  width: 0;

  height: 5px;

  bottom: 5px;

  left: 50%;

  background-color: #469AD6;

  transition: all 0.4s;

  border-radius: 10px 10px 0px 0px;

}



.nav-section .container .navbar-nav li a:hover::before,

.nav-section .container .navbar-nav li a.active::before {

  width: 50%;

  left: 25%;

}



.nav-section .container .navbar-collapse {

  justify-content: center;

}



.nav-section .dropdown-menu {

  top: 70px;

  left: unset;

  background-color: #fff3c3;

  border-color: #fff3c3;

  padding: 0px;

}



.nav-section .dropdown-menu li {

  display: block !important;

}



.nav-section .dropdown-menu li::before {

  background-color: transparent !important;

}



.nav-section .dropdown-menu li a {

  display: block !important;

  width: 100%;

}



.nav-section .dropdown-menu li .active {

  background-color: #fff3c3 !important;

}



.nav-section .dropdown-menu li a:hover {

  background-color: #fff3c3 !important;

}



.nav-section .dropdown-menu li a:focus {

  background-color: #fff3c3 !important;

}



/* sticky header */



header.sticky .top-section {

  padding: 15px 0px 15px 0px;

  transition: all 0.4s ease;

}



header.sticky .nav-section .container {

  margin-top: -30px;

  justify-content: center;

  transition: all 0.4s ease;

}



header.sticky .nav-section .logo {

  width: 130px;

  height: 120px;

  padding: 0px 5px;

  transition: all 0.4s ease;

}



header.sticky .nav-section .container nav {

  width: calc(100% - 235px);

  transition: all 0.4s ease;

}



header.sticky .nav-section .container .navbar-nav li a {

  font-size: 16px;

  line-height: 18px;

  letter-spacing: 0.5px;

  padding: 0px 5px 15px 5px;

  transition: all 0.4s ease;

}







/* carousel zoom-in animation */

.carousel .carousel-item.active img {

  animation: zoom-in 15s ease-in-out infinite;

}



@keyframes zoom-in {

  0% {

    transform: scale(1) rotate(0deg);

  }



  50% {

    transform: scale(1.2) rotate(2deg);

  }



  100% {

    transform: scale(1) rotate(0deg);

  }

}



.slide-section {

  padding: 0px;

  position: relative;

}



.slide-section .carousel-control-next,

.slide-section .carousel-control-prev {

  width: 38px;

  height: 80px;

  background-image: url(../images/slide-arrow-left.webp);

  background-size: 100% 100%;

  top: calc(50% - 40px);

  opacity: 1;

  transition: 0.5s;

}



.slide-section .carousel-control-next span,

.slide-section .carousel-control-prev span {

  display: none;

}



.slide-section .carousel-control-next:hover,

.slide-section .carousel-control-prev:hover {

  opacity: 0.5;

}



.slide-section .carousel-control-next {

  transform: rotate(180deg);

}



.slide-section::before {

  content: "";

  display: block;

  position: absolute;

  z-index: 2;

  bottom: 0px;

  left: 0px;

  width: 100%;

  height: 74px;

  background-image: url(../images/slide-wave.svg);

  background-size: auto 100%;

  background-repeat: repeat-x;

  animation: moveBackground 30s linear infinite;

}



.slide-section .wrapper {

  position: absolute;

  display: inline-block;

  bottom: 80px;

  z-index: 5;

}



.slide-section {

  /* GREEN BOX */

}



.slide-section .green-box {

  position: absolute;

  bottom: 110%;

  left: -115px;

  bottom: 140px;

  background-image: url(../images/speech-bubble.png);

  background-size: 100% 100%;

  padding: 40px 20px 15px 35px;

  width: 170px;

  height: 170px;

  /*opacity: 0;*/

  /*transform: translateY(100px) translateX(100px) scale(0);*/

      opacity: 1;

    transform: translateY(0px) translateX(0px) scale(1);

  transition: 0.4s ease;

  margin-bottom: 0px;

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 16px;

  line-height: 23px;

  color: #ffffff;

  margin-bottom: 0px;

  text-decoration: none;

  text-align: center;

}



.slide-section {

  /* YELLOW HEXAGON */

}



.slide-section .yellow-box {

  display: block;

width: 140px;

height: 170px;

padding: 30px 15px;

background-image: url(../images/slide-polygon.webp);

background-size: 100% 100%;

text-align: center;

cursor: pointer;

font-family: "Fredoka", sans-serif;

font-weight: 500;

font-size: 15px;

line-height: 24px;

color: #595959;

margin-bottom: 0px;

text-decoration: none;

}



.slide-section {

  /* HOVER EFFECT */

}



.slide-section .wrapper:hover .green-box {

  opacity: 1;

  transform: translateY(0px) translateX(0px) scale(1);

}



.slide-section .carousel-caption {

    background: url(../images/banner.webp) no-repeat center;

    position: absolute;

    right: 30%;

    bottom: 35%;

    left: 30%;

    padding-top: 1.25rem;

    padding-bottom: 1.25rem;

    color: #000;

    text-align: center;

    z-index: 1;

    background-size: cover;

    height: 150px;

    padding: 48px 0;

}



.slide-section .carousel-caption h3 {

  font-size: 45px;

  letter-spacing: 0.5px;

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

}

.carousel .carousel-inner-layout .carousel-item.active img {

    animation: none !important

}

.emptyDiv {

  min-height: 330px;

}

.section-a {

  padding-top: 50px;

  padding-bottom: 70px;

  position: relative;

}



.section-a::before {

  position: absolute;

  content: "";

  background-image: url(../images/bean-bloack.webp);

  transform: rotate(180deg);

  background-size: 100% 100%;

  width: 678px;

  height: 811px;

  left: 0;

  top: 0;

  z-index: -1;

}



.section-a::after {

  position: absolute;

  content: "";

  background-size: 100% 100%;

  right: 0%;

  top: 0%;

  width: 344PX;

  height: 395px;

  background-image: url(../images/bean-bloack.webp);

  z-index: -1;

}



.section-a .content-01 .figure::before {

  position: absolute;

  content: "";

  background-image: url(../images/hat.webp);

  background-size: 100% 100%;

  width: 145px;

  height: 155px;

  left: 18%;

  top: 10%;

  animation: zoomOut 3s ease infinite;

}



.section-a .content-01 .figure::after {

  position: absolute;

  content: "";

  background-image: url(../images/3d-abc-alphabet.webp);

  background-size: 100% 100%;

  width: 230px;

  height: 203px;

  left: 10%;

  bottom: 6%;

  animation: zoomOut 3s ease infinite;

}



@keyframes zoomOut {

  0% {

    transform: scale(1);

  }



  50% {

    transform: scale(0.8);

  }



  100% {

    transform: scale(1);

  }

}



.section-a .content-01 {

  display: flex;

  flex-direction: column;

  justify-content: center;

}



.section-a .content-02 {

  display: flex;

  flex-direction: column;

  justify-content: center;

  position: relative;

}



.section-a .content-02::before {

  position: absolute;

  content: "";

  background-size: 100% 100%;

  right: -5%;

  top: -20%;

  width: 275PX;

  height: 260px;

  background-image: url(../images/book.webp);

  animation: zoomOut 3s ease infinite;

}



.section-a .content-02 h1 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 40px;

  line-height: 50px;

  letter-spacing: 0.5px;

  color: #1D0E37;

  margin-bottom: 20px;

}



.section-a .content-02 h1 span {

  font-size: 35px;

  line-height: 55px;

  color: #469AD6;

  font-weight: 300;

  display: block;

}



.section-a .content-02 h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 26px;

  line-height: 40px;

  letter-spacing: 0.5px;

  color: #469AD6;

  margin-bottom: 20px;

}



.section-a .content-02 p {

  font-family: "Candara", sans-serif;

  font-weight: normal;

  font-size: 16px;

  line-height: 30px;

  color: #595959;

  margin-bottom: 20px;

}



.section-a .content-02 h3 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 28px;

  line-height: 33px;

  color: #1D0E37;

  margin-bottom: 0px;

}



.section-a .content-02 .sec {

  margin-bottom: 20px;

}



.section-a .content-02 .sec p {

  margin-bottom: 0px;

}



.section-a .bee-circle {

  background-image: url(../images/bee-circle.webp);

  background-repeat: no-repeat;

  width: -moz-fit-content;

  width: fit-content;

  height: -moz-fit-content;

  height: fit-content;

  position: absolute;

  bottom: -64%;

  right: -509px;

  z-index: 2;

}



.section-a .bee-circle img {

  animation: rotateCircle 18s linear infinite;

}



.section-b {

  padding-left: 65px;

  padding-right: 65px;

  position: relative;

}



.section-b::before {

  position: absolute;

  content: "";

  background-size: 100% 100%;

  right: 0%;

  top: -250px;

  width: 650PX;

  height: 750px;

  background-image: url(../images/bean-bloack.webp);

  z-index: -1;

}



.section-b .row {

  background-image: url(../images/section-b-back.webp);

  background-size: 100% 100%;

  padding-top: 30px;

}



.section-b .content-03 {

  display: flex;

  flex-direction: column;

  align-items: flex-end;

  padding-right: 60px;

}



.section-b .content-03 .sec {

  width: -moz-fit-content;

  width: fit-content;

  margin-top: -50px;

  position: relative;

  margin-bottom: -20px;

}



.section-b .content-03 .sec::before {

  content: "";

  position: absolute;

  display: block;

  width: 189px;

  height: 174px;

  background-image: url(../images/3-stars.webp);

  background-size: 100% 100%;

  top: -154px;

  left: 24%;

  animation: zoomOut 3s ease infinite;

}



.section-b .content-03 .row-i {

  display: flex;

  flex-direction: row;

}



.section-b .content-03 .row-2 {

  margin-left: 99px;

  margin-top: -59px;

}



.section-b .content-03 .row-3 {

  margin-top: -60px;

}



.section-b .content-03 .row-4 {

  margin-top: -59px;

  margin-left: -99px;

}



.section-b .content-03 .row-5 {

  margin-top: -59px;

  margin-left: -396px;

}



.section-b .content-03 .box {

  width: 200px;

  height: 231px;

  background-image: url(../images/bee-block.webp);

  background-size: 100% 100%;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  padding: 0px 30px;

  margin-right: -2px;

}



.section-b .content-03 .box img {

  margin-bottom: 20px;

}



.section-b .content-03 .box p {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 20px;

  line-height: 25px;

  letter-spacing: 0.5px;

  color: #1D0E37;

  margin-bottom: 0px;

  text-align: center;

}



.section-b h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 40px;

  line-height: 50px;

  letter-spacing: 0.5px;

  color: #1D0E37;

  margin-bottom: 0px;

}



.section-b .content-01 {

  display: flex;

  flex-direction: column;

  align-items: center;

}



.section-b .content-01 h3 {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 38px;

  line-height: 50px;

  letter-spacing: 0.5px;

  color: #469AD6;

  margin-bottom: 0px;

  margin-top: 0px;

}



.section-b .content-02 {

  padding-left: 50px;

  padding-top: 10px;

  position: relative;

}



.section-b .content-02 p {

  font-family: "Candara", sans-serif;

  font-weight: normal;

  font-size: 18px;

  line-height: 33px;

  color: #595959;

  margin-bottom: 10px;

}



.section-b .content-02 h3 {

  font-family: "Candara", sans-serif;

  font-weight: normal;

  font-size: 28px;

  line-height: 40px;

  color: #595959;

  margin-bottom: 10px;

  margin-top: 0px;

  width: 80%;

}



.section-b .content-02 .bee {

  position: absolute;

  top: -260px;

  left: 100px;

  width: 250px;

  height: auto;

  display: block;

  z-index: 2;

}



.section-c {

  padding-top: 150px;

  padding-bottom: 100px;

  position: relative;

  background-image: url("../images/section-c-back.webp");

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

}



.section-c::before {

  position: absolute;

  content: "";

  background-image: url(../images/bean-bloack.webp);

  transform: rotate(180deg);

  background-size: 100% 100%;

  width: 600px;

  height: 700px;

  left: -200px;

  top: -30%;

  z-index: -1;

}



.section-c .content-01 h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 40px;

  line-height: 50px;

  letter-spacing: 0.5px;

  color: #1D0E37;

  margin-bottom: 40px;

}



.section-c .content-01 p {

  font-family: "Candara", sans-serif;

  font-weight: normal;

  font-size: 18px;

  line-height: 33px;

  color: #595959;

  margin-bottom: 10px;

}



.section-c .content-01 h3 {

  font-family: "Candara", sans-serif;

  font-weight: normal;

  font-size: 26px;

  line-height: 40px;

  color: #595959;

  margin-bottom: 30px;

  margin-top: 30px;

}



.section-c .content-02 {

  display: flex;

  flex-direction: column;

  align-items: flex-end;

  justify-content: center;

}



.section-c .content-02 figure {

  position: relative;

  width: -moz-fit-content;

  width: fit-content;

  height: -moz-fit-content;

  height: fit-content;

}



.section-c .content-02 figure::before {

  position: absolute;

  content: "";

  background-size: 100% 100%;

  left: -50px;

  bottom: 50px;

  width: 242PX;

  height: 255px;

  background-image: url(../images/apple-on-the-book.webp);

  animation: zoomOut 3s ease infinite;

}



.section-c .bee-circle {

  background-image: url(../images/bee-circle.webp);

  background-repeat: no-repeat;

  width: -moz-fit-content;

  width: fit-content;

  height: -moz-fit-content;

  height: fit-content;

  position: absolute;

  top: -33%;

  left: -510px;

  z-index: -1;

}



.section-c .bee-circle img {

  animation: rotateCircle 18s linear infinite;

}



.sections-wrapper {

  overflow: hidden;

}



/* Keyframes */

@keyframes rotateCircle {

  0% {

    transform: rotate(0deg);

  }



  100% {

    transform: rotate(360deg);

  }

}



/* Rotation animation */

@keyframes rotate {

  from {

    transform: rotate(0deg) translateX(120px) rotate(0deg);

  }



  to {

    transform: rotate(360deg) translateX(120px) rotate(-360deg);

  }

}



.section-d {

  padding-left: 50px;

  padding-right: 50px;

  position: relative;

}



.section-d::before {

  position: absolute;

  content: "";

  background-image: url(../images/bean-bloack.webp);

  background-size: 100% 100%;

  width: 800px;

  height: 955px;

  right: 0px;

  top: -10%;

  z-index: -1;

}



.section-d::after {

  position: absolute;

  content: "";

  background-image: url(../images/bean-bloack.webp);

  background-size: 100% 100%;

  transform: rotate(180deg);

  width: 800px;

  height: 955px;

  left: 0px;

  top: -10%;

  z-index: -1;

}



.section-d .row {

  background-image: url(../images/green-back-d.webp);

  background-size: 100% 100%;

}



.section-d .content-01 {

  display: flex;

  flex-direction: row;

  justify-content: center;

  align-items: center;

  padding-top: 50PX;

}



.section-d .content-01 figure {

  margin-bottom: -20PX;

}



.section-d .content-02 {

  position: relative;

  padding-right: 100px;

  display: flex;

  flex-direction: column;

  justify-content: center;

  padding-top: 30px;

  padding-bottom: 30px;

}



.section-d .content-02 h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 40px;

  line-height: 50px;

  letter-spacing: 0.5px;

  color: white;

  margin-bottom: 20px;

}



.section-d .content-02 h2 span {

  font-weight: 500;

  font-size: 50px;

  color: #1D0E37;

  display: block;

}



.section-d .content-02 p {

  font-family: "Candara", sans-serif;

  font-weight: normal;

  font-size: 20px;

  line-height: 33px;

  color: #595959;

  margin-bottom: 20px;

}



.section-d .content-02 .sec {

  display: flex;

  align-items: center;

}



.section-d .content-02 .sec i {

  width: 82px;

  height: 82px;

  background-image: url(../images/icon-back.webp);

  background-size: 100% 100%;

  display: flex;

  flex-direction: row;

  justify-content: center;

  align-items: center;

  color: #469AD6;

  font-size: 25px;

  margin-right: 20px;

}



.section-d .content-02 .sec h3 {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 28px;

  line-height: 28px;

  color: #1D0E37;

  margin-bottom: 10px;

}



.section-d .content-02 .sec p {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 28px;

  line-height: 28px;

  color: white;

  margin-bottom: 0px;

}



.section-d .content-02 .sec p a {

  color: white;

  transition: 0.5s;

}



.section-d .content-02 .sec p a:hover {

  color: #1D0E37;

  text-decoration: none;

}



.section-d .content-02 .bee {

  display: block;

  width: -moz-fit-content;

  width: fit-content;

  height: -moz-fit-content;

  height: fit-content;

  position: absolute;

  right: -25px;

  bottom: -110px;

  animation: floatUpDown 3s ease-in-out infinite;

}



.section-e {

  padding-top: 70px;

  padding-bottom: 50px;

}



.section-e h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 40px;

  line-height: 50px;

  letter-spacing: 0.5px;

  color: #1D0E37;

  margin-bottom: 20px;

  text-align: center;

}



.section-e .owl-carousel .owl-item img {

  width: -moz-fit-content;

  width: fit-content;

}



.section-e .content-02 {

  padding: 0px;

}



.section-e .item {

  padding: 40px 15px 40px 15px;

  background-color: #CDE7F0;

  min-height: 370px;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  border-left: 2px solid #92D487;

  border-right: 2px solid #92D487;

  position: relative;

  transition: 0.5s;

}



.section-e .item::before {

  content: "";

  position: absolute;

  top: 0px;

  left: 0px;

  width: 100%;

  height: 100%;

  border: 8px solid transparent;

  z-index: 1;

  transition: 0.5s;

}



.section-e .item img {

  margin-bottom: 30px;

}



.section-e .item p {

  font-family: "Candara", sans-serif;

  font-weight: normal;

  font-size: 17px;

  line-height: 30px;

  color: #595959;

  margin-bottom: 10px;

}



.section-e .item h3 {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 20px;

  line-height: 1.5;

  color: #1D0E37;

  margin-bottom: 0px;

}



.section-e .item:hover {

  background-image: url(../images/sec-e-back-hover.webp);

  background-size: cover;

  background-position: center center;

  background-repeat: no-repeat;

}



.section-e .item:hover::before {

  border: 8px solid #F3C400;

}



.section-f {

  position: relative;

  padding-top: 100px;

  padding-bottom: 150px;

  overflow: hidden;

}



.section-f::after {

  position: absolute;

  content: "";

  background-image: url(../images/wave_vector.webp);

  background-size: 100% 100%;

  width: 100%;

  height: 180px;

  right: 0px;

  top: 2%;

  z-index: -1;

}



.section-f::before {

  position: absolute;

  content: "";

  background-image: url(../images/bean-bloack.webp);

  background-size: 100% 100%;

  width: 722px;

  height: 793px;

  right: 0px;

  top: calc(50% - 400px);

  z-index: -1;

}



.section-f h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 40px;

  line-height: 50px;

  letter-spacing: 0.5px;

  color: #1D0E37;

  margin-bottom: 20px;

}



.section-f h3 {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 30px;

  line-height: 40px;

  color: #469AD6;

  margin-bottom: 15px;

}



.section-f p {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 20px;

  line-height: 30px;

  color: #595959;

  margin-bottom: 35px;

  width: 70%;

}



.section-f .content-01 p {

  width: 70%;

}



.section-f .content-03 figure {

  margin: -50px;

}



.section-g {

  background-image: url("../images/section-g-back.webp");

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

  padding-top: 0px;

  padding-bottom: 0px;

}



.section-g::before {

  position: absolute;

  content: "";

  background-image: url(../images/bean-bloack.webp);

  transform: rotate(180deg);

  background-size: 100% 100%;

  width: 750px;

  height: 800px;

  left: 0px;

  top: calc(40% - 350px);

  z-index: -1;

}



.section-g .container {

  padding-right: 70px;

  padding-left: 70px;

}



.section-g h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 40px;

  line-height: 40px;

  letter-spacing: 0.5px;

  color: #1D0E37;

  margin-bottom: 30px;

  margin-left: 40px;

}



.section-g .content-02 {

  display: flex;

  flex-direction: row;

  align-items: center;

  justify-content: flex-end;

}



.section-g .content-02 .block {

  background-image: url(../images/our-room-block-back.webp);

  background-size: 100% 100%;

  display: flex;

  gap: 20px;

  align-items: center;

  padding: 5px 15px 25px 15px;

}



.section-g .content-02 .block h3 {

  font-family: "Candara", sans-serif;

  font-weight: normal;

  font-size: 20px;

  line-height: 30px;

  color: #1D0E37;

  margin-bottom: 0px;

}



.section-g .content-02 .block p {

  font-family: "Candara", sans-serif;

  font-weight: normal;

  font-size: 16px;

  line-height: 24px;

  color: #1D0E37;

  margin-bottom: 0px;

  display: flex;

  flex-direction: column;

  align-items: center;

}



.section-g .content-02 .block p span {

  font-size: 24px;

  font-weight: bold;

  display: block;

}



.section-g .content-02 .row {

  display: flex;

  flex-direction: column;

  gap: 0px;

}



.section-g .content-02 .sec {

  padding: 30px;

  background-image: url(../images/g-content-02-back.webp);

  background-size: 100% 100%;

  width: 100%;

}



.section-g .content-02 .block-1 {

  display: flex;

  justify-content: flex-end;

}



.section-g .content-01 {

  display: flex;

  flex-direction: row;

  align-items: center;

  justify-content: flex-start;

}



.section-g .content-01 figure {

  position: relative;

}



.section-g .content-01 figure::before {

  position: absolute;

  content: "";

  background-image: url(../images/left-bee.webp);

  background-size: 100% 100%;

  width: 175px;

  height: 177px;

  left: 0px;

  top: 0px;

  z-index: 0;

  animation: beeFly-1 5s ease-in-out infinite;

}



@keyframes beeFly-1 {

  0% {

    transform: translate(0, 0) rotate(0deg);

  }



  50% {

    transform: translate(50px, -50px) rotate(10deg);

  }



  100% {

    transform: translate(0, 0) rotate(0deg);

  }

}



.section-g .content-01 figure::after {

  position: absolute;

  content: "";

  background-image: url(../images/right-bee.webp);

  background-size: 100% 100%;

  width: 143px;

  height: 147px;

  right: 138px;

  top: 19px;

  z-index: 0;

  animation: beeFly-2 4s ease-in-out infinite;

}



@keyframes beeFly-2 {

  0% {

    transform: translate(0, 0) rotate(0deg);

  }



  50% {

    transform: translate(-50px, -50px) rotate(-15deg);

  }



  100% {

    transform: translate(0, 0) rotate(0deg);

  }

}



@keyframes floatUpDown {

  0% {

    transform: translateY(0px);

  }



  50% {

    transform: translateY(20px);

    /* move up */

  }



  100% {

    transform: translateY(0px);

    /* back down */

  }

}



.section-g .content-02 .block img {

  width: 100px;

}



.section-g .content-02 .block div {

  display: flex;

  gap: 10px;

  align-items: center;

}



.section-g .content-02 .block a {

  text-decoration: none;

}





.section-h {

  padding: 0px;

  position: relative;

  overflow: hidden;

  padding-top: 50px;

}



.section-h::before {

  position: absolute;

  bottom: -40px;

  left: 0px;

  content: "";

  width: 100%;

  background-image: url(../images/top-back.svg);

  background-size: auto 103%;

  background-repeat: repeat-x;

  padding: 25px 0px 43px 0px;

  animation: moveBackground 30s linear infinite;

  z-index: 2;

  transform: rotate(180deg);

}



.section-h .item {

  position: relative;

  overflow: hidden;

}



.section-h .item::before {

  position: absolute;

  left: 0px;

  bottom: 0px;

  content: "";

  width: 100%;

  height: 100%;

  background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(255, 241, 168, 0.8) 100%);

  transition: 0.5s;

}



.section-h .item::after {

  position: absolute;

  left: 0px;

  bottom: 0%;

  content: "";

  width: 100%;

  height: 100%;

  background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(179, 235, 242, 0.8) 100%);

  opacity: 0;

  transition: 0.5s;

}



.section-h .item h2 {

  z-index: 2;

  position: absolute;

  bottom: 70px;

  left: 0px;

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 25px;

  line-height: 25px;

  color: #469AD6;

  margin-bottom: 0px;

  text-align: center;

  width: 100%;

  transition: 0.5s;

}



.section-h .item:hover h2 {

  color: #1D0E37;

  transform: translateY(-50px);

}



.section-h .item:hover::before {

  bottom: -100%;

}



.section-h .item:hover::after {

  opacity: 1;

}



.section-h .content-01 {

  text-align: center;

}



.section-h h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 40px;

  line-height: 50px;

  letter-spacing: 0.5px;

  color: #1D0E37;

  margin-bottom: 20px;

}



.section-h .owl-carousel .item a {

  text-decoration: none;

}



.footer-section {

  background-color: #CDE7F0;

  position: relative;

  overflow: hidden;

  padding-top: 30px;

  padding-left: 0px;

  padding-right: 0px;

}



.footer-section::before {

  position: absolute;

  content: "";

  background-image: url(../images/footer-bee-block.webp);

  transform: rotate(180deg);

  background-size: 100% 100%;

  width: 600px;

  height: 100%;

  left: 0px;

  top: 0%;

  z-index: 0;

}



.footer-section::after {

  position: absolute;

  content: "";

  background-image: url(../images/footer-bee-block.webp);

  background-size: 100% 100%;

  width: 600px;

  height: 100%;

  right: 0px;

  top: 0%;

  z-index: 0;

}



.footer-section .fa-slash-three::before {

  content: "///";

  font-size: 14px;

}



.footer-section h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 28px;

  line-height: 28px;

  color: #083B5F;

  margin-bottom: 30px;

}



.footer-section .content-01 {

  z-index: 1;

}



.footer-section .content-01 figure {

  margin-bottom: 0px;

}



.footer-section .content-01 .fig-1 {

  margin-bottom: 20px;

}



.footer-section .content-02 {

  padding-top: 50px;

  z-index: 1;

}



.footer-section .content-02 i {

  background-color: #469AD6;

  color: white;

  width: 40px;

  height: 40px;

  border-radius: 100%;

  display: flex;

  flex-direction: row;

  justify-content: center;

  align-items: center;

  margin-right: 20px;

}



.footer-section .content-02 .box {

  display: flex;

  margin-bottom: 20px;

}



.footer-section .content-02 h3 {

  font-family: "Fredoka", sans-serif;

  font-weight: 400;

  font-size: 20px;

  line-height: 20px;

  color: #083B5F;

  margin-bottom: 0px;

}



.footer-section .content-02 p {

  font-family: "Candara", sans-serif;

  font-weight: 300;

  font-size: 18px;

  line-height: 18px;

  color: rgba(89, 89, 89, 0.8);

  margin-bottom: 0px;

}



.footer-section .content-02 p a {

  color: #595959;

  text-decoration: none;

  transition: 0.5s;

}



.footer-section .content-02 p a:hover {

  color: #469AD6;

}



.footer-section .content-03 {

  z-index: 1;

  padding-top: 50px;

}



.footer-section .content-03 ul {

  list-style: none;

  padding-top: 0px;

  padding-left: 0px;

  margin-bottom: 10px;

}



.footer-section .content-03 ul li {

  margin-bottom: 7px;

}



.footer-section .content-03 ul li::before {

  font-family: "Font Awesome 6 Free";

  font-weight: 900;

  content: "\f04b";

  color: rgba(8, 59, 95, 0.8);

  font-size: 12px;

  margin-right: 3px;

}



.footer-section .content-03 ul li:has(a:hover):before,

.footer-section .content-03 ul li:has(a.active):before {

  color: #083B5F;

}



.footer-section .content-03 ul li a {

  font-family: "Candara", sans-serif;

  font-size: 18px;

  font-weight: 300;

  line-height: 16px !important;

  color: rgba(89, 89, 89, 0.8);

  text-decoration: none;

  transition: 0.5s;

  position: relative;

}



.footer-section .content-03 ul li a:hover,

.footer-section .content-03 ul li a.active {

  color: #083B5F;

}



.footer-section .content-03 ul li a::before {

  content: "";

  position: absolute;

  width: 100%;

  height: 1px;

  background-color: #083B5F;

  left: 0px;

  bottom: 4px;

  transform: scaleX(0);

  transform-origin: bottom right;

  transition: transform 0.8s ease-out;

}



.footer-section .content-03 ul li a:hover::before,

.footer-section .content-03 ul li a.active::before {

  transform: scaleX(1);

  transform-origin: bottom left;

}



.footer-section .content-04 {

  padding-top: 50px;

  z-index: 1;

}



.footer-section .content-04 iframe {

  width: 100%;

  height: 280px;

    margin-bottom: 10px;

}



.copyright-section {

  padding: 17px 0px;

  background-color: #92D487;

}



.copyright-section p {

  font-family: "Poppins", sans-serif;

  font-weight: 400;

  font-size: 15px;

  line-height: 20px;

  letter-spacing: 0.15px;

  color: #1D0E37;

  margin-bottom: 0px;

  text-align: center;

}



.copyright-section p a {

  font-weight: 500;

  transition: 0.5s;

  color: #1D0E37;

  display: inline-block;

}



.copyright-section p a:hover {

  color: #469AD6;

  text-decoration: none;

}







/* our team page css */

.hexagon {

  width: 250px;

  height: 280px;

  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  text-align: center;

  padding: 30px;

  margin-bottom: -60px;

  background-color: #fff3c3;

}



.hexagon-div {

  background-color: #cde7f0;

}



.hexagon:hover {

  transform: scale(1.05);

  transition: 0.3s;

  cursor: pointer;

}



.row-offset {

  margin-left: 123px;

}

.out-team-row-offset{

    margin-left: 136px !important;

    padding-top: 15px;

    padding-bottom: 15px;

}

.out-team-col-auto{

    margin: -24px 14px !important;

}

.out-team-hexagon{

    margin: 2px 5px 4px 4px !important;

}

.modal-content {

  border-radius: 20px;

  border: 5px solid #f2c500;

}



.modal-footer .btn {

  color: #1D0E37;

  background-color: #cde7f0;

}



.modal-footer .btn:hover {

  background-color: #f2c500 !important;

}



.modal-header {

  border-bottom: none;

}



.modal-footer {

  border-top: none;

}



.modal-body p img {

  margin-right: 10px;

}



.modal-body p a {

  font-family: "Candara", sans-serif;

  font-weight: bold;

  color: #595959;

  font-size: 18px;

  transition: 0.5s;

}



.modal-body p a:hover {

  color: black;

  text-decoration: none;

}



.honeycomb-container::before {

  position: absolute;

  content: "";

  background-image: url(../images/bean-bloack.webp);

  transform: rotate(180deg);

  background-size: 100% 100%;

  width: 750px;

  height: 800px;

  left: 0%;

  top: 90%;

  z-index: -1;

}

.our-team-honeycomb-container {

  padding-top: 20px;

}

.our-team-honeycomb-container::after {

  position: absolute;

  content: "";

  background-image: url(../images/left-bee.webp);

  background-size: 100% 100%;

  width: 175px;

  height: 177px;

  left: 68%;

  top: 95%;

  z-index: 0;

  animation: beeFly-1 5s ease-in-out infinite;

}



.honeycomb-container .figure {

  position: absolute;

  top: 110%;

  left: 64%;

  width: auto;



}



/* healthy living page css */

.healthy-living-div {

  display: flex;

  flex-direction: row;

  align-content: center;

  justify-content: center;

  align-items: center;

  margin-bottom: 30px;

}



.healthy-living-div div {

  display: flex;

  justify-content: center;

  align-items: center;

  text-align: center;

  border: #f0c407 2px dashed;

  width: 50%;

  min-height: 253.64px;

  margin: 0px 15px;

}



.healthy-living-div img {

  animation: zoomOut 3s ease infinite;

}



.healthy-living-div div p {

  font-weight: bold;
    font-size: 30px;
}

.healthy {

  display: none;

}

.healthy-living-row img,

.good-healthy-living-row img {

  width: 100%;

}



.good-healthy-living-row p {

  font-size: 18px;

  text-align: center;

}



.good-healthy-living-row p a {

  white-space: break-spaces;

  color: #469AD6;

  text-decoration: none;

}



.good-healthy-living-row p a:hover {

  color: #1D0E37;

}



.inner-section-h {

  padding-top: 0px;

}



.inner-section-h h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 45px;

  line-height: 40px;

  color: #1D0E37;

  padding: 20px 0px;

  margin: 0;

  text-align: center;

}



.inner-section-h .item h2 {

  font-size: 30px;

}



.nursery-kitchen-img {

  text-align: center;

}





/* our-day-and-timetable page css */



.nursery-info-section {

  font-family: "Candara", sans-serif;

  color: #595959;

}



.info-grid {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

  gap: 20px;

  margin-bottom: 40px;

}



.info-card {

  border: 3px solid #f8c300;

  border-radius: 20px;

  padding: 20px;

  display: flex;

  align-items: center;

  gap: 15px;

  text-decoration: none;

  color: inherit;

  transition: transform 0.3s ease;

}



.info-card:hover {

  transform: translateY(-5px);

}



.info-card img {

  width: 60px;

  height: 60px;

  object-fit: contain;

}



/* Timetable Section */

.timetable-box {

  /* background: var(--nursery-light); */

  border-radius: 30px;

  padding: 30px;

  border: 4px dashed #f8c300;

}



.section-title {

  text-align: center;

}



.tab-container {

  display: flex;

  justify-content: center;

  gap: 10px;

  margin-bottom: 25px;

  flex-wrap: wrap;

}



.tab-btn {

  background: white;

  border: 2px solid #f8c300;

  padding: 10px 20px;

  border-radius: 25px;

  cursor: pointer;

  font-weight: bold;

  color: #1D0E37;

  transition: 0.3s;

}



.tab-btn.active {

  background: #cde7f0;

  color: #1D0E37;

}



.day-content {

  display: none;

}



.day-content.active {

  display: block;

  animation: fadeIn 0.5s;

}



@keyframes fadeIn {

  from {

    opacity: 0;

  }



  to {

    opacity: 1;

  }

}



.routine-table {

  width: 100%;

  border-collapse: separate;

  border-spacing: 0 8px;

}



.routine-row {

  background: white;

  border-radius: 15px;

}



.time-col {

  background: #cde7f0;

  color: #1D0E37;

  padding: 15px;

  border-radius: 15px 0 0 15px;

  width: 200px;

  text-align: center;

  font-weight: bold;

}



.event-col {

  padding: 10px 20px;

  border: 2px solid #f8c300;

  border-left: none;

  border-radius: 0 15px 15px 0;

  display: flex;

  align-items: center;

  gap: 15px;

}



.event-col img {

  width: 40px;

  height: 40px;

  border-radius: 50%;

}



.pink-highlight {

  padding: 2px 5px;

  border-radius: 5px;

  font-weight: bold;

  background-color: #cde7f0;

}



.info-card-class img {

  width: 100%;

  height: auto;

  animation: floatUpDown 3s ease-in-out infinite;

}



.tooltip-trigger {

  position: relative;

  cursor: help;

}



.tooltip-box {

  visibility: hidden;

  width: auto;

  background-color: #333;

  color: #fff;

  text-align: left;

  border-radius: 8px;

  padding: 15px;

  position: absolute;

  z-index: 100;

  bottom: 110%;

  left: 20px;

  opacity: 0;

  transition: opacity 0.3s;

  font-size: 0.85rem;

  font-weight: normal;

  line-height: 1.4;

  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);

}

.tooltip-box h3 {

  color: #fff !important;

  padding-bottom: 15px !important;

}

.tooltip-box p {

  color: #fff !important;

  font-size: 16px !important;

}



.tooltip-box::after {

  content: "";

  position: absolute;

  top: 100%;

  left: 30px;

  border-width: 8px;

  border-style: solid;

  border-color: #333 transparent transparent transparent;

}



.tooltip-trigger:hover .tooltip-box {

  visibility: visible;

  opacity: 1;

}



.tooltip-trigger:hover {

  background-color: #fff9e6;

}



.our-day-and-timetable {

  width: 25px !important;

  height: 25px !important;

  border-radius: 0 !important;

}





/* Core Makaton Signs page css */



.intro-box {

  margin-bottom: 40px;

  line-height: 1.6;

}



.makaton-slideshow {

  width: 100%;

  max-width: 750px;

  margin: 0 auto 50px;

  border: 8px solid #f0c500;

  border-radius: 20px;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);

  overflow: hidden;

  position: relative;

}



.slides-wrapper {

  display: flex;

  transition: transform 0.5s ease-in-out;

}



.slide-img {

  min-width: 100%;

  height: 600px;

  object-fit: cover;

  background: #eee;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 1.2rem;

  color: #888;

}



.resources-box {

  background: #cde7f0;

  border: 3px dashed #f0c500;

  border-radius: 25px;

  padding: 30px;

  margin-top: 40px;

}



.resources-box2 {

  display: flex;

  gap: 50px;

}



.resources-box2 img {

  animation: zoomOut 3s ease infinite;

}



.resource-item {

  display: flex;

  align-items: center;

  gap: 15px;

  margin-bottom: 15px;

  padding: 10px;

  background: #fff3c3;

  border-radius: 15px;

  transition: 0.2s;

}



.resource-item:hover {

  background: #fef4e6;

}



.prev-btn,

.next-btn {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  background-color: rgba(0, 0, 0, 0.5);

  color: white;

  padding: 15px;

  border: none;

  cursor: pointer;

  font-size: 18px;

  border-radius: 0 5px 5px 0;

  transition: 0.3s;

}



.next-btn {

  right: 0;

  border-radius: 5px 0 0 5px;

}



.prev-btn:hover,

.next-btn:hover {

  background-color: rgba(0, 0, 0, 0.8);

}



.button-div {

  display: flex;

  gap: 50px;

}



.hexagon-links-container {

  padding-top: 15px;

}



.hexagon-links-container .button-div {

  padding-top: 15px;

}





/* Safeguarding page css */



.safeguarding-container .hexagon {

  width: 300px;

  height: 330px;

  background-color: #95d487;

}



.safeguarding-container {

  margin-bottom: 50px;

}



.safeguarding-page .btn-button {

  margin-top: 10px;

}



.curved-text {

  position: absolute;

  top: -60px;

  width: 100%;

  text-align: center;

  font-weight: bold;

  font-size: 1.2rem;

  text-transform: uppercase;

  letter-spacing: 2px;

}



.reasoning-box {

  padding: 25px;

  border-radius: 20px;

  margin-bottom: 50px;

  border-left: 10px solid #000;

}



.info-section {

  background: white;

  border: 2px solid #eee;

  border-radius: 25px;

  padding: 30px;

  margin-bottom: 30px;

  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);

}



.info-section1 {

  background: #fff3c3;

}



.info-section2 {

  background: #cde7f0;

}



.info-section3 {

  background: #cde7f0;

}



.info-section h3 {

  padding-bottom: 10px;

  margin-top: 0;

}



.grid-2 {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 25px;

}



.emergency-box {

  background: #fff5f5;

  border: 2px solid #ff4d4d;

  border-radius: 20px;

  padding: 20px;

  margin-top: 20px;

}



.emergency-box h4 {

  color: #d32f2f;

  margin-top: 0;

}



.contact-btn {

  display: inline-block;

  color: white;

  padding: 10px 20px;

  border-radius: 15px;

  text-decoration: none;

  font-weight: bold;

  margin-top: 10px;

}

.contact-info-box #company-details dt {

    font-size: 25px !important;

}

 

.contact-info-box {

    padding: 20px;

    border-radius: 40px;

    border: 2px solid #f2c500;

    text-align: center !important;

    float: initial;

    display: grid;

}

#company-details {



    font-family: "Candara", sans-serif;



    font-size: 16px;



    position: sticky;



}

 

#company-details:before {



    position: absolute;



    content: "";



    background-image: url(../images/left-bee.webp);



    background-size: 100% 100%;



    width: 175px;



    height: 177px;



    left: -200px;



    top: 0px;



    z-index: 0;



    animation: beeFly-1 5s ease-in-out infinite;



}

 

#company-details:after {

    position: absolute;

    content: "";

    background-image: url(../images/right-bee.webp);

    background-size: 100% 100%;

    width: 143px;

    height: 147px;

    right: -161px;

    top: 85%;

    z-index: 0;

    animation: beeFly-2 4s ease-in-out infinite;

}

.form-control {

    height: 50px;

    border: 1px dashed #f2c500 !important;

}

 

#submit, #reset {

    border: 2px dashed #f2c500;

}





.safety-links {

  display: flex;

  gap: 30px;

}



.safety-links a {

  display: block;

  margin: 10px 0;

  text-decoration: none;

  font-weight: 500;

}



.safeguarding-container .hexagon-div {

  background-color: #f0c407;

}



.safeguarding-container .row-offset {

  margin-left: 150px;

}



.safeguarding-page {

  padding-top: 200px;

}

.safeguarding-page::before {

    position: absolute;

    content: "";

    background-image: url(../images/wave_vector.webp);

    background-size: 100% 100%;

    width: 100%;

    height: 180px;

    right: 0px;

    top: 140%;

    z-index: -1;

}



.safeguarding-container .figure {

    position: absolute;

    top: 400px;

    right: 0px;

    width: 250px;

}



.safeguarding-container .figure img {

  animation: zoomOut 3s ease infinite;

}



.safeguarding-container-read-p {

  margin-bottom: 30px;

  display: flex;

  gap: 50px;

  justify-content: center;

}



.safeguarding-container-read-p p {

  font-size: 40px !important;

  color: #ff0000 !important;

  font-weight: 500 !important;

}

.safeguarding-container-read-p .safe {

  position: absolute;

    bottom: -70%;

}



/* common-childhood-illnesses page css */



.illness-table-container {

  overflow-x: auto;

}



.illness-table {

  width: 100%;

  border-collapse: collapse;

  background: white;

  border: 1px solid #ccc;

}



.illness-table th {

  background-color: #f8f9fa;

  color: #333;

  font-weight: bold;

  padding: 15px;

  border: 1px solid #ccc;

  text-align: left;

}



.illness-table td {

  padding: 15px;

  border: 1px solid #ccc;

  vertical-align: top;

  line-height: 1.5;

}



.illness-name {

  font-weight: bold;

  color: var(--nursery-green);

}



.illness-img {

  width: 100%;

  max-width: 180px;

  border-radius: 8px;

  margin-top: 10px;

  display: block;

}





/* Sally, Our Safeguarding Puppet page css */

.sally-our-safeguarding-puppet-row {

  padding-top: 50px;

}



.sally-our-safeguarding-puppet-row img {

  width: 100%;

}



/* COVID page css */



.covid-header {

  text-align: center;

  background: #cde7f0;

  padding: 30px;

  border-radius: 30px;

  margin-bottom: 40px;

}



.steps-grid {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

  gap: 20px;

  margin-bottom: 40px;

}



.step-card {

  background: #fff3c3;

  padding: 20px;

  border-radius: 20px;

  border-bottom: 5px solid #efc30e;

  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);

  text-align: center;

}



.alert-box {

  background: #cde7f0;

  padding: 25px;

  border-radius: 20px;

  margin: 30px 0;

}



.symptoms-box {

  background: #cde7f0;

  padding: 30px;

  border-radius: 30px;

  border: 2px dashed #efc30e;

}



.faq-section {

  margin-top: 50px;

}



.faq-item {

  margin-bottom: 15px;

  border-radius: 15px;

  overflow: hidden;

  border: 1px solid #ddd;

}



.faq-question {

  background: #fff3c3;

  padding: 18px 25px;

  width: 100%;

  text-align: left;

  border: none;

  outline: none;

  font-size: 1.1rem;

  font-weight: bold;

  color: var(--nursery-blue);

  cursor: pointer;

  display: flex;

  justify-content: space-between;

  align-items: center;

  transition: background 0.3s;

}



.faq-question:hover {

  background: #f0f8ff;

}



.faq-answer {

  max-height: 0;

  overflow: hidden;

  transition: max-height 0.3s ease-out;

  background: #fafafa;

}



.faq-answer-content {

  padding: 20px 25px;

  border-top: 1px solid #eee;

}



.faq-question::after {

  content: '+';

  font-size: 1.5rem;

}



.faq-question.active::after {

  content: '−';

}



.link-btn {

  color: var(--nursery-blue);

  font-weight: bold;

  text-decoration: underline;

}



/* Absence Reporting page css */

.studybugs-section {

  margin: 40px auto;

  padding: 40px;

  background-color: #cde7f0;

  border-radius: 40px;

  border: 3px solid #f2c500;

  color: #444;

}





.studybugs-header {

  text-align: center;

  margin-bottom: 40px;

}



.studybugs-logo {

  margin-bottom: 20px;

}



.studybugs-header h2 {

  font-size: 2.2rem;

  margin: 10px 0;

}



.intro-text {

  font-size: 1.15rem;

  line-height: 1.7;

  text-align: center;

  max-width: 800px;

  margin: 0 auto 30px;

}



.reasons-title {

  text-align: center;

  font-size: 1.5rem;

  margin-bottom: 25px;

}



.reasons-grid {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

  gap: 20px;

  margin-bottom: 40px;

}



.reason-card {

  background: #fff3c3;

  padding: 25px;

  border-radius: 20px;

  text-align: center;

  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);

  border-top: 5px solid #efc30e;

  transition: transform 0.3s;

}



.reason-card:hover {

  transform: translateY(-5px);

}



.reason-number {

  display: inline-block;

  width: 40px;

  height: 40px;

  background: #93d488;

  color: white;

  border-radius: 50%;

  line-height: 40px;

  font-weight: bold;

  margin-bottom: 15px;

}



.cta-container {

  background: transparent;

  padding: 30px;

  border-radius: 25px;

  border: 2px dashed #efc30e;

}



.cta-container div {

  display: flex;

  gap: 50px;

}



/* fun learning to do page css */



.hero-banner {

  background-color: #fff3c3;

  padding: 40px;

  border-radius: 30px;

  text-align: center;

  border: 4px dashed #f0c407;

  margin-bottom: 40px;

}



.resources-grid {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

  gap: 25px;

  margin-bottom: 50px;

}



.resource-card {

  background: white;

  padding: 30px;

  border-radius: 25px;

  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);

  border-bottom: 6px solid #cde7f0;

  transition: transform 0.3s;

}



.resource-card:hover {

  transform: translateY(-5px);

}



.alliance-box {

  background-color: #cde7f0;

  border-radius: 30px;

  padding: 40px;

  display: flex;

  align-items: center;

  gap: 30px;

  margin-bottom: 40px;

}



.alliance-logo {

  width: 150px;

  flex-shrink: 0;

  background: white;

  padding: 10px;

  border-radius: 15px;

}



.eyfs-section {

  border: 3px solid #ea951c;

  padding: 30px;

  border-radius: 25px;

  background: white;

}



.hygiene-tips {

  background: #cde7f0;

  padding: 20px;

  border-radius: 15px;

  margin-top: 20px;

  border-left: 5px solid #ea951c;

}





/* policies page css */

.policies-container {

  margin: 0 auto;

}



.policy-list {

  display: flex;

  flex-direction: column;

  gap: 15px;

}



.policy-item {

  background: white;

  border: 1px solid #eee;

  padding: 15px 25px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  border-radius: 4px;

  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.02);

  transition: background 0.2s;

}



.policy-item:hover {

  background-color: #fcfcfc;

}



.policy-info {

  display: flex;

  align-items: center;

  gap: 15px;

  font-size: 1.1rem;

  color: #d32f2f;

}



.pdf-icon {

  color: white;

  background-color: #d32f2f;

  padding: 5px 8px;

  border-radius: 4px;

  font-size: 0.8rem;

  font-weight: bold;

}



.actions {

  display: flex;

  gap: 20px;

}



.action-btn {

  color: #444;

  text-decoration: none;

  font-size: 1.2rem;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 35px;

  height: 35px;

  border-radius: 50%;

  transition: background 0.3s;

}



.action-btn:hover {

  background-color: #f0f0f0;

}



.view-btn {

  color: #444;

}



.download-btn {

  color: #777;

}





.policy-item .view-btn {

  color: #d32f2f;

}





.policies-modal {

  display: none;

  position: fixed;

  z-index: 1000;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0.8);

}



.policies-modal .modal-content {

  position: relative;

  background-color: #fefefe;

  margin: 2% auto;

  padding: 10px;

  width: 80%;

  height: 90vh;

  border-radius: 8px;

}



.policies-modal .close-modal {

  position: absolute;

  right: -15px;

  top: -15px;

  color: #fff;

  font-size: 30px;

  font-weight: bold;

  cursor: pointer;

  background: #6a1b9a;

  width: 35px;

  height: 35px;

  border-radius: 50%;

  text-align: center;

  line-height: 32px;

}



#pdfFrame {

  width: 100%;

  height: 100%;

}





/* Parent Information page css */



.section-card {

  background: white;

  border-radius: 30px;

  padding: 40px;

  margin-bottom: 40px;

  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);

  border: 2px solid #f0f0f0;

}



.section-header {

  display: flex;

  align-items: center;

  gap: 15px;

  margin-bottom: 25px;

  border-bottom: 3px dashed #eee;

  padding-bottom: 15px;

}



.section-header h2 {

  margin: 0;

  font-size: 2rem;

}



.eric-info {

  background-color: #ebf5fb;

  padding: 20px;

  border-radius: 20px;

  border-left: 8px solid var(--nursery-blue);

  margin-bottom: 25px;

}



.download-container {

  display: flex;

  flex-wrap: wrap;

  gap: 15px;

  margin-top: 20px;

}



.author-link {

  display: inline-block;

  margin-top: 10px;

  color: var(--nursery-green);

  font-weight: bold;

  text-decoration: underline;

}



.parent-info-page .button-div {

  gap: 25px;

  flex-wrap: wrap;

}







/* admisions page css */

.enrolment-section {

  padding: 40px;

  background-color: #fff;

  border-radius: 35px;

  border: 3px dashed #f0c500;

  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);

}



.enrolment-header {

  text-align: center;

  margin-bottom: 35px;

}



.enrolment-header h2 {

  color: var(--nursery-purple);

  font-size: 2.2rem;

  margin-bottom: 15px;

}



.fee-container {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

  gap: 25px;

  margin: 35px 0;

}



.fee-card {

  background: #cde7f0;

  padding: 30px;

  border-radius: 25px;

  text-align: center;

  border: 2px dashed #f0c407;

  transition: transform 0.3s;

}



.fee-card:hover {

  transform: translateY(-5px);

  border-color: #f0c407;

}



.fee-card h3 {

  margin-top: 0;

  font-size: 1.4rem;

}



.fee-amount {

  font-size: 2.5rem;

  font-weight: bold;

  color: #f0c407;

  margin: 15px 0;

  display: block;

}



.fee-note {

  font-size: 0.95rem;

  color: #666;

}



.action-area {

  margin-top: 40px;

  padding-top: 30px;

  border-top: 2px dashed #eee;

}



.action-area div {

  display: flex;

  gap: 20px;

}



.fee-note strong {

  font-size: 25px;

  color: #f0c407;

}







/* fees page css */



.info-grid {

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

  gap: 20px;

  margin: 40px 0;

}



.our-day-and-timetable-info-grid {

  grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));

}



.info-box {

  padding: 25px;

  border-radius: 40px;

  border: 2px solid #f2c500;

  height: 100%;

}





.info-box ul {

  list-style-type: none;

  padding: 0;

  font-size: 0.95rem;

  line-height: 1.5;

}



.info-box li::before {

  content: "- ";

}

.info-grid ul li a {

  font-weight: 700;

  color: #000;

}



.about-us {

  background-color: #fff3c3;

}



.included {

  background-color: #a1ea91;

}



.not-included {

  background-color: #ea6868bd;

}



.not-included ul li {

  color: #000000 !important;

}



.age-group-title {

  text-align: left;

  font-size: 1.5rem;

  font-weight: bold;

  margin: 40px 0 20px;

}



.age-grid {

  display: grid;

  gap: 20px;

  grid-auto-flow: column;

}



.age-card {

  cursor: pointer;

  transition: transform 0.2s;

  text-align: center;

}



.age-card:hover {

  transform: scale(1.05);

}



.age-card img {

  width: 100%;

  max-width: 300px;

  border-radius: 15px;

}



#fee-display {

  margin-top: 40px;

  padding: 20px;

  border: 2px dashed #f0c407;

  background-color: #cde7f0;

  border-radius: 25px;

  display: none;

}



#fee-content div {

  display: flex;

  gap: 25px;

}



#fee-content iframe {

  max-width: 100%;

  border: 1px solid #ddd;

}



/* funding faqs page */



/* Accordion Style */

.faq-item {

  border-bottom: 1px solid #ddd;

  margin-bottom: 5px;

}



.faq-question {

  width: 100%;

  background: #cde7f0;

  border: none;

  outline: none;

  text-align: left;

  padding: 18px;

  font-size: 1.1rem;

  font-weight: 600;

  cursor: pointer;

  display: flex;

  justify-content: space-between;

  align-items: center;

  transition: background 0.3s;

  text-transform: uppercase;

}



.faq-question:hover {

  background: #f1f1f1;

}



.faq-question::after {

  content: '\002B';

  /* Plus sign (+) */

  font-size: 1.5rem;

  color: #f1c500;

}



.faq-question.active::after {

  content: '\2212';

  /* Minus sign (-) */

}



.faq-answer {

  max-height: 0;

  overflow: hidden;

  transition: max-height 0.3s ease-out;

  background-color: white;

}



.faq-answer-content {

  padding: 20px;

  line-height: 1.6;

  border-left: 4px solid #e28d13;

}



.faq-answer ul,

.faq-answer ol {

  margin-left: 20px;

}

.hygiene-tips p a {

  font-weight: 700;

    color: #000;

}

.hygiene-tips strong {

  font-family: "Fredoka", sans-serif;

    font-weight: 500;

    font-size: 20px;

    line-height: 50px;

}

.inner-div .bee-wrapper {

    position: relative;

    width: 100%;

    max-width: max-content;

    margin: 35px auto;

}



/* BOX */

.inner-div .bee-box {

    position: relative;

    padding: 30px;

    border-radius: 15px;

    background: #fffbea;

    border: 2px dashed #f4c542;

    text-align: center;

    z-index: 2;

}



/* SVG PATH */

.inner-div .bee-path {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

    z-index: 1;

}



.inner-div .bee-path path {

    fill: none;

    stroke: #7ac142;

    stroke-width: 3;

    stroke-dasharray: 8 8;

}



/* BEE */

.inner-div .bee {

    position: absolute;

    width: 550px;

    offset-path: path("M150,20 C100,80 200,150 120,250");

    offset-rotate: auto;

    animation: fly 6s linear infinite;

    z-index: 3;

}



/* ANIMATION */

@keyframes fly {

    0% {

        offset-distance: 0%;

    }

    100% {

        offset-distance: 100%;

    }

}





.highlight-box {

  background-color: #fff3e0;

  padding: 10px;

  border-radius: 5px;

  margin: 10px 0;

}





.table-main-title {

  text-transform: uppercase;

  padding-bottom: 10px;

  margin-top: 40px;

  font-size: 1.3rem;

}



.table-responsive {

  overflow-x: auto;

  margin: 20px 0;

}



.styled-table {

  width: 100%;

  border-collapse: collapse;

  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);

  background-color: white;

}



.styled-table th {

  background-color: #eb981e;

  color: white;

  text-align: left;

  padding: 15px;

  font-weight: 600;

}



.styled-table td {

  padding: 15px;

  border-bottom: 1px solid #eee;

  vertical-align: middle;

}



.styled-table tbody tr:nth-of-type(even) {

  background-color: #f8f0fc;

}



.styled-table tbody tr:hover {

  background-color: #f1e4f7;

  transition: 0.3s;

}



.link-info {

  background: #f0f0f0;

  padding: 10px;

  border-radius: 5px;

  display: inline-block;

  font-size: 0.9rem;

}



.warning-note {

  color: #d32f2f;

  font-size: 0.95rem;

  background: #ffebee;

  padding: 10px;

  border-left: 5px solid #d32f2f;

  display: inline-block;

}



.funding-tables-container {

  padding: 30px 0px;

}



.our-facilities-div .figure {

  position: absolute;

  top: 145%;

  left: 55%;

  width: auto;

}









.carousel-inner-main {

  width: 100% !important;

  height: auto !important;

}



.carousel-inner-layout {

  height: 800px !important;

}



.inner-row {

  padding: 50px 0px;

}



.inner-full h1 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 50px;

  line-height: 50px;

  color: #1D0E37;

  padding: 0px 0px 15px;

  margin: 0;

}



.inner-full h2 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 45px;

  line-height: 40px;

  color: #1D0E37;

  padding: 25px 0px;

  margin: 0;

}



.inner-full h3 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 40px;

  line-height: 35px;

  color: #1D0E37;

  padding: 10px 0px;

  margin: 0;

}



.inner-full h4 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 35px;

  line-height: 35px;

  color: #1D0E37;

  padding: 10px 0px;

  margin: 0;

}



.inner-full h5 {

  font-family: "Fredoka", sans-serif;

  font-weight: 500;

  font-size: 30px;

  line-height: 30px;

  color: #1D0E37;

  padding: 10px 0px;

  margin: 0;

}



.inner-full p {

  font-family: "Candara", sans-serif;

  font-weight: 400;

  font-size: 18px;

  line-height: 35px;

  color: #595959;

  margin: 0px;

}



.inner-full ul li {

  font-family: "Candara", sans-serif;

  font-weight: 400;

  font-size: 18px;

  line-height: 35px;

  color: #595959;

  margin: 0px;

}



.inner-full a {

  transition: 1s;

  color: #000000;

  white-space: nowrap;

}



.inner-full a:hover {

  transition: 1s;

  color: #595959;

  text-decoration: none;

}





#company-details {

  font-family: "Candara", sans-serif;

  font-size: 16px;

}



dt {

  clear: both;

  float: left;

  width: 100%;

  margin-top: 10px;

}



dd {

  float: left;

  margin: 5px 0 0 0;

  font-size: 16px;

}



#company-details dl,

#company-details dd {

  margin-top: 0px !important;

  margin-bottom: 10px;

  font-size: 16px;

}



#company-details dt {

  font-size: 16px;

  color: #595959;

}



#company-details dd {

  font-size: 16px;

  color: #000000;

}



.privacy-details {

  width: 100%;

  box-shadow: 1px 1px 2px 1px #eb981e;

  padding: 15px;

  margin-bottom: 25px;

}



.our-team-row {

  padding-top: 80px;

  align-items: center;

}



.our-team-div {

  margin-bottom: 10px;

}



.zend_form textarea.form-control {

  min-height: 250px;

}



.div-section {

  background: #4c8a9f;

  border: 4px solid #f3c400;

  border-radius: 25px;

  padding: 20px;

  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);

}



.div-section h2,

.div-section p {

  color: #fff;

}



.about-inner {

  padding-top: 30px;

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 20px;

  padding-left: 0;

  padding-right: 0;

}



/* .about-inner .column {

    background: #79aabb;

    border: 4px solid #f3c400;

    border-radius: 25px;

    padding: 20px;

    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);

} */



.about-inner h2 {

  font-size: 35px;

  color: #1D0E37;

}



.about-inner ul {

  padding-left: 20px;

}



.about-inner li {

  margin-bottom: 10px !important;

  color: #595959;

}

.about-inner .column{

    border: 4px dashed #f3c400;

}

.about-inner .column-head{

    text-align: center;

    border-bottom: 4px dashed #f3c400;

    margin-top: 20px;

}

.about-inner .column-head img{

    border-radius: 15px;

    animation: zoomOut 3s ease infinite;

}

.footer-section .content-04 .btn-button a {

    padding: 10px 45px 10px 45px !important

}
.footer-section .content-01{
  text-align: center;
}
.footer-section .content-01 .fig-1 {
  margin-bottom: 20px;
}
.footer-section .content-01 .fig-1 img{
    width: 15%;
}

#contact-form .btn-primary{
    background-color: #F3C400;
    border-color: #F3C400;
}
#contact-form .btn-primary.disabled, #contact-form .btn-primary:disabled{
    background-color: #F3C400;
    border-color: #F3C400;
}

/* facility page css */

:root {
      --primary: #f59e0b;
      --secondary: #10b981;
      --accent: #3b82f6;
      --dark: #1f2937;
      --light-bg: #f8fafc;
      --card-bg: #ffffff;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }

    /* Hero Banner */
    .hero {
      background: linear-gradient(135deg, #fef3c7 0%, #e0f2fe 100%);
      text-align: center;
      padding: 3rem 1.5rem;
    }

    .hero h1 {
      font-size: 2.4rem;
      color: var(--dark);
      margin-bottom: 0.5rem;
    }

    .hero p {
      color: #4b5563;
      font-size: 1.1rem;
    }

    .container {
      max-width: 1200px;
      margin: 2rem auto;
      padding: 0 1.5rem;
    }

    /* Main Full Tour Video Card */
    .main-video-card {
      background: var(--card-bg);
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
      margin-bottom: 3rem;
      border: 1px solid #e2e8f0;
    }

    .video-card-header {
      padding: 1.2rem 1.5rem;
      background: var(--secondary);
      color: white;
      font-size: 1.1rem;
      font-weight: 600;
    }

    .video-wrapper {
      position: relative;
      padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
      height: 0;
      overflow: hidden;
      /* background: #000; */
    }
    .toddler-video-wrapper, .kitchen-video-wrapper{
      padding-bottom: 39.25%;
    }

    .video-wrapper video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      border: 0;
    }

    /* Category Filter Navigation Bar */
    .filter-wrapper {
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 0.8rem;
      margin-bottom: 2.5rem;
    }

    .filter-btn {
      background: #ffffff;
      border: 2px solid #e2e8f0;
      padding: 0.6rem 1.3rem;
      border-radius: 30px;
      font-weight: 600;
      color: var(--dark);
      cursor: pointer;
      transition: all 0.3s ease;
    }

    .filter-btn:hover,
    .filter-btn.active {
      background: var(--primary);
      color: white;
      border-color: var(--primary);
      box-shadow: 0 4px 12px rgba(245, 158, 11, 0.25);
    }

    /* Section Cards Structure */
    .facility-section {
      background: var(--card-bg);
      border-radius: 16px;
      padding: 2rem;
      margin-bottom: 2.5rem;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
      border: 1px solid #e2e8f0;
      transition: all 0.3s ease;
    }

    .section-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 2px solid #f1f5f9;
      padding-bottom: 1rem;
      margin-bottom: 1.5rem;
      flex-wrap: wrap;
      gap: 1rem;
    }

    .section-title {
      font-size: 1.5rem;
      color: var(--dark);
    }

    .badge {
      background: #fef3c7;
      color: #d97706;
      font-size: 0.85rem;
      font-weight: 700;
      padding: 0.3rem 0.8rem;
      border-radius: 20px;
    }

    .section-media-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 1.5rem;
      margin-bottom: 1.5rem;
    }

    .section-desc {
      color: #4b5563;
      font-size: 1rem;
      line-height: 1.7;
    }

    .gallery-title {
      font-size: 1.1rem;
      margin: 1.5rem 0 1rem 0;
      color: var(--dark);
    }

    /* Thumbnail Gallery Grid */
    .gallery-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
      gap: 1rem;
    }

    .gallery-thumb {
      width: 100%;
      height: 160px;
      /* object-fit: cover; */
      border-radius: 10px;
      cursor: pointer;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
      background: #f1f5f9;
    }

    .gallery-thumb:hover {
      transform: scale(1.03);
      box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    }

    /* Lightbox Modal */
    .lightbox {
      display: none;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.85);
      z-index: 1000;
      justify-content: center;
      align-items: center;
    }

    .lightbox.active {
      display: flex;
    }

    .lightbox img {
      max-width: 90%;
      max-height: 85vh;
      border-radius: 8px;
    }

    .close-lightbox {
      position: absolute;
      top: 20px;
      right: 30px;
      font-size: 2.5rem;
      color: #ffffff;
      cursor: pointer;
    }

    .pdf-container {
  width: 100%;
  max-width: 1000px;
  margin: 20px auto;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  overflow: hidden;
}

.pdf-container object,
.pdf-container iframe {
  width: 100%;
  height: 80vh; /* Device Screen Height එකෙන් 80%ක් auto ගන්නවා */
  border: none;
}
.inner-full .facility-section h4{
  font-size: 30px;
  padding: 10px 0px 20px;
}
.inner-full .inner-row .inner-div .container{
  padding: 0px;
}

.inner-full ul{
	padding-left: 25px;
}


/* ==========================================
   New Starters page
   ========================================== */

/* Outer Wrapper & Typography */
.missb-article-wrapper {
    /* max-width: 900px; */
    margin: 0 auto;
    padding: 30px 0px;
    /* font-family: 'Quicksand', 'Open Sans', system-ui, -apple-system, sans-serif; */
    /* color: #4a5568; */
    /* line-height: 1.8; */
}

/* Hero Header */
.article-hero {
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    padding: 40px 20px;
    border-radius: 20px;
    border: 2px dashed #fde68a;
}

.hero-badge {
    background-color: #f59e0b;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    padding: 6px 18px;
    border-radius: 30px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: relative;
    bottom: 15px;
}

.hero-title {
    color: #78350f;
    font-size: 34px;
    font-weight: 800;
    margin-top: 15px;
    margin-bottom: 10px;
}

.hero-subtitle {
    color: #92400e;
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}


.section-lead {
    font-size: 18px;
    font-weight: 700;
    color: #d97706;
    margin-top: -10px;
    margin-bottom: 20px;
}

/* Cards Design */
.modern-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 28px;
    border: 1px solid #fef3c7;
    box-shadow: 0 10px 25px rgba(245, 158, 11, 0.08);
    transition: transform 0.3s ease;
}

.modern-card:hover {
    transform: translateY(-3px);
}

.card-icon-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
}

.card-icon-header h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
    color: #78350f;
}

.icon-bubble {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}

.yellow-bubble { background-color: #fef3c7; color: #d97706; }
.green-bubble { background-color: #d1fae5; color: #059669; }
.red-bubble { background-color: #ffe4e6; color: #e11d48; }

/* Custom Lists */
.custom-bullet-list {
    list-style: none;
    padding-left: 0;
}

.custom-bullet-list li {
    position: relative;
    padding-left: 28px;
    margin-bottom: 12px;
}

.custom-bullet-list li::before {
    content: '🐝';
    position: absolute;
    left: 0;
    top: 2px;
    font-size: 14px;
}

/* Symptom Grid */
.symptom-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
    margin-top: 15px;
}

.symptom-item {
    background: #fffbeb;
    border: 1px solid #fde68a;
    padding: 12px 16px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 600;
    color: #92400e;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Interactive Steps */
.interactive-steps {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.step-box {
    display: flex;
    gap: 20px;
    background: #ffffff;
    border: 1px solid #f3f4f6;
    padding: 22px;
    border-radius: 16px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
}

.step-badge {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #fff3c2 0%, #f0c407 100%);
    color: #ffffff;
    font-size: 22px;
    font-weight: 800;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.step-details h4 {
    margin: 0 0 8px 0;
    color: #78350f;
}

.quote-box {
    background-color: #fcfbf7;
    border-left: 4px solid #f59e0b;
    padding: 10px 15px;
    font-style: italic;
    border-radius: 0 10px 10px 0;
    margin: 10px 0;
    color: #451a03;
    font-weight: 600;
}

.hint-text {
    color: #6b7280;
    display: block;
    margin-top: 5px;
    font-size: 15px;
}

/* Tables Styling */
.custom-table-wrapper {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    border: 1px solid #fef3c7;
}

.modern-table {
    width: 100%;
    margin-bottom: 0;
    border-collapse: collapse;
}

.modern-table thead {
    background-color: #fef3c7;
}

.modern-table th {
    color: #78350f;
    font-weight: 800;
    padding: 16px;
    border: none;
}

.modern-table td {
    padding: 16px;
    vertical-align: middle;
    border-bottom: 1px solid #fef3c7;
    background-color: #ffffff;
}

/* Pill tags */
.pill-tag {
    font-size: 12px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 20px;
    display: inline-block;
}

.green-pill { background: #d1fae5; color: #047857; }
.yellow-pill { background: #fef3c7; color: #b45309; }
.teal-pill { background: #ccfbf1; color: #0f766e; }
.blue-pill { background: #dbeafe; color: #1d4ed8; }
.red-pill { background: #ffe4e6; color: #be123c; }

/* Checklist Cards */
.checklist-grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.check-card {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    padding: 14px 18px;
    border-radius: 12px;
}

.check-icon {
    width: 24px;
    height: 24px;
    background-color: #d1fae5;
    color: #059669;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 13px;
    flex-shrink: 0;
}

/* Support Footer Card */
.support-footer-card {
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border: 2px dashed #6ee7b7;
    border-radius: 16px;
    padding: 28px;
    color: #065f46;
}

.support-footer-card h3 {
    color: #047857;
    font-weight: 800;
    font-size: 20px;
    margin-bottom: 10px;
}


/* ==========================================
   Safer Eating & Safer Weaning Tab Styles
   ========================================== */

.safer-eating-container {
    margin: 0 auto;
}

/* Header Card */
.section-hero-card {
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    padding: 25px 0px;
    border-radius: 18px;
    border: 2px dashed #fde68a;
}

/* .hero-title {
    color: #78350f;
    font-size: 28px;
    font-weight: 800;
    margin: 0;
} */

/* Cards */
.modern-nursery-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 25px;
    border: 1px solid #fef3c7;
    box-shadow: 0 6px 18px rgba(245, 158, 11, 0.05);
}

.highlight-border-card {
    border-left: 5px solid #f59e0b;
}

/* .card-subtitle-title {
    color: #78350f;
    font-size: 20px;
    font-weight: 800;
    margin-top: 0;
    margin-bottom: 15px;
} */

/* Images */
.rounded-image {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    border: 1px solid #fde68a;
}

/* NHS Link */
.nhs-link-box {
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 12px;
}

.btn-nhs-link {
    background-color: #f1c500; /* NHS Blue */
    color: #ffffff !important;
    font-weight: 700;
    padding: 10px 24px;
    border-radius: 25px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
}

.btn-nhs-link:hover {
    background-color: #469ad6;
    box-shadow: 0 4px 12px rgba(0, 94, 165, 0.3);
    text-decoration: none;
}

/* Bottom Tagline Banner Bubble */
.tagline-bubble-banner {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-radius: 50px;
    border: 2px solid #f59e0b;
    box-shadow: 0 8px 20px rgba(245, 158, 11, 0.15);
}

.tagline-text {
    color: #78350f;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.3px;
}

/* ==========================================
   Safer Sleep page Styles
   ========================================== */

.safer-sleep-container {
    margin: 0 auto;
}

/* Header Card */
.section-hero-card {
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    padding: 25px 20px;
    border-radius: 18px;
    border: 2px dashed #fde68a;
}

/* Cards */
.modern-nursery-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 25px;
    border: 1px solid #fef3c7;
    box-shadow: 0 6px 18px rgba(245, 158, 11, 0.05);
}

.highlight-border-card {
    border-left: 5px solid #f59e0b;
}


/* Custom Bullet List */
.custom-bullet-list {
    padding-left: 20px;
}

.custom-bullet-list li {
    margin-bottom: 8px;
}

/* Images */
.rounded-image {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    border: 1px solid #fde68a;
}

/* External Link Box & Button */
.nhs-link-box {
    background-color: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 16px;
}

.btn-lullaby-link {
    background-color: #f1c500; /* Lullaby Trust Soft Blue */
    color: #ffffff !important;
    font-weight: 700;
    padding: 10px 24px;
    border-radius: 25px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
}

.btn-lullaby-link:hover {
    background-color: #469ad6;
    box-shadow: 0 4px 12px rgba(2, 132, 199, 0.3);
    text-decoration: none;
}

/* Bottom Tagline Banner Bubble */
.tagline-bubble-banner {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-radius: 50px;
    border: 2px solid #f59e0b;
    box-shadow: 0 8px 20px rgba(245, 158, 11, 0.15);
}

.tagline-text {
    color: #78350f;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.3px;
}

/* ==========================================
   What is EYFS Page Styles
   ========================================== */

.eyfs-article-wrapper {
    margin: 0 auto;
}

/* Header Card */
.section-hero-card {
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    padding: 25px 20px;
    border-radius: 18px;
    border: 2px dashed #fde68a;
}


/* Cards */
.modern-nursery-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 25px;
    border: 1px solid #fef3c7;
    box-shadow: 0 6px 18px rgba(245, 158, 11, 0.05);
}


/* Custom Bullet List */
.custom-bullet-list {
    padding-left: 20px;
}

.custom-bullet-list li {
    margin-bottom: 6px;
}

/* Images */
.rounded-image {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    border: 1px solid #fde68a;
}

/* GOV.UK Official Button */
.btn-gov-link {
    background-color: #00823b;
    color: #ffffff !important;
    font-weight: 700;
    padding: 12px 28px;
    border-radius: 30px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 130, 59, 0.25);
}

.btn-gov-link:hover {
    background-color: #00692f;
    box-shadow: 0 6px 16px rgba(0, 130, 59, 0.35);
    text-decoration: none;
}

/* ==========================================
   Healthy Living - Food Hygiene page
   ========================================== */

.food-hygiene-section {
    margin: 0 auto;
}

/* Header Card */
.food-hygiene-section .section-hero-card {
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    padding: 25px 20px;
    border-radius: 18px;
    border: 2px dashed #fde68a;
}


/* Cards */
.food-hygiene-section .modern-nursery-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 25px;
    border: 1px solid #fef3c7;
    box-shadow: 0 6px 18px rgba(245, 158, 11, 0.05);
}

.food-hygiene-section .highlight-border-card {
    border-left: 5px solid #f59e0b;
}

/* Images */
.food-hygiene-section .rounded-image {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    border: 1px solid #fde68a;
}

/* ==========================================
   Uniform Page Styles (Full Width Display)
   ========================================== */

.uniform-page-container {
    max-width: 1000px; 
    margin: 0 auto;
    padding: 0 15px;
}

.uniform-poster-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 10px;
    box-shadow: 0 8px 25px rgba(245, 158, 11, 0.1);
    border: 1px solid #fef3c7;
    overflow: hidden;
}

.full-page-poster {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
}






/*android*/

@media screen and (max-width: 767px) {

  .slide-section .wrapper .green-box {

    opacity: 1;

    transform: translateY(0px) translateX(0px) scale(1);

  }

  .slide-section .inner-container-right .green-box {

    display: none;

  }

  .slide-section .carousel-caption {

    display: none;

  }

  header {

    position: static;

    background-color: rgba(147, 212, 135, 0.3);

    padding-bottom: 5px;

  }

  .emptyDiv {

      min-height: 100px;

  }

  .section-c .bee-circle {

    display: none;

  }



  .footer-section .content-01 {

    display: flex;

    flex-direction: column;

    align-items: center;

  }



  .top-section .container {

    padding-left: 15px;

    display: flex;

    flex-direction: row;

    justify-content: center;

    flex-wrap: wrap;

    gap: 10px;

  }



  .top-section .container .mail {

    display: flex;

    flex-direction: row;

    flex-wrap: wrap;

    gap: 8px;

  }



  .top-section {

    padding: 5px 0px 35px 0px;

  }



  .nav-section {

    padding-left: 0px;

    padding-right: 0px;

  }



  .nav-section .container {

    margin-top: 0px;

    display: flex;

    justify-content: center;

    align-items: center;

    flex-wrap: wrap;

    padding-left: 0px;

    padding-right: 0px;

  }



  .nav-section .logo {

    margin-bottom: 5px;

    width: 124px;

    height: 138px;

    padding: 0px 5px;

  }



  .nav-section .container nav {

    width: calc(100% - 0px);

    padding-top: 0px;

    background-image: none;

    background-color: #FFF3C2;

    padding-right: 0px;

    border-radius: 15px;

    border: 3px solid #F3C400;

  }



  .navbar-brand {

    margin: 0px;

    padding: 0px;

    margin-left: 15px;

    font-family: "Fredoka", sans-serif;

    font-weight: 500;

    font-size: 20px;

    line-height: 24px;

    color: #595959;

  }



  .navbar .navbar-toggler {

    padding: 0px;

    stroke: rgba(0, 0, 0, 0.9);

  }



  .nav-section .container .navbar-nav li a {

    padding: 15px 20px 15px 20px;

    display: block;

    text-align: left;

  }



  .nav-section .container .navbar-nav li a br {

    display: none;

  }



  .nav-section .container .navbar-nav li a:hover,

  .nav-section .container .navbar-nav li a.active {

    background-color: rgba(243, 194, 0, 0.3);

  }



  .nav-section .container .navbar-nav li {

    display: block;

  }



  .nav-section .container .navbar-nav li::before {

    display: none;

  }



  .nav-section .container .navbar-nav li a::before {

    display: none;

  }



  .navbar-nav {

    gap: 2px;

  }



  .slide-section::before {

    display: none;

  }



  .slide-section .wrapper {

    left: auto;

    right: 15px !important;

    bottom: -325px;

    z-index: 5;

  }



  .section-a {

    padding-top: 355px;

    padding-bottom: 50px;

    padding-left: 0px;

    padding-right: 0px;

  }



  .section-a::before {

    display: none;

  }



  .section-a::after {

    display: none;

  }



  .section-a .content-02::before {

    display: none;

  }



  .section-a .content-01 .figure::before {

    width: 68px;

    height: 68px;

  }



  .section-a .content-01 .figure::after {

    width: 70px;

    height: 70px;

  }



  .section-a .content-02 h1 span {

    font-size: 25px;

    line-height: 35px;

  }



  .section-a .content-02 h1 {

    font-size: 30px;

    line-height: 36px;

    margin-bottom: 20px;

  }



  .section-b {

    padding-left: 15px;

    padding-right: 15px;

    position: relative;

    background-color: #CDE7F0;

    background-image: none;

  }



  .section-a .bee-circle {

    display: none;

  }



  .section-b .row {

    padding-top: 165px;

  }



  .section-b .content-02 .bee {

    top: -270px;

    left: calc(50% - 90px);

    width: 180px;

  }



  .section-b h2 {

    font-size: 30px;

    line-height: 40px;

    margin-bottom: 0px;

  }



  .section-b .content-01 h3 {

    font-size: 25px;

    line-height: 30px;

    margin-bottom: 0px;

    margin-top: 0px;

  }



  .section-b .content-02 {

    padding-left: 15px;

    padding-top: 15px;

  }



  .section-b .content-02 h3 {

    font-size: 25px;

    line-height: 35px;

    margin-bottom: 10px;

    margin-top: 0px;

    width: 100%;

  }



  .section-b .content-03 {

    display: flex;

    flex-direction: column;

    align-items: center;

    padding-right: 15px;

    padding-left: 15px;

  }



  .section-b .content-03 .row-i {

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 15px;

  }



  .section-b .content-03 .sec::before {

    display: none;

  }



  .section-b .content-03 .row-2 {

    margin-left: 0px;

    margin-top: 0px;

    gap: 15px;

  }



  .section-b .content-03 .row-3 {

    margin-top: 0px;

    gap: 15px;

  }



  .section-b .content-03 .row-4 {

    margin-top: 0px;

    margin-left: 0px;

    gap: 15px;

  }



  .section-b .content-03 .row-5 {

    margin-top: 0px;

    margin-left: 0px;

    gap: 15px;

  }



  .section-b .content-03 .sec {

    margin-top: 0px;

    margin-bottom: 0px;

    gap: 15px;

    display: flex;

    flex-direction: column;

  }



  .section-c .content-01 h2 {

    font-size: 30px;

    line-height: 40px;

    margin-bottom: 20px;

  }



  .section-c {

    padding-left: 0px;

    padding-right: 0px;

  }



  .section-c .content-01 {

    padding-bottom: 70px;

  }



  .section-d::before {

    display: none;

  }



  .section-d::after {

    display: none;

  }



  .section-d {

    background-color: #92D487;

    background-image: none;

    padding-left: 15px;

    padding-right: 15px;

    position: relative;

  }



  .section-d .content-02 {

    padding-right: 15px;

    padding-left: 15px;

  }



  .section-d .content-02 .bee {

    display: none;

  }



  .section-d .content-02 .sec h3 {

    font-size: 20px;

    line-height: 20px;

    color: #1D0E37;

    margin-bottom: 5px;

  }



  .section-d .content-02 .sec p {

    font-size: 20px;

    line-height: 20px;

  }



  .section-f {

    padding-top: 10px;

    padding-bottom: 70px;

    padding-left: 0px;

    padding-right: 0px;

  }



  .section-f::before {

    display: none;

  }



  .section-f .content-03 {

    padding-top: 20px;

  }



  .section-f .content-03 figure {

    margin: 0px;

    display: none;

  }



  .section-g::before {

    display: none;

  }



  .section-g .container {

    padding-right: 15px;

    padding-left: 15px;

  }



  .section-g .content-01 figure::before {

    width: 60px;

    height: 56px;

  }



  .section-g .content-01 figure::after {

    width: 60px;

    height: 60px;

    right: 20px;

    top: 30px;

  }



  .section-g .content-02 .sec {

    padding: 15px;

  }



  .section-g .content-02 .block-1 {

    display: flex;

    justify-content: space-between;

  }



  .section-g .content-02 .block {

    justify-content: space-between;

    padding-left: 30px;

    padding-right: 30px;

  }



  .section-g h2 {

    text-align: center;

    margin-left: 0px;

  }



  .section-g .content-01 {

    padding-left: 0px;

    padding-right: 0px;

  }



  .footer-section::after {

    display: none;

  }



  .footer-section::before {

    display: none;

  }



  .section-c .content-02 figure::before {

    left: 2px;

    bottom: -3px;

    width: 120PX;

    height: 123px;

  }



  .section-d .content-02 h2 {

    font-size: 30px;

    line-height: 40px;

    margin-bottom: 20px;

  }



  .section-d .content-02 h2 span {

    font-size: 40px;

  }



  .back_to_top.show {

    right: 15px;

    bottom: 20px;

  }







  /* Safeguarding page css */

  .grid-2 {

    grid-template-columns: 1fr;

  }



  .rules-container {

    gap: 30px;

  }



  /* common-childhood-illnesses page css */

  .illness-table thead {

    display: none;

  }



  .illness-table tr {

    display: block;

    margin-bottom: 20px;

    border: 2px solid var(--nursery-orange);

  }



  .illness-table td {

    display: block;

    text-align: right;

    position: relative;

    padding-left: 50%;

  }



  .illness-table td::before {

    content: attr(data-label);

    position: absolute;

    left: 15px;

    width: 45%;

    text-align: left;

    font-weight: bold;

    color: var(--nursery-orange);

  }



  /* Sally, Our Safeguarding Puppet page css */

  .puppet-container {

    float: none;

    width: 100%;

    margin: 0 0 20px 0;

  }



  .kidsafe-header {

    flex-direction: column;

    text-align: center;

  }



  /* Absence Reporting page css */

  .studybugs-section {

    padding: 20px;

  }



  .reasons-grid {

    grid-template-columns: 1fr;

  }



  /* Parent Information page css */

  .book-showcase {

    grid-template-columns: 1fr;

    text-align: center;

  }



  .section-header {

    flex-direction: column;

    text-align: center;

  }



  /* time table page css */

  .time-col,

  .event-col {

    display: block;

    width: 100%;

    text-align: center;

    border-radius: 15px;

  }



  .event-col {

    border-left: 2px solid #f8c300;

    margin-top: -5px;

  }



  header.sticky .nav-section .container {

    margin-top: 0px;

    justify-content: center;

  }



  header.sticky .nav-section .container nav {

    width: calc(100% - 0px);

  }



  .carousel-inner-layout {

    height: 200px !important;

  }



  .inner-row {

    padding: 15px 0px 20px;

  }



  .inner-full h1 {

    font-size: 35px;

    line-height: 40px;

    padding: 0px 0px 10px;

  }



  .inner-full h2 {

    font-size: 32px;

    line-height: 35px;

    padding: 15px 0px;

  }



  .inner-full h3 {

    font-size: 30px;

    line-height: 35px;

    padding: 15px 0px;

  }



  .inner-full h4 {

    font-size: 28px;

    line-height: 35px;

    padding: 15px 0px;

  }



  .inner-full h5 {

    font-size: 25px;

    line-height: 35px;

    padding: 5px 0px;

  }



  .inner-full p {

    font-size: 17px;

    line-height: 30px;

  }



  .inner-div {

    padding: 0px;

  }



  .tooltip-box {

    width: 100%;

  }



  .row-offset {

    margin-left: 0px;

  }



  .justify-content-start {

    justify-content: center !important;

  }



  .row-offset {

    justify-content: center !important;

  }

  .our-day-and-timetable-info-grid {

    grid-template-columns: unset;

}



  /* .inner-full a {

    white-space: break-spaces;

} */

  .healthy-living-div {

    flex-wrap: wrap;

  }



  .resources-box2 {

    flex-wrap: wrap;

  }



  .resource-item {

    flex-wrap: wrap;

    justify-content: center;

  }



  .button-div {

    flex-wrap: wrap;

  }



  .makaton-slideshow {

    width: 100%;

    max-width: 100%;

  }



  .slide-img {

    min-width: 100%;

    height: 245px;

    display: inline-block;

  }



  .safety-links {

    flex-wrap: wrap;

  }



  .btn-button a {

    padding: 10px 15px 10px 15px !important;

  }



  .parent-info-page .button-div .btn-button a {

    white-space: pre-wrap;

  }



  .info-section4 img {

    width: 100%;

  }



  .btn-button a:hover {

    padding: 10px 45px 10px 15px !important;

  }



  .sally-our-safeguarding-puppet-row img {

    margin-bottom: 10px;

  }



  .section-card {

    padding: 15px;

  }



  .alliance-box {

    padding: 10px;

    flex-wrap: wrap;

  }



  .hero-banner {

    padding: 10px;

    border-radius: 30px;

    margin-bottom: 0px;

  }



  .resource-card {

    padding: 10px;

  }



  .eyfs-section {

    padding: 10px;

  }



  .studybugs-logo {

    width: 100%;

  }



  .studybugs-header {

    margin-bottom: 0px;

  }



  .cta-container div {

    gap: 20px;

    flex-wrap: wrap;

  }



  #fee-content div {

    flex-wrap: wrap;

  }



  .enrolment-section {

    padding: 10px;

  }



  .action-area div {

    flex-wrap: wrap;

  }



  .makaton-slideshow .slide-img img {

    max-width: 100%;

  }



  header.sticky .nav-section .container .navbar-nav li a {

    padding: 15px 15px 15px 15px;

  }



  .section-a .content-01 .figure::after {

    display: none;

  }



  .nav-section .dropdown-menu {

    background-color: #e7e3d7;

  }



  .grid-2 {

    display: inline;

  }



  .copyright-section p {

    padding: 0px 5px;

  }



  .footer-section .content-04 {

    padding-bottom: 10px;

  }



  .safety-links a {

    white-space: break-spaces !important;

  }



  .honeycomb-container {

    margin-bottom: 30px;

  }



  .new-starters-p a {

    white-space: break-spaces;

  }



  #fee-content iframe {

    height: 450px;

  }



  .policies-modal .modal-content {

    width: 95%;

    height: 80vh;

  }



  .age-grid {

    grid-auto-flow: row;

  }



  #fee-title {

    font-size: 25px;

  }



  .pdf-container .btn-button {

    white-space: nowrap;

  }

.about-inner {

  display: flex;

  flex-direction: column;

  gap: 0;

}

.about-inner h2 {

  font-size: 30px;

}

.about-inner ul {

    padding-left: 0;

    margin-bottom: 0;

}



/* healthy */



.healthy-living-div div {

    width: 100%;

    min-height: 253.64px;

    margin: 5px 0;

}

.nursery-kitchen-img img {

  width: 100%;

}

.routine-row {

  padding-bottom: 20px;

}

.time-col, .event-col {

  margin-bottom: 15px;

}





/* team  */



.out-team-row-offset {

    margin-left: 0px;

    padding-top: 75px;

}

.our-team-honeycomb-container::after,.honeycomb-container::before {

  display: none;

}

.out-team-col-auto {

    margin: 0px 8px !important;

}

.out-team-row-offset {

    margin-left: 0 !important;

    padding: 0px;

}

.emptyDiv {

    min-height: 0px;

}

.our-team-honeycomb-container .figure{

  display: none;

}

.our-facilities-div .figure {

    display: none;

}

.safeguarding-container .figure {

    display: none;

}

.safeguarding-container .row-offset {

    margin-left: 0px;

}

.safeguarding-page {

    padding-top: 40px;

}

.safeguarding-container-read-p {

    gap: 25px;

    justify-content: center;

    flex-direction: column;

}

.safeguarding-container-read-p p {

    font-size: 25px !important;

}

.inner-div .bee {

    display: none;

}

#contact-form img{

  display: none;

}

#company-details:after {

 display: none;

}

.illness-section-a{

  white-space: break-spaces !important;

}

.section-card .download-container a{

  white-space: break-spaces !important;

}

.age-card img {

    width: 100%;

    max-width: 100%;

}
.footer-section .content-01 .fig-1 img {
    width: 50%;
}
.video-wrapper iframe{
    width: 75% !important;
    height: auto !important;
}
.facility-section {
    padding: 15px;
}
.main-video-card .video-wrapper iframe {
        width: 100% !important;
    }
.section-media-grid {
    display: flex;
}
.gov-button-wrapper a, .nhs-link-box a{
  white-space: wrap !important;
}

.step-box {
    gap: 5px;
    padding: 5px;
}
.step-badge {
    width: 30px;
    height: 30px;
    font-size: 20px;
}
.missb-article-wrapper p a{
      white-space: pre-wrap;
}
.modern-table th {
    padding: 5px;
}
.modern-table td {
    padding: 5px;
}


}









/*ios*/

@media screen and (max-width: 340px) {

  .slide-section .green-box {

    left: -100px;

  }



  .footer-section .content-02 i {

    display: none;

  }



  .inner-full a {

    white-space: break-spaces;

  }



  .slide-img {

    height: 210px;

  }



  .safeguarding-container .hexagon {

    width: 270px;

    height: 300px;

  }



  .honeycomb-container {

    margin-bottom: 70px;

  }



  .safeguarding-page .emergency-box a {

    white-space: nowrap;

    font-size: 15px;

  }



  .illness-section a {

    font-size: 12px;

  }



  .resources-grid {

    grid-template-columns: none;

  }



  .fee-container {

    grid-template-columns: none;

  }



  .fee-card {

    padding: 10px;

  }



  .enrolment-section .action-area .btn-button a {

    font-size: 15px;

  }



  .privacy-a {

    font-size: 15px;

  }



  .privacy-details ul {

    padding-left: 10px;

  }

      .section-g .content-02 .block {

        padding-left: 15px;

    }

.section-g .content-02 .block img {

    width: 65px;

}
.container {
    margin: 1rem auto;
}
.inner-full h1 {
    font-size: 30px;
}
.inner-full h2 {
    font-size: 28px;
}
.inner-full h3 {
    font-size: 25px;
    line-height: 30px;
    padding: 0px;
}
.inner-full .facility-section h4 {
    font-size: 24px;
}
.custom-table-wrapper .modern-table th {
    padding: 5px;
    font-size: 13px;
}
.custom-table-wrapper .modern-table td {
    padding: 5px;
    font-size: 14px;
}






}





/*windows*/

@media (min-width: 450px) and (max-width: 767px) {

  .slide-section .wrapper {

    right: 67px !important;

  }



  .slide-img {

    height: 325px;

  }



  .safety-links a {

    white-space: break-spaces !important;

  }





}





/*portrait*/

@media (min-width: 768px) and (max-width: 991px) {

  header {

    position: static;

    background-color: rgba(147, 212, 135, 0.3);

    padding-bottom: 5px;

  }



  .top-section .container {

    padding-left: 15px;

    display: flex;

    flex-direction: row;

    justify-content: center;

    flex-wrap: wrap;

    gap: 10px;

  }



  .top-section {

    padding: 10px 0px 30px 0px;

  }



  .nav-section {

    padding-left: 0px;

    padding-right: 0px;

  }



  .nav-section .container {

    margin-top: 0px;

    display: flex;

    justify-content: center;

    align-items: center;

    flex-wrap: wrap;

    padding-left: 0px;

    padding-right: 0px;

  }



  .nav-section .logo {

    margin-bottom: 5px;

    width: 124px;

    height: 138px;

    padding: 0px 5px;

  }



  .nav-section .container nav {

    width: calc(100% - 0px);

    padding-top: 0px;

    background-image: none;

    background-color: #FFF3C2;

    padding-right: 0px;

    border-radius: 15px;

    border: 3px solid #F3C400;

  }



  .navbar-brand {

    margin: 0px;

    padding: 0px;

    margin-left: 15px;

    font-family: "Fredoka", sans-serif;

    font-weight: 500;

    font-size: 20px;

    line-height: 24px;

    color: #595959;

  }



  .navbar .navbar-toggler {

    padding: 0px;

    stroke: rgba(0, 0, 0, 0.9);

  }



  .nav-section .container .navbar-nav li a {

    padding: 15px 20px 15px 20px;

    display: block;

    text-align: left;

  }



  .nav-section .container .navbar-nav li a br {

    display: none;

  }



  .nav-section .container .navbar-nav li a:hover,

  .nav-section .container .navbar-nav li a.active {

    background-color: rgba(243, 194, 0, 0.3);

  }



  .nav-section .container .navbar-nav li {

    display: block;

  }



  .nav-section .container .navbar-nav li::before {

    display: none;

  }



  .nav-section .container .navbar-nav li a::before {

    display: none;

  }



  .navbar-nav {

    gap: 2px;

  }



  .slide-section .wrapper {

    bottom: -55px;

    z-index: 5;

  }



  .slide-section .carousel-control-next,

  .slide-section .carousel-control-prev {

    top: calc(45% - 40px);

  }

  .slide-section .carousel-caption {

    right: 8%;

    bottom: 35%;

    left: 8%;

  }

  .slide-section .carousel-caption h3 {

    font-size: 35px;

  }


  .section-b {

    padding-left: 35px;

    padding-right: 35px;

  }



  .section-b .content-03 .box {

    width: 143px;

    height: 166px;

    padding: 3px 4px;

    margin-right: -2px;

  }



  .section-b .content-03 .box p {

    font-size: 15px;

    line-height: 20px;

  }



  .section-b .content-03 .box img {

    width: 30px;

    height: auto;

    margin-bottom: 10px;

  }



  .section-b .content-03 .row-2 {

    margin-left: 70px;

    margin-top: -42px;

  }



  .section-b .content-03 .row-3 {

    margin-top: -43px;

  }



  .section-b .content-03 .row-4 {

    margin-top: -43px;

    margin-left: -71px;

  }



  .section-b .content-03 .row-5 {

    margin-top: -42px;

    margin-left: -282px;

  }



  .section-b .content-03 .sec::before {

    top: 100px;

    left: -200px;

  }



  .section-b .content-03 {

    padding-top: 50px;

    padding-right: 30px;

  }



  .section-a .bee-circle {

    display: none;

  }



  .section-b .content-02 .bee {

    top: -170px;

    left: 43px;

    width: 152px;

    height: auto;

    z-index: 2;

  }



  .section-c .content-02 {

    padding-top: 50px;

    padding-bottom: 30px;

  }



  .section-e .item {

    padding: 30px 15px 30px 15px;

    min-height: 437px;

  }



  .section-f .content-01 p {

    width: 100%;

  }



  .section-g .content-02 .block-1 {

    display: flex;

    justify-content: space-between;

  }



  .section-g .content-02 .block {

    justify-content: space-between;

    padding-left: 30px;

    padding-right: 30px;

  }



  .section-g h2 {

    text-align: center;

    margin-left: 0px;

  }



  /* .footer-section .content-01 .fig-1 {

    margin-bottom: -181px;

  } */



  .footer-section::before {

    display: none;

  }



  .footer-section::after {

    display: none;

  }



  .section-d::before {

    display: none;

  }



  .section-d::after {

    display: none;

  }



  .section-f .content-03 figure {

    display: none;

  }



  header.sticky .nav-section .container {

    margin-top: 0px;

    justify-content: center;

  }



  header.sticky .nav-section .container nav {

    width: calc(100% - 0px);

  }



  header.sticky .nav-section .logo {

    width: 124px;

    height: 138px;

    padding: 0px 5px;

  }



  .carousel-inner-layout {

    height: 400px !important;

  }



  /* .healthy-living-div {

    flex-wrap: wrap;

  } */



  .safety-links {

    flex-wrap: wrap;

  }



  .resources-box2 img {

    width: 50px;

  }



  .section-a .content-01 .figure::after {

    display: none;

  }



  header.sticky .nav-section .container .navbar-nav li a {

    padding: 15px 15px 15px 15px;

  }



  .section-a .content-01 .figure::before {

    top: 4%;

  }



  .safeguarding-container .row-offset {

    margin-left: 0px;

  }



  .safeguarding-container {

    margin-bottom: 85px;

  }



  .healthy-living-row {

    align-items: center;

  }



  .studybugs-section {

    padding: 20px;

  }



  #fee-content div {

    flex-direction: column-reverse;

  }

.about-inner {

  display: flex;

  flex-direction: column;

  gap: 0;

}

.emptyDiv {

    min-height: 0px;

}

.out-team-row-offset {

    margin-left: 0px !important;

}

.our-facilities-div .figure {

    position: absolute;

    top: 126%;

    left: 63%;

    width: 200px;

}

.safeguarding-container .figure {

    position: absolute;

    top: 400px;

    right: 0px;

    width: 150px;

    left: 74%;

}

.safeguarding-page {

    padding-top: 50px;

}

.safeguarding-container-read-p p {

    font-size: 25px !important;

}

.section-g .content-02 .block p {

    flex-direction: row;

    gap: 10px;

}

.illness-section-a{

  white-space: break-spaces !important;

}

#contact-form img{

  float: none !important;

  position: relative;

    left: 70px;

}

.slide-section .green-box {

    left: -145px;

    bottom: 80px;

}

.footer-section .content-04 {

    margin-bottom: 15px;

}

.footer-section .content-01 .fig-1 img {
    width: 20%;
}





}







/*landscape*/

@media (min-width: 992px) and (max-width: 1199px) {

  .top-section .container {

    padding-left: 15px;

  }



  .top-section .container .address {

    width: 369px;

  }



  .nav-section .container .navbar-nav li a {

    padding: 0px 4px 15px 4px;

    font-size: 12px;

  }



  .nav-section .logo {

    width: 140px;

    height: 165px;

  }



  .nav-section .container nav {

    width: calc(100% - 140px);

  }



  .nav-section .container {

    margin-top: -20px;

  }



  .top-section {

    padding: 20px 0px 20px 0px;

  }



  .slide-section .wrapper {

    bottom: 25px;

  }

  .slide-section .carousel-caption h3 {

    font-size: 26px;

}

  .section-a .content-02::before {

    right: -5%;

    top: -9%;

    width: 168PX;

    height: 160px;

  }



  .section-a .content-01 .figure::before {

    width: 145px;

    height: 155px;

    left: 21%;

    top: 11%;

  }



  .section-b .content-02 {

    flex: 0 0 100%;

    max-width: 100%;

  }



  .section-b .content-03 {

    flex: 0 0 100%;

    max-width: 100%;

    padding-top: 200px;

    padding-right: 15px;

  }



  .section-d .content-02 .bee {

    width: 150px;

    height: auto;

  }



  .section-f::before {

    width: 400px;

    height: 434px;

    top: calc(50% - 272px);

    z-index: -1;

  }



  .section-f .content-01 p {

    width: 100%;

  }



  .section-g::before {

    width: 500px;

    height: 530px;

    left: 0px;

    top: calc(40% - 250px);

    z-index: -1;

  }



  .section-g .content-01 figure::before {

    width: 108px;

    height: 122px;

  }



  .section-g .content-01 figure::after {

    width: 100px;

    height: 116px;

    right: 29px;

    top: 10px;

  }



  .section-g .container {

    padding-right: 15px;

    padding-left: 15px;

  }



  .section-g .content-02 .block h3 {

    font-size: 18px;

    line-height: 30px;

  }



  /* .footer-section .content-01 {

    flex: 0 0 33.333333%;

    max-width: 33.333333%;

  } */



  .footer-section .content-02 {

    flex: 0 0 33.333333%;

    max-width: 33.333333%;

  }



  .footer-section .content-03 {

    flex: 0 0 33.333333%;

    max-width: 33.333333%;

  }



  .footer-section .content-04 {

    flex: 0 0 100%;

    max-width: 100%;

  }



  .footer-section::before {

    width: 600px;

    height: 59%;

  }



  .footer-section::after {

    width: 600px;

    height: 59%;

  }



  header.sticky .nav-section .container {

    margin-top: -10px;

  }



  header.sticky .nav-section .container nav {

    width: calc(100% - 120px);

  }



  header.sticky .nav-section .container .navbar-nav li a {

    font-size: 12px;

    padding: 0px 4px 15px 4px;

  }



  .nav-section .dropdown-menu {

    top: 55px;

  }



  .carousel-inner-layout {

    height: 550px !important;

  }



  .inner-row {

    padding: 20px 0px;

  }



  /* .healthy-living-div {

    flex-wrap: wrap;

  } */



  .section-a .content-01 .figure::before {

    top: 4%;

  }



  .safeguarding-container {

    margin-bottom: 85px;

  }

  .safeguarding-page {

      padding-top: 230px;

  }

  .safeguarding-page::before {

    top: 175%;

}

.safeguarding-container .figure {

    position: absolute;

    top: 480px;

    right: 0;

    width: 250px;

    left: 66%;

}

  .healthy-living-row {

    align-items: center;

  }

  .out-team-hexagon {

    width: 180px;

    height: 210px;

  }

  .out-team-hexagon h2 {

    font-size: 25px;

  }

  .out-team-hexagon h4 {

    font-size: 25px;

  }

  .out-team-row-offset {

    margin-left: 105px !important;

    padding-top: 15px;

    padding-bottom: 15px;

}

.out-team-col-auto {

    margin: -24px 14px !important;

}

.safeguarding-container-read-p .safe {

  bottom: -124%;

}

.slide-section .green-box {

    left: -125px;

    bottom: 140px;

    width: 180px;

    height: 170px;

}

.slide-section .carousel-caption {

    background-size: contain;

}

.emptyDiv {

    min-height: 275px;

}

.our-day-and-timetable-info-grid {

    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

}



.our-team-honeycomb-container::after {

    left: 75%;

    top: 82%;

}

.our-facilities-div .figure {

    top: 145%;

    left: 60%;

}

.slide-section{

  margin-top: 65px;

}

#contact-form img{

  float: none !important;

  position: relative;

    left: 130px;

}

.section-g .content-02 .block {

    width: 85%;

}

.offset-lg-4 {

    margin-left: 16.333333%;

}

.footer-section .content-04 {

    margin-bottom: 15px;

}
.footer-top-div .fb-page, .footer-top-div .fb-page iframe, .footer-top-div .fb-page span{
  height: 450px !important;
  width: 300px !important;
}
.footer-section .footer-top-div{
      flex: 0 0 33.333333%;
    max-width: 33.333333%;
}



}







@media (min-width: 1280px) and (max-width: 1365px) {

  .top .container {

    max-width: 1300px;

  }



  .section-a .container {

    max-width: 1350px;

  }



  .section-b .content-02 p {

    width: 88%;

  }



  .section-b .content-03 .sec {

    margin-top: 78px;

  }



  .top-section .container {

    padding-right: 30px;

    padding-left: 195px;

  }



  .section-b .content-03 .sec::before {

    width: 119px;

    height: 108px;

    top: -78px;

    left: 28%;

  }



  .nav-section .container .navbar-nav li a {

    font-size: 15px;

    padding: 0px 5px 15px 5px;

  }



  .carousel-inner-layout {

    height: 700px !important;

  }



  .safeguarding-container {

    margin-bottom: 80px;

  }

  .our-team-honeycomb-container::after {

    left: 61%;

    top: 114%;

}

.slide-section .carousel-caption {

    right: 25%;

    left: 25%;

}

.emptyDiv {

    min-height: 265px;

}

.nav-section .container {

    margin-top: -75px;

}

.footer-section .content-03 {

    padding-left: 0px;

    padding-right: 0px;

}







}





@media (min-width: 1366px) and (max-width: 1399px) {

  .top .container {

    max-width: 1300px;

  }



  .section-a .container {

    max-width: 1350px;

  }



  .section-b .content-02 p {

    width: 88%;

  }



  .footer-section .content-03 {

    flex: 0 0 19.666667%;

    max-width: 19.666667%;

  }



  .footer-section .content-04 {

    flex: 0 0 22%;

    max-width: 22%;

  }



  .section-b .content-03 .sec::before {

    width: 119px;

    height: 108px;

    top: -78px;

    left: 28%;

  }



  .safeguarding-container {

    margin-bottom: 90px;

  }

  .slide-section .carousel-caption {

    right: 25%;

    left: 25%;

}

.emptyDiv {

    min-height: 265px;

}

    .carousel-inner-layout {

        height: 700px !important;

    }



  .our-team-honeycomb-container::after {

    left: 60%;

    top: 121%;

}





}



@media (min-width: 1400px) and (max-width: 1658px) {

  .top .container {

    max-width: 1375px;

  }



  .section-a .container {

    max-width: 1350px;

  }



  .footer-section .content-03 {

    flex: 0 0 19.666667%;

    max-width: 19.666667%;

  }



  .footer-section .content-04 {

    flex: 0 0 22%;

    max-width: 22%;

  }



  .section-b .content-02 p {

    width: 98%;

  }



  .section-b .content-03 .sec::before {

    width: 119px;

    height: 108px;

    top: -78px;

    left: 28%;

  }



  .safeguarding-container {

    margin-bottom: 90px;

  }

  .slide-section .carousel-caption {

    right: 25%;

    left: 25%;

}

.slide-section .green-box {

    padding: 40px 20px 15px 35px;

}



}



/*large screen*/

@media (min-width: 1659px) {

  .top .container {

    max-width: 1700px;

  }



  .section-a .container {

    max-width: 1715px;

  }



  /* ---------------------------------- */

  .footer-section .content-03 {

    flex: 0 0 19.666667%;

    max-width: 19.666667%;

  }



  .footer-section .content-04 {

    flex: 0 0 22%;

    max-width: 22%;

  }



  .top-section .container {

    padding-left: 350px;

  }



  .nav-section .logo {

    width: 244px;

    height: 278px;

  }



  .nav-section .container {

    margin-top: -85px;

  }



  .nav-section .container nav {

    padding: 0px;

    padding-top: 15px;

    width: calc(100% - 244px);

    padding-right: 10px;

  }



  .nav-section .container .navbar-nav li a {

    font-size: 17px;

    line-height: 25px;

    padding: 0px 15px 15px 15px;

  }



  .slide-section .wrapper {

    bottom: 140px;

  }



  .slide-section {

    /* GREEN BOX */

  }



  .slide-section .green-box {

    font-size: 16px;

    line-height: 23px;

  }



  .slide-section {

    /* YELLOW HEXAGON */

  }



  .slide-section .yellow-box {

    font-size: 16px;

    line-height: 22px;

  }



  .section-a {

    padding-top: 150px;

    padding-bottom: 200px;

  }



  .section-a .content-02::before {

    right: -5%;

    top: -13%;

  }



  .section-a .content-02 h1 {

    font-size: 60px;

    line-height: 60px;

    letter-spacing: 0.5px;

    margin-bottom: 20px;

  }



  .section-a .content-02 h1 span {

    font-size: 48px;

    line-height: 65px;

  }



  .section-a .content-02 h2 {

    font-size: 36px;

    line-height: 40px;

    letter-spacing: 0.5px;

    margin-bottom: 30px;

  }



  .section-a .content-02 p {

    font-size: 20px;

    line-height: 33px;

    margin-bottom: 30px;

  }



  .section-a .content-02 h3 {

    font-size: 36px;

    line-height: 33px;

    margin-bottom: 0px;

  }



  .section-a .content-02 .sec {

    margin-bottom: 30px;

  }



  .section-a .content-02 .sec h3 {

    margin-bottom: 7px;

  }



  .section-a .content-02 .sec p {

    margin-bottom: 7px;

  }



  .section-a .bee-circle {

    bottom: -22%;

    right: -400px;

    z-index: 2;

  }



  .section-b::before {

    top: -500px;

    width: 650PX;

    height: 750px;

  }



  .section-b .row {

    padding-top: 100px;

  }



  .section-b .content-03 {

    padding-right: 60px;

  }



  .section-b .content-03 .sec {

    margin-top: -50px;

    margin-bottom: -60px;

  }



  .section-b .content-03 .sec::before {

    top: -154px;

    left: 24%;

  }



  .section-b .content-03 .row-2 {

    margin-left: 125px;

    margin-top: -74px;

  }



  .section-b .content-03 .row-3 {

    margin-top: -74px;

  }



  .section-b .content-03 .row-4 {

    margin-top: -74px;

    margin-left: -125px;

  }



  .section-b .content-03 .row-5 {

    margin-top: -74px;

    margin-left: -499px;

  }



  .section-b .content-03 .box {

    width: 251px;

    height: 289px;

    padding: 0px 30px;

    margin-right: -2px;

  }



  .section-b .content-03 .box img {

    margin-bottom: 20px;

  }



  .section-b .content-03 .box p {

    font-size: 24px;

    line-height: 30px;

    text-align: center;

  }



  .section-b h2 {

    font-size: 60px;

    line-height: 60px;

    margin-bottom: 0px;

  }



  .section-b .content-01 h3 {

    font-size: 48px;

    line-height: 60px;

    margin-top: 0px;

  }



  .section-b .content-02 {

    padding-left: 170px;

    padding-top: 90px;

  }



  .section-b .content-02 p {

    font-size: 20px;

    line-height: 33px;

    margin-bottom: 10px;

  }



  .section-b .content-02 h3 {

    font-size: 36px;

    line-height: 51px;

    margin-bottom: 10px;

    margin-top: 50px;

    width: 80%;

  }



  .section-b .content-02 .bee {

    top: -300px;

    left: 100px;

    width: -moz-fit-content;

    width: fit-content;

    height: -moz-fit-content;

    height: fit-content;

    z-index: 2;

  }



  .section-c {

    padding-top: 300px;

    padding-bottom: 160px;

  }



  .section-c::before {

    left: 0px;

    top: -30%;

    z-index: -1;

  }



  .section-c .content-01 h2 {

    font-size: 60px;

    line-height: 60px;

    margin-bottom: 40px;

  }



  .section-c .content-01 p {

    font-size: 20px;

    line-height: 33px;

    margin-bottom: 10px;

    width: 92%;

  }



  .section-c .content-01 h3 {

    font-size: 36px;

    line-height: 51px;

    margin-bottom: 30px;

    margin-top: 30px;

  }



  .section-c .content-02 figure {

    width: -moz-fit-content;

    width: fit-content;

    height: -moz-fit-content;

    height: fit-content;

    margin-right: -34px;

  }



  .section-c .content-02 figure::before {

    left: -50px;

    bottom: 50px;

    width: 242PX;

    height: 255px;

  }



  .section-c .bee-circle {

    width: -moz-fit-content;

    width: fit-content;

    height: -moz-fit-content;

    height: fit-content;

    position: absolute;

    top: -23%;

    left: -410px;

    z-index: -1;

  }



  .section-d {

    padding-left: 120px;

    padding-right: 92px;

    position: relative;

  }



  .section-d .content-01 {

    padding-top: 50PX;

  }



  .section-d .content-01 figure {

    margin-bottom: -20PX;

  }



  .section-d .content-02 {

    padding-right: 200px;

  }



  .section-d .content-02 h2 {

    font-size: 48px;

    line-height: 60px;

    margin-bottom: 40px;

  }



  .section-d .content-02 h2 span {

    font-weight: 500;

    font-size: 60px;

  }



  .section-d .content-02 p {

    font-size: 20px;

    line-height: 33px;

    margin-bottom: 30px;

  }



  .section-d .content-02 .bee {

    width: -moz-fit-content;

    width: fit-content;

    height: -moz-fit-content;

    height: fit-content;

    position: absolute;

    right: 57px;

    bottom: -34px;

  }



  .section-e {

    padding-top: 150px;

    padding-bottom: 50px;

  }



  .section-e h2,

  .section-h h2 {

    font-size: 60px;

    line-height: 60px;

    margin-bottom: 40px;

  }



  .section-e .item {

    padding: 80px 70px 80px 32px;

    min-height: 450px;

  }



  .section-e .item p {

    font-size: 18px;

    line-height: 35px;

    margin-bottom: 10px;

  }



  .section-e .item h3 {

    font-size: 28px;

    line-height: 1.5;

    margin-bottom: 0px;

  }



  .section-f {

    padding-top: 300px;

    padding-bottom: 150px;

  }



  .section-f::after {

    width: 100%;

    height: 180px;

    top: 12%;

    z-index: -1;

  }



  .section-f::before {

    width: 722px;

    height: 793px;

    top: calc(50% - 350px);

  }



  .section-f h2 {

    font-size: 60px;

    line-height: 60px;

    margin-bottom: 40px;

  }



  .section-f h3 {

    font-size: 48px;

    line-height: 50px;

    margin-bottom: 15px;

  }



  .section-f p {

    font-size: 24px;

    line-height: 35px;

    margin-bottom: 35px;

    width: 70%;

  }



  .section-f .content-01 p {

    width: 70%;

  }



  .section-f .content-03 figure {

    margin: -150px;

  }



  .section-g {

    padding-top: 100px;

    padding-bottom: 0px;

  }



  .section-g::before {

    width: 750px;

    height: 800px;

    left: 0px;

    top: calc(40% - 350px);

    z-index: -1;

  }



  .section-g .container {

    padding-right: 100px;

    padding-left: 100px;

  }



  .section-g h2 {

    font-size: 60px;

    line-height: 60px;

    margin-bottom: 30px;

    margin-left: 40px;

  }



  .section-g .content-02 .block {

    gap: 20px;

    padding: 5px 35px 25px 35px;

  }



  .section-g .content-02 .block h3 {

    font-size: 24px;

    line-height: 40px;

    margin-bottom: 0px;

  }



  .section-g .content-02 .block p {

    font-size: 18px;

    line-height: 24px;

  }



  .section-g .content-02 .block p span {

    font-size: 24px;

  }



  .section-g .content-02 .row {

    gap: 10px;

  }



  .section-g .content-02 .sec {

    padding: 40px;

  }



  .section-h {

    padding-top: 130px;

  }



  .section-h .item {

    position: relative;

    overflow: hidden;

  }



  .section-h .item h2 {

    bottom: 70px;

    font-size: 36px;

    line-height: 36px;

  }



  .footer-section {

    background-color: #CDE7F0;

    position: relative;

    overflow: hidden;

    padding-top: 50px;

  }



  .footer-section::before {

    position: absolute;

    content: "";

    background-image: url(../images/footer-bee-block.webp);

    transform: rotate(180deg);

    background-size: 100% 100%;

    width: 600px;

    height: 100%;

    left: 0px;

    top: 0%;

    z-index: 0;

  }



  .footer-section::after {

    position: absolute;

    content: "";

    background-image: url(../images/footer-bee-block.webp);

    background-size: 100% 100%;

    width: 600px;

    height: 100%;

    right: 0px;

    top: 0%;

    z-index: 0;

  }



  .footer-section .fa-slash-three::before {

    content: "///";

    font-size: 14px;

  }



  .footer-section h2 {

    font-family: "Fredoka", sans-serif;

    font-weight: 400;

    font-size: 48px;

    line-height: 48px;

    color: #083B5F;

    margin-bottom: 30px;

  }



  .footer-section .content-01 {

    z-index: 1;

  }



  .footer-section .content-01 figure {

    margin-bottom: 0px;

  }



  /* .footer-section .content-01 .fig-1 {

    margin-bottom: -80px;

  } */



  .footer-section .content-02 {

    padding-top: 50px;

    z-index: 1;

  }



  .footer-section .content-02 i {

    background-color: #469AD6;

    color: white;

    width: 40px;

    height: 40px;

    border-radius: 100%;

    display: flex;

    flex-direction: row;

    justify-content: center;

    align-items: center;

    margin-right: 20px;

  }



  .footer-section .content-02 .box {

    display: flex;

    margin-bottom: 20px;

  }



  .footer-section .content-02 h3 {

    font-family: "Fredoka", sans-serif;

    font-weight: 400;

    font-size: 24px;

    line-height: 24px;

    color: #083B5F;

    margin-bottom: 0px;

  }



  .footer-section .content-02 p {

    font-family: "Candara", sans-serif;

    font-weight: 300;

    font-size: 24px;

    line-height: 25px;

    color: rgba(89, 89, 89, 0.8);

    margin-bottom: 0px;

  }



  .footer-section .content-02 p a {

    color: #595959;

    text-decoration: none;

    transition: 0.5s;

  }



  .footer-section .content-02 p a:hover {

    color: #469AD6;

  }



  .footer-section .content-03 {

    z-index: 1;

    padding-top: 50px;

  }



  .footer-section .content-03 ul {

    list-style: none;

    padding-top: 0px;

    padding-left: 0px;

    margin-bottom: 10px;

  }



  .footer-section .content-03 ul li {

    margin-bottom: 18px;

  }



  .footer-section .content-03 ul li::before {

    font-family: "Font Awesome 6 Free";

    font-weight: 900;

    content: "\f04b";

    color: rgba(8, 59, 95, 0.8);

    font-size: 12px;

    margin-right: 3px;

  }



  .footer-section .content-03 ul li:has(a:hover):before,

  .footer-section .content-03 ul li:has(a.active):before {

    color: #083B5F;

  }



  .footer-section .content-03 ul li a {

    font-family: "Candara", sans-serif;

    font-size: 24px;

    font-weight: 300;

    line-height: 18px !important;

    color: rgba(89, 89, 89, 0.8);

    text-decoration: none;

    transition: 0.5s;

    position: relative;

  }



  .footer-section .content-03 ul li a:hover,

  .footer-section .content-03 ul li a.active {

    color: #083B5F;

  }



  .footer-section .content-03 ul li a::before {

    content: "";

    position: absolute;

    width: 100%;

    height: 1px;

    background-color: #083B5F;

    left: 0px;

    bottom: 4px;

    transform: scaleX(0);

    transform-origin: bottom right;

    transition: transform 0.8s ease-out;

  }



  .footer-section .content-03 ul li a:hover::before,

  .footer-section .content-03 ul li a.active::before {

    transform: scaleX(1);

    transform-origin: bottom left;

  }



  .footer-section .content-04 {

    padding-top: 50px;

    z-index: 1;

  }



  .footer-section .content-04 iframe {

    width: 100%;

    height: 342px;

  }



  .inner-section-h {

    padding-top: 0px !important;

  }



  header.sticky .nav-section .container .navbar-nav li a {

    font-size: 17px;

    padding: 0px 5px 15px 5px;

  }



  header.sticky .nav-section .container nav {

    width: calc(100% - 475px);

  }



  #company-details dt {

    font-size: 20px;

  }



  #company-details dd {

    font-size: 18px;

  }



  .safeguarding-container {

    margin-bottom: 90px;

  }

.safeguarding-page::before {

    top: 103%;

}

.safeguarding-container-read-p .safe {

    position: absolute;

    bottom: -10%;

}



}