:root {
  --bg: #ffffff;
  --text: #000000;
  --card: #F5F5F7;
  --elevate: #ECECEE;
}

body.dark {
  --bg: #000000;
  --text: #ffffff;
  --card: #1f1f1f;
  --elevate: #ECECEE;
} 



/* Box sizing rules */
*,
*::before,
*::after,
*:focus {
  box-sizing: border-box;
  outline: none; 
}



* {
  -webkit-tap-highlight-color: transparent;
}

/* Prevent font size inflation */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Remove default margin in favour of better control in authored CSS */
body, h1, h2, h3, h4, p,
figure, blockquote, dl, dd {
  margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
  list-style: none;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  line-height: 1.5;
}

/* Set shorter line heights on headings and interactive elements */
h1, h2, h3, h4,
button, input, label {
  line-height: 1.1;
}

/* Balance text wrapping on headings */
h1, h2,
h3, h4 {
  text-wrap: balance;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
  color: currentColor;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
}

/* Inherit fonts for inputs and buttons */
input, button,
textarea, select {
  font: inherit;
}

/* Make sure textarea without a rows attribute are not tiny */
textarea:not([rows]) {
  min-height: 10em;
}

/* Anything that has been anchored to should have extra scroll margin */
:target {
  scroll-margin-block: 5ex;
}

a, a:hover {
	text-decoration:none
}

.relative {
	position:relative;
}

a.underline {
	position:relative;
}

a.underline:after {
    position: absolute;
    bottom: -2px;
    left: 0px;
    right: 0px;
    height: 1px;
    content: '';
    display: inline-block;
    background: rgba(255, 255, 255, 0.2);
    moz-transition: all ease .3s;
    o-transition: all ease .3s;
    transition: all ease .3s;
    webkit-transition: all ease .3s;
    transition-delay: 0ms;
}

a.underline:hover:after {
	background: rgba(0,0,0, 0.4);
}

.pointer {
	cursor:pointer;
}





html, body
{
	color: var(--text);
	background:var(--bg);
	font-family: "Inter Tight", sans-serif;
	font-weight:400;
	font-size: 15px;
	height: 100%;
	margin: 0px;
	padding: 0px;
}

svg {
    display: block;
}



.anim, .h1, .herohover, .small span, div:after, div:before, .photo,  .nav, .nav ul, .nav li div, .nav li div span, .highlights-title-off, .highlights-title-on, .component:after, .component b, .frame:after, .frame:before, .frame b, .dot, .dot:after, .logo, .route, .legend, .row-1-load, .row-2-load, .row-3-load, .opacity-load {
	moz-transition: all ease .3s;
	o-transition: all ease .3s;
	transition: all ease .3s;
	webkit-transition: all ease .3s;
	transition-delay: 0ms;
}


.container {
	width:1220px;
	margin:0px auto;
}






/* Sale */

	.strape-over {
		padding:10px;
		vertical-align:middle;
	}

	.strape-sale {
		display:block;
		padding:20px;
		background:#8FE496;
		text-align:center;
		-webkit-border-radius: 80px;
		  -moz-border-radius: 80px;
	      border-radius: 80px;
	} 

	.strape-sale:hover .strape-text {
		gap: 16px;
	}

	.strape-text  {
		display:inline-block;
		font-size:16px;
		font-weight:550;
		line-height:16px;

		display: inline-flex;
	    align-items: center;
	    gap: 8px;
	}
/* /Sale */


.sc {
		display: inline-flex;
	    align-items: center;
	    gap: 12px;
	    font-weight:550;
		color:#8E8E93;
		font-size:24px;
}



/* Hero */

	.ia {
		margin-top:72px;
		display:table;
		width:100%;
	}

	.ia-left {
		display:table-cell;
		vertical-align:top;
		width:50%;
		position:relative;
	}
	.ia-right {
		position:relative;
		display:table-cell;
		vertical-align:top;
		width:50%;
	}

	.ia-video {
		position: relative;
		margin: 0 auto;
		overflow: hidden;
		width:600px;
		height:720px;
		background:#F5F5F7;
		 -webkit-border-radius: 48px;
		  -moz-border-radius: 48px;
	      border-radius: 48px;
	}

	.ia-in {
		margin: 0 auto;
		position:absolute;
		top:0px;
		left:300px;
		margin-left:-640px;
		width:1280px;
		height:720px;
	}

	.ia-title {
		margin-top:56px;
	}

	.ia-title h1 {
		font-size:80px;
		line-height:80px;
		letter-spacing:-1.8px;
		font-weight:800;
	}

	.ia-sub {
		font-size:24px;
		line-height:32px;
		font-weight:600;
		margin-top:32px;
		margin-bottom:16px;
	}


	.header {
		display:table;
		width:100%;
		margin-top:32px;
	}
	.header ul, .header li {
		margin:0;
		padding:0;
		display:inline-block;
		list-style-type:none;
	}



	.logo div {
		width:40px;
		height:40px;
		background:url('../img/logo.svg') no-repeat;
	}

	.header ul {
		display:block;
	}

	.header li {
		margin-right:32px;
		padding-top:0px;
		vertical-align:top;
		padding-top:11px;
	}

	li.logo {
		padding-top:0px;
	}

	li.li-right {
		float:right;
		margin-right:0px;
	}

	.header li a {
		font-size:16px;
		line-height:22px;
		font-weight:550;
		color:#000;
	}

	.header li a:hover {
		color:#383B42;
	}


	.author-snippet {
		position:absolute;
		bottom:56px;
		left:0px;
		display:table;
		background:var(--card);
		-webkit-border-radius: 80px;
		  -moz-border-radius: 80px;
	      border-radius: 80px;
	}



	.author-snippet:hover {
		background:var(--elevate);
	}

	.author-snippet-left {
		display:table-cell;
		vertical-align:top;
		padding:12px;
		padding-right:16px;
	}

	.author-snippet-left img {
		width:82px;
		vertical-align:bottom;
	}

	.author-snippet-right {
		display:table-cell;
		vertical-align:middle;
		padding-right: 72px;
	}

	.author-snippet-right div {
		width:250px;
		font-size:16px;
		line-height:22px;
		font-weight:500;

	}

	.link {
    position: relative;
    overflow: hidden;
    display: inline-block;

	}

	.link span,
	.link::after {
	    display: block;
	    transition: transform .2s ease;
	}

	.link::after {
	    content: attr(data-text);
	    position: absolute;
	    left: 0;
	    top: 100%;
	}

	.link:hover span {
	    transform: translateY(-100%);
	}

	.link:hover::after {
	    transform: translateY(-100%);
	}


