/*-------------------------------------------------------------------------------------------------*/

header, section, footer, aside, nav, main, article, figure {display: block;}
html {height: 100%; box-sizing: border-box;}
*, *:before, *:after {box-sizing: inherit;}

/*-------------------------------------------------------------------------------------------------*/

body
{
	margin: 0;
	background-color: #fff6e1;
	color: black;
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
}

/*-------------------------------------------------------------------------------------------------*/

 a {outline: none; text-decoration: none;}

/*IE10 isse ---------------------------------------------------------------------------------------*/

img {
	border:none !important; /*IE shit*/
	width: 100%;
	height: auto;
}
/*-------------------------------------------------------------------------------------------------*/

.row {
  margin:0px;
  padding:0px;
  border:0px;
  position:relative;
  overflow: hidden;
  padding-bottom: 44px; 
  /*wysokość = min. 100% wys. okna*/
  min-height: 100vh;  
}
.row::after {
    content: "";
    clear: both;
    display: block;
}

/* CSS STRONA  =======================================================*/

/* webkit-scrollbar --------------------------------------------------------------------------------------------------*/
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

::-webkit-scrollbar-thumb {
	background-color: #c6be40; /*brudny zolty*/
}

::-webkit-scrollbar-track {
    box-shadow: inset 0px 0px 2px rgba(200,200,200,1);
}

::-webkit-scrollbar-track-piece {
	background-color: #e5e5e5;
}

.container {
	float: none !important;
    margin-left: auto;
    margin-right: auto;
	margin-bottom: 0px;	
    margin-top: 60px;
}
/* zmiany do 766 px*/
@media only screen and (max-width: 766px){.container {margin-top:50px;}}

/* NAVBAR ===========================================================*/

.navbar {
	z-index: 20;
	position:fixed;
	top:0;
	left:0;
	width: 100%;
	height: 60px;
	border-bottom: solid 1px yellow;
	/* zolty cien 
	box-shadow: #ffff006e 0px 24px 0px 0px;
	-moz-box-shadow: #ffff006e 0px 24px 0px 0px;
	-webkit-box-shadow: #ffff006e 0px 24px 0px 0px;*/
	
	/* gradient tlo*/
	background: #09d26c; /*jasna zielen*/
		/*gradient tla*/
	background: -moz-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9EFE5E), color-stop(35%, #09d26c), color-stop(100%, #52fef2)); /* safari4+,chrome */
	background: -webkit-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* ie10+ */
	background: linear-gradient(166deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9EFE5E', endColorstr='#52fef2',GradientType=0 ); /* ie6-9 */
}
/*zmiany do 766px*/
@media only screen and (max-width: 766px){.navbar{height: 50px;}}

/* nabar down JS animacja */

/* box dla menu + krzyzyk */
.navbar-box {height: 60px;}
/*.navbar-box = zmiany do 766px*/
@media only screen and (max-width: 766px){.navbar-box{height:50px;}}

/*zmiany do 766px*/
@media only screen and (max-width: 766px){
	.navbar-box, #navbarBox{
		text-align:center !important;
		padding:0px !important;
		margin:0px !important;
	}
}
.navbar-bottom {
	z-index: 19;
	position:fixed;
	top:60px;
	left:0;
	width: 100%;
	height: 24px;
	background: yellow;
	opacity: 0.5;
}
/*zmiany do 766px*/
@media only screen and (max-width: 766px){.navbar-bottom{top: 50px;}}

/* zmiana dla "Oferta" "O nas" "Kontakt" */
.navbar-bottom-color {
	background-color: #032410 !important; /*ciemna zielen*/
	opacity: 1 !important;
}

.navbar-1, .navbar-2, .navbar-3{
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	letter-spacing: 0.2em;
	outline: none;
	text-decoration: none;	
	width: 100%;
}

/* ----------------------------------------
    navbar-1 = txt "MENU"*/
	
.navbar-1 {
	/*button*/
	width: 132px;
    height: 60px;
    border: none;
	background: transparent;
	
	color:#0A1817; /*ciemna zielen*/
	text-align: left;
	font-size: 16px;
	cursor: pointer;	
	
	/*wplyw na tlo-up*/
	padding-top: 19px;
	padding-bottom: 18px;
    padding-left: 18px;
    padding-right: 0px;
}
/*zmiany do 766px*/
@media only screen and (max-width: 766px){.navbar-1{
	font-size: 28px;
    padding: 0px 0px 0px 18px;
    margin: 0 !important;
    width: 183px;
    height: 50px;;
	}
}

/* ----------------------------------------
    navbar-2 = "STOLARSTWO KOPYTO"*/
	
.navbar-2 {text-align: center;}
/*.navbar-2 = zmiany do 766px*/
@media only screen and (max-width: 776px){.navbar-2 h1{font-size:18px;}}

.navbar-2 h1 {
	display: inline-block;
	font-size: 20px;
	color:yellow;	
	/*wplyw na tlo-up*/
	padding-bottom: 16px;
    padding-left: 18px;
    padding-right: 12px;
    padding-top: 16px;
	margin: 0;
}
/*.navbar-2 = zmiany do 766px*/
@media only screen and (max-width: 766px){
	.navbar-2 h1{
	color: #0A1817 !important;
	padding:0 !important;
	}
}
/* ----------------------------------------
    napis "Stolarstwo Kopyto" dla mobi */
	
