/* # Elementor Custom Elements Styles
---------------------------------------------------------------------------------------------------- */

/* ## Texts with icon on left
--------------------------------------------- */
.text-icon .elementor-widget-container {
	display: flex;
	align-items: center;
	gap: 11px;
}

.text-icon .elementor-widget-container svg {
	flex: none;
}

.text-icon .elementor-widget-container a {
	color: #267afb;
}

.text-icon .elementor-widget-container a:focus,
.text-icon .elementor-widget-container a:hover {
	color: #094676;
}

/* ## Surgeon hand in Get Surgpass banner
--------------------------------------------- */
.surgeon-hand {
	position: absolute;
	right: 0;
	top: 59px;
	animation: flex 1.5s linear infinite alternate;
	transform-origin: 80% 90%;
}

/* ## Stylish Underlined texts
--------------------------------------------- */
.signature-underline {
	position: absolute;
	top: 56px;
	left: 0;
}

.signature-underline-light {
	position: absolute;
	top: 52px;
	left: calc(50% - 170px);
}

/* ## Card Hover Effect
--------------------------------------------- */
.card-hover {
	transition: all 0.5s ease-in-out !important;
}

.card-hover:focus,
.card-hover:hover {
	background: linear-gradient(120deg, #65c0e1 1.74%, #327ed6 50.16%), linear-gradient(44deg, #ffd08c 19.33%, #fba726 112.5%);
}

.card-hover .after-hover {
	display: none;
}

.card-hover:focus .before-hover,
.card-hover:hover .before-hover {
	display: none;
}

.card-hover:focus .after-hover,
.card-hover:hover .after-hover {
	display: block;
}

.card-hover:focus p,
.card-hover:hover p,
.card-hover:focus h3,
.card-hover:hover h3 {
	color: #ffffff !important;
}

/* ## Pulse Animation in text
--------------------------------------------- */
.text-pulse::before {
	content: '';
	position: absolute;
	width: 24px;
	height: 24px;
	background-color: #FFFFFF00;
	top: calc(50% - 12px);
	left: calc(50% - 12px);
	border-radius: 50%;
	animation: pulse-glow 3s infinite;
	box-shadow: 0 0 0 26px #ffffff00;
	z-index: 5;
}

.text-pulse::after {
	content: '';
	position: absolute;
	width: 72px;
	height: 72px;
	background-color: #FFFFFF00;
	top: calc(50% - 36px);
	left: calc(50% - 36px);
	border-radius: 50%;
	animation: pulse-beat 3s infinite;
}

/* ## Arrow animation
--------------------------------------------- */
.moving-arrows .elementor-widget-container::before {
	content: '';
	width: 100%;
	height: 100%;
	background-color: #F3F9FF;
	position: absolute;
	top: 0;
	animation: slide-appear 2s infinite;
}

.moving-arrows.left .elementor-widget-container::before {
	left: 0;
}

.moving-arrows.right .elementor-widget-container::before {
	right: 0;
}

/* ## Homepage Hero Banner Cycle Loop Animation
--------------------------------------------- */
.cycle-loop .wp-image-479 {
	z-index: 2;
	position: relative;
}

.cycle-loop .cycle-loop__question,
.cycle-loop .cycle-loop__question-arrow,
.cycle-loop .cycle-loop__quickhit,
.cycle-loop .cycle-loop__quickhit-arrow,
.cycle-loop .cycle-loop__mastery,
.cycle-loop .cycle-loop__mastery-arrow {
	position: absolute;
	transition: all 0.3s ease-in-out;
}

.cycle-loop .cycle-loop__question-arrow,
.cycle-loop .cycle-loop__quickhit,
.cycle-loop .cycle-loop__quickhit-arrow,
.cycle-loop .cycle-loop__mastery,
.cycle-loop .cycle-loop__mastery-arrow {
	opacity: 0;
}

.cycle-loop .cycle-loop__question {
	left: 18px;
	bottom: 329px;
	animation: question-scale 5s infinite;
}

.cycle-loop .cycle-loop__question-name,
.cycle-loop .cycle-loop__quickhit-name,
.cycle-loop .cycle-loop__mastery-name {
	display: block;
	box-shadow: 0 12px 12px 0 #4D545D2e;
	padding: 10px 15px;
	line-height: 1;
	color: #094676;
	font-size: 20px;
	font-weight: 700;
	background-color: #ffffff;
	position: absolute;
	border: 1px solid #46c3dd;
	border-radius: 8px;
	transition: all 0.3s ease-in-out;
	opacity: 0;
}

.cycle-loop .cycle-loop__question-name {
	left: 0;
	bottom: 445px;
	animation: question-arrow-appear 5s infinite;
}

.cycle-loop .cycle-loop__question-arrow {
	left: 59px;
	bottom: 424px;
	animation: question-arrow-appear 5s infinite;
}

.cycle-loop .cycle-loop__quickhit {
	left: 242px;
	bottom: 581px;
	animation: quickhit-scale 5s infinite;
}

.cycle-loop .cycle-loop__quickhit-name {
	right: 243px;
	bottom: 517px;
	animation: quickhit-arrow-appear 5s infinite;
}

.cycle-loop .cycle-loop__quickhit-arrow {
	right: 67px;
	bottom: 429px;
	animation: quickhit-arrow-appear 5s infinite;
}

.cycle-loop .cycle-loop__mastery {
	right: 36px;
	bottom: 329px;
	animation: mastery-scale 5s infinite;
}

.cycle-loop .cycle-loop__mastery-name {
	right: 24px;
	bottom: 469px;
	animation: mastery-arrow-appear 5s infinite;
}

.cycle-loop .cycle-loop__mastery-arrow {
	right: 90px;
	bottom: 177px;
	animation: mastery-arrow-appear 5s infinite;
}

/* ## Login Menu in Mobile
--------------------------------------------- */
.site-header .widget-area .login-mobile-menu {
	position: absolute;
	right: 65px;
	top: 29px;
	z-index: 1000;
	font-size: 16px;
	line-height: 1;
	color: #ffffff;
}

/* ## Media Queries
--------------------------------------------- */
@media only screen and (min-width: 768px) {
	.site-header .widget-area .login-mobile-menu {
		display: none;
	}
}

@media only screen and (max-width: 1024px) {
	.signature-underline {
		top: 49px;
		width: 380px;
		left: calc(50% - 190px);
	}
	
	.signature-underline-light {
		top: 45px;
		width: 300px;
		left: calc(50% - 150px);
	}
	
	.cycle-loop .cycle-loop__question {
		width: 76px !important;
		left: -10px;
		bottom: 265px;
	}
	
	.cycle-loop .cycle-loop__question-arrow {
		width: 140px !important;
		left: 25px;
		bottom: 350px;
	}
	
	.cycle-loop .cycle-loop__quickhit {
		width: 69px !important;
		left: 190px;
		bottom: 470px;
	}
	
	.cycle-loop .cycle-loop__quickhit-arrow {
		width: 134px !important;
		right: 25px;
		bottom: 360px;
	}
	
	.cycle-loop .cycle-loop__mastery {
		width: 59px !important;
		right: -10px;
		bottom: 265px;
	}
	
	.cycle-loop .cycle-loop__mastery-arrow {
		width: 366px !important;
		right: 34px;
		bottom: 131px;
	}
	
	.cycle-loop .cycle-loop__question-name,
	.cycle-loop .cycle-loop__quickhit-name,
	.cycle-loop .cycle-loop__mastery-name {
		font-size: 18px;
	}
	
	.cycle-loop .cycle-loop__question-name {
		left: -30px;
		bottom: 370px;
	}
	
	.cycle-loop .cycle-loop__quickhit-name {
		right: 160px;
		bottom: 415px;
	}
	
	.cycle-loop .cycle-loop__mastery-name {
		right: -10px;
		bottom: 400px;
	}
}

@media only screen and (max-width: 767px) {
	.signature-underline {
		top: 42px;
		width: 324px;
		left: calc(50% - 162px);
	}
	
	.signature-underline-light {
		top: 39px;
		width: 256px;
		left: calc(50% - 128px);
	}
	
	.cycle-loop .cycle-loop__question-name,
	.cycle-loop .cycle-loop__quickhit-name,
	.cycle-loop .cycle-loop__mastery-name {
		font-size: 16px;
	}
}

@media only screen and (max-width: 475px) {
	.cycle-loop .cycle-loop__question {
		width: 55px !important;
		left: 10px;
		bottom: 190px;
	}
	
	.cycle-loop .cycle-loop__question-arrow {
		width: 90px !important;
		left: 36px;
		bottom: 250px;
	}
	
	.cycle-loop .cycle-loop__quickhit {
		width: 49px !important;
		left: 148px;
		bottom: 330px;
	}
	
	.cycle-loop .cycle-loop__quickhit-arrow {
		width: 95px !important;
		right: 28px;
		bottom: 250px;
	}
	
	.cycle-loop .cycle-loop__mastery {
		width: 40px !important;
		right: 8px;
		bottom: 187px;
	}
	
	.cycle-loop .cycle-loop__mastery-arrow {
		width: 255px !important;
		right: 40px;
		bottom: 98px;
	}
	
	.cycle-loop .cycle-loop__question-name {
		left: -15px;
		bottom: 260px;
	}
	
	.cycle-loop .cycle-loop__quickhit-name {
		right: 115px;
		bottom: 285px;
	}
	
	.cycle-loop .cycle-loop__mastery-name {
		right: -5px;
		bottom: 270px;
	}
}

/* ## Keyframes
--------------------------------------------- */

@keyframes flex {
	0% {
		transform: rotate(0deg);
	}
	
	100% {
		transform: rotate(-14deg);
	}
}

@keyframes pulse-beat {
	0% {
		background-color: #FFFFFF00;
	}
	
	5% {
		background-color: #FFFFFF26;
	}
	
	10% {
		background-color: #FFFFFF26;
	}
	
	20% {
		background-color: #FFFFFF00;
	}
}

@keyframes pulse-glow {
	0% {
		width: 24px;
		height: 24px;
		top: calc(50% - 12px);
		left: calc(50% - 12px);
		background-color: #FFFFFF00;
		box-shadow: 0 0 0 26px #ffffff00;
	}
	
	10% {
		background-color: #FFFFFF00;
	}
	
	20% {
		background-color: #FFFFFF26;
		box-shadow: 0 0 0 26px #ffffff0f;
	}
	
	41% {
		background-color: #FFFFFF26;
		box-shadow: 0 0 0 26px #ffffff0f;
	}
	
	80% {
		box-shadow: 0 0 0 0px #ffffff00;
	}
	
	100% {
		width: 180px;
		height: 180px;
		top: calc(50% - 90px);
		left: calc(50% - 90px);
		background-color: #FFFFFF00;
	}
}

@keyframes slide-appear {
	
	10% {
		width: 100%
	}
	
	40% {
		width: 0;
	}
	
	60% {
		width: 0;
	}
	
	90% {
		width: 100%;
	}
}

@keyframes question-scale {
	0% {
		scale: 1;
	}
	
	20% {
		scale: 1.15;
	}
	
	40% {
		scale: 1;
	}
}

@keyframes question-arrow-appear {
	0% {
		opacity: 0;
	}
	
	10% {
		opacity: 0;
	}
	
	21% {
		opacity: 1;
	}
	
	100% {
		opacity: 1;
	}
}

@keyframes quickhit-scale {
	0% {
		opacity: 0;
		scale: 1;
	}
	
	20% {
		opacity: 0;
	}
	
	30% {
		scale: 1.15;
	}
	
	31% {
		opacity: 1;
	}
	
	50% {
		scale: 1;
	}
	
	100% {
		opacity: 1;
	}
}

@keyframes quickhit-arrow-appear {
	0% {
		opacity: 0;
	}
	
	20% {
		opacity: 0;
	}
	
	31% {
		opacity: 1;
	}
	
	100% {
		opacity: 1;
	}
}

@keyframes mastery-scale {
	0% {
		opacity: 0;
	}
	
	40% {
		opacity: 0;
	}
	
	50% {
		scale: 1.15;
	}
	
	51% {
		opacity: 1;
	}
	
	70% {
		scale: 1;
	}
	
	100% {
		opacity: 1;
	}
}

@keyframes mastery-arrow-appear {
	0% {
		opacity: 0;
	}
	
	40% {
		opacity: 0;
	}
	
	51% {
		opacity: 1;
	}
	
	100% {
		opacity: 1;
	}
}

@keyframes name-appear {
	0% {
		opacity: 0;
	}
	
	60% {
		opacity: 0;
	}
	
	71% {
		opacity: 1;
	}
	
	100% {
		opacity: 1;
	}
}