@charset "UTF-8";
/* CSS Document */

/*-----------------------------------------------------------------------------
GL Design Portfolio Style Sheet

version:   3.0
author:    Geoff Lewin
email:     geoff_lewin@hotmail.co.uk
website:   http://www.gl-design.co.uk
-----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------*/
/*                                  CSS RESET THANKS TO ERIC MEYER                               */
/*                   http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/                */
/*-----------------------------------------------------------------------------------------------*/
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,
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-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {outline: 0;}

ol, ul {list-style: none;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {text-align: left;font-weight: normal;}
blockquote:before, blockquote:after,
q:before, q:after {content: '"';}
blockquote, q {quotes: '"' '"';}


body 
{
	font:normal 75%/1.3em Arial, Helvetica, sans-serif;
	background:#041024 url(../images/bkg_gradient.gif) top left repeat-x;
	color:#fff;
}

#container
{
	width:1000px;
	margin-right:auto;
	margin-left:auto;
	margin-top:0px;
	text-align:left;
}

#innerContainer {
	width:1000px;
	margin:0 0 0 0;
	padding:0;
}
#headermast
{
	width:1000px;
	height:155px;
	margin:0 auto;
	position:relative;
	
}
#headerBkg {
	background:url(../images/headermast.jpg) no-repeat scroll 50% 100%;
	height:155px;
}
span#logo {
	background:url(../images/gl_design_logo.png) 0 0 no-repeat;
	width:182px;
	height:155px;
	position:relative;
	left:25px;
	top:25px;
	display:block;
}
a#email {
	width:281px;
	height:17px;
	position: absolute;
	right:25px;
	top:100px;
	display:block;
	text-indent:-2000px;
	background:url(../images/email.png) 0 0 no-repeat;
	
}
span#tel {
	width:193px;
	height:17px;
	position: absolute;
	right:25px;
	top:70px;
	display:block;
	background:url(../images/tel.png) 0 0 no-repeat;
	text-indent:-2000px;
}

/* =Typography
-----------------------------------------------------------------------------*/
p {
	margin:0.5em 0 1em 0;
	font:normal 110%/1.3em Arial, Helvetica, sans-serif;
}

body.home #columnOne p {
	font:normal 120%/1.3em Arial, Helvetica, sans-serif;
}

a {
	color: #22E0ED;
	font-weight:bold;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
	color:#22e0ed;
}
img {
	border:0 none;
}
hr {
background:none repeat scroll 0 0 #fff;
border:0 none;
color:#fff;
height:1px;
margin-bottom:1em;
margin-top:1em;
}
/* =Headings
-----------------------------------------------------------------------------*/
h1 {
	font:bold 180%/1.3em Arial, Helvetica, sans-serif;
	color:#0d3465;
	margin:0.5em 0 1em 0;
}
h2 {
	font:bold 150%/1.3em Arial, Helvetica, sans-serif;
	color:#fff;
	margin:0.5em 0 0.5em 0;
}	
h3 {
	font:normal 140%/1.3em Arial, Helvetica, sans-serif;
	color:#0d3465;
	margin:0.5em 0 0.5em 0;
}
h4 {
	font:bold 110%/1.3em Arial, Helvetica, sans-serif;
	color:#fff;
	margin:0.3em 0 0.3em 0;
}
h5 {
	font:bold 100%/1.3em Arial, Helvetica, sans-serif;
	color:#fff;
	margin:0.3em 0 0.3em 0;
	background:#DE391F;
	padding:1px 4px 1px 4px;
	width:90px;
	text-align:center;
}
span.date {
font:bold 100%/1.3em Arial, Helvetica, sans-serif;
	color:#fff;
	margin:0.3em 0 0.3em 0;
	background:#DE391F;
	padding:1px 4px 1px 4px;
	width:90px;
	text-align:center;
}
	
