@charset "windows-1251";

@import url('style_cs.1784743907.css');

:root {
  /* Форум */
  --body: 1060px;
  --cpun: #dfdfdf;
  --bfon: url("https://forumstatic.ru/files/001c/85/52/51297.jpg") center top / auto no-repeat fixed;
  --logo: url(https://forumstatic.ru/files/001c/85/52/74550.png)  center top no-repeat;
  /* Основная навигация */
  --nav-padding-y: clamp(8px,calc(0.5vw + 6px),12px);
  --nav-padding-x: clamp(
    10px,calc(1vw + 5px),16px );
  --nav-z-index: 1000;
  /* Выпадающие меню */
  --dropdown-width: clamp(180px,calc(15vw + 60px),220px );
  --dropdown-padding: clamp(4px,calc(0.25vw + 3px),6px);
  --dropdown-link-y: clamp(
    7px,calc(0.25vw + 6px),9px);
  --dropdown-link-x: clamp( 10px, calc(0.5vw + 8px), 14px);
  /* Оформление меню */
  --dropdown-border: 1px;
  --dropdown-border-color: rgba(0, 0, 0, 0.15);
  --dropdown-background: var(--cpun);
  --dropdown-hover: rgba(0, 0, 0, 0.08);
  --dropdown-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
  --dropdown-speed: 0.2s;
}

*{
    margin: 0;
    padding: 0;
}
/* Общий фон */
body {
  background: var(--bfon);
}
#pun-title{
    background: var(--logo);
    height: 504px;
}

#pun-title .title-logo {
  display: none;
}
/* Адаптивная ширина форума */
#pun_wrap {
  width: var(--body);
  margin: 0 auto;
}
#pun-main{
  margin: 0 auto;
  width: 968px;
}
#pun {
 width: var(--body);
  margin: 0 auto;
  background: var(--cpun);
}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Горизонтальная навигация */
#pun-navlinks {
  position: relative;
}

#pun-navlinks > h2 {
  display: none;
}

#pun-navlinks > ul.container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
}

#pun-navlinks > ul.container > li {
  position: relative;
  margin: 0;
  padding: 0;
}

#pun-navlinks > ul.container > li > a {
  display: block;
  padding: var(--nav-padding-y) var(--nav-padding-x);
  white-space: nowrap;
  text-decoration: none;
}

/* Меню «Администрирование» */
#navadmin > .adminmenu,
#navprofile > .profilemenu {
  position: absolute;
  /* Нахлёст в 1px, чтобы меню не исчезало при наведении */
  top: calc(100% - var(--dropdown-border));
  left: 50%;
  z-index: calc(var(--nav-z-index) + 1);
  min-width: var(--dropdown-width);
  margin: 0;
  padding: var(--dropdown-padding) 0;
  list-style: none;
  background: var(--dropdown-background);
  border: var(--dropdown-border) solid var(--dropdown-border-color);
  box-shadow: var(--dropdown-shadow);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(-50%);
  transition: opacity var(--dropdown-speed) ease, visibility var(--dropdown-speed) ease;
}

#navadmin:hover > .adminmenu,
#navadmin:focus-within > .adminmenu,
#navprofile:hover > .profilemenu,
#navprofile:focus-within > .profilemenu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

#navadmin > .adminmenu > li,
#navprofile > .profilemenu > li {
 position: relative;
  margin: 0;
  padding: 0;
}

#navadmin .adminmenu a,
#navprofile .profilemenu a {
  display: block;
  padding:
    var(--dropdown-link-y)
    var(--dropdown-link-x);
  white-space: nowrap;
  text-decoration: none;
}

#navadmin .adminmenu a:hover,
#navprofile .profilemenu a:hover {
  background: var(--dropdown-hover);
}


/* Вложенные списки «Формы» и «Файлы» */
#navadmin .adminmenu li > ul {
  position: absolute;
  /* Подменю немного накладывается на родительское */
  top: calc(0px - var(--dropdown-border));
  left: calc(100% - var(--dropdown-border));
  z-index: calc(var(--nav-z-index) + 2);
  min-width: var(--dropdown-width);
  margin: 0;
  padding: var(--dropdown-padding) 0;
  background: var(--dropdown-background);
  border: var(--dropdown-border) solid var(--dropdown-border-color);
  box-shadow: var(--dropdown-shadow);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity var(--dropdown-speed) ease, visibility var(--dropdown-speed) ease;
}

#navadmin .adminmenu li:hover > ul,
#navadmin .adminmenu li:focus-within > ul {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/*Пользовательские ссылки*/
#pun-ulinks > ul.container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
}
#pun-ulinks > h2 {
  display: none;
}

#pun-ulinks > ul.container > li > a {
  display: block;
  padding: var(--nav-padding-y) var(--nav-padding-x);
  white-space: nowrap;
  text-decoration: none;
}