body, html{
    padding: 0;
    background: #000;
}

.sticky-gift-voucher.slideout {
    opacity: 1;
    transition-delay: 0.3s;
    right: -2em;
}
.sticky-gift-voucher {
    opacity: 0;
    position: fixed;
    top: 16em;
    right: -12em;
    z-index: 99;
    display: inline-block;
    transition: all 1.2s cubic-bezier(0.645, 0.045, 0.355, 1);
        transition-delay: 0s;
    height: 4.5em;
    width: 8em;
    border-bottom-left-radius: 7em;
    border-bottom-right-radius: 7em;
    text-align: center;
    /* background:#8980d4; */
    background:#27aae1;
    /* color:#fec39d !important; */
    color:#fff !important;
    padding: 1em;
    transform: rotate(90deg);
    font-size: 0.8em;
    line-height: 1.2em;
}

.sticky-gift-voucher.sticky-register{
    top: 25em;
    background: #e9272a;
}

.sticky-gift-voucher.sticky-booking{
    top: 15em;
    background: #007bff;
}

.sticky-gift-voucher.sticky-christmas{
    top: 34em;
    background: #007bff;
}

a.sticky-gift-voucher:hover{
    text-decoration: none;
}

.main-content{
    font-family:  'Roboto';
    position: relative;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    background: #fff;
    overflow-x:hidden;
    transition: all 0.3s linear;
}

/* .pt-page{
    height: 90% !important;
} */

.main-content h1{
    font-family: 'Gloria Hallelujah', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 4em;
    padding: 20px 0 0 20px;
}

.jamboree-text{
    font-size: 1.5em;
}

.jam-menu{
    transition: all 0.3s ease;
    position:absolute;
    top:0;
    z-index:100;
    color: #000;
    box-sizing: border-box;
    width: 100%;
    padding: 10px 0;
    /* background: rgba(255,255,255,1); */
    transition: all 0.3s ease;
}

.mobile-menu{
    display: none;
    position: absolute;
    right: 40px;
    bottom: 30%;
    font-size: 1.8em;
}

@media screen and (max-width: 400px){
    .mobile-menu{
        right: 20px;
    }
}

@media screen and (max-width: 13000px){
    .logo.logo-main {
        width: 25%;
        min-width: 250px;
        max-width: 500px;
    }

    .jam-menu{
        position: relative;
        background-color: #fff;
    }
    /* .jam-menu ul{
        display:none;
    } */

    .jam-menu ul.dl-menu{
        background: #fff;
        position: fixed;
        top: 0;
        right: -150%;
        height: 100%;
        padding: 100px 40px 0 40px;
        transition: 0.6s all ease;
    }

    .jam-menu ul.dl-menu.open{
        right: 0;
    }
    .jam-menu ul.dl-menu li{
        float: none;   
        display: block;
        text-align: left;
        margin-bottom: 1.2em;
    }

    .jam-menu ul.dl-menu li a{
        float: none;
        display:block;
        font-size: 1.2em;
    }
    .jam-menu:hover{
        background: #fff;
    }

    .mobile-menu{
        display: block;
    }

}
/* .jam-menu.menu-center{
    bottom: 40%;
} */

.jam-menu:hover, .menu-active{
    background: rgba(255,255,255,0.9);
}
@media screen and (max-width: 12000px){
    .jam-menu:hover{
        background: #fff;
    }
}

.logo-con{
    display:inline-block;
    position: relative;
    /* background-image: url('../images/cloud.png');
    background-repeat: no-repeat;
    background-size: contain; */
    background: none;
}

.logo{
    width: 50%;
    max-width: 350px;
    /* float: left; */
    /* position: absolute; */
    left: 0;
    top: 8px;
    z-index:200;
}

.logo.logo-main{
    width: 25%;
    min-width: 350px;
    max-width: 500px;
    width: 550px;
}

@media screen and (max-width: 1200px){
    .logo.logo-main {
        width: 25%;
        min-width: 250px;
        max-width: 500px;
    }
}
/* a.h-link{
    color: #a3c63a;
}
a.a-link{
    color: #45bbcd;
}
a.e-link{
    color: #d03638;
}
a.p-link{
    color: #c49a6c;
}
a.c-link{
    color: #ee2a7b;
} */

.main-content .slider{
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    /* max-height: 70vh; */
    /* background: purple; */
}

@media screen and (max-width: 1366px){
    .slider{
        /* max-height: 100vh; */
    }
}

.slider-container{
    /* max-width: 1000px; */
    width: 100%;
    margin: 0 auto;
}

