/* Styl dla szerokości ekranu poniżej 600px *//*
@media screen and (max-width: 600px) {
  body {    font-size: 16px;  }
  .header {    background-color: #333;  }
  .menu {    display: none;  }
}*/

/* Styl dla szerokości ekranu pomiędzy 601px a 900px *//*
@media screen and (min-width: 601px) and (max-width: 900px) {
  body {    font-size: 18px;  }
  .header {    background-color: #555;  }
  .menu {    display: block;  }
}*/

/* Styl dla szerokości ekranu powyżej 900px *//*
@media screen and (min-width: 901px) {
  body {   font-size: 20px;  }
  .header {   background-color: #777;  }
  .menu {    display: block;  }
}*/

.grey1 {	background-color: #f4eadc;}
.grey2 {	background-color: #efe8e3;}
.grey3 {	background-color: #e3dfda;}
.grey4 {	background-color: #dbd8d2;}

div.center-pos {position: inherit; text-align: center; width:100%;}
.col-7{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}
.container{max-width:1520px; width:100%;}

/*--------- Site navigation --------------------*//**/
.site-navigation{text-align:right; }
.site-navigation > ul{ display:inline-block;}
.site-navigation .main-menu {list-style:none; margin:0; padding:0;   }
.site-navigation .main-menu li{list-style:none; display:inline-block; padding:0px 10px; position:relative;}
.site-navigation .main-menu li a{display:block; color:#000000; padding:0px 5px; font-weight:500; font-size:16px; font-family: 'Poppins', sans-serif; line-height: 90px; position:relative;}
.site-navigation .main-menu > li > a:after{background: var(--main-color); height: 2px; width:0; position: absolute; bottom: 28px; content: ""; left:5px; -webkit-transition:all 400ms; transition:all 400ms;}
.site-navigation .main-menu > li > a:hover:after, .site-navigation .main-menu > li.active > a:after{width:calc(100% - 10px);}
.site-navigation .main-menu .sub-menu{position:absolute; opacity:0; top:100%; visibility:hidden; background:#ffffff; -webkit-box-shadow:0px 6px 5px 0px rgba(0, 0, 0, 0.25); box-shadow:0px 6px 5px 0px rgba(0, 0, 0, 0.25); left:0; width:240px; text-align:left; -webkit-transform:translateY(50px);  transform:translateY(50px); -webkit-transition:all 400ms; transition:all 400ms; padding:10px;  }
.site-navigation .main-menu li:hover .sub-menu{opacity:1; visibility:visible;  -webkit-transform:translateY(0px); transform:translateY(0px);  }
.site-navigation .main-menu .sub-menu li{display:block; padding:12px 0px; border-bottom:1px solid #c7c7c7;}
.site-navigation .main-menu .sub-menu li:last-child{border:none; font-size:14px;  }
.site-navigation .main-menu .sub-menu li a{display:block; line-height:1; padding:0;   }
.site-navigation .main-menu .sub-menu li a:hover, .site-navigation .main-menu .sub-menu li:hover a{color:var(--main-color); }

.site-navigation .header-social-media {list-style:none; margin:0; padding:0; position:relative; margin-left:15px;   }
.site-navigation .header-social-media li{list-style:none; display:inline-block; margin:0px 10px; position:relative;}
.site-navigation .header-social-media li a {display:block; color:#000000; line-height: 90px;}
.site-navigation .header-social-media li a:hover, .site-navigation .header-social-media li:hover a{color:var(--main-color); }
/*--------- Light Header --------------------*/
.variation-slider .owl-nav{position: absolute; top: 50%; width: 100%;}
.variation-slider .owl-nav button.owl-prev, .variation-slider .owl-nav button.owl-next{position: absolute; left: -100px; transform: translateY(-50%);}
.variation-slider .owl-nav button.owl-next{left:auto; right:-100px;  }

.variation-slider .owl-dots{margin:0; padding:0; text-align:center;}
.variation-slider .owl-dots .owl-dot{display:inline-block; position: relative; width: 32px; height: 32px; background:var(--main-color); margin: 0px 8px; }
.variation-slider .owl-dots .owl-dot:before, .variation-slider .owl-dots .owl-dot.active:before {display:none;}
.variation-slider .owl-dots .owl-dot.active{left:auto !important; animation: ripple 1s linear infinite;  }
.variation-slider .owl-dots .owl-dot.blue{background:#0178e6; }
.variation-slider .owl-dots .owl-dot.red{background:#d10300; }
.variation-slider .owl-dots .owl-dot.gray{background:#5f5f5f;}







/* Przykład responsywnego obrazka */
.responsive-image {
  max-width: 100%;
  height: auto;
}

/* Przykład układu kolumnowego dla telefonów komórkowych */
.column {
  width: 100%;
}

/* Przykład układu kolumnowego dla większych ekranów */
@media screen and (min-width: 601px) {
  .column {
    width: 50%;
    float: left;
  }
}