MediaWiki:Common.css

/* Стили для инфобокса */
.infobox {
    background-color: #f9f9f9; 
    border: 1px solid #aaa; 
    border-radius: 10px; 
    padding: 10px; 
}

.skin-citizen-dark .portable-infobox {
    background: hsl(215deg 5% 15% / 31%);
}
.portable-infobox {
    float: left;
    margin: 0px 33px 26px 00px;
    width: var(--pi-width);
    border-radius: 10px;
}
@media only screen and (max-width: 700px) {
.portable-infobox {
    width: 100%;
}
}

/* Стили для заголовка инфобокса */
.infobox-title {
    font-size: 1.2em; 
    font-weight: bold; 
}

/* Стили для изображения в инфобоксе */
.infobox-image {
    max-width: 100%; 
    border-radius: 5px; 
    margin-bottom: 10px; 
}

/* Стили для подписи изображения в инфобоксе */
.infobox-caption {
    font-style: italic; 
    color: #666; 
}
#p-navigation .pBody ul li#n-createpage a:before {
    content: "\f15b"; 
    font-family: FontAwesome; 
    margin-right: 5px; 
}
.parallax-bg {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vh;
    overflow: hidden;
    position: relative;
}

.parallax-bg::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.5); 
}

.parallax-content {
    position: relative;
    z-index: 1;
}

/* Дароу =) */

/* Общий стиль контейнера кнопок */
.wiki-buttons-container {
  text-align: center; 
}

/* Общий стиль кнопок */
.wiki-button {
  position: relative;
  display: inline-block;
  width: calc(100% / 5 - 20px); 
  height: 100px;
  margin: 10px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-size: 17px; 
  line-height: 80px;
  border-radius: 12px;
  overflow: hidden;
  transition: background-color 0.3s ease-in-out;
}

/* Стиль для фона при наведении */
.wiki-button::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  filter: grayscale(0%);
  transition: filter 0.3s ease-in-out;
}

/* Анимация чёрно-белого фона при наведении */
.wiki-button:hover::before {
  filter: grayscale(100%);
}

/* Специфичные стили для каждой кнопки */
.wiki-button.multfilms::before { background-image: url('https://static.miraheze.org/lostmediaruwiki/d/d1/Dedek_%282%29.jpg'); }
.wiki-button.games::before { background-image: url('https://static.miraheze.org/lostmediaruwiki/d/df/2TW2001_%281%29.png'); }
.wiki-button.movies::before { background-image: url('https://static.miraheze.org/lostmediaruwiki/d/d0/472578478578477.jpg'); }
.wiki-button.shows::before { background-image: url('https://static.miraheze.org/lostmediaruwiki/1/1d/Категория_телепередачи.png'); }
.wiki-button.cultmedia::before { background-image: url('https://static.miraheze.org/lostmediaruwiki/9/95/Screenshot_420.png'); }




@media only screen and (min-width: 800px) {
  .wiki-button2 {
    position: relative;
    display: inline-block;
    width: calc(20% - 20px); 
    height: 50px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 17px; 
    line-height: 80px;
    border-radius: 12px;
    overflow: hidden;
    transition: background-color 0.3s ease-in-out;
    margin: 10px; 
  }

  .wiki-button2::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: 1px; 
    background-color: rgba(255, 255, 255, 0.3); 
    border-radius: 12px; 
    transition: height 0.3s ease-in-out;
  }

  .wiki-button2:hover::after {
    height: 10px; 
  }
}



/* Стиль для текста внутри кнопок */
.wiki-button .button-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  width: 100%;
  text-align: center;
  font-weight: bold; 
  text-shadow: 0 8px 16px rgba(0, 0, 0, 0.4); 
}


/* Медиа-запрос для смартфонов (максимальная ширина 767px) */
@media only screen and (max-width: 767px) {
  .wiki-button {
    width: 97%; /* ширина кнопок для смартфонов */
    height: 90px; /* высота кнопок для смартфонов */
    line-height: 60px; /* выравниваем по вертикали */
    font-size: 21px;
    margin: 10px auto; /* выравнивание по центру */
  }
}

/* Стиль для контейнера кнопок на смартфонах */
@media only screen and (max-width: 767px) {
  .wiki-buttons-container {
    text-align: center;
  }
}



/* Общий стиль контейнера кнопок */
.wiki-buttons-container {
  text-align: center; 
  margin: 10px -10px 10px; 
}

/* Общий стиль кнопок */
.wiki-button2 {
  position: relative;
  display: inline-block;
  width: calc(20% - 20px); 
  height: 50px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-size: 17px; 
  line-height: 80px;
  border-radius: 12px;
  overflow: hidden;
  transition: background-color 0.3s ease-in-out;
  margin: 10px; 
}

