/* CSS Stylesheet - css/default.css - www.iangraham.org - design by Creative Creature - www.creativecreature.ca */ 
                                           
/* NOTE: 	All selectors prefaced by html > body will only display in standards-compliant browsers (Firefox, IE7, etc)
			This is used as a workaround to provide graphics/display options for IE6 and lower 
*/

/* BODY */
	html, body { 
		margin: 0px; 
		padding: 0px;  
		font-family: "Optima", "Lucida Grande", "Helvetica Neue", "Calibri", "Franklin Gothic Book", "Helvetica", "Arial", "Univers", sans-serif;  		
		color: #333333;
		font-size: 15px;
	    min-width: 800px;  /* min-width only works on Firefox/Mozilla */
		line-height: 1.5;  
	}
	body {            
	    background: #6BB6CB;
		background-image: url("../images/gradient_bg.png");
		background-repeat: repeat-x;     
		margin: 0px 20px 0px 20px;
	}
	blockquote.codeSample {
			font-family: "consolas", "Lucida Typewriter", "courier new", "courier", fixed, monospace ; 
			font-size: 90%; 
	}
	
/* HEADINGS */
	h1, h2, h3, h4, h5, h6 {
		margin: 0px;
		padding: 0px;
		font-family:  "Baskerville", "Palatino Linotype", "Georgia", "Times New Roman", "Times", serif;
		font-weight: lighter; 
	}
	h1 {
		letter-spacing: -1px;
		color: #017599;
		font-size: 26px;
	}   
	h2 {
		letter-spacing: -1px;
		color: #42A9CD;
		color: #017599;
		font-size: 22px;    
	}
	h3 {
		color: #666666;
		color: #017599;
		font-size: 18px;
	}
	h4 {
		color: #42A9CD;
		color: #017599;
		font-style: italic;
		font-size: 18px;
	}      
	/* PAGE HEADING & SUBHEADING*/ 
	span#pageheading {
		padding: 12px 0px 0px 0px;  
		margin: 0px 0px 0px -5px;
		font-size: 28px;  
		font-weight: normal;
		float: left;
	}
	span#pagesubheading {
		padding: 22px 0px 0px 10px;  
		margin: 0px 0px 0px -5px;
		font-size: 20px;     
		letter-spacing: normal;
		color: #EEEEEE;
		font-weight: normal;
		float: left;
	}	         

/* PRINT HEADER */	
	/* The Print Header is hidden online */
	div#printHeader {   		
		display: none;  
	}        
	
      
/* LINKS */
	a         { text-decoration: none; }
	a:link    { color: #42A9CD; }
	a:visited { color: #777777; }
	a:active  { color: #017599; }
	a:hover   { text-decoration: underline; color: #017599; }

	/* Remove borders from images */
	img {border: none;}

/* LAYOUT */
	/* HEADER */
	div#header {
		background-image: url("../images/header_bg.png");
		background-repeat: repeat-x; 
		background-color: #B1B1B1;    
	    border-left: 1px solid #444444; 
	    border-right: 1px solid #444444; 
	}
	
	/* BANNER */
	div#banner    {
		height: 54px;
		padding: 0px 20px 0px 20px;   
		min-width: 600px;
	}    	   
	/* Banner Links */
	div#banner a:link, div#banner a:visited  {
		color: #FFFFFF; 
		text-decoration: none; 
	}
	div#banner a:hover {
		color: #FFFAE3; 
		text-decoration: underline;
	}  
	
	/* SEARCH */
	div#search {
		float: right;  
		margin: 8px 0px 0px 0px;
		padding: 12px 0px 0px 0px;    /* Add this if removing search checkboxes */
		color: #FFFFFF;
	}  
	  		
	/* MAIN DIV*/
	div#main  {  
		background-color: #FFFFFF;             
		padding: 0px;
		margin: 0px;
	    border-left: 1px solid #444444; 
	    border-right: 1px solid #444444;     
	}    
	div#main p {
		margin: 5px 0px 10px 0px;
	}      
    /* Columns */                                            
	div#leftCol, div#content {
		padding: 10px 20px 10px 20px;
		background-image: url("../images/main_bg.png");
		background-repeat: repeat-x;
		background-color: #FFFFFF;     
	}     
        /* Added #sidebar toset formatting for blog sidebar */
	div#rightCol, div#sidebar {
		float: right;   
		width: 280px;
		padding: 5px 10px 5px 10px; 
		margin: 20px 0px 10px 20px;  
		font-size:  85%;; 
		border: 1px solid #CCCCCC;
		background-color: #FFFAE3; 
		/* font-family: "Baskerville", "Garamond", "Georgia", "Garamond", "Times New Roman", serif ; */  
		/* font-family:  "Baskerville", "Palatino Linotype", "Georgia", "Times New Roman", "Times", serif;  -- FROM HEADING */ 
		color: #666666;   
	}      
		html > body div#rightCol { margin: 0px 0px 10px 20px;  }
		html > body div#sidebar  { margin: 0px 00px 10px 20px; } /* Different positinong for blogs */

	/* FOOTER */
	div#footer { 
		padding: 5px;
		background-image: url("../images/footer_bg.png");
		background-repeat: repeat-x;     
		border: 1px solid #444444; 
		color: #DDDDDD;
		font-size: 12px;
	}     
	div#footer ul {
		margin: 0px 14px;     
		padding: 0px;
		list-style-type: none;
		display: inline-block;
		clear: both;   
	}                         
		html > body div#footer ul { margin: 0px auto 0px auto; display: table; }      
	div#footer ul li {
		float: left;  
		display: block;
		padding: 0px 3px;;  
		margin: 0px;
	}
	/* Footer Links */
	div#footer a         { text-decoration: none; }
	div#footer a:link    { color: #FFFFFF; }
	div#footer a:visited { color: #FFFFFF; }
	div#footer a:active  { color: #FFFAE3; }
	div#footer a:hover   { text-decoration: underline; color: #FFFAE3; }  
		
	/* FIGURES */
	div.figure {
		/* font-family: "Georgia", "Garamond", "Times New Roman", serif; */
		/* font-family: "Garamond", "Georgia", "Times New Roman", serif;       */
		/* font-family:  "Baskerville", "Palatino Linotype", "Georgia", "Times New Roman", "Times", serif;  -- FROM HEADING */ 
		padding: 5px 10px 0px 10px;
		color: #666666;   
		margin: 0px 0px auto auto;
	}    

