@charset "utf-8";
@import "../type/icomoon/config.css";
@import "../type/icon/config.css";

*
{
	margin: 0;
	padding: 0;
}

a > img
{
	border: none;
}

a,
button
{
	cursor: pointer;
}

button
{
	outline: none;
	border: none;
}

a.more,
button.more
{
	display: inline-block;
	width: 108px;
	height: 24px;
	padding: 0 10px;
	line-height: 24px;
	color: #1E388C;
	text-decoration: none;
	font-size: 12px;
	background: #DDD;
	text-align: left;
}

button.more
{
	width: 128px;
}

a.more > span,
button.more > span
{
	display: block;
	height: 24px;
	width: 10px;
	line-height: 24px;
	float: right;
	font-size: 140%;
}

a.more:hover,
button.more:hover
{
	background: #1E388C;
	color: #FFF;
}

body
{
	font-size: 13px;
	font-family: 'Trebuchet MS', sans-serif;
}

h1,
h2,
h3
{
	font-size: 25px;
	font-weight: normal;
	text-transform: uppercase;
	font-family: 'Evo';
}

h1
{
	color: #1E388C;
	text-align: center;
	padding-bottom: 10px;
}

h2,
h3
{
	color: #333;
}

h3
{
	font-size: 20px;
}

h4
{
	font-size: 19px;
	text-transform: uppercase;
	color: #797979;
	font-family: 'EvoBold';
}

h4 > span
{
    color: #AAA;
    float: right;
}

.column
{
	float: left;
}

.column.third
{
	width: 282px;
	padding: 0 10px;
}

.column.quarter
{
	width: 216px;
}

.column.quarter + .column.quarter
{
	margin-left: 14px;
}

div.ruler
{
	padding-top: 10px;
	border-top: 1px solid #CCC;
	margin-top: 10px;
}

div.clear
{
	clear: both;
}

div#strip
{
	height: 8px;
	background: #1E388C;
}

div.grid
{
	width: 906px;
	margin: 0 auto;
}

div#content
{
	position: relative;
	padding: 40px 0;
	min-height: 400px;
}

div#head
{
	padding: 25px 0;
	height: 65px;
	position: relative;
	font-family: 'Evo';
}

div#tel
{
	width: 140px;
	height: 30px;
	background: #1E388C;
	color: #FFF;
	position: absolute;
	top: 0;
	right: 0;
	line-height: 28px;
	text-align: center;
	font-size: 14px;
}

div#tel a
{
	color: #FFF;
	text-decoration: none;
}

div#head > a
{
	display: inline-block;
	float: left;
}

div#head > p
{
	float: right;
	color: #1E388C;
	font-size: 11px;
	padding-top: 12px;
	text-align: right;
}

div#head > p > a
{
	color: #1E388C;
	text-decoration: none;
}

ul#nav
{
	list-style: none;
	display: block;
	height: 37px;
}

ul#nav > li
{
	display: inline;
	position: relative;
}

ul#nav li a
{
	display: inline-block;
	position: relative;
	font-size: 18px;
	font-family: 'EvoThick';
	color: #666;
	text-decoration: none;
	text-transform: uppercase;
	width: 165px;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	float: left;
	height: 35px;
	line-height: 35px;
	text-align: center;
}

ul#nav > li > a > div
{
	display: none;
	position: absolute;
	top: 36px;
	left: 50%;
	width: 19px;
	height: 9px;
	background: url("../textures/layout/nav.png") no-repeat;
	margin-left: -10px;
}

ul#nav > li#home > a
{
	width: 81px;
	font-size: 20px;
}

ul#nav > li:hover > a,
ul#nav > li > a.current
{
	border-top: 1px solid #1E388C;
	border-bottom: 1px solid #1E388C;
	background: #DDD;
	color: #1E388C;
}

ul#nav > li > ul > li:hover > a,
ul#nav > li > ul > li > a.current
{
	color: #1E388C;
}

ul#nav > li:hover > a > div,
ul#nav > li > a.current > div
{
	display: block;
}

ul#nav > li > ul
{
	display: none;
	position: absolute;
	background: #F0F0F0;
	list-style: none;
	top: 37px;
	right: 0;
	width: 165px;
	z-index: 40;

}

ul#nav > li > ul > li > a
{
	border-top: none;
}

ul#nav > li:hover > ul
{
	display: block;
}

div#foot
{
	height: 65px;
	text-align: right;
	font-size: 8px;
	background: url("../textures/layout/footer.png") no-repeat center top;
}

div#foot > div.grid
{
	border-top: 1px solid #CCC;
	padding-top: 15px;
	padding-bottom: 50px;
}

div#foot img
{
	float: left;
}

div#foot small
{
	display: block;
	font-size: 8px;
	padding-top: 22px;
	color: #333;
}

div#foot small > a
{
	color: #333;
	text-decoration: none;
}







div#intro
{
	width: 906px;
	height: 460px;
	background: #EEE;
}

div#splash
{
	padding-top: 60px;
}

div#splash h3
{
	position: absolute;
	top: -40px;
	left: 10px;
}

div#splash p
{
	margin-bottom: 20px;
}

div#splash div.column
{
	height: 150px;
	position: relative;
}

div#splash div.column > a.more
{
	position: absolute;
	bottom: 0;
}

div.slides
{
	overflow: hidden;
	position: relative;
}

