@import url('https://fonts.googleapis.com/css2?family=IM+Fell+English:ital@0;1&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Sigmar&family=Sigmar+One&display=swap');

html {
  background-color: #444444;
  color: #eee;
  font-size: 1rem;
  line-height: 1.4;
  font-family: 'Open Sans', sans-serif;
/*  border: 1px solid red!important;*/

  box-sizing: border-box;
/*  background: #458;*/
  width: 100%;
  padding: 0!important;
  margin: 0!important;
/*  overflow: hidden;*/
}

body {
/*  border: 1px solid dodgerblue!important;*/
  box-sizing: border-box;
/*  overflow: hidden;*/

}


section {
    width: 100%;
    padding: 2rem 0!important;
/*    border: 1px solid greenyellow;*/
    box-sizing: border-box;

  /*  overflow: hidden;*/
   > * {
      overflow: hidden;
      box-sizing: content-box;
   }
}
section + section {
  margin-top: 2rem;
}
section:nth-of-type(odd) {
  background-color: #444444;
}
section:nth-of-type(odd) {
  background-color: #777;
}

section:has(article){
  width: 100%;
  background-color: #000!important;
  article {
/*    background: red;*/
    width: 80%;
    padding: 3rem ;
    p {
      font-size: 1.2rem;
    }
  }
}

article {
    width: 100%;
    max-width: 100%;
    margin: .2rem auto;
    overflow: hidden;

    box-sizing: border-box;
    > * {
        max-width: 100%;
    }
    form {
      max-width: 80%;
    }
    > form {
    max-width: 100%;
      input {
          width: 90%;
          max-width: 90%!important;
      }
    }    
}

article form.un_widefull {
  margin: 1rem auto;
  width: 90%;
}



iframe,
audio {
  position: relative;
  display: block;
  width: 70%;
  margin: 1rem auto;
}
iframe + p {
  text-align: center;
  margin: 1rem auto;
}

p {
  text-wrap: pretty;
}

button {
  display: inline-block;
  background: rgba(68, 152, 136, 0.2);
  color: white;
  font-family: "Exo 2";
  font-weight: 700;
  border: 0;
  padding: .2rem .5rem;
  box-shadow: inset 1px 1px 20px 0px #000000, 1px 1px 6px 0px #000000;
}
button:hover {
  background: rgba(62, 62, 62, 0.949);
  color: rgba(255, 255, 189, 0.81);
}


[rel="admin"] {
  border-left: 2px solid yellow;
  color: #ddd;
  background: #222;
  margin: .4rem;
  padding: .4rem;

}

::-moz-selection {
  background: rgb(132,200,132);
  color: white;
  text-shadow: none;
}

::selection {
  background: rgb(132,200,132);
  color: white;
  text-shadow: none;
}


.gv_panel_search {
/*  border-left: 3px solid dodgerblue;*/
  width: 90%;
  margin: 1rem auto;
  padding: 1rem;
  font-size: .9rem;
    background: #222;
    border-radius: 10px;
  > div {
    background: #222;
    margin: .5rem;
    border-radius: 10px;
    padding: .5rem; display: inline-block;
  }
  > div:first-of-type {
    border: 2px solid yellow;
  }
  > div:last-of-type {
    border: 2px solid springgreen;
  }
  > div button {
    margin: .5rem auto!important;

  }
}

select {
  option {
    color: red!important;
  }

}

.select2-results__options {
  color: dodgerblue!important;
}

  .select2-selection__rendered {
    color: #444!important;
    font-weight: 500;
  }

.gv_inspiration_main {
/*    overflow: hidden;*/
    width: 100%; 
    margin: .2rem auto;
    padding:0;
/*    border: 1px solid greenyellow;*/
    box-sizing: border-box;
    > * {
    box-sizing: border-box;
/*    background: red!important;*/

    }
    > .un_quote {
        width: 70%;
    }
}



h1, h2 {
  font-family: "Open Sans", sans-serif;
}
h1, h2, h3, h4, h5 {
  text-wrap: balance;
  box-sizing: border-box;
  max-width: 100%;

/*  max-width: 95%;*/
}


h1,
h2,
h3 {
  color: white;
  font-family: 'Exo 2', sans-serif;
  text-align: center;
  font-weight: 700!important;
}
h1 em,
h2 em,
h3 em {
  color: white;
}
h1 {
  font-size: 3rem;
  font-weight: 700;
}
h2 {
  font-size: 2.2rem;
  font-weight: 700;
}
h2 span {
  display: block;
  font-size: 80%;
  margin-top: 1.5rem;
}
h5 {
  color: white;
  font-family: 'Exo 2', sans-serif;
  font-weight: 700;
}

a {
  margin: 0;
  color: #ffffe9 !important;
  /*color: white;*/
  /*border-bottom: 2px dotted rgba(255, 255, 153, 0.259);*/
}
a:hover {
  color: rgba(255, 255, 213, 0.4);
  text-decoration: none;
  border-color: white;
}
[rel="in-this-document"] a {
    text-decoration: none;
}

nav a {
  text-decoration: none;
  border-bottom: none!important;
  display: inline-block;
}

/*topmenu*/

