/* @override http://dev.lrl/assets/css/littlered.css */

@charset "UTF-8";

/* @group Master 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,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:''}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

/* @end */

body {
	background: #c9c6c1 url(../images/bg-footer-tile.png) repeat;
	font: 0.85em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	color: #424242;
}

::-moz-selection{
	background:#cc0000;
	color:#fff;
	text-shadow: #330000 1px 1px 0;
}

::selection {
	background:#990000;
	color:#fff;
	text-shadow: #330000 1px 1px 0;
}

p {
	margin-bottom: 0.6em;
}

/* Wrapper
----------------------------------------------- */

#wrapper {
	min-width: 960px;
}

/* Accessibility
----------------------------------------------- */

.accessibility {
	display: none;
}

#access {
	position: absolute;
	top: -1000em;
}

/* @group Header */

#header {
	color: #000;
	width: 100%;
	background: #990000 url(../images/bg-header.png) repeat-x;
	height: 139px;
	border-bottom: 1px solid #220000;
	border-top: 1px solid #d69b9b;
	margin-top: -1px;
	z-index: 100;
	position: relative;
}

#head-container {
	width: 940px;
	margin: 0px auto;
	position: relative;
}

#head-container #logo {
	float: left;
	margin: 19px 0 20px;
}

#head-container #logo h1 {
	width: 390px;
	height: 100px;
	background: url(../images/h1-lrl-logo.png) no-repeat 0 0;
	text-indent: -9999px;
	overflow: hidden;
}

#head-container #logo h2 {
	display: none;
}

/* @end */

/* @group Navigation */

#navigation {
	float: right;
}

#navigation ul li {
	display: inline-block;
	text-align: center;
	height: 139px;
	width: 80px;
	float: left;
	text-shadow: #4f0000 -1px -1px 0;
	text-transform: lowercase;
	font: italic bold 1em/139px Georgia, "Times New Roman", Times, serif;
}



#navigation ul li a:link, #navigation ul li a:visited {
	display: inline-block;
	width: 80px;
	color: #eee;
	text-decoration: none;
	background-image: none;
}

#navigation ul li a:hover {
	background: url(../images/btn-sprite.png) no-repeat -533px 0;
	color: #fff;
}

#navigation ul li a:active {
	color: #c5c2bd;
	background-position: -613px 0;
}

#navigation ul li.on {
	background: url(../images/btn-sprite.png) no-repeat -693px 0;
	color: #520002;
	text-shadow: #4f0000 1px 1px 0;
}

/* @end */

a:link, a:visited {
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: #6e6e6e;
}

a:active {
	color: #424242;
}

#main {
	width: 100%;
	position: relative;
	background: #c9c6c1 url(../images/bg-main-tile.png) repeat;
	border-top: 1px solid #f6f4f2;
	margin: 0 auto;
	line-height: 1.4em;
	display: inline-block;
}

#main-grad {
	background: url(../images/bg-main-grad.png) repeat-x 0 0;
	position: relative;
}

#main #main-container {
	display: block;
	margin: 0 auto;
	width: 960px;
	padding-bottom: 40px;
	padding-top: 20px;
	text-shadow: #d5d5d5 1px 1px 0;
}

h2#strapline {
	display: inline-block;
	margin: auto auto 20px;
	height: 40px;
	width: 100%;
	text-align: center;
	text-shadow: #f5f5f5 1px 1px 0;
	color: #424242;
	font: italic bold 2.4em/40px Georgia, "Times New Roman", Times, serif;
}

span.amp {
	font: italic normal 1.5em/1.5px Baskerville, "Palatino Linotype", Georgia;
	vertical-align: -0.15em;
}



/* @group slider */

div#portfolio-slider {
	width: 940px;
	height: 430px;
	margin: 0 auto;
	background: transparent url(../images/dropshadow-slider.png) no-repeat center 380px;
	text-align: center;
	padding: 0 10px 20px;
	position: relative;
}

