/**
 * LMS Subscribe Section - Standalone CSS
 * 
 * This CSS file contains all styles required for the LMS Subscribe Section component
 * to work independently on any page (LMS Library, Live Market Session, etc.)
 * 
 * Usage: Include this file in any page that uses the lms_subscribe_section component
 */

/* ============================================
   Main Subscribe Section Styles
   ============================================ */

.lmarket_subscribe {
	position: relative;
	padding: 102px 0;
	overflow: hidden;
}

.lmarket_subscribe::before {
	position: absolute;
	right: 0;
	top: -30px;
	content: "";
	background: url(../live_market_session/lmarket_subscribe_shadow.png) 50% 0 no-repeat;
	width: 453px;
	height: 704px;
}

.lmarket_subscribe .container {
	position: relative;
}

.lmarket_subscribe .container .animation1 {
	position: absolute;
	right: -170px;
	bottom: 3px;
	scale: 0.87;
}

.lmarket_subscribe .container .lmarket_subscribe_box1 {
	position: absolute;
	right: 233px;
	top: 60px;
	background: url(../live_market_session/subscribe_box1.png) 50% 0 no-repeat;
	width: 188px;
	height: 174px;
}

.lmarket_subscribe .container .lmarket_subscribe_box2 {
	position: absolute;
	left: 60px;
	bottom: 39px;
	background: url(../live_market_session/subscribe_box2.png) 50% 0 no-repeat;
	width: 362px;
	height: 122px;
}

.lmarket_subscribe .container .lmarket_subscribe_glob {
	position: absolute;
	left: 60px;
	bottom: 39px;
	background: url(../live_market_session/subscribe_glob.png) 50% 0 no-repeat;
	width: 362px;
	height: 122px;
}

.lmarket_subscribe .lmarket_subscribe_m {
	overflow: hidden;
	position: relative;
}

.lmarket_subscribe .lmarket_subscribe_m .lmarket_subscribe_glob {
	position: absolute;
	left: 0;
	right: 0;
	top: 90px;
	border-radius: 50%;
	background: url(../live_market_session/glob.webp) 50% 0 no-repeat;
	height: 1253px;
	overflow: hidden;
	opacity: 0.9;
	width: 1253px;
	margin: 0 auto;
	display: block;
	background-size: contain;
	-webkit-animation: spin 20s linear infinite;
	-moz-animation: spin 20s linear infinite;
	animation: spin 20s linear infinite;
	pointer-events: none;
}

.lmarket_subscribe .lmarket_subscribe_minner {
	background: url(../live_market_session/lmarket_subscribe_m_bg.webp) 50% 0 no-repeat;
	padding: 58px 60px;
	background-size: cover;
	border: #353d39 1px solid;
	border-radius: 20px;
	box-shadow: inset 0 0 22px #2fb463;
}

.lmarket_subscribe .lmarket_subscribe_month {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	color: #fff;
	font-family: Roboto, sans-serif;
	margin-bottom: 8px;
}

.lmarket_subscribe_month.desktop_show {
	display: none;
}

.lmarket_subscribe .lmarket_subscribe_month img {
	margin-right: 10px;
}

.lmarket_subscribe .lmarket_subscribe_user {
	margin-bottom: 50px;
}

