body {
text-align:center;
color:#736a59;
margin:0;
background-color:#489ec3;
font-family: Arial, Verdana, sans-serif;
font-size: 76%;
line-height: 1.5em;
}
p {
margin: 0 0 5px 0;
line-height: 1.4em
}
h1 {
margin: 0 0 5px 0;
}
h2 { 
margin: 0 0 5px 0;
color:#148101;

}
h3 {
margin: 0 0 5px 0;
font-weight:bold;
font-size: 115%;
color: #7a756e
}

a {
text-decoration:underline;
} 
a:link {
color:#489ec3;
} 
a:visited {
color:#489ec3;
} 
a:hover,a:active {
text-decoration: none;
color: #736a59;
} 



#container {
width: 100%;
background-image:url(images/header_repeat.gif);
background-repeat:repeat-x;
text-align:center;
margin: 0 auto;
background-color:#fff;
float:left
}
#header {
height: 91px;
}
#logo {
margin-top: 13px;
width: 252px;
float:left;
background-image:url(images/logo.jpg);
background-repeat:no-repeat;
}
#logo h1{
margin: 0;
padding: 0;
text-indent: -9999px;
}
#logo a{
display:block; width:252px; height:0; padding-top:70px; color:#000; overflow:hidden;
}

#wrapper {
clear:both;
width: 800px;
text-align:left;
margin: 0 auto;
padding:0 10px 20px 10px;
}

#contentHome {
clear:left;
padding: 50px 350px 0 0;
margin-bottom: 40px;
background-image:url(images/home_concept.jpg);
background-repeat:no-repeat;
background-position:top right

}
#content {
clear:left;
float:left;
width: 525px;
padding: 50px 0 0 0;
margin-bottom: 40px;
background-image:url(images/port_background_burst.jpg);
background-repeat:no-repeat;
background-position:top right

}


#content ul{
margin:0 0 35px 0;
padding:0px;
list-style-type:none

}

#content li {
display: inline;
margin-right: 15px;
}


/*---
-----------------------------------  P O R T F O L I O ----*/
#contentPort {
clear:left;
float:left;
width: 525px;
padding: 50px 0 0 0;
margin-bottom: 40px;
background-image:url(images/port_back.jpg);
background-repeat:no-repeat;
background-position:top right

}
.portTitle {
width: 250px
}

#contentPort h1{

}
.portheads {
margin: 20px 0
}

#portItem {
padding: 0;
margin: 20px 0
}
#portItem img {
border: 1px solid #dbd3c6;
padding:8px;
}
#portItem{
background-image:url(images/port_shadow.jpg);
background-repeat:no-repeat;
background-position:bottom center;
padding-bottom: 16px
}

.thumbnail {
float: left;
width: 152px;
margin: 0 20px 20px 0;
padding: 0 0 10px 0;
}
.thumbnail p{
margin: 0;
padding: 0;
line-height:1em;
font-size:90%;

}
.thumbnail h4 {
background-image:url(images/port_thumb_shadow.gif);
background-repeat:no-repeat;
background-position:top center;
color: #7a756e;
margin:0;
padding:10px 0 0 0;
font-size: 120%;
font-weight:normal
}

.thumbnail img {
text-align:left;
margin: 0 0 4px 0;
padding: 5px;
border: 1px solid #dbd3c6;
background-color:#FFF;
}
.thumbnail a img {
border: 1px solid #dbd3c6
}
.thumbnail a:link img{
border: 1px solid #dbd3c6
}

.thumbnail a:hover img{
border: 1px solid #fff
}

#identity div.thumbnail {
width:152px;
margin:0 0 20px 0;
float:none;
}

#identity {
width:152px;
padding:0;
margin: 0 15px 20px 0;
padding-right:13px;
float:left;
border-right:1px solid #dbd3c6
}

#identity h2.portheads {
margin:5px 0 15px 0;
padding:0
}

#interactive div.thumbnail {
width:152px;
margin:0 0 20px 0;
float:none;
}

#interactive {
width:152px;
margin: 0 15px 20px 0;
padding-right:13px;
float:left;
border-right:1px solid #dbd3c6
}

#interactive h2.portheads {
margin:5px 0 15px 0;
padding:0
}
#print div.thumbnail {
width:152px;
margin:0 0 20px 0;
float:none;
}
#print {
width:152px;
margin: 0 0px 20px 0;
float:left;
}

