/*******************************************************************************

	CSS on Sails Framework
	Title: Lunar
	Author: XHTMLized.com
	Date: May 2013

********************************************************************************

	1. BASE
		1.1 Reset
		1.2 Accessibility Navigation & Hide
		1.3 Clearfix
		1.4 Fonts
		1.5 Normalized Styles

	2. COMMON
		2.1 Container
		2.2 Header
		2.3 Navigation
		2.4 Content
		2.5 Sidebar
		2.6 Footer

	3. PAGES
		3.1 Home
		3.2 Project Detail
		3.3 Practices
		3.4 Contact

	4. RESPONSIVE
	5. PRINT
	6. MIDDLE

*******************************************************************************/


/* 1. BASE
--------------------------------------------------------------------------------
==============================================================================*/


/* 1.1 Reset
------------------------------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr,
article, aside, canvas, details, figcaption, figure,
footer, header, header2, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

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

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

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

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

a[href], label[for], select,
input[type=checkbox], input[type=radio] {
	cursor: pointer;
}

button, input[type=button], input[type=image],
input[type=reset], input[type=submit] {
	padding: 0;
	overflow: visible;
	cursor: pointer;
}

button::-moz-focus-inner,
input[type=button]::-moz-focus-inner,
input[type=image]::-moz-focus-inner,
input[type=reset]::-moz-focus-inner,
input[type=submit]::-moz-focus-inner {
	border: 0;
}


/* 1.2 Accessibility Navigation & Hide
------------------------------------------------------------------------------*/

#accessibility-nav {
	position: absolute;
	top: 0;
	left: -9999em;
	z-index: 1000000;
}

#accessibility-nav a {
	position: absolute;
	top: 0;
	white-space: nowrap;
}

#accessibility-nav a:active,
#accessibility-nav a:focus {
	left: 9999em;
}

.hide {
	position: absolute !important;
	left: -9999em !important;
}


/* 1.3 Clearfix
------------------------------------------------------------------------------*/

.lower > div:after,
.mid:after,
.top article blockquote:after,
.top > div:after,
#content:after,
#navigation > ul:after,
#header:after,
#header2:after,
.clearfix:after {
	content: ".";
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
	overflow: hidden;
}

.ie7 .lower > div,
.ie7 .mid,
.ie7 .top article blockquote,
.ie7 .top > div,
.ie7 #content,
.ie7 #navigation > ul,
.ie7 #header,
.ie7 #header2,
.ie7 .clearfix {
	zoom: 1;
}

.oldie .slider-wrapper article .description {
	behavior: url(../js/PIE.htc);
}


/* 1.4 Fonts
------------------------------------------------------------------------------*/


/* 1.5 Normalized Styles
------------------------------------------------------------------------------*/

body {
	font: 300 100%/1.25 'Open Sans', sans-serif;
	color: #231f20;
	background: #000000;
	-webkit-text-size-adjust: 100%;
}

hr {
	display: none;
}

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}

del {
	text-decoration: line-through;
}

th, td {
	vertical-align: top;
}

th {
	font-weight: normal;
	text-align: left;
}

address, cite, dfn {
	font-style: normal;
}

abbr, acronym {
	border-bottom: 1px dotted #999;
	cursor: help;
}


sub {
	bottom: -0.25em;
}

input, textarea, select {
	font-family: Arial, Helvetica, sans-serif;
}

textarea {
	 overflow: auto;
}

a, a:visited, a:active, a:focus {
	text-decoration: none;
	color: #38b3c4;
	outline: 0;

	-webkit-transition: color 0.3s ease-in-out;
	transition: color 0.3s ease-in-out;
}

a:hover {
	text-decoration: none;
}

a.droplink:link,
a.droplink:visited,
a.droplink:active {
	color: #ffffff !important;
	text-decoration: underline;
}

a.droplink:hover {
	color: #e5e5e5 !important;
	text-decoration: underline;
}

/* 2. COMMON
--------------------------------------------------------------------------------
==============================================================================*/


/* 2.1 Container
------------------------------------------------------------------------------*/

.container {
	position: relative;
	width: 960px;
	margin: 0 auto;
}


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

.header-wrapper {
	position: relative;
	z-index: 2000;
	background: #000;
}

#header {
	position: relative;
	width: 980px;
	height: 80px;
	margin: 0 auto;
}

#header .lunar {
	position: relative;
	z-index: 2000;
	float: left;
	display: block;
	width: 80px;
	height: 40px;
	margin: 20px 0 0 0;
	text-indent: -8000px;
	background: url(../../images/soacer.gif) no-repeat;
}

#header .logo-new {
	position: absolute;
	padding-top: 22px;
	padding-left: 6px;
	z-index: 99999999;
	width: 100px;
}

#header .social {
	position: relative;
	z-index: 2000;
	float: right;
	padding: 28px 2px 0 0;
}

#header .social li {
	float: left;
	padding: 0 0 0 13px;
}

#header .social a {
	display: block;
	width: 25px;
	height: 25px;
	text-indent: -8000px;
	background: url(../../images/shared/icons-social.png) no-repeat;
}

