@media screen and (min-width: 1024px) {

/* #Reset & Basics (Inspired by E. Meyers)
================================================== */
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline; }
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block; }
	body {
		line-height: 1; }
	ol, ul {
		list-style: none; }
	blockquote, q {
		quotes: none; }
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
		content: none; }
	table {
		border-collapse: collapse;
		border-spacing: 0; }

/* */


#separator1 .bg, #intro {
	background-attachment: fixed !important;
}

html, body { width: 100%; height: 100%; }

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

#main_image { width: 100%; height: 100%; background-color: #000; margin: 0 0 0 0; position: realtive; }
	#main_image .slide { position: absolute; z-index: 10; opacity: 0;
		width: 100%; height: 100%;
		background-color: #000;
		background-repeat: no-repeat;
		background-position: center center;
	}

div.center_page {
	width:1020px;
	margin:0 auto;
	position:relative;
}

body {
	font-family:Arial, Helvetica, sans-serif;
}

b {
	font-weight:bold;
}

#main_image .active { opacity: 1; }
#main_image .logo { position: absolute; z-index: 15; top: 10em; left: 5px; text-align: left; width: 416px;}
#main_image .haslo { position: absolute; z-index: 15; top: 20em; left: 5px; text-align: left; width: 416px;}
#main_image .spinmedia_small { position: absolute; z-index: 15; bottom: 0px; left: 5px; text-align: left; width: 416px;}

#main_image #main_image1 { background-image: url('/ui/images/index/small/image_1.jpg'); background-size: cover;}

h2.logo {
	margin-bottom:30px;
}

h2.icon {
    left: 480px;
    position: absolute;
    text-align: left;
    top: 500px;
    z-index: 15;
}

img.icon {
	position:absolute;
	left:-5px;
	top:5px;
}

div.grid h1 {
	font-family: 'Open Sans', sans-serif;
	font-size:42px;
	font-weight:100;
	color:#66b296;
	margin-bottom:25px;
}

div.grid h1.grey {
	font-family: 'Open Sans', sans-serif;
	font-size:48px;
	font-weight:100;
	color:#a4a7aa;
	margin-bottom:25px;
	margin-top:50px;
}


div.grid h2 {
	font-family: 'Open Sans', sans-serif;
	font-size:24px;
	font-weight:400;
	color:#66b296;
}

div.menu {
	width:200px;
	float:left;
	height:260px;
	overflow:hidden;
}

div.ico {
    float: left;
    left: 192px;
    position: relative;
    z-index: 3;
}

div.grid {
	margin-top:0px;
	overflow:hidden;
	border-left:1px solid #eaeaeb;
	padding-left:30px;
	position:relative;
	float:right;
}

div.grid_2 {
	width:255px;
	float:left;
	padding-right:10px;
	border-right:1px solid #eaeaeb;
}

	div.grid_2 p, div.grid_3 p, div.grid_4 p, div.grid_5 p  {
		font-size:12px;
		line-height:190%;
	}

div.grid_3 {
	width:255px;
	float:left;
	border-right:1px solid #eaeaeb;
	margin-left:8px;
		padding-right:10px;
}

div.grid_4 {
	width:255px;
	float:left;
		margin-left:10px;
}

div.grid_5 {
	width:785px;
	float:left;

	clear:both;
}

div#about-us {
	min-height:300px;
	overflow:hidden;
	width:100%;
}


div#our-mission {
	min-height:300px;
	overflow:hidden;
	height:880px;
}

div#our-services {
	min-height:300px;
	overflow:hidden;
}

div#our-people {
	min-height:300px;
	overflow:hidden;
	background-color:#f1f5f6;
	height:860px;
}

div#our-clients {
	min-height:300px;
	overflow:hidden;
	background-image: url('../images/bg_cisza.png');
	background-repeat:no-repeat;
	background-position:50% 0%;
}

div#jak-dzialamy {
	min-height:300px;
	overflow:hidden;
}

div.pasek {
	height:35px;
	background-image: url('../images/bg_pasek.jpg');
}

#circle1 {
    background: none repeat scroll 0 0 #27af5d;
    height: 150px;
    width: 150px;
	margin-left:45px;
	margin-top:40px;
}

#circle1:hover {
    background: #009760;
	border:0px;
    height: 150px;
    width: 150px;
	margin-left:45px;
	margin-top:40px;
}

#circle2 {
    background: none repeat scroll 0 0 #fff;

    height: 150px;
    width: 150px;
	margin-left:45px;
	margin-top:10px;
}

