/*CFK Editor Styles */
@import url("x2_fck.css");

h1
{
	font-size:18pt;	
}

h2
{
}
.title-2
{
	padding-left:30px;
}
.title-1
{
}

/*Common container styles*/
.article_content
{
	padding-left:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-top:0px;
	margin-left:0px;
	margin-left:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-top:0px;
	
}
.article_content_inner
{
	padding-left:0px;
	padding-right:0px;
	padding-bottom:0px;
	padding-top:0px;
	margin-left:0px;
	margin-left:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-top:0px;
}
.branding-top
{
	background: url(dnn_large_banner.png) no-repeat top left;
	width: 890px;
	height: 427px;
	clear: both;
	overflow: hidden;
}
.branding-top p
{
	padding: 0px 60px 0 60px;
	font-size: 1.4em;
	color: #333;
}
.branding-bottom
{
	clear: both;
	margin-top: 1em;
	overflow: hidden;
}
.branding-bottom ul
{
	list-style: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	clear: both;
}
.branding-bottom li
{
	list-style: none;
	margin: 0 10px 0 0;
	padding: 0;
	display: block;
	width: 170px;
	float: left;
}

.branding-bottom li.feeds
{
	margin: 0;
}

.branding-bottom dl
{
	background: url(itembg.gif) repeat-y;
	margin: 33px 0 0 0;
	padding: 0 10px;
}
.branding-bottom dd
{
	margin-left: 10px;
	height: 66px;
}
.branding-bottom dt
{
	font-size: 90%;
	text-align: center;
	padding-top: 65px;
	margin-bottom: 1.75em;
	font-weight: bold;
}
.branding-bottom .commmunity
{
	background: url(community_title.gif) no-repeat top left;
}
.commmunity dt
{
	background: url(community_icon.gif) no-repeat;
	background-position: 50% 10px;
}
.branding-bottom .marketplace
{
	background: url(marketplace_title.gif) no-repeat top left;
}
.marketplace dt
{
	background: url(marketplace_icon.gif) no-repeat;
	background-position: 50% 10px;
}
.branding-bottom .conferences
{
	background: url(conferences_title.gif) no-repeat top left;
}
.conferences dt
{
	background: url(conferences_icon.gif) no-repeat;
	background-position: 50% 10px;
}
.branding-bottom .training
{
	background: url(training_title.gif) no-repeat top left;
}
.training dt
{
	background: url(training_icon.gif) no-repeat;
	background-position: 50% 10px;
}
.branding-bottom .feeds
{
	background: url(feeds_title.gif) no-repeat top left;
}
.feeds dt
{
	background: url(feeds_icon.gif) no-repeat;
	background-position: 50% 10px;
}
dl.bt
{
	margin: 0;
	padding: 0;
	background: url(item_bt_bg.gif) no-repeat bottom;
	height: 32px;
	width: 170px;
}
div.link_adminguide
{
	float: left;
	background: url(dnn_adminguide.png) no-repeat top left;
	width: 316px;
	height: 137px;
	cursor: pointer;
}
div.link_proedition
{
	float: right;
	background: url(dnn_proedition.png) no-repeat top left;
	width: 514px;
	height: 137px;
	cursor: pointer;
}
div.link_main
{
	margin: 260px 30px 0px 30px;
}

#LoginInfo
{
	width: 660px;
	float: left;
}
#LoginInfo h3
{
	background-color: #f7f7f7;
	color: #8f0000;
	padding: 2px 0px;
}
#LoginInfo dd, #LoginInfo dt
{
	display: inline;
}
#LoginInfo dt
{
	font-weight: bold;
	color: #333;
}
#LoginInfo p.LoginNotes
{
	font-size: .8em;
}
#LoginInfo div.LoginBlock
{
	float: left;
	width: 310px;
	padding: 5px 5px;
	margin: 0px 2px;
	border: 1px #f0f0f0 solid;
}
.SponsorIcon
{
	margin: 5px 15px;
	float: left;
}
#QuickLinks
{
	background-color: #f0f0f0;
	border: 1px #cccccc solid;
	padding: 2px 5px;
	margin-right: 5px;
	width: 200px;
	float: right;
}
div.hr
{
	height: 2px;
	background-color: #8f0000;
	margin: 5px 0 15px 0;
	clear: both;
}
div.hr hr
{
	display: none;
}

/**
Stylesheet: Slideshow.css
	CSS for Slideshow.

License:
	MIT-style license.

Copyright:
	Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/).
	
HTML:
	<div class="slideshow">
		<div class="slideshow-images" />
		<div class="slideshow-captions" />
		<div class="slideshow-controller" />
		<div class="slideshow-loader" />
		<div class="slideshow-thumbnails" />
	</div>
	
Notes:
	These next four rules are set by the Slideshow script.
	You can override any of them with the !important keyword but the slideshow probably will not work as intended.
*/

.slideshow
{
	display: block;
	position: relative;
	z-index: 0;
}
.slideshow-images
{
	display: block;
	overflow: hidden;
	position: relative;
}
.slideshow-images img
{
	display: block;
	position: absolute;
	z-index: 1;
}
.slideshow-thumbnails
{
	overflow: hidden;
}

/**
HTML:
	<div class="slideshow-images">
		<img />
		<img />
	</div>
	
Notes:
	The images div is where the slides are shown.
	Customize the visible / prev / next classes to effect the slideshow transitions: fading, wiping, etc.
*/

