/* Index ****
CSS Restet
Links
Fonts
Layout	
	General layout
	Misc
	Header layout
	Navigation
	Sidebar layout
	Footer
Page Specific
	Home page
	Portfolio page
	Clients page
	Contact page
	Sitemap page
	About page
	Testimonials page
	Special offers page


Colours index
  Red = #c1272d
  Green = #177b12
  Blue = #203c98
  Grey = #333
*/

/****************************************************************** CSS Reset */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}
:focus {
  outline: 0;
}
ins {
  text-decoration: none;
}
del {
  text-decoration: line-through;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/****************************************************************** Links */

a,
a:link,
a:visited {
  color:#fff;
  text-decoration:underline;
}
a:hover {
  color: #043849;
  text-decoration: none;
}

/****************************************************************** Fonts */

body {
  font-family:Helvetica, Arial, sans-serif;
  font-size:14px;
  color:#333;
}
p {
  line-height:1.5em;
  margin-bottom: 0.75em;
}

h1,h2,h3,h4,h5,h6 {
	font-weight: normal;
	color: #F2F2F2;
	letter-spacing:-0.02em;
}
h1 {
  font-size: 3em;
  line-height: 1;
  margin-bottom: 0.5em;
}
h2 {
  font-size: 2em;
  margin-bottom: 0.75em;
	}
h3 {
  font-size: 1.5em;
  line-height: 1;
	margin-bottom: 1em;
}
h4 {
  font-size: 1.2em;
  line-height: 1.25em;
	margin-bottom: 0.75em;
}
h5 {
  font-size: 1em;
  font-weight: bold;
	margin-bottom: 0.75em;
}
h6 {
  font-size: 1em;
  font-weight: bold;
} 

#footer p {
  font-size: 0.9em;
}


/****************************************************************** General layout */

body {
  background-image: url(../images/bg.jpg);
  background-repeat: repeat;
	background-color:#76a9bc;
}
#container {
  width: 740px;
  margin:20px auto 0;
  padding: 0 5px;
  background-image: url(../images/main-seperator.gif);
  background-repeat: repeat-y;
	background-position: 107px 0;
}
#nav {
  width: 740px;
  color: #fff;
  margin: 5px 0 0;
  height: 33px;
  position: absolute;
  left: 5px;
  top: 302px;
  background-image: url(../images/nav-seperator.gif);
  background-repeat: repeat-x;
}
#main {
  width: 540px;
	float: left;
  margin-bottom: 20px;
}
#sidebar {
  float: right;
  width: 180px;
}
#footer {
  width: 740px;
  background-image: url(../images/footer-seperator.gif);
  background-repeat: repeat-x;
  height: 80px;
  margin:20px auto 0;
  padding: 15px 5px;
}
hr {display:none;}

/****************************************************************** Misc */

.clearfloat {
  clear:both;
  height:0;
  font-size: 1px;
  line-height: 0px;
}
p.back-to-top {
  text-align: right;
  font-size: 80%;
	margin-top:40px;
  }
img.back-to-top {
  position: relative;
  bottom: -3px;
  }
	
#info {
  background-image: url(../images/bg-light.jpg);
  border:2px solid #b40000;
  padding:10px;
  }
#info li {
  color: #b40000;
  margin-left:15px;
  list-style-type: square;
  }

a.quote_button {
	background:url(/images/button_quote.jpg) no-repeat 0px 0px;
	height: 42px;
	width: 189px;
	display:block;
	clear:both;
}
a.quote_button:hover {
	background:url(/images/button_quote.jpg) no-repeat 0px -42px;
}
a.quote_button:active {
	background:url(/images/button_quote.jpg) no-repeat 0px -84px;
}  
a.quote_button span {
  display:none;
}
a.offer_button {
	background:url(/images/button_offer.jpg) no-repeat 0px 0px;
	height: 87px;
	width: 178px;
	display:block;
	clear:both;
}
a.offer_button:hover {
	background:url(/images/button_offer.jpg) no-repeat 0px -87px;
}
a.offer_button:active {
	background:url(/images/button_offer.jpg) no-repeat 0px -174px;
}
a.offer_button span {
  display:none;
}

  
/****************************************************************** Header layout */

