@import url('https://fonts.googleapis.com/css2?family=Advent+Pro:ital,wght@0,100;0,200;0,600;0,800;1,100;1,200;1,600&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@font-face {
    font-family: 'Bachelorette';
    src: url('/up/fonts/bachelorette.otf'),  url('/up/fonts/bachelorette.ttf');
}
@font-face {
    font-family: 'Bestigia-regular';
    src: url('/up/fonts/bestigia-regular.otf'),  url('/up/fonts/bestigia-regular.ttf');
}
@font-face {
    font-family: 'Big_noodle_titling';
    src: url('/up/fonts/big_noodle_titling.otf'),  url('/up/fonts/big_noodle_titling.ttf');
}
@font-face {
    font-family: 'Big_noodle_titling_oblique';
    src: url('/up/fonts/big_noodle_titling_oblique.otf'),  url('/up/fonts/big_noodle_titling_oblique.ttf');
}
@font-face {
    font-family: 'Chunkfive-ex';
    src: url('/up/fonts/chunkfive-ex.otf'), url('/up/fonts/chunkfive-ex.ttf');
}
@font-face {
    font-family: 'Heavitas';
    src: url('/up/fonts/heavitas.otf'), url('/up/fonts/heavitas.ttf');
}
html{
    font-family: 'Advent Pro', sans-serif;
    overflow-x:hidden;
}
body{
    overflow-x: hidden;
    font-family: 'Advent Pro', sans-serif;
}
.App {
  text-align: center;
}

.App-logo {
  height: 40vmin;
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  .App-logo {
    animation: App-logo-spin infinite 20s linear;
  }
}

.App-header {
  background-color: #282c34;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: calc(10px + 2vmin);
  color: white;
}

.App-link {
  color: #61dafb;
}

@keyframes App-logo-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.navi1Active{
  background:#fea549;
  color:#fff;
}
.navi1{
  text-decoration: none;
  color:#777;
  -webkit-transition: all .5s ease-out;
  -moz-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}