*http://www.cssplay.co.uk/menus/cssplay-responsive-multi-level-menu-jquery.html*/
.cssplay_menu {
  width: 100%;
  background: rgba(62, 62, 62, 0.949);
  text-align: center;
  height: 45px;
  position: relative;
  z-index: 100;
  left: 0;
}
.cssplay_menu img {
  transform: scaleX(1.2);
  width: : 1.9rem;
  height: 1.9rem;
  max-height: 1.9rem;
  border-radius: 50%;
}
.cssplay_toggle {
  display: none;
}
.cssplay_menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
  text-align: left;
}
.cssplay_menu ul {
  display: inline-block;
}
.cssplay_menu ul {
  *display: inline;
}
.cssplay_menu li {
  margin: 0;
  padding: 0;
  list-style: none;
}
.cssplay_menu li.close {
  display: none;
}
.cssplay_menu li {
  display: inline-block;
  display: inline;
}
.cssplay_menu li .header {
  color: rgba(3, 155, 229, 0.81);
  padding: .1rem 1.5rem;
  font-weight: 700;
  text-align: center;
}
.cssplay_menu ul ul {
  position: absolute;
  left: -9999px;
  border: 1px solid rgba(62, 62, 62, 0.949);
  border-top: 0;
}
.cssplay_menu > ul {
  margin: 0 auto;
}
.cssplay_menu > ul > li {
  float: left;
  display: block;
  position: relative;
}
.cssplay_menu ul ul li a {
  border-top: 1px solid rgba(62, 62, 62, 0.949);
}
.cssplay_menu > ul > li.has-sub > a {
  background-image: url(../img/down.png);
  background-repeat: no-repeat;
  background-position: right center;
}
.cssplay_menu ul ul > li.has-sub > a {
  background-image: url(../img/right.png);
  background-repeat: no-repeat;
  background-position: right center;
}
.cssplay_menu ul li.left ul > li.has-sub > a {
  background-image: url(../img/left.png);
  background-repeat: no-repeat;
  background-position: left center;
}
.cssplay_menu ul li b {
  display: block;
  width: 100%;
  height: 45px;
  background: transparent;
  position: relative;
  z-index: 10;
  -webkit-transition: 0s 0.5s;
  transition: 0s 0.5s;
}
.cssplay_menu ul ul li b {
  margin-top: -45px;
}
.cssplay_menu ul li b {
  *display: none;
}
.cssplay_menu ul {
  background: #444444;
}
.cssplay_menu a {
  display: block;
  font: normal 1rem "Open Sans", arial, sans-serif;
  font-weight: 700;
  color: white;
  line-height: 45px;
  text-decoration: none;
  padding: 0 40px 0 10px;
  transform: scaleX(0.7);
}
.cssplay_menu > ul > li > a {
  float: left;
  /*text-transform: uppercase;*/
}
.cssplay_menu ul li:hover > ul {
  visibility: visible;
  left: -1px;
  top: 45px;
  opacity: 1;
}
.cssplay_menu ul ul li:hover > ul {
  visibility: visible;
  left: 100%;
  top: auto;
  margin-top: -46px;
}
.cssplay_menu li.left:hover > ul {
  visibility: visible;
  left: auto;
  right: -1px;
  top: 45px;
}
.cssplay_menu li.left ul li:hover > ul {
  visibility: visible;
  left: auto;
  right: 100%;
  top: auto;
  margin-top: -46px;
}
.cssplay_menu ul li:hover > b {
  width: 0;
}
.cssplay_menu li.left ul a {
  text-align: right;
  padding: 0 10px 0 30px;
}
.cssplay_menu li:hover > a,
.cssplay_menu li.left ul li:hover > a {
  background-color: rgba(62, 62, 62, 0.949);
  text-decoration: underline;
}
/* this is the stylesheet when the menu is viewed on a device with a max width of 1024 pixels */
.cssplay_menu_mini {
  height: 100%;
  width: 300px;
  overflow: scroll;
  overflow-x: hidden;
  background: #115198;
  position: fixed;
  left: -300px;
  top: 0;
  z-index: 500010;
  -webkit-overflow-scrolling: touch;
}
.cssplay_menu_mini + .cssplay_toggle {
  display: block;
  width: 80px;
  height: 40px;
  background: #e36a19 url(cssplay-menu-jquery/menu-icon.gif) no-repeat left center;
  position: fixed;
  left: -30px;
  top: 115px;
  cursor: pointer;
  z-index: 500000;
  border-radius: 0 10px 10px 0;
  font: normal 16px/40px "Open Sans", arial, sans-serif;
  color: #fff;
  text-align: right;
  padding-right: 10px;
  -webkit-transition: 0.25s;
  transition: 0.25s;
}
.cssplay_menu_mini + .cssplay_toggle:hover {
  left: 0;
}
.cssplay_menu_mini ul {
  padding: 0;
  margin: 0 0 20px 0;
  list-style: none;
  background: #115198;
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-top: 0;
  text-align: left;
}
.cssplay_menu_mini ul ul {
  background: #1b5a9d;
  width: calc(70%);
  margin-left: 15px;
}
.cssplay_menu_mini ul ul ul {
  background: #2060a2;
  width: calc(70%);
}
.cssplay_menu_mini ul ul ul ul {
  background: #2565a8;
  width: calc(70%);
}
.cssplay_menu_mini ul li {
  position: relative;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}
.cssplay_menu_mini li.close {
  display: block;
  height: 40px;
  font: normal 18px/40px "Exo 2", arial, sans-serif;
  color: #aaa;
  text-align: left;
  padding-left: 50px;
  background: #e36a19 url(cssplay-menu-jquery/close.png) no-repeat 10px center;
  cursor: pointer;
}
.cssplay_overlay {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  display: none;
  cursor: pointer;
  z-index: 500005;
}
.cssplay_menu_mini ul li a {
  display: block;
  font: normal 1rem "Open Sans", sans-serif;
  color: white;
  text-decoration: none;
  /*text-indent: 10px;*/
  transform: scaleX(0.7);
}
.cssplay_menu_mini ul li a i {
  transform: scaleX(1.3);
}
.cssplay_menu_mini b {
  display: none;
}


[rel="breadcrumbs"] {
  background-color: rgba(62, 62, 62, 0.949);
  padding: .3rem;
  z-index: -100;
}
[rel="breadcrumbs"] a {
  border: 0;
  color: rgba(255, 255, 255, 0.835);
  font-family: "Exo 2";
  font-weight: 700;
  transform: scaleX(0.7);
  margin: 0 .3rem;
  text-decoration: none;
}
[rel="breadcrumbs"] a:hover {
  color: rgba(255, 255, 189, 0.81);
  border-bottom: 2px dotted rgba(255, 255, 255, 0.835);
}
[rel="breadcrumbs"] > span a {
  color: #bbb;
}


