/***
 *     ▄▄▄▄▄▄▄▄▄▄▄  ▄▄▄▄▄▄▄▄▄▄▄  ▄▄▄▄▄▄▄▄▄▄▄  ▄▄▄▄▄▄▄▄▄▄▄  ▄▄▄▄▄▄▄▄▄▄▄ 
 *    ▐░░░░░░░░░░░▌▐░░░░░░░░░░░▌▐░░░░░░░░░░░▌▐░░░░░░░░░░░▌▐░░░░░░░░░░░▌
 *    ▐░█▀▀▀▀▀▀▀█░▌▐░█▀▀▀▀▀▀▀▀▀ ▐░█▀▀▀▀▀▀▀▀▀ ▐░█▀▀▀▀▀▀▀▀▀  ▀▀▀▀█░█▀▀▀▀ 
 *    ▐░▌       ▐░▌▐░▌          ▐░▌          ▐░▌               ▐░▌     
 *    ▐░█▄▄▄▄▄▄▄█░▌▐░█▄▄▄▄▄▄▄▄▄ ▐░█▄▄▄▄▄▄▄▄▄ ▐░█▄▄▄▄▄▄▄▄▄      ▐░▌     
 *    ▐░░░░░░░░░░░▌▐░░░░░░░░░░░▌▐░░░░░░░░░░░▌▐░░░░░░░░░░░▌     ▐░▌     
 *    ▐░█▀▀▀▀█░█▀▀ ▐░█▀▀▀▀▀▀▀▀▀  ▀▀▀▀▀▀▀▀▀█░▌▐░█▀▀▀▀▀▀▀▀▀      ▐░▌     
 *    ▐░▌     ▐░▌  ▐░▌                    ▐░▌▐░▌               ▐░▌     
 *    ▐░▌      ▐░▌ ▐░█▄▄▄▄▄▄▄▄▄  ▄▄▄▄▄▄▄▄▄█░▌▐░█▄▄▄▄▄▄▄▄▄      ▐░▌     
 *    ▐░▌       ▐░▌▐░░░░░░░░░░░▌▐░░░░░░░░░░░▌▐░░░░░░░░░░░▌     ▐░▌     
 *     ▀         ▀  ▀▀▀▀▀▀▀▀▀▀▀  ▀▀▀▀▀▀▀▀▀▀▀  ▀▀▀▀▀▀▀▀▀▀▀       ▀      
 *                                                                     
 */




/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
  list-style: none;
}

/* Set core root defaults */
html:focus-within {
  scroll-behavior: smooth;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  html:focus-within {
   scroll-behavior: auto;
  }
  
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}


/***
 *                                                  
 *                                                  
 *                                                  
 *           ,---.                                  
 *          /__./|              __  ,-.             
 *     ,---.;  ; |            ,' ,'/ /|  .--.--.    
 *    /___/ \  | |   ,--.--.  '  | |' | /  /    '   
 *    \   ;  \ ' |  /       \ |  |   ,'|  :  /`./   
 *     \   \  \: | .--.  .-. |'  :  /  |  :  ;_     
 *      ;   \  ' .  \__\/: . .|  | '    \  \    `.  
 *       \   \   '  ," .--.; |;  : |     `----.   \ 
 *        \   `  ; /  /  ,.  ||  , ;    /  /`--'  / 
 *         :   \ |;  :   .'   \---'    '--'.     /  
 *          '---" |  ,     .-./          `--'---'   
 *                 `--`---'                         
 *                                                  
 */

:root {
  --color-primary: #a777b7;
  --color-secondary: #d8b0c0;
  --color-tertiary: #88a0f0;
  --textbox-shadow:  0 1px 0 1px black, inset 0 1px 0 1px black, 0 0 0 1px black, inset 0 0 0 1px black;
  --textbox-border: 1px solid white;
}

