.elementor-kit-6{--e-global-color-primary:#FFFBE2;--e-global-color-secondary:#FF4D0E;--e-global-color-text:#242427;--e-global-color-accent:#FF4D0E;--e-global-color-28565dd:#00E8D8;--e-global-color-c56f870:#9E5BF6;--e-global-color-892b6ec:#DCFF02;--e-global-typography-primary-font-family:"Open Sans";--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Open Sans";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Open Sans";--e-global-typography-text-font-size:22px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Open Sans";--e-global-typography-accent-font-size:80px;--e-global-typography-accent-font-weight:800;--e-global-typography-accent-line-height:100px;--e-page-transition-entrance-animation:e-page-transition-slide-out-down;--e-page-transition-animation-duration:1200ms;--e-preloader-animation:eicon-spin;--e-preloader-animation-duration:1500ms;--e-preloader-delay:0ms;--e-preloader-color:#FFF;--e-preloader-size:20px;}.elementor-kit-6 e-page-transition{background-color:#FF4D0E;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1400px;}.e-con{--container-max-width:1400px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Background color change */

html, body {
    max-width: 100%;
    overflow-x: hidden;
    background-color: #FFFBE2;
    
    transition:background-color 0.7s ease;
}

.color-orange {
  background-color: #FF4D0E !important; 
}
.color-creme {
  background-color: #FFFBE2 !important;
}
.color-gray {
  background-color: #242427 !important;
}

 /* Improved Animations Stylesheet from https://element.how/elementor-improve-entrance-animations/ , works for the 'fade' animations */

@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translate3d(0,-30px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInDown {
    animation-name: fadeDown
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translate3d(-30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInLeft {
    animation-name: fadeLeft
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translate3d(30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInRight {
    animation-name: fadeRight
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translate3d(0,30px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInUp {
    animation-name: fadeUp
}


/* custom cursor */

@media only screen and (min-width: 1367px) {
	body #magicMouseCursor {
	  z-index:10000000!important;
	  position: fixed;
	  width: 35px;
	  height: 35px;
	  border: 1px solid #FFFBE2;
	  background: rgba(36,36,39,0.4);
	  border-radius: 50%;
	  z-index: 9999;
	  left: 0;
	  top: 0;
	  transition: transform 0.07s, width 0.3s, height 0.3s;
	  pointer-events: none; }
	  body #magicMouseCursor.cursor-square {
		border-radius: 0; }

	body #magicPointer {
	  z-index:10000000!important;
	  height: 5px;
	  width: 5px;
	  top: 0;
	  left: 0;
	  position: fixed;
	  background: red;
	  border-radius: 50%;
	  pointer-events: none;
	  transition: background 0.2s, width 0.2s, height 0.2s, box-shadow 0.2s; }
	  body #magicPointer.is-hover {
		background: #fff; }
	  body #magicPointer.pointer-blur {
		height: 50px;
		width: 50px;
		background: none;
		border: 1px solid #fff;
		box-shadow: 0px 0px 15px -5px white; }
	  body #magicPointer.pointer-overlay {
		height: 50px;
		width: 50px;
		mix-blend-mode: difference;
		box-shadow: 0px 0px 15px -5px white; }

	body .magic-hover {
	  transition: all 0.2s; }
	  body .magic-hover:hover {
		cursor: none!important; }
}


@media screen and (max-width: 768px) { body { overflow-y: hidden; } }/* End custom CSS */