@charset "UTF-8";
/*
 * palette da 4 colori che pare abbiano un che di maya:
 * Crimson sky (#CF6766),Indigo (#30415D), Ultramarine (#031424) e Light Blue (#8EAEBD);
 * oppureuna palette forse veramente troppo colorata e accesa:
 * Papaya (#E24E42),  Mustard(#E9B000), Blush (#EB6E80) e Aqua (#008F95).
 * */
/*
$c-primary: $c-papaya;
$c-secondary: $c-mustard;
$c-tertiary: $c-blush;
$c-quaternary: $c-aqua;

$c-text: $c-secondary;
$c-bg: #006165; // $c-quaternary;
$c-bg-menu: adjust-color($c-bg, $lightness: -10%); //rgb(34, 34, 34);
$c-titles: $c-primary;
$c-smalltitles: adjust-color($c-titles, $saturation: -15%, $lightness: -15%);
$c-links: $c-titles;
*/
body {
  background-color: #1c1c1a;
  font-size: 20px;
  color: #EBF4F8;
  font-family: "Metropolis", Helvetica, cursive, sans-serif;
  line-height: 1.5em;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  justify-content: space-between;
  row-gap: 7rem; }

a, a:focus, a:hover, a:visited {
  color: #fa8699; }

#header-row a, #header-row a:focus, #header-row a:active {
  color: #fa8699; }

h1, h2, h3 {
  color: #fa8699; }

h4, h5, h6 {
  color: #fa8699; }

#all-wrapper {
  padding-right: 8vw;
  padding-left: 2vw;
  width: 90%;
  max-width: 50em;
  margin: 0 auto;
  margin-top: 3rem; }
  #all-wrapper h1, #all-wrapper h2, #all-wrapper h3 {
    color: #fa8699; }
  #all-wrapper h4, #all-wrapper h5, #all-wrapper h6 {
    color: #fa8699; }
  #all-wrapper h1, #all-wrapper h2, #all-wrapper h3 {
    font-family: "Metropolis", "Metropolis", Helvetica, cursive, sans-serif;
    font-weight: bolder; }
  #all-wrapper strong {
    font-weight: bold; }

#logo-div {
  position: fixed;
  top: 5vw;
  left: -6.5vw;
  border-radius: 50%;
  box-shadow: 0px 0 1.3vw black;
  line-height: 0;
  background-color: transparent; }

img {
  max-width: 100%; }

#logo-img {
  width: 13vw;
  /* alloca una dimensione approssimativa prima del rendering
     * non sappiamo la dimensione esatta, ma con min-height possiamo indicargli che è circa-quadrata
     * */
  min-height: 12vw;
  /* questo filtro assurdo viene da https://codepen.io/sosuke/pen/Pjoqqp
     si tratta di un modo per "convertire" il nero in un altro colore qualsiasi
     */ }

#header-row {
  text-align: center;
  margin-bottom: 1vw; }
  #header-row h1 {
    margin: 0; }
  #header-row a {
    text-decoration: none;
    font-weight: normal; }
    @media screen and (min-width: 960px) {
      #header-row a {
        font-size: 6rem; } }
    @media screen and (min-width: 600px) and (max-width: 959px) {
      #header-row a {
        font-size: 4.5rem; } }
    @media screen and (max-width: 599px) {
      #header-row a {
        font-size: 3rem; } }
    #header-row a:hover {
      text-decoration: underline; }

.page-slug--index #content .entry-title {
  display: none; }

.translations-available {
  text-align: right; }

code {
  background-color: #333;
  border: 1px solid #888;
  border-radius: 0.4em; }

#menu-row {
  display: none;
  position: fixed;
  z-index: 20;
  top: 3em;
  left: 8vw;
  background: black;
  width: 89vw;
  margin-top: 8vw;
  border-radius: 1em;
  padding: 1em 0px;
  font-size: 120%; }
  #menu-row ul {
    list-style: none; }
  #menu-row > div {
    max-width: 15em;
    text-align: center;
    margin: auto; }
  #menu-row button {
    border: none;
    color: #FF5AB7; }

#overlay {
  display: block;
  position: fixed;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.5);
  overflow-x: hidden;
  transition: 0.3s;
  width: 100%;
  height: 0;
  z-index: 3; }

