/*
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0-rc.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor */

/*Global items*/
:root{
	--color-primary: #8039D8;
}

html,
body{
	overflow-x: hidden;
}

.box-shadow{
	box-shadow: 0 0 20px 0 rgba(152, 162, 179, 0.24);
	z-index:1
}

.box-shadow:hover{
	box-shadow: 0 0 20px 0 rgba(128, 57, 216, 0.34);
	z-index:0
}

/*Buttons*/
.search-loop-button svg {
	width: 18px;
	height: 18px;
}

.light-outline-button .elementor-button-icon svg,
.color-outline-button .elementor-button-icon svg {
	width: 20px;
	height: 20px;
}

/* Header */

.main-menu-header nav > ul > li.current-menu-item,
.main-menu-header nav > ul > li.current-menu-ancestor {
	background-image: url(/wp-content/uploads/2025/08/active-menu-vector.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}

.text-center{
	text-align: center;
}

/* ========================= Heartbeat Form (scoped) ========================= */

/* All styles extracted from forms/heartbeat-form.html and scoped under .cst-form */
.cst-form {

    /* Design tokens (scoped) */
    --color-primary: #8039D8;      /* Button, border accent */
    --color-text: #08030D;         /* Primary text */
    --color-text-2: #667085;       /* Secondary text */
    --color-border: #D0D5DD;       /* Field border */
    --color-white: #FFF;

    --radius-xl: 26px;
    --radius-md: 12px;
    --space-xxs: 2px;
    --space-xs: 4px;
    --space-s: 8px;
    --space-m: 12px;
    --space-l: 16px;
    --space-xl: 24px;

    --font-title: "Epilogue", system-ui, -apple-system, segoe ui, roboto, inter, arial, sans-serif;
    --font-body: "Inter", system-ui, -apple-system, segoe ui, roboto, arial, sans-serif;
}

/* Container */
.cst-form .fuel-form {
    background: rgba(255, 255, 255, 0.8);
    border: 1px dashed var(--color-primary);
    border-radius: var(--radius-xl);
    padding: var(--space-xl);
    display: flex;
    flex-direction: column;
    gap: var(--space-m);
    color: var(--color-text);
}

/* Sparkle badge */
.cst-form .fuel-form__sparkle {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--color-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
}

.cst-form .fuel-form__sparkle-icon {
	width: 20px;
	height: 20px;
}

/* Header */
.cst-form .fuel-form__header {
	display: flex;
	flex-direction: column;
	gap: var(--space-xxs);
}

.cst-form .fuel-form__title {
    font-family: var(--font-title);
    font-weight: 600; /* SemiBold */
    font-size: 20px;
    line-height: 1.4;
    margin: 0;
}

.cst-form .fuel-form__subtitle {
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.55;
    color: var(--color-text-2);
    margin: 0;
}

/* Form body */
.cst-form .fuel-form__body {
	display: flex;
	flex-direction: column;
	gap: var(--space-l);
}

/* Fields */
.cst-form .field { display: block; }

.cst-form .field + .field { margin-top: var(--space-s); }

.cst-form .field__label {
    display: block;
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.55;
    color: var(--color-text);
    margin: 0 0 var(--space-xs);
}

.cst-form .field__hint {
    font-family: var(--font-body),serif;
    font-size: 12px;
    line-height: 1.55;
    color: var(--color-text-2);
    margin: calc(-1 * var(--space-xs)) 0 var(--space-xs);
}

/* Text inputs */
.cst-form .input:not(textarea) {
    width: 100%;
    height: 48px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-white);
    padding: 12px 14px;
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 24px; /* matches design 24px line height */
    color: var(--color-text);
}

.cst-form .input::placeholder {
	color: var(--color-text-2);
}

.cst-form .input:focus {
	outline: 2px solid color-mix(in srgb, var(--color-primary) 45%, transparent);
	outline-offset: 2px;
}

/* Select */
.cst-form .select { position: relative; }

.cst-form .select select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 100%;
    height: 48px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-white);
    padding: 12px 38px 12px 14px; /* room for chevron */
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 24px;
    color: var(--color-text-2); /* placeholder style */
}

