/*Обнуление*/
* {
	padding: 0;
	margin: 0;
	border: 0;
}

*,
*:before,
*:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

:focus,
:active {
  outline: none;
}

a:focus,
a:active {
  outline: none;
}

nav,
footer,
header,
aside {
  display: block;
}

html,
body {
	height: 100%;
	width: 100%;
	font-size: 100%;
	line-height: 1;
	font-size: 14px;
	-ms-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	display: flex;
  flex-direction: column;
}

@media (min-width: 1200px) {
  body {
    background-image: url(/img/bgi.png);
  }
}

body {
	overflow-y: scroll;
	background-color: grey;
  background-attachment: fixed;
}

input,
button,
textarea {
  font-family: inherit;
}

input::-ms-clear {
  display: none;
}

button {
  cursor: pointer;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

a,
a:visited {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

ul li {
  list-style: none;
}

img {
  vertical-align: top;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: 400;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

input[type="number"] {
    -moz-appearance: textfield;
}

/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/* контейнер */
    .container {
      width: 100%;
      max-width: 1200px;
      padding-right: 15px;
      padding-left: 15px;
      margin-left: auto;
      margin-right: auto;
    }

    /* flex-контейнер */
    .row {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      margin-right: -15px;
      margin-left: -15px;
    }

    /* CSS настройки flex-элементов */
    .col {
      position: relative;
      width: 100%;
      padding-right: 15px;
      padding-left: 15px;
    }

     @media screen and (max-width: 480px) {
      .col {
        padding-right: 10px;
        padding-left: 10px;
      }
    }

    /* ширина блоков article и aside по умолчанию */
    .col__article {
      -ms-flex: 1 0 auto;
      flex: 1 0 auto;
      max-width: 100%;
    }

    .col__aside {
      -ms-flex: 0 0 auto;
      flex: 0 0 auto;
      max-width: 100%;
    }

    /* ширина блоков article и aside для больших экранов */
    @media (min-width: 992px) {
      /* 2/3 от ширины контейнера */
      .col__article {
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
      }

      /* 1/3 от ширины контейнера */
      .col__aside {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
      }
    }

    .header {
      background-color: #2F4F4F;
      flex: 0 0 auto;
      text-align: center;
      padding-top: 15px;
      padding-bottom: 15px;
    }

    .header img {
    	max-width: 100%;
    }

    .col__article {
      background-color: #fff8e1;
      padding-top: 20px;
      padding-bottom: 50px; /*Было 20*/
      text-align: left;
    }

    .col__aside {
      background-color: #dcedc8;
      padding-top: 20px;
    }

    @media (max-width: 991px) {
      .col__aside {
        padding-top: 10px;
      }
    }

    .main {
      flex: 1 0 auto;
      display: flex;
    }

    .main .row {
      flex-grow: 1;
    }

    @media (max-width: 991px) {
      .main .row {
        flex-direction: column;
      }
    }

    footer {
      flex: 0 0 auto;
      display: flex;
      justify-content: space-between;
      text-align: center;
      background-color: #2F4F4F;
      padding-top: 20px;
      padding-bottom: 20px;
      font-size: 12px;
    }

    @media (min-width: 480px) {
    	footer {
    		font-size: 14px;
    	}
    }

    .col__footer a {
    	color: black;
    }

    /*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
    #accordion {
      display: none;
      margin-bottom: 10px;
    }

    @media (min-width: 992px) {
      #accordion {
        display: block;
      }
    }

    .accordion-item {
      margin-bottom: 1px;
    }

    .accordion-item-header { 
      /*Заголовки*/                      
      padding: 6px 8px 6px 20px;
      background: #4d5159;
      color: rgba(255, 255, 255, 0.8);
      cursor: pointer;
      text-transform: uppercase;
      font-family: sans-serif;
      position: relative;
    }

    .accordion-item.show .accordion-item-header,
    /*Заливка при наведении на заголовок*/
    .accordion-item-header:hover,
    .accordion-item-header:focus {
      background: #3b3e44;
    }

    .accordion-item-header::before {
      /*Маленькая полоска в начале*/               
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      width: 10px;
      background: rgba(255, 255, 255, 0.5);
    }

    .accordion-item-header::after {
      /*Стрелочки*/
      content: "";
      position: absolute;
      top: 50%;
      right: 12px;
      width: 16px;
      height: 16px;
      margin-top: -8px;
      background-size: cover;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26.5 26.5' height='100' width='100'%3E%3Cpath d='M25.8 6.2l-1.2-1.3c-.5-.5-1-.7-1.6-.7a2 2 0 00-1.5.7l-8.3 8.4L5 4.9a2 2 0 00-1.6-.7c-.5 0-1 .2-1.5.7L.6 6.2c-.4.4-.6 1-.6 1.5 0 .7.2 1.2.6 1.6l11.1 11.2c.4.4 1 .7 1.5.7a2 2 0 001.6-.7l11-11.2c.4-.4.7-1 .7-1.6 0-.6-.3-1-.7-1.5z' fill='%23fff'/%3E%3C/svg%3E");
    }

    .accordion-item-content {
      display: none;
    }

    .accordion-item.show .accordion-item-content {
      display: block;
    }

    .accordion-item.show .accordion-item-header::after {
      transform: rotate(180deg);
    }


    .accordion-subitems {
      list-style-type: none;
      margin: 0;
      padding: 0;
    }

    .accordion-subitem > a {
      /*Подзаголовки*/
      padding: 6px 8px 6px 20px;
      background: #dcdcdc;
      /*Фон подзаголовка*/
      color: #333;
      cursor: pointer;
      font-family: sans-serif;
      position: relative;
      margin-top: 1px;
      display: block;
      text-decoration: none;
      text-align: center;
    }

    .accordion-subitem > a::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      width: 10px;
      background: #F4A460;
      /*Маленькая полоса у подзаголовка цвет*/        
    }
    
    .accordion-subitem a:hover,
    /*Заливка при наведении на подзаголовок*/
    .accordion-subitem a:focus {
      background: #d4d3d5;
    }

    #nav-toggle {
      font-family: sans-serif;
      padding: 0.25rem 0.75rem;
      background-color: #f4a460;
      border: 1px solid rgba(0, 0, 0, 0.3);
      border-radius: 4px;
      width: 100%;
      margin-bottom: 10px;
      position: relative;
    }

    #nav-toggle::after {
      content: "";
      position: absolute;
      top: 50%;
      right: 12px;
      width: 16px;
      height: 16px;
      margin-top: -8px;
      background-size: cover;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26.5 26.5' height='100' width='100'%3E%3Cpath d='M25.8 6.2l-1.2-1.3c-.5-.5-1-.7-1.6-.7a2 2 0 00-1.5.7l-8.3 8.4L5 4.9a2 2 0 00-1.6-.7c-.5 0-1 .2-1.5.7L.6 6.2c-.4.4-.6 1-.6 1.5 0 .7.2 1.2.6 1.6l11.1 11.2c.4.4 1 .7 1.5.7a2 2 0 001.6-.7l11-11.2c.4-.4.7-1 .7-1.6 0-.6-.3-1-.7-1.5z' fill='%23fff'/%3E%3C/svg%3E");
    }

    #nav-toggle.show::after {
      transform: rotate(180deg);
    }

    #nav-toggle.show ~ #accordion {
      display: block;
    }

    @media (min-width: 992px) {
      #nav-toggle {
        display: none;
      }
    }
    
