﻿@charset "utf-8";
html{
	overflow: auto;
}

body {
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	background: #000000;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #ffffff;
	overflow: hidden;
}
.oneColFixCtrHdr #container {
	width: 1024px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #000000;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
}
.oneColFixCtrHdr #header {
	background-color: #000000;
	background-image:url(/images/logo.gif);
	background-repeat: no-repeat;
	height:225px;

}
.oneColFixCtrHdr #mainContent {
	background: #000000;
	margin:0px;
	height: 402px;
	overflow:hidden;
}
.oneColFixCtrHdr #mainContent td#left_column, .oneColFixCtrHdr #mainContent td#right_column{
	width: 105px;
	height:401px;
}
.oneColFixCtrHdr #mainContent td#main_column{
	width:800px;	
	background-color:#1e1d1d;
	overflow:hidden;
}
.oneColFixCtrHdr #footer {
	background:#000000;
	height: 50px;
}
.oneColFixCtrHdr #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
}
.oneColFixCtrHdr .horizontal_devider{
	height: 1px;
	background-image: url(/images/horizontal_ruler.gif);
	background-repeat:no-repeat;
	margin-left: 10px;
}

.right_devider{
	float: right;
	width:1px;
	height:401px;
	background-image: url(/images/vertical_ruler.gif);
	background-repeat:no-repeat;	
}
.copyright{

	float:right;
	font-size:10px;
	color: #ff7e00;
	padding-right: 115px;
	padding-top: 10px;
}
.language{
	clear:both;	
	float:left;
	font-size:10px;
	color: #ff7e00;
	padding-left: 107px;
	padding-top: 10px;
}
/*
	Horizontal Accordion
*/

.horizontal_accordion_toggle {
	/* REQUIRED */
	float: left;	/* This make sure it stays horizontal */
	/* REQUIRED */
	background-color:transparent;
	display: block;
	height: 401px;
	width: 51px;
	color: #ffffff;
	text-decoration: none;
	outline: none;
	cursor: pointer;
	margin: 0 0 0 0;
}
.horizontal_accordion_content {
	/* REQUIRED */
	height: 401px!important;	/* We need to define a height for the accordion as it stretches the width */
	float: left;	/* This make sure it stays horizontal */
	width: 595px;
	/* REQUIRED */
	overflow: hidden;
	background-color: #343333;
	color: #ffffff;
}
	
.horizontal_accordion_content .vertical_slide {
	height: 395px;
	width: 575px;
	height: 400px; 
	padding: 5px 10px 15px 10px;

}

#2 {
	display: none;
}
/* Container styling*/
#horizontal_container {
margin: 0px 0px 0px 0px;
width: 800px;   
height: 401px!important;  
overflow:hidden;  
}

#horizontal_container h3{
		
}


#main_column ul{
  list-style: none;
  margin: 0;
  padding: 0;
}

#main_column ul li{
  float: left;
  display: block;
}

#main_column ul li .horizontal_accordion_toggle{
  display: block;
  overflow: hidden;
  height: 401px;
  width: 51px;
}
#main_column ul li .wrapper{
  display: block;
  overflow: hidden;
  height: 401px;
  width: 51px;
}

.about{
	background: url(/images/about.gif) no-repeat top left;
	cursor:pointer;
}
.horizontal_accordion_toggle_active#about {
	background: url(/images/about_selected.gif) no-repeat top left;
}
.webdesign{
	background: url(/images/webdesign.gif) no-repeat top left;
	cursor:pointer;
}
.horizontal_accordion_toggle_active#webdesign{
	background: url(/images/webdesign_selected.gif) no-repeat top left;
}
.office{
	background: url(/images/office.gif) no-repeat top left;
	cursor:pointer;
}
.horizontal_accordion_toggle_active#office{
	background: url(/images/office_selected.gif) no-repeat top left;
}
.contact{
	background: url(/images/contact.gif) no-repeat top left;
	cursor:pointer;
}
.horizontal_accordion_toggle_active#contact{
	background: url(/images/contact_selected.gif) no-repeat top left;
}

#main_column #a1{
	display: block;
	overflow: hidden;
	height: 401px;
	width: 646px;
}

#main_column ul li img.toggle_image{
	position: absolute;
	cursor: pointer;
}