.cst-form .select__chev {
    position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
    width: 16px; height: 16px; color: var(--color-text-2);
    pointer-events: none;
}

/* Checkbox */
.cst-form .check {
	display: flex;
	align-items: center;
	gap: var(--space-s);
	margin-bottom: 7px;
}

.cst-form .check__box {
    width: 30px;
	height: 30px;
	border-radius: 8px !important;
	border: 1px solid var(--color-border);
    appearance: none;
	-webkit-appearance: none !important;
	display: grid;
	place-items: center;
    background: var(--color-white);
	position: relative;
}

.cst-form .check__box:checked {
	background: var(--color-primary);
	border-color: var(--color-primary);
}

.cst-form .check__box:checked::after {
    content: "";
	width: 15px;
	height: 15px;
	border-radius: 3px;
	background: var(--color-white);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.cst-form .check__label {
	font-family: var(--font-body);
	font-size: 14px;
	line-height: 24px;
	color: var(--color-text-2);
}

/* Button */
.cst-form .btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 16px 32px;
    background: var(--color-primary);
    color: var(--color-white);
    border: none; border-radius: var(--radius-md);
    font-family: var(--font-body); font-weight: 600; font-size: 14px; line-height: normal;
    cursor: pointer;
	max-width: 240px;
}

.cst-form .btn:focus {
	outline: 2px solid color-mix(in srgb, var(--color-primary) 50%, white 50%);
	outline-offset: 2px;
}

.cst-form .btn__icon {
    width: 16px;
    height: 16px;
}

/* Per-field visibility toggle */
.cst-form .vis-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 8px;
    padding: 4px 8px;
    border-radius: 999px;
    border: 1px solid var(--color-border);
    background: #fff;
    color: var(--color-text-2);
    font-family: var(--font-body);
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
}

.cst-form .vis-toggle:hover,
.cst-form .vis-toggle:focus {

    /* Do not change visual appearance on hover/focus */
    background: #fff;
    border: 1px solid var(--color-border);
    color: var(--color-text-2);
}

/*.cst-form .vis-toggle:focus { outline: 2px solid color-mix(in srgb, var(--color-primary) 45%, transparent); outline-offset: 2px; }*/
.cst-form .vis-toggle__label { display: none; }

/* Notices */
.cst-form .fp-notice {
    padding: 10px 12px;
    border-radius: 8px;
    font-family: var(--font-body);
    font-size: 14px;
}

.cst-form .fp-notice--error { background: #FEF2F2; color: #991B1B; border: 1px solid #FCA5A5; }

/* Success notice in primary (violet) palette */
.cst-form .fp-notice--success {
    background: color-mix(in srgb, var(--color-primary) 12%, #fff 88%);
    color: var(--color-primary);
    border: 1px solid color-mix(in srgb, var(--color-primary) 35%, #fff 65%);
	margin-bottom: 20px;
}

/* Visibility dropdown (custom) */
.cst-form .vis-dd,
.cst-form .vis-dd *,
.cst-form .vis-dd::before,
.cst-form .vis-dd::after { transition: none !important; animation: none !important; }

.cst-form .vis-dd { display: inline-block; margin-left: 8px; position: relative; }

.cst-form .vis-dd__button {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 8px; border: 1px solid var(--color-border); border-radius: 999px;
    background: #fff; color: var(--color-text-2);
    font-family: var(--font-body); font-size: 12px; line-height: 1; cursor: pointer;
}

.cst-form .vis-dd__button:hover {

    /* Keep the trigger visually identical on hover */
    background: #fff;
    border-color: var(--color-border);
    color: var(--color-text-2);
	border: 1px solid var(--color-border);
}

.cst-form .vis-dd__button:focus {

    /* Keep base visuals on focus (no border/background change) */
    background: #fff;
    border-color: var(--color-border);
    color: var(--color-text-2);
    outline: none;
	border: 1px solid var(--color-border);
}

/* Provide an accessible focus indicator without altering borders */
.cst-form .vis-dd__button:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--color-primary) 50%, white 50%);
    outline-offset: 2px;
}