#header .social .twitter a {
	background-position: 0 0;
}

#header .social .twitter a:hover {
	background-position: 0 -25px;
}

#header .social .facebook a {
	background-position: -39px 0;
}

#header .social .facebook a:hover {
	background-position: -39px -25px;
}

#header .social .vimeo a {
	background-position: -77px 0;
}

#header .social .vimeo a:hover {
	background-position: -77px -25px;
}

#header .social .linkedin a {
	background-position: -115px 0;
}

#header .social .linkedin a:hover {
	background-position: -115px -25px;
}

#header .social .instagram a {
	background-position: -153px 0;
}

#header .social .instagram a:hover {
	background-position: -153px -25px;
}



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

#navigation {
	position: absolute;
	top: 31px;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
}

#navigation > ul {
	overflow: hidden;
	height: 49px;
	padding: 0 0 0 154px;
	background: #000;
}

#navigation > ul > li {
	float: left;
}

#navigation > ul > li:nth-child(1) {
	width: 130px;
}

#navigation > ul > li:nth-child(2) {
	width: 150px;
}

#navigation > ul > li:nth-child(3) {
	width: 165px;
}

#navigation > ul > li > a {
	display: block;
	font-size: 15px;
	font-weight: 600;
	text-transform: lowercase;
	color: #9e9e9e;
}

#navigation > ul > li > a:hover,
#navigation > ul > li.active > a {
	color: #ffffff;
	text-decoration: none;
}

#navigation ul ul {
	padding: 28px 0 28px 0;
}

#navigation li li a {
	display: block;
	font: normal 14px/24px Verdana, sans-serif;
	color: #7f7f7f;
	text-decoration: none;
}

#navigation li li a:hover {
	color: #ffffff;
}


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

#contentbox {
	width: 100%;
	background-color: #ffffff;
}

#content {
	position: relative;
	z-index: 1000;
}


/* 2.5 Sidebar
------------------------------------------------------------------------------*/

#sidebar {
}


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

#footer {
	clear: both;
	width: 944px;
	margin: 0 auto;
	color: #ffffff;
	font-size: 14px !important;
	line-height: 24px !important;
}

#foot1box,
#foot2box,
#foot3box,
#foot4box {
	float: left;
	width: 236px;
}

#foot1,
#foot2,
#foot3,
#foot4 {
	margin: 34px 0 0 0;
}

#footer a {
	color: #ffffff;
	text-decoration: none;
}

#footer a:hover {
	color: #ffffff;
	text-decoration: underline;
}

#foot2 a,
#foot3 a,
#foot4 a,
#foot2 a,
#foot3 a,
#foot4 a:hover {
	font-weight: bold;
}

#footer h3 {
	font-size: 13px;
	font-weight: bold;
	margin: 0 0 12px 0;
	color: #777777;
}

#footbot {
	text-align: center;
	font-size: 12px;
	line-height: 22px;
	margin: 50px 0 20px 0;
}

#footerpad {
	width: 100%;
	height: 40px;
	background-color: #ffffff;
}


/* 3. PAGES
--------------------------------------------------------------------------------
==============================================================================*/


/* 3.1 Home
------------------------------------------------------------------------------*/

.home #content {
	left: 0;
	width: 100%;
	max-width: 987px;
	margin: 0 auto;
	padding: 9px 0 9px 6px;
}

.home #content .item {
	position: relative;
	float: left;
	margin: 0 7px 7px 0;
	width: 322px;
	overflow: hidden;
}

.item img {
	width: 326px;
	height: 326px;
}

.singletall {
	width: 326px;
	height: 659px !important;
}

.singletall img {
	width: 326px;
	height: 659px;
}

.double {
	width: 651px !important;
	height: 326px;
}

.doubletall {
	width: 651px !important;
	height: 659px !important;
}

.double img {
	width: 651px !important;
	height: 326px;
}

.doubletall img {
	width: 651px !important;
	height: 659px !important;
}

.triple {
	width: 980px !important;
	height: 326px;
}

.tripletall {
	width: 980px !important;
	height: 659px !important;
}

.triple img {
	width: 980px !important;
	height: 326px;
}

.tripletall img {
	width: 980px !important;
	height: 659px !important;
}

.home #content header {
	width: 322px;
	height: 326px;
	background: #e8e8e8;
}

.home #content header p {
	margin: 0 17px 5px 20px;
	padding: 13px 0 11px 0;
	font-size: 12px;
	border-bottom: solid 2px #000;
}

.home #content header .subtitle {
	margin: 0 20px 0 25px;
}

.home #content header .subtitle p {
	margin: 0 17px 5px 25px;
	font-size: 15px;
	line-height: 19px;
	margin: 0 0 20px 0;
	padding: 0;
	border: none;
}

.home #content header .slideimg {
	clear: both;
	margin: 0 0 0 25px;
}

.home #content .subhead {
	margin: 0 17px 5px 20px;
	padding: 13px 0 11px 0;
	font-size: 12px;
	
}

.home #content header h2 {
	padding: 0 21px 9px 21px;
	font-size: 30px;
	font-weight: 400;
	line-height: 34px;
	text-transform: uppercase;
}


