/*
Stylesheet For: Dafydd Vaughan V1
URL: http://www.dafyddvaughan.co.uk
Version: v1.0
Author: VSI-Thinking, http://www.dafyddvaughan.co.uk
*/

/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
/* CONTENTS

   A: Universal Elements
      1. Body & Html
      2. Hyperlinks
      3. General Divs
      4. Headings

   B: Structure
      1. Header & Navigation
      2. Content Wrapper
      3. Sidebar
      4. Main Body
	  5. Footer

	C: Modules
                                                               */
/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

/* *********************************************************** */
/* A. Universal Elements                                       */
/* *********************************************************** */

/* ----------------------------------------------------------- */
/* A1. Body & Html                                             */
/* ----------------------------------------------------------- */

html, body {
    background: #1B2948;
    padding: 0px;
    margin: 0px;
}
body, div, p {
	font-family: "Lucida Sans",Arial,Verdana;
	font-size: small;
	color: #82A4F0;
}

/* ----------------------------------------------------------- */
/* A2. Hyperlinks                                              */
/* ----------------------------------------------------------- */

a img {
	border: 0px;
}
a 
{
	color: #F28332;
	text-decoration: none;
}
a:hover 
{
	color: #82A4F0;
	text-decoration: underline;
}	

/* ----------------------------------------------------------- */
/* A3. General Divs                                            */
/* ----------------------------------------------------------- */
div.content { width: 994px; margin: auto auto; }
.clearfix { clear:both; }
.hide { display: none; }

/* ----------------------------------------------------------- */
/* A4. Headings                                                */
/* ----------------------------------------------------------- */

h1 {
    font-size: x-large;
    color: #3A849C;
}
h2.contactme 
{
	background: transparent url(pics/heading-contactme.gif) no-repeat top left;

}
h3.featuredwork {
	background: transparent url(pics/heading-featured.gif) no-repeat top left;
	text-indent: -9999px;
}
h3.whoami, h3.whathaveidone, h3.mythoughts, h3.morefromme,h3.fwdclosed,h2.contactme 
{
	padding: 7px;
	text-indent: -9999px;
	margin: 0px;
}
h3.whoami 
{
	background: transparent url(pics/heading-whoami.gif) no-repeat top left;

}
h3.whathaveidone 
{
	background: transparent url(pics/heading-whathaveidone.gif) no-repeat top left;
	margin-bottom: 23px;
	margin-top: 30px;
}
h3.morefromme
{
	background: transparent url(pics/heading-morefromme.gif) no-repeat top left;
	margin-bottom: 23px;
	margin-top: 30px;
}
h3.mythoughts 
{
	background: transparent url(pics/heading-mythoughts.gif) no-repeat top left;
}
h3.fwdclosed 
{
	background: transparent url(pics/design/h2-fychanclosed.gif) no-repeat top left;
}
h4 {
	font-size: 120%;
	color: #FFFFFF;
	font-weight: bold;
	margin-top: 0px;
}
h1.fromPortfolio, h2.fromPortfolio, h3.fromPortfolio, h4.fromPortfolio {
	background: transparent url(pics/from-portfolio.gif) no-repeat top right;
	padding-right: 130px;
}
h1.fromBlog, h2.fromBlog, h3.fromBlog, h4.fromBlog {
	background: transparent url(pics/from-blog.gif) no-repeat top right;
	padding-right: 130px;
}
h1.fromProjects, h2.fromProjects, h3.fromProjects, h4.fromProjects {
	background: transparent url(pics/from-projects.gif) no-repeat top right;
	padding-right: 130px;
}
/* *********************************************************** */
/* B. Structure                                                */
/* *********************************************************** */

/* ----------------------------------------------------------- */
/* B1. Header & Navigation (Network)                           */
/* ----------------------------------------------------------- */

div#network {
	height: auto !important;
	height: 55px;
	min-height: 55px;
	padding-top: 10px;
	background: #2C4275 url(pics/bg-head.gif) repeat-x top left;
}
div#network div#networkIdentity {
	width: 250px;
	padding-left: 10px;
	float: left;
	
}
div#network div#networkNavigation {
	width: 515px;
	float: right;
	
}
div#network div#networkNavigation ul {
	margin: 0px;
	padding: 0px;
	padding-top: 10px;
}
div#network div#networkNavigation ul li {
	list-style-type: none;
	float: left;
}
div#network div#networkNavigation ul li a {
	font-size: 120%;
	text-transform: lowercase;
	color: #FFFFFF;
	text-decoration: none;
	background: transparent;
	margin-left: 0px;
	display: block;
	padding:0 0 0 0;
}
div#network div#networkNavigation ul li a span 
{
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	display: block;
	background: transparent;
}
	