[rel="main"] {
  width: 90%;
  margin: 1rem auto;
}
[rel="main"] > div {
  margin: .2rem;
  padding: 1rem;
  background-color: rgba(102, 142, 153, 0.1);
  background: rgba(68, 68, 68, .5);
}


.gv_a_tag, [rel="tag"] {
  background-color: rgba(3, 155, 229, 0.81);
  color: white;
  box-shadow: inset 1px 1px 20px 0px rgba(0, 0, 0, 0.859), 1px 1px 6px 0px #333300;
  font-family: "Exo 2";
  font-weight: 700;
  padding: .2rem .5rem;
  margin: .2rem .5rem;
}
[rel="main"] p {
  font-family: 'IM Fell English', sans-serif;
  font-size: 1.2rem;
  line-height: 1.2;
  font-weight: 300;
}
[rel="main"] h4 {
  font-family: 'Exo 2', sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: white;
}
[rel="main"] .box_excerpt,
[rel="main"] .un_quote,
[rel="main"] .un_excerpt,
[rel="main"] article,
[rel="main"] .box_quote {
  margin: 3rem auto 2rem!important;
}
[rel="main"] blockquote {
  color: #eee;
  margin-left: 3rem;
  padding-left: 2rem;
  border-left: 2px solid #aaa;
}

[rel="nav"] > a {
  display: inline-block!important;
}


* {
    scroll-behavior: smooth;
}



#motto {
    width: 100%;
    background-color: rgba(102, 142, 153, 0.1);
    font-size: 1.2rem;
    font-family: 'Exo 2', sans-serif;
    font-weight: 400;
    div:first-of-type {
      padding: 1rem;
      width: 60%;
      color: rgba(3, 155, 229, 0.81);
      font-weight: 400;
    }
     button {
      width: 90%;
      margin: .2rem auto;
      background: rgba(68, 152, 136, 0.2);
      border: 0;
      padding: .2rem .5rem;
      box-shadow: inset 1px 1px 20px 0px #000000, 1px 1px 6px 0px #000000;
    }
     button:hover {
/*      background: rgba(62, 62, 62, 0.949);*/
      background: dodgerblue;
      color: rgba(255, 255, 189, 0.81);
    }
     div {
      text-align: center;
    }
     p {
      color: rgba(255, 255, 153, 0.259);
      font-weight: 400;
      width: 80%;
      /*background-color: red;*/
      font-size: 70%;
      margin: 0.2rem auto;
    }
     a {
      margin: 0;
      color: rgba(3, 155, 229, 0.81) !important;
      font-weight: 400;
      border-bottom: 2px dotted rgba(255, 255, 153, 0.259);
    }
     a:hover {
      color: rgba(255, 255, 213, 0.859);
      text-decoration: none;
      border-color: white;
    }
}




#rah {
    padding: 2rem;
    font: 400 italic 1.2rem 'Merriweather Sans', Calibri,sans-serif;
    line-height: 1.3;
    color: #aaa;
}

#bar {font-size: 1rem;
    line-height: 2.4rem;
}
#bar a{
    /*color: white;*/
    color: #777;
    display: inline-block;
    margin: .2rem;
    padding: .2rem;
    background-color: unset;
}




#inspiration {
  position: relative;
  margin: 0 auto;
  .ball-beat {
    text-align: center!important;
    margin: 3rem;
    color: red;
  }
}
#inspiration:has(quote) {
  border: 3px solid dodgerblue;
  border-radius: 2rem;
  padding: 1rem;
  margin: 2rem auto;
  width: 80%;

}
body > #inspiration:has(quote):before {
    top:10px;
    left:10px;
    margin-bottom: .4rem;
    content: "Gavagai inspiruje: ";
    opacity: .5;
  }

#inspiration quote {
  width: 95%!important;
  margin: .8rem auto;
  padding: 4rem 6rem;
  line-height: 1.4;
}
#inspiration quote.scaledown {
  font-size: 1.2rem;
}
#inspiration quote.scaledown attribution {
  font-size: .9rem!important;
}



.corner {
  float: right;
  /*position: absolute;*/
  display: inline-block;
  padding: .2rem 1rem;
  /*background: rgba(119, 119, 119, .31);*/
  color: #666;
  /*border: 2px dashed rgba(255, 153, 0, .1);*/
  font-family: "Exo 2";
  font-size: 1rem;
  /*content: "Admin: ";*/
}

.box_excerpt {
  display: block;
  width: 80%;
  margin: 2rem auto;
  padding: 4rem;
  background-color: rgba(221, 221, 221, 0.8) !important;
  color: #444;
}
.box_excerpt p {
  font-family: 'IM Fell English', serif;
  font-size: 1.3rem;
  color: #444;
}
.box_excerpt p em {
  color: rgba(62, 62, 62, 0.949);
}
.box_excerpt p a {
  color: rgba(62, 62, 62, 0.949);
}
.box_excerpt nav {
  background-color: rgba(68, 68, 68, 0.2);
}
.box_excerpt nav a {
  color: rgba(68, 68, 68, 0.8);
}
.box_excerpt h5 {
  color: rgba(62, 62, 62, 0.949);
}
.box_excerpt h2 {
  color: rgba(62, 62, 62, 0.949);
}
.box_excerpt h2 em {
  color: rgba(62, 62, 62, 0.949);
}
.box_excerpt h2 h2 span {
  display: block;
  margin: 1rem;
  font-size: 90%;
}
.box_excerpt h3 {
  color: rgba(62, 62, 62, 0.949);
  font-family: "Exo 2";
}


