/****************** CSS table of contents *****************/
/*

	- CSS Reset
	- Generic Styling
	
	- Wrapper
	- Header (logo, top-menu)
		* logo
		* Top-Menu
		* Drop-Down Menus
	- Banner (swfobject)
	- Quick-Services
	- Main-Content
		* about-us-left-panel-inner
		* about-us-right-panel
	- Get-Started
		* get-started-left-panel
		* quick-contact
	- Portfolio
	- Footer
	- Copyright
	
*/
/**********************************************************/

/* CSS Reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;}q:before,q:after{content:'';}
body {
	position:relative;
	background:#001628 url(../images/bg.png) repeat-x top left;
	color:#4b4b4b;
	font-family:Helvetica, "Helvetica Neue", Arial, sans-serif;
	font-size:13px;
	padding-top:31px;
	outline:none;
}

/* Generic */
a, a:visited {
	color:black;
	outline:none;
	outline:0;
}

.cl {
	clear:both;
	font-size:1px;
	height:1px;
	line-height:1px;
}

strong, .strong {
	font-weight:bold;
}

.align-left {
	float:left;
	width:auto;
}

.align-right {
	float:right;
	width:auto;
}

.small-margin-bottom {
	margin-bottom:13px;
}

.large-margin-bottom {
	margin-bottom:30px;
}

.small-padding-bottom {
	padding-bottom:18px;
}

.large-padding-bottom {
	padding-bottom:30px;
}

/* Wrapper */
#wrapper {
	position:relative;
	width:940px;
	margin:0 auto;
}

/* Header */
#header {
	position:relative;
	width:940px;
	height:352px;
	background:url(../images/header_bg.png) no-repeat top left;
}

/* logo */
h1#logo {
	display: block;
	position:absolute;
	width:379px;
	height:85px;
	top:-17px;
	left:-10px;
	text-indent:-9999em;
	background:url(../images/logo-timecodestudios.png) left top no-repeat;
	z-index:10;
}

h1#logo a {
	display: block;
	width:379px;
	height:85px;
}

/* top-menu */
#top-menu {
	position:absolute;
	width:575px;
	height:36px;
	top:11px;
	left:380px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#6B6B6B;
	font-weight:normal;
	text-transform:uppercase;
	z-index:100;
}

#top-menu li {
	display:block;
	float:left;
	font-size:14px;
	position:relative;
}

#top-menu li span {
	display:block;
	float:left;
	width:5px;
	height:36px;
	line-height:36px;
	font-size:1px;
	background:url(../images/nav-sep.jpg) no-repeat top left;
}

#top-menu li a {
	display:block;
	float:left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#6B6B6B;
	font-weight:normal;
	text-transform:uppercase;
	text-decoration:none;
	height:36px;
	line-height:39px;
	padding:0 7px;
}

#top-menu li.on {
	background:url(../images/nav-item_bg2.jpg) repeat-x top left;
	color:#074677;
}

#top-menu li.on a {
	color:#074677;
}

#top-menu li a:hover, #top-menu li a.on {
	background:url(../images/nav-item_bg2.jpg) repeat-x top left;
	color:#074677;
}

#top-menu li ul.subnav {
	display:none;  
	position: absolute;
	left:0px;
	top:35px;  
	float:left;
	background-color:#fcfcfc;
	padding:14px 0px;
}  

#top-menu li ul.subnav li {
	clear:both;
	display:block;
	background:none;
}  

#top-menu li ul.subnav li a {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#074677;
	text-transform:none;
	width:200px;
		
	height:26px;
	line-height:26px;
	padding:0 10px;
}  

#top-menu li ul.subnav li a:hover {
	color:white;
	background:#17639E url(../images/nav-item_bg.jpg) no-repeat top left;
}

/* Drop-Down Menus */
#menu1 {
	position:absolute;
	top:42px;
	left:442px;
	padding:14px 0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#074677;
	background-color:#fcfcfc;
	width:219px;

	/* you need those for menu functionallity */
	z-index:100;
	visibility:hidden;
}

#menu1 a {
	display:block;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#074677;
	height:26px;
	line-height:26px;
	padding:0px 10px;
	text-decoration:none;
}

#menu1 a:hover, #menu1 a.on {
	color:white;
	background:#17639E url(../images/nav-item_bg.jpg) no-repeat top left;
}

