/* - - - - - - - - - - - - - - - - - - - - -

Title : CSS Style

- - - - - - - - - - - - - - - - - - - - - */

/* ------------------------------------------------------------

	css

------------------------------------------------------------ */

body{
	background: #fff;
	color: #333;
	font-family: Helvetica Neue, Helvetica, Arial, Geneva, sans-serif;
	font-size: 62.5%; /* http://www.clagnut.com/blog/348/ */
	line-height: 1.6em;
	text-align: center;
}

/* links  */

a{
	color: #F55639;
	text-decoration: none;
}
a:hover{text-decoration: underline;}

/* headings */

h1 {font-size:2em}  /* displayed at 24px */
h2 {font-size:1.5em}  /* displayed at 18px */
h3 {font-size:1.25em}  /* displayed at 15px */
h4 {font-size:1em}  /* displayed at 12px */

/* tables & forms */

input, select, th, td {font-size:1em}

/* ------------------------------------------------------------

	page structure

------------------------------------------------------------ */

#wrap{
	margin: 0 auto;
	text-align: left;
	position: relative;
	overflow: hidden;
}
#mast-head{
	font-size: 1.1em;
	line-height: 1.6em;
	color: #fff;
	text-align: left;
	padding: 25px 0;
	
	background: #17181A url("images/grad_bg.png") no-repeat top;
}
#navigation{
	color: #fff;
	padding: 0;
	height: 1%;
	font-size: 12px;
	border-top: 1px solid #111;
	text-transform: uppercase;
	
	background: #29292B url("images/grad_menu.png") no-repeat bottom;
}
#content{
	height: 1%;
	margin: 20px 0 0 0;
}
#primary-content{
	font-size: 1.3em;
	line-height: 1.6em;
	padding: 0 10px 10px 20px;
	overflow: hidden;
	float: left;
	width: 640px;
}
#secondary-content{
	font-size: 1.1em;
	line-height: 1.6em;
	margin: 0;
	float: right;
	width: 280px;
	margin-bottom: 20px;
}
#bottom{
	background: #fff;
	margin-bottom: 20px;
	padding: 0;
}
#footer{
	margin: 20px auto 0 auto;
	font-size: 1.1em;
	border: 1px solid #ddd;
	padding: 10px 30px;
	color: #333;
	
	-webkit-border-radius: 5px; -moz-border-radius: 5px;
}

/* --- */

.copy{margin: auto;width: 960px;}

/* ------------------------------------------------------------

	mast head

------------------------------------------------------------ */

#logo{float: right;}

#mast-head h1{
	float: left;
	font-size: 2.6em;
	font-weight: normal;
	padding: 10px;
	text-shadow: #000 1px 1px 1px;
}
#mast-head h1 a{
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
}
#mast-head h1 a:hover{color: #999;}
#mast-head span{
	font-size: 18px;
	color: #555;
	margin: 0;
}

/* ------------------------------------------------------------

	navigation

------------------------------------------------------------ */

#navigation ul{
	margin: 0;
	padding: 0;
	float: right;
	border-left: 1px solid #111;
}
#navigation li{
	float: left;
	list-style: none;
	position: relative;
}
#navigation li a{
	color: #fff;
	float: left;
	padding: 10px 18px;
	text-decoration: none;
	border: 1px solid #111;
	border-left: 1px solid #444;
	border-top: none;
	border-bottom: none;
}
#navigation li a:hover{
	background: #333;
	color: #888;
}
#navigation li a.current, 
#navigation a.currentAncestor{
	background: #fff;
	color: #333;
}
.current{background: #FFF;}

#navigation ul ul{display: none;}
	
/* --- */

#side-navigation{
	margin: 0;
	padding: 10px 0;
}
#side-navigation ul {
	list-style: none;
	margin: 0 !important;
	padding: 0;
}
#side-navigation li{display: inline;}
#side-navigation ul a{display: none;}
#side-navigation ul ul a{
	background: url("images/icons/document-text.png") no-repeat 5px center;
	display: block;
	padding: 7px 20px 6px 25px;
	text-decoration: none;
	border-bottom: 1px solid #ddd;
	text-transform: uppercase;
	font-weight: bold;
	color: #333;
}
#side-navigation ul ul a:hover{
	text-decoration: none;
	color: #F55639;
}
#side-navigation ul ul a.current{
	color: #333;
	text-decoration: none;
	font-weight: bold;
	background-color: #fff;
}

