/* Normalise
-------------------------------------------------------------------------------*/

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
	display: block;
}

audio,
canvas,
video {
	display: inline-block;
	*display: inline;
	*zoom: 1;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden] {
	display: none;
}

html {
	font-size: 100%; /* 1 */
	-webkit-text-size-adjust: 100%; /* 2 */
	-ms-text-size-adjust: 100%; /* 2 */
}

html,
button,
input,
select,
textarea {
	font-family: sans-serif;
}

body {
	margin: 0;
}

a:focus {
	outline: thin dotted;
}

a:active,
a:hover {
	outline: 0;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

h2 {
	font-size: 1.5em;
	margin: 0.83em 0;
}

h3 {
	font-size: 1.17em;
	margin: 1em 0;
}

h4 {
	font-size: 1em;
	margin: 1.33em 0;
}

h5 {
	font-size: 0.83em;
	margin: 1.67em 0;
}

h6 {
	font-size: 0.75em;
	margin: 2.33em 0;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

blockquote {
	margin: 1em 40px;
}

dfn {
	font-style: italic;
}

mark {
	background: #ff0;
	color: #000;
}

p,
pre {
	margin: 1em 0;
}

code,
kbd,
pre,
samp {
	font-family: monospace, serif;
	_font-family: 'courier new', monospace;
	font-size: 1em;
}

pre {
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}

q {
	quotes: none;
}

q:before,
q:after {
	content: '';
	content: none;
}

small {
	font-size: 75%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

dl,
menu,
ol,
ul {
	margin: 1em 0;
}

dd {
	margin: 0 0 0 40px;
}

menu,
ol,
ul {
	padding: 0 0 0 40px;
}

nav ul,
nav ol {
	list-style: none;
	list-style-image: none;
}

img {
	border: 0;
	-ms-interpolation-mode: bicubic;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 0;
}

form {
	margin: 0;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
	white-space: normal; 
	*margin-left: -7px; 
}

button,
input,
select,
textarea {
	font-size: 100%;
	margin: 0;
	vertical-align: baseline;
	*vertical-align: middle; 
}

button,
input {
	line-height: normal;
}

button,
html input[type="button"], 
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
	*overflow: visible;
}

button[disabled],
input[disabled] {
	cursor: default;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
	*height: 13px;
	*width: 13px; 
}

input[type="search"] {
	-webkit-appearance: textfield; 
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box; 
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
	vertical-align: top; 
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Base 
-------------------------------------------------------------------------------*/

body {
	font-size: 1em;
	line-height: 1.4;
}

a {
	color: #333;
	text-decoration: none;
	border-bottom: 1px solid #333;
}

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0;
}

img {
	vertical-align: middle;
}

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

textarea {
	resize: vertical;
}

/* Helpers 
-------------------------------------------------------------------------------*/

.hidden {
	display: none !important;
	visibility: hidden;
}

.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

.invisible {
	visibility: hidden;
}

.clearfix:before,
.clearfix:after {
	content: "";
	display: table;
}

.clearfix:after {
	clear: both;
}

.clearfix {
	*zoom: 1;
}

/* Grid
-------------------------------------------------------------------------------*/


.container { 
    position: relative; 
    width: 1360px; 
    margin: 0 20px; 
    padding: 0 0; 
}

.container .column,
.container .columns {
    float: left;
    display: inline;

}

.container .container {
	margin-left: 0;
	margin-right: 0;
}

.row {
    margin-bottom: 20px; 
}

.container .one.column,
.container .one.columns { 
    width: 80px;  
}

.container .two.columns { 
    width: 160px; 
}

.container .three.columns { 
    width: 240px; 
}

.container .four.columns {
    width: 320px; 
}

.container .five.columns {
    width: 400px; 
}

.container .six.columns {
    width: 480px; 
}

.container .seven.columns { 
    width: 560px; 
}

.container .eight.columns { 
    width: 640px; 
}

.container .nine.columns {
    width: 720px; 
}

.container .ten.columns {   
    width: 800px; 
}

.container .eleven.columns { 
    width: 880px;
}

.container .twelve.columns {
    width: 960px;
}

.container .thirteen.columns {
    width: 1040px;
}
.container .fourteen.columns {
    width: 1120px;
}

.container .fifteen.columns {
    width: 1200px;
}

.container .sixteen.columns {
    width: 1280px;
}

.container .seventeen.columns {
    width: 1360px;
}

/* Main
-------------------------------------------------------------------------------*/

body {
	background: #F2F5F5;
	font-size: 14px;
	line-height: 22px;
	font-family: "Neuzeit S LT W01 Book", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	color: #000;
	margin-top: 0;
	letter-spacing: 1px;
}

h1, h2, h3 {
	font-size: 20px;
	line-height: 22px;
	color: #000;
	margin: 0;
	margin-left: 10px;
	padding: 0;
	letter-spacing: 0;
}


.wrapper {
	width: 1400px;
	padding-top: 176px;
	margin: 0 auto;
	background: #F2F5F5;
}

a, a:active, a:hover {
	text-decoration: none;
	color: #936581;
	border: none;
	line-height: 22px;
}

h3 {
	font-size: 14px;
}


#header, .fixed {
	position: fixed !important;
	background: #F2F5F5;
	top: 0;
	left: 50%;
	margin-left: -680px;
	z-index: 99999;
	padding-top: 88px;
}

.fixed {
	padding-top: 0;
	background: #E2E3DE;
	top: 110px;
}

header.container {
	padding: 22px 0 43px;
	border-bottom: 1px solid #000;
}

header .logo h1, header .logo h2, .logo p {
	margin-left: 10px;
}

header .logo h2 {
	font-size: 18px;
	color: #929496;
}

header .logo p {
	color: #936581;
	margin: 0 0 0 10px;
	padding: 0;
}

header nav ul {
	margin: 0;
	padding: 0;
}

header nav li {
	float: left;
	font-size: 18px;
	color: #936581;
	margin: 0 10px 0 0;
}

header nav li:after {
	content: "/";
	margin: 0 0 0 10px;
}

header nav li.active {
	color: #000;
}

header nav li:last-of-type:after {
	content: "";
}

nav.container {
	padding: 44px 0 10px;
}

nav.gallery ul {
	margin: 0 10px;
	padding: 0;
	float: left;
}

nav.gallery li {
	float: left;
	font-size: 14px;
	line-height: 22px;
	color: #936581;
	margin: 0 6px 0 0;
}

nav.gallery li.active {
	color: #000;
}

nav.gallery li:last-of-type {
	margin: 0 10px 0 0;
}

nav.gallery ul:after {
	float: left;
	content: "/";
	color: #000;
}

nav.gallery .text {
	float: left;
	margin: 0 0 0 0px;
	color: #936581;
	display: none;
}

nav.gallery .right {
	color: #936581;
	float: right;
	font-size: 10px;
	display: none;
}

nav.gallery .text:first-of-type,
nav.gallery .right:first-of-type {
	display: block;
}

#gallery.container {
	height: 770px;
	position: relative;
	padding: 0 0 44px 0;
	overflow: hidden;
}

