body, html {
margin:0px; /*Это хорошая практика обнулять поля и отсупы, т.к. различные браузеры их по разному воспринимают. */
padding:0px;
text-align:center; /*Выравниваем макет по центру в старых версиях браузеров */
background-image:url(img/background.gif);
}
a { 
text-decoration: none; /* ЋтменЯем подчеркивание у ссылки */
   } 
A:visited {
color: #rgba(0, 170, 238, 0.9); /* –вет посещенной ссылки */
   }
#container{
margin:0 auto;  /*выравниваем макет по центру в современных браузерах */
text-align:left;  /*Отменяем tex-align:center заданное в Body. Делаем чтобы весь текст в макете выравнивался по левому краю */
font-weight: bold;
 /*min-width:550px; задаем минимальную ширину макета в современных браузерах */
width:expression(   /*задаем минимальную ширину макета в старых версия браузера. Просто замените цифру на свою шиирину :) */
(document.compatMode && document.compatMode == 'CSS1Compat')
?
(
document.documentElement.clientWidth < 550
?
"550px"
:
"auto"
)
:
(
document.body.clientWidth < 550
?
"550px"
:
"auto"
)
);
}
.row {
  display: flex;
  flex-direction: row;   /* по умолчанию, можно не писать */
  align-items: stretch;  /* по умолчанию, можно не писать */
}
/*Здесь пишем стили для шапки сайта */
#nado{
width:100%;
height:20px;
background:url(img/background.gif);
}
#verx{
width: 640px;
font-weight:bold;
position: absolute;
left:35%;
top: 3%;
font-size:22px;
color: #c9adc9;
font-weight:bold;
color: #c9adc9;
}


#header{
width:100%;
height: 145px;
background:url(img/1.png);
position: relative;
}
#header2 h1 {
margin: 0;  Обнуляем отсупы для заголовка первого уровня, находящегося в шапке. Это нужно обязательно делать, при использовании заголовков. Если используются параграфы, то тоже нужно обнулить отсупы для них. */
padding: 10px 0px; /* Задаем поля */
}
#pp {
font-size: calc(40px + 16 * (100vw / 1280)); 
 color: #ffff00;
}
#poisk2
 {
width:65%;
margin-top:5px;
}
#sea {
width:64%;
height:20px;
}
/*#bot {
width: 21%;
margin:0;
padding:0;
position: absolute;
top: 16%;    
left: 5px;
z-index: 3;
}
#bot3 {
display:none;
}
*/
#bot {
width: 127%;
margin:0;
padding:0;
position: absolute;
top: 125%;    
right: 1px;
z-index: 3;
}
#bot2 {
  width: 80%;
    display: block;
    margin-left: auto;
    margin-right: auto; 
border-radius: 15px;
}
#bu {
  width:10%;
  position:absolute;
  left:3%;
}
#gerb {
width: 250px;
margin:0;
padding:0;
position: absolute;
top: 30%;    
left: 83%;
z-index: 3;
}
#gerb img {
width: 73%;
border:none;
}
#null {
position: fixed;
top: 86%;
left: 94%;
}
#null img {
width: 70px;
height: 70px;
}
#null img:hover {
    background: url(img/love.png);
}

#right{
width:19%;
padding:1%;
margin-top:1%;
margin-left:1%;
background: url(img/bg.jpg);
-moz-border-radius:18px 18px 18px 18px;
-khtml-border-radius:18px 18px 18px 18px;
-webkit-border-radius:18px 18px 18px 18px;
border-radius:18px 18px 18px 18px;
}

#left{
width:18%;
padding:1%;
margin:30px 0px;
background: url(img1/1.png);
position: absolute;
float:left;  /*обязательное выравнивание по левому краю,с включением обтекания*/
-moz-border-radius:18px 18px 0px 0px;
-khtml-border-radius:18px 18px 0px 0px;
-webkit-border-radius:18px 18px 0px 0px;
border-radius:0px 18px 18px 0px;
}
#le{
width:240px;
margin-top: 4%;
margin-bottom: -4%;
background:url(img/13245.jpg);
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius:10px;
min-width:200px;
display: none;
}
#le li{
width: 240px;
font-size:16px;
margin-left:15px;
padding: 10px 0 10px;
list-style-image: url(img/55.png);   

    padding-bottom: 0;
    margin-bottom: -10px;
    margin-top: 0;
    padding-top: 0;
}
#le1 a{padding-left: 15px;color:#f5f555;}
#le1 li:hover{
cursor: pointer;
}
#le1 li a:hover{color:#CE0;}
li a img {
margin-left: 90px;
margin-top: -40px;
border:none;
}