/* Стиль фона при наведении */
.wiki-button2::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  filter: grayscale(0%);
  transition: filter 0.3s ease-in-out;
}

/* Анимация фона при наведении */
.wiki-button2:hover::before {
  filter: grayscale(100%);
}

/* стили для каждой кнопки */
.wiki-button2.oth::before { background-image: linear-gradient(to bottom right, #6A7C85 0%,  #2f4147 100%); }
.wiki-button2.discord::before { background-image: linear-gradient(to bottom right, #5865F2 0%, #341dcc 100%); }
.wiki-button2.youtube::before { background-image: linear-gradient(to bottom right, #FF0000 0%, #CB2027 100%); }
.wiki-button2.vk::before { background-image: linear-gradient(to bottom right, #4A76A8 0%, #4A76A8 100%); }
.wiki-button2.tg::before { background-image: linear-gradient(to bottom right, #0088cc 0%, #00a5df 100%); }


/* Стиль для текста кнопок */
.wiki-button2 .button-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  width: 100%;
  text-align: center;
  font-weight: bold; 
  text-shadow: 0 8px 16px rgba(0, 0, 0, 0.4); 
}

.page-Заглавная_страница .plainlinks a {
  color: white !important; 
}

.page-Заглавная_страница .plainlinks a:hover {
  color: #ededed !important; 
}

figure[typeof~='mw:File/Thumb'],
figure[typeof~='mw:File/Frame'] {
  display: table;
  margin: var(--space-xs) auto var(--space-md) auto;
  font-size: 0.8125rem;
  text-align: center;
}

figure {
  margin: 0;
}

*, *::before, *::after {
  box-sizing: inherit;
}

 body.page-Заглавная_страница .mw-body-header {
  display: none;
}

@media only screen and (max-width: 767px) {
	
	  figure[typeof~='mw:File/Thumb'],
  figure[typeof~='mw:File/Frame'] {
    display: block;
    margin: 10px auto;
  }

  figure[typeof~='mw:File/Thumb'] img,
  figure[typeof~='mw:File/Frame'] img {
    width: 100%; 
    margin: 10px 0; 
    height: auto; 
    max-width: initial; 
  }
	
  .wiki-button2 {
    width: 97%; /* ширина кнопок */
    height: 50px; /* высота кнопок */
    line-height: 60px;
    font-size: 21px;
    font-size: 16px;
    margin: 10px auto 3px auto; 
  }
  .page-Заглавная_страница #unique-heading {
  margin-top: 0;
}
	

}

@media only screen and (max-width: 767px) {
  .wiki-buttons-container {
    text-align: center;
  }
}


#profile-image {
    overflow: hidden;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin: 0 15px 18px 0;
}

#profile-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    background-color: #fff;
    border: 0 solid #dcdcdc;
    padding: 0;
}



#profile-toggle-button a,
.profile-actions a,
.user-section-actions a {
    display: inline-block;
    padding: 7px 14px;
    margin: 5px;
    border: 1px solid hsl(0deg 0% 35.75%);
    border-radius: 7px;
    text-decoration: none;
    color: hsl(0deg 0% 55.34%);
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
}

#profile-toggle-button a:hover,
.profile-actions a:hover,
.user-section-actions a:hover {
    background-color: #ffbf00;
    color: #fff;
}

.user-section-actions a {
    margin-right: -5px;
}

#user-page-right .user-section-actions a {
    margin-bottom: 10px;
}

.user-section-heading {
    margin-bottom: 15px;
}

#profile-toggle-button a {
    margin-right: 10px;
}

.user-section-title {
    margin-bottom: 10px;
}

#profile-toggle-button {
    display: none;
}

.profile-actions {
    margin-top: 35px;
}

#user-page-right,
#user-page-left {
    margin-top: 30px;
}

#user-page-left {
    width: 100%;
    float: left;
}

#user-page-right {
    float: left;
    width: 100%;
}

#profile-top {
    border-bottom: 0 solid #d4dfd7;
    padding: 10px 0;
    margin: 0 0 10px 0;
    position: relative;
}

#centralNotice {
    display: none;
}

.mw-parser-output.custom-container {
  background-color: rgb(102 102 102 / 22%);
  color: #ffffff; 
  border-radius: 20px;
  padding: 10px 45px;
  margin: 20px 0;
  text-align: left;
}

.mw-parser-output.custom-container a {
  color: #ffffff;
  text-decoration: none;
}

.mw-parser-output.custom-container a:hover {
  text-decoration: underline;
}

.mw-parser-output.custom-container hr {
  border: 1px solid #ffffff; 
  margin: 10px 0;
  width: 100%;
}

#mw-dismissable-notice{
 display: none;
}

#mw-dismissable-notice-body{
	 display: none;
}