h1#welcome {
	background:url(../images/txt_welcome_message.gif) 0 0 no-repeat;
	width:320px;
	height:106px;
	text-indent:-2000px;
}
h1#about {
	background:url(../images/txt_about.gif) 0 0 no-repeat;
	width:320px;
	height:29px;
	text-indent:-2000px;
}
h1#feedback {
	background:url(../images/feedback.gif) 0 0 no-repeat;
	width:187px;
	height:27px;
	text-indent:-2000px;
}
h1#news {
	background:url(../images/txt_latest_news.gif) 0 0 no-repeat;
	width:233px;
	height:27px;
	text-indent:-2000px;
}
h1#portfolioHeading {
	background:url(../images/txt_portfolio.gif) 0 0 no-repeat;
	width:177px;
	height:29px;
	text-indent:-2000px;
}

#headermast h1 {
	text-indent:-2000px;
	margin:0;
	padding:0;
	font-size:1px;
}
div.tabContent {
	position:relative;
	top:20px;
	padding:0 20px 0 20px;
}
body.home #columnOne div.tabContent p {
	font-size:100%;
	font-weight:normal;
}
ul.services {
	list-style:none;
	margin:0;
	padding:0 0 0 0;
	font-size:100%;
	position:relative;
	top:10px;
}
ul.services li {
	padding:0.4em 0 0.4em 12px;
	background:url(../images/bullet_red.gif) 0 50% no-repeat;
	margin:0 0 0 20px;
}

ul.bullet {
	list-style:none;
	margin:0;
	padding:0 0 0 0;
	font-size:110%;
}
ul.bullet li {
	padding:0.4em 0 0.4em 12px;
	background:url(../images/bullet_red.gif) 0 50% no-repeat;
	margin:0 0 0 20px;
}
a.cvIcon {
background:url(../images/icon_download.png) 0 0 no-repeat;
width:23px;
height:29px;
display:block;
float:left;
}
a.cvIcon:hover {
background:url(../images/icon_download.png) top right no-repeat;
}


/* =Layout
-----------------------------------------------------------------------------*/
div#content {
	background:#082046 url(../images/border_middle_gradient.jpg) top left repeat-x;
	border-left:2px solid #fff;
	border-right:2px solid #fff;
	padding:0;
	width:996px;
}
div#borderTop {
	background:url(../images/border_top.gif) top left no-repeat;
	height:20px;
	width:1000px;
}
div#borderBottom {
	background: url(../images/border_bottom.png) top left no-repeat;
	height:90px;
	width:1000px;
}
div#columnOne {
	width:325px;
	margin:0 0 0 40px;
	float:left;
	overflow:hidden;
	display:inline;
}
div#columnTwo {
	width:580px;
	float:right;
	overflow:hidden;
	margin-right:20px;
}
body.about div#columnOne {
	width:640px;
	margin:0 20px 0 40px;
	float:left;
	overflow:hidden;
	border-right:1px solid #fff;
	padding:0 40px 0 0;
}
body.about div#columnTwo {
	width:200px;
	padding:0 0 0 20px;
	float:left;
	overflow:hidden;
	margin-right:0;
}
body.news div#columnOne {
	width:920px;
	margin:0 40px 0 40px;
	float:left;
	overflow:hidden;
	
	padding:0 0 0 0;
}
.clear {
	clear:both;
}
p#copyright {
	position: relative;
	right:30px;
	top:-65px;
	font:normal 80%/1.3em Arial, Helvetica, sans-serif;
	text-align:right;
}

/* =Main Nav
-----------------------------------------------------------------------------*/
div#navContainer {
	position: relative;
	right:0;
}

ul#navigation {
	position: absolute;
	right:0;
	top:-156px;
	text-decoration:none;
	list-style:none;
	z-index:2000;
}
ul#navigation li {
	float:left;
	display:block;
	height:44px;
	width:101px;
	margin:0 5px 0 0;
}

ul#navigation li a#home {
	background:url(../images/tab_home.png) 0 0 no-repeat;
	height:44px;
	width:101px;
	display:block;
	text-indent:-2000px;
}
ul#navigation li a#home:hover {
	background:url(../images/tab_home.png) -101px 0 no-repeat;
}
ul#navigation li a#portfolio {
	background:url(../images/tab_portfolio.png) 0 0 no-repeat;
	height:44px;
	width:101px;
	display:block;
	text-indent:-2000px;
}
ul#navigation li a#portfolio:hover {
	background:url(../images/tab_portfolio.png) -101px 0 no-repeat;
}
ul#navigation li a#about {
	background:url(../images/tab_about.png) 0 0 no-repeat;
	height:44px;
	width:101px;
	display:block;
	text-indent:-2000px;
}
ul#navigation li a#about:hover {
	background:url(../images/tab_about.png) -101px 0 no-repeat;
}
ul#navigation li a#feedback {
	background:url(../images/tab_feedback.png) 0 0 no-repeat;
	height:44px;
	width:101px;
	display:block;
	text-indent:-2000px;
}
ul#navigation li a#feedback:hover {
	background:url(../images/tab_feedback.png) -101px 0 no-repeat;
}