/* --- */

#side-navigation ul ul ul li a{
	padding-left: 40px;
	background-position: 20px center;
}
#side-navigation ul ul ul ul a{
	padding-left: 60px;
	background-position: 40px center;
}
#side-navigation ul ul ul ul ul a{
	padding-left: 80px;
	background-position: 60px center;
}
#side-navigation ul ul ul ul ul ul a{
	padding-left: 100px;
	background-position: 80px center;
}

/* ------------------------------------------------------------

	breadcrumb

------------------------------------------------------------ */

#breadcrumb{
	color: #999;
	margin: 0 auto 10px auto;
	font-size: 1.1em;
	clear: both;
	height: 45px;
}
#breadcrumb ul{
	padding: 15px 20px;
	border-bottom: 1px solid #ddd;
}
#breadcrumb ul li{
	list-style: none;
	display: inline;
}
#breadcrumb ul li a{
	padding-right: 5px;
	color: #999;
}

/* ------------------------------------------------------------

	banner

------------------------------------------------------------ */

#banner{
	height: 340px;
	position: relative;
	clear: both;
	border-bottom: 1px solid #ddd;
	overflow: hidden;
	margin: 0 auto 20px auto;
	background: url("images/shadow_960.png") no-repeat bottom;
}

/* static */

#static{
	width: 960px;
	height: 300px;
	background: url("images/editable_images/banner_1.jpg");
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------------------------------------------------------

	primary content

------------------------------------------------------------ */

#primary-content h1,
#primary-content h2,
#primary-content h3,
.album-title,
.movie-page-title,
.message-text{
	font-size: 1.8em;
	margin-bottom: 20px;
	font-weight: bold;
}
#primary-content h3 {font-size: 1.4em;letter-spacing: normal;}

#primary-content p {margin: 0 0 1.5em; }

#primary-content ul, 
#primary-content ol { margin: 0 1.5em 1.5em 2.5em; }
#primary-content ul {list-style-type: circle;}
#primary-content ol {list-style-type: decimal;}

#primary-content dl {margin: 0 0 1.5em 0; }
#primary-content dl dt {font-weight: bold; }
#primary-content dl dd {margin-left: 1.5em; }

/* tables */

#table {
	border: 2px solid;
	border-collapse:collapse;
	width:100%;
}
#table td {
	padding:3px;
	border: 1px solid #ccc;
}
#table th {
	text-align:left;
	border: 1px solid #ccc;
	font-size: 1.2em;
}
#table thead th {
	color:#3A3A38;
	padding: 10px 6px;
	font-size: 1.6em;
}
#table tbody th {
	color:#3A3A38;
	padding: 6px
}

/* blog page type */

.blog-entry{
	height: 1%;
	padding: 20px 0 0 30px;
	border-top: 1px solid #ddd;
	margin: 0 0 20px -20px;
	position: relative;
	width: 98%;
}
.blog-entry-title{margin-bottom: 5px !important;}
.blog-entry-title a{color: #333;}
.blog-entry-date{
	background: url("images/icons/clock.png") no-repeat left center;
	font-size: 0.9em;
	padding-left: 20px;
	margin: 0 0 10px 0;
	color: #999;
}
.blog-entry-date a{}
.blog-read-more{clear: both;display: block;margin: 10px 0;font-weight: bold;}
.blog-entry-tags{
	font-size: 0.9em;
	color: #8D8B84;
	margin: 0 !important;
}
.blog-entry-comments{
	font-size: 0.9em;
}
.blog-entry-comments a{

}
.blog-comment-link{}

/* blog archive page */

.blog-archive-headings-wrapper{
	padding-bottom: 10px;
	margin-bottom: 10px;
}
.blog-archive-month {
	margin-bottom: 10px;
	font-weight: bold;
}
.blog-archive-link{font-weight: bold;}
.blog-archive-link:before{content: "/ "; }

/* blog sidebar elements */

#blog-categories, #blog-archives, .blog-tag-cloud, #blog-rss-feeds{
	height: 1%;
	overflow: hidden;
	margin: 0 !important;
}
#blog-rss-feeds{
	padding-bottom: 20px;
}
.blog-tag-cloud a{background: #fff none !important;}
.blog-category-link-enabled, .blog-category-link-disabled, .blog-archive-link-disabled, .blog-archive-link-enabled, .blog-tag-cloud li a, #blog-rss-feeds a{
	display: block;
	padding: 3px !important;
	text-decoration: none;
	border-bottom: 1px solid #ddd;
	background: #fff;
	text-align: center;
	float: left;
	margin: 3px 3px 3px 0;
}