span.left-border {
	width: 5px;
	height: 410px;
	background: url(../images/slider-left-border.png) no-repeat 0 0;
	z-index: 1;
	position: absolute;
	left: 10px;
}

span.right-border {
	width: 5px;
	height: 410px;
	background: url(../images/slider-right-border.png) no-repeat 0 0;
	z-index: 1;
	position: absolute;
	left: 945px;
}


div#portfolio-slider ul#slider-image {
	height: 410px;
	width: 940px;
	overflow: hidden;
	z-index: 0;
	position: relative;
}

div#portfolio-slider #slider-image li a {
	width: 940px;
	height: 410px;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
}



ul.slider-nav {
	display: inline-block;
	margin: 5px auto;
	text-align: center;
}

ul.slider-nav li  {
	float: left;
}

ul.slider-nav li a {
	width: 10px;
	height: 10px;
	background: url(../images/btn-sprite.png) no-repeat -513px -60px;
	margin: 0 2px;
	display: block;
}

ul.slider-nav li a:hover {
	background-position: -513px -70px;
}

ul.slider-nav li.activeSlide a {
	background: url(../images/btn-sprite.png) no-repeat -513px -80px;
}

/* @end */

/* @group serviceheadings */

/* @end */

/* @group services-block */

#services-block {
	margin: -10px 0 0;
	width: 930px;
	vertical-align: top;
	display: inline-block;
	padding: 0 15px;
}

#services-block .service {
	width: 290px;
	display: inline-block;
	text-align: justify;
	margin: 0 10px;
	vertical-align: top;
	float: left;
}

#services-block .service h3 {
	border-bottom: 1px solid #424242;
}

#services-block p {
	border-top: 1px solid #eae9e7;
	height: 150px;
}

/* @end */

div.moreinfo {
	float: right;
}

div.moreinfo a:link, div.moreinfo a:visited {
	width: 102px;
	height: 32px;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	background: url(../images/btn-sprite.png) no-repeat -274px 0;
}

div.moreinfo a:hover {
	background-position: -274px -32px;
}

div.moreinfo a:active {
	background-position: -274px -64px;
}

/* @group Services */

div#services {
	padding: 10px 0 0;
	position: relative;
}

div#services div.service h3 a:link, div#services div.service h3 a:visited {
	width: 940px;
	height: 50px;
	display: inline-block;
	line-height: 50px;
	margin: 0 10px;
}

div#services div.service h3 {
		background: url(../images/btn-sprite.png) no-repeat 0 -139px;
	height: 50px;
	width: 960px;
	overflow: hidden;
}

div#services div.service.on h3 a:link, div#services div.service.on h3 a:visited {
	background: url(../images/border-bottom.png) repeat-x 0 100%;
	text-shadow: #e5e5e5 1px 1px 0;
	cursor: default;
}

div#services div.service h3:hover {
	background-position: 0 -189px;
}

div#services div.service h3:active {
	background-position: 0 -239px;
}

div#services div.service.on h3 {
	background: none 0 -139px;
}

#services-block h3 a, div.service h3 a {
	height: 40px;
	overflow: hidden;
	display: inline-block;
	text-transform: lowercase;
	font: italic bold 2.1em/40px Georgia, "Times New Roman", Times, serif;
	color: #424242;
	text-shadow: #d5d5d5 1px 1px 0;
	position: relative;
	z-index: 1;	
}

div#services div.service h4 {
	height: 50px;
	position: relative;
	overflow: hidden;
	text-align: right;
	text-transform: lowercase;
	font: italic bold 1.5em/60px Georgia, "Times New Roman", Times, serif;
	top: -55px;
	text-shadow: #d5d5d5 1px 1px 0;
	z-index: 0;
	display: inline-block;
	float: right;
	margin-bottom: -50px;
	margin-top: 5px;
	margin-right: 10px;
}