/** html ul#navigation { 
	position: absolute;
}*/

/* =Tag Cloud
-----------------------------------------------------------------------------*/
div#tagCloudContainer {
	float:left;
	height:141px;
	width:580px;
}

ul#tagCloud {
	text-decoration:none;
	list-style:none;
	position:relative;
}
ul#tagCloud li {
	float:left;
}
ul#tagCloud li a#css {
	position:absolute;
	top:0;
	left:0;
	background: url(../images/txt_css.gif) 0 0 no-repeat;
	height:62px;
	width:173px;
	display:block;
	text-indent:-2000px;
	z-index:20;
}
ul#tagCloud li a#css:hover {
	background:url(../images/txt_css.gif) top right no-repeat;
}
ul#tagCloud li a#flash {
	position:absolute;
	top:70px;
	left:100px;
	background: url(../images/txt_flash.gif) 0 0 no-repeat;
	height:46px;
	width:165px;
	display:block;
	text-indent:-2000px;
	z-index:21;
}
ul#tagCloud li a#flash:hover {
	background:url(../images/txt_flash.gif) top right no-repeat;
}
ul#tagCloud li a#xhtml {
	position:absolute;
	top:0;
	left:320px;
	background: url(../images/txt_xhtml.gif) 0 0 no-repeat;
	height:36px;
	width:162px;
	display:block;
	text-indent:-2000px;
	z-index:22;
}
ul#tagCloud li a#xhtml:hover {
	background:url(../images/txt_xhtml.gif) top right no-repeat;
}
ul#tagCloud li a#photoshop{
	position:absolute;
	top:40px;
	left:200px;
	background: url(../images/txt_photoshop.gif) 0 0 no-repeat;
	height:36px;
	width:172px;
	display:block;
	text-indent:-2000px;
	z-index:23;
}
ul#tagCloud li a#photoshop:hover {
	background:url(../images/txt_photoshop.gif) top right no-repeat;
}
ul#tagCloud li a#jquery{
	position:absolute;
	top:80px;
	left:350px;
	background: url(../images/txt_jquery.gif) 0 0 no-repeat;
	height:27px;
	width:109px;
	display:block;
	text-indent:-2000px;
	z-index:24;
}
ul#tagCloud li a#jquery:hover {
	background:url(../images/txt_jquery.gif) top right no-repeat;
}

/* = Slideshow
-----------------------------------------------------------------------------*/
#slideContainer { 
	width:568px;
	height:378px;
	position:relative;
	padding:0 0 0 0;
	margin:0 0 0 0;
	background:url(../images/bkg_scroller.png) 0 0 no-repeat; 
	overflow:hidden;
}
.slideshow { 
	width:542px;
	height:352px;
	margin:10px auto;
}
	
.slideshow img { padding:0;
 }



/* =Feedback
-----------------------------------------------------------------------------*/

/* Positions the contact form so it doesn't interfere with any other content, as well as a z-index above any other elements on the page */	

.bar {
background:url("../images/ajax-loader.gif") no-repeat scroll center center transparent;
display:none;
height:40px;
margin-top:100px;
width:230px;
}

#contactFormContainer p {
	margin:0 0 0 0;
	float:left;
	width:350px;
	padding:5px 0 5px 0;
	}
	
/* Hides the whole contact form until needed */	
#contactForm {
	/*background: url(../images/parrot.jpg) bottom right no-repeat;*/ 
	
	padding:7px 0; 
	color: #fff;
	}   

	
/* Hides the confirmation message until needed */	
#messageSent {display:none;}

