/*!
* Microsite – peskyustim
*/

@import url('https://fonts.googleapis.com/css2?family=Chivo:ital,wght@0,400;0,700;1,400;1,700&family=Eczar:wght@600;700&display=swap');

/* root */
:root {
  --c-main: #111111;
  --c-green: #3cc8a0;
  --c-red: #ff0000;
  --c-blue: #0000ff;
  --font-size-factor: 1.375;

  --spacer: 24px;
}



.chivo {
  font-family: 'Chivo', sans-serif;
  font-weight: 400;
}

.eczar {
  font-family: 'Eczar', serif;
  font-weight: 600;
}

.c-blue *,
a.c-blue:hover { color: var(--c-blue); }

.c-red *,
a.c-red:hover { color: var(--c-red); }

.c-green *,
a.c-green:hover { color: var(--c-green); }

body {
  font-family: 'Chivo', sans-serif;
  color: var(--c-main);
  font-size: 100%;
  line-height: 1.3;

  margin: 0;

}

  .pesky-ustim .content {
    padding-bottom: calc(1 * var(--spacer));
  }

  .strip {
    display: block;
    position: fixed;
    top: 0;
    width: 100vw;
    height: 20px;

    background-image: url('bodytopborder.svg');
    background-repeat: repeat-x;
    background-position: top center;
  }

  .container {
    max-width: 768px;
    padding: 0 calc(1 * var(--spacer));
    margin: 0 auto;
  }

  .section {
    margin: 180px 0;
  }

  header.master {
    padding: calc(4 * var(--spacer)) 0 calc(2 * var(--spacer));
    margin: 0 auto;
    text-align: center;
  }

  footer.master {
    background-color: transparent;
    padding: calc(1 * var(--spacer)) 0 calc(2 * var(--spacer));
    text-align: center;
  }

  h1, h2, h3 {
    font-family: 'Eczar', serif;
    font-weight: 600;
  }

  h1, h2 {
    font-size: calc(4.75em / var(--font-size-factor));
    text-transform: uppercase;
    text-align: center;
  }

  h1 a,
  h2 a {
    text-decoration: none;
  }

  h3 {
    font-size: calc(3.125em / var(--font-size-factor));
    margin-bottom: 20px;
  }

  h4 {}

  h5 {
    font-size: calc(1.75em / var(--font-size-factor));
  }

  a {
    /* text-decoration: none; */
    color: var(--c-main);
  }

    h3 a {
      text-decoration: none;
    }

    h3 a:hover {
      text-decoration: underline;
    }

  p, ul, ol {
    margin: 0 0 calc(1.25 * var(--spacer));
  }

  strong {
    font-weight: 700;
  }

  img.size-responsive {
    /* max-width: 800px;
    height: 100%; */
    width: 100%;
    height: 100%;
  }

    img.aligncenter {
      margin: 0 auto;
      text-align: center;
      display: block;
    }

  blockquote {
    text-transform: uppercase;
    font-style: italic;
    text-align: center;
    font-size: calc(1.875em / var(--font-size-factor));
    margin-bottom: calc(2 * var(--spacer));

    border-left: none;
  }

  ol, ul {
    padding-inline-start: 0;
    list-style-type: none;

    font-family: 'Eczar', serif;
    font-size: calc(3.125em / var(--font-size-factor));
  }

  ol {
    counter-reset: item;
  }

  ol li:before {
      content: '#' counter(item, decimal) ' ';
      counter-increment: item;
  }

    ol li a,
    ul li a {
      text-decoration: none;
    }

    ul li {
      color: #bbb;
      text-indent: -1.45em;
      margin-left: 1.45em;
    }