#circle2:hover {
    background: #26af5f;
	border:0px;
    height: 150px;
    width: 150px;
	margin-left:45px;
	margin-top:10px;
}

div.circle {
    border-radius: 50%;
    display: inline-block;
}

div.circle h3 {
	font-family: 'Open Sans', sans-serif;
	font-size:42px;
	font-weight:100;
	color:#fff;
	margin-top:50px;
	margin-left:20px;
}

div.circle h3.w {
	color:#fff;
}

div.circle h3.b {
	color:#fff;
}

	div.circle:hover h3 {
		color:#fff;
	}

	div.circle2:hover h3 {
		color:#fff;
	}



		div.rzad_1 {
clear:both;
margin-top:30px;
min-height:180px;
}
		
	div.arrow1 {
    margin-left: 10px;
    margin-right: 10px;
	margin-top:18px;
}	
	
	div#cir {
		border:2px solid #494c52;
		height: 130px;
		width: 130px;
		border-radius: 50%;
		display: inline-block;
	}
	
		div#cir:hover {
			background-color:#efefef;
			border:2px solid #00a96b;
		}


		
	div#cir p {
		text-align:center;
		font-size:11px;
		line-height:140%;
		margin-top:45px;
	}
	

	
	div#cir img {
		margin-top:32px;
		margin-left:32px;
}
	
div.rzad_2 {
clear:both;
height:225px;
margin-top:30px;
min-height:190px;
}
	
	div#cir2 {
		border:2px solid #ea3d0f;
		height: 130px;
		width: 130px;
		border-radius: 50%;
		display: inline-block;
	}
	
	div#cir2:hover {
		background-color:#efefef;
		border:2px solid #bd2800;
	}
		
	div#cir2 p {
		text-align:center;
		font-size:11px;
		line-height:140%;
		margin-top:45px;
	}
	
	div#cir2 img {
		margin-top:32px;
		margin-left:32px;
}

div.rzad_3 {
clear:both;
margin-left:300px;
margin-top:30px;
min-height:220px;
}

	div#cir3 {

				background-color:#00ab6d;
		height: 130px;
		width: 130px;
		border-radius: 50%;
		display: inline-block;
	}
	
	div#cir3:hover {
		background-color:#00ab6d;

	}
		
	div#cir3 p {
		text-align:center;
		font-size:11px;
		line-height:140%;
		margin-top:45px;
	}
	
	div#cir3 img {
		margin-top:32px;
		margin-left:32px;
}

	div#cir p#t1, p#t2, p#t3, p#t4, p#t5, p#t6, p#t7, p#t8 {
		display:none;
	}

div.a01 {
	float:left;
}

div#film {
	background-image: url('../images/bg_video.png'); 
	height:264px;
	width:255px;
}

div.opis_aroma {
	float:left;
	width:500px;

}
div.opis_aroma p {
	font-size:11px;
	margin-left:10px;
	margin-top:30px;
}


.circle {
  animation: test 6s infinite;
  -webkit-animation: test 6s infinite;
}

div#lista span {
	font-size:14px;
	display:block;
	width:255px;
	padding-top:15px;
	padding-bottom:15px;
	padding-left:10px;
	border-bottom:1px solid #cfcfcf;
}

p.przyciski {
	margin-top:15px;
}

p.przyciski span#poprzedni {
	background-image: url('../images/prev.png'); 
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
	float:left;
}

p.przyciski span#poprzedni:hover {
	background-image: url('../images/prev.png'); 
	background-position:0px -80px;
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
}

p.przyciski span#pauza {
	background-image: url('../images/pauza.png'); 
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
	float:left;
}

p.przyciski span#pauza:hover {
	background-image: url('../images/pauza.png'); 
	background-position:0px -80px;
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
}

p.przyciski span#dalej {
	background-image: url('../images/next.png'); 
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
	float:left;
}

p.przyciski span#dalej:hover {
	background-image: url('../images/next.png'); 
	background-position:0px -80px;
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
}

form.form {
	font-size:12px;
	line-height:190%;
	margin-bottom:30px;
}

form td.left {
	float:left;
	width:120px;
}

form.form input.guzik {
	padding:15px;
	background-color:#5ba58a;
	border:0px;
	color:#fff;
	float:right;
	margin-top:10px;
}

form.form input.guzik:hover {
	background-color:#78ceae;
	cursor:pointer;
}
	

form.form textarea {
	width:480px;
}