#print h2.portheads {
margin:5px 0 15px 0;
padding:0
}

.clearboth { clear: both; }
.hide{
display:none;
}

 .more {
float: right;
margin: 10px 0px 30px 40px;
padding: 2px 2px 2px 40px;
text-align:right;
}
.moreLinks{
padding:2px 5px;
color:#6c4476;
margin:0;
border:1px solid #CCC;
text-decoration:none;
}

.moreLinks:hover{
background: #e3e0dd;
color: #000;
}

.pages {
border-top: 1px solid #e3e0dd;
margin: 20px 0 0 0;
padding: 10px 0;
}

.serviceBox {
width:500px;
float:left;
background-image:url(images/service_backs.jpg);
background-repeat:no-repeat;
background-position:right top;
padding: 18px 15px 0px 15px;
margin: 0 0 30px 0;
}
.serviceBox p {
padding-right: 50px;
}
#content .serviceBox ul{
list-style-type:none;
margin:5px 0 5px 0;
padding: 0;
}
#content .serviceBox li {
display:inline;
border-left: 1px solid #333;
padding:0 8px 0 8px;
margin: 0 0px 10px 0;
font-size:95%;

}
.serviceBox h3{
margin:0 50px 10px 0;
color:#fff;
padding: 0 0 5px 0;
font-size: 150%;
font-weight:normal;
}
#content .serviceBox li.first {
border:none;
padding-left: 0;
padding-right:8px
}
.popupEvent {
width: 350px;
padding:10px 0px 30px 20px;
background:transparent;
background-image:url(images/service_pop_back.gif);
background-position:bottom left;
background-repeat:no-repeat;
color:#FFF;
font-size:100%
}
.popupEvent h2 {
margin:0 0 5px 0;
font-weight:normal;
color:#489ec3
}
.popupEvent p {
padding-right: 30px;
}
#content #sitebuilderList li{
float:left;
clear:left;
width: 475px;
margin:0 0 18px 0;
padding: 0 0 0 28px;
background-image:url(images/right_arrow.jpg);
background-repeat:no-repeat;
background-position:left center
}
#content strong {
color:#489ec3;
border-bottom: 1px solid #ccc;
font-weight:normal;
} 
#content div.floatRight {
float: right;
width: 200px;
height: 200px;
border-bottom: 4px solid #ccc;
margin: 10px 0 50px 20px;
}
#content div.floatRight p{
text-align:center;
margin: 10px 0 10px 0;
}


p.storylisting {
padding-bottom:20px;
margin: 0;
border-bottom:1px solid #dbd3c6
}

/*---
-----------------------------------  S I D E B A R----*/
#featuredSide {
background-image: url(images/sidebar_shadow.jpg);
background-position:top left;
background-repeat:no-repeat;
width: 225px;
float:right;
padding: 50px 0 25px 35px;
margin-bottom: 20px;
}

#client{
color: #FFF;
margin-top: 20px;
padding: 0;
background:transparent url(images/side_header_underline.jpg) 0px 22px no-repeat;

}
#client h3 {
color: #7a756e;
margin-bottom: 20px;
font-size: 130%;
font-weight:normal
}
#client img {
text-align:left;
margin: 0 5px 10px 0;
padding: 3px;
border: 1px solid #dbd3c6; 
background-color: #fff

}
#client a:link img{
border-color: #dbd3c6ff
}
#client a img{
border-color: #dbd3c6
}
#client a:hover img{
border-color: #FFF;
background-color: #dbd3c6
}
#client p {
font-size: 95%;
margin: 0 5px 5px 0
}

#category {
color: #FFF;
margin-top: 20px;
padding: 0;
background:transparent url(images/side_header_underline.jpg) 0px 22px no-repeat;
}
#category h3 {
color: #7a756e;
margin-bottom: 20px;
font-size: 130%;
font-weight:normal
}
#category img {
text-align:left;
margin: 0 11px 10px 0;
padding: 3px;
border: 1px solid #dbd3c6; 
background-color: #fff 
}
#category a:link img{
border-color: #dbd3c6
}
#category a img{
border-color: #dbd3c6
}
#category a:hover img{
border-color: #FFF;
background-color: #dbd3c6
}
#category p {
font-size: 95%;
margin: 0 5px 5px 0
}


