/* Сноски. Стиль. Сделано Kolobdur. Версия 3.1.
-------------------------------------------------------------*/

/* 1 */
html {
  scroll-behavior: smooth;
}

/* В посту и блок снизу
-------------------------------------------------------------*/

/* 2 */
.fn-ref sup {
  font-size: 0.5em;
  vertical-align: super;
  margin-left: 2px;
}

/* 3 */
.fn-post-block {
  font-size: 0.9em;
}

/* 4 */
.fn-post-block ol {
  padding-left: 18px;
}

/* 5 */
.fn-post-block li {
  margin-bottom: 4px;
}

/* 6 */
#pun-main .fn-post-block a.fn-back {
  text-shadow: none;
  font-size: 1.3em;
  font-family: 'Cambria';
  font-weight: 400;
  text-decoration: none;
  margin-left: 6px;
  color: #604b3d;
  transition: color 0.5s ease;
}

/* 7 */
#pun-main .fn-post-block a.fn-back:hover {
  color: #5a6f61;
  transition: color 0.5s ease;
}

/* 8 */
.fn-post-block:before {
  content: '--  --  --  --  --  --  --  --  --  --  --';
  display: block;
  height: auto;
  width: auto;
  padding: 0 0 4px;
  font-size: 1em;
  white-space: pre; 
  color: #393939;
}

/* Модальное окно сносок
-------------------------------------------------------------*/

/* 9 */
#fn-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 9999;
}

/* 10 */
#fn-modal h3,
#fn-modal h4,
.fn-insert-box h3,
.fn-close {
  margin: 0;
  font-variant: normal;
  font-family: Mason;
  font-weight: bold;
  letter-spacing: 1px;
  color: #606664;
  text-shadow: 0px 0px 0px #595751;
}

/* 11 */
#fn-modal h3,
.fn-insert-box h3 {
  text-align: center;
  font-size: 1.2em;
  text-transform: uppercase;
}

/* 12 */
#fn-modal h4 {
  font-size: 1em;
}

/* 13 */
#fn-modal ol, 
.fn-post-block ol {
  margin: 4px;
  padding-left: 10px;
  list-style-type: none;
}

/* 14 */
#fn-modal a {
  text-decoration: none;
  font-weight: 600;
  font-family: 'Cambria';
  font-size: 1em;
  letter-spacing: 0.4px;
  line-height: 1;
  color: #604b3d;
  transition: color 0.5s ease;
}

/* 15 */
#fn-modal a:active {
  color: #604b3d;
}

/* 16 */
#fn-modal a:hover,
.fn-close:hover {
  color: #5a6f61;
  transition: color 0.5s ease;
  cursor: url('https://forumstatic.ru/files/001c/63/69/56425.png'), default !important;
}

/* 17 */
#fn-modal li:before {
  font-family: 'Cambria';
  text-align: justify;
  color: #393939;
}

/* 18 */
#fn-modal.show {
  display: block;
}

/* 19 */
#fn-modal:not(.show) {
  display: none;
}

/* 20 */
.fn-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
}

/* 21 */
.fn-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 92%;
  max-width: 600px;
  max-height: 75vh;
  overflow: auto;
  padding: 20px;
  border-radius: 6px;
}

/* 22 */
.fn-close {
  position: absolute;
  right: 10px;
  top: 5px;
  font-size: 22px;
  cursor: pointer;
}

/* Модальное окно бб-кода
-------------------------------------------------------------*/

/* 23 */
.fn-insert-modal {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0,0.4); display: flex;
  justify-content: center; align-items: center; z-index: 9999;
}

/* 24 */
.fn-insert-box {
  padding: 15px; 
  border-radius: 6px;
  min-width: 280px; 
  max-width: 400px;
}

/* 25 */
.fn-insert-box h3 {
  margin-bottom: 10px;
}

/* 26 */
.fn-insert-box #fn-show-block {
  width: auto;
}

/* 27 */
.fn-insert-box .fn-buttons {
  text-align: right;
}

/* 28 */
.fn-insert-box #fn-word, 
.fn-insert-box #fn-text,
.fn-insert-box textarea {
  display: block;
  width: 97%;
  margin-bottom: 8px;
}

/* 29 */
.fn-insert-box #fn-word, 
.fn-insert-box #fn-text, 
.fn-insert-box textarea,
.fn-insert-box button {
  padding: 2px 5px 4px;
  font-family: 'Cambria';
  text-transform: none;
  font-size: 17px;
  font-weight: 400;
  color: #314037; 
  text-shadow: 0px 0px 1px #536259;
  background: url(https://forumstatic.ru/files/001c/62/de/34164.jpg) repeat transparent;
  box-shadow: inset rgba(0, 0, 0, 0.05) 0px 0px 5px, rgba(0, 0, 0, 0) 0px 0px 0px;
  border: 1.4px solid rgba(116, 91, 66, 0.6);
  border-radius: 4px;
  box-sizing: border-box;
}

/* 30 */
.fn-insert-box button {
  margin: 6px 0 0px 6px;
}

/* 31 */
.fn-insert-box button:hover {
  color: #615d48;
  background: url(https://forumstatic.ru/files/001c/62/de/68031.png) repeat;
}

/* 32 */
.fn-insert-box, .fn-box {
  color:#393939;
  box-shadow: inset 0 0 10px #3b3936, rgba(0, 0, 0, 0.2) 0px 0px 5px;
  background: url(https://forumstatic.ru/files/001c/62/de/43886.png) left top no-repeat,
              url(https://forumstatic.ru/files/001c/62/de/47034.png) right top no-repeat,
              url(https://forumstatic.ru/files/001c/62/de/19447.png) left bottom no-repeat,
              url(https://forumstatic.ru/files/001c/62/de/23635.png) right bottom no-repeat,
              url(https://forumstatic.ru/files/001c/62/de/97835.png) top center repeat-x,
              url(https://forumstatic.ru/files/001c/a1/65/97795.png) bottom center repeat-x,
              url(https://forumstatic.ru/files/001c/a1/65/31205.png) left center repeat-y,
              url(https://forumstatic.ru/files/001c/a1/65/79073.png) right center repeat-y,
              url(https://forumstatic.ru/files/001c/a1/65/20549.jpg) repeat transparent;

}

/* 33 */
#pun-main .post-body a.fn-ref,
#pun-main .post-body a.fn-ref:hover {
  position: relative;
  display: inline-block;
  text-align: justify;
  font-family: 'Cambria';
  font-size: inherit;
  font-weight: 600;
  line-height: 1;
  text-shadow: none;
  color: #445c4d;
}

/* 34 */
.fn-ref:after {
  background-color: #445c4d; /*задаём цвет линии*/
}

/* 35 */
.fn-ref:after {
  content: "";
  display: block;
  position: absolute;
  left: 0; /*изменить на right:0;, чтобы изменить направление подчёркивания */
  width: 0;/*задаём длинну линии до наведения курсора*/
  height: 1.5px; /*задаём ширину линии*/
  transition: width 0.3s ease-out; /*задаём время анимации*/
}

/* 36 */
.fn-ref:hover:after, 
.fn-ref:focus:after {
  width: 100%;
}

/* Названия
-------------------------------------------------------------*/

/* 37 */
#fn-modal h3:before {
  content: 'Сноски страницы';
}

/* 38 */
#fn-modal h4:before {
  content: 'Свиток ';
}