.cst-form .vis-dd__icon { width: 14px; height: 14px; }

.cst-form .vis-dd__chev { width: 14px; height: 14px; }

.cst-form .vis-dd__menu {
    position: absolute; z-index: 10; top: calc(100% + 6px); right: 0;
    min-width: 160px; background: #fff; border: 1px solid var(--color-border); border-radius: 8px;
    box-shadow: 0 4px 24px rgba(16,24,40,0.08);
    padding: 6px; list-style: none; margin: 0;
}

.cst-form .vis-dd__option {
    padding: 8px 10px; border-radius: 6px; cursor: pointer;
    font-family: var(--font-body); font-size: 13px; color: var(--color-text);
}

.cst-form .vis-dd__option[aria-selected="true"] { background: #F9F5FF; color: var(--color-primary); }

.cst-form .vis-dd__option:hover { background: #F2F4F7; }

/* ======================= End Heartbeat Form (scoped) ======================= */

.text-center .jet-form-builder__label-text,
.text-center .jet-form-builder__heading-desc{
	text-align: center;
}

#status-success-block{
	display: none;
}

#forgot-password-form.success_reset {
	display: none;
}

#status-success-block.success_reset {
	display: flex;
}

#status-success-block.success_reset + div {
	display: none;
}

.square-icon__centered{
	height: 44px;
}

.dotted-border-list li {
	height: 40px;
	width: fit-content;
	align-items: center;
	border: 1px dashed var(--color-primary);
	border-radius: 69px;
	padding: 4px 16px 4px 4px!important;
}

.square-icon__centered .elementor-icon-wrapper{
	display: flex;
	justify-content: center;
	height: 100%;
	align-items: center;
}

.e-font-icon-svg.e-fas-caret-down {
	fill: #8039d8;
}

.elementor-nav-menu .sub-arrow {
	padding-left: 6px;
}

#my-account-menu nav {
	width: max-content !important;
	top: 45px !important;
}

.main-menu-header ul.sub-menu {
	top: 55px !important;
	width: max-content !important;
	padding: 6px !important;
}

#global-header ul.sub-menu {
	top: 55px !important;
}

#my-account-menu .elementor-nav-menu {
	padding: 6px !important;
}

.main-menu-header .sub-menu li:nth-child(2),
#my-account-menu .elementor-nav-menu li:not(:first-child):not(:last-child) {
	margin-top: 2px !important;
	margin-bottom: 2px !important;
}

.single-reel-sidebar-video-placeholder img{
	aspect-ratio: 282/200;
	object-fit: cover;
}

.single-reel-sidebar-video-placeholder a {
	display: block;
	width: 100%;
}

.single-reel-sidebar-heading a{font-weight: 500}

.main-menu-header .sub-menu li a,
#my-account-menu .elementor-nav-menu li a {
	border-inline-start: 0 !important;
	border-radius: 6px !important;
}

.avatar-column .jet-form-builder-file-upload__file img {
	border-radius: 100%;
}

.main-menu-header .sub-menu li a img {
	margin-right: 6px !important;
}

#mobile-menu li a img,
#my-account-menu .elementor-nav-menu li a img {
	margin-right: 6px !important;
}

	/* Footer*/
.icon-for-post .elementor-button-icon svg,
.icon-for-thread .elementor-button-icon svg,
.icon-for-reflection .elementor-button-icon svg {
	display: none;
}

.footer-social-icons .elementor-grid-item:nth-child(1) svg,
.footer-social-icons .elementor-grid-item:nth-child(3) svg,
.footer-social-icons .elementor-grid-item:nth-child(4) svg {
	width: 20px;
	height: 20px;
}

.footer-social-icons .elementor-grid-item:nth-last-child(1) svg {
	width: 18px;
	height: 18px;
}

.daily-vault-section::after {
	content: "";
	position: absolute;
	top: 0;
	left: 100px;
	width: calc(100vw);
	height: 100%;
	background: #F1EAFB;
	border-radius: 200px;
	pointer-events: none;
	z-index: -9999;
}