#menu { /* Меню */
  width:86%;
  height:20px;
margin:2% 7%;
     background: url(img/1.png);
     -moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius:10px;
padding: 10px 0 10px;
border-color:#ffff00;
}
#menu li{
	 display: inline-block;
     vertical-align: middle;
     margin-right: 5%;
     color:#f5f555;
     background:url(img/13245.jpg);
} /* Меню */
a.menu-item {
color: #f5f511;
text-decoration: none;
font-size: calc(8px + 10 * (100vw / 1280));
}
#soc {
margin-top:3%;
margin-left: 94%;
position: fixed;
z-index: 3;
}



#content{ /*Стили для блока контента */
width:64%;
padding:0% 5% 0% 5%;
margin-top:1%;
margin-left:2%;	
background: url(img/bg.jpg);
-moz-border-radius:18px 18px 7px 7px;
-khtml-border-radius:18px 18px 7px 7px;
-webkit-border-radius:18px 18px 7px 7px;
border-radius:18px 18px 7px 7px;
font-size: 18px;
text-align: justify;
}
#izdok {
font-size: 22px;
font-family: "B52",Georgia,serif;
}

#content p {
margin:0px; /* Обнуляем отсупы для параграфов я, находящегося в блоке контента.*/
font-size: 110%;
}
#content h1 {
margin:0px; /* Обнуляем отсупы для заголовка первого уровня, находящегося в блоке контента.*/
padding: 20px;
} 

h1 {
font-size: 30px;
margin-left:7%;
color: #000;
font-weight: normal;
margin: 0;
font-family: "B52",Georgia,serif;
 text-align: center;
}
b.zag2 {
font-size: 160%;
color: #000;
font-weight: normal;
font-family: "B52",Georgia,serif;
display: block;
text-align: center;
}
h2 {
	text-align: center;
 font-family: "B52",Georgia,serif;
 }
@font-face {
font-family: "B52";
font-style: normal;
font-weight: 400;
font-display: swap;
/* font-display: swap рекомендуется использовать для заголовков */
  src: local("/fonts/B52.ttf"),
       url("fonts/B52/B52.woff2") format("woff2"),
       url("/fonts/B52/B52.woff") format("woff");
}


img.cifri {
width:40%;
margin-top:1%;
margin-bottom:2%;  
}
img.cifri1{
  width: 200px;
  margin-bottom:10px;
}

img.cifri2 {
 width: 300px;
  margin-bottom:10px; 
}
img.cifri3 {
 width: 400px;
  margin-bottom:10px; 
}
img.rv {
   width:85%;
   border-radius: 10px;
    box-shadow: 0 0 12px 5px #ffff00
}

p.slova {
  margin-top:-6%;
  margin-left:54%;
  margin-bottom:2%;
}


#knopka {
  margin:1% 10%;
}

#map { /*Карта*/
width: 90%;  
}
#vnimanie {
	width: 90%;
  padding:1% 5%;
  padding: 1% 3% 1% 3%;
  margin-left:6%;
  border: 5px solid red;
   border-radius: 10px;
   text-align:center;
}

#button2 {
  width: 94%;
}
#zak {
  width: 92%;
  margin: 1%;
    border: none;
    border-radius: 7px;
    padding: 10px 25px;
    background: #ff9900;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: bold;
    color: white;
}




#button3 {
  width: 72%;
  margin-left:14%;
}
#pam {
  position: absolute;
  left:20%;
  width: 130px;
}

#glavaa { /*Контент */
  position: absolute;
  left:15%;
  width: 100px;
  margin-top: -34px;
}
#glava {
  border-bottom: 1px solid #a2a9b1;
}
#name {
  width: 78%;
  border-bottom: 1px solid #a2a9b1;
}