/*///////////////////////////////////////////////////////////////////////////////////////////////////*/
    
    .col__items {
      display: flex;
      flex-wrap: wrap;
    }

    .col__item {
      display: flex;
      flex: 0 0 100%;
      align-items: flex-start;
      margin-bottom: 20px;
    }

    @media screen and (min-width: 620px) {
      .col__item{
        flex:0 0 50%;
      }
    }

    .col__item p {
       color: black;
       font-size: 1rem;
    }

    @media screen and (min-width: 480px) {
      .col__item p {
        font-size: 1.0786rem;
      }
    }

    /*.col__item:last-child {
      margin-bottom: 0;         Обратить внимание делает у всех равномерный оступ в списках кинг внизу
    }*/
    
    .col__item>img {
      display: block;
      max-width: 100px;
      height: auto;
    }

    .col__item>div {
      padding-left: 10px;
    }

    .col__item span {
      font-weight: 600;
      color: #2b2b2b;
    }

   /*/////////////////////////////////////////////////////////////////////////////////////////////*/
h1 {
  font-size: 20px;
  margin-bottom: 20px;
  font-weight: 600;
}

@media screen and (min-width: 480px) {
    h1 {
    font-size: 21.9px;
    }
}

h2 {
  font-size: 20px;
  font-weight: 600;
  color: #2b2b2b;
  margin: 10px 0;
}

