/* ********* PRELOAD ********* */
.preload {background: url(/static/img/extlink.png);}
.preload {background: url(/static/img/minus.png);}


/* ********* GENERAL ********* */
.clear 	{clear: both;}
a		{outline: none;}
html 	{height: 100%; margin-bottom: 1px;}
body 	{background: url(/static/img/background.png) repeat-x; padding-bottom: 50px; text-align: center;}
#wrap 	{margin: 80px auto; text-align: left; width: 960px;}


/* ********* HEADER ********* */
#header h1					{float: left; width: 240px}
#header h1 a 				{float: left; text-decoration: none;}
#header #navbar				{float: left; margin: 15px 0 0 20px;}
#header #navbar li 			{display: inline;}
#header #navbar li a 		{color: #777; font: 10pt arial,sans-serif; margin: 0 10px 0 0; padding: 5px 0; text-decoration: none; text-transform: uppercase;}
#header #navbar li a:hover 	{text-decoration: underline;}
#header #navbar li a.ext:hover {background: url(/static/img/extlink.gif) no-repeat 40px 3px; padding-right: 15px;}
#header #navbar li a#on 	{color: #DD0000;}
#header #header h1 			{color: #000; font: bold 26pt arial,sans-serif; margin: 20px 0 0; text-transform: uppercase;}


/* ********* CONTENT ********* */
#content 					{margin: 30px 0;}

#content #tagline 			{color: #15638C; float: left; font: 20pt helvetica,arial,sans-serif; width: 450px;}
#content #tagline h1		{margin-bottom: 30px;}
#content #tagline h1 strong	{background: #DCEFFA;}
#content #tagline p			{font-size: 12pt; margin-bottom: 10px; text-align: justify;}
#content #tagline p strong	{background: none;}
#content #tagline img		{margin-left: 30px;}

#content #skillset	 				{float: right; width: 400px;}
#content #skillset-skills 			{border: 1px solid #99D1F0; padding: 20px 10px; overflow: hidden;}
#content #skillset-skills li		{display: inline;}
#content #skillset-skills li a		{color: #15638C; font-family:  helvetica,arial,sans-serif; text-decoration: none;}
#content #skillset-skills .level1 	{font-size: 12pt;}
#content #skillset-skills .level2 	{font-size: 16pt;}
#content #skillset-skills .level3 	{font-size: 20pt;}
#content #skillset-skills .level3 	{font-size: 20pt;}
#content #skillset-skill			{border: 1px solid #99D1F0; padding: 10px;}
#content #skillset-skill h2			{border-bottom: 1px dotted #99D1F0; color: #15638C; font: bold 12pt arial,sans-serif; margin-bottom: 10px; padding-bottom: 5px;}
#content #skillset-skill h2	a		{background: #99D1F0; color: #15638C; float: right; font: bold 8pt arial,sans-serif; padding: 2px 5px; text-decoration: none;}
#content #skillset-skill p			{color: #777; font: 9pt verdana,sans-serif; line-height: 1.5; margin-bottom: 10px; text-align: justify}
#content #skillset-skill p a		{color: #15638C;}
#content #skillset-skill p code		{color: #000; font-size: 8pt}
#content #skillset-skill a.more		{border: 1px solid #99D1F0; color: #15638C; font: bold 8pt arial,sans-serif; padding: 2px 5px; text-decoration: none;}