#lifebar {
  width: 50%;
  margin-left: 25%;
}

#life {
  width: 98%;
}


#rek {
  width: 90%;
  height: 200px;
}
#jena {
    border-bottom: 1px solid #a2a9b1;
}
#jenaa {
 position: absolute;
  width: 70px;
  margin-top:-6%;
  left: 15%;
}
img.deti {
  width: 30%;
}
p.vivod {
font-size: 1.5em;
}



p.zag {
text-align: center;
}
img.foto {
width: 74%;
margin-left: 10%;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
border: 10px solid #eee;
/*transition*/
}
img.foto:hover {
/*свечение*/
-webkit-box-shadow: 0px 0px 90px rgba(0,0,0,0.8);
-moz-box-shadow: 0px 0px 20px rgba(0,0,0,0.8);
box-shadow: 0px 0px 90px rgba(0,0,0,0.8);
}
img.nepropustite {
width: 320px;
width: 24%;
position: absolute;
top: 35%;
left: 76%;
}

#nizshou {
margin-top: 7%;
text-align: center;
}
#nizshou a {
text-decoration: none;
text-shadow: 3px 3px 10px red,-3px -3px 7px yellow;
}




#infoseo {
  padding: 10px 2px 10px 2px;
  border-radius: 10px;
    box-shadow: 0 0 12px 5px red;
    text-indent: 30px;
}



#drevo2 { /* Древо */
width: 100%; 
border: 10px solid transparent;
border-image: linear-gradient(to right, transparent 0%, #ffff00 100%);
border-image-slice: 1;
}
#drevo2 tbody td { text-align: center }
td.pokl0 {
  text-transform: uppercase;
  color: green;
}
td.pokl1 {
  text-transform: uppercase;
  color: #ff0000;
}
td.period {
  width: 16%;
  color: #ff0000;
}
td.stlb2 {
    width: 16%;
}
tbody tr td {
  width:30%;
  padding-top: 22px;
}
td.stlb3 {
  color: #0000ff;
}
td.pokl8 {
  color: #ff00ff;
}
td.pokl9 {
    width: 16%;
  color: #bf9000
}/* Древо */


 
 button[name="run_script"] { 
    border: none;
    border-radius: 7px;
    padding: 10px 25px;
    background: #ff9900;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: bold;
    color: white;
  }
  button[name="run_script"]:hover { 
    background: #ff6600;
  }
#zakazat {
  margin: 1% 14%;
  border: none;
    border-radius: 7px;
    padding: 10px 25px;
    background: #ff9900;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: bold;
    color: white;
}
#zakazat a {
  border: none;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: bold;
    color: white;
}



.primerimg {
width: 70%;
border-radius: 10px;
box-shadow: 0 0 12px 5px #ffff00;
text-indent: 30px;
}
#primer2 img{width: 90%;}


#pstrnav {
  width: 86%;
  background: url(img/1.png);
  border-radius: 10px;
  margin-top: 1%;
  text-align: center;
}
#pstrnav_activ {
  text-decoration: none;
  display: inline-block;
  font-weight: bold;
  background: #FF2727;
  border: 1px solid #fff;
  box-shadow: 0 0 0 1px #FF2727;
  color: #fff;
  padding: 6px 14px;
  margin: 1px 3px;
}
#pstrnav a {
  text-decoration: none;
  color: #f5f511;
  padding: 6px 12px;
  margin: 2px 3px;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
