
/******* MAIN STYLES & GENERAL LAYOUT **********/

/* ~Body
-----------------------------------*/
	
	body {
		font-family:Arial, sans-serif;
		font-size: 62.5%;
		color:#333;
		margin:0;
		padding:0;
		height:100%;
		text-align:center;
		background:#282828 url(../images/layout/background-black.jpg) repeat-y center top;
		}


/* ~divs
-----------------------------------*/

	div {
		border:0px solid #00f;
		
		}

	div#fade2 {
		height:50px;
		font-size:11px;
		line-height:160%;
		padding-left:1px;
		
		}


	div.spacer,div.spacer-w {
		clear:both;
		height:1px;
		font-size:1px;
		border:none;
		margin:0; 
		padding:0;
		background:transparent;
		}


	#page-container {
		width:780px;
		height:99%;
		margin:0 auto;
		background:#000 url(../images/layout/background-black.jpg) repeat-y;
		text-align:left;
		}

	#header {
		width:780px;
		height:280px;
		position:absolute;
		top:0px;
		}
		
	#hosting #header {
		height:560px;	
		background:transparent url(../images/banners/banner-hosting.jpg) no-repeat left 39px;	
		}
		
	#intro #header {
		height:560px;	
		background:transparent url(../images/banners/banner-intro.jpg) no-repeat left 39px;	
		}

	#home #header {
		background:transparent url(../images/banners/banner-home.jpg) no-repeat left 39px;
		}

	#about #header {
		background:transparent url(../images/banners/banner-about.jpg) no-repeat left 39px;
		}

	#contact-us #header {
		background:transparent url(../images/banners/banner-contact.jpg) no-repeat left 39px;
		}

	#services #header,#latest-news #header {
		background:transparent url(../images/banners/banner-services.jpg) no-repeat left 39px;
		}

	#latest-news #header {
		background:transparent url(../images/banners/banner-news.jpg) no-repeat left 39px;
		}

	#our-work #header {
		background:transparent url(../images/banners/banner-work.jpg) no-repeat left 39px;
		}




	#content {
		width:780px;
		border-color:#0F0;
		text-align:left;
		background:#000 url(../images/layout/background-white.jpg) repeat-y;
		position:relative;
		top:280px;
		padding:25px 0 0 0;
		vertical-align:top;
		}

	.col3-left, .col3-middle, .col3-right {
		width:230px;
		margin:0;
		vertical-align:top;
		text-align:left;
		}

	.col3-left {
		position:relative;
		float:left;
		left:25px;
		}

	.col3-middle {
		margin:0px 273px 0 273px;
		}

	.col3-right {
		position:relative;
		float:right;
		right:25px;

		}


	.col2-right {
		width:480px;
		float:right;
		margin:0 25px 0 0;
		
		}

	.col2-right p {
		width:225px;
		}


       /* _____News box columns______ */

	.left2 {
		float:left;
		}

	.right2 {
		float:right;
		}

	.left2,.right2 {
		width:240px;
		}

	.right2 p, .right2 dl, .right2 h2{
		margin-left:11px;
		}


	/*
	@media all and (min-width: 0px)
	{
	body #content .col3-middle p, body #content .col3-middle img { top:0px; }
	:root body #content .col3-middle p, body #content .col3-middle img { top:0px; }
	}*/





	#footer {
		background:#000 url(../images/layout/background-black.jpg) repeat-y center top;
		width:780px;
		height:202px;
		text-align:left;
		padding-top:25px;
		text-align:center;
		position:relative;
		margin-top:22px;

		}



     /* _____Navigation______ */
	
       /* _____intro______ */

	#hosting-link {
		background: url(../images/menu/visit-gigabyte.jpg) no-repeat 7px 12px;
		font-size:37px;
		height:37px;
		margin-left:19px;}
	#hosting-link:hover {
		background: url(../images/menu/visit-gigabyte-over.jpg) no-repeat 7px 12px;}

       /* _____intro______ */

	#intro-link {
		background: url(../images/menu/intro_off.gif) no-repeat 7px 12px;
		font-size:37px;
		height:37px;
		margin-left:6px;}
	#intro-link:hover {
		background: url(../images/menu/intro_over.gif) no-repeat 7px 12px;}

       /* _____Home______ */

	#home-link {
		background: url(../images/menu/home_off.jpg) no-repeat left bottom;}
	#home-link:hover {
		background: url(../images/menu/home_over.jpg) no-repeat left bottom;}
	#home #home-link {
		background: url(../images/menu/home_on.jpg) no-repeat left bottom;}

       /* _____About______ */

	#about-link {
		background: url(../images/menu/about_off.jpg) no-repeat left bottom;}
	#about-link:hover {
		background: url(../images/menu/about_over.jpg) no-repeat left bottom;}
	#about #about-link {
		background: url(../images/menu/about_on.jpg) no-repeat left bottom;}

       /* _____services______ */

	#services-link {
		background: url(../images/menu/services_off.jpg) no-repeat left bottom;}
	#services-link:hover {
		background: url(../images/menu/services_over.jpg) no-repeat left bottom;}
	#services #services-link {
		background: url(../images/menu/services_on.jpg) no-repeat left bottom;}

       /* _____work______ */

	#work-link {
		background: url(../images/menu/work_off.jpg) no-repeat left bottom;}
	#work-link:hover {
		background: url(../images/menu/work_over.jpg) no-repeat left bottom;}
	#our-work #work-link {
		background: url(../images/menu/work_on.jpg) no-repeat left bottom;}

       /* _____news______ */

	#news-link {
		background: url(../images/menu/news_off.jpg) no-repeat left bottom;}
	#news-link:hover {
		background: url(../images/menu/news_over.jpg) no-repeat left bottom;}
	#latest-news #news-link {
		background: url(../images/menu/news_on.jpg) no-repeat left bottom;}

       /* _____contact______ */

	#contact-link {
		background: url(../images/menu/contact_off.jpg) no-repeat left bottom;}
	#contact-link:hover {
		background: url(../images/menu/contact_over.jpg) no-repeat left bottom;}
	#contact-us #contact-link {
		background: url(../images/menu/contact_on.jpg) no-repeat left bottom;}

       /* _____quote______ */

	#quote-link {
		background: url(../images/menu/quote_off.jpg) no-repeat left bottom;}
	#quote-link:hover {
		background: url(../images/menu/quote_over.jpg) no-repeat left bottom;}
	#quote #quote-link {
		background: url(../images/menu/quote_on.jpg) no-repeat left bottom;}





     /* _____Content______ */



     /* _____Header______ */

	#icons {
		position:relative;
		top:170px;
		left:20px;
	}

	#icons img {
		margin-right:7px;
	}

	ul, li {
		padding:0;
		}
		

	#header li {
		display:inline;
		}


	#header ul {
		margin-left:25px;
		}

	#header ul li a, #header ul li a img {
		margin:0;
		padding:0;
		}


	#header ul li a {
		font-size:25px;
		text-decoration:none;
		background-position:left bottom;
		background-repeat:no-repeat;
		}

	#header #end {
		padding:0;
		margin-left:98px;
		font-size:15px;
	
		}