.slider img{
    width: 100%;
}

.home-intro{
    display: none;
}

@media screen and (max-width: 8000px){
    .home-intro{
        display: block;
    }
}

.main-content.section-about{
    background-image: url('../images/banners/rainbow.jpg');
    background-color: #7bb7fa;
    background-size: cover;
}

div.box{
    height: 100px;
    margin-top: 20px;
    position: relative;
    font-family: 'Gloria Hallelujah', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: #fff;
    font-size: 1.8em;
}

div.box span{
    display: block;
    text-align: center;
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 30px;
}

.paper{
    display: inline-block;
    position: relative;
    overflow: hidden;
    font-family: 'Gloria Hallelujah', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    padding-bottom: 100px;
}

.pastel-section{
    padding: 20px 0px;
    /* margin-bottom: 20px; */
}

.pastel-board{
    position: relative;
    overflow: hidden;
    font-family: Delius, 'Gloria Hallelujah', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    padding-bottom: 100px;
    /* color: #fff; */
    color: #000;
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 0px;
    padding-bottom: 200px;
}

/* .pt-page-2 .pastel-board{
    font-weight: bold;
} */
.pastel-board{
    font-weight: bold;
}

.pastel-section p{
    font-size: 1.2em;
}

.pastel-pink{
    background-color: rgb(225,153,173);
}

.pastel-orange{
    background-color: rgb(232,192,61);
}

.pastel-green{
    background-color: rgb(84,208,146);
}

.pastel-blue{
    background-color: rgb(10,212,222);
}

.pastel-purple{
    background-color: rgb(167, 125,207);
}
.pastel-yellow{
    background-color: #eae279;
}

.emo{
    font-size: 1.8em;
}

.paper p{
    font-size: 1.3em;
}

.section-about .paper img{
    max-width: 850px;
}

.paper-text-section{
    position: absolute;
    top: 120px;
    left: 100px;
    width: calc(100% - 150px);
}

.section-about h1{
    color: blue;
}

.section-experience h1{
    color: #27aae1;
}

.section-experience .d-flex div{
    background-color: fafafa;
}

.dl-menu li{
    display: inline-block;
    list-style: none;
    margin: 0 20px;
}