#gallery img.gallery-img {
	display: none;
}

#gallery img#loading {
	position: relative;
	display: block;
	height: 34px;
	width: 34px;
	margin: 0 auto;
}

#gallery nav.gallery {
	display: none;
}

#gallery img, .mini-gallery img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

#gallery img {
	top: 77px;
}

.container header.container {
	padding: 22px 0 0;
	border: none;
}

hr {
	margin: 10px 10px 11px;
	border-top: 1px dotted #000;
}

#about, #contact, #container {
	padding: 0 0 44px;
}

#contact p {
	font-size: 18px;
	margin-bottom: 22px;
}

#about p {
	font-size: 14px;
	margin-bottom: 22px;
}

ul.sub-gallery {
	width: 100%;
	float: none;
}


.small-gallery.mini-gallery {
	margin-top: 11px;
}

#projects {
	background: #E2E3DE;
}

#projects hr {
	margin-bottom: 0;
}

#projects li {
	font-size: 14px;
	margin: 0 4px 0 0;
}

#projects li:after {
	margin: 0 0 0 4px;
}

li:hover, #projects .more:hover {
	cursor: pointer;
	color: #000;
}

article.container {
	margin: 22px 0 0;
}

article h2 {
	margin: 0;
}

footer.container {
	padding: 22px 0 88px;
}

.more {
	color: #936581;
	display: none;
}

.mini-gallery {
	position: relative;
	width: 480px;
	height: 256px;
	margin-bottom: 11px;
}

.small-gallery .text {
	font-size: 10px;
	line-height: 18px;
}

article nav.gallery ul {
	margin: 0 4px 0 0;
	padding: 0;
	float: left;
}

#container, #container article {
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -ms-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
}

#container {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  -ms-transition-property: height, width;
  -o-transition-property: height, width;
  transition-property: height, width;
  background: #E2E3DE;
}

