/* =======================================================

	AUTHOR: 		Sumac UK
	DESCRIPTION:	Screen styles for Topmanzine
	DATE:			31/08/07
	LAST EDITED:	--/--/--

======================================================= */

/* ==========================================================
	GLOBALS
========================================================== */

body 
{
	margin: 0;
	padding: 0;
	font-family: Verdana, Arial, Sans-Serif;
	text-align: center;
	color: #666666;
	text-align: center;
	background: #FFF url(../images/bkrnd_image.gif) repeat top left;
}
/* [ text sizing ]---------------------------------------- */
/* http://www.clagnut.com/blog/348/ ---------------------- */
html
{
	font-size: 100%; /* for IE */
}
body 
{
	font-size: 62.5%; /* for IE/Win */
}
input, select, table
{
	font-size: 100%;	
}
/* [ links ] ------------------------------------------ */
a
{
	cursor: pointer;	
}
a:link, a:visited
{
	color: #666666;
	text-decoration: underline;
	font-weight: bold;
}
a:hover
{
	color: #980065;
	text-decoration: underline;
	font-weight: bold;
}
/* [ headings ] ------------------------------------------ */

h1
{
	font-size: 1.4em;
	margin: 0 0 0.8em 0;
	text-transform:uppercase;
	color: #003b55;
}
h2
{
	margin: 0 0 1em 0;
	font-size: 1em;
	text-transform:uppercase;
	color: #003b55;
	font-weight: bold;
}
h3, h4
{
	margin: 0 0 1em 0;
	font-size: 1em;
	text-transform:uppercase;
	color: #003b55;
	font-weight: bold;
}
/* [ other ] --------------------------------------------- */
p
{
	margin: 0 0 1em 0;	
}
.hide
{
	
	height: 0;
	width: 0;
	overflow: hidden;
	position: absolute; 	
}
.clear
{
	clear: both;	
}
a img
{
	border: 0;
}
hr
{
	display: none;	
}
strong
{
	font-weight: bold;	
	color: #333333;
}
em
{
	font-style: italic;	
}
/* ==========================================================
	JUMP-TO
========================================================== */
#jump-to
{
	position: absolute;
	top: 0;
	left: -9999px;
}
#jump-to a:hover
{
	background-color: #EEE;	
}
#jump-to a:focus
{
	display: block; 
	position: absolute; 
	top: 20px; 
	left: 10020px; 
	font-size: 1.5em; 
	background-color: #FFF; 
	border: solid 2px #999;
	color: #999;
	padding: 10px; 
	width: 15em; 
	z-index: 1;
}
/* ==========================================================
	PAGE
========================================================== */
#topmanzine
{
	position: relative;
	margin: 20px auto 0 auto;
	width: 935px;
	text-align: left;
	background-color: #FFF;
	font-size: 1.1em;
	line-height: 1.3em;
	overflow: hidden;
}
#page-wrap
{
	float: left;
	margin: 0;
	background-color: #FFF;
}
#header 
{
	margin: 0;
	width: 935px;
}

#header #logo
{
	float: left;
	margin: 19px 0 0 15px;
}
#body
{
	float: left;
	margin: 20px 0 0 0;
	width: 935px;
	background: #FFF url(../images/bkgnd_vert_line.gif) repeat-y top left;	
}
#body-home
{
	float: left;
	margin: 20px 0 0 0;
	width: 935px;
	background: #FFF url(../images/bkgnd_vert_line_home.gif) repeat-y top left;	
}
/* ==========================================================
	PAGE
========================================================== */
#nav
{
	float: left;
	margin: 19px 0 0 20px;
	padding: 0 0 28px 0;
	width: 600px;
	color: #fff;
	background: #003b55 url(../images/nav_image_repeat.gif) repeat-x bottom left;
	display: inline;
	font-weight: bold;
	text-transform: uppercase;
}
#main-navigation 
{
	float: left;
	display: inline;
	list-style: none;	
	margin: 15px 0 0 10px;
	padding: 0;
	line-height: 100%;
	
}
#main-navigation li
{
	display: inline;	
}

#main-navigation a
{
	text-decoration: none;
	text-transform: uppercase;
	color: #fff;
	padding: 0 14px 0 0;
}
#main-navigation a:hover, #main-navigation a.selected
{
	text-decoration: underline;
	color: #CC0066;
}
.media
{
	float: left;
	margin: 0;
}
/* ==========================================================
	Search
========================================================== */
#search
{
	float: left;
	width: 230px;	
	margin: 13px 0 0 25px;
	display: inline;
}
#search fieldset
{
	float: left;
}
#search legend
{
	display: none;
}
#search fieldset input
{
	float: left;
	margin: 0 0 0 5px;
	padding: 0.1em 0;
	width: 120px;
	background-color: #e0dddb;
	border: none;
}
#search label
{
	float: left;
}
#search input.button
{
	background-color: Transparent;
	border: none;
	color: #FFF;
	font-weight: bold;
	text-transform: uppercase;	
	float: left;
	padding: 0;
	margin-left: 3px;
}
/* ==========================================================
	rss
========================================================== */
#rss
{
	float: left;
	margin: 10px 0 0 5px;
}
#rss a
{
	float:left;
	margin: 0;
	padding: 0.3em 0 0.4em 25px;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	background: transparent url(../images/rss_img.jpg) no-repeat center left;
}
#rss a:hover
{
	text-decoration: underline;
}