.home #content header .learnmore {
	position: absolute;
	right: 20px;
	bottom: 30px;
	font-size: 12px;
	font-style: italic;
	font-weight: 400;
}

.home #content header .learnmore a {
	color: #000000;
}

/*
.home #content header a:after,
.home #content header a .after {
	content: " >>";
}
*/

.ie7 .home #content header a {
	background-image: expression(this.runtimeStyle.backgroundImage="none",this.innerHTML = this.innerHTML+'<span class="after"> >></span>');
}

a:link .kick { 
	float: left;
	margin: 0 0 0 0;
	font-size: 0px;
	font-style: italic;
	font-weight: 0; } 
a:visited .kick { 
	float: left;
	margin: 0 0 0 0;
	font-size: 0px;
	font-style: italic;
	font-weight: 0; } 
a:hover .kick { 
	float: left;
	margin: 0 0 0 0;
	font-size: 0px;
	font-style: italic;
	font-weight: 0; } 
a:active .kick { 
	float: left;
	margin: 0 0 0 0;
	font-size: 0px;
	font-style: italic;
	font-weight: 0; } 




.home #content header2 {
	width: 322px;
	height: 321px;
	border: solid 2px #ffffff;
}

.home #content header2 p {
	margin: 0 17px 5px 20px;
	padding: 13px 0 11px 0;
	font-size: 12px;
	border-bottom: solid 2px #000;
}

.home #content header2 h2 {
	padding: 0 21px 9px 21px;
	font-size: 30px;
	font-weight: 400;
	line-height: 40px;
	text-transform: uppercase;
}

.home #content header2 a {
	display: block;
	float: right;
	margin: 0 17px 0 0;
	font-size: 12px;
	font-style: italic;
	font-weight: 400;
}

.home #content header2 a:after,
.home #content header2 a .after {
	content: " >>";
}

.ie7 .home #content header2 a {
	background-image: expression(this.runtimeStyle.backgroundImage="none",this.innerHTML = this.innerHTML+'<span class="after"> >></span>');
}

.home #content > a {
}

.home #content > a img {
	position: relative;
	z-index: 1000;
	display: block;
}

.home #content > a p {
	position: absolute;
	top: 7px;
	left: 7px;
	right: 7px;
	z-index: 2000;
	display: block;
	padding: 6px 0 7px 8px;
	color: #ffffff;
	font-size: 20px;
	font-weight: 600;
	opacity: 0;
	background: rgba(0, 0, 0, 0.8);

	-webkit-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
}

.oldie .home #content > a p {
	display: none;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#cc000000',GradientType=0 );
}

.home #content > a:hover p {
	opacity: 1;
}

.oldie .home #content > a:hover p {
	display: block;
}

.playhover,
.playhover2,
.playhover4,
.playhover5a,
.playhover6,
.playhover7,
.playhover8,
.playhover9,
.playhover10 {
	background: transparent url('../../images/play.png') no-repeat;text-align:center;z-index:100000;
	position: absolute;
	display: none;
	padding: 6px 0 7px 8px;
	width:140px;height:140px;
	top:30%;left:30%;

}


.playhover3,
.playhover5 {
	background: transparent url('../../images/play.png') no-repeat;text-align:center;z-index:100000;
	position: absolute;
	display: none;
	padding: 6px 0 7px 8px;
	width:140px;height:140px;
	top:30%;left:39%;

}


/* 3.2 Project Detail
------------------------------------------------------------------------------*/

.project-detail #content {
	width: 980px;
	margin: 0 auto;
}

.slider-wrapper {
	position: relative;
	height: 600px;
}

.slider-wrapper .nav {
	height: 29px;
	padding: 11px 23px 0 25px;
	font: normal 12px Verdana, sans-serif;
	background: #eaeaea;
}

.slider-wrapper .nav a {
	color: #666;
}

.slider-wrapper .nav .back {
	float: left;
	display: block;
}

.slider-wrapper .nav .back:hover {
	color: #000;
}

.slider-wrapper .nav .back:before,
.slider-wrapper .nav .back .before {
	content: "< ";
	font-size: 10px;
}

.ie7 .slider-wrapper .nav .back {
	background-image: expression(this.runtimeStyle.backgroundImage="none",this.innerHTML = '<span class="before"><</span>' + this.innerHTML);
}

.slider-wrapper .nav p {
	float: right;
}

.slider-wrapper .nav p a {
	float: left;
	display: block;
	margin: 0 1px;
	padding: 0 1px;
}

.slider-wrapper .nav p a:hover,
.slider-wrapper .nav p a.active {
	color: #000;
}

.slider-wrapper .slides {
	position: relative;
	height: 560px;
}

.multiple.slides {
	cursor: pointer;
}

.slider-wrapper article {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	display: block !important;
	height: 560px;
}

.slider-wrapper article img {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1000;
	display: block;
}

.slider-wrapper article .description {
	position: absolute;
	top: 0;
	left: 20px;
	z-index: 2000;
	zoom: 1;
	width: 349px;
	max-height: 37px;
	padding: 24px 20px 3px 11px;
	border-radius: 0 0 10px 10px;
	background: rgba(0, 0, 0, 0.7);
	-pie-background: rgba(0, 0, 0, 0.7);
	overflow: hidden;

	-webkit-transition: max-height 0.3s ease-in-out;
	transition: max-height 0.3s ease-in-out;
}

