﻿* {margin: 0px; padding: 0px; font-family: Verdana, Tahoma; }
body {
	font-size: 14px;
	margin: auto;
}
input {
	text-align: center;
	font-size: 1em;
	background: beige;
	margin: 0.2em 0em;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
h1 {
	text-align: center;
	font-size: 1.8em;
	background-image: linear-gradient(to right, #04653c, #60d2a2);
	color: transparent;
	background-clip: text;
	-webkit-background-clip: text;
}
h2 {
	text-align: center;
	font-size: 1.6em;
	background-image: linear-gradient(to right, #04653c, #60d2a2);
	color: transparent;
	background-clip: text;
	-webkit-background-clip: text;
}
h3 {
	text-align: center;
	font-size: 1.4em;
	background-image: linear-gradient(to right, #04653c, #60d2a2);
	color: transparent;
	background-clip: text;
	-webkit-background-clip: text;
}

h4 {
	text-align: center;
	font-size: 1.2em;
	background-image: linear-gradient(to right, #04653c, #60d2a2);
	color: transparent;
	background-clip: text;
	-webkit-background-clip: text;
}
h5 {
	text-align: center;
	font-size: 1.1em;
}
h6 {
	text-align: center;
	font-size: 1em;
}

p {	text-indent:5%; /*отступ первой строки*/
	font-size: 1em; padding: 0px 0px 0px 10px;
}
header {
//	font-family:Trebuchet MS;
//	background:#c2ffff;
	background-image: url(/fon.jpg);
	background-size: cover;
	min-height: 100px;
}
ul {
	padding-left: 4px;
}
li{
	margin: 1em 0px 0.5em 0px;
}
li::marker {
	color: red;
	font-size: 2em;
}
nav ul {
    list-style: none;  display: flex;
	justify-content: center;
	flex-wrap: wrap;
    background-color: #000000;
    padding-left: 4px;
    border-radius: 0.5em;
	opacity: 0.5;
}
nav ul li {
    padding: 3px 3px 3px 3px;
    border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	width:7em;
	text-align: center;
}
nav ul li a {
    color: #f9ff00; text-decoration: none;
}
nav ul li:hover {
	background-color: #8baffb;
}
main {
	display: flex;
	justify-content: space-between;
}
.tabl1 {
	background-image: linear-gradient(rgb(0 157 255 / 50%), rgb(255 0 0 / 50%)),
                  url(../../media/examples/lizard.png);
}
#osnov_blok {
	width: 100%;
	font-size: 1em;
}
#div_cleva1{
	background-image: linear-gradient(to right, #39c1dc, #ffffff);
}
#osnov_blok_vlog{
	display: flex;
	flex-wrap: wrap;
}
#div_opisanie1{
	margin: 0px auto;
}
aside {
    /* Задаем для боковой колонки ширину по умолчанию и предотвращаем ее сжатие */
    flex-shrink:0;
    width:15em;
background-image: linear-gradient(to right, #ffffff, #40d611);
}
#pokaz_vxoda{
	width: 20em;
	position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
  }
.vsj_forma form input {
	margin: 15em auto;
	width: 18em;
  display: block;
  margin-left: auto;
  margin-right: auto;
	background-color: fuchsia;
	border-color: fuchsia;
    color: white;
    border: 2px;
    border-radius: 10px;
	font-size: 1em;
}
.vsj_forma input:hover {
	border: 2px solid #00cc00;
	outline: 0;
}
a {
    margin-left: 10px;
    color: #000fff;
	font-size: 1em;
}
.knop_vxoda {
	font-size: 1em;
  margin: 5px;
  border: 0px double rgba(100, 55, 55, 1);
  border-radius: 75px;
  background: linear-gradient(
    202deg,
    rgba(244, 255, 41, 1) 12%,
    rgba(24, 179, 7, 1) 84%
  );
  background-blend-mode: normal;
  box-shadow: 0px 0px 30px 4px rgba(233, 252, 23, 0.9);
}
#forma_vhoda {
	width: 16em;
	text-align: center;
  border: 0px none rgba(100, 100, 100, 0);
  border-radius: 20px;
    background: linear-gradient( 180deg, rgba(200, 200, 200, 1) 3%, rgba(80, 80, 80, 1) 100% );
    box-shadow: inset 6px 6px 12px 0px rgba(0, 17, 67, 1), inset -12px -12px 24px 0px rgba(0, 0, 0, 1), 12px 12px 24px 0px rgba(0, 0, 0, 1);
}
#podval {
	margin-top: 10px;
	text-align: center;
}
#form_result {
	flex-basis: 100%;
}
.div1{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.ustrojstvo_mini {
	background-color: #f3c989;
	border: 0.2em double black;
	margin: 0.2em;
	padding: 0.3em;
}
.ustrojstvo_bili {
	background-color: #a59886;
	border: 0.2em double black;
	margin: 0.2em;
	padding: 0.3em;
}
.ustrojstvo_mini:hover {
    background-color: #ffffbd;
	text-decoration-line: underline;
    transition: 1s ease;
}
.div_sobitie_jurn{
	margin: 0.3em 0.4em 0.2px 0.3em; padding: 0.2em; border-radius: 1em; font-size: 0.8em; background: #cecece;
}
.text {
  font: italic normal 50px "proxima-nova";
  letter-spacing: 0px;
}
@media all and (max-width: 5000px) {
	img {
		max-width: 1200px;
	}
	body {
		font-size: 30px;
	}
}
@media all and (max-width: 2000px) {
	img {
		max-width: 80%;
	}
	body {
		font-size: 20px;
	}
}
@media all and (max-width: 1200px) {
	img {
		max-width: 90%;
	}
	body {
		font-size: 17px;
	}
}
@media all and (max-width: 900px) {
	img {
		max-width: 90%;
	}
	body {
		font-size: 16px;
	}
}
@media all and (max-width: 800px) {
	img {
		max-width: 90%;
	}
	body {
		font-size: 16px;
	}
}
@media all and (max-width: 750px) {
	img {
		max-width: 85%;
	}
	body {
		font-size: 15px;
	}
}
@media all and (max-width: 700px) {
    aside {
        display:none;    /* Заставляет боковую колонку спрятать */
    }
	img {
		max-width: 90%;
	}
	body {
		font-size: 14px;
	}
}
@media all and (max-width: 450px) {
	img {
		max-width: 95%;
	}
	body {
		font-size: 12px;
	}
	#div_opisanie1{
		max-width: 70%;
	}
	#div_cleva1{
		max-width: 30%;
	}
}
@media all and (max-width: 300px) {
	img {
		max-width: 100%;
	}
	body {
		font-size: 11px;
	}
	#div_opisanie1{
		max-width: 60%;
	}
	#div_cleva1{
		max-width: 40%;
	}
}