@media screen and (min-width: 480px) {
  h2 {
    font-size: 21px;
  }
}

h3 {
  margin-bottom: 20px;
  margin-top: 10px;
  color: #7B68EE;
  font-weight: 600;
  font-size: 17px;
}

p {
  font-size: 15px;
  line-height: 1.2;
}

@media screen and (min-width: 480px) {
  p {
    font-size: 17px;
  }
}
  
  .Books_number>p {
  text-indent: 9px;
}

#myInput {
  border: 1px solid red;
  font-size: 16px;
  margin-bottom: 10px;
  padding: 5px 5px;
  width: 162px;          /*Было 165px*/
  border-radius: 5px;
}

.nums__wrapper {
  display: flex;
  font-size: 18px;
}

.nums__title {
  flex-shrink: 0;
  margin-right: 5px;
  margin-bottom: 5px;
  border: 1px solid transparent;
  padding: 6px 2px 6px 0;
  color: #7B68EE;
  font-size: 17px;
  font-weight: 600;
  width: 66px;
}

.nums__titlelong {
  flex-shrink: 0;
  margin-right: 5px;
  margin-bottom: 5px;
  border: 1px solid transparent;
  padding: 6px 2px 6px 0;
  color: #7B68EE;
  font-size: 17px;
  font-weight: 600;
  max-width: 100%;
}

.nums {
  display: flex;
  flex-wrap: wrap;
}

.nums a {
  display: block;
  border: 1px solid black;
  padding: 6px 0px;  /*Было 4px 20px*/
  border-radius: 8px;
  text-align: center;
  background-color: #f0fff0;
  color: #2A4480;
  margin-right: 6px;   /*Было 8px сдвиг вправо*/
  margin-bottom: 10px;
  width: 50px; /*Выравнивает клеточки*/
}

.nums > li:last-child > a {
  margin-right: 0;
}

.nums a:hover {
  color: red;
  background: #ffe4e1;
}

@media screen and (max-width: 600px) {
  .nums__wrapper{
   display: block;
  }
}

@media screen and (min-width: 600px) {
  .nums__title {
    margin-bottom: 10px;
  }
}
/*Здесь начинается контент для решения**************************/
figure {
  font-size: 0;
  margin: 0 0 15px;
  position: relative;
}

figure > img {
  width: 100%;
}

figure > figcaption {
  position: absolute;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);
  font-size: 13px;
  padding: 2.5px 12.5px;
  color: #fff;
  border-top-left-radius: 20px;
  font-style: italic;
}
@media screen and (max-width: 480px) {
	figure > figcaption {
		font-size: 10px;
	}
}
 
.title_photo {
  margin-bottom: 5px;
  border: 3px solid black;
  border-radius: 10px;
}
.title_photo h2 {
  text-align: center;
}
@media screen and (max-width: 480px){
  .title_photo h2 {
    font-size: 18px;
    }
}

.lesson_control {
	display: flex;
	justify-content: center;
	text-align: center;
  font-size: 1.0714rem;
  margin-top: 20px;
}

@media screen and (min-width: 480px) {
  .lesson_control {
    font-size: 1.1429rem;
  }
}

