/*--------------------------------------------------*/
/* General Setup                 					*/

	* {
		padding: 0;
		margin: 0;
	}

	html {
		background: #000 url("../../img/global/background.gif") fixed;
		height: 100%;
	}

	body {
		font-family: arial, helvetica, sans-serif;
		font-size: 1em;
		color: #fff;
		/*height: 100%;
		min-height: 666px;*/
		background: url("../../img/global/body.gif") repeat-y 50% 0;
	}

	/*--------------------------------------------------*/
	/* Text                                             */

		p {
			padding: 0 0 12px;
		}

		h1 {
			font-size: 1.2em;
			padding: 0 0 12px;
		}

		h2 {
			font-size: 1.2em;
			padding: 0 0 12px;
		}

		h3 {
			font-size: 1.6em;
		}

		h4 {
			font-size: 1.4em;
		}

		h5 {
			font-size: 1.1em;
		}

	/*--------------------------------------------------*/
	/* Links                                            */

		a {
			color: #fff;
			text-decoration: underline;
		}

			a:hover,
			a:active,
			a:focus {
				text-decoration: underline;
				color: #ccc;
			}

			a img {
				border: 0;
			}

			a.more span {
				background: url("../../img/global/arrow.gif") no-repeat 100% 50%;
				padding: 0 10px 0 0;
			}

	/*--------------------------------------------------*/
	/* Lists                                            */

		ul, ol {
			padding: 0 24px 12px;
		}

			ul li,
			ol li {
				padding: 0 0 2px;
			}

	/*--------------------------------------------------*/
	/* Images                                           */

		img {
			display: block;
		}

	/*--------------------------------------------------*/
	/* Table                                            */

		table {
			font-size: 1em;
		}

			table,
			table td,
			table th {
				border: 0;
			}

	/*--------------------------------------------------*/
	/* Form                                             */

		form {
			width: 400px;
		}

			form fieldset {
				border: 0;
			}

				input,
				textarea,
				select,
				button {
					font-family: verdana, arial, helvetica, sans-serif;
					font-size: 1em;
				}

				/*--------------------------------------------------*/
				/* General rows                                     */

					form .row {
						margin: 0 0 6px;
					}

						form .row label {
							width: 120px;
							display: block;
							float: left;
							padding: 0 12px 0 0;
							text-align: right;
						}

					/*--------------------------------------------------*/
					/* Date of birth                                    */

						form .dob input {
							width: 30px;
						}

							form .dob span {
								color: #999;
							}

				/*--------------------------------------------------*/
				/* Radio buttons                                    */

					form .radio p {
						float: left;
						width: 120px;
						display: block;
						padding: 0 12px 0 0;
						text-align: right;
					}

					form .radio div.clear {
						margin: 0 0 6px;
						float: left;
					}

						form .radio div.clear div {
							margin: 0 0 6px;
						}


				/*--------------------------------------------------*/
				/* Checkboxes                                       */

					form .checkbox {
						margin: 0 0 6px;

					}

						form .checkbox input {
							float: left;
							margin-top: 0 !important;
							margin: -3px 6px 0 132px;
						}

							form .checkbox label {
								float: left;
								width: 212px;
							}

					/*--------------------------------------------------*/
					/* Terms                                            */

						form .terms {

						}

						form .terms label {
							padding: 0;
							width: auto;
						}

				/*--------------------------------------------------*/
				/* Submit                                           */

					form .submit {
						padding: 12px 0;
						text-align: right;
					}

/*--------------------------------------------------*/
/* Generic Classes				                    */

	.offScreen {
		position: absolute;
		left: -5000px;
	}

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