.slider-wrapper article .description:hover {
	max-height: 533px;
}

.slider-wrapper article .description span {
	position: absolute;
	bottom: 3px;
	left: 0;
	right: 0;
	height: 19px;
	background: url(../../images/shared/bullets-slider.png) 0 0;
}

.slider-wrapper article .description:hover span {
	background-position: -380px 0;
}

.slider-wrapper article .description h2 {
	margin: 1px 0 14px 0;
	font-size: 25.5px;
	font-weight: 400;
	color: #ffffff;
}

.slider-wrapper article .description p {
	padding: 0 0 18px 0;
	font-size: 13px;
	line-height: 18px;
	font-weight: 300;
	color: #ffffff;
}

.slider-wrapper article .description p a {
	color: #38b3c4;
}


/* 3.3 Practices
------------------------------------------------------------------------------*/

.top {
	padding: 55px 0 65px 0;
	background: #e8e8e8;
}

.top > div {
	width: 944px;
	margin: 0 auto;
}

.top aside {
	float: left;
	width: 246px;
	padding: 21px 0 0 0;
}

.top aside h3 {
	margin: 0 0 2px 0;
	font-size: 16px;
	font-weight: 400;
	color: #414042;
}

.top aside ul li {
	font-size: 14px;
	line-height: 21px;
	color: #38b3c4;
	font-weight: bold;
}

.top aside a {
	display: block;
	font-weight: normal;
	color: #38b3c4;
}

.top aside a:hover {
	color: #38b3c4;
	text-decoration: underline;
}
.top article {
	float: left;
	width: 698px;
}

.top article h1 {
	margin: 0 0 59px 0;
	padding: 0 0 2px 0;
	border-bottom: solid 2px #414042;
	font-size: 26px;
	color: #414042;
	text-transform: uppercase;
}

.top article blockquote {
	position: relative;
	background: url(../../images/shared/bg-quote.png) no-repeat 486px 29px;
}

.top article blockquote img {
	float: left;
	margin: 4px 40px 0 0;
}

.top article blockquote q {
	font-size: 40px;
	line-height: 50px;
	color: #333;
}

.top article blockquote cite {
	position: absolute;
	bottom: -7px;
	right: 3px;
	font-size: 14px;
	line-height: 18px;
	color: #666;
	text-align: right;
}

.top article #practicesintro {
	margin: 16px 0 0 0;
}

.top article #practicesintro h1 {
	margin: 0 0 70px 0;
	padding: 0;
	border-bottom: solid 2px #414042;
	font-size: 26px;
	color: #414042;
	text-transform: uppercase;
}

.top article #practicesintro blockquote {
	position: relative;
	background: none;
}

.top article #practicesintro blockquote q {
	font-size: 39px;
	line-height: 47px;
	color: #333;
}

.top article #practicesintrotext {
	margin: 20px 0 0 0;
}

.top article #practicesintrotext p {
	font-size: 20px;
	line-height: 28px;
	margin: 0 0 16px 0;
}

.mid {
	width: 944px;
	margin: 0 auto;
	padding: 50px 0 50px 0;
}

.mid img {
	display: block;
	float: left;
	margin: 0 39px 0 0;
}

.mid article {
	margin: 0 0 18px 0;
	padding: 20px 0 15px 0;
	overflow: hidden;
	border-top: solid 2px #000;
	border-bottom: solid 2px #000;
}

.mid article p {
	padding: 0 15px 24px 0;
	line-height: 24px;
}

.mid nav {
	overflow: hidden;
}

.mid nav a {
	display: block;
	float: left;
	width: 54%;
	font-weight: 600;
	line-height: 24px;
	color: #000;
	cursor: default;
}

.mid nav a:hover {
	text-decoration: none;
}

.mid nav a:nth-child(2n) {
	width: 46%;
}

.lower {
	padding: 54px 0 65px 0;
	background: #333;
}

.lower > div {
	width: 944px;
	margin: 0 auto;
}

.lower h2 {
	margin: 0 0 20px 0;
	padding: 0 0 2px 0;
	font-size: 20px;
	color: #ffffff;
	text-transform: uppercase;
}

.lower figure {
	display: block;
	float: left;
	width: 288px;
	margin: 0 40px 0 0;
	font-size: 14px;
	line-height: 21px;
	color: #ffffff;
}

.lower figure:last-child {
	margin: 0;
}

.lower a {
	font-size: 14px;
	line-height: 21px;
	color: #ffffff;
}

.lower figure > a {
	display: block;
	margin: 0 0 20px 0;
}

.lower figure > a img {
	display: block;
}

.lower figcaption {
	padding: 0 0 0 1px;
}

.lower figcaption a {
	color: #ffffff !important;
}

.lower h4 {
	font-weight: 600;
}


/* 3.4 Contact
------------------------------------------------------------------------------*/