.un_object {
  display: block;
  width: 80%;
  margin: 2rem auto;
  padding: 1rem;
  background: rgba(68, 152, 136, 0.2);
}
.un_object > img {
  max-width: 16rem;
  width: 16rem;
}
.un_object .un_wide12 img {
  max-width: 10rem;
  width: 10rem;
}
.un_object > div {
  padding: .8rem;
}
.un_object h3 a {
  color: white;
  font-weight: 700;
}
.un_object span a {
  color: white;
  font-weight: 700;
  margin: .2rem;
  display: inline-block;
}

nav.un_object {
  flex-direction: row!important;
  a {
    background: #444;
    margin: .5rem;
    display: inline!important;
    padding: .5rem;
  }

}

.un_plate {
  text-align: center;
  display: block;
  width: 90%;
  margin: 1rem auto;
  padding: 1rem;
  background: rgba(168, 168, 168, 0.2);
}
.un_plate {
  display: block;
  width: 90%;
  margin: 1rem auto;
/*  background: rgba(62, 62, 62, 0.949);*/
}

.gv_box_topic {
  align-content: normal;
  > div, .un_entry {
      margin: .3rem auto!important;
      max-width: 100%;
      width: 95%;
  }
}


.un_plate.topic {
  text-align: center;
}
.un_plate.topic h2 {
  margin: .2rem auto;
}
.un_plate.topic h3 {
  margin: .2rem auto;
}
.un_plate.topic h4 {
  font-family: "Exo 2";
  transform: scaleX(0.85);
  font-weight: 300;
  margin: .5rem auto .2rem;
  line-height: 1.1;
}
.un_plate.topic quote {
  padding: .2rem .6rem;
  font-size: 1rem!important;
}
.un_plate.topic quote,
.un_plate.topic quote *:not('p') {
  color: #999;
}
.un_plate.topic a:hover {
  /*color: @gvemphase!important;*/
}
.un_plate.topic a svg {
  max-width: 1rem;
  width: 1rem;
  height: 1rem;
}
.un_plate.topic p > a {
  display: inline-block !important;
}
.un_plate.topic attribution,
.un_plate.topic attribution a {
  font-size: 80%;

    text-decoration: none!important;
  color: rgba(255, 255, 189, 0.81);
}

.button-main,
.un_plate.topic > a {
  display: inline-block;
  padding: .4rem .8rem;
  margin: 1rem auto;
  background: #3566b1e3!important;
  color: white!important;
  font-family: "Exo 2";
  font-weight: 700;
  box-shadow: inset 1px 1px 20px 0px rgba(0, 0, 0, 0.41), 1px 1px 10px 0px rgba(0, 0, 0, 0.4);
  border-bottom: none!important;
  transition: all 1s ease;
}



.gv_panellinks {
  background: #444;
}

/* ################################# */
/* POPOVER */
/* ################################# */


[popovertarget] {
  border: 2px solid #666;
  background: #444;
  color: #eee!important;
  font-size: 0.9rem!important;
  font-weight: 600;
}

.mb_popbox {
  width: 70%;
  margin: 2rem auto;
  min-height: 20rem;
  max-height: 80%;
  padding: 3rem;  
  background: #444;
  border: 3px solid #eee;
  border-radius: 5px;
  color: white;
  box-sizing: border-box;
  box-shadow: 10px 10px 5px 40rem rgba(0,0,0,0.55);
  h3, .h3 {
    text-wrap: balance;
    padding: 1rem;
    font-size: 2.3rem!important;
    text-align: center;
    color: white;
/*    background: #888!important;*/
    background-color: #111;
    color: transparent;
    text-shadow: 2px 2px 3px dodgerblue;
    /* -webkit-background-clip: text; */
    -moz-background-clip: text;
    background-clip: text;


  }  
  h4 {
    text-align: center;
    font-weight: 700;
    margin-bottom: 1rem;
  }

}

.mb_popbox::backdrop {
    backdrop-filter: blur(5px);

}

.mb_popbox.links {
  p {
    width: 70%;
    margin: 1rem auto;
  }
   a {
    padding: 1rem;
    color: #666;
    font-size: 1.5rem;
    display: inline-block;
  }
  div:not(.no_bullets) a + a:before {
    content: "•";
    margin-right:.5rem;
  }
  .outstander_item {
    margin: .4rem;
  }
  ul.no_bullets {
    text-align: justify;
    list-style: none;
  }
  ul li a {
      font-family: "Open Sans";
  font-weight: 700!important;
/*  color: red!important;*/
  }

}
.mb_popbox.hint {


  p {
    font-size: 1.3rem;
  }
   a {
    padding: .3rem;
    color: #666;

    font-weight: 500;
    text-decoration: underline;
  }
  ul {
    display: block;
    border: 2px solid #333;
    border-radius: 10px;
    background: #444;
    padding: .5rem;
    width: 80%;
    margin: .2rem auto;
    li {
      margin-bottom: .3rem;
      text-align: justify;
      font-size: 1.2rem;
      a {
        color: dodgerblue;

      }
      a:hover {
        color: #1780e6;
        text-decoration-color: #666;
      }
    }

  }
}


/* filter element not supposed to catch mouse events */
body:has(:popover-open) :is(button, a) {
  pointer-events: none;
}

/* then allow click from #mypopover */
.mb_popbox :is(button, a) {
  pointer-events: auto!important;
}

/* ################################# */
/*quote*/
/* ################################# */


