/* CSS Document */
/*  */

* {	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
}

body 	{line-height: 1;
	  	color: #ccc;
	   	background: #161616 url(images/template/bg.jpg) repeat-x;
	   	font-family:Arial, Helvetica, sans-serif;	
		font-size: 70%;
}



h1 {color: #00b3b3;
	margin: 0 0 2em 0;
	font-size: 220%;
	font-weight: lighter;
	font-family: Myriad Pro, Tahoma, Trebuchet MS, Tahoma, Arial, Helvetica;
	line-height: 1.1;

}

h2 {color:#00b3b3;
	border-bottom: #00b3b3 3px solid;
	margin: 0em 0 0.8em 0;
	font-size: 190%;
	font-weight: lighter;
	padding-bottom: 4px;
}



h3 {color:#666666;
border-bottom: #666 1px solid;
padding-bottom: 4px;
	margin: 0 0 1.1em 0;
	font-size: 160%;
	font-weight: normal
}



h4 { color: #666;
	border-bottom: #666 1px solid;
	padding-bottom: 4px;
	margin: 0.4em 0 0.6em 0;
	font-size: 140%;
	font-weight: normal
}

h5{ color: #00b3b3;
	padding-bottom: 4px;
	margin: 0.4em 0 0.6em 0;
	font-size: 140%;
	font-weight: normal
}

