body {max-width:1900px;overflow-x:hidden;width:100%;background:#fff;font-family:'Open Sans',arial,verdana,tahoma;padding:0px;margin:0 auto;text-align:center;font-size:17px;line-height:26px;color:#393b44;}
h1 {font-size:43px;color:#fff;font-weight:800;font-family:'Montserrat',arial,tahoma,verdana;text-align:center;text-transform: uppercase;margin: 8px;letter-spacing:1px;}
h3 {font-size:32px;color:#393b44;font-weight:800;font-family:'Montserrat',arial,tahoma,verdana;text-align:center;text-transform: uppercase;margin: 5px;}
h4 {font-size:32px;color:#393b44;font-weight:800;font-family:'Montserrat',arial,tahoma,verdana;text-align:center;text-transform: uppercase;margin-bottom: 5px;}
h5 {font-size:14px;color:#393b44;font-weight:400;font-family:'Play',arial,tahoma,verdana;text-align:center;text-transform: uppercase;letter-spacing:1.25px;margin:0 auto 32px;}
h6 {font-size:20px;line-height:30px;color:#393b44;font-weight:300;font-family:'Open Sans',arial,tahoma,verdana;text-align:center;margin-top:26px;margin-bottom:26px;}


p{font-size:17px;line-height:26px;color:#393b44;font-weight:300;font-family:'Open Sans',arial,tahoma,verdana;text-align:center;}
a{text-decoration:none;color:#393b44;font-family:'Open Sans', arial,tahoma,verdana;font-weight:300;}
a:hover{text-decoration:none;color:#d1282f;}
button {border:2px solid #d1282f;padding:10px 42px;cursor:pointer;background:#fff;font-size:17px;letter-spacing:1px;color:#d1282f;font-weight:400;font-family:'Play',arial,tahoma,verdana;text-transform:uppercase;margin:60px auto 30px;-webkit-transition: all 0.25s;transition: all 0.25s}
button:hover {color:#fff;background:#d1282f;}
.clear {width:100%;clear:both;height:0;}

.logo {top:0;left:0;position:absolute;}
.menu {top:50px;right:50px;position:fixed;z-index:10}
.menu img {cursor:pointer;}

#start {width:100%;background: url(i/cywka-sport.jpg) center center fixed;z-index:-10;-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.start {width:92%;padding:370px 4% 220px;}
.start h5 {color:#fff;font-size:16px;}
.start h6 {padding:15px 0 80px;text-align:center;max-width:960px;margin:auto;font-size:17px;color:#fff;font-weight:700;}
.start img {cursor:pointer;opacity:0.68;-webkit-transition: opacity 0.25s;transition: opacity 0.25s}	.start img:hover {opacity:1}


#oferta {width:100%;background:transparent url(i/top.png) center top;background-repeat:no-repeat;margin-top:-270px;padding-top:70px;}
.oferta {width:92%;padding:50px 4% 140px;}
.oferta p {float:left;border-right:1px solid #9c9c9c;padding:15px 4.5% 15px 12%;text-align:right;width:33%;}
.oferta p:last-of-type {border:0;padding-right:0;text-align:left;padding:15px 12% 15px 4.5%;}
.fb-oferta {width:90%;margin:auto;text-align:right;}
.kontakt-oferta {width:90%;margin:60px auto 0 auto;}
.kontakt-oferta p {text-align:left;color:#fff;font-weight:400;text-transform:uppercase;margin-top:7px;margin-bottom:0}
.kontakt-oferta a, .kontakt-oferta a:hover {color:#fff;}	


#kategorie {width:100%;background:#fff;}
.kategorie-blok {width:33.23%;float:left;padding: 0 0.1% 0 0;position: relative;cursor:pointer;}
.kategorie-blok:last-of-type {width:33.23%;float:left;padding: 0 0 0;}
.start-oferta h2, .start-oferta p {text-align: left;}
.kategorie-okienka {width:100%;}
.kategorie-okienka-txt {position: absolute;bottom: 180px;left: 0;width:100%;padding: 30px 0 30px;background: transparent;display: block;height: 60px;}
.kategorie-okienka-txt button {font-size:28px;text-align: right;margin: 0;line-height: 22px;padding:60px 5% 40px;border:0;width: 90%;background: transparent;color:#fff}
.kategorie-okienka-txt button:hover {font-size:28px;text-align: right;line-height: 22px;padding:40px 5% 60px;color:#fefceb;border:0;width: 90%;}
.kategorie-okienka-txt h3, .kategorie-okienka-txt h5, .kategorie-okienka-txt h6 {color:#fff;margin-left:auto;margin-right:auto;text-shadow:3px 3px 3px rgba(0,0,0,0.33)}
.kategorie-okienka-txt h6 {text-transform:none;font-size:16px;letter-spacing:0;line-height:26px;max-width:400px;}


#opinie {width:100%;background:#141517 url(i/cywkasport-opinie.jpg) center center fixed;margin:-5px auto 0 auto;padding:0;-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.opinie {margin:0 auto;background:rgba(25,33,77,0.84);padding: 150px 0 120px;}
.opinie h4, .opinie h5, .opinie p, .opinie span {color:#fff;max-width:730px;margin-left:auto;margin-right:auto;}
.opinie p {font-family:'Allura',arial,tahoma,verdana;font-size:26px;font-style:italic;letter-spacing:0.5px;line-height:34px;}
.opinie small {font-size:13px;font-style:italic;}


#galeria {width:100%;background:#fff;}
.galeria {width:92%;padding:140px 4% 120px;background:rgba(2255,255,255,0.8)}
.galeria h6 {max-width:580px;margin-left:auto;margin-right:auto;}
.galeria p {margin:0 auto;max-width:1020px;text-align:center;}



#pilka {width:100%;}
.pilka-blok {width: 100%;box-sizing: border-box;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.pilka-tlo {width: 50%;padding: 0;background: #39b4ed url(i/cywka-sport-pilka.jpg) center center;background-size: auto;min-height: 370px;float: left;background-size: cover !important;}
.pilka {width:42%;padding:160px 4%;background:#728f3d;}
.pilka p, .pilka h3, .pilka h5, .pilka h6 {color:#fff;text-align:left;max-width:670px;margin-left:auto;margin-right:auto;-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}


#basen {width:100%;background:#fff url(i/cywkasport-basen.jpg) center top;background-repeat:no-repeat;line-height: 0;}
.basen {width:92%;padding:160px 4%;background: rgba(255,255,255,0.88);line-height: 0;}

.basen h6 {max-width:580px;margin-left:auto;margin-right:auto;}
.basen p {float:left;border-right:1px solid #9c9c9c;padding:5px 4.5% 5px 6%;text-align:right;width:39%;margin:40px 0 20px 0;}
.basen p:last-of-type {border:0;padding-right:0;text-align:left;padding:5px 6% 5px 4.5%;}


#narty {width:100%;background:#141517 url(i/cywka-sport-narty.jpg) center top;background-repeat:no-repeat;-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
.narty {width:42%;padding:160px 4%;background:rgba(48, 89, 165, 0.8)}
.narty p, .narty h6 {max-width:670px;margin-left:auto;margin-right:auto;}
.narty p, .narty h3, .narty h5, .narty h6 {color:#fff;}

#zakonczenie {max-width:580px;margin:100px auto 80px auto;}

#fb {width:100%;margin:100px auto;}
#fb p {margin:0 auto;max-width:1020px;text-align:center;}
#fb img {margin-bottom: 80px;opacity:1;}
#fb img:hover {opacity:0.78;-webkit-transition: opacity 0.25s;transition: opacity 0.25s}
.fb-galeria {width:100%;margin:0 auto 20px}
.fb-galeria img {width:16.665%;opacity:1;-webkit-transition: opacity 0.25s;transition: opacity 0.25s} .fb-galeria img:hover {opacity:0.66}

#kontakt {background:#eaeaea;width:100%;margin:0 auto 0 auto;border-bottom: 5px solid #d1282f;padding: 100px 0 100px;}
#mapa {-webkit-filter: grayscale(100%);filter: grayscale(100%);}
#stopka {font-size:13px;line-height:25px;color:#eee;background:#151515;font-weight:300;font-family:'Open Sans',arial,tahoma,verdana;text-align:center;padding:15px 0;margin-top:-5px;letter-spacing:1.25px}
#stopka a {font-size:13px;color:#eee;}		#stopka a:hover {color:#d1282f;}


  .sidenav {display:block;height: 100%;width: 0;position: fixed;z-index: 10;top: 0;right: 0;background-color: rgba(0,0,0,0.94);overflow-x: hidden;transition: 0.5s;padding-top: 80px;}
  .sidenav .closebtn {position: absolute; top: 20px;right: 25px;font-size: 42px;margin-left: 50px;color:#fff;font-weight:300}
  nav ul {display: inline-block;text-align:right;margin: 0 auto; padding: 0 0;height: 50px;color: #606366;font-size:13px;font-weight:400;font-family:roboto,arial,tahoma,verdana;}
nav ul li {display: flex; list-style: none; line-height: 15px; margin:0;padding:0;height: 34px;padding:15px 0 0;}
nav ul li a {color: #fff;font-size:18px;font-weight:300;font-family:'Open Sans',arial,tahoma,verdana;letter-spacing: 0.5px;padding:16px 10px;margin:0;-webkit-transition: all 0.3s; transition: all 0.3s;text-transform:uppercase;}
nav ul li a:hover {opacity:1;text-decoration: none;color: #d1282f;}
.galeria-mobilna {display:none;}

    #main {transition: all 0.5s;}
  
 @media (max-width: 920px) {
 .kontakt-oferta, .fb-oferta, .galeria-kafelki {display:none;}
 .oferta {padding: 200px 5% 140px;width:90%}
 .oferta p:last-of-type, .oferta p {border: 0;text-align: center;padding: 15px 0;width:100%;margin:auto}
 .kategorie-blok {width: 100%;float: none;padding: 0 0;}
 .basen {width:90%;padding:140px 5% 160px;background:#4c71b7;margin-left:0}
 .narty p:last-of-type, .narty p, .basen p, .basen h3, .basen h5, .basen h6 {border: 0;text-align: center;padding: 15px 0;width:100%;margin:auto}
 .pilka {width:90%;padding:140px 5% 160px;margin-left:0}
 .galeria {width: 90%; padding: 140px 5% 120px;}
 h1,  h3 {  font-size: 32px;line-height: 32px;}
 .kategorie-okienka-txt h6, .fb-galeria {display: none;}
 .pilka-tlo {width: 100%;}
 .narty {width: 90%;padding: 160px 5%;}
 .basen {background: #fff;}
 .pilka p, .pilka h3, .pilka h5, .pilka h6, .basen p, .basen h3, .basen h5, .basen h6, .narty p, .narty h3, .narty h5, .narty h6, .basen p:last-of-type {text-align: center;padding: 0;}
 .logo {background:transparent;}
 .galeria-mobilna {display:block;}
 .galeria-mobilna img {margin-bottom:25px;}
 }
 
 .mySlides {display: none;}
 img {vertical-align: middle;}
 
 /* Slideshow container */
 .slideshow-container {
   max-width: 1000px;
   position: relative;
   margin: auto;
 }
 
 /* Caption text */
 .text {
   color: #f2f2f2;
   font-size: 15px;
   padding: 8px 12px;
   position: absolute;
   bottom: 8px;
   width: 100%;
   text-align: center;
 }
 
 /* Number text (1/3 etc) */
 .numbertext {
   color: #f2f2f2;
   font-size: 12px;
   padding: 8px 12px;
   position: absolute;
   top: 0;
 }
 
 /* The dots/bullets/indicators */
 .dot {
   height: 15px;
   width: 15px;
   margin: 0 2px;
   background-color: #bbb;
   border-radius: 50%;
   display: inline-block;
   transition: background-color 0.6s ease;
 }
 
 .active {
   background-color: #717171;
 }
 
 /* Fading animation */
 .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}
 }
 
 /* On smaller screens, decrease text size */
 @media only screen and (max-width: 300px) {
   .text {font-size: 11px}
 }