@charset "utf-8";
body  {
	font: 62.5% Arial, Verdana, Helvetica, sans-serif;
	line-height:1.8em;
	background: #eee url(../images/background-eva-fritz.jpg) repeat-x;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #2C3338;
}
* {margin:0; padding:0;}
a{text-decoration:none; color:#890115;}
a:hover{color: #DA052B;}
img {border:none;}

/*STRUCTURE*/
#wrapper { 
	width: 960px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #eee url(../images/content-bg.jpg) center repeat-y;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
} 
#header { 
	background: url(../images/eva-fritz-visual-artist.png); 
	padding: 0 10px 0 20px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	height: 152px;
} 
#header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	text-indent:-10000px;
	border:none;
	padding: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
#sidebar1 {
	float: right; /* since this element is floated, a width must be given */
	width: 250px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	padding: 15px 20px 15px 10px;
}
#mainContent { 
	margin: 0 300px 0 0; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding:15px 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
#mainContent.wide { margin: 0;}


/*display*/
h1, h2, h3, h4 {font-family:"Trebuchet MS"; margin:0.7em 2%; }
h1 {	
	font-size:2.2em;
	border-bottom:1px dotted #666666;
	padding: 0 0 5px 0 ;
	}
h2 {font-size:1.8em;}
h3 {font-size:1.4em;}
.exhibition h3 {background:#161616; color:#FFFFFF;padding:0.3em; width:400px;}
.exhibition p span {font-weight:bold; margin-right:10px;}

p {font-size:1.2em; margin:0.7em 2%;}
span.normal{font-weight:normal;}

#sidebar1 h2 {
	font-family:"Trebuchet MS";
	font-size:1.8em;
	background:#0D0B0C;
	padding:5px ;
	color:#F5F5F5;
	}
/*lists
---------------------------------------*/
#sidebar1 ul{margin:0.7em 5% 0.7em 10%; }
#mainContent ul{margin:0.7em 5% 0.7em 10%; font-size:1.2em;}

/*media box
---------------------------------------*/
/* new clearfix */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
.media-box {padding: 10px;	margin:5px 10px; border:1px solid #dadad8; text-align:left; background-color:#FFFFFF; width:95%;}
.media-box a:link, .media-box a:visited { color: #ED3D29; }
.media-box a:hover { text-decoration: underline; color:#FF3300; }
.media-box h2 {	font-size: 1.4em;font-family:Georgia, "Times New Roman", Times, serif;	font-style:italic;	font-weight:normal;	padding-bottom: 2px; margin: 5px 10px;	color:#C2BFAB;}
.media-box p {	margin: 10px 10px;	font-size: 1.2em;	line-height: 1.5em;}
.media-box img {float:left; margin:0 10px 0 0;}

#footer { 
	padding: 10px 20px 10px 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	height:80px;
	background: url(../images/footer-painter.jpg) bottom no-repeat; 
} 
/*Footer Columns
---------------------------------------*/
#twitter{margin:5px 10px;}
#portfolio {
	padding: 20px 20px;	
	color: #555;
	text-align:center;
	}
#portfolio a:link, #footer a:visited { color: #ED3D29; }
#portfolio a:hover { text-decoration: underline; color:#FF3300; }

/*Footer Columns
---------------------------------------*/
.portfolio-column {
	float: left;
	width: 245px;
	margin-right: 20px;
	padding-bottom:10px ;
	color: #413f3e;
	background:#181816;
	text-align:left
}

.portfolio-column h2 {
	font-size: 1.4em;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	font-weight:normal;
	border-bottom: 1px solid #dbd3d0;
	padding-bottom: 2px;
	margin-left:10px;
	color:#C2BFAB;
}
.portfolio-column p {
	margin: 15px 10px;
	font-size: 1.2em;
	line-height: 1.5em;
}
.portfolio-column img {
	border:1px solid #fff;
	margin:10px;
}
/*Flickr
---------------------------------------*/

#flickr_badge_image1.flickr_badge_image, #flickr_badge_image2.flickr_badge_image, #flickr_badge_image3.flickr_badge_image { margin: 15px 0 10px 10px;}
#flickr_badge_image1.flickr_badge_image, #flickr_badge_image4.flickr_badge_image { margin-left: 0; }
.flickr_badge_image img {
	margin: 0;
	padding: 5px;
	border: 1px solid #ccc;
	background: #F7F7F7;
	line-height: 0;
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clear { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
hr {
	margin:0.7em 2% 0 2%;
	border-top: 1px dotted #00567e;/*the border*/
	width: 98%;
	height: 1px;
	border-right: 0 none;
	border-bottom: 0 none;
	border-left: 0 none;
}