/*
    NCLEJ Website - Main Stylesheet
    Created by Industrial Media
    www.industrialmedia.ca
*/

/* =General
---------------------------------------------------------------------------------------------------- */
body { 
   background: #666666;
   font-family: verdana, arial, sans-serif;
   margin: 20px 0 0 0;
   font-size: 11px;
}

.clear {
	clear: both;
	height: 1px;
	font-size: 1px;
	width: 100%;
}

.clearit:after { 
    content: ""; 
    display: block; 
    clear: both; 
    height: 0; 
    visibility: hidden; 
}

.clearit { 
    min-height: 0; 
    height: 0; 
}

html>body .clearit { 
    height: auto; 
}

ul, ul li {
	list-style: none;
	margin: 0;
	padding: 0;	
}

/* =Branding
---------------------------------------------------------------------------------------------------- */
#branding {
	text-align: left;
	background: #967D72; 
	width: 980px;
	height: 149px;
	margin: 0;
	padding: 0;
	position: relative;
}

#branding #logo {
	position: absolute;
	top: -8px;
	left: 36px;
}

#branding ul.icons {
	float: right;
	width: 770px
}

#branding ul.icons li {
	float: left;
}

#branding ul.icons li img {
	display: block;
	float: left;
}

#wordmark {
	background: #2C3B7B;
	min-height: 30px;
	height: auto !important;
	height: 30px;
	border-bottom: 10px solid #cc5500;
	clear: both;
}

#wordmark img {
	display: block;
	margin-left: 210px;
}

/* =Layout homepage
---------------------------------------------------------------------------------------------------- */
#home-content-wrapper {
	background: url('../images/wrapper/home-page-bg.gif') 0 0 repeat-y;
}

#home-content {
   background: #ffffff;
   float: left;
   width: 555px;
   color: #000000;
   padding: 0 0 15px 15px;
}

#home-content #intro {
	border-bottom: 1px solid #e5e5e5;
	margin: 20px 0 25px 0;
	padding-bottom: 15px;
}

#home-content #intro p {
	margin: 16px 0 16px 0;
}

#home-content ul li {
	list-style: none;
}

#home-content .highlights {
	background: #eeeeee;
	float: right;
	width: 200px;
	margin: 10px 0 0 15px;
	padding: 20px 10px 10px 0;
	border: 1px solid #dcdcdc;
}

#home-content .highlights ul.items li {
	line-height: 18px;
	list-style: square;
}

#home-content .highlights a {
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
}

#home-content .highlights a:hover, .subscribe a:hover {
   color: #cc5500;
}

/* =Layout
---------------------------------------------------------------------------------------------------- */
#wrapper {
	width: 980px;
	margin: 0 auto;
	position: relative;
}
   
#border-bottom {
	background: #2C3B7B;
	height: 25px;
	width: 980px;
}

#main-content {
	width: 980px;
	background: #ffffff;
	border-bottom: 30px solid #2c3b7c;
}

#content {
   background: #ffffff;
   width: 773px;
   float: left;
   margin: 20px 0 0 0px;
   color: #000000;
   min-height: 300px;
   height: auto !important;
   height: 300px;
   line-height: 1.1em;
}

#text-content {
   padding: 0 20px 10px 15px;
}

#text-content ul li {
   	color: #000000;
   	margin: 0 0 6px 0;
}

#utils {
	margin: 0 0 4px 10px;
}   

#utils a {
	padding-left: 8px;
}

/* Sidebar - right col */
#home-side-bar {
	float: right;
	width: 176px;
	padding: 0 13px 0 13px;
}

#home-side-bar #home-utils {
	float: left;
	list-style: none;
	margin: 20px 0 14px 0 !important;
	padding: 0 !important;
}   

#home-side-bar #home-utils li {
	float: left;
	list-style: none;	
}

#home-side-bar #home-utils li.last {
	padding-left: 6px;
}

#side-bar {
	float: right;
	width: 194px;
	margin: 0 0 0 20px;
}

#sidebox {
	float: right;
	width: 194px;
	background: #f4f5f8;
	color: #696969;
	font-size: 9px;
	font-weight: normal; 
	margin: 0 0 10px 0;
}