/* ==========================================================
	CONTENT
========================================================== */
#content
{
	float: left;
	margin: 0 0 0 15px;
	padding: 0;
	width: 590px;
	display: inline;
}
/* ==========================================================
	CONTENT- [DIV summary]
========================================================== */
#content #summary
{
	float:left;
	margin: 0 0 0 0;
	width: 593px;
	padding-bottom: 19px;
	position: relative;
	clear: both;
}
#content #summary h2
{
	float: right;
	width: 288px;
}
#content #summary #summary-image
{
	float: left;
	width: 	286px;
	margin-right: 19px;
}
#content #summary #gallery-image, #content #summary #flash-video
{
	float: left;
	width: 	286px;
	min-height: 286px;
	overflow: hidden;
	margin-right: 19px;
}
#content #summary div.content-thumbnails 
{
	float: right;
	margin: 0;
	width: 288px;
	clear: right;
	overflow: hidden;
}
/* ==========================================================
	GALLERY
========================================================== */
#thumbnails 
{
	overflow: hidden;
	width: 100%;	
}
#thumbnails li
{
	float: left;
	margin-right: 1px;	
	margin-bottom: 1px;
}
#thumbnails li a
{
	float: left;
}
#thumbnails li a img
{
	float: left;
	
}
#thumbnails li a:link img, #thumbnails li a:visited img
{
	border: 1px solid #FFF;
}
#thumbnails li a:hover img, 
#thumbnails li a.current img,
#thumbnails li a.current:link img,
#thumbnails li a.current:visited img,
#thumbnails li a.current:hover img
{
	border: 1px solid #9e126f;
}
#image-navigation
{
	width: 288px;
	overflow: hidden;
	background: transparent url(../images/dotted-border.gif) repeat-x left bottom;
	padding: 0 0 10px 0;
	position: absolute;
	bottom: 0;
	left: 302px;
}
#image-navigation #next-image
{
	width: 50%;	
	text-align: right;
	float: left;
}
#image-navigation #previous-image
{
	width: 50%;	
	text-align: left;	
	float: left;
}
#image-navigation a.disabled,
#image-navigation a.disabled:link,
#image-navigation a.disabled:visited,
#image-navigation a.disabled:hover
{
	cursor: default;
	color: #999;
	font-weight: normal;
	text-decoration: none;	
}
/* ==========================================================
	Network Links
========================================================== */
div.network-links
{
	margin: 30px 0 20px 0;
	padding: 1em 0 0 0;
	background: transparent url(../images/dotted-border.gif) repeat-x left top;
	clear: both;
}
div.network-links a
{
	margin-right: 20px;
}
#article-back, #news-back
{
	margin-top: 2em;
	clear: both;
}
/* ==========================================================
	extras
========================================================== */
#extras
{
	float: left;
	margin: 0 0 0 30px;
	width: 286px;
	display: inline;
}
#extras div.extras-wrap
{
	margin: 0 0 1.5em 0;
}
#extras .extras-wrap h3
{
	margin-bottom: 0;
}
/* ==========================================================
	NEWS-ITEM
========================================================== */
div.news-item
{
	width: 280px;
	float: left;	
	overflow: hidden;
}
div.news-item h3
{
	margin-bottom: 0;
}
div.news-odd
{
	margin-right: 25px;	
}
div.news-item p
{
	overflow: hidden;	
}
/* ==========================================================
	footer
========================================================== */
#footer
{
	float: left;
	clear: both;
	width: 935px;
	background-color: #ccc;
	text-align: center;
	display: inline;
	margin: 20px 0 0 0;	
}
#footer ul
{
	margin: 5px 0 5px 0;
	list-style: none;	
	line-height: 100%;
}
#footer li
{
	display: inline;	
}

#footer a
{
	text-decoration: none;
	text-transform: uppercase;
	color: #003b55;
	padding: 0 15px 0 15px;
}
#footer a:hover, #footer a.selected
{
	color: #980065;
}
/* ==========================================================
	home page
========================================================== */
#content-home
{
	float: left;
	margin: 0 0 0 15px;
	padding: 0;
	width: 935px;
	display: inline;
}
#content-home h3
{
	margin-bottom: 0;	
}
/* ==========================================================
	home page- column one
========================================================== */
#column-one
{
	float: left;
	margin: 0 0 0 0;
	width: 286px;
	display: inline;
}
#column-one .column-one-wrap 
{
	float: left;
	margin: 0;
}
/* ==========================================================
	home page- column two
========================================================== */
#column-two
{
	float: left;
	margin: 0 0 0 20px;
	width: 286px;
	display: inline;
}
#column-two .column-two-wrap
{
	margin: 0 0 0 0;
}
#column-news
{
	float: left;
	margin: 0 0 0 20px;
	width: 286px;
	display: inline;	
}
/* ==========================================================
	home page- column three-[news]
========================================================== */
#column-news
{
	float: left;
	margin: 0 0 0 20px;
	width: 286px;
	display: inline;
}
#column-news-wrap
{
	margin: 0 0 0 0;
}
/* ==========================================================
	SEARCH-RESULTS
========================================================== */
#search-results input.input-text
{
	padding: 0.1em 0;
	width: 140px;
	background-color: #e0dddb;
	border: none;
}
#search-results input.button
{
	background-color: #FFF;
	border: none;
	color: #003b55;
	text-transform: uppercase;
	font-weight: bold;
}
#search-results p.result-summary
{
	margin-top: 1em;
}
#search-results div.no-results p
{
	margin-top: 1em;
	font-weight: bold;	
}
/* ==========================================================
	STYLES
========================================================== */
div.img-left
{
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}
div.img-right
{
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
}	
/* ==========================================================
	YOUTUBE
========================================================== */
#youtube
{
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	width: 288px;
}