#contactcol1 {
	float: left;
	width: 200px;
	font-size: 12px;
	line-height: 17px;
}

#contactcol1 p {
	margin-bottom: 7px;
}

#contactcol1 a.blklink:link { color: #333333 !important; text-decoration: none }
#contactcol1 a.blklink:visited { color: #333333 !important; text-decoration: none }
#contactcol1 a.blklink:active { color: #333333 !important; text-decoration: none }
#contactcol1 a.blklink:hover { color: #333333 !important; text-decoration: underline }

#contactcol2 {
	float: left;
	width: 468px;
	margin-left: 10px;
	font-size: 17px;
	line-height: 24px;
}

#contactcol2 p {
	margin-bottom: 22px;
}

#contactcol2 form p {
	margin: 15px 0 2px 0;
	padding: 0;
}
#contactcol2 em {
	color: #cc0000;
}

#contactcol3 {
	float: left;
	width: 206px;
	margin-left: 30px;
}

.contactbox {
	width: 206px;
	margin-bottom: 25px;
	color: #333333;
	background-color: #e8e8e8;
	font-size: 17px;
	line-height: 23px;
}

.contactboxpad {
	padding: 20px 22px 22px 22px;
}

.contactbox a:link { color: #333333 !important; text-decoration: none }
.contactbox a:visited { color: #333333 !important; text-decoration: none }
.contactbox a:active { color: #333333 !important; text-decoration: none }
.contactbox a:hover { color: #333333 !important; text-decoration: underline }

#contactcol2 input[type="text"] {
	height: 40px;
	border: 1px solid #c2c2c2;
	font-size: 17px;
	line-height: 17px;
	text-indent: 5px;
}

#contactcol2 textarea {
	width: 460px;
	border: 1px solid #c2c2c2;
	font-size: 17px;
	line-height: 24px;
	padding-left: 8px;
}

#contactcol2 .file_input_textbox {
	float: left;
	width: 380px;
	height: 40px;
	border: 1px solid #c2c2c2;
}

#contactcol2 .file_input_div {
	position: relative; 
	width: 82px; 
	height: 44px;
	overflow: hidden;
}

#contactcol2 .file_input_button {
	width: 82px;
	height: 44px;
	position: absolute; 
	top: 0px;
	color: #ffffff;
	background-color: #000000;
	border: 1px solid #000000;
}

#contactcol2 .file_input_hidden {
	font-size: 44px;
	line-height: 44px;
	height: 44px;
	position: absolute; 
	right: 0px; 
	top: 0px; 
	opacity: 0; 
	filter: alpha(opacity=0); 
	-ms-filter: "alpha(opacity=0)"; 
	-khtml-opacity: 0; 
	-moz-opacity: 0;
}

#response, #loading { display: none }


/* 4. RESPONSIVE
--------------------------------------------------------------------------------
==============================================================================*/


@media screen and (max-device-width: 480px) {

}



/* 5. PRINT
--------------------------------------------------------------------------------
==============================================================================*/


@media print {

	body {
		font: normal normal 12pt/1.5em "Times New Roman", Times, serif;
	}

	a[href]:after {
		content: " (" attr(href) ") ";
		font-size: 90%;
	}

	a[href^="/"]:after {
		content: " (http://domain.com" attr(href) ") ";
	}

	#accessibility-nav,
	.hide {
		display: none !important;
	}
}


/* 6 Middle
------------------------------------------------------------------------------*/

#middle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
	font-size: 11px;
	line-height: 16px;
	margin-top: 11px;
}

#middle a:link,
#middle a:visited {
	color: #3399cc !important;
	text-decoration: none;
}

#middle a:hover,
#middle a:active {
	color: #3399cc !important;
	text-decoration: underline;
}

#middle td {
	text-align: left !important;
}

#middle b {
	font-weight: bold !important;
}

#middle td object,
#middle td embed {
	vertical-align: bottom;
}

#middle a.blklink:link { color: #333333 !important; text-decoration: none }
#middle a.blklink:visited { color: #333333 !important; text-decoration: none }
#middle a.blklink:active { color: #333333 !important; text-decoration: none }
#middle a.blklink:hover { color: #333333 !important; text-decoration: underline }

#middle a.whtlink:link { color: #ffffff !important; text-decoration: none }
#middle a.whtlink:visited { color: #ffffff !important; text-decoration: none }
#middle a.whtlink:active { color: #ffffff !important; text-decoration: none }
#middle a.whtlink:hover { color: #ffffff !important; text-decoration: underline }

#middle p { margin-top: 0px; margin-bottom: 12px }

#middle ul { margin-top: 5px; margin-bottom: 12px; margin-left: 18px; padding-left: 0; list-style-type: disc }
#middle ol { margin-top: 5px; margin-bottom: 12px; margin-left: 18px; padding-left: 0 }
#middle li { margin-bottom: 6px }

#middle #joblistings ul { margin-top: 3px; margin-bottom: 10px; margin-left: 5px; padding-left: 0; list-style-type:none; }
#middle #joblistings li { margin-bottom: 1px }

#middle #maintab {
	background-color: white;
	width: 100%;
}

