
html, body, div, iframe, h1, h2, h3, h4, h5, h6, p, a, del, em, img, q, s, small, strong, b, u, i, center,
dl, dt, dd, ol, ul, li, table, tr, th, td, article, footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}

html {font-family: 'Bitter', serif;}

@media only screen and (min-width: 100px) and (max-width: 420px) {
    
body {overflow-x: hidden;}
    
.slideshow-container {
max-width: 400px;
height:170px;
position: relative;
margin: -70px auto 10px auto;
/*margin-top: 5vh;*/
}
.mySlides>img {
position: absolute;
width: 100%;
height: 100%;
}

.prev, .next {
  cursor:pointer;
  position:absolute;
  top: 50%;
  width: auto;
  margin-top: -75px;
  padding: 20px;
  color: white;
  font-size: 48px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}
    .next {
  right: 0;
  border-radius: 3px 0 0 3px;
}
    .prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.3);
}
    .active:hover {
  background-color: #717171;
}
    .fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}    
    
img.logo {width: 100px; margin: 5px 5px 5px 0; float: left;}

tgi1 {background-image: linear-gradient(rgba(176, 179, 180, 0.86), rgba(218, 222, 224, 0.86)); width:100vw; height: 60px; display: block;}
ul {display: block; list-style-type: none; margin: 0; padding: 0; overflow: hidden; width: 340px; height: 60px; margin: 0 auto 0 auto;}
tgi {width: 100vw; display: block; height: 50px; background-image: linear-gradient(rgba(218, 222, 224, 0.86), rgba(252, 254, 255, 0.01)); margin: 0 auto 0 auto;}
bok {display: inline-block; margin: 0 2px 0 5px; width:67.1px;}
li {float: right;}
li a, .dropbtn {display: inline-block; color: black; font-size: 14px; font-weight: 600; text-align: right; padding: 14px 6px 14px 6px; text-decoration: none;}
li a {margin: 5px 0 0 0;}
li a:hover, .dropdown:hover .dropbtn {background-color: rgba(0, 0, 0, 0.21);}
li.dropdown {display: inline-block;}
.dropdown-content {display: none; position: absolute; background-color: #f9f9f9; min-width: 120px; box-shadow: 0px 8px 6px 0px rgba(0,0,0,0.4); z-index: 1;}
.dropdown-content a {font-size: 14px; color: black; padding: 5px 8px 5px 2px; text-decoration: none; display: block; text-align: left; margin: -2px 0 -2px 0; width: 138px;}
.dropdown-content a:hover {background-color: #d4d4d4;}
.dropdown:hover .dropdown-content {display: block;}
    

pod {width: 340px; height: 39px; display: block; margin: 0 auto; background-image: url(lot.jpg);}
h1 {display: block; z-index: 3; color: black; margin: 0px 4vw 0 4.5vw; font-size:22px; font-weight: 600; padding: 5px 0.5vw 0 0.5vw; 
 text-align: center;}
h2 {display: block; z-index: 3; color: black; margin: 0 4vw 0 4.5vw; font-size:24px; font-style: italic; font-weight: 700; padding: 5px 0.5vw 0.5vw 0.5vw; text-align: center;}
    
a.click {position: absolute; top:48vh; right: 88vw; z-index: 3;}
img.button {width: 6vw;}

#myVideo {display: block; width: 340px; z-index: 0; border: 0.2vw; border-color: black; border-style: solid; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; margin: -70px auto 10px auto;}
    
opis {width: 340px; display: block; overflow-y: auto; background-color: white; z-index: 3; margin: 0 auto; overflow-x: hidden;}
    
h3 {color: black; margin: 0px auto 0 auto; font-size:16px; font-weight: 600; text-align: center; background-image: url(lot.jpg); padding: 5px 0 10px 0; display: block; width: 340px; height: 24px; }
h4 {display: block; z-index: 3; color: black; margin: 0px 0vw 0 0vw; font-size:20px; font-weight: 600; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 35px; width: 340px;}
h5 {color: black; margin: 0px auto 0 auto; font-size: 16px; font-weight: 700; text-align: center; background-image: url(lot.jpg); padding: 15px 0 10px 0; display: block; width: 150px; height: 44px; }

p {color: black; margin: 1vw 0vw 1vw 0vw; font-size: 14px; line-height: 25px; text-align: justify;}
i {font-family: 'Merriweather Sans', sans-serif; font-style: italic; font-weight: 600; font-size: 16px; color: rgba(72, 37, 37, 0.82);}
img.text {width: 320px; margin: 10px 0px 10px 10px; box-shadow: 0.2rem 0.3rem 0.5rem rgba(47, 36, 36, 0.81); vertical-align: middle;} 
img.text2 {width: 320px; margin: 10px 0px 10px 10px; box-shadow: 0.2rem 0.3rem 0.5rem rgba(47, 36, 36, 0.81); vertical-align: middle;} 
img.ico {width: 40px; margin-right: 10px;}

img.pony {margin: 0vw 1vw 0vw 1vw; height: 3vh;}
        
gal {width: 42vw; display: inline-block; margin: 3vw 0vw 3vw 3vw; overflow: hidden;}
gal img {width: 42vw; transition: transform .8s ease;}
gal img:hover {transition: transform .8s ease; transform: scale(1.15);}  

a.przycisk {display: inline-block; text-align: center; width: 160px; margin: 0 45px 20px 90px; font-size: 18px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisk:hover {background-color: lightgray;}
a.przycisks {display: block; width: 120px; margin: 5px 0 5px 100px; font-size: 14px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; text-align: center; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisks:hover {background-color: lightgray;}

img.off {width: 15vw; display: inline-block; margin: 3vw 0vw 3vw 3vw;}
off {vertical-align: top; display: inline-block; width: 75vw; margin: 3vw 0vw 3vw 0vw;}

portfolio {display: inline-block; vertical-align: top; width: 320px; height: 360px; margin: 5px 0px 10px auto; background-color: #cccccc; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
portfolio2 {display: inline-block; vertical-align: top; width: 320px; height: 360px; margin: 5px 0 10px auto; background-color: #cccccc; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
portfolio img, portfolio2 img {width: 320px; height:320px;}
portfolio h6, portfolio2 h6 {height: 40px; width: 270px; font-size: 20px; text-align: center; line-height: 40px; color: black;}
    
linia {width: 100vw; display: block;}
linia2 {height: 0.1vw; width: 100vw; display: block;}
img.galeria {height: 18vw; margin: 3vw; display: inline-block; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
    
.gallery__container {min-height: 50vh; padding: 0 5px 5px 5px; margin-top: 10px; align-items: center;}
.gallery {list-style: none; padding-left: 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin-top: 6vh;}
.gallery__apsect-ratio {padding-top: calc(100%*9/16);}
.gallery__image {left: 0; width: 140px; height: 140px; top: 10px; padding: 5px; object-fit: cover; margin: 3px 3px 3px 3px;}
    

boks {width: 48%; display: inline-block; overflow-y: auto; background-color: white; z-index: 3;}
iframe {width: 50%; height: 70vh; padding-bottom: 20px; float: right; display: inline-block; vertical-align: top;}
    
stopka {width: 100%; min-height: 7vh; display: block; overflow-y: auto; background-image: url(lot.jpg); text-align: center;}
a.stopka {text-decoration: none; font-size: 0.6rem;  line-height: 1.6rem; color: black;}
a.stopka2 {text-decoration: none; font-size: 0.7rem; font-weight: 600; line-height: 2rem; color: black;}
}
    
    

@media only screen and (min-width: 421px) and (max-width: 699px) {
    
    body {overflow-x: hidden;}
    
.slideshow-container {max-width: 1125px; height: 410px; position: relative; margin: -70px auto 10px auto;}
.mySlides>img {position: absolute; width: 100%; height: 100%;}
.prev, .next {  cursor:pointer;  position:absolute;  top: 50%;  width: auto;  margin-top: -75px;  padding: 20px;  color: white;  font-size: 48px;  transition: 0.6s ease;  border-radius: 0 3px 3px 0;  user-select: none;}
.next {  right: 0;  border-radius: 3px 0 0 3px;}
.prev:hover, .next:hover {  background-color: rgba(0,0,0,0.3);}
.active:hover {  background-color: #717171;}
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}    
    
img.logo {width: 100px; margin: 12px 5px 5px 0; float: left;}

tgi1 {background-image: linear-gradient(rgba(176, 179, 180, 0.86), rgba(218, 222, 224, 0.86)); width:100vw; height: 60px; display: block;}
ul {display: block; list-style-type: none; margin: 0; padding: 0; overflow: hidden; width: 540px; height: 60px; margin: 0 auto 0 auto;}
tgi {width: 100vw; display: block; height: 50px; background-image: linear-gradient(rgba(218, 222, 224, 0.86), rgba(252, 254, 255, 0.01)); margin: 0 auto 0 auto;}
bok {display: inline-block; margin: 0 2px 0 5px; width:107.1px;}
li {float: right;}
li a, .dropbtn {display: inline-block; color: black; font-size: 14px; font-weight: 600; text-align: right; padding: 14px 6px 14px 6px; text-decoration: none;}
li a {margin: 5px 0 0 0;}
li a:hover, .dropdown:hover .dropbtn {background-color: rgba(0, 0, 0, 0.21);}
li.dropdown {display: inline-block;}
.dropdown-content {display: none; position: absolute; background-color: #f9f9f9; min-width: 120px; box-shadow: 0px 8px 6px 0px rgba(0,0,0,0.4); z-index: 1;}
.dropdown-content a {font-size: 14px; color: black; padding: 5px 8px 5px 2px; text-decoration: none; display: block; text-align: left; margin: -2px 0 -2px 0; width: 138px;}
.dropdown-content a:hover {background-color: #d4d4d4;}
.dropdown:hover .dropdown-content {display: block;}
    

pod {width: 540px; height: 39px; display: block; margin: 0 auto; background-image: url(lot.jpg);}
h1 {display: block; z-index: 3; color: black; margin: 0px 4vw 0 4.5vw; font-size:22px; font-weight: 600; padding: 5px 0.5vw 0 0.5vw; 
 text-align: center;}
h2 {display: block; z-index: 3; color: black; margin: 0 4vw 0 4.5vw; font-size:24px; font-style: italic; font-weight: 700; padding: 5px 0.5vw 0.5vw 0.5vw; text-align: center;}
    
a.click {position: absolute; top:48vh; right: 88vw; z-index: 3;}
img.button {width: 6vw;}

#myVideo {display: block; width: 340px; z-index: 0; border: 0.2vw; border-color: black; border-style: solid; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; margin: -70px auto 10px auto;}
    
opis {width: 540px; display: block; overflow-y: auto; background-color: white; z-index: 3; margin: 0 auto; overflow-x: hidden;}
    
h3 {color: black; margin: 0px auto 0 auto; font-size:16px; font-weight: 600; text-align: center; background-image: url(lot.jpg); padding: 5px 0 10px 0; display: block; width: 540px; height: 24px; }
h4 {display: block; z-index: 3; color: black; margin: 0px 0vw 0 0vw; font-size:20px; font-weight: 600; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 35px; width: 540px;}
h5 {color: black; margin: 0px auto 0 auto; font-size: 16px; font-weight: 700; text-align: center; background-image: url(lot.jpg); padding: 15px 0 10px 0; display: block; width: 150px; height: 44px; }

p {color: black; margin: 1vw 0vw 1vw 0vw; font-size: 14px; line-height: 25px; text-align: justify;}
i {font-family: 'Merriweather Sans', sans-serif; font-style: italic; font-weight: 600; font-size: 16px; color: rgba(72, 37, 37, 0.82);}
img.text {width: 255px; margin: 10px 0px 10px 10px; box-shadow: 0.2rem 0.3rem 0.5rem rgba(47, 36, 36, 0.81); vertical-align: middle;} 
img.text2 {width: 255px; margin: 10px 0px 10px 10px; box-shadow: 0.2rem 0.3rem 0.5rem rgba(47, 36, 36, 0.81); vertical-align: middle;} 
img.ico {width: 40px; margin-right: 10px;}

img.pony {margin: 0vw 1vw 0vw 1vw; height: 3vh;}
        
gal {width: 42vw; display: inline-block; margin: 3vw 0vw 3vw 3vw; overflow: hidden;}
gal img {width: 42vw; transition: transform .8s ease;}
gal img:hover {transition: transform .8s ease; transform: scale(1.15);}  

a.przycisk {display: inline-block; text-align: center; width: 100px; margin: 0 25px 20px 20px; font-size: 18px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisk:hover {background-color: lightgray;}
a.przycisks {display: block; width: 120px; margin: 5px 0 5px 200px; font-size: 14px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; text-align: center; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisks:hover {background-color: lightgray;}

img.off {width: 15vw; display: inline-block; margin: 3vw 0vw 3vw 3vw;}
off {vertical-align: top; display: inline-block; width: 75vw; margin: 3vw 0vw 3vw 0vw;}

portfolio {display: inline-block; vertical-align: top; width: 255px; height: 295px; margin: 5px 8px 10px auto; background-color: #cccccc; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
portfolio2 {display: inline-block; vertical-align: top; width: 255px; height: 295px; margin: 5px 0 10px auto; background-color: #cccccc; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
portfolio img, portfolio2 img {width: 255px; height:255px;}
portfolio h6, portfolio2 h6 {height: 40px; width: 255px; font-size: 20px; text-align: center; line-height: 40px; color: black;}
    
linia {width: 100vw; display: block;}
linia2 {height: 0.1vw; width: 100vw; display: block;}
img.galeria {height: 18vw; margin: 3vw; display: inline-block; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
    
.gallery__container {min-height: 50vh; padding: 0 5px 5px 5px; margin-top: 10px; align-items: center;}
.gallery {list-style: none; padding-left: 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin-top: 6vh;}
.gallery__apsect-ratio {padding-top: calc(100%*9/16);}
.gallery__image {left: 0; width: 140px; height: 140px; top: 10px; padding: 5px; object-fit: cover; margin: 3px 3px 3px 3px;}
    

boks {width: 48%; display: inline-block; overflow-y: auto; background-color: white; z-index: 3;}
iframe {width: 50%; height: 70vh; padding-bottom: 20px; float: right; display: inline-block; vertical-align: top;}
    
stopka {width: 100%; min-height: 40px; display: block; overflow-y: auto; background-image: url(lot.jpg); text-align: center;}
a.stopka {text-decoration: none; font-size: 0.6rem;  line-height: 1.2rem; color: black;}
a.stopka2 {text-decoration: none; font-size: 0.7rem; font-weight: 600; line-height: 1.5rem; color: black;}
}
    


@media only screen and (min-width: 700px) and (max-width: 1249px) {
    body {overflow-x: hidden;}
    
.slideshow-container {max-width: 1125px;height: 410px;position: relative;margin: -70px auto 10px auto;}
.mySlides>img {position: absolute;width: 100%;height: 100%;}
.prev, .next {  cursor:pointer;  position:absolute;  top: 50%;  width: auto;  margin-top: -75px;  padding: 20px;  color: white;  font-size: 48px;  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;  user-select: none;}
.next {  right: 0;  border-radius: 3px 0 0 3px;}
.prev:hover, .next:hover {  background-color: rgba(0,0,0,0.3);}
.active:hover {  background-color: #717171;}
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}    
    
img.logo {width: 300px; margin: 20px 20px 20px 0; float: left;}

tgi1 {background-image: linear-gradient(rgba(176, 179, 180, 0.86), rgba(218, 222, 224, 0.86)); width:100vw; height: 100px; display: block;}
ul {display: block; list-style-type: none; margin: 0; padding: 0; overflow: hidden; width: 1250px; height: 100px; margin: 0 auto 0 auto;}
tgi {width: 100vw; display: block; height: 100px; background-image: linear-gradient(rgba(218, 222, 224, 0.86), rgba(252, 254, 255, 0.01)); margin: 0 auto;}
bok {display: inline-block; margin: 0 -35px 0 158px; width:168px;}
li {float: left;}
li a, .dropbtn {display: inline-block; color: black; font-size: 22px; font-weight: 600; text-align: right; padding: 14px 6px 14px 6px; text-decoration: none;}
li a {margin: 20px 0 0 0;}
li.dropdown {display: inline-block;}
.dropdown-content {display: none; position: absolute; background-color: #f9f9f9; min-width: 120px; box-shadow: 0px 8px 6px 0px rgba(0,0,0,0.4); z-index: 1;}
.dropdown-content a {font-size: 15px; color: black; padding: 5px 8px 5px 2px; text-decoration: none; display: block; text-align: left; margin: -2px 0 -2px 0; width: 138px;}
    .dropdown-content a:hover {background-color: #d4d4d4;}
.dropdown:hover .dropdown-content {display: block;}
    

/*
pod {width: 1250px; height: 44px; padding: 15px 0 10px 0;
    display: block; 
    margin: 0 auto; background-image: url(lot.jpg); text-align: center;}
*/
/*h1 {display: block; z-index: 3; color: #2B2B28; 
    margin: 0px 4vw 0 4.5vw; 
    font-size:30px; font-weight: 600; 
    padding: 15px 0.5vw 0 0.5vw; 
 text-align: center;}*/
    h1{display: block; z-index: 3; color: #3E3E3C; margin: 0px 4vw 0 4.5vw; font-size:30px; font-weight: 600; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 55px;}    
h2 {display: block; z-index: 3; color: black; margin: 0 4vw 0 4.5vw; font-size:24px; font-style: italic; font-weight: 700; padding: 5px 0.5vw 0.5vw 0.5vw; text-align: center;}
    
a.click {position: absolute; top:48vh; right: 88vw; z-index: 3;}
img.button {width: 6vw;}

#myVideo {display: block; width: 1244px; z-index: 0; border: 0.2vw; border-color: black; border-style: solid; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; margin: -70px auto 10px auto;}
    
opis {width: 1250px; display: block; overflow-y: auto; background-color: white; z-index: 3; margin: 0 auto;text-align: center}
    
/*h3 {color: #3E3E3C; margin: 0 auto; font-size: 26px; font-weight: 700; text-align: center; background-image: url(lot.jpg); padding: 15px 0 10px 0; display: block; width: 1250px; height: 44px;}*/
h3 {display: block; z-index: 3; color: #3E3E3C; margin: 0px 4vw 0 4.5vw; font-size:30px; font-weight: 700; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 55px;}    
h4 {display: block; z-index: 3; color: #2B2B28; margin: 0px 4vw 0 4.5vw; font-size:30px; font-weight: 700; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 55px;}
/*h5 {color: #3E3E3C; margin: 0px auto 0 auto; font-size: 26px; font-weight: 700; text-align: center; background-image: url(lot.jpg); padding: 15px 0 10px 0; display: block; width: 600px; height: 44px;}*/
h5 {display: block; z-index: 3; color: #3E3E3C; margin: 0px 4vw 0 4.5vw; font-size:30px; font-weight: 700; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 55px;}    

p {font-family: 'Roboto', sans-serif;font-weight: 400; color: black; margin: 1vw 5vw; font-size: 16px; line-height: 25px; text-align: justify;color:#1d1c1c;}
.text {font-family: 'Roboto', sans-serif;font-weight: 600; color: black; margin: 1vw 5vw; font-size: 18px; line-height: 25px; text-align: justify;color:#1d1c1c;}
i {font-family: 'Raleway', sans-serif; font-style: italic; font-weight: 800; font-size: 22px;letter-spacing: 1px;color:#2B2B28; text-align: left;}
    .dwa { text-align: left; margin-left: 5vw;}    
img.text {width: 338px; margin: 20px; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; vertical-align: middle;} 
img.text2 {width: 255px; margin: 20px 0 20px 0; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; vertical-align: middle;} 


img.pony {margin: 0vw 1vw 0vw 1vw; height: 3vh;}
        
gal {width: 42vw; display: inline-block; margin: 3vw 0vw 3vw 3vw; overflow: hidden;}
gal img {width: 42vw; transition: transform .8s ease;}
gal img:hover {transition: transform .8s ease; transform: scale(1.15);}  

a.przycisk {display: inline-block; text-align: center; width: 150px; margin: 0 20px 20px 30px; font-size: 22px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisk:hover {background-color: lightgray;}
    .jeden {
        justify-content: center;align-items: center;
        text-align: center;
        margin: 4vw auto;
    }
a.przycisks {display: block; width: 200px;
    margin-left: 42%;
/*    margin: 10px 0 20px 520px; */
    font-size: 22px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; text-align: center; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisks:hover {background-color: lightgray;}

img.off {width: 15vw; display: inline-block; margin: 3vw 0vw 3vw 3vw;}
off {vertical-align: top; display: inline-block; width: 75vw; margin: 3vw 0vw 3vw 0vw;}

portfolio {display: inline-block; vertical-align: top; width: 270px; height: 320px; margin: 15px 50px; background-color: #E4E4DD; box-shadow: 0px 10px 13px -7px #000000;}
portfolio2 {display: inline-block; vertical-align: top; width: 250px; height: 300px; margin: 15px 0 30px auto; background-color: #cccccc; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
portfolio:hover, portfolio2:hover {box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.76);}
portfolio img {width: 270px; height:270px;}
portfolio h6, portfolio2 h6 {height: 50px; width: 250px; font-size: 20px; text-align: center; line-height: 40px; color: #2B2B28;}
    
linia {width: 100vw; display: block;}
linia2 {height: 0.1vw; width: 100vw; display: block;}
img.galeria {height: 18vw; margin: 3vw; display: inline-block; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
    
.gallery__container {min-height: 50vh; padding: 0 5px 5px 5px; margin-top: 10px; align-items: center;}
.gallery {list-style: none; padding-left: 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin-top: 6vh;}
.gallery__apsect-ratio {padding-top: calc(100%*9/16);}
.gallery__image {left: 0; width: 253px; height: 253px; top: 100px; padding: 15px; object-fit: cover; margin: 5px;}
    

boks {width: 100%; display: inline-block; overflow-y: auto; background-color: white; z-index: 3;}
iframe {width: 100%; height: 50vh; padding-bottom: 20px; float: right; display: inline-block; vertical-align: top;}
    
stopka {width: 100%; min-height: 7vh; display: block; overflow-y: auto; background-image: url(lot.jpg); text-align: center;}
a.stopka {text-decoration: none; font-size: 0.8rem;  line-height: 1.6rem; color: black;}
a.stopka2 {text-decoration: none; font-size: 0.95rem; font-weight: 600; line-height: 2rem; color: black;}
    
}


@media only screen and (min-width: 1250px) and (max-width: 1601px) {
    
body {overflow-x: hidden;}
    
.slideshow-container {max-width: 1125px;height: 480px;position: relative;margin: -70px auto 10px auto;}
.mySlides>img {position: absolute;width: 100%;height: 100%;}
.prev, .next {  cursor:pointer;  position:absolute;  top: 50%;  width: auto;  margin-top: -75px;  padding: 20px;  color: white;  font-size: 48px;  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;  user-select: none;}
.next {  right: 0;  border-radius: 3px 0 0 3px;}
.prev:hover, .next:hover {  background-color: rgba(0,0,0,0.3);}
.active:hover {  background-color: #717171;}
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}    
    

img.logo {width: 330px; margin: 20px 20px 20px 26px; float: left;}

tgi1 {background-image: linear-gradient(rgba(176, 179, 180, 0.86), rgba(218, 222, 224, 0.86)); width:100vw; height: 100px; display: block;}
ul {display: block; list-style-type: none; margin: 0; padding: 0; width: 1250px; height: 100px; margin: 0 auto 0 auto;}
tgi {width: 100vw; display: block; height: 100px; background-image: linear-gradient(rgba(218, 222, 224, 0.86), rgba(252, 254, 255, 0.01)); margin: 0 auto;}
bok {display: inline-block; margin: 0 -35px 0 146px; width:168px;}
li {float: left;}
li a, .dropbtn {display: inline-block; color: black; font-size: 22px; font-weight: 600; text-align: right; padding: 14px 6px 14px 6px; text-decoration: none;}
li a {margin: 20px 0 0 0;}
li.dropdown {display: inline-block;}
.dropdown-content {display: none; position: absolute; background-color: #f9f9f9; min-width: 120px; box-shadow: 0px 8px 6px 0px rgba(0,0,0,0.4); z-index: 1;}
.dropdown-content a {font-size: 15px; color: black; padding: 5px 8px 5px 2px; text-decoration: none; display: block; text-align: left; margin: -2px 0 -2px 0; width: 138px;}
    .dropdown-content a:hover {background-color: #d4d4d4;}
.dropdown:hover .dropdown-content {display: block;}
    

/*
pod {width: 1250px; height: 44px; padding: 15px 0 10px 0;
    display: block; 
    margin: 0 auto; background-image: url(lot.jpg); text-align: center;}
*/
/*h1 {display: block; z-index: 3; color: #2B2B28; 
    margin: 0px 4vw 0 4.5vw; 
    font-size:30px; font-weight: 600; 
    padding: 15px 0.5vw 0 0.5vw; 
 text-align: center;}*/
    h1{display: block; z-index: 3; color: #3E3E3C; margin: 0px 4vw 0 4.5vw; font-size:30px; font-weight: 600; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 55px;}    
h2 {display: block; z-index: 3; color: black; margin: 0 4vw 0 4.5vw; font-size:24px; font-style: italic; font-weight: 700; padding: 5px 0.5vw 0.5vw 0.5vw; text-align: center;}
    
a.click {position: absolute; top:48vh; right: 88vw; z-index: 3;}
img.button {width: 6vw;}

#myVideo {display: block; width: 1244px; z-index: 0; border: 0.2vw; border-color: black; border-style: solid; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; margin: -70px auto 10px auto;}
    
opis {width: 1250px; display: block; overflow-y: auto; background-color: white; z-index: 3; margin: 0 auto;text-align: center}
    
/*h3 {color: #3E3E3C; margin: 0 auto; font-size: 26px; font-weight: 700; text-align: center; background-image: url(lot.jpg); padding: 15px 0 10px 0; display: block; width: 1250px; height: 44px;}*/
h3 {display: block; z-index: 3; color: #3E3E3C; margin: 0px 4vw 0 4.5vw; font-size:30px; font-weight: 700; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 55px;}    
h4 {display: block; z-index: 3; color: #2B2B28; margin: 0px 4vw 0 4.5vw; font-size:30px; font-weight: 700; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 55px;}
/*h5 {color: #3E3E3C; margin: 0px auto 0 auto; font-size: 26px; font-weight: 700; text-align: center; background-image: url(lot.jpg); padding: 15px 0 10px 0; display: block; width: 600px; height: 44px;}*/
h5 {display: block; z-index: 3; color: #3E3E3C; margin: 0px 4vw 0 4.5vw; font-size:30px; font-weight: 700; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 55px;}    

p {font-family: 'Roboto', sans-serif;font-weight: 400; color: black; margin: 1vw 5vw; font-size: 16px; line-height: 25px; text-align: justify;color:#1d1c1c;}
.text {font-family: 'Roboto', sans-serif;font-weight: 600; color: black; margin: 1vw 5vw; font-size: 18px; line-height: 25px; text-align: justify;color:#1d1c1c;}
i {font-family: 'Raleway', sans-serif; font-style: italic; font-weight: 800; font-size: 22px;letter-spacing: 1px;color:#2B2B28; text-align: left;}
    .dwa { text-align: left; margin-left: 5vw;}    
img.text {width: 338px; margin: 20px 20px 20px 0; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; vertical-align: middle;} 
img.text2 {width: 338px; margin: 20px 0 20px 0; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; vertical-align: middle;} 


img.pony {margin: 0vw 1vw 0vw 1vw; height: 3vh;}
        
gal {width: 42vw; display: inline-block; margin: 3vw 0vw 3vw 3vw; overflow: hidden;}
gal img {width: 42vw; transition: transform .8s ease;}
gal img:hover {transition: transform .8s ease; transform: scale(1.15);}  

a.przycisk {display: inline-block; text-align: center; width: 150px; margin: 0 20px 20px 30px; font-size: 22px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisk:hover {background-color: lightgray;}
.jeden {justify-content: center;align-items: center; text-align: center; margin: 4vw auto; }
a.przycisks {display: block; width: 200px;
    margin-left: 42%;
/*    margin: 10px 0 20px 520px; */
    font-size: 22px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; text-align: center; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisks:hover {background-color: lightgray;}

img.off {width: 15vw; display: inline-block; margin: 3vw 0vw 3vw 3vw;}
off {vertical-align: top; display: inline-block; width: 75vw; margin: 3vw 0vw 3vw 0vw;}

portfolio {display: inline-block; vertical-align: top; width: 270px; height: 320px; margin: 15px 50px; background-color: #E4E4DD; box-shadow: 0px 10px 13px -7px #000000;}
portfolio:hover {box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.76);}
portfolio img {width: 270px; height:270px;}
portfolio h6 {height: 50px; width: 250px; font-size: 20px; text-align: center; line-height: 40px; color: #2B2B28;}
    
linia {width: 100vw; display: block;}
linia2 {height: 0.1vw; width: 100vw; display: block;}
img.galeria {height: 18vw; margin: 3vw; display: inline-block; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
    
.gallery__container {min-height: 50vh; padding: 0 5px 5px 5px; margin-top: 10px; align-items: center;}
.gallery {list-style: none; padding-left: 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin-top: 6vh;}
.gallery__apsect-ratio {padding-top: calc(100%*9/16);}
.gallery__image {left: 0; width: 253px; height: 253px; top: 100px; padding: 15px; object-fit: cover; margin: 5px;}
    

boks {width: 100%; display: inline-block; overflow-y: auto; background-color: white; z-index: 3;}
iframe {width: 1150px; height: 500px; padding-bottom: 20px; float: left; display: inline-block; vertical-align: top; margin-left: 55px;}
    
stopka {width: 100%; min-height: 7vh; display: block; overflow-y: auto; background-image: url(lot.jpg); text-align: center;}
a.stopka {text-decoration: none; font-size: 0.8rem;  line-height: 1.6rem; color: black;}
a.stopka2 {text-decoration: none; font-size: 0.95rem; font-weight: 600; line-height: 2rem; color: black;}
}

@media only screen and (min-width: 1602px) and (max-width: 3300px) {
    
    
body {overflow-x: hidden;}
    
.slideshow-container {max-width: 1250px;height: 510px;position: relative;margin: -70px auto 10px auto;}
.mySlides>img {position: absolute;width: 100%;height: 100%;}
.prev, .next {  cursor:pointer;  position:absolute;  top: 50%;  width: auto;  margin-top: -75px;  padding: 20px;  color: white;  font-size: 48px;  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;  user-select: none;}
.next {  right: 0;  border-radius: 3px 0 0 3px;}
.prev:hover, .next:hover {  background-color: rgba(0,0,0,0.3);}
.active:hover {  background-color: #717171;}
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}    
    
img.logo {width: 340px; margin: 20px 20px 20px -40px; visibility: visible;}

tgi1 {background-image: linear-gradient(rgba(176, 179, 180, 0.86), rgba(218, 222, 224, 0.86)); width:100vw; height: 100px; display: block;}
ul {display: block; list-style-type: none; margin: 0; padding: 0; width: 1250px; height: 100px; margin: 0 auto 0 auto;}
tgi {width: 100vw; display: block; height: 100px; background-image: linear-gradient(rgba(218, 222, 224, 0.86), rgba(252, 254, 255, 0.01)); margin: 0 auto 0 auto;}
bok {display: inline-block; margin: 0 -35px 0 165px; width:168px;}
li {float: right;}
li a, .dropbtn {display: inline-block; color: black; font-size: 22px; font-weight: 600; text-align: right; padding: 14px 6px 14px 6px; text-decoration: none;}
li a {margin: 20px 0 0 0;}
li a:hover, .dropdown:hover .dropbtn {background-color: rgba(0, 0, 0, 0.21);}
li.dropdown {display: inline-block;}
.dropdown-content {display: none; position: absolute; background-color: #f9f9f9; min-width: 120px; box-shadow: 0px 8px 6px 0px rgba(0,0,0,0.4); z-index: 1;}
.dropdown-content a {font-size: 18px; color: black; padding: 5px 8px 5px 2px; text-decoration: none; display: block; text-align: left; margin: -2px 0 -2px 0; width: 138px;}
.dropdown-content a:hover {background-color: #d4d4d4;}
.dropdown:hover .dropdown-content {display: block;}
    

pod {width: 1250px; height: 68px; display: block; margin: 0 auto; background-image: url(lot.jpg);}
h1 {display: block; z-index: 3; color: black; margin: 0px 4vw 0 4.5vw; font-size:30px; font-weight: 700; padding: 15px 0.5vw 0 0.5vw; 
 text-align: center;}
h2 {display: block; z-index: 3; color: black; margin: 0 4vw 0 4.5vw; font-size:24px; font-style: italic; font-weight: 700; padding: 5px 0.5vw 0.5vw 0.5vw; text-align: center;}
    
a.click {position: absolute; top:48vh; right: 88vw; z-index: 3;}
img.button {width: 6vw;}

#myVideo {display: block; width: 1244px; z-index: 0; border: 0.2vw; border-color: black; border-style: solid; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; margin: -70px auto 10px auto;}
    
opis {width: 1250px; display: block; overflow-y: auto; background-color: white; z-index: 3; margin: 0 auto;}
    
h3 {color: black; margin: 0px auto 0 auto; font-size: 26px; font-weight: 700; text-align: center; background-image: url(lot.jpg); padding: 15px 0 10px 0; display: block; width: 1250px; height: 44px; }
h4 {display: block; z-index: 3; color: black; font-size:30px; font-weight: 700; padding: 15px 0.5vw 0 0.5vw; text-align: center; background-image: url(lot.jpg); height: 55px;}
h5 {color: black; margin: 0px auto 0 auto; font-size: 26px; font-weight: 700; text-align: center; background-image: url(lot.jpg); padding: 15px 0 10px 0; display: block; width: 1250px; height: 44px; }

p {font-family: 'Roboto', sans-serif;font-weight: 400; color: black; margin: 1vw 0vw; font-size: 16px; line-height: 25px; text-align: justify;color:#1d1c1c;}
.text {font-family: 'Roboto', sans-serif;font-weight: 600; color: black; margin: 1vw 0vw; font-size: 18px; line-height: 25px; text-align: justify;color:#1d1c1c;}
i {font-family: 'Merriweather Sans', sans-serif; font-style: italic; font-weight: 800; font-size: 24px;}
img.text {width: 375px; margin: 20px 55px 20px 0; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; vertical-align: middle;} 
img.text2 {width: 375px; margin: 20px 0 20px 0; box-shadow: 0.2rem 0.3rem 0.5rem #2f2424; vertical-align: middle;} 


img.pony {margin: 0vw 1vw 0vw 1vw; height: 3vh;}
        
gal {width: 42vw; display: inline-block; margin: 3vw 0vw 3vw 3vw; overflow: hidden;}
gal img {width: 42vw; transition: transform .8s ease;}
gal img:hover {transition: transform .8s ease; transform: scale(1.15);}  

a.przycisk {display: inline-block; text-align: center; width: 220px; margin: 0 20px 20px 30px; font-size: 26px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisk:hover {background-color: lightgray;}
a.przycisks {display: block; width: 300px; margin: 10px 0 20px 475px; font-size: 26px; font-weight: 600; color: black; text-decoration: none; background-color: white; padding: 1vw; text-align: center; border: 3px; border-color: black; border-style: solid; border-radius: 30px;}
a.przycisks:hover {background-color: lightgray;}

img.off {width: 15vw; display: inline-block; margin: 3vw 0vw 3vw 3vw;}
off {vertical-align: top; display: inline-block; width: 75vw; margin: 3vw 0vw 3vw 0vw;}

.jeden {justify-content: center;align-items: center; text-align: center; margin: 0 auto; }
portfolio {display: inline-block; vertical-align: top; width: 350px; height: 400px; margin: 15px 25px 15px 25px; background-color: #E4E4DD; box-shadow: 0px 10px 13px -7px #000000;}
portfolio:hover {box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.76);}
portfolio img {width: 350px; height:350px;}
portfolio h6 {height: 50px; width: 350px; font-size: 20px; text-align: center; line-height: 40px; color: #2B2B28;}
    
linia {width: 100vw; display: block;}
linia2 {height: 0.1vw; width: 100vw; display: block;}
img.galeria {height: 18vw; margin: 3vw; display: inline-block; box-shadow: 10px 5px 5px rgba(0, 0, 0, 0.56);}
    
.gallery__container {min-height: 100vh; padding: 0 5px 5px 5px; margin-top: 10px; align-items: center;}
.gallery {list-style: none; padding-left: 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin-top: 6vh;}
.gallery__apsect-ratio {padding-top: calc(100%*9/16);}
.gallery__image {left: 0; width: 253px; height: 253px; top: 100px; padding: 15px; object-fit: cover; margin: 5px;}
    

boks {width: 1250px; display: inline-block; overflow-y: auto; background-color: white; z-index: 3;}
iframe {width: 1250px; height: 700px; padding-bottom: 20px; float: right; display: block; vertical-align: top;}
    
stopka {width: 100%; min-height: 7vh; display: block; overflow-y: auto; background-image: url(lot.jpg); text-align: center;}
a.stopka {text-decoration: none; font-size: 0.8rem;  line-height: 1.6rem; color: black;}
a.stopka2 {text-decoration: none; font-size: 0.95rem; font-weight: 600; line-height: 2rem; color: black;}
}