/* Stickers */

.sticker-sale {
	position:absolute;
	z-index:1;
	top:294px;
	left:-86px;
	width:180px;
	height:180px;
}

.sticker-sale .rotating {
	position:absolute;
	top:0;
	left:0;
}

.sticker-sale-text {
	position:absolute;
	top:0;
	left:0;
}


.sticker-recommend {
	position:absolute;
	z-index:1;
	top:122px;
	right:-72px;
	width:128px;
	height:128px;
}

.sticker-chat {
	position:absolute;
	z-index:1;
	top:420px;
	right:-61px;
	width:156px;
	height:156px;
}


.sticker-students {
	position:absolute;
	z-index:2;
	top:550px;
	right:-72px;
	width:128px;
	height:128px;
}

/* /Hero */




	.sample-caption {
    	text-align:center;
		font-size:22px;
		line-height:32px;
		font-weight:550;
		margin-bottom:12px;
    }

    .sample-desc {
    	text-align:center;
		font-size:24px;
		line-height:32px;
		font-weight:550;
		margin-top:24px;
    }



    .sample-gap {
    	height:128px;
    }

    .sample-title-gap {
    	height:72px;
    }

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

    .sample-title h2 {
		font-size:48px;
		line-height:56px;
		font-weight:850;
		letter-spacing:-0.3px;
	}




	.rotating {
    animation: rotate 30s linear infinite;
	}

	@keyframes rotate {
	    from {
	        transform: rotate(0deg);
	    }
	    to {
	        transform: rotate(360deg);
	    }
	}



 
    .lesson {
      display: flex;
      gap: 40px;
      align-items: flex-start;
      margin: 0 auto;
      flex-wrap: wrap;
    }
    

    .lessonpreview {
      flex: 0 0 400px;
      height: 244px;
      background-color: #131313;
      position:relative;
      overflow:hidden;
      -webkit-border-radius: 12px;
	  -moz-border-radius: 12px;
      border-radius: 12px;
    }
   

    .lessoncontent {
      flex: 1;
      padding-top:24px;
      padding-right:6%;
    }


    .lesson-over {
    	background:#F5F5F7;
    	padding: 24px;
    	margin-bottom:20px;
      	box-sizing: border-box;
      	-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
		border-radius: 20px;
    }


    .video-fadeout {
      opacity: 0;
      transition: opacity 0.5s ease;
    }

    .play-indicator {
    	position:absolute;
    	width:64px;
    	height:64px;
    	left:0px;
    	bottom:0px;
    	background:url('../img/play-indicator.svg');
    	pointer-events:none;
    }

    .lpreview {
   	  position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      display: block;
    }

    .lpreview video {
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      z-index:1;
    }

    .ltime {
    	font-size:14px;
    	line-height:18px;
    	color:#86868B;
    	font-weight:500;
    	margin-bottom:12px;
    }

    .ltitle {
    	font-size:22px;
    	line-height:32px;
    	font-weight:550;
    	margin-bottom:12px;
    }

   
    .ldesc {
    	font-size:17px;
    	line-height:24px;
    	font-weight:450;
    	letter-spacing:-0px;
    	color:#86868B;
    }

    .ldesc p {
    	margin-bottom:8px;
    }


.b-lessons-pdf {
	text-align:center;
	display:block;
	padding:24px;
	margin-top:20px;
	line-height:24px;
	font-size:14px;
	color:#000;
	background:#F5F5F7;
	border-radius: 20px;
}

.b-lessons-pdf:hover {
	background:#EEEEF0;
}





#videoOverlay {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.9);
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

#videoContainer {
  position: relative;
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: auto;
  text-align:center;
}

#fullscreenVideo {
  width: 100%;
  max-width:1220px;
  height: auto;
  display: inline-block;
}



#fullheightVideo {
	width:100%;
 	max-width: 800px;
    height: auto;
    display: inline-block;
}


#closeVideoBtn {
	z-index:9;
  position: absolute;
  top: 24px;
  right: 24px;
  width:48px;
  height:48px;
  background: url('../img/close.svg') center no-repeat rgba(0,0,0,0.4) ;
  border: none;
  font-size: 18px;
  line-height:48px;
  text-align:center;
  color: white;
  cursor: pointer;
    -webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
}



.priceblock {
	display:table;
	width:100%;
	background:#F7F7F9;
    box-sizing: border-box;
    -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	overflow:hidden;

}

.pricepreview {
	display:table-cell;
	position:relative;
	width:50%;
	vertical-align:top;
	overflow:hidden;
}

.ptrailer {
	position:absolute;
	bottom:0px;
	left:50%;
	width: 1200px;
	margin-left:-600px;	
}

.pricecontent {
	display:table-cell;
}


.pricecontentin {
	padding: 48px;
	cursor:default;
}


/* Logos */


.logos {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 16px;
}

.logo-card {
    background: #F5F5F7;
    border-radius: 24px;
    min-height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* /Logos */



/* Reviews */

.reviews {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    width:1220px;
	margin:0px auto;
}

.reviews-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.review-card {
    background: #F5F5F7;
    border-radius: 24px;
    min-height: 50px;
    padding:24px;
}

.review-summary {
	font-weight:500;
	line-height:22px;
	font-size:16px;
}

.review-card p {
	font-weight:400;
	margin-top:16px;
	font-size:14px;
	line-height:21px;
}


.review-stars {height:13px;margin-top:8px;}

.review-stars s {
	display:inline-block;
	float:left;
	background:url('../img/star-fill.svg') 0 0 no-repeat;
	width:13px;
	height:13px;
	margin-right:2px;
}

.review-stars i {
	display:inline-block;
	float:left;
	background:url('../img/star-empty.svg') 0 0 no-repeat;
	width:13px;
	height:13px;
	margin-right:2px;
}

.review-card .portfolio-bento {
	margin-top:16px;
}

.winanimation, .uianimation {
    width: 72px;
    height: 72px;
    margin:0 auto;
}

.review-full {
    display: none;
}

.review-show-all {
	cursor:pointer;
	opacity:0.5;
}

.review-show-all:hover {
	opacity:0.8;
}

.review-top {
	padding:24px;
	padding-top:0px;
}


/* /Reviews */



/* Table */


.compare-table-over {
	margin-top:56px;
}

.compare-table {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.5fr)
        repeat(5, minmax(180px, 1fr));

    width:1220px;
    margin:0 auto;
}