.navi1 svg{
  text-decoration: none;
  color:#777;
  -webkit-transition: all .5s ease-out;
  -moz-transition: all .5s ease-out;
  -o-transition: all .5s ease-out;
  transition: all .5s ease-out;
}
.navi1:hover{
  color:#fea549;
}
.navi1:hover svg{
  color:#fea549;
}
#wyszukiwarka{
  border-radius: 15px;
}
.wyszukiwarka{
  background:#fea549
}
.bgDark{
  background:#333;
  color:#fff;
}
.flex-column .navi1{
  margin-top:2%;
}
.btn-main{
  background:#fea549 !important;
  color:#fff !important;
  -webkit-transition: all 1.5s ease-out !important;
  -moz-transition: all 1.5s ease-out !important;
  -o-transition: all 1.5s ease-out !important;
  transition: all 1.5s ease-out !important;
}
.btn-main:hover{
  background:#b6722e !important;
}
.formularzInput{
  background:none;
  border-top:none !important;
  border-left:none !important;
  border-right:none !important;
}
h1, h2, h3, h4{
  font-family: 'Advent Pro', sans-serif;
  font-weight: bold;
}
body{
  font-family: 'Advent Pro', sans-serif;
}
.grey{
  color:#666;
}
.greyBG{
  background:#ccc;
  border-top:solid 1px #333;
  border-bottom:solid 2px #777;
}
.btn-orange{
  background:#fea549 !important;
  -webkit-transition: all .8s ease-out !important;
  -moz-transition: all .8s ease-out !important;
  -o-transition: all .8s ease-out !important;
  transition: all .8s ease-out !important;
}
.btn-orange:hover{
  background:#b6722e !important;
}
.produktGlowna .showOnHover{
  display:none;
  -webkit-transition: all .8s ease-out !important;
  -moz-transition: all .8s ease-out !important;
  -o-transition: all .8s ease-out !important;
  transition: all .8s ease-out !important;
}
.produktGlowna:hover .showOnHover{
  display:block;
}
.opisKategoria{
  border-top: solid 2px #fea549;
  background:#fff4e8;
}
.minG{
  opacity:0.4;
  cursor:pointer;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.minG:hover{
  opacity:1;
}
.minGenActive{
  border:solid 1px #ccc !important;
  opacity:1 !important;
}
.addGenBtn{
  cursor:pointer;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.addGenBtn:hover{
  background:#eee;
}
.txtOrange{
  color:#fea549;
}
.oknoIlosci{
  border:solid 1px #fea549;
  border-radius:10px;
}
.wyborRozmiaru{
  border: solid 1px #ccc !important;
  background: none;
  cursor:pointer;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.wyborRozmiaru:hover{
  border-color: #fea549 !important;
  color:#fea549;
}
.wyborRozmiaruNadruku{
  border: solid 1px #ccc !important;
  background: none;
  cursor:pointer;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.wyborRozmiaruNadruku:hover{
  border-color: #fea549 !important;
  color:#fea549;
}
.aktywnyWyborRozmiaru{
  background:#fea549;
  color:#fff;
  border:none;
}
.pointer{
  cursor:pointer;
}
.wyborRozmiaruNadrukuAktywne{
  background:#fea549;
  color:#fff;
  border:none !important;
}
.resetRozmiaru{
  background:#777;
  color:#fff;
  cursor:pointer;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.resetRozmiaru:hover{
  background:#fea549;
  color:#fff;
  border:none !important;
}
#podgladowe{
  position:relative;
}
.nakladki{
  position: relative;
  margin-top: -100%;
  z-index: 1;
}
.podpowiedzGrafiki{
  opacity:0.6;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.podpowiedzGrafiki:hover{
  opacity: 1;
  cursor: pointer;
}
.przestrzenRobocza{
  position: relative;
  z-index: 2;
}
.dragEl{
  z-index: 3;
}
.btn-genPlace{
  background:rgba(0, 0, 0, 0.6);
  opacity:0.2;
  color:#fff;
  z-index: 10;
  font-size: 20pt;
  border-radius:5px;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.btn-genPlace:hover{
  background:rgba(0, 0, 0, 0.8);
  opacity:1;
  cursor:pointer;
}
.btn-rotate{
  float:right;
  margin-top:-15px;
  margin-right:-15px;
  opacity:0.2;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.btn-drag{
  float:left;
  margin-top:-15px;
  margin-left:-15px;
  opacity:0.2;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.btn-drag:hover{
  opacity:1;
}
.rotate90{
  transform:rotate(90deg) !important;
}
.btn-save{
  float:left;
  margin-top:-15px;
  margin-left:15px;
  opacity:0.2;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.btn-save:hover{
  opacity:1;
}
.dragEl{
  cursor:pointer;
}
.react-draggable .showOnHover{
  opacity:0.1;
  background:rgba(0, 0, 0, 0.1);
  color:#fff;
  border-radius:5px;
  font-size:20pt;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
  cursor:pointer;
}
.react-draggable:hover .showOnHover{
  opacity:1;
  background:rgba(0, 0, 0, 0.7);
}
.btn-przeskok{
  background:rgba(0, 0, 0, 0.2);
  border:none;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.btn-przeskok:hover{
  background:rgba(0, 0, 0, 0.6);
}
.btn-place{
  background:none;
  border:none;
  margin:1px;
  background-color:rgba(0, 0, 0, 0.3);
  color:#fff;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.btn-place:hover{
  background-color:rgba(0, 0, 0, 0.8);
}
.swal2-popup{
  z-index: 999999999999999999999999999999999999999999999;
}
.descSlide{
    margin-top: -50%;
    z-index: 999;
    position: relative;
    background:rgba(0, 0, 0, 0.4);
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
    width: 40%;
    margin-left:10%;
    color:#fff;
    padding:5%;
}
.descSlide:hover{
    background:rgba(0, 0, 0, 0.9);
}
#slider{
    border-bottom: solid 1px #fea549;
}
.contactBG{
    min-height:500px;
    background-size: cover !important;
    background-attachment: fixed !important;
}
.contactDesc{
    padding-top:10%;
    text-align: center;
    color:#fff;
    background:rgba(0, 0, 0, 0.7);
    padding-bottom:5%;
}
footer{
    background:#282c34;
    color:#fff;
}
.blogDesc{
    background:rgba(0, 0, 0, 0.1);
    color:#fff;
    padding:5px 15px;
    position: relative;
    margin-top: -100px;
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.blogStart:hover{
    transform: rotate(5deg);
}
.blogStart:hover .blogDesc{
    background:rgba(0, 0, 0, 0.8);
}
.minG{
    opacity:0.4;
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.minG:hover{
    opacity:1;
}
.minGactive{
    opacity:1 !important;
}
.border-orange{
    border:solid 1px #fea549;
}
.border-orange-top{
    border-top: solid 1px #fea549; 
}
.bg-orange{
    background:#fea549;
    color:#fff;
}
.pointerBtn{
    cursor: pointer;
    background: rgba(0, 0, 0, 0.1);
    padding:5px 15px;
    border-radius:5px;
    color:#fff;
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.pointerBtn:hover{
    background:rgba(0, 0, 0, 0.9);
}
.nawigacjaR{
    padding: 15px 0;
    color:#fea549;
    cursor:pointer;
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.nawigacjaR:hover{
    background:#fea549;
    color:#fff;
}
#boxNakladki{
    position: absolute !important;
}
.dragEl{
    cursor:pointer;
    z-index: 2147483647;
}
.dragEl .dragTxt {
    position: absolute !important;
    z-index: 9999999;
}
.podpowiedzGrafika{
    opacity:0.5;
    cursor:pointer;
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.podpowiedzGrafika:hover{
    opacity:1;
}
.swal2-container{
    position: fixed !important;
    z-index: 999999999999999999999 !important;
    height: 100%;
}
.text-orange{
    color:#fea549;
}
.border-y-orange{
    border-bottom:solid 1px #fea549;
    border-top:solid 1px #fea549;
}
.pointerBtnOrange{
    cursor:pointer;
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.pointerBtnOrange:hover{
    color:#b6722e;
}
.aktywnyWyborRozmiar {
    color: #333;
    background: #fff;
}
button.btn.btn-rozmiarowka {
  border: solid 1px #fea549;
  margin: 0 1px;
  border-radius: 2px;
  cursor:pointer;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
button.btn.btn-rozmiarowka:hover{
  background:#fea549;
  color:#fff;
  border-color:#fea549
}
button.btn.btn-rozmiarowka.btn-rozmiarowkaWybrana{
  background:#333;
  color:#fff;
  border-color:#fea549;
}
.btnKolor {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  margin-right:5px;
}
.wyborKoloru{
  cursor:pointer;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
  padding:5px 2px;
}
.wyborKoloru:hover{
  background:#b6722e24;
}
.wyborKoloruAktywny{
  background:#d69a5d78;
}
.noBtn{
  border:none;
  background:none;
}
.btn-dostawa{
  opacity:0.4;
  cursor:pointer;
  -webkit-transition: all .4s ease-out !important;
  -moz-transition: all .4s ease-out !important;
  -o-transition: all .4s ease-out !important;
  transition: all .4s ease-out !important;
}
.btn-dostawa:hover{
  opacity:1;
  transform: scale(110%);
}
.btn-dostawaAktywne{
  opacity:1 !important;
  transform: scale(110%);
}
.btnKategoria a{
    text-decoration: none;
    color:#333;
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.btnKategoria{
    text-decoration:none;
    color:#333;
    padding:20px 0;
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.btnKategoriaPodrzedna{
    display: none;
}
.btnKategoria:hover{
    background:#b6722e;
}
.btnKategoria:hover a{
    padding-left:5%;
    color:#fff;
}
.btnKategoriaPodrzedna{
    margin-left:5%;
    width:95%;
    border-top:solid 1px rgba(255, 255, 255, 0.1);
}
.btnKategoriaPodrzedna:hover{
    background:#fea549;
}
.btnKategoria:hover.btnKategoriaPodrzedna{
    display:flex;
}
.btnKategoria:hover .btnKategoriaPodrzedna {
    display: block;
}
.aktywnaKategoria{
    background:#b6722e;
    padding-left:10%;
}
.aktywnaKategoria a{
    color:#fff;
}
.alert-lightOrange{
    background:#ffecd9;
}
.btn-hide{
    position: absolute;
    top: 5px;
    right: 5px;
    color: #fea549;
    background: rgba(0, 0, 0, 0.1);
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.btn-hide:hover{
    background: rgba(0, 0, 0, 0.8);
    transform:scale(90%);
    color:#fff;
}
.aktywnaKategoria .btnKategoriaPodrzedna{
    display:flex !important;
}
.wybranaPodrzedna{
    background:#fea549;
    padding-left:5%;
}
.blogLink{
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.blogLink:hover{
    transform:rotate(3deg) scale(105%);
}
.blogLink a{
    text-decoration: none;
    color:#333;
    -webkit-transition: all .4s ease-out !important;
    -moz-transition: all .4s ease-out !important;
    -o-transition: all .4s ease-out !important;
    transition: all .4s ease-out !important;
}
.blogLink:hover a{
    color:#fea549;
}