@import url('root.css');
@import url('header.css');
@import url('footer.css');
@import url('button.css');
@import url('form.css');
@import url('filter.css');
@import url('popup.css');
@import url('profile.css');
@import url('table.css');



.input_change { background-color: #ffe2d3; }

.paginator_wrapper {
	max-width: 1400px;
	display: flex;
	justify-content: flex-end;
	padding: 17px 30px;
	width: 100%;
    max-width: 1400px;
    margin: 0 auto;
}



/*=============== index.php ===============*/
/*========== Промо блок ==========*/

.promo {
  display: flex;
  max-width: 1600px;
  margin: 0 auto;
  margin-bottom: 100px;
  padding: 0 100px;
}

.promo__description {
  padding-top: 52px;
}

.promo__title {
  margin: 0;
  margin-bottom: 30px;

  font-weight: 500;
  font-size: 70px;
  line-height: 125%;
  color: var(--text-blue-darken);
}

.promo__text {
  margin: 0;
  margin-bottom: 50px;
  padding-right: 125px;

  font-size: 20px;
  line-height: 155%;
  color: var(--text-blue);
}

.promo__button {
  min-width: 208px;
}

.promo__image {
  min-width: 800px;
  height: 460px;
}

/*========== Описание ==========*/

.description {
  max-width: 750px;
  margin: 0 auto;
  margin-bottom: 100px;

  text-align: center;
}

.description__title {
  margin: 0;
  margin-bottom: 33px;
  padding: 0 140px;

  font-weight: 500;
  font-size: 40px;
  line-height: 136.5%;
  color: var(--text-blue-darken);
}

.description__text {
  margin: 0;

  font-weight: 400;
  font-size: 20px;
  line-height: 155%;
  color: var(--text-blue);
}

/*========== Функции системы ==========*/

.functions {
  padding-top: 100px;
  padding-bottom: 50px;

  background-color: var(--functions-background);
}

.functions__title {
  margin: 0;
  margin-bottom: 65px;

  font-weight: 500;
  font-size: 40px;
  line-height: 136.5%;
  text-align: center;
  color: var(--text-blue-darken);
}

.functions__list {
  display: flex;
  flex-wrap: wrap;
  max-width: 1230px;
  margin: 0 auto;
  padding: 0;

  list-style: none;
}

.function {
  position: relative;

  flex-basis: 25%;
  width: 25%;
  min-height: 175px;
  margin-bottom: 45px;
  padding-top: 70px;
  padding-bottom: 15px;
}

.function__icon {
  position: absolute;
  top: 0;
  left: 50%;

  transform: translateX(-50%);
}

.function__icon--auto {
  left: 48%;

  width: 55px;
  height: 43px;
}

.function__icon--parking {
  top: -5px;

  width: 55px;
  height: 55px;
}

.function__icon--camera {
  left: 46%;

  width: 45px;
  height: 45px;
}

.function__icon--passed-1 {
  left: 48%;

  width: 50px;
  height: 50px;
}

.function__icon--passed-2 {
  left: 46%;

  width: 50px;
  height: 50px;
}

.function__icon--shipped {
  left: 48%;

  width: 55px;
  height: 55px;
}

.function__icon--video {
  left: 43%;

  width: 45px;
  height: 45px;
}

.function__icon--web {
  left: 48%;

  width: 45px;
  height: 45px;
}

.function__description {
  margin: 0;
  padding: 0 26px;

  font-size: 18px;
  line-height: 155%;
  text-align: center;
  color: var(--text-blue);
}

/*========== Подключение к системе ==========*/

.connect {
  max-width: 1600px;
  margin: 0 auto;
  margin-bottom: 80px;
  padding-top: 98px;
}

.connect__title {
  max-width: 830px;
  margin: 0 auto;
  margin-bottom: 53px;

  font-weight: 500;
  font-size: 70px;
  line-height: 125%;
  text-align: center;
  color: var(--orange);
}

.connect__input {
  margin-bottom: 20px;
}

.connect__button {
  min-width: 190px;
  margin-top: 14px;
}

/*=============== index.php - END ===============*/



/*========== login.php ==========*/

.login__input {
  margin-bottom: 20px;
}

.login__button {
  min-width: 239px;
  margin-top: 12px;
  margin-bottom: 22px;
}

.login__link {
  margin: 0 auto;
}

/*========== registration.php ==========*/

.registration-form {
  max-width: 350px;
  margin-bottom: 80px;
}

.registration-form__inner {
  margin-bottom: 13px;
}

.registration-form__button {
  margin-top: 37px;
}

/*========== event.php ==========*/

.open-gate-button {
  margin: 0 auto;
  min-width: 188px;
}


/*========== Результаты ==========*/

.results {
  display: flex;
  align-items: center;
}

.results-title,
.results-value {
  font-size: 12px;
  line-height: 14px;
  font-style: normal;
  font-weight: 500;
  color: var(--text-blue);
  opacity: 0.6;
}

.results-title {
  margin-right: 10px;
}

.results-select {
  min-width: 78px;
  padding: 8px;
  padding-left: 14px;
  padding-right: 30px;
  border: 1px solid var(--border-gray);
  border-radius: 5px;
  font-weight: 500;
  font-size: 12px;
  line-height: 16px;
  color: var(--text-blue-darken);
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  background-image: url(../img/results-arrow-down.svg);
  background-size: 22px 22px;
  background-repeat: no-repeat;
  background-position: 90% 50%;
}

.results-value {
  margin-left: 10px;
}

/*========== Пагинатор ==========*/

.paginator {
  display: flex;
  align-items: center;
  padding: 0;
  margin: 0;
  list-style: none;
}

.table__data-inner .paginator {
  margin-left: auto;
}

.paginator__item--number {
  margin-right: 5px;
}

.paginator__item:last-child {
  margin-right: 0;
}

.paginator__item--prev {
  margin-right: 16px;
}

.paginator__item--next {
  margin-left: 16px;
}

.paginator__link {
  font-size: 12px;
  line-height: 14px;
  font-weight: bold;
  color: var(--orange);
}

.paginator__link--number {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 34px;
  min-height: 34px;
  color: var(--text-blue-darken);
  border: 1px solid var(--border-gray);
  border-radius: 50%;
  background-color: transparent;
}

.paginator__link--disabled {
  color: var(--text-blue);
  opacity: 0.6;
}

.paginator__link--active {
  color: var(--basic-white);
  background-color: var(--orange);
  border-color: var(--orange);
}

/*========== Номера ==========*/

.format_num {
  min-width: 100px;
  color: #838383;
  font-weight: bold;
  border: solid 1px #838383;
  padding: 2px 12px;
  background-color: #fff;
  display: inline-block;
  border-radius: 3px;
}

.format_num:hover {
  border-color: black;
  color: black;
}

.format_num .num_main {
  min-width: 65px;
  display: inline-block;
  font-size: 14px;
}

.format_num .num_main .digit {
  font-size: 16px;
  padding: 0 2px;
}

.format_num .reg {
  text-align: center;
  font-size: 16px;
  display: inline-block;
  width: 26px;
  margin-left: 4px;
  padding-left: 4px;
  border-left: solid 1px #838383;
}