/* ----- VishPurgass.com screen stylesheet ------------------------------------------------ */
/* ----- Vish Purgass 2009 ---------------------------------------------------------------- */
/* ----- enjoy. --------------------------------------------------------------------------- */

/*

----- Background Colours -----

	Main Background: #000
	Secondary Background: #c00

----- Text Colours -----

	Main Body: #8d9da6
	Light Blue: #00aeef
	Green: #0f0
	Red: #f00
	Amber: #fc0

----- Dimensions -----

	Site Width: 880px
	Main Column Width: 668px
	Sidebar Width: 200px 

*/

/* ----- Global Reset --------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
* {
	padding: 0; /* global margin and padding reset */
	margin: 0;
}

/* ----- Tags ----------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
body {
	background: #000 url(../images/bg_x.gif) 0 0 repeat;
	text-align: center; /* centre in IE */
	font: 11px Arial, Helvetica, sans-serif;
	color: #8d9da6;
}
a {
	color: #8d9da6;
	outline: none;
	text-decoration: none;
}
a:hover {
	color: #fff;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
}
a img {
	border: none;
}
ul {
	list-style: none;
}

/* ----- Universal Styles ----------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.hide {
	display: none;
}
.clear {
	clear: both;
}

/* ----- Main Containers ------------------------------------------------------------------ */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
#site {
	margin: 0 auto; /* centre in proper browsers */
	width: 880px;
	text-align: left;
}
#content {
	float: right;
	width: 668px;
	padding: 24px 0 0 0;
}

/* ----- Masthead ------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
#masthead {
	float: left;
	width: 880px;
	height: 165px;
}
#logo {
	float: left;
	width: 200px;
	height: 165px;
	border-bottom: 1px solid #f00;
}
#logo a {
	display: block;
	width: 200px;
	height: 165px;
	text-indent: -1000em;
	background: transparent url(../images/vish_purgass_logo.png) 0 0 no-repeat !important;
	background-image: url(../images/vish_purgass_logo.gif);
}

/* ----- Footer --------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
#footer {
	clear: both;
	float: left;
	width: 200px;
	padding: 10px 0 24px 0;
	border-top: 1px solid #f00;
}

/* ----- Sidebar -------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
#sidebar {
	float: left;
	width: 200px;
	min-height: 550px;
	padding: 24px 0 6px 0;
}
#sidebar ul {
	clear: left;
	float: left;
	width: 97px;
	margin-bottom: 24px;  /* 22px */
}
#sidebar p {
	float: right;
	width: 97px;
}
#sidebar a {
	display: block;
	width: 91px;
	margin-bottom: 1px;
	padding: 0px 3px;
}
#sidebar a.current {
	color: #fff;
	background: #00aeef !important;
	
}
#sidebar a.current2 {
	color: #fff;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	
}
#sidebar a.current3 {
	color: #fff;
	background: #0f0 !important;
		
}
#sidebar p a {
	color: #0f0;
}

/* ----- Projects ------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
#site #content .project {
	clear: both;
	float: left;
	width: 668px;
	margin-bottom: 24px;
	padding: 0;
}

#site #content .project .img {
	width: 656px;
	margin-bottom: 0;
	padding: 6px;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	line-height: 0;
}

/* ----- Banners ------------------------------------------------------------------------- */

.project .banner468 {
	width: 468px;
	padding: 6px;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	line-height: 0;
}

.project .banner120 {
	width: 120px;
	padding: 6px;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	line-height: 0;
}

.project .banner160 {
	width: 160px;
	padding: 6px;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	line-height: 0;
}

.project .banner175 {
	width: 175px;
	padding: 6px;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	line-height: 0;
}

.project .banner249 {
	width: 249px;
	padding: 6px;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	line-height: 0;
}

.project .banner300 {
	width: 300px;
	padding: 6px;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	line-height: 0;
}

.project .banner501 {
	width: 501px;
	padding: 6px;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	line-height: 0;
}

/* ----- Flash Content ------------------------------------------------------------------------- */
#flashContainer {
	float: left;
	padding: 6px;
	background: url(../images/bg_8d9da6_20.png) 0 0 repeat !important;
	background: #23272a;
	line-height: 0;
}


/* ----- Paginate ------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.paginate {
	position: relative;
	clear: both;
	float: left;
	width: 668px;
	margin: -12px 0 12px 0;
	color: #f00;
}
.paginate .previous, .paginate .next {
	position: absolute;
	top: 0;
	z-index: 2;
}
.paginate .previous {
	left: 0;
}
.paginate .next {
	right: 0;
}
.paginate .next a {
	padding-right: 12px;
	background: url(../images/paginate_next.gif) 100% 0 no-repeat !important;
}
.paginate .next a:hover {
	background: url(../images/paginate_next.gif) 100% -100px no-repeat !important;
}
.paginate .previous a {
	padding-left: 12px;
	background: url(../images/paginate_previous.gif) 0 0 no-repeat !important;
}
.paginate .previous a:hover {
	background: url(../images/paginate_previous.gif) 0 -100px no-repeat !important;
}
.paginate ul {
	width: 668px;
	text-align: center;
}
.paginate ul li {
	display: inline;
	margin: 0 2px;
}
.paginate a {
	color: #fc0;
}
.paginate a:hover {
	background: none !important;
	color: #f00;
}

/* ----- Typography ----------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
#content h1, #content h2 {
	font-size: 1em;
	font-weight: normal;
}
#content p.subtext {
	margin-bottom: 26px; 
}
#content p.link {
	margin: -19px 0 6px 0; /* Link distance from 1st titles*/
}
#content p.link a {
	padding-left: 11px;
	background: url(../images/paginate_next.gif) 0 0 no-repeat !important;
	color: #fc0;
}
#content p.link a:hover {
	background: url(../images/paginate_next.gif) 0 -100px no-repeat !important;
	color: #f00;
}