/* banner (swfobject) */
#banner {
	position:absolute;
	top:47px;
	left:0px;
	width:940px;
	height:306px;
	z-index:0;
}

#corner {
	position:absolute;
	display:block;
	width:8px;
	height:72px;
	top:244px;
	left:940px;
}

/* quick-services */
#quick-services {
	position:relative;
	width:940px;
	height:268px;
	background:url(../images/quick-services_bg.jpg) no-repeat top left;
}

.quick-service {
	position:absolute;
	top:19px;
	height:245px;
}

.quick-service h3 {
	text-align:center;
	font-size:20px;
	font-weight:normal;
	color:#656566;
	margin-bottom:2px;
	line-height:1.1em;
	height:1.1em;
	background-color:#e8e8e8;
}

.quick-service p {
	text-align:center;
	font-size:13px;
	font-weight:normal;
	color:#656566;
}

.quick-service p.image {
	text-align:center;
	position:relative;
	height:178px;
}

.quick-service p.image img {
	position:absolute;
	left:12px;
}

a.explore-link {
	display:block;
	position:absolute;
	width:115px;
	height:32px;
	bottom:12px;
	right:10px;
	text-indent:-9999em;
	background:url(../images/explore.png) no-repeat top left;
}

.webdesign {
	width:210px;
	left:15px;
}

.webdesign p.image img {
	top:8px;
}

.logos {
	width:210px;
	left:255px;
}

.newsletters {
	width:210px;
	left:490px;
}

.domains {
	width:210px;
	left:715px;
}

.domains p.image img {
	top:8px;
}

/* main-content */
#main-content {
	position:relative;
	width:940px;
	background:#F5F5F5 url(../images/main-content_bg.gif) repeat-x bottom left;
	padding:30px 0px;
}

#main-content p {
	margin-bottom:15px;
}

.about-us-left-panel {
	display:inline;
	position:relative;
	width:432px;
	padding:14px;
	background:#EBECEC url(../images/about-us-panel_bg.jpg) repeat-x top left;
	border:1px solid white;
	margin-left:25px;
	float:left;
}

.about-us-left-panel h2 {
	font-size:20px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:5px;
	background-color:#E4E6E5;
}

.about-us-left-panel h3 {
	font-size:15px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:20px;
}

.about-us-left-panel-inner {
	padding:10px;
}

.about-us-right-panel {
	display:inline;
	position:relative;
	width:410px;
	margin-left:25px;
	float:left;
}

.about-us-right-panel h2 {
	font-size:23px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:30px;
	color:#535151;
	background-color:#f5f5f5;
}

.about-us-right-panel h3 {
	font-size:17px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:15px;
}

.bottom-line {
	background:url(../images/bottom-line.gif) no-repeat bottom center;
}

.read-more-botton {
	display:block;
	width:139px;
	height:27px;
	background:url(../images/read-more.jpg) no-repeat top left;
	text-indent:-9999em;
}


/* general content */


.general-content-panel {
	display:inline;
	position:relative;
	width:432px;
	padding:14px;	
	
	margin-left:25px;
	float:left;
}

.general-content-panel h2 {
	font-size:20px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:15px;
	
}

.general-content-panel h3 {
	font-size:15px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:20px;
}

.general-content-panel-inner {
	padding:10px;
}

.sitemap {
	margin: 0 0 0 15px;
	padding:auto;
	list-style:disc
	
}
.sitemap li {
	margin: 0 0 0 15px;
	padding:auto;
}
.sitemap li .subnav {
	margin: 0 0 0 15px;
	list-style:circle
}

/* full width services */


.services-pic {
	display:inline;
	position:relative;
	width:318px;
	padding:0 14px 14px 14px;
	float:left;
}
.services-content-panel {
	display:inline;
	position:relative;
	width:850px;
	padding:14px;
	
	margin-left:25px;
	float:left;
}

.services-content-panel h2 {
	font-size:20px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:5px;
}

.services-content-panel h3 {
	font-size:15px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:20px;
}

.services-content-panel-inner {
	padding:10px;
}


/* get-started */
#get-started {
	position:relative;
	width:940px;
	background:#F5F5F5 url(../images/main-content_bg.gif) repeat-x bottom left;
	padding:30px 0px;
}

#get-started p {
	margin-bottom:15px;
}

#get-started-left-panel {
	display:inline;
	position:relative;
	width:535px;
	float:left;
	margin-left:40px;
}

