MediaWiki:Common.css

/**
 * Wiki.tesonline.org Global Stylesheet 
 * Current maintainers: Wiki staff members
 * Please discuss changes on MediaWiki talk:Common.css
 */

/** Testing area, please clear out this section after testing is done **/
.row-box {
    position: relative;
}
.box {
    display: block;
    width: 55%;
    position: relative;
}
.box img {
    width: 100%;
    height: 100%;
    object-position: 50% 50%;
    object-fit: cover;
    padding: 1% 0;
}
.box:nth-child(1) {
    clip-path: polygon(0 0, 97% 0, 82% 100%, 0 100%);
}
.box:nth-child(2) {
    clip-path: polygon(18% 0, 100% 0, 100% 100%, 3% 100%);
    left: 45%;
    position: absolute;
    top: 0;
}
.box:nth-child(3) {
    clip-path: polygon(0 0, 82% 0, 97% 100%, 0 100%);      
}
.box:nth-child(4) {
    clip-path: polygon(3% 0, 100% 0, 100% 100%, 18% 100%);
    left: 45%;        
    position: absolute;
    top: 50%;             
}
/** End test area **/

/****************
 * Custom Fonts *
 ****************/
@font-face {
    font-family: OpenSans;
    src: local('OpenSans-Regular'), local('OpenSans-Regular'), url(/media/hydra/fonts/OpenSans-Regular.ttf) format('truetype');
}

@font-face {
    font-family: OpenSans;
    font-style: italic;
    src: local('OpenSans-Italic'), local('OpenSans-Italic'), url(/media/hydra/fonts/OpenSans-Italic.ttf) format('truetype');
}

@font-face {
    font-family: OpenSans;
    font-weight: bold;
    src: local('OpenSans-Bold'), local('OpenSans-Bold'), url(/media/hydra/fonts/OpenSans-Bold.ttf) format('truetype');
}

@font-face {
    font-family: OpenSans;
    font-style: italic;
    font-weight: bold;
    src: local('OpenSans-BoldItalic'), local('OpenSans-BoldItalic'), url(/media/hydra/fonts/OpenSans-BoldItalic.ttf) format('truetype');
}

@font-face {
    font-family: "Mojang";
    src: local('Mojang-Regular'), local('Mojang-Regular'), url(/media/hydra/fonts/Mojang-Regular.ttf) format('truetype');
    font-weight: normal;
}

@font-face {
    font-family: "Mojang";
    src: local('Mojang-Bold'), local('Mojang-Bold'), url(/media/hydra/fonts/Mojang-Bold.ttf) format('truetype');
    font-weight: bold;
}

/******************
/* General styles *
/**background-color: #171717;**/
body {
    background-image: url(/media/1/1f/Background.jpg);
    background-position: center top;
    background-attachment: scroll;
    background-repeat: no-repeat;
    background-color: #000000;/*Подвал страницы*/
    background-size: 100% auto;
    color: #0000FF;
    font-family: OpenSans, sans-serif;
}

#pageWrapper {
    padding-right: 1em;
}

/********************
/* Community portal *
/********************/
.cpbox {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap;
}

#cpbox-side {
    box-sizing: border-box;
    width: calc(33% - 10px);
    margin: 5px;
    flex-grow: 1;
    min-width: 300px;
}

#cpbox-main {
    box-sizing: border-box;
    width: calc(67% - 10px);
    margin: 5px;
    flex-grow: 1;
}

#cpbox-tasks {
    box-sizing: border-box;
    width: calc(100% - 10px);
    margin: 5px;
}

.cpbox-feature {
    padding: 10px;
}

/***************
/* Logo styles *
/***************/
/* Новогодний логотип */
#p-logo a {
    /*background-image: url('//upload.wikimedia.org/wikipedia/commons/d/da/Wikinews-logo-ru-1.png') !important;*/
    /*background-image: url('/resources/assets/new_year_logo.png') !important;*/
}
/*****************
/* Header styles *
/*****************/
div#mw-page-base {
    /*background: #FFFF00;*/
    background: #FFFFFF;
    height: 82px;
    margin-bottom: 0;
    border-bottom: 3px solid #FFFFFF;
   /* border-bottom: 3px solid #FFFF00;*/
}

div#mw-head {
    height: 82px;
}

#mw-head-base {
    display: none;
}

/* форматирование параграфов для книг */
div.book {font-size: 130%; font-family:sans-serif; }
.book p {text-indent: 1.5em; margin: 0 1.5em 0 1.5em;}
 
/* форматирование параграфов для стихов */
div.poem {font-size: 130%; font-family:sans-serif; }
.poem p {text-indent: 0em; margin: 0 1.5em 0 1.5em;}

/**************************
/* Article navigation bar *
/**************************/

/******************
/* Sidebar styles *
/******************/
/* this has to be overridden for every menu */
#p-Menu,
#p-Menu2,
#p-Menu3 {
 overflow: visible; 
}

/* this has to be overridden for every menu */
#p-Menu div,
#p-Menu2 div,
#p-Menu3 div {
 margin: 0;
 padding: 0;
}

/* this is an example to make the list of the second entry bigger e.g. when ther is a longer text in a list item
#p-Menu ul li.item2 ul {
 width: 16em;
}
*/

/* this an example to change the background color of every second list item
li.even {
 background-color: #eeeeee;
}
*/

.menuSidebar ul { /* remove bullets and list indents */
 list-style: none;
 margin: 0;
 padding: 0;
}

/* this div is only for better handling and navigation  ... could also be done in inner ul*/
.menuSidebar ul div { 
 position: absolute;
 top: -6px;
 left: 100%; /* to position them to the right of their containing block */
 width: 100%; /* width is based on the containing block */
 z-index: 100; /* show ul on top */
}

.menuSidebar ul ul { 
 background-color: white;
 border: 1px solid #aaaaaa;
 margin-top: 5px; /* make navigation easier*/
 margin-bottom: 5px; /* make navigation easier*/
 z-index: 101; /* show on top; Needed for IE 7 */
 width: 12em; /* width of inner menu, Needed for IE 7 */
}

.menuSidebar li {
 position: relative; /* make li a container for inner elements */
 margin: 1px;
 z-index: 102; /* show on top; Needed for IE 7 */
}

/* style, color and size links and headings to suit */
.menuSidebar a {
 font-weight: bold;
 display: block;
 border-width: 0px 0px 1px 0px;
 border-style: solid;
 border-color: #aaaaaa;
 margin: 0px;
 padding: 1px;
 padding-left: 5px;
 
 text-decoration: none;
}