.subscribe-section .e-con-inner {
	position: relative;
}

.subscribe-section .e-con-inner::after {
	content: "";
	position: absolute;
	top: 0;
	right: 200px;
	width: calc(100vw);
	height: 100%;
	background: #F1EAFB;
	border-radius: 30px;
	pointer-events: none;
	z-index: -1;
}

.spicy-17,
.spicy-18 {

	/*background-image: linear-gradient(90deg, var(--e-global-color-accent) 0%, var(--e-global-color-secondary) 100%);*/
	background-image: linear-gradient(90deg, var(--e-global-color-d9c3289) 0%, #FA1B16B3 100%) !important;
}

input.jet-form-builder__field::placeholder{
	font: 400 14px/24px Inter, sans-serif;
	color: #667085;
}

.jet-form-builder-row > .jet-form-builder__desc {
	order: 2;
}

.jet-form-builder__fields-group {
	margin-top: 5px;
}

.jet-form-builder-row > .jet-form-builder__field-wrap,
.jet-form-builder-row > .jet-form-builder__fields-group {
	order: 3;
}

.jet-form-builder-row > .error-message {
	order: 4;
}

.heartbeat-form .field-type-radio-field .jet-form-builder__label {
	margin-bottom: 0 !important;
}

select.jet-form-builder__field{
	font: 400 14px/24px Inter, sans-serif;
	color: #667085;
}

body .jet-form-builder__field.why-are-you-here{
	margin-top: 4px
}

/*You’re not broken section*/

/* Search Results */
.hide-if.missing-search-results {
	display: none;
}

#search-loop-section .elementor-loop-container .e-loop-item:nth-child(2) {

	/*rotate: -7deg;*/
	transform: rotate(-7deg);
	z-index: 1;
}

#search-loop-section .elementor-loop-container .e-loop-item:nth-child(3) {

	/*rotate: 7deg;*/
	transform: rotate(7deg);
	z-index: 2;
}

#search-loop-section .elementor-loop-container .e-loop-item:nth-child(4) {

	/*rotate: -6deg;*/
	transform: rotate(-6deg);
	z-index: 3;
}

#search-loop-section .elementor-loop-container .e-loop-item:nth-child(5) {

	/*rotate: -7deg;*/
	transform: rotate(7deg);
	z-index: 1;
}

#search-loop-section .elementor-loop-container .e-loop-item:nth-child(6) {

	/*rotate: 7deg;*/
	transform: rotate(-3deg);
	z-index: 2;
}

#search-loop-section .elementor-loop-container .e-loop-item:nth-child(7) {

	/*rotate: -6deg;*/
	transform: rotate(2deg);
	z-index: 3;
}

#search-loop-section .elementor-loop-container .e-loop-item:nth-child(8) {

	/*rotate: -7deg;*/
	transform: rotate(-3deg);
	z-index: 1;
}

#search-loop-section .elementor-loop-container .e-loop-item:nth-child(9) {

	/*rotate: 7deg;*/
	transform: rotate(3deg);
	z-index: 2;
}

#search-loop-section .elementor-loop-container .e-loop-item:nth-child(10) {

	/*rotate: -6deg;*/
	transform: rotate(-9deg);
	z-index: 3;
}

#search-loop-section .elementor-pagination
{
	margin-top: 100px;
}

.elementor-pagination{
	margin-top: 50px;
}


.elementor-pagination .page-numbers:nth-child(2) {
	padding: 6px 13.5px !important;
}

.elementor-pagination .page-numbers:not(.prev):not(.next):hover {
	color: var(--e-global-color-0f5eb8e);
	background-color: var(--color-primary);
	border-color: var(--color-primary) !important;
}

.elementor-pagination .page-numbers.current {
	background-color: var(--color-primary);
	border-color: var(--color-primary) !important;
	color: #fff !important;
}


