/*! HTML5 Boilerplate v8.0.0 | MIT License | https://html5boilerplate.com/ */

/* main.css 2.1.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/

/* ==========================================================================
  Base styles: opinionated defaults
  ========================================================================== */

html {
  color: #000;
  background: #e7e7e7;
  font-family: Raleway, sans-serif;
  font-weight: normal;
  font-size: 14px;
  line-height: 1.4;
}

body{
  padding-top: 0.5em;
  background: #fff;
}

/*
  * Remove text-shadow in selection highlight:
  * https://twitter.com/miketaylr/status/12228805301
  *
  * Vendor-prefixed and regular ::selection selectors cannot be combined:
  * https://stackoverflow.com/a/16982510/7133471
  *
  * Customize the background color to match your design.
  */

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
  * A better looking default horizontal rule
  */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
  * Remove the gap between audio, canvas, iframes,
  * images, videos and the bottom of their containers:
  * https://github.com/h5bp/html5-boilerplate/issues/440
  */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
  * Remove default fieldset styles.
  */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
  * Allow only vertical resizing of textareas.
  */

textarea {
  resize: vertical;
}

/* ==========================================================================
    Author's custom styles
    ========================================================================== */

@font-face {
  font-family: 'Forum';
  src: url('fonts/Forum.woff2') format('woff2'),
      url('fonts/Forum.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-Thin.woff2') format('woff2'),
      url('fonts/Raleway-Thin.woff') format('woff');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-Medium.woff2') format('woff2'),
      url('fonts/Raleway-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-ExtraLight.woff2') format('woff2'),
      url('fonts/Raleway-ExtraLight.woff') format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-BoldItalic.woff2') format('woff2'),
      url('fonts/Raleway-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-SemiBold.woff2') format('woff2'),
      url('fonts/Raleway-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-Light.woff2') format('woff2'),
      url('fonts/Raleway-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-BlackItalic.woff2') format('woff2'),
      url('fonts/Raleway-BlackItalic.woff') format('woff');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-ExtraBoldItalic.woff2') format('woff2'),
      url('fonts/Raleway-ExtraBoldItalic.woff') format('woff');
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-MediumItalic.woff2') format('woff2'),
      url('fonts/Raleway-MediumItalic.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-Black.woff2') format('woff2'),
      url('fonts/Raleway-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-ExtraBold.woff2') format('woff2'),
      url('fonts/Raleway-ExtraBold.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-LightItalic.woff2') format('woff2'),
      url('fonts/Raleway-LightItalic.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-ExtraLightItalic.woff2') format('woff2'),
      url('fonts/Raleway-ExtraLightItalic.woff') format('woff');
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-Italic.woff2') format('woff2'),
      url('fonts/Raleway-Italic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-SemiBoldItalic.woff2') format('woff2'),
      url('fonts/Raleway-SemiBoldItalic.woff') format('woff');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-Bold.woff2') format('woff2'),
      url('fonts/Raleway-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-Regular.woff2') format('woff2'),
      url('fonts/Raleway-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Raleway';
  src: url('fonts/Raleway-ThinItalic.woff2') format('woff2'),
      url('fonts/Raleway-ThinItalic.woff') format('woff');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Carlito';
  src: local('Calibri'), local('Carlito'),
      url('fonts/subset-Carlito.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
    font-family: 'Asenine';
    src: url('fonts/AsenineCyrillic.woff2') format('woff2'),
        url('fonts/AsenineCyrillic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
  font-family: 'Bona Nova';
  src: url('fonts/BonaNova-Regular.woff2') format('woff2'),
      url('fonts/BonaNova-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'v_CCAlchemite';
  src: url('fonts/v_CCAlchemite.woff2') format('woff2'),
      url('fonts/v_CCAlchemite.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Cambria';
  src: url('fonts/subset-Cambria-Bold.woff2') format('woff2'),
      url('fonts/subset-Cambria-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Agatha-Modern';
  src: url('fonts/Agatha-Modern.woff2') format('woff2'),
      url('fonts/Agatha-Modern.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Sony Sketch EF';
  src: url('fonts/SonySketchEF.woff2') format('woff2'),
      url('fonts/SonySketchEF.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Jura';
  src: url('fonts/Jura-Regular.woff2') format('woff2'),
      url('fonts/Jura-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Jura';
  src: url('fonts/Jura-Light.woff2') format('woff2'),
      url('fonts/Jura-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'AdverGothicC';
  src: url('fonts/AdverGothicC.woff2') format('woff2'),
      url('fonts/AdverGothicC.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Arthur Gothic';
  src: url('fonts/ArthurGothic.woff2') format('woff2'),
      url('fonts/ArthurGothic.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Copperplate';
  src: url('fonts/CopperplateCyrillic-Bold.woff2') format('woff2'),
      url('fonts/CopperplateCyrillic-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Aeromatics';
  src: url('fonts/AeromaticsSmallCapsNC.woff2') format('woff2'),
      url('fonts/AeromaticsSmallCapsNC.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/Montserrat-Thin.woff2') format('woff2'),
      url('fonts/Montserrat-Thin.woff') format('woff');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/Montserrat-ExtraBold.woff2') format('woff2'),
      url('fonts/Montserrat-ExtraBold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/Montserrat-Black.woff2') format('woff2'),
      url('fonts/Montserrat-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/Montserrat-Regular.woff2') format('woff2'),
      url('fonts/Montserrat-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/Montserrat-Medium.woff2') format('woff2'),
      url('fonts/Montserrat-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/Montserrat-SemiBold.woff2') format('woff2'),
      url('fonts/Montserrat-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/Montserrat-ExtraLight.woff2') format('woff2'),
      url('fonts/Montserrat-ExtraLight.woff') format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/Montserrat-Light.woff2') format('woff2'),
      url('fonts/Montserrat-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/Montserrat-Bold.woff2') format('woff2'),
      url('fonts/Montserrat-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Body Grotesque Large';
  src: local('Body Grotesque Large Regular'), local('BodyGrotesque-LargeRegular'),
      url('fonts/BodyGrotesque-LargeRegular.woff2') format('woff2'),
      url('fonts/BodyGrotesque-LargeRegular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}


     
/* overall site structure */

a
{
  color: #6c88a1;
  text-decoration: none;
  font-weight: 500;
}

header a, footer a, .book a, a.author, .author .name>a, .dropdown a, .dropdown-l2 a, .dropdown form input, .dropdown li button
{
  color: #58636d;
  font-weight: 500;
}

p
{
  margin: 1em 0 0 0;
}

.page-login p, .page-register p
{
  margin-top: 3em;
  font-size: 12px;
}

p:first-child
{
  margin: 0;
}

@keyframes newmarker {
  0%
  {
    filter: initial;
  }
  100% 
  { 
    filter: brightness(2);
  }
}

.new-marker
{
  /*animation: 1.5s cubic-bezier(.1,.09,.92,-0.25) 1s infinite alternate newmarker;*/
  /*animation: 2.5s cubic-bezier(1,-0.34,.77,1.12) 1s infinite alternate newmarker;*/
  animation: 2s cubic-bezier(1,-0.34,.84,1.11) 1s infinite alternate newmarker;  
}

/*
.new-marker
{
  position: relative;
}

.new-marker::before
{
  all: initial;
 
  font-family: Carlito;
  content: 'нове';
  display: inline-block;
  position: absolute;
  color: #d33;
  font-size: 11px;
  line-height: 1;
  top: -13px;
  right: 0;
  font-style: initial;
  font-weight: initial;
}*/

/*
.__new-marker::before
{
  content: '•';
  display: inline-block;
  position: absolute;
  color: #22f;
  font-size: 40px;
  line-height: 1;
  top: -23px;
  left: -10px;
}

.__new-marker
{
  __position: relative;
  __text-shadow: 1px 1px 4px #6ca1c9;
  __outline: 4px solid #6ca1c9;
  __outline-offset: 0;
  __border-radius: 5px;
  __background-color: #6ca1c9;
  
  __animation: 2s linear newmarker;
}
*/

/*a:not([class]):hover, a:not([class]):focus*/
a[href]:hover, a[href]:focus, a[onclick]:hover, a[onclick]:focus, button:not([class=inactive]):hover, button:not([class=inactive]):focus, 
input[type=submit]:hover, input[type=submit]:focus,
input[type=image]:hover, input[type=image]:focus,
.dots-btn:hover, .dots-btn:focus, a.action:hover, a.action:focus
{  
  filter: contrast(1.2) saturate(1.2) brightness(0.6);
  text-decoration: none;
}

a.logo, .notint
{
  filter: none !important;
}

/*
.notint:hover img
{
  filter: contrast(1.1) saturate(1.1) brightness(0.9);
}
*/

.sort-types a.active
{
  color: #333;
}

.sort-types a.mandatory
{
  /*color: #ff424e;*/
  color: #e4a94a;
}

.sort-types a.mandatory.active
{
  /*color: #97282f;*/
  color: #8c682d;
}

a.action
{
  /*! color: #6c88a1; */
}

#header form
{
  display: inline-block;  
  flex: 1;
}

#header .logo
{
  margin: 4px 10px 4px 0;
  display: inline-block;
  flex: 1;
  max-width: 168px; /*150px*/
}

#header .logo span
{
  /* background: no-repeat url(logo/logo_ukraine_340x92.png) right center; */
  background: no-repeat url(logo/logo_dn.png) right center;
  
  width: 168px;
  height: 46px;
  display: inline-block;
  vertical-align: middle;
  background-size: auto 46px;
  margin-left: -60px;
}

#header nav input
{
  border: 1px solid #bbb;
  border-radius: 5px;
  background-repeat: no-repeat;
  background-image: url(search_icon_40.png);
  background-position: 5px center;
  background-size: 20px;
  padding-left: 40px;
  padding-right: 0.5em;
  /*! width: 13em; */
  width: 100%;
  box-sizing: border-box;
  vertical-align: middle;
  max-width: 20em;
  min-width: 10em;
}

#header input::placeholder
{
  color: #aaa;
}

input::placeholder, textarea::placeholder
{
  color: #aaa;
}

.usernav
{
  display: inline-block;
  /*! margin-top: -0.3em; */
  margin-left: 1em;  
  vertical-align: middle;
  /*! padding: 6px 5px; */
}

.navmenu
{
  /*! display: table-cell; */
  /*! margin: 0 1em 0 0; */
  /*! height: 36px; */
  /*! align-self: stretch; */
  /*! align-content: center; */
  /*! vertical-align: middle; */
  height: 36px;
  /*! line-height: 36px; */
  width: 36px;
  text-align: center;
  /*! gap: 0; */
}

.page-contest-details main{
  padding: 1em;
}
/* 
.page-contest-details main{
  height: 100%;
  overflow: scroll;
} */

.page-help-ukraine main h1
{
  font-size: 2em;
  margin-bottom: 1rem;
}

.page-help-ukraine main h2
{
  font-size: 1.5em;
}

.page-help-ukraine main a
{
  color: #2068a8;
}

.page-help-ukraine main .war-block
{
  margin-top: 2rem;
}

.page-help-ukraine main img
{
  max-width: 100%;
  height: auto;
}

.page-help-ukraine .war-prime
{
  font-size: 1.5em;
}

.page-help-ukraine .war-flow {
  display: flex;
  gap: 1em;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-bottom: 3em;
}

.war-important {
  font-size: 1.1em; font-family: Carlito; color: #555; font-weight: 500;
  margin-top: 0.2rem;
}

.navmenu>img
{
  /*! display: block; */
  /*! line-height: 36px; */
  padding: 6px 0;
}

.trigger, .trigger-l2
{
  position: relative;
}

.trigger:hover, .trigger li, a[onclick], .trigger-l2:hover, .trigger-l2 li
{
  cursor: pointer;
}

.usernav .avatar
{
  width: 45px;
  height: 45px;
  border-radius: 45px;
  padding: 6px 5px 5px 5px;
}

.usernav .logout a
{
  background: no-repeat url(exit.png) 1.5em center;
  background-size: 16px;
  padding-left: 3em;
  color: #666
}

#header .usernav a
{
  margin: 0;
  display: block;
}

.dropdown, .dropdown-l2
{
  display: none;
  position: absolute;
  right: 0;
  list-style: none;
  margin: 1px 0 0 0 !important;

  text-align: left;

  background: #d5d5d5; 
  width: max-content;
  min-width: 122px;
  padding: 0;
  z-index: 1000;
}


.dropdown li, .dropdown-l2 li
{
  padding: 0;
  margin: 0;
}

/* .dropdown-l2 {
  top: 0;
  right: 100%; 
}
*/

.comment .edit-actions .dropdown-l2 {
  right: initial;
}

.dropdown li > *:not(ul):not(menu)
{
  padding: 1em 1.5em;
  display: block;
}

.usernav:focus,
.usernav:focus-within,
.navmenu:focus,
.navmenu:focus-within
{
  background: #d5d5d5;
}

@keyframes show-dropdown {


  0% {
    transform: scaleY(0);
    opacity: 0;
  }

  100% {
    transform: scaleY(1);
    opacity: 1;
  }

}

.trigger:focus .dropdown, .trigger-l2:focus .dropdown-l2,
.trigger:focus-within .dropdown, .trigger-l2:focus-within .dropdown-l2,
.trigger .dropdown:focus-within, .trigger-l2 .dropdown-l2:focus-within
{
  display: block;
  animation: show-dropdown 200ms ease-in-out forwards;
  transform-origin: top center;
}

.dropdown li div.our-social 
{
  padding: 0.6em;
  text-align: center;
  display: flex;
  /*! gap: 3px; */
  justify-content: space-evenly;
  align-items: center;
  background: #ddd;
}

li:last-child .our-social {
  padding-bottom: 1em;
}

li .our-social img
{
  border-radius: 3px;
  /*width: 24px;*/
  height: auto;
}

#header .auth-block
{
  float: right;
  height: 56px;  
  /*! margin-top: 5px; */
}

#header .login-block
{
  line-height: 56px;
}

#header .login-block a
{
  margin: 0 0.5em;  
}

#header .auth-block .write, #header .auth-block .notifications, #header .auth-block .messages
, #header .auth-block .mylib
, #header .auth-block .complaint
{
  display: inline-block;
  width: 28px;
  height: 28px;
  background-size: 28px;
  
  background-repeat: no-repeat;
  vertical-align: middle;
}

#header .auth-block > a {
  margin-left: 1em;
}

#header .auth-block .mylib
{
  background-image: url(icons/lib_icon_56.png);
  width: 35px;
  background-size: 35px 28px;
}

#header .auth-block .write
{
  background-image: url(new_book_icon_56.png);
}

#header .auth-block .notifications
{
  background-image: url(notification_icon_56.png);
  text-align: right;
}

#header .auth-block .messages
{
  background-image: url(direct_icon_56.png);
  text-align: right;
}


.count-circle
{
  background: #e42e2d;
  color: #fff;
  display: inline-block;
  border-radius: 1.4em;
  line-height: 1.4em;
  min-width: 1.4em;
  font-family: Carlito;
  text-align: center;
  font-size: 14px;
  margin: 0 0.3em 2px 0.3em;
  vertical-align: middle;
}

.auth-block .count-circle
{
  margin-left: 17px;
  margin-top: 3px;
  border: 2px solid #e7e7e7;  
  
  border-radius: 1.2em;
  line-height: 1.2em;
  min-width: 1.2em;  
  font-size: 12px;
}

footer, header#tophead, .user-banner 
{  
  clear:both;
}

.tip
{
  font-size: 12px;
  margin-top: 0.5em;
}

.tip.outside
{
  margin-top: 0;
  margin-bottom: 1em;
}


.rules-warning
{
  color: #db8d80;
  margin-bottom: 1.5em;
}

#cover_size:after
{
  content: "512x800";
}

.add-verse #cover_size:after
{
  content: "800x680";
}

.btype1 #cover_size:after
{
  content: "512x512";
}

.main, .content main, .footer, #header, .book-info, .important-msg
{
  margin: 0 auto;
  width: 64%;
  padding: 0 3.5em;
  box-sizing: border-box;
  /*! display: inline-block; */
}

.with-sides .content
{
  float: right;  
  /*! display: inline-block; */
  width: 82%;
}

.with-sides main
{
  width: 78%;
  vertical-align: top;
  display: inline-block;
  margin-bottom: 1em;
}

.page-contest-results #main
{
  position: relative;
}

.contest-details-author
{
  color: #6c88a1;
}

.contest-results-notes
{
  color: #b77368;
}

.page-contest .sort-types
{
  font-size: 16px;
}

.page-contest .tabs-header
{
  margin-bottom: 1em;
}

.contest-bonus-details-title
{
  color: #e6a237;  
  font-weight: normal;
}

.contest-bonus-details
{
  background: #f1f1f1;
}

.contest-details-container
{
  overflow: auto;
}

table.contest-details
{
  font-size: 12px;
  border-collapse: collapse;
  text-align: center;  
  font-family: Carlito;
}

table.contest-details th
{
   font-size: 12px;

   font-weight: bold;
  
   border: 1px solid #eee;
   padding: 3px;
  
}

table.contest-details th.row
{
     min-width: 20em;
     /*! position: fixed; */
}

table.contest-details th.row a
{
  color: #000;
  font-weight: bold;
}

table.contest-details td
{
  border: 1px solid #eee;
   padding: 3px;  
}

.with-sides .news
{
  width: 22%;
  vertical-align: top;
  display: inline-block;
}


.side
{
  width: 18%;
  box-sizing: border-box;
  padding: 0 1em;
}

.promo
{
  /*! --background: green; */
  float: left;
  /*! margin-top: 7px; */
  min-width: 10em;
  text-align: right;
}


.blog-details 
{
  position: relative;
}

.blog-details h1
{
  margin-bottom: 0.3em;
}

.blog-item .edit-actions
{
  /*! position: absolute; */
  /*! right: 0; */
  /*! top: 0; */
  float: right;
}

/* .blog-moderate{
  position:absolute;
  height: 65%; 
  transform: translateY(35%); 
  text-align:center; 
  width: 100%; 
  background-image: linear-gradient(to right, rgba(0, 255, 255, 0.9),rgba(0, 255, 255, 1), rgba(0, 255, 255, 0.9) ); 
  opacity:0.8;
}

div.blog-is-moderate{
  position:relative;
}

div.blog-moderate h3{
  transform: translateY(35%); 
  height:100%;
} */

.important-msg
{
  color: #e40f00;
  --text-align: center;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  --font-size: 16px;
}

#all-genres-filter label
{
  display: block;
}

#all-genres-filter label.genre-filter-sub
{
  padding-left: 2em;
}

.page-genres #main .block {
  display: block;
}

.all-tags .tag
{
  font-size: 1.3em;
  margin-right: 0.5em
}

.contest-root {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;  

  gap: 0 2em;

  margin-bottom: 3em;
}

.contest-root img {
  max-width: 100%;
  height: auto;
  width: 400px;
  border-radius: 5px;
  margin-bottom: 0.5em;
}

.all-genres {
  display: flex;
  flex-wrap: wrap;
  --justify-content: space-between;
  justify-content: flex-start;
  align-items: flex-start;  

  gap: 2em 2em;
}

.all-genres ul 
{
  margin: 0;
}

.all-genres li
{
  list-style-type: "◆"
}


.block-community .all-genres, .block-arkush .all-genres {
  justify-content: flex-start;
}

.block-all-genres
{
  margin-bottom: 3.2em;
}

.genre-root
{
  display: inline-block;
  /*! --margin: 0 1em 1em 0; */
  vertical-align: top;
  max-width: 100%;
}

.genre-root .title
{
  display: flex;
  background-repeat: no-repeat;
  background-size: cover;
  background-position-x: center;
  
  width: 328px;
  height: 100px;  

  border-radius: 5px;
  color: white;
  
  box-sizing: border-box;
  
  font-size: 1em;

  align-items: flex-end;
  justify-content: flex-end;
  
  margin-bottom: 0.5em;
  max-width: 100%;
  flex-direction: column;
  padding-bottom: 0.5em;
  gap: 0.2em;
}

.genre-root .title span {
  background: #00000090;
  
  padding: 0.2em 0.4em;
  line-height: 1;
  
  /*! margin-bottom: 0.5em; */
}

.genre-sub
{
  display: block;
  /*! margin-bottom: 0.3em; */
  line-height: 1.7;
}

.contest-status-1 {
  color: #76996a;
}

.contest-status-2 {
  color: #fcbe5b;
}

.contest-status-3 {
  color: #ff424e;
}

.contest-status-4, .contest-status-5 {
  color: #ff424e;
}

.contest-status {
  font-size: 1.1em;
}

.info-entry 
{
  color: #666;
  margin-top: 0.5em;
  /*! line-break: anywhere; */
}

.contest-descr {
  margin-top: 0.5em;
  white-space: pre-line;
}

.info-entry a {
  margin-right: 0.5em;
}

.contest-num {
  font-size: 1.3em
}

.info-value {
  font-weight: bold;
}

.contest-info {
  flex: 1;
  min-width: 15em;
}

.contest-info h2
{
  margin: 0;
  font-size: 1.4em;
}

/* #dn2120-banner--
{
  background: no-repeat url(contests/kazkochas/kazkochas_top.png) center;
  background-size: contain;
  height: 87px;
  display: block;
  border-radius: 5px;
  margin-top: 1em;
}
 */
.top-poster
{
  flex: 10;
  flex-basis: 100%;
  margin: 0.4em 0;
}

.top-poster
{
  /*! --background-size: contain; */
  background-size: auto 100%;
  background-repeat: no-repeat;
  background-position: center;
  /*! height: 46px; */  
  /*! border-radius: 5px; */
  /*! --max-width: 559px; */
  height: 36px;
}

.top-poster
{
  background-image: url(featured/zsu_top.png);
}

/* #top-poster0
{
  background-image: url(contests/allmor2021/allmor_top_prose.png);
}
#top-poster1
{
  background-image: url(contests/allmor-poetry2021/allmor_top_poetry.png);
}
#top-poster2
{
  background-image: url(contests/kazkochas/kazkochas_top2.png);
} */

.main-top-banner
{
  text-align: center;
}

.main-top-banner img, .top-poster img
{
  width: 100%;
  height: auto;
  border-radius: 5px;
  max-width: 1119px;  
}

.page-contest #contest-add
{
  text-align: center;
  margin-bottom: 2em;
}

.page-contest #contest-add .important {
  font-size: 14px;
  white-space: pre-line;
}

.page-contest h1
{
  /*! margin-bottom: 0; */
  text-align: center;
  font-size: 32px;
}


.page-contest-allmor2021 #contest-add,
.page-contest-allmor-poetry2021 #contest-add,
.page-contest-allmor2021 h1,
.page-contest-allmor-poetry2021 h1
{
  font-family: 'Bona Nova';
}

.page-contest-kazkochas #contest-add
{
  font-family: 'v_CCAlchemite';
}

.page-contest-kazkochas .competition-submit-stats
{
  font-size: 18px;
}

.menu-wrapper
{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  /*! width: 100%; */
  gap: 5px 0;
}

header#tophead nav
{
  display: inline-block;
  /*! margin-top: 0.3em; */
  /*! margin-bottom: 0.3em; */  
  vertical-align: middle;
  height: 45px;
  flex: 5;
  display: flex;
  align-items: center;
  /*gap: 0.7em;*/
}

header#tophead nav > *
{
  margin-right: 0.7em;
}

header#tophead nav > *:last-child
{
  margin-right: 0;
}

header#tophead
{
  /*! padding: 0.5em 0 0 0; */
  /*! margin-top: 0.5em; */
  border-top: 1px solid #999;
  border-bottom: 1px solid #999;
  background: #e7e7e7;  
}

.with-sides header#tophead
{
  margin-bottom: 1.5em;
}

#header
{
  line-height: 1;  
  /*! margin: 0.3em auto; */
}

header#tophead nav a
{
  text-transform: uppercase;  
}

header#tophead nav>a, .login-block a
{
  white-space: nowrap;

  display: inline-block;
  vertical-align: middle;

}

header#tophead nav>a {

  line-height: 36px;
  /*! padding-right: 0.7em; */
}

footer
{  
  border-top: 1px solid #999;
  min-height: 100px;
  background: #e7e7e7;
  margin-top: 2em;
  /*! vertical-align: bottom; */
  bottom: 0;
  position: relative;
}

#copyright
{
  float: left;
  margin-right: 1.5em;
  max-width: 47em;
}

#legal-info
{
  padding-right: 1.5em;
  /*! float: right; */
  /*! margin-right: 3em; */
}

#copyright, #legal-info
{
  display: inline-block;
}

#legal-info a
{
  display: block;
  margin-top: 0.5em;
}

#disclaimer
{
  padding-top: 1em;
  padding-bottom: 2em;
  clear: both;
}

#copyright .copyright
{
  margin-right: 4em;
}

#copyright .copyright, .info-label
{
  font-size: 14px;
  margin-bottom: 1.7em;
}

.promo .our-social
{
  margin-top: 1em;
  margin-bottom: 3em;  
  /*! text-align: right; */
}

.promo .our-social a
{  
  margin-left: 1.2em;
}

.promo .our-crowdfundings
{
  max-width: 18em;
  display: inline-block;
}

.patreon img
{
  margin: 1.2em 14px 0 14px;
}

#arkush-counter
{
  display: inline-block;
  min-width: 222px;
  box-sizing: border-box;
  margin-top: 2.5rem;
  padding: 1.2em;
  padding-top: 0em;
  background-color: #f1f1f1;
  border-radius: 5px;
  text-align: center;
  font-family: Forum;
  font-size: 20px;
  color: #999999;
}

#arkush-counter img
{
  margin-top: -1.7em;
}

#arkush-counter #arkush-title span
{
  font-size: 30px;
  color: #58636d;
}

#arkush-counter-body
{
  padding-left: 1em;
}

#arkush-counter-body div
{
  text-align: left;
  margin-top: 9px;
}

#arkush-counter-body span
{
  display: inline-block;
  font-size: 26px;
  color: white;
  text-align: center;
  vertical-align: middle;
  min-width: 36px;
  line-height: 1.25;
  background-color: #6ca1c9;
  border-radius: 5px;
  padding: 0em 10px;
  margin-right: 10px;
}

#arkush-blogs, #arkush-comments
{
  font-family: Raleway;
  font-size: 13px;
  color: #999;
}

#arkush-blogs span, #arkush-comments span
{
  background-color: transparent;
  border: 1px solid #ccc;
  line-height: 1.5;
  font-size: 15px;
  color: #666;  
  font-weight: normal;
}

#arkush-audiobooks, #arkush-readers
{
  margin-bottom: 1em;
}

#arkush-counter #arkush-books span
{
  background-color: #76996a;
}

#arkush-counter #arkush-verse span
{
  background-color: #129192;
}

#arkush-counter #arkush-audiobooks span
{
  background-color: #c4589d;
}

#arkush-counter #arkush-readers span
{
  background-color: #6e7c88;
}

.arkush-friends
{
  /*! margin-top: 2em; */
  /*! text-align: right; */
  font-family: Forum;
  font-size: 22px;
  color: #999999;
}

.arkush-friends
{
  display: inline-block;
  min-width: 222px;
  box-sizing: border-box;
  text-align: center;
}


.arkush-friends span
{
  font-size: 30px;
  color: #666666;
}

.arkush-friends img
{
  display: inline-block;
  margin-top: 0.5em;
  border-radius: 5px;
  text-align: center;
}


.patreon
{
  display: inline-block;
  width: 222px;
  box-sizing: border-box;
  margin-top: 3rem;
  padding: 1.4em;
  padding-top: 0em;
  background-color: #f1f1f1;
  border-radius: 5px;
  text-align: center;
  font-family: Raleway;
  font-size: 14px;
  color: #333333;
  font-weight: 500;
}

#patreon_heart
{
  margin-top: -2.1em;
  margin-bottom: 0.2em;
  margin: -2.1em auto 0.2em auto;
}

.patreon-text
{
  margin-top: 0.7em;
  /*! font-family: Forum; */
  /*! font-size: 18px; */
}

.patreon-header
{
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  color: white;
  text-align: center;
  vertical-align: middle;
  line-height: 1.25em;
  background-color: #ff424e;
  border-radius: 5px;
  padding: 0.5em 0.9em;
  margin: 1.2em 0;
}

.patreon-list
{
  line-height: 1.8em;
  color: #555555;
}


footer .our-social
{
  margin-top: 1em;
}

footer .our-social a
{  
  margin-right: 1em;
}

footer .our-crowdfundings
{
  float: right;
  width: 210px;
  font-size: 12px;
}

footer .our-crowdfundings img {
    padding-top: 12px;
    padding-right: 14px;
}


.footer
{
  padding-top: 2em;
  padding-bottom: 2em;
  /*! margin-top: 1em; */
}

.logo
{
  font-family: Forum, sans-serif;
  font-size: 32pt;
  margin-top: -2px;
}

.blog-item
{
  margin-bottom: 3em;
}

.blog-item.in-moderation, .blog-item.is-draft
{
  opacity: 0.6;
  background: #eee;
}

.blog-details.in-moderation, .blog-details.is-draft
{
  opacity: 0.8;
}

.blog-item .moderation-label, .blog-details .moderation-label
{
  color: #0d99d3;
}

.blog-details .blog-item
{
  margin-bottom: 2em;
}

h2
{
  font-size: 16px;
  color: #333;  
  font-weight: 600;
  margin-bottom: 0.8em;
  margin-top: 1em;
  /*border-top: 1px solid #eee;*/
  
}

.page-dn2120 h2
{
  margin: 2em 0;
}

.news-page h2
{
  color: #333;
}

.news-date
{
  color: #999;
  font-weight: 500;
  margin-bottom: 0.7em;
  /*! margin-left: 1.2em; */
  /*! margin-top: 0.7em; */
  /*! display: inline-block; */
}

.ugc a, .comment-content a, .news-content a
{
  color: #6c88a1;
  word-break: break-word;
}

.plaintext a {
  word-break: break-word;
}


.plaintext, .ugc
{
  /*! white-space: pre-line; */
  hyphens: auto;
  overflow-wrap: break-word;
}

.plaintext pre, .ugc pre {
  white-space: pre-line !important;
}

/*
.news-content *
{
  white-space: initial;
}
*/

.news-content ol
{
  margin-left: 0em;
  padding-left: 1em;
}

.news-content li::marker
{
  color: #6c88a1;
  font-weight: 500;
}

.news
{
  /*! --background: blue; */
  /*! float: right; */
  /*! padding-top: 53px */
  display: inline-block;
  width: 20%;
  vertical-align: top;
} 

.edit-book
{
  text-align: right;
}

.info-label
{
  text-transform: uppercase;
}

#mobile-shortcuts .block
{
  text-align: center;
  margin: 0.4em;
}

#featured
{
  font-weight: normal;
}

.news .label
{
  margin-bottom: 1.8em;
  display: block;
}

.news .label
{
  margin-top: 2.6em;
}

.news .block
{
  padding-left: 0px;
}

.about.block .ugc img, .news-content img, .about.block .ugc video, .news-content video 
{
  margin-top: 1em;
  max-width: 100%;
  height: auto;
  border-radius: 5px;
}

.news-content img[src*="arkush.net/covers"],
.news-content img[src*="localhost/covers"]
{
  max-width: 256px;
}

.side .block
{
  /*! text-transform: uppercase; */
  padding: 0;
}

.featured-news a
{
  display: inline-block;
  width: 222px;
}

.featured-news .label
{
  font-size: 0.9em;
}

.featured-news a img
{
  width: 100%;
  height: auto;
  border-radius: 5px;
}

.promo.side .inner
{
  max-width: 222px;
  display: inline-block;
}

#community .inner a
{
  display: block;
  margin-bottom: 1em;
}

#community .inner a:last-child
{
  margin-bottom: 0;
}


.promo .block
{
  /*! text-align: right; */
  margin-top: 2.5rem;
  display: block;
}

.top-promo .block
{
  margin-top: 1.5rem;
}


.top-promo .block:first-child
{
  margin-top: 0;
}


.book .cover
{
  display: block;
  /*! box-shadow: 1px 1px 5px #000; */
}

.book .cover::after 
{
  height: 20px;
  
  background: red;
  content: '';
  --display: block;
}

.verse .cover
{
  /*! height: 256px; */
  /*! overflow: hidden; */
  background: #efefef; 
  /*! --padding-bottom: 5px; */
  border-radius: 5px;
  color: #fff;
  /*! color: #000; */
  font-weight: normal;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 0 10px;
  height: 170px;
  display: flex;
  /*! width: 200px; */
  /*! align-content: center; */
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
}

.bonus-block .book .cover
{
  float:left;
  margin-right: 5px;
}

.bonus-block .book
{
  display: inline-block;
  width: auto;
  max-width: 30em;
  margin: 0;
  width: 256px;
}

.contest-winner-book .book .cover
{
  
  float: left;
}

.contest-winner-book .book .details
{
  display: block;
  
  text-align: left;
  padding: 0.5em 1em;
  /*! font-size: 30px; */
  /*! position: absolute; */
  margin-left: 130px;
  /*! top: 0; */
  /*! width: 100%; */
}

.cover-wrapper.in-competition1::after
{
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  
  background: no-repeat url(dn2120/dn2120_sticker_96.png);
  background-size: 32px;
  
  margin-top: -36px;
  /*! position: absolute; */
  /*! vertical-align: top; */
  /*! text-align: left; */
  margin-left: 3px;
  /*! float: left; */
  z-index: 1000;
  position: absolute;
  right: 3px;
}

.book-info .cover-wrapper.in-competition1::after
{
  width: 64px;
  height: 64px;
  background-size: 64px;  
  margin-top: -70px; 
  margin-left: 6px;  
  right: 6px;
}

.is-default.cover-wrapper.in-competition1::after
{
  display: none;
}

.dn2120-contest-link
{
  display: block;
  margin: 2em 0 1em 0;
}

.dn2120-contest-link img
{
  max-width: 100%;
  height: auto;
  border-radius: 5px;
}

.cover-wrapper
{
  position: relative;
  /*! float: left; */
  /*! clear: both; */
  margin: auto;    
  overflow: hidden;
}

.in-game .cover-wrapper::before
{
  display: block;
  content: '';
  position: absolute;
  top: -10px;
  right: -10px;
  width: 50px;
  height: 50px;
  z-index: 100;
  background: no-repeat url(avatar_celebration_200.png) center center;
  background-size: contain;
  border-radius: 50%;
  box-shadow: 0px 0px 10px 2px #ffffffcc;
}

.game-rules
{
  margin-bottom: 2em;
}

.cover-title
{
  position: absolute;
  top: 15%;

  padding: 0;
  left: 1em;
  right: 1em;

  bottom: 1em;

  font-family: Forum;
  color: #999;

  /* font-size: clamp(8px, 100em / var(--text-length), 128px / 10); */
  font-weight: 500;
  text-transform: uppercase;
  text-align: center;
  word-wrap: break-word;
  overflow-wrap: break-word;
  overflow: hidden;  
  hyphens: manual;
  box-sizing: border-box;

  display: flex;
  align-items: flex-start;
  justify-content: center;
  word-break: break-word;
}

.book-info .cover-title
{
  font-size: 28px;  
}

.in-competition1 .cover-title
{
  color: #e5d8a4;
  top: 5%;
  font-family: Asenine;
  text-transform: initial;
  font-size: 20px;
  line-height: 1;
  letter-spacing: 0.5px;
}


.in-competition2 .cover-title
{
  font-family: 'Bona Nova';
  color: #000;
  text-transform: initial;  
  top: 7%;
  line-height: 1;

}

.in-competition3 .cover-title
{
  font-size: 12px;
  font-family: 'v_CCAlchemite';
  color: #fff;
  top: 10%;
  --webkit-text-stroke: 1px #6d38c6;
   text-shadow:
   -1px -1px 0 #6d38c6,  
    1px -1px 0 #6d38c6,
    -1px 1px 0 #6d38c6,
     1px 1px 0 #6d38c6;
  /*! font-weight: 500; */
}

.in-competition5 .cover-title
{
  color: #111;
  font-weight: 600;
  /*text-shadow: 0 0 8px #fff;*/
}

.in-competition6 .cover-title
{
  font-family: 'Agatha-Modern';
  color: #000;
  text-transform: initial;  
  top: 7%;
  line-height: 1;


  font-size: 18px;
  color: #000;

  text-shadow: -1px -1px 5px #fff, 1px 1px 5px #fff;  
}

.in-competition7 .cover-title
{
  color: #37fbfa;
  top: 7%;
  font-family: 'Jura';
  text-transform: initial;
  font-size: 18px;
  line-height: 1;
  /* letter-spacing: 0.5px; */
}

.in-competition8 .cover-title
{
  color: #fff;
  align-items: flex-end;
  text-transform: initial;
  font-size: 18px;
  line-height: 1;
}

.in-competition10 .cover-title
{
  color: #333;
  font-weight: 600;
}

.in-competition11 .cover-title
{
  color: #fff;
  font-family: 'AdverGothicC';
  font-weight: 300;
  align-items: flex-end;
  font-size: 12px;
}

.in-competition12 .cover-title
{
  color: #fcea99;
  font-weight: 300;
  align-items: flex-end;
}

.in-competition13 .cover-title
{
  font-family: 'Arthur Gothic';
  /* text-transform: initial; */
  font-weight: 400;
  top: 20%;
  font-size: 18px;
  color: #fff;
  text-shadow: -1px -1px 2px #2d220a, 1px 1px 2px #2d220a;

}

.in-competition14 .cover-title
{
  color: #502a37;
  font-family: Raleway, sans-serif;
  font-weight: 700;
  top: 40%;

}

.in-competition15 .cover-title
{
  color: #000f5b;
  font-family: Copperplate, sans-serif;
  font-weight: 400;
  top: 10%;
}


.in-competition16 .cover-title
{
  font-family: 'Montserrat';
  font-weight: 500;

  top: 60%;
  font-size: 12px;
  color: #c0f7fe;
  text-shadow: -1px -1px 3px #5db7c5, 1px 1px 3px #5db7c5;
  letter-spacing: 1px;
}

.in-competition18 .cover-title
{
  color: #fff;
  font-family: "Aeromatics", sans-serif;
  font-weight: 400;
  top: 10%;
  font-size: 12px;
}

.in-competition19 .cover-title
{
  color: #fff;
  font-family: 'Body Grotesque Large', sans-serif;
  font-weight: 400;
  top: 60%;
  
  font-size: 12px;
}

.in-competition20 .cover-title
{
  color: #fff;
  font-family: 'Raleway', sans-serif;
  font-weight: 600;
  top: 65%;
  
  font-size: 13px;
}

.in-competition21 .cover-title
{
  color: #000;
}

.contest-link-block {
  margin-bottom: 0.5em;
}

.book-info .author.contest
{
  text-align: center;
/*   background: #E7E7E7;
  border-radius: 5px; */
}

.page-contest-user-profile main p
{
  margin-bottom: 1em;
  margin-top: 1em;
}

.book-info .in-competition3 .cover-title
{
  color: #fff;
  font-size: 22px;
  --webkit-text-stroke: 1.2px #6d38c6;
  text-shadow: none;
  text-shadow:
  -1px -1px 0 #6d38c6,  
   1px -1px 0 #6d38c6,
   -1px 1px 0 #6d38c6,
    1px 1px 0 #6d38c6;  
  font-weight: 500;
}

.book-info .in-competition6 .cover-title {
  font-size: 36px;
}

.book-info .in-competition7 .cover-title {
  font-size: 32px;
}

.book-info .in-competition8 .cover-title {
  font-size: 36px;
}

.book-info .in-competition11 .cover-title
{
  font-size: 24px;
}

.book-info .in-competition13 .cover-title
{
  font-size: 36px;
}


.book-info .in-competition16 .cover-title
{
  font-size: 25px;
  text-shadow: -1px -1px 3px #5db7c5, 1px 1px 3px #5db7c5;
  letter-spacing: 2px;
}


.book-info .in-competition18 .cover-title
{
  font-size: 24px;
}

.book-info .in-competition19 .cover-title
{
  font-size: 32px;
}

.book-info .in-competition20 .cover-title
{
  font-size: 28px;
}

.cover-author
{
  position: absolute;
  top: 75%;
  width: 80%;
  padding-left: 10%;
  padding-right: 10%;
  font-family: Raleway;
  color: #899cac;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
}

.info-content
{
  margin-top: 1em;
}

.book-info .cover-author
{
  font-size: 20px;
}

.cover-wrapper .moderation-label
{
    position: absolute;

    background: #0D99D3;
    
    left: 0;
    right: 0;
    top: calc(50% - 1em);
 
    font-family: Carlito;
    color: #fff;
    font-size: 16px;  
    opacity: 0.85;
    text-align: center;
    padding: 0.2em; 
}

.cover-wrapper .draft-label
{
    position: absolute;

    background: #000;
    
    left: 0;
    right: 0;
    top: 0;
 
    font-family: Carlito;
    color: #fff;
    font-size: 16px;  
    opacity: 0.75;
    text-align: center;
    padding: 0.2em;
  
    border-radius: 5px 5px 0 0;
}

.cover-wrapper .fragment, .cover-wrapper .promo-format
{
    position: absolute;

    background: #000;
    
    left:0 ;
    right: 0;
    
    border-radius: 0 0 5px 5px;
  
    font-family: Carlito;
    color: #fff;
    font-size: 13px;  
    opacity: 0.6;
    text-align: center;
    padding: 0.2em;
    
    bottom: 0;
  
  
}

.cover-wrapper .fragment, .cover-wrapper .promo-format
{
  --background: rgba(254, 189, 89, 0.9);
  background: rgba(0, 0, 0, 0.7);
  --background: black;
  height: 50px;
  font-size: 15px;
  /*! filter: invert(); */
  opacity: 0.8;
  --opacity: 0.6;
  font-weight: 700;
  --color: #b93d37;
  color: #999;
  --mix-blend-mode:  multiply;
  line-height: 1;
  vertical-align: middle;
  display: flex;
  justify-content: center;
  align-items: center;  
}

.book-page .cover-wrapper .promo-format
{
  font-size: 30px;
  height: 100px;
}

.cover-wrapper .fragment
{
  height: 25px;
}

.book-page .cover-wrapper .fragment {
  font-size: 30px;
  height: 50px;
}

.book {
  position: relative;
}

.popular_new_likes {
  position: absolute;
  width: 3em;
  line-height: 1.5em;
  background: #00be0a;
  color: #fff;
  top: 170px;
  z-index: 10;
  padding: 0.1em;
  font-size: 13px;
  font-family: Carlito;
  text-align: center;

  opacity: 0.8;
}


.cover-wrapper .age18, .cover-wrapper .age16, .cover-wrapper .age12
{  
  position: absolute;
  width: 2em;
  line-height: 1.5em;
  color: #fff;
  font-size: 13px;
  font-family: Carlito;
  text-align: center;
  top: 0;
  right: 0;
  padding: 0.1em;
  --border-top-right-radius: 5px;

  top: 0.5em;
  width: 2em;
  z-index: 10;
  --opacity: 0.8;
}

.age18{
  background: #ec0000;
}

.age16{
  background: #ff6600;
}

.age12{
  background: blue;
}

/* .cover-wrapper .stat_change {
  position: absolute;
  width: 2em;
  line-height: 1.5em;
  color: #fff;
  background: #009900;
  font-size: 13px;
  font-family: Carlito;
  text-align: center;
  bottom: 0.5em;
  left: 0;
  padding: 0.1em;
 
  width: 2em;
  z-index: 10;
  opacity: 0.8;
}

.stat_change {
  line-height: 1.5em;
  color: #fff;
  background: #009900;
  font-size: 13px;
  font-family: Carlito;
  text-align: center;
  border-radius: 5px;
 
  width: 2em;
  display: inline-block;
  margin-right: 0.3em;
}
 */
.book-page .cover-wrapper .age18, .book-page .cover-wrapper .age16, .book-page .cover-wrapper .age12
{
  font-size: 20px; 
}

.book-page .moderation-label, .book-page .draft-label
{
  font-size: 30px;
}

.book-page.verse .moderation-label
{
  top: 0;
}


.book .cover img
{
  border-radius: 5px;
}

.book .title
{
  display: block;
  margin-top: 0.5em;
  /*! --font-family: Arsenal; */
  /*! --font-size: 12px; */
  font-weight: 500;
  /*! max-width: 128px; */
}

.contest-winner-book .book .title
{
  font-size: 50px;
  font-family: Forum;
  margin-top: 10px;
  line-height: 1;
}



.book .genres
{
  display: block;
  margin-top: 0.3em;
  line-height: 1.1;
  /*! white-space: break-spaces; */
}

.book .genre, .author-block .genre
{
  font-family: Carlito;
  font-size: 13px;
}

.book .genre
{
  color: #999;
  font-size: 12px;  
}

.author-block .genres
{
  margin-bottom: 0.2em
}

.contest-winner-book .book .genre
{
  font-size: 14px;
}

.book .genre:not(:last-child):after,
.author-block .genre:not(:last-child):after
{
  content: ", ";
}

.book .avatar, .author.s .avatar
{
  border-radius: 25px !important;
  /*! vertical-align: bottom; */
  /*! display: inline-block; */
}

.author.m .avatar
{
  border-radius: 32px !important;
  /*! vertical-align: middle; */
  /*! display: inline-block; */
}

.author.l .avatar
{
  border-radius: 45px !important;
}

.author
{
  display: block;
}

.msg .author
{
  display: inline-block;
  font-size: 14px;
  line-height: 1.1;
  white-space: nowrap;
}


h1 .author
{
  display: inline;
  margin-left: 0.3em;
}

.book .author
{
  /*! line-height: 2.3em; */
  /*! font-weight: bold; */
  margin-top: 0.3em;
}


.book.verse .author
{
  margin-top: 1em;
}

.page-contest .book.verse .author
{
  margin-top: 0.3em;
}

.contest-winner-book .book .author
{
  margin-top: 1em;
  margin-bottom:1.1em;
}

.my-subscribers
{
  display: flex;
  /*! flex-wrap: wrap; */
  gap: 1rem;
  flex-direction: column;
}

.label
{
  margin: 1em 0;
  text-transform: uppercase;  
  color: #555;  
  font-weight: bold;
}

.block .label
{
  margin: 0.2em 0 0.45em auto;
  font-weight: normal;
  color: #6cc6ec;
  /*! margin-top: 2.6em; */
  font-family: 'v_CCAlchemite';
  width: 222px;

  text-align: center;  
}

#mobile-shortcuts .block .label
{
  width: auto;
}

h1,.page-genres h2, .page-contest h2
{
  margin: 1.2em 0;
  /*! --text-transform: uppercase; */  
  color: #58636d;  
  font-weight: 500;
  font-size: 20px; 
}

h1
{
  margin: 0 0 1em 0;
}

.page-contests h1 {
  font-size: 2em;
}

.page-index .main-top-banner-root
{
  margin: 0 0 1.5em 0;
}

.subheader
{
  margin-bottom: 1em;
}

.featured-user-promo
{
  width: 222px;
  background-repeat: no-repeat;
  background-size: cover;  
  background-position: center;
  height: 68px;
  text-align: center;
  padding-top: 10px;
  box-sizing: border-box;
  color: #fff;
  border-radius: 5px;
  
  margin: 0 0 0 auto;
  
  
  /*! display: flex; */
  /*! align-content: center; */
  /*! justify-content: center; */
}

#mobile-shortcuts .featured-user-promo
{
  margin: auto;
  float: none;
}

.featured-user-promo a
{
   color: #fff;
}

.featured-user-promo .name {
  display: block;
  text-shadow: #000000ee 1px 0px 2px;
}

.featured-user-promo .snowman {
  width: auto;
  height: 32px;
}

.snowflakes-subheader th
{
  padding-bottom: 1em;
  padding-top: 2em;
  text-align: left;
  font-weight: 600;
  color: #6ca1c9;
}

.snowflakes-subheader th img{
  margin-right: 1em;
}

.snowflakes-subheader:first-of-type th
{
  padding-top: 0;
}

.page-snowflake-results-2021 main td
{
  padding: 0.1em 1em 0.1em 0;
}

.page-valentine-results-2022 .snowflakes-subheader th
{
  color: #dc3058;
}

.search_keyword
{
  font-weight: 600;
  font-style: italic;
  font-size: 0.7em;
  /*! color: #58636d; */
}

form.add-book
{
  margin-top: 1.5em;
}

.news-content h1, .news-content h2, .news-content h3, .news-content h4
{
  color: #333;
  font-weight: 600;
  margin-top: 1.3em;
}

.news-content h2
{
  font-size: 18px;
}

.news-content h3
{
  font-size: 16px;
}

.news-content h4
{
  font-size: 14px;
}

.chat-menu {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  
  justify-content: flex-end;
}

h1.chat-header
{
  font-size: 16px;
  flex:1;
  min-width: fit-content;
}

h1.chat-header .author
{
  font-size: 18px;
}

table
{
  border-spacing: 0;
}

label, th
{
  color: #000;
  font-weight: normal;
  font-size: 16px;
}

.add-part table, .edit-blog table
{
  box-sizing: border-box;
  width: 100%;
}

form table th,
form table td
{
  text-align: left;
  padding: 0 1em 1em 0;
  vertical-align: top;
}

input:not([type="radio"]):not([type="checkbox"]):not([type="image"]):not([type="submit"]):not([type="file"]), select, textarea
{
  outline: none;
  border: 1px solid #999;
  border-radius: 5px;
  padding: 0.5em 1em;
  /*! width: 14em; */
  line-height: 1;
}

textarea
{
  line-height: 1.5;
  /*! vertical-align: bottom; */
}

textarea[name=bio]
{
  width: 100%;
  height: 20em;
  box-sizing: border-box;
}

input[type="checkbox"]
{
  border: 0 none;
  width: auto;
  margin-right: 0.3em;
}

input[type="password"]
{
  width: 10.6em; /* same as submit button width */
}


button
{
  border: 0 none;

}

button:not([disabled]), input[type="submit"]:not([disabled])
{
  cursor: pointer;
}

button:not([class]), input[type="submit"], .button, .sort-types a.button
{
  line-height: 1;

  font-size: 14px;
  font-weight: 600;
  padding: 0.65em 1.3em;
  color: #fff;
  background: #58636d;
  border: 0 none;
  border-radius: 5px;
  text-transform: uppercase;
  letter-spacing: 1px;

  /*! margin-right: 1em; */
  width: max-content;
  display: inline-block;
}

#approved-status button
{
  margin-right: 1em;
}

main .label
{
  margin-left: 60px;
}


.promo .dn2120 .label
{
  font-family: Asenine;
  font-size: 20px;
  /*! text-transform: none; */
  letter-spacing: 0.5px;
  /*! margin: 0.3em 0; */  
  margin-top: 0.7em;
}

#allmor2021-placeholder
{
  font-size: 50px; text-align: center; font-style: italic; color: #ccc;
}

/* #dn2120-shortcut
{
  background: no-repeat url(achievements/DN2120_96.png);
  background-size: auto;
  background-size: 32px;
  line-height: 32px;
  width: 256px;
  padding-left: 40px;
  width: max-content;    
  margin: 1rem auto;

  font-family: Asenine;
  font-size: 20px;
  letter-spacing: 0.5px;
  text-transform: uppercase;

  display: none;
} */

.book .author .name
{
  /*! margin-left: 0.3em; */
  /*! border-radius: 25px; */
  /*! vertical-align: bottom; */
  /*! font-style: italic; */
  font-weight: 600;
  font-size: 13px;
  /*! line-height: inherit; */
}

.contest-winner-book .book .author .name
{
  font-size: 20px;
}

.forgot-pass
{
  margin-left: 1em;
}

.book .place {
  font-size: 16px;
  padding: 0.1em;
  font-weight: 500;
  background-color: #6ca1c9;
  width: 2em;
  margin: 0 auto 3px auto;
  border-radius: 2em;
  line-height: 2em;
  /*! vertical-align: middle; */
  color: #fff;
}

.greets-block
{
  float: right;
  width: 32%;
}

#promo-carousel .book
{
  padding-right: 10px;
  background-color: #eee;  
  border-radius: 5px;
}

#bonus
{  
  position: absolute;
  top: 396px;
  right: 3.5em;
  width: 26%;
  
  background-color: #eee;
  border-radius: 5px;
  padding:1.5em;
}

#bonus .book
{
  margin: auto;
  display: block;
}


.bonus-text
{
  margin-bottom: 1em;
  text-align: center;
}



.bonus-block::after
{
  content: "";
  display: table;
  clear: both;
}


.bonus-block .book .title
{
  padding-top: 29px; 
}

.bonus-link
{
  text-align: right;
  font-weight: 500;
  margin-top: 2em;
  font-size: 18px;
  display: none;
}

.bonus-link a
{
  color: #e4a94a;
}

.contest-winners
{
  margin-right: 35%;
  
}

.contest-others
{
  margin-top: 4em;
}

.contest-winner-book.place1
{
  background-color: #FFF4C9;
}

.contest-winner-book.place2
{
  background-color: #EBEDF9;
}

.contest-winner-book.place3
{
  background-color: #FFECD8;
}

.book.contest-bonus {
  background-color: #eee;
  padding: 10px;
  border-radius: 5px;
  margin-top: -10px;
}

.book.contest-bonus a.my-competition-marks
{
  color: #76996a;
}

.book .contest-bonus-tip
{
  font-size: 12px;
}

.books {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 1.5em 2em;
  margin-bottom: 2em;
}

.author-block .books
{
  gap: 0.2rem;
  justify-content: space-evenly;
  margin: 0;
  flex: 1;
  /*! align-items: center; */
}

.book
{
  display: inline-block;
  /*margin: 0 2em 1.5em 0;*/
  text-align: center;
  max-width: 128px;
  vertical-align: top;
}

.book-random {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5em;
}

.book.is-draft .cover-wrapper, .part.is-draft
{
  opacity: 0.5;
}

.cover-wrapper.in-moderation
{
  opacity: 0.5;
}

.book.featured
{
  background: linear-gradient(to bottom, #afddf0, #fef4ac);
  border-radius: 5px;
  padding: 10px;
  margin: -10px;
}

.book.place1, .book.place2, .book.place3
{
  
  border-radius: 5px;
  padding: 10px;
  margin: -10px;
}

.book.place1
{
  background: linear-gradient(to top, #FFF4C9, #FFF4C9);
}

.book.place2
{
  background: linear-gradient(to top, #EBEDF9, #EBEDF9);
}

.book.place3
{
  background: linear-gradient(to top, #FFECD8, #FFECD8);
}

.book.verse
{
  width: 200px;
  max-width: 200px;
  /*! border-radius: 5px; */
}

/* .carousel {
  display: flex;
  flex-direction: row;
  height: 200px;
}

.carousel__slide {
  position: relative;
  flex: 0 0 100%;
  padding: 10px;
}

.carousel__slide__content {
  background: #c6b9ad;
  border-radius: 10px;
  width: 100%;
  height: 100%;
}
 */
.book.verse .verse-panel
{
  /*! margin: 0.5em; */
  background: rgba(0,0,0,0.5);
  --border-radius: 5px;
  
  /*! max-height: 150px; */
  box-sizing: border-box;
  overflow: hidden;
  display: inline-block;
  padding: 1em 0.4rem;
  width: 160px;
  /*! height: 140px; */
  line-height: 1.3;
  height: 100%;
}

.book.verse .verse-title
{
  /*! height: 50px; */  
  /*! display: flex; */
  /*! align-items: center; */
  /*! justify-content: center; */
  /*! display: table-cell; */
  
  text-align: center;
  
  vertical-align: middle;
  
  box-sizing: border-box;
  /*! width: 200px; */
  
  /*! color: #fff; */
  margin-bottom: 5px;
  overflow: hidden;
  font-weight: 500;
  /*! background-color: rgba(0,0,0,0.10); */
  /*! padding: 5px; */
  /*! border-top-left-radius: 5px; */
  /*! border-top-right-radius: 5px; */
  /*! color: #666; */
  margin-bottom: 12px;
  /*! display: inline; */
}


.book.verse .verse-annotation, .book.verse .elipsis
{
  /*! padding: 0 1rem; */
  /*! overflow: hidden; */
  /*! max-height: 100px; */
  font-size: 10px;
  /*! display: inline; */
  line-height: 1.3;
}

.book.verse .verse-inline
{
  max-height: 136px;
  overflow: hidden;
  display: block;
}

.book.verse p
{
  /*! padding: 0; */
  margin: 0;
  /*! --background: rgba(0,0,0,0.9); */
  /*! display: inline; */
  /*! --padding: 0.09em 0.4em; */
  /*! color: #000; */
  /*! background: rgba(255,255,255,0.8); */
  
  /* Needs prefixing */
  /*! --box-decoration-break: clone; */
  /*! ---webkit-box-decoration-break: clone; */  
  
  /*! --border-radius: 1px; */

  /*! text-shadow: 1px 1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px 0px 0 #000, 0px 1px 0 #000, -1px 0px 0 #000, 0px -1px 0 #000; */
  /*! margin-block-start: 0; */
  /*! margin-block-end: 0; */
  /*! line-height: 1.1rem; */
}

.contest-winner-book
{
  margin-bottom: 1em;
  border-radius: 5px;
  clear: left;
  position: relative;
}

.contest-winner-book .book
{
  max-width: initial;
  margin: 0;
  /*! min-width: 40%; */
  text-align: left;
  white-space: nowrap;

  position: relative;
}

.contest-winner-book .book .details
{
   white-space: normal;
}

.contest-place-indicator
{  
  text-align: right;
  /*! min-width: 30%; */
  line-height: 200px;
  font-size: 50px;
  opacity: 0.2;
  font-weight: 500;
  /*! float: right; */
  margin-right: 0.5em;
  margin-left: 0.5em;
  float: right;
  position: absolute;
  right: 0.5em;
}

.all-authors {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: space-evenly;
  align-items: flex-start;
}

.all-authors-search {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: space-evenly;
  align-items: flex-start;
}

.all-authors-search .author-block .container button, .all-authors-search .author-block .container a.button {
  font-size: 10px;
  height: 120%;
}

.author-block
{
  /*! display: flex; */
  /*margin-bottom: 2em;*/
  /*! width: 250px; */
  /*! max-width: 300px; */
  /*! flex-wrap: wrap; */
  /*! gap: 1rem; */
  /*! justify-items: center; */
  
  border: 1px solid #eee;
  /*! padding: 1rem 0.5rem; */
  border-radius: 5px;
  /*! max-width: 400px; */  
  /*! align-items: center; */
  min-width: 145px;
  
  position: relative;
  background-color: transparent;
  display: flex;
  flex-direction: column;
  background: #f9f9f9;
  /*! align-items: center; */
}


.author-block .author-bg
{
  /*! position: absolute; */
  left: 0;
  right: 0;
  
  /*! height: 144px; */
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;  
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  
  z-index: 0;
  top: 0;
  text-align: center;
  padding: 1rem;
}

.author-block .container
{
  /*! z-index: 10; */
  /*! position: relative; */
  padding: 0 0.5rem 1rem 0.5rem;
  /*! height: -moz-available; */
  /*! bottom: 0; */
  /*! height: 100%; */
  /*! height: 700px; */
  display: flex;
  flex-direction: column;
  flex: 1;
}

.author-block form
{
  display: flex;
  gap: 1rem;
  margin-top: 1rem;
  /*! position: absolute; */
  /*! bottom: 1rem; */
  /*! vertical-align: bottom; */
  /*! anchor: 1; */
  justify-content: center;
}

.author-block button:not([class]), .author-block input[type="submit"], .author-block .button,
.book-block button:not([class]), .book-block input[type="submit"], .book-block .button
{
  font-size: 10px;
}

.author-block button, .book-block button
{
  color: #58636d;
  background: #fff;
  border: 1px solid #58636d;
}

.book-block form {
  text-align: center;
  margin-top: 0.5em;
}

.author-info
{
  /*width: 250px;*/
  /*! flex: 1; */
  /*! width: auto; */
  text-align: center;
  /*! flex: 1; */  
  margin-bottom: 1rem;

}

.author-index
{
  position: absolute;
  left: 0;
  top: 1rem;
  --color: #eeed;
  --color: #000;
  color: #fff;
  /*! padding: 1rem; */
  font-size: 18px;
  line-height: 1;
  font-weight: 500;
  text-shadow: 1px 1px 7px #000a, -1px 1px 7px #000a;
  /*! padding-left: 0.5rem; */
  background: rgba(255,255,255,0.4);
  
  padding: 0.5rem;
  min-width: 1em;
}

.author-block img
{
  border-radius: 90px;
  margin-right: 0.5em;
}


.author-block .author .name
{
  display: block;
  font-size: 26px;
  /*! margin: 0.5em 0 0 0; */
  /*! color: #fff; */
  /*! text-shadow: #333e 1px 0px 2px, #333e -1px 0px 2px; */
  /*! --mix-blend-mode: difference; */
  font-family: Forum;
  color: #555;
  font-weight: 600;
  margin-top: 0.55rem;
  margin-bottom: 0.1rem;
}

.author-block .stat
{
  display: inline-block;
  margin-right: 1em;
}


.author-block .cover-title, .author-block .cover-author
{
  font-size: 8px;
}

.author-block .cover-wrapper .age18, .author-block .cover-wrapper .age16, .author-block .cover-wrapper .age12
{
  font-size: 12px;
}

.author-block .book .title
{
  font-size: 12px;
}

.author-block .book
{
  width: 100px;
}

.collection-status
{
  font-weight: 500;
  /*! line-height: 3; */
}

.collection-status-val
{
  /*! background: #f1f1f1; */
  padding: 0.5em;
  border-radius: 5px;
  color: #ffce47;
  /*! text-shadow: 1px 1px 2px white; */
}

#all-genres-filter
{
  margin-bottom: 1em;
}


.sort-types
{
  display: block;
  margin-bottom: 0.5em;
  clear: both;
}

.page-index-filters
{
  line-height: 1;
  margin: 0;
  /*! height: 1em; */
  text-align: right;
}


.page-dn2120 .sort-types
{
  line-height: 3;
}

.sort-types::after
{
  content: "";
  display: table;
  clear: both;
}


.sort-types a
{
  margin-right: 1em;
  color: #6c88a1;
  font-weight: 600;
  /* white-space: nowrap; */
  display: inline-block;
  margin-bottom: 1em;
}

.sort-types .filter
{
  float: right;
  color: #76996a;
}

.sort-types .filter.filter-subscribed
{
  color: #c4589d;
}

.sort-types .filter img
{
  margin-right: 0.5em;
}

a.filter18p
{
  color: #ec0000;
  display: inline-block;
  line-height: 1;
  font-size: 12px;
}

.filter18p input {
  margin: 0;
}

.filter18p img
{
  margin-right: 0.25em;
  width: 14px;
  height: auto;
}

.filter18p img, .filter18p span {
  vertical-align: middle;
}

.sort-types a.competition-rules
{
  float: right;
  /*! margin: 1em 0; */
  /*! line-height: 3; */
}

div.competition-rules
{
  margin-top: 1rem;
 
  font-size: 18px;
}

.competition-results-link
{
  margin-top: 1em;
}

.page-contest-kazkochas div.competition-rules
{
  font-size: 14px;
}

a.my-competition-link
{
  font-size: clamp(12px, 0.5rem + 2.3vw, 20px);
}

a.my-competition-add
{
  font-size: clamp(12px, 0.5rem + 2.3vw, 20px);
}

.page-contest-kazkochas a.my-competition-add.button
{
  background-color: #7765c4;
  font-size: 16px;
  font-weight: normal;
  letter-spacing: normal;
  padding: 0.65em 0.8em;
}

a.my-competition-login
{
  color: #b51f24;
  font-size: 12px;
  /*! font-family: Raleway, Verdana, Geneva, Tahoma, sans-serif; */
}

.competition-contact {
  font-size: 12px;
  font-family: Raleway;
}

#contest-add .author {
  display: inline-block;
  margin-left: 0.4em;
  font-weight: 700;
}

.competition-submit-stats div
{
  clear: both;
  margin-bottom: 0.5rem;
  /*! float: left; */
  /*! font-size: 30px; */
  display: block;
}

.competition-submit-stats
{
  clear: both;
  margin-bottom: 0.5rem;
  margin-top: 1.7rem;
  /*! float: left; */
  font-size: 28px;
}

.competition-submit-stats .num
{
  font-weight: bold;
}

.competition-submit-stats .accepted-stats
{
  color: #76996a;
  font-size: 1.2em;
}

.competition-submit-stats .submitted-stats
{
  color: #6ca1c9;
  font-size:0.7em;   
}

.competition-submit-stats .rejected-stats
{
  color: #b51f24;
  font-size:0.7em;   
}

.page-contest-kazkochas .competition-submit-stats .accepted-stats
{
  color: #7765c4;
}


.bonus-stats
{
  color: #e4a94a;
  font-weight: 500;
}

.moderation-hint
{
  color: #6ca1c9;
  font-size: 12px;

  font-family: Carlito;
}


.my-competition-rejected
{
  color: #db8d80 !important;
}

.my-competition-submitted
{
  color: #6ca1c9 !important;
}

.my-competition-message
{
  color: #e4a94a !important;
  font-size: 14px !important;
}

.book .my-competition-marks
{
  color: #ce9238;
}

.competition-not-enough {
  color: #ce9238;
}

.my-competition-marks.mandatory
{
  color: #ff424e;
}

.book .my-competition-approved
{
  color: #76996a;
}

.approve-title
{
  margin-bottom: 1em;
  font-weight: bold;
}

.audiobook .book-bg
{
  
  background: repeat-x url(audiobook_bg_tile.png) center center;
  background-size: contain;
  height: 158px;
}

.user-banner, .book-bg
{
  text-align: center;   
  height: 300px;
/*   background: linear-gradient(to right, rgba(0, 0, 0, 0.45), rgba(100, 100, 100, 0), rgba(0, 0, 0, 0.45) ), 
    url('bg/default.jpg'); */
  background-repeat: no-repeat;
  
  /*! z-index: -1; */
  background-position: center;
  background-size: cover;

}

.user-banner
{
  position: relative;
}

.user-report{
  float: right;
  text-transform: initial;
}

.user-info
{
  display: inline-block;
  margin: 0 auto;
  color: #fff;
  /* text-shadow: #333333 1px 1px 26px, #333333 -1px -1px 26px; */
  /* text-shadow: #33333333 1px 1px 3px, #33333333 -1px -1px 3px; */
  text-shadow: #33333388 1px 0px 2px;
}

.buttons {
  display: inline-block;
}

.book-info
{
  text-align: left;
}

.part-stat{
  padding-left: 17px;
  margin-left: 0.5em;
  /*! min-width: 2em; */
  background-size: 16px;
  background-repeat: no-repeat;
  vertical-align: middle;
  font-family: Carlito, sans-serif;
  display: inline-block;
  background-position-y: center;
}

.part-stat-likes {
  background-image: url(icons/heart_icon_64.png);
}

.part-stat-views {
  background-image: url(icons/view_icon_64.png);
}

.user-banner .avatar
{
  width: 100px;
  height: 100px;
  border-radius: 100px;
  margin-top: 65px;
}

.stat-num
{
  font-size: 26px;
  text-align: center;
  font-weight: 600;
  line-height: 1;
  margin: 0.5em 0 0 0;
}

.stat-label
{
  /*! font-size: 14px; */
  line-height: 1;
}

.user-info .user-stat
{
  color: #fff;
  margin: 0;
  display: inline-block;
  text-decoration: none;   
}

.user-info .add-follow
{
  color: #58636d;
  background: #fff;
  border: 1px solid #58636d;
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  top: 280px;
}

.book-info .button-block
{
  margin-top: 18px;
  /*! display: inline-block; */
  /*! position: relative; */
  /*! top: 100px; */
}

.audiobook .button-block
{
  order: 1;
  margin: 50px auto -40px auto;
  position: relative;
  min-height: 32px;
}

.audiobook .crossref
{
  order: 5;
  margin-top: 1em;
  color: #6C88A1;
}

.book-info .statuses
{
  /*! float: right; */
  color: black;
  position: absolute;
  right: 0;
  text-align: right;
  /*! margin-top: -10px; */
  /*! font-family: Carlito; */
  /*! order: 1; */
  top: 225px;
}

.book-info .statuses.not-pub .dates *
{
  color: #db8d80 !important;
}

.audiobook .statuses
{
  order: 3;
  position: initial;
  margin-top: -40px;
  /*! display: inline-block; */
}

.verse .statuses
{
  
  position: absolute;
  /*! margin-top: -60px; */
  
  top: initial;
}

.book-info .statuses .dates
{
  color: #58636D;
  margin-bottom: 0.5em;
  font-size: 12px;
  /*! padding: 0.5em 0; */
}

.book-info .statuses .litform
{
  color: #70A3B4;
  border: 1px solid #70A3B4;
  border-radius: 5px;
  text-transform: uppercase;
  display: inline-block;
  /*! margin-right: 1em; */
  padding: 0.5em 1em;
  font-size: 9px;
  letter-spacing: 1px;
  font-weight: 600;
}

.book-info .statuses .status
{
  border-radius: 5px;
  background: #70A3B4;
  color: #fff;
  text-transform: uppercase;
  display: inline-block;
  padding: 0.5em 1em;
  font-size: 9px;
  letter-spacing: 1px;
  font-weight: 600;
  margin-left: 0.5em;
}

.book-info .symbol-count
{
  font-size: 12px;
}

.book-info .page-count
{
  margin-top: 0.5em;
}

.kv i
{
  font-style: normal;
  line-height: 1;
  color: #999;
}

.kv b
{
  font-weight: normal;;
  color: #333;  
}

.page-count b{
  color: #6c88a1;
  font-weight: 500;
  font-size: 1.2em;
}

.book-info .symbol-count b
{
  font-family: Carlito;
}

.book-status1 .book-info .statuses .status
{
   background: #84A884;
}

.book-status1 .book-info .statuses .litform
{
  color: #84A884;
  border-color: #84A884;  
}



.book-promo-format .book-info .statuses .status
{
  background: #E3A920;
}

.book-promo-format .book-info .statuses .litform
{
  color: #E3A920;
  border-color: #E3A920;
}


.audiobook .book-info .statuses .status
{
   background: #c4589d;
}

.audiobook .book-info .statuses .litform
{
  color: #c4589d;
  border-color: #c4589d;  
}


.book-info .button
{
  color: #58636d;
  background: #fff;
  border: 1px solid #58636d;
  margin-right: 1em;
  white-space: nowrap;
  vertical-align: middle;
}

.book-info .add-lib
{
  font-size: 20px;
  color: #666666;
  padding: 0.2em;
  padding-left: 32px;
  background: no-repeat white url(icons/lib_icon_48.png) 6px center;
  background-size: 24px;
  margin-right: 8px;
  /* width: 9px; */
  height: 24px;
  box-sizing: content-box;
}

.book-read .add-lib
{
  background: no-repeat white url(icons/lib_icon_64.png) 6px center;
  background-size: 32px;
  min-height: 32px;
  padding-left: 45px;
  display: inline-block;
  line-height: 32px;
  padding-right: 2px;
  border-radius: 5px;
  color: #58636d;
  font-style: italic;
}

.book-info .add-text, .book-read .add-text
{
  /*! display: inline-block; */
  font-size: 12px;
  color: #303c47;
  font-style: italic;
  margin-top: 1.3em;  
  position: absolute;
  /*! vertical-align: bottom; */
}

.audiobook .add-text
{
  position: initial;
}


.book-info .button.read
{
  font-size: 18px;
}


.error
{
  color: #9e2323;
}

ul
{
  padding-left: 1em;
  margin-bottom: 0;
  text-align: left;
}

li
{
  margin-bottom: 0.5em;
}

.news-block
{
  background-color: #f1f1f1;
  border-radius: 5px;
  padding: 1.4em 2em;
  max-width: 206px;
  /*! margin-top: 1rem; */
  margin-bottom: 1.5em;
}

.featured-block
{
  padding: 0;
  max-width: 258px;
  margin-bottom: 1.5em;
}

#mobile-shortcuts
{
  display: none;
  /*! padding: 0 1em; */
}


#mobile-shortcuts>a
{
  display: block;
  /*! margin: 0.8em auto 0 auto; */ 
  text-align: center;  
  /*! margin: 0 1em; */
}


.shortcut-links
{
  text-align: center;
  margin: 0.3em 0;
}

a#friends-link, a#featured-link
{
  display: inline-block;
  
  background-repeat: no-repeat;
  background-size: 32px;
  line-height: 32px;
  /*! width: 256px; */
  padding-left: 36px;
  width: max-content;
  
}

a#friends-link{
  color: #ff424e;
  background-image: url(heart_red.png);
  margin-right: 1em;
}

a#featured-link
{
  background-image: url(icons/lib_icon_64.png);
}

#mobile-shortcuts img
{
  border-radius: 5px;
}

a#news-headline
{
  color: #2068a8;
  background: no-repeat url(avatar_national_200.png) 5px center;
  background-size: 32px;
  min-height: 32px;
  /*! width: 256px; */
  padding-left: 40px;
  width: fit-content;    
  font-weight: 600;
  
  /*! margin: 0 1em; */
  /*! padding-right: 0.5em; */
  display: flex;
  align-items: center;  
  /*! margin-bottom: 0.5rem; */
  margin: 0 0.5rem 0.4em 0.5rem;
}
/* 
a#news-headline div 
{
  display: flex;
  align-items: center;
} */

#news-headline label
{
  font-style: italic;
}

.balance
{
  background: #ddd;
}

.balance-ark 
{
  font-weight: 600;
  font-size: 1.5em;
  /* font-family: 'Times New Roman'; */
  font-family: Carlito, 'Times New Roman';  
}

.balance-ark.positive-balance
{
  /*! color: #76996a; */
  color: #2680a4;
}

.ark-symbol
{
  /*! font-size: 21px; */
  font-family: 'Cambria', 'Times New Roman';
  /*! margin-left: 0.1em; */
  background: #58636d;
  color: #fff;
  width: 1em;
  line-height: 1;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  vertical-align: baseline;
  /*! height: 1.2em; */
  /*! text-indent: -1px; */
  /*! padding: 1px 2px 3px 1px; */
  padding: 0.143em 0.191em 0.191em 0.143em;
}

.game-score
{
  padding-left: 30px;
  background: no-repeat url('game/cotton2022/ua-flag.svg');
  background-size: 20px 15px;
  background-position: 0 center;
}

#community-link
{
  background: no-repeat url(icons/lib_icon_64.png);
  background-size: 32px;
  line-height: 32px;
  /*! width: 256px; */
  padding-left: 40px;
  width: max-content;  
}


.featured-block img:not([class]), .promo .block img:not([class]), .content-page img:not([class])
{
  border-radius: 5px;
  max-width: 100%;
  height: auto;
}

.news-block.important
{
  font-size: 13px;
  color: white;
  background-color: #db8d80;
  /*! border-radius: 5px; */
  /*! padding: 1.4em 2em; */
  /*! min-width: 206px; */
  /*! margin-top: 1em; */
  /*! margin-bottom: 1.5em; */
}

.news-block.important a
{
  color: #fff;
  font-weight: 600;
  text-decoration: underline;
}

.news-block.important .title
{
  font-size: 15px;
  color: white;
  background-color: #db8d80;
}

.news-block .title
{
  font-weight: 600;
  /*! font-style: italic; */
  margin: 0 0 0.5em 0;
  color: #6c88a1;
  display: block;
}

.blog-block .title,
.blog-block .details,
.blog-item h2 a,
.blog-item .details
{
  color: #76996a;
}

.news-item h2 a,
.news-item .details
{
  color: #6c88a1;
}

.edit-blog textarea
{
  max-width: 40em;
  max-height: 40em;
  width: 100%;
  height: auto;
  display: block;
}

.news-block .news-date
{
  font-weight: 500;
  margin: 0.5em 0;
  color: #999;
}

a.details
{
  font-size: 12px;
  font-style: italic;
  color: #6c88a1;
  margin-top: 0.5em;
  display: inline-block;
}

/*************************************/

.patrons-friends-block img
{
  border-radius: 5px;
}

.patron {
  display: flex;
  justify-items: center;
  align-items: flex-end;
  margin-bottom: 1em;
  gap: 1em 1em;
  flex-wrap: wrap;
}

.patron:last-child {
  margin-bottom: 0;
}


.patrons-level h2{
  color: #d7d7d7;
  margin-top: 0;
  text-align: center;
  font-size: 1.5em;
  margin-bottom: 0.5em;
}

.patrons .patrons-level h2 {
  margin-bottom: 0.8em;
}


.patron-top h2
{
  position: absolute;
  right: 10px;
  bottom: 5px;
  color: #fff;
  margin: 0;
  padding: 0;
  font-size: 32px;  
}

.patron-top .author
{
  z-index: 1;
}

.patrons-level {
  background: #f1f1f1;
  padding: 1.5em;
  border-radius: 5px;
  /*! flex: 1; */
  
  /*! margin-bottom: 2em; */
  /*! max-width: 20em; */
}

.patrons-block>.patrons-level
{
  max-width: 36em;
}

.patrons .patrons-level {
  flex: 1;
  max-width: 300px;
  min-width: fit-content;
  /*! width: auto; */
  /*! place-self: normal; */
  box-sizing: border-box;
  width: 100%;
}

.patron-links
{
  font-size: 0.6em;
  margin-top: 0.8em;
  font-style: normal;
  
}

.patron-links a 
{
  margin-right: 1em;
  
}

.patrons-block {
  margin-bottom: 2em;
}

.patrons-block h1, .patrons-friends-block h1 {
  margin-bottom: 0.2em;
  color: #ff424e;
  font-size: 2em;
}

.patrons-friends-block h1 {
  color: #58636d;
  margin-bottom: 0.8em;
  margin-top: 2em;
}

.patrons-friends-block img {
  width: 250px;
  height: auto;
  margin-right: 2em;
  margin-bottom: 1em;
}

.patron-note {
  margin-bottom: 1em;
}

.patron-note img {
  border-radius: 5px;
  margin-left: 0.5em;
}

.patrons {
  margin-top: 1.5em;
  gap: 1.5em 1.5em;

  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18em, 1fr));
  place-content: center;
  justify-items: center;
}

.book-info .cover-wrapper img
{
  border-radius: 5px;
}

.tabs-header
{
  display: flex;
  flex-wrap: wrap;
  gap: 1em 0;
}

.tabs-header::after {
  content: '';
  flex: 1 0 auto;
}

.autoresize
{
  resize: none;
  box-sizing: border-box;
}

.book-info
{
  /*! display: inline-block; */
  margin: -260px auto 0 auto;
  /*! color: #fff; */
  position: relative;
}

.audiobook .book-info
{
  margin: -102px auto 0 auto;
}

.verse .book-info
{
  margin: -50px auto 0 auto;
}

.book-info .left
{
  width: 256px;
  float: left;
  margin-right: 3.5em;
  /*! display: inline-block; */
  /*! clear: both; */
  margin-bottom: 1em;
}

.verse .book-info .left
{
  margin-top: 50px;
}

.book-info .author
{
  margin: 1em 0;
  display: block;
}

.patron .author
{
    display: flex;
}

.book-info .author .avatar
{
  border-radius: 45px;
  /*! vertical-align: middle; */
  float: left;
  margin-right: 0.8em;
}

.patron .author .avatar
{
  float: left;
  margin-right: 0.8em;  
}

.patron-level-1 .avatar {
  width: 28px;
  height: 28px;
  border-radius: 28px;
}

.patron-level-2 .avatar {
  width: 38px;
  height: 38px;
  border-radius: 38px;
}

.patron-level-3 .avatar {
  width: 52px;
  height: 52px;
  border-radius: 52px;
}

.patron-level-4 .avatar {
  width: 66px;
  height: 66px;
  border-radius: 66px;
}

.patron-level-5 .avatar {
  width: 90px;
  height: 90px;
  border-radius: 90px;
}

.patron-level-6 .avatar {
  width: 100px;
  height: 100px;
  border-radius: 100px;
}

.patron-level-1 .name {
  font-size: 1em;
}

.patron-level-1 .author label
{
    font-size: 0.8em;
}

.patron-level-2 .name {
  font-size: 1.1em;
}

.patron-level-3 .name {
  font-size: 1.2em;
}

.patron-level-4 .name {
  font-size: 1.3em;
}

.patron-level-5 .name {
  font-size: 1.4em;
}

.patron-level-6 .name {
  font-size: 2em;
}

.patron-level-6 .author .label
{
    font-size: 0.6em;
}

.patreon-patrons .patron-level-5 .name {
  font-size: 1.9em;
}

.patreon-patrons .patron-level-6 .name {
  font-size: 2.2em;
}

.author .avatar
{
  margin-right: 0.4em;
}

.book-info .annotation
{
  height: 9.64em;
  margin-top: 1em;
  overflow-y: auto;
  /*! text-overflow: ellipsis; */
  /*! mix-blend-mode: difference; */
  color: #fff;
  /*! --text-shadow: 1px 1px 0 #000; */
  /*! min-width: 40em; */
  /*! order: 1; */
  line-break: auto;
  white-space: pre-wrap;
  scrollbar-color: rgba(200, 200, 200, 0.3) rgba(100, 100, 100, 0.2);
  scrollbar-width: thin;
  padding-right: 0.3em;
}

.book-info .age_labels + .annotation {
  height: 8.1em;
}

.book-info .annotation::-webkit-scrollbar
{
  width: 5px;
  background-color: rgba(100, 100, 100, 0.2);
  border-radius: 5px;
}

.book-info .annotation::-webkit-scrollbar-thumb
{
  width: 5px;
  background-color: rgba(200, 200, 200, 0.3);
  border-radius: 5px;
}



.audiobook .book-info .annotation
{
  color: #000;
  order: 4;
  height: auto;
}

.book-edit-actions
{
  position: absolute;
  right: 3.5em;
  /*! display: inline-block; */
  /*! float: right; */
  /*! margin-top: -10px; */
  top: 230px;
  z-index: 10;
}

.audiobook .book-edit-actions
{
  top: 70px;
}

.verse .book-edit-actions
{
  top: 20px
}

.edit-actions
{
  text-align: right;
  line-height: 1;
  /*! vertical-align: bottom; */
  display: inline-block;  

}

.comment .edit-actions
{

  margin-left: 2rem;
}

.msg .edit-actions
{
  /*! display: inline-block; */
  /*! position: absolute; */
  /*! right: 0.5em; */
  /*! top: 0.5em; */
  float: right;
}

.dots-btn
{
  background: rgba(255,255,255,0.7);
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
  padding: 5px;
  border-radius: 5px;
  user-select: none;
  border: 1px solid rgba(200,200,200,0.9);
  font-size: 12px;
  margin: 0;
}

.comment .dots-btn{
  padding: 2px;
  border: 1px solid rgba(88, 99, 109, 0.30);
}

.edit-actions input {
  vertical-align: middle;
}

.edit-actions .action
{
  /*! margin-left: 10px; */
/*   opacity: 0.8;
  transition: opacity 0.2s ease; */
  display: block;
  /*! vertical-align: middle; */
  /*! line-height: 1; */
  background: none;
  /*! color: #6c88a1; */
  font-weight: 500;
}
/* 
.edit-actions .action:hover,
.edit-actions .action:focus
{
  opacity: 1;

} */

.stat-value
{
  font-size: 20px;
  font-weight: 500;
  color: #ffb847;
}

.stat-value.stat2
{
  font-size: 12px;
  font-weight: 500;
  color: #6ca1c9;
}


.book-info .stats, button.stat
{
  
  color: #57626D;
  /*! order: 2; */
}

.book-info .stats
{
  margin: 1em 0 0 0;
}

.audiobook .stats
{
  order: 2;
  /*! margin-top: -30px; */
}

table.game-results td{
  padding: 0.1em 0.5em;
}

table.game-results ._subheader th{
  padding-bottom: 1em;
  padding-top: 2em;
  text-align: left;
  font-weight: 600;
  color: #0066cc;
}

table.game-results ._subheader th img{
  margin-right: 1em;
}

table.game-results ._subheader:first-of-type th
{
  padding-top: 0;
}

table.game-results ._subheader.c10000 th, table.game-results ._subheader.c20000 th, table.game-results ._subheader.c30000 th{
  color: #999900;
}

.page-kavun-results-2022 table.game-results ._subheader.c5000 th {
  color: #999900;
}

table.game-results ._arcoins{
  color: #0066cc;
  font-weight: 500;
}

table.game-results ._uah{

  color: #999900;
  font-weight: 500;
}

table.game-results ._stat{
  font-size: 1.1em;  
}

table.game-results ._arcoins2{
  font-weight: 500;
  /* color: #6f6f6f; */
  color: #52a736;  
}


.news-date, .blog-details .stats
{
  display: inline-block;
  
}

.blog-details .stats
{
  margin-top: 1em;
}

.blog-details .author
{
  /*! margin-left: 1em; */
  /*! margin-right: 1em; */
}

:is(.book-info,.blog-details) .stat
{ 
  display: inline-block;
  
  padding: 0 0 0 29px;
  margin-right: 1em;
  font-size: 16px;
  
  height: 26px;
  
  
  background-color: transparent;
  background-repeat: no-repeat;
  background-size: 24px;
  line-height: 26px;
  font-family: Carlito, sans-serif;
  vertical-align: middle;
}

.author-block .stat {
  font-size: 14px;
  /*! height: 26px; */  
  /*! line-height: 26px; */
  font-family: Carlito, sans-serif;  
  color: #666;
}

.author-block .kv b
{
  font-weight: 600;
}

.author-block .stat-followers
{
  font-size: 1.1rem;
  color: #888;
}

.author-block .stat-followers b
{
  font-size: 1.2rem;
  --color: #6c88a1;
  color: #fff;
  background: #aaa;
  padding: 0.2rem 0.4rem;
  border-radius: 5px;
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}

.author-block .stat:last-child
{
  margin:0;
}

#lib-status {
  text-align: center;
  margin-top: 1em;
}

#lib-status div {
  margin-bottom: 0.5em;
}


.stat-likes { background-image: url(icons/heart_icon_48.png) }
.stat-comments { background-image: url(icons/comment_icon_48.png) }
.stat-lib { background-image: url(icons/lib_icon_48.png) }
.stat-views { background-image: url(icons/view_icon_48.png) }

button.stat-likes { 
  background-image: url(icons/heart_stroke_icon_48.png) 
}

button.stat-likes.used, button.stat-likes[disabled] { 
  background-image: url(icons/heart_icon_48.png) 
}

.page-edit-book input[type="submit"]
{
  margin-top: 1em;
}

.page-blogs .stat
{ 
  display: inline-block;
  font-size: 12px;
  background-size: 16px;
  line-height: 16px;
  padding: 0 0 0 18px;
  height: 16px;
  margin-right: 0.6em;

  background-color: transparent;
  background-repeat: no-repeat;
  font-family: Carlito, sans-serif;
  vertical-align: middle;  
}

.page-blogs .stats
{
  margin-left: 1.5em;
}

.page-blogs .stat-likes { background-image: url(icons/heart_icon_64.png) }
.page-blogs .stat-comments { background-image: url(icons/comment_icon_64.png) }
.page-blogs .stat-lib { background-image: url(icons/lib_icon_64.png) }


/*
.blog-details .stat
{
  background-size: 12px;  
  font-size: 12px;
  height: 14px;
  line-height: 14px;
  padding-left: 14px;
}
*/

.blog-details .author
{
  display: block;
}

/* .blog-details .stat
{
  display: inline-block;
}
 */
.book-info .tags
{
  /*! margin-top: -0.5em; */
  display: flow-root;
  margin-right: 200px;
  min-height: 1.4em;
}

.audiobook .tags
{
  order: 5;
}

.book-info .tabs
{
  margin-top: 1.8em;
  /*! width: 600px; */
  /*! display: grid; */  
  display: flow-root;
  /*! margin-left: 305px; */
}

.audiobook .tabs
{
  order: 7;
}


.book-info .add_new-action
{
  margin-top: 1em;
  text-align: right;
  font-weight: 500;
}

.book-info .add_new-action:before
{
  background: #57626d;
  content: "+";
  border: 1px solid #57626d;
  border-radius: 5px;
  width: 16px;
  height: 16px;
  color: white;
  display: inline-block;
  text-align: center;
  line-height: 16px;
  font-size: 16px;
  vertical-align: middle;
  margin-right: 0.5em;
  margin-bottom: 2px;
}


.book-info .part
{
  position: relative;
  display: flex;
  justify-content: space-between;
  /*! align-content: center; */
  align-items: center;
}

.audiobook .book-info .part
{
  margin-bottom: 3em;
}

.book-info .part a
{
  display: block;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.7;
  margin-right: 45px;  
  flex: 1;
}

.book-info .part:hover,
.book-info .part:focus
{
  background: #f5f5f5;  
}

.audiobook .part:hover,
.audiobook .part:focus
{
  background: none;
}

.book-info .part .edit-actions
{
  /*! position: absolute; */
  /*! right: 0; */
  width: 45px;
  display: block;
  /*! top: 0; */
  margin-left: 2em
}

.audiobook .part .edit-actions
{
  position: initial;  
  /*! bottom: 0px; */
  /*! top: -27px; */
  /*! left: -5px; */
  display: inline-block;
  /*! margin-left: 3em; */
}

.book-info .part .edit-actions a
{
  display: initial;
  margin-right: 0;
  margin-left: 5px;
}

.book-info .tag
{
  padding: 0.5em 1em;
  border-radius: 5px;
  background: #E7E7E7;
  margin-right: 0.8em;
  color: #6C88A1;
  font-weight: 500;
  display: inline-block;
  margin-top: 0.8em;
}

.audiobook .tag
{
  margin-top: 1.5em;
}

.book-page
{
  min-height: 650px;
}

.book-page.verse .book-bg
{
  height: 100px;
}

.book-info .author .name
{ 
  font-size: 20px;
}

.author.l {
  font-size: 20px;
}

.author .name img, .user-info .name img
{
  margin-left: 0.1em;
}

.blog-item .author
{
  /*! display: inline-block; */
  margin-bottom: 0.7em;
}

@keyframes error-appear {
  0% { background-color: #cccccc00; }
  
}

.error-msg
{
  position: fixed;
  width: 100%;
  background: #ccccccc9;
  z-index: 1000;
  opacity: 1;
  text-align: center;
  font-size: 32px;
  padding: 0.2em 1em;
  box-sizing: border-box;
  bottom: 0;
  color: #932f1e;
  
  animation: 1s error-appear;  
}

.author label, .author .label
{
  color: #999;
  font-weight: 500;
  font-style: italic;
  font-size: 14px;
  display: block;
  line-height: 1;
  text-transform: none;
  margin: 0;
}

.book-read-bg
{
  height: 71px;
  /*! background: black; */
  padding: 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.book-read h2
{
  text-align: center;
  color: #7B8A98;
  font-size: 25px;
  font-weight: 600;
  margin: 1.5em auto;
}

.book-read
{
  max-width: 60em;
  margin: auto;
  /*! text-align: justify; */
}

.book-read .next
{
  float: right;
  margin: 0 0 4em 0;
}

.book-read .prev
{
  float: left;
  margin: 0 0 4em 0;
}

nav.is_author {
  margin-top: 2em;
}

.book-read-bg .parts
{
  width: 20%;
  float: left;
  text-align: right;
  background: rgba(18, 30, 42, 0.7);
  height: 71px;
  vertical-align: bottom;
  padding-top: 37px;
  padding-right: 1em;
  box-sizing: border-box;
}

.book-read-bg .parts .span
{
  color: #7B8A98;
  font-size: 20px;
  font-weight: 500;
  padding-bottom: 5px;
}

.book-read-bg .parts .dropdown
{
  background: #E9EBEC;
}

.book-read-bg .parts a
{
  font-weight: 500;
  color: #778695;
  display: block;
}

.book-read-bg .parts a.active
{
  color: #59636D;
  font-size: 18px;
  font-weight: 600;
}

.book-read-bg .parts .dropdown 
{
  margin-top: 5px;
  background: #E9EBEC;
  text-align: right;
  width:auto;
}


.book-read-bg .user
{
  display: block;
}

.book-read-bg .user .avatar
{
  margin-right: 0.5em;
  border-radius: 25px;
}

.book-read-bg .user .name
{
  color: #94A5B5;
  font-style: italic;
  font-weight: 500;
}


.book-read-bg .read-header
{
  padding: 0.5em 0;
  text-align: left;
  /*! width: auto; */
  max-width: initial;
  /*! height: 100%; */
  overflow: hidden;
  /*! line-height: 1; */
  white-space: nowrap;
  /*! text-overflow: ellipsis; */
}

.book-read-bg .read-header h1
{
  display: inline-block;
  font-family: Forum, sans-serif;
  margin: 0;
  color: #fff;
  /*! font-size: 23px; */
  font-size: clamp(12px, 0.3rem + 4vw, 23px);
  /*! text-overflow: ellipsis; */
}

.book-read-bg .read-header h1 a
{
  color: #fff;
}

#approved-status
{
  margin-top: 1em;
  text-align: center;
}

.contest-criteria
{
  text-align: center;
  font-weight: 600;
  
  /*! margin-top: 2.5em; */
  font-size: 1.2em;
  width: fit-content;
  margin: 1em auto 0 auto;
  
  background: #fafafa;
  border-radius: 5px;
  padding: 1em 2em;
}

.book-content
{
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;


  font-family: Raleway, sans-serif;
  font-weight: 500;
  /*! letter-spacing: 1px; */
  /*! max-width: 70em; */
  font-size: 16px;
  line-height: 1.5;
  text-align: justify;
  hyphens: auto;
}

.book-content p {
  margin: 0.3em 0 0 0;
  text-indent: 1em;
  min-height: 1em;
}

/*************************************/
/*
.user-page .start-chat
{
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  
  padding: 0.3em;
  
  border-radius: 0 5px 0 5px;
  border-left: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
  background: #d5d5d5;
}*/

.user-page .start-chat
{
  font-size: 10px;
  /*! position: absolute; */
  /*! right: 0; */
  /*! left: 0; */
  /*! margin-bottom: 1em; */
  /*! top: 7px; */
  /*! margin-top: 0.5em; */
  display: block;
  margin: 2em auto 0 auto;
  /*! width: 16em; */
}

.user-page .about
{
  position: relative;
}

.user-page .about h3
{
  /*! margin-top: 1.5em; */
  clear: both;
}

.user-page .about
{
  /*! max-height: 225px; */
  /*! overflow: hidden; */
}

.full-width .main
{
  /*! --width: auto; */
  /*! --max-width: 1200px; */

}

.user-page .about p
{
  /*white-space: pre-line; */
  overflow-wrap: break-word;
}

.user-page.main
{
  display: flex;
  flex-flow: wrap-reverse;
}

.user-page .about, .user-page .pages, .user-page .achievements
{
  width: 250px;
  padding: 1.5em;

  background: #f5f5f5;
  border-radius: 5px;
  margin: 0 3em 1.5em 0;
}

.achievements img
{
  margin: 0 0.5em 0.5em 0;
}


.user-page .books
{
  
}

.user-page
{
  margin-top: 3em;
}

.user-page h3
{
  text-transform: uppercase;
  font-size: 16px;
  font-weight: 600;
  margin: 0;
  color: #58636d;
}

.user-info h1.name
{
  color: #fff;
  font-family: Forum, sans-serif;
  font-weight: normal;
  font-size: 32px;
  margin: 0;

}

.book-info .genres
{
  /*! margin-bottom: 1em; */
  /*! margin-right: 13em; */
  /*! white-space: nowrap; */
  /*! overflow: hidden; */
  /*! text-overflow: ellipsis; */
  min-width: 20em;
}

#age_labels .age_labels{
  display: flex;
  flex-flow: column wrap;
}

.book-info .genres a, .book-info .age_labels a
{
  color: #738495;
  font-style: italic;
  font-size: 16px;
  font-weight: 600;
  margin-right: 0.4em;
  text-transform: lowercase;
}
.book-info .age_labels {
  padding-top: 0.1em;
}

.book-info .age_labels label{
  color: #fff;
  background-color: #ec0000;
  /*! font-style: italic; */
  font-size: 16px;
  /*! font-weight: 600; */
  margin-right: 0.4em;
  text-transform: lowercase;
  padding: 0em 0.3em;
  border-radius: 1px;
  /*! margin-top: 1em; */
  padding-bottom: 2px;
}

.book-info .genres a:not(:last-child):after {
  content: ", ";
}

.book-info h1.name
{
  color: #fff;
  font-size: 54px;
  /*! font-size: clamp(100%, 2rem + 3vw, 60px); */
  font-family: Forum, sans-serif;
  font-weight: normal;
  margin: 0;
  display: inline-block;
  position: relative;
  /*! white-space: nowrap; */
  overflow: hidden;
  text-overflow: ellipsis;
  /*! max-width: 70%; */
  line-height: 1;
  margin-top: -10px;
  text-shadow: #33333388 1px 0px 2px;
}

.contest-version-note
{
  font-size: 18px;
  vertical-align: middle;  
  white-space: nowrap;
}

.page-library .tabs-header
{
  margin-bottom: 1.2em;
}

.add-like
{
  /*! float: right; */
  /*! width: 8em; */
  /*! position: absolute; */
  /*! right: 0; */
  font-size: 14px;
  color: #58636d;
  font-family: Raleway;
  font-style: italic;
  display: block;
  padding: 0 0 0 53px;
  line-height: 43px;
  background-color: transparent;
  background-repeat: no-repeat;
  background-image: url(icons/heart_stroke_icon_88.png);
  background-size: 44px;
  /*! vertical-align: middle; */
  margin: 3em auto 2em auto;
  
  /*! box-sizing: content-box; */
  font-weight: 500;
}

.actions.is-verse .add-like {
  display: inline-block;
  margin-right: 3em;
}

.note
{
  margin: 1em 0 0.5em 0;
  color: #ce9238;
}

.page-contest-results .note
{
  margin-bottom: 1.5em;
  color: #000;
}

.important
{
  color: #ff424e;
}


.note.important
{
  margin: 1em 0;
  color: #ff424e;
}

label.spoiler{
  /*! color: #ff424e; */
  margin-left: 1em;
  /*! vertical-align: middle; */
  /*! display: inline-block; */
}
summary.spoiler{
  color: #0D99D3;
  cursor: pointer;
  user-select: none;
}

.new-comment.unregistered-note
{
  margin-bottom: 2em;  
}

.new-like.unregistered-note
{
  margin-top: 3em;
  text-align: center;
  margin-bottom: 1em;
}

.new-like.unregistered-note .add-like
{
  margin-top: 1em;
  width: max-content;
  text-align: left;
}


.blog-details .add-like
{
  font-size: 13px;
  padding-left: 38px;
  line-height: 32px;
  background-size: 32px;
  margin: 1.5em auto 1.5em auto;
}


.add-like.liked
{
  background-image: url(icons/heart_icon_88.png);
}

form.actions
{
  display: inline-block;
}

.verse form.actions
{
  /*! margin-top: 0.5em; */
}

.audiobook .add-like
{
  margin: 1em auto 0 1em;
  /*! order: 6; */
  height: 48px;
  line-height: 48px;
  display: inline-block;
}

.book-info .right
{
  /*! margin-left: 310px; */
  position: relative;
  /*! min-width: 20em; */
  display: flex;
  flex-direction: column;
}

.verse .book-info .right
{
  margin-top: 0.5em
}

a.tab:hover
{  
  text-decoration: none;
}

.tab .title
{
  vertical-align: bottom;
  padding: 0 0.5rem;
}

.tab .count
{
  font-weight: 700;
  margin-left: 0.3em;
}

.tab
{
  font-size: 16px;
  display: inline-block;
  border-bottom: 3px solid #ccc;
  vertical-align: bottom;
  color: #999;
  text-align: center;
  /*! display: flex; */
  flex-grow: 1;
  min-width: 5em;
}

.tab.current
{
  font-size: 20px;
  color: #58636d;
  border-color: #58636d;
}

.user-page .tab
{
    /*! width: 32%; */
}

.user-page .tabs
{
  /*! float: left; */
  /*! width: 56em; */
  display: inline-block;
  flex: 1;
  min-width: 270px;
}

.aside
{
  float: left;
  clear: left;
  order: -1;
  flex: 0;
}

.additional_complaint_info{
  margin: 0px 0px 0px 30px;
  font-weight: 600;
  font-style: italic;
  color: #58636d;
  font-size: 15px;
  margin: 0px;
}

.additional_complaint_info p{
  margin: 0px 0px 0px 20px;
}

.complaint .author{
  display: inline-block;
  font-weight: 600;
  font-style: italic;
  color: #58636d;
  font-size: 15px;
}

.notification .author
{
  display: inline-block;
  font-weight: 600;
  font-style: italic;
  color: #58636d;
  font-size: 15px;
}

.blocked-users .author
{
  display: inline-block;
  font-weight: 600;
  font-style: italic;
  color: #58636d;
  font-size: 15px;
}

.blocked-users .author .name
{
  font-weight: 600;
  font-style: italic;
  margin-left: 5px;
}

.blocked-users .author .text
{
  display: inline-block;
  font-weight: 500;
  font-style: italic;
}

.blocked-users-text
{
  display: flex;
  align-items: center;
}

a.blocked-users-link
{
  font-weight: bold;
}

.blocked-users-text button{
  margin-left: auto;
  font-size: 10px;
}

.complaint .author .avatar
{
  border-radius: 25px;  
}

.complaint .author .name
{
  margin-left: 0.3em;
}
.complaint.unread, .msg.unread
{
  font-weight: 600;
}

.notification .author .avatar
{
  border-radius: 25px;  
}

.notification .author .name
{
  margin-left: 0.3em;
  /*! vertical-align: bottom; */
}

.notification.unread, .msg.unread
{
  font-weight: 600;
}

.blocked-users{
  background-color: #fef2f3;
  outline-color: #fef2f3;
  margin-bottom: 0.8em;
  border-radius: 1px;
  outline-width: 0.3em;
  outline-style: solid;
}

.unread *
{
  font-weight: 600 !important;
}

.unread .author .name
{
  font-weight: 700 !important;
}

.msg
{
  margin-bottom: 0.3em;  
}

.chats
{
  margin-bottom: 1.5em;
  clear: left;
}

.chats .author .avatar
{
  float: left;
}

.chats .last-msg
{
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;    
  /*! text-overflow: ellipsis; */
  font-size: 14px;
  color: #000;
  font-weight: normal;
}

.chats .text, .chats .time
{
  display: inline-block;
  margin-right: 0.5em;
  /*! text-overflow: ellipsis; */
}

.nav-back
{
  float: right;
  margin-bottom: 1em;
  display: block;
  text-align: right;
  /*! margin-top: -2em; */
  color: #6c88a1;
  margin-left: 1em;
}

.blog-details .nav-back
{
  margin-top: 0;
  margin-bottom: -1em;
  margin-right: 6px;
  font-weight: 600;
}

.pagination
{
  font-size: 16px;
  font-family: Carlito;  
  text-align: center;
  margin-top: 1rem;
}

.page-chat .pagination
{
  text-align: right;
}

.pagination a
{
  color: #6c88a1;  
}

.pagination .current
{
  font-size: 20px;
  font-weight: 500;  
}

.msg
{
  background: #f1f7fd;
  padding: 0.8em 1.1em;
  border-radius: 5px;
  position: relative;
}

.msg.my
{
  background: #eff7ea;
  
}

.msg .author .avatar
{
  float: left;
}



#new-msg
{
  margin-top: 1em;
}

#edit-msg
{
  margin-bottom: 0.5em;
  color: #76996a;
  font-size: 12px;
}

.complaint a
{
  font-weight: 400;
  display: inline-block;
  /*! color: #000; */
}

.complaint
{
  margin-bottom: 0.8em;
  border-radius: 5px;
  /*! outline-width: 0.3em; */
  /*! outline-style: solid; */
  /*! outline-color: transparent; */
  background-color: #eee;  
  /*! border: 2px solid black; */
  padding: 1em;
}

.notification a
{
  font-weight: 400;
  display: inline-block;
  /*! color: #000; */
}


.notification
{
  margin-bottom: 0.8em;
  border-radius: 1px;
  
  outline-width: 0.3em;
  outline-style: solid;
  outline-color: transparent;
  background-color: initial;  
}

.ntype4
{
  outline-color: #f1f7fd;
  background-color: #f1f7fd;
}

.ntype3, .ntype11, .ntype12
{
  outline-color: #fef2f3;
  background-color: #fef2f3;
}

.ntype1, .ntype2, .ntype7, .ntype9, .ntype10
{
  outline-color: #eff7ea;
  background-color: #eff7ea;  
}

.ntype5, .ntype6, .ntype8
{
  outline-color: transparent;
  background-color: initial;  
}

.ntype8.is-news *
{
  color: #4c92dd;
}

.complaint .time
{
  float: left;
  font-size: 12px;
  margin-bottom: 0.3em;
}

.complaint_id{
  float: left;
  text-align: center;
  font-size: 12px;
  margin-bottom: 0.3em;
  padding: 0px 0px 0px 30px;
}

.complaint_state{
  font-weight: 600;
  font-style: italic;
  color: #58636d;
  font-size: 15px;
  width: 95%;
  text-align: right;
}

.complaint_ip{
  padding: 0px;
  text-align: right;
  font-size: 12px;
  right: 0px;
  margin-bottom: 0.3em;
}



.complaint .book-name, .notification .part-name 
{
  font-weight: 600;
}

.notification .time
{
  font-size: 12px;
  margin-bottom: 0.3em;
}

.notification .book-name, .notification .part-name 
{
  font-weight: 600;
}

.tabs-content
{
  margin-top: 1.2em;
  /*! position: relative; */
}

.audiobook .tabs-content
{
  margin-top: 2em;
}

div.comments
{
  clear: both;
  margin-top: 6em;
}

.page-settings input[type="email"]
{
  margin-right: 0.5em;
}

.email-status
{
  padding: 0.2em 0.5em;
  border-radius: 3px;  
  color: white;
  margin: 0.5em 0;
  display: inline-block;
}

.email-status a {
  color: #333;
}

.email-status.confirmed-status1{
  background-color: green;
}

.email-status.confirmed-status0{
  background-color: 	#FF4F00;
}

.email-status.confirmed-status2{
  background-color: 	red;
}


.confirm-age{
  margin-bottom: 20px;
}

.confirm-age label{
  color: #ff424e;
}

.comment
{
  margin-bottom: 2em;
}

.comment.deleted
{
  opacity: 0.2;
  font-style: italic;
}

.comment-author
{
  display: inline-block;
  /*! font-weight: 600; */
  font-style: italic;
  color: #58636d;
  font-size: 15px;
}

.comment-author .avatar
{
  border-radius: 25px;  
}

.comment-author .name, .comment-author .marker 
{
  margin-left: 0.3em;
  vertical-align: middle;
}

.comment .time, .msg .time, .chats .time
{
 
  font-size: 12px;
  color: #999;
  white-space: nowrap;
  /*! display: block; */
  /*line-height: 1;*/
  /*! vertical-align: top; */
}

.msg .time
{
  margin-top: 0.15em;
}

.msg .text  
{
  clear: left;
  margin-top: 0.4em;
  /*! white-space: pre-line; */
}

.msg .text br
{
  margin-bottom: 0.3em;
}


.msg .name
{
  /*! font-size: 6px; */
  /*! line-height: 1; */
  /*! vertical-align: top; */
}

.comment .time
{
  display: inline-block;
  /*! margin-left: 1.5em; */
}

.comment .for-part
{
  display: block;
  
  font-size: 12px;
  font-style: italic;
  color: #666;
  margin-bottom: 0.1em;
}

.comment-author
{
  margin-bottom: 0.4em;
  margin-right: 1.5em;
}

@keyframes hightlight_comment {
    0%  {background: transparent; outline: 5px solid transparent; }
    50% { background: #ccc; outline: 5px solid #ccc; }
    100% { background: transparent; outline: 5px solid transparent; }
}

@keyframes hightlight_err {
  0%  {background: transparent; outline: 5px solid transparent; }
  50% { background: #a88181; outline: 5px solid #a88181; }
  100% { background: transparent; outline: 5px solid transparent; }
}

.error
{
  border-radius: 2px;
  animation: hightlight_err 2s;
  margin: 1em auto;
}

.info
{
  color: #666;
  border-radius: 2px;
  animation: hightlight_comment 2s;
  margin: 1em auto;
}

form.new-comment
{
  margin-bottom: 1em;
}

/*
.comment::before
{
  content: " ";
  width: 10px;
  display: inline-block;
  border-left: 2px solid #333;
  height: 50px;
  position: absolute;
  margin-left: -20px;
  margin-top: -40px;
  border-radius: 0 0 0 10px;
  border-bottom: 2px solid #333;
}
*/
.comment
{
  background: transparent;
}

.comment:target
{
  border-radius: 2px;
  animation: hightlight_comment 2s;
}

.comment-content
{
  margin: 0 0 0.3em 0;
  white-space: pre-line;
}

.edit-actions form
{
  display: inline;
}

.dropdown .action img{
  margin-right: 5px;
}

.comment .reply, .comment .edit, .comment .actions button
{

  font-style: italic;  
  font-size: 12px;
  color: #6C88A1;
  cursor: pointer;
  display: inline-block;
  background: none;
  text-transform: initial;
  font-family: Raleway;
  font-weight: normal;
  margin: 0 1em 0 0;
  padding: 0;
  letter-spacing: initial;
  /*! margin-top: 1em; */
}

button.inactive
{
  cursor: initial !important;
}


.comment .actions button
{
  background: no-repeat url(icons/heart_stroke_icon_64.png) center left;
  background-size: 16px;
  
  padding-left: 20px;
  height: 20px;
  /*! vertical-align: initial; */
}

.comment .actions.liked button
{
  background-image: url(icons/heart_icon_64.png);
}

.reply-form textarea
{
  vertical-align: top;
  height: 3em;
  min-width: 42%;
  margin-right: 1em;
  margin-bottom: 1em;
  width: 90%;
  margin-top: 0.5em;
}

.reply-form .buttons .spoiler {
  /*! display: block; */
  /*! margin-left: 0; */
  /*! margin-top: 5px; */

}

menu.dropdown li form input{
  margin: 0;   
  padding: 0;
  background-color:rgba(0, 0, 0, 0);

  font-size: 14px;
  text-transform: none;
  
  margin-left: 0px;
  padding: 0px;
}

.new-comment input[type=submit], .reply-form input[type=submit]
{
  font-size: 10px;
  /*! margin-left: 1em; */
}

.new-comment textarea
{
  vertical-align: top;
  /*! margin-right: 1em; */
  /*width: 70%;*/
  width: 90%;
  min-width: 20em;
  /*max-width: 40em;*/
  height: 3em;
  margin-right: 1em;
  margin-bottom: 1em;
}

.new-comment input
{
  /*! vertical-align: bottom; */
}

.user-book
{

}

.user-book .cover
{
  width: 128px;
  height: 200px;
  float: left;  
}

/*************************************/

img
{
  /*! object-fit: contain; */
  /* image-rendering: -webkit-optimize-contrast; */
}

.page-contest h1 img {
  max-width: 100%;
  height: auto;
  border-radius: 5px;
}

.fit-cover
{
  object-fit: cover;
}

img.avatar
{
  object-fit: cover;
}

.part .video
{
  max-width: 600px;
  display: inline-block;
  width: 100%;
  vertical-align: middle;
  margin-right: 2%;
}

#ytplayer
{
  display: block;
}

.iframe-container {
  overflow: hidden;
  /* 16:9 aspect ratio */
  padding-top: 56.25%;
  position: relative;
}

.iframe-container iframe {
   border: 0;
   height: 100%;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
   /*! max-width: 640px; */
}

.add-book input[type="text"], .add-book textarea
{
  width: 100%;
  box-sizing: border-box;  
}

.add-book .genres option.sup
{
  font-weight: 600;
}

.add-book .genres option.sub
{

}

.add-book textarea
{
  max-width: 42em;
  height: max-content;
  overflow: visible;
  resize: both;
}

.add-book .genres select, .add-book select[name="litform"]
{
  width: 16em;
  box-sizing: border-box;
}

.add-book input[name="title"],
.add-book input[name="tags"]
{
  /*! max-width: 33em; */
  box-sizing: border-box;
}

.add-book .cover
{
  float: left;
  margin-bottom: 2em;
  margin-right: 1em;
}

.add-book .cover .placeholder
{
  width: 256px;
  height: 400px;
  background: #e7e7e7;
  border-radius: 5px;
  margin-right: 3em;
  position: relative;
  transition: all 0.5s ease;
  margin-bottom: 1em;
}

.add-book.add-verse .cover .placeholder
{
  width: 200px;
  height: 170px;
}

.add-book.add-verse:not(.btype1) .cover .label
{
  /*! line-height: 150em; */
  top: 20px;
  font-size: 14px;
}

.add-book.btype1 .cover .placeholder
{
  width: 256px;
  height: 256px;
}

.add-book .user-photo .placeholder
{
  width: 256px;
  height: 256px;
}



.add-book.btype1 .cover .label
{
  /*! line-height: 150em; */
  top: 20px;
}


.add-book .cover .label
{
  margin: 0 auto;
  position: absolute;
  top: 190px;
  left: 0;
  right: 0;
  width: max-content;
  text-transform: none;
  font-weight: 600;
  color: #999;
  font-size: 18px;
  text-align: center;
  z-index: 1;
}

.add-book .user-photo .label
{
  top: 20px;
}

.add-book .cover input
{
  border: 0 none;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 1em;
  vertical-align: middle;
  /*! display:table-cell; */
    
  z-index: 2;
  position: relative;
  /*! opacity: 0; */
  box-sizing: border-box;
  line-height: 280px;
  /*! display: table-cell; */
  /*! vertical-align: middle; */
}

.add-book .cover input::-webkit-file-upload-button
{
  background: none;
  border: 0px none;
}

.add-book th:first-child
{
  min-width: 10em;
}

.add-book .genres th
{
  min-width: initial;
}

.add-book th, .add-book td
{
  vertical-align: top;
}

/*
.add-book .genres tr:first-child th
{
  text-align: left;
  font-style: italic;
  font-size: 12px;
}*/

.add-book td:first-of-type, .add-book td.genres .tip
{
  padding-left: 27px;
}

.add-book td.genres,
.add-book td.genres td
{
  padding-left: 0;
}

.add-book td.genres th, .add-book td.genres td
{
  padding-bottom: 0.5em;
}

.add-book .age-restriction label
{
  font-weight: 700;
  display: block;
  margin: 1em 0 0 0;
}

.add-part input[name="title"]
{
  max-width: 32em;
  width: 100%;
  box-sizing: border-box;  
}

.add-part input[name="url"]
{
  max-width: 32em;
  width: 100%;
  box-sizing: border-box;  
}

.add-part input[name="publish"], button.publish
{
  background-color: #669966;
}

textarea[name=text]
{
  max-width: 40em;
  height: 35em;
  width: 100%;
  box-sizing: border-box;
}

.add-part .text
{
  vertical-align: top;
}
/*************************************/

.box.has-advanced-upload {
  background-color: white;
  outline: 2px dashed black;
  outline-offset: -10px;
}
.box.has-advanced-upload .box__dragndrop {
  display: inline;
}

.button.approve
{
  background-color: #76996a;
}
.button.reject
{
  background-color: #b51f24;
}
.button.rework
{
  background-color: #ce9238;
}


@media (max-width: 1500px) {
  #header, .book-info, .important-msg {
    width: auto;
  }
  
  #header .logo span
  {
    margin-left: -48px;
  }
  
  .full-width .main  {
    width: auto;
  }
  
  .books {
    gap: 1.5em 1em;
  }
}

@media (max-width: 1100px) {
  

  .page-contest-allmor2021 #main,  
  .page-contest-allmor-poetry2021 #main  
  {
    padding-top: 25%;
  }
    
  .with-sides header#tophead {
    margin-bottom: 0.5em;
  }
  
  #header .logo span
  {
    margin-left: 0;
  }

  #mobile-shortcuts
  {
    display: block;
    margin-bottom: 0.8em;
    display: flex;
    /*gap: 0.8em;*/
    align-items: center;
    justify-content: space-evenly;
    flex-wrap: wrap;
    align-content: center;
  }


  .promo.top-promo, .main-top-banner-root
  {
    display: none;
  }

  .bonus-link
  {
    display: block;
  }
  
  .greets-block
  {
    float: none;
    width: auto;
  }
  
  #bonus 
  {
    position: initial;
    
    width: auto;
    margin-top: 1em;
  }
  
  .contest-winners
  {
    margin-right: initial;
  }
  
/*   #dn2120-banner
  {
    height: 37px;
  } */
  
  .main, .content main, .footer, #header, .book-info, .important-msg
  {
    width: auto;
  }
  
 .with-sides .content
{
  width: auto;
  float: none;
}

.with-sides main
{
  width: auto;
  display: block;
}

.with-sides .news
{
  width: auto;
}

.side
{
  width: auto;
}
  
.with-sides .news .small-news-list
 {
    display: flex;
    flex-wrap: wrap;
 }
  
 .news-block
 {
    margin-right: 1em;
 }
  

  

  
 .promo 
  {
    display: flex;
    flex-wrap: wrap;   
    margin-bottom: 1em;
    text-align: center;
  }
  
  .top-promo
  {
    /*! margin-top: 45px; */    
    float: none;
    /*! --display: block; */
    /*! margin-left: auto; */
    /*! margin-right: auto; */    
    align-items: center;
    justify-content: center;
    gap: 2em;
  }
  
/*   .page-index .top-promo
  {
    float: left;
    display: flex;    
    margin-top: 0;
  } */
  
  .top-promo .label
  {
    /*! margin-top: 3rem; */
  }
  
  .promo .dn2120 .label
  {
    margin-top: 3.8rem;
  }
  
  .promo > div
  {
    margin-right: 1em;
  }
  
  #promo-social
  {
    order: 2
  }
  
  #promo-help
  {
    order: 1
  }
  
  #promo-count .arkush-counter
  {
    margin-top: 2.5em;
  }
  
  #promo-patrons .patreon
  {
    margin-top: 3.5em;
  }
  
  
  .book-read-bg .parts.trigger,  .book-read-bg .parts.trigger-l2
  {
    position: initial;
  }
  
  .book-read-bg .parts .dropdown
  {
    right:initial;
    text-align: left;
    
    width: auto;
    min-width: min-content;
  }

  .book-read-bg .parts .dropdown li>a
  {
    padding: 0.8em;
  }
  
}

@media (max-width: 1000px) {
  
  #header nav input
  {
    width: 25px;
    box-sizing: border-box;
    padding-left: 25px;
    position: absolute;
    /*! display: inline-block; */
    /*! top: 0; */
    /*! left: 0; */
    /*! margin-bottom: 2em; */
    right: 0;
    min-width: auto;
  }
  
  #header form
  {
    position: relative;
    height: 32px;
    width: 34px;
    float: right;
    margin: 2px 0;
  }
    
  #header nav input:focus
  {
    width: auto;
    padding-left: 40px;
  }  
  
  
  #header
  {
    padding: 0 5px;    
  }  
}

@media (max-width: 770px) {
/* 
  #dn2120-shortcut
  {
    display: block;
  } */
  
  .all-genres {
    justify-content: space-evenly;
  }  

/*   #dn2120-banner
  {
    height: 26px;
    border-radius: 0;
  } */ 
  
  .contest-place-indicator
  {
    line-height: 1.4;
    float: none;
    display: block;
    text-align: center;
  }
  
  .contest-winner-book .book .title
  {
    font-size: 30px;
  }
  
  .contest-winner-book .book .author .name
  {
    font-size: 14px;
  }

  .main, .content main, .footer, .book-info, .important-msg
  {
    padding: 0 1em;
  }
  
  .top-promo #promo-carousel .book
  {
    margin: auto;
  }
  
  .footer
  {
    padding: 1em;
  }

  
  #header nav > a, #header .auth-block > a
  {
    /*! margin-right: 0.7em; */

  }
  
    
  #header .logo span
  {
    /*margin-left: -36px;*/
    /*! margin: 0 0.3em 0 0; */
    width: 134px;
  }
  
  .usernav .avatar{
    /*! padding: 1px 0 2px 0; */
  }
  
  .book-info .add-like
  {
    position: initial;
  }
  
  .book-info .genres
  {
    order: -4;
  }
  
  .book-info .age_labels
  {
    order: -3;
  }  
  
  .book-info .stats
  {
    order: -2;
    margin: 0.5em 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5em 0;
  }
  
  .book-info .statuses
  {
    position: initial;
    margin-top: auto;
    text-align: left;
    order: -1;
  }
  
  .audiobook .button-block
  {
    order: 4;
    margin: 1em 0 0 0;
  }
  
  .book-info .tags
  {
    margin-top: 0;
    margin-right: 0;
  }
  
  .promo, .news, .with-sides .content
  {
    float: none;
  }

  .main, .side, .content main, .footer, .with-sides .news, .with-sides .content
  {
    width: auto;
    /*! text-align: center; */
  }
  
  .user-page .tabs {
    display: block;
    /*! min-width: 300px; */
  }
  
  
  .content
  {
    /*! padding: 1em; */
  }
  
  .page-index .content main h1:first-of-type
  {    
    /*! padding-top: 0; */
    /*! margin-top: 40px; */
    padding-top: 20px;
  }  
  
  .with-sides .news
  {
    display: block;
  }

  header#tophead nav
  {
    /*! width: 140px; */
    height: auto;
    /*! float: left; */
    /*! font-size: 0.7em; */
  }  

  

  
  .side .block
  {
    border: none;
    margin-left: 0;
    margin-right: 0;
  }

  .side
  {
    /*! padding: 0; */
  }

  .promo
  {
    display: block;
  }
  
/*   .page-index .top-promo
  {
    display: block;
    float: none;
    margin-top: 1em;
  }
  
  .top-promo
  {
    margin-top: 1em;
  }
  
  .top-promo .dn2120
  {
    display: none;
  }
  
  .top-promo .label
  {
    display: none;
  } */
  
  .promo .block, .promo .our-social
  {
    text-align: center;    
  }

  .news .block
  {
    text-align: center;
  }  
  
  footer .our-crowdfundings
  {
    margin-right: 3em;
    float: left;
    margin-bottom: 2em;
  }
  
  #legal-info
  {
    float: left;
  }

  #copyright, #legal-info
  {
    margin-bottom: 2em;
  }

  .news-block, .featured-block
  {
    margin-left: auto;
    margin-right: auto;
    max-width: initial;
    width: auto;
    box-sizing: border-box;
  }
  
  /*.user-info h1.name  
  {
    font-size: 15vw;
  }*/
  
  .user-page .about, .user-page .pages, .user-page .achievements  
  {
    width: auto;
    margin: 1em 0.5em 0 0.5em;
    min-width: 180px;
  }
  
  .aside
  {
    float: none;
    /*! display: block; */
  }
  
  .add-part th
  {
    max-width: initial;
  }
  
  form th, form td, 
  form table, form tr, form tbody
  {
    display: block;
  }
  
  form table th:last-of-type,
  form table td:last-of-type
  {
    padding-right: 0;
  }
  
  .add-book td:first-of-type, .add-book td.genres .tip {
    padding-left: 0;
  }
  
  .book-info div.edit-actions
  {
    right: 15px;
  }
  
  .add-book .cover
  {
    float: none;
    margin-bottom: 1em;
  }

  .book-info .left  
  {
    float: none;
  } 
  
  .verse .book-info .left {
    margin-top: 1.5em;
  }  
  
  .book-info .read
  {
    margin-right: 0.5em;
  }
  
  .book-info .annotation  
  {
    color: #000;
    height: auto;
  }

  .book-info .age_labels + .annotation {
    height: auto;
  }
  
  .book-info .tabs  
  {
    margin-left: 0;
  }
  
  .book-info .add-text
  {
    margin-top: 0;
    position: initial;
    display: inline-block;
    max-width: 10em;
    vertical-align: middle;
  }
  
  .book-info h1.name  
  {
    white-space: initial;
    font-size: clamp(100%, 2rem + 3vw, 60px);
  }

  .page-help-ukraine .war-flow {
   justify-content: center;  
  }
}

@media (max-width: 430px) {
  header#tophead nav a
  {
    font-size: 0.97em;
  }
  
  .books
  {
    justify-content: space-evenly;
  }
  
  .book.verse {
    /*! width: auto; */
    /*! max-width: initial; */
    display: block;
    flex: 1;
    min-width: 200px;
  }
  
  .verse form.actions .add-text
  {
    display: none;
  }
}

@media (max-width: 400px) {
  
  header#tophead nav a
  {
    font-size: 0.95em;
  }   

  .author-info
  {
    width: auto;
    text-align: center;
    flex: 1;
  }
}

@media (max-width: 390px) {
  
  header#tophead nav a
  {
    font-size: 0.92em;
  }


}

@media (max-width: 380px) {
  
/* #header .logo span
{
  width: 109px;
} */

#header .auth-block > a, .usernav {
  margin-left: 0.5em;
}

}

@media (max-width: 356px) {

  header#tophead nav a
  {
    font-size: 0.9em;
  }    
 
}

@media (max-width: 370px) {
  
  header#tophead nav a
  {
    font-size: 0.87em;
  }   
}

@media (max-width: 359px) {
  
  header#tophead nav a
  {
    font-size: 0.84em;
  }   
}

@media (max-width: 350px) {
  
  .page-help-ukraine .war-prime 
  {
    font-size: 1.2em;
  }  
  
  .main, .content main, .footer, .book-info, .important-msg {
    padding: 0 5px;
  }
  
  #header .logo span
  {
    width: 109px;
  }
 
  header#tophead nav a
  {
    font-size: 0.74em;
  }  
  
  .book  {
    /*! margin-right: 1em; */
  }
  
  .books {
    gap: 1em 0.3em;
  }
  
  .new-comment textarea
  {
    min-width: auto;
    width: 80%;
    
  }
  
  .navmenu
  {
    width: auto;
    height: auto;
  }
  
}

@media (max-width: 310px) {
  .top-poster
  {
    height: 30px;
  }
}

@media (max-width: 318px) {

 #header .logo img
  {
    width: 80px;
    height: auto;
  }
  
  #header .logo span
  {
    background-size: 100px;
    
    width: 65px;
  }
  
  header#tophead nav {
    /*! gap: 6px; */
    /*! flex-wrap: wrap; */
    
  }
  
  header#tophead nav > * {
    margin-right: 6px;
  }
}


@media (pointer: coarse), (hover: none) {
  span.stat[title] {
    position: relative;
    display: inline-flex;
    justify-content: left;
  }
  span.stat[title]:focus::after {
    content: attr(title);
    position: absolute;
    top: 90%;
    color: #000;
    background-color: #fff;
    border: 1px solid;
    width: fit-content;
    padding: 3px;
  }
}

.page-search .stats {
  margin-left: 1.5em;
}

.page-search .stat {
  display: inline-block;
  font-size: 12px;
  background-size: 16px;
  line-height: 16px;
  padding: 0 0 0 18px;
  height: 16px;
  margin-right: 0.6em;
  background-color: transparent;
  background-repeat: no-repeat;
  font-family: Carlito, sans-serif;
  vertical-align: middle;
}

.page-settings #telegram-confirm
{
  padding: 0 1em;
}


/* ==========================================================================
    Helper classes
    ========================================================================== */

/*
  * Hide visually and from screen readers
  */

.hidden,
[hidden] {
  display: none !important;
}

/*
  * Hide only visually, but have it available for screen readers:
  * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
  *
  * 1. For long content, line feeds are not interpreted as spaces and small width
  *    causes content to wrap 1 word per line:
  *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
  */

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
  * Extends the .sr-only class to allow the element
  * to be focusable when navigated to via the keyboard:
  * https://www.drupal.org/node/897638
  */

.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

/*
  * Hide visually and from screen readers, but maintain layout
  */

.invisible {
  visibility: hidden;
}

/*
  * Clearfix: contain floats
  *
  * For modern browsers
  * 1. The space content is one way to avoid an Opera bug when the
  *    `contenteditable` attribute is included anywhere else in the document.
  *    Otherwise it causes space to appear at the top and bottom of elements
  *    that receive the `clearfix` class.
  * 2. The use of `table` rather than `block` is only necessary if using
  *    `:before` to contain the top-margins of child elements.
  */

.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
}

.clearfix::after {
  clear: both;
}

/* ==========================================================================
    EXAMPLE Media Queries for Responsive Design.
    These examples override the primary ('mobile first') styles.
    Modify as content requires.
    ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
    Print styles.
    Inlined to avoid the additional HTTP request:
    https://www.phpied.com/delay-loading-your-print-css/
    ========================================================================== */

@media print {
  *,
  *::before,
  *::after {
    background: #fff !important;
    color: #000 !important;
    /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]::after {
    content: " (" attr(href) ")";
  }

  abbr[title]::after {
    content: " (" attr(title) ")";
  }

  /*
    * Don't show links that are fragment identifiers,
    * or use the `javascript:` pseudo protocol
    */
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }

  pre {
    white-space: pre-wrap !important;
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  /*
    * Printing Tables:
    * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
    */
  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}


.upvote, .downvote {
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: contain;
  background-color: transparent;
  margin: 0 0.5em;
}

.upvote
{
  background-image: url(icons/thumbs_up.png);
}

.downvote
{
  background-image: url(icons/thumbs_down.png);
}


/***************/

.rating {
  display: flex;
  width: 100%;
  justify-content: center;
  flex-direction: row;
  height: 150px;
  position: relative;

}
.rating-sys2
{
  height: 50px;
}

.rating-0, .rating button {
  filter: grayscale(100%);
}

.rating button.active
{
  filter: initial;
}


.rating-stars {
  position: relative;
  display: flex;
  flex-direction: row;
  unicode-bidi: bidi-override;
  direction: rtl;
}


.rating-stars > input {
  position: absolute;
  opacity: 0;

  bottom: 0;
  cursor: pointer;
}

.rating-stars > input, .rating-stars > label
{
  width: 40px;
  height: 40px;
}

.rating-cb-1
{
  left: 0
}

.rating-cb-2
{
  left: 40px;
}

.rating-cb-3
{
  left: 80px;
}

.rating-cb-4
{
  left: 120px;
}

.rating-cb-5
{
  left: 160px;
} 

.rating-stars > label {
  cursor: pointer;
  margin-top: auto;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='126.729' height='126.73'%3e%3cpath fill='%23e3e3e3' d='M121.215 44.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.101 0l-12.4 30.3c-.8 2.1-2.8 3.5-5 3.7l-34.9 3.3c-5.2.5-7.3 7-3.4 10.5l26.3 23.1c1.7 1.5 2.4 3.7 1.9 5.9l-7.9 32.399c-1.2 5.101 4.3 9.3 8.9 6.601l29.1-17.101c1.9-1.1 4.2-1.1 6.1 0l29.101 17.101c4.6 2.699 10.1-1.4 8.899-6.601l-7.8-32.399c-.5-2.2.2-4.4 1.9-5.9l26.3-23.1c3.8-3.5 1.6-10-3.6-10.5z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 76%;
  transition: .3s;
  text-indent: -1000em;
  overflow: hidden;
  text-align: right;
}

/* .rating input:focus + label {
	outline: 1px dashed #777;
}
 */
 .rating-stars > input:checked ~ label {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='126.729' height='126.73'%3e%3cpath fill='%23fcd93a' d='M121.215 44.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.101 0l-12.4 30.3c-.8 2.1-2.8 3.5-5 3.7l-34.9 3.3c-5.2.5-7.3 7-3.4 10.5l26.3 23.1c1.7 1.5 2.4 3.7 1.9 5.9l-7.9 32.399c-1.2 5.101 4.3 9.3 8.9 6.601l29.1-17.101c1.9-1.1 4.2-1.1 6.1 0l29.101 17.101c4.6 2.699 10.1-1.4 8.899-6.601l-7.8-32.399c-.5-2.2.2-4.4 1.9-5.9l26.3-23.1c3.8-3.5 1.6-10-3.6-10.5z'/%3e%3c/svg%3e");
}


.rating-stars > input:not(:checked):hover ~ label,
.rating-stars > input:not(:checked):hover ~ label ~ label {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='126.729' height='126.73'%3e%3cpath fill='%23d8b11e' d='M121.215 44.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.101 0l-12.4 30.3c-.8 2.1-2.8 3.5-5 3.7l-34.9 3.3c-5.2.5-7.3 7-3.4 10.5l26.3 23.1c1.7 1.5 2.4 3.7 1.9 5.9l-7.9 32.399c-1.2 5.101 4.3 9.3 8.9 6.601l29.1-17.101c1.9-1.1 4.2-1.1 6.1 0l29.101 17.101c4.6 2.699 10.1-1.4 8.899-6.601l-7.8-32.399c-.5-2.2.2-4.4 1.9-5.9l26.3-23.1c3.8-3.5 1.6-10-3.6-10.5z'/%3e%3c/svg%3e");
}

.emoji-wrapper {
  width: 100%;
  text-align: center;
  height: 100px;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
}

.emoji {
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: .3s;
}

.emoji > svg {
  margin: 15px 0; 
  width: 70px;
  height: 70px;
  flex-shrink: 0;
}

.rating-cb-1:checked ~ .emoji-wrapper > .emoji { transform: translateY(-100px); }
.rating-cb-2:checked ~ .emoji-wrapper > .emoji { transform: translateY(-200px); }
.rating-cb-3:checked ~ .emoji-wrapper > .emoji { transform: translateY(-300px); }
.rating-cb-4:checked ~ .emoji-wrapper > .emoji { transform: translateY(-400px); }
.rating-cb-5:checked ~ .emoji-wrapper > .emoji { transform: translateY(-500px); }

.top-promo-link
{
  display: inline-block;
  text-align: center;
  max-width: 256px;
}

.carousel-block
{
  text-align: right;
}

#mobile-shortcuts .top-promo-link
{
  width: 256px;
  max-height: initial;
  height: 140px;
}

.top-promo-link img 
{
  width: auto;
  max-height: 100%;
}

/* .top-promo-link {
  display: none !important 
} */


.draggable-button {
  height: 22px;
  width: 22px;
  vertical-align: middle;
  background-size: contain;
  cursor: pointer;
}

.part.dragging {
  opacity: 0.5;
}

div.action.drawable {
  margin-left: 10px;
}

/* OAuth */
.oauth-separator {
  text-align: center;
  border-bottom: 1px solid #58636d;
  line-height: 0.1em;
  max-width: 350px;
  margin: 20px;
}

.oauth-separator span {
  background: #fff;
  padding: 0 10px
}

.oauth-list {
display: flex;
flex-direction: row;
gap: 15px;
}

.oauth-list a {
height: 18px;
border-radius: 4px;
padding: 10px;
display: flex;
align-items: center;
font-weight: 700;
border: 1px solid #dadce0;
transition: background-color .218s,border-color .218s;
line-height: 18px;
}


.oauth-list a:hover {
background-color: #F8FAFF;
border: 1px solid #D2E3FC;
filter: initial !important;
}

.linkink-service {
display: flex;
flex-direction: column;
}

.linkink-service-title {
  display: flex;
  align-items: center;
  gap: 5px;
}

.linkink-service-title img {
  height: 20px;
  width: 20px;
}

.linkink-service-list {
  display: flex;
  gap: 10px;
  flex-direction: column;
}

.linkink-service-item {
  display: flex;
  border: 1px solid #999;
  border-radius: 4px;
  padding: 10px;
  gap: 30px
}

.linkink-service-item p {
 flex: 1;
}
/***/