.slideshow-images
{
	height: 300px;
	width: 400px;
}
.slideshow-images-visible
{
	opacity: 1;
}
.slideshow-images-prev
{
	opacity: 0;
}
.slideshow-images-next
{
	opacity: 0;
}
.slideshow-images img
{
	float: left;
	left: 0;
	top: 0;
}

/**
Notes:
	These are examples of user-defined styles.
	Customize these classes to your usage of Slideshow.
*/

.slideshow
{
	height: 225px;
	margin: 0 auto;
	width: 444px;
}
.slideshow a img
{
	border: 0;
}

/**
HTML:
	<div class="slideshow-captions">
		...
	</div>
	
Notes:
	Customize the hidden / visible classes to affect the captions animation.
*/

.slideshow-captions
{
	background: #000;
	bottom: 0;
	color: #FFF;
	font: normal 12px/22px Arial, sans-serif;
	left: 0;
	overflow: hidden;
	position: absolute;
	text-indent: 10px;
	width: 100%;
	z-index: 10000;
}
.slideshow-captions-hidden
{
	height: 0;
	opacity: 0;
}
.slideshow-captions-visible
{
	height: 22px;
	opacity: .7;
}

/**
HTML:
	<div class="slideshow-controller">
		<ul>
			<li class="first"><a /></li>
			<li class="prev"><a /></li>
			<li class="pause play"><a /></li>
			<li class="next"><a /></li>
			<li class="last"><a /></li>
		</ul>
	</div>
	
Notes:
	Customize the hidden / visible classes to affect the controller animation.
*/

.slideshow-controller
{
	background: url(/assets/images/slideshow/controls/controller.png) no-repeat;
	height: 42px;
	left: 50%;
	margin: -21px 0 0 -119px;
	overflow: hidden;
	position: absolute;
	top: 50%;
	width: 238px;
	z-index: 10000;
}
.slideshow-controller *
{
	margin: 0;
	padding: 0;
}
.slideshow-controller-hidden
{
	opacity: 0;
}
.slideshow-controller-visible
{
	opacity: 1;
}
.slideshow-controller a
{
	cursor: pointer;
	display: block;
	height: 18px;
	overflow: hidden;
	position: absolute;
	top: 12px;
}
.slideshow-controller a.active
{
	background-position: 0 18px;
}
.slideshow-controller li
{
	list-style: none;
}
.slideshow-controller li.first a
{
	background-image: url(/assets/images/slideshow/controls/controller-first.gif);
	left: 33px;
	width: 19px;
}
.slideshow-controller li.last a
{
	background-image: url(/assets/images/slideshow/controls/controller-last.gif);
	left: 186px;
	width: 19px;
}
.slideshow-controller li.next a
{
	background-image: url(/assets/images/slideshow/controls/controller-next.gif);
	left: 145px;
	width: 28px;
}
.slideshow-controller li.pause a
{
	background-image: url(/assets/images/slideshow/controls/controller-pause.gif);
	left: 109px;
	width: 20px;
}
.slideshow-controller li.play a
{
	background-position: 20px 0;
}
.slideshow-controller li.play a.active
{
	background-position: 20px 18px;
}
.slideshow-controller li.prev a
{
	background-image: url(/assets/images/slideshow/controls/controller-prev.gif);
	left: 65px;
	width: 28px;
}

/**
HTML:
	<div class="slideshow-loader" />
	
Notes:
	Customize the hidden / visible classes to affect the loader animation.
*/

.slideshow-loader
{
	height: 28px;
	right: 0;
	position: absolute;
	top: 0;
	width: 28px;
	z-index: 10001;
}
.slideshow-loader-hidden
{
	opacity: 0;
}
.slideshow-loader-visible
{
	opacity: 1;
}

/**
HTML:
	<div class="slideshow-thumbnails">
		<ul>
			<li><a class="slideshow-thumbnails-active" /></li>
			<li><a class="slideshow-thumbnails-inactive" /></li>
			...
			<li><a class="slideshow-thumbnails-inactive" /></li>
		</ul>
	</div>
	
Notes:
	Customize the active / inactive classes to affect the thumbnails animation.
	Use the !important keyword to override FX without affecting performance.
*/

.slideshow-thumbnails
{
	bottom: -65px;
	height: 65px;
	left: 0;
	position: absolute;
	width: 100%;
}
.slideshow-thumbnails *
{
	margin: 0;
	padding: 0;
}
.slideshow-thumbnails ul
{
	height: 65px;
	left: 0;
	position: absolute;
	top: 0;
	width: 10000px;
}
.slideshow-thumbnails li
{
	float: left;
	list-style: none;
	margin: 5px 5px 5px 0;
	position: relative;
}
.slideshow-thumbnails a
{
	display: block;
	float: left;
	padding: 5px;
	position: relative;
}
.slideshow-thumbnails a:hover
{
	background-color: #FF9 !important;
	opacity: 1 !important;
}
.slideshow-thumbnails img
{
	display: block;
}
.slideshow-thumbnails-active
{
	background-color: #9FF;
	opacity: 1;
}
.slideshow-thumbnails-inactive
{
	background-color: #FFF;
	opacity: .5;
}

.slidehead
{
	height: 275px;
}