@charset "utf-8";

/*              quotation
=====================================================================*/
	
#page_container #quotation_text {
	width: 195px;
	border:0;
	padding:30px 20px 0 80px;
	position: relative;
	margin: 30px 0 30px 0;
	word-wrap: break-word;
	float: right;
}


.quotation{
	font-family: Garamond, Baskerville, "Times New Roman", Times, serif;
	font-size:22px;
	color: #999;
	line-height:128%;
	text-align:left;
	font-style:italic;
}

#quotation_mark_left {
	position: absolute;
	top: 0;
	left: 0;
	width: 150px;
	height: 90px;
	background-image: url(../img/sider/quotation_mark_left.gif);
	z-index: -1;
}  

#quotation_mark_right {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 90px;
	height: 70px;
	background-image: url(../img/sider/quotation_mark_right.gif);
	z-index: -2;
}  

/*              banner
=====================================================================*/

#page_container #banner_flash {
	height: 135px;
}

#page_container #banner {
	background-image: url(../img/portfolio/banner.gif);
	height: 135px;
}

#page_container #text  #text_container {
	margin-top: 18px;
}

#line {
	border-top: #999 1px solid;
}


/*              text
=====================================================================*/

.visit_link{
	font-family: Titillium, Helvetica, Arial, sans-serif;
	font-size:12px;
	color:#999;
}
.visit_link a{
	color: #999;
	border-bottom: 1px solid #B2E5FF;
}

.visit_link a:hover{
	color: #666;
	border-bottom: #6CF 1px solid;
}

/*              project
=====================================================================*/

#text_project {
	width: 620px;
	float: left;
	padding-top: 35px;
	padding-right: 0;
	padding-bottom: 75px;
	padding-left: 18px;
}
	

#project {
	width: 910px;
	height: auto;
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 50px;
	margin-left: 0;
	position: relative;
}

#project_last {
	width: 900px;
	height: 420px;
}






#screenshot {
	width: 300px;
	float: left;
	height: 60px;
	background-image: url(../img/portfolio/bg_transparent.gif);
	margin-bottom:20px;
}

#screenshot2 {
	width: 300px;
	float: left;
	height: 60px;
	margin-left:20px;
	margin-bottom:20px;
	background-image: url(../img/portfolio/bg_transparent.gif);
}



#discription_project{
	width: 220px;
	height: 500px;
	float: right;
	margin-left:56px;

}

#arrowhead{
	width: 220px;
	height: auto;
	float: right;
	padding-top:200px;


}

#left{width:44px;
      height:52px;
	  float:left;
}


#right{width:44px;
      height:52px;
	  float:right;
}


#discription {
	width: 220px;
	height:auto;
	float: right;
	border-left:dashed 1px #CCC;
	padding: 0 20px 0 0;
	margin-left: 39px;
}

#dis-content {
	width: 220px;
	height: auto;
	float: none;
	border-bottom:dashed 1px #CCC;
	clear: both;
}

#icon{
	width:auto;
	height:auto;
	float:left;
	margin-bottom:40px;
	padding-left: 40px;
}
#iconw{width:auto;
       height:auto;
	   margin-bottom:13px;
}
#icong{width:auto;
       height:auto;
	  
}

#ourclients{width: 220px;
	height: auto;
	float: right;
	border-top:dashed 1px #CCC;
}
#client{
	width: auto;
	height: auto;
	float: left;
	padding-top:40px;
	padding-bottom:40px;
	padding-left: 40px;
}
#symbol{
	width: 180px;
	height: auto;
	float: left;
	border-top:dashed 1px #CCC;
	padding-top:40px;
	padding-left: 40px;
	
		}

#symbol2{width: 150px;
	height:auto;
	padding-top:40px;
	padding-left:20px;
	
	
}




	  

/*              star
=====================================================================*/

#star {
	position: absolute;
	top: -41px;
	left: 637px;
	width: 76px;
	height: 78px;
	background-image: url(../img/portfolio/star.gif);
	z-index: -1;
}  

/*              slider
=====================================================================*/

		.container { width:200px; height:0px; overflow:hidden; position:relative; cursor:pointer;}
		div.slides { position:absolute; top:0; left:0; }
		ul.slides { position:absolute; top:0; left:0; list-style:none; padding:0; margin:0; white-space: nowrap}
		div.slides > div,ul.slides li { position:absolute; top:0; width:200px; display:none; padding:0; margin:0; list-style:none; line-height:0;}
		/*
		 * Optional
		*/
		#loopedSlider,#newsSlider { margin:0 auto; width:200px; position:relative; clear:both; }
		ul.pagination {
	list-style:none;
	padding:0;
	margin:0;
	position:absolute;
	bottom: -44px;
	width:auto;
	overflow: hidden;
}

.client_list {
	font-family: Titillium, Helvetica, Arial, sans-serif;
	font-size:12px;
	color:#666;
	line-height:1.5em;
	text-align: left;
	text-transform: uppercase;
}


/*              transfade
=====================================================================*/

.item {  
    width:300px;  
    height:60px;
      
    /* required to hide the image after resized */  
    overflow:hidden;  
      
    /* for child absolute position */  
    position:relative;  
      
    /* display div in line */  
    float:left;  
}  
  
.item .caption {  
    width:300px;  
    height:300px;  
    background: #000000;  
    color: #999;  
          
    /* fix it at the bottom */  
    position:absolute;  
    left:0;  
  
    /* hide it by default */  
    display:none;  
  
    /* opacity setting */  
    filter:alpha(opacity=100);    /* ie  */  
    -moz-opacity:1;    /* old mozilla browser like netscape  */  
    -khtml-opacity: 1;    /* for really really old safari */    
    opacity: 1;    /* css standard, currently it works in most modern browsers like firefox,  */  
  
}  
  
.item .caption a {  
    text-decoration:none;  
    color: #FFF;  
    font-size:18px;
	font-family: Titillium, Helvetica, Arial, sans-serif;
      
    /* add spacing and make the whole row clickable*/  
    padding:8px 0 14px 8px;
    display:block;  
}  
  
.item .caption p {  
    padding:0px 0 0 8px;     
    margin:0;  
    font-size:11px;  
	font-family: Titillium, Helvetica, Arial, sans-serif;
}  
  
img {  
    border:0;  
      
    /* allow javascript moves the img position*/  
    position:absolute;  
}  
  
.clear {  
    clear:both;   
}