/* блоки в профиле */
.no-info-container {
    margin: 50px 0 20px 0;
    background-color: #f2f4f7;
    padding: 20px;
    text-align: center;
    color: #777;
    border-radius: 9px;
}


:root.skin-citizen-dark {
    --color-primary__l: 60%;
    --color-surface-0: hsl(var(--color-primary__h),0%,9%);
    --color-surface-1: hsl(var(--color-primary__h),5%,8%);
    --color-surface-2: hsl(var(--color-primary__h),5%,15%);
    --color-surface-3: hsl(var(--color-primary__h),15%,20%);
    --color-surface-4: hsl(var(--color-primary__h),15%,25%);
    --color-base--emphasized: hsl(var(--color-primary__h),80%,95%);
    --color-base: hsl(0deg 0% 79.42%);
    --color-base--subtle: hsl(0deg 0% 66.96%);
    --background-color-primary--hover: hsl(var(--color-primary__h),var(--color-primary__s),15%);
}

:root {
    --color-primary__h: 215;
    --color-primary__s: 60%;}

:root.skin-citizen-dark {
    --background-color-overlay: hsla(var(--color-primary__h),1%,10%,0.95%);
}

.user-section-heading {
    margin-bottom: 59px;
}

.user-section-title {
    margin-top: 20px;
}

.profile-tab {
    background-color: #1e73e7;
    text-align: center;
    height: 38px;
    min-width: 218px;
    float: left;
    padding: 6px 5px 0 5px;
    margin: 0 8px 0 0;
    border-radius: 12px;
}


@media only screen and (max-width: 767px) {.profile-tab {
    background-color: #1e73e7;
    text-align: center;
    height: 38px;
    min-width: 72px;
    float: none;
    padding: 6px 5px 0 5px;
    margin: 0 8px 0 0;
    border-radius: 12px;
}

.profile-info {
    padding: 30px 0;
}

}

.profile-tab-on {
    background-color: #404040;
    float: left;
    height: 38px;
    color: #fff;
    font-size: 16px;
    min-width: 122px;
    font-weight: 400;
    padding: 6px 5px 0 5px;
    margin: 0 5px 0 0;
    text-align: center;
    border-radius: 12px;
}

.profile-info {
    padding: 67px 0;
}

.citizen-drawer__card {
    padding: 15px;
}


@media only screen and (min-width: 768px) {
    .page-Служебная_CreatePage .citizen-body-container {
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0 auto;
        max-width: calc(100% - 390px);
    }
}






.page-Кандидаты_на_статью_февраля header.mw-body-header {
    display: none;
}

.page-Кандидаты_на_статью_февраля div.page-info {
    display: none;
}

.page-Кандидаты_на_статью_февраля .citizen-section-heading {
	margin-top: 34px;
    font-size: 60px;
}

.page-Кандидаты_на_статью_февраля p[style="font-size: 20px;"] {
    font-size: 20px;
}

.page-Кандидаты_на_статью_февраля input.site-button[name="wpSubmitComment"] {
    padding: 11px;
    border-radius: 14px;
}


.page-Кандидаты_на_статью_февраля input.site-button[name="wpPreview"] {
    display: none;
} 

.page-Кандидаты_на_статью_февраля textarea#comment {
    width: 776px;
    border-radius: 21px;
    padding: 17px;
}

.page-Кандидаты_на_статью_февраля .citizen-toc.citizen-menu-checkbox-container
{
	display: none;
}

.page-Кандидаты_на_статью_февраля .c-form-title {
    display: none;
}

.page-Кандидаты_на_статью_февраля .citizen-section-indicator.citizen-ui-icon.mw-ui-icon-wikimedia-collapse {
    display: none;
}

.page-Кандидаты_на_статью_февраля .c-order {
    display: none;
}

.page-Кандидаты_на_статью_февраля .full {
    width: 772px;
}

.page-Кандидаты_на_статью_февраля .comments-body#comments-body {
    margin-top: 44px;
}

@media only screen and (max-width: 768px) {
    .page-Кандидаты_на_статью_февраля #bodyContent.citizen-body {
        margin: 6px;
    }

    .page-Кандидаты_на_статью_февраля h2.citizen-section-heading {
        font-size: 46px;
        margin-top: 36px;
    }
}

.page-Кандидаты_на_статью_февраля .mw-editsection {
    display: none;
}

.page-Кандидаты_на_статью_февраля .c-avatar img {
    padding: 3px;
    border: 1px solid #9b9b9b;
    background-color: #71717100;
    border-radius: 50%;
}




