/*MEDIA QUERY*/
@media only screen and (max-width: 768px) {

	#social, #menu, #banner > div img, #pasekSrodek {
		display: none;
	}
	
	.mobile {display: block!important;}
	.desktop {display: none;}
	
	#czescGlowna img, #czescGlowna iframe {
		width: auto !important;
		max-width: 100% !important;
		height: auto  !important;
		float: none;
		display: block !important;
		padding: 10px 0 !important;
		margin: 0 auto !important;
	}
	
	.szerokoscStrony {
		width: 100%;
		margin: 0 auto;
		position: relative;
	}
	
	#pasekTop {
		width: auto;
		height: auto;
		background: #363d40;
	}
		
		#telefony {
			float: none;
			background: transparent;
		}
		
			#telefony .tekst {
				margin: 10px;
				text-align: center;
			}
			
		#logo {
			max-width: 194px;
			width: auto;
			height: auto;
			float: none;
			margin: 0 auto;
		}
		
	#cssmenu {
    width:100%;
    height:auto; 
    display:block;
    float:none;
    background-color:#fff;
    text-align:right !important;
    border-top:1px solid #eee;
    border-bottom:1px solid #eee;
  }
  
  #cssmenu #menu-button{
  padding:10px 20px;	
  cursor:pointer;
  background-color: #fff;
  }
  
  #cssmenu > ul > #menu-button img{
  	margin-left:20px;
  }
  
  #cssmenu > ul > li > a{
  color:#2d2d2d;	
  }
  
  #cssmenu ul ul{
  padding:0px;
  background-color:#fff;
  }
  
  #cssmenu ul ul li a{
  text-transform:none;	
  }
  
  #cssmenu ul {
    width: auto;
  }
  #cssmenu .submenuArrow,
  #cssmenu #indicatorContainer {
    display: none;
  }
  #cssmenu > ul {
    height: auto;
    width:auto;
    display: block;
  }
  #cssmenu > ul > li {
    float: none;
  }
  #cssmenu li,
  #cssmenu > ul > li {
    display: none;
  }
  #cssmenu ul ul,
  #cssmenu ul ul ul,
  #cssmenu ul > li:hover > ul,
  #cssmenu ul ul > li:hover > ul {
    position: relative;
    left: auto;
    top: auto;
    opacity: 1;
    padding-left: 0;

  }
  #cssmenu ul .has-sub::after {
    display: none;
  }
  #cssmenu ul li a {
    padding: 12px 20px;
    text-transform: uppercase;
    border-top:1px solid #e0e0e0;
  }
  #cssmenu ul ul li a {
    border: 0;
    background: none;
    width: auto;
    padding: 8px 35px;
  }
  #cssmenu ul ul li:hover > a {
    background: none;
    color:#68b646;
    
  }
  #cssmenu ul ul ul a {
    padding: 8px 50px;
  }
  #cssmenu ul ul ul ul a {
    padding: 8px 65px;
  }
  #cssmenu ul ul ul ul ul a {
    padding: 8px 80px;
  }
  #cssmenu ul ul ul ul ul ul a {
    padding: 8px 95px;
  }
  #cssmenu > ul > #menu-button {
    display: block;
    cursor: pointer;
  }
  #cssmenu #menu-button > a {
    padding: 14px 20px;
  }
  #cssmenu ul.open li,
  #cssmenu > ul.open > li {
    display: block;
  }
  #cssmenu > ul.open > li#menu-button > a {
    color: #2d2d2d;
    border-bottom: 1px solid #fff;
  }

  #cssmenu ul.open #menu-button::after,
  #cssmenu ul.open #menu-button::before {
    border-color: #4e4e4e;
  }
	
	
  	#banner {
		width: 100%;
		height: auto;
		background: url('obrazki/zdjecie.jpg') no-repeat top center;
		background-size:contain;
		display: block;
	}
				
		#banner > img {
			width: auto !important;
			max-width: 100% !important;
			height: auto  !important;
			float: none;
			display: block !important;
			padding: 0 0 !important;
			margin: 0 auto !important;
		}
		
		#banner .info {
			width: auto;
			height: auto;
			overflow: visible;
			display: none;
		}
		
		#banner .boksy2 {
			width: 100%;
			height: auto;
			display: block;
			border-top:1px solid #353d40;
		}
		#banner .boksy2 .box1, 
		#banner .boksy2 .box2 {
			display: block;
			float: none;
			width: auto;
			height: auto;
			margin: 0 20px;
			padding: 0 0 20px 0;
		  	overflow: visible;
		}		
				#banner .boksy2 .box1 img, 
				#banner .boksy2 .box2 img {
			  		position: relative;
					margin: 0;
					padding: 0;
				}
				
	#czescGlowna {
		padding: 20px;
	}
				
	#kolumnaLewa, #kolumnaPrawa {
		clear: both;
		display: block;
	}
	
	#kolumnaOdstep {
		clear: both;
		display: table;
	}
	
	#kolumnaPrawa {
		display: none;
	}
	#kolumnaLewa {
		width: auto;
	}
			
				#galeriaPodstrona .element {
					width: auto;
					max-width: 320px;
					height: auto;
					float: none;
					margin: 0 auto;
				}
	
	#galeriaGlowna {
		width: auto;
		height: auto;
		padding: 0 0 20px 0;
	}
	
		#galeriaGlowna h2 {
			margin: 20px;
			padding: 20px 20px 5px 20px;
		}
		
		#galeriaGlowna .element {
			width: auto;
			max-width: 320px;
			height: auto;
			overflow: hidden;
			margin: 0 auto;
			padding: 0;
			float: none;
			z-index: 100;
			display: block;
		}
	
	#stopka {
		width: auto;
		height: auto;
		padding: 0 20px;
	}
	
		#stopka > div {
			display: block;
		}
	
		#stopka .boks1 {
			width: auto;
			height: auto;
		}
	
		#stopka .boks1 {
			width: auto;
			height: auto;
		}
	
		#stopka .boks3 {
			width: auto;
			height: auto;
		}
	
		#stopka .boks4 {
			width: auto;
			height: auto;
		}
	
		#stopka .odstep {
			width: 1px;
			height: 1px;
			display: table-row;
		}
		
	#podpisTlo {
		width: auto;
		height: auto;
		padding: 20px 20px;
	}

	#podpis {
		width: auto;
		height: auto;
		text-align: center;
		display: block;
	}
	
	#jellinek {
		width: auto;
		height: auto;
		text-align: center;
		display: block;
	}
	

}