body
{
	background-color: rgb(28, 28, 31);
	margin: 0;
	padding: 0;
  	font-weight: 100;
 	font-family: "Montserrat", sans-serif;
	overflow-x: hidden;
}
a:active, a:link, a:visited, a:hover
{
	text-decoration: none;
}
a[href^=tel] {
	text-decoration:inherit;
	color: inherit;
 }
.header-contact-bar
{
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	height: 8vh;
	width: 100%;
	font-size: 2vw;
	color: #BFBFBF;
	z-index: 1;
}
@media (max-width: 1400px)
{
	.header-contact-bar
	{
		font-weight: bold;
		font-size: 2.5vw;
	}
}
.header-logos, .header-mail, .header-phone
{
	display: inline-block;
	margin-top: 2vw;
	margin-right: 5vw;
	margin-left: 5vw;
	height: 8vh;
	animation: 2.5s header-title-animations forwards;
}
.heder-mail-adress, .header-phone-number
{
	display: inline-block;
	transform: translateY(-10%);
}
.header-phone > img, .header-mail > img
{
	width: 1.7vw;
	height: 1.6vw;
	-webkit-filter: contrast(0) brightness(1.5);
}
@media (max-width: 1400px)
{
	.header-phone img, .header-mail img
	{
		width: 2.2vw;
		height: 2.2vw;
	}
}
.header-logos > a img
{
	width: 2vw;
	height: 2vw;
	padding-left: 2vw;
	-webkit-filter: contrast(0) brightness(1.5);
}
@media (max-width: 1400px)
{
	.header-logos > a img
	{
		width: 4vw;
		height: 4vw;
		-webkit-filter: contrast(0) brightness(1.5);
	}
}
.header-bg
{
	position: absolute;
	width: 103%;
	height: 100vh;
	background-image: url(damp.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	z-index: -5;
}
.header
{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 95vh;
	color: #BFBFBF;
	line-height: 2vh;
}
.header-title img
{
	width: 12vw;
	height: 25vw;
}
.header-title
{
	text-align: center;
	z-index: -1;
	color: #BFBFBF;
	font-size: clamp(2rem, 4.5vw, 7rem);
	animation: 2.5s header-title-animations forwards;
}
.header-title p
{
	font-weight: bold;
	color: white;
	font-size: clamp(1rem, 3vw, 5rem);
	animation: 3.2s header-title-animations forwards;
}
.navigation
{
	display: flex;
	align-items: center;
	position: sticky;
	top: 0;
	z-index: 99;
	width: 100%;
	height: 5vh;
	background-color: #BFBFBF;
	font-size: 2vw;
	font-weight: bold;
}
@media (max-width: 1400px)
{
	.navigation
	{
		font-size: 2.5vw;
	}
}
.navigation-logo
{
	display: flex;
	justify-content: center;
	width: 30%;
}
.aindex
{
	display: flex;
	justify-content: center;
	width: 100%;
}
.aindex img
{
	width: 80%;
}
.navigation-menu
{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 70%;
}
.navigation-menu a
{
	position: relative;
	margin-right: 2.5vw;
	margin-left: 2.5vw;
	text-decoration: none;
	color: black;
	height: clamp(3vh, 5vh, 7vh);
}
.navigation-menu-main a:before, .navigation-menu-e-bike a:before, .navigation-menu-kontakt a:before, .navigation-menu-bike a:before, .navigation-menu-regulamin a:before
{
	position: absolute;
	transform: translateX(4vw);
	content: '';
	opacity: 0;
	background-color: rgb(28, 28, 31);
	height: 100%;
	width: 4px;
	animation: 0.5s brackets-movement-left-out;
}
.navigation-menu-main a:after, .navigation-menu-e-bike a:after, .navigation-menu-kontakt a:after, .navigation-menu-bike a:after, .navigation-menu-regulamin a:after
{
	position: absolute;
	content: '';
	opacity: 0;
	transform: translateX(-4vw);
	background-color: rgb(28, 28, 31);
	height: 100%;
	width: 4px;
	animation: 0.5s brackets-movement-right-out;
}
.navigation-menu-main a:hover::before, .navigation-menu-e-bike a:hover::before, .navigation-menu-kontakt a:hover::before, .navigation-menu-bike a:hover::before, .navigation-menu-regulamin a:hover::before
{
	position: absolute;
	content: ' ';
	background-color: rgb(28, 28, 31);
	height: 100%;
	width: 4px;
	animation: 0.5s brackets-movement-left-in forwards;
}
.navigation-menu-main a:hover::after, .navigation-menu-e-bike a:hover::after, .navigation-menu-kontakt a:hover::after, .navigation-menu-bike a:hover::after, .navigation-menu-regulamin a:hover::after
{
	position: absolute;
	content: ' ';
	background-color: black;
	height: 100%;
	width: 4px;
	animation: 0.5s brackets-movement-right-in forwards;
}
.section1-body
{
	position: relative;
	width: 100%;
	height: auto;
	color: white;
	background-color: rgb(28, 28, 31);
}
.galeria
{
	position: relative;
	margin-top: 10vh;
	margin-bottom: 10vh;
	width: 100%;
	height: 50vh;
	display: flex;
	align-items: center;
	justify-content: center;
}
.galeria-title
{
	font-weight: bold;
	color:#D97B29;
	text-align: center;
	font-size: 4vw;
}
.swiper
{
	width: 70vh;
	height:auto;
	transform: scale(1);
}
.swiper-slide img
{
	width: 100%;
}
.swiper .swiper-button-next, .swiper .swiper-button-prev
{
	color:white;
}
.swiper .swiper-pagination-bullet-active
{
	background: white;
}
.firma-desc
{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	width: 100%;
	height: 70vh;
	background-image: url(Gory-tlo.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	color: #BFBFBF;
}
@media (max-width: 1400px)
{
	.firma-desc
	{
		font-weight: bold;
		height: 80vh;
	}
	
}
.desc-title
{
	width: 80%;
	margin-top: 10vh;
	margin-bottom: 7vh;
	text-align: center;
	font-size: 4vw;
}
@media (max-width: 1400px)
{
	.desc-title
	{
		margin-top: 0vh;

	}
	
}
.desc-upsides
{
	display: flex;
	flex-direction: row;
	width: 100%;
	align-items: center;
	justify-content: center;
	text-align: center;

}
.desc-exp, .desc-kno, .desc-pas
{
	margin-left: 2vw;
	margin-right: 2vw;
	width: 30vw;
	height: 40vh;
	font-size: 1vw;
	animation: desc-colors-out 1s forwards;
}
.desc-exp:hover, .desc-kno:hover, .desc-pas:hover
{
	animation: desc-colors-in 1s forwards;
}
h3
{
	font-size: 1vw;
}
@media (max-width: 1200px)
{
	h3
	{
		font-size: 2vw;
	}
}
@media (max-width: 1400px)
{
	.desc-exp, .desc-kno, .desc-pas
	{
		font-size: 1.6vw;
	}
}
.desc-exp img, .desc-kno img, .desc-pas img
{
	width: 6vw;
	height: 6vw;
	
}

.hide 
{
	animation: 1s showdescout ease-out forwards;
	left: -100%;
}
.show
{
	animation: 1s showdescin ease-out forwards;
	left: 0;
}
@keyframes showdescin
{
	0%
	{
		opacity: 0;
	}
	100%
	{
		opacity: 1;
	}	
}
@keyframes showdescout
{
	0%
	{
		opacity: 1;
	}
	100%
	{
		opacity: 0;
	}	
}
@keyframes header-title-animations
{
	0%
	{
		opacity: 0%;
		transform: translateY(-20%);
	}
	100%
	{
		opacity: 100%;
		transform: translateY(0%);
	}
}
@keyframes brackets-movement-left-in
{
	0%
	{
		transform: translateX(4vw);
		opacity: 0;
	}
	100%
	{
		transform: translateX(0);
		opacity: 1;
		background-color: #D97B29;
	}
}
@keyframes brackets-movement-left-out
{
	0%
	{
		transform: translateX(0);
		opacity: 1;
		background-color: #D97B29;
	}
	100%
	{
		transform: translateX(4vw);
		opacity: 0;
		background-color: black;
	}
}
@keyframes brackets-movement-right-in
{
	0%
	{
		transform: translateX(-4vw);
		opacity: 0;
	}
	100%
	{
		transform: translateX(0);
		opacity: 1;
		background-color: #D97B29;
	}
}
@keyframes brackets-movement-right-out
{
	0%
	{
		transform: translateX(0);
		opacity: 1;
		background-color: #D97B29;
	}
	100%
	{
		transform: translateX(-4vw);
		opacity: 0;
		background-color: black;
	}
}
@keyframes desc-colors-in
{
	0%
	{
		-webkit-filter: contrast(0) brightness(1.5);
	}
	100%
	{
		-webkit-filter:none ;
	}
}
@keyframes desc-colors-out
{
	0%
	{
		-webkit-filter:none ;
	}
	100%
	{
		-webkit-filter: contrast(0) brightness(1.5);
	}
}
