@charset "utf-8";
@import url(reset.css);
@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Sans:300,400,700&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700');

*{
font-size:16px;
font-family:'IBM Plex Sans', arial, tahoma, sans-serif;
color:white;
}

body{
margin:0px;
padding:0px;
}

div.container{
width:1150px;
margin:0px auto;
padding:0px;
position:relative;
}

div.wrapper{
width:1150px;
position:relative;
float:left;
margin:0px;
padding:0px;
text-align:center;
}

.top-stripe{
float:left;
height:69px;
width:100%;
}

#rf{
float:left;
margin:20px 0px 0px 20px;
}

#logo{
float:left;
margin:12.5px 0px 0px calc(50% - 365px);
}

#face{
float:right;
margin:23px 20px 0px 0px;
}

.uts-line{
width:calc(100% - 80px);
float:left;
margin-left:40px;
height:1px;
background:#c1c0c0;
}

nav{
margin:0;
padding:15px 0px;
float:left;
width:100%;
height:30px;
text-align:center;
}

nav a{
display:inline-block;
height:30px;
line-height:30px;
padding:0px 20px;
font-size:1em;
color:#5d5d5c;
font-weight:700;
vertical-align:top;
}

nav a:hover,
nav a.current{
background:#dc4a4d;
color:white;
}

.sep{
width:1px;
height:30px;
display:inline-block;
background:url(../img/user/separator.png) repeat-x left top;
vertical-align:top;
margin:0px -4px 0px -4px;
}

.banner,
.banner img{
width:100%;
float:left;
}

.under-banner{
min-height:70px;
float:left;
width:100%;
-webkit-box-shadow: 0px 2px 15px 5px rgba(214,214,214,1);
-moz-box-shadow: 0px 2px 15px 5px rgba(214,214,214,1);
box-shadow: 0px 2px 15px 5px rgba(214,214,214,1);
}

.det-l{
width:calc(50% - 1px);
float:left;
height:40px;
margin:15px 0px 0px 0px;
border-right:1px solid #c1c0c0;
}

.det-r{
width:50%;
float:left;
height:40px;
margin:15px 0px 0px 0px;
}

.det-l a{
height:40px;
line-height:40px;
float:right;
margin:0px 60px 0px 0px;
font-size:1.4em;
color:#5d5d5c;
background:url(../img/user/ico-envelope.png) no-repeat left center;
text-indent:48px;
}

.det-l a:hover{
text-decoration:underline;
}

.det-r a{
height:40px;
line-height:40px;
float:left;
margin:0px 20px 0px 0px;
font-size:1.4em;
color:#5d5d5c;
}

.det-r a:first-child{
margin-left:60px;
background:url(../img/user/ico-phone.png) no-repeat left center;
text-indent:49px;
}

.det-r a:hover{
text-decoration:underline;
}

h1{
width:100%;
float:left;
margin:0px;
padding:44px 0px;
text-align:center;
font-size:1.9em;
font-weight:700;
color:#dc4a4d;
}

p{
width:100%;
float:left;
font-size:1.1em;
text-align:justify;
line-height:1.4em;
color:#5d5d5c;
padding-bottom:44px;
}

.wrapper strong{
color:#5d5d5c;
}

.wrapper ul,
.wrapper ol{
width:calc(100% - 40px);
margin-left:20px;
padding-left:20px;
float:left;
font-size:1.1em;
text-align:justify;
line-height:1.4em;
color:#5d5d5c!important;
padding-bottom:44px;
}

.wrapper ul li,
.wrapper ol li{
color:#5d5d5c;
}

.wrapper ul{
list-style:disc;
}

.wrapper ol{
list-style:decimal;
}

.box{
float:left;
width:23.75%;
margin-left:1%;
margin-top:1%;
position:relative;
cursor:pointer;
z-index:10;
}

.wider{
width:49.5%!important;
margin-left:0!important;
}

.box img{
float:left;
width:100%;
max-height:100%;
}

.box .btitle{
position:absolute;
color:white;
text-shadow:3px 3px 2px black;
bottom:10px;
left:10px;
font-size:1.4em;
color:white;
font-weight:700;
}

.box:hover img{
width:calc(100% - 6px);
border:3px solid #dc4a4d;
}

.whyus{
background:#2a2a2a;
width:100%;
float:left;
margin-top:50px;
}

.whyus h2{
width:100%;
float:left;
text-align:center;
font-size:1.9em;
font-weight:700;
color:white;
padding:42px 0px 25px 0px;
}