#content #portfolio-project-info			{border-bottom: 1px solid #EEE; color: #15638C; font: bold 12pt arial,sans-serif; padding: 0 0 5px;}
#content #portfolio-project-info span		{color: #15638C; font-weight: normal; margin-right: 10px;}
#content #portfolio-project-info a.ext		{color: #15638C; font: bold 12pt arial,sans-serif; padding: 0 0 5px; text-decoration: none;}
#content #portfolio-project-info a.ext:hover{background: url(/static/img/extlink.png) no-repeat top right; padding-right: 15px;}
#content #portfolio-project-info img		{float: right; margin: 2px 0 0 5px;}
#content #portfolio-root					{border-bottom: 1px solid #EEE; margin-bottom: 30px; padding: 10px 0;}
#content #portfolio-root ul					{}
#content #portfolio-root ul	li				{display: inline; float: left; margin: 5px 10px;}
#content #portfolio-root ul	li a			{border: 1px solid #EEE; color: #15638C; display: block; font: bold 9pt arial,sans-serif; padding: 5px; text-decoration: none; width: 105px;}
#content #portfolio-root ul	li a:hover		{border: 1px solid #15638C;}
#content #portfolio-root ul	li a span		{font-weight: normal;}
#content #portfolio-project					{margin-top: 10px; padding-bottom: 10px;}
#content #portfolio-project-sidebar			{float: left; width: 278px;}
#content #portfolio-project-legend			{color: #777; font: 10pt arial,sans-serif; line-height: 1.5; margin-bottom: 10px;}
#content #portfolio-project-summary			{color: #15638C; font: bold 9pt arial,sans-serif; margin: 20px 0 20px 20px;}
#content #portfolio-project-summary ul		{list-style-image: url(/static/img/bullet.png);}
#content #portfolio-project-summary ul li	{margin: 5px 0;}
#content #portfolio-project-disclaimer		{background: #FEFADE; border: 1px solid #FCDFA3; color: #AA0000; font: italic 9pt arial,sans-serif; line-height: 1.5; margin: 5px 0 30px; padding: 10px;}
#content #portfolio-project img#screenshot	{border: 1px solid #EEE; display: block; float: right; padding: 5px; width: 640px;}
#content #portfolio-project-navbar			{border-top: 3px double #EEE; padding: 10px 0; text-align: right;}
#content #portfolio-project-navbar li		{display: inline;}
#content #portfolio-project-navbar a		{border: 1px solid #EEE; color: #15638C; font: bold 10pt arial,sans-serif; padding: 2px 5px; text-decoration: none;}
#content #portfolio-project-navbar a:hover	{border: 1px solid #15638C;}
#content #portfolio-project-navbar a#s-on	{background: #15638C; border: 1px solid #15638C; color: #FFF;}

#content #contact						{border-bottom: 1px solid #EEE; color: #15638C; font: bold 12pt arial,sans-serif; padding: 0 0 5px;}
#content #contact span					{color: #15638C; font-weight: normal; margin-right: 10px;}
#content #contact-form					{float: left; margin: 30px 30px 30px 0; width:550px;}
#content #contact-form span 			{display: block; font: bold 10pt arial;}
#content #contact-form .error 			{border: 1px solid #DD0000; color: #DD0000; font: 10pt arial; margin: 0 15px 20px; padding: 10px;}
#content #contact-form .success			{background: #DDEEEE; color: green;	font: bold 10pt arial; margin: 0 5px 20px 15px; padding: 10px;}
#content #contact-form em				{font-weight: bold;}
#content #contact-form label 			{color: #333; float: left; font: bold 10pt arial; padding: 5px 5px 5px 15px; width: 100px;}
#content #contact-form input 			{border: 1px solid #CCC; color: #777; float: left; font: 10pt arial; margin-bottom: 10px; padding: 5px; width: 200px;}
#content #contact-form input#currency	{margin-right: 10px; width: 40px;}
#content #contact-form input#budget		{width: 138px;}
#content #contact-form input#subject	{width: 400px;}	
#content #contact-form br 				{clear: both;}
#content #contact-form textarea 		{border: 1px solid #CCC; color: #777; float: left; font: 10pt arial; height: 200px; margin-bottom: 10px; padding: 5px; width: 400px;}
#content #contact-form fieldset.submit	{padding: 10px;}
#content #contact-form button			{margin-left: 110px; padding: 5px 10px;}
#content #thankyou						{float: right; margin: 30px 0 0;}


/* ********* FOOTER ********* */
#footer					{}
#footer ul				{color: #15638C; font: 9pt arial,sans-serif;}
#footer ul li			{display: inline;}
#footer ul li a			{color: #15638C; font-weight: bold; text-decoration: none;}
#footer ul li.right		{float: right;}
#footer ul li a:hover	{text-decoration: underline;}
