﻿@viewport {
    width: device-width;
}

/* RESET CSS */



html, body, div, span, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

abbr, address, cite, code,

del, dfn, em, img, ins, kbd, q, samp,

small, strong, sub, sup, var,

b, i,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, figcaption, figure, 

footer, header, hgroup, menu, nav, section, summary,

time, mark, audio, video {

    margin:0;

    padding:0;

    border:0;

    outline:0;

    font-size:100%;

    vertical-align:baseline;

    background:transparent;

	font-family: Arial, Verdana, Geneva, sans-serif;

}



body {

    line-height:1;

	background: #FFF;
	
	margin: 0 auto;
	
	background-attachment: fixed; 

}



article,aside,details,figcaption,figure,

footer,header,hgroup,menu,nav,section { 

    display:block;

}



nav ul {

    list-style:none;

}



blockquote, q {

    quotes:none;

}



blockquote:before, blockquote:after,

q:before, q:after {

    content:'';

    content:none;

}



a {

    margin:0;

    padding:0;

    font-size:100%;

    vertical-align:baseline;

    background:transparent;

}



ins {

    background-color:#ff9;

    color:#000;

    text-decoration:none;

}



mark {

    background-color:#ff9;

    color:#000; 

    font-style:italic;

    font-weight:bold;

}



del {

    text-decoration: line-through;

}



abbr[title], dfn[title] {

    border-bottom:1px dotted;

    cursor:help;

}



table {

    border-collapse:collapse;

    border-spacing:0;

}



a {
	outline: none;
}





hr {

    display:block;

    height:1px;

    border:0;   

    border-top:1px solid #cccccc;

    margin:1em 0;

    padding:0;

}



input, select {

    vertical-align:middle;

}


@font-face {
    font-family: 'primelight';
    src: url('../font/prime_light-webfont.eot');
    src: url('../font/prime_light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/prime_light-webfont.woff') format('woff'),
         url('../font/prime_light-webfont.ttf') format('truetype'),
         url('../font/prime_light-webfont.svg#primelight') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'primeregular';
    src: url('../font/prime_regular-webfont.eot');
    src: url('../font/prime_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/prime_regular-webfont.woff') format('woff'),
         url('../font/prime_regular-webfont.ttf') format('truetype'),
         url('../font/prime_regular-webfont.svg#primeregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* KLASY OGÓLNE */

.clear {
	clear: both;
}

.center {
	width: 1000px;
	margin: 0 auto;
}

.center50 {
	width: 1050px;
	margin: 0 auto;
}

/* HEADER */

header {
	background: url(../images/header.jpg) no-repeat center top;
	height: 435px;
}

html body header div.center50 img.obrazki {
	float: right;
	margin-top: -71px;
	padding-left: 200px;
}

html body header div.center50 img.obrazki_mid {
	display: none;
}

html body header div.center50 div.header_mid {
	display: none;
}

/* CONTENT */

.content {
	width: 1000px;
	margin: 0 auto;
}

html body section.content h2.page_title {
	margin-top: 25px;
	font-family: 'primeregular', Verdana, Sans-Serif;
	font-weight: normal;
	font-size: 20px;
	background: url(../images/title_bg.jpg) no-repeat;
	padding-left: 34px;
}
	

section.box {
	width: 250px;
	float: left;
	margin-left: 30px;
	margin-right: 65px;
	font-size: 12px;
	line-height: 19px;
	margin-top: 50px;
	margin-bottom: 50px;
}

section.box_last {
	margin-right: 0px;
}

section.box h2 {
	font-family: 'primeregular', Verdana, Sans-Serif;
	font-weight: normal;
	color: #0044ab;
	font-size: 20px;
	margin-bottom: 10px;
}

html body section.content img {
	margin-left: 35px;
	margin-right: 10px;
	margin-top: 20px;
	margin-bottom: 20px;
	box-shadow: 0px 0px 6px #7b7b7b;
	-webkit-transition: all 200ms linear;
		-moz-transition: all 200ms linear;
        -ms-transition: all 200ms linear;
        -o-transition: all 200ms linear;
		transition: all 200ms linear;
}

html body section.content img:hover {
	opacity: 0.6;
	-webkit-transition: all 200ms linear;
		-moz-transition: all 200ms linear;
        -ms-transition: all 200ms linear;
        -o-transition: all 200ms linear;
		transition: all 200ms linear;
}

/* FOOTER */

footer {
	height: 265px;
	background: #dcdcdc
}

html body footer div.center section.box ul li a { 
	font-family: 'primelight'; 
	color: #262626;
	text-decoration: none;
	font-size: 15px;
}

html body footer div.center section.box ul li {
	margin-top: 7px;
	margin-bottom: 7px;
}

html body footer div.center section.box ul {
	list-style: none;
}

html body footer div.center section.box {
	margin-top: 25px;
	margin-bottom: 0px;
}

html body footer div.center section.box h2 {
	background: url(../images/pasek.jpg) no-repeat 0px 30px;
	padding-bottom: 20px;
	margin-bottom: 5px;
}

html body footer div.center section.box p {
	font-family: 'primelight'; 
	color: #262626 !important;
	text-decoration: none;
	font-size: 15px;
	line-height: 27px;
}

div#slideshow {
	width: 150px; height: 50px; padding: 15px 0 0 12px;
	position: relative; z-index: 5;
	margin-left: 15px;
}

div#slideshow ul#nav {
	list-style: none;
}
	div#slideshow ul#nav li#prev {
		float: left; margin: 0 0 0 -20px;
	}
	div#slideshow ul#nav li#next {
		float: right; margin: 0 -20px 0 0;
	}
	div#slideshow ul#nav li a {
		display: block; width: 10px; height: 16px; text-indent: -9999px;
	}
		div#slideshow ul#nav li#prev a {
			background: url(../images/arrow_left.jpg);
		}
		div#slideshow ul#nav li#next a {
			background: url(../images/arrow_right.jpg);
		}

	div#slideshow ul#slides {
		list-style: none;
		margin: 0 auto;
		margin-top: -10px;
	}
		div#slideshow ul#slides li {
			margin: 0 0 40px 0;
		}