/* LISTINGS  inside address tables inside rightCols */
	div.address_right table th  {text-align: left; 
		font-weight: normal; 
		white-space: nowrap;
}
	div.address_right table.address {
		padding-top: 0em; 
		margin-top: 0.0em; 
	}
/* end Listings */ 

	div.leftFigure, div.rightFigure {
		width: 250px;  
		padding: 10px 20px 0px 10px; 
		border: 1px solid #DDDDDD;
		background-color: #FFFAE3; 
		/* font-family: "Georgia", "Garamond", "Times New Roman", serif;  */ 
		/* font-family: "Garamond", "Georgia", "Times New Roman", serif;       */ 
		/* font-family:  "Baskerville", "Palatino Linotype", "Georgia", "Times New Roman", "Times", serif;  -- FROM HEADING */ 
		color: #666666;   
		font-size: 12px; 
	}
	div.leftFigure {
		float: left;
		margin: 0px 20px 10px 0px;
	}    
	div.rightFigure {
		float: right;
		margin: 0px 0px 10px 20px;
	}    
	
/* NAVIGATION */
	div#navigation  {
		background-image: url("../images/nav_bg.gif");
		background-repeat: repeat-x;  
		clear: left; /* so if text is resized on Firefox, navbar appeas below the page banner/title */
		height: 30px;
		padding: 0px 10px 0px 10px;
		margin: 0px;
	}
	/* Menu Lists */
	ul.menubar {
		font-size: 14px;
		display: block; 
		margin: 0px;
		padding: 0px;     
	}  	
	ul.menubar li {
		float: left; 
		display: block; 
		margin: 0px;  
	}             
	ul.menubar li a, ul.menubar li a:link, ul.menubar li a:visited {
		display: block;
		padding: 8px 10px 0px 10px;
		margin: 0px 0px;  
		color: #017599;
	}
	ul.menubar li a:hover, ul.menubar li a:active {
		color: #42A9CD; 
		text-decoration: underline;
	}
	ul.menubar li.current {
		width: 110px;
		height: 30px;
		padding: 0px 0px 0px 5px;
		margin: 0px -5px -3px 0px; 
		background-image: url("../images/menu_bg_active.gif");
		background-repeat: no-repeat;     		
	}
		html > body ul.menubar li.current {
			background-image: url("../images/menu_bg_active.png");
			margin: 0px -5px 0px 0px; 
		}
	ul.menubar li.current a, ul.menubar li.current a:link, ul.menubar li.current a:visited {
		color: #FFFFFF;  
		text-align: center;
		padding: 6px 13px 0px 0px;
		margin: 0px 0px 5px 0px;  
	}
	ul.menubar li.current a:hover, ul.menubar li.current a:active {
		color: #FFFFFF;  
		text-decoration: underline;
	}
	/* SUBMENUS */
	ul.menubar ul.submenu {
		display: none;  
	}
	ul.menubar li:hover ul.submenu, ul.menubar li ul.submenu:hover {
		display: block;
	}
	ul.menubar li ul.submenu li a, ul.menubar li.current ul.submenu li a {
		padding: 0px;
	}
	ul.submenu {
		position: absolute; 
		background-image: url("../images/submenu_bg.png");
		background-repeat: repeat-x;     
		color: #DDDDDD;
		padding: 2px 6px 5px 6px; 
		margin: -2px 0px 0px 0px; 
		height: 20px;
		font-size: 12px;
		border: 1px solid #666666;
  	}
	ul.submenu li {
		padding: 2px; 
		margin: 0px;  
	} 
	ul.submenu li a, ul.submenu li a:link, ul.submenu li a:visited {
		color: #EEEEEE; 
		margin: 0px;
		padding: 0px;
	}
	ul.submenu li a:hover, ul.submenu li a:active {
		color: #FFFFFF; 
		text-decoration: underline;
	}

	/* BREADCRUMBS */
	div#breadcrumbs { 
		padding: 3px 0px 5px 0px; 
		margin: 0px;
		height: 15px;    
		border-bottom: 1px solid #888888;   
		background-image: url("../images/breadcrumbs_bg.png");
		font-size: 11px;
		color: #EEEEEE; 
	}      
	/* Breadcrumb List */
	div#breadcrumbs ul {   
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 20px;
		list-style-type: none;   
	}                 
	div#breadcrumbs li, div#breadcrumbs li a {
		float: left; 
		display: block;
		padding: 0px 3px 0px 0px;  
		margin: 0px;
	}	  
	div#breadcrumbs li.arrow {
		width: 10px;              
		height: 10px;  
		padding: 0px 2px;
		background-image: url("../my_icons/arrow.gif");
		background-repeat: no-repeat;
		margin: 3px 1px;
	}	  
	div#breadcrumbs li.current {
		padding: 1px 0px 0px 3px;  
		margin: -1px 0px;    
	}             
	/* PRINT CONTROL */
	div#printControl {
		float: right;               
		background-image: url("../images/breadcrumbs_bg.png");
		font-size: 11px;   
		margin: 0px 10px 0px 0px;
	}                
		html > body div#printControl {
			margin-right: 22px;
		}
	/* Breadcrumb & PrintControl Links */
	div#breadcrumbs a, div#printControl a         			{ text-decoration: none; }
	div#breadcrumbs a:link, div#printControl a:link    		{ color: #FFFFFF; }
	div#breadcrumbs a:visited, div#printControl a:visited 	{ color: #FFFFFF; }
	div#breadcrumbs a:active, div#printControl a:active 	{ color: #FFFFFF; text-decoration: underline;}
	div#breadcrumbs a:hover, div#printControl a:hover  		{ color: #FFFFFF; text-decoration: underline;}
	
