* {
  scroll-behavior: smooth;
}

body {
  font-size: 14pt;
  margin: 0;
  padding: 0;
}

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

/*    Scroll    */

/* width */

::-webkit-scrollbar {
  width: 10px;
}

/* Track */

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */

::-webkit-scrollbar-thumb {
  background: #09f;
}

/* Handle on hover */

::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/*     end-scroll     */

.mbody {
  color: black;
  margin: 0px;
  font-size: 14pt;
  text-align: left;
}


.formula {
  margin-top: 15px;
  margin-bottom: 15px;
  width: auto;
  height: auto;
  max-width: 95%;
  border: 0px solid;
}

li {
  margin-left: 40px;
}

.wrap {
  margin-left: 50px;
  margin-right: 50px;
  text-align: justify;
  color: black;
  font-size: 14pt;
  overflow: visible;
}

.p-1 {

  background: url(../html/image/bg.jpg) no-repeat center center;
  -moz-background-size: 100%;
  /* Firefox 3.6+ */
  -webkit-background-size: 100%;
  /* Safari 3.1+ и Chrome 4.0+ */
  -o-background-size: 100%;
  /* Opera 9.6+ */
  background-size: 100%;
  /* Современные браузеры */
  /*    background-position: center center;*/
  background-size: cover;
  align-self: center;
}

.f-1 {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: #ffffff5e;
}

.f-1__powered {
  text-align: right;
  color: #6300a1;
}

.f-1__year {
  /* color: #fff; */
  text-align: center;
  vertical-align: bottom;
}

a {
  text-decoration: none;
  color: #6300a1;
}

h1 {
  text-align: left;
}

.otstup {
  text-align: left;
  padding-left: 50px;
}

img {
  margin-top: 15px;
  margin-bottom: 15px;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 900px;
  max-width: 600px;
  /*    border: 1px solid;*/
}

table {
  font-size: 14pt;
  font-family: "Times New Roman", serif;
  width: 100%;
}

td {
  padding-left: 10px;
  padding-right: 10px;
}

p {
  margin: 0;
}

/*    меню    */

.spoiler {
  /*    border-radius: 7px;*/
  text-align: center;
  border: 1px solid blue;
}

.spoiler {
  cursor: pointer;
  margin: 5px 0;
}

.spoiler dt:hover {
  background: #9c9c9c33;
  border-radius: 12px;
  transition: 0.35s;
}

.spoiler dt {
  margin: 3px;
  padding: 5px;
}

.spoiler dd {
  display: none;
  /*    border-radius: 7px;*/
  border: 1px solid blue;
}

.spoiler dd {
  margin: 0 9px 7px 10px;
  padding: 7px;
  text-align: left;
}

.spoiler dd {
  background: #e2e2e2;
}

/*ОГЛАВЛЕНИЕ */

.menu_header {
  color: #6300a1;
  font-family: Verdana;
  font-size: 15pt;
  font-weight: bold;
}

.header {
  padding: 2px 0 5px 9px;
  font-size: 15pt;
  font-weight: bold;
  border-radius: 16px;
  border: 1px solid blue;
  text-align: center;
}

/*ссылки в оглавление*/

.menubox_header_white {
  color: #6300a1;
  font-family: cursive;
  font-size: 12pt;
}

ul {
  margin: 0px;
}

ol {
  margin: 0px;
  padding: 0px;
}

.net {
  background-color: rgb(241, 60, 60);
}

.da {
  background-color: rgb(51, 190, 62);
}

#test {
  margin: 50px;
}

.elvis {
  display: grid;
  grid-template-columns: 50% 50%;
  justify-items: center;
}

.elvis__video {
  margin-left: 30px;
}

a.button1 {
  font-weight: 700;
  color: white;
  text-decoration: none;
  padding: 0.8em 1em calc(0.8em + 3px);
  border-radius: 3px;
  background: #4074c7;
  box-shadow: 0 -3px #0b4aad inset;
  transition: 0.2s;
  display: table;
  margin: 10px;
}

a.button1:hover {
  background: #488eff;
}

a.button1:active {
  background: #0854ce;
  box-shadow: 0 3px rgb(33, 147, 90) inset;
}

.question {
  text-align: left;
  max-width: 90vmax;
  margin-left: 3%;
  border: 1px solid #000;
  padding: 15px 5%;
  background-color: rgba(0, 153, 255, 0.63);
}

.question__text {
  text-align: start;
  margin: 5px;
}

/*               */

button.accordion {
  background-color: #fff;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
}

button.accordion:active,
button.accordion:hover {
  background-color: #6300a1;
  color: #fff;
}

div.panel {
  display: none;
}

div.panel.show {
  display: block;
  background: #fff;
}

.zadanie1__images,
.zadanie1__questions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  justify-items: center;
  margin-bottom: 20px;
  grid-gap: 20px 0;
}

.zadanie1__images>img {
  width: 200px;
  height: 200px;
  object-fit: cover;
}

.zadanie1>input {
  display: block;
  margin: 0 auto;
}

.zadanie2__inputs {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  margin-bottom: 20px;
}

.zadanie2__input {
  display: block;
  margin: 0 auto;
}

.zadanie2__check {
  margin: 0 auto;
  display: block;
}

.zadanie3 {
  margin: 0 4vw;
  display: grid;
  justify-items: center;
  padding: 0.6em;
  row-gap: 0.6em;
}

.zadanie3__inputs {
  margin-bottom: 30px;
  background-image: url(../html/image/zadanie3.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 600px;
  height: 400px;
  position: relative;
}

#port1 {
  position: absolute;
  left: 93px;
  top: 180px;
  width: 70px;
}

#port2 {
  position: absolute;
  left: 180px;
  top: 210px;
  width: 70px;
}

#port3 {
  position: absolute;
  left: 278px;
  top: 250px;
  width: 70px;
}

.zadanie__error {
  background-color: rgba(249, 0, 0, 0.51);
  text-align: center;
}

.zadanie3__check {
  height: 2em;
}