/* Css for elenawebdesigner.com */

/* RESET
*[accesskey]:hover:after {content:' [' attr(accesskey) ']'; } */
* {outline:0;}
html, body, h1, h1, h3, h4, p, form, ul, ol, li {margin:0; padding:0;}

/* TAGS */
body {font-family:Georgia, Arial, Verdana; font-size:90%; color:#000; background-color:#fff;}
h1 {font-size:1.7em; padding:.4em; margin:0; font-weight:normal;}
h2 {font-size:1.4em; padding:.4em; margin:0; font-weight:normal;}
h3 {font-size:1.1em; padding:.4em .6em; margin:0; color:#555;}
p  {font-size:1em; padding:.4em .7em; margin:0;}

a:link {color:#c00; text-decoration:underline;}
a:visited {color:#c00; text-decoration:underline; background-color:#f7f6e1;}
a:hover, a:active {color:#000; text-decoration:underline;}
a img {border:0;}
	
acronym {color:#000; background-color:transparent;}
acronym:hover {border-bottom:.1em dotted; cursor:help;}
abbr {color:#c00; background-color:transparent;}
abbr:hover {border-bottom:.1em dotted; cursor:help;}

fieldset {border:0;}
label {display:block; font-size:1em; padding:.3em; overflow:hidden;}
label span {display:block; width:7em; float:left; text-align:right; margin-right:1em; font-size:1.1em; font-weight:bold;}
label input, label textarea {padding:.3em .5em; font:1em Georgia, Arial, Verdana; width:22em; border:1px solid #ccc; background:#f7f6e1 url('../imgs/gradient-transparent-white.png') repeat-x top left;}

/* GENERAL CLASSES */
.fl {float:left;}
.fr {float:right;}
.separator {clear:both; display:block; width:98%; height:1px; margin:auto; border-bottom:1px dashed #777;}

/* MAIN CONTAINER */
.minWidth {position:relative; overflow:hidden; width:100%; max-width:1280px; margin:auto;}

/* HEADER */
#header {background-color:#000;}
#header #logo {padding:.4em 2.2em; font-size:1.5em; font-weight:bold; color:#fff;}
#header #logo strong {display:block; font-size:1.3em;}
#header #getInTouch {float:right; font-size:.9em; margin:.2em 3em;}
#header #getInTouch a {display:block; color:#000; background-color:#fff; padding:.1em .2em; text-decoration:none;}
#header #getInTouch a:hover {text-decoration:underline;}
#header #nav {position:absolute; right:3em; margin-left:24em; bottom:0; font-weight:bold;}
#header #nav ul {margin:0; padding:0; list-style:none;}
#header #nav ul li {float:left; margin:4px 2px 0 0; padding:0 0 0 10px; background:url('../imgs/left-both.gif') no-repeat left top; border-bottom:1px solid #000;}
#header #nav ul li a {float:left; display:block; width:.1em; padding:5px 15px 4px 6px; color:#fff; background:url('../imgs/right-both.gif') no-repeat right top; text-decoration:none;}
#header .minWidth > #nav ul li a {width:auto;}
#header #nav ul li a:hover {color:#333;}
#header #nav ul li#current {background-position:0 -150px; border-width:0; margin-top:-7px; margin-left:-2px;}
#header #nav ul li#current a {background-position:100% -150px; color:#333; padding:12px 15px 8px 6px; font-size:1.1em;}
#header #nav ul li:hover, #header #nav li:hover a {background-position:0 -150px; color:#333;}
#header #nav ul li:hover a {background-position:100% -150px;}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#header a {float:none;}
/* End IE5-Mac hack */

/* BODY */
#body .col-50 {width:49.9%; overflow:hidden;}
#body #hIntro, #body #hPortfolio, #body #hContact, #body #portfolio, #body #about, #body #contact {padding:3em;}
#body .top {padding:2.25em .4em .4em .4em; text-align:center; clear:both;}

	/* contact form (home page and contact page) */
	#hContact, #contact {width:40em; margin:auto;}
	#hContact h1, #contact h1 {margin-left:10.5em;}
	#contactForm fieldset #send {margin-left:27.3em; padding:.3em .5em; font:1em Georgia, Arial, Verdana; background:url('../imgs/grad-top-red-bot-darkred.gif') center repeat-x; border:1px solid #ccc; color:#fff; font-weight:bold;}
	#contactForm fieldset > #send {margin-left:28.2em;}
		/* ajax messages */
		#body #contact .message, #body #hContact .message {margin:0 3.3em 1em 5.6em; padding:.9em; font-weight:bold; text-align:center; display:none;}
		#error {color:#d00;}
		#error ul {list-style:disc inside; margin:.5em .5em .5em 3em; font-weight:normal; color:#000; text-align:left;}
		/* buggy #error ul li {display:block;} */
		#thanks {color:green;}

	/* home */
	#body #hIntro p {padding-bottom:1em;}
	#body #hIntro strong {font-size:1.3em; font-weight:normal;}
	#body #hPortfolio div {float:left; width:102px; height:97px; margin:1em 1.7em 1em .2em; padding:3px;}
	#body #hPortfolio p {clear:both; text-align:right; margin-right:2em;}
	#body #hPortfolio a:visited {background-color:#fff;}
	
	/* portfolio */
	#body #portfolio .col-50 img {padding:1em;}
	#body #portfolio .col-50.fl {display:inline-block; text-align:center; min-width:376px;}
	#body #portfolio .col-50.fl a:visited {background-color:#fff;}
	#body #portfolio h2 {display:inline-block;}
	#body #portfolio > h2 {display:block;}	
	#body #portfolio h3 {padding-top:3.5em;}
	#body #portfolio ul {margin-left:1.3em; margin-top:.5em; float:left; width:15em;}
	#body #portfolio ul li {list-style:inside; padding:.2em;}
	#body #portfolio ul.tick {margin-left:1.2em; width:13em;}
	#body #portfolio ul.tick li {list-style:none; background:url('../imgs/icon-tick.gif') left no-repeat; color:#555; padding:.2em 1.5em;}
	#body #portfolio #webDevelopment {margin-top:2.5em; clear:both;}
	
	/* about */
	#body #about p#downloadCv {padding:0 0 2em .5em;}
	#body #about h2 {border-bottom:1px solid #ddd; margin-top:1.2em;}
	#body #about h3 {float:left; font-size:1em; padding:.4em 1em .4em .2em; color:#000;}
	#body #about em a {margin-right:1em;}
	#body #about ul {padding:.3em 1.7em;}
	#body #about ul li {padding:.3em;}
	#body #about .date {font-size:.9em; clear:left; float:left; width:10.8em;}
	
	/* contact */
	#body #contact p {text-align:center; padding-bottom:1.3em;}
	

/* FOOTER */
#footer {border-top:9px solid #000; padding:.5em 2.8em 1.5em 2.8em; overflow:hidden; font-size:.9em;}
#footer p {margin:0 1.5em 0 .5em; text-align:center;}
#footer p span {margin:0 1.5em;}
#footer p span em {margin:0 .6em;}