/* Main HTML Elements
-----------------------------------*/

	.l {
		float:left;
		}

	.r {
		float:right;
		}

	.preload {
		display:none;
		}

	#content a, #content em, q {
		font-size:1em;
		color:#117ADF;
		text-decoration:none;
		font-style:normal;
		}

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



		q {
		margin:0 0 5px 0;
		padding:0;
		}





	h1 {
		padding-left:15px;
		font-size:1.8em;
		line-height:150%;
		font-weight:normal;
		background: url('../images/red.gif') repeat-y top left;
		}

	h2,h2 img {
		margin:0;
		padding:0;
		position:relative;
		top:0;
		left:0;

		}


	h4 {
		font-size:13px;
		height:13px;
		margin:0 0 0 0;
		padding:0;
		vertical-align:top;
		}

	h3 {
		margin:0;
		padding:0;
		}

	h6 {
		
	
		}




	h5  {
		font-size:0.9em;
		font-family:Verdana, sans-serif;
		font-weight:normal;
		color:#fff;
		padding:0;
		margin:0 0 10px 0;
		}

	#footer #footnote h5 a  {
		color:#fff;
		text-decoration:none;
		margin:0 auto 0 auto;
		}

	h5 a:hover  {
		color:#fff;
		text-decoration:underline;
		}

	p {
		font-size:1.1em;
		line-height:170%;
		padding:0 0px 0 1px;
		margin:0;
		clear:none;
		}


	img {
		border-width:0px;
		}

	img.thumb {
		margin-top:11px;
		}


	.hr, .hr-bottom {
		background: url(../images/layout/hr.gif) repeat-x;
		height:3px;
		width:100%;
		margin:11px 0 11px 0;
		font-size:3px;
		}

	.hr-bottom {
		margin:11px 0 0 0;
		}

	ul, li {
		margin:0;
		padding:0;
		list-style:none;
		}
	dl {
		font-size:1.1em;
		}

	dd,dt {
		display:inline;
		line-height:175%;
		}

	dd {
		color:#117ADF;
		margin:3px 0 3px 4px;
		}



     /* _____Footer______ */


	#content #footer li, #content #footer ul {
		padding:0;
		margin:0;
		list-style:none;
		font-size:11px;
		font-family:Helvetica, Arial, sans-serif;
		line-height:170%;
		color:#fff;
		font-weight:normal;
		clear:none;
		}

	#content #footer ul li a {
		color:#fff;
		}

	#content #footer ul {
		margin-top:4px;
		}

	#footer .hr, #footer .hr-bottom {
		background: url(../images/layout/hr-footer.gif) repeat-x;
		}

	#footer .hr {
		margin:6px 0 0 0;
		}

	#footer .hr-bottom {
		margin:10px 0 0 0;
		}

	#footer img {
		display:inline;
		margin-bottom:3px;
		}

	#footer img#feed {
		display:inline;
		margin:0 0 0 138px;
		padding:0;
		}

	#footer .col3-left, #footer .col3-middle, #footer .col3-right {
		height:170px;
		}


	#footnote {
		margin-bottom:0;
		height:20px;
		}

	.clear {
		clear:both;
		}

	#footer .col3-left ul li {
		clear:both;

	}

	#footer .col3-left ul li span {
		display:inline;

	}


     /* _____AJAX Popup______ */

	#quote {
		position: relative;
		top:50px;
		margin:0 auto;
		z-index: 1002;

		border:0px solid;
		width:402px;
		height:618px;
		background: transparent url(../images/layout/quote-bg.gif) no-repeat 0px 0px;
		text-align:left;
		padding:81px 0 0 45px;
		}
		

	#comment {
		position: relative;
		top:160px;
		margin:0 auto;
		z-index: 1002;

		border:0px solid;
		width:270px;
		height:618px;
		background: transparent url(../images/layout/comments-bg.gif) no-repeat 0px 0px;
		text-align:left;
		padding:80px 0 0 27px;		
	}

	#wrapper, #comment-wrapper {
		display:none;
		z-index:1001;
		color:#fff;
		text-align:center;
		border:0px solid #CCC;
		}

	#gray,#wrapper,#comment-wrapper {
             position: absolute;
             top: 0px;
             bottom: 0px;
             left: 0px;
             right: 0px;

		height:2000px;
		width:100%;

		}

	#gray {
             overflow: hidden;
             padding: 0;
             margin: 0;
             background-color: #000;
             filter: alpha(opacity=60);
		display:none;
             opacity: 0.60;
             z-index: 1000;
		} 
		

	#wrapper input[type=text],#comment-wrapper input[type=text] {
		width:219px;
		height:22px;
		background:#252525 url(../images/layout/box-small.jpg) no-repeat;
		display:block;
		padding:3px 0 0 5px;
		border-width:0px;
		
		
	}
	
	#wrapper input[type=image],#comment-wrapper input[type=image] {
		margin-top:3px;	
	}
	
	#wrapper input[type=file] {
		background:#fff url(../images/layout/box-small.jpg) no-repeat;
		
		
	}
	
	#wrapper textarea {
		font-size:1em;
		font-family:Helvetica,Arial,Sans-serif;
		width:308px;
		height:192px;
		background: #252525 url(../images/layout/box-big.jpg) no-repeat;	
		border-width:0px;
		padding: 5px 0 0 5px;
		
	}
	
	#comment-wrapper textarea {
		font-size:1em;
		font-family:Helvetica,Arial,Sans-serif;
		width:219px;
		height:97px;
		background: #252525 url(../images/layout/box-comments.jpg) no-repeat;	
		border-width:0px;
		padding: 5px;
	}
	
	#wrapper label,#comment-wrapper label {
		display:block;
		margin:10px 0 3px 2px;
		font-size:1.1em;

	}
	
	#wrapper p {
		width:314px;
		margin:7px 0 8px 0;
		line-height:130%;

	}
	
	
	#log,#log1 {
		width: 314px;
		margin-top: 10px;
		display:none;
	}
 
	#log_res,#log_res1 {
		border:0px solid #f00;
		width:313px;
	}
 
	#log_res.ajax-loading,#log_res1.ajax-loading {
		padding: 20px 0;
		background: url(../images/content/sending.gif) no-repeat center;
	}
	
	.close {
		position:absolute;
		top:5px;
		left:365px;
	}
	
	#comment .close {
		left:235px;
	}

	fieldset {
		border-width:0px;
		margin:0;
		padding:0;	
	}

/******* PAGE SPECIFIC STYLES & LAYOUT **********/

     /* _____Intro______ */

	#intro #intro-link {
		position:relative;
		top:0px;
		left:14px;
		z-index:1000;		
	}

     /* _____About______ */



     /* _____Services______ */


	.links li {
		color:#117ADF;
		padding:3px 0 3px 0;
		font-size:1.1em;
		}

	#content .col3-left ul.links li a.selected {
		color:#000;
		text-decoration:underline;
		}

	ul.links {
		margin:2px 0 8px 0;
		}

     /* _____News______ */


	#latest-news p q {
		line-height:120%;
		}

	#latest-news dl {
		height:91px;
		}

	#latest-news #content .col3-right h3 {
		font-weight:normal;
		margin:0;
		padding:0;
		font-size:1.1em;
		}

	#latest-news #content .col3-right h3 span {
		margin:0 0 10px 0;
		}

	#latest-news .col3-right p {
		clear:both;
		}
		
	/* _____Contact Us______ */


	#contact-us .contact-link {
		color:#333;
		text-decoration:underline;
		}