#sidebox #sidebox-content {
	padding: 0 10px 10px 17px;
}

#sidebox img {
	display: block;
}

/* =Navigations
---------------------------------------------------------------------------------------------------- */
#top-nav {
	color: #ffffff;
	background: #2C3B7B;
	width: 980px;
	min-height: 30px;
	height: auto !important;
	height: 30px;
	text-align: right;
}

#top-nav p {
	margin: 0 !important;
	padding: 4px 17px 0 0 !important;
}

#top-nav a { 
   color: #ffffff;   
   text-decoration: none;
   padding-left: 8px;
}

#top-nav a:hover { 
   color: #ffffff;
   text-decoration: underline; 
}
  
#left-nav  {
	background: #ffffff;	
	width: 194px;
	float: left;
	margin: 11px 0 0 0;
} 

#left-nav a {
   background: url('../images/wrapper/menu-dashed-line.gif') left bottom no-repeat;
   display: block;
   color: #2C3B7B;
   font-size: 11px;
   font-weight: bold;
   text-decoration: none;
   margin: 5px 0 5px 0;
   padding: 5px 0 10px 18px;
}

#left-nav a:hover {
   color: #CC5500;
   font-size: 11px;
   font-weight: bold;
}

#left-nav a.skip-content-link, #left-nav a.skip-content-link:hover {
	background: none;
	font-weight: normal;
}

#left-nav #sub-nav {
   background: url('../images/wrapper/menu-dashed-line.gif') left bottom no-repeat;   
} 

#left-nav a.divider-off {
   background: none;
   padding: 5px 0 5px 18px;
}

#sub-nav {
   padding: 0 0 8px 18px;
}

#sub-nav a {
   background: url('../images/menu-bullet.gif') top left no-repeat; 
   display: block;
   width: 180px;
   color: #696969;
   font-size: 11px;
   font-weight: normal; 
   padding: 0 0 0 10px;
}

#sub-nav a:hover {
   color: #000088;
   font-size: 11px;
   font-weight: normal;
   text-decoration: underline;
}

/* =Breadcrumb
---------------------------------------------------------------------------------------------------- */ 
#breadcrumb { 
	font-size: 11px;
	color: #666666;
	padding: 0 0 15px 15px;
}

#breadcrumb a, ul#home li a, #sidebar p a {
   font-size: 11px;
   color: #000000;
}

/* =Links
---------------------------------------------------------------------------------------------------- */ 
a, a:focus {
   color: #2C3B7B;
   line-height: 1.3em;
   outline: 0;
} 

a:hover {
   color: #cc5500;
}    

a#home { 
   color: #2C3B7B;
   font-size: 11px;
   font-weight: bold;
   text-decoration: none;
}  

ul#home li a:hover {
	color: #CC5500;
}
 
.pdf, .link {
	list-style: none;
	padding: 0 0 3px 25px;
	min-height: 16px;
	height: auto !important;
	height: 16px;
	line-height: 18px;
	margin-bottom: 12px;
}

.pdf2 {
	list-style: none !important;
	line-height: 16px;
	padding: 0 0 3px 20px;
	min-height: 16px;
	margin-bottom: 12px;
}

ul li.pdf, ul li.link {
	list-style: none !important;
	padding: 0 0 3px 20px;
	margin: 0 0 6px 0 !important;
}

.pdf, .pdf2 {
	background: url('../images/icon-pdf.gif') 0 2px no-repeat; 
}

.link {
	background: url('../images/icon-web.gif') 0 2px no-repeat; 
}

/* =Lists
---------------------------------------------------------------------------------------------------- */ 
#main-content ul {
    padding: 0;
    margin: 0 0 0 20px;
}

#main-content ul li { 
	list-style: square;
	margin: 0 0 6px 0;
	line-height: 18px;
}

#main-content ol li { 
	list-style: decimal;
	margin: 0 0 6px 0;
	line-height: 1.3em;
	font-size: 18px;
}

/* =Typography
---------------------------------------------------------------------------------------------------- */
#main-content p, #main-content blockquote {
   font-family: verdana, arial, sans-serif;
   color: #000000;
   margin: 5px 0 6px 0;  
   line-height: 18px;
}