/* move the > to the right */
.menuSidebar a em {
 position: absolute;
 right: 4px;
}

.menuSidebar li:hover, /* Needed for IE 7 */
.menuSidebar a:hover {
 background: #ccccff;
}

.menuSidebar li.separator a:hover {
 background: white;
}

/* Needed for IE 7 */
.menuSidebar li.separator a,
.menuSidebar li.separator {
 line-height: 0px;
 height: 0px;
 font-size: 0px;
}

.menuSidebar ul li:last-Child a { 
 border-width: 0px 0px 0px 0px; // remove the last bottom line 
 padding-bottom: 0px;
}

/* hides the first level */
.menuSidebar ul li div { display: none; }

/* shows the first level and hide the second */
.menuSidebar ul li:hover div, 
.menuSidebar ul li div:hover { display: block; } /* div is again used for easier navigation*/
.menuSidebar ul li:hover ul li div { display: none; } /* hide the next level */

/* second level*/
.menuSidebar ul li ul li:hover div,
.menuSidebar ul li ul li div:hover  { display: block; } /* div is again used for easier navigation*/
.menuSidebar ul li ul li:hover ul li div { display: none; }  /* hide the next level */

/* third level */
.menuSidebar ul li ul li ul li:hover div,
.menuSidebar ul li ul li ul li div:hover   { display: block; } /* div is again used for easier navigation*/
.menuSidebar ul li ul li ul li:hover ul li div { display: none; }  /* hide the next level */

/***************
/* Link styles *
/***************/
.gridContainer .gridImage > a {
    color: transparent !important;
}

/******************
/* Стили статей (цвет заголовка)*
/******************/

h1, h2, h3, h4, h5, h6 {
  /*color: #FFFFFF;*/ /**белый**/
  /*color: #000000;*/ /** черный **/
    color: #FFFF00; /** желтый **/
    font-family: OpenSans, sans-serif;
}

h1, h2 {
    border-bottom: 0px dashed #e04a40;
}

hr {
    background: none;
    border-bottom: 1px dashed #e04a40;
    /*color: #FFFFFF;*/ /** белый **/
    color: #FFFF00; /** желтый **/
    height: 0;
}

/**********************
/* Gamepedia Sidebars *
/**********************/

/** Fun stuff **/

/** Rainbows **/

/** Generic infobox styling **/
.infobox {
    width: 23em;
    text-align: right;
    border: 1px solid #AAA;
    background-color: #F9F9F9;
    color: #000;
    margin: 0.5em 0 0.5em 1em;
    padding: 0.2em;
    float: right;
    clear: right;
    font-size: 88%;
    line-height: 1.2em;
    vertical-align: top;
    border-collapse: collapse;
}

.infobox td[colspan="2"],
.infobox th[colspan="2"] {
    text-align: center;
}

.infobox td:first-child:not([colspan="2"]) {
    text-align: left;
    font-weight: bold;
    width: 50%;
    vertical-align: top;
}

.infobox th.infoboxFirstHeader {
    font-size: 120%
}

.infobox td ul,
.infobox td ol {
    text-align: left;
}

.infobox th {
    border-bottom: #AAA thin solid;
    border-top: #AAA thin solid;
}

.infobox th,
.infobox td {
    padding: 0.4em 0.6em 0.2em 0.6em;
}

.infobox tr.infoboxSubsectionBreak {
    border-top: #AAA thin solid;
}

.infobox th.infoboxSectionHeader,
.infobox th.infoboxFirstHeader {
    background-color: #CDDEFF;
}

.infoboxSubsectionBreak td {
    padding: 0;
}

.infoboxBlockImage img {
	width:240px;
	height: auto;
}

/** Galleries **/
.gallery > .page {
    display: none;
}

.gallery > div.page.active {
    display: block;
}

.gallery > span.page.active {
    display: inline;
}

/** Crafting Grid Slides **/
.CraftingGridCell > span.ActiveSlide,
.CraftingGridCell > div.GridTank.ActiveSlide{
    display: inline-block !important;
}
.CraftingGridCell > div.GridTank,
.CraftingGridCell > span,
.CraftingGridCell > .grid:not(.ActiveSlide) {
    display: none !important;
}

/** Crafting grid controls **/
.pageNum {
    margin-left: 20px;
}
.pageCount {
    margin-right: 20px;
}
.CraftingGridControls {
	white-space: nowrap;
}

