/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
body {
  font-family: 'PT Sans Narrow', sans-serif;
  font-size: 20px; }

h1, h2, h3 {
  text-transform: uppercase;
  padding: 25px;
  text-align: center; }
  h1 span, h2 span, h3 span {
    color: #541615; }

.box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; }

.kim_jestesmy {
  padding-bottom: 3%; }

p {
  padding: 25px;
  text-align: justify; }

.baner5 {
  display: flex;
  margin: 0 auto;
  max-width: 100%;
  align-self: auto; }

.baner0, .baner, .baner1, .baner2 {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  display: block;
  align-items: center;
  box-sizing: border-box;
  max-width: 100%; }

.baner0 {
  padding: 25px 0px; }

.baner {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 400px; }

.baner1 {
  background-image: url("../img/banner1.png");
  height: 400px;
  position: relative; }

.baner2 {
  background-image: url("../img/grafika_nadole.jpg");
  height: 526px; }

.mid {
  display: flex; }

.sklepik_baner {
  background-image: url("../img/sklepik_baner.jpg");
  height: 78vh;
  background-repeat: no-repeat;
  /* width: 84%; */
  /* background-position: center; */
  background-size: cover;
  background-repeat: no-repeat;
  margin-bottom: 100px; }
  .sklepik_baner .overflow {
    height: 100%;
    width: 100%;
    margin-left: 0px;
    background-color: rgba(255, 255, 255, 0.5);
    transition: 0.6s ease-in;
    -webkit-transition: 0.6s ease-in; }

#kawiarnia-speciality .overflow {
  height: 100%;
  width: 100%;
  margin-left: 0px;
  background-color: rgba(255, 255, 255, 0.5);
  transition: 0.6s ease-in;
  -webkit-transition: 0.6s ease-in; }
  #kawiarnia-speciality .overflow:hover {
    background-color: rgba(255, 255, 255, 0); }

.text_sklepik {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column; }

.text_sklepik_speciality {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-flow: column; }
  .text_sklepik_speciality p {
    max-width: 550px; }
  .text_sklepik_speciality h1 {
    align-items: center;
    background-color: balck; }

.speciality_ziarno_brazek {
  background-image: url("../img/speciality_ziarna.jpg");
  height: 72vh;
  background-repeat: no-repeat;
  /* width: 84%; */
  /* background-position: center; */
  background-size: cover;
  background-repeat: no-repeat;
  margin-bottom: 100px; }

.speciality_woda_obrazek {
  background-image: url("../img/speciality_woda.jpg");
  height: 72vh;
  background-repeat: no-repeat;
  /* width: 84%; */
  /* background-position: center; */
  background-size: cover;
  background-repeat: no-repeat;
  margin-bottom: 100px; }

.speciality_machine {
  background-image: url("../img/5.png");
  height: 72vh;
  background-repeat: no-repeat;
  /* width: 84%; */
  /* background-position: center; */
  background-size: cover;
  background-repeat: no-repeat;
  margin-bottom: 100px; }

.speciality_rece {
  background-image: url("../img/speciality_rece.jpg");
  height: 72vh;
  background-repeat: no-repeat;
  /* width: 84%; */
  /* background-position: center; */
  background-size: cover;
  background-repeat: no-repeat;
  margin-bottom: 100px; }

@media only screen and (max-width: 1200px) and (min-width: 600px) {
  .speciality_rece {
    height: 70vh; }

  .text_sklepik_speciality {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column; } }
.no_padd {
  padding: 0px; }

.wrap_rev {
  display: flex;
  align-items: center;
  justify-content: right;
  flex-wrap: wrap-reverse; }

span {
  font-weight: 700; }

#kawiarnia-speciality ul {
  display: flex;
  width: 100%;
  flex-direction: column; }

.kawka1 {
  position: absolute;
  left: -6px;
  overflow: hidden;
  max-width: 30%; }

@media screen and (min-width: 793px) {
  .baner1 {
    background-image: none;
    position: relative; } }
.rectangle {
  position: absolute;
  z-index: 1;
  background-size: cover;
  background-repeat: no-repeat; }

.rect {
  background-position: right center;
  background-image: url(../img/trojkad_lewy_gorny.jpg);
  left: 0px;
  width: 30%; }
  .rect .overflow-rect {
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5);
    transition: 0.6s ease-in;
    -webkit-transition: 0.6s ease-in; }
  .rect:hover .overflow-rect {
    background-color: rgba(255, 255, 255, 0); }