#header-container {
  background-image: url(../images/bg-top.jpg);
  background-repeat: repeat-x;
  width: 100%;
}
#header {
  position: relative;
  width: 750px;
  margin: 0 auto;
  height: 340px;
}
#header #logo {
  position: absolute;
  top: 48px;
  left: 0px;
	background-image: url(../images/clients/logo-green_eye_design.jpg);
	background-repeat:no-repeat;
	background-position:top;
	width: 258px;
	height: 58px;
}
#header #logo span {display:none;}
#header #banner {
  position: absolute;
  left: 0px;
  top: 109px;
	background-image: url(../images/banner.jpg);
	background-repeat:no-repeat;
	background-position:top;
	width: 750px;
	height: 190px;
}
#banner h2, #banner p {display:none;}
#header #call_now {
  text-align: center;
  top: 50px;
  position: absolute;
  right: 0px;
}
#call_now .call_now {
  letter-spacing: 4px;
  font-weight: bold;
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 20px;
  display: block;
}
#call_now .number {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: #d2d2d2;
  letter-spacing: 1px;
  display: block;
}
#call_now a:hover {
  background-color:#fff;
  color:#000;
}

/****************************************************************** Navigation */

#nav #nav-main {float: left;}

#nav #nav-sub {
  float: right;
  text-align: right;
  font-size: 90%;
}
#nav #nav-main li {
  display: inline;
  margin-right: 15px;
}
#nav #nav-sub li {
  display: inline;
  margin-left: 15px;
}
#nav a,
#nav a:link,
#nav a:visited {
  font-weight:bold;
  text-transform: uppercase;
  color:#fff;
  text-decoration:none;
  font-size: 90%;
}
#nav a:hover {
  color: #043849;
}
/****************************************************************** Sidebar layout */

#sidebar #main-offer {
  border: 1px solid #fff;
  height: 100px;
  margin-bottom: 30px;
  background-color: #ccc;
}
#sidebar #main-offer a:hover {background-color: transparent;}
#sidebar #port-quick-view {
  position: relative;
  margin-bottom: 30px;
}

#sidebar #testimonial-quick-view {
  margin-bottom: 30px;
}
#sidebar .testimonial {
  font-style:italic;
	}


/****************************************************************** Footer */
#footer div.footer-column1 {
  float: left;
  width: 180px;
	background-image:url(../images/main-seperator.gif);
	background-position:right;
	margin: 0 10px 10px 0;
	height:160px;
}
#footer div.footer-column2 {
  float: left;
  width: 260px;
	background-image:url(../images/main-seperator.gif);
	background-position:right;
	margin: 0 10px 10px 0;
	height:160px;
}
#footer div.footer-bookmarkcol1,
#footer div.footer-bookmarkcol2 {
  float: left;
  width: 130px;
}
#footer div.footer-column3 {
  float: left;
  width: 280px;
}
#footer img.bookmark {
  margin:0 5px -3px 0;
}

/****************************************************************** Home page */

#home #main ul,
#services #main ul {
  margin-left:15px;
  list-style-type: disc;
  list-style-position: inside;
}

#web-design, #digital-design, #print-design, #identity-design {
  background:#7fafbf url(../images/bg-light.jpg) top right repeat;
  padding: 10px;
	margin: 0 0 20px 0;
}
#web-design {
  border-top: 2px solid #c1272d;
  border-bottom: 2px solid #c1272d;
}
#digital-design {
  border-top: 2px solid #177b12;
  border-bottom: 2px solid #177b12;
}
#print-design {
  border-top: 2px solid #203c98;
  border-bottom: 2px solid #203c98;
}
#identity-design {
	border-top: 2px solid #333;
	border-bottom: 2px solid #333;
}

#web-design h4{color: #c1272d;}
#digital-design h4{color: #177b12;}
#print-design h4{color: #203c98;}
#identity-design h4{color: #333;}

#wwd p {
	font-size:0.86em;
	text-align:right;
	margin:0px;
	}
#web-design p {color:#c1272d;}
#digital-design p {color:#177b12;}
#print-design p {color:#203c98;}
#identity-design p {color:#333;}


/****************************************************************** Portfolio page */

#portfolio_view {
  margin:20px;
}
ul.port-list {
  float:left;
	padding-bottom:10px;
	}