p {color: #ccc; line-height: 1.4; margin-bottom: 10px; font-size: 108% }
span.largetext {font-size: 120%}
span.small {font-size: 60%}
span.grey_medium {color: #999; font-size: 10px }
span.green {color: #00b3b3}

img.right {float:right; background:url(images/template/img_bg.jpg) repeat; padding: 10px 10px 13px 10px; border-bottom: 1px solid #000; margin: 0px 0px 10px 15px }

img.left {float:left; background:url(images/template/img_bg.jpg) repeat; padding: 10px 10px 13px 10px; border-bottom: 1px solid #000; margin: 0px 15px 10px 0px }

img.images {float:left; background:url(images/template/img_bg.jpg) repeat; padding: 5px 5px 8px 5px; margin: 5px 5px 10px 0px }
img.images2 {float:left; background:url(images/template/img_bg.jpg) repeat; padding: 2px 2px 4px 2px; margin: 5px 7px 5px 0px; width: 85px }


a:link, a:visited {color:#00b3b3; text-decoration: none }
a:hover {color:#666; text-decoration: none }


div.hr { height: 20px; background: url(images/template/hr.jpg) repeat-x scroll center; margin-top: 5px}
div.clear { clear:both; }
div.hr hr {display: none;}
div.hr2 { height: 20px; background: url(images/template/hr2.jpg) repeat-x scroll center;}
div.hr2 hr {display: none;}


/* START TEMPLATE STYLES */
/* -------------------------------- */
#container {width: 984px; margin: auto;  }
#header{ }
#logo { float: left; width: 245px; height: 62px; position:relative; z-index: 50; padding: 20px 0px 0px 0px }
#logoimage { width: 245px; height: 62px; background:url(images/template/plexus_design_logo.png) no-repeat;}
#freelance {float:right; padding-top: 10px; width: 100%; text-align:right; margin-bottom: -20px}


#nav {float:right; font-size: 146%; width:466px; font-family: Myriad Pro, Tahoma, Trebuchet MS, Tahoma, Arial, Helvetica; overflow: hidden; line-height: 18px; margin-top: 10px; margin-right:-15px}
#nav ul {list-style-type: none; margin: 30px 0px 10px 0px; }
#nav li {display: inline; width: 90px; float:left; background: url(images/template/nav_bg.jpg) repeat-y; background-position:100% 0%; padding: 0 2px 0 3px }
#nav a:link, #nav a:visited {color: #000; display:block;padding: 0 5px 0 5px }
#nav a:hover {color: #00b3b3;  }
#nav li a:link {}
#nav li.last {background: none;width: 80px}
span.nav_small {color: #999; font-size: 70%; font-family: Arial, Helvetica, sans-serif; }
a:hover span.nav_small {color: #fff}

#banner {padding-top: 20px;}
#title_home { width: 770px; height: 117px; background:url(images/titles/home.png) no-repeat; margin-bottom: 15px}
#title_portfolio {width: 770px; height: 117px; background:url(images/titles/portfolio.png) no-repeat; margin-bottom: 15px}
#title_about {width: 850px; height: 117px; background:url(images/titles/about.png) no-repeat; margin-bottom: 15px}
#title_contact {width: 850px; height: 135px; background:url(images/titles/contact.png) no-repeat; margin-bottom: 5px}
#title_blog {width: 850px; height: 135px; background:url(images/titles/blog.png) no-repeat; margin-bottom: 5px}
#title_error404 {width: 850px; height: 135px; background:url(images/titles/error404.png) no-repeat; margin-bottom: 5px}
#title_rates {width: 850px; height: 135px; background:url(images/titles/rates.png) no-repeat; margin-bottom: 5px }
#title_creative {width: 850px; height: 135px; background:url(images/titles/creative.png) no-repeat; margin-bottom: 5px }

#footer {text-align:left; font-size: 100%; color: #999; margin: 50px 0px 0px 0px; padding: 10px 0px 30px 0px; line-height: 1.2; }
#footer a:link, #footer a:visited {color: #999; text-decoration:none }
#footer a:hover {color: #ccc }
#footer_copy {width: 50%; float:left}
#footer_links {width: 40%; float:left; margin-left:90px; text-align:right }


/* END TEMPLATE STYLES */
/* -------------------------------- */


/* START CONTENT STYLES */
/* -------------------------------- */

#maincontent ul {font-size: 12px;  }
#maincontent li {list-style-type: none; color:#999999; line-height: 20px}
#content {width: 100%; margin-top: 0px }
#content_large {width: 64%; float:left; }
#content_large2 {width: 72.5%; float:left; }
#content_large p, #content_large2 p {color: #ccc}
#content_small {float:left; width: 28.5%; margin-left: 65px;}
#content_small2 {float:left; width: 20%; margin-left: 65px;}

a:link.more, a:visited.more { float: left; width: 48px; height:21px; background:url(images/features/more_btn.jpg) no-repeat; text-decoration: none;}
a:link.more2, a:visited.more2 { float: right; width: 48px; height:21px; background:url(images/features/more_btn.jpg) no-repeat; text-decoration: none;}
a:hover.more, a:hover.more2 {background-position: 0px -21px; }

#buttons {margin: -30px 0 40px 0}
a:link.anchors, a:visited.anchors {background:url(images/template/img_bg.jpg) repeat; color: #ccc; font-size: 110%; padding: 2px 35px 2px 6px; margin: 20px 15px 50px 0px;}
a:hover.anchors {background:url(images/template/img_bg_hover.jpg) repeat; color:#fff}


/* END CONTENT STYLES */
/* -------------------------------- */



/* START HOME STYLES */
/* -------------------------------- */
div.features1 {width: 28.5%; color: #fff; float:left; margin: 0px 35px 0px 0px; padding-right: 5px }
div.features2 {width: 28.5%; color: #fff; float:left; margin: 0px 0px 0px 25px; padding-right: 5px}
div.features3 {width: 28.5%; color: #fff; float:left; margin: 0px 0px 0px 59px; padding-right: 5px}
html>body div.features1 {width: 28.5%; color: #fff; float:left; margin: 0px 33px 0px 0px; padding-right: 5px }
html>body div.features2 {width: 28.5%; color: #fff; float:left; margin: 0px 0px 0px 23px; padding-right: 5px}
html>body div.features3 {width: 28.5%; color: #fff; float:left; margin: 0px 0px 0px 56px; padding-right: 5px}
#features a:link img.images, #features a:visited img.images {background:url(images/template/img_bg.jpg) repeat; padding: 10px 10px 13px 10px; margin-bottom: 10px; border-bottom: 1px solid #000}
#features a:hover img.images {background:url(images/template/img_bg_hover.jpg) repeat}
#features {margin: 0px 0px 40px 0px; float:left}
div.creative {margin-bottom: 10px} 
div.creative h2 {display:none}

#content_large div.list {width: 50%; float:left; margin-top: 10px}
#content_large div.list_title {width: 18%;float:left }
#content_large div.list_title2 {width: 25%;float:left; margin-left: 5px }
#content_large div.list_list {width: 82%; float:left; }
#content_large div.list_list2 {width: 72%; float:left; color:#999999;line-height: 18px; font-size: 12px; }
#content_large div.list_list ul, #content_large div.list_list2 ul { font-size: 12px; }
#content_large div.list_list li, #content_large div.list_list2 li {list-style-type: none; color:#999999; line-height: 20px }
#content_large div.list_list2 a:link, #content_large div.list_list2 a:visited, #content_small a:link, #content_small a:visited {color:#00b3b3 }
#content_large div.list_list2 a:hover, #content_small a:hover {color: #999999}

/* END HOME STYLES */
/* -------------------------------- */




/* START PORTFOLIO STYLES */
/* -------------------------------- */

#portfolio {margin: 10px 0 0 0}
#portfolio a:link img.images, #portfolio a:visited img.images {background:url(images/template/img_bg.jpg) repeat; padding: 10px 10px 13px 10px; margin-bottom: 10px; border-bottom: 1px solid #000}
#portfolio a:hover img.images  {background:url(images/template/img_bg_hover.jpg) repeat}
#portfolio div.project {float:left; width: 50%; margin: 0 0 20px 0 }
div.project_title {float:left; width: 50%}
span.top_link { margin-left: 260px; }
span.top_link2 { margin-left: 275px;  }
span.top_link3 { margin-left: 210px; }
#portfolio a:link.top_link_icon, #portfolio a:visited.top_link_icon, #content_small a:link.top_link_icon, #content_small a:visited.top_link_icon {background:url(images/template/top_icon.gif) no-repeat 0% 2px; width: 13px; height: 9px; padding-left: 16px; font-size: 90%  }
#portfolio a:hover.top_link_icon, #content_small a:hover.top_link_icon {background-position: 0px -9px;}

#content_large div.list_list_clients, #bloggercontent div.list_list_clients {width: 33%; float:left; } 

/* END PORTFOLIO STYLES */
/* -------------------------------- */



/* START ABOUT STYLES */
/* -------------------------------- */
div.featuredin p {line-height: 14px; padding: 4px 0px 5px 0px; float:left; margin: 0px }
#content_small2 a:link img.images, #content_small2 a:visited img.images {background:url(images/template/img_bg.jpg) repeat; padding: 5px 5px 8px 5px; margin-bottom: 10px; border-bottom: 1px solid #000;}
#content_small2 a:hover img.images {background:url(images/template/img_bg_hover.jpg) repeat}
#content_small2 a:link img.images2, #content_small2 a:visited img.images2 {background:url(images/template/img_bg.jpg) repeat; padding: 3px 3px 5px 3px; margin-bottom: 3px; border-bottom: 1px solid #000;}
#content_small2 a:hover img.images2  {background:url(images/template/img_bg_hover.jpg) repeat}

/* --------------------------------------------------------------------- */	
/* Start FLICKR Styles */
/* --------------------------------------------------------------------- */	

#flickr { margin: 10px 0px 0px 0px; float:left } 
#flickr img {float:left; margin:0px 14px 11px 0px; width:62px; height:62px; background:url(images/template/img_bg.jpg) repeat; padding: 8px 8px 11px 8px; border-bottom: 1px solid #000;}
#flickr a:hover img {background:url(images/template/img_bg_hover.jpg) repeat }


/* --------------------------------------------------------------------- */	
/* End FLICKR Styles */
/* --------------------------------------------------------------------- */

/* END ABOUT STYLES */
/* -------------------------------- */



/* START CONTACT STYLES */
/* -------------------------------- */
#form {width: 50%; float:left; }
#form input.textbox, #form textarea.textbox {font-family: Tahoma, Arial, Helvetica, sans-serif; color: #333; font-size: 12px; padding: 2px 2px 4px 2px; border: 4px solid #333; background-color: #f0f0f0 }
#form p {margin-bottom: 2px}
textarea.textbox {width: 90%; height: 150px; background-color: #f0f0f0; padding: 2px 2px 4px 2px; }
input.textbox {width: 90%; margin: 5px 0px 10px 0px }
input.btn{width:51px; height:21px; margin-top: 10px; outline:none; border: 0px; background:url(images/contact/submit.jpg) no-repeat;}
input.btn:hover  {background-position: 0 -20px}
#reasons {width: 45%; float:left; padding-left: 45px; line-height: 18px }


/* END CONTACT STYLES */
/* -------------------------------- */




/* --------------------------------------------------------------------- */	
/* START BLOGGER STYLES
/* --------------------------------------------------------------------- */	
#bloggercontent h4 {font-size: 1.2em; color:#666; font-weight: lighter; margin: 20px 0px 10px 0px; padding: 0px; border-bottom: none }
#bloggercontent h5 {font-size: 1em; color: #666; margin-top: 20px; padding: 0px }
#bloggercontent h3 {font-size: 1.3em; color:#00b3b3; border-bottom: 1px solid #00b3b3; font-weight: lighter; margin: 20px 0px 10px 0px;  }
#bloggercontent a:link img.right, #bloggercontent a:visited img.right, #bloggercontent a:link img.left, #bloggercontent a:visited img.left {background:url(images/template/img_bg.jpg) repeat; padding: 10px 10px 13px 10px; margin-bottom: 10px; border-bottom: 1px solid #000; display:block }
#bloggercontent a:hover img.right, #bloggercontent a:hover img.left {background:url(images/template/img_bg_hover.jpg) repeat}
#bloggercontent img { border:0; display:block }


#bloggercontent ul {font-size: 12px;  margin: 10px 10px 20px 30px }
#bloggercontent ol {font-size: 12px;  margin: 10px 10px 20px 30px }
#bloggercontent ol li {list-style-type:decimal; color:#00b3b3; line-height: 20px; }
#bloggercontent li {list-style-type: none; color:#00b3b3; line-height: 20px; list-style-type:square }
#bloggercontent li a:link {color:#00b3b3;}
#bloggercontent li a:hover {color: #ccc }

#bloggercontent a:link, #bloggercontent a:visited {text-decoration:none; color: #00b3b3;  } 
#bloggercontent a:hover {color:#666}


/* --------------------------------------------------------------------- */	
/* END BLOGGER STYLES */
/* --------------------------------------------------------------------- */	

/* START TABLE STYLES */
/* -------------------------------- */

table.tablestyles {width: 100%; text-align: left; margin-bottom: 40px; }
th { vertical-align:top; padding: 5px; color: #fff; font-weight: 1.5; font-size: 110%; text-align:left; border-bottom: 1px solid #666; height: 20px}
th.col1 {width: 80%;  }
th.col2 {width: 10%;  }
th.col3 {width: 10% }
td {padding: 5px;  }
tr.dtgheader a:link, tr.dtgheader a:visited {color: #fff; text-decoration: none } 
tr.dtgheader a:hover {color: #63a4c5; text-decoration: none } 
tr.dtgheader th.first, td.first  {padding-left: 5px}

td.list {color: #ccc; font-size: 80%}
.dtginfo_alternate { font-size: 120%; font-weight: bold; color: #00b3b3; height: 35px; vertical-align: bottom  }
.dtginfo {font-size: 120%; font-weight: bold; color: #00b3b3; height: 25px; vertical-align: bottom   }



/* END TABLE STYLES */
/* -------------------------------- */



/* START FONT STYLES */
/* -------------------------------- */
/*
10 77
11 85
12 93 (was 92)
13 100
14 108 (was 107)
15 116 (was 114)
16 123.1 (was 122)
17 131 (was 129)
18 138.5 (was 136)
19 146.5 (was 144)
20 153.9 (was 152)
21 161.6 (was 159)
22 167
23 174
24 182
25 189
26 197
/* END FONT STYLES */
/* -------------------------------- */


