/*
Theme Name: Affective Design
Theme URI: http://affectivedesign.com
Description: The theme for AffectiveDesign.com
Version: 1.0
Author: Joel Adria
Author URI: http://jole.ca/
*/

/* -- GLOBAL & WRAP DECLARATIONS -- */
body {
	margin:0em;
	padding:0;
	height:100%;
	color:#000000;  
	text-align:center;
	background: url(img/bg.png) repeat-x #e9e9e9;
	font-size: 67.5%;
	font-family: Arial, sans-serif;
	
}

a {
	color: #979797;
	text-decoration:underline;
}

a img {
	border:none;
}

a:hover {
	color:#616161;
	text-decoration:none;
}

blockquote {
	margin:1em;
	padding:.5em .5em .5em 85px;
}

blockquote p {
	margin:.2em;
	color:#000000;
}

hr {
	border:none;
	width:99%;
	clear:both;
	height:1px;
	margin-left: auto;
	margin-right: auto;	
}

#centerWrap { 
	margin:0 auto;
	width:910px;
	padding: 0px 32px 0px 32px;
	text-align:left;

}


#tab-page {
	width:100%;
	padding-top: 15px;
/*	background: url('img/bg.jpg') repeat-x;	*/
/*	border-top: 1px solid #e5e4e4;*/
}

/* -- HEADER DECLARATIONS -- */


#headerBg {
	width:100%;
}

#headerCenterWrap {
	margin:0 auto;
	padding: 0px 32px 0px 32px;
	width:910px;
	text-align:left;
	overflow:hidden;
}

#header {
	margin:0 0 0 0;
	padding:0 0 0 0;
	height:42px;
}

#header h1 {
	margin:0 0 -14px 10px;
	padding:10px 0 0 .9em;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:lighter;
	letter-spacing:.15em;
	color:#000000;
}

#header h2 {
	margin:-34px 0px 0 180px;
	padding:0 0 0 30px;
	font-weight:300;
	font-size: 1.6em;
	letter-spacing:.1em;
	color:#555599;
}


#logo {
	margin-top:20px;
}	

#searchBar { 	
	font-size:0.8em;
	float:right;
	width: 341px;
	height: 40px;
	margin-top:-2px;
	text-align:left;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	background: url(img/searchbar.png) no-repeat;
	color:#fff;
}

#searchBar-RSS {
	float:left;
	position:relative;
	left: 13px;
	top: 8px;
	margin:0;
}

#searchBar-links {
	float:left;
	display:block;
	width:115px;
	margin-top: 10px;
	font-size: 1.3em;
}
#searchForm {
	float:left;
	margin-left: 24px;
	margin-top:1px;
/*	width: 298px;*/
	height:40px;
	font-size: 0.95em;
}

#searchBar input.box {
	margin-left: 20px;
	margin-top: 1px;
	color: #999999;
	width: 120px;
	height: 13px;
	font-size: 1.2em;
}

#searchSubmit {
	position:relative;
	top:7px;
	margin-left:0px;
}

#searchBar a {
	text-decoration:none;
	color:white;
}

#searchBar a:hover {
	text-decoration:underline;
}

/* new tabs, thanks to http://rubiqube.com/wordpress-tutorial-rounded-corner-tab-menu-using-css/ */
#navbar { 
	width:910px; 
	margin: 25px 0px 0px 0px;
	height: 28px;
	margin-bottom:0px;
}


#navtabs { 
    list-style: none; 
    padding: 0; 
    height: 30px; 
    font-weight: bold; 
    text-transform: uppercase; 
    margin-bottom:0;
    padding:0;
    margin:0;
} 
 
#navtabs li { 
    float: left; 
    background: url('img/tableft.png') no-repeat left top; 
    padding: 8px 0 8px 14px; 
    font-weight:normal;
    letter-spacing:0.05em;
} 
 