/* [[Википедия:Оформление таблиц]] */
table.standard, table.wide
 {border:1px solid #000; border-collapse: collapse}
table.standard th, table.wide th, table.wikitable th
 {border:1px solid #000; padding-left:0.2em; padding-right:0.2em; background-color:#000}
table.standard td, table.wide td
 {border: 1px solid #000; padding-left:0.2em; padding-right:0.2em}
table.standard caption, table.wide caption, table.tiles caption
 {font-weight:bold; padding-top: 0.2em; padding-bottom:0.2em}
table.wide {width: 100%}

table.simple {border-color:#AAAAAA; border-collapse:collapse}
table.simple th, table.simple td {border-color:#AAAAAA; padding-left:0.2em; padding-right:0.2em}

table.tiles {border-collapse:separate; border-spacing:2px}
table.tiles th {padding-left:0.2em; padding-right:0.2em; background-color: #EEEEFF}
table.tiles td {padding-left:0.2em; padding-right:0.2em; background-color: #F0F0F0}

table.graytable {background:#f0f0f0; padding:1em; width: 100%}
table.graytable caption {padding:0.5em 0 0 0; background:#f0f0f0; font-size:100%; font-weight:bold}
table.graytable caption span.subcaption {font-size:80%; font-weight:normal}
table.graytable th, table.graytable td {font-size:80%}

table.wikitable, table.prettytable 
 {margin:1em 1em 1em 0; background:#F9F9F9; border:1px solid #000; border-collapse:collapse; color: #fff !important; background: #333 !important;}
table.wikitable th, table.wikitable td,
table.prettytable th, table.prettytable td 
 {border:1px solid #000; padding:0.2em}
table.wikitable caption, table.prettytable caption 
 {margin-left:inherit; margin-right:inherit; font-size:larger; font-weight:bold}
table.prettytable th 
 {background:#f2f2f2}

tr.highlight th {background-color: #EEEEFF}
tr.highlight td {background-color: #FFFFEE}
tr.bright th   {background-color: #CCCCFF}
tr.bright td   {background-color: #FFEECC}
tr.shadow th, tr.shadow td  {background-color: #F0F0F0}
tr.dark th, tr.dark td  {background-color: #CCCCCC}
table th.highlight  {background-color: #EEEEFF}
table td.highlight  {background-color: #FFFFEE}
table th.bright  {background-color: #CCCCFF}
table td.bright  {background-color: #FFEECC}
table th.shadow, table td.shadow  {background-color: #F0F0F0}
table th.dark, table td.dark  {background-color: #CCCCCC}
table th.transparent, table td.transparent, .transparent {background-color: transparent}

table.toccolours th {background-color: #ccccff}

/** Tooltips **/
#minetip-tooltip {
    position: fixed;
    background-color: #100010;
    background-color: rgba(16, 0, 16, 0.94);
    color: #FFF;
    padding: 0.375em;
    font-family: Mojang, sans-serif;
    font-size: 16px;
    letter-spacing: -0.5px;
    word-spacing: 6px;
    line-height: 1.25em;
    text-shadow: 0.125em 0.125em 0 #3F3F3F;
    margin: 0.125em 0.25em;
    pointer-events: none;
    z-index: 2000;
}
#minetip-tooltip:before {
    content: "";
    position: absolute;
    top: 0.125em;
    right: -0.125em;
    bottom: 0.125em;
    left: -0.125em;
    border: 0.125em solid #100010;
    border-style: none solid;
    border-color: rgba(16, 0, 16, 0.94);
}
#minetip-tooltip:after {
    content: "";
    position: absolute;
    top: 0.125em;
    right: 0;
    bottom: 0.125em;
    left: 0;
    border: 0.125em solid #2D0A63;
    border-image: -webkit-linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;
    border-image: linear-gradient(rgba(80, 0, 255, 0.31), rgba(40, 0, 127, 0.31)) 1;
}

#minetip-tooltip > .minetip-description {
    display: block;
    margin-top: 0.25em;
}

/* Classes corresponding to Minecraft formatting codes */
.format-0 {
    color: #000;
    text-shadow: 0.125em 0.125em 0 #000;
}
.format-1 {
    color: #00A;
    text-shadow: 0.125em 0.125em 0 #00002A;
}
.format-2 {
    color: #0A0;
    text-shadow: 0.125em 0.125em 0 #002A00;
}
.format-3 {
    color: #0AA;
    text-shadow: 0.125em 0.125em 0 #002A2A;
}
.format-4 {
    color: #A00;
    text-shadow: 0.125em 0.125em 0 #2A0000;
}
.format-5 {
    color: #A0A;
    text-shadow: 0.125em 0.125em 0 #2A002A;
}
.format-6 {
    color: #FA0;
    text-shadow: 0.125em 0.125em 0 #2A2A00;
}
.format-7 {
    color: #AAA;
    text-shadow: 0.125em 0.125em 0 #2A2A2A;
}
.format-8 {
    color: #555;
    text-shadow: 0.125em 0.125em 0 #151515;
}
.format-9 {
    color: #55F;
    text-shadow: 0.125em 0.125em 0 #15153F;
}
.format-a {
    color: #5F5;
    text-shadow: 0.125em 0.125em 0 #153F15;
}
.format-b {
    color: #5FF;
    text-shadow: 0.125em 0.125em 0 #153F3F;
}
.format-c {
    color: #F55;
    text-shadow: 0.125em 0.125em 0 #3F1515;
}
.format-d {
    color: #F5F;
    text-shadow: 0.125em 0.125em 0 #3F153F;
}
.format-e {
    color: #FF5;
    text-shadow: 0.125em 0.125em 0 #3F3F15;
}
.format-f {
    color: #FFF;
    text-shadow: 0.125em 0.125em 0 #3F3F3F;
}
.format-l {
    font-weight: bold;
    letter-spacing: 0.125em;
}
.format-m {
    text-decoration: line-through;
}
.format-n {
    text-decoration: underline;
}
.format-o {
    font-style: italic;
}
.blink-0 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-0;
}
@keyframes blink-0 {
    50% {
        color: #000;
        text-shadow: 0.125em 0.125em 0 #000;
    }
}
.blink-1 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-1;
}
@keyframes blink-1 {
    50% {
        color: #00A;
        text-shadow: 0.125em 0.125em 0 #00002A;
    }
}
.blink-2 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-2;
}
@keyframes blink-2 {
    50% {
        color: #0A0;
        text-shadow: 0.125em 0.125em 0 #002A00;
    }
}
.blink-3 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-3;
}
@keyframes blink-3 {
    50% {
        color: #0AA;
        text-shadow: 0.125em 0.125em 0 #002A2A;
    }
}
.blink-4 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-4;
}
@keyframes blink-4 {
    50% {
        color: #A00;
        text-shadow: 0.125em 0.125em 0 #2A0000;
    }
}
.blink-5 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-5;
}
@keyframes blink-5 {
    50% {
        color: #A0A;
        text-shadow: 0.125em 0.125em 0 #2A002A;
    }
}
.blink-6 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-6;
}
@keyframes blink-6 {
    50% {
        color: #FA0;
        text-shadow: 0.125em 0.125em 0 #2A2A00;
    }
}
.blink-7 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-7;
}
@keyframes blink-7 {
    50% {
        color: #AAA;
        text-shadow: 0.125em 0.125em 0 #2A2A2A;
    }
}
.blink-8 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-8;
}
@keyframes blink-8 {
    50% {
        color: #555;
        text-shadow: 0.125em 0.125em 0 #151515;
    }
}
.blink-9 {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-9;
}
@keyframes blink-9 {
    50% {
        color: #55F;
        text-shadow: 0.125em 0.125em 0 #15153F;
    }
}
.blink-a {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-a;
}
@keyframes blink-a {
    50% {
        color: #5F5;
        text-shadow: 0.125em 0.125em 0 #153F15;
    }
}
.blink-b {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-b;
}
@keyframes blink-b {
    50% {
        color: #5FF;
        text-shadow: 0.125em 0.125em 0 #153F3F;
    }
}
.blink-c {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-c;
}
@keyframes blink-c {
    50% {
        color: #F55;
        text-shadow: 0.125em 0.125em 0 #3F1515;
    }
}
.blink-d {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-d;
}
@keyframes blink-d {
    50% {
        color: #F5F;
        text-shadow: 0.125em 0.125em 0 #3F153F;
    }
}
.blink-e {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-e;
}
@keyframes blink-e {
    50% {
        color: #FF5;
        text-shadow: 0.125em 0.125em 0 #3F3F15;
    }
}
.blink-f {
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, start);
    animation-name: blink-f;
}
@keyframes blink-f {
    50% {
        color: #FFF;
        text-shadow: 0.125em 0.125em 0 #3F3F3F;
    }
}
/** Tanks **/
/** Template:Tanks **/
.tanks {
    position: absolute;
    top: 0;
}

/** Styling for the new grid templates **/
.CraftingGrid,
.CraftingGrid * {
    -moz-user-select: none; 
    -khtml-user-select: none; 
    -webkit-user-select: none; 
    -o-user-select: none;   
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    user-drag: none;
}

span.grid:not(.ext-translate-container):not(.uls-menu) {
    position: relative;
    display: inline-block;
    background-color: #8B8B8B;
    border: 2px solid;
    border-color: #373737 #FFF #FFF #373737;
    width: 32px;
    height: 32px;
    font-size: 16px;
    line-height: 1;
    text-align: left;
    vertical-align: bottom;
}

span.grid:before,
span.grid:after {
    content: "";
    position: absolute;
    background-color: #8B8B8B;
    height: 2px;
    width: 2px;
    pointer-events: none;
}
span.grid:before {
    bottom: -2px;
    left: -2px;
}
span.grid:after {
    top: -2px;
    right: -2px;
}

span.grid > * {
    display: block;
    margin: -2px;
    padding: 2px;
}
 
.grid-number {
    position: absolute;
    right: -2px;
    bottom: -2px;
    font-family: Mojang, sans-serif;
    font-weight: normal;
    color: #FFF;
    text-shadow: 2px 2px 0 #3F3F3F;
    filter: dropshadow(color=#3F3F3F, offx=2, offy=2);
    z-index: 2;
    letter-spacing: -0.5px;
    word-spacing: 6px;
}

/* Plain grid with no border or background */
.grid-plain,
.CraftingGrid .grid {
    background-color: transparent !important;
    border-color: transparent !important;
}
.grid-plain:before,
.grid-plain:after,
.CraftingGrid .grid:before,
.CraftingGrid .grid:after {
    content: none !important;
}

.craftingGridOne .grid-number {
    display: none;
}

/* Generic styling for animation class */
.animated > span:not(.active),
.animated > div:not(.active) {
    display: none !important;
}

.nowrap {
    white-space: nowrap;
}

/* Default skin for navigation boxes */
/** Template:Navbox **/
table.navbox {            /* Navbox container style */
    border: 1px solid #AAA;
    width: 100%; 
    margin: auto;
    clear: both;
    font-size: 88%;
    text-align: center;
    padding: 1px;
}
table.navbox + table.navbox {  /* Single pixel border between adjacent navboxes */
    margin-top: -1px;          /* (doesn't work for IE6, but that's okay)       */
}
.navbox-title,
.navbox-abovebelow,
table.navbox th {
    text-align: center;      /* Title and above/below styles */
    padding-left: 1em;
    padding-right: 1em;
}
.navbox-group {              /* Group style */
    white-space: nowrap;
    /* @noflip */text-align: right;
    font-weight: bold;
    padding-left: 1em;
    padding-right: 1em;
}
.navbox, .navbox-subgroup {
    background: #FDFDFD;     /* Background color */
}
.navbox-list {
    border-color: #FDFDFD;   /* Must match background color */
}
.navbox-title,
table.navbox th {
    background: #D4D4D4;     /* Level 1 color */
    color: #4D4D4D;
}
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
    background: #E2E2E2;     /* Level 2 color */
    color: #000;
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #EBEBEB;     /* Level 3 color */
    color: #000;
}
.navbox-even {
    background: #F9F9F9;     /* Even row striping */
    color: #000;
}
.navbox-odd {
    background: transparent; /* Odd row striping */
}
 
.collapseButton {          /* 'show'/'hide' buttons created dynamically */
    /* @noflip */float: right;          /* by the CollapsibleTables javascript in    */
    font-weight: normal;   /* [[MediaWiki:Common.js]] are styled here   */
    /* @noflip */text-align: right;     /* so they can be customised.                */
    width: auto;
}
.navbox .collapseButton {  /* In navboxes, the show/hide button balances */
    width: 6em;            /* the vde links from [[Template:Navbar]],    */
}                          /* so they need to be the same width.         */
 
.navbar {                  /* Navbox template links */
    font-size: 88%;        /* Default font-size */
    font-weight: normal;
}
.navbox .navbar {
    font-size: 100%;       /* Font-size when nested within navbox */
}

table.collapsed tr.collapsible {
    display: none;
}

/* Messagebox templates */
.messagebox {
    border: 1px solid #AAA;
    background-color: #F9F9F9;
    width: 80%;
    margin: 0 auto 1em auto;
    padding: .2em;
}
.messagebox.merge {
    border: 1px solid #C0B8CC;
    background-color: #F0E5FF;
    text-align: center;
}
.messagebox.cleanup {
    border: 1px solid #9F9FFF;
    background-color: #EFEFFF;
    text-align: center;
}
.messagebox.standard-talk {
    border: 1px solid #C0C090;
    background-color: #F8EABA;
    margin: 4px auto;
}
/* For old WikiProject banners inside banner shells. */
.mbox-inside .standard-talk,
.messagebox.nested-talk {
    border: 1px solid #C0C090;
    background-color: #F8EABA;
    width: 100%;
    margin: 2px 0;
    padding: 2px;
}
.messagebox.small {
    width: 238px;
    font-size: 85%;
    /* @noflip */
    float: right;
    clear: both;
    /* @noflip */
    margin: 0 0 1em 1em;
    line-height: 1.25em;
}
.messagebox.small-talk {
    width: 238px;
    font-size: 85%;
    /* @noflip */
    float: right;
    clear: both;
    /* @noflip */
    margin: 0 0 1em 1em;
    line-height: 1.25em;
    background: #F8EABA;
}
 
/* Cell sizes for ambox/tmbox/imbox/cmbox/ombox/dmbox message boxes */
th.mbox-text, td.mbox-text {   /* The message body cell(s) */
    border: none;
    /* @noflip */
    padding: 0.25em 0.9em;     /* 0.9em left/right */
    width: 100%;               /* Make all mboxes the same width regardless of text length */
}
td.mbox-image {                /* The left image cell */
    border: none;
    /* @noflip */
    padding: 2px 0 2px 0.9em;  /* 0.9em left, 0 right */
    text-align: center;
}
td.mbox-imageright {           /* The right image cell */
    border: none;
    /* @noflip */
    padding: 2px 0.9em 2px 0;  /* 0 left, 0.9em right */
    text-align: center;
}
td.mbox-empty-cell {           /* An empty narrow cell */
    border: none;
    padding: 0;
    width: 1px;
}
 
/* Article message box styles */
table.ambox {
    margin: 0 10%;                  /* 10% = Will not overlap with other elements */
    border: 1px solid #AAA;
    /* @noflip */
    border-left: 10px solid #1E90FF;  /* Default "notice" blue */
    background: #0000FF;
}
table.ambox + table.ambox {      /* Single border between stacked boxes. */
    margin-top: -1px;
}
.ambox th.mbox-text,
.ambox td.mbox-text {            /* The message body cell(s) */
    padding: 0.25em 0.5em;       /* 0.5em left/right */
}
.ambox td.mbox-image {           /* The left image cell */
    /* @noflip */
    padding: 2px 0 2px 0.5em;    /* 0.5em left, 0 right */
}
.ambox td.mbox-imageright {      /* The right image cell */
    /* @noflip */
    padding: 2px 0.5em 2px 0;    /* 0 left, 0.5em right */
}
 
table.ambox-notice {
    /* @noflip */
    border-left: 10px solid #1E90FF;    /* Blue */
}
table.ambox-speedy {
    /* @noflip */
    border-left: 10px solid #B22222;    /* Red */
    background: #FEE;                   /* Pink */
}
table.ambox-delete {
    /* @noflip */
    border-left: 10px solid #B22222;    /* Red */
}
table.ambox-content {
    /* @noflip */
    border-left: 10px solid #F28500;    /* Orange */
}
table.ambox-style {
    /* @noflip */
    border-left: 10px solid #F4C430;    /* Yellow */
}
table.ambox-move {
    /* @noflip */
    border-left: 10px solid #9932CC;    /* Purple */
}
table.ambox-protection {
    /* @noflip */
    border-left: 10px solid #BBA;       /* Gray-gold */
}
 
/* Image message box styles */
table.imbox {
    margin: 4px 10%;
    border-collapse: collapse;
    border: 3px solid #1E90FF;    /* Default "notice" blue */
    background: #FBFBFB;
}
.imbox .mbox-text .imbox {  /* For imboxes inside imbox-text cells. */
    margin: 0 -0.5em;       /* 0.9 - 0.5 = 0.4em left/right.        */
    display: block;         /* Fix for webkit to force 100% width.  */
}
.mbox-inside .imbox {       /* For imboxes inside other templates.  */
    margin: 4px;
}
 
table.imbox-notice {
    border: 3px solid #1E90FF;    /* Blue */
}
table.imbox-speedy {
    border: 3px solid #B22222;    /* Red */
    background: #FEE;             /* Pink */
}
table.imbox-delete {
    border: 3px solid #B22222;    /* Red */
}
table.imbox-content {
    border: 3px solid #F28500;    /* Orange */
}
table.imbox-style {
    border: 3px solid #F4C430;    /* Yellow */
}
table.imbox-move {
    border: 3px solid #9932CC;    /* Purple */
}
table.imbox-protection {
    border: 3px solid #BBA;       /* Gray-gold */
}
table.imbox-license {
    border: 3px solid #88A;       /* Dark gray */
    background: #F7F8FF;          /* Light gray */
}
table.imbox-featured {
    border: 3px solid #CBA135;    /* Brown-gold */
}
 
/* Category message box styles */
table.cmbox {
    margin: 3px 10%;
    border-collapse: collapse;
    border: 1px solid #AAA;
    background: #DFE8FF;    /* Default "notice" blue */
}
 
table.cmbox-notice {
    background: #D8E8FF;    /* Blue */
}
table.cmbox-speedy {
    margin-top: 4px;
    margin-bottom: 4px;
    border: 4px solid #B22222;    /* Red */
    background: #FFDBDB;          /* Pink */
}
table.cmbox-delete {
    background: #FFDBDB;    /* Red */
}
table.cmbox-content {
    background: #FFE7CE;    /* Orange */
}
table.cmbox-style {
    background: #FFF9DB;    /* Yellow */
}
table.cmbox-move {
    background: #E4D8FF;    /* Purple */
}
table.cmbox-protection {
    background: #EFEFE1;    /* Gray-gold */
}
 
/* Other pages message box styles */
table.ombox {
    margin: 4px 10%;
    border-collapse: collapse;
    border: 1px solid #AAA;       /* Default "notice" gray */
    background: #F9F9F9;
}
 
table.ombox-notice {
    border: 1px solid #AAA;       /* Gray */
}
table.ombox-speedy {
    border: 2px solid #B22222;    /* Red */
    background: #FEE;             /* Pink */
}
table.ombox-delete {
    border: 2px solid #B22222;    /* Red */
}
table.ombox-content {
    border: 1px solid #F28500;    /* Orange */
}
table.ombox-style {
    border: 1px solid #F4C430;    /* Yellow */
}
table.ombox-move {
    border: 1px solid #9932CC;    /* Purple */
}
table.ombox-protection {
    border: 2px solid #BBA;       /* Gray-gold */
}
 
/* Talk page message box styles */
table.tmbox {
    margin: 4px 10%;
    border-collapse: collapse;
    border: 1px solid #C0C090;   /* Default "notice" gray-brown */
    background: #F8EABA;
}
.mediawiki .mbox-inside .tmbox { /* For tmboxes inside other templates. The "mediawiki" class ensures that */
    margin: 2px 0;               /* this declaration overrides other styles (including mbox-small above)   */
    width: 100%;                 /* For Safari and Opera */
}
.mbox-inside .tmbox.mbox-small { /* "small" tmboxes should not be small when  */
    line-height: 1.5em;          /* also "nested", so reset styles that are   */
    font-size: 100%;             /* set in "mbox-small" above.                */
}
 
table.tmbox-speedy {
    border: 2px solid #B22222;    /* Red */
    background: #FEE;             /* Pink */
}
table.tmbox-delete {
    border: 2px solid #B22222;    /* Red */
}
table.tmbox-content {
    border: 2px solid #F28500;    /* Orange */
}
table.tmbox-style {
    border: 2px solid #F4c430;    /* Yellow */
}
table.tmbox-move {
    border: 2px solid #9932CC;    /* Purple */
}
table.tmbox-protection,
table.tmbox-notice {
    border: 1px solid #C0C090;    /* Gray-brown */
}
 
/* Disambig and set index box styles */
table.dmbox {
    clear: both;
    margin: 0.9em 1em;
    border-top: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
    background: transparent;
}
 
/* Div based "warning" style fmbox messages. */
div.mw-warning-with-logexcerpt,
div.mw-lag-warn-high,
div.mw-cascadeprotectedwarning,
div#mw-protect-cascadeon {
    clear: both;
    margin: 0.2em 0;
    border: 1px solid #BB7070;
    background: #FFDBDB;
    padding: 0.25em 0.9em;
}
/* Div based "system" style fmbox messages.
   Used in [[MediaWiki:Readonly lag]]. */
div.mw-lag-warn-normal {
    clear: both;
    margin: 0.2em 0;
    border: 1px solid #AAA;
    background: #F9F9F9;
    padding: 0.25em 0.9em;
}
 
/* These mbox-small classes must be placed after all other
   ambox/tmbox/ombox etc classes. "body.mediawiki" is so
   they override "table.ambox + table.ambox" above. */
body.mediawiki table.mbox-small {   /* For the "small=yes" option. */
    /* @noflip */
    clear: right;
    /* @noflip */
    float: right;
    /* @noflip */
    margin: 4px 0 4px 1em;
    width: 238px;
    font-size: 88%;
    line-height: 1.25em;
}
body.mediawiki table.mbox-small-left {   /* For the "small=left" option. */
    /* @noflip */
    margin: 4px 1em 4px 0;
    width: 238px;
    border-collapse: collapse;
    font-size: 88%;
    line-height: 1.25em;
}
 
/* Style for compact ambox */
/* Hide the images */
.compact-ambox table .mbox-image,
.compact-ambox table .mbox-imageright,
.compact-ambox table .mbox-empty-cell {
    display: none;
}
/* Remove borders, backgrounds, padding, etc. */
.compact-ambox table.ambox {
    border: none;
    border-collapse: collapse;
    background: transparent;
    margin: 0 0 0 1.6em !important;
    padding: 0 !important;
    width: auto;
    display: block;
}
body.mediawiki .compact-ambox table.mbox-small-left {
    font-size: 100%;
    width: auto;
    margin: 0;
}
/* Style the text cell as a list item and remove its padding */
.compact-ambox table .mbox-text {
    padding: 0 !important;
    margin: 0 !important;
}
.compact-ambox table .mbox-text-span {
    display: list-item;
    line-height: 1.5em;
    list-style-type: square;
    list-style-image: url(//bits.wikimedia.org/skins/common/images/bullet.gif);
}
.skin-vector .compact-ambox table .mbox-text-span {
    list-style-type: circle;
    list-style-image: url(//bits.wikimedia.org/skins/vector/images/bullet-icon.png)
}
/* Allow for hiding text in compact form */
.compact-ambox .hide-when-compact {
    display: none;
}

/** Main Page Styles **/

body.page-FTB_Wiki.ns-0.action-view h1.firstHeading {
    display: none;
}

body.page-FTB_Wiki.ns-0.action-view div#content {
    background: none;
    padding-bottom: 0;
}

body.page-FTB_Wiki.ns-0.action-view div#footer {
    margin-left: 12em;
    margin-right: 1em;
}

body.page-FTB_Wiki.ns-0.action-view legend#mw-fr-reviewformlegend {
    background: #FFF;
}

body.page-FTB_Wiki.ns-0.action-view .flaggedrevs_reviewform {
    border: none;
}

body.page-FTB_Wiki.ns-0.action-view .mw-pt-translate-header ~ hr {
    display: none;
}

body.page-FTB_Wiki.ns-0.action-view .mw-pt-translate-header a {
    color: #000;
}

table.main-page-layout {
    border-spacing: .5em;
    margin-left: -.5em;
    margin-right: -.5em;
    width: calc(100% + 1em);
}

table.main-page-layout > tr > td,
table.main-page-layout > * > tr > td {
    vertical-align: top;
    background: #FFF;
    padding: 0;
}

.main-page-heading {
    color: #E04A40;
    font-size: 140%;
    border-bottom: 1px dashed #E04A40;
    margin-top: .5em;
    margin-left: .5em;
    margin-right: .5em;
}

.main-page-nav-links {
    background: #E04A40;
    color: #FFF;
    text-align: left;
    line-height: 2.5em;
    padding-left: 1em;
}

.mw-body .main-page-nav-links a:link,
.mw-body .main-page-nav-links a:hover,
.mw-body .main-page-nav-links a:visited {
    color: #FFF;
    padding-right: 1em;
}

.mw-body .main-page-nav-links.dark a:link,
.mw-body .main-page-nav-links.dark a:hover,
.mw-body .main-page-nav-links.dark a:visited {
    color: #000;
}

.main-page-content,
table.main-page-layout > tr > td.main-page-content,
table.main-page-layout > * > tr > td.main-page-content {
    padding: .5em;
}

/* НАВИГАЦИОННЫЙ ШАБЛОН --------------------------- */

/* Default style for navigation boxes */
.navbox {					 /* Navbox container style */
	box-sizing: border-box;
	border: 1px solid #a2a9b1;
	width: 100%;
	margin: 1em auto 0; /* Prevent preceding content from clinging to navboxes */
	clear: both;
	font-size: 90%;
	text-align: center;
	padding: 1px;
}
.navbox-inner,
.navbox-subgroup {
	width: 100%;
}
.navbox-group,
.navbox-title,
.navbox-abovebelow {
	padding: 0.25em 1em;	  /* Title, group and above/below styles */
	text-align: center;
}
.navbox-title {
	line-height: 1.6em;	   /* Standard 1.6em for title */
}

/* cell spacing for navbox cells */
tr + tr > .navbox-abovebelow,
tr + tr > .navbox-group,
tr + tr > .navbox-image,
tr + tr > .navbox-list {	/* Borders above 2nd, 3rd, etc. rows */
	border-top: 2px solid #fdfdfd; /* Must match background color */
}

th.navbox-group {			 /* Group style */
	white-space: nowrap;
	/* @noflip */
	text-align: right;
}
.navbox,
.navbox-subgroup {
	background: #fdfdfd;	  /* Background color */
}
.navbox-list {
	border-color: #fdfdfd;	/* Must match background color */
}
.navbox th,
.navbox-title {
	background: #cfe3ff;	  /* Level 1 color */
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
	background: #dcebff;	  /* Level 2 color */
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
	background: #eaf3ff;	  /* Level 3 color */
}
.navbox-even {
	background: #f5f5f5;	  /* Even row striping */
}
.navbox-odd {
	background: transparent;  /* Odd row striping */
}
.navbox .hlist td dl,
.navbox .hlist td ol,
.navbox .hlist td ul,
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
	padding: 1px 0 0;	   /* Adjust hlist padding in navboxes */
}
.navbox .navbox {
	margin-top: 0;			/* No top margin for nested navboxes */
}
.navbox + .navbox {
	margin-top: -1px;		 /* Single pixel border between adjacent navboxes */
}

/* Default styling for Navbar template */
.navbar {
	display: inline;
	font-size: x-small;
	font-weight: normal;
}
.navbar ul {
	display: inline;
	white-space: nowrap;
}
.mw-body-content .navbar ul {
	line-height: inherit;
}
.navbar.mini {
	word-spacing: -0.1em;
}
.navbar.mini span abbr[title] {
  border-bottom: none;
  text-decoration: none;
  cursor: inherit;
}

/* Navbar styling when nested in infobox and navbox */
.infobox .navbar {
	font-size: 100%;
}
.navbox .navbar {
	display: block;
	font-size: 100%;
}
.navbox-title .navbar {
	/* @noflip */
	float: left;
	/* @noflip */
	text-align: left;
	/* @noflip */
	margin-right: 0.5em;
	width: 5em;
}

/* Кнопки [показать]/[скрыть], создаваемые динамически функцией collapsibleTables()
   в [[MediaWiki:Common.js]] */
.collapseButton {
	/* @noflip */
	float: right;
	font-weight: normal;
	/* @noflip */
	margin-left: 0.5em;
	/* @noflip */
	text-align: right;
	width: auto;
}

/* Reduce page jumps by hiding collapsed/dismissed content */
.client-js .collapsible.collapsed > tbody > tr:not(:first-child),
.client-js .NavFrame.collapsed > .NavContent,
.client-js .tochidden-wrapper > .toc > ul {
	display: none;
}

/* Style for horizontal lists (separator following item).
   IE8-specific classes are assigned in [[MediaWiki:Common.js/IEFixes.js]].
   @source mediawiki.org/wiki/Snippets/Horizontal_lists
   @revision 6 (2014-05-09)
   @author [[wp:User:Edokter]]
 */
.hlist dl,
.hlist ol,
.hlist ul {
    margin: 0;
    padding: 0;
}
/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
    margin: 0;
    display: inline;
}
/* Display nested lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl, .hlist dl ol, .hlist dl ul,
.hlist ol dl, .hlist ol ol, .hlist ol ul,
.hlist ul dl, .hlist ul ol, .hlist ul ul {
    display: inline;
}
/* Generate interpuncts */
.hlist dt:after {
    content: ": ";
}
.hlist dd:after,
.hlist li:after {
    content: " · ";
    font-weight: bold;
}
.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
    content: none;
}
/* For IE8 */
.hlist dd.hlist-last-child:after,
.hlist dt.hlist-last-child:after,
.hlist li.hlist-last-child:after {
    content: none;
}
/* Add parentheses around nested lists */
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
.hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
.hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
    content: " (";
    font-weight: normal;
}
.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
    content: ") ";
    font-weight: normal;
}
/* For IE8 */
.hlist dd dd.hlist-last-child:after, .hlist dd dt.hlist-last-child:after, .hlist dd li.hlist-last-child:after,
.hlist dt dd.hlist-last-child:after, .hlist dt dt.hlist-last-child:after, .hlist dt li.hlist-last-child:after,
.hlist li dd.hlist-last-child:after, .hlist li dt.hlist-last-child:after, .hlist li li.hlist-last-child:after {
    content: ") ";
    font-weight: normal;
}
/* Put ordinals in front of ordered list items */
.hlist ol {
    counter-reset: listitem;
}
.hlist ol > li {
    counter-increment: listitem;
}
.hlist ol > li:before {
    content: " " counter(listitem) " ";
    white-space: nowrap;
}
.hlist dd ol > li:first-child:before,
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
    content: " (" counter(listitem) " ";
}
/* Stuff for IC2's Turning Table */
.turn {position: absolute; top: 0;}
.turni15 {clip: rect(0px, 48px, 64px, 0px)}
.turni25 {clip: rect(0px, 96px, 64px, 48px)}
.turni35 {clip: rect(0px, 144px, 64px, 96px)}
.turni45 {clip: rect(0px, 192px, 64px, 144px)}
.turni55 {clip: rect(0px, 240px, 64px, 192px)}
.turni14 {clip: rect(6px, 48px, 58px, 0px)}
.turni24 {clip: rect(6px, 96px, 58px, 48px)}
.turni34 {clip: rect(6px, 144px, 58px, 96px)}
.turni44 {clip: rect(6px, 192px, 58px, 144px)}
.turni54 {clip: rect(6px, 240px, 58px, 192px)}
.turni13 {clip: rect(14px, 48px, 50px, 0px)}
.turni23 {clip: rect(14px, 96px, 50px, 48px)}
.turni33 {clip: rect(14px, 144px, 50px, 96px)}
.turni43 {clip: rect(14px, 192px, 50px, 144px)}
.turni53 {clip: rect(14px, 240px, 50px, 192px)}
.turni12 {clip: rect(20px, 48px, 44px, 0px)}
.turni22 {clip: rect(20px, 96px, 44px, 48px)}
.turni32 {clip: rect(20px, 144px, 44px, 96px)}
.turni42 {clip: rect(20px, 192px, 44px, 144px)}
.turni52 {clip: rect(20px, 240px, 44px, 192px)}
.turni11 {clip: rect(26px, 48px, 38px, 0px)}
.turni21 {clip: rect(26px, 96px, 38px, 48px)}
.turni31 {clip: rect(26px, 144px, 38px, 96px)}
.turni41 {clip: rect(26px, 192px, 38px, 144px)}
.turni51 {clip: rect(26px, 240px, 38px, 192px)}
.turnw13 {clip: rect(0px, 48px, 64px, 0px)}
.turnw23 {clip: rect(0px, 96px, 64px, 48px)}
.turnw33 {clip: rect(0px, 144px, 64px, 96px)}
.turnw43 {clip: rect(0px, 192px, 64px, 144px)}
.turnw53 {clip: rect(0px, 240px, 64px, 192px)}
.turnw12 {clip: rect(12px, 48px, 52px, 0px)}
.turnw22 {clip: rect(12px, 96px, 52px, 48px)}
.turnw32 {clip: rect(12px, 144px, 52px, 96px)}
.turnw42 {clip: rect(12px, 192px, 52px, 144px)}
.turnw52 {clip: rect(12px, 240px, 52px, 192px)}
.turnw11 {clip: rect(22px, 48px, 42px, 0px)}
.turnw21 {clip: rect(22px, 96px, 42px, 48px)}
.turnw31 {clip: rect(22px, 144px, 42px, 96px)}
.turnw41 {clip: rect(22px, 192px, 42px, 144px)}
.turnw51 {clip: rect(22px, 240px, 42px, 192px)}

/* Template:Cg/Witchery circle */
div.WitcheryCircle div.craftingGridText {
	line-height: 1.25em;
}

/* Template documentation styles */
.templateDocNoDoc,
.templateDocBadDoc,
.templateDocGoodDoc {
	margin: 0.25em auto 1em;
	border: 1px solid;
	padding: 1em;
	padding-bottom: 3px;
	border-bottom: 1px solid;
	margin-bottom: 1ex;
}

.templateDocEndNoDoc,
.templateDocEndBadDoc,
.templateDocEndGoodDoc {
	margin: 0 auto;
	border: 1px solid;
	padding: 1em;
}

/* api */
.skin-apioutput {
  background: none;
}

.api-pretty-header {
  background-color: white;
}

/** 11-Template documentation styles **/
.first  {
list-style: none;
padding: 0;
}
.first li {
padding: 10px 30px;
background: linear-gradient(to left, #f8ab8d 0%, white, #f8ab8d);
border-bottom: 1px solid grey;
color: #506a6b;
font-size: 20px;
box-shadow: 0 5px 5px 0 rgba(0,0,0, .2);
margin-bottom: 5px;
}
.first li:last-child {border-bottom: none;}
/** End test area **/

/** 22 - Testing area, please clear out this section after testing is done **/
.bullet {
margin-left: 0;
list-style: none;
counter-reset: li;
}
.bullet li {
position: relative;
margin-bottom: 1.5em;
border: 3px solid #CADFCF;
padding: 0.6em;
border-radius: 4px;
background: #FEFEFE;
color: #231F20;
font-family: "Trebuchet MS", "Lucida Sans";
}
.bullet li:before {
position: absolute;
top: -0.7em;
padding-left: 0.4em;
padding-right: 0.4em;
font-size: 16px;
font-weight: bold;
color: #DCC24B;
background: #FEFEFE;
border-radius: 50%;
counter-increment: li;
content: counter(li);
}
/** End test area **/

/** 333- Testing area, please clear out this section after testing is done **/
.bullet-2 {
  list-style: none; 
  counter-reset: li; 
  max-width: 600px;
  column-count: 2;
}
.bullet-2 li {
  margin-bottom: 5px;
  position: relative;
  background: linear-gradient(90deg, #FECDD3, #4726F0);
  line-height: 40px;
  padding: 0 30px 0 10px;
  color: #4726F0;
  border-radius: 5px;
}
.bullet-2 li:after {
  counter-increment: li; 
  content: counters(li,".") ". "; 
  position: absolute;
  right: 10px;
  color: #FECDD3;
}
.bullet-2 li:nth-child(1),
.bullet-2 li:nth-child(2),
.bullet-2 li:nth-child(3),
.bullet-2 li:nth-child(4) {
  padding: 0 10px 0 30px;
}
.bullet-2 li:nth-child(1):after,
.bullet-2 li:nth-child(2):after,
.bullet-2 li:nth-child(3):after,
.bullet-2 li:nth-child(4):after {
  right: auto;
  left: 10px;
  color: #4726F0;
}
/** End test area **/

/** Вращение ссылки **/
.roll-link {
 display: inline-block;
 overflow: hidden;
 text-decoration:none;
 vertical-align: top;
 -webkit-perspective: 600px;
 -moz-perspective: 600px;
 -ms-perspective: 600px;
 perspective: 600px;
 
 -webkit-perspective-origin: 50% 50%;
 -moz-perspective-origin: 50% 50%;
 -ms-perspective-origin: 50% 50%;
 perspective-origin: 50% 50%;      
}
 
.roll-link:hover {text-decoration:none;}
 
.roll-link span {
 display: block;
 position: relative;
 padding: 0 2px;
 
 -webkit-transition: all 400ms ease;
 -moz-transition: all 400ms ease;
 -ms-transition: all 400ms ease;
 transition: all 400ms ease;
 
 -webkit-transform-origin: 50% 0%;
 -moz-transform-origin: 50% 0%;
 -ms-transform-origin: 50% 0%;
 transform-origin: 50% 0%;
 
 -webkit-transform-style: preserve-3d;
 -moz-transform-style: preserve-3d;
 -ms-transform-style: preserve-3d;
 transform-style: preserve-3d;
}
.roll-link:hover span {
  background: #DD4D42;
 -webkit-transform: translate3d( 0px, 0px, -30px ) rotateX( 90deg );
 -moz-transform: translate3d( 0px, 0px, -30px ) rotateX( 90deg );
 -ms-transform: translate3d( 0px, 0px, -30px ) rotateX( 90deg );
 transform: translate3d( 0px, 0px, -30px ) rotateX( 90deg );
}
 
.roll-link span:after {
 content: attr(data-title);
 display: block;
 position: absolute;
 left: 0;
 top: 0;
 padding: 0 2px;
 color: #fff;
 background: #DD4D42;
 
 -webkit-transform-origin: 50% 0%;
 -moz-transform-origin: 50% 0%;
 -ms-transform-origin: 50% 0%;
 transform-origin: 50% 0%;
 
 -webkit-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
 -moz-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
 -ms-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
 transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
}

.main_container {
	display: flex;
    gap: 10px;
 }
 @media (max-width: 768px) {
 	
 .main_container{
 	flex-direction: column;
 }	
 .left_box{
	width: 100% !important; 
}

.right_box{
	width: 100% !important;
}
 
 }
 
.left_box{
	width: 50%;
}

.right_box{
	width: 50%;
}

.news{
	background: #826941;
    color: #000;
}

.newslist{
    display: block;
    overflow: auto;
    height: 460px;
    padding: 10px;
}

.links{
	background: #f5faff;
}

.world_teso{
	background: #f5faff;
    color: #000;
}

.new_posts{
	color:#000;
}

.new_images{
	    padding-bottom: 250px;
    background: #f5faff;
}
.new_styles{
	    padding-bottom: 250px;
    background: #f5faff;
}