#pstrnav a:hover {
  background: #FF2727;
  color: #fff;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.hide { /*adm*/
  display: none;
}
input.let {
  width: 50px;
}
#gsm {
   width: 103px;
}
#dochaa {
  width: 250px;
}
textarea.textarea {
   width: 280px;
}
textarea.textarea2 {
     width: 290px;
}
input.raz {
  width: 45px;
}
table.iksweb{
	width: 100%;
	border-collapse:collapse;
	border-spacing:0;
	height: auto;
}
table.iksweb,table.iksweb td, table.iksweb th {
	border: 1px solid #595959;
}
table.iksweb td,table.iksweb th {
	padding: 3px;
	width: 30px;
	height: 35px;
}
table.iksweb th {
	background: #347c99; 
	color: #fff; 
	font-weight: normal;
}
#dop {
 
}
#okno {
height: 150px;
}
.hrondeti {
  margin-left: 15%;
}
#hrondata {
 color: red;
 font-weight: 900;
 font-size: 150%;
}
table.iks2{
	width: 100%;
	border-collapse:collapse;
	border-spacing:0;
	height: auto;
}
table.iksweb,table.iksweb td, table.iksweb th {
	border: 1px solid #595959;
}
table.iksweb td,table.iksweb th {
	padding: 3px;
	width: 90px;
	height: 35px;
}
table.iksweb th {
	background: #347c99; 
	color: #fff; 
	font-weight: normal;
}
.textarea {
   width: 60%;
     height: 30px;
}
.textarea2 {
   width: 60%;
   height: 80px;
} /*adm*/



#clear{ /*атрибут, который опускает подвал сайта ниже всех блоков. Нужен для корректной работы макета. */
height:0;
font-size:1px;
line-height:0px;
clear:both;
}

#foot{ /* Стили для подвала сайта */
width: 94%;
clear: both;
margin: 15px auto 0;
margin-bottom:10px;
height: 1px;
position: relative;
border-top: 1px solid #c1bfc0;
}
#footer{
background-color:;
}
#copyright p{
margin:0px;  /* обнуляем отступы*/
padding: 5px; /*  задаем поля */
padding-bottom: 15px;
font-weight:bold;
font-size:18px;
text-align: center;
/* color: #c9adc9;*/
color:#ffff00;
}
 



.main-indicator{ /* Индикатор жизни */
    display: block;
    width: 92%;
    height: 100px;
    text-align: center;
}
::-webkit-progress-bar {
    background: rgb(172, 172, 166);
    border-radius: 8px;
}
::-webkit-progress-value {
    background: orange;
}
::-moz-progress-bar {
    background: orange;
}
progress {
    display: block;
    color: orange;
    background: rgb(172, 172, 166); 
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 99%;
    height: 20px;
    line-height: 20px;
    font-size: 16px;
    border-radius: 8px;
    border: 2px solid orange;
}
.button1 {
  border: none;
  color: white;
  font-size: 14px;
  margin: 10px 1px;
  padding: 8px 18px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  transition-duration: 0.4s;
  cursor: pointer;
}
.button-new {
  background: #ff9900;
  color: black;
  border-radius: 12px;
  border: 3px solid orange;
}
.button-new:hover {
  background-color: orange;
  color: white;
} /* Индикатор жизни */





#otprav {
  width: 99%;
  height: 4%;
}

.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}


img.404 {
  margin-left:-20%;
}

#telegram {
  width: 50px;
  height: 50px;
  background: url(img/soc.png) top left 20%/300px 50px no-repeat;	
}
#vk { /* Контакты */
  width: 50px;
  height: 50px;
  background: url(img/soc.png) top left/300px 50px no-repeat;
}
#ok {
  width: 50px;
  height: 50px;
  background: url(img/soc.png) top right/300px 50px no-repeat;
}
#youtube {
  width: 50px;
  height: 50px;
  background: url(img/soc.png) top left 80%/300px 50px no-repeat;
}
#inst {
  width: 50px;
  height: 50px;
  background: url(img/soc.png) top left 60% /300px 50px no-repeat;
}
#avito {
  width: 50px;
  height: 50px;
  background: url(img/soc.png) top left 40% /300px 50px no-repeat;
}
#mapkontakt {
      border-radius: 10px;
    box-shadow: 0 0 12px 5px #ffff00;
} /* Контакты */


@media (max-width:975px){ /* Размер экрана 975 */
#header{height: 200px;}
#gerb{display: none;}
#right{display: none;}
#poisk{text-align: center;}
#content (font-size: 16px;)
.gadavuden {padding: 1px 0px;}
#pp {font-size: 2em;}
.pic{display: none;}
#null {display: none;}
h1.zag { text-align:centrer;}
#le{margin-bottom: -14%;}
#menu {bottom: -33%;}
a.menu-item {font-size: calc(8px + 16 * (100vw / 1280));}
#drevo2{border-radius: 10px; box-shadow: 0 0 12px 5px #ffff00; margin-left: -7%;}
td.period {padding-right:0px;}
td.stlb2 {padding-right: 0px;}
tbody tr td {padding-top: 15px;}
#copyright p {font-size: 1.1em;}

} 