.box_quote,
quote.opening,
.un_quote,
quote,
.un_excerpt {
  display: block;
  width: 80%;
  margin: 2rem auto;
  padding: 2rem;
  background: rgba(62, 62, 62, 0.949);
  color: white;
  font-size: 2rem;
  font-family: 'IM Fell English', serif;
}
.box_quote p,
quote.opening p,
.un_quote p,
quote p,
.un_excerpt p {
  font-family: 'IM Fell English', serif;
  color: #ddd!important;
  font-size: 1.3rem;
}
.box_quote a,
quote.opening a,
.un_quote a,
quote a,
.un_excerpt a {
  color: #ffffff;
  border-bottom: 2px solid rgba(125, 155, 153, 0.259);
  word-break: break-all;
}
.box_quote a:hover,
quote.opening a:hover,
.un_quote a:hover,
quote a:hover,
.un_excerpt a:hover {
  color: rgba(185, 205, 219, 0.81);
  text-decoration: none;
  border-bottom: 2px dotted rgba(255, 255, 255, 0.5);
}
circumstances {
  font-size: .7rem!important;
  color: #aaa;
  font-family: "Exo 2";
  font-weight: 700;
}
circumstances p {
  font-size: .7rem!important;
  color: #aaa;
  font-family: "Exo 2";
}
circumstances a {
  font-size: .7rem;
  color: #aaa;
}
circumstances a + a {
  margin-left: .4rem;
}
quote {
  font-size: 1.3rem;
  box-sizing: border-box;
}
.msg_dimmed + p, [rel="notes"] a, [rel="notes"] p a, circumstances p {
  word-break: break-all;
}


.nonpl,
[lang="en"],
[lang="cn"],
[lang="en"] p {
  color: #999!important;
  font-size: 95%!important;
}

[lang="pl"] + [lang="en"] {
/*  color: red!important;*/
  scale: .8;
  color: #aaa;
  text-align: left;
}

.csch_dark_11 .un_quote {
  margin-bottom: 0!important;
}
quote .meta {
  font-size: 70%;
  color: rgba(221, 221, 221, 0.7);
  font-family: "Open Sans";
  text-align: right;
}
quote [rel="tags"] {
  border-radius: 5px;
  padding: .4rem;
  margin: .5rem auto;
}
quote.opening {
  padding: 4rem 6rem;
}
quote.small {
  padding: 2rem 3rem;
  font-size: 80%;
}
quote.intro {
  padding: 2rem 3rem;
  font-size: 1.2rem;
  line-height: 1.2;
  font-weight: 900;
}
.source,
attribution {
  display: block;
  text-align: right;
  margin-right: 2rem;
  font-size: 80%;
}
.source a + a,
attribution a + a {
  margin-left: .4rem;
}

.gv_comments {

  > div {
    background: #333;
    display: block;
    padding: 1rem;
  }
}



[rel="tags"] {
  box-sizing: border-box;
  padding: 1rem 2rem 1.2rem;
  margin: 0 auto 1rem;
  background-color: rgba(68, 152, 136, 0.2);
  width: 80%;
  text-align: left;
  border-radius: 0 0 6px 6px;
  .msg_dimmed {
    opacity: .5;
  }
}


.un_entry {
  width: 100%;
  margin: 1rem auto;
  background: rgba(170, 170, 170, 0.1);
  font: normal 400 1.1rem/140% 'Open Sans', sans-serif;
  justify-content: center;
  text-indent: 1.5rem;
}



.un_entry a {
  color: rgba(255, 255, 189, 0.81);
}


.un_entry a + a {
  margin-left: 1rem;
}
.un_entry a:nth-of-type(odd) {
  color: white;
}
.un_entry a:nth-of-type(even) {
  color: rgba(255, 255, 189, 0.81);
}


.un_entry{
    display: block;
}
.un_entry a {
    display: block;
    font-size: 120%;
}




/*  BUTTONS */




.btn {
  margin: 1rem auto;
  background: dodgerblue !important;
  color: #ddd;
  font: normal 1.3rem "Exo 2", sans-serif;
  border: none;
  border-radius: 5px;
  display: inline-block;
  text-indent: 0;
  padding: .4rem 1rem;
  text-transform: uppercase;
  -webkit-tap-highlight-color: transparent;

    box-shadow: inset 1px 1px 20px 0px rgba(0, 0, 0, 0.859), 
          1px 1px 6px 0px #333300;
/*     box-shadow:  3px 3px 2px #777,*/
             -3px -3px 2px #444;  
}
.btn:hover {
  background: #2e84d8 !important;
  color: #555;
}