#middle .titlebar { color: #333333; background-color: #add036; padding: 5px 20px }
#middle .titlebar2 { color: #333333; background-color: #f3b01b; padding: 5px 20px }
#middle .titlebar3 { color: #333333; background-color: #5cc3b7; padding: 5px 20px }
#middle .titlebar4 { color: #333333; background-color: #6dc28a; padding: 5px 20px }
#middle .titlebar5 { color: #333333; background-color: #659e85; padding: 5px 20px }
#middle .titlebar6 { color: #333333; background-color: #f1e503; padding: 5px 20px }
#middle .titlebar7 { color: #333333; background-color: #7a6f86; padding: 5px 20px }
#middle .titlebar8 { color: #333333; background-color: #f1653f; padding: 5px 20px }
#middle .titlebar9 { color: #333333; background-color: #4b98b3; padding: 5px 20px }

#middle #blogbox1 { padding: 12px 12px 6px }
#middle #blogbox1 p { margin-top: 0px; margin-bottom: 5px }
#middle #blogbox2 { padding: 12px 12px 6px }
#middle #blogbox2 p { margin-top: 0px; margin-bottom: 5px }
#middle #blogbox3 { padding: 12px 12px 6px }
#middle #blogbox3 p { margin-top: 0px; margin-bottom: 5px }
#middle #blogbox4 { padding: 12px 12px 6px }
#middle #blogbox4 p { margin-top: 0px; margin-bottom: 5px }

#middle #blogboxbot { padding: 0 12px 0 }

#middle .blogbotlink { font-size: 10px; line-height: 11px; }
#middle a.blogbotlink:link { color: #333333; text-decoration: none }
#middle a.blogbotlink:visited { color: #333333; text-decoration: none }
#middle a.blogbotlink:active { color: #333333; text-decoration: none }
#middle a.blogbotlink:hover { color: #333333; text-decoration: underline }

#middle .blogtitle1 { color: #333333; font-size: 10px; line-height: 12px; background-color: #f3b01b; padding: 9px 12px 5px }
#middle .blogtitle2 { color: #333333; font-size: 10px; line-height: 12px; background-color: #5cc3b7; padding: 9px 12px 5px }
#middle .blogtitle3 { color: #333333; font-size: 10px; line-height: 12px; background-color: #7a6f86; padding: 9px 12px 5px }
#middle .blogtitle4 { color: #333333; font-size: 10px; line-height: 12px; background-color: #acd036; padding: 9px 12px 5px }
#middle .blogtitle5 { color: #333333; font-size: 13px; font-weight: bold; line-height: 17px; padding-top: 0px; padding-right: 20px; padding-left: 20px }
#middle .blogdate { font-size: 10px; line-height: 11px; }
#middle .blogtext { font-size: 10px; line-height: 11px; }
#middle .bloglinks { font-size: 10px; line-height: 11px; }

#middle h2 { font-size: 13px; }
#middle h3 { font-size: 11px; margin: 0; padding: 0 0 3px }

#middle sup { font-size: 9px; }
#middle sub { font-size: 9px;vertical-align: text-bottom; }

#middle #leadership  { font-size: 11px; line-height: 13px; }
#middle #leadership i  { font-size: 9px; line-height: 11px; }
#middle #leadership p { margin-top: 0px; margin-bottom: 5px }

#middle #copyright { color: #afb0b4; font-size: 11px; font-family: Arial, Helvetica, sans-serif; }

#middle #sitemap { color: #06627b; font-size: 11px; font-family: Arial, Helvetica, sans-serif; }
#middle #sitemap a:link,
#middle #sitemap a:visited,
#middle #sitemap a:active { color: #06627b; text-decoration: none }
#middle #sitemap a:hover { color: #06627b; text-decoration: underline }

#middle #navlinks a:link,
#middle #navlinks a:visited,
#middle #navlinks a:active { color: #3399cc; text-decoration: none }
#middle #navlinks a:hover { color: #3399cc; text-decoration: underline }

#middle #hometitle1 {
	color: #797c7b;
	font-size: 19px;
	line-height: 28px;
	font-family: Arial, Helvetica, sans-serif;
	margin-left: 30px;
	margin-bottom: 20px;
}

#middle #hometitle2 {
	color: #ffffff;
	font-size: 18px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-left: 30px;
	margin-bottom: 10px;
}

#middle blockquote { margin-right: 0; margin-left: 10px; padding-right: 0; padding-left: 0 }

#middle object:active,
#middle div:active {
	outline: none;
}
#middle object:focus,
#middle div:focus
{
-moz-outline-style: none;
}

#middle #tipguide01,
#middle #tipguide02,
#middle #tipguide03,
#middle #tipguide04 {
	cursor: default;
}

#middle #main {
	position:relative;
	width:100%;
	z-index:3000;
}

#middle #main2 {
	position:relative;
	width:100%;
	z-index:3000;
}

#middle #nav {
	position:relative;
	width:100%;
	z-index:2000;
	margin-top: -108px;
}

#middle #nav2 {
	position:relative;
	width:100%;
	z-index:5000;
	margin-top: -108px;
}