#navtabs li a { 
    background: url('img/tabright.png') no-repeat top right; 
    padding: 8px 14px 8px 0; 
    text-decoration:none;
    color: #414042; 
} 

#navtabs li a:hover { 
    text-decoration:none;
    color: #3333cc; 
} 
 
#navtabs li.current_page_item, #navtabs li.current_page_parent { 
	position:relative;
	bottom: 2px;
	padding-bottom: 12px;
    background: #fff url('img/tableft_active.png') no-repeat left top; 
    border-bottom: 1px solid #fff;
} 
 
#navtabs li.current_page_item a, #navtabs li.current_page_parent a { 
    background: #fff url('img/tabright_active.png') no-repeat right top; 
    padding: 8px 14px 10px 0;   
    color: #000066; 
    font-weight:bold;
    border-bottom: 1px solid #fff;    
}


#breadcrumb {
	margin: 0 0 12px 2px;
	color: #b5b6b8;
	clear:both;
	
}


#breadcrumb a {
	color: #b5b6b8;
	text-decoration:none;
}

#breadcrumb a:hover {
	color: #808285;
	text-decoration:underline;
}

/* -- SIDEBAR DECLARATIONS -- */

#sidebar-right {
	float:right;
	width:175px;
	margin: 0 2px 0 0;
}

.sidebar {
	float:left;
	width:180px;
	padding:0 0 0 0;
	margin: 0 12px 0 2px;
}

.sidebar h2 {
	font-size: 1.2em;
	line-height:100%;
	margin: 5px 0 7px 0;
        letter-spacing:0.01em;
	
}

.sidebar h2 a {
	text-decoration:none;
	color: #2b286d;
	text-transform:uppercase;
}


.sidebar h2 a:hover {
	color: #4b4680;
	text-decoration:underline;
}


.sidebar ul {
	font-size: 1.1em;
	margin:0; 
	margin-top:10px;
	padding:0; 
	list-style-type:none;
}

.sidebar li {
	display:inline;
	margin:0; 
	padding:0; 
	letter-spacing:0.01em;
}
.sidebar li a {
	display:block; 
	margin:0; 
	text-decoration:none; 
	color:#6666cc;
	margin:10px 0 0 0; 
}		

.sidebar li a:hover {
	text-decoration:none; 
	color:#000066; 
}

.sidebar li.current_page_item a {
	color:#000066;	
	font-weight: bold;
}

.sidebar p {
	font-family:Arial, Helvetica, sans-serif;
	margin:0 0 0 0;
        letter-spacing:0.01em;
}

.sidebar p a {
	text-decoration:none;
}

.sidebar h3 {
	font-size:1.1em;
	color: #6666cc;
	text-transform: uppercase;
	margin-bottom:4px;
	margin-top:0;
        letter-spacing:0.01em;
}

.sidebar select {
	margin-bottom:7px;
}

.sidebar h3 a {
	color: #6666cc;
	text-decoration:none;
}

.sidebar h3 a:hover {
	color: #1100cc;
	text-decoration:underline;
}


/* twitter for twitter */


h4#twitter-user {
	font-weight:bold;
	font-size: 1.1em;		
	font-family:Arial, Helvetica, sans-serif;
	margin-bottom:4px;
	margin-top:0px;
	text-decoration: none;
        letter-spacing:0.01em;
}


h4#twitter-user a {
	color: #111177;
	text-decoration: none;
}

h4#twitter-user a:hover {
	color: #000033;
	text-decoration: underline;
}	

.sidebar .twitter {
	margin-left: 15px;
	list-style-type: square;
	color: #808285;
}

.sidebar .twitter li {
	display:list-item;
	font-family:Arial, Helvetica, sans-serif;
 	font-size: 0.9em; 
        color: #000000;
	margin-bottom: 15px;
        letter-spacing:0.01em;
}

.sidebar .twitter li span {
	font-family:Arial, Helvetica, sans-serif;
}

.sidebar .twitter li span a {
	display:inline;
        color: #0a1266;
	text-decoration: none;
}