.cell {
    padding: 12px 0px;
    border-bottom: 1px solid #D9D9D9;
}

.head {
    font-weight: 700;
}

.row-title {
    font-weight: 500;
    padding-right:8px;
}

.comment {
    line-height: 22px;
    padding-right:8px;
}

.value {
    text-align: left;
    font-size: 16px;
    position:relative;
}

.yes {
    color: #17C964;
}

.no {
    color: #F87171;
}

.warning {
    color: #FFB020;
}

.compare-table i.check {
	display:inline-block;
	width:24px;
	height:24px;
	background:url('../img/table-check.svg') 0 0 no-repeat;
}

.compare-table i.none {
	display:inline-block;
	width:24px;
	height:24px;
	background:url('../img/table-none.svg') 0 0 no-repeat;
}

.compare-table i.alert {
	display:inline-block;
	width:24px;
	height:24px;
	background:url('../img/table-alert.svg') 0 0 no-repeat;
}


.compare-table i {
	position:relative;
}

.tooltip {
	font-style:normal;
	position: absolute;
	left: 50%;
	bottom: 32px;
	transform: translateX(-50%) translateY(12px);

	width: 300px;
	padding: 24px;

	background: rgba(0,0,0,0.6);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);

	color: #fff;
	font-size: 14px;
	line-height: 20px;
	border-radius: 20px;

	opacity: 0;
	visibility: hidden;
	pointer-events: none;

	transition:
		opacity .25s ease,
		transform .25s ease,
		visibility .25s ease;
}

.compare-table i:hover .tooltip {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
	pointer-events: auto;
}


.tooltip p {
	margin-bottom:12px;
}


.tooltip p:last-child {
    margin-bottom: 0;
}
/* /Table */


.ps-block {
	padding:32px;
	padding-bottom:24px;
	-webkit-border-radius: 24px;
	-moz-border-radius: 24px;
	border-radius: 24px;
	position:relative;
	margin-bottom:16px;
}



.ps-old {
	display:table;
}
.ps-big {
	margin-top:8px;
	display:table;
}
.ps-b-left {
	display:table-cell;
	vertical-align:top;
}
.ps-b-right {
	display:table-cell;
	vertical-align:top;
}

.ps-old .ps-b-left div {
	font-size:22px;
	line-height:28px;
	font-weight:400;
	color:#909095;
	text-decoration:line-through;
}

.ps-old .ps-b-right div {
	padding-left:8px;
	font-size:22px;
	line-height:28px;
	font-weight:400;
	color:#909095;
}

.ps-big .ps-b-left div {
	font-size:40px;
	line-height:48px;
	font-weight:550;
}

.ps-big .ps-b-right div  {
	padding-left:10px;
	padding-top:4px;
	font-size:24px;
	line-height:29px;
	font-weight:550;
}

.ps-divider {
	display:block;
	background:#E8E8E9;
	height:1px;
}

.ps-desc {
	margin-top:8px;
	margin-bottom:12px;
	font-size:16px;
	line-height:28px;
}

.ps-sum {
	margin-top:20px;
	font-size:16px;
	line-height:28px;
	color:#909095;
}


.ps-sale {
	position:absolute;
	right:32px;
	top:32px;
	font-size:16px;
	font-weight:550;
	line-height:28px;
	background:#A4FAA6;
	padding:8px 12px;
	-webkit-border-radius: 24px;
	-moz-border-radius: 24px;
	border-radius: 24px;
}

.summer-banner-pad {
	padding:8px;
	padding-bottom:0px;
}