.rect1 {
  background-image: url(../img/trojkat_prawy_gorny1.png);
  background-position: right cener;
  right: 0px;
  width: 30%; }
  .rect1 .overflow-rect1 {
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5);
    transition: 0.6s ease-in;
    -webkit-transition: 0.6s ease-in; }
  .rect1:hover .overflow-rect1 {
    background-color: rgba(255, 255, 255, 0); }

.rect3 {
  background-position: right center;
  background-image: url(../img/4.JPG);
  left: 0;
  width: 30%;
  padding: 0px; }
  .rect3 .overflow-rect3 {
    height: 100%;
    width: 100%;
    margin-left: 0px;
    background-color: rgba(255, 255, 255, 0.5);
    transition: 0.6s ease-in;
    -webkit-transition: 0.6s ease-in; }
  .rect3:hover .overflow-rect3 {
    background-color: rgba(255, 255, 255, 0); }

.rect4 {
  background-position: right center;
  background-image: url(../img/3.jpg);
  right: 0;
  width: 30%; }
  .rect4 .overflow-rect4 {
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5);
    transition: 0.6s ease-in;
    -webkit-transition: 0.6s ease-in; }
  .rect4:hover .overflow-rect4 {
    background-color: rgba(255, 255, 255, 0); }

.rect5 {
  background-position: center;
  background-image: url(../img/banner1_desktop.jpg);
  left: 0;
  width: 100%;
  -webkit-clip-path: polygon(0% 15%, 50% 0%, 100% 15%, 100% 100%, 50% 85%, 0% 100%);
  clip-path: polygon(0% 15%, 50% 0%, 100% 15%, 100% 100%, 50% 85%, 0% 100%);
  height: 100%; }

.rect6 {
  background-position: center;
  background-image: url(../img/grafika_nadole1.jpg);
  left: 0;
  width: 100%;
  -webkit-clip-path: polygon(0% 15%, 50% 0%, 100% 15%, 100% 100%, 50% 85%, 0% 100%);
  clip-path: polygon(0% 15%, 50% 0%, 100% 15%, 100% 100%, 50% 85%, 0% 100%);
  height: 100%; }

@media screen and (min-width: 992px) {
  .banner-rect {
    height: 600px; }

  .rect {
    top: -25%;
    -webkit-clip-path: polygon(0% 20%, 0% 85%, 100% 66%);
    clip-path: polygon(0% 20%, 0% 85%, 100% 66%);
    height: 50%; }

  .rect1 {
    top: -25%;
    -webkit-clip-path: polygon(100% 20%, 100% 85%, 0% 66%);
    clip-path: polygon(100% 20%, 100% 85%, 0% 66%);
    height: 50%; }

  .rect3 {
    height: 50%;
    -webkit-clip-path: polygon(0% 20%, 100% 0%, 0% 100%);
    clip-path: polygon(0% 20%, 100% 0%, 0% 100%);
    top: 102%; }

  .rect4 {
    height: 50%;
    -webkit-clip-path: polygon(0% 20%, 100% 0%, 0% 100%);
    clip-path: polygon(0% 0%, 100% 20%, 100% 100%);
    top: 102%; }

  .rect5 {
    -webkit-clip-path: polygon(0% 15%, 50% 0%, 100% 15%, 100% 100%, 50% 85%, 0% 100%);
    clip-path: polygon(0% 15%, 50% 0%, 100% 15%, 100% 100%, 50% 85%, 0% 100%);
    top: 7%;
    height: 100%; } }
.bootstrapowy-obraz {
  height: 100%;
  display: flex;
  vertical-align: central;
  width: 100%; }

#boot .container {
  background-color: red; }
#boot .container-fluid {
  background-color: blue; }
#boot .row {
  border: solid 3px #000; }
#boot .column {
  height: 300px;
  border: dashed #000 2px; }
#boot .in-padding {
  background-color: grey;
  width: 100%;
  height: 100%; }

#kontakt1 p {
  text-align: center;
  padding: 5px; }

.mapa {
  height: 50vh;
  position: relative;
  overflow: hidden; }
  .mapa #map {
    width: 100%;
    height: 100%; }

@media screen and (max-width: 993px) {
  .mobile_tlo {
    position: absolute;
    z-index: -1;
    opacity: 0.4;
    padding: 0px; } }
a {
  color: #333;
  text-decoration: none;
  font-size: 22px;
  text-align: center;
  margin: 0 0 10px 0; }

footer a {
  display: block; }

.social {
  display: flex;
  justify-content: space-evenly; }
  .social a {
    margin: 0px 10px; }

/*# sourceMappingURL=style.css.map */
.credit {
	    color: #000;
    text-align: center;
    padding: 5px;
    margin: 0px;
	
}

footer .credit a {
		    color: #000;
    display: inline;
	}