@charset "utf-8";

*{
    padding:0;
    margin:0;
}

body {
	font-size : 101%;
	color : #4D4D4D;
	font-family : Arial, Verdana, Helvetica, sans-serif;
	text-align : center;
	background : #FFFFFF;
}

h1{
    font-size:14px;
    font-weight:bold;
}

h1.bg_green{
    font-weight:normal;
    padding:0.2em 0.2em 0.2em 0.6em;
    background-color:#F0F6E8;
    color:#B8B8BA;
    text-transform:uppercase;
}

.lemon_green{
    color:#99C45B;
}

h2{
    font-size:0.9em;
    font-weight:bold;
}

img{
    border:none;
}

ul{
    list-style: none;
}

.red_star{
    color:#FF0000;
}

.text{
    font-size:12px;
}
.text_serif{
    font-size:12px;
    font-family : "Times New Roman", Times, serif;
}

#box{
    margin: 0em auto;	
    width: 44.6em; /*720px*/
}

#banner{
    background:transparent url("../img/nav_bg.jpg") 0 0 no-repeat;
    height:110px;
}


/* navigation */
#navigation{
    background:transparent url("../img/menu_bg.jpg") 0 -2px no-repeat;
    height:30px;
}

ul#tab_menu
{
    list-style: none;
    text-align:left;
}

#navigation ul li {
    float: left;
    text-align:center;
    margin-left: 20px;
}

#navigation ul li a
{
    text-decoration: none;
    font-size:12px;
    font-weight:bold;
    color:#8EC04D;
    float: left;
    width: 75px;
    padding: 12px 10px 2px 10px;
}

#tab_frontpage {
    background: url("../img/m_home.gif") 0px 10px no-repeat;
}
#tab_frontpage a.current{
    background: url("../img/m_home_hover.gif") no-repeat left top;
}
#tab_frontpage a:hover{
    background: url("../img/m_home_hover.gif") no-repeat left top;
}

#tab_work{
    background: url("../img/m_work.gif") 0px 10px no-repeat;
}
#tab_work a.current{
    background: url("../img/m_work_hover.gif") no-repeat left top;
}
#tab_work a:hover{
    background: url("../img/m_work_hover.gif") no-repeat left top;
}

#tab_vision{
    background: url("../img/m_vision.gif") 0px 10px no-repeat;
}
#tab_vision a.current{
    background: url("../img/m_vision_hover.gif") no-repeat left top;
}
#tab_vision a:hover{
    background: url("../img/m_vision_hover.gif") no-repeat left top;
}

#tab_clients{
    background: url("../img/m_clients.gif") 0px 10px no-repeat;
}
#tab_clients a.current{
    background: url("../img/m_clients_hover.gif") no-repeat left top;
}
#tab_clients a:hover{
    background: url("../img/m_clients_hover.gif") no-repeat left top;
}

#tab_press{
    background: url("../img/m_press.gif") 0px 10px no-repeat;
}
#tab_press a.current{
    background: url("../img/m_press_hover.gif") no-repeat left top;
}
#tab_press a:hover{
    background: url("../img/m_press_hover.gif") no-repeat left top;
}

#tab_contact{
    background: url("../img/m_contact.gif") 0px 10px no-repeat;
}
#tab_contact a.current{
    background: url("../img/m_contact_hover.gif") no-repeat left top;
}
#tab_contact a:hover{
    background: url("../img/m_contact_hover.gif") no-repeat left top;
}





/* - -  Content  - - */
#content
{
    border-top:1px solid #C4C4C4;
    text-align:left;
}



/* #01 HOME */
#frontpage_left{
    float:left;
    width:27%;
    min-height: 18em;
    height: auto !important;
    height: 18em;    
    border-right:1px solid #C4C4C4;
    padding:0.4em 0.4em 0em 0.4em;
    overflow:auto;
}

#frontpage_right{
    width:69%;
    padding:0.4em 0.4em 0em 0.4em;
    overflow:auto;
}

h2.news_date{
    color:#B8B8BA;
    font-family: serif;    
}

