﻿html {
  font: 1em/1.4 Helvetica, sans-serif;
}
a { color: #0000FF; text-decoration: none; }
a:hover { color: #BC8F8Fe; text-decoration: underline; }
   P {
margin: 0 0 1em 0;
text-align: justify; /* Выравнивание по ширине */  }

.amz {
    background-color: #206306;
    font-weight: bold; /* Жирное начертание */
    color: #FFFFFF;
    padding: 1em;
    margin-left: 6em;
   }

.price {
    font-weight: bold; /* Жирное начертание */
    color: red;
    padding: 1%;
   }

   .cite { /* Абзац с классом cite */
width: 90%;
    color: navy; /* Цвет текста */
    margin-left: 1em; /* Отступ слева */
    border-left: 1px solid navy; /* Граница слева от текста */
    padding-left: 2em; /* Расстояние от линии до текста */
   }

   .gost {
    color: green; /* Цвет текста */
    font-weight: bold; /* Жирное начертание */
   }

.column {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 90%;
/* background: #c0c0c0;*/
}

   H1 {
    color: #808000;
    padding: 1%;
   }

   H2 {    background-color: rgb(214,86,43);
    color: #FFFFFF;
    padding: 1%;
   }

   H3 {
    text-align: center;
    color: #808000;
    padding: 0;
   }

   H4 {
 font-variant-caps: small-caps;
 color: #900;
 padding: 5;
   }


img {
    max-width: 100%;
    float: right; /* Обтекание картинки по левому краю */
    padding-left: 20px; /* Отступ слева */
    padding-right: 10px; /* Отступ справа */
    padding-bottom: 20px; /* Отступ снизу */
}

.scale {
    transition: .5s; /* Время эффекта */
   }
.scale:hover {
    transform: scale(1.1); /* Увеличиваем масштаб */
   }

* { box-sizing: border-box; }

.grid {
  display: grid;
  grid-gap: .3em;
  grid-template-columns: 1fr;
  border: 1px solid rgb(86,98,110);
  border-radius: 5px;
  padding: 1%;
/*background: #fc9;*/
}

.grid > * {
  border: 2px solid rgb(89,161,175);
  border-radius: 5px;
  padding: 1%;
/*background: #fc0;*/
}

@media (min-width: 40em) {
  .grid {
    grid-template-columns: 2fr;
  }

  header,
  footer {
    grid-column: 1 / 3;
  }
}

.media {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2em;
}

.media > * {
  flex: 1 1 250px;
  margin: 1%;
}
