/*markbeadles.css*/
/* designed and (c) Sept 2009 mark beadles except where noted */
/* created for markbeadles.com */
/* tested on FF, IE, Chrome, Safari (Win), Opera mini  (BB)*/


/* baseline default declarations */
body {
	background:#000000 url('penrose3.png') no-repeat scroll top left;
	color:white;
	font-family:Verdana, sans-serif;
	font-size:14px;
	margin: 0;
	padding: 0;
	border: 0;   
	width:100%;
	min-width:600px;	
}

/* contrasting text against the background */
.contrast {
	color:white;
}

/* hyperlink anchor styles */
a, a:visited {
	color:black;
	text-decoration:underline;
	outline:none;
}

a:hover, a:active, a:focus {
	color:#F26101;
	text-decoration:underline;
	outline:none;
}


 /* I don't want hyperlink borders around badges for other websites. The verbs on the badges are enough to indicate they're links. */
 .badge {
	display:block;
	border:0px;
}

a img.badge {
	border:none;
}

/*headings*/
#maintitle {
	font-family:"Trebuchet MS", sans-serif;
	font-size:32px;
	color:#F26101;
	font-weight:bold;
	}


.subtitle{
	font-family: "Trebuchet MS", sans-serif;
	font-size: 14px;
	color:#DDDDDD;
	margin-top:-20px;
	font-weight:bold;
	font-style:italic;
	margin-bottom:0px;
	}
	
h1 {
	font-family:"Trebuchet MS", sans-serif;
	font-size:24px;
	color:black ;
}

h2 {
	font-family:"Trebuchet MS", sans-serif;
	font-size:20px;
	color:/*#F26101;*/#999999;
}	

	
/*quotations */

blockquote {
	color:black;
	margin:12px 24px;
	padding:12px 32px;
	background: /*#999999*/ url("quote-black.gif") no-repeat 0 0;
}

/*in a quote, attribute the author in italics, preceded by a hyphen */
.author { display: block;
       text-align: right; 
       border: none;
	   font-style:italic;
       }
	   
.author:before {
	content: "-";
}

/*layout*/

#header {
	//background: #000000;
	//background-image:url('penrose2.png');
	clear:both;
	float:left;
	width: 100%;
	margin-top:20px;
	border-bottom:1px solid #000000;
}
	
#menu {
	margin-top:10px;
	font-family:"Trebuchet MS", sans-serif;
	font-size:20px;
	font-weight:bold;
	color:#DDDDDD;
}

#menu a, #menu a:visited  {
	color:  #999999;
	text-decoration:none;
	}

#menu a:hover, #menu a:active, #menu a:focus {
	color: #F26101;
	text-decoration:none;
}

#footer {
	//background: #000000;
	//background-image:url('penrose2.png');
	clear: both;
	float:left;
	width: 100%;
	text-align:center;
	font-family:Georgia, serif;
	font-size:12px;
	color:white;
}

#footer a, #footer a:visited  {
	color: white;
	text-decoration:underline;
}

 #footer a:hover, #footer a:active, #footer a:focus {
	color:#F26101;
	text-decoration:underline;
 }
 
 
 /*cross-browser compatible resizable column layout */
/*based on code from http://matthewjamestaylor.com*/


/* column container */
.column_container {
	clear:both;
	overflow:hidden;	
}
	
/* common column_container _* settings */
.column_container, .column_container_left {
	float:left;
	width:100%;			/* width of page */
	position:relative;    /* This fixes the IE7 overflow hidden bug */
}
	
.main_column, .right_column {
	float:left;
	position:relative;
	padding:0 0 1em 0;	/* no left and right padding on columns */
	overflow:hidden;
	}
	
/* 2-column interface settings */
.two_columns {
	//background:#000000;		/* right column background colour */
	//background-image:url('penrose2.png');
}

.two_columns .column_container_left {
	right:25%;			/* width of the right column */
	//background:#000000;	/* left column background colour */
	//background-image:url('penrose2.png');
}

.two_columns .main_column { 
	width:71%;			/* width of main column content (column width minus padding on either side) */
	left:27%;
	color:black;
}

.two_columns .right_column { 
  //background: #000000;
  //background-image:url('penrose2.png');
	width:21%;			/* Width of right column content (column width minus padding on either side) */
	left:31%;			
}


/*rounded corners from http://www.roundedcornr.com/ */
/*if you change the color scheme you need to change the images */

/*main content box*/
.roundedcornr_box_main { 
   float: left;
  width: 100%;
  background: white;
}

.roundedcornr_top_main div {
   background: url(roundedcornr_whiteblack_tl.png) no-repeat top left;
}

.roundedcornr_top_main {
   background: url(roundedcornr_whiteblack_tr.png) no-repeat top right;
}

.roundedcornr_bottom_main div {
   background: url(roundedcornr_whiteblack_bl.png) no-repeat bottom left;
}

.roundedcornr_bottom_main {
   background: url(roundedcornr_whiteblack_br.png) no-repeat bottom right;
}

.roundedcornr_top_main div, .roundedcornr_top_main, 
.roundedcornr_bottom_main div, .roundedcornr_bottom_main {
   width: 100%;
   height: 30px;
   font-size: 1px;
}


/*side boxes*/
.roundedcornr_box_side {
   background: #DDDDDD;
}
.roundedcornr_top_side div {
   background: url(roundedcornr_grayblack_tl.png) no-repeat top left;
}
.roundedcornr_top_side {
   background: url(roundedcornr_grayblack_tr.png) no-repeat top right;
}
.roundedcornr_bottom_side div {
   background: url(roundedcornr_grayblack_bl.png) no-repeat bottom left;
}
.roundedcornr_bottom_side {
   background: url(roundedcornr_grayblack_br.png) no-repeat bottom right;
}

.roundedcornr_top_side div, .roundedcornr_top_side, 
.roundedcornr_bottom_side div, .roundedcornr_bottom_side {
   width: 100%;
   height: 10px;
   font-size: 1px;
}

/*content-containing boxes */

/*main content area */

.maincontent{
  margin: -30px 30px;
  color:black;
  background:white;
 }

 /*distinctive first letter of paragraphs */
.maincontent p:first-letter{
	font-family:"Trebuchet MS", sans-serif;
	font-size:24px;
	text-transform:lowercase;
	font-weight:bold;
	line-height:100%; /*FF does not respect line-height */
}

.maincontent .subtitle{
	font-family: "Trebuchet MS", sans-serif;
	font-size: 14px;
	color:#F26101;
	margin-top:-20px;
	font-weight:bold;
	font-style:italic;
	margin-bottom:0px;
	}	

.maincontent ul{
	font-size:12px;
}

.maincontent li {
	margin-bottom:1em;
}

.maincontent div p {
	font-size:12px;
}


/*right-hand content areas */
.rightcontent { 
	margin: 0 10px; 
	color:black;
	font-size:12px;
}
.rightcontent img{
	float:left;
	vertical-align:text-top;	
	margin-right:10px;
	border-style:none;
}

/* special image declarations for portraits */
 .maincontent .portrait {
	border:3px solid #999999;
	margin:3px;
 }

 .rightcontent .portrait {
	border:1px solid black;
 }
 

/* end markbeadles.css */