/* button
-----------------------------------------------------------*/
  button, .button, .btn, .btn-primary, .btn-dark,
  input[type="submit"], .submit {
    /* text-transform: uppercase; */
    display: inline-block;
    /* padding: 15px 30px 11px; dle navrhu */
    padding: 8px 16px 5px;
    color: var(--c-main);
    background-color: transparent;
    border: 2px solid var(--c-main);
    font-weight: 400;
    /* font-size: 1.0625rem; dle navrhu */
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: none;
    transition: none;
    border-radius: 0;
    text-decoration: none;
  }

    button:hover, .button:hover, .btn:hover, .btn-primary:hover, .btn-dark:hover,
    input[type="submit"]:hover, .submit:hover,
    button:active, .button:active, .btn:active, .btn-primary:active, .btn-dark:active {
      color: #fff;
      background-color: var(--c-main);
      border: 2px solid var(--c-main);
      text-decoration: none;
      -webkit-box-shadow: none;
      box-shadow: none;
    }

    .c-blue button:hover, .button:hover {}

    .c-red button:hover, .c-red .button:hover {
      background-color: var(--c-red);
      border-color: var(--c-red);
      color: #fff;
    }

    .c-green button:hover, .c-green .button:hover {
      background-color: var(--c-green);
      border-color: var(--c-green);
      color: #fff;
    }




  /* ------------- icons ------------- */
  .icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    width: 20px; height: 20px;
    margin: 0 2px;
  }

    .icon-s { width: 16px; height: 16px; }
    .icon-m { width: 20px; height: 20px; }
    .icon-l { width: 24px; height: 24px; }
    .icon-xl { width: 30px; height: 30px; }
    .icon-xxl { width: 36px; height: 36px; }

    .icon-instagram { background-image: url('images/icon-ig.svg'); }
    .icon-instagram-c-blue { background-image: url('images/icon-ig-c-blue.svg'); }
    .icon-instagram-c-red { background-image: url('images/icon-ig-c-red.svg'); }
    .icon-instagram-c-green { background-image: url('images/icon-ig-c-green.svg'); }

    .icon-facebook { background-image: url('images/icon-fb.svg'); }
    .icon-facebook-c-blue { background-image: url('images/icon-fb-c-blue.svg'); }
    .icon-facebook-c-red { background-image: url('images/icon-fb-c-red.svg'); }
    .icon-facebook-c-green { background-image: url('images/icon-fb-c-green.svg'); }

    .icon-location { background-image: url('images/icon-location.svg'); margin: 0 -2px 0 -2px }
    .icon-location-c-blue { background-image: url('images/icon-location-c-blue.svg'); margin: 0 -2px 0 -2px }
    .icon-location-c-red { background-image: url('images/icon-location-c-red.svg'); margin: 0 -2px 0 -2px }
    .icon-location-c-green { background-image: url('images/icon-location-c-green.svg'); margin: 0 -2px 0 -2px }



    .icon-set-peskyustim {
      display: flex;
      flex-wrap: wrap;
      align-items: center;

      font-size: 1em;
      margin-left: -2px;
      margin-right: -2px;
    }

      .icon-set-peskyustim li {
        display: inline-block;
        text-indent: 0;
        margin: 0 3px;
      }

      .icon-set-peskyustim .button {
        margin-left: 9px;
      }





/*************************************
+ WP Gallery
*************************************/
.wp-gallery {
	margin: 0;
}

	.wp-gallery p {
		margin: 0;
	}

		.wp-gallery .gallery-item {
			display: inline-block;
			padding: 0;
			margin: 0;
			line-height: normal;
			max-height: 245px;
		}

			.wp-gallery .gallery-item img {
				width: 100%;
				height: 100%;
			}

			.wp-gallery .gallery-item img {
				-webkit-filter: grayscale(100%) contrast(100%) brightness(100%);
				-moz-filter: grayscale(100%) contrast(100%) brightness(100%);
				filter: grayscale(100%) contrast(100%) brightness(100%);
				opacity: 1;
			}

			.wp-gallery a.gallery-item:hover img {
				-webkit-filter: grayscale(0%) contrast(100%) brightness(100%);
				-moz-filter: grayscale(0%) contrast(100%) brightness(100%);
				filter: grayscale(0%) contrast(100%) brightness(100%);
			}

			.wp-gallery.gallery-columns-2 .gallery-item {
				/* width: calc(50% - 4px); */
				width: 50%;
			}

			.wp-gallery.gallery-columns-3 .gallery-item {
				width: calc(33.33333% - 4px);
			}

			.wp-gallery.gallery-columns-4 .gallery-item {
				/* width: calc(25% - 4px); */
				width: 25%;
        width: calc(25% - 5px);
        margin: 0 2.5px;
			}

			.wp-gallery.gallery-columns-5 .gallery-item {
				width: calc(20% - 4px);
			}



			.wp-gallery .gallery-icon {}

				.wp-gallery .gallery-icon a {
					display: block;
				}

					.wp-gallery .gallery-icon a img {
						border: none !important;
						height: 100%;
					}






  @media only screen
  and (max-width : 768px) {

    ul {
      font-size: calc(2.625em / var(--font-size-factor));
    }

  }

  @media only screen
  and (max-width : 576px) {

    img {
      width: 100%;
    }

    ul {
      font-size: calc(1.875em / var(--font-size-factor));
    }

  }
