@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

* {
	padding: 0;
	margin: 0;
}

body {
	background-color: #fff;/*#f9f9f9 #f7f8f9*/
	font-family: "Roboto", sans-serif;
	font-weight: 400;
	min-width: 320px;
}

img {
	display: block;
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
}

/*Шапка сайта*/
#wrapper-header {
	width: 100%;
	height: auto;
	border-bottom: 1px solid #ebebeb;
	margin: 0 0 40px 0;
	padding: 20px 0;
}
	.header {
		width: 1300px;
		height: auto;
		display: flex;
			justify-content: space-between;
			align-items: center;
			flex-wrap: wrap;
		margin: 0 auto;
	}
		/*Логотип*/
		.header > .logo {
			width: 200px;
			height: auto;
			display: flex;
				justify-content: flex-start;
				align-items: center;
				flex-wrap: wrap;
			outline: 0px solid blue;
		}
			.header > .logo svg {
				display: inline-block;
				vertical-align: bottom;
				max-width: 100%;
				fill: #100e11;
				margin: 0 15px 0 0;
			}
			.header > .logo h1 {
				font-size: 17px;
				font-weight: bold;
				color: #100e11;
				line-height: 100%;
			}

		/* Кнопка для адаптивного меню */
		.header > .show-menu {
			display: none;
		}

		/*Навигация*/
		.header > .nav-header {
			width: 600px;
			height: auto;
			outline: 0px solid red;
		}
			.header > .nav-header ul {
				width: 100%;
				height: auto;
				display: flex;
					justify-content: space-between;
					flex-wrap: wrap;
				list-style-type: none;
				list-style-position: inside;
			}
				.header > .nav-header ul li {
					display: inline-block;
					font-size: 15px;
					line-height: 100%;
				}
					.header > .nav-header ul a {
						color: #767676;
						text-decoration: none;
						padding-bottom: 1px;
						border-bottom: 1px solid transparent;
						transition: 0.1s;
					}
						.header > .nav-header ul a:hover {
							color: #100e11;
							transition: 0.1s;
							border-bottom: 1px solid #100e11;
						}
			/*Кнпока закрытия адаптивного меню*/
			.header .nav-header > .close-menu {
				display: none;
			}

		/* Подложка для адаптивного меню */
		.header > .overlay-menu {
			display: none;
		}

/* Скидки на курсы */
.discounts-courses {
	display: flex;
		justify-content: space-between;
		align-items: center;
	width: 1300px;
	height: auto;
	padding: 40px 40px;
	margin: 0 auto 40px auto;
	border-radius: 15px;
	box-sizing: border-box;
}
		.discounts-courses.autumn {
			background-color: #ffd7a2;
		}
	.discounts-courses .text-discounts {
		width: calc(100% - 594px);
		height: auto;
		outline: 0px solid red;
	}
		.discounts-courses .text-discounts h3 {
			display: inline-block;
			font-size: 16px;
			color: #fff;
			line-height: 100%;
			font-weight: normal;
			text-transform: uppercase;
			padding: 8px 20px;
			background-color: #282c34;
			border-radius: 15px;
			margin: 0 0 20px 0;
		}
		.discounts-courses .text-discounts p {
			font-size: 15px;
			color: #333;
			line-height: 200%;
		}
			.discounts-courses .text-discounts p a {
				color: #333;
				text-decoration: none;
				padding: 0 0 0 0;
				border-bottom: 1px dashed #333;
			}
				.discounts-courses .text-discounts p a:hover {
					border-bottom: 1px dashed transparent;
				}
	.discounts-courses .image-discounts {
		width: 554px;
		height: auto;
		outline: 0px solid red;
	}
		.discounts-courses .image-discounts img {
			display: block;
			max-width: 100%;
			vertical-align: bottom;
		}

/* Контент */
#wrapper-content {
	width: 1300px;
	height: auto;
	margin: 0 auto;
	outline: 0px solid red;
}
	/* Раздел с контентом  */
	.box-container {
		width: 100%;
		height: auto;
		/*margin: 0 0 40px 0;*/
		outline: 0px solid blue;
	}

		/* Заголовок раздела */
		.box-container .title-container {
			width: 100%;
			height: auto;
			display: flex;
				justify-content: flex-start;
				align-items: center;
			margin: 0 0 40px 0;
		}
			.box-container .title-container > .icon {
				width: 32px;
				height: auto;
				margin: 0 20px 0 0;
			}
				.box-container .title-container .icon > svg {
					display: block;
					vertical-align: bottom;
					max-width: 100%;
				}
			.box-container .title-container > .title {
				width: calc(100% - 52px);
				height: auto;
			}
				.box-container .title-container > .title h3 {
					font-size: 18px;
					font-weight: 500;
					color: #333;
					line-height: 100%;
				}

		/* Список контейнеров в разделе */
		.box-container .list-box {
			width: 100%;
			height: auto;
			display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
		}
			.box {
				width: calc( (100% - 40px) / 2 );
				height: auto;
				display: flex;
					justify-content: space-between;
					flex-wrap: wrap;
					align-items: flex-start;
				border: 1px solid #ebebeb;
				border-radius: 5px;
				margin: 0 0 40px 0;
				padding: 40px 40px;
				background-color: transparent;
				box-sizing: border-box;
				/*box-shadow: 0 10px 10px -8px rgb(147 147 147 / 22%);*/
				transition: 0.1s;
			}
					.box:hover {
						border: 1px solid #ddd;
						background-color: #f9f9f9;
						transition: 0.1s;
					}
				/* Изображение контейнера  */
				.box .img-box {
					width: 150px;
					height: auto;
				}
					.box .img-box img {
						display: block;
						max-width: 100%;
						vertical-align: bottom;
						border-radius: 5px;
					}
				/* Описание контейнера */
				.box .description-box {
					width: calc(100% - 190px);
					height: auto;
				}
					.box .description-box h4 {
						font-size: 16px;
						font-weight: 500;
						color: #333;
						line-height: 150%;
						margin: 0 0 15px 0;
					}
						.box .description-box p {
							font-size: 15px;
							line-height: 150%;
							color: #333;
							margin: 0 0 15px 0;
						}
								.box .description-box p:last-child {
									margin: 0 0 0 0;
								}
							.box .description-box p a {
								color: #767676;
								text-decoration: none;
								padding-bottom: 1px;
								border-bottom: 1px solid transparent;
								transition: 0.1s;
							}
								.box .description-box p a:hover {
									color: #100e11;
									transition: 0.1s;
									border-bottom: 1px solid #100e11;
								}

