/* Artfully masterminded by ZURB  */



/* --------------------------------------------------

   Table of Contents

-----------------------------------------------------

:: Shared Style

:: Homepage

:: @Font-face

*/





/* -----------------------------------------

   Shared Styles

----------------------------------------- */



	/* Site Specific Structute and Basics */

	body {

		background: #1e252a;

		overflow-x: hidden; }

	h1, h2, h3, h4, h5, h6 { font-family: "ProximaNova", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; }

	div.slim.container {

		margin-bottom: 0; }

	.slim.container .columns { background: #fff; padding-top: 40px;  }

	.slim.container .content { margin-left: -40px;  }

	.slim.container .content>.columns { padding: 0 20px; }



	/* Nav */

	nav {

		width: 820px;

		padding: 0 20px;

		height: 74px;

		background: #fff;

		margin: 0 auto;

		position: relative;

		z-index: 2; }

	nav a#logo img {

		margin-top: 40px; }

	nav a#logo {

		border: none; }

	nav ul {

		float: right;

		margin-top: 40px; }

	nav ul li {

		float: left;

		margin-left: 14px; }

	nav ul li a {

		color: #212121;

		font-weight: bold;

		font-size: 12px;

		text-transform: uppercase; }



	/* Hero Unit */

	.hero-unit {

		width: 860px;

		margin: 0 auto;

		position: relative; }

	.hero-unit hgroup {

		position: absolute;

		bottom: 10px;

		left: 0; }

	.hero-unit hgroup h4 {

		background: #fff;

		font-family: "BebasNeueRegular", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;

		font-weight: normal;

		color: #8d8d8d;

		padding: 14px 0 0;

		width: 163px;

		text-align: center;

		font-size: 24px;

		margin-bottom: 0;

		line-height: 10px;  }

	.hero-unit hgroup h4 a {

		color: #0292c7; }

	.hero-unit hgroup h1 {

		background: #fff;

		font-family: "BebasNeueRegular", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;

		font-weight: normal;

		color: #8d8d8d;

		padding: 24px 0 14px;

		margin-bottom: 0;

		width: 290px;

		text-align: center;

		line-height: 40px;

		font-size: 68px; }



	.section-title {

		min-height: 60px; }

	.section-title h6 {

		font-size: 14px;

		color: #2d2d2d;

		font-weight: bold;

		text-transform: uppercase; }



	.dot-matrix {

		background: url(../images/dot-matrix.png) repeat;

		width: 150%;

		height: 150%;

		position: fixed;

		top: 0;

		left: 0; }

	.hero-background {

		width: 1739px;

		height: 1155px;

		position: fixed;

		top: 0;

		left: 50%;

		margin-left: -800px;

		background: url(../images/hero-background-ducati.jpg) no-repeat; }





/* -----------------------------------------

   Homepage

----------------------------------------- */



	#homepageHero {

		height: 320px; }

	#homepageHero .play-button {

		background: url(../images/play-btn.png) no-repeat;

		width: 105px;

		height: 105px;

		display: block;

		position: absolute;

		text-indent: -9999px;

		left: 50%;

		margin-left: -53px;

		top: 110px; }

	.content section .row {

		margin-bottom: 30px; }

	.content section .eleven.columns.first-row figure {

		margin-bottom: 0; }

	.content section figure {

		float: left;

		width: 195px;

		margin: 0 27px 20px 0; }

	.content section figure img {

		display: block;

		margin-bottom: 10px; }

	.content section figure a { border: none !important; }

	.content section figure > a:hover + figcaption h4 a {

		color: #2A85E8; }

	.content section figcaption h4 a,

	.content section figcaption h4,

	.pricing h4 {

		font-family: "BebasNeueRegular", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;

		font-weight: normal;

		font-size: 18px;

		color: #8d8d8d;

		letter-spacing: 1px;

		margin-bottom: 0; }

	.content section figcaption h4,

	.content section figcaption h4, {

		line-height: 12px; }

	.content section figcaption h4 a:hover {

		color: #2A85E8; }

	.role,

	.director {

		color: #8d8d8d;

		font-style: italic;

		line-height: 16px; }

	.content section figure:last-child {

		margin-right: 0; }

	.story p, .contact p {

		font-size: 12px;

		line-height: 16px; }

	.contact strong { line-height: 18px; }

	hr.dotted {

		border: none;

		border-top: 1px dotted #ccc; }





	/* -----------------------------------------

	   Individual Work

	----------------------------------------- */

	.hero-unit iframe { border: none; margin-bottom: -2px; /* margin-bottom: 10px; */ }

	.hero-unit #slideshow,

	.hero-unit .orbit-wrapper,

	.hero-unit .single-image { margin-bottom: -2px; }



	/* -----------------------------------------

	   Individual Service

	----------------------------------------- */

	.individual-service figcaption h4 {

		margin-bottom: 16px; }

	.individual-service figcaption p {

		font-size: 12px;

		color: #484848;

		line-height: 16px; }

	.hero-background.camera-car {

		background: url(../images/hero-background-service.jpg) no-repeat; }



	.content section figure.wide {

		width: 306px; }

	ul.jib {

		margin-top: 14px;

	}

	ul.jib li {

		margin-bottom: 5px;

	}



	.pricing h6,

	.specs h6 {

		font-size: 14px;

		margin-top: 15px; }

	.pricing ul,

	.specs ul {

		margin: 10px 0 30px 0; }

	.pricing ul li,

	.specs ul li {

		overflow: hidden;

		width: 600px;

		border-bottom: 1px solid #ddd;

		margin: 8px 0 0 30px;

		padding-bottom: 8px; }

	.pricing ul .description,

	.specs ul .description {

		float: left; }

	.pricing ul .price,

	.specs ul span.value {

		float: right; }

	.pricing ul.sub-item {

		padding-top: 10px;

		margin-bottom: 0; }

	.pricing ul.sub-item li {

		width: 570px;

		margin-left: 30px;

		border-bottom: 1px solid #eee;

		font-size: 12px; }

	.pricing ul.sub-item li:last-child {

		border-bottom: 0; }

  .specs ul li {

    width: 100%;

    margin-left: 0; }



  .copyright {

    color: #999;}



 /* --------------------------------

 @Font-Face

 -------------------------------- */



	/* Proxima Regular */

	@font-face {

	    font-family: 'ProximaNova';

	    src: url('../fonts/ProximaNova-Reg-webfont.eot');

	    src: url('../fonts/ProximaNova-Reg-webfont.eot?iefix') format('eot'),

	         url('../fonts/ProximaNova-Reg-webfont.woff') format('woff'),

	         url('../fonts/ProximaNova-Reg-webfont.ttf') format('truetype'),

	         url('../fonts/ProximaNova-Reg-webfont.svg#webfontZam02nTh') format('svg');

	    font-weight: normal;

	    font-style: normal; }



	/* Proxima Bold */

	@font-face {

	    font-family: 'ProximaNova';

	    src: url('../fonts/ProximaNova-Bold-webfont.eot');

	    src: url('../fonts/ProximaNova-Bold-webfont.eot?iefix') format('eot'),

	         url('../fonts/ProximaNova-Bold-webfont.woff') format('woff'),

	         url('../fonts/ProximaNova-Bold-webfont.ttf') format('truetype'),

	         url('../fonts/ProximaNova-Bold-webfont.svg#webfontZ6etP9ZY') format('svg');

	    font-weight: bold;

	    font-style: normal; }



	/* Bebas Neue Regular */

	@font-face {

	    font-family: 'BebasNeueRegular';

	    src: url('../fonts/BebasNeue-webfont.eot');

	    src: url('../fonts/BebasNeue-webfont.eot?#iefix') format('eot'),

	         url('../fonts/BebasNeue-webfont.woff') format('woff'),

	         url('../fonts/BebasNeue-webfont.ttf') format('truetype'),

	         url('../fonts/BebasNeue-webfont.svg#webfontfvFLBU0N') format('svg');

	    font-weight: normal;

	    font-style: normal; }