div.slides > ul > li
{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

div.slides > ul > li + li
{
	display: none;
}

div.slides > ul
{
	list-style: none;
}

div.slides > ul > li > img
{
	width: 100%;
	height: 100%;
}

div.slides > button
{
	position: absolute;
	top: 50%;
	left: 0;
	background-color: #000;
	background: rgba(0,0,0,0.7) url("../textures/layout/arrows.png") no-repeat 0 0;
	width: 60px;
	height: 70px;
	margin-top: -35px;
}

div.slides > button.next
{
	left: auto;
	right: 0;
	background-position: -60px 0;
}

div.slides > button.prev:hover{ left: -12px; }
div.slides > button.next:hover{ right: -12px; }
div.slides > button:active{ top: 51%; }

div.slidenav
{
	background: #CCC;
	height: 8px;
	margin-top: 1px;
	overflow: hidden;
	white-space: nowrap;
}

div.slidenav > button
{
	display: block;
	float: left;
	height: 8px;
}

div.slidenav > button:hover,
div.slidenav > button.active
{
	background: #1E388C;
}

div.slidenav.six > button
{
	width: 151px;
}


div.column.left
{
	width: 570px;
	padding-right: 36px;
}

div.column.right
{
	width: 300px;
	float: right;
}

div.column.left p + p
{
	margin-top: 10px;
}

div.column.left p + h3
{
	margin-top: 25px;
}

div.column.left div.ruler
{
	margin-bottom: 8px;
}

div.column.left ul.text
{
	padding-top: 10px;
	padding-left: 20px;
}

.underline
{
	border-bottom: 8px solid #DDD;
	padding-bottom: 1px;
}

div.photo > img
{
	display: block;
	width: 100%;
	height: auto;
}

div.photo + div.photo
{
	margin-top: 10px;
}

ul#reviews
{
	list-style: none;
}

ul#reviews > li
{
	padding-top: 30px;
	background: url("../textures/layout/quote.png") no-repeat top left;
}

ul#reviews > li + li
{
	margin-top: 30px;
}

ul#reviews strong
{
	color: #797979;
	font-weight: normal;
}


ul#staff
{
	list-style: none;
	height: 240px;
}

ul#staff > li
{
	display: block;
	float: left;
	width: 120px;
}

ul#staff > li + li
{
	margin-left: 30px;
}

ul#staff > li > div
{
	width: 120px;
	height: 148px;
	background: #333;
	margin-bottom: 10px;
}

ul#staff > li > div > img
{
	display: block;
	width: 100%;
	height: 100%;
}

ul#staff > li > strong
{
	font-weight: normal;
	display: block;
}

div#map
{
	height: 390px;
}

div#contact div.column.left
{
	width: 470px;
}

div#contact div.column.right
{
	width: 400px;
}


div#projects > div.column > a
{
	display: block;
}

div#projects > div.column > a > img
{
	display: block;
	width: 100%;
	height: auto;
}

div#projects > div.column > a:hover
{
	border-bottom: 8px solid #1E388C;
}

div#projects > div.column > h2
{
	border-bottom: 1px solid #CCC;
	margin-bottom: 5px;
}



ul#work
{
	list-style: none;
}

ul#work > li
{
	display: block;
	float: left;
	width: 440px;
	height: 230px;
	padding-top: 12px;
}

ul#work > li + li + li
{
	border-top: 1px solid #CCC;
}

ul#work > li.even
{
	float: right;
}

ul#work > li > div.underline
{
	float: left;
	width: 220px;
}

ul#work > li > div.underline > img
{
	display: block;
	width: 100%;
	height: 185px;
}

ul#work > li > div.underline + div
{
	float: right;
	width: 205px;
	height: 194px;
	position: relative;
}

ul#work > li > div.underline + div > h4
{
	font-size: 17px;
	font-family: 'Evo';
	font-weight: normal;
}

ul#work > li > div.underline + div > p
{
	padding: 10px 0;
	line-height: 15px;
}

ul#work > li > div.underline + div > button
{
	position: absolute;
	bottom: 0;
	left: 0;
}

a.back
{
	display: inline-block;
	position: absolute;
	top: 48px;
	right: 0;
	padding-left: 10px;
	background: url("../textures/layout/back.png") no-repeat center left;
	text-decoration: none;
	text-transform: uppercase;
	color: #333;
}


div.curtain
{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	background: rgba(102,102,102,0.7);
}

div.lightbox
{
	position: fixed;
	top: 50%;
	left: 50%;
	width: 850px;
	height: 490px;
	padding: 10px;
	background: #FFF;
	box-shadow: 0 2px 8px rgba(0,0,0,0.5);
	margin-left: -435px;
	margin-top: -255px;
	z-index: 50;
}

div.lightbox > div.slides
{
	height: 490px;
	background: #EEE;
}

div.lightbox a.close
{
	display: block;
	position: absolute;
	top: 10px;
	right: 10px;
	width: 34px;
	height: 34px;
	background-color: #000;
	background: rgba(0,0,0,0.6) url("../textures/layout/close.png") no-repeat center;
	z-index: 50;
}

div.lightbox a.close:hover
{
	background-color: rgba(0,0,0,0.7);
}

div.lightbox div.counter
{
	display: inline-block;
	position: absolute;
	left: 10px;
	bottom: 10px;
	color: #FFF;
	text-transform: uppercase;
	background: #000;
	background: rgba(0, 0, 0, 0.6);
	height: 30px;
	line-height: 30px;
	padding: 0 10px;
}

div#contact a
{
	text-decoration: none;
	color: #333;
}