﻿/*
 *
 *		www.keithgreer.eu
 *		Copyright Keith Greer 2009. All Rights Reserved. 
 *
 */
@media screen, projection, tv {
	body { font-family:Georgia, Times, "Times New Roman", serif; background:#eeeeee url('images/background.jpg') no-repeat scroll top center ; text-align:center; margin:0; font-size:16px; color:#333333; }
	hr { clear:both; visibility:hidden; }
	#main { margin:0 auto; background:#ffffff url('bottom.gif') no-repeat center bottom; padding-bottom:120px; width:880px; min-height:600px; }
	#header { padding:20px 0 0 0; }
	#header h1 { font-weight:normal; background:#fff url('h1.gif') no-repeat center top; margin:0; padding:85px 0 15px 0; font-size:1.5em; }
	#header h1 a { text-decoration:none; color:#333333; border:none; }
	#introduction { height:300px; background:#dddddd none no-repeat; border-top:1px dotted #888; border-bottom:1px dotted #888; }
	#introduction a { border-bottom:1px dotted #000; text-decoration:none; color:#333333; }
	#introduction a:hover { border-bottom-style:solid; padding:0 4px; margin:0 -4px;  }
	#introduction a.blacklink { border:none; background:#000; color:#fff; padding:2px 5px; margin:-2px 0; }
	#introduction a:hover.blacklink { text-decoration:underline; }
	#introduction p { text-align:justify; line-height:1.5em; }
	#introduction h2 { font-weight:normal!important; margin:0 0 20px 0; font-size:25px; }
	.inner { margin:25px 25px 0 0; padding:20px; float:right; width:360px; height:210px; text-align:left; background:transparent url('images/semi.png'); overflow:hidden; }
	#content { text-align:left; }
	#content p { text-align:justify; line-height:1.5em; }
	#content h2 { font-weight:normal; text-align:center; padding:10px 0 10px 0; margin:10px 0 10px 0;  border-top:1px dotted #888; border-bottom:1px dotted #888; }
	#content li { line-height:1.5em; }
	#content a { color:#000; text-decoration:none; }
	#content a:hover { text-decoration:underline; }
	.left { float:left; width:380px; margin:20px 0 20px 30px; }
	#content p a { color:#000; text-decoration:underline; }
	#content p a:hover { color:#000; }
	.right { float:right; width:380px; margin:20px 30px 20px 0; }
	#gallery { }
	#gallery a { display:block; background:#eeeeee; height:100px; width:100%; border:none; margin-bottom:20px; border:none; }
	#gallery a img { float:left; height:100px; border:0; }
	#gallery a strong {  }
	#gallery a span { display:block; float:left; width:180px; padding:10px 0 0 10px; }
	#gallery a:hover { border:none; background:#f5f5f5; text-decoration:underline; margin-bottom:20px; }
	#my_twitter_status {  background:#efefef;font-size:20px; font-style:italic; }
	.fdpoweredby { display:none;visibility:hidden; }
	.number {font-family:"Gill Sans", "Gill Sans MT", Gill, "Century Gothic", Corbel, serif; font-size:20px; padding-left:20px; }
	#menu {  padding:0 0 10px 30px; }
	#menu ul.menu { display:table-row; margin:0 auto; }
	#menu ul.menu li { list-style:none; display:table-cell; float:left;  margin:0 7px 0 0; padding:0 25px 0 0; text-align:left; }   
	#menu ul.menu li a { display:block; padding:5px 10px; border-left:5px solid #ccc; text-decoration:none; color:#000; background:#fff;  }
	#menu ul.menu li a strong { color:#bbbbbb; }
	#menu ul.menu li a span   { display:block; font-style:italic; font-size:13px; color:#aaaaaa; }
	#menu ul.menu li a.selected { border-left-color:#000; } #menu ul.menu li a.selected strong { color:#000;  } #menu ul.menu li a.selected span { color:#000;  }
	#menu ul.menu li a:hover { border-left-color:#000; }
	#menu ul.menu li a:hover strong { color:#000; text-decoration:underline; }
	#menu ul.menu li a:hover span { color:#000; }
	#menu ul.menu li.home {   }
	#menu ul.menu li.design {  }
	#menu ul.menu li.development {  }
	#menu ul.menu li.portfolio {  }
	#menu ul.menu li.contact {  padding:0; }
	ul.submenu { list-style:none; margin:0; padding:0; }
	ul.submenu li {   }
	ul.submenu li a, .submenu li h3 { display:block; padding:3px 0; margin:0; border-bottom:1px dotted #000; text-align:center; color:#444444; }
	ul.submenu li h3 { font-weight:normal; font-style:italic; color:#888888;  }
	ul.submenu li a:hover { color:#000; border-bottom-style:solid; margin:0; padding:3px 0;}
	#bottom { background:#fafafa; padding:10px 10px 10px 20px; margin:10px 0 40px 0; font-size:90%; border-top:1px dotted #888; border-bottom:1px dotted #888; }
	#bottom p { text-align:justify; }
	#bottom .innercol { margin:0 15px; width:250px; float:left; }
	.search p { margin:0 0 20px 0; text-align:center!important;  }
	.onecol { padding:10px 30px;  }
	#lightbox_gallery { margin:3px 0; text-align:center; }
	#lightbox_gallery a { border-bottom:none; height:75px; width:120px; background:#fff; padding:3px; float:left; margin:0; }
	#lightbox_gallery a:hover { border-bottom:none; height:75px; width:120px; background:#000; padding:3px; float:left; margin:0; }
	#lightbox_gallery a img { border:none;  }
	#lightbo x{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
	#lightbox img { width: auto; height: auto;}
	#lightbox a img { border: none; }
	#outerImageContainer { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
	#imageContainer{ padding: 10px; }
	#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
	#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
	#imageContainer>#hoverNav{ left: 0;}
	#hoverNav a { outline: none;}
	#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:img/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
	#prevLink { left: 0; float: left;}
	#nextLink { right: 0; float: right;}
	#prevLink:hover, #prevLink:visited:hover { background: url(img/prevlabel.gif) left 15% no-repeat; }
	#nextLink:hover, #nextLink:visited:hover { background: url(img/nextlabel.gif) right 15% no-repeat; }
	#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }
	#imageData{	padding:0 10px; color: #666; }
	#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
	#imageData #caption{ font-weight: bold;	}
	#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
	#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	
	#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
	.clear {  clear:both; }
	.slider-outer { background:#dddddd none no-repeat; border-top:1px dotted #888; height:280px; width: 880px;position: relative; overflow: hidden; }
	.frame { position: absolute; background: white; visibility: hidden; width: 880px; text-align:justify; }
	.frame a { border-bottom:1px dotted #000; text-decoration:none; color:#000; }
	.frame a:hover { border-bottom-style:solid; padding:0 4px; margin:0 -4px;  }
	.frame a.blacklink { border:none; background:#000; color:#fff; padding:2px 5px; margin:-2px 0; }
	.frame a:hover.blacklink { text-decoration:underline; }
	.frame p { text-align:justify; line-height:1.5em; }
	.frame h2 { font-weight:normal!important; margin:0 0 20px 0; font-size:25px; }
	.slider-outer .inner { height:200px; }
	.slider-buttons { background:#000; overflow: hidden; font-family:Arial, Helvetica, sans-serif; font-size:10px; padding:4px 0; font-weight:bold; float:left; width:880px; height:12px; border-bottom:1px dotted #888; }
	.slider-buttons a { cursor:pointer; padding:0 5px; color:#fff; }
	.slider-buttons a span{}
	.slider-buttons a.selected, .slider-buttons a:hover{ text-decoration:underline; }
	.slider-buttons a.selected span, .slider-buttons a:hover span{}
	.slider-buttons a.toc{}
	.slider-buttons a.prev, .glidecontenttoggler-2 a.next{}
	.slider-buttons a.prev:hover, .glidecontenttoggler-2 a.next:hover{}
	p.bykeith {  margin:30px 0 50px 0; font-weight:bold; font-family:Arial, Helvetica, sans-serif; font-size:x-small!important; text-transform:none!important;}
	p.bykeith a { padding:3px 6px!important; border:1px solid #bbbbbb!important; color:#bbbbbb!important; text-decoration:none; }
	p.bykeith a:hover { border:1px solid #000000!important; color:#000000!important; }
	p.copyright { color:#aaa; font-family:Arial, Helvetica, sans-serif; font-size:x-small!important; }
	p.copyright a { text-decoration:none; color:#aaa; }
	.boxen {   padding:10px 20px; min-height:120px; margin-bottom:20px; font-family:Arial, Helvetica, sans-serif; font-size:13px; height:200px; overflow:auto; }



	#blog { background:#eee;   }
	#blog h2 { margin:0; border:none; padding:0;  font-size:25px; text-align:left; color:#84AA33!important; }
	#blog a { color:#84AA33!important; }

	#twitter { background:#eee; }
	#twitter h2 { margin:0; border:none; padding:0; font-size:25px; text-align:left; color:#C32D2E!important; }
	#twitter a { color:#C32D2E!important; }
	#twitter span a { color:#777!important; }
	
	
}
@media print {
  #menu { display: none; }
  #bottom {  display:none;  }

}
@media handheld {
	body { font-family:sans-serif; font-size:10px; }
	#introduction { background-image:none!important; background-color:#000;color:#fff; padding:5px;  }
	#introduction h1, #introduction p, #introduction h2 { margin:0; }
	#header {  background-color:#000; color:#fff; padding:5px; text-transform:uppercase;  }
	#header h1 {  margin:0; font-size:10px; }
	#header a { color:#fff; text-decoration:none; }
	#introduction a {  color:#fff; }
	hr {  display:none; }
	#bottom {  display:none;  }
	#menu {  padding:10px 0;  }
	#menu ul { margin:0; padding:0; }
	#menu li {  padding:0 5px 0 0; margin-right:2px; border-right:1px solid #000; display:inline-block;  }
	#menu li span { display:none; }
	#menu a { display:block; }
}