#main_image #main_image1 { 
background-image: url('/ui/images/index/medium/image_1.jpg'); 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 
}	

	
	#main_image .slide {
		background-attachment: fixed;
	}

	#main_image .slide {
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	
	}
	
	#main_image #main_image1 { background-image: url('bg_1.jpg'); }
	#main_image #main_image2 { background-image: url('bg_2.jpg'); }
	#main_image #main_image3 { background-image: url('bg_3.jpg'); }
	
	#main_image .animate {
    transition: opacity 2s ease-out 0s;
}


/* #Separators
================================================== */

p.separator {
	font-size: 30px;
	font-weight: 600;
	font-style: italic;
	color: #fff;
	line-height: 38px;
	text-transform: uppercase;
	position: relative;
	z-index: 200;
	text-align: center;
	padding-top: 240px;
}

div#separator1 {
	width: 100%;
	height: 250px;
	position: relative;
}

div#separator1 div.bg {
    width: 100%;
    height: 250px;
	background-size: cover !important;
	-webkit-background-size: cover !important;
	margin: 0 auto;
	padding: 0;
	z-index: 200;

}

 div#separator1 .bg2 {
	background: url(../images/bg2.jpg) repeat center;
}

 div#separator1 .bg3 {
	background: url(../images/bg3.jpg) repeat center;
}

    div#separator1 .bg4 {
	background: url(../images/bg4.jpg) repeat center;
}

/* #Nav
================================================== */

nav {

	width: 180px;
	position: relative;
	z-index: 1000;
	height: 40px;

}


nav ul {
	padding-top: 10px;
}

nav ul li {
	padding: 6px 0px 6px 0px;
	clear:both;
	margin: 0;
}

nav ul li.onas {
	font-size:24px;
	margin-left:20px;
}

	nav ul li.onas a {
		color:#66B296;
	}

nav ul li.audio {
	font-size:16px;
	-webkit-transform: rotate(-90deg); 
-moz-transform: rotate(-90deg);	
width:15px;
}

	nav ul li.audio a {
		color:#878787;
	}


nav ul li.video {
	font-size:20px;
	-webkit-transform: rotate(90deg); 
	-moz-transform: rotate(90deg);	
	width:90px;
	margin-left:-15px;
	z-index:2;
	position:relative;
}

	nav ul li.video a {
		color:#008877;
	}

nav ul li.aroma {
    font-size: 20px;
    margin-left: 60px;
    margin-top: -70px;
    width: 90px;
}

	nav ul li.aroma a {
		color:#878787;
	}

nav ul li.cisza {
   font-size: 12px;
    margin-left: 40px;
    margin-top: -10px;
    width: 154px;
	
}

	nav ul li.cisza a {
		color:#66b296;
	}

nav ul li.jak {
    font-size: 15px;
    margin-left: 40px;
    margin-top: 7px;

    width: 155px;
}

	nav ul li.jak a {
		color:#878787;
	}


nav ul li.kontakt {
    font-size: 15px;
	z-index:10;
	position:relative;

}

	nav ul li.kontakt a {
		color:#878787;
	}

nav a {
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: 300;
	text-decoration: none;
	text-transform: uppercase;
}

nav a:visited {
	color: #515151;
}

nav a:hover {
	color: #000;
}



/* #Intro
================================================== */

#intro {
	width: 100%;
	height: 600px;
	text-align: center;
}

#intro h1 {
	color: #FFF;
}

#intro .bg1 {
	background: url("bg1.jpg") 0 0 repeat;	
	background-position: 0 0 !important;
	background-size: cover;
	-webkit-background-size: cover;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	z-index: 100;
	width: 100%;
	height: 600px;
}

.title {
	position: relative;
	width: 100%;
	text-align: center;
	z-index: 300;
	padding-top: 70px;
}

.intro-line {
	position: relative;
	z-index: 150;
	border-top: 1px solid #ededed;
	width: 670px;
	margin: 0 auto 50px auto;
}

.title p {
	font-size: 24px;
	line-height: 30px;
	color: #fff;
	position: relative;
	z-index: 150;
	margin-top: 25px;
}

.bg {
	z-index: 300;
	padding-top: 80px;
	padding-bottom: 80px;

}

}