div.desc {
	text-align: justify;
	z-index: 0;
	display: inline-block;
	float: left;
	width: 620px;
	margin: 0 10px 10px;
	background: transparent url(../images/bg-main-tile.png) repeat; /*- Need this in firefox otherwise fades go blurry. Web Design gets corners at the top though because of the body gradient*/
}

div.service {
	display: inline-block;
	position: relative;
	margin-bottom: 5px;
}

div.desc em {
	font: italic bold 1.2em Georgia, "Times New Roman", Times, serif;
}

div.service-content {
	position: relative;
	margin-top: 10px;
}



/* @end */

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

#footer {
	color: #666;
	width: 100%;
	background: url(../images/bg-footer-grad.png) repeat-x;
}

#footer #footer-container {
	width: 860px;
	margin: 0 auto;
	padding: 20px 0;
}

#footer #footer-container h4 {
	display: none;
}

#contact {
	display: inline-block;
	float: right;
	height: 42px;
	line-height: 42px;
}

ul#contact li {
	display: inline-block;
	padding: 0 0 0 25px;
	margin-left: 20px;
}

li#call-us{
	display: inline-block;
	background: url(../images/footer-call.png) no-repeat 0 0;
	height: 20px;
	line-height: 20px;
}

li#email-us{
	display: inline-block;
	background: url(../images/footer-email.png) no-repeat 0 0;
	height: 20px;
	line-height: 20px;
}

li#twitter{
	display: inline-block;
	background: url(../images/footer-twitter.png) no-repeat 0 0;
	height: 20px;
	line-height: 20px;
}

ul#contact li a:link, ul#contact li a:visited {
	color: #444;
	text-decoration: none;
	font: italic bold 1em Georgia, "Times New Roman", Times, serif;
	text-shadow: #888 1px 1px 0;
}

ul#contact li a:hover {
	color: #c5c2bd;
	text-shadow: #555 -1px -1px 0;	
	/*border-bottom-style: dotted;
	border-bottom-width: 1px;*/
}

ul#contact li p {
	color: #c5c2bd;
	font-style: italic;
	font-size: 0.85em;
	line-height: 1em;
	text-shadow: #555 -1px -1px 0;
}

#copyright {
	background: url(../images/footer-lrl-logo.png) no-repeat 0 0;
	width: 209px;
	color: #3c3b3a;
	font-size: 0.7em;
	padding-top: 32px;
	text-align: center;
	height: 10px;
}

/* @group portfolio */

ul#portfolio-thumbs {
	display: inline-block;
	margin: auto;
}

ul#portfolio-thumbs li, div.services-img {
	background: url(../images/dropshadow-portfolio.png) no-repeat -1px -2px;
	width: 300px;
	height: 265px;
	padding: 8px;
	display: inline-block;
	float: left;
	position: relative;
}

div.services-img {
	margin-top: -0.5em;
	display: inline-block;
	float: left;
}

div.services-img img {
	width: 280px;
	height: 230px;
	padding: 10px;
	background-color: #e7e4de;
	border: 1px solid #c5c2bd;
}

ul#portfolio-thumbs li a.folio-detail:link, ul#portfolio-thumbs li a.folio-detail:visited {
	display: inline-block;
	float: left;
	width: 280px;
	height: 230px;
	padding: 10px;
	background-color: #e7e4de;
	border: 1px solid #c5c2bd;
	position: relative;
}

ul#portfolio-thumbs li .folio-over {
	position: absolute;
	top: 9px;
	left: 9px;
	width: 260px;
	height: 210px;
	background: transparent url(../images/semi-trans.png);
	padding: 20px;
}

.folio-over a {
	display: block;
	width: 300px;
	height: 260px;
	position: absolute;
	top: 0;
	left: 0;
}

ul#portfolio-thumbs .folio-over h4 {
	font-size: 1.5em;
	text-shadow: none;
	margin: 0 0 5px;
	color: #333;
}