#main_column ul li .content_container{
	width: 580px;
	display: block;
	margin-left: 61px;
	margin-top:0px;
	height: 400px;
	font-size:12px;
	overflow:hidden;
	cursor:default;
	background-color:#1E1D1D;
}
#main_column ul li .content_container .inner_content{
	width:575px; 
	height:0px;
	overflow:hidden;
}

#main_column ul li .content_container a{
	color:#FF7E00;
	padding-left: 20px;
	padding-bottom:3px;
	text-decoration:none;
}
#main_column ul li .content_container a.link{
	color:#FF7E00;
	padding-left: 0px;
	padding-bottom:3px;
	text-decoration:none;
}


#main_column ul li .content_container a.down{
	background:url(/images/arrow-down.png) no-repeat top right;
}

#main_column ul li .content_container a.up{
	background:url(/images/arrow-up.png) no-repeat bottom right;
}

#main_column ul li .content_container .content_table{
	width: 575px; 
	height: 400px;
	overflow:hidden;
	background-color:#1E1D1D;
}

#main_column ul li .content_container .tr-nav{
	height: 20px;
	text-align:right;
}

#main_column ul li .content_container .tr-content{
	height: 358px; 
	vertical-align: top
}

.top{
	background-color:#1E1D1D;
	vertical-align:baseline;
	color:#ffffff;
	font-size:15px;
	float:left;
	margin-left:390px;
	width:150px;
	height:20px;
}

.bottom{
	background-color:#1E1D1D;
	vertical-align:top;
	color:#ffffff;
	font-size:15px;
	float:left;
	margin-left:390px;
	width:150px;
	height:23px;
	margin-bottom:5px;
}

.loading{
	position:relative;
	top: 175px;
	left: 265px;
	width:50px;
	height:0px;
	background-color:#1E1D1D;
}

.orange{
	color:#ff7e00;
}

/* Portfolio */

.portfolio tr{
	height: 350px;
}

.portfolio .portfolio_left_nav{
	width:50px;
	background:url(/images/portfolio_nav-left.gif) top left no-repeat;
	cursor:pointer;
}

.portfolio .portfolio_left_nav:hover{
	background:url(/images/portfolio_nav-left-hover.gif) top left no-repeat;
}

.portfolio .portfolio_right_nav{
	width:50px;
	background:url(/images/portfolio_nav-right.gif) top left no-repeat;
	padding-right:0px;
	cursor:pointer;
}

.portfolio .portfolio_right_nav:hover{
	background:url(/images/portfolio_nav-right-hover.gif) top left no-repeat;
}

.portfolio .portfolio_main{
	width:475px;
	height:350px;
	overflow:hidden;
	padding-left:0px;
}

.portfolio .portfolio_wrapper{
	width:475px;
	height:350px;
	overflow:hidden;
}

.portfolio .portfolio_main .portfolio_inner-content{
	width: 475px;
	height: 350px;
	overflow:hidden;
	background-color:#000;
}

.float_right{
	float:right;
}

.float_left{
	float:left;
}

.portfolio .portfolio_main .portfolio_inner-content .portfolio_image{
	height: 350px;
}

/*Contact form */

.notification_error
{
	color: #ff7e00;
	height: auto;
	width: 90%;
	padding-left: 0px;
	background: transparent;
	text-align: left;
}

.notification_ok
{
	color:#ff7e00;
	height: 350px;
	width: 90%;
	padding-left: 0px;
	background: transparent;
	text-align: center;
	vertical-align:middle;
}

.info_fieldset { 
	border: 1px #dddddd solid;
	height:375px;
}

.info_fieldset legend
{
	color:#ff7e00; 
	font: 13px Verdana;
	padding: 2px 5px 2px 5px;
}

.button
{
	border: 1px solid #999999; 
	border-top-color: #CCCCCC; 
	border-left-color: #CCCCCC; 
	background: white;
	color: #333333; 
	font: 11px Verdana, Helvetica, Arial, sans-serif;
	cursor:pointer;
}

/* Label */
label  { width: 100px; padding-left: 0px; float: left; text-align: left; }

/* Input, Textarea */
input, textarea
{
	margin: 5px;
	padding: 0px; 
	float: left;
	resize:none;
	border: 1px solid #999999; 
	border-top-color: #CCCCCC; 
	border-left-color: #CCCCCC; 
	color: #333333; 
	font: 11px Verdana, Helvetica, Arial, sans-serif;
}

/* BR */

br { clear: left; }

