﻿body { font-family: Tahoma,Arial,Helvetica,sans-serif; background: #000; color: #ccc; cursor: default; }

h1,h2,h3,h4 { letter-spacing: 3px; text-transform: uppercase; font-weight: normal; font-size: 100%; margin: 20px 0px 50px 30px;  }
h2 { font-size: 100%; }
h3 { font-size: 90%; }
h4 { font-size: 80%; margin-bottom: 10px; }
p {margin: 20px 30px 20px 30px; font-weight: normal; font-size: 80%;}
a { color: #999; text-decoration: none;}
a:hover { color: #CCC; text-decoration: underline;}
ul { margin-left: 20px; }
ul li { font-size: 80%; }
ol { margin-left: 20px; }
ol li { font-size: 80%; }

img { border: none; }

h2.warning { color: Red; }

.Text100 { font-size: 110%; }
.Text120 { font-size: 120%; }
.Text140 { font-size: 140%; }
.Text170 { font-size: 170%; }

#wrapper { width: 900px; margin: 0 auto; }
#logo { width: 900px; height: 64px; margin-bottom: 20px; }
#logo img { float: left; } 
.paneltitle { float: left; }
#logo span { float: right; line-height: 32px; text-align: right; letter-spacing: 3px; font-size: 80%; }
#logo span a { color: #ccc; }
.clear { clear:both }

/* GALLERY */
#gallery { position:relative; height: 100px; }
#gallery a { float:left; position:absolute; }
#gallery a img { border:none; }
#gallery a.show { z-index:500 }
#gallery .caption { z-index:600; background-color:#000; color:#ffffff; height:100px; width:100%; 
    position:absolute; bottom:0; }
#gallery .caption .content { margin:5px; text-align: right; }
#gallery .caption .content { padding:0; color:#FFF; font-size: 90%; font-weight: bold; }

#ctl00_MenuCont { float: left; }
#Menu { line-height: 30px; width: 900px; font-size: 80%; height: 30px;  }
#Menu a { color: #ccc; }
#Menu .MenuItemHover { text-decoration: none; color: #999; }
#Menu .MenuItem { margin-left: 10px; padding-right: 5px; }
#Menu .MenuSelected { }

#SubMenuCont { margin-bottom: 10px; width: 900px; height: 30px; line-height: 30px; }
#SubMenuCont .SubMenuItem { color: #999; font-size: 70%; margin-left: 10px; }
#SubMenuCont .SubMenuHover { text-decoration: none; color: #ccc; }

/* MENU IMAGES */

#Menu { background: #000 url(App_Themes/Dark/Images/Menu.jpg) no-repeat center; }
#Menu .MenuSelected { background: transparent url(App_Themes/Dark/Images/MenuSelected.jpg) repeat-x top;}
#Menu .MenuSelected a { background: none; margin-top: 0; }
#Menu .MenuItemHover { background: transparent url(App_Themes/Dark/Images/MenuSelected.jpg) repeat-x top; }
#Menu .MenuItemHover a { background: none; margin-top: 0; }
#SubMenuCont { background: transparent url(App_Themes/Dark/Images/SubMenuFooter.jpg) no-repeat center; }
#SubMenuCont .SubMenuSelected { background: #fff url(App_Themes/Dark/Images/SubSelected.jpg) repeat-x top; }
#SubMenuCont .SubMenuSelected { background: none; }

#Footer { background: transparent url(App_Themes/Dark/Images/SubMenuFooter.jpg) no-repeat center; }

.aboutProfileRichard { background: transparent url(App_Themes/Dark/Images/Richard.gif) no-repeat left top; }

.quoteL {  width: 580px; padding: 5px 0px 0px 20px; margin-left: 30px; background: transparent url(App_Themes/Dark/Images/QuoteL.jpg) no-repeat top left; }
.quoteR {  padding: 0px 15px 5px 0px; letter-spacing: 2px; background: transparent url(App_Themes/Dark/Images/QuoteR.jpg) no-repeat bottom right; }


/* END MENU IMAGES */

#Access { float: right; width: 150px; background-color: Transparent; margin-right: 10px; }
#Access div { float: right;}

.AccessBtn { background-color: Transparent; padding: 0; margin: 0; border: none; color: #fff; }

#ContentLeft { float: left; width: 680px; }
#ContentLeft h3 { margin-bottom: 15px; border-top: dotted 1px #ededed; padding-top: 5px; }

#ContentRight { float: right; width: 200px; text-align: left; }
#ContentRight h3 { margin: 20px 0px 50px 0px; }
#ContentRight ul { list-style: none; border-top: dotted 1px #999; margin: 0 0 40px 0; padding: 0;}
#ContentRight ul li { line-height: 30px; border-bottom: dotted 1px #999;}
#ContentRight ul li:hover { background-color: #333; }
#ContentRight ul li a,#ContentRight ul li span { margin-left: 10px; margin-right: 10px; display: block;}

#FooterCont { width: 900px; height: 20px; margin: 40px 0px 20px 0px; border-top: dotted 1px #ccc; padding-top: 20px;}
#FooterCont .item { border-left: solid 2px #999; line-height: 20px; height: 20px; float: left; margin-right: 20px; padding-left: 10px; font-size: 70%; }
#FooterCont .item:hover { border-left: solid 2px #ccc; }

#Footer { width: 900px; height: 30px; line-height: 32px; font-size: 70%; text-align: right; margin-top: 10px; }
#Footer span { float: right; margin-right: 30px; }
#Footer p { float: left; margin: 0 0 0 30px; }
#Footer a { font-size: 120%; }

.aboutProfileRichard { min-height: 100px; padding-left: 100px; margin-left: 30px; }

.panelemail { width: 600px; margin-left: 30px;}
.panelemail p { margin-left: 0;}
#contactLabels { width: 200px; float: left; font-size: 0.9em; }
#contactLabels .label { display: block; margin-bottom: 5px; }
#contactForms { width: 400px; float: right; font-size: 0.9em; }
#contactForms input,textarea { width: 300px; margin-bottom: 5px; font-size: 0.9em; font-family: Arial;
    color: #333333; border: solid 1px #ccc; background-color: #ededed; }
#contactForms select { margin-bottom: 5px;  background-color: #ededed; }
#contactForms .button { width: 100px; }

.emailContacts { width: 400px; line-height: 30px; margin-left: 30px; font-size: 80%; }
.emailContacts .name { float: left; margin-right: 30px; font-weight: bold; }
.emailContacts .email { float: right; text-align: left; }

.addthis_toolbox { font-size: 70%; }

/* PROJECTS */
.project { margin-bottom: 30px; padding-bottom: 20px; border-bottom: dotted 1px #ccc; margin-left: 30px; }
.project .img { float: left; width: 294px; margin-right: 30px; padding: 2px 0px 2px 2px; border: solid 3px #666; }
.project .img:hover { border-color: #999; }
.project .para { float: right; width: 315px; }
#ContentLeft .project .para h3 { margin: 0 0 15px 0px; font-size: 100%; border: none; }
.project p { margin-left:0; }

.gallery { list-style: none; margin: 0; }
.gallery li { margin: 10px; float: left; }
.gallery li { border: solid 3px #666; width: 100px; height: 100px; padding: 2px; }
.gallery li:hover { border: solid 3px #999; }

/* CLIENT LIST */
.clientlist { margin-left: 30px; }
.clientlist .item { border: solid 3px #666; width: 100px; height: 100px; float: left; padding: 2px; margin-right: 10px }
.clientlist .item:hover { border-color: #999;}

/* NEW MENU */
#ctl00_MenuCont #mega { list-style:none; height:30px; margin:0px; font-size: 120%; }
#ctl00_MenuCont #mega li { margin-left:-20px; margin-right: 50px; float:left; line-height: 30px; text-align:left; position:relative; }
#ctl00_MenuCont.MenuIE67 #mega li { margin-left: 20px; margin-right: 30px; float:left; line-height: 30px; text-align:left; position:relative; }
#ctl00_MenuCont #mega li:hover { border-bottom:0; z-index:1; }
#ctl00_MenuCont #mega a { color:#ccc; outline:0; text-decoration:none; display:block; line-height:30px; }
/* ----------- Hide/Show Div ---------- */
#ctl00_MenuCont #mega div { position:absolute; left:-999em; margin-top:1px; width:300px; padding:0px 5px 10px 5px;
font-weight:normal; text-align:left; background:#ccc; }
#ctl00_MenuCont #mega li:hover div { left:-1px;top:auto; }
#ctl00_MenuCont #mega li.dif:hover div { left:-221px; }
/* --------- Within Div Styles --------- */
#ctl00_MenuCont #mega div span { background:#999; color: #ccc; font-size:120%; padding:0 10px; margin:5px 0 5px 0; clear:both; float:left; width:280px; position:relative; }
#ctl00_MenuCont #mega div p { margin: 0 10px 0px 10px; padding-right:10px; position:relative; font-size: 100%; color: #666; }
#ctl00_MenuCont #mega div p a { color: #333; clear:left; width:100%; /* For IE6/7 */ line-height:1.4; display: block; }
#ctl00_MenuCont #mega div p a:hover { color: #666; text-decoration: underline; }


/* SHOW HIDE */
.show { display: block; }
.hide { display: none; }
.textonly { display: none; }

.SiteMap { margin-left: 40px; }
.SiteMap a { font-size: 80%; }