.summer-banner {
	display:block;
	padding:24px;
	font-size:18px;
	font-weight:500;
	text-align:center;
	color:#1D1D1F;
	background:#A4FAA6;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

.summer-sale-fixed {
	transform: translateY(-50px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	cursor:pointer;
	z-index:999;
	text-align:center;
	position:fixed;
	top:0px;
	left:0px;
	right:0px;
	padding:12px;
	font-size:18px;
	font-weight:500;
	color:#1D1D1F;
	background:#A4FAA6;
}


.summer-sale-fixed.scrolled {
	transform: translateY(0px);
}

.ps-button {
	display:inline-block;
	line-height:48px;
	font-size:16px;
	font-weight: 500;
	background:#007AFF;
	color:#fff;
	-webkit-border-radius: 29px;
	-moz-border-radius: 29px;
	border-radius: 29px;
	padding:0px 24px;
	cursor:pointer;
	margin-bottom:20px;
}

.ps-button:hover {
	background:#1B88FF;
}


.ps-button2 {
	display:inline-block;
	line-height:48px;
	font-size:16px;
	font-weight: 500;
	background:none;
	border:2px solid #007AFF;
	color:#007AFF;
	-webkit-border-radius: 29px;
	-moz-border-radius: 29px;
	border-radius: 29px;
	padding:0px 24px;
	margin-left:8px;
	cursor:pointer;
}

.ps-button2:hover {
	border:2px solid #0055B2;
	color:#0055B2;
}




.psub {
	line-height:28px;
	font-size:22px;
	font-weight:500;
	margin-bottom:18px;
}

.ptitle {
	font-weight:650;
	line-height:48px;
	font-size:48px;
	margin-bottom:32px;
}


.pbig {
	line-height:48px;
	font-size:40px;
	font-weight:500;
	position:relative;
	display:inline-block;
}

.pold {
	color:#86868B;
	line-height:28px;
	font-size:22px;
	font-weight:400;
	margin-bottom:4px;
}

.pstrike {
	text-decoration:line-through;
}

.psmall {
	color:#86868B;
	line-height:20px;
	font-size:16px;
	margin-top:8px;
	font-weight:400;
}

.pdesc {
	margin-top:32px;
	line-height:28px;
	font-size:16px;	
}

.pdesc p {
	margin-bottom:4px;
	background:url('../img/checksmall.svg') 4px 8px no-repeat;
	padding-left:24px;
}

.pdesc span {
	font-weight:550;
}

.pdesc a {
	color:#007AFF;
}


.pdesc a:hover {
	color:#1B88FF;
}


.hbuysale a {
	background:#FFF;
	color:#000;

}

.hbuysale a span {
	font-weight:bold;
	color:#000;
}

.hbuysale a:hover {
	background:#efefef;

}

.hbuybadge {
	cursor:default;
	position:absolute;
	display:inline-block;
	background:#BAFB49;
	color:#000;
	top:-6px;
	right:-12px;
	font-weight:600;
	font-size:10px;
	padding:1px 3px;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
}


.plightgreen {
	color:#019A1C;
}

.psalebadge {
	display:inline-block;
	vertical-align:top;
	margin-top:10px;
	background:#8FE496;
	color:#000;
	font-weight:700;
	line-height:28px;
	font-size:14px;	
	padding:0px 8px;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
}

.psaleinfo {
	line-height:28px;
	font-size:18px;
	font-weight:500;
	color:#009A1C;
	margin-bottom:8px;
}


.psaleline {
	position:fixed;
	text-align:center;
	font-size:16px;
	line-height:28px;
	font-weight:500;
	color:#fff;
	background:#009A1C;
	background: linear-gradient(to right, #009A1C, #D3D129);
	margin-bottom:8px;
	top:48px;
	left:0px;
	right:0px;
	padding:12px 24px;
	cursor:default;
	z-index:99;
	-webkit-border-radius: 32px;
	-moz-border-radius: 32px;
	border-radius: 32px;
}

.pricecontentin .sticker-sale {
 top:20px;
 right:20px;
 left:auto;
 bottom:auto;
}


.bigbutton {
	display:inline-block;
	line-height:48px;
	font-size:16px;
	font-weight: 500;
	background:var(--text);
	color:var(--bg);
	-webkit-border-radius: 29px;
	-moz-border-radius: 29px;
	border-radius: 29px;
	padding:0px 24px;
	cursor:pointer;
	margin-top:24px;
}

.bigbutton:hover {
	background:#383B42;
	padding:0px 28px;
}




.container-faq {
	max-width:800px;
}





.form-content a {
    color: #007AFF;
    text-decoration: none;
}

.form-content a:hover {
    color: #007AFF;
    text-decoration: underline;
}

.form-content input[type="text"],.form-content input[type="tel"],.form-content input[type="email"] {
	width:100%;
	display:block;
	height:auto!important;
	min-height:auto!important;
	border:0 !important;
	padding:24px 24px  !important;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	color:#1D1D1F!important;
	margin-bottom:16px !important;
	font-size:18px;
	font-weight:500;
}

.form-content input[type="text"]:active, input[type="text"]:focus {
	border:0 !important;
}

.form-content input[type="text"]::placeholder,.form-content input[type="tel"]::placeholder,.form-content input[type="email"]::placeholder {
  color:#84919F!important;
  font-weight:400;
}

.form-content button {
	width:100%;
	border:0px;
	cursor:pointer;
	display:block;
	height:auto!important;
	min-height:auto!important;
	width:100% !important;
	background:#007AFF;
	color:#fff !important;
	-webkit-border-radius: 12px !important;
	-moz-border-radius: 12px !important;
	border-radius: 12px !important;
	padding:16px 0px !important;
	font-size:18px;
	font-weight:600;
}


.form-content button:hover {
	background:#1B88FF;
}






.form-content label input {
	display:none;
}

.form-content label {
	color:#84919F;
	margin-top:24px;
	margin-bottom:24px;
	cursor:pointer;
	position:relative;
	display:block;
	padding-left:32px;
	line-height:28px;
	font-size:18px;
	background:url('https://interfaceanimation.ru/img/checkbox-circle.svg') 0px 3px no-repeat;
}

.form-content label a, .form-content label a:hover {
	color:#84919F;
	text-decoration:underline;
}

.form-content label a:hover {
	color:#717178;
}



/*
.form-content label:has(> input[type="checkbox"]:checked)  {
	background:#007AFF url('https://interfaceanimation.ru/assets/checked.svg') left center no-repeat;
	color:#fff;
	padding-left:32px;
} */

.form-content label:has(> input[type="checkbox"]:checked) {
	display:block;
	padding-left:32px;
	background:url('https://interfaceanimation.ru/img/checkbox-circle-checked.svg') 0px 3px no-repeat;
}


.error {
	margin-bottom:16px !important;
	-webkit-border-radius: 12px !important;
	-moz-border-radius: 12px !important;
	border-radius: 12px !important;
	padding:16px !important;
}


.faq-title {
	text-align:center;
	padding-bottom:64px;
}

.faq-title h2 {
	font-size:59px;
	line-height:67px;
	font-weight:550;
}

.faq-search {
	width:100%;
	height:56px;
	font-weight:400;
	font-size:18px;
	padding:0px 20px;
	padding-left:48px;
	border:0;
	background:#F5F5F7 url('../img/search.svg') 16px 15px no-repeat;
	color:#000;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	margin-bottom:32px;
}

.faq-search:focus {
	background:#EEEEF0 url('../img/search.svg') 16px 15px no-repeat;
	border:0;
}

.faq-search::placeholder {
	color:#86868B;
}

.faq-results {
	min-height:400px;
}

.faq-item {
  border-bottom: 1px solid rgba(0,0,0,0.1);
  overflow: hidden;
}

.faq-item input {
  display: none;
}

.faq-item label {
  display: block;
  cursor: pointer;
  padding: 16px 0px;
  padding-right:48px;
  font-weight: 500;
  font-size:20px;
  line-height:28px;
  position:relative;
  color:#000;
}

.faq-item label:hover {
  /* */
}

.faq-item label:after {
	content:'';
	width:16px;
	height:16px;
	background:url('../img/chevron.svg') no-repeat;
	display:inline-block;
	position:absolute;
	top:50%;
	right:0px;
	margin-top:-8px;
	transition: transform 0.3s ease;
}

.faq-item .answer {
	padding-right:32px;
 	max-height:0px;
 	overflow:hidden;
 	line-height:0px;
 	font-size:18px;
 	line-height:28px;
 	font-weight:400;
	opacity: 0;
	color:#000;
}


.faq-item input:checked ~ .answer {
	max-height:500px;
	padding-bottom:32px;
	opacity: 1;
}

.faq-item input:checked ~ label {
  /* */
}

.faq-item input:checked ~ label:after {
  transform: rotate(180deg);
}

.faq-empty {
	text-align:center;
	padding:48px 0px;
}

.fe-title {
	font-weight:550;
  	font-size:20px;
  	line-height:28px;
  	margin-bottom:8px;
  	color:#000;
}

.fe-desc {
	font-weight:400;
  	font-size:18px;
 	line-height:28px;
 	color:#000;
}

.fe-desc a, .answer a {
	color:#007AFF;
}

.fe-desc a:hover, .answer a:hover {
	color:#007AFF;
}



.highlight {
  background-color: #E5F2FF;
}

#no-results {
	display:none;
}

footer {
		/**/
}

.footer {
	border-top:1px solid rgba(0,0,0,0.1);
	padding:32px 0px;
	color:#86868B;
}

.footer a {
	display:inline-block;
	color:rgba(0,0,0,1);
	font-size:14px;
	line-height:16px;
	margin-right:32px;
}


.footer a:hover {
	color:rgba(0,0,0,0.5);
}

.footer p {
	margin-top:16px;
	font-size:14px;
	line-height:16px;
	cursor:default;
}


.s-chat {
		z-index:9;
		position:fixed;
		right:24px;
		bottom:16px;
	}


	.s-chat-content {
		opacity: 0;
		transform: translateY(-30px);
		transition: opacity 0.3s ease, transform 0.3s ease;
		padding:8px;
		width:260px;
		background:#fff;
		box-shadow:0px 8px 32px rgba(0,0,0,0.16);
		position:absolute;
		bottom:64px;
		right:0px;
		-webkit-border-radius: 32px;
		-moz-border-radius: 32px;
		border-radius: 32px;
	}

	.s-chat-i {
		transform: scale(1);;
		transition: transform 0.3s ease;
		cursor:pointer;
		position:relative;
		right:0px;
		bottom:0px;
		display:inline-block;
		width:48px;
		height:48px;
		background:#1D1D1F;
		box-shadow:0px 4px 8px rgba(0,0,0,0.16);
		-webkit-border-radius: 24px;
		-moz-border-radius: 24px;
		border-radius: 24px;
	}

	.s-chat-i:active {
		transform: scale(0.9);
	}


	.s-chat-i.opened {
		background:url('../img/chat-close.svg') #1D1D1F;
	}
	.s-chat-i.closed {
		background:url('../img/chat.svg') #1D1D1F;
	}

	.s-c-tg img, .s-c-email img {
		width:32px;
		position:absolute;
		top:8px;
		left:8px;
		margin:0;
		vertical-align:top;
		display:inline-block;
	}

	.s-c-title {
		color:#000;
		font-weight:550;
		font-size:16px;
		line-height:24px;
		padding:8px;
	}

	.s-chat-content a {
		position:relative;
		display:block;
		text-align:left;
		color:#000;
		text-decoration:none;
		padding:10px;
		padding-left:52px;
		font-size:16px;
		line-height:28px;
		font-weight:400;
		-webkit-border-radius: 50px;
		-moz-border-radius: 50px;
		border-radius: 50px;
	}

	.s-chat-content a:hover {
		color:#000;
		text-decoration:none;
		background:#F5F5F7;
	}

	/* Р’РёРґРёРјР°СЏ РІРµСЂСЃРёСЏ */
	.s-chat-content.visible {
	  opacity: 1;
	  transform: translateY(0);
	}

	/* РЎРєСЂС‹С‚Р°СЏ РІРµСЂСЃРёСЏ */
	.hidden {
	  pointer-events: none;
	}




	.bento-2 {
		  display: flex;
		  gap: 20px;
		  max-width: 1220px;
		  margin: 0 auto;
	}

	.bento-gap {
    	height:20px;
    }

	.bento-gap-small {
    	height:8px;
    }

	.bento-block {
	  flex: 1;
	  background: #F5F5F7;  
	  padding: 48px;
	  border-radius: 20px;
	}

	.bento-add-big {
		height:520px;
	}

	.bento-add-small {
		height:329px;
	}

	.bento-author {
		color:#FFF;
		height:517px;
		position:relative;
		background-position:left;
		background-image: url('../img/author-cover.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/author-cover.png') 1x,
		    url('../img/author-cover@2x.png') 2x,
		    url('../img/author-cover@3x.png') 3x
		  );
	}

	

	.bento-author-big {
		height:522px;
	}

	.bento-author-small {
		min-width:600px;
		height:251px;
		overflow:hidden;
	}

	.b-a-author {
		font-size:22px;
		line-height:32px;
		font-weight:500;
		margin-bottom:20px;
	}

	.b-a-title {
		font-size:48px;
		line-height:56px;
		font-weight:600;
		max-width:600px;
	}


 	.b-a-desc {
 		font-size:22px;
		line-height:32px;
		font-weight:500;
 		max-width:450px;
 	}


 	.awwwards {
 		width:200px;
 		position:absolute;
 		top:48px;
 		right:48px;
 	}


 	.qr-telegram {
 		display:inline-block;
 		position:absolute;
 		top:48px;
 		bottom:48px;
 		right:48px;
 		z-index:3;
 	}

 	.qr-telegram img {
 		height:100%;
 	}





 	.bento-ae {
 		height:524px;
 		background-color: #00005B;
 		background-image: linear-gradient(180deg, #00005B, #262674);
 		color:#FFF;
 		position:relative;
 		overflow:hidden;
 	}



 	.bento-ae .b-text span {
 		color:#9999FF;
 	}

 	.bento-ae .circle-ae {
		position:absolute;
		bottom:-158px;
		left:50%;
		margin-left:-250px;
		width:500px;
		height:500px;
		background:url('../img/circle-ae.svg') center no-repeat;
		animation: rotate 30s linear infinite;
	}

	.bento-ae .ae-logo {
		position:absolute;
		left:50%;
		bottom:44px;
		width:95px;
		margin-left:-48px;

	}

	.bento-ae .circle-ae .ae-logo img {
		width:100%;
	}


	.c-company {
		position:absolute;
		width:72px;
		height:72px;
		background-size: cover;
		animation: rotate-reverse 30s linear infinite;
	}

	.c-c-1 {
		background-image: url('../img/companies/company-1.png');
        top:50px;
        left:214px;
	}

	.c-c-2 {
		background-image: url('../img/companies/company-2.png');
        top:98px;
        left:330px;
	}

	.c-c-3 {
		background-image: url('../img/companies/company-3.png');
        top:214px;
        left:378px;
	}

	.c-c-4 {
		background-image: url('../img/companies/company-4.png');
        top:330px;
        left:330px;
	}

	.c-c-5 {
		background-image: url('../img/companies/company-5.png');
        top:378px;
        left:214px;
	}

	.c-c-6 {
		background-image: url('../img/companies/company-6.png');
        top:330px;
        left:98px;
	}

	.c-c-7 {
		background-image: url('../img/companies/company-7.png');
        top:214px;
        left:50px;
	}

	.c-c-8 {
		background-image: url('../img/companies/company-8.png');
        top:98px;
        left:98px;
	}


		@keyframes rotate {
			  from {
			    transform: rotate(0deg);
			  }
			  to {
			    transform: rotate(360deg);
			  }
		}


		@keyframes rotate-reverse {
			  from {
			    transform: rotate(0deg);
			  }
			  to {
			    transform: rotate(-360deg);
			  }
		}


	



 	.bento-other {
 		height:524px;

 	}




 	.bento-portfolio {
 		width:600px;
 		position:relative;
 	}


 	.portfolio-bento {
		  display: flex;
		  gap: 8px;
		  margin: 0 auto;
	}

	.portfolio-bento div {
		width:100%;
		overflow:hidden;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
	}

	.prev {
		cursor:pointer;
	}



	.b-text {
		font-weight:500;
		font-size:22px;
		line-height:32px;
		padding-right:8%;
	}

	.b-text a {
		color:#000;
	}

	.b-text span, .b-text span a {
		color:#86868B;
	}

	.b-text span i {
		vertical-align:top;
		display:inline-block;
		width:36px;
		position:relative;
	}

	.b-text span i img {
		width:28px;
		position:absolute;
		left:4px;
		top:2px;
	}

	.b-text-bottom {
	 		position:absolute;
	 		left:48px;
	 		bottom:48px;
	 		right:48px;
	}

	




	.bento-ae-other {
		position:relative;
		overflow:hidden;
	}

	.ae-layers {
		position:absolute;
		left:50%;
		margin-left:78px;
		top:299px;
		width:326px;
		height:279px;
		background:url('../img/ae_layers.svg') no-repeat;
	}

	.ae-cursor {
		position:absolute;
		left:133px;
		top:13px;
		width:11px;
		height:266px;
		background:url('../img/ae_cursor.svg') no-repeat;
		animation: cursor 4s ease infinite;
	}

	.ae-mockups {
		position:absolute;
		left:50%;
		margin-left:-360px;
		top:270px;
		width:543px;
		height:314px;
		
	}

	.ae-mockups img {
		width:100%;
	}
	

	.ae-gesture {
		position:absolute;
		left:50%;
		margin-left:-100px;
		top:320px;
		width:133px;
		height:77px;
		background:url('../img/ae_gesture.svg') no-repeat;
		animation: gesture 4s ease infinite;
	}


	.bento-feedback {
 		background-color: #7A7CFF;
 		color:#FFF;
 		background-image: linear-gradient(180deg, #7A7CFF, #F4ABFF);
 		position:relative;
 		overflow:hidden;
 	}

 	.bento-feedback .b-text span, .bento-useful .b-text span {
 		color:rgba(255,255,255,0.6);
 	}


 	.bento-certificate {
 		background-color: #4031B4;
 		color:#FFF;
 		background-image: linear-gradient(180deg, #4031B4, #8C67FF);
 		position:relative;
 		overflow:hidden;
 	}

 	.bento-chat {
 		background-color: #73ACF3;
 		color:#FFF;
 		background-image: linear-gradient(180deg, #73ACF3, #94D9D8);
 		position:relative;
 		overflow:hidden;
 	}
	

	.bento-useful {
 		background-color: #F2939F;
 		color:#FFF;
 		background-image: linear-gradient(180deg, #F2939F, #E9D689);
 		position:relative;
 		overflow:hidden;
 	}


 	.b-chat {
		height:366px;
		width:402px;
		position:absolute;
		bottom:-4px;
		left:50%;
		margin-left:-201px;
		background-image: url('../img/b-chat.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-chat.png') 1x,
		    url('../img/b-chat@2x.png') 2x,
		    url('../img/b-chat@3x.png') 3x
		  );
	}

	.b-chat-messages {
		height:248px;
		width:365px;
		position:absolute;
		top:118px;
		left:18px;
		background-image: url('../img/b-chat-messages.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-chat-messages.png') 1x,
		    url('../img/b-chat-messages@2x.png') 2x,
		    url('../img/b-chat-messages@3x.png') 3x
		  );
	  	animation: scroll-chat 30s linear infinite;
	}

	@keyframes scroll-chat {
	  from {
	    background-position: 0 0;
	  }
	  to {
	    background-position: 0px -403px; /* СЃРґРІРёРіР°РµРј РІР»РµРІРѕ */
	  }
	}



 	.b-chats {
		height:214px;
		width:600px;
		position:absolute;
		bottom:0px;
		left:50%;
		margin-left:-300px;
		background-image: url('../img/b-chats.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-chats.png') 1x,
		    url('../img/b-chats@2x.png') 2x,
		    url('../img/b-chats@3x.png') 3x
		  );
	}


	.b-certificate {
		width:1042px;
		height:394px;
		position:absolute;
		bottom:0px;
		left:50%;
		margin-left:-521px;
		background-image: url('../img/b-certificate.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-certificate.png') 1x,
		    url('../img/b-certificate@2x.png') 2x,
		    url('../img/b-certificate@3x.png') 3x
		  );
	}




	.b-tutorials {
		width:100%;
		height:337px;
		position:absolute;
		bottom:0px;
		left:0;
		right:0;
		background-image: url('../img/b-tutorials.png');
		background-repeat: repeat;
		background-image: image-set(
		    url('../img/b-tutorials.png') 1x,
		    url('../img/b-tutorials@2x.png') 2x
		  );
		animation: scroll-tutorials 60s linear infinite;
	}


	@keyframes scroll-tutorials {
		  from {
		    background-position: 0 0;
		  }
		  to {
		    background-position: -1465px 0px; /* СЃРґРІРёРіР°РµРј РІР»РµРІРѕ */
		  }
		}


.bento-new-portfolio {
		color:#FFF;
		background-image: url('../img/b-portfolio.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-portfolio.png') 1x,
		    url('../img/b-portfolio@2x.png') 2x,
		    url('../img/b-portfolio@3x.png') 3x
		  );
}

.b-folder {
		width:338px;
		height:180px;
		position:absolute;
		bottom:0px;
		left:50%;
		margin-left:-169px;
		background-image: url('../img/b-folder.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-folder.png') 1x,
		    url('../img/b-folder@2x.png') 2x,
		    url('../img/b-folder@3x.png') 3x
		  );
	}

	.b-p {
		position:absolute;
		top:-99px;
		left:0px;
		width:100%;
		height:150px;
		overflow:hidden;
	}