/*--------------------------------------------------*/
/* Wrapper						                    */

	#wrapper {
		font-size: 0.75em;
		background:transparent url("../../img/global/wrapper.jpg") no-repeat 50% 0;
		height: 100%;
	}

		#container {
			width: 900px;
			margin: 0 auto;
			background:#000 url("../../img/global/wrapper.jpg") no-repeat 50% 0''
		}

		/*--------------------------------------------------*/
		/* Header                                           */

			#header {
				padding: 20px 0 20px 52px;
			}

				#header #logo {
					margin: 0 0 12px;
				}

				/*--------------------------------------------------*/
				/* Navigation                                       */

					#header #navigation {
						background: url("../../img/global/navigation.gif") repeat-x 0 0;
						margin: 0 0 0 100px;
						clear: both;
					}

						#header #navigation ul {
							list-style-type: none;
							padding: 0;
							background: url("../../img/global/navigationCorner.gif") no-repeat 0 0;
						}

							#header #navigation ul li {
								float: left;
								padding: 5px 0
							}

								#header #navigation ul li a {
									border-right: 1px dotted #666;
									padding: 2px 12px;
									display: block;
									text-decoration: none;
								}

								#header #navigation ul li.last a {
									border: 0;
								}

								#header #navigation ul li.current a {
									color: #666;
								}

								#header #navigation ul li#blog a {
									background: url("../../img/global/navigationBlog.gif") no-repeat 0 0;
									position: relative;
									padding: 11px 55px 11px 37px;
									margin: -10px 0 0 -2px;
									color: #000;
								}

								#header #navigation ul li#blog a:hover {
									color: #666;
								}

		/*--------------------------------------------------*/
		/* Department                                       */

			#department {
				width: 180px;
				float: left;
				margin: 12px 12px 0 6px;
				display: inline;
			}

				#department ul {
					list-style-type: none;
					padding: 0 0 0 12px;
				}

					#department ul li {
						margin: 0 0 5px;
						padding: 0 0 1px;
					}

						#department ul li a {
							text-transform: uppercase;
							display: block;
							padding: 3px 0 3px 26px;
							text-decoration: none;
						}

							#department ul li a span {
								text-transform: lowercase;
							}

						#department ul li.brand a {
							background: url("../../img/global/departments/brand.gif") no-repeat 0 0;
						}

							#department ul li.brand.current a {
								background: url("../../img/global/departments/communicationsCurrent.gif") no-repeat 0 0;
								color: #c58a33;
							}

						#department ul li.communications a {
							background: url("../../img/global/departments/communications.gif") no-repeat 0 0;
						}

							#department ul li.communications.current a {
								background: url("../../img/global/departments/communicationsCurrent.gif") no-repeat 0 0;
								color: #aec0d3;
							}

						#department ul li.media a {
							background: url("../../img/global/departments/media.gif") no-repeat 0 0;
						}

							#department ul li.media.current a {
								background: url("../../img/global/departments/mediaCurrent.gif") no-repeat 0 0;
								color: #bf394d;
							}

						#department ul li.relations a {
							background: url("../../img/global/departments/relations.gif") no-repeat 0 0;
						}

							#department ul li.relations.current a {
								background: url("../../img/global/departments/relationsCurrent.gif") no-repeat 0 0;
								color: #cddd4a;
							}

						#department ul li.direct a {
							background: url("../../img/global/departments/direct.gif") no-repeat 0 0;
						}

							#department ul li.direct.current a {
								background: url("../../img/global/departments/directCurrent.gif") no-repeat 0 0;
								color: #a69a51;
							}

						#department ul li.interactive a {
							background: url("../../img/global/departments/interactive.gif") no-repeat 0 0;
						}

							#department ul li.interactive.current a {
								background: url("../../img/global/departments/interactiveCurrent.gif") no-repeat 0 0;
								color: #67aeb2;
							}

						#department ul li.people a {
							background: url("../../img/global/departments/people.gif") no-repeat 0 0;
						}

							#department ul li.people.current a {
								background: url("../../img/global/departments/peopleCurrent.gif") no-repeat 0 0;
								color: #b47c9f;
							}

						#department ul li.creative a {
							background: url("../../img/global/departments/creative.gif") no-repeat 0 0;
						}

							#department ul li.creative.current a {
								background: url("../../img/global/departments/creativeCurrent.gif") no-repeat 0 0;
								color: #783f7d;
							}

						#department ul li.planning a {
							background: url("../../img/global/departments/planning.gif") no-repeat 0 0;
						}

							#department ul li.planning.current a {
								background: url("../../img/global/departments/planningCurrent.gif") no-repeat 0 0;
								color: #5e9e82;
							}

				#department p {
					position: relative;
					left: -5px;
					padding: 0;
					text-align: right;
				}

					#department p a {
						display: block;
						background: url("../../img/global/showreel.gif") no-repeat 0 0;
						padding: 56px 0 32px 0;
						text-align: right;
						text-decoration: none;
					}

		/*--------------------------------------------------*/
		/* Content                                          */

			#content {
				float: right;
				width: 658px;
				margin: 12px 1px 12px 0;
			}
			
			#vidContent {
			width: 658px;
			margin: 0 auto;
			}

			/*--------------------------------------------------*/
			/* Department Content                               */

				#departmentLogo {
					float: left;
					display: inline;
				}

				#introduction {
					float: right;
					width: 413px;
					display: inline;
					padding: 12px;
				}

					#introduction .first {
						font-size: 1.1em;
					}

					#introduction h2 {
						font-size: 1.1em;
						padding: 0 0 12px;
					}

			/*--------------------------------------------------*/
			/* Examples of work                                 */

				.exmaple {
					padding: 30px 0 0;
					clear: both;
				}

					/*--------------------------------------------------*/
					/* Preview                                          */

						.example .preview {
							padding: 36px 12px 8px;
						}

							.example .preview img {
								margin: 0 auto 12px;
							}

					/*--------------------------------------------------*/
					/* Actions                                          */

						.example .actions {
							background: url("../../img/common/divider.gif") repeat-x 0 0;
							padding: 0;
							list-style-type: none;
						}

							.example .actions .showreel {
								position: relative;
								float: left;
								margin-top: -30px;
							}

								.example .actions .showreel a {
									background: url("../../img/common/showreel.png") no-repeat 0 0;
									display: block;
									padding: 52px 0 28px 80px;
									text-decoration: none;
								}

							.example .actions .contact {
								float: right;
								padding: 22px 12px 0 0;
							}


		/*--------------------------------------------------*/
		/* Feature block                                    */

			.feature {
				width: 216px;
				margin: 0 2px;
				float: left;
			}

				.firstFeature {
					margin-left: 10px !important;
					margin-left: 6px;
				}

				.feature h2 {
					border-bottom: 1px dotted #fff;
					padding: 12px 12px 4px;
					margin: 0 6px 6px;
				}

				.feature p {
					padding: 0;
				}

					.feature p a {
						display: block;
						padding: 120px 18px 17px 12px;
						text-align: right;
						text-decoration: none;
					}

		/*--------------------------------------------------*/
		/* Footer                                           */

			#footer ul {
				list-style-type: none;
				padding: 12px 0 12px 6px;
			}

				#footer ul li {
					float: left;
					border-right: 1px dotted #666;
					padding: 0 12px;
				}

				#footer ul li.last {
					border: 0;
				}

					#footer ul li a {
						color: #666666;
						text-decoration: none;
					}