/* gallery pages */

.album-title {}
.album-wrapper {
	margin: 20px 0 0 0; 
	overflow: hidden;
}
.thumbnail-wrap {
	float: left;
	margin: 0 10px 10px 0;
	background: #FFF;
	padding: 5px;
	border: 1px solid #ddd;	
}
.thumbnail-frame {position: relative;}
.thumbnail-caption {
	position: absolute;
	bottom: 0;
	left: 0;
	background: #fff;
	overflow: hidden;
	margin: 0;
	width: 90%;
	padding-left: 5px;
}

/* full size photo page */

.photo-background {
	padding: 0;
	padding-bottom: 100px;
	background-image: none;
	margin: 0;
	border-top: none;
}
.photo-navigation {
	height: 145px;
	position: relative;
	margin-bottom: 40px;
	background: #17181A url("images/grad_bg.png") no-repeat top;
}
.photo-links {
	text-align: center;
	font-size: 1.2em;
	padding: 0;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	margin: 0;
}
.photo-links a, .photo-links a:visited {
	display: inline-table;
	vertical-align: middle;
	padding: 10px !important;	
	text-decoration: none;
	color: #fff;
}
.photo-links a:hover {}
.photo-title {
	color: #fff;
	margin: 0;
	position: absolute;
	top: 30px;
	left: 15px;
	font-size: 2.5em;
	line-height: normal;
	letter-spacing: normal;
}
.photo-caption {
	margin: 0;
	position: absolute;
	top: 70px;
	left: 15px;
	font-weight: normal;
	font-size: 1.2em;
	line-height: normal;
	letter-spacing: normal;
	color: #fff;
}

/* --- */

.exif-data {
	margin: 20px auto 0 auto;
	font-size: 1.3em;
	text-align: center;
}

/* movie pages */

.movie-page-title {
	font-weight: bold;
}
.movie-page-description {
	padding-bottom: 10px;
	margin-bottom: 10px;
}
.movie-thumbnail-frame {
	float: left;
	margin: 15px 10px 10px 0;
	text-align: center;
	background: #FFF;
	padding: 5px;
	border: 1px solid #ddd;
}
.movie-thumbnail-caption {
	padding: 5px 0 0 0;
}

/* --- */

.movie-background {background: #1F1C15;}
.movie-title {
	padding: 10px;
	font-size: 2.2em;
	font-weight: bold;
}
.movie-frame {
	padding: 20px;
	margin: 0 0 20px 0;
	background: #fff;
}

/* file pages */

.filesharing-description{margin-bottom: 20px;}
.filesharing-item {
	margin: 10px 0;
	border-bottom: 1px solid #ddd;
	padding: 10px 0;
}
.filesharing-item-description {
	color: #999; 
	font-size: 11px;
	font-style: italic;
}

/* form pages */

#primary-content form{
	width: 96%;
}
.message-text {}
.required-text {
	padding-left: 25px;
	overflow:auto;
}
form label { 
	margin-bottom: 5px;
	}
input, textarea { 
	padding: 9px;
	border: solid 1px #E5E5E5;
	outline: 0;
	font: normal 13px/100% Verdana, Tahoma, sans-serif;
	width: 200px;
	background: #FFFFFF url('bg_form.png') left top repeat-x;
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	
	width: 99%;
	margin: 5px 0 15px 0;
}
input:hover, textarea:hover,
input:focus, textarea:focus { 
	border-color: #C9C9C9; 
	-webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
}
.form-input-button {
	width: auto;
	padding: 9px 15px;
	background: #111;
	border: 0;
	font-size: 14px;
	color: #FFFFFF;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	
	margin: 10px 0 0 0;
	width: auto;
}
select {
	width: 100%;
	margin: 0 0 15px 0;
	font-size: 1.3em;
}
textarea{
	height: 200px;
	overflow: hidden;
}	

