html, body {
border:0;
background:url(../img/site-bg.jpg) repeat-x;
padding: 0;
margin: 0;
height: 100%;
}

#headerSlogan {
position:absolute;
top: 13px;
left: 227px;
font-size:21px;
font-family:"Arial Narrow", Helvetica, sans-serif;
font-weight:bold;
color: #ff7059;
}

#site {
background:url(../img/site-shadow.jpg) no-repeat top center;
}


#container {
margin: 0 auto;
width: 963px;
background:url(../img/site-bg.jpg) repeat-x;
position:relative;
min-height:845px;

}

#header {
height: 330px;
color: #ffffff;
font-family:Arial, Helvetica, sans-serif;
}

#content {
font-family:Arial, Helvetica, sans-serif;
font-size: 12px;
color: #616161;
}

#footer {
border-top: 1px solid #e8eae5;
padding: 0px 0px 10px 0px;
margin: 17px 17px 0px 17px;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color: #c2c2c2;
text-align:center;
}

#logo {
background: url(../img/guava-studios.jpg);
width: 113px;
height: 59px;
position:absolute;
top: 15px;
left: 38px;
}

#logo span {
display: none;
}

#pageIntro {
font-size: 20px;
position:absolute;
left: 38px;
top: 130px;
z-index:998;
font-family:"Arial Narrow",Georgia, "Times New Roman", Times, serif;
text-align:left;
font-weight:normal;
}

#pageIntroText {
width: 442px;
position:absolute;
top: 170px;
left: 38px;
font-size: 12px;
line-height: 16px;
}

#contentLeft {
padding: 10px 0px 0px 0px;
margin: 0px;
float: right;
width: 275px;
w\idth: 275px;
font-size:11px;
}

#contentRight {
float: left;
margin: 10px 61px 0px 42px;
width: 685px;
w\idth: 582px;
text-align:justify;
font-size:12px;
line-height:20px;
position:relative;
display:inline;

}

#contentRightA {
float: left;
width: 500px;
w\idth: 470px;
padding: 44px 0px 0px 30px;
text-align:justify;
font-size:12px;
line-height:18px;
position:relative;
}

#contentRightB {
float: left;
width: 200px;
w\idth: 170px;
padding: 44px 0px 0px 30px;
text-align:justify;
font-size:12px;
line-height:18px;
}

.shadowBox {
background:url(../img/shadow-box.gif) no-repeat;
width: 320px;
w\idth: 280px;
height: 64px;
float: left;
text-align:left!important;
padding: 16px 20px 20px 20px;
line-height:normal;
text-decoration:none;
color: #7f7f7e!important;
position:relative;
}

.shadowBox a, .shadowBox a:visited {
text-decoration:none;
color: #7f7f7e!important;

}

.shadowBox:hover {
background:url(../img/shadow-box.gif) no-repeat 0px -100px;
}

.shadowBox p {
margin: 0px;
padding: 0px;
width: 220px;
w\idth: 220px;
font-size: 11px!important;
float: left;
}

.shadowBox .img {
float: left;
line-height:34px;
margin: 10px 10px 0px 0px;
}

a.shadowBoxSmall, a.shadowBoxSmall:visited {
background:url(../img/shadow-box-small.gif) no-repeat;
width: 189px;
w\idth: 129px;
height: 28px;
float: left;
text-align:left!important;
padding: 12px 20px 20px 20px;
line-height:normal;
text-decoration:none;
color: #7f7f7e!important;
cursor:pointer;
position:relative;
}

.shadowBox a.specialOffer, .shadowBox a.specialOffer:visited {
color: #ff5d44!important;
}



a.shadowBoxSmall:hover {
background:url(../img/shadow-box-small.gif) no-repeat 0px -64px;
}

.shadowBoxSmall p, .shadowBoxSmall span {
margin: 0px;
padding: 0px;
padding-left: 0px;
width: 89px;
w\idth: 89px;
font-size: 11px!important;
font-family:Georgia, "Times New Roman", Times, serif;
float: right;
display:block;
}

.shadowBoxSmall img {
float: left;
margin: 5px 10px 0px 0px;
}

#headerImage {
position: absolute;
width: 500px;
height: 240px;
top: 88px;
right: 0px;
}

#webDesignPortfolio a {
float: left;
margin: 0px;
padding: 0px 20px 20px 0px;
}

#webDesignPortfolio a.last {
float: left;
margin: 0px;
padding: 0px 0px 20px 0px!important;
}

#webDesignPortfolio a img {
border: 1px solid #CCCCCC;
}

#graphicDesignPortfolio a {
float: left;
margin: 0px;
padding: 0px 20px 20px 0px;
}

#graphicDesignPortfolio .last, #graphicDesignPortfolio .last {
float: left;
margin: 0px;
padding: 0px 0px 20px 0px!important;
}

#graphicDesignPortfolio img {
border: 1px solid #CCCCCC;
float: left;
margin: 0px;
margin: 0px 20px 20px 0px;
}

.whyNot, .thankyou {
display: none;
}

.homePageText {
float:left; 
width: 320px;
w\idth: 360px;
margin: 0px;
padding: 0px 20px 0px 20px;
}

.homePagePromotions {
float: left;
margin: 0px;
padding: 0px;
width: 225px;
w\idth: 300px;
}

.pageTitleIcon {
float:left;
cursor:pointer;
text-align:center;
width: 110px;
height: 150px;
}

.popupContainer {
position:relative;
}

#contentPopup {
background: url(../img/shadow-box-popup.jpg) no-repeat;;
width: 557px;
height: 288px;
display:block;
position:absolute;
top: -50px;
left: -50px;
display:none;
z-index: 9999;
}

#popupContent {
width: 468px;
height: 218px;
display:block;
overflow:auto;
padding-right: 10px;
margin-left: 43px;
}

#closePopup {
text-align:right;
padding: 10px 35px 10px 0px;
}

.portfolioContent {
width: 870px!important;
w\idth: 870px!important;
}

#extraDetails {
display:none;
}

#clickExtraDetails {
text-decoration:underline;
cursor:pointer;
}

.introBoxLeft {
margin-right: 30px;
width: 321px;
w\idth: 291px;
float: left;
}

.introBoxRight {
width: 261px;
float: left;
}

.homepageServices {
float:left;
width: 184px;
}

#readMoreClick {
	cursor:pointer;
}
#readmore {
	
	display: none;
}

#offer {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
padding: 10px 42px 10px 42px;
background-color:#dedede;
height:15px;
margin-top: -2px;
color: #5b5b5b;
}

#offerLeft {
	float: left;
}

#offerRight {
	float: right;
}

#offer a, #offer a:visited {
	color: #5b5b5b;
}

#offer a:hover {
	text-decoration:none;
}