@font-face {
  font-family: Verdana;
  font-display: swap;
}
#body {
       margin:0px;
       padding:0px;
       height:100%;
       width:100%;
       font: 16px/24px Verdana, Geneva, sans-serif;
       font-size: 16px;
       color: #333;   /*цвет текста*/
       background-color: #1981bd;
       margin: 0 auto;
       }
h1,h2,h3{
        font-size: 18px;       
        }
p{
   font-size:16px;
  }
ul{
   margin:0;    /*Отступ списка*/
   padding:0;    /*Отступ списка*/
   list-style-position:inside;  /*Расположение списка*/
   line-height:26px;   /*Задаем отступ между строчками текста*/
   font-size: 16px;    /*Размер текста*/
   }
.colortext {
     color: white;
     background-color: #1981bd;
     font-size: 16px;
     padding: 0% 1% 0% 1%;
     border-radius:5px;
     }
.colortext1 {
     color: white;
     background-color: #1981bd;
     font-size: 18px;
     padding: 0% 1% 0% 1%;
     border-radius:5px;
     }
#imgobtekanie, #imgobtekanie2, #imgobtekanie3, #imgobtekanie4, #imgobtekanie5, #imgobtekanie6, #imgobtekanie7, #imgobtekanie8, #imgobtekanie9, #imgobtekanie10, #imgobtekanie11, #imgobtekanie12, #imgobtekanie13, #imgobtekanie14, #imgobtekanie15, #imgobtekanie16, #imgobtekanie17, #imgobtekanie18, #imgobtekanie19, #imgobtekanie20, #imgobtekanie21, #imgobtekanie22, #imgobtekanie23, #imgobtekanie24, #imgobtekanie25, #imgobtekanie26, #imgobtekanie27, #imgobtekanie28, #imgobtekanie29, #imgobtekanie30 {
               float:left;
               margin: 4px 10px 6px 0px;
               }
#container {
	   min-height: 100%;
	   width:1200px;
	   margin: 0 auto;
           }
#header {
	width:98%;
        margin-top: 10px;
        padding: 0% 1% 0% 1%;
        border-radius:10px;
        -webkit-border-radius:10px;
        -moz-border-radius:10px;
        -khtml-border-radius:10px;
        }
#content {
	  min-height: 100%;     /*высота блока*/
	  width: 800px;            /*Ширина блока*/
	  float: left;       /*Обтекание элементов*/
	  background:#FFFFFF;        /*Фоновый цвет блока*/
          margin-top: 10px;     /*Отступ блока от верхнего блока*/
          margin-bottom: 10px;     /*Отступ блока от нижнего блока*/
          padding: 0% 1% 0% 1%;  /*Отступ текста от краев сверху справа снизу слева*/
          border-radius:10px;   /*Закругление блока див*/
          -webkit-border-radius:10px;   /*Закругление блока див для поддержки в браузерах на основе webkit (Google Chrome и Safari).*/
          -moz-border-radius:10px;    /*Закругление блока див для поддержки в браузере Firefox. Без него будет просто квадрат*/
          -khtml-border-radius:10px;   /*Закругление блока див для поддержки в браузере Konquerer. Это из мира Linux.*/
          }
#sidebar {
          min-height: 100%;     /*высота блока*/
	  width: 27%;            /*Ширина блока*/
          min-width: 300px;      /*минимальная ширина правого блока*/
	  background:#FFFFFF;        /*Фоновый цвет блока*/
          float: right;      /*Обтекание элементов*/
          margin-top: 10px;     /*Отступ блока от верхнего блока*/
          margin-bottom: 10px;     /*Отступ блока от нижнего блока*/
          margin-left: 10px;     /*Отступ блока от левого блока*/
          padding: 0% 1% 0% 1%;  /*Отступ текста от краев сверху справа снизу слева*/
          border-radius:10px;   /*Закругление блока див*/
          -webkit-border-radius:10px;   /*Закругление блока див для поддержки в браузерах на основе webkit (Google Chrome и Safari).*/
          -moz-border-radius:10px;    /*Закругление блока див для поддержки в браузере Firefox. Без него будет просто квадрат*/
          -khtml-border-radius:10px;   /*Закругление блока див для поддержки в браузере Konquerer. Это из мира Linux.*/
          }
#footer {
	 width: 98%;
	 margin-bottom: 10px;
         clear: both;
         padding: 0% 1% 0% 1%;
         border-radius:10px;
         -webkit-border-radius:10px;
         -moz-border-radius:10px;
         -khtml-border-radius:10px;
         }


#stranici {
	   /*width: 100%;
           background-color: #FFFFFF;
	   margin-top: 10px;     /*Отступ блока от верхнего блока*/
           margin-bottom: 10px;     /*Отступ блока от нижнего блока*/
           border-style: solid;
           border-width:1px;
           border-color:#1981bd;
           border-radius:10px;          /*Закругление блока див*/
           -webkit-border-radius:10px;  /*Закругление блока див для поддержки в браузерах на основе webkit (Google Chrome и Safari).*/
           -moz-border-radius:10px;     /*Закругление блока див для поддержки в браузере Firefox. Без него будет просто квадрат*/
           -khtml-border-radius:10px;   /*Закругление блока див для поддержки в браузере Konquerer. Это из мира Linux.*/
           padding: 1px 3px 1px 3px;    /*Отступ внутри блока от краев сверху справа снизу слева*/
           overflow: hidden;       /*Чтоб блок див растягивался по высоте картинки*/
           }

@media screen and (min-width:100px) and (max-width:1024px) {
body #container {
                margin: 0 auto;
                width:95%;
                margin: 0 auto;   /* Выравнивание контейнера по центру*/
                
                }
body #header {
              width:100%;
              margin: 0 auto;   /* Выравнивание контейнера по центру*/
              margin-bottom: 10px;     /*Отступ блока от нижнего блока*/
              }
body #content {
               width:98%;
               margin: 0 auto;   /* Выравнивание контейнера по центру*/  
               margin-bottom: 10px;     /*Отступ блока от нижнего блока*/
               }
body #sidebar {
              width:98%;
              margin: 0 auto;   /* Выравнивание контейнера по центру*/
              margin-bottom: 10px;     /*Отступ блока от нижнего блока*/
              }
body #footer {
              width:100%;
              margin: 0 auto;   /* Выравнивание контейнера по центру*/
              margin-bottom: 10px;     /*Отступ блока от нижнего блока*/
              }
}
@media screen and (min-width:100px) and (max-width:768px) {
body #container {
                 margin: 0 auto;
                 width:95%;
                 margin: 0 auto;
                }
body #header {
              width:100%;
              margin: 0 auto;
              margin-bottom: 10px;
              }
body #content {
              width:98%; 
              margin: 0 auto;
              margin-bottom: 10px;
              }
body #sidebar {
              width:98%;
              margin: 0 auto;
              margin-bottom: 10px;
              }
body #footer {
              width:100%;  
              margin: 0 auto;
              margin-bottom: 10px;
              }
p{
   font: 20px/30px Verdana, Geneva, sans-serif;
   color: #222;   /*цвет текста*/
   font-weight:300;
   text-align:center;
   }
h1,h2,h3{
        font-size: 22px;       
        text-align:center;
        }
ul{
   margin:0;    /*Отступ списка*/
   padding:0;    /*Отступ списка*/
   list-style-position:inside;  /*Расположение списка*/
   line-height:32px;   /*Задаем отступ между строчками текста*/
   font-size: 20px;
   font-weight:300;
  }
}