.btn_hover {
  width: 10rem!important;
  padding: .2rem .4rem!important;
  .normal {
    display: block;
  }
  .hover {
    display: none;
  }
}
.btn_hover:hover {
  padding: .2rem .4rem!important;
  .normal {
    display: none;
  }
  .hover {
    display: block;
  }
}
.outstander_item {
/*  float: left;*/
    font-size: 1rem;
    font-weight: 400; 
    letter-spacing: 0.08rem; 
    padding: .3rem .6rem;
    background: #555;
    color: white;
    background: linear-gradient(145deg, #aaa, #cacaca);
    box-shadow: inset 1px 1px 20px 0px rgba(0, 0, 0, 0.859), 
          1px 1px 6px 0px #333300;
/*    box-shadow:  3px 3px 2px #777,*/
             -3px -3px 2px #444;

}

    .outstander_item:hover {
/*      background: red!important;*/
    }

h1 .outstander_item {
  padding: 1rem 3rem!important;
  display: inline-block;
}

a.outstander_item {
  text-decoration: none;
}
a.outstander_item:hover {
    color: #ffd!important;
    text-decoration: none;
} 

.outstander_item.large {
    font-weight: 800; 
    font-size: 2rem;
    padding: .6rem 1.2rem;
    border-radius: 3px;

}
.outstander_item.medium {
    font-weight: 800; 
/*    border-radius: 24px;*/
    font-size: 2rem;
    padding: .6rem 1rem;
/*    border-radius: 16px;*/

}
.outstander_item.small {
    margin: .2rem;
    border-radius: 8px;
    font-weight: 300; 
    font-size: .7rem;
    padding: .2rem .5rem;
    box-shadow:  2px 2px 5px #444,
                -2px -2px 5px #777;
    a {
      color: white;
    }

}

.outstander_value_0 {
  background: indianred!important;
}
.outstander_value_1 {
  background: dodgerblue!important;
    transition: background 0.9s ease-in-out ;
}
.outstander_value_1:hover {
  background:  rgb(20, 114, 225)!important;


}

.outstander_value_ {
/*  animation: colorTransition 1s;*/
/*  background: var(--color-start);*/
  transition: background 0.9s ease-in-out ;
}

.outstander_value_:hover {
  background: #666;
}
/*    @keyframes colorTransition {
        0% {
            background: #ccc;
        }

        100% {
            background: gray;
        }
    }*/

.outstander_value_success {
  background: seagreen;!important;
}

.outstander_value_secondary {
  background: gray;!important;
}




.gv_bookgallery {
    width: 80%;
    margin: 2rem auto;
    text-align: center!important;
    text-indent: 0;
    padding-top: 1rem;
    h3 {
      margin: .2rem auto;
      font-size: .8rem;
      font-weight: 600;
      text-align: center;
      text-indent: 0;
    }
    h3 a {
      text-align: center;
      margin: .1rem auto .3rem;
      text-decoration: none!important;
      border: 0;
    }    
    > div {
      min-width: 7rem;  
      max-width: 9rem;  
      background-color: rgba(62, 62, 62, 0.949);
      margin: .2rem;
      padding: .1rem;
      box-sizing: border-box;
      border: 1px solid rgba(62, 62, 62, 0.949);
    }    
    a {
      box-sizing: border-box;
      margin: 0!important;

    }
    div:has(a):hover {
      border-bottom: 1px solid limegreen;
    }
    img {
      padding-top: 1rem;
      max-width: 100%;
      width: 7.2rem;
      height: 11rem;
      max-height: 11rem;
    }
}

.un_dialog div[data-load] {
/*  background: red;*/
}

footer {

  box-sizing: border-box;
  width: 100%;
  background: rgba(102, 136, 170, 0.2);

  p {
  box-sizing: border-box;
  margin: .2rem;
  }
}
footer .container {
  width: 80%;
  margin: .3rem auto;
}
footer h5 {
  font-size: 2.6rem;
}
footer h6 {
  font-size: 1.3rem;
  color: white;
  font-weight: 700;
  font-family: "Exo 2";
  font-stretch: 130%;
}
footer .motto {
  font-size: 1.4rem;
  color: white;
     font-family: "Sigmar One"!important;
/*  font-family: 'IM Fell English';*/
  font-stretch: 130%;
}
footer .motto + p {
  font-family: 'IM Fell English';
}
footer .m2 {
  margin: 2rem;
}
footer ul {
  padding-left: 0;
}
footer ul a {
  margin: 0;
  padding: 0;
}
footer li {
  list-style-type: none;
  text-indent: 0;
  text-align: left;
}
footer li a {
  border: none;
}
footer .footer-copyright {
  /*margin: .3rem auto;*/
  /*padding: .3rem;*/
  width: 95%;
  margin: 0 auto;
  text-align: center;
  font-weight: 400;
}
footer .footer-copyright p {

  box-sizing: border-box;
  padding: .4rem;
}
footer a {
  margin: .3rem 2rem;
  color: white;
/*  border-bottom: 2px dotted rgba(255, 255, 153, 0.859);*/
}
footer p > a {
  font-weight: 700;
  font-family: "Exo 2";
  margin: 0;
  margin-left: 2rem;
}
footer a:hover {
  color: rgba(255, 255, 153, 0.859);
  text-decoration: none;
}


.gv_title {
    width: max-content !important;
    margin-bottom: .5rem;
    font-family: "Open Sans";
    font-weight: 800;
    font-size: 5rem;
    letter-spacing: 3px;
    background-color: #222;
    color: transparent;
    text-shadow: 2px 2px 3px dodgerblue;
    /* -webkit-background-clip: text; */
    -moz-background-clip: text;
    background-clip: text;
}



input[type="text"] {
  background-color: transparent;
  border: none;
  background-color: #aaa;
  border-bottom: 1px solid #9e9e9e;
  color: #444444;
  border-radius: 0;
  outline: none;
  height: 3rem;
  width: 100%;
  font-size: 16px;
  margin: 0 0 8px 0;
  padding: .4rem;
  box-shadow: none;
  box-sizing: border-box;
}


.gv_box_ads_main {
  width: 7rem;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0!important;
  h3 {
    max-width: 100%;
    width: 95%;
    margin: 0 auto;
  }
}


.gv_box_newest {
    width: 100%;
    margin: .2rem auto;
    border: 2px solid rgb(132,200,132) ;
    border-radius: 5px;
    padding: .4rem;
    background: #444;
    color: #eee;

    box-sizing: border-box;
    a {
        text-decoration: none;
    }
    a:hover:not(:has(img)) {

        border-bottom: 2px dotted rgb(132,200,132) ;
    }

}



.gv_box_newest {
  width: 90%;
  max-width: 90%;
  h4 {
    margin: 0;
  }
  h4 + a {
    margin-top: 1rem;
  }
}


.gv_box_topic {
    .un_entry {
        max-width: 20rem;
        background: #666;
        padding: .4rem;
        a {
/*            color: red;*/
            font: normal 600 1.1rem/140% 'Exo 2', sans-serif;
        }
    }
}


#siblingtopics {
  .un_plate {
    max-width: 45%;


  }
}




@font-face {
  font-family: 'gavagai';
  src: url('../fonts/gavagai/gavagai.eot');
  src: url('../fonts/gavagai/gavagai.eot?#iefix') format('embedded-opentype'), url('../fonts/gavagai/gavagai.woff') format('woff'), url('../fonts/gavagai/gavagai.ttf') format('truetype'), url('../fonts/gavagai/gavagai.svg#gavagai') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="i-"],