.b-p-1 {
		width:80px;
		height:80px;
		position:absolute;
		top:84px;
		left:74px;
		background-image: url('../img/b-p-1.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-p-1.png') 1x,
		    url('../img/b-p-1@2x.png') 2x,
		    url('../img/b-p-1@3x.png') 3x
		  );
		animation: bp1 2s ease infinite;
	}

.b-p-2 {
		width:80px;
		height:80px;
		position:absolute;
		top:104px;
		left:184px;
		background-image: url('../img/b-p-2.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-p-2.png') 1x,
		    url('../img/b-p-2@2x.png') 2x,
		    url('../img/b-p-2@3x.png') 3x
		  );
		animation: bp2 2s ease infinite;
	}


		@keyframes bp1 {
			  
			  0% {
			    transform: translateY(0px);
			  }
			  20% {
			    transform: translateY(-60px);
			  }

			  100% {
			    transform: translateX(0px);
			  }
			  
		}

		@keyframes bp2 {
			  
			  0% {
			    transform: translateY(0px);
			  }
			  20% {
			    transform: translateY(0px);
			  }

			  40% {
			    transform: translateY(-40px);
			  }

			  100% {
			    transform: translateX(0px);
			  }
			  
		}


.bento-apps {
		color:#FFF;
		background-image: url('../img/b-apps.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-apps.png') 1x,
		    url('../img/b-apps@2x.png') 2x,
		    url('../img/b-apps@3x.png') 3x
		  );
		overflow:hidden;
}