@media (max-width:775px){ /* Размер экрана 775 */	
#m1{display: none;}
img.tovar {width: 100%;}
.gadavuden {padding: 1px 0px;}
}

@media (max-width:577px){
#header{height: 150px;}
#right{display: none;}
#content {width: 88%; padding: 0% 1% 1% 1%; margin-top: 4%; margin-left: 5%; font-size: 18px;}
h1{font-size: 25px;}
#menu {width:100%; margin:2% 0%;}
#menu li{margin-right: 2%;}
a.menu-item {font-size: calc(12px + 20 * (100vw / 1280));}
#soc {margin-left: 89%;}
.primerimg {width: 100%;}
.gadavuden {padding: 1px 0px;}
.dongadevug { width: 100%;}
.sumbnag img {height: 300px;}
#m1{display: none;}
#m3{display: none;}
#poisk { margin-top:0px;}
#pp { font-size: calc(32px + 16 * (100vw / 1280));}
#poisk2{width: 100%;}
img.cifri {width:90%;margin-bottom:4%;}
#drevo2 {margin-left: -8%; border: 0px solid transparent; font-size: calc(8px + 20 * (100vw / 1280));}
.vanilla-zoom {box-shadow: none;}
h4.card-title text-center text-info {font-size: 50px;}
h4 {  font-size: 22px;}
}




#my-gallery {
    max-width: 1200px;
    margin: 0 auto;
}
img { max-width:100%; }
a {
	-webkit-transition: all 150ms ease;
	-moz-transition: all 150ms ease;
	-ms-transition: all 150ms ease;
	-o-transition: all 150ms ease;
	transition: all 150ms ease; 
	}
    a:hover {
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* IE 8 */
        filter: alpha(opacity=50); /* IE7 */
        opacity: 0.6;
        text-decoration: none;
    }

p.opis {
  text-align: justify;
}


#carousel-magaz { /*Слайдер*/
    margin: 40px 0 20px;
    border-top: 4px solid #FF0000;
    border-bottom: 4px solid #FF0000;
    width: 100%;   
}




#sozdistr { /*Создавайте а мы вам в этом поможем*/
  width: 100%;
  margin-top:1%;
}
#sozdistr2 {
  padding:10px 10px;
  text-align: center;
  border-bottom: 1px solid #a2a9b1;
}

.text-info { /*Магазин*/
  height: 23px;
}
td.avito {
    padding: 0px;
    margin:0px; 
}
table.iksweb24 {
  width: 100%;
  border-style: dashed;
  border: 3px dashed #ffff00;
}


#contactseti {
  width: 30%;
}

img.rod-img { /*Род*/
display: block;
margin-left: auto;
margin-right: auto
}
.gerb2 {
display: block;
margin-left: auto;
margin-right: auto
}



#red {
  color: #ff0000;
}
#seckey {
  width: 60%;
  margin:2%;
}

.result {
  background-color: #E1E3E5;
  border-radius: 10px;
  border-bottom: 1px solid #a2a9b1;
}
.container {
  border-bottom: 1px solid #a2a9b1;
}

div.search-box {
   background-color: #E1E3E5;
}
/* ФОТОДОКУМЕНТЫ */
p.fototext2 {
  text-align: center;
}

p.fototext {
text-align: center;
}

img.fotodoc {
  width:80%;
}

p.opis {
    text-indent: 20px; /* Отступ первой строки в пикселах */
}
table.name {
text-decoration: none;border-collapse:collapse;width:100%;text-align:center;
}

table.name{text-decoration: none;border-collapse:collapse;width:100%;text-align:center;}
table.name th{font-weight:normal;font-size:14px; color:#000000;background-color:#ffffff;}
table.name tr:hover td{color:#000000;cursor:default;
table.name th{font-weight:normal;font-size:14px; color:#ffffff;background-color:#000000;}}


img.card-img-top {
  margin-bottom: -15px;
}