#navbar-2-A{
	display:block;
	font-size:18px;
    padding: 0px;
	margin: 0;
	color:#0A1817 !important; /*ciemna zielen*/	
}
/*zmiany od 767px*/
@media only screen and (min-width: 767px){#navbar-2-A {display:none !important;}}
/*zmiany do 767px*/
@media only screen and (max-width: 766px){#navbar-2-B{display:none !important;}}

.navbar-3 {
	text-align: right;
	padding-top: 0px;	
	height: 60px;
	float:right !important;
}
/*zmiany do 766px*/
@media only screen and (max-width: 766px){.navbar-3{display:none;}}
/*zmiany od 767px*/
@media only screen and (min-width: 767px){.navbar-3{padding-right: 0;}}
@media only screen and (min-width: 840px){.navbar-3{padding-right: 20px;}}

/* ----------------------------------------
    navbar = JĘZYK */
	
.navbar-3 ol li {
  color:#0A1817; /*ciemna zielen*/
  font-size: 15px;
  letter-spacing: 3px;
  list-style-type: none;
  display: inline-block;
  /*wymiar hover tla + polozenie*/
  padding: 18px 10px 21px 10px;
  margin: -17px 0px 0px -5px;
}
.navbar-3 ol li:hover {color: #14835b; /*zielen*/}
.navbar-3 img {
  vertical-align: middle;
  height: 18px;
  width: auto;
  padding: 0;
  margin: 0px;
}
.navbar-3 ol li a {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
/* koniec navbar = wybor jezyka*/

/* ----------------------------------------
    navbar-1 MENU > KRZYZYK*/
	
/* krzyzyk = widok staly*/
.bars{
	display: inline-block;
	width: 43px;
	height: 28px;
	overflow: hidden;
	position: relative;
	vertical-align: middle;
	padding-left: 5px;
}
.bar{
	display: block;
	position: absolute;
	width: 18px;
	height: 2px;
	background-color: #1a1a1a;

	-webkit-transition: 375ms;
	-moz-transition: 375ms;
	-o-transition: 375ms;
	transition: 375ms;
	-webkit-transition-property: top, opacity;
	-moz-transition-property: top, opacity;
	-o-transition-property: top, opacity;
	transition-property: top, opacity;
}
.bar:nth-child(1){
	top: 6px;
	opacity: 1;
	-webkit-transition-delay: 125ms;
	-moz-transition-delay: 125ms;
	-o-transition-delay: 125ms;
	transition-delay: 125ms;
}
.bar:nth-child(2){
	top: 12px;
	-webkit-transition-delay: 80ms;
	-moz-transition-delay: 80ms;
	-o-transition-delay: 80ms;
	transition-delay: 80ms;
}
.bar:nth-child(3){
	top: 18px;
	-webkit-transition-delay: 40ms;
	-moz-transition-delay: 40ms;
	-o-transition-delay: 40ms;
	transition-delay: 40ms;
}
.bar:nth-child(4){
	top: 24px;
	opacity: 0;
	-webkit-transition-delay: 0ms;
	-moz-transition-delay: 0ms;
	-o-transition-delay: 0ms;
	transition-delay: 0ms;
}/*koniec widok staly krzyzyk*/

/*widok hover krzyzyk*/
.navbar-box:hover .bar:nth-child(1){
	top: 0px;
	opacity: 0;
	-webkit-transition-delay: 0ms;
	-moz-transition-delay: 0ms;
	-o-transition-delay: 0ms;
	transition-delay: 0ms;

}
.navbar-box:hover .bar:nth-child(2){
	top: 6px;
	-webkit-transition-delay: 40ms;
	-moz-transition-delay: 40ms;
	-o-transition-delay: 40ms;
	transition-delay: 40ms;
}
.navbar-box:hover .bar:nth-child(3){
	top: 12px;
	-webkit-transition-delay: 80ms;
	-moz-transition-delay: 80ms;
	-o-transition-delay: 80ms;
	transition-delay: 80ms;
}
.navbar-box:hover .bars .bar:nth-child(4){
	top: 18px;
	opacity: 1;
	-webkit-transition-delay: 125ms;
	-moz-transition-delay: 125ms;
	-o-transition-delay: 125ms;
	transition-delay: 125ms;
}/*koniec widok hover krzyzyk*/

/*widok po kliknieciu menu button = krzyzyk*/
.krzyzykON .bar:nth-child(1){
	top: 12px;
	-webkit-transform-origin:50% 50%;
	-moz-transform-origin:50% 50%;
	-ms-transform-origin:50% 50%;
	-o-transform-origin:50% 50%;
	transform-origin:50% 50%;

	-webkit-transform: rotate(45deg) scaleX(1.442);
	-moz-transform: rotate(45deg) scaleX(1.442);
	-ms-transform: rotate(45deg) scaleX(1.442);
	-o-transform: rotate(45deg) scaleX(1.442);
	transform: rotate(45deg) scaleX(1.442);

	opacity: 1;
	
	-webkit-transition-delay: 0ms;
	-moz-transition-delay: 0ms;
	-o-transition-delay: 0ms;
	transition-delay: 0ms;
	
	-webkit-transition-property: top, -webkit-transform;
	-moz-transition-property: top, -moz-transform;
	-o-transition-property: top, -o-transform;
	transition-property: top, transform;
}
.krzyzykON .bar:nth-child(2){
	top: 12px;
	opacity: 0;
	-webkit-transition-delay: 0ms;
	   -moz-transition-delay: 0ms;
	     -o-transition-delay: 0ms;
	        transition-delay: 0ms;
}
.krzyzykON .bar:nth-child(3),
.krzyzykON .navbar-box:hover .bars .bar:nth-child(3){
	top: 12px;
	-webkit-transform-origin:50% 50%;
	   -moz-transform-origin:50% 50%;
	    -ms-transform-origin:50% 50%;
	     -o-transform-origin:50% 50%;
	        transform-origin:50% 50%;
	-webkit-transform: rotate(-45deg) scaleX(1.442);
	   -moz-transform: rotate(-45deg) scaleX(1.442);
	     -ms-transform: rotate(-45deg) scaleX(1.442);
	     -o-transform: rotate(-45deg) scaleX(1.442);
	        transform: rotate(-45deg) scaleX(1.442);
	-webkit-transition-delay: 0ms;
	   -moz-transition-delay: 0ms;
	     -o-transition-delay: 0ms;
	        transition-delay: 0ms;
	-webkit-transition-property: top, -webkit-transform;
	   -moz-transition-property: top, -moz-transform;
	     -o-transition-property: top, -o-transform;
	        transition-property: top, transform;
}
.krzyzykON .bar:nth-child(4){
	top: 24px;
	opacity: 0;
	-webkit-transition: 0ms;
	   -moz-transition: 0ms;
	     -o-transition: 0ms;
	        transition: 0ms;
	-webkit-transition-delay: 0ms;
	   -moz-transition-delay: 0ms;
	     -o-transition-delay: 0ms;
	        transition-delay: 0ms;
}/*koniec widok po kliknieciu krzyzyk*/

/* koniec NAVBAR --------------------------------------------------------------------------------------------------------*/

/* LISTA MENU ===========================================================*/
#black {
	visibility:hidden;
	/* gradient*/

	background:#34ecba;
	background: -moz-linear-gradient(0deg, #57e965 0%, #50fdee 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, #57e965), color-stop(100%, #50fdee)); /* safari4+,chrome */
	background: -webkit-linear-gradient(0deg, #57e965 0%, #50fdee 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(0deg, #57e965 0%, #50fdee 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(0deg, #57e965 0%, #50fdee 100%); /* ie10+ */
	background: linear-gradient(90deg, #57e965 0%, #50fdee 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#57e965', endColorstr='#50fdee',GradientType=1 ); /* ie6-9 */	
	
	/* rozmieszczenie*/
	z-index:19;
	position: fixed;
	top:0;
	bottom:0;
	left:390px;
	right:0;
	
	opacity:1;
	
	/* pozycja schowany = po prawej  */
    -webkit-transform: translate(100%, 0);
    -moz-transform: translate(100%, 0);
    -o-transform: translate(100%, 0);
    transform: translate(100%, 0);
	
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    -o-transition-property: -o-transform, opacity;
    transition-property: transform, opacity;
	
    transition-duration: 0.5s, 3.5s;	
    -o-transition-duration: 0.5s, 3.5s;	
    -moz-transition-duration: 0.5s, 3.5s;	
    -webkit-transition-duration: 0.5s, 3.5s;	
}
/* black = opacity */
.bOpc {opacity:0.92 !important;}

/*zmiany do 767px*/
@media only screen and (max-width: 766px) {
	#black {
	opacity: 0 !important;
    visibility: hidden !important;}
}
#menuListTlo {
	border-right: solid 1px yellow;	
	background:#0A1817;
	opacity:0.92;
	z-index: 21;
}
.menu-list, #menuListTlo {
	visibility: hidden;
	position: fixed;
	height: 100%;
	width: 390px;
    top: 60px;
	left: 0;	
}
/*zmiany do 767px*/
@media only screen and (max-width: 766px){
	.menu-list, #menuListTlo{
		width: 100%;
		border:0;
		top:74px;
		}
}
.menu-list {z-index: 22; overflow:auto;}

.menu-list ul {
	margin-top:0px;
	padding-left: 20px;
	margin-bottom: 100px;
}
/*zmiany do 330px*/
@media only screen and (max-width: 330px){.menu-list ul {padding-left:0;}}

.menu-list ul li {
	list-style-type: none;
	font-variant: small-caps;
	color: white;
    font-family: Open Sans, sans-serif;
    font-size: 25px;
    letter-spacing: 6px;
	
	padding: 12px 6px 12px 20px;
    margin: 0px;
	
	position: relative;
}
.menu-list ul li a {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

/* Ruch od Lewej do Prawej 
	lista menu 
	lista menu = tlo 
	lista menu = wpisy */
#menuListTlo, .menu-list, .menu-list ul li {
	/* czas ruch */
	-webkit-transition-duration: 500ms;
    -moz-transition-duration: 500ms;
    -o-transition-duration: 500ms;
    transition-duration: 500ms;
	
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
	
	/* pozycja schowany = po lewo */
    -webkit-transform: translate(-100%, 0);
    -moz-transform: translate(-100%, 0);
    -o-transform: translate(-100%, 0);
    transform: translate(-100%, 0);
}

/* aktywator JS menu lista > wpisy*/
.mLeft,
.mLeft ul li {
	/* pozycja 0 */
	-webkit-transform: translate(0, 0) !important;
    -moz-transform: translate(0, 0) !important;
    -ms-transform: translate(0, 0) !important;
    -o-transform: translate(0, 0) !important;
    transform: translate(0, 0) !important;
}
/* Menu = "Kontakt" */
.menu-list ul li:nth-child(11) {
	transition-delay: 0.1s;
    -o-transition-delay: 0.1s;	
    -moz-transition-delay: 0.1s;
	-webkit-transition-delay: 0.1s;
}
/* Menu = "Rozne" */
.menu-list ul li:nth-child(10) {
	transition-delay: 0.2s;
    -o-transition-delay: 0.2s;	
    -moz-transition-delay: 0.2s;
	-webkit-transition-delay: 0.2s;
}
/* Menu = "Schody" */
.menu-list ul li:nth-child(9) {
	transition-delay: 0.3s;
    -o-transition-delay: 0.3s;	
    -moz-transition-delay: 0.3s;
	-webkit-transition-delay: 0.3s;
}
/* Menu = "Drzwi Wewnetrzne" */
.menu-list ul li:nth-child(8) {
	transition-delay: 0.4s;
    -o-transition-delay: 0.4s;	
    -moz-transition-delay: 0.4s;
	-webkit-transition-delay: 0.4s;
}
/* Menu = "Drzwi Zewnetrzne" */
.menu-list ul li:nth-child(7) {
	transition-delay: 0.5s;
    -o-transition-delay: 0.5s;	
    -moz-transition-delay: 0.5s;
	-webkit-transition-delay: 0.5s;
}
/* Menu = "Oferta" */
.menu-list ul li:nth-child(6) {
	transition-delay: 0.6s;
    -o-transition-delay: 0.6s;	
    -moz-transition-delay: 0.6s;
	-webkit-transition-delay: 0.6s;
}
/* Menu = "O nas" */
.menu-list ul li:nth-child(5) {
	transition-delay: 0.7s;
    -o-transition-delay: 0.7s;	
    -moz-transition-delay: 0.7s;
	-webkit-transition-delay: 0.7s;
}
/* Menu = "Start" */
.menu-list ul li:nth-child(4) {
	transition-delay: 0.8s;
    -o-transition-delay: 0.8s;	
    -moz-transition-delay: 0.8s;
	-webkit-transition-delay: 0.8s;
	
	margin-top: 82px;
}
/* Menu = "Jezyk" */
.menu-list ul li:nth-child(3),
.menu-list ul li:nth-child(2),
.menu-list ul li:nth-child(1) {
	/* pozycja schowany = po lewo */
    -webkit-transform: translate(-150%, 0);
    -moz-transform: translate(-150%, 0);
    -ms-transform: translate(-150%, 0);
    -o-transform: translate(-150%, 0);
    transform: translate(-150%, 0);
	
	transition-delay: 0.9s;
    -o-transition-delay: 0.9s;	
    -moz-transition-delay: 0.9s;
	-webkit-transition-delay: 0.9s;
	
	position: absolute !important; /*wymagane*/
	margin-top: -58px;
	font-size: 0;
    letter-spacing: 0;
	width: 100%;
}
.menu-list ul li:nth-child(3) {
    padding: 17px 20px 17px 20px;
	margin-left:183px;
	z-index: 25
}
.menu-list ul li:nth-child(2) {
	padding: 17px 20px 17px 20px;
	margin-left:90px;
	z-index: 24
}
.menu-list ul li:nth-child(1) {
    padding: 17px 20px 17px 20px;
    z-index: 23;
}

.menu-list ul li img {height:24px; width: auto;}
/* ---------------------------------------
	lista menu = oferta */

.menu-list ul li:nth-child(7), /* Menu = "Drzwi Zewnetrzne" */
.menu-list ul li:nth-child(8), /* Menu = "Drzwi Wewnetrzne" */
.menu-list ul li:nth-child(9), /* Menu = "Schody" */
.menu-list ul li:nth-child(10) /* Menu = "Rozne" */ {font-size: 20px; padding-left: 40px;}

.menu-list ul li:nth-child(7) {margin-top: 10px !important;}
.menu-list ul li:nth-child(10) {margin-bottom: 10px !important;} 

/* ---------------------------------------
	lista menu = staly kolor linka  = zalezne do strony */
.active {color: yellow;}

/* koniec LISTA MENU ------------------------------------------------------------------------------------------------*/

/* OKRUCH ===========================================================*/

/*zmiany do 767px*/
@media only screen and (max-width: 766px){.okruch, .okruch-tlo, .okruch-box {display:none;}}

.okruch, .okruch-tlo,
.okruch2, .okruch-tlo2 {
	z-index: 11;
	position:absolute;
	bottom:45px;
	left:0;
	width: 100%;
	height: 24px;
}
.okruch-tlo {
	background: yellow;
	opacity: 0.5;	
}
.okruch ul, .okruch2 ul {
	margin: 0;
    padding: 0;
    text-align: center;	
	list-style-type: none;
}
.okruch ul li, .okruch2 ul li {
	display: inline-block;
}
.okruch ul li:nth-child(2), .okruch ul li:nth-child(4),
.okruch2 ul li:nth-child(2), .okruch2 ul li:nth-child(4) {
	margin-left: 5px;
	margin-right: 5px;
}

.okruch ul li a, .okruch ul li,
.okruch2 ul li a, .okruch2 ul li {
	font-variant: small-caps;
	font-family: Montserrat, sans-serif;
	font-weight: 600;
	letter-spacing: 3px;
	font-size: 16px;
	color: #415849; /* wyprana zielen, ciemna */

	/*czas kolor*/	
	transition-property: color;
	transition-duration: 0.3s;
	transition-timing-function: ease;
	
	-o-transition-property: color;
	-o-transition-duration: 0.3s;
	-o-transition-timing-function: ease;
	
	-moz-transition-property: colo;
	-moz-transition-duration: 0.3s;
	-moz-transition-timing-function: ease;
	
	-webkit-transition-property: color;
	-webkit-transition-duration: 0.3s;
	-webkit-transition-timing-function: ease;	
}

.okruch ul li a:hover, .okruch ul li:last-child a:hover{color:#14835b; /*zielony*/}
.okruch ul li:last-child a {color:#0A1817; /*ciemna zielen*/;}


/* zmiany dla "Oferta", "O Nas", "Kontakt" */

.okruch-box {
	position: relative;
    height: 24px;
    clear: both;
	z-index: -1;
}
.z-index1 {z-index: 1;}

.okruch-tlo2 { 
	background-color: #032410 !important; /*zielony ciemny*/
	opacity: 1 !important;
}
.bottom-0 {bottom:0;}
	
.okruch2 ul li a, .okruch2 ul li {color: #85b7a2 !important; /* szaro-zielony */}
.okruch2 ul li a:hover, .okruch2 ul li:last-child a:hover {color:#14d981 !important; /*zielony jasny*/}
.okruch2 ul li:last-child a {color: yellow !important;}

/* koniec OKRUCH ---------------------------------------------------------------------------------------------------*/

/* FOOTER ===========================================================*/

.footer {
  /*stopka zawsze na dole strony*/
  overflow: hidden;
  z-index: 22;
  position: absolute;
  left:0;
  right: 0;
  bottom: 0;
  height: 45px;
  padding: 8px 16px 0 16px;
  border-top: solid 1px yellow; /*zolty*/
  
	/*gradient tlo */
 	background: #09d26c; /*jasna zielen*/
		/*gradient tla*/
	background: -moz-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9EFE5E), color-stop(35%, #09d26c), color-stop(100%, #52fef2)); /* safari4+,chrome */
	background: -webkit-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* ie10+ */
	background: linear-gradient(166deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9EFE5E', endColorstr='#52fef2',GradientType=0 ); /* ie6-9 */
}
@media only screen and (max-width: 672px){.footer{padding: 8px 8px 0px 8px;}}

.footer-p-static {	position: static;}

.fot-box1 {width:45%; float: left;}
.fot-box2 {width:55%; float: right;}

.proart-box {
	z-index: 10;	
	position: relative;
	padding:0;
	text-align: right;
}
/* zmiany do 672 px*/
@media only screen and (max-width: 672px){
	.proart-box{
	/*centrowanie*/
	text-align: right;
	bottom: 0;
	right:0;
    left: 50%;
    transform: translate(-50%, 0%);
    -o-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    -moz-transform: translate(-50%, 0%);
    -webkit-transform: translate(-50%, 0%);
}}
.proart-box-span1, .fot-box1 span {
	font-family: Montserrat, sans-serif;
	font-weight: 200;
	letter-spacing: 3px;
	font-size: 13px;
	color: black;
}
.proart-box-span2 {
	font-family: Open Sans, sans-serif;
	font-weight: 600;
	letter-spacing: 4px;
	font-size: 12px;
	color: #284695;
}
.proart-box-js {
	/*JavaScript triger = ruch lewo-prawo*/
	/*Ruch od prawej*/
	
	transform: translateX(200px);
	-o-transform: translateX(200px);
	-ms-transform: translateX(200px);
	-moz-transform: translateX(200px);
	-webkit-transform: translateX(200px);	
} 
.proart-box-js2  {
	/*JavaScript triger = ruch lewo-prawo*/
	/* czas = animacja */
	transition-property: transform;
	transition-duration: 0.7s;
	transition-timing-function: ease;
	
	-o-transition-property: -o-transform;
	-o-transition-duration: 0.7s;
	-o-transition-timing-function: ease;
	
	-moz-transition-property: -moz-transform;
	-moz-transition-duration: 0.7s;
	-moz-transition-timing-function: ease;
	
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-duration: 0.7s;
	-webkit-transition-timing-function: ease;
}
/*koniec FOOTER -------------------------------------------------------------------------------------------------------------*/

/* OFERTA ================================================================*/

.ofe-row{
	/* dla .row = wplyw na footer*/
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
/* zmiany do szer okna px*/
@media only screen and (max-width: 766px){.ofe-row {position: relative;}}

.ofe-wrap {overflow: hidden;}

@media only screen and (max-width: 766px){.ofe-wrap {
	margin-bottom: 30px;	
}}
.ofe-container {
	position: absolute;
    float: none !important;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
} 
@media only screen and (max-width: 766px){.ofe-container {
	/* do 766  px*/
	position: relative !important;
	width: 100%;
	top: 0%;
    left: 0%;
    transform: translate(0%, 0%);
	margin-bottom: 69px;
    margin-top: 96px;
}}
@media only screen and (min-width: 767px) {/*od 767 px PIONOWO*/.ofe-container {width: 82%;}}
@media only screen and (min-width: 767px) and (orientation: landscape){/*od 767 px POZIOMO*/.ofe-container {width: 80vh;}}

/* OFERTA = KAFELEK */
.ofe-box-wrap {
	/* rotate = punk odniesienia*/
    perspective: 1000px;
    -moz-perspective: 1000px;
	-webkit-perspective: 1000px;
	
    transform-style: preserve-3d;	
    -moz-transform-style: preserve-3d;	
    -webkit-transform-style: preserve-3d;	
	
	float:left;
	/*rozmiar kafelka > centrowanie do img*/	
    padding-bottom: 44%;
    height: 0;
    width: 44%;
    margin: 3%;
	
	/* dla flip rotate*/
	position: relative;
	
	/* narozniki */
	border-bottom-right-radius: 17%;
    border-top-left-radius: 17%;	
}
/* OFERTA = FRONT kafelek */
.flip {	
	/*dla flip*/
    transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;

    transition: 0.6s;
    -o-transition: 0.6s;
    -moz-transition: 0.6s;
    -webkit-transition: 0.6s;
		
	/*pozycja kafelka dla flip rotate */
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;	
}
/* dla .flip */
.verte {
	/* ukryj odbicie lustrzane po rotate */	
    backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;		
}

/* OFERTA = BACK kafelek */
.flip2 {
	cursor: pointer;
	/*wymiar*/
    padding-bottom: 100%;
    height: 0;
    width: 100%;
    margin: 0%;
	/*narozniki*/
    border-bottom-right-radius: 17%;
    border-top-left-radius: 17%;	
	
    background: #0cd472; /*zielony*/
	/*tlo = gradient*/
	background: -moz-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9EFE5E), color-stop(35%, #09d26c), color-stop(100%, #52fef2));
    background: -webkit-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%);
    background: -o-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%);
    background: -ms-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%);
    background: linear-gradient(166deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9EFE5E', endColorstr='#52fef2',GradientType=0 );
}
/* specjalnie dla IE txt box */
.IEshit {
	display: none;
	
	z-index: 3;
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;	
	
	opacity:0;
}
.IEshit, .ofe-box-wrap:hover .IEshit {
	transition-property: opacity;
    transition-duration: 0.6s;
	transition-timing-function: ease;	
}	
.ofe-box-wrap:hover .IEshit {opacity:1;}
/* koniec = specjalnie dla IE txt box */

/* OFERTA > BACK = TXT */
.flip-txt {
	/*G-R-D-L*/
	padding: 10% 0% 0% 0%;	
	width: 93%;
	
    margin-left: auto;
    margin-right: auto;	

    color: #0a1817; /*ciemna zielen*/
	font-variant: small-caps;
	font-family: Montserrat, sans-serif;
	font-weight: 600;
	letter-spacing: 0.2em;
	font-size: 15px;
}
@media only screen and (min-width: 340px){/* od 340 px*/ .flip-txt {width: 88%;}}
@media only screen and (min-width: 360px){/* od 360 px*/ .flip-txt {font-size:16px;}}
@media only screen and (min-width: 375px){/* od 375 px*/ .flip-txt {font-size:17px;}}
@media only screen and (min-width: 410px){/* od 410 px*/ .flip-txt {font-size:20px;}}
@media only screen and (min-width: 490px){/* od 490 px*/ .flip-txt {font-size:23px;}}
@media only screen and (min-width: 570px){/* od 570 px*/ .flip-txt {font-size:27px;}}
@media only screen and (min-width: 650px){/* od 650 px */ .flip-txt {font-size: 32px;}}
@media only screen and (min-width: 767px) {/* od 767 px  PIONOWO*/ .flip-txt {font-size: 2.5vw; width: 89%; padding:8% 0% 0% 0%;}}
@media only screen and (min-width: 767px) and (orientation:landscape){/* od 767 px */ .flip-txt {font-size: 1.67vh; width: 89%; padding:10% 0% 0% 0%;}}

.flip-txt h2 {color: yellow;	font-size: 21px; margin-bottom: 10%;}
@media only screen and (min-width: 360px){/* od 360 px */.flip-txt h2 {font-size: 23px;}}
@media only screen and (min-width: 375px){/* od 375 px */.flip-txt h2 {font-size: 24px;}}
@media only screen and (min-width: 410px){/* od 410 px */.flip-txt h2 {font-size: 26px;}}
@media only screen and (min-width: 490px){/* od 490 px */.flip-txt h2 {font-size: 30px;}}
@media only screen and (min-width: 570px){/* od 570 px */.flip-txt h2 {font-size: 36px;}}
@media only screen and (min-width: 767px){/* od 767 px PIONOWO */.flip-txt h2 {font-size: 2.25vw;}}
@media only screen and (min-width: 767px) and (orientation:landscape){/* od 767 px POZIOMO*/ .flip-txt h2 {font-size: 2.3vh;}}

.flip-txt p { padding-left: 4%; line-height: 1.4;}

@media only screen and (min-width: 767px) {/*od 767 px PIONOWO*/.flip-txt p {padding-left: 6%;line-height: 1.2;font-size: 1.84vw;}}	
@media only screen and (min-width: 767px) and (orientation:landscape){/* od 767 px POZIOMO*/.flip-txt p {padding-left: 6%; line-height: 1.5; font-size: 1.84vh;}}

.flip-txt-3 {
	padding: 5% 0% 0% 0%;
	width: 85%;
}
@media only screen and (min-width: 338px){/* od 360 px */.flip-txt-3 {padding: 8% 0% 0% 0%;}}
@media only screen and (min-width: 360px){/* od 360 px */.flip-txt-3 {padding: 9% 0% 0% 0%;}}
@media only screen and (min-width: 700px){/* od 700 px */.flip-txt-3 {padding: 10% 0% 0% 0%;}}
@media only screen and (min-width: 767px){/* od 767 px */.flip-txt-3 {padding: 8% 0% 0% 0%;}}
.flip-txt-3 h2{margin-bottom: 5%;}
@media only screen and (min-width: 650px){/* od 650 px */.flip-txt-3 h2{margin-bottom: 7%;}}
@media only screen and (max-width: 649px){/* do 649 px */.flip-txt-3 p{line-height: 1.3;}}
@media only screen and (min-width: 650px){/* od 650 px */.flip-txt-3 p{line-height: 1.0 !important;}}
@media only screen and (min-width: 767px){/* od 767 px */.flip-txt-3 p{line-height: 1.0; padding-left: 5%;}}

.flip-txt-4 {padding: 7% 0% 0% 0%; width: 85%; font-size: 15px;}
@media only screen and (min-width: 360px){/* od 360 px */.flip-txt-4 {font-size: 16px; width:82%;}}
@media only screen and (min-width: 375px){/* od 375 px */.flip-txt-4 {font-size: 17px; width:85%;}}
@media only screen and (min-width: 410px){/* od 375 px */.flip-txt-4{font-size: 19px;}}
@media only screen and (min-width: 490px){/* od 490 px */.flip-txt-4{font-size: 23px;}}
@media only screen and (min-width: 570px){/* od 570 px */.flip-txt-4{font-size: 26px;}}
@media only screen and (min-width: 650px){/* od 650 px */.flip-txt-4{font-size: 30px;}}
@media only screen and (min-width: 700px){/* od 700 px */.flip-txt-4{font-size: 33px;}}
@media only screen and (min-width: 767px) {/* od 767 px PIONOWO */.flip-txt-4{font-size: 1.75vw;}}
@media only screen and (min-width: 767px) and (orientation:landscape){/* od 767 px */.flip-txt-4{font-size: 1.5vh;}}
@media only screen and (min-width: 767px){/* od 767 px */.flip-txt-4 h2 {margin-bottom: 0%;}}

.flip-txt-4 p {padding-left: 0%;	line-height: 1.0;}
@media only screen and (min-width: 360px){/* od 360 px */.flip-txt-4 p{padding-left: 3%;}}
@media only screen and (min-width: 650px){/* od 650 px */.flip-txt-4 p{line-height: 1.2;}}
/* koniec flip-txt */

@media only screen and (min-width: 767px){
	/* od 767 px */
	.ofe-box-wrap:hover .flip {
    transform: rotateY(20deg);
    -o-transform: rotateY(20deg);
    -ms-transform: rotateY(20deg);
    -moz-transform: rotateY(20deg);
    -webkit-transform: rotateY(20deg);
}}
/* JS > flip back*/
.flip-MINUS-180 {
	transform: rotateY(-180deg) !important;
    -o-transform: rotateY(-180deg) !important;
    -ms-transform: rotateY(-180deg) !important;
    -moz-transform: rotateY(-180deg) !important;
    -webkit-transform: rotateY(-180deg) !important;
}
/* JS > flip front*/
.flip-PLUS-180 {
	transform: rotateY(180deg) !important;
    -o-transform: rotateY(180deg) !important;
    -ms-transform: rotateY(180deg) !important;
    -moz-transform: rotateY(180deg) !important;
    -webkit-transform: rotateY(180deg) !important;
}
/* OFERTA > kafelk BACK > krzyzyk*/
.flip-back-close {
	z-index: 10;
	position: absolute;
    bottom: 1%;
    left: 1%;
    width: 10%;
    height: 10%;
    background: yellow;
	
	padding:0;
	margin: 0;
}
.flip-bar-rotate {
    position: relative;
    width: 100%;
    height: 100%;
}
.flip-bar-rotate90 {
	transform: rotate(90deg);
	-o-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	
	transition-property: transform;
	-o-transition-property: transform;
	-moz-transition-property: transform;
	-webkit-transition-property: transform;
	
	transition-duration: 0.1s;
	-o-transition-duration: 0.1s;
	-moz-transition-duration: 0.1s;
	-webkit-transition-duration: 0.1s;

	transition-timing-function: ease;
	-o-transition-timing-function: ease;
	-moz-transition-timing-function: ease;
	-webkit-transition-timing-function: ease;
}
.flip-bar {
	display: inline-block;
	
    position: absolute;
    top: 46%;
    left: 7%;

    width: 85%;
    height: 3%;
    padding: 2px;
    margin: 0;
	
    background-color: #5b7164; /*blada zielen*/
}
.flip-bar, .flip-back-close:hover .flip-bar {
	transition-property: background-color;
	transition-duration: 0.3s;
	transition-timing-function: ease;

	-o-transition-property: background-color;
	-o-transition-duration: 0.3s;
	-o-transition-timing-function: ease;

	-moz-transition-property: background-color;
	-moz-transition-duration: 0.3s;
	-moz-transition-timing-function: ease;

	-webkit-transition-property: background-color;
	-webkit-transition-duration: 0.3s;
	-webkit-transition-timing-function: ease;
}
.flip-back-close:hover .flip-bar { background-color: #1a1a1a; /*ciemna zielen*/}

.flip-bar:nth-child(1) {
	transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}	
.flip-bar:nth-child(2) {
	transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
/* OFERTA = link kafelka */
.a-ofe {
	display:block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9 !important;
    border-bottom-right-radius: 17%;
    border-top-left-radius: 17%;
}
/* OFERTA = kafelek FRONT*/
.ofe-box {
	float: left;
	position: relative;
	overflow: hidden;
	cursor: pointer;

	/*rozmiar box-img = stosunek do .ofe-box-wrap*/
	padding-bottom: 100%; /*wysokosc boxa*/
	height: 0;
	width: 100%;
    margin: 0%;
	/*narozniki*/
    border-bottom-right-radius: 17%;
    border-top-left-radius: 17%;	
	
	/* gradient tlo*/
	background: #09d26c; /*jasna zielen*/
		/*gradient tla*/
	background: -moz-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9EFE5E), color-stop(35%, #09d26c), color-stop(100%, #52fef2)); /* safari4+,chrome */
	background: -webkit-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* ie10+ */
	background: linear-gradient(166deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9EFE5E', endColorstr='#52fef2',GradientType=0 ); /* ie6-9 */
}
/* zmiany do 766 px*/
@media only screen and (max-width: 766px){.ofe-box-wrap {
	width: 94%;
	padding-bottom: 94%;
}}
.ofe-box img {
  margin-left: auto;
  margin-right: auto;	
 
  /* centrowanie IMG,
  cropp jesli szerokosc okna mniejsza niz IMG,
  responsywnosc IMG*/
  position: absolute; 
  height: 100.2%;
  width: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);	
  -moz-transform: translate(-50%, -50%);	
  -webkit-transform: translate(-50%, -50%);	
}
.ofe-scale {
	position: absolute;
	height: 100%;
	width: 100%;		
	opacity: 0;	
	
	/* scale 1.14 */
	-webkit-transform: scale(1.14,1.14);
	-moz-transform: scale(1.14,1.14);
	-ms-transform: scale(1.14,1.14);
	-o-transform: scale(1.14,1.14);
	transform: scale(1.14,1.14);	
}
.ofe-showSlide {
	/*JAVASCRIPT triger, animacja slide tla  */
	opacity: 1; z-index: 2;
	
	/* scale 1.0 */
	-webkit-transform: scale(1,1);
	-moz-transform: scale(1,1);
	-ms-transform: scale(1,1);
	-o-transform: scale(1,1);
	transform: scale(1,1);
	
	/* czas = zoom + opacity */
	transition-property:transform, opacity;
	transition-duration: 6s, 2s;
	transition-timing-function: linear;
	
	-o-transition-property:-o-transform, opacity;
	-o-transition-duration: 6s, 2s;
	-o-transition-timing-function: linear;
	
	-moz-transition-property:-moz-transform, opacity;
	-moz-transition-duration: 6s, 2s;
	-moz-transition-timing-function: linear;
	
	-webkit-transition-property:-webkit-transform, opacity;
	-webkit-transition-duration: 6s, 2s;
	-webkit-transition-timing-function: linear;
} 
/* Oferta > START STRONY = pozycja hidden */
#ofeBox1, #ofeBox2 {
	transform: translateY(430%); 
	-o-transform: translateY(430%);
	-ms-transform: translateY(430%);
	-moz-transform: translateY(430%);
	-webkit-transform: translateY(430%);	
}
#ofeBox3, #ofeBox4 {
	transform: translateY(330%);
	-o-transform: translateY(330%);
	-moz-transform: translateY(330%);
	-webkit-transform: translateY(330%);	
}
/* OFERTA > START STRONY  = WSPOLNE*/
#ofeBox1, #ofeBox2, #ofeBox3, #ofeBox4 {
	/* Czas oczekiwania + rodzaj przejscia */
	transition-property: transform;
	-o-transition-property: -o-transform;
	-moz-transition-property: -moz-transform;
	-webkit-transition-property: -webkit-transform;

	transition-duration: 0.7s;
    -o-transition-duration: 0.7s;
    -moz-transition-duration: 0.7s;
    -webkit-transition-duration: 0.7s;	
	
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.45, 1.29);
    -o-transition-timing-function: cubic-bezier(0.68, -0.55, 0.45, 1.29);
    -moz-transition-timing-function: cubic-bezier(0.68, -0.55, 0.45, 1.29);
    -webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.45, 1.29);
}

/* Oferta > START STRONY = pozycja 0 */
/* Oferta > kafelki UP = WSPOLNE*/
.ofe-box-up1, .ofe-box-up2, .ofe-box-up3, .ofe-box-up4 {
	/* Czas oczekiwania + rodzaj przejscia */

	transform: translateY(0%) !important;
	-o-transform: translateY(0%) !important;
	-ms-transform: translateY(0%) !important;
	-moz-transform: translateY(0%) !important;
	-webkit-transform: translateY(0%) !important;	
	
	transition-delay: 0.7s !important;
	-o-transition-delay: 0.7s !important;
	-moz-transition-delay: 0.7s !important;
	-webkit-transition-delay: 0.7s !important;
}
/* OFERTA > START STRONY > kafelki = UP*/
.ofe-box-up1 {
    transition-duration: 1.0s !important;
    -o-transition-duration: 1.0s !important;
    -moz-transition-duration: 1.0s !important;
    -webkit-transition-duration: 1.0s !important;
}
.ofe-box-up2 {
    transition-duration: 1.5s !important;
    -o-transition-duration: 1.5s !important;
    -moz-transition-duration: 1.5s !important;
    -webkit-transition-duration: 1.5s !important;
}
.ofe-box-up3 {
    transition-duration: 2.0s !important;
    -o-transition-duration: 2.0s !important;
    -moz-transition-duration: 2.0s !important;
    -webkit-transition-duration: 2.0s !important;
}
.ofe-box-up4 {
    transition-duration: 2.5s !important;
    -o-transition-duration: 2.5s !important;
    -moz-transition-duration: 2.5s !important;
    -webkit-transition-duration: 2.5s !important;
}
/*koniec OFERTA -------------------------------------------------------------------------------------------------------------*/

/* O NAS ==================================================================*/

.onas-row {
	overflow: hidden;
	
	margin: 0px;
    padding: 0px;
    border: 0px;

	margin-top: 150px;
	min-height: calc(100vh - 195px);
}
/* zmiany od 767 px*/
@media only screen and (min-width: 767px){.onas-row{
    margin-top: 170px;
	/* dla footer zawsze na dole strony
	(100% wysokosci okna - (170px margin-top + 45px footer height + 24 okruch height))
	*/	
    min-height: calc(100vh - 239px);
}}

.onas-box {
	z-index: 0;
	overflow: hidden; /*dla txt ruch w lewo-prawo*/
	float: none !important;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	
	width: 100%;
	max-width: 1000px !important;
	/* dla footer na dole (opis w .onas-row)*/
	min-height: calc(100vh - 195px);	
	
	/* txt ukryty */
	transform: translateY(110%); 		
	-o-transform: translateY(110%); 		
	-moz-transform: translateY(110%); 		
	-webkit-transform: translateY(110%); 

	/* czas DOWN */
	transition-duration: 0.5s;
	-o-transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-webkit-transition-duration: 0.5s;
	
    transition-timing-function: ease-in-out;	
    -o-transition-timing-function: ease-in-out;	
    -moz-transition-timing-function: ease-in-out;	
    -webkit-transition-timing-function: ease-in-out;	
	
	/* gradient tlo*/
	background: #09d26c; /*jasna zielen*/
		/*gradient tla*/
	background: -moz-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9EFE5E), color-stop(35%, #09d26c), color-stop(100%, #52fef2)); /* safari4+,chrome */
	background: -webkit-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(284deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* ie10+ */
	background: linear-gradient(166deg, #9EFE5E 0%, #09d26c 35%, #52fef2 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9EFE5E', endColorstr='#52fef2',GradientType=0 ); /* ie6-9 */	
}
/* zmiany od 767 px*/
@media only screen and (min-width: 767px){.onas-box{
	width: 81%;
	/* dla footer na dole (opis w .onas-row)*/
	min-height: calc(100vh - 239px);	
}}
@media only screen and (min-width: 884px){.onas-box{width: 80%;}}
@media only screen and (min-width: 938px){.onas-box{width: 75%;}}
@media only screen and (min-width: 1130px){.onas-box{width: 100%;}}

/* JS triger
	.onas-box, kontakt
	ruch UP = START strony*/
.txt-box-UP {
	transform: translateY(0%);
	-o-transform: translateY(0%);	
	-moz-transform: translateY(0%);
	-webkit-transform: translateY(0%);
	
    transition-property: transform;
    -o-transition-property: -o-transform;
    -moz-transition-property: -moz-transform;
    -webkit-transition-property: -webkit-transform;
	
    transition-duration: 1.0s;
    -o-transition-duration: 1.0s;
    -moz-transition-duration: 1.0s;
    -webkit-transition-duration: 1.0s;
	
	transition-delay: 1.0s;
	-o-transition-delay: 1.0s;
	-moz-transition-delay: 1.0s;
	-webkit-transition-delay: 1.0s;
	
    transition-timing-function: ease-in-out;	
    -o-transition-timing-function: ease-in-out;	
    -moz-transition-timing-function: ease-in-out;	
    -webkit-transition-timing-function: ease-in-out;	
}

.onas-rog {
	background-color: #032410; /*ciemna zielen*/
	float: right;
	width: 8%;
	padding-bottom: 8%;
	
	/* schowaj */
	transform: translate(101%, -101%);
	-o-transform: translate(101%, -101%);
	-moz-transform: translate(101%, -101%);
	-webkit-transform: translate(101%, -101%);		
}
.onas-txt-tlo {
	z-index: -1;
	overflow: hidden;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 8%;
	margin-top: 8%;
	background-color: #032410; /*ciemna zielen*/
	
	/* schowaj */
	transform: translate(-101%, 110%);
	-o-transform: translate(-101%, 110%);
	-moz-transform: translate(-101%, 110%);
	-webkit-transform: translate(-101%, 110%);
}

.onas-txt-tlo img {
  opacity: 0.1;	
  /* centrowanie IMG,
  cropp jesli szerokosc okna mniejsza niz IMG,
  responsywnosc IMG*/
  position: absolute; 
  width: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);	
  -moz-transform: translate(-50%, -50%);	
  -webkit-transform: translate(-50%, -50%);	
}
.onas-txt {
	clear: both;
	position: relative;
	overflow: hidden;
	
	font-family: Montserrat, sans-serif;
	font-weight: 200;
	font-size: 16px;
	color: white;
	
    margin-right: 8%;
	
    padding: 4% 4%;
    letter-spacing: 1px;	
    text-align:left;

	/* schowaj */
	transform: translate(-101%, 110%);
	-o-transform: translate(-101%, 110%);
	-moz-transform: translate(-101%, 110%);
	-webkit-transform: translate(-101%, 110%);
}
.onas-txt p{text-indent: 4%; line-height: 2;}
.onas-txt p:nth-child(2), .onas-txt p:nth-child(8) {text-indent: 0% !important;}
.onas-txt p:nth-child(2) {margin-top: 0;}
.onas-txt h2 {font-size: 19px; margin-bottom:3px;}

/* zmiany od 359 px*/
@media only screen and (min-width: 359px){.onas-txt{
    text-align: justify;
}}/* zmiany od 767 px*/
@media only screen and (min-width: 767px){.onas-txt{
	letter-spacing: 3px;	
	padding: 6% 8%;
}}

.overflow-visible {overflow:visible !important;}

/*koniec O NAS ---------------------------------------------------------------------------------------------------------------*/

/* KONTAKT ================================================================*/

.address {font-style: inherit !important;}

.kon-txt {
	clear: both;
	position: relative;
	overflow: hidden;
	
	font-family: Montserrat, sans-serif;
	font-weight: 200;
	font-size: 16px;
	color: white;
	
    margin-right: 8%;
	
    padding: 4% 4%;
    letter-spacing: 1px;	
    text-align:left;

	/* schowaj */
	transform: translate(-101%, 110%);
	-o-transform: translate(-101%, 110%);
	-moz-transform: translate(-101%, 110%);
	-webkit-transform: translate(-101%, 110%);
}
.kon-txt p{line-height: 2;}
.kon-txt h2 {
	font-size:30px;
	margin-top: 0;
}

/* zmiany od 359 px*/
@media only screen and (min-width: 359px){.kon-txt{
    text-align: justify;
}}/* zmiany od 767 px*/
@media only screen and (min-width: 767px){.kon-txt{
	letter-spacing: 3px;	
	padding: 6% 8%;
}}
/* dla adresu m a i l */
.kon-txt ul {
    padding: 0;
	margin-top: 16px;
	margin-bottom: 0px;
}
.kon-txt ul li,
.kon-txt ul li ul,
.kon-txt ul li:nth-child(3) ul li {
	list-style-type: none;
	display: inline;
}	
.kon-txt ul li:nth-child(1) {margin-right: -6px;} /*"e - m a i l"*/
.kon-txt ul li:nth-child(3) ul li {margin-right: -6px;}
.kon-txt ul li ul li:nth-child(1) {margin-right: -6px;} /* "biuro" lub "lider" */

/* dla linkow */
.kon-txt ul li:nth-child(3){position: relative;}
.kon-txt ul li a {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
.kon-txt a {color: white;}
.kon-txt a:hover,
.kon-txt ul li:nth-child(3):hover {color:#70f062; /* jasna zielen */}

.map {
	position: relative;
	
	height: 100%;
	width: 90%;
    margin-left: 1%;	
	
	/* schowaj */
	transform: translate(-101%, 110%);
	-o-transform: translate(-101%, 110%);
	-moz-transform: translate(-101%, 110%);
	-webkit-transform: translate(-101%, 110%);	
}
.map-link {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin-bottom: 4px;
}

/* JS triger
	.onas-box / .kon-txt
	START strony*/
.txt-tlo-RIGHT, .txt-RIGHT, .rog-LEFT, .map-RIGHT {
	transform: translate(0%, 0%);
	-o-transform: translate(0%, 0%);
	-moz-transform: translate(0%, 0%);
	-webkit-transform: translate(0%, 0%);
	
	transition-property: transform;
	-o-transition-property: transform;
	-moz-transition-property: transform;
	-webkit-transition-property: transform;
	
    transition-duration: 0.7s;
    -o-transition-duration: 0.7s;
    -moz-transition-duration: 0.7s;
    -webkit-transition-duration: 0.7s;

    transition-delay: 1.6s;
    -o-transition-delay: 1.6s;
    -moz-transition-delay: 1.6s;
    -webkit-transition-delay: 1.6s;
	
    transition-timing-function: ease-in-out;
    -o-transition-timing-function: ease-in-out;
    -moz-transition-timing-function: ease-in-out;
    -webkit-transition-timing-function: ease-in-out;
}

/*koniec KONTAKT ------------------------------------------------------------------------------------------------------------*/

/* GALERIA - animacja dogrywania scroll ==============================================*/

.wrap-galeria{overflow: hidden;} /* dla ukrytych miniaturek */

.container-hide1 {
	/* GALERIA = CLOSE strony*/
	transform: translateY(101%);
	-o-transform: translateY(101%);
	-ms-transform: translateY(101%);
	-moz-transform: translateY(101%);
	-webkit-transform: translateY(101%);
} 
.card {
	position: relative;
	overflow: hidden;
	cursor: pointer;

	/*rozmiar box-img*/
	margin: 0;
	height: 100%; 
}

.card img {
  margin-left: auto;
  margin-right: auto;	
 
  /* centrowanie IMG,
  cropp jesli szerokosc okna mniejsza niz IMG,
  responsywnosc IMG*/
  position: absolute; 
  height: 100.1%;
  width: auto;
  top: 50%;
  left: 50%;
  
  transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}
/* div odpowiada za scale img*/
.scale{
  position: absolute;
  height: 100%;
  width: 100%;
}
/* zmiany od 767 px*/
@media only screen and (min-width: 767px){.card:hover .scale {
  transform: scale(1.3,1.3);
  -o-transform: scale(1.3,1.3);
  -ms-transform: scale(1.3,1.3);		
  -moz-transform: scale(1.3,1.3);		
  -webkit-transform: scale(1.3,1.3);
}}
.scale, .card:hover .scale {
  /* Czas dla scale. Dla 1.0 oraz 1.3*/	
  transition-property: transform;
  transition-duration: 1.3s;
  transition-timing-function: ease;

  -o-transition-property: transform;
  -o-transition-duration: 1.3s;
  -o-transition-timing-function: ease;	

  -moz-transition-property: transform;
  -moz-transition-duration: 1.3s;
  -moz-transition-timing-function: ease;

  -webkit-transition-property: transform;
  -webkit-transition-duration: 1.3s;
  -webkit-transition-timing-function: ease;		
}

.fade-content > *{
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  -ms-transition-property: opacity, transform;
  transition-property: opacity, transform;
  
  -webkit-transition-duration: 0.3s, 0.7s;
  -moz-transition-duration: 0.3s, 0.7s;
  -ms-transition-duration: 0.3s, 0.7s;
  -o-transition-duration: 0.3s, 0.7s;
  transition-duration: 0.3s, 0.7s;
  
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  -ms-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;	
}

/* GALERIA = Czas opoznienia pokazywania sie img od dolu */
/* zmiany od 767 px*/
@media only screen and (min-width: 767px){
	.fade-content > *:nth-child(3n+1) {transition-delay: 0.1s; -o-transition-delay: 0.1s;	-moz-transition-delay: 0.1s;	-webkit-transition-delay: 0.1s;}
	.fade-content > *:nth-child(3n+2) {transition-delay: 0.2s; -o-transition-delay: 0.2s;	-moz-transition-delay: 0.2s;	-webkit-transition-delay: 0.2s;}
	.fade-content > *:nth-child(3n+3) {transition-delay: 0.4s; -o-transition-delay: 0.4s;	-moz-transition-delay: 0.4s; 	-webkit-transition-delay: 0.4s;}
}
/* GALERIA zmiany od 991 px*/
@media only screen and (min-width: 991px){
	.fade-content > *:nth-child(4n+1) {transition-delay: 0.1s; -o-transition-delay: 0.1s;	-moz-transition-delay: 0.1s;
	-webkit-transition-delay: 0.1s;}
	.fade-content > *:nth-child(4n+2) {transition-delay: 0.2s; -o-transition-delay: 0.2s;	-moz-transition-delay: 0.2s;
	-webkit-transition-delay: 0.2s;}
	.fade-content > *:nth-child(4n+3) {transition-delay: 0.3s; -o-transition-delay: 0.3s;	-moz-transition-delay: 0.3s;
	-webkit-transition-delay: 0.3s;}
	.fade-content > *:nth-child(4n+4) {transition-delay: 0.5s; -o-transition-delay: 0.5s;	-moz-transition-delay: 0.5s;
	-webkit-transition-delay: 0.5s;}
}
/* GALERIA = zmiany od 1400 px*/
@media only screen and (min-width: 1400px){
	.fade-content > *:nth-child(5n+1) {transition-delay: 0.1s; -o-transition-delay: 0.1s;	-moz-transition-delay: 0.1s;
	-webkit-transition-delay: 0.1s;}
	.fade-content > *:nth-child(5n+2) {transition-delay: 0.2s; -o-transition-delay: 0.2s;	-moz-transition-delay: 0.2s;
	-webkit-transition-delay: 0.2s;}
	.fade-content > *:nth-child(5n+3) {transition-delay: 0.3s; -o-transition-delay: 0.3s;	-moz-transition-delay: 0.3s;
	-webkit-transition-delay: 0.3s;}
	.fade-content > *:nth-child(5n+4) {transition-delay: 0.35s; -o-transition-delay: 0.35s;	-moz-transition-delay: 0.35s;
	-webkit-transition-delay: 0.35s;}
	.fade-content > *:nth-child(5n+5) {transition-delay: 0.4s; -o-transition-delay: 0.4s;	-moz-transition-delay: 0.4s;
	-webkit-transition-delay: 0.4s;}
}
/* GALERIA = zmiany od 1800 px*/
@media only screen and (min-width: 1800px){
	.fade-content > *:nth-child(6n+1) {transition-delay: 0.1s; -o-transition-delay: 0.1s;	-moz-transition-delay: 0.1s;
	-webkit-transition-delay: 0.1s;}
	.fade-content > *:nth-child(6n+2) {transition-delay: 0.2s; -o-transition-delay: 0.2s;	-moz-transition-delay: 0.2s;
	-webkit-transition-delay: 0.2s;}
	.fade-content > *:nth-child(6n+3) {transition-delay: 0.25s; -o-transition-delay: 0.25s;	-moz-transition-delay: 0.25s; 	-webkit-transition-delay: 0.25s;}
	.fade-content > *:nth-child(6n+4) {transition-delay: 0.3s; -o-transition-delay: 0.3s;	-moz-transition-delay: 0.3s;
	-webkit-transition-delay: 0.3s;}
	.fade-content > *:nth-child(6n+5) {transition-delay: 0.4s; -o-transition-delay: 0.4s;	-moz-transition-delay: 0.4s;
	-webkit-transition-delay: 0.4s;}
	.fade-content > *:nth-child(6n+6) {transition-delay: 0.5s; -o-transition-delay: 0.5s;	-moz-transition-delay: 0.5s;
	-webkit-transition-delay: 0.5s;}
}
/* GALERIA = box dla zoltego paska */
.card-tlo-up, .card-tlo-left {
	z-index:10;
	margin: 0;
    height: 0;
    padding-bottom: 152%;
    overflow: hidden;
}	
/*koniec GALERIA ------------------------------------------------------------------------------------------------------------*/

/* ANIMACJE - rozwijane tlo =====================================================*/

/* --------------------------------------------------
    navbar (gorna belka)= hover w gore zolte tlo
	card-tlo-up (img galeria) = hover w gore zolte tlo
	tlo-right (lista-menu) = hover od prawej
	--------------------------------------------------
*/

/* WSPOLNE */
.navbar-tlo-up, .card-tlo-up, .card-tlo-left, .tlo-right {
  position: relative;
  vertical-align: middle;

  -webkit-transform: perspective(1px) translateZ(0);
  -moz-transform: perspective(1px) translateZ(0);
  -ms-transform: perspective(1px) translateZ(0);
  -o-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  /*czas kolor txt*/
  -webkit-transition-property: color;
  -moz-transition-property: color;
  -o-transition-property: color;
  transition-property: color;
  
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
/* WSPOLNE  kolor tla i polozenie*/
.navbar-tlo-up:before, .card-tlo-up:before, .card-tlo-left:before, .tlo-right:before {
  background: yellow; /*zolty*/
  
  position: absolute;
  content: "";
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
/* do GORY */
.navbar-tlo-up:before, .card-tlo-up:before {
  /* 0% tlo = kierunek = od dolu do gory */ 
  -webkit-transform: scaleY(0);
  -moz-transform: scaleY(0);
  -ms-transform: scaleY(0);
  -o-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -o-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  /* koniec = kierunek = od dolu do gory */ 
}
/* od PRAWEJ */	
.tlo-right:before {
  /* od prawej do lewej */
  -webkit-transform: scaleX(0);
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  -o-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 100% 50%;
  -moz-transform-origin: 100% 50%;
  -ms-transform-origin: 100% 50%;
  -o-transform-origin: 100% 50%;
  transform-origin: 100% 50%;
  /* koniec od prawej do lewej */
}
/* od LEWEJ */	
.card-tlo-left:before {
  /* od prawej do lewej */
  -webkit-transform: scaleX(0);
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  -o-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: -100% 50%;
  -moz-transform-origin: -100% 50%;
  -ms-transform-origin: -100% 50%;
  -o-transform-origin: -100% 50%;
  transform-origin: -100% 50%;
  /* koniec od prawej do lewej */
}
/* WSPOLNE = czas */
.navbar-tlo-up:before, .card-tlo-up:before, .card-tlo-left:before, .tlo-right:before {
  -webkit-transition-property: transform;
  -moz-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
/* card-tlo-up = zmiana wartosci*/
.card-tlo-up:before {
  left: 90%;
  opacity: 0.7;
}
.card-tlo-left:before {
    bottom: 93%;
	opacity: 0.7;
}

/* hover = kolor txt*/
.navbar-tlo-up:hover, .navbar-tlo-up:focus, .navbar-tlo-up:active,
.card-tlo-up:hover, .card-tlo-up:focus, .card-tlo-up:active {color: #14835b;/*zielen txt*/}
.tlo-right:hover, .tlo-right:focus, .tlo-right:active, .tlo-right:hover .active {color: black;}

/* WSPOLNE =  hover before = 100% tlo*/
.navbar-tlo-up:hover:before, .navbar-tlo-up:focus:before, .navbar-tlo-up:active:before,
.card-tlo-up:hover:before, .card-tlo-up:focus:before, .card-tlo-up:active:before,
.card-tlo-left:hover:before, .card-tlo-left:focus:before, .card-tlo-left:active:before,
.tlo-right:hover:before, .tlo-right:focus:before, .tlo-right:active:before {
  -webkit-transform: scaleY(1);
  -moz-transform: scaleY(1);
  -ms-transform: scaleY(1);
  -o-transform: scaleY(1);
  transform: scaleY(1);
}
/* koniec - ANIMACJE - rozwijane tlo ================================================*/

/* ANIMACJE - ZAMYKANIE / START STRONY ===========================================*/

/* --------------------------------------------------
    navbar (gorna belka+menu lista)	
	galeria = img container
	okruch
	footer
	--------------------------------------------------
*/

/* NAVBAR ukryj */
.navbar-hide1 {
	transform: translateY(-101%);
	-o-transform: translateY(-101%);
	-ms-transform: translateY(-101%);
	-moz-transform: translateY(-101%);
	-webkit-transform: translateY(-101%);
}
.navbar-hide2 {
	transform: translateY(-85px);
	-o-transform: translateY(-85px);
	-ms-transform: translateY(-85px);
	-moz-transform: translateY(-85px);
	-webkit-transform: translateY(-85px);
}
.foot-hide {
	transform: translateY(101%);
	-o-transform: translateY(101%);
	-ms-transform: translateY(101%);
	-moz-transform: translateY(101%);
	-webkit-transform: translateY(101%);
}
.okruch-hide {
	transform: translateY(140px);
	-o-transform: translateY(140px);
	-ms-transform: translateY(140px);
	-moz-transform: translateY(140px);
	-webkit-transform: translateY(140px);
}

/*
	NAVBAR > start > DOWN
	FOOTER > start > UP
	OKRUCH > start > UP
	FOOTER > zamykanie strony > DOWN
	OKRUCH > zamykanie strony > DOWN
 */
.navbar-time, .navbar-time2,
.foot-time, .okruch-time
.navbar-close-up, .navbar-close-up2,
.foot-close-down, .okruch-close-down {
    transition-property: transform;	
    -o-transition-property: -o-transform;
    -moz-transition-property: -moz-transform;	
    -webkit-transition-property: -webkit-transform;	

	/* rodzaj przejscia */
    transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);		
    -o-transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);	
    -moz-transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);	
	-webkit-transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);		
}
.navbar-time, .foot-time {
	/* navbar > start strony > DOWN = CZAS */	
    transition-duration: 0.7s;
    -o-transition-duration: 0.7s;
    -moz-transition-duration: 0.7s;
    -webkit-transition-duration: 0.7s;
}
.navbar-time2, .okruch-time {
	/* navbar-bottom > start strony > DOWN = CZAS */
    transition-duration: 0.9s;
    -o-transition-duration: 0.9s;
    -moz-transition-duration: 0.9s;
    -webkit-transition-duration: 0.9s;
}
.navbar-close-up {
	/*NAVBAR > zamykanie strony > ruch UP */	
	transform: translateY(-101%);
	-o-transform: translateY(-101%);	
	-moz-transform: translateY(-101%);
	-webkit-transform: translateY(-101%);
}
.foot-close-down {
	/* FOOTER > zamykanie strony > ruch DOWN */	
	transform: translateY(101%);
	-o-transform: translateY(101%);	
	-moz-transform: translateY(101%);
	-webkit-transform: translateY(101%);
}
.navbar-close-up,
.foot-close-down {
	/* NAVBAR +
		FOOTER = CZAS zwiniecia */
    transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -webkit-transition-duration: 0.4s;

	transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    -moz-transition-delay: 0.3s;
    -webkit-transition-delay: 0.3s;	
}
.navbar-close-up2 {
	/* NAVBAR-bottom > zamykanie strony > ruch UP */	
	transform: translateY(-85px);
	-o-transform: translateY(-85px);
	-ms-transform: translateY(-85px);
	-moz-transform: translateY(-85px);	
	-webkit-transform: translateY(-85px);
}
.okruch-close-down {
	/* OKRUCH > zamykanie strony > ruch DOWN	*/	
	transform: translateY(70px);
	-o-transform: translateY(70px);	
	-ms-transform: translateY(70px);	
	-moz-transform: translateY(70px);
	-webkit-transform: translateY(70px);
}
.okruch-close-down {
	/* NAVBAR-bootom > zamykanie strony > CZAS
		OKRUCH > zamykanie strony > CZAS
	*/	
    transition-duration: 0.48s;
    -o-transition-duration: 0.48s;
    -moz-transition-duration: 0.48s;
    -webkit-transition-duration: 0.48s;
}
.navbar-close-up2 {
	/* NAVBAR-bootom > zamykanie strony > CZAS
	*/	
    transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -webkit-transition-duration: 0.4s;
}
/* koniec navbar */

/* GALERIA > zamykanie strony > ruch DOWN */
.container-close-time {
	transform: translateY(101%);
    transition-property: transform;
    transition-duration: 0.6s;
    transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);

	-o-transform: translateY(101%);
    -o-transition-property: -o-transform;
    -o-transition-duration: 0.6s;
    -o-transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);

	-moz-transform: translateY(101%);	
    -moz-transition-property: -moz-transform;
    -moz-transition-duration: 0.6s;
    -moz-transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);

	-webkit-transform: translateY(101%);
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 0.6s;
    -webkit-transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);	
}
/* koniec GALERIA > zamykanie strony > ruch DOWN */

/* koniec ANIMACJE - ZAMYKANIE / START STRONY =======================================*/

/* GALERIA MODAL = popUp okno z img ==============================================*/
.modal {
  display: none;
  position: fixed;
  z-index: 100;
  overflow: hidden;
  left: 0; right: 0; top: 0; bottom: 0;
  opacity:0;
}
/* efekt fade = wlaczenie/zamkniecie */
.modal, .modal-opacity { 
  transition-property: opacity;
  transition-duration: 0.3s;
  transition-timing-function: ease;

  -o-transition-property: opacity;
  -o-transition-duration: 0.3s;
  -o-transition-timing-function: ease;
  
  -moz-transition-property: opacity;
  -moz-transition-duration: 0.3s;
  -moz-transition-timing-function: ease;
  
  -webkit-transition-property: opacity;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;   
}
.modal-opacity {opacity:1;}

.modal-tlo {
  position: fixed;
  overflow: hidden;
  left: 0; right: 0; top: 0; bottom: 0; 
  background: #050c07; /*ciemna zielen*/
  opacity: 0.96;
}

/* MODAL duze IMG SLIDE  */
.modal-duze-img {
  overflow: auto;
  text-align: center;
  position: absolute;
  left: 0; right: 0; top: 53px; bottom: 20px;
  margin: auto;
  padding: 0;
}
/*box na IMG i nr img*/
.mySlides {
  display: none;
  overflow: hidden;
  position: relative;
  left: 0; right: 0; top: 0; bottom: 0;
  height: 100%;
}

/* proporcje IMG */
.mySlides img{
  cursor: pointer;

  margin-left: auto;
  margin-right: auto;	
 
  /* centrowanie IMG,
  cropp jesli szerokosc okna mniejsza niz IMG,
  responsywnosc IMG*/
  position: absolute; 
  height: 100%;
  width: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}
/*znacznik semantyczny*/
figure, figcaption {
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
	margin: 0;
	border: 0;
	padding:0;
}

/* Galeria Buttons */
.box-g-icons {
  position: absolute;
  top: 8px;
  right: 100px;
  cursor: pointer;
}
.box-g-icons img {
  height: 30px;
  width: 30px;
  margin-left: 5px;
  opacity: 0.5;
  
  transition: 0.35s ease;
  -o-transition: 0.35s ease;
  -moz-transition: 0.35s ease;
  -webkit-transition: 0.35s ease;
}
.box-g-icons img:hover {
	opacity: 1;
}
.box-g-icons ol>li, .box-g-icons ol {
  margin:0;
  border: 0;
  padding: 0;
  outline: 0;
  display: inline-block;
}
#gPlayActive {display: none; opacity: 1;}
#gPlayActive:hover { opacity: 0.5;}

/* /koniec Galeria Buttons */

/* Przycisk LEFT < RIGHT >*/
.prev, .next {
  vertical-align: middle;
  position: fixed;
  top: 0px;
  bottom: 0px;
  z-index: 10;
  width: 90px;
  cursor: pointer;
  opacity: 0.3;
  
  transition: 0.35s ease;
  -o-transition: 0.35s ease;
  -moz-transition: 0.35s ease;
  -webkit-transition: 0.35s ease;
  
  /* zaznaczenie tekstu = nie */
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
}
.next { right: 0;}

.prev:hover, .next:hover {
  background-color: yellow;
  opacity: 0.7;
}
.arrow-left, .arrow-right {
  color: yellow;	
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 60px;
  vertical-align:middle;
  position:absolute;
  top: 50%;
  margin:0;
  margin-top: -60px;
}
.arrow-left {left: 28px;}
.arrow-right {right: 28px;}

.prev:hover .arrow-left {
	color:#0A1817; /*ciemna zielen*/
	text-shadow: 6px 4px 3px #abbd17; /*zolty brudny*/  
} 
.next:hover .arrow-right {
	color:#0A1817; /*ciemna zielen*/	 
	text-shadow: -6px 4px 3px #abbd17; /*zolty brudny*/
}

/* Numer zdjecia (1/3 ect) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: fixed;
  top: 11px;
  left: 100px;
  z-index: 15;
  opacoty:0.7;
}
#progress {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 20px;
  background: #abbd17; /*zolty brudny*/
  opacity: 0.45;
}
/* przycisc full screen OFF*/
#fullOFF { display: none;}

/* GALERIA MODAL > SLIDE = Fading animation */
.efekt-fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}
@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}
@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}
/* koniec GALERIA MODAL > SLIDE = Fading animation */