.lmarket_subscribe .lmarket_subscribe_user ul {
	display: flex;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.lmarket_subscribe .lmarket_subscribe_user ul li {
	padding: 8px 0;
}

.lmarket_subscribe .lmarket_subscribe_user ul li img {
	border: #fff 1px solid;
	border-radius: 50%;
	width: 50px;
	height: 50px;
}

.lmarket_subscribe .lmarket_subscribe_user ul li:nth-child(2) {
	margin-left: -13px;
}

.lmarket_subscribe .lmarket_subscribe_user ul li:nth-child(3) {
	margin-left: -13px;
}

.lmarket_subscribe .lmarket_subscribe_user ul li:nth-child(4) {
	margin-left: -13px;
}

.lmarket_subscribe .lmarket_subscribe_mid {
	color: #fff;
	font-family: Roboto, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 28px;
	text-align: center;
	margin: 0 auto;
	width: 820px;
	max-width: 100%;
	margin-bottom: 33px;
}

.lmarket_subscribe .lmarket_subscribe_mid h2 {
	font-family: Montserrat, sans-serif;
	font-size: 36px;
	font-weight: 700;
	margin-bottom: 21px;
}

.lmarket_subscribe .lmarket_subscribe_price {
	text-align: center;
	margin-bottom: 40px;
}

.lmarket_subscribe .lmarket_subscribe_price .cut-text {
	font-size: 18px;
	color: rgba(255, 255, 255, 0.6);
	text-decoration: line-through;
	margin-left: 10px;
}

.lmarket_subscribe .lmarket_subscribe_price .bold-text {
	font-size: 23px;
	color: #fff;
	font-weight: bold;
}

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

.lmarket_subscribe .lmarket_subscribe_btn .btn {
	background: rgba(47, 180, 99, 1);
	width: 326.18px;
	height: 56.62px;
	border-radius: 7px;
	font-family: Montserrat, sans-serif;
	font-size: 18px;
	font-weight: 700;
	line-height: 24px;
	letter-spacing: 0.01em;
	text-align: center;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	max-width: 100%;
	animation: zoom-in-zoom-out 2s ease-in-out infinite;
	border: 0 !important;
	flex-wrap: wrap;
}

.lmarket_subscribe .lmarket_subscribe_btn .btn .small {
	width: 100%;
	font-size: 12px;
	font-weight: normal;
}

.lmarket_subscribe .lmarket_subscribe_btn a {
	border: 0 !important;
}

.lmarket_subscribe .lmarket_subscribe_btn .btn {
	animation: inherit;
	border-radius: 100px;
}

.lmarket_subscribe {
	padding-bottom: 0;
}

/* Shadow Background */
.shadow-bg {
	position: relative;
}

.shadow-bg img {
	width: 100%;
	height: auto;
}

/* ============================================
   Price Selection Cards Styles
   ============================================ */

.button__group__price .price__row {
	display: flex;
	justify-content: center;
	display: -webkit-flex;
	padding-bottom: 40px;
}

.button__group__price .price__row .column__col {
	padding: 0 20px;
}

.button__group__price .price__row .column__col .price__area {
	border: 3px solid #2fb463 !important;
	border-radius: 100px;
	color: #FFF;
	padding: 12px 40px 13px 90px;
	text-align: left;
	position: relative;
	cursor: pointer;
	border: 2px solid transparent;
}

.button__group__price .price__row .column__col .price__area span.price__bg {
	width: 80px;
	height: 80px;
	position: absolute;
	background: #2fb463;
	border-radius: 100px;
	left: -3px;
	top: -3px;
	border: 5px solid #FFF;
}

.button__group__price .price__text strong {
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 500;
	color: #FFF;
	opacity: 0.8;
	display: flex;
	align-items: center;
}

.button__group__price .price__text .price__flex {
	font-size: 13px;
	display: flex;
	justify-content: space-between;
	width: 220px;
	padding-top: 10px;
}

.button__group__price .price__text .price__flex span {
	text-decoration: line-through;
}

.button__group__price .price__row .column__col .price__area .price__text strong img {
	height: 18px;
	width: 18px;
	filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(103%) contrast(103%);
	margin-right: 6px;
}

.button__group__price .price__row .column__col .price__area__second {
	border-color: #2fb463;
}

.button__group__price .price__row .column__col .price__area__second span.price__bg {
	background: #2fb463;
}

.button__group__price .price__row .column__col .price__area:hover {
	background: #2fb463;
	border-color: #2fb463;
}

.button__group__price .price__row .column__col .price__area:hover span.price__bg {
	background: #2fb463;
}

.button__group__price .price__button {
	border-radius: 100px !important;
	animation: inherit !important;
}

/* Selectable Price Active State */
.selectable-price {
	cursor: pointer;
	border: 2px solid transparent;
}

.selectable-price.active {
	border-color: #0d6efd;
	background-color: #2fb463;
}

.button__group__price .price__row .column__col .price__area__second.active,
.button__group__price .price__row .column__col .price__area__second.active span.price__bg {
	background: #2fb463;
}

.button__group__price .price__row .column__col .price__area__second.active {
	border-color: #2FB463;
}

/* LMS Library Price Column */
.price__area.lms__library__price__col {
	border-color: #2fb463 !important;
}

.button__group__price .price__row .column__col .price__area.lms__library__price__col span.price__bg {
	border-color:#FFF ;
	background: #2fb463;
}

/* Hover Content Tooltip */
.button__group__price .price__row .column__col .price__area .hover__content {
	position: absolute;
	top: -70px;
	background: rgba(47, 180, 99, 1);
	left: 0;
	right: 0;
	border-radius: 10px;
	padding: 10px 12px;
	font-size: 12px;
	transition: 0.3s all;
	opacity: 0;
	visibility: hidden;
	display: inline-table;
	margin: auto;
}

.button__group__price .price__row .column__col .price__area.selectable-price .hover__content.popup__top {
	top: -125px;
}

.button__group__price .price__row .column__col .price__area.selectable-price .hover__content.popup__top__1 {
	top: -90px;
}

.button__group__price .price__row .column__col .price__area .hover__content p {
	margin: 0;
}

.button__group__price .price__row .column__col .price__area:hover .hover__content {
	opacity: 1;
	visibility: visible;
}

.button__group__price .price__row .column__col .price__area .hover__content::before {
	content: '';
	display: inline-block;
	position: absolute;
	border-style: solid;
	border-width: 0 0 12px 12px;
	height: 0;
	width: 0;
	border-color: transparent;
	border-bottom-color: transparent;
	border-bottom-color: rgba(47, 180, 99, 1);
	left: 0;
	right: 0;
	margin: auto;
	bottom: -5px;
	transform: rotate(45deg);
}

/* Price Animation (Free Popup) */
.price__flex b::before {
	content: '';
	position: absolute;
	width: 0px;
	height: 3px;
	background: #2fb463;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	right: 0;
	transition: 6.3s all;
	opacity: 0;
}

.price__flex.show__price b::before {
	width: 100%;
	opacity: 1;
}

.price__flex b {
	position: relative;
}

.price__flex.show__price b {
	color: #2fb463;
}

.button__group__price .price__row .column__col .price__area:hover .price__flex.show__price b {
	color: #FFF;
}

.button__group__price .price__row .column__col .price__area:hover .price__flex.show__price b::before {
	background: #FFF;
}

.button__group__price .price__row .column__col .price__area.active .price__flex.show__price b {
	color: #FFF;
}

.button__group__price .price__row .column__col .price__area.active .price__flex.show__price b::before {
	background: #FFF;
}

/* Loaded Active State (Free LMS Library) */
.hover_lms_library {
	opacity: 0;
	transform: translateY(10px);
	transition: 0.3s ease;
}

.parent:hover .hover_lms_library {
	opacity: 1;
	transform: translateY(0);
}

.button__group__price .price__row .column__col .price__area.loaded__active .hover__content {
	opacity: 1;
	visibility: visible;
}

.button__group__price .price__row .column__col .price__area.loaded__active {
	background: #2fb463;
}

.button__group__price .price__row .column__col .price__area.loaded__active .price__flex.show__price b {
	color: #FFF;
}

.button__group__price .price__row .column__col .price__area.loaded__active .price__flex.show__price b::before {
	background: #FFF;
}

/* ============================================
   Animations
   ============================================ */

@keyframes zoom-in-zoom-out {
	0%,
	100% {
		transform: scale(0.97);
	}
	50% {
		transform: scale(1);
	}
}

@-moz-keyframes spin {
	100% {
		-moz-transform: rotate(360deg);
	}
}

@-webkit-keyframes spin {
	100% {
		-webkit-transform: rotate(360deg);
	}
}

@keyframes spin {
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/* ============================================
   Responsive Styles
   ============================================ */

@media (max-width: 1199px) {
	.button__group__price .price__text strong {
		font-size: 12px;
	}

	.button__group__price .price__text .price__flex {
		width: 190px;
		font-size: 12px;
	}

	.button__group__price .price__row .column__col .price__area {
		padding: 10px 30px 10px 80px;
	}

	.button__group__price .price__row .column__col .price__area span.price__bg {
		width: 72px;
		height: 72px;
	}

	.button__group__price .price__row {
		flex-wrap: wrap;
	}

	.button__group__price .price__row .column__col {
		padding: 10px;
	}

	.button__group__price .price__row .column__col .price__area.selectable-price .hover__content.popup__top__1 {
		top: -110px;
	}
}

@media (max-width: 991px) {
	.button__group__price .price__row .column__col .price__area {
		padding: 10px 30px 10px 80px;
	}

	.button__group__price .price__text strong {
		font-size: 12px;
	}

	.button__group__price .price__text .price__flex {
		width: 190px;
	}

	.button__group__price .price__row .column__col .price__area span.price__bg {
		width: 73px;
		height: 73px;
	}

	.button__group__price .price__row .column__col {
		padding: 0 10px;
	}

	.button__group__price .price__row {
		padding-bottom: 20px;
	}
}

@media (max-width: 767px) {
	.lmarket_subscribe {
		padding: 53px 0;
	}

	.lmarket_subscribe .lmarket_subscribe_minner {
		padding: 43px 28px;
	}

	.lmarket_subscribe .lmarket_subscribe_month.desktop_show {
		display: none;
	}

	.lmarket_subscribe .lmarket_subscribe_month.mobile_show {
		display: flex;
		justify-content: center;
		margin-bottom: 12px;
	}

	.lmarket_subscribe .lmarket_subscribe_user ul li {
		padding: 0;
	}

	.lmarket_subscribe .lmarket_subscribe_user ul li img {
		width: 38px;
		height: 38px;
	}

	.lmarket_subscribe .lmarket_subscribe_user ul li:nth-child(2) {
		margin-left: -13px;
	}

	.lmarket_subscribe .lmarket_subscribe_user ul li:nth-child(3) {
		margin-left: -13px;
	}

	.lmarket_subscribe .container .lmarket_subscribe_glob {
		display: none;
	}

	.lmarket_subscribe .lmarket_subscribe_m .lmarket_subscribe_glob {
		display: none;
	}

	.lmarket_subscribe .lmarket_subscribe_mid h3 {
		margin-bottom: 14px;
		font-size: 16px;
		font-weight: 700;
		line-height: 19.5px;
	}

	.lmarket_subscribe .lmarket_subscribe_mid {
		margin-bottom: 28px;
		font-size: 14px;
		font-weight: 400;
		line-height: 21px;
	}

	.lmarket_subscribe .lmarket_subscribe_price .bold-text {
		font-size: 18px;
	}

	.lmarket_subscribe .lmarket_subscribe_price .cut-text {
		font-size: 16px;
	}

	.button__group__price .price__row {
		flex-wrap: wrap;
	}

	.button__group__price .price__row .column__col+.column__col {
		margin-top: 20px;
	}
}
.Subscribe__section__popup .modal-header {
	padding: 0 !important;
	border: 0 !important;
}
.Subscribe__section__popup .lmarket_subscribe_m {
	padding: 0 !important;
}
.Subscribe__section__popup .modal-header .close {
	margin: 0;
	position: absolute;
	right: 0;
	z-index: 999;
	border-radius: 100px;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	font-size: 28px;
	border: 0;
	background: #2fb463;
	color: #FFF;
	right: -17px;
}
#lmsSubscribeModal .modal-content{border-radius: 28px !important;}
@media (max-width:991px) {
.Subscribe__section__popup .container {
  max-width: 100%;
}
.Subscribe__section__popup {
	padding: 20px !important;
}
#lmsSubscribeModal .modal-content{height: auto;}
}