[class*=" i-"] {
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: ;
  /* p: removed 1 */
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
[class^="i-"]:before {
  /* HACK!! font of text is not changed any more */
  font-family: 'gavagai';
  padding-right: 0.3em;
}
[class^="i-"]:before {
  font-family: 'gavagai';
}
[class*="i-"]:before {
  font-family: 'gavagai';
}
.i-diver:before {
  content: "\e900";
}
.i-books:before {
  content: "\e920";
}
.i-library:before {
  content: "\e921";
}
.i-search:before {
  content: "\e986";
}
.i-uniF7E4:before {
  content: "\e639";
}
.i-uniF7E5:before {
  content: "\e63a";
}
.i-uniF5CF:before {
  content: "\e63b";
}
.i-uniF5D0:before {
  content: "\e63c";
}
.i-uniF4F5:before {
  content: "\e63d";
}
.i-uniF54D:before {
  content: "\e63e";
}
.i-uniF488:before {
  content: "\e642";
}
.i-uniF489:before {
  content: "\e643";
}
.i-uniF48A:before {
  content: "\e644";
}
.i-uniF48B:before {
  content: "\e645";
}
.i-dna:before {
  content: "\e646";
}
.i-remotemysql:before {
  content: "\e649";
}
.i-quote:before {
  content: "\e64a";
}
.i-twocolumnleft2:before {
  content: "\e64b";
}
.i-sortbysizeascending:before {
  content: "\e64c";
}
.i-sortbysizedescending:before {
  content: "\e64d";
}
.i-roadsign:before {
  content: "\e64e";
}
.i-merge:before {
  content: "\e653";
}
.i-split:before {
  content: "\e654";
}
.i-share:before {
  content: "\e655";
}
.i-key-stroke:before {
  content: "\e656";
}
.i-book-alt2:before {
  content: "\e657";
}
.i-fork:before {
  content: "\e658";
}
.i-cloud-upload:before {
  content: "\e659";
}
.i-cloud-download:before {
  content: "\e65a";
}
.i-bullhorn:before {
  content: "\e65c";
}
.i-book:before {
  content: "\e65d";
}
.i-profile2:before {
  content: "\e65e";
}
.i-barcode2:before {
  content: "\e65f";
}
.i-qrcode2:before {
  content: "\e660";
}
.i-cart:before {
  content: "\e661";
}
.i-cart2:before {
  content: "\e662";
}
.i-address-book:before {
  content: "\e663";
}
.i-cabinet2:before {
  content: "\e664";
}
.i-redo:before {
  content: "\e668";
}
.i-undo:before {
  content: "\e669";
}
.i-user2:before {
  content: "\e66a";
}
.i-users2:before {
  content: "\e66b";
}
.i-user3:before {
  content: "\e66c";
}
.i-users3:before {
  content: "\e66d";
}
.i-fire2:before {
  content: "\e66f";
}
.i-target:before {
  content: "\e670";
}
.i-cloud-download2:before {
  content: "\e671";
}
.i-cloud-upload2:before {
  content: "\e672";
}
.i-link3:before {
  content: "\e673";
}
.i-heart-broken:before {
  content: "\e677";
}
.i-question:before {
  content: "\e67a";
}
.i-share2:before {
  content: "\e67c";
}
.i-stackoverflow:before {
  content: "\e681";
}
.i-loop:before {
  content: "\e60d";
}
.i-wand:before {
  content: "\e60e";
}
.i-hammer:before {
  content: "\e615";
}
.i-quill:before {
  content: "\e610";
}
.i-uniF5D7:before {
  content: "\e60f";
}
.i-selectionadd:before {
  content: "\e616";
}
.i-selectionrmove:before {
  content: "\e624";
}
.i-selectionintersect:before {
  content: "\e625";
}
.i-notification:before {
  content: "\e626";
}
.i-confused:before {
  content: "\e627";
}
.i-info:before {
  content: "\e678";
}
.i-settings4:before {
  content: "\e628";
}
.i-mail:before {
  content: "\e67d";
}
.i-home:before {
  content: "\e602";
}
.i-checkmark:before {
  content: "\e608";
}
.i-cancel:before {
  content: "\e609";
}
.i-book2:before {
  content: "\e60c";
}
.i-book3:before {
  content: "\e611";
}
.i-compass:before {
  content: "\e613";
}
.i-mute:before {
  content: "\e612";
}
.i-bomb:before {
  content: "\e61a";
}
.i-injection:before {
  content: "\e61f";
}
.i-grid2:before {
  content: "\e620";
}
.i-tools:before {
  content: "\e621";
}
.i-justice:before {
  content: "\e622";
}
.i-profile:before {
  content: "\e623";
}
.i-shipping:before {
  content: "\e62b";
}
.i-heart:before {
  content: "\e62c";
}
.i-heart2:before {
  content: "\e62d";
}
.i-cog2:before {
  content: "\e60b";
}
.i-file:before {
  content: "\e60a";
}
.i-download:before {
  content: "\e600";
}
.i-chat:before {
  content: "\e601";
}
.i-contract:before {
  content: "\e603";
}
.i-mobile:before {
  content: "\e604";
}
.i-cog:before {
  content: "\e606";
}
.i-article:before {
  content: "\e607";
}
.i-user-add:before {
  content: "\e682";
}
.i-vcard:before {
  content: "\e683";
}
.i-link4:before {
  content: "\e684";
}
.i-logout:before {
  content: "\e685";
}
.i-login:before {
  content: "\e686";
}
.i-arrow:before {
  content: "\e687";
}
.i-add-to-list:before {
  content: "\e688";
}
.i-resize-enlarge:before {
  content: "\e689";
}
.i-lab:before {
  content: "\e629";
}
.i-settings:before {
  content: "\e605";
}



@media screen and (max-width: 55.5em) {


.cssplay_menu {
  display: none;
}
[rel="breadcrumbs"] {

    z-index: 100;
}

section {
    > article {
      width: 100%!important;
      box-sizing: border-box;
      padding: .5rem!important;
    }

}

article {

    form {
      max-width: 100%;
    }
    > form {
    max-width: 100%!important;
      input {
          width: 90%;
          max-width: 100%!important;
      }
    }    
}

.un_plate {
  flex-direction: column;
}

body > quote {
  width:95%;
  margin: .2rem auto;
  padding:.4rem;
  .un_flex_even {
    flex-direction: column!important;
    width: 100%;
    > div {
      width: 100%;
      margin: .2rem;
      padding: .2rem;
    }
  }
}


    .un_flex:has(> .un_flex_vs), .un_flex:has(> .un_flex_vt), .gv_panellinks {
        background: #222!important;
        .csch_subtle_3 {
          width: 90%;
          margin: .2rem auto;
        }
        > .un_flex_vs, > .un_flex_vt {
          /*          background: red;*/
          width: 100%;
          > * {
            width: 100%!important;
          /*            background: yellow;*/
            display: block;
          }
          a {
            width: 90%!important;
            font-size: 1.4rem;
            text-align: center;
            margin: .2rem auto!important;
            background: dodgerblue!important;
            margin: .5rem auto!important;
            padding: .4rem .8rem;
          }  
        }
    }

#contentguide {
  box-sizing: border-box;
  min-width: 100%;
  width: 100%!important;
  margin: .2rem auto;
  padding: .8rem;
  > * {
    width: 100%;
    margin: .2rem auto;
  }
  h2 {
    font-size: 1.4rem;
  }
  [role="header"] {
    flex-direction: column;
  }
  .un_plate {
    box-sizing: border-box;
  }
}


.un_nav {
  flex-direction: column;
}

.un_plate  {
  > div {
    margin: .4rem auto;
  }
}



quote {
  circumstances {
    padding: .5rem;
    width: 80%;
    font-size:.9rem;
  }
  > nav {
    color: #aaa;
    font-size: 1rem;
  }
}

quote.large {
  padding: 1rem;
    /*  background: red;*/
    p {
      margin: .5rem auto;
      padding: 1rem;
      font-size: 1.2rem!important;
/*      color: red;*/

    }
}


#motto {
  box-sizing: border-box;
  flex-direction: column;
  > div:first-of-type {
  box-sizing: border-box;
    width: 98%;
    margin: 0 auto;
    padding: .2rem;
    font-size: 80%;
    text-align: center;
  }
  > .un_wide8 {
    box-sizing: border-box;
    flex-direction: row;
    width: 100%!important;
    max-width: 100%!important;
    width: 8rem;
    background: red;
    overflow: hidden;
    button {
      display: inline-block;
      width: 30%;
    }
  }
}

  #inspiration {
    position: relative;
    width: 95% !important;
    margin: .2rem auto;
    padding: 0;
    box-sizing: border-box;
    border-radius: 0 1rem 1rem 1rem!important;
    ::before {
/*      color: dodgerblue!important;*/
    }
    > quote {
      box-sizing: border-box;
      width: 95%;
      font-size: 1.5rem;
      margin: .8rem auto;
      padding: .8rem!important;
      line-height: 1.2;
    }
  }

  #inspiration 
  quote {
    margin: .3rem auto;
    padding: .2rem;
    width: 95%;
  }
  body > #inspiration:has(quote):before {
      content: "Gavagai inspiruje: ";
      opacity: .5;
      position: absolute;
      top: 5px;
      left: 10px;
      margin-bottom: .4rem;