@-webkit-keyframes test
{
   0% { background-color:#25ae60; }
   50% { background-color:#f44f2f; }
   100% { background-color:#25ae60; }
}

@keyframes test {
   0% { background-color:#25ae60; }
   50% { background-color:#f44f2f; }
   100% { background-color:#25ae60; }
 
}


@media screen and (max-width: 1024px) {
body {
	margin:0px;
	padding:0px;
	font-family:Arial, Helvetica, sans-serif;
	line-height:170%;
}
#main_image { width: 100%; height: 250px; background-color: #000; margin: 0 0 0 0; position: realtive; }
	#main_image .slide { position: absolute; z-index: 10; opacity: 0;
		width: 100%; height: 250px;
		background-color: #000;
		background-repeat: no-repeat;
		background-position: center center;
	}
#main_image .active { opacity: 1; }
#main_image .logo { position: absolute; z-index: 15; top: 2.5em; left: 5px; text-align: left;}
#main_image .haslo { position: absolute; z-index: 15; top: 20em; left: 5px; text-align: left; width: 416px;}
#main_image .spinmedia_small { position: absolute; z-index: 15; bottom: 0px; left: 5px; text-align: left; width: 416px;}

#main_image #main_image1 { background-image: url('/ui/images/index/small/image_1.jpg'); background-size: cover;}



#main_image #main_image1 { 
background-image: url('/ui/images/index/medium/image_1.jpg'); 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 
}	
#main_image .slide {
	background-attachment: fixed;
}
#main_image .slide {
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#main_image #main_image1 { background-image: url('bg_1.jpg'); }
#main_image #main_image2 { background-image: url('bg_2.jpg'); }
#main_image #main_image3 { background-image: url('bg_3.jpg'); }

#main_image .animate {
transition: opacity 2s ease-out 0s;
}

#main_image h1.logo img {
	width:250px;
}

div.ico {
	display:none;
}

div#film {
	display:none;
}


div#kontakt {
	display:none;
}

div#lista span {
    border-bottom: 1px solid #CFCFCF;
    display: block;
    font-size: 14px;
    padding-bottom: 15px;
    padding-left: 10px;
    padding-top: 15px;
}


p.przyciski {
	margin-top:15px;
	height:50px;
	display:block;
}

p.przyciski span#poprzedni {
	background-image: url('../images/prev.png'); 
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
	float:left;
}

p.przyciski span#poprzedni:hover {
	background-image: url('../images/prev.png'); 
	background-position:0px -80px;
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
}

p.przyciski span#pauza {
	background-image: url('../images/pauza.png'); 
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
	float:left;
}

p.przyciski span#pauza:hover {
	background-image: url('../images/pauza.png'); 
	background-position:0px -80px;
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
}

p.przyciski span#dalej {
	background-image: url('../images/next.png'); 
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
	float:left;
}

p.przyciski span#dalej:hover {
	background-image: url('../images/next.png'); 
	background-position:0px -80px;
	height:80px;
	width:80px;
	display:block;
	text-indent:-999px;
}

nav ul     { 
	display: none; 
}


	

nav {
	background:#fff;
	z-index:999;
	width:100%;
}

div.grid {
	clear:both;
		padding:5px;
}

nav ul     { 
	display: block; 
	margin:0px;
	padding:0px;
}

nav ul li {
	float:left;
	list-style-type:none;
	margin-left:8px;
}

nav ul li a {
	color:#008877;
	text-decoration:none;
	font-size:12px;
}

h2.logo {
	display:none;
}

nav select {
	color: #000000;
	display: inline-block;
	margin-top: 8px;
	position: relative;
}
div.circle {
    border-radius: 50%;
    display: inline-block;
}

#circle1, #circle2 {
    background: none repeat scroll 0 0 #27af5d;
    height: 150px;
    width: 150px;
	text-align:center;
	display:block;
	margin:0 auto;
}

div.circle h3 {
    color: #FFFFFF;
    font-family: 'Open Sans',sans-serif;
    font-size: 42px;
    font-weight: 100;
    margin-left: 6px;
    padding-top: 60px;
	margin:0px;
}

.circle {
  animation: test 6s infinite;
  -webkit-animation: test 6s infinite;
}

div#our-people {
	background-color:#F1F5F6;
}

div#our-people div.grid_2 img {
	    display: block;
    text-align: center;
    margin: 0 auto;
}

h1.grey {
	font-size:12px;
}


div.pasek {
    background-image: url("../images/bg_pasek.jpg");
    height: 35px;
}

div.arrow1 {
	display:none;
}

div.a01 {
	clear:both;
	font-size:12px;
}

div#jak-dzialamy div.a01 img {
	float:left;
	height:50px;
}

div#jak-dzialamy br {
	display:none;
}

div#jak-dzialamy h1.grey img {
	display:block;
	margin:0 auto;
}

div.footer_info {
	clear:both;
}

div.footer_bottom h1.logo {
	clear:both;
}

h1.logo {
	float:left;
}

h2.haslo, h2.icon {
	display:none;
}
