/*
Theme Name: eXc Mobile
Theme URI: https://exc.pl/
Author: ROXart
Author URI: https://roxart.pl/
Description: Dedykowany szablon strony https://exc.pl/
Version: 1.0
Text Domain: eXc Mobile
*/
body{
	font-family: Nunito !important;
	/*background-color: #052D46;
	color: #FFF;*/

}
p{
	color:#fff;
}
#myVideo {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
}
img.nakladki {
    max-width: 100%;
    position: absolute;
    left: 0;
    width: max-content;
    display: none;
}
.hero {
    background-image: url(image/banner-glowny-kopia.png);
    background-color: #548BA9;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 90vh;
    position: relative;
    box-shadow: 0px 15px 15px #00000029;
}
.hero .container{
	position: relative;
	z-index: 1;
}
.container{
	height: 100%;
	max-width: 1410px;
}
.hero .content{
	height: 58%
}
.logo{
	width: 143px;
	padding-top: 63px;
}
.hero h1{
	text-align: left;
	font-family: Nunito;
	font-size: 48px;
	font-weight: 800;
	color: #E3C696;
	position: relative;
    height: 240px;
}
.hero h1 > span{
	font-size: 48px;
	line-height: 56px;
	font-weight: 500;
	color: #FFFFFF;
	display: block;
    max-width: 590px;
    margin: auto;
	position: absolute;
}
.hero h1 > span > span{
    font-weight: 800;
	color: #E3C696;
}
.hero .col-content{
	position: relative;
    height: auto;
} 
.col-lg-6.pt-3.p-0.text-center {
    padding-top: 0 !important;
    margin-top: -80px;
}
.col-lg-6.pt-3.p-0.text-center img{
    max-width: 614px;
    width: 100%;
}