.gen-I {
  background-color: #c6cba5;
  background-image:  linear-gradient(#a8ad87 1px, transparent 1px), linear-gradient(to right, #a8ad87 1px, #c6cba5 1px);
  background-size: 20px 20px;
}

.gen-II {
  background-color: #8c72a2;
  background-image:  repeating-linear-gradient(45deg, #bba7c7 25%, transparent 25%, transparent 75%, #bba7c7 75%, #bba7c7), repeating-linear-gradient(45deg, #bba7c7 25%, #8c72a2 25%, #8c72a2 75%, #bba7c7 75%, #bba7c7);
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px;
}

.gen-III {
  background-color: #ececec;
  background-image:  linear-gradient(135deg, #d4d4d4 25%, transparent 25%), linear-gradient(225deg, #d4d4d4 25%, transparent 25%), linear-gradient(45deg, #d4d4d4 25%, transparent 25%), linear-gradient(315deg, #d4d4d4 25%, #ececec 25%);
  background-position:  10px 0, 10px 0, 0 0, 0 0;
  background-size: 20px 20px;
  background-repeat: repeat;
}

.gen-IV {
  background-color: #d4d4d4;
  background: linear-gradient(135deg, #ababab55 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(225deg, #ababab 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(315deg, #ababab55 25%, transparent 25%) 0px 0/ 20px 20px, linear-gradient(45deg, #ababab 25%, #d4d4d4 25%) 0px 0/ 20px 20px;
}

.gen-V {
  background-color: #ffcdec;
  background-image:  linear-gradient(30deg, #e5b8d4 12%, transparent 12.5%, transparent 87%, #e5b8d4 87.5%, #e5b8d4), linear-gradient(150deg, #e5b8d4 12%, transparent 12.5%, transparent 87%, #e5b8d4 87.5%, #e5b8d4), linear-gradient(30deg, #e5b8d4 12%, transparent 12.5%, transparent 87%, #e5b8d4 87.5%, #e5b8d4), linear-gradient(150deg, #e5b8d4 12%, transparent 12.5%, transparent 87%, #e5b8d4 87.5%, #e5b8d4), linear-gradient(60deg, #e5b8d477 25%, transparent 25.5%, transparent 75%, #e5b8d477 75%, #e5b8d477), linear-gradient(60deg, #e5b8d477 25%, transparent 25.5%, transparent 75%, #e5b8d477 75%, #e5b8d477);
  background-size: 20px 35px;
  background-position: 0 0, 0 0, 10px 18px, 10px 18px, 0 0, 10px 18px;
}

.Fan {
  background-color: #dedede;
  opacity: 1;
  background: radial-gradient(circle, transparent 20%, #dedede 20%, #dedede 80%, transparent 80%, transparent), radial-gradient(circle, transparent 20%, #dedede 20%, #dedede 80%, transparent 80%, transparent) 10px 10px, linear-gradient(#4b4b4b 0.8px, transparent 0.8px) 0 -0.4px, linear-gradient(90deg, #4b4b4b 0.8px, #dedede 0.8px) -0.4px 0;
  background-size: 20px 20px, 20px 20px, 10px 10px, 10px 10px;
}

.rpgmakerxp-version {
  --color-primary: #06663e;
  --color-secondary: #a4ddba;
  --color-tertiary: #a5d7b4;
  background-color: #20874f;
  opacity: 1;
  background: radial-gradient(circle, transparent 20%, #20874f 20%, #20874f 80%, transparent 80%, transparent), radial-gradient(circle, transparent 20%, #20874f 20%, #20874f 80%, transparent 80%, transparent) 10px 10px, linear-gradient(#1e6d49 0.8px, transparent 0.8px) 0 -0.4px, linear-gradient(90deg, #1e6d49 0.8px, #20874f 0.8px) -0.4px 0;
  background-size: 20px 20px, 20px 20px, 10px 10px, 10px 10px;
}


.Spinoffs {
  background-color: #f7f6e6;
  opacity: 1;
  background-image: repeating-linear-gradient(45deg, #cfc48d 25%, transparent 25%, transparent 75%, #cfc48d 75%, #cfc48d), repeating-linear-gradient(45deg, #cfc48d 25%, #f7f6e6 25%, #f7f6e6 75%, #cfc48d 75%, #cfc48d);
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px;
}

.rpgmakerxp-version .screenshots img {
  max-width: 240px;
}

.red-version {
  --color-primary:  #d00b11;
  --color-secondary: #f79f4f;
  --color-tertiary:  #f7db03
  background-color: #a40d14;
  background-image: linear-gradient(#ad252b 1px, transparent 1px), linear-gradient(to right, #ad252b 1px, #a40d14 1px);
  background-size: 20px 20px;
}

.blue-version {
  --color-primary: #3833ee;
  --color-secondary: #8cb2d7;
  --color-tertiary: #d5d4d0;
  background-color: #7373ff;
  background-image:  linear-gradient(#1821cc 1px, transparent 1px), linear-gradient(to right, #1821cc 1px, #7373ff 1px);
  background-size: 20px 20px;
}

.yellow-version {
  --color-primary: #d1b61f;
  --color-secondary: #fde500;
  --color-tertiary: #796526;
  background-color: #eeee97;
  background-image:  linear-gradient(#c0c079 1px, transparent 1px), linear-gradient(to right, #c0c079 1px, #eeee97 1px);
  background-size: 20px 20px;
}
.green-version {
  --color-primary: #128f27;
  --color-secondary: #65b11e;
  --color-tertiary: #0d6a1d;
  background-color: #139124;
  background-image:  repeating-linear-gradient(45deg, #1fb134 25%, transparent 25%, transparent 75%, #1fb134 75%, #1fb134), repeating-linear-gradient(45deg, #1fb134 25%, #139124 25%, #139124 75%, #1fb134 75%, #1fb134);
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px;
}

.gold-version {
  background-color: #958a5a;
  background-image:  repeating-linear-gradient(45deg, #bab27f 25%, transparent 25%, transparent 75%, #bab27f 75%, #bab27f), repeating-linear-gradient(45deg, #bab27f 25%, #958a5a 25%, #958a5a 75%, #bab27f 75%, #bab27f);
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px;
}

.silver-version {
  background-color: #9099a3;
  background-image:  repeating-linear-gradient(45deg, #c8ced1 25%, transparent 25%, transparent 75%, #c8ced1 75%, #c8ced1), repeating-linear-gradient(45deg, #c8ced1 25%, #9099a3 25%, #9099a3 75%, #c8ced1 75%, #c8ced1);
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px;
}

.crystal-version {
  --color-primary: #79a1b1;
  --color-secondary: #9876ac;
  --color-tertiary: #696eab;
  background-color: #A6DADF;
  background-image:  repeating-linear-gradient(45deg, #A6DADF 25%, transparent 25%, transparent 75%, #A6DADF 75%, #A6DADF), repeating-linear-gradient(45deg, #A6DADF 25%, #B4BEE1 25%, #B4BEE1 75%, #A6DADF 75%, #A6DADF);
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px;
}

.firered-version {
  background-color: #9b2126;
  opacity: 1;
  background-image: linear-gradient(135deg, #8b1d22 25%, transparent 25%), linear-gradient(225deg, #8b1d22 25%, transparent 25%), linear-gradient(45deg, #8b1d22 25%, transparent 25%), linear-gradient(315deg, #8b1d22 25%, #9b2126 25%);
  background-position: 10px 0, 10px 0, 0 0, 0 0;
  background-size: 20px 20px;
  background-repeat: repeat;
  --color-primary: #9b2126;
  --color-secondary: #ff797e;
  --color-tertiary: #ffc376;
}
.leafgreen-version {
  background-color: #9fcd50;
  opacity: 1;
  background-image:  linear-gradient(135deg, #83c549 25%, transparent 25%), linear-gradient(225deg, #83c549 25%, transparent 25%), linear-gradient(45deg, #83c549 25%, transparent 25%), linear-gradient(315deg, #83c549 25%, #9fcd50 25%);
  background-position:  10px 0, 10px 0, 0 0, 0 0;
  background-size: 20px 20px;
  background-repeat: repeat;
  --color-primary: #83c549;
  --color-secondary:  #9fcd50;
  --color-tertiary:  #e1ffac;
}
.ruby-version {
 background-color: #c24d3f;
  opacity: 1;
  background-image:  linear-gradient(135deg, #bd3e32 25%, transparent 25%), linear-gradient(225deg, #bd3e32 25%, transparent 25%), linear-gradient(45deg, #bd3e32 25%, transparent 25%), linear-gradient(315deg, #bd3e32 25%, #c24d3f 25%);
  background-position:  10px 0, 10px 0, 0 0, 0 0;
  background-size: 20px 20px;
  background-repeat: repeat;
  --color-primary: #bd3e32;
  --color-secondary: #eeaaa2;
  --color-tertiary: #ff6f5e;
}
.sapphire-version {
  background-color: #14afdf;
  opacity: 1;
  background-image:  linear-gradient(135deg, #0274bb 25%, transparent 25%), linear-gradient(225deg, #0274bb 25%, transparent 25%), linear-gradient(45deg, #0274bb 25%, transparent 25%), linear-gradient(315deg, #0274bb 25%, #14afdf 25%);
  background-position:  10px 0, 10px 0, 0 0, 0 0;
  background-size: 20px 20px;
  background-repeat: repeat;
  --color-primary: #0274bb;
  --color-secondary: #14afdf;
  --color-tertiary:  #d3eeff;
}
.emerald-version {
  background-color: #00a64e;
  opacity: 1;
  background-image: linear-gradient(135deg, #0c953c 25%, transparent 25%), linear-gradient(225deg, #0c953c 25%, transparent 25%), linear-gradient(45deg, #0c953c 25%, transparent 25%), linear-gradient(315deg, #0c953c 25%, #00a64e 25%);
  background-position: 10px 0, 10px 0, 0 0, 0 0;
  background-size: 20px 20px;
  background-repeat: repeat;
  --color-primary: #00a64e;
  --color-secondary: #5afda7;
  --color-tertiary: #cfa962;
}
.diamond-version {
  background-color: #7eb1b9;
  opacity: 1;
  background: linear-gradient(135deg, #6581b655 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(225deg, #6581b6 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(315deg, #6581b655 25%, transparent 25%) 0px 0/ 20px 20px, linear-gradient(45deg, #6581b6 25%, #7eb1b9 25%) 0px 0/ 20px 20px;
  --color-primary:  #6581b6;
  --color-secondary:#7eb1b9;
  --color-tertiary:  #d8e7ea;
}
.pearl-version {
  background-color: #e7dedf;
  opacity: 1;
  background: linear-gradient(135deg, #9a6b9755 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(225deg, #9a6b97 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(315deg, #9a6b9755 25%, transparent 25%) 0px 0/ 20px 20px, linear-gradient(45deg, #9a6b97 25%, #e7dedf 25%) 0px 0/ 20px 20px;
  --color-primary: #a2639a;
  --color-secondary:#e7dedf;
  --color-tertiary:  #e7dedf;
}
.platinum-version {
  background-color: #929b96;
  opacity: 1;
  background: linear-gradient(135deg, #c7cac855 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(225deg, #c7cac8 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(315deg, #c7cac855 25%, transparent 25%) 0px 0/ 20px 20px, linear-gradient(45deg, #c7cac8 25%, #929b96 25%) 0px 0/ 20px 20px;
  --color-primary: #625e5e;
  --color-secondary: #bbb;
  --color-tertiary: #cb6;
}
.heartgold-version {
  background-color: #d2a935;
  opacity: 1;
  background: linear-gradient(135deg, #aa882a55 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(225deg, #aa882a 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(315deg, #aa882a55 25%, transparent 25%) 0px 0/ 20px 20px, linear-gradient(45deg, #aa882a 25%, #d2a935 25%) 0px 0/ 20px 20px;
  --color-primary: #aa882a;
  --color-secondary: #aa882a55;
  --color-tertiary:  #d2a935;
}
.soulsilver-version {
  background-color: #ccd5da;
  opacity: 1;
  background: linear-gradient(135deg, #e1eaf955 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(225deg, #e1eaf9 25%, transparent 25%) -10px 0/ 20px 20px, linear-gradient(315deg, #e1eaf955 25%, transparent 25%) 0px 0/ 20px 20px, linear-gradient(45deg, #e1eaf9 25%, #ccd5da 25%) 0px 0/ 20px 20px;
  --color-primary: #8b959b;
  --color-secondary: #d3dce4;
  --color-tertiary:  #ccd5da;
}
.gen-unknown.unknown-version {
  background-color: #f8cd4b;
  background-image: linear-gradient(#5e599b 1px, transparent 1px), linear-gradient(to right, #5e599b 1px, #f8cd4b 1px);
  background-size: 20px 20px;
}


/***
 *                                                                       
 *                                                                       
 *                                                iiii                   
 *                                               i::::i                  
 *                                                iiii                   
 *                                                                       
 *       mmmmmmm    mmmmmmm     aaaaaaaaaaaaa   iiiiiiinnnn  nnnnnnnn    
 *     mm:::::::m  m:::::::mm   a::::::::::::a  i:::::in:::nn::::::::nn  
 *    m::::::::::mm::::::::::m  aaaaaaaaa:::::a  i::::in::::::::::::::nn 
 *    m::::::::::::::::::::::m           a::::a  i::::inn:::::::::::::::n
 *    m:::::mmm::::::mmm:::::m    aaaaaaa:::::a  i::::i  n:::::nnnn:::::n
 *    m::::m   m::::m   m::::m  aa::::::::::::a  i::::i  n::::n    n::::n
 *    m::::m   m::::m   m::::m a::::aaaa::::::a  i::::i  n::::n    n::::n
 *    m::::m   m::::m   m::::ma::::a    a:::::a  i::::i  n::::n    n::::n
 *    m::::m   m::::m   m::::ma::::a    a:::::a i::::::i n::::n    n::::n
 *    m::::m   m::::m   m::::ma:::::aaaa::::::a i::::::i n::::n    n::::n
 *    m::::m   m::::m   m::::m a::::::::::aa:::ai::::::i n::::n    n::::n
 *    mmmmmm   mmmmmm   mmmmmm  aaaaaaaaaa  aaaaiiiiiiii nnnnnn    nnnnnn
 *                                                                       
 *                                                                       
 *                                                                       
 *                                                                       
 *                                                                       
 *                                                                       
 *                                                                       
 */

h6 {
  text-align: center;
  margin: 0;
  margin-bottom: 10px;
  font-size: 1.1rem;
}
h1 {
  text-align: center;
  font-size: 2.2rem;
}
a {
  color: var(--color-primary);
  text-decoration: none;
  transition: 0.3s;
}
a:hover {
  color: var(--color-secondary);
  transition: 0.3s;
}
#main-wrapper {
  display: grid;
  grid-template-columns: 2fr 5fr;
  grid-template-rows: auto auto auto;
  row-gap: 20px;
  column-gap: 20px;
  max-width: 1060px;
  margin: 0 auto;
  font-size: 1.2rem;
  margin-top: 25px;
}

header {
  background: white;
  border: var(--textbox-border);
  box-shadow: var(--textbox-shadow);
  padding: 10px;
  max-width: 100%;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  grid-row: 1;
  grid-column: 1 / span 2;
}

#logo {
  height: 114px;
  image-rendering: pixelated;
  text-align: left;
  flex-basis: 50%;
}

#logo img {
  height: 100%;
}

.plugin-search {
  flex-basis: 50%;
  text-align: right;
}

.plugin-search .plugin-label {
  display: none;
}

nav {
  padding: 10px;
  text-align: center;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-evenly;
  grid-row: 2;
  grid-column: 1 / span 2;
  background: white;
  border: var(--textbox-border);
  box-shadow: var(--textbox-shadow);
}
nav a {
  padding: 5px 10px;
  color: white;
  text-decoration: none;
  font-weight: bold;
  background: #ac25ac;
  border-radius: 13px;
  width: 85px;
  font-size: 1.1rem;
  text-align: center;
  border: 1px solid black;
}
#pre-page-info {
  grid-row: 3;
  padding: 10px 50px;
  grid-column: 1 / span 2;
  background: white;
  box-shadow: 0 1px 0 1px black, inset 0 1px 0 1px black, 0 0 0 1px black, inset 0 0 0 1px black;
  border: 1px solid white;
  margin-bottom: 15px;
}
main {
  grid-row: 4;
  grid-column: 1 / span 2;
}
main#home, main#category, main#tag {
  display: grid;
  justify-content: space-around;
  align-content: center;
  grid-auto-flow: row;
  grid-template-columns: 1fr 1fr 1fr;
  row-gap: 10px;
  column-gap: 10px;
  background: white;
  border: var(--textbox-border);
  box-shadow: var(--textbox-shadow);
  padding: 10px;
}
#home .utterances {
  margin-top: 20px;
}
main#page {
  display: grid;
  grid-template-columns: 2fr 5fr;
  grid-gap: 20px;
}
body.gen-unknown.unknown-version main#page {
  display: initial;
} 
pre {
  overflow-x: auto;
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
}
aside {
  box-shadow: 0 1px 0 1px black, inset 0 1px 0 1px black, 0 0 0 1px black, inset 0 0 0 1px black;
  border: 1px solid white;
  background: white;
  padding: 3px;
}

section {
  border: 1px solid white;
  box-shadow: 0 1px 0 1px black, inset 0 1px 0 1px black, 0 0 0 1px black, inset 0 0 0 1px black;
  padding: 10px;
  background: white;
}

section p {
  margin: 6px 0;
}
article {
  width: 100%;
  text-align: center;
}

article .game-cover {
  width: 100%;
}
.game-rating {
  margin: 0 auto;
}
article a h3 {
  text-align: center;
}
#game-infobox {
  list-style-type: none;
  padding: 0px;
  margin-top: 10px;
}

#game-cover {
  margin: 0 auto;
}
#game-pages-list {
  list-style-type: none;
  padding-left: 0;
}

#game-pages-list li a {
  text-decoration: none;
}

.author {
  text-align: center;
  margin-bottom: 11px;
  font-weight: bold;
  font-style: italic;
}
.title a {
  text-decoration: none;
}
.title span {
  text-align: center;
  width: 100%;
  display: inline-block;
  font-weight: bold;
  font-size: 1.5rem;
  background: var(--color-primary);
  margin-top: 5px;
  color: white;
  transition: 0.3s;
}
.gamePage {
  font-weight: bold;
  font-size: 1.3rem;
}
.plugin-search {
  font-size: 1rem;
}
.title span:hover {
  color: var(--color-tertiary);
  transition: 0.3s;
}
#review-block {
  background: var(--color-secondary);
  padding: 10px;
  border: var(--textbox-border);
  box-shadow: var(--textbox-shadow);
}
.rating {
  text-align: center;
  font-weight: bold;
  font-family: sans-serif;
  text-transform: uppercase;
}
.rating img {
  display: ;
  margin: 0 auto;
  margin-bottom: 6px;
}

.positive-point:before {
  content: "➕";
  font-size: 1rem;
}
.negative-point:before {
  content: "➖";
  font-size: 1rem;
}
#review-block ul {
  list-style-type: none;
  padding: ;
  padding: ;
  padding-left: 5px;
  margin: 0;
}

.screenshots {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.contact3 {
  background: white;
  border: var(--textbox-border);
  box-shadow: var(--textbox-shadow);
  padding: 12px;
  padding-top: 15px;
  padding-bottom: 15px;
}

.alert {
  text-align: center;
  margin-bottom: 15px;
  font-weight: bold;
}
.alert-success {
  background: #b1eeb1;
  border: 1px solid green;
}

.alert-danger {
  background: #eeb1b1;
  border: 1px solid maroon;
}
#submit {
  margin: 0 auto;
  display: block;
  margin-top: 15px;
  background: #f8cd4b;
  border: 1px solid #5e599b;
  padding: 3px 10px;
  font-weight: bold;
  border-radius: 12px;
}
.contact3 input, .contact3 textarea {
  max-width: 100%;
  min-width: 75%;
}
.form-group {
  text-align: center;
}
.contact3 textarea {
}
.utterances {
  grid-column: 1 / span 2;
  max-width: 100%;
  background: white;
  border: var(--textbox-border);
  box-shadow: var(--textbox-shadow);
}
footer {
  grid-row: 5;
  text-align: center;
  padding: 6px;
  grid-column: 1 / span 2;
  background: white;
  box-shadow: 0 1px 0 1px black, inset 0 1px 0 1px black, 0 0 0 1px black, inset 0 0 0 1px black;
  border: 1px solid white;
  margin-bottom: 15px;
}

@media (max-width: 450px){
  body {
    margin-left: 5px;
    margin-right: 5px;
  }
  main#page {
    display: initial;
  }
  main#category, main#tag, main#home {
    grid-template-columns: 1fr 1fr;
  }
  header {
    /*! display: block; */
    flex-direction: column;
    margin-bottom: 0px;
  }
  #logo {
    flex-basis: initial;
    margin: 10px auto 20px auto;
  }
  .plugin.plugin-search {
    flex-basis: initial;
    width: 100%;
    text-align: center;
    font-size: 1.3rem;
  }
  aside {
    margin-bottom: 20px;
  }
  .utterances {
    margin-top: 20px;
  }
  #pre-page-info {
    padding: 10px;
    margin: 0px;
  }
}