/*
------------------------------------------------------
=CSS INFORMATION
------------------------------------------------------
Copyright (C) Paul Redmond 2010.
If you want to use a portion of this CSS file, do drop me a line.*/

/*
------------------------------------------------------
=CLEARING
-----------------------------------------------------*/
.clear{clear:both;}
.clearfix:after{content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
/* End hide from IE-mac */

/*
------------------------------------------------------
=MAIN STRUCTURE
------------------------------------------------------*/
body{font-family:Georgia, Arial, serif; font-size:62.5%; background:#fff url(../images);}
.r {float:right;}
.l {float:left;}

a:link {color: #4172C0;}
a:hover {color: #CC0000;}
a:visited {color: #004477;}
a:active {color: #4172C0;}

p {font-family: Georgia, "Times New Roman", Times, serif; font-size: 14px; color: #666;}

a[href^="http://"] {background:transparent url(../images/ex.gif) repeat-y scroll right 0; padding-right:13px;}
a[href^="http://"]:hover, cite a:hover {background-position:right 200px;}

/*
------------------------------------------------------
=TITLES
-----------------------------------------------------*/
h1 {font-family: Georgia, "Times New Roman", Times, serif; font-size:2.0em; color:#666; font-weight:normal; margin-top:4px; margin-bottom:2px;}
h2 {font-family: Georgia, "Times New Roman", Times, serif; font-size:1.8em; color:#999; font-weight:normal; margin-top:10px; margin-bottom:4px;}
h3 {font-family: Georgia, "Times New Roman", Times, serif; font-size:1.5em; color:#1E4D9D; font-weight:normal; margin-top:4px; margin-bottom:4px;}

h2.work {background-color: #eee; color: #333; padding: 6px 0px 6px 6px;}
h3.work {margin: 6px 0px 8px 0px;}

/*
------------------------------------------------------
=CONTAINER
-----------------------------------------------------*/
#container{width:788px; height: auto; margin-left: auto; margin-right: auto; text-align:left;}

/*
------------------------------------------------------
=NAVIGATION
-----------------------------------------------------*/
#container #menu li{float:left; width:157px; display:inline;}
#container #menu li a{display:block; padding:10px 0px 10px 44px; text-decoration:none; color:#000; font-size:16px; background:#fff; border-left:1px solid #CCC; width:112px;}
#container #menu li a:hover{display:block; padding:10px 0px 10px 44px; text-decoration:none; font-size:16px; color:#fff; background:#261919;}
#container #menu li a span{margin:0px; display:block; font-size:13px; color:#000;}
#container #menu li a:hover span{color:#fff;}
#container #menu li.last{border-right:1px solid #CCC;}
/*
------------------------------------------------------
=BODY
-----------------------------------------------------*/
#container #logo{height: auto; width: 788px; margin-top: 12px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
#container #logo img {margin: 14px 0px 12px 0px; border: none;}
#container #intro {height: auto; width: 788px; margin-top: 14px; padding: 0px 0px 14px 0px; border-bottom: 1px solid #ccc;}
#container #intro p {font-family: Georgia, "Times New Roman", Times, serif; font-size: 24px; text-align: justify; color: #666; font-weight: normal;}

#container #boxleft {height: auto; width: 250px; float: left; margin: 4px 5px 0px 0px; padding: 0px 7px 0px 0px; border-right: solid 1px #ccc;}
#container #boxmiddle {height: auto; width: 250px; float: left; margin: 4px 5px 0px 4px; padding: 0px 7px 0px 2px; border-right: solid 1px #ccc;}
#container #boxright {height: auto; width: 240px; float: left; margin: 5px 4px 0px 4px; padding: 0px 6px 0px 2px;}
#container .box p {text-align: justify; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 12px; color: #666;}
#container .box img {border: solid 3px #999;}
#container .box img:hover {border: solid 3px #666;}
#container .box img a {border: none;}

#container #contact {height: auto; width: 788px; margin-top: 12px;}

#container .socialbox {height: 64px; width: 200px; margin: 0px 6px 0px 0px; padding: 4px 4px 4px 0px;}
#container .socialbox img {float: left; margin-right: 4px;}
#container .socialbox p {font-size: 16px; color: #666;}
#container .socialbox span {font-size: 12px; color: #036;}

#container .blogimage {border: solid 2px #999; margin-top: 8px;}
#container .blogimage:hover {border: solid 2px #666;}

#container .aboutme {text-align: justify;}
#container .workbox {height: 172px; width: auto; margin: 6px 0px 6px 0px; padding: 4px 0px 4px 0px; border-bottom: dotted 1px #399;}
#container .workbox img {margin-right: 10px; margin-top: 6px; border: solid 2px #999;}
#container .workbox img:hover {border: solid 2px #666;}
#container .workbox p {width: auto; padding-top: 4px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 13px; text-align: justify;}

#container .workbox ul.doc {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 12px; margin-top: 14px; margin-left: 2px;}
#container .workbox ul.doc li {display: inline; padding-left: 20px; padding-bottom: 2px; margin-right: 8px; background:url(../images/icons/image.png) no-repeat;}

#container blockquote {margin: 20px 0px 20px 0px; padding: 2px 12px 12px 12px; background-color: #E6E6E6; -moz-border-radius: 4px;}
#container blockquote p {font-size: 14px; font-style: italic; color: #94593F; line-height: 18px; letter-spacing: 0.04em; margin-top: 10px;}
#container blockquote p.author {text-align: right; font-size: 15px; font-weight: bold; color: #666;}


/*
------------------------------------------------------
=FOOTER
-----------------------------------------------------*/
#footer{height: auto; width: 780px; margin-top: 14px; padding: 8px 0px 6px 8px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; font-family:Georgia, "Times New Roman", Times, serif; font-size: 11px; color: #666;}
#footer p {font-size: 12px;}