.dl-menu li{
    font-family: 'Gloria Hallelujah', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.grid-view{
    position: relative;
    height: 100%;
    min-height: 750px;
}

.grid-view > div{
    position: relative;
    width: 100%;
}

.grid-view > div > div{
    min-height: 300px;
    box-sizing: border-box;
    padding: 20px;
}

.grid-view > div > div.nested{
    padding: 0;
    display: flex;
    flex-direction: column;
    align-self: stretch;
}

.grid-view > div > div.nested > div{
    height: 50%;
}

.grid-view .grid-three{
    width: 33.33%;
}
.grid-view .grid-six{
    width: 66%;
}
.grid-view .grid-two{
    width: 25%;
}
.grid-view .grid-eight{
    width: 75%;
}

.j-bg-dance{
    background-image: url('../images/dance.jpg');
    background-size: cover;
}
.j-bg-playground{
    background-image: url('../images/playground.jpg');
    background-size: cover;
}
.j-bg-drummer{
    background-image: url('../images/drummer.jpg');
    background-size: cover;
}
.j-bg-coffee{
    background-image: url('../images/coffee.jpg');
    background-size: cover;
}
.j-bg-camera{
    background-image: url('../images/camera.jpg');
    background-size: cover;
}
.j-bg-paint{
    background-image: url('../images/paint.jpg');
    background-size: cover;
    min-height: 300px;
}
.j-bg-cooking{
    background-image: url('../images/cooking.jpg');
    background-size: cover;
    min-height: 300px;
}

.experience-panel{
    padding:20px;
}
.experience-panel h2{
    font-family: 'Gloria Hallelujah', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    margin-bottom:20px;
}

.experience-panel ul{
    margin: 0;
    padding: 0;
}

.experience-panel li{
    margin-bottom: 10px;
    padding-left: 30px;
    list-style: none;
    background-image: url('../images/star.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position-x: 0;
    background-position-y: center;
}

.experience-panel li:nth-child(2n) {
    padding-top: 10px;
    padding-bottom: 10px;
}

.con-info{
    padding-bottom: 200px;
    background: rgba(255,255,255,0.6);
}

.container-form{
    background: rgba(255,255,255,0.6);
}

.pink{
    color: #ec008c;
}

.green{
    color: #8dc63f;
}

.orange{
    color: #f5a720;
}

.blue{
    color: #27aae1;
}

.red{
    color: #ef4136;
}

.j-red{
    color: #e9272a;
}

.j-orange{
    color: #f4a61f;
}

.j-purple{
    color: #b8519e;
}

.j-blue{
    color: #4d69b1;
}

.j-yellow{
    color: #ffd34f;
}

.j-green{
    color: #8ac64a;
}

.j-pink{
    color: #f06ca8;
}

.j-lblue{
    color: #66ccf2;
}

.price-plan{
    padding: 40px 10px 40px 10px;
    box-sizing: border-box;
    border-right: 1px solid #ddd;
}

.price-plan h2{
    font-family: 'Gloria Hallelujah', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 1.5em;
}

.plan-image{
    margin-top: 10px;
    width: 100%;
    height: 200px;
    margin-bottom: 30px;
}

.price-item{
    margin-bottom: 2em;
}

.price-item label{
    display:block;
    margin-bottom: 0;
}

.price-item span{
    font-size: 1.5em;
    font-weight: bold;
}

.pre-school{
    background-image: url('../images/characters/pre-school.jpg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
.after-school{
    background-image: url('../images/characters/after-school.jpg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
.rental-service{
    background-image: url('../images/characters/rental-service.jpg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
.party{
    background-image: url('../images/characters/party.jpg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.menu-pad{
    padding-bottom: 100px;
}

.section-contact h2{
    font-family: 'Gloria Hallelujah', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

button.j-send{
    font-family: 'Gloria Hallelujah', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.bg-left{
    background-image: url('../images/characters/con-tree.jpg');
    background-size: contain;
    background-repeat: no-repeat; 
    background-position-x: -150px;   
    width: 500px;
    height: 600px;
    position: fixed;
    bottom: 0;
    left: 0;
}
.bg-right{
    background-image: url('../images/characters/con-flower.jpg');
    background-size: contain;
    background-repeat: no-repeat; 
    background-position-x: 100px;   
    width: 500px;
    height: 600px;
    position: fixed;
    bottom: 0;
    right: 0;
}

.jam-menu a{
    font-family: Delius, Cursive;
    font-weight: bold;
    font-size: 1.4em;
}

.jam-menu ul{
    /* margin-top: 30px; */
    margin-top: 60px;
    margin-bottom: 0;
    float: right;
}

@media screen and (max-width: 1200px){
    .jam-menu ul{
        margin-top: 0;
    }
}

.owl-dots{
    background: transparent;
    text-align:center;
    position: absolute;
    width: 100%;
    box-sizing: border-box;
    bottom: 0;
    left: 0;
    z-index: 100;
    padding-bottom: 10px;
}

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot{
    background:white;
    padding:5px !important;
    border-radius: 20px;
    margin: 0 10px;
}

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot.active{
    background: hotpink;
}

.logo-support{
    background: #fff;
    width: 200px;
    height: 200px;
    position: absolute;
    right: 0px;
    top: -100px;
    border-radius: 200px;
    opacity: 0.6;
}

.city-check{
    display:none;
}

.disclaimer{
    position: fixed;
    bottom: 100px;
    right: 0;
    padding: 10px 20px;
    background: rgba(255,255,255,0.8);
    z-index: 100;
    font-style: italic;
    font-size: 8px;
    color: #b8519e;
}


/* animation */
.bugs{
    text-align: center;
}
.beetle, .bee{
    position: absolute;
    z-index: 1000;
}
.bee{
    top: 0;
    right: 20px;
    -webkit-animation:linear infinite alternate;
    /* -webkit-animation-name: fly; */
    -webkit-animation-duration: 10s;

}
.bee-sec{
    left: 0;
    right: auto;
    width: 350px;
}

.dance-bottom{
    max-width: 100%;
}

.beetle{
    top: 100px;
    left: 0;
    display: none;
}

#bee-animate{
    bottom:15%;
    position:absolute;
    -webkit-animation:linear infinite alternate;
    -webkit-animation-name: run;
    -webkit-animation-duration: 80s;
}     
@-webkit-keyframes run {
    0% { left: 0;transform: rotate(60deg)
}
    50%{ left : 100%;transform: rotate(300deg)
}
    100%{ left: 0;}
}	

@-webkit-keyframes fly {
    0% {
        left: 0;
    }

    100%{
        left: 100%;
    }
}
@-webkit-keyframes flyfromright {
    0% {
        left: 100%;
    }

    99%{
        
        left: 0;
    }
    100%{
        left: 100%;
    }
}

.slider{
    position: relative;
}

.csoon{
    /* position: absolute; */
    font-family: 'Gloria Hallelujah', Arial, Helvetica, sans-serif;
    width: 100%;
    text-align: center;
    z-index: 102;
    font-weight: bold;
    font-size: 4em;
    color: purple;
    text-shadow: 3px 3px rgba(0,0,0,0.3);
    bottom: 20%;
}

.bee-bottom{
    display: none;
}

@media screen and (max-width: 600px){
    .bee-bottom{
        display: block;
        position: absolute;
        left: 40%;
        bottom: 33%;
    }
}

.bee-honey{
    max-width: 200px;
    -webkit-animation:linear infinite alternate;
    -webkit-animation-name: fly;
    -webkit-animation-duration: 20s;
}
.bee-sec{
    left: 100%;
    -webkit-animation:linear infinite alternate;
    -webkit-animation-name: fly;
    -webkit-animation-duration: 20s;
}
img.flip{
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

.preloader{
    position:fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url('../images/preloader_bubble.gif');
    background-size: 480px;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #fff;
    /* background-color: #f4f5f6; */
    z-index: 99999999;
}

#popup_ad {
    top: 50%;
    left: 50%;
    text-align:center;
    margin-top: 50px;
    margin-left: -100px;
    position: fixed;
    background: none;
    padding: 30px;
    width: 80%;
    max-width: 700px;
}

@media screen and (max-width: 500px) {
    #popup_ad {
        width: 95%;
    }
}

.popup_ad_img{
    max-width: 100%;
    max-height: 80vh;
}

.b-close {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    color: #fff;
    background: #ff0000;
    padding: 5px 10px;
}

.inputGroup {
	background-color: #fff;
	display: block;
	margin: 10px 0;
	position: relative;
	}
	.inputGroup label {
	padding: 12px 30px;
	width: 100%;
	display: block;
	text-align: left;
	color: #3c454c;
	cursor: pointer;
	position: relative;
	z-index: 2;
	-webkit-transition: color 200ms ease-in;
	transition: color 200ms ease-in;
	overflow: hidden;
	margin-top: 1em;
	}

	.inputGroup label span{
		display: block;
		padding-left: 30px;
	}
	.inputGroup label:before {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	content: "";
	background-color: #5562eb;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%) scale3d(1, 1, 1);
			transform: translate(-50%, -50%) scale3d(1, 1, 1);
	-webkit-transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
	transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
	opacity: 0;
	z-index: -1;
	}

	.inputGroup label.lmenu:before {
		width: 13px;
		height: 13px;
	}
	.inputGroup label:after {
	width: 32px;
	height: 32px;
	content: "";
	border: 2px solid #d1d7dc;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");
	background-repeat: no-repeat;
	background-position: 2px 3px;
	border-radius: 50%;
	z-index: 2;
	position: absolute;
	left: 15px;
	top: 50%;
	-webkit-transform: translateY(-50%);
			transform: translateY(-50%);
	cursor: pointer;
	-webkit-transition: all 200ms ease-in;
	transition: all 200ms ease-in;
	}

	.inputGroup label.lmenu:after{
		background-color: none;
		border: none;
		background-image: none;
	}

	.inputGroup input:checked ~ label {
	color: #fff;
	}
	.inputGroup input:checked ~ label:before {
	-webkit-transform: translate(-50%, -50%) scale3d(56, 56, 1);
			transform: translate(-50%, -50%) scale3d(56, 56, 1);
	opacity: 1;
	}

	.inputGroup input:checked ~ label:after {
	background-color: #54e0c7;
	border-color: #54e0c7;
	}
	.inputGroup input:checked ~ label.lmenu:after {
		background-color: none;
		border-color: none;
	}
	.inputGroup input {
	width: 32px;
	height: 32px;
	-webkit-box-ordinal-group: 2;
			order: 1;
	z-index: 2;
	position: absolute;
	right: 30px;
	top: 50%;
	-webkit-transform: translateY(-50%);
			transform: translateY(-50%);
	cursor: pointer;
	visibility: hidden;
	}

	*,
	*::before,
	*::after {
	box-sizing: inherit;
	}

	html {
	box-sizing: border-box;
	}

	code {
	background-color: #9aa3ac;
	padding: 0 8px;
	}

	.menu-options {
		padding: 20px;
		text-align: center;
	}

	.menu-options.active{
		background: #54e0c7;
	}

	.menu-price {
		font-size: 1.2em;
		font-weight: bold;
	}