.skin-citizen-dark .citizen-page-container {
	background-image: linear-gradient(to bottom, rgb(24 24 24 / 80%) 5%, rgb(10 10 10 / 95%) 30.33%, rgb(0 0 0 / 96%)), url(https://static.miraheze.org/lostmediaruwiki/f/f0/Bgdefault_%284%29.jpg);
    background-size: auto, cover;
    background-position: top, center;
    background-repeat: no-repeat;
    background-attachment: fixed; 
    position: relative;
    z-index: 1; 
}


.skin-citizen-dark .mw-footer.citizen-footer {
    background: linear-gradient(to bottom, rgba(104, 104, 104, 0.24) 0%, rgb(18, 18, 18));
}




.c-order {
    margin-bottom: 36px;
}

.comments-body {
    margin-top: 10px;
    margin-bottom: 50px;
}

textarea#comment {
	width: 100%;
    border-radius: 17px;
    padding: 12px;
    margin-top: 10px;
    background-color: #2020200d;
}

.skin-citizen-dark textarea#comment {
    border-radius: 17px;
    padding: 12px;
    margin-top: 10px;
    background-color: #2e2e2e;
}

.full {
    width: auto;
}


.c-avatar img {
    padding: 3px;
    border: 1px solid #dcdcdc85;
    background-color: #95959500;
    border-radius: 50%;
    margin-top: 5px;
}

.c-item {
    position: relative;
    border-bottom: 1px solid #8484848f;
    padding: 0px 0px 48px 0px;
    margin: 0px 0px 15px 0px;
    border-radius: 15px;
}

.c-form-button input[type="button"] {
    padding: 11px;
    border-radius: 11px;
}


.skin-citizen-dark .c-form-title {
    color: #a8a8a8;
    font-weight: bold;
    font-size: 17px;
    margin: 0px 0px 5px 0px;
}

.skin-citizen-dark .c-form-button input[type="button"] {
    padding: 11px;
    border-radius: 11px;
    background-color: #5c5c5c45;
}

input[name="wpPreview"].site-button {
    display: none;
}

.c-spy {
    float: left;
    font-size: 10px;
    margin: 9px 0px 0px 12px;
}

select[name="TheOrder"] {
    padding: 7px;
    border-radius: 7px;
}

.citizen-page-container {
    background: linear-gradient(to bottom, rgb(0 0 0 / 0%) 0%, rgb(234 234 234));
    background-attachment: fixed;
    position: relative;
    z-index: 1;
}


@media screen and (min-width: 1120px) {.skin-citizen-dark .citizen-header {
   background: linear-gradient(to bottom,rgb(0 0 0 / 32%) 0%,rgb(17 17 17));
}
}


@media screen and (max-width: 800px) {.c-actions {
    margin: 6px 89px 0px 0px;
}}

@media screen and (max-width: 800px) {
	#allcomments {
    margin-top: 71px;
}
.c-spy {
    margin: 11px 54px 2px 3px;
}
}



:root.skin-citizen-dark {
--color-primary: #2bc600;
--color-primary--active: #0b8000;
--color-primary--hover: #209301;
--background-color-primary--active: #00f60724;
}


@media only screen and (max-width: 768px) {
    body.page-Заглавная_страница .citizen-footer {
        margin-top: -43px;
    }
}

body.page-Заглавная_страница .mw-body-footer {
    display: none;
}

.citizen-page-container {
    position: relative; 
    overflow: hidden; 
}

#particles-js {
position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
    filter: invert(0.5);
}

.skin-citizen-dark #particles-js {
    filter: none;
}

.citizen-page-container {
    background-image: linear-gradient(to bottom, rgb(255 255 255 / 97%) 5%, rgb(255 255 255 / 95%) 30.33%, rgb(255 255 255 / 96%)), url(https://static.miraheze.org/lostmediaruwiki/b/b0/Site-background-light.png);
    background-size: auto, cover;
    background-position: top, center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    position: relative;
    z-index: 1;}

    
    
#n-Правила-оформления-статей {
    margin-bottom: 10px;
}

.skin-citizen-dark #footer-poweredbyico {
filter: grayscale(1) invert(90%);
}


.skin-citizen-dark .manymediatemplate{
    color:white;
    background-color: rgb(67 75 84 / 33%); 
    border:1px solid rgba(67, 75, 84, 0.8); 
    border-radius:20px; 
    padding:3%;
}
.manymediatemplate{
    color: black;
    background-color: rgb(255 255 255 / 11%);
    border: 3px solid rgb(190 190 190);
    border-radius: 20px;
    padding: 3%;
}


/* спасите */

.page-Заглавная_страница a {
    z-index: 1;
    position: relative;
}


:root {
    --color-primary: #44ab00;
    --color-primary--hover: #4bda00;
    --color-primary--active: #1ccb00;
}


.page-Заглавная_страница .citizen-footer {
    z-index: 10;
}

.page-Заглавная_страница .citizen-page-footer {
display: none;
}

.page-Заглавная_страница #unique-heading {
text-align: center;
}
.page-Заглавная_страница .mp_block_content {
text-align: center;
}

table {
    max-width: unset;
}