.whyus p{
color:white;
}

.map{
width:100%;
float:left;
height:185px;
}

.graysec{
width:100%;
float:left;
background:#c0bfbb;
padding:35px 0px;
text-align:center;
}

.bottom-box{
width:31.3%;
margin:0 3% 0 0 ;
float:left;
}

.bottom-box .title{
width:100%;
float:left;
height:50px;
line-height:20px;
font-size:1.7em;
color:white;
font-weight:700;
text-align:left;
border-bottom:1px solid black;
}

.bottom-box:last-child{
margin-right:0;
}

.bottom-box ul{
float:left;
width:calc(50% - 30px);
color:#dc4a4d;
margin-left:25px;
padding-top:20px;
}

.bottom-box ul li{
font-size:1.2em;
color:#dc4a4d;
line-height:1.6em;
text-align:left;
list-style:disc;
}

.bottom-box ul li a{
color:black;
}

.bottom-box ul li a:hover{
text-decoration:underline;
}

.detail-spacer{
width:100%;
float:left;
height:20px;
}

.details{
float:left;
clear:left;
min-height:35px;
line-height:35px;
padding-left:37px;
}

.details a{
color:black;
}

.details a:hover{
text-decoration:underline;
}

.det1{
background:url(../img/user/ico-b-point.png) no-repeat left center;
}

.det2{
background:url(../img/user/ico-b-phone.png) no-repeat left center;	
}

.det2 a{
padding-right:15px;
}

.det3{
background:url(../img/user/ico-b-envelope.png) no-repeat left center;
}

.bottom-nav{
padding:32px 0px;
}

.tags{
width:70%;
margin:0 0 0 15%;
float:left;
}

.tags p{
font-size:0.7em;
color:black;
font-family:'Roboto Condensed';
font-weight:300;
text-align:center;
}

footer{
width:100%;
height:60px;
background:#d1d1d1;
text-align:center;
margin-bottom:35px;
float:left;
}

.copyright,
.mediasoft{
float:left;
height:60px;
line-height:60px;
font-size:8pt;
color:white;
font-family:tahoma;
}

.mediasoft{
float:right;
}

.mediasoft a{
font-size:8pt;
color:white;
font-family:tahoma;
}

.gallery{
width:100%;
float:left;
padding-bottom:44px;
}

.gallery img{
float:left;
border:4px solid #dc4a4d;
width:22.17%;
/*width:255px;
height:190px;*/
margin:20px 0px 0px calc(2.26% - 6px);
}

.gallery img:hover{
border:4px solid #2a2a2a;
-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
filter: grayscale(100%);
}

.embit{
float:left;
width:100%;
text-align:center;
padding-bottom:44px;
}

.cform{
width:100%;
float:left;
text-align:center;
padding-bottom:44px;
}

.formstripe{
width:100%;
float:left;
margin-top:10px;
text-align:cemter;
}

.formstripe input{
width:50%;
height:40px;
line-height:40px;
float:left;
text-indent:10px;
font-size:1.2em;
color:white;
border:none;
background:#c0bfbb;
margin-left:25%;
}

#email,
#telefon{
width:30%;
}

.formstripe textarea{
width:40%;
padding:1%;
height:120px;
line-height:1.2em;
font-size:1.2em;
color:white;
border:none;
background:#c0bfbb;
margin-left:25%;
float:left;
}

#submitos{
background:#dc4a4d;
text-align:center;
width:10%;
min-width:80px;
text-indent:0px;
cursor:pointer;
}

#submitos:hover{
background:#ae3d3f;
}

.downloads{
width:100%;
float:left;
padding:0px 0px 33px 0px;
}

.dstripe{
width:calc(100% - 70px);
float:left;
min-height:58px;
padding-left:70px;
font-size:1.1em;
text-align:left;
line-height:1.4em;
color:#5d5d5c;
background:url(../img/user/zalacznik.png) no-repeat left top;
padding-top:15px;
margin-bottom:10px;
}

.dstripe:hover{
color:#dc4a4d;
}

#swimming{
float:left;
width:100%;
padding:5px 0px;
background:url(../img/user/logo.png) no-repeat 20px 25px white;
background-size:250px auto;
position:fixed;
top:0;
left:0;
z-index:999;
-webkit-box-shadow: 0px 5px 38px -5px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 5px 38px -5px rgba(0,0,0,0.75);
box-shadow: 0px 5px 38px -5px rgba(0,0,0,0.75);
}

