body 
{ 
	background-attachment:		fixed;
    background-color:			#e5e5e5;
    background-image:			url('/images/bg.jpg'); 
    background-position:		top center; 
    background-repeat:			no-repeat; 
    margin:						0;
	padding:					0;

	background-size:			cover;
	-moz-background-size:		cover;
	-webkit-background-size:	cover;
	font-family:corbel;
}

/*
	This next definition doesn't allow the background to get any smaller
	than a predefined size (640x426px in this case). Change the values
	here to match your background image size. The configuration in the
	flexi-background javascript file should also match these values.
*/

@media only all and (max-width: 640px) and (max-height: 426px) {
	body {		
		background-size:			640px 426px;
		-moz-background-size:		640px 426px;
		-webkit-background-size:	640px 426px;
	}
}

/*
	The next 2 definitions are for support in iOS devices.
 	Since they don't recoginze the 'cover' keyword for background-size
 	we need to simulate it with percentages and orientation
*/

@media only screen and (orientation: portrait) and (device-width: 320px), (device-width: 768px) {
	body {
		-webkit-background-size: auto 100%;
	}
}

@media only screen and (orientation: landscape) and (device-width: 320px), (device-width: 768px) {
	body {
		-webkit-background-size: 100% auto;
	}
}
/* All of the following styles only get used when background-size isn't supported */

img#expando { 
	display:	none;
	position:	absolute; 
	z-index:	1;
	 
	-ms-interpolation-mode: bicubic; 
} 

.wide img#expando, 
.tall img#expando { 
	display: 	block; 
} 

.wide img#expando { 
	height: 	auto;
	width: 		100%; 
} 

.tall img#expando { 
	height:		100%;
	width:		auto; 
}

@font-face 
{
  font-family: "corbel";
  src: url(/Font/corbel_0.ttf);
}


@font-face 
{
  font-family: "corbelb";
  src: url(/Font/corbelb_0.ttf);
}

@font-face 
{
  font-family: "corbeli";
  src: url(/Font/corbeli_0.ttf);
}

#mainbody
{
    width:950px;
    margin:auto;
}
#frame
{
    /*background-image:url('/images/frame.png'); 
    height:357px;*/
    width:325px;
    margin-top:150px;
    margin-left:120px;
    float:left;
}

#frame_logo
{
    background-image:url('/images/frame_logo.png'); 
    width:344px;
    height:330px;
    margin-top:150px;
    float:left;
}

#head
{
    height:30px;
}

#logo
{
    background-image:url('/images/logo.png'); 
    background-repeat:no-repeat;
    height:80px; 
}

#ddtopmenubar
{
    background-color:#85C226;
    height:22px;
    width:575px;  
    margin-left:320px;  
}

#ddtopmenubar ul li a
{
     font-family:corbel;
}

#box
{
    width:660px;   
    margin-left:280px;
    margin-top:-398px;
    
}

#boxcontent
{
    width:290px;
    text-align:right;
    margin-top:50px;
    color:#0098DA;
    font-family:corbel;
    font-size:18px;
}

#homecontent1
{
    width:250px;
    font-family:corbel;
    font-size:18px;
    text-align:right;
    
}

#homecontent2
{
    padding-left:40px;
    border-left:dotted 1px black;
    margin-top:-135px;
    margin-left:290px;
    font-family:corbel;
    width:288px;
}

#homecontent2 div
{
    
    font-family:corbeli;
    font-size:15px;
    color:#0098DA;
}

/* =Hoverbox Code
----------------------------------------------------------------------*/

.hoverbox
{
	cursor: default;
	list-style: none;
	
}

.hoverbox a
{
	cursor: pointer;
}

.hoverbox a .preview  
{
	display: none;
}

.hoverbox a .Rpreview  
{
	display: none;
}

.hoverbox a:hover .preview
{
	display: block;
	position: absolute;
	top: -15px;
	left: -10px;
	z-index: 1;
}

.hoverbox a:hover .Rpreview
{
	display: block;
	position: absolute;
	top: -15px;
	left: -165px;
	z-index: 1;
}