#main-content td {
   font-family: verdana, arial, sans-serif;
   color: #000000;
 }
  
#main-content h1 { 
   font-size: 20px;
   font-weight: normal;
   color: #c05e1d;
   margin: 2px 5px 10px 0;
   line-height: 1.1em;
} 

#main-content #sidebox h1 {
	margin: 8px 0 10px 0;
	font-size: 14px;
	font-weight: bold;
	color: #2C3B7B;
}

#main-content #content h2 { 
	font-size: 15px;
	color: #2C3B7B;
	font-weight: bold;
	line-height: 1.1em;
	margin: 12px 0 8px 0; 
}

#main-content #content h3 {
	font-size: 13px;
	font-weight: bold;
	color: #967D72;
	line-height: 1em;
	margin: 0 0 4px 0;
	padding-bottom: 0;
}

#main-content h4 {
	color: #333333;
	font-size: 12px;
	margin: 15px 0 6px 0;
}

#main-content h5 {
	color: #666666;
	font-size: 12px;
	margin: 15px 0 3px 0;
}

#main-content h6 {
	color: #999999;
	font-size: 11px;
	margin: 10px 0 0 0;
}

#main-content p.h7 {
	padding-bottom: 0;
	margin: 0;
	padding-top: 7px;

}

#sidebox #sidebox-content p {
	line-height: 16px;	
	font-size: 11px;
}

#footer p {
	margin: 10px 0 14px 0;
}

sup {
	font-size: 8px;
}

/* =Misc: Board Portal
---------------------------------------------------------------------------------------------------- */
div.logout {
	display: block;
	float: right;
	text-align: right;
	margin: 3px 0 0 0;
	padding: 0;
	font-size: 10px;
	padding-left: 10px;
}

#docs {
	margin: 0 0 1em 0;
	padding: 0 0 0 0;
}

#docs h3 {
	margin: 0;
	padding: 0;
}
	
#docs p {
	list-style: square;
	margin-bottom: 0;
}

#docs p.pdf, #docs p.ppt, #docs p.zip, #docs p.doc, #docs p.exe, #docs p.installer, #docs p.msi, #docs p.xls, #docs p.generic, #docs p.gif, #docs p.png, #docs p.jpg {
	list-style: none;
	margin: 5px 0 1em 0px;
	min-height: 32px;
	height: auto !important;
	height: 32px;
	padding: 0 0 0 42px;
}
	
#docs p.pdf {
	background: url('../images/board_icons/icon-pdf.gif') 0 0 no-repeat;
}
	
#docs p.ppt {
	background: url('../images/board_icons/icon-ppt.gif') 0 0 no-repeat;
}
	
#docs p.zip {
	background: url('../images/board_icons/icon-zip.gif') 0 0 no-repeat;
}
	
#docs p.doc {
	background: url('../images/board_icons/icon-doc.gif') 0 0 no-repeat;
}
	
#docs p.xls {
	background: url('../images/board_icons/icon-xls.gif') 0 0 no-repeat;
}
	
#docs p.exe, #docs p.installer, #docs p.msi {
	background: url('../images/board_icons/icon-installer.gif') 0 0 no-repeat;
}
	
#docs p.generic, #docs p.gif, #docs p.jpg, #docs p.png {
	background: url('../images/board_icons/icon-generic.gif') 0 0 no-repeat;
}
	
#docs p.pdf a, #docs p.ppt a, #docs p.zip a, #docs p.doc a, #docs p.exe a, #docs p.installer a, #docs p.msi a, #docs p.xls a, #docs p.generic a {
	display: inline;
	text-decoration: underline;
}

/* =Footer
---------------------------------------------------------------------------------------------------- */
#footer {
	color: #ffffff;
	font-size: 10px;
	line-height: 16px;
}

#footer #footer-left {
	float: left;
	width: 375px;
	padding-left: 17px;
} 

#footer #footer-right {
	float: right;
	width: 375px;
	text-align: right;
	padding-right: 17px;
}
 