.sidebar .twitter li span a:hover {
	display:inline;
        color: #0a1266;
	text-decoration: underline;
}

.sidebar .twitter-timestamp {
	font-weight: bold;
}

.sidebar .twitter-follow {
	margin-left: 13px;
}


.quote-box {
	text-align:center;
	color: #7478CF;
	padding: 0 17px 0 17px;
}

.quote-box h4 {
	font-family:Arial, Helvetica, sans-serif;
	margin-left:0;
	color: #414042;
	font-size: 1.35em;
	font-weight:bold;
        line-height:18px;
        letter-spacing:0.01em;
}

.quote-box span {
	display:block;
	margin-top: 10px;
	color: #333333;
	font-size: 0.9em;

}

.blue-hr {
	background-color: #ccdbea; 
	color: #ccdbea; 	
	height:2px;
	margin-top: 18px;
	margin-bottom:18px;
}


.bluebox {
	width:171px;
	background-image: url('img/bluebox.png');
	background-position: top-left;
	background-repeat:no-repeat;
	padding:0px 5px 5px 5px; 
	overflow: hidden;	
}

.bluebox h4 {
	font-size: 1.1em;
	margin:12px 0 0 8px;
	height: 18px;
	text-transform:uppercase;
	font-weight:normal;	
}


.bluebox h4 a {
        color: #414042;
	text-decoration:none;
}

.bluebox h4 a:hover {
        color: #3333cc;
	text-decoration:none;
}

.bluebox-img {
	border-right: #c1c1c1 solid 1px;  	
	border-bottom: #c1c1c1 solid 1px;  	
	margin: 7px 0px 0px -5px;
	padding:0;
	position: relative;
	height: 80px;
	width:180px;
	overflow: hidden;
}

.bluebox-txt {
	background-color:white;
	color: #000000;
	width:159px;
	border-left:#cccccc solid 1px;	
	border-right:#cccccc solid 1px;		
	padding: 10px 10px 15px 10px;
	margin: 0px 0px 0px -5px;	
}

.bluebox-link {
	color: #333399;
	text-decoration:none;
	text-align: right;
}

.bluebox-link a {
	color: #333399;
}

.bluebox-link a:hover {
	color: #000000;
	text-decoration:underline;
}

.bluebox-foot {
	background: url('img/bluebox-foot.png');
	background-repeat: no-repeat;
	background-position: bottom left;
	margin-top: -10px;
	height:9px;
	width:180px;
}

.bluebox h5, h5 a {
	font-size: 1.05em;
        color:#0a1266;
	padding:3px 2px 0 1px;
	margin-top:0;
	margin-bottom:4px;
	text-decoration:none;
}

.bluebox h5 a:hover {
	color: #000000;
	text-decoration: underline;
}

.bluebox p {
	font-family:Arial, Helvetica, sans-serif;
	padding: 0 0 0 2px;	
}




/* -- MAIN CONTENT & HELPFUL DECLARATIONS -- */

#page-content {
	padding:1px 20px 20px 20px;
	background-color:#fff;
	margin:0 0 0 0;
	color: #6d6f71;	
	font-size: 1.2em;
	width:488px;
	overflow: hidden;
	position:relative;
}

#page-content h2 {
	font-size: 1.90em;
	margin:0px 5px 5px 0px;
	color:#333388;
        letter-spacing:0.01em;
}

#page-content h2 a {
	color: #333388;
	text-decoration:none;
}


#page-content small {
	font-size: 0.80em;
        font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	color:#000000;
        letter-spacing:0.01em;
}


#page-content small a {
	font-size: 0.80em;
        font-weight:bold;
	color:#000090;
        text-decoration:none;
	margin:0px 0px 15px 0px;

}

#page-content p small a {
	font-size: 0.80em;
        font-weight:bold;
	color:#000090;
        text-decoration:none;
        letter-spacing:0.01em;
}