/* #02 WORK */
#work_left{
    float:left;
    width:18%;
    min-height: 18em;
    height: auto !important;
    height: 18em; 
    border-right:1px solid #C4C4C4;
	padding:5px 5px 0px 5px;
    overflow:auto;
}

#work_right{
    float:left;
    width:79%;
    height:97%;
    padding:5px 5px 0px 5px;
    overflow:auto;
}

ul#nav_list
{
    list-style: none;    
    text-transform:uppercase;
    text-align:left;
    padding: 4px 2px 4px 5px;
    margin-left: 0;
}
ul#nav_list li
{
    display: block;
    margin-left:10px;
}

ul#nav_list li a
{
    font-weight:bold;
    font-size:0.75em;
    color:#000000;
    background-color: #FFFFFF;    
    border-bottom: none;
    text-decoration: none;
}
ul#nav_list li a.current
{
    color:#6F6F6F;
    background-color: #FFFFFF;
}
ul#nav_list li a:hover
{
    color: #AFAFAF;
    background-color: #FFFFFF;
}

/* ul#nav_list li li a */


/* infobox */
.tooltip,.tooltip *{
    display:block
}
/*added by javascript*/
.tooltip{
    width: 150px;
    color:#000;
    font:lighter 11px/1.3 Arial,sans-serif;
    text-decoration:none;
    text-align:left;
}
.tooltip span.top{
    padding: 30px 8px 0;
    font-weight:bold;
    background: url("../img/info_bubble.gif") no-repeat top;
}
.tooltip b.bottom{
    padding:3px 8px 15px;
    background: url("../img/info_bubble.gif") no-repeat bottom;
}


/* page workDetail*/
#w_imageBarContainer{
    margin-bottom:15px;
    padding-top:5px;    
}
ul#w_imageBarList{
    min-height: 15px;
    height: auto !important;
    height: 15px; 
    list-style: none;
    text-align:left;    
}
ul#w_imageBarList li{
    float:left;
}
ul#w_imageBarList li a{
    display: block;
    margin-right:2px;
    width:15px;
    min-height: 15px;
    height: auto !important;
    height: 15px; 
    text-align:center;
    background: url("../img/gray_nav_btn.gif") no-repeat left top;
}
ul#w_imageBarList li a.current{
     background: url("../img/green_nav_btn.gif") no-repeat left top;
}
ul#w_imageBarList li a:hover{
    background: url("../img/green_nav_btn.gif") no-repeat left top;
}
a.link_return{
    text-decoration:none;
    font-size:0.6em;
    text-transform:uppercase;
    font-weight:bold;
}
a:hover.link_return{
   color:gray; 
}

a.link_launch{
    text-decoration:none;
    font-size:0.7em;
    text-transform:uppercase;
    font-weight:bold;
}
a:hover.link_launch{
   color:gray; 
}

h2.pr_name{
    text-transform:uppercase;
    font-size:0.7em;
    color:#7D7D7D;
    font-weight:normal;
}
h1.pr_clName{
    color:#5E5E5E;
}

#wdetail_imgcontainer{
    width:380px;
    min-height: 320px;
    height: auto !important;
    height: 320px;
    float:left;
    margin:10px;
    text-align:center;
}

/* #03 VISION */



/* #04 CLIENTS */
#clients_left{
    float:left;
    width:27%;
    min-height: 20em;
    height: auto !important;
    height: 20em;
    padding:0.4em 0.4em 0em 0.4em;
    border-right:1px solid #C4C4C4;
}

#clients_right{
    width:69%;
    padding:0.4em 0.4em 0em 0.4em;
    overflow:auto;
}



/* #06 CONTACT */
#contact_left{
    float:left;
    width:28%;
    min-height: 22em;
    height: auto !important;
    height: 22em; 
    padding:2em 0em 0em 3em;
    overflow:auto; 
}

#contact_right{
    float:left;
    width:50%;
    padding:1em 0em 0em 5em;
    overflow:auto;
}

/* form */
label.contact{
    font-size:1em;
    margin-top:0.5em;
}

input.contact{
    width:20em;
}
.submitButton{
    width:21em;
    text-align:right;
}

textarea.contact{
    width:20.5em;
    min-height: 10em;
    height: auto !important;
    height: 10em; 
}