#container article {
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform, opacity;
  -ms-transition-property: -ms-transform, opacity;
  -o-transition-property: top, left, opacity;
  transition-property: transform, opacity;
  overflow: hidden;
  z-index: 2;
}


/* Media queries
-------------------------------------------------------------------------------*/


@media only screen and (min-width: 768px) and (max-width: 1359px) {
	.container { 
	    position: relative; 
	    width: 765px; 
	    margin: 0 1px; 
	}

	html, body {
		background: #F2F5F5;
	}

	.wrapper {
			width: 767px;
			padding-top: 176px;
			margin: 0 auto;
			background: #F2F5F5;
	}

	.container .one.column,
	.container .one.columns { 
	    width: 45px;  
	}

	.container .two.columns { 
	    width: 90px; 
	}

	.container .three.columns { 
	    width: 135px; 
	}

	.container .four.columns {
	    width: 180px; 
	}

	.container .five.columns {
	    width: 225px; 
	}

	.container .six.columns {
	    width: 270px; 
	}

	.container .seven.columns { 
	    width: 315px; 
	}

	.container .eight.columns { 
	    width: 360px; 
	}

	.container .nine.columns {
	    width: 405px; 
	}

	.container .ten.columns {   
	    width: 450px; 
	}

	.container .eleven.columns { 
	    width: 495px;
	}

	.container .twelve.columns {
	    width: 540px;
	}

	.container .thirteen.columns {
	    width: 585px;
	}
	.container .fourteen.columns {
	    width: 630px;
	}

	.container .fifteen.columns {
	    width: 675px;
	}

	.container .sixteen.columns {
	    width: 720px;
	}

	.container .seventeen.columns {
	    width: 765px;
	}

	#gallery.container {
		height: 452px;
		position: relative;
		padding: 0 0 44px 0;
		overflow: hidden;
	}

	.mini-gallery {
		position: relative;
		width: 270px;
		height: 144px;
		margin-bottom: 11px;
	}

	#header, .fixed {
		margin-left: -383px;
		padding-right: 1px;
	}

	.fixed {
		z-index: 999;
	}

	body {
		font-size: 12px;
		line-height: 22px;
	}

	h1, h2, h3 {
		font-size: 18px;
		line-height: 22px;
	}

	h3 {
		font-size: 12px;
	}

	header .logo h2 {
		font-size: 16px;
	}

	header nav li {
		font-size: 16px;
	}

	nav.gallery li {
		font-size: 12px;
		line-height: 22px;
	}

	#about p, #contact p {
		font-size: 16px;
	}

	#about p {
		font-size: 14px;
	}

	#projects li {
		font-size: 12px;
	}

	article .two-on-small { 
	    width: 90px !important;  
	}

	article.container .two.columns { 
	    width: 45px; 
	}

	article.container .five.columns {
	    width: 270px; 
	}

	article.container .eight.columns, #projects.container .eight.columns, #projects.container .six.columns  { 
	    width: 315px; 
	}
}

/*@media only screen and (max-width: 1359px) {
	.container { 
	    position: relative; 
	    width: 100%; 
	    margin: 0 auto; 
	    padding: 0 0; 
	}

	.container .container {
		margin: 0 0;
	}

	.container .one.column,
	.container .one.columns,
	.container .two.columns,
	.container .three.columns,
	.container .four.columns,
	.container .five.columns,
	.container .six.columns,
	.container .seven.columns,
	.container .eight.columns,
	.container .nine.columns,
	.container .ten.columns,
	.container .eleven.columns,
	.container .twelve.columns,
	.container .thirteen.columns,
	.container .fourteen.columns,
	.container .fifteen.columns,
	.container .sixteen.columns,
	.container .seventeen.columns {
	    width: 100%;
	}

	#gallery.container {
		height: 222px;
		position: relative;
		padding: 0 0 22px 0;
		overflow: hidden;
	}

	nav.container {
		padding: 22px 0 11px;
	}

	#gallery img {
		top: 55px;
	}

	h1, h2, p {
		margin-left: 10px;
		margin-right: 10px;
	}

	header a {
		margin-left: 10px;
	}

	header h2 {
		margin-bottom: 11px;
	}

	header.container {
		padding: 11px 0 21px;
	}

	article h2 {
		margin-left: 10px;
	}

	nav, ul, .more {
		margin-left: 10px;
	}

	.mini-gallery {
		position: relative;
		width: 100%;
		height: 144px;
		margin-bottom: 11px;
	}
}*/