#menu-noscript-row {
  padding-right: 8vw;
  padding-left: 2vw;
  width: 90%;
  max-width: 50em;
  margin: 0 auto;
  align-self: flex-end; }
  #menu-noscript-row nav {
    font-size: 80%;
    font-weight: bold;
    font-family: "Metropolis", "Metropolis", Helvetica, cursive, sans-serif;
    text-align: center; }
    #menu-noscript-row nav ul {
      display: flex;
      justify-content: space-evenly;
      align-items: center;
      column-gap: 1.5em;
      list-style: none; }
      @media screen and (max-width: 959px) {
        #menu-noscript-row nav ul {
          flex-wrap: wrap; } }
    #menu-noscript-row nav li {
      flex: 1;
      white-space: nowrap; }
      @media screen and (max-width: 959px) {
        #menu-noscript-row nav li {
          flex-basis: 100%; } }
      #menu-noscript-row nav li a:visited, #menu-noscript-row nav li a:hover, #menu-noscript-row nav li a:active, #menu-noscript-row nav li a {
        text-decoration: none; }

m
form {
  margin-top: var(--gap); }

form input,
form textarea {
  padding: 4px 10px;
  width: 100%;
  color: var(--primary);
  font-weight: bold;
  border: 2px solid var(--tertiary);
  border-radius: var(--radius);
  margin-bottom: var(--gap);
  transition: border-color 0.8s; }

form input:focus,
form textarea:focus {
  border-color: var(--primary); }

form textarea {
  display: block; }

.grid {
  display: grid;
  grid-template-columns: auto auto;
  grid-gap: var(--gap); }

@media all and (max-width: 415px) {
  .grid {
    grid-template-columns: auto;
    grid-gap: unset; } }

form input[type="submit"] {
  color: var(--theme) !important;
  line-height: 36px;
  background: var(--primary);
  border-radius: calc(36px/2);
  padding: 0 16px; }

.news > #content #posts-list {
  list-style: none; }

.news > #content .published {
  text-align: right;
  font-size: 80%; }

.align-center {
  display: block;
  margin-left: auto;
  margin-right: auto; }

#talk-maschio-femmina-palle .caps {
  font-variant-caps: all-small-caps; }

/* pulse {{{ */
.pulse {
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 0 0 rgba(255, 255, 255, 0); }

.pulse:hover {
  animation: none; }

@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); }
  17% {
    -webkit-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); }
  20% {
    -webkit-box-shadow: 0 0 0 2vw rgba(130, 130, 130, 0.4); }
  23% {
    -webkit-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); }
  26% {
    -webkit-box-shadow: 0 0 0 2vw rgba(130, 130, 130, 0.4); }
  29% {
    -webkit-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); } }

@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4);
    box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); }
  17% {
    -moz-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4);
    box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); }
  20% {
    -moz-box-shadow: 0 0 0 2vw rgba(130, 130, 130, 0.4);
    box-shadow: 0 0 0 2vw rgba(130, 130, 130, 0.4); }
  23% {
    -moz-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4);
    box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); }
  26% {
    -moz-box-shadow: 0 0 0 2vw rgba(130, 130, 130, 0.4);
    box-shadow: 0 0 0 2vw rgba(130, 130, 130, 0.4); }
  29% {
    -moz-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4);
    box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); }
  100% {
    -moz-box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4);
    box-shadow: 0 0 0 0 rgba(130, 130, 130, 0.4); } }

/* pulse }}} */
/* rotate {{{ */
.rotate {
  animation: rotation 1s infinite ease-out; }

@keyframes rotation {
  from {
    transform: rotate(0deg); }
  to {
    transform: rotate(1440deg); } }

/* rotate }}} */
.talk-grid .talk {
  text-align: center; }

.talk-grid td {
  border: 0; }

.talk-grid td.talk-grid-time {
  border-bottom: 1px solid #444;
  border-top: 1px solid #444;
  vertical-align: top;
  padding-top: 0; }

.talk-grid td.talk {
  padding-bottom: 1em;
  padding-top: 1em;
  line-height: 1.2em; }

.talk-grid .tag-cibo {
  background-color: black; }

.talk-grid .talk-grid-time-minutes-15, .talk-grid .talk-grid-time-minutes-45 {
  visibility: hidden; }