.lesson_control a {
	color: black;
	border: 0.1429rem solid black;
	border-radius: 0.7143rem;
	padding: 0.4286rem;
	margin-left: 1.4286rem;
	flex: 1 1 auto;
	max-width: 11rem;
}

.lesson_control a:first-child {
	margin-left: 0;
}

.lesson_control a:hover {
	color: red;
	background: #ffe4e1;
}

.social-icons {
  display: flex;
  justify-content: center;
  list-style: none;
  margin-top: 1.7rem;
  /*margin-bottom: 1rem;*/
  padding-left: 0;
}
.social-icons>li {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}
.social-icons a {
  position: relative;
  /*background-color: #eee;*/
  display: block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: background-color .3s ease-in-out;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: .25rem;
}
.social-icons a:hover {
  background-color: #e0e0e0;
}
.social-icons a::before {
  content: "";
  position: absolute;
  width: 1.8rem;
  height: 1.8rem;
  left: .35rem;
  top: .35rem;
  background: transparent no-repeat center center;
  background-size: 100% 100%;
}
.social-icons .social-icon-whatsapp::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3Cpath fill='%2326e07f' d='M19.077 4.928A9.927 9.927 0 0012.011 2c-5.506 0-9.987 4.479-9.989 9.985a9.962 9.962 0 001.333 4.992L2 22l5.233-1.237a9.98 9.98 0 004.773 1.216h.004c5.505 0 9.986-4.48 9.989-9.985a9.922 9.922 0 00-2.922-7.066zm-2.179 10.626c-.208.583-1.227 1.145-1.685 1.186-.458.042-.887.207-2.995-.624-2.537-1-4.139-3.601-4.263-3.767-.125-.167-1.019-1.353-1.019-2.581s.645-1.832.874-2.081a.916.916 0 01.666-.312c.166 0 .333 0 .478.006.178.007.375.016.562.431.222.494.707 1.728.769 1.853s.104.271.021.437-.125.27-.249.416c-.125.146-.262.325-.374.437-.125.124-.255.26-.11.509.146.25.646 1.067 1.388 1.728.954.85 1.757 1.113 2.007 1.239.25.125.395.104.541-.063.146-.166.624-.728.79-.978s.333-.208.562-.125 1.456.687 1.705.812c.25.125.416.187.478.291.062.103.062.603-.146 1.186z'/%3e%3c/svg%3e");
}

.social-icons .social-icon-vk::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='%232787f5' d='M545 117.7c3.7-12.5 0-21.7-17.8-21.7h-58.9c-15 0-21.9 7.9-25.6 16.7 0 0-30 73.1-72.4 120.5-13.7 13.7-20 18.1-27.5 18.1-3.7 0-9.4-4.4-9.4-16.9V117.7c0-15-4.2-21.7-16.6-21.7h-92.6c-9.4 0-15 7-15 13.5 0 14.2 21.2 17.5 23.4 57.5v86.8c0 19-3.4 22.5-10.9 22.5-20 0-68.6-73.4-97.4-157.4-5.8-16.3-11.5-22.9-26.6-22.9H38.8c-16.8 0-20.2 7.9-20.2 16.7 0 15.6 20 93.1 93.1 195.5C160.4 378.1 229 416 291.4 416c37.5 0 42.1-8.4 42.1-22.9 0-66.8-3.4-73.1 15.4-73.1 8.7 0 23.7 4.4 58.7 38.1 40 40 46.6 57.9 69 57.9h58.9c16.8 0 25.3-8.4 20.4-25-11.2-34.9-86.9-106.7-90.3-111.5-8.7-11.2-6.2-16.2 0-26.2.1-.1 72-101.3 79.4-135.6z'/%3E%3C/svg%3E");
}

.social-icons .social-icon-telegram::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%2327a7e7' d='M446.7 98.6l-67.6 318.8c-5.1 22.5-18.4 28.1-37.3 17.5l-103-75.9-49.7 47.8c-5.5 5.5-10.1 10.1-20.7 10.1l7.4-104.9 190.9-172.5c8.3-7.4-1.8-11.5-12.9-4.1L117.8 284 16.2 252.2c-22.1-6.9-22.5-22.1 4.6-32.7L418.2 66.4c18.4-6.9 34.5 4.1 28.5 32.2z'/%3E%3C/svg%3E");
}