.hoverbox img
{
    border-color: #E7E7E7;
	border-style:hidden;
	color: inherit;
	padding:1px;
	vertical-align: top;
	width: 112px;
	height: 125px;
}



.hoverbox li
{
	color: inherit;
	display: inline;
	float: left;
	position: relative;
}

.hoverbox .preview 
{
	width: 290px;
	height: 148px;
}

.hoverbox .Rpreview 
{
	width: 290px;
	height: 148px;
}

.aboutuscontent1
{
    background-image:url(/images/graybg1.png);
    width:514px;
    height:25px;
}

.aboutuscontent2
{
    
    vertical-align:top;
    background-image:url(/images/graybg2.png);
    background-repeat:repeat-y;
    width:514px;
    min-height:15px;
}

.aboutuscontent3
{
    background-image:url(/images/graybg3.png);
    width:514px;
    height:25px;
    
}

.ourworkheadblue
{
    width:196px;
    color:#0098DA;
    font-family:corbel;
    font-size:16px;
    padding:0 10px 0 10px;
    border-right:dotted 1px black;       
}

.ourworkheadgreen
{
    width:196px;
    color:#85C226;
    font-family:corbel;
    font-size:16px;
    padding:0 10px 0 10px;
    border-right:dotted 1px black;
}

.ourworkcontent
{
    width:196px;
    vertical-align:top;
    padding:0 10px 0 10px;
    font-family:corbeli;
    font-size:14px;
    border-right:dotted 1px black;
}

.clientsay
{
    font-family:corbeli;
    font-size:15px;
    color:#0098DA;
}

.client
{
    font-family:corbeli;
    font-size:15px;
}

.main2{ position:relative; overflow:hidden;width:963px; margin:0 auto;}
/*.box-slider{ width:900px; height:647px; background: url(../images/bg-slider.png) 0 0 repeat; float:left; position:relative;}*/
/* menu */
.main-menu{ float:left; width:200px; padding:px 0 0 0; z-index:99; position:relative;}
.sf-menu, .sf-menu * {margin:0;padding:0;list-style:none;}
	.sf-menu li{ position:relative; text-transform:uppercase; font-size:14px; text-align:right; margin-bottom:6px; overflow:hidden;}
	.sf-menu li a{ color:#0098DA; text-decoration:none; display:inline-block;}
	.sf-menu li a:hover,.sf-menu li.active a,.sf-menu li.sfHover a{text-decoration:none;font-weight:bold;}


.sf-menu ul {
	position:		relative;
	z-index:		99;
	width:			200px; 
	display:none;
	background:none;
	padding:3px 0;}
.sf-menu li li{ width:100%;padding:0; margin:0 0 1px 0; font:18px/26px "Times New Roman", Times, serif; text-align:right;}
.sf-menu li li a,.sf-menu li.sfHover li a,.sf-menu li.active li a{padding:7px 20px; background:none; font-weight:normal; color:#3f3f3f;}
.sf-menu li li a:hover,.sf-menu li li.sfHover a,.sf-menu li li.active a{background:#000; font-weight:bold; color:#fff;padding:7px 35px;}
.sf-menu ul ul {
	position:		absolute;
	top:			-999em;
	z-index:		99;
	width:			130px; 
	display:none;
	background:#000;}
	.sf-menu li li li{ width:100%;padding:0; margin:0;}
	.sf-menu li li li a,.sf-menu li li.sfHover li a,.sf-menu li li.active li a{}
	.sf-menu li li li a:hover,.sf-menu li li li.sfHover a,.sf-menu li li li.active a{}
.sf-menu li:hover ul,.sf-menu li.sfHover ul {left:0px;top:0;}
ul.sf-menu li:hover li ul,ul.sf-menu li.sfHover li ul {top:-999em;}
ul.sf-menu li li:hover ul,ul.sf-menu li li.sfHover ul {left:120px;top:-12px;}
ul.sf-menu li li:hover li ul,ul.sf-menu li li.sfHover li ul {top:-999em;}
ul.sf-menu li li li:hover ul,ul.sf-menu li li li.sfHover ul {left:10em;top:	00px;}