h1, h2, h3, h4, h5, h6, p, body { margin: 0px; padding: 0px; font-size: 100%;}
body {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; line-height: 20px;}
img{border:none}

/* TEXT */

#header h1 a {width: 362px;  height: 120px;  display: block;  text-indent: -9999px;  text-decoration: none;  background: url(../images/designjam_logo.gif) no-repeat;}
h2{ font-size: 180%; letter-spacing: -1px; margin-bottom: 10px; color:#bed73b;}
h3{ font-size: 120%; margin-bottom: 10px;}
#footer h3{ font-size: 230%; letter-spacing: -1px; margin-bottom: 30px; color:#bed73b;}
a {font-weight:bolder;color:#FFFFFF;}
p {margin-bottom: 10px;}
#testimonials p{font-size: 100%; line-height: 200%}
#testimonials b{color: #bed73b;}
.green h1, .green h2, .green h3, .green h4 {color:#444c2e;}
.green p, .green p, .green p, .green p {color: #657138;}
.copyright p{font-size: 80%; color: #666;}

/* WRAPPER */
.wrapper{ width:100%; margin:0px;}
.intro {background:url(../images/intro_bg.jpg) repeat-x top #27282b;}
.green {background:url(../images/green_bg.jpg) repeat-x #bed73b;}
.black {background:url(../images/grey_bg.jpg);}
.white {background:url(../images/white_bg.jpg) repeat-x#FFF; color: #000;}
.archive {background:url(../images/archive_bg.jpg) repeat-x bottom #26272b;}


/* CONTENTS */
.container {margin:0 auto; width:900px; padding: 20px 0 0 0; position:relative;}
#header {height:140px;}
#intro {height:480px; background:url(../images/splash.jpg) no-repeat bottom right ;}
#portfolio {height:650px;}
#about {height:450px;}
#testimonials {height:220px;}
#contact {height:560px;}
#thankyou {height:250px;}
#footer {margin:0 auto; width:900px; padding: 0px; position:relative;}
#footer span{color: #bed73b; font-weight: bold;}
.leftcol{ margin:30px 0px;width:450px; padding-right:40px; float:left;}
.rightcol{ margin-top:30px; width:325px; float:right;}
.large-text{ margin-top:60px; padding-top:215px;width:325px; float:right;}
.three-col{margin:0px 0px 20px 0px; width:257px; padding-right:25px;float:left;}
.clr{ margin:0px;width:900px; clear:both;}
.quote {width:220px;border-right: #bed73b solid 1px; text-align: right; background: url(../images/quote.png) no-repeat; margin: 15px 0 0 20px; padding-left: 40px;}
#testimonials ul{margin:0px; padding: 0px; list-style: none; display:block; }
#testimonials li h2{ color: #FFFFFF; padding: 0 0 0 25px; font-size: 180%; font-weight: bold; margin: 10px 0px; background:url(../images/bullet.png) no-repeat center left; letter-spacing: -1px; }

/* ARCHIVE */
.archive-wrapper{ width:100%; margin:0px;padding: 50px 0px;}
.archive-container {margin:0 auto; width:900px; padding: 0px; position:relative; display: block;}
.archive-container:hover {margin:0 auto; width:900px; padding: 0px; position:relative; display: block; background: url(../images/tint.png);}
.archive-rightcol{width:325px; margin-top:20px;float:right;}
.archive-rightcol h2{font-size: 300%; color: #FFF;}

/* HEADINGS */
.title { width:900px; height:65px;}
.title h2 { text-indent: -9999px;}
#logo{background:url(../images/designjam_logo.gif)}
#title_portfolio{background:url(../images/title_portfolio.png);}
#title_about{background:url(../images/title_about.png);}
#title_contact{background:url(../images/title_contact.png);}

.largeportfolio{background:url(../images/what-we-do.png) no-repeat;}
.largeabout{background:url(../images/inside-info.png) no-repeat;}
.largecontact{background:url(../images/lets-talk.png) no-repeat;}
.largeintro{background:url(../images/title_intro.png) no-repeat; height:210px; width:450px; padding-bottom: 25px; text-indent: -9999px;}

/* NAVIGATION */
.nav_bar {top:40px; width:560px;right:0px; position:absolute;}
.nav_bar ul { list-style:none; padding:0; margin:0; float: right; }
.nav_bar li {  float:left; margin:0 0 0 30px;}
.nav_bar li a {padding-bottom:25px; font-size: 180%; text-transform: lowercase; text-decoration:none; letter-spacing:-1px; display:block;}
.nav_bar li a:hover { background:url(../images/white_arrow.png) bottom center no-repeat; color:#333333; }
.black .nav_bar li a:hover{ background:url(../images/green_arrow.png) bottom center no-repeat; color:#bed73b; }
.white .nav_bar {top:115px;}
.white .nav_bar li a {color:#000;}
.white .nav_bar li a:hover  { background:url(../images/green_arrow2.png) bottom center no-repeat; color:#bed73b; }

/* FOOTER */
#footer ul{list-style:none; padding:0; margin:10px 0px; }
#footer li{}
#footer li a{ margin: 10px 10px 0 0;display:block; float: left; height: 30px; width: 30px; background-color: fuchsia;text-indent: -9999px;}
li#twitter a{background:url(../images/social-network-logos.jpg) -30px -30px;}
li#twitter a:hover{background:url(../images/social-network-logos.jpg) 0px -30px;}
li#facebook a{background:url(../images/social-network-logos.jpg) -30px 0px;}
li#facebook a:hover{background:url(../images/social-network-logos.jpg) 0px 0px;}
li#flickr a{background:url(../images/social-network-logos.jpg) -30px -60px;}
li#flickr a:hover{background:url(../images/social-network-logos.jpg) 0px -60px;}
li#skype a{background:url(../images/social-network-logos.jpg) -30px -120px;}
li#skype a:hover{background:url(../images/social-network-logos.jpg) 0px -120px;}
.copyright{ margin:0px;width:900px; clear:both; padding: 20px 0px;}
.copyright p{ margin:0px; padding: 0px;}



/* GALLERY */
#gallery {width:525px; margin:0px;padding-right:40px; float:left;}
#gallery ul {list-style:none; margin:0px; padding:0px;}
#gallery li {display:block; float:left; width: 175px;height: 90px;}
#gallery li a{display:block; float:left; width: 175px;height: 90px; background:url(../images/drop_shadow.png) 0 0px no-repeat;}
#gallery li a:hover {background:url(../images/drop_shadow.png) 0 -90px no-repeat;}
#gallery img {width: 155px;height: 70px;margin: 10px 0px 0px 10px;}


/* CONTACT FORM */
#contactform  {width:100px; float:left; }
#contactform ul { margin:10px 0px 0px 0px;padding:0px 0pt 0pt ;}
#contactform li {margin:0px!important;padding:0;list-style:none; color:#333333;}
#contactform input, #contactform textarea{ margin:0 0 5px 0;padding:4px;background:#a3b63d;border:none;color:#FFFFFF; width:450px;}
#contactform input:hover, #contactform textarea:hover {background:#8d9d3e;}
#contactform textarea {height: 100px;overflow:auto;}
#contactform input.sendbutton	{ width:100px;padding:5px;font-size:13px;background:url(../images/button-bg-up.gif) repeat-x;border:1px solid #adadad!important;border-left-color:#ececec!important;border-top-color:#ececec!important;color:#333;}
#contactform input.sendbutton:hover	{background:url(../images/button-bg-over.gif) repeat-x;border:1px solid #878686!important;border-left-color:#e0dede!important;border-top-color: #e0dede!important;color:#333;}