/*      color: dodgerblue;*/
  }



  nav.un_flex_hs {
    flex-direction: column;
  }

  nav > a {
    margin: .1rem .2rem;
    display: inline-block!important;
/*    color: red!important;*/
  }


    .gv_title {
      font-size: 2rem;
    }

    .container .un_flex_hs {
      flex-direction: column;
    }

  .box_excerpt {
    width: 95%;
    margin: .5rem auto;
    padding: .2rem 1rem;
    box-sizing: border-box;
  }
  .box_excerpt p {
    text-align: justify;
    font-size: 1rem;
  }

    .mb_popbox.links {
      height: 95%;
      max-height: 95%;
      min-height: 95%;
      width: 95%;
      h3 {
        padding: .5rem;
        font-size: 1.2rem!important;
      }
      .outstander_item, li > a, .nav_tiles a {
        text-align: center;
        font-size: 1rem;
        display: block;
        margin-top: 2rem;
        padding: .2rem 1rem;
        box-shadow: inset 1px 1px 20px 0px rgba(0, 0, 0, 0.859), 1px 1px 6px 0px #333300;

      }
    }

    .mb_popbox.hint {
      height: 90%;
      max-height: 90%;
      min-height: 90%;
      width: 90%;
      padding: .5rem;
      h3 {
        font-size: 1.5rem!important;
        font-weight: 300;
        padding: .1rem;
      }
      p {
        font-size: 1.1rem;
      }
      ul {
        border: 2px solid #aaa;
        border-radius: 5px;
/*        background: #fdfdfd;*/
        padding: 1rem;
        padding-left: 2rem;
        width: 95%;
      }
    }


#siblingtopics {
    flex-direction: column;
    align-content: center!important;
  > div {
    margin: .2rem auto!important;
    width: 100%;
    min-width: 100%;
  }
  h4 {
    color: #ccc;
  }
  quote {
    width: 95%;
    attribution a {
      display: inline-block;
    }
  }
}
.un_container {
  quote {
      margin: 1rem auto 0!important;
      padding: 1rem;
      width: 95%;
      font-size: 1rem;
  }
  quote + nav {
      margin: 0 auto 2rem;
      padding: 1rem;
      width: 95%;
      font-size: .8rem;
      opacity: .5;
  }
  quote + nav:hover {
      opacity: 1;
  }  
}

.gv_panel_search {
  box-sizing: border-box;
  flex-direction: column;
  > div {
  box-sizing: border-box;
  width: 95%;    
  max-width: 95%;    
  }
   div, .select2  {
    max-width: 100%!important;
    width: 98%!important;
  }

}

.gv_inspiration_main {
  flex-direction: column;
  .gv_box_ads_main {
    width: 100%;
  }
}


}