@import url(http://fonts.googleapis.com/css?family=Share);
@import url(http://fonts.googleapis.com/css?family=Playfair+Display:400,400italic);

body, html
{
	font-size: 100%;
	padding: 0;
	margin: 0;
	height: 100%;
}

*
{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	text-decoration: none;
	font-size: 100%;
	-webkit-text-size-adjust: none;
	vertical-align: baseline;
	background: transparent;
	font-weight: normal;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

body
{
	font: 100%/1.2 'Share', Calibri, Arial, sans-serif;
	color: #eee;
	background: #222;
	font-weight: 300;
}

body.homepage { background: #000; }
img { border: none; }
:focus { outline: 0; }

a
{
	text-decoration: none;
	color: #d08d6f;
}

a:hover, a.selected { color: #fff !important; }

h2,h3,h4,h5,h6,p
{
	margin-bottom: 0.5em;
	font-weight: 400;
}

h1
{
	font-size: 120px;
	letter-spacing: -8px;
	font-family: 'Playfair Display', serif;
	line-height: 107px;
}

a h1 { color: #fff; }

h1 span
{
	font-size: 80px;
	vertical-align: top;
}

h2
{
	font-size: 2.4em;
	color: #fff;
	letter-spacing: -2px;
	font-family: 'Playfair Display', serif;
	text-transform: uppercase;
}

h3
{
	font-size: 1.3em;
	color: #d08d6f;
	text-transform: uppercase;
}

h4
{
	font-size: 17px;
	color: #888;
	font-family: Times, serif;
	font-style: italic;
	margin-bottom: 30px;
	font-weight: normal;
}

h5 { font-size: 1em; }

h6
{
	font-size: 13px;
	font-family: Times, serif;
	font-style: italic;
	color: #888;
}

h6.top { margin-top: 50px; }
h6 a { color: #888; }
h5.subnav { color: #d08d6f; }

p
{
	font: 0.8125em/1.4 "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
	color: #ccc;
	margin-bottom: 20px;
	text-align: justify;
	-webkit-hyphens: auto;
	hyphens: auto;
	text-rendering: optimizeLegibility;
}

hr
{
	display: block;
	position: relative;
	padding: 0;
	margin: 10px auto 20px auto;
	width: 70%;
	clear: both;
	border: none;
	border-top: 1px solid rgba(0,0,0,0.2);
	font-size: 1px;
	line-height: 0;
	overflow: visible;
}

strong { color: #fff; font-weight: bold}
.hide { display: none; }
ul, ol { margin-bottom: 1.5em; }

li
{
	margin-left: 20px;
	margin-bottom: 1em;
	font: 0.8125em/1.4 "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
}

.news li{
	margin-bottom: 5px;
}

#floater
{
	position: relative;
	float: left;
	height: 50%;
	margin-bottom: -180px;
	width: 1px;
}

#centered
{
	position: relative;
	clear: left;
	width: 500px;
	height: 212px;
	max-width: 500px;
	min-width: 500px;
	margin: 0 auto;
	text-align: center;
}

.logo
{
	width: 280px;
	position: absolute;
	bottom: 100px;
	left: 50%;
	margin-left: -160px;
	z-index: 9;
	display: none;
}

.arts, .craft
{
	position: absolute;
	top: 0;
	left: 0;
	width: 500px;
	height: 107px;
	background: transparent;
	z-index: 8;
	display: none;
}

.craft { top: 101px; }

ul.nav
{
	width: 100%;
	height: 40px;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	z-index: 9;
}

.homepage .nav { top: -40px; }

.nav li
{
	margin: 0;
	padding: 0;
	list-style: none;
}

.nav li a:link, .nav li a:visited
{
	height: 40px;
	float: left;
	font: 18px/40px "Share", sans-serif;
	text-transform: uppercase;
	color: #fff;
}

.nav li.nav-projects a:link, .nav li.nav-projects a:visited
{
	background: #333;
	width: 50%;
	padding-left: 30px;
}

.nav li.nav-about a:link, .nav li.nav-about a:visited
{
	background: #5c5c5c;
	width: 50%;
	text-align: right;
	padding-right: 30px;
}

ul.nav ul
{
	width: 100%;
	height: 30px;
	position: absolute;
	top: 40px;
	left: 0;
	text-align: center;
	background: #777;
}

.homepage .nav ul { display: none; }
.nav ul li { display: inline; }

.nav li.nav-about ul li a:link, .nav li.nav-about ul li a:visited
{
	display: inline-block;
	width: auto;
	height: 30px;
	float: none;
	font: 16px/30px "Share", sans-serif;
	padding: 0 20px;
	background: #777;
	text-align: left;
	margin-right: -4px !important;
}

.nav li a:hover
{
	background: #fff !important;
	color: #222 !important;
}

a.on
{
	background: #eee !important;
	color: #222 !important;
}

a.selected
{
	background: #ddd !important;
	color: #222 !important;
}

.footer
{
	width: 900px;
	height: 10px;
	text-align: center;
	font: 10px/10px "Share", sans-serif;
	text-transform: uppercase;
	letter-spacing: 3px;
	margin: 20px auto;
}

.homepage .footer
{
	position: absolute;
	bottom: 0;
	left: 50%;
	z-index: 8;
	display: none;
	margin: 0 0 15px -450px;
}

.footer a:link, .footer a:visited { color: #ccc; }

.container
{
	width: 100%;
	min-height: 1100px;
	background: #333;
	margin-top: 340px;
	position: relative;
	z-index: 9;
}

.contents
{
	width: 960px;
	margin: 0 auto;
	padding: 30px;
	text-align: center;
	position: relative;
}

.contents3 img{
	max-width:100%;
}
.bg
{
	position: absolute;
	top: 70px;
	left: 0;
	width: 100%;
	z-index: 1;
}

.bg img { width: 100%; }

.col
{
	width: 460px;
	margin: 0 auto;
}

.c180
{
	width: 160px;
	margin: 0 20px 0 0;
	float: left;
}

.c220
{
	width: 200px;
	margin: 0 10px;
	float: left;
}

.c260
{
	width: 280px;
	float: left;
}

#myMap
{
	display: block;
	width: 100%;
	height: 300px;
	position: absolute;
	left: 0;
	top: 70px;
	z-index: 1;
}

.map .container { margin-top: 350px; }

.button
{
	display: inline-block;
	padding: 8px 16px;
	background: #111;
	color: #eee;
	font: 14px/1 "Share", sans-serif;
	text-transform: uppercase;
}

a.button:hover
{
	background: #fff;
	color: #222 !important;
}

.goR
{
	float: right;
	margin: 0 0 10px 20px;
	height: 350px;
	border: 8px solid rgba(0,0,0,0.1);
}

.col-pic
{
	width: 290px;
	float: left;
	margin: 0 5px;
	text-align: center;
}

.col-pic h3 { margin-bottom: 0; }

.col-pic img
{
	border: 8px solid rgba(0,0,0,0.2);
	width: 100%;
	margin-bottom: 10px;
}

.taL { text-align: left; }
.taR { text-align: right; }
.taC p, .taC h3 { text-align: center }
.taC h5{ margin-bottom: 0px}
.pronav
{
	width: 70%;
	margin: 0 auto;
	top: 50px !important;
}

iframe
{
	background-color: transparent;
	border: 0px none transparent;
	overflow: hidden;
}

.pub{
	width:100px;
	display: inline-block;
	margin: 0 5px;
	text-align: center;
	font-family: "Share", sans-serif;
	font-size: 12px;
}
.pub img{
	margin-bottom: 5px;
}


.pjtc .bg { background: #565f49 !important; }
.pjtc, .pjtc .container { background: #707d5a; }
.pjtc ul.nav ul, .pjtc .nav li.nav-about ul li a:link, .pjtc .nav li.nav-about ul li a:visited { background: #5f6a4d; }
.pjtc h2, .pjtc h5 { color: #cdd9b4; }
.pjtc h3, .pjtc h4 { color: #39442b; }
.pjtc p, .pjtc a.on, .pjtc a:link, .pjtc a:visited { color: #e6ecd9; }
.pjtc a.selected { background: #cdd9b4 !important; }
.p92 .bg { background: #bd7109 !important; }
.p92, .p92  .container { background: #e0880b; }
.p92 ul.nav ul, .p92 .nav li.nav-about ul li a:link, .p92 .nav li.nav-about ul li a:visited { background: #ff9500; }
.p92 h2, .p92 h4, .p92 h5,  .p92 h3 { color: #111; }
.p92 p, .p92 a.on, .p92 a:link, .p92 a:visited { color: #f2f2d4; }
.p92 a.selected { background: #fecd87 !important; }
.tsq .bg { background: #352e26 !important; }
.tsq, .tsq .container{ background: #413930; }
.tsq ul.nav ul, .tsq .nav li.nav-about ul li a:link, .tsq .nav li.nav-about ul li a:visited  { background: #312b24}
.tsq h2, .tsq h4, .tsq h5, .tsq h3 { color: #a38763; }
.tsq p, .tsq a.on, .tsq a:link, .tsq a:visited { color: #bfb0a0; }
.tsq a.selected { background: #bfb0a0 !important; }

#gallery
{
	width: 115px;
	float: left;
}

#gallery a
{
	display: inline-block;
	float: left;
}

#gallery img
{
	display: inline-block;
	width: 55px;
	float: left;
	border: 4px solid transparent;
}

#gallery a.picked img { border: 4px solid rgba(255,255,255,0.3); }

#photo
{
	float: left;
	height: 500px;
	overflow: hidden;
}

#photo img
{
	height: 500px;
	border: 8px solid rgba(0,0,0,0.1);
}

.animated
{
	-webkit-animation-fill-mode: both;
	-moz-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	-o-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-duration: 1s;
	-moz-animation-duration: 1s;
	-ms-animation-duration: 1s;
	-o-animation-duration: 1s;
	animation-duration: 1s;
}

.animated.hinge
{
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-ms-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}

@-webkit-keyframes rotateIn {
	0% {
		-webkit-transform-origin: center center;
		-webkit-transform: rotate(-200deg);
		opacity: 0;
	}	100% {
		-webkit-transform-origin: center center;
		-webkit-transform: rotate(0);
		opacity: 1;
	}
}
@-webkit-keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(50px);
	}	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}
@-moz-keyframes fadeInUp {
	0% {
		opacity: 0;
		-moz-transform: translateY(50px);
	}
	
	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}
@-o-keyframes fadeInUp {
	0% {
		opacity: 0;
		-o-transform: translateY(50px);
	}
	
	100% {
		opacity: 1;
		-o-transform: translateY(0);
	}
}
@keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translateY(50px);
	}
	
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.fadeInUp
{
	-webkit-animation-name: fadeInUp;
	-moz-animation-name: fadeInUp;
	-o-animation-name: fadeInUp;
	animation-name: fadeInUp;
}

@-webkit-keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-50px);
	}
	
	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}
@-moz-keyframes fadeInDown {
	0% {
		opacity: 0;
		-moz-transform: translateY(-50px);
	}
	
	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}
@-o-keyframes fadeInDown {
	0% {
		opacity: 0;
		-o-transform: translateY(-50px);
	}
	
	100% {
		opacity: 1;
		-o-transform: translateY(0);
	}
}
@keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-50px);
	}
	
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.fadeInDown
{
	-webkit-animation-name: fadeInDown;
	-moz-animation-name: fadeInDown;
	-o-animation-name: fadeInDown;
	animation-name: fadeInDown;
}

/* Maximage */
#maximage
{
	display: none;
	/* Only use this if you fade it in again after the images load */
	position: fixed !important;
}

.mc-hide-scrolls { overflow: hidden; }

body .mc-cycle
{
	height: 100%;
	left: 0;
	overflow: hidden;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: -1;
}

div.mc-image
{
	/*NOTE: Mozilla flickers when fading and using 'all', so we have to be specific with what property we want to transition:
	 	If you are using fading transitions, use 'opacity: */
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
	/*If you are using horizontal slide transitions, use the following CSS:
	-webkit-transition: left 1s ease-in-out; 
	-moz-transition: left 1s ease-in-out; 
	-o-transition: left 1s ease-in-out; 
	transition: left 1s ease-in-out;*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	height: 100%;
	overflow: hidden;
	width: 100%;
}

.mc-old-browser .mc-image { overflow: hidden; }

@media screen and (max-width: 46.5em)
{
	.bl-content,
			.bl-box { font-size: 75%; }
	.bl-expand .bl-box { height: 130px; }
	.bl-content > ul li { width: 40%; }
}