:root {
	--lightGreen: #c9fabf;
	--primaryGreen: #44ff1f;
	--darkGreen: #7aa372;
	--primaryLighter: #13c54f;
	--primary: #23b354;
	--primaryTransparent: #23b35421;
	--primaryTransparentLess: rgb(35 179 84 / 23%);
	--primaryTransparentLess2: rgb(35 179 84 / 33%);
	--primaryDarker: #21a94f;
	--primaryDarkest: #1b9746;
	--accent: #a4de02;
	--primaryBg: #68bb59;
	--accentBg: #a4de02;
	--errorColor: #f80;
	--errorColorTransparent: rgb(255 136 0 / 13%);
	--errorColorDarker: #ec7e00;
	--errorColorDarkest: #e17800;
	--pointsColor: #FFD639;
	--pointsColorTransparent: rgb(255 214 57 / 20%);
	--pointsColorDarker: rgb(231 194 52);
	--blueColor: rgba(22, 192, 243, 1);
	--blueColorDarker: rgb(20 161 203);
	--blueColorTransparent: rgba(22, 192, 243, 13%);
	--activitiesColor: rgba(144, 35, 179, 1);
	--activitiesColorTransparent: rgba(144, 35, 179, 13%);
	--backgroundColor: rgb(245 242 245);
	--backgroundColorDialog: rgb(251 248 251);
	--backgroundColorDark: #202020a8;
	--backgroundColorDarkNoTransparancy: rgb(72 72 72);
	--defaultBorderColor: rgba(0,0,0,.12);
	--defaultLighterBorderColor: rgba(0,0,0,.05);
	--fontDarkColor: rgba(0, 0, 0, .87);
	--fontDarkColorLighter77: rgba(0, 0, 0, .77);
	--fontDarkColorLighter: rgba(0, 0, 0, .67);
	--fontDarkColorLightest: rgba(0, 0, 0, .47);
	--greyColorTransparent: rgba(0, 0, 0, .03);
	--carousel-gutters: 32px;
	--dialogBgColor: rgb(0 0 0 / 33%);
}
/* latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/JTURjIg1_i6t8kCHKm45_cJD3gnD_g.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/JTURjIg1_i6t8kCHKm45_ZpC3gfD_u50.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/JTURjIg1_i6t8kCHKm45_ZpC3gnD_g.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/JTURjIg1_i6t8kCHKm45_dJE3gnD_g.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
input[type='number'] {
	-moz-appearance:textfield;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
html,body {
	margin: 0;
	padding: 0;
	font-family: "Montserrat", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background-color: var(--backgroundColor);
}
.header {
	max-width: 1440px;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	padding: 0 16px;
	height: 80px;
	box-sizing: border-box;
	position: relative;
	z-index: 200;
	position: sticky;
	background-color: var(--backgroundColor);
	-webkit-transition: all 350ms ease-in-out;
	-moz-transition: all 350ms ease-in-out;
	-ms-transition: all 350ms ease-in-out;
	-o-transition: all 350ms ease-in-out;
	transition: all 350ms ease-in-out;
}
.headerContent {
	height: 80px;
	position: relative;
	margin: 0 auto;
	border-radius: 34px;
	border-color: rgb(230,230,230);
	border-style: solid;
	padding: 0 16px;
	box-sizing: border-box;
	border-width: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.logoContainer {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin: 0 16px;
}
.logoContainer img {
	width: 26px;
	height: 26px;
}
.logoContainer a {
	color: var(--primary);
	text-decoration: none;
	margin-left: 8px;
	font-size: 1.5em;
	font-weight: 600;
}
.logoContainer a b {
	letter-spacing: 0.02em;
}
.logo-and-back{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	width: 25%;
}
.headerContent .btn-container{
	width: 25%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	position: relative;
}
.headerContent .btn-container.secure-checkout{
	justify-content: flex-end;
}
.headerContent .btn-container button,
.headerContent .btn-container a{
	background-color: transparent;
	appearance: none;
	-webkit-appearance: none;
	border: none;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 8px 10px;
	fill: var(--fontDarkColorLighter);
	color: var(--fontDarkColorLighter);
	font-size: 0.9em;
	border-radius: 24px;
	border-width: 1px;
	border-style: solid;
	border-color: transparent;
	position: relative;
	text-decoration: none;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 0);
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
.headerContent .btn-container button:hover,
.headerContent .btn-container a:hover{
	background-color: #fff;
	border-color: var(--defaultLighterBorderColor);
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	fill: var(--primary);
	color: var(--primary);
}
.headerContent .btn-container button:focus,
.headerContent .btn-container a:focus{
	outline: none;
}
.headerContent .btn-container button svg,
.headerContent .btn-container a svg{
	width: 24px;
	height: 24px;
	fill: inherit;
}
.headerContent .btn-container button label,
.headerContent .btn-container a label{
	text-transform: uppercase;
	margin: 0 8px;
	color: inherit;
	font-weight: 600;
	font-size: inherit;
}
.headerContent .btn-container button .button-badge{
	position: absolute;
	padding: 4px;
	box-sizing: border-box;
	width: 28px;
	height: 28px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-weight: 600;
	font-size: 0.95em;
	background-color: #fff;
	border-width: 1px;
	border-style: solid;
	border-color: var(--defaultBorderColor);
	color: var(--primary);
	right: -16px;
	top: -16px;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	opacity: 1;
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
#secure-checkout-button-container.visible button .button-badge{
	opacity: 0;
}
#secure-checkout-button-container .cart-preview-header{
	position: absolute;
	width: 100%;
	padding: 24px;

	max-height: 420px;
	background-color: #fff;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	top: calc(100% + 8px);
	border-radius: 24px;
	display: none;
	border-width: 1px;
	border-style: solid;
	border-color: var(--defaultLighterBorderColor);
	box-sizing: border-box;
}
#secure-checkout-button-container.visible .cart-preview-header{
	display: flex;
	flex-direction: column;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-tittle{
	position: relative;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-tittle h4{
	margin-block-start: 0;
	margin-block-end: 0.33em;
	color: var(--fontDarkColorLighter);
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content{
	flex-grow: 1;
	position: relative;
	padding: 8px 0;
	height: 100%;
	overflow-x: hidden;
	overflow-y: scroll;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content ul{
	list-style: none;
	margin: 0;
	padding:0;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content ul li{
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	padding: 12px 0;
	box-sizing: border-box;
	border-bottom-color: var(--defaultLighterBorderColor);
	border-bottom-style: solid;
	border-bottom-width: 1px;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content ul li:last-child{
	border-bottom-color: transparent;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content ul li h4{
	margin-block-start: 0;
	margin-block-end: 0.33em;
	font-size: 0.85em;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content ul li p{
	margin-block-start: 0;
	margin-block-end: 0;
	font-size: 0.85em;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content ul li .content{
	flex-grow: 1;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content ul li .action{
	display: flex;
	flex-direction: row;
	justify-content:flex-end;
	align-items: baseline;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content ul li .action button{
	border: none;
	appearance: none;
	background-color: transparent;
	fill: var(--fontDarkColorLightest);
	border-width: 2px;
	border-style: solid;
	border-color: transparent;
	border-radius: 50%;
	padding: 2px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	outline: none;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 0);
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content ul li .action button:hover{
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	background-color: #fff;
	border-color: transparent;
	border-color: var(--defaultLighterBorderColor);
	fill: var(--errorColorDarker);
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	position: relative;
	border-top-color: var(--defaultLighterBorderColor);
	border-top-style: solid;
	border-top-width: 1px;
	padding: 12px 0 0;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar button,
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar a{
	font-size: 0.85em;
	min-height: 100%;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar button label,
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar a label{
	text-transform: unset;
	margin: 0 12px;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar button svg,
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar a svg{
	width: 22px;
	height: 22px;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar #close-cart-preview-header-btn{
	color:var(--fontDarkColorLightest);
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar #close-cart-preview-header-btn:hover{
	color:var(--fontDarkColorLighter77);

}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar #checkout-cart-preview-header-btn{
	background-color: var(--primary);
	fill: #fff;
  color: #fff;
}
#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar #checkout-cart-preview-header-btn:hover{
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
  border-color: var(--primaryDarkest);
}

.headerContent .btn-container button#secure-checkout-button{
	fill: var(--fontDarkColorLighter);
	color: var(--fontDarkColorLighter);
}
#secure-checkout-button-container.visible button#secure-checkout-button{
	background-color: #fff;
	border-color: var(--defaultLighterBorderColor);
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	fill: var(--primary);
	color: var(--primary);
}
.body-container{
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 16px;
	box-sizing: border-box;
}
.body-container .page-tittle{
	text-align: center;
	padding: 24px 0 16px 0;
}
.body-container .page-tittle h1{
	font-size: 2em;
	margin-block-start: 0;
	margin-block-end: 0;
	color: var(--fontDarkColorLighter);
}
.body-container .page-tittle h4{
	margin-block-start: 0.66em;
	margin-block-end: 0.66em;
	color: var(--fontDarkColorLighter77);
}
.body-container .page-tittle h2{
	margin-block-start: 0;
	margin-block-end: 0;
	color: var(--fontDarkColorLighter77);
}
.body-container .buy-page{
	display: grid;
	grid-auto-flow: row;
	grid-template-columns: repeat(6, calc(100% / 6));
	grid-auto-rows: min-content;
	grid-template-rows: auto;
}

.body-container .buy-page .offer-suggestion-section{
	grid-column-start: 1;
	grid-column-end: 7;
	grid-row-start: 1;
	grid-row-end: 1;
	position: relative;
	background-color: var(--greyColorTransparent);
	border-radius: 28px;
	padding: 16px;
	margin: 16px 0;
}
.body-container .buy-page .offer-suggestion-container{
	background-color: #FFF;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 4%);
	border-width: 1px;
	border-style: solid;
	border-color: var(--defaultLighterBorderColor);
	border-radius: 24px;
	padding: 24px;
}
.body-container .buy-page .offer-suggestion-container h5{
	margin-block-start: 0;
	margin-block-end: 0.5em;
	position: relative;
	z-index: 2;
	color: var(--fontDarkColorLighter);
}
.body-container .buy-page .offer-suggestion-container h3{
	margin-block-start: 0;
	margin-block-end: 0.33em;
}
.body-container .buy-page .offer-suggestion-container p{
	margin-block-start: 0;
	margin-block-end: 0;
	color: inherit;
	font-weight: 500;
	font-size: 0.9em;
	line-height: 1.4em;
}
.body-container .buy-page .course-description{
	display: grid;
	grid-auto-flow: row;
	grid-template-columns: repeat(4, calc(100% / 4));
	grid-auto-rows: auto min-content;
	grid-column-start: 1;
	grid-column-end: 5;
	grid-row-start: 2;
	grid-row-end: 4;
	box-sizing: border-box;
	padding: 0;
	margin: 32px 16px 32px 16px;
	background-color: #FFF;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 4%);
	border-width: 1px;
	border-style: solid;
	border-color: var(--defaultLighterBorderColor);
	border-radius: 24px;
	height: fit-content;
}
.body-container .buy-page.many-courses .course-description{
	grid-auto-rows: auto;
}
.body-container .buy-page .course-description .toolbar-bottom{
	padding: 24px;
	margin: 0 0 0;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: var(--defaultLighterBorderColor);
	grid-column: span 4;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}
.body-container .buy-page .course-description .toolbar-bottom .btn-cont a{
	background-color: var(--primary);
	appearance: none;
	-webkit-appearance: none;
	border: none;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 12px 12px;
	fill: #fff;
	color: #fff;
	font-size: 0.9em;
	border-radius: 24px;
	border-width: 1px;
	border-style: solid;
	border-color: var(--primaryDarker);
	position: relative;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 0);
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
	width: fit-content;
	text-decoration: none;
}
.body-container .buy-page .course-description .toolbar-bottom .btn-cont a label{
	text-transform: unset;
	font-weight: 600;
}
.body-container .buy-page .course-description .toolbar-bottom .btn-cont a:hover{
	border-color: var(--primaryDarkest);
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
}
.body-container .buy-page .course-description ul{
	grid-column: span 4;
	list-style: none;
	padding: 0 0;
	margin: 0;	
}
.body-container .buy-page .course-description .course.card{
	width: auto;
	height: 100%;
	min-height: 270px;
	box-sizing: border-box;
	padding: 24px 24px;
	margin: 0 0 0 0;
	isolation: isolate;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-ms-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.body-container .buy-page.many-courses .course-description .course.card{
	margin: 0;
	border-bottom-color: var(--defaultLighterBorderColor);
	border-bottom-style: solid;
	border-bottom-width: 1px;
	min-height: 60px;
	height: auto;
	display: grid;
	grid-template-columns: 96px 1fr 100px 32px;
	grid-template-rows: min-content min-content;
}
.body-container .buy-page .course-description .course.card.table-tittle{
	display: none;
}
.body-container .buy-page.many-courses .course-description .course.card.table-tittle{
	display: grid;
	grid-template-rows: min-content;
	min-height: 30px;
	background-color: #fff;
	border-radius: 24px 24px 0 0;
}
.body-container .buy-page.many-courses .course-description .course.card.table-tittle .artwork-cont{
	display: none;
}
.body-container .buy-page.many-courses .course-description .course.card.table-tittle .tittle-cont{
	grid-column-start: 1;
	grid-column-end: 2;
}
.body-container .buy-page.many-courses .course-description .course.card.table-tittle .tittle,
.body-container .buy-page .course-description .course.card.table-tittle .details-cont h2{
	color: var(--fontDarkColorLighter);
	font-size: 1em;
}
.body-container .buy-page.many-courses .course-description .course.card .status-cont{
	display: none;
}
.body-container .buy-page.many-courses .course-description .course.card .tittle-cont{
	grid-column-start: 2;
	grid-column-end: 2;
}
.body-container .buy-page.many-courses .course-description .course.card .description-cont{
	width: 100%;
	color: var(--fontDarkColor);
	grid-column-start: 2;
	grid-column-end: 2;
	grid-row-start: 2;
	grid-row-end: 2;
}
.body-container .buy-page.many-courses .course-description .course.card:last-child{
	border-bottom-width: 0;
}
.body-container .buy-page .course-description .course.card .status-cont h5{
	margin-block-start: 0;
	margin-block-end: 0.33em;
	color: var(--fontDarkColorLighter);
}
.body-container .buy-page .course-description .course.card .tittle{
	margin-block-start: 0;
	margin-block-end: 0.33em;
	color: var(--fontDarkColorLighter77);
}
.body-container .buy-page.many-courses .course-description .course.card .tittle{
	font-size: 0.9em;
	margin-block-end: 0.33em;
}
.body-container .buy-page .course-description .course.card .artwork-cont{
	width: 20%;
	height: 270px;
	position: absolute;
	right: 12px;
	top: 0;
	overflow: hidden;
}
.body-container .buy-page.many-courses .course-description .course.card .artwork-cont{
	width: 72px;
	height: 72px;
	position: relative;
	grid-column-start: 1;
	grid-column-end: 1;
	display: flex;
	grid-row-start: 1;
	grid-row-end: 3;
	right: unset;
	top: unset;
}
.body-container .buy-page .course-description .course.card .artwork-cont .artwork{
	width: 100%;
	height: 100%;
	opacity: 1;
}
.body-container .buy-page .course-description .course.card .description-cont{
	width: 76%;
	color: var(--fontDarkColor);
}
.body-container .buy-page .course-description .course.card .description-cont .description{
	margin-block-start: 0;
	margin-block-end: 0;
	color: inherit;
	font-weight: 500;
	font-size: 0.9em;
	line-height: 1.5em;
	display: block;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.body-container .buy-page.many-courses .course-description .course.card .description-cont .description{
	display: -webkit-box;
	font-size: 0.85em;
}
.body-container .buy-page .course-description .course.card .details-cont{
	margin: 16px 0 0;
	width: 66.66%;
  color: var(--fontDarkColor);
	display: none;
}
.body-container .buy-page.many-courses .course-description .course.card .details-cont{
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: center;
	margin: 0;
	grid-column-start: 3;
	grid-column-end: 3;
	text-align: center;
	width: 100%;
}
.body-container .buy-page .course-description .course.card .details-cont .description-cont{
	width: 100%;
}
.body-container .buy-page .course-description .course.card .details-cont h4{
	margin-block-start: 0em;
	margin-block-end: 0.66em;
}
.body-container .buy-page .course-description .course.card .details-cont h2{
	font-size: 0.9em;
	margin-block-start: 0;
  margin-block-end: 0;
}
.body-container .buy-page .course-description .course.card .details-cont .disclamer{
	margin-top: 8px;
}
.body-container .buy-page.many-courses .course-description .course.card .details-cont .disclamer{
	display: block;
}
.body-container .buy-page .course-description .course.card .details-cont .disclamer p{
	font-size: 0.8em;
	margin: 0;
	margin-block-end: 1em;
	line-height: 1.5em;
}
.body-container .buy-page .course-description .course.card .artwork-cont-bg{
	position: absolute;
	right: 16px;
	top: 0;
	opacity: 0.19;
	filter: blur(12px) brightness(1.2);
	width: 38%;
}
.body-container .buy-page.many-courses .course-description .course.card .artwork-cont-bg{
	display: none;
}
.body-container .buy-page .course-description .course.card .course-content{
	margin: 0 0 0;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}
.body-container .buy-page .course-description .course.card .delete-cont{
	display: none;
}
.body-container .buy-page.many-courses .course-description .course.card .delete-cont{
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: flex-end;
	text-align: right;
	margin-top: -6px;
	height: 16px;
	overflow: visible;
}
.body-container .buy-page.many-courses .course-description .course.card .delete-cont button{
	border: none;
	appearance: none;
	background-color: transparent;
	fill: var(--fontDarkColorLightest);
	border-width: 2px;
	border-style: solid;
	border-color: transparent;
	border-radius: 50%;
	padding: 2px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	outline: none;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 0);
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
.body-container .buy-page.many-courses .course-description .course.card .delete-cont button:focus{
	outline: none;
}
.body-container .buy-page.many-courses .course-description .course.card .delete-cont button:hover{
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	background-color: #fff;
	border-color: transparent;
	border-color: var(--defaultLighterBorderColor);
	fill: var(--errorColorDarker);
}
.body-container .buy-page.many-courses .course-description .course.card .delete-cont button svg{
	width: 24px;
	height: 24px;
	fill: inherit;
}
.body-container .buy-page .course-description .course.card .course-content>h4{
	margin-block-start: 1.33em;
	margin-block-end: 0;
	color: var(--fontDarkColorLighter);
}
.body-container .buy-page.many-courses .course-description .course.card .course-content{
	display: none;
}
.body-container .buy-page .course-description .course.card .courseStatsCont{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(93px, 1fr));
	text-align: center;
	margin: 12px 0 12px 0;
	width: 76%;
}
.body-container .buy-page .course-description .course.card .course-content-description{
	width: 76%;
	flex-grow: 1;
}
.body-container .buy-page .course-description .course.card .course-content-description h4{
	margin-block-start: 0em;
	margin-block-end: 0.66em;
	color: var(--fontDarkColorLighter);
}
.body-container .buy-page .course-description .course.card .course-content-description p{
	font-size: 0.9em;
	line-height: 1.4em;
	min-height: 2.8em;
	margin-block-start: 0;
	margin-block-end: 0;
}
.body-container .buy-page .course-description .course.card .disclamer{
	margin-top: 12px;
}
.body-container .buy-page .course-description .course.card .disclamer p{
	font-size: 0.8em;
	margin: 0;
	margin-block-end: 0;
	font-style: italic;
}
.body-container .buy-page .course-description .course.card .courseStatsCont:hover .stat{
	border-right-color: transparent;
} 
.body-container .buy-page .course-description .course.card .courseStatsCont .stat{
	text-align: center;
	width: 100%;
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	box-sizing: border-box;
	margin: 8px 0 8px 0;
	padding: 0 0 0 0;
	isolation: isolate;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: transparent;
	user-select: none;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-ms-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
	color: var(--fontDarkColorLighter);
	fill: var(--fontDarkColorLightest);
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .cont{
	width: 100%;
	padding: 10px 10px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border-width: 3px;
	border-style: solid;
	border-color: transparent;
	border-radius: 16px;
	box-sizing: border-box;
	color: var(--fontDarkColorLighter);
	fill: var(--fontDarkColorLightest);
	-webkit-transition: all 200ms cubic-bezier(0.46, 0.03, 0.52, 0.96);
	-moz-transition: all 200ms cubic-bezier(0.46, 0.03, 0.52, 0.96);
	-ms-transition: all 200ms cubic-bezier(0.46, 0.03, 0.52, 0.96);
	-o-transition: all 200ms cubic-bezier(0.46, 0.03, 0.52, 0.96);
	transition: all 200ms cubic-bezier(0.46, 0.03, 0.52, 0.96);
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .cont:hover{
	color: var(--fontDarkColorLighter);
	fill: var(--fontDarkColorLightest);
	border-color: var(--defaultBorderColor);
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	background-color: #fff;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .cont.selected{
	color: var(--primary);
	border-color: var(--primary);
	fill: var(--primary);
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	background-color: #fff;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .cont.selected:hover{
	color: var(--primary);
	border-color: var(--primary);
	fill: var(--primary);
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	background-color: #fff;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .cont h1{
	font-size: 1.7em;
	line-height: 1em;
	margin: 0 0 5px;
	font-weight: bold;
	color: inherit;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .cont label{
	opacity: 0.8;
	font-size: 0.82em;
	margin: 0;
	font-weight: 500;
	color: var(--fontDarkColor);
	white-space: nowrap;
	cursor: pointer;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .icon{
	display: none;
	width: 24px;
	height: 24px;
	margin: 0 0 8px 0;
	padding: 0;
	background-color: transparent;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 0);
	isolation: isolate;
	border-width: 0;
	border-style: solid;
	border-color: transparent;
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-ms-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
	box-sizing: border-box;
	border-radius: 16px;
	flex-shrink: 0;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat.chip .icon{
	display: block;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .icon svg{
	fill: inherit;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .description{
	display: none;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat.chip .description{
	width: auto;
	display: block;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .description h4{
	opacity: 0.8;
	font-size: 0.8em;
	margin: 0;
	font-weight: 500;
	color: inherit;
	white-space: nowrap;
	cursor: pointer;
}
.body-container .buy-page .course-description .course.card .courseStatsCont .stat .description p{
	font-size: 0.85em;
	line-height: 1.66em;
	margin: 0;
	color: var(--fontDarkColorLighter77);
	display: none;
}

.body-container .buy-page .pay-description{
	grid-column-start: 5;
	grid-column-end: 7;
	grid-row-start: 2;
	grid-row-end: 2;
	position: sticky;
	top: 96px;
	background-color: var(--greyColorTransparent);
	border-radius: 28px;
	padding: 16px;
	margin: 16px 0;
}
.body-container .buy-page .pay-description .pay-description-card{
	background-color: #FFF;
	border-radius: 24px;
	width: 100%;
	height: auto;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 4%);
	padding: 24px;
	box-sizing: border-box;
	border-width: 1px;
	border-style: solid;
	border-color: var(--defaultLighterBorderColor);
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-ms-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: var(--defaultLighterBorderColor);
	padding: 24px 0;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group:first-child{
	padding: 0 0 16px 0;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group h5{
	margin-block-start: 0;
	margin-block-end: 0.5em;
	position: relative;
	z-index: 2;
	color: var(--fontDarkColorLighter);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group h3{
	margin-block-start: 0;
	margin-block-end: 0.33em;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group h2{
	margin-block-start: 0;
	margin-block-end: 0.22em;
	color: var(--fontDarkColor);
	position: relative;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.courses-price h2 sup{
	color: var(--fontDarkColor);
	line-height: 0.1em;
	font-size: 0.65em;
	text-decoration: line-through;
	color: var(--fontDarkColor);
	line-height: 0.5em;
	font-size: 0.6em;
	text-decoration: line-through;
	position: absolute;
	padding: 0 6px;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.courses-price.discounted h2{
	color: var(--primaryDarker);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.discount p.suggestion{
	color:var(--fontDarkColor);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.discount h2{
	color: var(--primaryDarker);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.discount h2 sup{
	line-height: 0.1em;
	font-size: 0.7em;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group .details-container .cont{
	position: relative;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon button,
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon a{
	background-color: transparent;
	appearance: none;
	text-decoration: none;
	-webkit-appearance: none;
	border: none;
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 12px 10px;
	fill: #fff;
	color: var(--fontDarkColorLighter);
	font-size: 0.95em;
	border-radius: 24px;
	border-width: 3px;
	border-style: solid;
	border-color: var(--defaultLighterBorderColor);
	position: relative;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 0);
	margin-block-end: 0;
	box-sizing: border-box;
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon button label,
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon a label{

	margin: 0 ;
	color: inherit;
	font-weight: 600;
	font-size: inherit;
	text-align: center;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon button:hover,
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon a:hover{
	color: var(--fontDarkColor);
	border-color: var(--defaultBorderColor);
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont{
	display: grid;
	grid-auto-flow: row;
  grid-template-columns: 1fr;

}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .btn-cont{
	padding: 0;
	box-sizing: border-box;
	border-top-width: 0;
	border-top-style: solid;
	border-top-color: var(--defaultLighterBorderColor);
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;

}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .btn-cont.get-discount{
	margin-top: 16px;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .input-cont{
	padding: 0 24px;
	margin: 0;
	flex-grow: 0;
	width: 75%;
	box-sizing: border-box;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon.show-coupon-form #show-coupon-input-btn-cont{
	width: 75%;
	padding: 16px 24px 16px;
	margin: 0 auto 0;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: var(--defaultLighterBorderColor);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon.show-coupon-form #show-coupon-input-btn-cont button{
	background-color: var(--primary);
	fill: #fff;
  color: #fff;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon.show-coupon-form .btn-cont.get-discount{
	display: none;
}

.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon.show-coupon-form .coupon-container{
	display: flex;
	height: auto;
	overflow: visible;
}

.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .coupon-container-input-buttons .btn-cont button{
	background-color: var(--primary);
	color: #fff;
	padding: 12px 16px;
	height: 48px;
}
@keyframes success-coupon-code-animation {
  0% {
    border-color: var(--defaultLighterBorderColor);
  }
	33% {
		border-color: var(--primary);
		color:var(--primary);
	}
	66% {
		border-color: var(--primary);
		color:var(--primary);
	}
  100% {
    border-color: var(--primary);
		color:var(--fontDarkColor);
  }
}
@keyframes error-coupon-code-animation {
  0% {
    border-color: var(--defaultLighterBorderColor);
		color:var(--fontDarkColor);
  }
	25% {
		border-color: var(--errorColor);
		color:var(--errorColorDarkest);
	}
	50% {
		border-color: var(--defaultLighterBorderColor);
		color:var(--fontDarkColor);
	}

  100% {
    border-color: var(--errorColor);
		color:var(--errorColorDarkest);
  }
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .coupon-container-input-buttons.success .input-cont input{
	animation: success-coupon-code-animation 800ms cubic-bezier(0.65, 0.05, 0.36, 1) 0ms 1 normal forwards;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .coupon-container-input-buttons.error .input-cont input{
	animation: error-coupon-code-animation 800ms cubic-bezier(0.65, 0.05, 0.36, 1) 0ms 1 normal forwards;
}

.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container{
	flex-direction: column;
	flex-wrap: nowrap;
	margin: 0 0 0 0;
	justify-content: space-around;
	align-items: center;
	display: none;
	height: 0;
  overflow: hidden;
	position: relative;
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container .close-btn-cont{
	position: absolute;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	right: 0;
	top: 0;
	flex-shrink: 0;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container .close-btn-cont button{
	width: unset;
  height: unset;
	border: none;
	appearance: none;
	background-color: transparent;
	fill: var(--fontDarkColorLightest);
	border-width: 2px;
	border-style: solid;
	border-color: transparent;
	border-radius: 50%;
	padding: 2px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	outline: none;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 0);
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container .close-btn-cont button:hover {
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
	background-color: #fff;
	border-color: var(--defaultLighterBorderColor);
	fill: var(--fontDarkColorLighter);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container .close-btn-cont button svg{
	width: 24px;
	height: 24px;
	fill: inherit;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container>div{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	width: 100%;
	justify-content: center;
	flex-grow: 0;
	box-sizing: border-box;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container>div h2{
	color: var(--primary);
	font-size: 1.7em;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container>div h4{
	color: var(--fontDarkColorLighter);
	margin-block-start: 0;
	margin-block-end: 0.96em;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container>div h5{
	color: var(--fontDarkColorLighter);
	margin-block-start: 0;
	margin-block-end: 0.96em;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container .coupon-container-try-response{
	color: var(--fontDarkColorLighter);
	display: block;
	text-align: center;
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container .coupon-container-try-response.error{
	color:var(--errorColorDarker);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container .coupon-container-try-response.success{
	color:var(--primary);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container .coupon-container-try-response h5{
	margin: 8px 0;
	color: inherit;
	min-height: 16px;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .coupon-container .coupon-container-input-buttons .btn-cont:nth-child(2){
	margin-top: 0;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .input-cont label{
	text-align: center;
	margin-block-start: 0.66em;
	margin-block-end: 0.66em;
	color: inherit;
	font-weight: 500;
	font-size: 0.9em;
	line-height: 1.4em;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .input-cont input{
	background-color: transparent;
	appearance: none;
	text-decoration: none;
	-webkit-appearance: none;
	border: none;
	height: 48px;
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 12px 16px;
	font-weight: 600;
	fill: #fff;
	color: var(--fontDarkColor);
	font-size: 1.35em;
	border-radius: 24px;
	border-width: 3px;
	border-style: solid;
	border-color: var(--defaultLighterBorderColor);
	position: relative;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 0);
	margin-block-end: 0;
	box-sizing: border-box;
	-webkit-transition: all 250ms ease-in-out;
	-moz-transition: all 250ms ease-in-out;
	-ms-transition: all 250ms ease-in-out;
	-o-transition: all 250ms ease-in-out;
	transition: all 250ms ease-in-out;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .input-cont input:focus{
	outline: none;
	color: var(--fontDarkColor);
	border-color: var(--defaultBorderColor);
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 12%);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.coupon .details-container .cont .input-cont input::placeholder{
	font-size: 0.75em;
	color: var(--fontDarkColorLighter);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.price h1{
	font-size: 2.1em;
	margin-block-end: 0.1em;
  margin-block-start: 0;
	line-height: 1em;
	color: var(--primary);
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group.price h1 sup{
	color: var(--fontDarkColorLighter77);
	line-height: 0.4em;
	position: absolute;
	padding: 0 8px;
	font-size: 0.5em;
	text-decoration: line-through;
}
.body-container .buy-page .pay-description .pay-description-card .details-container-group p{
	margin-block-start: 0;
	margin-block-end: 0;
	color: inherit;
	font-weight: 500;
	font-size: 0.9em;
	line-height: 1.4em;
}
.body-container .buy-page .pay-description .method-container{
	position: relative;
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	box-sizing: border-box;
	padding: 16px 0 8px 0;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeout {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.snackbar-container{
	width: 100vw;
	height: auto;
	position: fixed;
	bottom: 0;
}
.snackbar-container .snackbar-absolute{
	position: absolute;
	width: auto;
	left: 50%;
	right: 50%;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	opacity: 0;
	top: 0;
}
.snackbar-container .snackbar-absolute.show{
	animation: show-snackbar 350ms cubic-bezier(0.65, 0.05, 0.36, 1) 0ms 1 normal forwards;
}
.snackbar-container .snackbar-absolute.show.hide{
	animation: fadeout 250ms cubic-bezier(0.65, 0.05, 0.36, 1) 0ms 1 normal forwards;
}
.snackbar-container .snackbar-absolute .text-container{
	position: relative;
	padding: 10px 24px;
	box-sizing: border-box;
	border-radius: 24px;
	border-width: 3px;
	border-style: solid;
	border-color: rgb(94 94 94);
	background-color: rgb(64 64 64);
	color: #fff;
	max-width: 100vw;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 24%);
	top: 0;
	transform: translate(0, 0);
}
.snackbar-container .snackbar-absolute.hide{

}
.snackbar-container .snackbar-absolute .text-container p{
	margin-block-start: 0;
	margin-block-end: 0;
	text-align: center;
	font-size: 0.9em;
	white-space: pre;
}
@keyframes hide-snackbar {
  0% {
		transform: translate(0, calc(-100% - 24px));
    opacity: 1;
  }
	30%{
		transform: translate(0, calc(-100% - 24px));
		opacity: 0.4;
	}
  100% {
		transform: translate(0, 0);
    opacity: 0;
  }
}
@keyframes show-snackbar {
  0% {
		transform: translate(0, 0);
    opacity: 0;
  }
	70%{
		transform: translate(0, calc(-100% - 24px));
		opacity: 0.4;
	}
  100% {
		transform: translate(0, calc(-100% - 24px));
    opacity: 1;
  }
}
.checkout-errorexplorer{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: var(--defaultLighterBorderColor);
	padding: 24px 0;
	margin: 0 0 16px;
	display: none;
}
.checkout-errorexplorer.show{
	display: block;
}
.checkout-errorexplorer h5{
	color: var(--errorColor);
	margin-block-start: 0;
	margin-block-end: 0.5em;
	text-align: center;
}
.checkout-errorexplorer h4{
	margin-block-start: 0.33em;
	margin-block-end: 0;
	color: var(--fontDarkColor);
	text-align: center;
}
.checkout-errorexplorer #checkoutErrorDescription{
	padding: 0 0;
	margin: 16px auto 0;
}
.checkout-errorexplorer #checkoutErrorDescription p{
	margin-block-start: 0;
	margin-block-end: 0;
	color: var(--fontDarkColor);
	font-size: 0.9em;
	line-height: 1.5em;
	text-align: center;
}
.checkout-errorexplorer #checkoutErrorDescription ul{
	padding: 0 0 0 24px;
	margin: 16px 0 0 0;
}
.checkout-errorexplorer #checkoutErrorDescription ul li{
	color: var(--fontDarkColor);
	font-size: 0.9em;
	line-height: 1.5em;
}
.checkout-errorexplorer .devider-row{
	width: 75%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: var(--defaultLighterBorderColor);
	height: 15px;
	margin: 0 auto;
}
@media only screen and (min-width: 813px) {
	#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content::-webkit-scrollbar{
    width: 6px;
    height: 6px;
  }
  #secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 4px;
    -webkit-transition: all 250ms ease-in-out;
    -moz-transition: all 250ms ease-in-out;
    -ms-transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    transition: all 250ms ease-in-out;
  }
  #secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content::-webkit-scrollbar-track {
    background-color: #fff;
  }
  #secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content:hover::-webkit-scrollbar-track{
    background-color: #fff;
  }
  #secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content:hover::-webkit-scrollbar-thumb{
    background-color: #c5c5c5;
  }
  #secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-content::-webkit-scrollbar-thumb{
    background-color: #c5c5c5;
  }
}
@media only screen and (max-width: 812px) {
	.header{
		width: 100%;
		padding: 0;
	}
	.headerContent{
		padding: 0 24px;
	}
	.body-container{
		max-width: 100%;
		padding: 0;
	}
	.logoContainer{
		display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 0;
    position: absolute;
    right: 50%;
    left: 50%;
	}
	.logo-and-back{
		width: fit-content;
	}
	.headerContent .btn-container.secure-checkout{
		width: 100%;
	}
	#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar button label,
	#secure-checkout-button-container.visible .cart-preview-header .cart-preview-header-toolbar a label{
		display: block;
	}
	.headerContent .btn-container button,
	.headerContent .btn-container a{
		padding: 8px 8px;
	}
	.headerContent .btn-container button label,
	.headerContent .btn-container a label{
		display: none;
	}
	.body-container .buy-page .course-description{
		grid-column-start: 1;
    grid-column-end: 7;
		grid-row-start: 1;
    grid-row-end: 2;
		margin: 16px 24px 32px 24px;
	}
	.body-container .buy-page .pay-description{
		grid-column-start: 1;
    grid-column-end: 7;
		grid-row-start: 3;
    grid-row-end: 3;
		margin: 0 8px 16px 8px;
	}
	.body-container .buy-page .course-description .course.card .courseStatsCont{
		width: 100%;
	}
	.body-container .buy-page .course-description .course.card .artwork-cont{
		width: 75%;
    height: 160px;
    position: relative;
    margin: 12px auto 16px auto;
    right: 0;
	}
	.body-container .buy-page .course-description .course.card .artwork-cont-bg{
		width: 85%;
		top: 24px;
	}
	.body-container .buy-page .course-description .course.card .description-cont{
		width: 100%;
	}
	.body-container .buy-page.many-courses .course-description .course.card{
		grid-template-columns: 96px 1fr 50px 32px;
	}
	.body-container .buy-page.many-courses .course-description .course.card .artwork-cont{
		display: none;
	}
	.body-container .buy-page.many-courses .course-description .course.card .tittle-cont{
		grid-column-start:1;
		grid-column-end:3;
	}
	.body-container .buy-page.many-courses .course-description .course.card .description-cont{
		grid-column-start: 1;
    grid-column-end: 3;
	}
	.body-container .buy-page.many-courses .course-description .course.card .description-cont .description{
		-webkit-line-clamp: 4;
	}
	.body-container .buy-page .course-description .course.card .course-content-description{
		width: 100%;
	}
}