.elementor-pagination span.page-numbers.next,
.elementor-pagination span.page-numbers.prev,
.elementor-pagination a.page-numbers.next,
.elementor-pagination a.page-numbers.prev{
	color: transparent;
	width: 30px;
	height: 30px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	line-height: 30px;
	position: relative;
	border: 1px solid var(--e-global-color-72a87fb);
	border-radius: 6px;
}

.elementor-pagination span.page-numbers.prev::after,
.elementor-pagination a.page-numbers.prev::after,
.elementor-pagination span.page-numbers.next::after,
.elementor-pagination a.page-numbers.next::after{
	position: absolute;
	left:50%;
	top:50%;
	transform: translate(-50%,-50%);
	content: "";
	height: 16px;
	width: 16px;
}

.elementor-pagination span.page-numbers.prev::after{
	background: url(/wp-content/themes/its4reel/assets/img/svg/arrow-left-disabled.svg) no-repeat center center / contain;
}

.elementor-pagination a.page-numbers.prev::after{
	background: url(/wp-content/themes/its4reel/assets/img/svg/arrow-left.svg) no-repeat center center / contain;
}

.elementor-pagination span.page-numbers.next::after{
	background: url(/wp-content/themes/its4reel/assets/img/svg/arrow-right-disabled.svg) no-repeat center center / contain;
}

.elementor-pagination a.page-numbers.next::after{
	background: url(/wp-content/themes/its4reel/assets/img/svg/arrow-right.svg) no-repeat center center / contain;
}

.search-item-overlay {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

/* Search Loop Button */
.search-loop-button {
	text-transform: capitalize;
}

.icon-for-thread .elementor-button-icon {
	margin-top: 2px;
	width: 18px;
	height: 18px;
	background: url(/wp-content/uploads/2025/10/lightning-icon-its4reel.svg) no-repeat center center / contain;
}

.icon-for-post .elementor-button-icon,
.icon-for-reflection .elementor-button-icon {
	margin-top: 2px;
	width: 18px;
	height: 18px;
	background: url(/wp-content/uploads/2025/10/color-palette-icon-its4reel.svg) no-repeat center center / contain;
}

#no-results-search-page {
	display: none;
}

.show-if.missing-search-results {
	display: flex !important;
}

.textarea {
	height: 120px;
}

.avatar-column .jet-form-builder__field-wrap {
	border: 1px solid #d0d5dd;
	border-radius: 12px;
	padding: 25px 14px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	min-height: 120px;
}

.avatar-column {
	overflow: hidden;
	position: relative;
}

.avatar-column .jet-form-builder-file-upload__fields {
	position: absolute;
	left: 200%;
}

.avatar-column .jet-form-builder-file-upload {
	position: relative;
	cursor: pointer;
}

.avatar-column .jet-form-builder-file-upload::after {
	position: absolute;
	content: "Chose an Image to upload";
	font-size: 12px;
	line-height: 18px;
	color: #667085;
	top: 90px;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 1;
	width: 100%;
	text-align: center;
	max-width: 92px;
}

.avatar-column .jet-form-builder-file-upload.uploaded::after {
	content: "Change the image";
	top: 90px;
}

.avatar-column .jet-form-builder-file-upload__content {
	width: 56px;
	height: 56px;
	min-height: unset;
	min-width: unset;
	border-radius: 100%;
	background-image: url(/wp-content/uploads/2025/11/upload.svg);
	background-repeat: no-repeat;
	background-position: top center;
	cursor: pointer;
}

.avatar-column .jet-form-builder-file-upload__file {
	width: 56px;
	height: 56px;
	border-radius: 100%;
	margin-top: -20px;
}

.avatar-column .jet-form-builder-file-upload__file-remove {
	width: 56px;
	height: 56px;
	border-radius: 100%;
	top: 0;
}

.wp-block-columns.heartbeat-grid {
	display: grid;
	grid-template-columns: 1fr 120px;
	grid-template-rows: auto;
	column-gap: 24px;
}

.heartbeat-form {
	container-type: inline-size; /* Correct property name */
	container-name: heartbeat-form; /* Naming the container */
}

