@font-face {
font-family: 'PlayfairVariable';
  src: url('../../fonts/Playfair/PlayfairDisplay-VariableFont_wght.ttf') format('truetype');  
  font-weight: normal;
  font-style: normal;  
}

@font-face {
font-family: 'EBGaramond-Variable';
  src: url('../../fonts/EB Garamond/EBGaramond-VariableFont_wght.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
/*
@font-face {
  font-family: 'Glyphter';
  src: url('../fonts/Glyphter.eot');
  src: url('../fonts/Glyphter?#iefix') format('embedded-opentype'), 
       url('../fonts/Glyphter.woff') format('woff'), 
       url('../fonts/Glyphter.ttf') format('truetype'), 
       url('../fonts/Glyphter.svg#Glyphter') format('svg');
  font-weight: normal;
  font-style: normal;
}
*/
 body{
            background: transparent url(bgnoise_lg.png); 
            /* background-color:white; */            
            margin:0px;
            /* padding:120px 0px 0px; */
            
            /* font-family:"Trebuchet MS"; */
            font-family: "PlayfairVariable";
            font-size: 150%;
            color:#555;
        }
        .content{
            width:800px;
            padding:30px;
            position:relative;
            /* (!) мое изменение для показа */
            /*position:absolute;*/
            top:40px;
            left:10%;
            right:20%;
            background-color:#fff;
            text-align:justify;
            -moz-border-radius:30px;
            -webkit-border-radius:30px;
            border:2px solid #777;            

        }
        h1, h2, h3{
            text-align: justify;
            border-bottom:1px dashed #ccc;
            padding:20px;
        }
        blockquote{
            background-color:#f0f0f0;
            padding:10px;
            font-style:italic;
        }
        a.back{
            /* background:transparent url(CILLogo.gif) no-repeat top left; */
            background:transparent url(CILLogo.gif) 100%/100% ;
            position:absolute;
            top:5px;
            right:5px;
            width:300px;
            height:50px;
        }

/* мои добавления к стилям */
/* из htmlbook.ru */
.sign {
    float: right; /* Выравнивание по правому краю */
    border: 1px solid #333; /* Параметры рамки */
    padding: 7px; /* Поля внутри блока */
    margin: 10px 0 5px 5px; /* Отступы вокруг */
    background: #f0f0f0; /* Цвет фона */ 
   }
.sign figcaption {
    margin: 0 auto 5px; /* Отступы вокруг абзаца */
   }
   
/* настройки взяты из myblog-bodo-style.css */
/* конфликтуют с настройками из index.html (myblog.html) */
a {
  color: #2f2f2f;
  text-decoration: none;
  transition: ease .6s;
  -webkit-transition: ease .6s;
  -moz-transition: ease .6s;
  -o-transition: ease .6s;
  -ms-transition: ease .6s;
}
a:hover {
  text-decoration: none;
  color: #818181;
}
a:focus {
  outline: none;
  color: #999999;
  text-decoration: none;
}
.socials{
  width: 100%;
  margin: 0;
  padding: 0;
}

.socials * {
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

.socials li {
  display: inline-block;
  list-style: outside none none;
  float: left;
  overflow: hidden;
  /* редактирование подразделения ссылок на всю ширину */
  width: 50%;
  /*width: 33.33333%;*/
  font-size: 100%;
  /*font-size: 13px;*/
}

.socials a {
  padding: 0.3em 0.8em;
  color: rgba(255, 255, 255, 0.7);
  position: relative;
  display: inline-block;
  letter-spacing: 1px;
  margin: 0;
  text-decoration: none;
  padding: 25px 0;
  width: 100%;
}

.socials a:before,
.socials a:after {
  position: absolute;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

.socials a:before {
  bottom: 100%;
  display: block;
  height: 3px;
  width: 100%;
  content: "";
}

.socials a:after {
  padding: 0.3em 0.8em;
  position: absolute;
  bottom: 100%;
  left: 0;
  content: attr(data-hover);
  color: white;
  white-space: nowrap;
  width: 100%;
  padding: 25px 0;
}

.socials li:hover a,
.socials .current a {
  transform: translateY(100%);
}

.facebook{
  background: #969696;
  /*padding: 20px 0;*/
}
.facebook a:after{
  background-color: #527bbb;
}
.twitter{
  background: #ABABAB;
}
.twitter a:after{
  background-color: #77ccf1;
}
.gplus{
  background: #d8d8d8;
}
.gplus a:after{
  background: #dd4b39;
}

.footer-top{  
  width: 100%;
  text-align: center;
  color: #cccccc;
  display: table;
}

.footer-bottom{
  width: 100%;
  text-align: center;
  background: #2f2f2f;
  padding: 80px 0;
  color: #636363;
}
/* конец настроек, взятых из myblog-bodo-style.css */

.nav_up{
	padding:7px;
    /* фоновый цвет не отображается ? */
	background-color: green;
	border:1px solid #CCC;
	position:fixed;
	/* background:transparent url(arrow_up.png) no-repeat top left; */
    background: url(arrow_up.png) 100%/100%;
    
	background-position:50% 50%;
	width:50px;
	height:50px;
    /* расстояние стрелки снизу от края экрана, фиксированное */
	bottom:400px;
	opacity:0.7;
    /* расстояние стрелки слева от края экрана, фиксированное */
	left:30px;
	white-space:nowrap;
	cursor: pointer;
	-moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-top-left-radius:3px;
	-webkit-border-top-right-radius:3px;
    -khtml-border-top-left-radius:3px;
	-khtml-border-top-right-radius:3px;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.nav_down{
	padding:7px;
	background-color: RGB(0, 255, 0);
	border:1px solid #CCC;
	position:fixed;
	/*background:transparent url(arrow_down.png) no-repeat top left;*/
    background: transparent url(arrow_down.png) 100%/100%;
    
	background-position:50% 50%;
	width:50px;
	height:50px;
    /* расстояние стрелки снизу от края экрана, фиксированное */
	bottom:200px;
	opacity:0.7;
    /* расстояние стрелки слева от края экрана, фиксированное */
	left:30px;
	white-space:nowrap;
	cursor: pointer;
	-moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-top-left-radius:3px;
	-webkit-border-top-right-radius:3px;
    -khtml-border-top-left-radius:3px;
	-khtml-border-top-right-radius:3px;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}