/* FORMS */      
	input.searchField {
		color: #aaaaaa;   
		font-size: 11px;
		padding: 2px;
	}    
		html > body input.searchField { height: 12px; }
	input.searchField:hover, input.searchField:focus {
		background-color: #FFFFFF; 
	}  
	.button {
		background-image: url("../images/footer_bg.png");
		background-repeat: repeat-x;     
		color: #FFFFFF;
	}
	.button:hover {
		background-image: url("../images/gradient_bg.png");
	}
	   
/* LISTS */
	div#main ol, div#main ul {
	/*	color: #666666;                                   */
		padding: 0px 0px 5px 30px; 
		margin: 5px;
	}                     
	div#footer ul {
		color: #EEEEEE;                                  
		padding: 0px;
	}         
	div.figure ul, div.figure ol {
		color: #666666;           
		padding: 0px 0px 5px 0px;    
	}  
	div#main ol.footnote  { font-size: 90% }	                     

/* ICONS */
	.arrowicon {
		margin: 3px 0px 0px 0px;
		border: 0px;  
	}

/* ELEMENTS */
	hr {
		width: 80%;
		border: 1px solid #EEEEEE;
	}
   
/* LINK ICONS */
	/* External Links */
	a[href ^="http://"] { 
		background: url("../my_icons/external.gif") center right no-repeat; 
		padding-right: 13px; 
	} 
	/* Stop external link icons in this domain, and suppress external link on Creative Creature in the footer */
	a[href ^="http://www.iangraham.org"], div#footer a[href ^="http://www.creativecreature.ca"] { 
		background: transparent; 
		padding-right: 0px; 
	} 
	/* Stop external link icons from showing on linked images */
	img a[href ^="http://"]:link { 
		background: transparent; 
		padding-right: 0px; 
	}            
	/* Secure (HTTPS) Links */
	a[href ^="https://"], .link-https { 
		background: url("../my_icons/secure.gif") center right no-repeat; 
		padding-right: 14px;
	} 
	/* Email Links */
	a[href ^="mailto:"], .link-mailto { 
		background: url("../my_icons/email.gif") center right no-repeat; 
		padding-right: 14px; 
	} 
	/* News Links */
	a[href ^="news://"] { 
		background: url("../my_icons/news.gif") center right no-repeat; 
		padding-right: 14px; 
	} 
	/* FTP Links */
	a[href ^="ftp://"], .link-ftp { 
		background: url("../my_icons/ftp.gif") center right no-repeat; 
		padding-right: 14px; 
	} 
	/* IRC Links */
	a[href ^="irc://"], .link-irc { 
		background: url("../my_icons/irc.gif") center right no-repeat; 
		padding-right: 14px; 
	}  
	
/* HIDDEN ELEMENTS */
	*.hidden, *.hide { display: none }  /* default style for hiding stuff */
	*.floatRight { float: right; }      /* default style for floating things right */    
	.divider { clear: both; }