#footer a, #footer a:hover {
   color: #ffffff;
   font-size: 10px;
}

/* =Quote box
---------------------------------------------------------------------------------------------------- */
.quote {
	background: #dfe2ef;
	border: 1px solid #787fa2;
	margin: 20px 0 20px 0;
	padding: 12px;
	width: 515px;
}

.left-quote {
	background: #dfe2ef;
	border: 2px solid #2C3B7B;
	margin: 10px 10px 10px 8px;
	width: 143px;
}

.left-quote-items  {
	padding: 10px 10px 10px 14px;
	font-size: 11px;
	color: #2C3B7B;
}

.left-quote-items p {
	font-size: 11px;
	color: #2C3B7B;
}

.left-quote-items p.quoter {
	color: #000000;
	line-height: 14px;
	margin-top: 14px;
}

/* =Forms
---------------------------------------------------------------------------------------------------- */ 
form {
	margin: 0;
	padding: 0;
}

.subscribe {
	background: #eeeeee;
	margin: 14px 0 20px 10px;
	float: none;
	width: 184px;
}

.subscribe .subscribe-content {
	padding: 10px 10px 5px 8px;
}

.subscribe .subscribe-content p {
	font-size: 11px;
	margin: 8px 0 8px 0 !important;
}

.subscribe .subscribe-content form .text-field {
	background: #ffffff;
	height: 22px;
	width: 164px;
	border: 0;
	border-top: 1px solid #bfbfbf;
	border-left: 1px solid #bfbfbf;
	padding: 3px 0 0 3px;
}

.subscribe .subscribe-content h2, .subscribe .subscribe-content form label {
	font-size: 11px !important;
	color: #2C3B7B;
	font-weight: bold;
	line-height: 18px !important;
	margin: 0 0 10px 0; 
}

.validation {
	color: #2C3B7B;
	font-size: 11px;
	font-weight: bold;
}

/* =Misc: Data Table
---------------------------------------------------------------------------------------------------- */
.outer-border {
	border: 2px solid #DDDDDD;
	margin-bottom: 15px;
	padding: 3px 2px 5px 5px;
}

.data {
	border: 1px solid #DDDDDD;
	margin-bottom: 15px;
}

.data th {
	border: 1px solid #DDDDDD;
	padding: 3px 2px 5px 5px;
	background-color: #E8E8E8;
	color: #2C3B7B;
	font-size: 11px;
	text-align: left;
}

.data td {
	border: 1px solid #DDDDDD;
	padding: 3px 2px 5px 5px;
	font-size: 11px;
}

/* =Misc content boxes
---------------------------------------------------------------------------------------------------- */
.don-online {
	background: #f4f4ff;
	border: 2px solid #9999CC;
	font-size: 13px;
	padding: 3px;
}	

.don-online a {
	font-size: 13px;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
}	

.don-online a:hover {
	color: #7B3423;
}

.purple-box {
	background: #f4f4ff;
	border: 2px solid #9999CC;
	font-size: 14px;
	padding: 2px;
	text-align: center;
}	

.purple-box p {
	font-weight: bold;
	margin: 0; 
}	

.red-box {
	border: 2px solid #805A51;
	font-size: 14px;
	padding: 2px;
	text-align: center;
	background: #DACCC9;
	width: 548px;
}

.red-box p {
	font-weight: bold;
	margin: 0; 
}

.red-box a:hover {
	color: #7B3423;
}

.homepage-box {
	border: 2px solid #7B3423;
	font-size: 12px;
	padding: 4px;
	text-align: left;	
}

/* =Misc content boxes
---------------------------------------------------------------------------------------------------- */
.sidebar #exec-director, .sidebar #board-chair {
	width: 190px;
	height: 75px;
}

.sidebar #exec-director, .sidebar #board-chair{
	padding: 40px 0 0 80px;
}

.sidebar #exec-director a, .sidebar #board-chair a {
	color: #666666;
}

.sidebar #exec-director {
	background: url("../images/sidebar_img_exec_director.jpg") top left no-repeat;
}

.sidebar #board-chair {
	background: url("../images/sidebar_img_board_chair.jpg") top left no-repeat;
}