@import url(fonts.css);

html, body {
  font-family: Roboto, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  background:#d3e6fb;
}

#topmenu {
  background: url("../images/logohww.png") no-repeat 5% 30%, linear-gradient(0deg, #d3e6fb, #fff);
	height: 80px;
	border-bottom: 30px, solid, #c4c4c4;
}

#topmenu ul {
  float: right;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#topmenu li {
  float: left;
}

#topmenu a {
	color: #545454;
  display: inline-block;
	text-decoration: none;
	text-align: center;
  height: 46px;
	margin: 0;
	padding-top: 30px;
	width: 100px;
}

#topmenu a:hover {
	background: linear-gradient(180deg, #d3e6fb, #fff);
	border-bottom: 4px solid #1818d0;
}

/* Вставка инфо-строки "Часы" и "Тел." и "Курсы валют" */

#infoline {
  display: flex;
  border: 1px solid #d6d1d1;
  background: #d3e6fb;
  color:#545454;
  width: 100%;
}

#watch {
  margin: 1px 12px 0 60px;
  padding: 0;
  height: 28px;
  width:32px;
}

#digital_watch {
  font-family: Roboto, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  margin: 5px 30px 0 0;
  padding:0;
  height: 28px;
}

#tel {
  font-family: Roboto, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  margin: 0 150px 0 150px;
}

#hard_currency {
  font-family: Roboto, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  display: grid;
  grid-template-columns: repeat(3, 30%);
  gap: 20px;
  padding-left: 10px;
  text-align: right;
}

#hard_currency .fa-long-arrow-alt-down {
	color: rgb(92, 68, 245);
}

#hard_currency .fa-long-arrow-alt-up {
	color: rgb(255, 17, 0);
}
/* Фото заставка с рекламой */

.flexbox {
  display: flex;
  flex-direction: row;
}

.container {
  max-height: auto;
  display: block;
  text-align: center;
  position: relative;
}

.images-descrition {
  margin: 0;
  padding: 0;
  opacity: 0.6;
  max-height: inherit;
  overflow: hidden;
}

.description {
  position: absolute;
  color:#fafafb;
  font-family: "rb";
  font-size: 22px;
  top: 30%;
  left: 30%;
  transform: translate(-35%, 50%);
  opacity:0;
}

.container:hover .description {
  opacity:100; 
}

/* Основное поле сайта - grid сетка */

.electrodesall {
  text-align: center;
  font-family: Roboto, sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif,
}

.electrodesall {
  margin-bottom: 20px;
  padding-top: 10px;
  color: #545454;
} 

.electrodesall img {
  height: 330px;
  width: 360px;
  margin: 40px 80px 10px 140px;
  box-shadow: 17px 19px 7px rgba(95, 93, 97, 0.692);
  float: left;
}

.liststrip {
  margin-top: 130px;
}

.list ul {
  margin: 0 40px 20px -20px;
  padding: 20px 80px 50px 560px;
  list-style-type: none;
}

.list li a {
  margin-left: -39px;
  padding: 10px 20px 10px 50px;
  list-style-type: none;
  text-decoration: none;
  color: #545454;
}

.list li {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #7f8081;
  border-radius: 3px;
}

.list .one {
  background: linear-gradient(180deg, rgb(146, 211, 235), #d5edf3);
}

.list .one a:hover {
  color:rgb(250, 11, 11);
  font-weight: 500;
}

.list .two {
  background: linear-gradient(180deg, rgb(164, 249, 74), #ddf1c8);
}

.list .two a:hover {
  color:rgb(250, 11, 11);
  font-weight: 500;
}

.list ul .three {
  background: linear-gradient(180deg, rgb(127, 128, 129), #d6d7d7);
}

.list ul .three a:hover {
  color:rgb(250, 11, 11);
  font-weight: 500;
}

.list ul .fore {
  background: linear-gradient(180deg, rgb(244, 142, 68), #f9bea5);
}

.list ul .fore a:hover {
  color:rgb(250, 11, 11);
  font-weight: 500;
}
.list ul .five {
  background: linear-gradient(180deg, rgb(251, 237, 36), #faec84);
}

.list ul .five a:hover {
  color:rgb(250, 11, 11);
  font-weight: 500;
}

.list ul .six {
  background: linear-gradient(180deg, rgb(68, 180, 3), #b3fa61);
}

.list ul .six a:hover {
  color:rgb(250, 11, 11);
  font-weight: 500;
}

.list ul .seven {
  background: linear-gradient(180deg, rgb(100, 169, 164), #8abefa);
}

.list ul .seven a:hover {
  color:rgb(250, 11, 11);
  font-weight: 500;
}

.his {
  height: auto;
  background: #d3e6fb;
  padding: 0 100px;
}

.his p {
  margin: -3px 150px 20px 150px;
  padding-top: 20px;
  font-size: 20px;
  font-weight: 500;
  text-align: center;
  color:#545454;
  background: #d3e6fb;
}

.his .electrodes_11 .img {
  border: 2px solid #262628;

}

.strip2 {
  padding-left: 200px;
}

.bottom a {
  height: 500px;
  margin: 100px -400px 80px 440px;
  padding: 10px;
  text-align:center;
  text-decoration: none;
  font-size: 20px;
  font-weight: 500;
  color:#545454;
  border: 1px solid #7f8081;
  border-radius: 10px;
  background:#96cbd8;

}