/*
.hero .button-cart{
	position: absolute;
	bottom: 0;
}
*/
.hero .col{
	padding: 0 70px;
}
.text-yellow, .text-yellow-m1, .text-yellow-m2{
	font-weight: 700;
	color: #FFE800;
}
.button-cart {
    background-color: #FF0000;
    border-radius: 46px;
    font-size: 26px;
    font-weight: 800;
    text-transform: uppercase;
    color: #fff;
    border: none;
    text-align: left;
    padding: 6px 7px 6px 34px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.5s;
}
.button-cart:hover {
    background-color: #DF1B12;
}
.button-cart img{
	
	width: 35px;
	float: right;
	
}
.bg-cart{
	background-image: url("image/Ellipse299.svg");
	background-size: contain;
    background-position: center;
    padding: 15px 15px 13px 9px;
    background-repeat: no-repeat;
    margin-left: 50px;
}
.hero .text-arrow{
	text-align: center;
	position: relative;
    width: auto;
    bottom: 30px;
}
.hero .arrow {
    height: 200px;
}
.text-arrow span {
    transform: rotate(-90deg);
    position: absolute;
    left: -15px;
    top: 122px;
    width: max-content;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    transition: all 0.3s ease-in;
    opacity: 1;
}
.text-arrow .hide {
    left: -20px;
    opacity: 0;
    top: -6px;
    transition: all 0.5s ease-in;
}
.text-arrow:hover .show {
    opacity: 0;
}
.text-arrow:hover .hide {
    opacity: 1;
}
.animate-flicker2, .animate-flicker3, .animate-flicker4{
    opacity: 0;
}
@keyframes flickerAnimation {
	0%   { opacity:1; }
    15%  { opacity:1; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    49%  { opacity:0; }
    61%  { opacity:0; }
    74%  { opacity:0; }
    87%  { opacity:1; }
    100% { opacity:1; }
  }
  @-o-keyframes flickerAnimation{
	0%   { opacity:1; }
    15%  { opacity:1; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    49%  { opacity:0; }
    61%  { opacity:0; }
    74%  { opacity:0; }
    87%  { opacity:1; }
    100% { opacity:1; }
  }
  @-moz-keyframes flickerAnimation{
	0%   { opacity:1; }
    15%  { opacity:1; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    49%  { opacity:0; }
    61%  { opacity:0; }
    74%  { opacity:0; }
    87%  { opacity:1; }
    100% { opacity:1; }
  }
  @-webkit-keyframes flickerAnimation{
	0%   { opacity:1; }
    15%  { opacity:1; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    49%  { opacity:0; }
    61%  { opacity:0; }
    74%  { opacity:0; }
    87%  { opacity:1; }
    100% { opacity:1; }
  }
  .animate-flicker {
	 -webkit-animation: flickerAnimation 12s infinite;
	 -moz-animation: flickerAnimation 12s infinite;
	 -o-animation: flickerAnimation 12s infinite;
	  animation: flickerAnimation 12s infinite;
      animation-delay: 2s;
  }
  @keyframes flickerAnimation2 {
	0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:1; }
    49%  { opacity:1; }
    61%  { opacity:1; }
    74%  { opacity:0; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  @-o-keyframes flickerAnimation2{
	0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:1; }
    49%  { opacity:1; }
    61%  { opacity:1; }
    74%  { opacity:0; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  @-moz-keyframes flickerAnimation2{
	0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:1; }
    49%  { opacity:1; }
    61%  { opacity:1; }
    74%  { opacity:0; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  @-webkit-keyframes flickerAnimation2{
	0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:1; }
    49%  { opacity:1; }
    61%  { opacity:1; }
    74%  { opacity:0; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  .animate-flicker2 {
	 -webkit-animation: flickerAnimation2 12s infinite;
	 -moz-animation: flickerAnimation2 12s infinite;
	 -o-animation: flickerAnimation2 12s infinite;
	  animation: flickerAnimation2 12s infinite;
      animation-delay: 2s;
  }
  /*
  @keyframes flickerAnimation3 {
    0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    49%  { opacity:1; }
    61%  { opacity:0; }
    74%  { opacity:0; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  @-o-keyframes flickerAnimation3{
    0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    49%  { opacity:1; }
    61%  { opacity:0; }
    74%  { opacity:0; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  @-moz-keyframes flickerAnimation3{
    0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    49%  { opacity:1; }
    61%  { opacity:0; }
    74%  { opacity:0; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  @-webkit-keyframes flickerAnimation3{
    0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    49%  { opacity:1; }
    61%  { opacity:0; }
    74%  { opacity:0; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  .animate-flicker3 {
     -webkit-animation: flickerAnimation3 16s infinite;
     -moz-animation: flickerAnimation3 16s infinite;
     -o-animation: flickerAnimation3 16s infinite;
      animation: flickerAnimation3 16s infinite;
      animation-delay: 2s;
  }
  @keyframes flickerAnimation4 {
    0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    61%  { opacity:0; }
    74%  { opacity:1; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  @-o-keyframes flickerAnimation4{
    0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    61%  { opacity:0; }
    74%  { opacity:1; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  @-moz-keyframes flickerAnimation4{
    0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    61%  { opacity:0; }
    74%  { opacity:1; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  @-webkit-keyframes flickerAnimation4{
    0%   { opacity:0; }
    15%  { opacity:0; }
    25%  { opacity:0; }
    37%  { opacity:0; }
    61%  { opacity:0; }
    74%  { opacity:1; }
    87%  { opacity:0; }
    100% { opacity:0; }
  }
  .animate-flicker4 {
     -webkit-animation: flickerAnimation4 16s infinite;
     -moz-animation: flickerAnimation4 16s infinite;
     -o-animation: flickerAnimation4 16s infinite;
      animation: flickerAnimation4 16s infinite;
      animation-delay: 2s;
  }
  */
.hero .arrow:hover{
	cursor: pointer;
}
.info{
	/*background-image: url("image/Intersection.png");*/
	width: 100%;
	background-size: cover;
	background-position: center;
	padding-top: 140px;
   	padding-bottom: 70px;
}
.info h2{
	text-align: center;
}
.col-block{
	display: flex;
	justify-content: space-around;
}
.image-block {
    display: grid;
    text-align: center;
}
.info .container-item {
    height: 500px;
    position: relative;
}
.info .item {
    background-color: #fff;
    border-radius: 25px;
    margin-top: 20px;
    text-align: center;
    padding: 25px;
    box-shadow: 0px 5px 10px #00000029;
    height: 230px;
    overflow: hidden;
    transition: all 0.3s ease-in;
    position: absolute;
    width: 48%;
}
.info .item:nth-child(1){
	z-index: 1;
}
.info .item:nth-child(2){
	right: 0;
	z-index: 1;
}
.info .item:nth-child(3){
	top: 255px;
}
.info .item:nth-child(4){
	right: 0;
	top: 255px;
}
.info .item:hover{
	height: 335px;
  z-index: 1;
}
.item h3 {
    color: #E3C696;
    font-size: 30px;
    line-height: 38px;
    font-weight: 800;
    text-transform: unset;
    margin-top: 40px;
    margin-bottom: 30px;
    text-align: center;
}
.sub-text{
	color: #FFE800;
	font-size:25px;
	font-weight: 800;
	text-transform: uppercase;
}
h2 {
    font-size: 48px;
    line-height: 60px;
    font-weight: 800;
    color: #28485E;
}
h2 span{
	color: #E3C696;
}
.info p {
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
    color: #22457B;
}
.col-block span {
    color: #E3C696;
    font-size: 60px;
    font-weight: 800;
	position: relative;
    top: 90px;
}
.image-block p {
    color: #28485E;
    font-size: 40px;
    font-weight: 800;
    padding-top: 22px;
    line-height: 70px;
}
.info p.text-hover{
	opacity: 0;
	transition: opacity 0.3s ;
}
.info .item:hover p.text-hover{
	opacity: 1;
}

.steps {
    padding-top: 86px;
    background-color: #28485E;
}
.steps h2{
    text-align: center;
    color: #FFF;
}
.container-item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 80px;
}
.item {
    flex-basis: 29%;
    margin-bottom: 100px;
}
.video {
    background-color: #fff;
    padding-top: 100px;
   
}
.video video{
	width: 100% ;
}

.steps button{
	background-color: #FFE800;
	border: 0;
	text-align: center;
	padding: 15px 50px;
	border-radius: 46px;
	font-size:22px;
	font-weight: 800;
	transition: all 0.5s;
}
.steps button:hover{
	background-color: #ECD700;
}
.steps button img{
	padding-left: 30px;
}
.steps p {
    line-height: 32px;
    font-size: 20px;
    color: #FFFFFF;
    font-weight: 400;
    text-align: center;
}
.info2 {
    width: 100%;
    background-size: cover;
    background-position: center;
    padding-top: 90px;
	padding-bottom: 50px;
}
.info2 h2{
	text-align: center;
}
.info2 .item{
	text-align: center;
}
.info2 .item h3 {
    color: #28485E;
}
.info2 .item h3:after {
    content: "";
    width: 60px;
    height: 6px;
    background-color: #E3C696;
    position: relative;
    display: block;
    margin: auto;
    margin-top: 20px;
    border-radius: 5px;
}
.info2 .item p{
	color: #28485E;
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
}
p.desc {
    color: #28485E;
    font-size: 30px !important;
    line-height: 40px !important;
    font-weight: 400;
}


p.sign{
    text-align: center;
	color: #28485E;
    font-size: 30px;
    line-height: 56px;
    font-weight: 800;
}
p.sign:after {
    content: "";
    width: 60px;
    height: 6px;
    background-color: #E3C696;
    position: relative;
    display: block;
    margin: auto;
    margin-top: 10px;
    border-radius: 5px;
}
p.sign2{
    text-align: center;
	color: #28485E;
    font-size: 30px;
    line-height: 56px;
    font-weight: 400;
}
.text-logo{
	color: #ECD700;
	font-size:26px;
	font-weight: 800;
	letter-spacing: 1px;
}
h3{
	font-size: 24px;
	line-height: 32px;
	font-weight: 800;
	color: #FFF;
	text-transform: uppercase;
}
.glowice {
    background-image: url(image/banner_003kopia.png);
    background-size: cover;
    background-position: top;
    padding-top: 80px;
    padding-bottom: 60px;
}
.glowice h2{
	text-align: center;
	color: #FFF;
	font-weight: 700;
}
.glowice .row {
    margin-top: 80px;
}
.text-container {
    width: max-content;
    border: 2px solid #E3C696;
    border-radius: 25px;
	overflow: hidden;
}
.text-container p{
	color: #FFFFFF;
	font-size: 22px;
    font-weight: 400;
}
p.text-head {
    background-color: #E3C696;
    color: #28485E;
    font-size: 22px;
    font-weight: 700;
    padding: 10px 90px;
}
p.p-line{
	margin-bottom: 10px;
}
p.p-line:after {
    content: "";
    position: relative;
    width: 2px;
    height: 25px;
    background-color: #E3C696;
    display: block;
    margin: auto;
    margin-top: 4px;
}
.glowice-container {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
	justify-content: space-around;
	position: relative;
}
.glowice-container:before {
    content: "";
    position: absolute;
    opacity: 1;
    width: 3px;
    height: 600px;
    background: transparent radial-gradient(closest-side at 50% 50%, #E3C696 0%, #DAC298EE 51%, #5D90AD00 100%) 0% 0% no-repeat padding-box;
}
.glowice-container:after {
    content: "";
    position: absolute;
    opacity: 1;
    width: 600px;
    height: 3px;
    background: transparent radial-gradient(closest-side at 50% 50%, #E3C696 0%, #DAC298EE 51%, #5D90AD00 100%) 0% 0% no-repeat padding-box;
	bottom: 51%;
}
.single-glowica {
    flex-basis: 40%;
}
.single-glowica {
    flex-basis: 40%;
    text-align: center;
    padding-bottom: 30px;
}
.single-glowica h3{
	color: #FFFFFF;
	font-size: 26px;
    font-weight: 700;
	margin-top: 30px;
	margin-bottom: 20px;
}

.single-glowica h3:after {
    content: "";
    width: 39px;
    height: 3px;
    background-color: #E3C696;
    position: relative;
    display: block;
    margin: auto;
    margin-top: 15px;
    border-radius: 5px;
}
.single-glowica p{
	color: #FFFFFF;
	font-size: 16px;
	line-height: 26px;
    font-weight: 400;
}


.levels{
	background-image: url(image/banner_002-kopia.png);
	padding-top: 70px;
    padding-bottom: 70px;
	background-size: cover;
	position: relative;
}
.levels h2 {
    text-align: center;
    color: #FFFFFF;
    font-weight: 700;
}
.levels .row > p {
	color: #FFFFFF;
	font-size: 22px;
	line-height: 26px;
    font-weight: 300;
	text-align: center;
	margin-bottom: 60px;
}
.single-item {
    width: max-content;
    border: 2px solid #E3C696;
    border-radius: 25px;
    overflow: hidden;
    margin-bottom: 40px;
	text-align: center;
}
.single-item h3 {
    background-color: #E3C696;
    color: #28485E;
    font-size: 22px;
    font-weight: 700;
    padding: 10px 50px;
}
.single-item p {
    font-size: 22px;
    line-height: 36px;
    font-weight: 400;
}
.dots {
    display: flex;
    justify-content: center;
    padding-top: 15px;
    padding-bottom: 13px;
}
.dots span {
    width: 18px;
    height: 18px;
    background-color: #1795F1;
    margin: auto 8px;
    border-radius: 50%;
    display: flex;
}
.bubble {
    background-color: #2F2F30;
    border-radius: 25px;
    overflow: hidden;
    padding: 40px 30px;
    max-width: 670px;
    display: flex;
	position: absolute;
    bottom: 111px;
    right: 15%;
}
.bubble span {
    color: #FFFFFF;
    display: block;
    font-size: 20px;
    line-height: 32px;
    font-weight: 400;
	margin-left: 31px;
}
img.img-fluid.img-custom-position {
    position: absolute;
    right: 0;
}
.wykorzystanie {
    padding-top: 80px;
    padding-bottom: 80px;
}
.wykorzystanie h2{
	text-align: center;
	margin-bottom: 65px;
}
.wykorzystanie h3 {
    font-size: 26px;
    line-height: 36px;
    font-weight: 700;
    color: #28485E;
    text-align: center;
    margin-top: 30px;
}
.cta {
    background-color: #28485E;
    padding-top: 120px;
    padding-bottom: 100px;
}
.bg-img-cta{
	position: absolute;
	left: -196px;
    top: 31%;
}
.bg-img-cta-2{
	position: absolute;
    width: 100px;
    bottom: 0;
    left: -100px;

}
.col-cta {
    background-color: #20394A;
    border-radius: 70px 0px 0px 70px;
    padding: 70px;
    z-index: 1;
}
.cta .img-cta {
    max-width: 108%;
    position: absolute;
    right: -72px;
    bottom: -243px;
    z-index: 1;
}
img.img-cta2 {
    position: absolute;
    right: 130px;
}
.cta h2 {
    color: #FFFFFF;
    text-transform: none;
    font-size: 55px;
    font-weight: 800;
    line-height: 40px;
}
.cta-desc {
    font-size: 20px;
    font-weight: 400;
    line-height: 32px;
    max-width: 46%;
    margin-top: 27px;
    color: #E3C696;
}
.cta hr{
	color:#053655;
	border:4px solid #053655;
	width: 96px;
	opacity: 1;
	border-radius: 50px;
}
.cta-desc2 {
    color: #fff;
    font-size: 32px;
    font-weight: 400;
    line-height: 40px;
    padding-bottom: 23px;
}
p.h2-desc {
    color: #E3C696;
    font-size: 30px;
    margin-top: 26px;
    line-height: 32px;
    margin-bottom: 30px;
}
p.h2-desc:after {
    content: "";
    width: 60px;
    height: 6px;
    background-color: #E3C696;
    position: relative;
    display: block;
    margin-top: 32px;
    border-radius: 5px;
}
.no-plastic-icon img{
	margin-bottom: 15px;
}
.price {
    color: #fff;
    font-size: 70px;
    font-weight: 800;
    line-height: 56px;
    padding: 26px 0px;
}
.price > span {
    color: #E3C696;
    font-size: 33px;
    line-height: 35px;
    text-decoration: line-through;
    margin-left: 25px;
    font-weight: 400;
    opacity: 0.5;
}
.price .sub {
    color: #fff;
    font-weight: 800;
    font-size: 34px;
    margin-right: 10px;
    margin-bottom: 10px;
}
.cta .button-cart {
    width: max-content;
    padding: 8px 6px 8px 29px;
    font-size: 26px;
    letter-spacing: 0.52px;
}
.cta .button-cart img{
	width: 29px;
	opacity: 0.7;
}
.cta .bg-cart{
    padding: 12px 12px 10px 8px;
}
.custom-plus {
    color: #E3C696;
    font-size: 90px;
    font-weight: 800;
    display: block;
    position: absolute;
    right: 400px;
    z-index: 1231231;
}
.other-product {
    background-color: #20394A;
    padding: 40px 0;
    padding-top: 90px;
    overflow-x: clip;
    position: relative;
}
.other-product .deco-img {
    position: absolute;
    right: -450px;
    z-index: 18;
    top: -244px;
}
.product{
	width: auto;
    margin: auto;
    position: relative;
    display: inline-block;

}
/*
.product:hover .overlay{
	opacity: 0.9;
}

.product{
	background-color: #FFF;
	border-radius: 40px;
	padding: 0;
	position: relative;
	margin:15px;
	width: auto;
	text-align: center;
}
*/
.other-product .swiper-slide{
	position: relative;
}
.other-product .swiper-slide .product:hover .overlay{
	opacity: 0.9;
}
.image {
  display: block;
  width: 100%;
  height: auto;
}
.mySwiperP{
	padding: 0 20px;
    text-align: center;
}
.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #528EAE;
  border-radius: 40px
}
.other-product .swiper-slide a:hover{
	text-decoration: underline;
}

.other-product .swiper-slide a {
  color: #fff;
  font-size: 20px;
  position: absolute;
  font-weight: 800;
  width: 100%;
  text-decoration: none;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.other-product .container{
	max-width: 1210px;
}
.other-product p{
	font-size: 25px;
	line-height: 32px;
	font-weight: 300;
	margin-bottom: 2px;
	color: #FFF;
}
.promo .col-lg-8 b{
	font-weight: 900;
}
.sub-promo{
	font-size: 18px;
	font-weight: 400;
	color: #506C7D;
}
.other-product button {
    background-color: #E3C696;
    border: 2px solid #E3C696;
    text-align: center;
    padding: 12px 40px;
    border-radius: 46px;
    font-size: 22px;
    font-weight: 800;
    transition: all 0.5s;
    color: #053655;
}
.other-product button:hover{
    background-color: #CCB287;
}
.other-product button img{
	padding-left: 30px;
	transition: transform 0.3s;
}
.other-product button:hover img{
	transform: translateX(10px);
}
.other-product h2 {
    color: #FFFFFF;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: 0.6px;
}
.btn-right{
	text-align: right;
}
.partners .container{
	max-width: 1210px;;
}
.partners{
	background-color: #20394A;
	padding-top: 20px;
  padding-bottom: 20px;
}
.partners h2 {
    font-weight: 800;
    font-size: 30px;
    line-height: 34px !important;
    letter-spacing: 0.48px;
    margin-bottom: 60px;
    color: #FFFFFF;
}
.partner{
	padding: 15px;
}
.partner img{
	background-color: #fff;
	border-radius: 40px;
	margin: auto;
	display: flex;
	align-items: center;
}

.swiper-slide img{
	max-width: 100% !important;
}
footer .container{
	max-width: 1210px;
}
footer {
    background-color: #20394A;
    padding-bottom: 50px;
    padding-top: 50px;
}
.contact{
	display: flex;
	align-items: flex-start;
}
.contact img{
	margin-right: 15px;
	filter: brightness(0) saturate(100%) invert(88%) sepia(10%) saturate(5318%) hue-rotate(309deg) brightness(136%) contrast(78%);
}
.contact a{
	font-size: 16px;
	font-weight: 400;
	color: #FFF;
	text-decoration: none;
}
.contact p{
	margin-bottom: 5px;
}
.social{
	text-align: right;
}
.social img{
	margin: 0px 12px;
}

.realization a:hover img{
	/*filter: invert(56%) sepia(17%) saturate(7295%) hue-rotate(0deg) brightness(102%) contrast(105%);*/
	filter: invert(0.39) sepia(0.5) saturate(20) hue-rotate(342deg) brightness(1.04);


}
.copyright p{
	font-size: 14px;
}
.realization a, .realization p{
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 400;
	text-decoration: none;
	text-align: right;
	display: none !important;
}
.realization img{
	padding-left: 10px;
	filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(113deg) brightness(200%) contrast(101%);
}
.swiper-container {
    overflow: hidden;
}
@media (max-width:1400px){
    .cta .img-cta {
        bottom: -170px;
    }
    .custom-plus {
        right: 234px;
    }
    img.img-cta2 {
        right: 43px;
        top: 54px;
    }
    img.img-fluid.img-custom-position {
        width: 73%;
    }
}
@media (max-width:1200px){
	.info .container-item {
    height: 600px;
	}
	.info .item:hover {
    height: min-content;
    z-index: 1;
	}
	.info .item:nth-child(3), .info .item:nth-child(4){
		top: 260px;
	}
    img.img-fluid.img-custom-position {
        position: relative;
        right: -10px;
    }
    img.img-fluid.img-custom-position {
        width: unset;
    }
    .bubble {
    margin-top: 40px;
    position: initial;
    }
    .cta .img-cta {
        bottom: -125px;
    }
    .custom-plus {
        right: 186px;
    }
    img.img-cta2 {
        right: -8px;
        top: 54px;
    }
}
@media screen and (max-width: 1200px), 
       screen and (max-height: 700px) {
		.logo{
			padding-top: 20px;
		}
		.hero .arrow{
			width: 100%;
		}
		.hero h1 span {
			font-size: 42px;
			line-height: 45px;
			padding-bottom: 52px;
		}
}
@media (max-width:991px){
	.hero h1 {
        text-align: left;
        padding-top: 60px;
        font-size: 35px !important;
        padding-bottom: 30px;
        padding-left: 30px;
        padding-right: 10px;
        width: 50%;
    }
	.hero .col {
		padding: 0 16% !important;
	}
    
    .col-lg-6.pt-3.p-0.text-center img {
        display: none;
    }
    .hero .col-content {
        align-items: center;
        display: flex;
    }
	.hero .button-cart {
        margin-left: auto;
        margin-right: 20px;
        font-size: 23px !important;
        width: auto !important;
        z-index: 1 !important;
        text-align: right;
        position: relative;
    }
	.btn-right{
	text-align: center !important;
	}
	.item .col-lg-5{
		padding-top: 30px;
	}
	.cta .img-cta {
		bottom: -220px;
    left: auto;
    width: 56%;
    right: 0;
	}
	.info .container-item {
    height: 530px;
	}
	.hero .content {
    height: auto;
    padding-bottom: 40px;
	}
	.text-arrow span{
		top: 64px;
	}
	.text-arrow .hide {
    top: 51px;
	}
    .item {
        flex-basis: 45%;
    }
    .text-container{
        margin: auto;
        margin-bottom: 70px;
    }
    .levels .col-lg-4{
        display: flex;
        flex-wrap: wrap;
    }
    .single-item{
        margin: auto;
        margin-bottom: 30px;
    }
    .bubble img{
        height: max-content;
    }
    .wykorzystanie .col-lg-3.col-md-6 {
        text-align: center;
        margin-bottom: 20px;
    }
    .cta {
        padding-top: 334px;
        overflow: hidden;
    }
    .cta .img-cta {
        bottom: -104px;
        left: auto;
        width: 56%;
        right: -58px;
    }
    .custom-plus {
        right: 50%;
        bottom: 100px;
    }
    img.img-cta2 {
        left: 8px;
        bottom: -19px;
        top: auto;
    }
    .cta-desc {
        max-width: 89%;
        padding-left: 73px;
    }
}
@media (max-width:768px){
	.hero{
		background-position: 28%;
        height: 100%;
	}
	.hero .col {
		padding: 0 12% !important;
	}
    .hero .col-content {
        padding-top: 30px !important;
    }
    img.nakladki{
        top: 15%;
    }
    .hero .text-arrow{
        margin-bottom: -74px;
    }
	.hero .button-cart {
        margin-left: auto;
        margin-right: auto;
        font-size: 23px !important;
        margin-bottom: 80px;
        margin-top: 51px;
    }
    .col-lg-6.pt-3.p-0.text-center img {
        width: 85%;
    }
	.hero h1 {
		text-align: center !important;
		font-size: 45px !important;
		padding-bottom: 30px;
		align-items: center;
        display: flex;
        justify-content: center;
	}
	.hero h1 span {
        font-size: 44px;
        line-height: 50px;
    }
	.img-hero{
		width: auto !important;
		height: 335px !important;;
	}
	.info{
		padding: 30px 10px !important;
	}
	.info p{
		line-height: 26px !important;
	}
	.info .container-item {
    height: auto;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
	}
	.info .item{
		position: relative;
    width: 50%;
    top: 0 !important;
	}
	.info .container .row{
		padding: 20px 0;
		text-align: center;
	}
	.info2 .container-item {
    justify-content: center;
	}
	.steps{
		background-image: none !important;
		padding: 10px !important;
		padding-bottom: 60px !important;
	}
	.steps .row{
		padding-top: 50px !important;
		/*flex-direction: column-reverse;*/
		text-align: center;
	}
	.steps p{
		padding-right: 1rem !important;
		line-height: 26px !important;
	}
	.text-logo{
		font-size: 30px !important;
	}

	.item{
		margin: 20px !important;
	}
	.item .row{
		display: grid;
		justify-items: center;
    	text-align: center;
	}
	.text-box{
		width: auto !important;
		padding: 20px 0px;
	}
	.cta{
		padding-top: 50px !important;
		padding-bottom: 50px !important;
	}
	.video{
		padding-bottom: 50px !important;
	}
	
	.col-cta{
		padding: 50px 30px !important;
		border-radius: 0 !important;
		text-align: center;
	}
	.col-cta hr{
		margin: 15px auto;
	}
	.col-cta .button-cart{
		margin: auto;
	}
	.image{
		width: 43% !important;
	}
	.btn-right{
		text-align: center !important;
	}
	.other-product{
		padding: 50px 0px !important;
	}
	.other-product p{
		font-size: 23px !important;
	}

	.partners{
		padding: 50px 10px !important;
	}
	.social{
		text-align: center !important;
		margin-top: 20px;
	}
	.promo{
		text-align: center;
	}
	.icon-box{
		padding-bottom: 20px;
	}
	footer{
		padding: 50px 10px !important;
	}
	.cta .img-cta {
    bottom: -28px;
    width: 63%;
    right: 0;
	}
	.info2 h2 {
    text-align: center;
	}
	.cta h2{
		margin: auto;
    margin-bottom: 20px;
	}
	.container-item {
    justify-content: center;
	}
    .item {
        flex-basis: 72%;
    }
    .cta .img-cta {
        bottom: 0;
        width: 100%;
        right: -83px;
        position: relative;
    }
    .custom-plus {
        right: 50%;
        bottom: 37%;
    }
    img.img-cta2 {
        position: unset;
        margin-top: -166px;
    }
    p.h2-desc:after{
        margin: auto;
        margin-top: 20px;
    }
}
@media (max-width:576px){
	.logo {
		padding-top: 30px !important;
	}
    .hero {
        background-position: left;
    }
	.hero .col {
		padding: 0 7% !important;
	}
	.img-hero {
		width: auto !important;
		height: 335px !important;
		padding-top: 10px;
	}
    .hero .col-content {
        flex-wrap: wrap;
    }
    .hero h1 {
        width: 100%;
    }
    .hero h1 span {
        font-size: 37px;
        line-height: 41px;
    }
    .hero .button-cart {
        margin-top: 50px;
        margin-bottom: 37px;
    }
    .hero .arrow {
        height: 120px;
    }
    .hero .text-arrow {
        margin-bottom: -90px;
    }
    .text-arrow span {
        top: 41px;
        font-size: 12px;
    }
	h2{
		line-height: 53px !important;
	}
    .info h2 span {
        display: block;
    }
	.contact {
    justify-content: center;
	}
    p.sign.pb-3.pb-lg-0 {
        padding-top: 50px;
    }
	.glowice h2 {
        font-size: 35px;
        line-height: 40px !important;
    }
	.other-product button {
		padding: 15px 27px !important;
	}
	.other-product button img {
		padding-left: 10px !important;
	}
    .container-item {
        padding-top: 40px;
    }
    .item {
        flex-basis: 93%;
        margin: 15px !important;
    }
    p.sign2 {
        line-height: 34px;
    }
    
    p.text-head {
        padding: 10px 69px;
    }
	.info2 .item {
    align-items: center;
    flex-direction: column;
    flex-basis: 90%;
    display: flex;

	}
	.info .item {
    width: 90%;
	}
	.steps {
    padding-bottom: 70px !important;
	}
    .bubble {
        padding: 10px 15px;
        padding-left: 0;
    }
    .bubble span {
        font-size: 16px;
        line-height: 22px;
        margin-left: 15px;
    }
    .bubble span br{
        display: none;
    }
    .wykorzystanie .swiper-slide {
        text-align: center;
    }
	.contact {
		display: grid !important;
		align-items: flex-start !important;
		text-align: center !important;
	}
	.contact p{
		display: grid;
	}
	.contact img{
		padding-bottom: 20px;
		margin: auto !important;
	}
	.realization p{
		text-align: center !important;
	}
	.copyright{
		text-align: center !important;
		
	}
	.copyright p{
		display: grid;
	}
	.video .col{
		padding: 0;
	}
	.video h2{
		font-size: 30px;
		line-height: 35px !important;
	}
	
	#myVideo {
		position: absolute;
		right: -353px;
		top: 0;
		min-width: 100%;
		min-height: 100%;
		left: auto;
		transform: none;
	}
    h2 {
    font-size: 38px;
    }
    .col-block {
        display: flex;
        justify-content: center;
        flex-direction: column;
    }
    .image-block {
        justify-content: center;
    }
    .col-block span {
        top: 0;
    }
    .cta {
        padding-top: 8px !important;
    }
    .cta .col-lg-5.col-xxl-6.position-relative {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: row-reverse;
        overflow: hidden;
    }
    .cta .img-cta {
        margin-bottom: -42px;
        width: 90%;
        margin-right: -60px;
        position: initial;
    }
    .custom-plus {
        bottom: 45%;
        font-size: 50px;
        right: 50%;
    }
    img.img-cta2 {
        margin-top: -46px;
        width: 50%;
        left: 2%;
        position: relative;
    }
    .cta-desc2 {
        font-size: 18px;
        line-height: 22px;
    }
    .cta-desc {
        max-width: 100%;
        padding-left: 30px;
        font-size: 16px;
        line-height: 22px;
    }
    p.h2-desc {
        font-size: 26px;
        line-height: 30px;
        margin-bottom: 10px;
    }
    .price {
        display: flex;
        align-items: baseline;
        flex-wrap: wrap;
        justify-content: center;
    }
    .info2 .item h3 {
        order: 1;
    }
    .info2 .item p{
        order: 2;
    }
    .info2 img.img-fluid {
        order: 4;
    }
    
}
@media (max-width:460px){
    .single-glowica{
        flex-basis: 90%;
    }
    .glowice-container:after, .glowice-container:before{
        display: none;
    }
}
@media (max-width: 350px){
    h2 {
        font-size: 32px;
        line-height: 40px;
    }
}
@media (min-width:1200px){
	#myVideo {

		left: 10px;
    	transform: scale3d(1.3, 1.3, 1.3);
	}
    /*
    .hero{
        background-size: auto !important;
    }
    */
    .levels .col-lg-4{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
}
@media (min-width: 992px){
	.cta .row{
		justify-content: flex-end;
}
	.flex-item{
		max-width: 550px;
	}
	.item .row{
		flex-wrap: nowrap;
	}
	.hero .arrow {
        margin-top: 59px;
    }
	.hero .col-lg-3{
		padding-top: 100px !important;
	}
	.hero .col-lg-3 img{
		width: 70%;
	}
	.custom-padding{
		padding-right: 70px;
	}
	.other-product button{
		padding: 15px 30px !important;
	}
	.video h2 br{
		display: none;
	}
    .info2 .item:nth-child(3) p.desc{
        min-height: 80px;
    }
}
@media (min-width: 1200px){
	
	.other-product button{
		padding: 10px 42px !important;
	}
}