* {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    box-sizing: border-box;
}

body {
    background-color: #E8EAED;
    background-image: url(obrazki/tlo.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    width: 100vw;
}
header {
	background-color: #E8EAED;
}

#wrapper {
    max-width: 678px;
    margin: 0 auto;
    background-color: #E8EAED;
}

header img {
    max-width: 100%;
	padding: 20px;
	margin-top: 10px;
	margin-bottom: 10px;
	
}


h1 {
    font-size: 16px;
    background-color: #26364f;
    padding: 10px 20px 20px 50px;
    text-align: left;
    color: white;
    font-weight: 700;
}
.kontakt h1 {
    font-size: 18px;
    background-color: #26364f;
    padding: 20px 20px 0px 50px;
    text-align: left;
    color: white;
    font-weight: 700;
}

.kontakt h3 {
    font-size: 18px;
    background-color: #26364f;
    padding: 20px 20px 0px 50px;
    text-align: left;
    color: white;
    font-weight: 700;
}
.cennik {
background-color: #E8EAED;
border-style: solid;
border-width: 0px;
border-color: #26364f;
}
.cennik h1 {
    font-size: 18px;
    background-color: #E8EAED;
    padding: 20px 20px 20px 50px;
    text-align: left;
    color: black;
    font-weight: 700;
}
#cennik_tekst{
	background-color: #E8EAED;
	color: black;
	padding: 0px 30px 0px 70px;
}
.tekst {
    font-size: 16px;
    background-color: #26364f;
    padding: 20px 30px 50px 70px;
    text-align: left;
    color: white;
}
.gallery {
	height: 470px;
}
.cennik img {
    max-width: 100%;
    display: block;
    background-color: #E8EAED;
}

.kontakt img {
    max-width: 100%;
    display: block;
    background-color: #cd5c5c;
}

.cennik h2 {
    font-size: 14px;
    line-height: 2;
    padding: 10px 20px 20px 0px;
    text-align: left;
    color: black;
    font-weight: 300;
	}
	
.kontakt h2 {
    font-size: 26px;
    text-align: left;
    color: white;
    font-weight: 600;	
	background-color: #26364f;
	padding: 10px 20px 0px 50px;
}
.kontakt {
	height: 340px;
    background-color: #26364f;
 }

footer {
    height: 40px;
    background-color: #26364f;
}

.footer_left {
    float: left;
    width: 35%;
    background-color: #26364f;
    text-align: center;
    
}

.footer_right {
    float: left;
    width: 65%;
    background-color: #26364f;
}

footer h1 {
    font-size: 16px;
    padding: 30px 0px 0px 0px;
    text-align: left;
    color: white;
    font-weight: 700;
}
footer h2 {
    font-size: 14px;
    line-height: 2;
    padding: 10px 0px 20px 0px;
    text-align: left;
    color: white;
    font-weight: 300;
}

a {
    /*font-size: 14px; */
    line-height: 2;
    /*text-decoration: none;*/
    padding: 10px 0px 0px 0px;
    text-align: left;
    color: white;
    /*font-weight: 300;*/
}
.kontakt a {
    font-size: 20px;
    line-height: 2;
    text-decoration: none;
    padding: 10px 0px 0px 0px;
    text-align: left;
    color: white;
    font-weight: 300;
}
a:hover {
    color: #cd5c5c;
}

footer img {
    max-width: 80%;
	
}
footer p{
	font-size: 12px;
	padding: 10px 10px 10px 20px;
	color: white;
}
#kontakt_header {
	height: 140px;
}

.inner_list {
	padding: 5px 0px 5px 40px;
}


@media (max-width:600px) {
    h1 {
        font-size: 16px;
        background-color: #26364f;
        padding: 20px 10px 20px 20px;
        text-align: left;
        color: white;
        font-weight: 700;
    }
    .tekst {
        font-size: 16px;
        background-color: #26364f;
        padding: 0px 10px 20px 40px;
        text-align: left;
        color: white;
    }
	.kontakt h2 {
    font-size: 26px;
    text-align: left;
    color: white;
    font-weight: 600;	
	background-color: #26364f;
	padding: 10px 20px 0px 20px;
	}
	.kontakt a {
    font-size: 15px;
    line-height: 2;
    text-decoration: none;
    padding: 10px 0px 0px 0px;
    text-align: left;
    color: white;
    font-weight: 300;
	}
	#slideshow-wrap label[for=button-1] { margin-left: -96px }
	#slideshow-wrap label[for=button-2] { margin-left: -48px }
	#slideshow-wrap label[for=button-4] { margin-left: 48px }
	#slideshow-wrap label[for=button-5] { margin-left: 96px }
}

@font-face {
    font-family: 'WebSymbolsRegular';
    src: url('http://html5css3demos.bplaced.net/css3-slider-v3/websymbols-regular-webfont.eot');
    src: url('http://html5css3demos.bplaced.net/css3-slider-v3/websymbols-regular-webfont.eot?#iefix') format('embedded-opentype'), url('http://html5css3demos.bplaced.net/css3-slider-v3/websymbols-regular-webfont.woff') format('woff'), url('http://html5css3demos.bplaced.net/css3-slider-v3/websymbols-regular-webfont.ttf') format('truetype'), url('http://html5css3demos.bplaced.net/css3-slider-v3/websymbols-regular-webfont#WebSymbolsRegular') format('svg');
}

@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,700);