div#network div#networkNavigation ul li a:hover {
	color: #F28332;
	background: transparent url(pics/bg-menu-right.gif) no-repeat top right;
}
div#network div#networkNavigation ul li a:hover span 
{
	background: transparent url(pics/bg-menu-left.gif) no-repeat top left;
}

/* ----------------------------------------------------------- */
/* B2. Content Wrapper                                         */
/* ----------------------------------------------------------- */

div#wrapper {
	background: #191D26;
	height: auto !important;
	min-height: 400px;
	height: 400px;
}
div#wrapper div.content 
{
	padding: 10px;
	padding-top: 30px;
	padding-bottom: 30px;
	/*padding: 30px;*/
	width: 974px;
}
/* ----------------------------------------------------------- */
/* B4. Banners                                                 */
/* ----------------------------------------------------------- */

div#introBanner {
	background: #30343C url(pics/bg-wrapper.gif) repeat-x top left;
	height: 60px;
}
div#introBanner h2 
{
	background: transparent url(pics/heading-intro.gif) no-repeat 10px 17px;
	text-indent: -9999px;
	margin: 0px;
	padding: 5px;
	padding-top: 15px;
	padding-bottom: 15px;
}
div#banner {
	background: #11131B;/*30343C;*/
	border: #28334C 1px solid;
}
div#banner div {
    background: transparent url(pics/logo-portfolio.gif) no-repeat bottom right;
    min-height: 120px;
	padding: 10px;
}
div#banner h2 {
	background: transparent url(pics/heading-portfolio.gif) no-repeat 5px 5px;
	text-indent: -9999px;
	margin: 0px;
	padding: 5px;
    margin-bottom: 15px;
}	
div#banner p {
    margin-top: 0px;
    margin-bottom: 0px;
    color: #FFFFFF;
    background: transparent url(pics/content-introduction.gif) no-repeat;
    text-indent: -9999px;
    height: 60px;
}
div#designBanner {
	background: #026096 url(pics/design/bg-banner.gif) repeat-x top left;
	min-height: 134px;
}
div#designBanner h2 
{
	background: transparent url(pics/design/logo-fwd.gif) no-repeat 10px 30px;
	text-indent: -9999px;
	margin: 0px;
	padding: 5px;
	padding-top: 30px;
	padding-bottom: 60px;
}
/* ----------------------------------------------------------- */
/* B5. Footer                                                  */
/* ----------------------------------------------------------- */

div#footer {
	background: transparent url(pics/bg-footer.gif) repeat-x top left;
	min-height: 95px;
}
div#footer div.content {
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    width: 974px;
    background: transparent;
}
div#footer div.footerlinks {
    width: 50%;
    float: left;
    padding-bottom: 10px;
}
div#footer div.footerlinks a {
    color: #F28332;
}
div#footer div.footerlinks a:hover {
    color: #FFFFFF;
}
div#footer div.footerinfo {
    width: 50%;
    float: right;
    padding-bottom: 10px;
}
div#footer div.footerinfo ul {
    margin: 0px;
    padding: 0px;
}
div#footer div.footerinfo ul li {
    list-style-type: none;
    float: right;
}
div#footer div.footerinfo ul li a {
    text-transform: lowercase;
    color: #F28332;
    text-decoration: none;
    padding: 2px;
    padding-left: 20px;
    padding-right: 5px;
    margin-left:1px;
}
div#footer div.footerinfo ul li a.feed {
    background: transparent url(pics/feed.gif) no-repeat 5px 5px;
}
div#footer div.footerinfo ul li a:hover {
    color: #FFFFFF;
}
div#footer div.content div {
    font-size: x-small;
    color:#FFFFFF;
}

div#footer div.content div span.allrights {
    color: #7D9CE5;
}

/* *********************************************************** */
/* C. Modules                                                  */
/* *********************************************************** */

/* ----------------------------------------------------------- */
/* Portfolio                                                   */
/* ----------------------------------------------------------- */