/* ------------------------------------------------------------- */
.over {overflow:hidden;}
.img-rel {position:relative;}

.img-margin {margin-bottom:-5px;}

@media (min-width: 767px) {.cursor { cursor: pointer;}}

/* koniec GALERIA MODAL = popUp okno z img ==========================================*/

/* INNE ==================================================================*/

.displayNo {display:none !important;}
.displayI-B {display:inline-block !important;}

/* koniec INNE ----------------------------------------------------------------------------------------------------------------*/

/* INFINITE CIRCLE SPINING BAR ==================================================*/

#loading-bar-spinner.spinner {
    left: 50%;
    margin-left: -50px; /*srodek spinera*/
    top: 50vh;
    margin-top: -50px; /*srodek spinera*/
    position: absolute;
    z-index: 0 !important;
    animation: loading-bar-spinner 400ms linear infinite;
}
@media only screen and (min-width: 767px){#loading-bar-spinner.spinner {
    top: 30vh;
}}

#loading-bar-spinner.spinner .spinner-icon {
    width: 100px;
    height: 100px;
    border:  solid 7px transparent;
    border-top-color:  #00C8B1 !important;
    border-left-color: #00C8B1 !important;
    border-radius: 50%;
}

@keyframes loading-bar-spinner {
  0%   { transform: rotate(0deg); transform: rotate(0deg); }
  100% { transform: rotate(360deg); transform: rotate(360deg); }
}
/* INFINITE CIRCLE SPINING BAR ------------------------------------------------------------------------------------------*/