#slideshow-wrap {
    display: block;
    height: 400px;
    min-width: 260px;
    max-width: 640px;
    margin: auto;
    -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,.8);
    -moz-box-shadow: 0px 0px 5px rgba(0,0,0,.8);
    box-shadow: 0px 0px 5px rgba(0,0,0,.8);
    margin-top: 20px;
    position: relative;
}

#slideshow-inner {
    width: 100%;
    height: 100%;
    background-color: rgb(0,0,0);
    overflow: hidden;
    position: relative;
}

#slideshow-inner>ul {
    list-style: none;
    height: 100%;
    width: 500%;
    overflow: hidden;
    position: relative;
    left: 0px;
    -webkit-transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
    -moz-transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
    transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
}

#slideshow-inner>ul>li {
    width: 20%;
    height: 400px;
    float: left;
    position: relative;
}

#slideshow-inner>ul>li>img {
    margin: auto;
    height: 100%;
}

#slideshow-wrap input[type=radio] {
    position: absolute;
    left: 50%;
    bottom: 15px;
    z-index: 100;
    visibility: hidden;
}

#slideshow-wrap label:not(.arrows):not(.show-description-label) {
    position: absolute;
    left: 50%;
    bottom: -45px;
    z-index: 100;
    width: 12px;
    height: 12px;
    background-color: rgba(200,200,200,1);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    cursor: pointer;
    -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,.8);
    -moz-box-shadow: 0px 0px 3px rgba(0,0,0,.8);
    box-shadow: 0px 0px 3px rgba(0,0,0,.8);
    -webkit-transition: background-color .2s;
    -moz-transition: background-color .2s;
    -o-transition: background-color .2s;
    transition: background-color .2s;
}

#slideshow-wrap label:not(.arrows):active { bottom: -46px }

#slideshow-wrap input[type=radio]#button-1:checked~label[for=button-1] { background-color: #26364f }

#slideshow-wrap input[type=radio]#button-2:checked~label[for=button-2] { background-color: #26364f }

#slideshow-wrap input[type=radio]#button-3:checked~label[for=button-3] { background-color: #26364f }

#slideshow-wrap input[type=radio]#button-4:checked~label[for=button-4] { background-color: #26364f }

#slideshow-wrap input[type=radio]#button-5:checked~label[for=button-5] { background-color: #26364f }

#slideshow-wrap label[for=button-1] { margin-left: -96px }

#slideshow-wrap label[for=button-2] { margin-left: -48px }

#slideshow-wrap label[for=button-4] { margin-left: 48px }

#slideshow-wrap label[for=button-5] { margin-left: 96px }

#slideshow-wrap input[type=radio]#button-1:checked~#slideshow-inner>ul { left: 0 }

#slideshow-wrap input[type=radio]#button-2:checked~#slideshow-inner>ul { left: -100% }

#slideshow-wrap input[type=radio]#button-3:checked~#slideshow-inner>ul { left: -200% }

#slideshow-wrap input[type=radio]#button-4:checked~#slideshow-inner>ul { left: -300% }

#slideshow-wrap input[type=radio]#button-5:checked~#slideshow-inner>ul { left: -400% }

label.arrows {
    font-family: 'WebSymbolsRegular';
    font-size: 55px;
    color: rgb(255,255,240);
    position: absolute;
    top: 50%;
    margin-top: -25px;
    display: none;
    opacity: 1;
    cursor: pointer;
    z-index: 1000;
    background-color: transparent;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s;
    text-shadow: 0px 0px 3px rgba(0,0,0,.8);
}

label.arrows:hover { opacity: 1 }

label.arrows:active { margin-top: -23px }

input[type=radio]#button-1:checked~.arrows#arrow-2, input[type=radio]#button-2:checked~.arrows#arrow-3, input[type=radio]#button-3:checked~.arrows#arrow-4, input[type=radio]#button-4:checked~.arrows#arrow-5 {
    right: 10px;
    display: block;
}

input[type=radio]#button-2:checked~.arrows#arrow-1, input[type=radio]#button-3:checked~.arrows#arrow-2, input[type=radio]#button-4:checked~.arrows#arrow-3, input[type=radio]#button-5:checked~.arrows#arrow-4 {
    left: 10px;
    display: block;
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
}

input[type=radio]#button-2:checked~.arrows#arrow-1 { left: 45px }

input[type=radio]#button-3:checked~.arrows#arrow-2 { left: 25px }

input[type=radio]#button-5:checked~.arrows#arrow-4 { left: -10px }

.description {
    position: absolute;
    top: 0;
    left: 0;
    width: 260px;
    font-family: 'Yanone Kaffeesatz';
    z-index: 1000;
}

.description input { visibility: hidden }

.description label {
    font-family: 'WebSymbolsRegular';
    background-color: rgba(255,255,240,1);
    position: relative;
    left: -17px;
    top: 00px;
    width: 40px;
    height: 27px;
    display: inline-block;
    text-align: center;
    padding-top: 7px;
    border-bottom-right-radius: 15px;
    cursor: pointer;
    opacity: 0;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s;
    z-index: 5;
    color: rgb(20,20,20);
}

#slideshow-inner>ul>li:hover .description label { opacity: 1 }

.description input[type=checkbox]:checked~label { opacity: 1 }

.description .description-text {
    background-color: rgba(255,255,230,.5);
    padding-left: 45px;
    padding-top: 25px;
    padding-right: 15px;
    padding-bottom: 15px;
    position: relative;
    top: -35px;
    z-index: 4;
    opacity: 0;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s;
    color: rgb(20,20,20);
}

.description input[type=checkbox]:checked~.description-text { opacity: 1 }