div#wrapper ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
}
div#wrapper ul .thumb {
	width: 380px;
	height: 200px;
	border: 5px solid #28334C	;
	float: left;
	margin-bottom: 30px;
	text-indent: -10000px;
	outline: none;
	display: block;
}
div#wrapper ul a:hover {
	background-position: 0 -200px;
}
div#wrapper ul li div {
	width: 530px;
	float: right;
}
div#wrapper ul li div p.stats {
	padding-top: 40px;
}

/* ----------------------------------------------------------- */
/* Portfolio Images                                            */
/* ----------------------------------------------------------- */

#pic1 { background: transparent url(../pics/portfolio/2008daibach/daibach1.gif) no-repeat top left; }
#pic2 { background: transparent url(../pics/portfolio/2007charlieduff/charlie1.gif) no-repeat top left; }
#pic3 { background: transparent url(../pics/portfolio/2008gwenttheatre/gwenttheatre1.gif) no-repeat top left; }
#pic4 { background: transparent url(../pics/portfolio/2006govilon/govilon1.gif) no-repeat top left; }
#pic5 { background: transparent url(../pics/portfolio/2008southwaleshotels/southwaleshotels.gif) no-repeat top left; }
#pic6 { background: transparent url(../pics/portfolio/2008bristolservicedlets/bristolservicedlets.gif) no-repeat top left; }

/* ----------------------------------------------------------- */
/* Intro About Content                                         */
/* ----------------------------------------------------------- */

div.aboutContent 
{
	width: 463px;
	float: left;
}
div.aboutContent div.whoamiHead 
{
	height: 23px;
	background: transparent url(pics/dafydd-head.gif) no-repeat bottom left;
}
div.aboutContent div.whoamiContent 
{
	height: 131px;
	background: #272B33 url(pics/dafydd-main.gif) no-repeat top right;
	padding: 10px;
	padding-right: 108px;
	padding-bottom: 0px;
	border: #28334C 1px solid;
	border-top: 0px;
}
div#whathaveidone 
{
	margin-bottom: 10px;
}
div#whathaveidone img 
{
	float:left;
	padding-right: 10px;
}


/* ----------------------------------------------------------- */
/* Intro Follow Content                                        */
/* ----------------------------------------------------------- */

div.followContent 
{
	width: 463px;
	float: right;
}
div.followContent div.mythoughtsContent 
{
	margin-top: 23px;
	background: #11131B;
	padding: 10px;
	border: #28334C 1px solid;
}
div.followContent div.mythoughtsContent ul li
{
	padding-bottom: 10px;
	background: transparent url(pics/bullet.gif) no-repeat 0px 3px;
	padding-left: 18px;
}
div#morefromme
{
	margin-bottom: 10px;
}
div#morefromme img 
{
	float:right;
	padding-left: 10px;
}
/* ----------------------------------------------------------- */
/* Intro General                                               */
/* ----------------------------------------------------------- */
div.moreLink 
{
	text-align: right;
	padding-top: 5px;
	padding-bottom: 5px;
}
div.moreLink a 
{
	padding-left: 18px;
	background: transparent url(pics/bg-link.gif) no-repeat 0px 2px;
}
div.socialLinks 
{
	margin-top: 20px; 
	border-top: #28334C 1px solid; 
	padding-top: 10px;
}
div.socialLinks ul 
{
	list-style: none; 
	margin: 0px; 
	padding: 0px;
}
div.socialLinks li 
{
	 float:left;
	 margin-right:10px;
}

div.contactForm 
{
	padding-top: 3px;
	padding-bottom: 3px;
}
div.contactForm div.label 
{
	width: 100px;
	float: left;
}
div.contactForm div.field 
{
	float: left;
	text-align: left;
}
div.contactForm div.field input, div.contactForm div.field textarea
{
	background: #272B33;
	border: #28334C 1px solid;
	color: #82A4F0;
	width: 300px;
	padding: 2px;
}
div.contactForm div.field input.button 
{
	background: #82A4F0;
	color: #131313;
	width: auto;
	
}
div.contactForm div.validation 
{
	padding-left: 100px;
}
div.contactForm div.validation span 
{
	color: #FFFFFF;
	padding: 3px;
	margin-top: 3px;
	margin-bottom: 3px;
	font-weight: bold;
}