#middle #maintab { height: 87%; padding-top: 40px; }
#middle html>body #maintab { height: 75%; padding-top: 0px; }

#middle #maintab2 {
	width: 996;
}

#middle #centertab {
	height: 574;
}

#middle #maintd1 {
	width: 97;
}

#middle #maintd2 {
	width: 200;
}

#middle #maintd3 {
	width: 600;
	height: 574;
}

#middle #maintd3b {
	width: 600;
	height: 574;
}

#middle #maintd3c {
	width: 600;
	height: 434;
}

#middle #maintd4 {
	width: 99;
}

#middle #contactleft {
	width: 190;
}

#middle #contactright {
	width: 140;
}

#middle #persp1 {
	width: 600;
	height: 287;
}

#middle #persp2 {
	width: 600;
	height: 287;
}

#middle #blogphoto {
	padding: 28px 0 0;
}

#middle #blogphoto2 {
	padding: 28px 0 0;
}

#middle .blogbox1b {
	width: 197;
}

#middle .blogbox2b {
	width: 197;
}

#middle #fieldtext1 {
	width: 182;
	font-size: 11px;
	line-height: 13px;
}

#middle #fieldtext2 {
	width: 182;
	font-size: 11px;
	line-height: 13px;
}

#middle #fieldtd1 {
	width: 20;
}

#middle #fieldtd2 {
	width: 338;
}

#middle #fieldtd3 {
	width: 58;
}


#middle #fieldpdf {
	width: 338;
}

#middle .quote1   { color: #000000; font-size: 20px; line-height: 26px }

#middle #smlinks,
#middle #smlinks_cat { color: #3399cc; font-size: 10px; line-height: 13px; }

#middle #smlinks_cat li:after {
	content: "\2022 \0020";
	}
		
#middle #smlinks_cat li.last:after {
	content: "\0020";
	}
	
#middle #smlinks ul { margin-top: 0px; margin-bottom: 0px; margin-left: 0px; padding-left: 0 }

#middle #smlinks li { list-style: none; margin-bottom: 1px; }

#middle #smlinks_cat li { display: inline; }

#middle #titletab {
	width: 540;
}

#middle #titlespacer {
	height: 48;
}
#middle .thumb {
	width: 125;
	height: 125;
}

#middle .thumbtd {
	height: 125;
}

#middle .thumbtable {
	width: 545;
}

#middle .imgfull {
	width: 580;
}

#middle .leadthumb {
	height: 48;
}

#middle #footspacer {
	height: 72px;
}

/* home */

#middle .hometable {
	width: 800px;
}

#middle .hometoptd {
	height: 148px;
}

#middle .hometop {
	width: 800px;
	height: 148px;
}

#middle .hometitletable {
	width: 800px;
}

#middle .hometopspace {
	height: 47px;
}

#middle .homephototd {
	width: 242px;
	height: 189px;
}

#middle .homecaptiontable {
	width: 242px;
}

#middle .homespacetd {
	width: 37px;
}

#middle .homespace {
	width: 37px;
	height: 1px;
}

#middle .homephoto {
	width: 240px;
	height: 145px;
}

/* fieldguide */

#middle #tipstitle {
	width: 550;
}

#middle #guide01 p { margin-top: 7px; margin-bottom: 7px }
#middle #guide01 a:link,
#middle #guide01 a:visited,
#middle #guide01 a:active { color: #6d6f6f; text-decoration: none }
#middle #guide01 a:hover { color: #6d6f6f; text-decoration: underline }
#middle #guide01 {
	padding-right: 61px;
	padding-bottom: 8px;
	padding-left: 35px;
	color: #6d6f6f;
	font-weight: bold;
	font-size: 12px;
	line-height: 15px;
	}

#middle #guide02 p { margin-top: 7px; margin-bottom: 7px }
#middle #guide02 a:link,
#middle #guide02 a:visited,
#middle #guide02 a:active { color: #6d6f6f; text-decoration: none }
#middle #guide02 a:hover { color: #6d6f6f; text-decoration: underline }
#middle #guide02 {
	padding-right: 60px;
	padding-bottom: 38px;
	padding-left: 9px;
	color: #6d6f6f;
	font-weight: bold;
	font-size: 12px;
	line-height: 15px;
	}

#middle #guide03 p { margin-top: 8px; margin-bottom: 8px }
#middle #guide03 a:link,
#middle #guide03 a:visited,
#middle #guide03 a:active { color: #6d6f6f; text-decoration: none }
#middle #guide03 a:hover { color: #6d6f6f; text-decoration: underline }
#middle #guide03 {
	padding-right: 18px;
	padding-top: 36px;
	padding-left: 40px;
	color: #6d6f6f;
	font-weight: bold;
	font-size: 12px;
	line-height: 15px;
	}

#middle #guide04 p { margin-top: 7px; margin-bottom: 7px }
#middle #guide04 a:link,
#middle #guide04 a:visited,
#middle #guide04 a:active { color: #6d6f6f; text-decoration: none }
#middle #guide04 a:hover { color: #6d6f6f; text-decoration: underline }
#middle #guide04 {
	padding-right: 50px;
	padding-top: 1px;
	padding-left: 50px;
	color: #6d6f6f;
	font-weight: bold;
	font-size: 12px;
	line-height: 15px;
	}

