/* Layout */
	body {
		background-color: #000;
	}
	.jelly_blue_bg_segment{
		width:100% !important;
		background-color: #47c2f0 !important;
		margin-top:50px;
		padding-bottom:20px;
	}
	.dark_blue_bg_segment{
		width:100% !important;
		background-color: #02288f !important;
		padding-top:50px;
		margin-top:30px;
		padding-bottom:20px;
		background-image:url('../..//display/img/expo/blueSegmentBG.png');
	}
	iframe {
		border-radius: 15px;
	}
	.steps_content_block {
		width:75%;
		margin-left: auto !important;
		margin-right: auto !important;
	}
	.sign_up_now_button_container {
		margin-top:40px;
		text-align: center;
	}


/* Text General */
	h2 {font-size:40pt;}
	h3 {font-size:25pt;}
	h4 {font-size:20pt;}
	h5 {font-size:18pt;}
	h6 {font-size:15pt;}


/* Text Classes */
	.dollarEmoji {
		padding-right:5px;
		zoom:1 !important;
	}
	.dark_blue_glow {
		text-shadow: rgba(0,22,71,1) 0px 0px 14px;
	}
	.dark_black_glow {
		text-shadow: rgba(21,20,20,1) 0px 0px 14px;
	}
	.text_it_bold {
		color:#47c2f0;
		font-weight: bold !important;
	}
	.text_it_left_padding {
		padding-left:5px;
	}
	.all_caps_title {
		text-transform: uppercase !important;
		text-align: center !important;
		font-style: italic !important;
		font-family: "Roboto", sans-serif;
	}
	.expo_text_container {
		color:#fff !important;
		text-align: center !important;
	}
	.basic_paragraph {
		font-size:14pt;
	}
	.bold_paragraph {
		font-weight:bold !important;
		font-size:16pt;
	}
	.black_title {
		color:#000;
		text-align: center !important;
		font-style: italic !important;
		font-family: "Roboto", sans-serif;
		padding-top:20px;
	}
	.jellyblue_header {
		color:#47c2f0;
	}
	.steps_content_block p {font-size:12pt;}
	.placeholder_text {
		color: transparent;
  		text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
  		font-size:18px;
	}
	.placeholder_text_dark {
		color: transparent;
  		text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  		font-size:14px;
	}
	.thin_title {
		font-weight:100 !important;
	}
	.openModal, .openMoneyModal {
		cursor: pointer !important;
	}
	.red_highlight {
		color:#f54941 !important;
		font-weight:bold !important;
	}
	.blue_highlight {
		color:#47c2f0;
	}
	.mitb_h5 {
		font-size:16px;
		color:#212d42 !important;
		padding:0px !important;
		margin:0px !important;
	}
	.mitb_h4 {
		font-size:22px;
		color:#212d42 !important;
		padding:0px !important;
		margin:0px !important;
	}
	.header_32 {
		font-size:32px;
	}
	.center_vert_inside_grid {
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 100%;
		max-width:80%;
		margin-left:auto;
		margin-right:auto;
	}