/* KOLUMNY ROZMIAR WIDTH ====================================================*/
/*
	na dole aby nawigacja prawidlowo zmieniala rozmiar okien */	

[class*="col-"]{ float: left;}
/* zmiany do 766 px*/
@media (max-width: 766px){[class*="col-"]{ float: none;}}

/* zmiany od 767 px*/
@media only screen and (min-width: 767px){
.col-s-1 {width: 8.33%;}
.col-s-2 {width: 16.66%;}
.col-s-3 {width: 25%;}
.col-s-4 {width: 33.33%;}
.col-s-5 {width: 41.66%;}
.col-s-6 {width: 50%;}
.col-s-7 {width: 58.33%;}
.col-s-8 {width: 66.66%;}
.col-s-9 {width: 75%;}
.col-s-10 {width: 83.33%;}
.col-s-11 {width: 91.66%;}
.col-s-12 {width: 100%;}
}
/* zmiany od 991 px*/
@media only screen and (min-width: 991px){
.col-m-1 {width: 8.33%;}
.col-m-2 {width: 16.66%;}
.col-m-3 {width: 25%;}
.col-m-4 {width: 33.33%;}
.col-m-5 {width: 41.66%;}
.col-m-6 {width: 50%;}
.col-m-7 {width: 58.33%;}
.col-m-8 {width: 66.66%;}
.col-m-9 {width: 75%;}
.col-m-10 {width: 83.33%;}
.col-m-11 {width: 91.66%;}
.col-m-12 {width: 100%;}
}
/* zmiany od 1149 px*/
@media only screen and (min-width: 1149px){
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}
}
@media only screen and (min-width: 1400px){.col-20 {width: 20%;}}
@media only screen and (min-width: 1800px){.col-16 {width: 16.66%;}}

/*-------------------------------------------------------------------------------------------------*/