#page-content p small a:hover {
	font-size: 0.80em;
        font-weight:bold;
	color:#000090;
        text-decoration:underline;
        letter-spacing:0.01em;
}

#page-content h3 {
	font-size: 1.35em;
	margin:16px 5px 0px 0px;
	color:#555599;
        letter-spacing:0.01em;
}

#page-content h4 {
	font-size: 1.1em;
	font-family:Arial, Helvetica, sans-serif;
	margin:2px 5px 10px 0px;
	color:#333399;
        letter-spacing:0.01em;
}


#page-content h4 a {
	font-family:Arial, Helvetica, sans-serif;
	text-decoration:none;
	margin:2px 5px 4px 0px;
	color:#333399;
}

#page-content h4 a:hover {
	text-decoration:underline;
	color:#000000;
}

#page-content h5 {
	font-size: 1.325em;
	font-weight:100;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	margin:8px 0px 8px 0px;        
        line-height:22px;
        letter-spacing:0.01em;
}

#page-content h5 a:hover {
	text-decoration:underline;
	color:#000000;
}

#page-content p {
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.075em;
	margin:8px 0px 8px 0px;        
        line-height:20px;
        letter-spacing:0.01em;
}

#page-content p a {
	color: #000000;
	text-decoration:none;
}

#page-content p a:hover { 
	color: #000000;
	text-decoration:underline;
}

#page-content p a:visited, #page-content p a.more-link {
	color: #2b286d;
}

#page-content ul {
	color: #000000;
	font-size: 1.075em;
        line-height: 20px;
	font-family:Arial, Helvetica, sans-serif;
}

#page-content ul a {
	color: #000090;
        line-height: 20px;
	font-family:Arial, Helvetica, sans-serif;
        text-decoration:none;
}


#page-content ul a:hover {
	color: #000090;
        text-decoration:underline;
}

#page-content li {
	color: #000000;
        line-height: 20px;
	font-family:Arial, Helvetica, sans-serif
        text-decoration:none;
}

#page-content li a {
	color: #333388;
        line-height: 20px;
	font-family:Arial, Helvetica, sans-serif
        text-decoration:none;
}

#page-content li a:hover {
	color: #000090;
}

#list {
       margin: -5px 0px 26px 0px;
}

.entry {
	color: #6d6f71;
	margin:20px 0px 0px 0px;
	padding-bottom: 10px;
        letter-spacing:0.012em;
}

.entry h3 {
	letter-spacing:0.01em;
	margin:0px 0px 0px 0px;
}

.entry h3 a {
	color: #000066;
	text-decoration:none;
}

.entry h3 a:hover {
	color: #000033;
}

.entry p {
	color: #6d6f71;
	font-family:Arial, Helvetica, sans-serif;
        letter-spacing:0.0125em;
}
		

.entry-image {
	float:left;
	margin-right:12px;
	position: relative;
	height:75px;	
	width:100px;
	overflow: hidden;
	border:none;
	border: 1px solid #e9e9ea;
}
.entry-image a img {
	border:none;
}

.list-entry {
	color: #000000;
	margin-top:20px;
	height:75px;
	font-size: 1.075em;
        line-height:20px;
	font-family:Arial, Helvetica, sans-serif;
/*	font-family:"Verdana";*/
}

.list-entry p {
	margin-top:0;
        letter-spacing:0.0125em;
}

.list-entry h3 {
	font-size: 1.1em !important;
	font-family:Arial, sans-serif;
	margin:0px 0px -14px 0px;
	height:20px;
        letter-spacing:0.0125em;
}

.list-entry h3 a {
	color: #0a1266;
	text-decoration:none;
	margin:0;	
}

.list-entry h3 a:hover {
	color: #000000;
	text-decoration:underline;
}		

.list-entry-image {
	float:left;
	margin-right:13px;
	position: relative;
	height:75px;	
	width:100px;
	overflow: hidden;
	border:none;
	border: 1px solid #999999;
}