.Books_number > img.mpimage {
  max-width: 100%;
}

.Books_number > div > img {
  max-width: 100%;                 /*Удалить потом после теста рекламы*/
}

.mpslogan {
  font-size: 20px;
  margin: 10px 0 20px;
  text-align: center;
  color: darkgreen;
  font-weight: 700;
}

@media screen and (min-width: 480px) {
  .mpslogan {
    font-size: 24px;
  }
}

.mphtwo {
  margin: 20px 0;
}

.slogan {
  font-size: 20px;
  text-align: center;
  color: darkgreen;
  margin: 20px 0 7px;
}

@media screen and (min-width: 480px) {
  .slogan {
    font-size: 24px;
  }
}

.rbtop {
  margin-bottom: 20px;
}

.rbmid {
  margin: 20px 0;
}

.rbbotm {
  margin-bottom: 20px;
}

.mtext_resh {
  font-size: 1rem;
  color: #565755;
}

@media screen and (min-width: 480px) {
  .mtext_resh {
    font-size: 15px;
  }
}

.mmtext_resh {
  margin-top: 5px;
  font-size: 1rem;
  color: #565755;
}

@media screen and (min-width: 480px) {
  .mmtext_resh {
    font-size: 15px;
  }
}

.mmtext_resh span {
 color: #CD5C5C;
}

.btext_resh {
  text-align: center;
  font-size: 13px;
  color: #565755;
  margin-bottom: 20px;
}

@media screen and (min-width: 480px) {
  .btext_resh {
    font-size: 13.3px;
  }
}

.errtext404 {
  text-align: center;
  font-size: 20px;
}

.to-up {
  position: fixed; /* фиксированная позиция */
  color: #fff; /* цвет текста */
  background-color: #3aa111; /* цвет заднего фона */
  left: 10px; /* расстояние от правого края */
  bottom: 53px; /* расстояние от нижнего края */
  border-radius: 100%; 
  cursor: pointer; /* форма курсора */
  display: none; /* не отображать элемент */
  width: 44px;
  height: 44px;
}
.to-up::before {
  content: '';
  position: absolute;
  width: 20px;
  height: 20px;
  left: 12px;
  top: 12px;
  background: transparent no-repeat center center;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cg fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17V4M3 10l7-7 7 7'/%3E%3C/g%3E%3C/svg%3E");
}
.to-up:hover {
  background-color: #61b340; /* цвет заднего фона при наведении */
}

.predmet-name {
  margin-bottom: 1.4286rem; /*тут 20px при 14 px*/
}

.breadcrumbs {
  margin: 0;
  padding: 0;
  font-size: 1rem;
  margin-bottom: 0.4286rem;   /* тут 6px при базе 14px*/
  list-style: none;
  font-family: Arial, sans-serif;
}

@media screen and (max-width: 370px) {
.breadcrumbs {
  font-size: 0.9643rem;
}
}

.breadcrumbs-item {
  display: inline-block;
  vertical-align: top;
  margin-right: 0.2143rem;
  margin-bottom: 0.4286rem;
}

.breadcrumbs-item:not(:last-child):after {
  content: ">";
  margin-left: 0.2143rem;  /*тут 3px при базе 14px*/
}

.breadcrumbs-link {
  color: #0b56ea;
  text-decoration: none;
}

.breadcrumbs-link:not(span):hover {
  text-decoration: underline;
}

.breadcrumbs-link.current {
  color: #333;
}

.secslogan {
  margin-top: 0.3571rem;
}

.podpunkty {
  margin: 0.3571rem 0.3571rem;
  line-height: 1.3;
  font-size: 15px;
}

@media screen and (min-width: 480px) {
  .podpunkty {
    font-size: 17px;
  }
}