.show{
display:table;
}

.hide{
display:none;
}

.mobile-menu{
width:45px;
height:45px;
background:url(../img/user/rm.png) no-repeat 5px 5px #dc4a4d;
background-size:35px 35px;
border-width:1px 0px 1px 1px;
border-color:white;
border-style:solid;
position:fixed;
top:50px;
right:0px;
z-index:999;
cursor:pointer;
display:none;
}

#ss{
width:298px;
padding:10px;
background:white;
border:1px solid black;
position:fixed;
right:0px;
top:97px;
z-index:900;
height:auto;
}

#ss a{
width:100%;
height:40px;
display:inline-block;
text-align:center;
line-height:40px;
padding:0;
}

#slider{
width:100%;
float:left;
}

ul.bjqs{position:relative; list-style:none;padding:0;margin:0;overflow:hidden; display:none;}
li.bjqs-slide{position:absolute; display:none;}
ul.bjqs-controls{list-style:none;margin:0;padding:0;z-index:9999;}
ul.bjqs-controls.v-centered li a{position:absolute; height:66px; width:37px;}
ul.bjqs-controls.v-centered li.bjqs-next a{right:30px; color:white; font-size:3em; background:url(../img/user/go-right.png) repeat left top; line-height:45px;}
ul.bjqs-controls.v-centered li.bjqs-prev a{left:30px; color:white; font-size:3em; background:url(../img/user/go-left.png) repeat left top; line-height:45px;}
ol.bjqs-markers{list-style: none; padding: 0; margin: 0; width:100%;}
ol.bjqs-markers.h-centered{text-align: center;}
ol.bjqs-markers li{display:inline;}
ol.bjqs-markers li a{display:inline-block;}
p.bjqs-caption{display:block;width:96%;margin:0;padding:2%;position:absolute;bottom:0;}

#acc{
width:25px;
height:25px;
float:left;
}

.acc-text{
float:left;
font-size:14px;
color:#5d5d5c;
text-align:left;
margin-left:20px;
margin-top:2px;
}

.acc-text a{
color:#dc4a4d;
font-size:14px;
}

.acc-text a:hover{
text-decoration:underline;	
}

@media screen and (max-width: 1100px){
	
div.container{
width:100%;
}

div.wrapper{
width:80%;
margin:0 0 0 10%;
overflow-x:hidden;
}

#swimming{
background-size:100px auto;
}

}

@media screen and (max-width: 1100px){
	
.under-banner{
min-height:70px;
}

.det-l{
width:100%;
float:left;
margin:5px 0px 0px 0px;
border-right:0px solid #c1c0c0;
text-align:center;
}

.det-r{
width:100%;
float:left;
height:40px;
margin:5px 0px 0px 0px;
text-align:center;
}

.det-l a{
display:inline-block;
margin:0px;
float:none;
}

.det-r a{
float:none;
display:inline-block;
margin:0px 7.5px;
}

}

@media screen and (max-width: 890px){

#rf{
display:none;
}

#logo{
float:left;
margin:12.5px 0px 0px 10px;
}

#swimming{
background:white;	
}

}

@media screen and (max-width: 750px){

#logo{
width:320px;
margin-top:23px;
}

.bignav,
.bottom-nav{
display:none;
}

.bottom-box ul{
width:calc(100% - 30px);
padding-top:0px;
}

.bottom-box .title{
font-size:1.3em;
}

.tags{
padding-top:45px;
}

.box{
float:left;
width:45.5%;
margin-left:3%;
margin-top:3%;
}

.gallery img{
width:42.5%;
margin:20px 0px 0px calc(5% - 6px);
}

#swimming{
display:none;
}

.mobile-menu{
display:initial;
}
	
}

@media screen and (max-width: 700px){
	
.formstripe input{
width:90%;
margin-left:5%;
}

#email,
#telefon{
width:70%;
}

.formstripe textarea{
width:80%;
margin-left:5%;
}

.acc-text{
width:75%;
}

}

@media screen and (max-width: 550px){

.under-banner{
display:none;
}

.bottom-box{
width:47%;
}

.bottom-box:last-child{
width:100%;
}

}

@media screen and (max-width: 400px){

.box{
float:left;
width:84%;
margin-left:8%;
margin-top:5%;
}

#logo{
width:250px;
}

.bottom-box{
width:95%;
margin:30px 5% 0 0 ;
}

.gallery img{
width:calc(100% - 8px);
margin:20px 0px 0px 0px;
}

}