.list-entry-image a img {
	border:none;
}


.barepic {
	border:none;
}

.right {
	float:right;
	margin:5px;
	padding:2px;
}

.left {
	float:left;
	margin:5px;
	padding:2px;
}

.center {
	width:auto;
	margin-left:auto;
	margin-right:auto;
}


.alignleft {
	float:left;
	margin-right: 7px;
}

.alignright {
	float:right;
	margin-left: 7px;
}

.commentlist {
	font-family:Arial, Helvetica, sans-serif;
}

.commentlist a {
	color: #333399;
	text-decoration:none;
}



/* -- HOMEPAGE-SPECIFIC DECLARATIONS -- */

#cell_1 {
	margin: 0 0 0 0px;
	float:left;
	width: 455px;
	background: #b3c1e1 url('img/cell_1bg.png') no-repeat;
	height:294px;
	border: 1px solid #999999;
	border-right:none;
	overflow:hidden;
	font-size: 1.6em;
}    

#cell_1 h2 {
	font-family:arial;
	color:#0a1266;
	font-weight:bold;
	line-height:1em;
	margin: 40px 25px 10px 30px;
	font-size: 2.2em;
        letter-spacing:0.01em;
}       

#cell_1 p {
	margin: 10px 30px 10px 31px;
	font-family:Arial, Helvetica, sans-serif;
	color: #000000;
        letter-spacing:0.01em;
*#58595b;*
}

#cell_1 a {
	float:right;
	color:#000033;
	margin:0px 15px 0 0;
*474747;*
}

#cell_3 {
	margin:0 0 15px 0px;
	float:left;
	width:451px;
	background-color:#cccccc;
//	background-image: url('img/main_background1.jpg');
	height:294px;
	border: 1px solid #999999;
	padding:0;
/*b5bdc9*/
}


/* IE likes it better this way... */
#cssbox-wrapper {
	clear:both;
	height:12px;
	width:920px;
}

/* CSS Box describes the 4 blue boxes on the homepage ONLY */
/* set the image to use and establish the lower-right position */ 
.cssbox {
	float:left;
	width:219px;
	height: 204px;
        background-image: url('img/demobox4.png');
	background-position: top-left;
	background-repeat:no-repeat;
        margin: -3px 11px 0px 0px;
	overflow: hidden;	
}

.cssbox h4 {
	height: 18px;
	font-size: 1.1em;
	text-transform:uppercase;
	margin:12px 0 0 16px;
        letter-spacing:0.01em;
}

.cssbox h4 a {
	color: #ffffff;
	text-decoration:none;	
}

.cssbox-img {
	border-left: #aaa9a9 solid 1px;	
	border-right: #aaa9a9 solid 1px;  	
	border-bottom: #aaa9a9 solid 1px;  	
	margin: 7px 0px 1px 0px;
	padding:0;
	position: relative;
	height: 80px;
	width:217px;
	overflow: hidden;
}

.cssbox-txt {
	color: #333333;
	width:184px;
	height: 80px;	
	padding: 0 0 0 0;
	margin: 9px 8px 0px 16px;
}

.cssbox-link {
	text-align: right;
        letter-spacing:0.01em;
}

.cssbox-link a {
	color: #6d6f71;
	text-decoration:underline;
}


.cssbox h3 {
	font-size: 1.1em;
	padding:2px 2px 0px 1px;
	margin-top:0px;
	margin-bottom:4px;
        letter-spacing:0.01em;
}

.cssbox h3 a {
	text-decoration:none;
	color:#0a1266;
}

.cssbox h3 a:hover {
	text-decoration:underline;
	color:#000000;
}

.cssbox h5 a:hover {
	color: #000033;
	text-decoration: underline;
}

.cssbox p {
	font-size: 1.0em;	
	font-family:Arial, Helvetica, sans-serif;
        color: #000000;	
        margin: 0 0 0 0;
	padding: 0 0 0 2px;
        letter-spacing:0.01em;	
}