li.port-thumb {
  width:80px;
	float:left;
	margin:0 10px 0 0;
}
p.port-thumb {
  margin:0px;
	font-size:0.9em;
	line-height:1.2em;
	padding-top: 2px;
}
.port-thumb a {
  text-decoration:none;
}
.port-thumb a:link img {
  border: 3px solid #ddd;
  text-decoration:none;
}
.port-thumb a:visited img {
  border: 3px solid #ddd;
	text-decoration:none;
}
.port-thumb a:hover img {
  border: 3px solid #043849;
  text-decoration:none;
}

ul.project-type {
  margin-bottom:20px;
  background-image: url(../images/bg-light.jpg);

}
ul.project-type li {
	border-bottom:1px solid #77abbc;
	padding:7px 5px 5px 5px;
}
ul.project-type li.top {
  border-top:1px solid #77abbc;
}
ul.project-type li.active {
  background-color:white;
}
ul.project-type a {
  text-decoration:none;
}

h2.project-title {
  position:relative;
  z-index:1;
}
.project-category {
  position:relative;
  color:#7fafbf;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:3.5em;
	letter-spacing:-0.08em;
	margin:-50px 0 -8px 30px;
	z-index:0;
}
.project-description {
  width:70%;
}
.project-client {
  text-align:right;
	margin-bottom:0px;
}
.project-url {
  margin:0;
}
.project-img {
  font-size:0.8em;
}
#add-img {
  position:relative;
}
.add-img-sep {
  background-image: url(../images/footer-seperator.gif);
  background-repeat:repeat-x;
  height:3em;
  margin:10px 10px 0 0;
  padding:10px 0 0;
}
.add-img {
  float:left;
	margin:0 15px 15px 0;
}
.nextprev {
  color:#fff;
	font-size:0.7em;
	text-align:right;
}



/****************************************************************** Clients page */
#clients #clients-grid img {
  float: left;
  margin: 0 15px 15px 0;
  }
#clients #clients-grid img.last {margin-right: 0;}
#clients #clients-grid img {border: 3px solid #e6e6e6;}  
#clients #clients-grid img:hover {border: 3px solid #888;}

/****************************************************************** Contact page */

#contact .title {
  font-weight: bold;
	margin: 0 0 20px 0;
  }
#contact .title span {
  margin: 3px 0 0;
  display: block;
  font-size: 80%;
  color: #b40000;
  }

/****************************************************************** Forms */

form fieldset {
  padding: 10px;
  border: 1px solid #fff;
  width: 270px;
  background-image: url(../images/bg-light.jpg);
  margin: 30px 0;
  }
fieldset ul {
  list-style: none;
  }
fieldset li {
  margin-bottom: 15px;
  }
input.textfield,
textarea.textfield {
  width: 97%;
  background-color: #d2d2d2;
  border: 1px solid #fff;
  margin-top: 3px;
  padding: 2px;
	font-size:14px;
	color:#333;
  }
#send-query-button {
  width: auto;
  background-color: transparent;
  border: none;
  padding: 0;
  margin: 0;
  }
.form_sub_list {
  font-size:0.8em;
	color:#555;
}
p.contact-details {margin: 20px 0 10px;}
.highlight {
  color: #b40000;
  }





/****************************************************************** Sitemap page */
  
#sitemap ul.sitemap {margin: 20px 0 0 10px;}
#sitemap ul.sitemap li {
  margin:10px 0;
  font-weight: bold;
  }
#sitemap ul.sitemap ul li {
  margin:5px 0 0 20px;
	font-weight:normal;
}
#sitemap p.sitemap {
  font-size: 90%;
  margin-top: 4px;
  font-weight: normal;
  }

/****************************************************************** About page */

/****************************************************************** Testimonials page */

#testimonials p.testimonial {
  font-style:italic;
  }
#testimonials div.testimonial {
  background-image:url(../images/footer-seperator.gif);
  background-repeat:repeat-x;
  background-position:0 0;
	padding:15px 0 0;
	margin:0 20px 40px;
  }
h4.testimonial {
  margin-bottom:0.4em;
	}
p.testimonial-author {
  margin-bottom:2em;
  font-size:0.8em;
	font-weight:bold;
}
p.testimonial-author a {
  font-weight:normal;
}

/****************************************************************** Special offers page */
	
#offers .conditions {
	font-size:smaller;
	margin-top:30px;
	clear:both;
	}
  
/****************************************************************** Error page */

body.error {
  background-color:#fff;
  margin:30px;
}

/******************************************************************  */
	
/*************************************************************** END *****************************/