/*Подвал*/
#wrapper-footer {
	width: 100%;
	height: auto;
	background-color: #282c34;
	padding: 40px 0;
}
	.footer {
		width: 1300px;
		height: auto;
		margin: 0 auto;
	}
		.footer > .list-col-footer {
			width: 100%;
			height: auto;
			display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				align-content: flex-start;
		}
			.footer > .list-col-footer > .col-footer {
				width: calc((100% - 120px) / 4);
				height: auto;
				margin: 0 0 40px 0;
				box-sizing: border-box;
				outline: 0px solid red;
			}
				.footer > .list-col-footer > .col-footer > .title-col-footer {
					width: 100%;
					height: auto;
					display: flex;
						justify-content: flex-start;
						flex-wrap: wrap;
						align-items: center;
					margin: 0 0 30px 0;
				}
					.footer > .list-col-footer > .col-footer > .title-col-footer > svg {
						display: inline-block;
						width: 16px;
						height: auto;
						fill: #fff;
						margin: 0 10px 0 0;
					}
					.footer > .list-col-footer > .col-footer > .title-col-footer > h4 {
						display: inline-block;
						font-size: 15px;
						color: #fff;
						line-height: 100%;
						font-weight: 500;
					}
				.footer > .list-col-footer > .col-footer > .content-col-footer {
					width: 100%;
					height: auto;
				}
					.footer > .list-col-footer > .col-footer > .content-col-footer ul {
						list-style-type: none;
						list-style-position: inside;
					}
						.footer > .list-col-footer > .col-footer > .content-col-footer ul li {
							font-size: 15px;
							line-height: 100%;
							color: #c7c7c8;
							margin-bottom: 20px;
						}
								.footer > .list-col-footer > .col-footer > .content-col-footer ul li:last-child {
									margin-bottom: 0;
								}
							.footer > .list-col-footer > .col-footer > .content-col-footer ul li a {
								text-decoration: none;
								padding-bottom: 0;
								border-bottom: 1px solid transparent;
								color: #c7c7c8;
								cursor: pointer;
							}
									.footer > .list-col-footer > .col-footer > .content-col-footer ul li a:after {
										content: '-';
										float: left;
										font-size: 15px;
										color: #c7c7c8;
										margin-right: 10px;
									}
								.footer > .list-col-footer > .col-footer > .content-col-footer ul li a:hover,
								.footer > .list-col-footer > .col-footer > .content-col-footer ul li.current-menu-item a {
									color: #fff;
									border-bottom: 1px solid #fff;
								}

		.footer > hr {
			width: 100%;
			height: 1px;
			background-color: #404754;
			box-shadow: none;
			border: 0;
			outline: 0;
			margin: 0 0 40px 0;
		}

		.footer > .meta-footer {
			width: 100%;
			height: auto;
			display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				align-items: flex-start;
		}
			.footer > .meta-footer > .copyright {
				width: 700px;
				height: auto;
				outline: 0px solid red;
			}
				.footer > .meta-footer > .copyright p {
					font-size: 15px;
					color: #c7c7c8;
					line-height: 150%;
					margin: 0 0 5px 0;
				}
						.footer > .meta-footer > .copyright p:last-child {
							margin: 0 0 0 0;
						}
					.footer > .meta-footer > .copyright p a {
						text-decoration: none;
						border-bottom: 1px solid #fff;
						padding-bottom: 0;
						color: #fff;
					}
						.footer > .meta-footer > .copyright p a:hover {
							border-bottom: 1px solid transparent;
							color: #c7c7c8;
						}
			.footer > .meta-footer > .social-network {
				width: 170px;
				height: auto;
				display: flex;
					justify-content: space-between;
					align-items: center;
					flex-wrap: wrap;
				outline: 0px solid blue;
			}
				.footer > .meta-footer > .social-network > a > svg {
					display: inline-block;
					width: 18px;
					height: auto;
					fill: #c7c7c8;
					transition: 0.1s;
				}
					.footer > .meta-footer > .social-network > a > svg:hover {
						fill:#fff;
						transition: 0.1s;
					}