#homepage-widgets {
	margin-top: 0px;
	height: 170px;
	overflow:hidden;
	background: url('img/home-widgets.png') no-repeat;
	width:925px; /* 910px + 15px margin on the last div.box */
}

#homepage-widgets div.box {
	float:left;
	padding: 0px 2px 5px 15px;
	width: 198px !important; /* intended total box width - padding-right(next) */
        width: 198px; /* IE Win = width - padding */
        margin: 0px 15px 0px 0px; /* use to position the box */ 
        height: 180px;
}

#homepage-widgets div.box h3 {
	font-size: 1.2em;
	text-transform: uppercase;
	margin-bottom: -5px;
	margin-top: 20px;
	color: #6666cc;	
        letter-spacing:0.01em;
}

#homepage-widgets div.box h3 a  {
	color: #6666cc;	
        text-decoration:none;
}

.home-widget-height {
	height: 78px;
	overflow:hidden;
}

#homepage-widgets div.box h4 a {
	color: #0a1266;
	text-decoration: none;
}

#homepage-widgets div.box h4 {
	font-family:Arial, Helvetica, sans-serif;
	margin-bottom:4px;
	margin-top:15px;
	font-size: 1.1em;
}


#homepage-widgets div.box h4 a:hover { 
	color: #000000;
	text-decoration: underline;
}

#homepage-widgets div.box a {
	color: #6666cc;
	text-decoration:none;
}

#homepage-widgets div.box div {
	color: #000000;
	font-family:Arial, Helvetica, sans-serif;
}



/* Twitter on the homepage */

#homepage-widgets div.box .twitter {
	list-style-type:none;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}


#homepage-widgets div.box .twitter h4 {
	font-family:Arial, Helvetica, sans-serif;
	margin-bottom:4px;
	margin-top:15px;
	font-size: 1.1em;
        letter-spacing:0.01em;
}


#homepage-widgets div.box .twitter h4 a:hover { 
	color: #000000;
	text-decoration: underline;
}

#homepage-widgets div.box .twitter li {
	color: #0000000;
	font-family:Arial, Helvetica, sans-serif;
	height: 45px;
        letter-spacing:0.01em;
}


#homepage-widgets div.box .twitter li a {
	color: #0a1266;
	text-decoration: none;
}

#homepage-widgets div.box .twitter li a:hover{
	text-decoration: underline;
}

#homepage-widgets div.box .twitter-follow {
	margin-top:10px;
}
	


/* -- FOOTER DECLARATIONS -- */
#lower_nav ul {
	clear:both;
	margin:8px 0 6px 0;
	padding:0;
	height: 1em;
	font-size: 0.9em;
	text-align:center;
	text-transform: uppercase;
	color: #828181;	
}

#lower_nav ul li {
	display:inline;
	padding-left:5px;
	padding-right:5px;
	border-right: 1px solid #9f9f9f;
        letter-spacing:0.01em;
}

#lower_nav ul li.last_menu, #lower_nav ul li:last-child  {
	border:none;
}
#lower_nav a {
	text-decoration:none;
	color: #9f9f9f;
}

#footer {
	position:relative;
	clear:both;
	bottom:0;
	margin:0px 0 0 0;
	padding:0 0 20px 0;
	line-height:2em;
	text-align:center;
	
	color: #9f9f9f;
}

#footer p {
	margin-bottom:0;
}

#foot_hr {
	background-color:#c0bebe;
	color:#c0bebe;
	width:500px;
	text-align:center;
	margin-left:auto;
	margin-top:13px;
}

#spacer_hr {
	background-color: #eaeae8;
	color: #eaeae8;
	height:1px;
}

.more-link {
	margin-top:1em;
	display:block;
	float:right;
	clear:both;
}


#page-gallery {
	border: 1px solid #aaa; 
	width:451px; 
	height:294px; 
	margin:10px auto;
}
