main > .wrapper {
	font-family: "Open Sans", sans-serif;
	margin: 0 auto;
	padding: 110px 40px;
	position: relative;
	text-align: center;
	width: auto;

	@media screen and (min-width: 1024px) {
		max-width: 960px;
		padding: 112px 0;
	}

	@media screen and (min-width: 1088px) {
		padding: 138px 0 0 0;
	}

	@media screen and (min-width: 1216px) {
		max-width: 1152px;
	}

	@media screen and (min-width: 1270px) {
		max-width: 1206px;
	}

	h2 {
		font-size: 21px;
		font-weight: 300;
		text-align: center;

		@media screen and (min-width: 1024px) {
			font-size: 28px;
		}
	}

	.ql-editor {
		font-size: 15px;
		line-height: 1.5;

		ul {
			list-style-type: circle;
			padding-left: 20px;
		}

		button {
			margin: 0;
		}

		h1 {
			align-items: center;
			color: #363636;
			display: flex;
			font-size: 28px;
			font-weight: 100;
			margin-bottom: 15px;
			position: relative;

			@media screen and (min-width: 1024px) {
				font-size: 35px;
				margin-bottom: 20px;
			}

			a.button-login {
				background-image: url(data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgY2xhc3M9ImZhLXN2ZWx0ZSBpY29uLWxvY2sgc3ZlbHRlLTFkMTV5Y2kiIHJvbGU9ImltZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNDQ4IDUxMiI+PHBhdGggZmlsbD0iIzRkNGQ0ZCIgZD0iTTQwMCAyMjRoLTI0di03MkMzNzYgNjguMiAzMDcuOCAwIDIyNCAwUzcyIDY4LjIgNzIgMTUydjcySDQ4Yy0yNi41IDAtNDggMjEuNS00OCA0OHYxOTJjMCAyNi41IDIxLjUgNDggNDggNDhoMzUyYzI2LjUgMCA0OC0yMS41IDQ4LTQ4VjI3MmMwLTI2LjUtMjEuNS00OC00OC00OHptLTEwNCAwSDE1MnYtNzJjMC0zOS43IDMyLjMtNzIgNzItNzJzNzIgMzIuMyA3MiA3MnY3MnoiPjwvcGF0aD48L3N2Zz4=);
				background-position: 9.5px 9px;
				background-repeat: no-repeat;
				background-size: 33%;
				border-radius: 4px;
				border: 1px solid rgb(0 0 0 / 12%);
				color: #363636;
				font-size: 14px;
				font-weight: 400;
				margin-left: 24px;
				margin-top: 6px;
				padding: 15px;
				text-decoration: none;
				transition: border-color 0.3s;

				span {
					display: none;
				}

				&:hover {
					background-image: url(data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgY2xhc3M9ImZhLXN2ZWx0ZSBpY29uLWxvY2stb3BlbiBzdmVsdGUtMWQxNXljaSIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1NzYgNTEyIj48cGF0aCBmaWxsPSIjNGQ0ZDRkIiBkPSJNNDIzLjUgMEMzMzkuNS4zIDI3MiA2OS41IDI3MiAxNTMuNVYyMjRINDhjLTI2LjUgMC00OCAyMS41LTQ4IDQ4djE5MmMwIDI2LjUgMjEuNSA0OCA0OCA0OGgzNTJjMjYuNSAwIDQ4LTIxLjUgNDgtNDhWMjcyYzAtMjYuNS0yMS41LTQ4LTQ4LTQ4aC00OHYtNzEuMWMwLTM5LjYgMzEuNy03Mi41IDcxLjMtNzIuOSA0MC0uNCA3Mi43IDMyLjEgNzIuNyA3MnY4MGMwIDEzLjMgMTAuNyAyNCAyNCAyNGgzMmMxMy4zIDAgMjQtMTAuNyAyNC0yNHYtODBDNTc2IDY4IDUwNy41LS4zIDQyMy41IDB6Ij48L3BhdGg+PC9zdmc+);
					background-position: 9px;
					background-size: 8.5%;
					border-color: #b5b5b5;
					font-weight: 400;
					padding: 5px 10px 5px 28px;

					span {
						display: initial;
					}
				}

				&:focus {
					border-color: #3273dc;
				}
			}

			button {
				background-repeat: no-repeat;
				background-size: 14%;
				border-radius: 4px;
				border-width: 1px;
				color: #363636;
				cursor: pointer;
				font-size: 14px;
				font-weight: 400;
				height: 31px;
				margin: 5px 0 0 23px;
				padding-left: 31px;
				padding-top: 6px;
				text-decoration: none;

				&.save {
					background-color: #23d160;
					border-color: transparent;
					color: #fff;

					&:hover {
						background-color: #22c65b;
					}
				}

				&.save {
					background-image: url(data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgY2xhc3M9ImZhLXN2ZWx0ZSBpY29uLWZsb3BweSBzdmVsdGUtMWQxNXljaSIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNNDMzLjk0MSAxMjkuOTQxbC04My44ODItODMuODgyQTQ4IDQ4IDAgMCAwIDMxNi4xMTggMzJINDhDMjEuNDkgMzIgMCA1My40OSAwIDgwdjM1MmMwIDI2LjUxIDIxLjQ5IDQ4IDQ4IDQ4aDM1MmMyNi41MSAwIDQ4LTIxLjQ5IDQ4LTQ4VjE2My44ODJhNDggNDggMCAwIDAtMTQuMDU5LTMzLjk0MXpNMjcyIDgwdjgwSDE0NFY4MGgxMjh6bTEyMiAzNTJINTRhNiA2IDAgMCAxLTYtNlY4NmE2IDYgMCAwIDEgNi02aDQydjEwNGMwIDEzLjI1NSAxMC43NDUgMjQgMjQgMjRoMTc2YzEzLjI1NSAwIDI0LTEwLjc0NSAyNC0yNFY4My44ODJsNzguMjQzIDc4LjI0M2E2IDYgMCAwIDEgMS43NTcgNC4yNDNWNDI2YTYgNiAwIDAgMS02IDZ6TTIyNCAyMzJjLTQ4LjUyMyAwLTg4IDM5LjQ3Ny04OCA4OHMzOS40NzcgODggODggODggODgtMzkuNDc3IDg4LTg4LTM5LjQ3Ny04OC04OC04OHptMCAxMjhjLTIyLjA1NiAwLTQwLTE3Ljk0NC00MC00MHMxNy45NDQtNDAgNDAtNDAgNDAgMTcuOTQ0IDQwIDQwLTE3Ljk0NCA0MC00MCA0MHoiPjwvcGF0aD48L3N2Zz4=);
					background-size: 20%;
					background-position: 9px 6px;
				}

				&.edit,
				&.cancel {
					border: 1px solid #dbdbdb;
					transition: border-color 0.3s;
					background-color: white;

					&:hover {
						border-color: #b5b5b5;
					}
				}

				&.edit {
					background-image: url(data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgY2xhc3M9ImZhLXN2ZWx0ZSBpY29uLWVkaXQgc3ZlbHRlLTFkMTV5Y2kiIHJvbGU9ImltZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNTc2IDUxMiI+PHBhdGggZmlsbD0iIzZkNmQ2ZCIgZD0iTTQwMi4zIDM0NC45bDMyLTMyYzUtNSAxMy43LTEuNSAxMy43IDUuN1Y0NjRjMCAyNi41LTIxLjUgNDgtNDggNDhINDhjLTI2LjUgMC00OC0yMS41LTQ4LTQ4VjExMmMwLTI2LjUgMjEuNS00OCA0OC00OGgyNzMuNWM3LjEgMCAxMC43IDguNiA1LjcgMTMuN2wtMzIgMzJjLTEuNSAxLjUtMy41IDIuMy01LjcgMi4zSDQ4djM1MmgzNTJWMzUwLjVjMC0yLjEuOC00LjEgMi4zLTUuNnptMTU2LjYtMjAxLjhMMjk2LjMgNDA1LjdsLTkwLjQgMTBjLTI2LjIgMi45LTQ4LjUtMTkuMi00NS42LTQ1LjZsMTAtOTAuNEw0MzIuOSAxNy4xYzIyLjktMjIuOSA1OS45LTIyLjkgODIuNyAwbDQzLjIgNDMuMmMyMi45IDIyLjkgMjIuOSA2MCAuMSA4Mi44ek00NjAuMSAxNzRMNDAyIDExNS45IDIxNi4yIDMwMS44bC03LjMgNjUuMyA2NS4zLTcuM0w0NjAuMSAxNzR6bTY0LjgtNzkuN2wtNDMuMi00My4yYy00LjEtNC4xLTEwLjgtNC4xLTE0LjggMEw0MzYgODJsNTguMSA1OC4xIDMwLjktMzAuOWM0LTQuMiA0LTEwLjgtLjEtMTQuOXoiPjwvcGF0aD48L3N2Zz4=);
					background-position: 9.5px 7px;
				}

				&.cancel {
					background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHZpZXdCb3g9IjAgMCA1MCA1MCI+DQo8cGF0aCBmaWxsPSIjYjViNWI1IiBkPSJNIDkuMTU2MjUgNi4zMTI1IEwgNi4zMTI1IDkuMTU2MjUgTCAyMi4xNTYyNSAyNSBMIDYuMjE4NzUgNDAuOTY4NzUgTCA5LjAzMTI1IDQzLjc4MTI1IEwgMjUgMjcuODQzNzUgTCA0MC45Mzc1IDQzLjc4MTI1IEwgNDMuNzgxMjUgNDAuOTM3NSBMIDI3Ljg0Mzc1IDI1IEwgNDMuNjg3NSA5LjE1NjI1IEwgNDAuODQzNzUgNi4zMTI1IEwgMjUgMjIuMTU2MjUgWiI+PC9wYXRoPg0KPC9zdmc+);
					background-size: 19%;
					background-position: 9px 7px;
					position: absolute;
					right: 0;
				}
			}
		}

		h3 {
			font-size: 28px;

			strong {
				font-weight: 700;
			}
		}

		img {
			max-width: 100%;
		}

		ul {
			li {
				line-height: 1.5;
				list-style-type: circle;
				padding-left: 5px;

				&:before {
					content: "";
				}
			}
		}
	}

	table {
		text-align: left;
		width: 100%;

		tr:last-child {
			td {
				border-bottom: 1px dotted #ddd;
			}
		}

		td {
			border-top: 1px dotted #ddd;
		}

		.grid {
			display: grid;
			grid-template-columns: 27% 73%;
			grid-template-areas:
				"logo soft-name"
				"logo hardware"
				"logo description"
				"empty features";

			@media screen and (min-width: 768px) {
				grid-template-columns: 10% 40% 33% 17%;
				grid-template-areas:
					"logo soft-name description start-working"
					"logo hardware description start-working";
			}

			div {
				padding: 2px;
				padding-right: 10px;

				&.logo {
					align-items: start;
					display: flex;
					grid-area: logo;
					justify-content: center;
					padding: 27px 10px;

					@media screen and (min-width: 768px) {
						align-items: center;
						display: flex;
						justify-content: center;
						padding: 10px;
					}
				}

				&.soft-name {
					font-weight: bold;
					grid-area: soft-name;
					line-height: 24px;
					padding-top: 20px;

					sup {
						font-weight: normal;
						padding-left: 3px;
						padding-right: 7px;
					}

					@media screen and (min-width: 768px) {
						align-items: flex-end;
						display: flex;
						font-size: 14px;
						justify-content: start;
						padding: 10px 20px 0px 10px;
					}

					span {
						span {
							background-repeat: no-repeat;
							cursor: pointer;
							display: none;
							height: 12px;
							position: relative;
							width: 12px;

							@media screen and (min-width: 768px) {
								display: inline-block;
							}

							&:before {
								background-image: url(data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgY2xhc3M9ImZhLXN2ZWx0ZSBpY29uLWluZm8tY2lyY2xlZCBzdmVsdGUtMWQxNXljaSIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjYjdiN2I3IiBkPSJNMjU2IDhDMTE5LjA0MyA4IDggMTE5LjA4MyA4IDI1NmMwIDEzNi45OTcgMTExLjA0MyAyNDggMjQ4IDI0OHMyNDgtMTExLjAwMyAyNDgtMjQ4QzUwNCAxMTkuMDgzIDM5Mi45NTcgOCAyNTYgOHptMCAxMTBjMjMuMTk2IDAgNDIgMTguODA0IDQyIDQycy0xOC44MDQgNDItNDIgNDItNDItMTguODA0LTQyLTQyIDE4LjgwNC00MiA0Mi00MnptNTYgMjU0YzAgNi42MjctNS4zNzMgMTItMTIgMTJoLTg4Yy02LjYyNyAwLTEyLTUuMzczLTEyLTEydi0yNGMwLTYuNjI3IDUuMzczLTEyIDEyLTEyaDEydi02NGgtMTJjLTYuNjI3IDAtMTItNS4zNzMtMTItMTJ2LTI0YzAtNi42MjcgNS4zNzMtMTIgMTItMTJoNjRjNi42MjcgMCAxMiA1LjM3MyAxMiAxMnYxMDBoMTJjNi42MjcgMCAxMiA1LjM3MyAxMiAxMnYyNHoiPjwvcGF0aD48L3N2Zz4=);
								background-repeat: no-repeat;
								content: " ";
								display: block;
								height: 12px;
								width: 12px;
							}

							&:hover {
								&:before {
									filter: invert(20%) sepia(96%) saturate(2663%)
										hue-rotate(184deg) brightness(106%) contrast(84%);
								}
							}

							.tooltip {
								background-color: #f2f2f2;
								border-color: #ddd;
								border-radius: 0.25rem;
								box-shadow: 0 2px 4px rgba(0, 0, 0, 0.57);
								padding: 10px 15px;
								position: absolute;
								top: 50%;
								width: 350px;
								transition:
									transform 0.4s ease-in-out,
									opacity 0.4s ease-in-out;
								cursor: initial;
								left: 23px;
								opacity: 0;
								pointer-events: none;
								transform: translateX(-10px) translateY(-50%);
								z-index: 1111;

								&.visible {
									opacity: 1;
									pointer-events: initial;
									transform: translateX(0px) translateY(-50%);
								}

								&:before {
									border-color: rgba(194, 225, 245, 0);
									border-right-color: #ddd;
									border-width: 9px;
									border: solid transparent;
									content: " ";
									height: 0;
									margin-top: -9px;
									pointer-events: none;
									position: absolute;
									right: 100%;
									top: 50%;
									width: 0;
								}

								&::after {
									border-color: rgba(136, 183, 213, 0);
									border-right-color: #f2f2f2;
									border-width: 8px;
									border: solid transparent;
									content: " ";
									height: 0;
									margin-top: -8px;
									pointer-events: none;
									position: absolute;
									right: 100%;
									top: 50%;
									width: 0;
								}

								ul {
									font-size: 14px;
									font-weight: normal;
									line-height: 30px;
									list-style-type: none;
									margin: 0;
									max-height: 400px;
									overflow-y: auto;
									padding-left: 0;
									width: 330px;
								}
							}
						}
					}
				}

				&.features {
					align-items: center;
					display: flex;
					font-size: 12px;
					grid-area: features;
					line-height: 20px;
					padding-bottom: 20px;

					@media screen and (min-width: 768px) {
						display: none;
					}

					details {
						transition: height 3s ease-in;

						summary {
							cursor: pointer;
							font-size: 14px;
							font-weight: 600;
							position: relative;

							&::after {
								background-image: url(data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgY2xhc3M9ImZhLXN2ZWx0ZSBpY29uLWFuZ2xlLXJpZ2h0ICBzdmVsdGUtMWQxNXljaSIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTYgNTEyIj48cGF0aCBmaWxsPSIjNGE0YTRhIiBkPSJNMjI0LjMgMjczbC0xMzYgMTM2Yy05LjQgOS40LTI0LjYgOS40LTMzLjkgMGwtMjIuNi0yMi42Yy05LjQtOS40LTkuNC0yNC42IDAtMzMuOWw5Ni40LTk2LjQtOTYuNC05Ni40Yy05LjQtOS40LTkuNC0yNC42IDAtMzMuOUw1NC4zIDEwM2M5LjQtOS40IDI0LjYtOS40IDMzLjkgMGwxMzYgMTM2YzkuNSA5LjQgOS41IDI0LjYuMSAzNHoiPjwvcGF0aD48L3N2Zz4=);
								background-repeat: no-repeat;
								content: " ";
								display: inline-block;
								height: 17px;
								left: 55px;
								position: absolute;
								top: 3px;
								width: 17px;
							}

							&::marker {
								content: "";
							}
						}

						&[open] {
							summary {
								&::after {
									-ms-transform: rotate(90deg);
									-webkit-transform: rotate(90deg);
									background-position-x: 4px;
									background-position-y: 2px;
									transform: rotate(90deg);
								}
							}
						}

						ul {
							padding-left: 0;

							li {
								font-size: 14px;
								line-height: 26px;

								&::marker {
									content: "";
								}
							}
						}
					}
				}

				&.hardware {
					align-items: center;
					display: flex;
					font-size: 12px;
					grid-area: hardware;
					line-height: 20px;

					@media screen and (min-width: 768px) {
						align-items: flex-start;
						padding: 0px 20px 10px 10px;
					}
				}

				&.description {
					font-size: 14px;
					grid-area: description;
					line-height: 20px;

					@media screen and (min-width: 768px) {
						align-content: center;
						align-items: center;
						display: inline-flex;
						flex-wrap: wrap;
						justify-items: center;
					}

					span {
						padding-right: 5px;
					}

					.benchmark {
						-moz-transition: color 0.3s;
						-o-transition: color 0.3s;
						-webkit-transition: color 0.3s;
						color: #009ddf;
						display: inline-block;
						text-decoration: none;
						transition: color 0.3s;

						&:hover {
							color: #363636;
						}

						@media screen and (max-width: 767px) {
							background-image: url(data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgcm9sZT0iaW1nIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBmaWxsPSIjMDA5ZGRmIiBkPSJNNDk2IDM4NEg2NFY4MGMwLTguODQtNy4xNi0xNi0xNi0xNkgxNkM3LjE2IDY0IDAgNzEuMTYgMCA4MHYzMzZjMCAxNy42NyAxNC4zMyAzMiAzMiAzMmg0NjRjOC44NCAwIDE2LTcuMTYgMTYtMTZ2LTMyYzAtOC44NC03LjE2LTE2LTE2LTE2ek00NjQgOTZIMzQ1Ljk0Yy0yMS4zOCAwLTMyLjA5IDI1Ljg1LTE2Ljk3IDQwLjk3bDMyLjQgMzIuNEwyODggMjQyLjc1bC03My4zNy03My4zN2MtMTIuNS0xMi41LTMyLjc2LTEyLjUtNDUuMjUgMGwtNjguNjkgNjguNjljLTYuMjUgNi4yNS02LjI1IDE2LjM4IDAgMjIuNjNsMjIuNjIgMjIuNjJjNi4yNSA2LjI1IDE2LjM4IDYuMjUgMjIuNjMgMEwxOTIgMjM3LjI1bDczLjM3IDczLjM3YzEyLjUgMTIuNSAzMi43NiAxMi41IDQ1LjI1IDBsOTYtOTYgMzIuNCAzMi40YzE1LjEyIDE1LjEyIDQwLjk3IDQuNDEgNDAuOTctMTYuOTdWMTEyYy4wMS04Ljg0LTcuMTUtMTYtMTUuOTktMTZ6Ii8+PC9zdmc+DQo=);
							background-position-y: -2px;
							background-repeat: no-repeat;
							font-size: 0;
							height: 14px;
							width: 14px;
						}
					}
				}

				&.start-working {
					align-items: center;
					display: none;
					grid-area: start-working;

					@media screen and (min-width: 768px) {
						align-items: center;
						display: flex;
						justify-content: center;
						padding-right: 0;
					}

					button {
						font-size: 14px;
						font-weight: 500;
						margin: 0;

						@media screen and (min-width: 1024px) {
							width: 130px;
						}
					}
				}
			}
		}
	}

	button {
		-moz-transition: background-color 200ms ease;
		-webkit-transition: background-color 200ms ease;
		background-color: #80b5cc;
		border-radius: 4px;
		border: 1px solid transparent;
		color: #fff;
		cursor: pointer;
		display: inline-block;
		font-size: 18px;
		font-weight: 100;
		letter-spacing: 0;
		margin: 30px 15px 80px;
		padding: 8px 11px;
		text-decoration: none;
		transition:
			background-color 200ms ease,
			box-shadow 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
		width: auto;

		&:hover {
			background-color: #0094d2;
		}
	}
}