#middle #guide01td {
	width: 277px;
	height: 283px;
	background-image: url(http://www.lunar.com/images/guide_circle01.png);
}

#middle #guide02td {
	width: 273px;
	height: 283px;
	background-image: url(http://www.lunar.com/images/guide_circle02.png);
}

#middle #guide03td {
	width: 277px;
	height: 280px;
	background-image: url(http://www.lunar.com/images/guide_circle03.png);
}

#middle #guide04td {
	width: 273px;
	height: 280px;
	background-image: url(http://www.lunar.com/images/guide_circle04.png);
}

#middle #tipthumb {
	width: 131px;
	height: 153px;
}

#middle #tipthumb2 {
	width: 120px;
	height: 120px;
}

#middle #tipthumb2b {
	width: 135px;
	height: 120px;
}

#middle #tipthumbspace {
	width: 5px;
	height: 1px;
}

#middle .tipthumbspace2 {
	width: 15px;
}

#middle .tipthumbspace2b {
	height: 15px;
}

#middle .tipcolumn1 {
	height: 62px;
}

#middle .tipcolumn2 {
	height: 33px;
}

#middle .tipcolumn3 {
	height: 148px;
}

#tipbox {
	margin: 25px 20px 25px 20px;
}

h1.page_title {
	font-family: "Gill Sans", arial;
	font-size: 13.5pt;
	font-weight: normal;
	line-height: 20pt;
}

.col1 {
	display: -moz-inline-stack;
	display: inline-block;
	vertical-align: top;
	zoom: 1;
	*display: inline;
	width: 30%;
	margin-right: 25px;
	padding-bottom: 20px;
	}
	
.col1_old {
	float: left;
	width: 30%;
	margin-right: 25px;
	}

.col2 {
	display: -moz-inline-stack;
	display: inline-block;
	vertical-align: top;
	zoom: 1;
	*display: inline;
	width: 30%;
	margin-right: 25px;
	padding-bottom: 20px;
	}
	
.col2_old {
	float: left;
	width: 30%;
	margin-right: 25px;
	}

.col3 {
	display: -moz-inline-stack;
	display: inline-block;
	vertical-align: top;
	zoom: 1;
	*display: inline;
	padding-bottom: 20px;
	}

.col3_old {
	float: left;
	width: 30%;
	}
	
.bottom_nav_main a:link, a:visited, a:hover {
	color: #000000;
	text-decoration: underline;
	}
	
/* scrollars */

.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;
}

.vscrollerbase {
width: 10px;
background-color: #000000;
}
.vscrollerbar {
width: 10px;
background-color: #ffffff;
}
.hscrollerbase {
height: 10px;
background-color: #000000;
}
.hscrollerbar {
height: 10px;
background-color: #ffffff;
}

.scrollerjogbox {
width: 10px;
height: 10px;
top: auto; left: auto;
bottom: 0px; right: 0px;
background-color: gray;
}

#scroll08 {
	width: 358px;
	height: 220px;
	overflow: auto;
	position: relative;
	margin: 0 auto;
	padding: 0;
}

#middle .contentpad { margin: 25px 20px 25px 20px; }

p.descriptionspacer {
	height: 6px !important;
}

p.plaintext {
	font-family: Verdana !important;
	font-size:12px !important;
}

/* reading list */

#readline {
	margin: 14px 0 20px 0;
}

#readtopleft {
	float: left;
	width: 246px;
}

#readtopleft p {
	font-size: 32px;
	font-style: italic;
	color: #38b3c4;
}

#readtopright {
	float: left;
	width: 600px;
	margin-left: 40px;
}

#readtopright h2 {
	font-size: 48px;
	line-height: 58px;
	margin-bottom: 24px;
}

#readtopright p {
	font-size: 18px;
	line-height: 28px;
}

.readleft {
	clear: both;
	float: left;
	width: 248px;
	margin: 20px 0 80px 0;
}

.readleft img {
	border: 1px solid #666666;
}

.readright {
	float: left;
	width: 600px;
	margin: 20px 0 80px 38px;
}

.readright h3 {
	font-size: 21px;
	font-weight: 600;
	margin: 12px 0 6px 0;
}

.readright h4 {
	font-size: 18px;
	margin-bottom: 20px;
}

.readright p {
	line-height: 24px;
	margin-bottom: 20px;
}

.readright a, .readright a:visited, .readright a:active, a:focus {
	text-decoration: none;
	color: #38b3c4;
	outline: 0;
	-webkit-transition: none;
	transition: none;
}

.readright a:hover {
	text-decoration: underline;
}


/* bluebox */

#bluebox-wrap {
	width: 784px;
	margin: 0 auto;
}

#bluebox {
	background-color: #00b0f0;
	color: #ffffff;
	padding: 50px 65px;
}

p.bluebox-textlarge {
	font-size: 40px;
	line-height: 50px;
	margin-bottom: 35px;
}

p.bluebox-textsmall {
	font-size: 16px;
	line-height: 24px;
	margin-bottom: 20px;
}