@import url('http://fonts.googleapis.com/css?family=Krub&subset=latin,latin-ext');
 @import url('http://fonts.googleapis.com/css?family=Kodchasan&subset=latin,latin-ext');
 @import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
 @import url('https://fonts.googleapis.com/css?family=Lobster');
@import url('https://fonts.googleapis.com/css?family=Ribeye');
@import url('https://fonts.googleapis.com/css?family=Montserrat|Source+Sans+Pro');


@function stroke($stroke, $color) {
  $shadow: ();
  $from: $stroke*-1;
  @for $i from $from through $stroke {
   @for $j from $from through $stroke {
      $shadow: append($shadow, $i*1px $j*1px 0 $color, comma);
    }
  }
  @return $shadow;
}
/// Stroke font-character
/// @param  {Integer} $stroke - Stroke width
/// @param  {Color}   $color  - Stroke color
/// @return {Style}           - text-shadow
@mixin stroke($stroke, $color) {
  text-shadow: stroke($stroke, $color);
}
html {
	scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}
body
{
	
	color: #000;
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
	 background-repeat: no-repeat;
    background-position: right top;
    margin-right: 0px;
    background-attachment: fixed;
}
h4{
	
	font-family: 'Montserrat', sans-serif!important;
}
.parallax 
{
	  height: 500px; 

  background-image: url('images/tlo.jpg');
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
text-align: center !important;
vertical-align: middle !important;
}
.parallax2 
{
	  height: 100%; 

  background-image: url('images/tlo2.jpg');
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.parallax3 
{
	  height: 100%; 

  background-image: url('images/tlo3.jpg');
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
 
}
#title
{
	font-size: 55px;
  -webkit-text-stroke: 1px black;
   color: white;
  text-shadow:
    3px 3px 0 #000,
    
   -1px -1px 0 #000,  
    1px -1px 0 #000,
   -1px  1px 0 #000,
    1px  1px 0 #000;


font-family: 'Lobster', cursive;


	font-weight: 400;
	color: #ffef00 !important;
	margin: 20px;
	text-shadow: 1px 1px 4px black;
}
#title2 {
	
		color: #00612e !important;
 -webkit-text-stroke: 1x black;
	
}
#title3 {
	
		color: #ffffff !important;
 -webkit-text-stroke: 1x black;
 	font-size: 35px;

	
}
#title4 {
	
		color: #ffffff !important;
 	font-size: 55px;



	
}


/*
.navbar-nav li:hover>.dropdown-menu
{
	display: block;
}
*/

.navbar
{
	min-height: 57px;
}

.bg-menu
{
	background: #f8f9fa; 
box-shadow: -1px 42px 12px -38px rgba(0,0,0,0.75);
}
nav-link li{
	
	color: black;
}
.sticky {
	width: 100%;
	top: 0;
	left: 0;
	position: fixed;
	z-index: 10;
}


.logo
{
	
	width: 100%;

	padding: 10px;
	
}

.menu
{
	background-color: #0090d7;
	width: 100%;
	height: 40px;
	padding: 10px;
	text-align: center;

	
	
}

.profil
{
	background-color: transparent;
	width: 100%;
	height: 500px;
	margin: auto;
	border: 1px;
}

.osx
{

	bottom: 0px;
	width: 8%;
	max-width: 85px;
	
	height: 500px;
	float: left;
	position: relative;
}


.content
{

    width: 92%;     
	height: 530px;
	float: left;
	overflow-y: hidden;
	overflow-x: scroll;
	position: relative;
	
}


.legenda
{
	width: 100%;  
	height: auto; 
	max-width: 1023px;
	
	
	margin-left: auto; 
	margin-right: auto;
	padding: 10px;
	
	clear: both;
}
.tresc
{
	background: rgba(255, 255, 255, 0.5);
	margin-left: auto; margin-right: auto; margin-top: 50px;
	width: 90%;
	padding: 10px;
	height: auto;
	box-shadow: 1px 1px 7px grey;


}
.tresc2
{
	background: rgba(255, 255, 255, 0.5);
	margin-left: auto; margin-right: auto; margin-top: 50px;
	width: 90%;
	padding: 10px;
	height: auto;
	 text-align: justify;


}
#tresc_text{

font-family: 'Montserrat', sans-serif!important;

}
#leg{ 
 
	width: 100%;  
	height: auto; 
	max-width: 1000px;	  
	text-align: center;  
	
}
#leg_media{ 
 
	width: 100%;  
	height: auto; 
	max-width: 550px;	  
	text-align: center; 
margin-bottom: 5px;	
	
}
.trasa{ 
		  
	text-align: center;  
	width: 80%;   
   bottom: 0px; 
}
#Tabela_01 {
	border-spacing: 0px;
	line-height: 0px;
}
#mapa {
       
		width: 99%; 
		max-width: 300px;
        /* podaj tez width i height */
}

#mapa :hover{
    background: url("images/mapa2.jpg") no-repeat;
}
#logo {  
	width: 100%;  
	height: auto; 
	max-width: 450px;
	padding-top: 50px;
	vertical-align: middle !important;
}
#xxxxx {  
	width: 100%;  
	height: auto; 
max-width: 650px;}

#tolltip_s{
	padding: 0px;
	
}
.c_prof{
	position: absolute;     
      
     
	   float: none
	
}
.prof{
	
	height: "502px";
	position: "absolute";
	bottom: 0px;
}
.prof_v{
	height: auto;
	position: "relative"
}
.prof_f{
	height: auto;
	position: "relative"
}
.prof_p{
	height: auto;
	position: "relative"
	
}
  
#video{ 
       position: absolute;     
       
       top: 71px; 
	   left: 13px;
	   float: none
	   z-index: -1;
          }  	 
#photo{ 
       position: absolute;     
       
       top: 130px; 
	   left: -4px;
	   float: none
          }  
#video2{ 
       position: absolute;     
       
       top: 67px; 
	   left: -2px;
	   float: none
	   z-index: -1;
          }  	 
#photo2{ 
       position: absolute;     
       
       top: 125px; 
	   left: 41px;
	   float: none
          }  	
#video3{ 
       position: absolute;     
       
       top: 56px; 
	   left: 15px;
	   float: none
	   z-index: -1;
          }  	 
#photo3{ 
       position: absolute;     
       
       top: 114px; 
	   left: 2px;
	   float: none
          }  
		  
.tooltip {
    
  
}

.tooltip .tooltip-inner {
	background: black;
}

.jumpers
{
	text-align: center;
}

.jumpers img
{
	width: 100%;
	height: auto;
}

.jumpers p
{
	margin-bottom: 30px;
}

.jumpers figcaption
{
	margin-top: 8px;
}


.bg-jumpers
{
	background-color: #91a33b !important;
}
.footer
{
	
	width: 100%;
	padding: 10px;
	height: auto;
	background: rgba(255, 255, 255, 0.5);
	font-family: 'Montserrat', sans-serif!important;
	box-shadow: 2px 2px 5px gray;

}
.wstep{
	font-family: "Roboto Slab", "Palatino Linotype", Palatino, Garamond, Georgia, serif;
font-size: 3em;
font-style: normal;
font-weight: 700;
line-height: 1.1;
margin-bottom: 1rem;
margin-top: 1rem;

height: auto;
background-color: white;


text-align: center;
	
	padding-top: 70px;
	vertical-align: middle !important;
	
}