@container heartbeat-form (max-width: 500px) {

	.wp-block-columns.heartbeat-grid {
	grid-template-columns: 1fr;
	}
}

.single-reel-sidebar-video-placeholder{
	aspect-ratio: 282 / 200;
	display: flex;
	width: 100%;
}

.elementor-widget-loop-grid>.elementor-widget-container>.elementor-button-wrapper{
	margin-top: 24px;
}

.channel{position:relative;}

.channel-get-reel,
.channel-qe
{
	top:-15px !important;
}

.channel-rp,
.channel-yh{
	bottom: -15px !important;
}

.video-container{
	aspect-ratio: 16/9;
}

.channel{pointer-events: none}

body.role-administrator .channel,
body.role-full-access .channel{pointer-events: auto}

.playstation{pointer-events: none}

body.role-administrator .playstation,
body.role-full-access .playstation{pointer-events: auto}

.newsletter-list-icons .elementor-icon-list-item:nth-child(2) {
    margin-left: 37px
}

.newsletter-list-icons .elementor-icon-list-item:nth-child(3) {
    margin-left: 75px
}

/*Tablets*/
@media (max-width: 1024px) {
  .subscribe-section .e-con-inner::after {
    content: none;
  }

  .subscribe-section-text::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: calc(100vw);
    height: 100%;
    background: #F1EAFB;
    border-radius: 30px;
    pointer-events: none;
    z-index: -1;
  }

	#mobile-menu li:not(:first-child):not(:last-child) {
		margin-top: 2px !important;
		margin-bottom: 2px !important;
	}

	#mobile-menu li a {
		border-inline-start: 0 !important;
		border-radius: 6px !important;
	}

	#mobile-menu .sub-menu {
		margin-top: 2px;
		margin-bottom: 2px;
		margin-left: 23px;
	}

  #main-character-hero-banner {
        right: 0;
        max-width: 575px;
        left: clamp(17%, 5vw, 22%);
    }
}

@media (max-width: 992px) {
    #main-character-hero-banner {
        left: clamp(10%, 5vw, 22%);
    }
}

@media (max-width: 820px) {
    #main-character-hero-banner {
        left: clamp(7%, 5vw, 22%);
    }
}

/*Mobiles*/
@media (max-width: 767px) {

	.menu-footer-1 ul > li > a,
	.menu-footer-2 ul > li > a,
	.menu-footer-3 ul > li > a {
		justify-content: center !important;
	}

	.p-0.missing-search-results {
		padding: 0 !important;
	}

	.single-reel-sidebar-video-placeholder,
	.single-reel-sidebar-video-placeholder img{
		aspect-ratio: 16/9;
	}

  .newsletter-list-icons .elementor-icon-list-item:nth-child(2),
  .newsletter-list-icons .elementor-icon-list-item:nth-child(3) {
      margin-left: 0;
  }

  #hero-section-homepage {
    height: 220px;
    background-position: bottom center;
    background-size: 375px;
  }

  #main-character-hero-banner {
    top: -18px;
    left: -10%;
  }

  #main-character-hero-banner img {
    max-width: 327px;
    width: 327px;
  }
}

@media (max-width: 576px) {
  #main-character-hero-banner {
    left: -25%;
  }
}

@media (max-width: 480px) {
  .bubble-textarea {
      max-width: 150px;
      max-height: 150px;
      top: 0;
  }

  .bubble-textarea p,
  .bubble-textarea a {
      font-size: 10px !important;
  }

  .bubble-textarea a.bubble-cta {
      margin-top: 0;
  }

  #hero-section-homepage {
    height: 200px;
    max-height: 200px;
    border-radius: 12px 12px 0 0;
    background-position: bottom left;
  }

  #main-character-hero-banner {
    top: -18px;
    left: -10%;
    max-width: 350px;
    width: 350px;
  }

  #main-character-hero-banner img {
    max-width: 300px;
    width: 300px;
  }
}

@media (max-width: 375px) {


  #main-character-hero-banner {
    top: -18px;
    left: -25%;
    /* max-width: 350px;
    width: 350px; */
  }
}