/* ------------------------------------------------------------

	secondary content

------------------------------------------------------------ */

#secondary-content h3{
	text-transform: uppercase;
	margin: 25px 0 15px 0;
	font-size: 1.2em;
	text-align: left;
}
#secondary-content p { margin: 0 0 1.5em; }
#secondary-content a{ text-decoration: underline; }
#secondary-content a:hover{
	text-decoration: none;
}

/* --- */

.sidebar{
	background: #F9F9F9;
	border: 1px solid #ddd;
	padding: 5px 15px;
	-webkit-border-radius: 5px; -moz-border-radius: 5px;
}
.sidebar h3{margin: 10px 0 !important;}
.sidebar ul{margin: 0 0 20px 0;}
.sidebar ul li, .sidebar ol li{
	display: inline;
}
.sidebar ul a, .sidebar ol a{
	display: block;
	padding: 7px 10px 6px 25px;
	text-decoration: none;
	border-bottom: 1px solid #ddd;
	background: url("images/icons/chain.png") no-repeat 5px center;
}

/* ------------------------------------------------------------

	extra content

------------------------------------------------------------ */

.extra-content h2, .extra-content h3{
	padding: 5px 0 15px 0;
	margin: 0 0 5px 0;
	font-size: 18px;
	font-weight: normal;
	overflow: hidden;
}
.extra-content p { margin: 0 0 1.5em;}
.extra-content ul{margin: 20px 0 20px 20px;}
.extra-content a{text-decoration: underline;}
.extra-content a:hover{
	text-decoration: none;
}

/* ------------------------------------------------------------

	footer

------------------------------------------------------------ */

#footer ul li{
	list-style: none;
	display: inline;
}

/* ------------------------------------------------------------

	global

------------------------------------------------------------ */

abbr, acronym{
	cursor: help;
	border-bottom: 1px dotted;
}
a img {border: none;}
legend{
	color: #3A3A38; 
	font-weight: bold;
}
small {font-size:11px}
hr {
	margin: 1em 0;
	background:#CCC;
	height:1px;
	color:#212224;
	border:none;
	clear:both;
}

address { 
	margin-top: 1.5em; 
	font-style: italic; 
}
del { color: #000; }

blockquote { margin: 1.5em; }
strong { font-weight: bold; }
em, dfn { font-style: italic; }
dfn { font-weight: bold; }
pre, code { 
	margin: 1.5em 0; 
	white-space: pre; 
}
pre, code, tt { 
	font: 1em monospace; 
	line-height: 1.5; 
}
tt { 
	display: block; 
	margin: 1.5em 0; 
	line-height: 1.5; 
}

.hide,#blog-categories br, #blog-archives br, #blog-rss-feeds br, form br{ display: none; }
.clear{clear:both;}
.highlight {color:#E17000}
.subdued {color:#999}
.error {
	color:#c00;
	font-weight:bold;
}
.success {
	color:#390;
	font-weight:bold;
}
.caption {
	color:#999;
	font-size:11px;
}

.image-left {
	float: left;
	margin: 0 10px 15px 0;
}
.image-right {
	float: right;
	margin: 0 0 10px 15px;
}

/* ExtraContent CSS */

.column { float: left;padding: 20px 0; }
.one { width: 100%; }
.two { width: 50%; }
.three { width: 33%; }
.four { width: 25%; }
.five { width: 20%; }
.two3rds { width: 66%; }
.three4ths { width: 75%; }
.four5ths { width: 80%; }
.column .content { width: 90% ! important; margin: 0 auto; padding: 0 ! important; float: none ! important;}

#myExtraContent1, #myExtraContent2{
	padding: 0 20px;
	font-size: 1.1em;
	line-height: 1.6em;
	height: 1%;
	overflow: hidden;
	
	-webkit-border-radius: 5px; -moz-border-radius: 5px;
	border: 1px solid #ddd;
}

#myExtraContent2{	
	-webkit-border-radius: 5px; -moz-border-radius: 5px;
	border: 1px solid #ddd;
	color: #333;
}

/* ------------------------------------------------------------

	browser issues

------------------------------------------------------------ */

.floatclear:after{
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
.floatclear {display: inline-table;}

* html .floatclear {height: 1%;}
.floatclear {display: block;}