ul#portfolio-thumbs .folio-over em {
	position: absolute;
	right: 20px;
	bottom: 20px;
	font: bold italic 1.2em Georgia, "Times New Roman", Times, serif;
	text-shadow: none;
	text-transform: lowercase;
	color: #888;
}

ul#portfolio-thumbs .folio-over li {
	background: none;
	width: inherit;
	height: inherit;
	padding: 0;
	display: block;
	clear: left;
	text-shadow: none;
	color: #888;
	line-height: 1.3em;
	text-transform: lowercase;
}

/* @end */

/* @group project */

#content-top {
	margin-bottom: 10px;
}

.project-wrapper {
	clear: both;
	background-color: transparent !important;
}

.project-left {
	width: 640px;
	display: inline-block;
	float: left;
	padding: 0;
}

.project-right {
	width: 310px;
	display: inline-block;
	margin-top: 10px;
}

.project-desc-top {
	background: url(../images/bg-project-description-top.png) no-repeat 0 0;
	height: 5px;
}

.project-desc {
	background: transparent none repeat-y 0 0;
	padding: 0 10px;
	text-shadow: #ccc 1px 1px 0;

}

.project-desc-btm {
	background: url(../images/bg-project-description-btm.png) no-repeat 0 0;
	height: 5px;
}

h3.project-title {
	font-size: 1.4em;
	height: 32px;
	line-height: 32px;
}

div#overview {
	width: 100%;
	text-align: justify;
	text-shadow: #f5f5f5 1px 1px 0;
	color: #626262;
	font: italic bold 1.6em/1.6em Georgia, "Times New Roman", Times, serif;
	margin: 20px auto 30px;
}

div#overview p:first-letter {
	font-size: 2em;
	letter-spacing: -0.16em;
	vertical-align: -0.1em;
}

div#overview p span.highlight {
	color: #424242;
	font-size: 1.3em;
}

span.page-strap {
	display: inline-block;
	margin: auto;
	height: 32px;
	width: 100%;
	text-align: center;
	text-shadow: #f5f5f5 1px 1px 0;
	color: #424242;
	font: italic bold 1.3em/32px Georgia, "Times New Roman", Times, serif;
}

span.portfolio-strap {
	width: 591px;
}

a#grid-project:link, a#grid-project:visited {
	background: url(../images/btn-sprite.png) no-repeat -773px 0;
	width: 52px;
	height: 32px;
	display: inline-block;
	text-indent: -9999px;
	overflow: hidden;
	float: left;
	margin-left: 10px;
}

a#last-project:link, a#last-project:visited {
	background: url(../images/btn-sprite.png) no-repeat 0 0;
	width: 137px;
	height: 32px;
	display: inline-block;
	text-indent: -9999px;
	overflow: hidden;
	float: left;
	margin-left: 10px;
}

a#next-project:link, a#next-project:visited {
	background: url(../images/btn-sprite.png) no-repeat -137px 0;
	width: 137px;
	height: 32px;
	display: inline-block;
	text-indent: -9999px;
	overflow: hidden;
	float: right;
	margin-right: 10px;
}

a#grid-project:hover {
	background-position: -773px -32px;
}

a#last-project:hover {
	background-position: 0 -32px;
}

a#next-project:hover {
	background-position: -137px -32px;
}

a#grid-project:active {
	background-position: -773px -64px;
}

a#last-project:active {
	background-position: 0 -64px;
}

a#next-project:active {
	background-position: -137px -64px;
}

.project-desc div {
	margin-bottom: 6px;
	display: inline-block;
}

.project-desc em {
	color: #636363;
	font-size: 0.9em;
	font-weight: bold;
	font-style: normal;
	display: block;
	margin-bottom: -0.3em;
}

.project-desc blockquote cite {
	font-weight: bold;
	font-style: italic;
	display: block;
	text-align: right;
}

/* @end */

/* @group project-slider */

.project-slider {
	position: relative;
	background: transparent url(../images/dropshadow-project.png) no-repeat 0 1px;
	padding: 10px;
	width: 620px;
	text-align: center;
	height: 595px;
}

