/* ---------------------------------------------------- */

 
		/* Copyrights: MOJITO agencja kreatywna Jaros�aw Feith */
		/* Created for Media-Com Sp. z o.o. */ 
		/* ---------- 2009 ------------ */ 
		
		
		/* STYLE SHEET NAME: STYLE.CSS*/
		
		
		/* COLORS
				darker creme (primary): 	#ccc9b7
				lighter creme:				#e7e5d6
				darker blue (primary): 		#276279
				lighter blue: 				#00779b
				dark red:					#a71a10
				yellow (links)				#ffb640
		*/ 
 
 
 /* ---------------------------------------------------- */
 
 
 
		/* GENERAL STYLE SETTINGS */
		/* ---------------------- */
 
 
		html {
				background-color: #e7e5d6;
				}

		body {
			text-align: center;
			margin: 0 auto;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 12px;
		}

		.active {
			background-color: #ccc9b7;
			color: #a71a10;
			margin: 20px 1px;
			padding: 5px 8px;
			font-size: 12px;
			font-weight: bold;
			line-height: 14px;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
		}	
		
		.scrolltop {
			background-color: #ccc9b7;
			font-size: 12px;
			font-weight: bold;
			padding: 5px 8px;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
			position: relative;
			z-index: 999;
		}
				
		.scrolltop a { color: #276279;}
		.scrolltop a:hover { text-decoration: underline;}
		
		.kontakt { text-align: center; }

		a { color: #e7e5d6; font-size: .85em; }
		a:hover { color: #ccc9b7; }
		
		/* WRPAPPER STYLE SETTINGS */
		/* ----------------------- */	
		
		
		#shadower {
			position: relative;
			width: 988px;
			margin:0 auto;
			background: url('../images/shadower_bg.png') repeat-y;
		}

		#container{
			width: 960px;
			margin: auto;
			text-align: left;
		}

		
		
		
		/* HEADER */
		/* ------- */	

		
		#header {
			background-color: #276279;
			background: url('../images/header_bg.jpg') no-repeat;
			width: 960px;
			height: 150px;
			position: relative;
		}
		
		h1 {
			position: absolute;
			text-indent: -9999px
			}
		
		#header_logo {
			background: url('../images/header_logo.png') no-repeat;
			position: absolute;
			left: 60px; 
			top:  33px;
			width: 134px;
			height: 84px;
		}
	
		h2 {
			position: absolute;
			right: 60px;
			bottom: 33px;
			font-size: 14px;
			font-weight: bold;
			line-height: 30px;
			color: #ccc9b7;
			border-bottom: dashed 1px #ccc9b7;
		}
		
		#header ul {
			position: relative;
			text-align: right;
			margin-right:50px;
		}
				#header ul li {
					display: inline;
				}
				
				#header ul li p {
					display: inline;
				}
		
						#header ul li a {
							color: #ccc9b7;
							font-size: 12px;
							font-weight: bold;
							padding: 23px 10px 5px 10px;
							line-height: 60px;
						}
								
								#header ul li a:hover {
									background-color: #ccc9b7;
									color: #276279;
									-moz-border-radius-bottomleft: 2px;
									-moz-border-radius-bottomright: 2px;
								}
								
			.headeractive p span {
					display: inline;
					background-color: #ccc9b7;
					color: #a71a10;
					-moz-border-radius-bottomleft: 2px;
					-moz-border-radius-bottomright: 2px;
					font-size: 12px;
					font-weight: bold;
					padding: 23px 10px 5px 10px;
					line-height: 60px;


			}
 
 
		/* MAIN MENU */
		/* ------- */
 
		#main_menu {
			float: left;
			height: 86px;
			width: 100%;
			overflow: hidden;
			position: relative;
			background: url('../images/main_menu_bg.jpg') repeat-x;
			margin-bottom: -10px;
		}
		
				#main_menu ul {
					clear: left;
					float: left;
					position: relative;
					left: 50%;
					text-align: center;
				}
			
						#main_menu ul li {
							display:block;
							float:left;
							position:relative;
							right:50%;
						}
						
								#main_menu ul li a {
									display: block;
									margin: 20px 1px;
									padding: 5px 8px;
									color: #ccc9b7;
									font-size: 12px;
									font-weight: bold;
									line-height: 14px;
									-moz-border-radius: 2px;
									-webkit-border-radius: 2px;
								}
								
										#main_menu ul li a:hover {
											background-color: #ccc9b7;
											color: #276279;
										}
										
										/* 
										#main_menu ul li a.active,
										#main_menu ul li a.active:hover {
											background-color: #ccc9b7;
											color: #a71a10;
										}
										*/

										
										
		/* GRAFA*/
		/* ---- */
		
		
		#grafa {
			clear: both;
			position: relative;
			overflow: hidden;
			width: 960px;
			height: 395px;
			margin-bottom: -15px;
			z-index: 11;
		}
		
		#divider {
		position: relative;
		margin: 0 auto;
		width: 960px;
		height: 15px;
		background: url('../images/divider.jpg') repeat-x;
		z-index: 111;
		}
		
				#grafa.index {
					background: url('../images/grafa_main.jpg') no-repeat;
				}
				
				#grafa.ofirmie {
					background: url('../images/grafa_ofirmie.jpg') no-repeat;
				}

				#grafa.zdi {
					background: url('../images/grafa_zdi.jpg') no-repeat;
				}

				#grafa.oferta {
					background: url('../images/grafa_oferta.jpg') no-repeat;
				}
				
				#grafa.cennik {
					background: url('../images/grafa_cennik.jpg') no-repeat;
				}

				#grafa.internet {
					background: url('../images/grafa_internet.jpg') no-repeat;
				}

				#grafa.security {
					background: url('../images/grafa_security.jpg') no-repeat;
				}

				#grafa.isp {
					background: url('../images/grafa_isp.jpg') no-repeat;
				}
				
				#grafa.zaufali {
					background: url('../images/grafa_zaufali.jpg') no-repeat;
				}
				
				#grafa.team {
					background: url('../images/grafa_team.jpg') no-repeat;
				}

				#grafa.kontakt {
					background: url('../images/grafa_kontakt.jpg') no-repeat;
				}
				
				#grafa.fof {
					background: url('../images/grafa_fof.jpg') no-repeat;
				}

		

		/* PRIMARY */
		/* ------- */
		
		
		h3 {
			font-family: Georgia, "Times New Roman", serif;
			font-weight: bold;
			font-size: 24px;
			color: #ccc9b7;
			margin: 2em 0 0.5em 0;
			padding-bottom: 0.5em;
			border-bottom: dashed 1px #ccc9b7;
		}
		

		
		
		#primary {
				position: relative;
				background: url('../images/primary_bg.jpg');
				background-color: #276279;
				padding: 1em 75px 2em 75px;
				z-index: 0;
		}

				#primary_left{
					float: left; 
					width: 480px;
					z-index: 3;
				}

						#primary_left p {
							font-size: 16px;
							font-weight: normal;
							text-align: left;
							color: #ccc9b7;
							line-height: 150%;
							padding-bottom: 1em;
						}
						
						#primary_left p a{
							color: #ffb640;
							
						}
						
								#primary_left p a:hover {
									text-decoration: underline;
								}
								
								
						#primary_left ul li {
							color: #ccc9b7;
							font-size: 16px;
							line-height: 150%;
							list-style: disc;
						}

						
						
		
		/* PRIMARY RIGHT*/
		/* ------------*/
		
		
		#primary_right {
			float: right;
			width: 240px;
		}
		
						
		/* TRUST BOX */
		/* -------- */
	
		
		#trust_box {
			position: relative;
			width: 200px;
			height: 160px;
			background: url('../images/trust_box.gif') no-repeat;
			margin: 20px auto 10px auto;
			-moz-border-radius: 3px;
			-webkit-border-radius: 3px;
		}
		
		#primary_right a {
			font-size: 10px;
			color: #ccc9b7;
			display: block;
			text-align: right;
			margin-right: 20px;
		}

				#primary_right a:hover {
					text-decoration: underline;
				}


		/* NASZE MARKI */
		/* ------ */	
		
		#naszemarki p {
			color: #ccc9b7;
			font-size: 14px;
		}
		
		#naszemarki a {
			position: relative;
			width: 200px;
			height: 75px;
			background-color: #ccc9b7;
			margin: 20px;	
			-moz-border-radius: 3px;
			-webkit-border-radius: 3px;
		}
		
		#naszemarki a.naszemarki_engi {
				background: url('../images/engi_logo.png') center no-repeat;
		}
		
		#naszemarki a.naszemarki_podnosek {
				background: url('../images/podnosek_logo.png') center no-repeat;
		}

				
				
		
		/* KONTAKT */
		/* ------ */
		
		
		#kontakt {
			width: 240px;
			min-height: 300px;
			height: auto !important;
			height: 300px;
			color: #ccc9b7;
			font-size: 14px;
			}

				#kontakt label {
					float: left;
					width: 240px;
					margin-bottom: 1em;
				}

				#kontakt input {
					float: right;
					margin-top: -30px;
					background-color: #e7e5d6;
					border: 1px;
					padding: 2px;
					-moz-border-radius: 1px;
					-webkit-border-radius: 1px;
				}

				#kontakt textarea {
					margin-top: -10px;
					background-color: #e7e5d6;
					border: 1px;
					padding: 5px;
					-moz-border-radius: 3px;
					-webkit-border-radius: 3px;
					}
				
				#submit {
					margin-top: 50px;
				}
				
					#kontakt input.btn {
						color: #276279;
						background-color: #e7e5d6;
						font-family: Arial, Helvetica, sans-serif;
						font-weight: bold;
						font-size: 12px;
						-moz-border-radius: 2px;
						-webkit-border-radius: 2px;
						padding: 3px 9px;
						margin-right: 0px;
					}
					
							.btnhov {
								text-decoration: underline;
								cursor: pointer;
							}

			/* dlaczego trzeba bylo tu uzyc class i dlaczego dopiero po wpisaniu margin: auto, albo 0 submit oderwal sie od labels?  */

		
		.clearfix:after {
			content: ".";
			display: block;
			height: 0;
			clear: both;
			visibility: hidden;
		}

		
		
		/* FOOTER */
		/* ------ */
		
		
		#footer {
			width: 960px;
			height: 100px;
			background: url('../images/footer_bg.png') repeat-x;
			margin: -9px 0 10px 0;
			position: relative;
			z-index: 12;
		}

				#footer p {
					font-size: 12px;
					text-align: left;
					color: #276279;
					padding: 25px 0 0 60px;
					line-height: 18px;
					float: left;
					margin-right: 100px;
				}
								
				#footer p.last_right {
					float: right;
					margin-right: 80px;
				}
				
				#footer a {
						color: inherit;
				}
		
				#footer a:hover {
						text-decoration: underline;
				}
		
		/* BOTTOM */
		/* ------- */
		
		

		#bottom {
		position: relative;
		margin: 0 auto;
		width: 960px;
		font-size: 8pt;
		color: #7d7d7d;
		margin: 0 auto;
		}

		#bottom a {
		color: gray;
		font-weight: bold;
		}

		#bottom a:hover {
		color: #f15a22;
		}

		#validate {
		position: absolute;
		text-align: left;
		}

		#credits {
		position: absolute;
		right: 0;
		text-align: left;
		margin: 5px 0 15px 0;
		}