/* Animations */
	#fadeInFirst {
	  opacity: 0;
	  transform: perspective(900px) rotateY(-10deg) translateY(20px);
	  transform-origin: 50% 50%;
	  backface-visibility: hidden;
	  will-change: transform, opacity;
	  transition: transform 700ms cubic-bezier(.22,.61,.36,1), opacity 700ms ease-out;
	}

	#fadeInFirst.is-visible {
	  opacity: 1;
	  transform: perspective(900px) rotateY(0deg) translateY(0);
	}

	@media (prefers-reduced-motion: reduce) {
	  #fadeInFirst {
	    opacity: 1 !important;
	    transform: none !important;
	    transition: none !important;
	  }
	}

	
	.showAsWeScroll {
	  opacity: 0;
	  transform: perspective(900px) rotateY(-10deg) translateY(20px);
	  transform-origin: 50% 50%;
	  backface-visibility: hidden;
	  will-change: transform, opacity;
	  transition: transform 700ms cubic-bezier(.22,.61,.36,1), opacity 700ms ease-out;
	}

	.showAsWeScroll.is-visible {
	  opacity: 1;
	  transform: perspective(900px) rotateY(0) translateY(0);
	}


	@media (prefers-reduced-motion: reduce) {
	  .showAsWeScroll {
	    opacity: 1 !important;
	    transform: none !important;
	    transition: none !important;
	  }
	}

	.showAsWeScrollVariant {
	  opacity: 0;
	  transform: perspective(900px) rotateY(10deg) translateX(24px) scale(0.98);
	  transform-origin: 50% 50%;
	  backface-visibility: hidden;
	  will-change: transform, opacity;
	  transition: transform 700ms cubic-bezier(.22,.61,.36,1), opacity 700ms ease-out;
	}

	.showAsWeScrollVariant.is-visible {
	  opacity: 1;
	  transform: perspective(900px) rotateY(0) translateX(0) scale(1);
	}

	@media (prefers-reduced-motion: reduce) {
	  .showAsWeScrollVariant {
	    opacity: 1 !important;
	    transform: none !important;
	    transition: none !important;
	  }
	}
	
	.sign_up_now_button_container {
	  
	  transform-origin: 50% 50%;
	  will-change: transform, filter;
	  animation: jellyPulse 2.8s ease-in-out infinite;
	}
	.sign_up_now_button_container:hover,
	.sign_up_now_button_container:focus-within {
	  animation-play-state: paused;
	  transform: scale(1.03);
	  filter: drop-shadow(0 0 12px rgba(71, 194, 240, 0.6));
	  transition: transform 200ms ease, filter 200ms ease;
	}

	.sign_up_now_button_container img {
	  transform: translateZ(0);
	}

	@keyframes jellyPulse {
	  0% {
	    transform: scale(1);
	    filter: drop-shadow(0 0 0 rgba(71, 194, 240, 0));
	  }
	  50% {
	    transform: scale(1.045);
	    filter: drop-shadow(0 0 14px rgba(71, 194, 240, 0.55));
	  }
	  100% {
	    transform: scale(1);
	    filter: drop-shadow(0 0 0 rgba(71, 194, 240, 0));
	  }
	}

	@media (prefers-reduced-motion: reduce) {
	  .sign_up_now_button_container {
		animation: none !important;
		transform: none !important;
		filter: none !important;
	  }
	}
	
	.suble_text_effect {
		position: relative;
		display: inline-block;
		letter-spacing: 0.01em; 
		transform: translateY(6px);
		opacity: 0;
		will-change: transform, opacity;
		animation: headlineIn 650ms cubic-bezier(.22,.61,.36,1) forwards;
		animation-play-state: paused;
	}


	.suble_text_effect::after {
		content: "";
		position: absolute;
		left: 50%;
		bottom: -0.01em;
		width: 0;
		height: 3px;
		transform: translateX(-50%);
		border-radius: 2px;
		background: linear-gradient(90deg,
		rgba(71,194,240,0) 0%,
		rgba(71,194,240,0.9) 50%,
		rgba(71,194,240,0) 100%);
		opacity: 0;
		will-change: width, opacity;
		animation: underlineGrow 800ms 120ms ease-out forwards;
		animation-play-state: paused;
	}


	.showAsWeScroll.is-visible .suble_text_effect,
	.showAsWeScrollVariant.is-visible .suble_text_effect,
	.suble_text_effect.is-visible {
		animation-play-state: running;
	}
	.showAsWeScroll.is-visible .suble_text_effect::after,
	.showAsWeScrollVariant.is-visible .suble_text_effect::after,
	.suble_text_effect.is-visible::after {
		animation-play-state: running;
	}

	@media (max-width: 767px) {
	  .jelly-break {
	    display: block;
	    margin-top: 0.25em;
	  }
	}

	@keyframes headlineIn {
	  0%   { opacity: 0; transform: translateY(10px); letter-spacing: 0.04em; }
	  60%  { opacity: 1; transform: translateY(0);   letter-spacing: 0.012em; }
	  100% { opacity: 1; transform: translateY(0);   letter-spacing: 0.01em; }
	}

	@keyframes underlineGrow {
	  0%   { width: 0;    opacity: 0; }
	  30%  { width: 20%;  opacity: .9; }
	  100% { width: 60%;  opacity: .9; } 
	}

	.suble_text_effect:hover,
	.suble_text_effect:focus {
	  text-shadow: 0 0 6px rgba(71,194,240,0.25);
	}

	@media (prefers-reduced-motion: reduce) {
	  .suble_text_effect {
	    animation: none !important;
	    transform: none !important;
	    opacity: 1 !important;
	  }
	  .suble_text_effect::after {
	    animation: none !important;
	    width: 60% !important;
	    opacity: .9 !important;
	  }
	}

	.learnDivider {
		border-radius: 15px;
		border-left:10px solid #38c3fa !important;
		border-right:10px solid #38c3fa !important;
	}

/* Mobile */
@media (max-width: 767px) {
	
	#main_header_container {
		display:none;
	}
	
	.dollarEmoji {
		padding-right:5px;
		zoom:2;
	}


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

	.learnDivider {
		border-radius: 0px;
		border-left:0px solid #38c3fa !important;
		border-right:0px solid #38c3fa !important;
	}

	.ui.dimmer.modals.page {
		position: fixed !important;
	}

	.ui.modal.fullscreen {
		width: 100% !important;
		height: 100dvh !important; 
		max-height: 100dvh !important;
		margin: 0 !important;
		top: 0 !important; left: 0 !important;
		border-radius: 0 !important;
	}

	.ui.modal.fullscreen > .content,
	.ui.modal.scrolling   > .content {
		max-height: calc(100dvh - 6rem); 
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	.ui.modal .actions,
	.ui.modal table.ui.table {
		position: sticky;
		bottom: 0;
	}
}

.ui.modal.scrolling > .content {
  max-height: calc(100vh - 6rem);
  overflow-y: auto;
}