.project-slider ul.project-slider-image {
	width: 620px;
	height: 570px;
	background: #e7e4de url(../images/loading.gif) no-repeat 50% 50%;
	border: 1px solid #c5c2bd;
	display: inline-block;
}

.project-slider ul.project-slider-image li {
	margin: 10px;
}

.project-slider ul.project-slider-image li img {
	
}

.slider-border {
	width: 600px;
	height: 550px;
	border: 10px solid #e7e4de;
	position: absolute;
	top: 11px;
	left: 11px;
	z-index: 100;
}

.project-slider ul.project-slider-image li a:link, .project-slider ul.project-slider-image li a:visited {
	display: inline-block;
	float: left;

}

/* @end */

/* @group Contact-Form */

#contact-form {
	background: transparent url(../images/bg-main-tile.png) repeat;
	border-bottom: 2px solid #220000;
	overflow: hidden;
	margin: 0px auto;
	padding-bottom: 10px;
	height: 350px;
	z-index: 1;
}

.JSOK #contact-form {
	height: 160px;
}

#contact-form.submitted {
	height: 160px;
}

#form-content {
	width: 940px;
	margin-right: auto;
	margin-top: 10px;
	margin-left: auto;
	position: relative;
}

h2#enquiries {
	margin-left: -10px;
	background: url(../images/h2-enquiries.png) no-repeat 0 0;
	width: 293px;
	height: 60px;
	text-indent: -9999px;
	margin-bottom: -30px;
}

p#enquiries-info {
	text-align: right;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	font-style: italic;
	text-shadow: #d5d5d5 1px 1px 0;
	background-position: -513px 0;
}

a#form-close:link, a#form-close:visited{
	background: url(../images/btn-sprite.png) no-repeat -513px 0;
	height: 20px;
	text-indent: -33px;
	width: 20px;
	display: inline-block;
	margin-left: 33px;
	position: absolute;
	top: 0;
	right: 0;
	line-height: 20px;
	color: #6e6e6e;
	font-size: 0.9em;
}

a#form-close:hover {
	color: #5e5e5e;
	background-position: -513px -20px;
}

a#form-close:active {
	color: #424242;
	background-position: -513px -40px;
	line-height: 22px;
}

a#form-cancel:link, a#form-cancel:visited {
	font-family: Georgia, "Times New Roman", Times, serif;
	text-transform: lowercase;
	text-shadow: #d5d5d5 1px 1px 0;
	float: right;
	font-weight: bold;
	font-style: italic;
	margin-top: 6px;
	display: none;
}

.JSOK a#form-cancel:link, .JSOK a#form-cancel:visited {
	display: inline-block;
}

a#form-cancel:hover {
	border-bottom: 1px dotted #6e6e6e;
}

/* My Comment */

/* My Comment */

/* My Comment */

/* @end */

a#email-address {
	font: italic bold 2em Georgia, "Times New Roman", Times, serif;
}

a#email-address:hover {
	border-bottom: 1px dotted #6e6e6e;
}

a#email-address:active {
	border-bottom: 1px dotted #424242;
}

/* @group 404 */

.fourohfour {
	text-align: center;
	font-size: 1.2em;
}

.fourohfour #main-container {
	min-height: 400px;
	background: url(../images/bg-404.png) repeat-x 50% 0;
}

.fourohfour #content-top {
	margin-top: 1em;
	margin-bottom: 1em;
	font: italic bold 1.8em/32px Georgia, "Times New Roman", Times, serif;
}

.fourohfour .button {
		text-shadow: #f5f5f5 1px 1px 0;
	font: italic bold 2em/32px Georgia, "Times New Roman", Times, serif;
	display: block;
	margin-bottom: 0.5em;
	margin-top: 0.5em;
}

.fourohfour p a:link {
	border-bottom: 1px dotted #424242;
}

.fourohfour span.page-strap {
	line-height: 1.2em;
	height: 3em;
}

/* @end */