/* This hides the form validation alert messages until needed */
#contactForm span { 
	display:none;  
	line-height:10px; 
	padding:5px; 
	color: #FFFF33;
	}
	

	
/* Form styling from here on out. There is nothing in here that you HAVE to use to get this to work */	
#contactForm textarea, #contactForm input {
	width:300px; 
	background:#6d6d6d; 
	color: #fff; 
	border:1px solid #8a8a8a; 
	height:20px; 
	line-height:14px;  
	padding:2px 2px 0px;
	font-size:15px;
	float:left;
	}
#contactForm input {background-position:0px -20px;}
#contactForm textarea {height:114px; font-family:Arial, Helvetica, sans-serif;}

#contactForm input.submit {
	border:1px solid #aba8a8; 
	background:#e5e5e5; 
	color:#4d4d4d; 
	font-weight:bold; 
	padding:7px 14px 7px 14px; 
	height:27px; 
	width:124px; 
	cursor:pointer; 
	float:left;
	font-size:12px;
	
	}
#contactForm .submit:active {background:#cacaca; }
#contactForm label {padding-left:0; font-weight:bold;}
#contactForm p {padding-bottom:8px;}
#contactForm .input_boxes {float:left; width:400px;}


/* =Portfolio
-----------------------------------------------------------------------------*/
body.portfolio div#columnOne {
	width:957px;
	margin:0 0 0 40px;
	float:left;
	overflow:hidden;
}
ul#portfolioGallery {
	margin:0 0 20px 0;
	list-style:none;
	position:relative;
	display:block;
}
ul#portfolioGallery li {
	display:block;
	background:url(../images/gallery_bkg.png) 0 0 no-repeat;
	float:left;
	margin:25px 47px 15px 0;
	width:272px;
	height:195px;
}
ul#portfolioGallery li a.cboxElement {
	float:left;
	display:block;
	color:#fff;
	width:266px;
	height:178px;
	padding:7px 3px 2px 3px;
}

div.imageHolder {
	width:542px;
	height:342px;
	float:left;
}
.clientInfo {
	float:left;
	width:290px;
	color:#666666;
	margin-left:30px;
}
.clientInfo h2, .clientInfo a {
	color:#666666;
}
.infoStyle {
	font:normal 100%/1.3 Arial, Helvetica, sans-serif;
	color:#de391f;
	}
.clientInfo dt {
	clear:left;
	float:left;
	width:80px;
	font:normal 110%/1.3 Arial, Helvetica, sans-serif;
	color:#de391f;
	display:inline;
}
.clientInfo dd {
	padding:0 0 0 0;
	width:230px;
	font:normal 110%/1.3 Arial, Helvetica, sans-serif;
	display:inline;
}

.newsStory {
	padding:20px;
	border:1px solid  #666666;
	margin:20px 0 20px 0;
	
}

span#logo, div#borderBottom, span#tel, a#email { behavior: url(css/iepngfix.htc) }


/* =Feedback form
-----------------------------------------------------------------------------*/
form {
}

p, label {
}

.passengerContainer {
	padding: 20px 0 0 0;
	width:322px;
}

fieldset {
	border: none;
	margin: 0 0 15px;
	padding: 0;
}
fieldset legend {
	padding: 0 0 5px 0;

	font-weight: bold;
}
fieldset .item {
	margin-left: 13px;
}

.fieldRow {
	overflow: hidden;
	_zoom: 1;
	margin-bottom: 10px;
}
.item {
	float: left;
}
.item label {
	display: block;
	margin-bottom: .3em;
	float: left;
	width:100px;
}
.item div.helpLabel label {
	float: left;
	margin-right: .3em;
}

.item input,
.item select {
	border-width: 1px;
	font-size: 11px;
	padding: 1px;
}
.item input {
	padding: 2px 1px;
	float: left;
}

.item select,
.item input {
	width: 180px;
}

fieldset p {
	padding-left: 13px;
}
fieldset span {

}

fieldset .terms {
	color: #666;
}

select.title {
	width: 55px;
}
select.phone {
	width: 70px;
}


.bookingButtons {
	text-align: right;
		width:312px;
}
.bookingButtons .back {
	float: left;
}

label.error {
	color: #22E0ED;
	font-weight:bold;
}