.b-doc {
		width:536px;
		height:137px;
		position:absolute;
		bottom:33px;
		left:50%;
		margin-left:-268px;
		background-image: url('../img/b-doc.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-doc.png') 1x,
		    url('../img/b-doc@2x.png') 2x,
		    url('../img/b-doc@3x.png') 3x
		  );
}


.b-app-ae {
		width:94px;
		height:94px;
		position:absolute;
		top:21px;
		left:265px;
		background-image: url('../img/b-app-ae.png');
		background-size: cover;
		background-repeat: no-repeat;
		background-image: image-set(
		    url('../img/b-app-ae.png') 1x,
		    url('../img/b-app-ae@2x.png') 2x,
		    url('../img/b-app-ae@3x.png') 3x
		  );
		animation: appload 1s ease infinite;
}




@keyframes appload {
			  0% {
			    transform: translateY(-33px);
			  }
			  40% {
			    transform: translateY(0px);
			  }
			  60% {
			    transform: translateY(0px);
			  }
			  100% {
			    transform: translateY(-33px);
			  }
			  
		}



	.bento-addition .bento-block {
		padding:32px;
		width:600px;
		position:relative;
	}



		@keyframes gesture {
			  0% {
			    transform: translateY(-30px) scale(1.5); opacity: 0.5; /* РљРѕРЅРµС‡РЅРѕРµ РїРѕР»РѕР¶РµРЅРёРµ (РїРѕР»РЅС‹Р№ РѕР±РѕСЂРѕС‚) */
			  }
			  50% {
			    transform: translateY(0px) scale(1); opacity: 1; /* РљРѕРЅРµС‡РЅРѕРµ РїРѕР»РѕР¶РµРЅРёРµ (РїРѕР»РЅС‹Р№ РѕР±РѕСЂРѕС‚) */
			  }
			  100% {
			    transform: translateY(-30px) scale(1.5); opacity: 0.5; /* РљРѕРЅРµС‡РЅРѕРµ РїРѕР»РѕР¶РµРЅРёРµ (РїРѕР»РЅС‹Р№ РѕР±РѕСЂРѕС‚) */
			  }  
		}

		@keyframes cursor {
			  
			  0% {
			    transform: translateX(0px);
			  }
			  50% {
			    transform: translateX(100px);
			  }

			  100% {
			    transform: translateX(0px);
			  }
			  
		}



 @media (max-width: 1440px) {




 


      .reason {
        flex: 1 1 calc(50% - 12px); /* 2 РєРѕР»РѕРЅРєРё */
      }
    }



    .mobile {
    	display:none;
    }


   	@media (max-width: 1240px) {
   		.container {
			width:100%;
			padding:0px 24px;
		}


		/* Hero */

		.ia {
			margin-top:0px;
			display:block;
			width:100%;
		}

		.ia-left {
			display:block;
			width:100%;
		}
		.ia-right {
			margin-top:48px;
			display:block;
			width:100%;
		}

		.ia-video {
			position: relative;
			width:100%;
			height:auto;
		}

		.ia-in {
			position:static;
			top:0px;
			left:0px;
			margin-left:-50%;
			width:200%;
			height:auto;
		}

		.ia-title h1 {
			font-size:48px;
			line-height:48px;
			letter-spacing:-1.8px;
			font-weight:800;
		}

		.ia-sub {
			font-size:18px;
			line-height:28px;
			font-weight:600;
			margin-top:24px;
			margin-bottom:0px;
		}

		.author-snippet {
			margin-top:32px;
			display:block;
			position:static;
		}

		/* Stickers */

		.sticker-sale {
			position:absolute;
			z-index:1;
			top:-32px;
			left:46px;
		}

		.sticker-recommend {
			position:absolute;
			z-index:1;
			top:-20px;
			right:-16px;
		}

		.sticker-chat {
			position:absolute;
			z-index:1;
			top:auto;
			bottom:80px;
			right:-20px;
		}


		.sticker-students {
			position:absolute;
			z-index:2;
			top:auto;
			bottom:-20px;
			right:-16px;
		}


		/* /Hero */

		/* Logos */

		
		 .logos {
	        grid-template-columns: repeat(4, 1fr);
	        gap: 8px;
	    }

	    .logo-card {
	        min-height: 72px;
	    }

	    /* /Logos */

	    /* Reviews */

		
		.reviews {
		    overflow-x: auto;
		    gap: 16px;
		    scroll-snap-type: x mandatory;
		    width:100%;
			margin:0px 0px;
			padding:0px 24px;
			scroll-padding-left: 24px;
		}

		.reviews-col {
		    display: contents; /* убираем влияние колонок */
		}

		.review-card {
		    flex: 0 0 320px; /* ширина карточки */
		    scroll-snap-align: start;
		}




	    /* /Reviews */


	    /* Table */


		.compare-table-over {
	    overflow-x: auto;
        gap: 16px;
        scroll-snap-type: x mandatory;
        width: 100%;
        margin: 0px 0px;
        padding: 0px 24px;
        scroll-padding-left: 24px;
        margin-top:40px;
     	}
     	   
	    .compare-table {
        overflow-x: auto;
        min-width: 1200px;
    	}

    	/* /Table */


	   	.author-content {
	    	position:static;
	    }

	    .author-title {
			display:block;
			font-size:32px;
			line-height:32px;
			margin-bottom:32px;
		}

		.author li {
			margin-bottom:24px;
		}

	    .author .hide {
	    	display:none;
	    }

	    .author .mobile {
	    	display:block;
	    }

	    .priceblock, .pricepreview, .pricecontent, .pricecontentin {
	    	display:block;
	    	width:auto;
	    }

	    .bento-2 {
		    flex-direction: column;
		 }

		 .bento-portfolio, .bento-addition .bento-block {
	 		width:auto;

	 	}


	 	.bento-author-small, .bento-author-big {
	 		height:auto;
	 		width:100%;
	 		min-width:100%;
	 		padding-bottom:24px;
	 	}
	

	 	.bento-ae, .bento-ae-other {
	 		padding-bottom:350px;
	 	}

	 	.hbuy {
			right:20px;
		}

		.review-portfolio {
			margin-top:24px;
			position:static;
		}

		.b-text-bottom {
	 		position:static;
	 		margin-top:24px;
	 		bottom:24px;
	 		left:24px;
	 		right:24px;
	 	}

	 	.bento-author-small {
	 		height:auto;
	 	}


   	}





    @media (max-width: 800px) {

    	.hide {display:none!important}
    	.mobile {display:block!important}




		#hero {
			padding:128px 20px;
			padding-bottom:48px;
			text-align:center;
		}


		#hero h1 {
					display:block;
					font-size:52px;
					line-height:52px;
		}


		#hero .subhero {
			display:block;
			font-size:18px;
			font-weight:500;
			line-height:24px;
			margin-top:24px;
		}





    	.hero {
			padding-top:24px;
			padding-bottom:32px;
		}

    	.hero h1{
			display:block;
			font-size:48px;
			line-height:48px;
			font-weight:600;
		}

		.subhero, .psub {
			display:block;
			font-size:18px;
			line-height:24px;
			margin-bottom:16px;
		}

		.ptitle {
			display:block;
			font-size:32px;
			line-height:32px;
		}

		.sample-gap {
	    	height:72px;
	    }

	    .sample-title-gap {
	    	height:32px;
	    }

	   .sample-title {
	    	text-align:center;
	    	padding:0px 24px;
	    }

	    .sample-desc {
	    	padding:0px 16px;
	    	margin-top:12px;
	    	font-size: 18px;
        	line-height: 24px;
	    }

	    .sample-title h2 {
			font-size:24px;
			line-height:30px;
		}

		.sample-caption {
			font-size:18px;
			line-height:18px;
			margin-bottom:12px;
			padding:0px 24px;
	    }


	    .bento-block {
	    	padding-top:32px;
	    	padding-left:32px;
	    	padding-right:32px;
	    }

		.b-text {
			font-size:18px;
			line-height:24px;
			padding-right:0;
		}

		.b-a-desc {
			font-size:18px;
			line-height:24px;
		}

	

	 	.bento-author-small, .bento-author-big {
	 		height:auto;
	 		width:100%;
	 		min-width:100%;
	 		padding-bottom:24px;
	 	}


	 	.b-a-author {
			font-size:18px;
			line-height:24px;
			margin-bottom:12px;
		}

		.b-a-title {
			font-size:24px;
			line-height:28px;
		}

	 	.b-a-desc {
			font-size:18px;
			line-height:24px;
		}



	 	.awwwards {
	 		width:120px;
	 		position:absolute;
	 		top:24px;
	 		right:24px;
 		}

 		.qr-telegram {
	 		top:24px;
	 		bottom:24px;
	 		right:24px;
	 		z-index:3;
	 	}

 		.b-text span i {
			width:28px;
			position:relative;
		}

		.b-text span i img {
			width:22px;
			position:absolute;
			left:4px;
			top:1px;
		}


		/* Logos */

		
		 .logos {
	        grid-template-columns: repeat(2, 1fr);
	        gap: 8px;
	    }

	    /* /Logos */


		




		.faq-search {
			margin-bottom:16px;
		}

		.faq-title {
			text-align:center;
			padding-bottom:24px;
		}

		.faq-title h2 {
			font-size:32px;
			line-height:40px;
			font-weight:550;
		}

		.program-title {
			padding-bottom:24px;
		}

		.program-title h2 {
			font-size:32px;
			line-height:40px;
			font-weight:550;
		}

		.soft-icon {
			margin-bottom:8px;
		}

		.soft-icon img {
			width:72px;
		}

		.soft-title {
			text-align:center;
			padding-bottom:32px;
		}

		.soft-title h2 {
			font-size:32px;
			line-height:40px;
			font-weight:550;
		}

    	.herovideo video {
    		width:200% !important;
    		margin-left:-50%;
    	}

    	.lessoncontent {
	      padding-right:0px;
	      padding-top:0px;
	    }

	    .lessonpreview {
		      flex: 0 0 100%;
		      height:auto;
		      background-color: #eaf3ff; 
		      position:relative;
		      overflow:hidden;
		}



		.pricecontentin {
				padding: 40px 40px;
		}

		.bento-author {
			height:auto;
				padding-bottom:300px;
				background-color: #87868B;
				background-image: url('../img/author-mobile.png');
				background-size:contain;
				background-repeat: no-repeat;
				background-image: image-set(
				    url('../img/author-mobile.png') 1x,
				    url('../img/author-mobile@2x.png') 2x,
				    url('../img/author-mobile@3x.png') 3x
				  );
				background-position:right bottom;
		}

		.bento-apps {
			height:280px;
		}
		.b-doc {
			transform: scale(0.6);
			bottom:-12px;
		}

		.bento-useful {
			height:330px;
		}

		.b-tutorials {
			margin-bottom:-168px;
		}

		.bento-chat {
			height:250px;
		}

		.b-chats {
			transform: scale(0.6);
			bottom:-44px;
		}

		.bento-new-portfolio {
			overflow:hidden;
			height:250px;
		}

		.b-folder {
			transform: scale(0.8);
			bottom:-30px;
		}

		.bento-ae-other {
			height:auto;
			padding-bottom:300px;
		}

		.ae-layers {
			margin-left:00px;
		}

		.ae-mockups {
			margin-left:-420px;
		}

		.bento-feedback {
			height:340px
		}

		.b-chat {
			transform: scale(0.6);
			bottom:-80px;
		}

		.bento-certificate {
			height:340px;
		}

		.b-certificate {
			transform: scale(0.6);
			bottom:-100px;
		}

    }