#newsColumn {
margin-top: 20px;
padding: 0;
background:transparent url(images/side_header_underline.jpg) 0px 22px no-repeat;
padding-bottom:10px;
border-bottom:1px solid #dbd3c6
}
#newsColumn h3 {
color: #7a756e;
margin-bottom: 20px;
font-size: 120%;
font-weight:normal
}
p.newsTitle{
font-size: 100%;
font-weight:bold;
color:#489ec3;
margin: 0 5px 0px 0
}
p.newsDate{
font-size: 90%;
font-weight:bold;
color:#666;
margin: 0 5px 0 0
}
p.viewMore{
font-size: 90%;
padding: 0;
margin: 0 5px 15px 0
}
p.viewAll{
text-align:left;
font-size: 90%;
margin: 0 5px 30px 0;
}

#newsColumn p.viewAll {
margin: 0 5px 0 0
}



#rfp {
margin-top: 20px;
padding: 0;
background:transparent url(images/side_header_underline.jpg) 0px 22px no-repeat;
padding-bottom:10px;
border-bottom:1px solid #dbd3c6
}
#rfp h3 {
color: #7a756e;
margin-bottom: 20px;
font-size: 120%;
font-weight:normal
}

#randomwork {
margin-top: 20px;
padding: 0;
background:transparent url(images/side_header_underline.jpg) 0px 22px no-repeat;
padding-bottom:10px;
}
#randomwork h3 {
color: #7a756e;
margin-bottom: 20px;
font-size: 120%;
font-weight:normal
}

#randomwork img {
text-align:left;
margin: 0 11px 10px 0;
padding: 3px;
border: 1px solid #dbd3c6; 
background-color: #fff 
}
#randomwork a:link img{
border-color: #dbd3c6
}
#randomwork a img{
border-color: #dbd3c6
}
#randomwork a:hover img{
border-color: #FFF;
background-color: #dbd3c6
}
#randomwork p {
font-size: 95%;
margin: 0 5px 5px 0
}


#featured {
text-align:center;
margin: 20px auto;
width: 100%;
}
#featured h3{
text-align:left;
margin:0 0 20px 0;
padding: 0 0 5px 0;
font-size: 150%;
font-weight:normal;
border-bottom: 1px solid #e3e0dd
}

div#featured p.blue {
color:#489ec3;
font-weight:bold;
border-bottom:1px dotted #ccc;
padding-bottom: 4px;
margin-bottom:4px;
}

div#featured div.thumbnail {
text-align:left;
margin: 0 18px 20px 18px;
}

div#featured div.thumbnail h4, div#featured div.thumbnail p{
padding-left: 8px;
}
/*---
-----------------------------------  F O O T E R  ----*/

#footer {
background-image:url(images/footer_repeat.gif);
background-repeat:repeat-x;
background-color:#489ec3;
padding: 10px 0;
color:#FFF;
font-size:95%;
clear:left;
}

#footer p {
margin: 0 auto;
text-align:left;
width:800px;
background-image:url(images/footerimage_toast.jpg);
background-repeat:no-repeat;
background-position:right top;
padding-bottom: 65px;
padding-top: 20px;
}
#footer a:link, #footer a:visited {
color:#fff
}


/*---
-----------------------------------  F O R M S  ----*/

form {
margin: 30px 0
}
form h2 {
margin-top: 30px;
}
.yellowText {
color:#489ec3;
font-size:86.7%;
}


/*---
-----------------------------------  N A V  ----*/

#navigation {
float:right;
margin: 0;
padding: 0;
}
#navigation ul{
margin: 0;
padding: 0;
list-style-type: none;
}
#navigation li {
float: left
}
#navigation li.about {
background:transparent url(images/header_nav.jpg) 0px 0px no-repeat;width: 62px;
}
#navigation li.work {
background:transparent url(images/header_nav.jpg) -62px 0px no-repeat;width: 61px;
}
#navigation li.services {
background:transparent url(images/header_nav.jpg) -123px 0px no-repeat;width: 61px;
}
#navigation li.contact {
background:transparent url(images/header_nav.jpg) -184px 0px no-repeat;width: 62px;
}
#navigation a {display:block; width:61px; height:0; padding-top:85px; color:#000; overflow:hidden;}

/* hack for older versions of IE with incorrect box model */

* html #navigation a:link, * html #navigation a:visited {height:0px; he\ight:0;}

* html #navigation a:hover {height:91px; he\ight:0;}