@charset "utf-8";
/*
VACUSOFT UX Team, Myung-Jik Lee  20121001 
*/
 
/* Layout */
body,#wrap{overflow:auto;width:100%;}
#header{height:130px;background:url("../images/top.png") no-repeat 0 0;} 
#container{position:relative; overflow:hidden;background:url("../images/bg_pattern.png") repeat 0 0;}

/* Header */
#header .top_wrap{position:relative; width:970px;height:130px;margin:auto;background:url("../images/header.png") no-repeat 0 0;}
#header .top_area{*zoom:1; position:absolute; bottom:0; width:970px;margin:auto;}
#header .top_area:after{clear:both; content:"."; display:block; height:0; visibility:hidden;}
#header .top_menu{float:right}
#header .top_menu li {display:block;float:left;}
#header .top_menu li a{display:block;width:95px;height:34px;margin-left:7px }
#busuness_menu{background:url("../images/btn_Business2.png") no-repeat 0 0;}
#portfolio_menu{background:url("../images/btn_portfolio2.png") no-repeat 0 0;}
#contact_menu{background:url("../images/btn_contact2.png") no-repeat 0 0;}
#busuness_menu:hover{background:url("../images/btn_Business1.png") no-repeat 0 0;}
#portfolio_menu:hover{background:url("../images/btn_portfolio1.png") no-repeat 0 0;}
#contact_menu:hover{background:url("../images/btn_contact1.png") no-repeat 0 0;}
#busuness_menu:active{background:url("../images/btn_Business1.png") no-repeat 0 0;}
#portfolio_menu:active{background:url("../images/btn_portfolio1.png") no-repeat 0 0;}
#contact_menu:active{background:url("../images/btn_contact1.png") no-repeat 0 0;}
#busuness_menu.selected{background:url("../images/btn_Business1.png") no-repeat 0 0;}
#portfolio_menu.selected{background:url("../images/btn_portfolio1.png") no-repeat 0 0;}
#contact_menu.selected{background:url("../images/btn_contact1.png") no-repeat 0 0;}

/* content */
#content { width: 970px; background-color: white; margin: -1px auto -2px auto;
	box-shadow: 2px 0 2px rgba(0,0,0,.3),-2px 0 2px rgba(0,0,0,.3), inset 0 0 0 rgba(0,0,0,.4);
	-webkit-box-shadow: 2px 0 2px rgba(0,0,0,.3),-2px 0 2px rgba(0,0,0,.3), inset 0 0 0 rgba(0,0,0,.4);
	-moz-box-shadow: 2px 0 2px rgba(0,0,0,.3),-2px 0 2px rgba(0,0,0,.3), inset 0 0 0 rgba(0,0,0,.4);
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#3b3b3b,direction=135, strength=3);
}
.columns {height:795px;padding:40px 50px;}
.columns li { display: block; float: left; }
.columns li a{display:block;width:230px;height:230px; margin:20px 30px}
#lucene_column{background:url("../images/btn_lucene_1.png") no-repeat 0 0;}
#mobile_column{background:url("../images/btn_mobile_1.png") no-repeat 0 0;}
#logo_column{background:url("../images/btn_vacu_1.png") no-repeat 0 0;}
#image_column{background:url("../images/btn_image_1.png") no-repeat 0 0;}
#chron_column{background:url("../images/btn_chronology_1.png") no-repeat 0 0;}
#rel_column{background:url("../images/btn_character_1.png") no-repeat 0 0;}
#ime_column{background:url("../images/btn_ime_1.png") no-repeat 0 0;}
#math_column{background:url("../images/btn_formula_1.png") no-repeat 0 0;}
#wfont_column{background:url("../images/btn_webfont_1.png") no-repeat 0 0;}
#lucene_column:hover{background:url("../images/btn_lucene_2.png") no-repeat 0 0;}

.portfolio {*zoom:1;}
.portfolio:after{clear:both; content:"."; display:block; height:0; visibility:hidden;}
.portfolio li { display: block; float: left; }
.portfolio li a{display:block;width:323px;height:340px; }
#portfolio1{background:url("../images/portfolio1.png") no-repeat 0 0;}
#portfolio2{background:url("../images/portfolio2.png") no-repeat 0 0;}
#portfolio3{background:url("../images/portfolio3.png") no-repeat 0 0;}
#portfolio4{background:url("../images/portfolio4.png") no-repeat 0 0;}
#portfolio5{background:url("../images/portfolio5.png") no-repeat 0 0;}
#portfolio6{background:url("../images/portfolio6.png") no-repeat 0 0;}
#portfolio7{background:url("../images/portfolio7.png") no-repeat 0 0;}
#portfolio8{background:url("../images/portfolio8.png") no-repeat 0 0;}
#portfolio9{background:url("../images/portfolio9.png") no-repeat 0 0;}
#portfolio10{background:url("../images/portfolio10.png") no-repeat 0 0;}
#portfolio11{background:url("../images/portfolio11.png") no-repeat 0 0;}
#portfolio12{background:url("../images/portfolio12.png") no-repeat 0 0;}
#portfolio_vacu{background:url("../images/portfolio_vacu.png") no-repeat 0 0;}
#portfolio1:hover{background:url("../images/portfolio1_1.png") no-repeat 0 0;}
#portfolio2:hover{background:url("../images/portfolio2_1.png") no-repeat 0 0;}
#portfolio4:hover{background:url("../images/portfolio4_1.png") no-repeat 0 0;}
#portfolio5:hover{background:url("../images/portfolio5_1.png") no-repeat 0 0;}
#portfolio6:hover{background:url("../images/portfolio6_1.png") no-repeat 0 0;}
#portfolio7:hover{background:url("../images/portfolio7_1.png") no-repeat 0 0;}
#portfolio8:hover{background:url("../images/portfolio8_1.png") no-repeat 0 0;}
#portfolio9:hover{background:url("../images/portfolio9_1.png") no-repeat 0 0;}
#portfolio10:hover{background:url("../images/portfolio10_1.png") no-repeat 0 0;}
#portfolio11:hover{background:url("../images/portfolio11_1.png") no-repeat 0 0;}
#portfolio12:hover{background:url("../images/portfolio12_1.png") no-repeat 0 0;}

.images {height:795px;padding:100px 150px;}
.images li { display: block; float: left; }
#contact_image1{width:673px;height:163px;background:url("../images/bg_contact1.png") no-repeat 0 0;}
#contact_image2{width:670px;height:444px;background:url("../images/bg_contact2.png") no-repeat 0 0;}
#contact_line {margin:30px 0 70px;width:670px;border-bottom: 1px dotted #aaa;}

/* footer */
#footer{width:970px;height:65px;background:url("../images/bottom.png") repeat 0 0;}