#quick-contact {
	display:inline;
	position:relative;
	width:290px;
	float:left;
	margin-left:40px;
}

#get-started-left-panel h2 {
	font-size:20px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:5px;
	color:#4B4B4B;
	background-color:#f5f5f5;
}

#get-started-left-panel h3 {
	font-size:15px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:20px;
	color:#4B4B4B;
}

#get-started-left-panel h3 a {
	text-decoration:none;
	color:#4B4B4B;
}

#get-started-left-panel h3 a:hover {
	text-decoration:underline;
}

ul.get-started li {
	margin-bottom:30px;
	width:505px;
}

ul.get-started li h4 {
	display:block;
	font-size:16px;
	font-weight:normal;
	color:#4B4B4B;
	margin-bottom:2px;
}

ul.get-started li.one {
	background:url(../images/list-one.gif) no-repeat center left;
	padding-left:50px;
}

ul.get-started li.two {
	background:url(../images/list-two.gif) no-repeat center left;
	padding-left:50px;
}

ul.get-started li.three {
	background:url(../images/list-three.gif) no-repeat center left;
	padding-left:50px;
}

#quick-contact h2 {
	font-size:20px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:5px;
	color:#4B4B4B;
	background-color:#f5f5f5;
}

.quick-contact-form p {
	margin-bottom:5px !important;
}

.quick-contact-form input.textbox {
	font-size:13px;
	padding:4px;
	width:270px;
	color:#757575;
	border:1px solid #e9e9e9;
}

.quick-contact-form textarea {
	font-size:13px;
	padding:4px;
	width:270px;
	color:#757575;
	border:1px solid #e9e9e9;
	font-family:Helvetica, "Helvetica Neue", Arial, sans-serif;
	margin-bottom:10px;
}

/* portfolio */
#portfolio {
	position:relative;
	width:940px;
	padding:30px 0px 50px 0px;
	background:#F5F5F5;
}

#portfolio h2 {
	font-size:23px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:30px;
	margin-left:20px;
	color:#535151;
	background-color:#f5f5f5;
}

.portfolio-item {
	position:relative;
	width:443px;
	float:left;
	background:url(../images/portfolio_bg.gif) no-repeat bottom center;
	padding-bottom:25px;
	padding-left:17px;
}

.portfolio-item p.portfolio-item-desc {
	text-align:justify;
	font-size:13px;
	min-height:45px;
	height:auto !important;
	height:45px;
	padding-left:3px;
}

.portfolio-item-title {
	position:relative;
	width:444px;
	height:27px;
	margin-bottom:10px
}

.portfolio-item-image {
	height:275px;
}

.portfolio-item h3 {
	display:block;
	font-size:18px;
	font-weight:normal;
	height:1.1em;
	line-height:1.1em;
	margin-bottom:0px;
	color:#535151;
	width:300px;
	background-color:#f5f5f5;
}

a.visit-website {
	display:block;
	width:139px;
	height:27px;
	background:url(../images/visit-website.gif) no-repeat top left;
	text-indent:-9999em;
}

.portfolio-item-title h3 {
	position:absolute;
	top:5px;
	left:2px;
}

.portfolio-item-title a.visit-website {
	position:absolute;
	top:0px;
	right:0px;
}

/* Footer */
#footer {
	position:relative;
	width:940px;
	height:195px;
	background:url(../images/footer_bg.jpg) no-repeat top left;
}

#footer ul {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:white;
	text-transform:uppercase;
	line-height:1.7em;
	position:absolute;
	top:30px;
}

#footer a {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:white;
	text-transform:uppercase;
	text-decoration:none;
}

#footer a:hover {
	text-decoration:underline;
}

#footer ul.services1 {
	left:35px;
}

#footer ul.services2 {
	left:250px;
}

#footer ul.services3 {
	left:450px;
}

#footer address {
	display:block;
	position:absolute;
	width:240px;
	top:90px;
	right:30px;
	line-height:1.5em;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	font-weight:bold;
	color:#a8a8a8;
	text-align:right;
}

/* copyright */
#copyright {
	position:relative;
	width:940px;
	margin:0 auto;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#a8a8a8;
	padding:20px 0px;
}

#copyright p {
	text-align:center;
}

#copyright p a {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#a8a8a8;
	text-decoration:none;
}

#copyright p a:hover {
	text-decoration:underline;
}