/* RESPONSIVE */

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

html body header div.center50 div#Stage.headeranim {
	display: none;
}

html body header div.center50 div.header_mid {
	display: block;
}

section.box { 
	width: 27%;
	margin-left: 30px;
	margin-right: 10px;
	font-size: 12px;
	line-height: 19px;
	margin-top: 50px;
	margin-bottom: 50px;
}

html body header div.center50 div.header_mid div.logo {
	width: 256px;
	background: rgba(0,0,0, 0.7);
	float: left;
	height: 100px;
}


.center {
	width: 100%;
}

.content {
	width: 100%;
}

.center50 {
	width: 100%;
}

html body header div.center50 img.obrazki {
	display: none;
}

html body header div.center50 img.obrazki_mid {
	display: block;
	float: right;
	margin-top: 59px;
	margin-right: 5%;
}

html body header div.center50 div.header_mid div.slogan_mid {
	width: 440px;
	height: 141px;
	background: url(../images/slogan_mid.png) no-repeat;
	margin-left: 40%;
	margin-top: -200px;
}

html body header div.center50 div.header_mid div.nav ul {
	background: rgba(0,0,0, 0.6);
	list-style: none;
	height: 30px;
	padding-top: 12px;
	padding-right: 15px;
}

html body header div.center50 div.header_mid div.nav ul li a {
	font-family: 'primeregular', Verdana, Sans-Serif;
	color: #FFF;
	text-decoration: none;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 13px;
}

html body header div.center50 div.header_mid div.nav {
	height: 30px;
	margin-left: 256px;
	width: 65%;
	padding-top: 58px;
}

html body header div.center50 div.header_mid div.oferta {
	background: rgba(0,0,0, 0.5);
	width: 256px;
}

html body header div.center50 div.header_mid div.logo img {
	position: absolute;
	margin-top: 10px;
}
	
	
	

html body header div.center50 div.header_mid div.nav ul li {
	float: right;
}

html body header div.center50 div.header_mid div.oferta h2 {
	padding-top: 20px;
	background: url(../images/title_oferta.png) 0px 20px no-repeat;
	color: #FFF;
	font-family: 'primeregular', Verdana, Sans-Serif;
	font-weight: normal;
	font-size: 22px;
	padding-left: 50px;
	margin-bottom: 20px;
	
}

html body header div.center50 div.header_mid div.oferta p {
	padding-left: 50px;
	font-family: 'primelight'; 
	color: #FFF;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 15px;
}

html body header div.center50 div.header_mid div.logo img.logo_small {
	display: none;
}

}

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

html body header div.center50 img.obrazki_mid {
	display: none;
}

html body header div.center50 div.header_mid div.oferta {
	display: none;
}

html body header div.center50 div.header_mid div.logo {
	float: none;
}

html body header div.center50 div.header_mid div.nav {
	width: 100%;
	margin-left: 0px;
}

html body header div.center50 div.header_mid div.nav ul li a {
	display: block;
	white-space: nowrap;
	font-size: 15px;
}

html body header div.center50 div.header_mid div.nav ul li {
	width: 25%;
	text-align: center;
}

html body header div.center50 div.header_mid div.nav ul li:last-child {
	display: none;
}

html body header div.center50 div.header_mid div.slogan_mid {
	background: url(../images/slogan_small.png) no-repeat;
    background-size: contain;
	width: 440px;
	height: 141px;
	margin: 0 auto;
    max-width: 100%;
}

html body header div.center50 div.header_mid div.logo img.logo_mid {
	/*display: none;*/
    position: relative;
}

html body header div.center50 div.header_mid div.logo {
	width: 438px;
	margin: 0 auto;
	background: none;
	padding-top: 20px;
    text-align: center;
    max-width: 100%;
}

html body header div.center50 div.header_mid div.slogan_mid {
	margin-top: 45px;
}

div#slideshow ul#nav {
	display: none;
}

}

@media screen and (max-width: 650px) {
    html body footer div.center section.first {
    	display: none;
    }

    html body footer div.center section.box {
    	width: 100%;
    }

    html body section.content section.box {
    	width: 80%;
    }

    html body footer div.center section.box div#slideshow ul#slides li img {
    	/*width: 200%;*/
    }

    div#slideshow {
    	width: 35%;
    }

    div#slideshow ul#nav {
    	display: none;
    }

    footer {
        height: initial;
        border-top: 5px solid #989898;
        padding-top: 10px;
    }

    footer section.box {
        float: none;
        margin: 20px 0px 0px;
        padding: 0px 20px;
        box-sizing: border-box;
    }



    /*html body header div.center50 div.header_mid div.logo img.logo_mid {
    	display: block;
    }*/
}