﻿@charset "utf-8";
/* CSS Document */

/* reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* style goes here */
body {
	behavior: url("../css/csshover3.htc"); 
	background-color:#FFF;
	background-image:url(../images/totem_bkg_black.jpg);
	background-repeat:repeat-x;
	font-family:Arial, Helvetica, sans-serif;
	color:#FFF;
}
#container {
	width: 940px;
	margin: 0 auto;
}
/*-----------------------------------------------*/
/* shared classes */
/*-----------------------------------------------*/
.title1{
	color:#444;
	width:100%;
	border-bottom:#777 dotted 1px ;
	padding-top:16px;
	margin-bottom:10px;
	overflow:hidden;
}
.linkstyle{
	font-size:12px;
	color:#777;
	float:left;
	padding-top:3px;
	line-height:15px;
	height:15px;
	
}
.linkstyle a{
	text-decoration:none;
}
.linkstyle2{
	font-size:12px;
	color:#777;
	float:left;
	padding-top:0px;
	line-height:15px;
	height:15px;
}
.linkstyle3{
	font-size:12px;
	color:#444;
	float:left;
	padding-top:0px;
	line-height:15px;
	height:15px;
	font-weight:bold;
}
.linkstyle3 a{
	text-decoration:none;
	color:#444;
}
.linkstyle3 a:hover{
	text-decoration:none;
	color:#999;
}
.tiny_square{
	font-size:18px;
	position:relative;
	top:-2px;
}
#pagination_white{
	font-size:13px;
	color:#777;
	height:30px;
	clear:both;
	width:100%;
	text-align:center;
	padding-bottom:20px;
}
#pagination_white #inner{
	padding:4px;
	display:inline-block;
	position:relative;
	float:left;
	left:50%;
}
#pagination_white a{
	font-size:13px;
	color:#777;
	text-decoration:none;
	height:100%;
	width:100%;
	display:inline-block;
}
#pagination_white ul{
	position:relative;
	clear:left;
	float:left;
	left:-50%;
}
#pagination_white ul li{
	list-style-position:outside;
	list-style-type:none;
	float:left;
	width:21px;
	height:21px;
	border:#cbcbcb solid 1px;
	background-color:#fff;
	line-height:21px;
	text-align:center;
	margin: 0px 4px;
}

#pagination_white ul li:hover{
	background-color:#eee;
}
#pagination_white ul li.active_page{
	background-color:#CCC;
	font-weight:bold;
}
#pagination_white ul li.dots{
	background-color:#fff;
}
#pagination_white ul li.dots:hover{
	background-color:#fff;
}
.loading{
	background: url(../images/spinner.gif) no-repeat center center;
	height:100%;
	width:100%;
}
.image_table{
	color:#666;
	font-size:12px
}
#flashcontentShort{
	position:absolute;
	z-index:0;
	height:220px;
	width:940px;
	float:left;
}
#flashcontentLong{
	position:absolute;
	z-index:0;
	height:310px;
	width:940px;
	float:left;
}
/*-----------------------------------------------*/
/* header and menu */
/*-----------------------------------------------*/
#header {
	position:relative;
	width:940px;
	overflow:hidden;
}
#header_up {
	width: 940px;
	height: 70px;
}
#header_up img {
	position:absolute;
	left:0px;
	top:10px;
}
#uppermost_menu {
	position:absolute;
	right:0px;
	font-size:13px;
	line-height:70px;
	float:right;
}
#uppermost_menu li{
	display:inline;
}
#uppermost_menu a{
	text-decoration:none;
	color:#ddd;
	padding-left:15px;
}
#menu_line {
	width:940px;
	height:30px;
	font-size:14px;
	color:#ddd;
	position:relative;
	/*float:left;*/
	
}
#menu_line ul{
	line-height:30px;
	text-align:center;
	position:relative;
	clear:left;
	float:left;
	left:50%;
	border-right:1px solid #666;
}
#menu_line ul li{
	position:relative;
	right:50%;
	float:left;
	display:block;
	padding: 0px 25px;
	border-right:1px solid #666;
}
#menu_line ul li.last_item {
	border-right:1px solid #666;
	border-left:1px solid #666;
}
#menu_line a{
	text-decoration:none;
	color:#ddd;
}
#menu_line ul li :hover{
	color:#fff;
}
#menu_line li:hover {
	background-color:#333;
}
#menu_line li:hover ul {
    display: block;	
}
#menu_line ul li ul {
	display:none;
	position: absolute;	
	top:30px;
	width:100%;
	border-right:none;
}
#menu_line ul li ul li{
	text-align:center;
	line-height:18px;
	font-size:12px;
	width:100%;
	border-top:1px solid #666;
	border-right:none;
	border-left:none;
	border-bottom:none;
	background-color:#4c4c4c;
	padding:0px;
}
#menu_line ul li ul li:hover{
	background-color:#333;
}

/*-----------------------------------------------*/
/* main block home */
/*-----------------------------------------------*/
#main_home{
	width:940px;
}
#main_home a:link{
	color:#777777;
	text-decoration:underline;
}
#main_home a:visited{
	color:#777777;
	text-decoration:underline;
}
#main_home a:active{
	color:#777777;
	text-decoration:underline;
}
#main_home a:hover{
/*	background-color:#777777;
	color:#FFF;
	text-decoration:underline;*/
}
#main_home h1{
	font-weight:bold;
	font-size:20px;
	float:right;
	padding-bottom:4px;
}

#main_home p , ul{
	color:#777;
	font-size:13px;
	line-height:20px;
}
#main_home ul{
	list-style:inside disc;
}
#main_home ul li{
	line-height:20px;
}
#main_home p strong{
	color:#444;
}
#col1_home{
	width:540px;
	float:right;
	direction:rtl;
	overflow:visible;
	margin-bottom:20px;

}
#col2_home{
	width:240px;
	float:right;
	padding-right:30px;
	direction:rtl;
	height:175px;
	overflow:hidden;

}
#col3_home{
	width:130px;
	float:right;
	text-align:center;
}
#showreel{
	width:60px;
	margin:auto;
	position:relative;
	top:50px;
	font-size:12px;
	font-weight:bold;
	color:#444444;
}
#showreel a:link{
	text-decoration:none;
}
#showreel a:visited{
	text-decoration:none;
}
#showreel a:hover{
	text-decoration:none;
}
#showreel a:active{
	text-decoration:none;
}
#showreel3{
	position:relative;
	top:-25px;
}
#showreel2{
	position:relative;
	top:-5px;
	font-size:17px;
	font-weight:bold;
	color:#999999;
}

/*-----------------------------------------------*/
/* main block about */
/*-----------------------------------------------*/
#main_about{
	width:940px;
}
#main_about h1{
	font-weight:bold;
	font-size:20px;
	float:right;
	padding-bottom:4px;
}

#main_about p , ul{
	color:#777;
	font-size:13px;
	line-height:20px;
}
#main_about ul{
	list-style:inside disc;
}
#main_about ul li{
	line-height:20px;
}
#main_about p strong{
	/*color:#444;*/
}
#main_about a{
	color:#666;
	text-decoration:underline;
}
#main_about a:visited{
	color:#666;
	text-decoration:underline;
}
#main_about a:hover{
	color:#fff;
	background-color:#666;
	text-decoration:underline;
}
#col1_about{
	width:230px;
	float:right;
	overflow:visible;
}
#col2_about{
	width:680px;
	float:right;
	padding-right:30px;
	direction:rtl;
/*	height:175px;*/
	overflow:hidden;
	margin-bottom:20px;

}
#printer_icon{
	position:relative;
	top:2px;
}

#side_images_wrapper ul{
	list-style:none;
	margin:40px 0px 0px 0px;
	list-style-position:outside;
	
}
#side_images_wrapper ul li{
	margin:0px 0px 30px 0px;
	
}
#side_images_wrapper img{
	list-style:none;
	padding:5px;
	border: #cbcbcb solid 1px;
	background-color:#f4f4f4;
}


/*-----------------------------------------------*/
/* main block project list */
/*-----------------------------------------------*/
#main_project_list{
	width:940px;
}
#main_project_list h1{
	font-weight:bold;
	font-size:20px;
	float:right;
	padding-bottom:4px;
}

#main_project_list p , ul{
	color:#444;
	font-size:12px;
	line-height:14px;
}
#main_project_list p , ul a{
	color:#444;
	text-decoration:none;
}
#main_project_list ul{
	list-style:inside disc;
}
#main_project_list p strong{
	/*color:#444;*/
}


#project_list_thumbnails ul{
	list-style:none;
	margin:40px 0px 0px 0px;
	list-style-position:outside;

}
#project_list_thumbnails ul li{
	margin:0px 0px 25px 40px;
	float:right;
	width:286px;
	height:143px;
	direction:rtl;
	overflow:hidden;
}
#project_list_thumbnails img{
	list-style:none;
	padding:5px;
	border: #cbcbcb solid 1px;
	background-color:#f4f4f4;
	margin-bottom:8px;
}
#project_list_thumbnails img:hover{
	background-color:#ccc;
	border: #333 solid 1px;
}
#project_list_thumbnails .last_item{
	margin:0px 0px 25px 0px;
}


/*-----------------------------------------------*/
/* main block videos */
/*-----------------------------------------------*/
#main_video_list{
	width:940px;
}
#main_video_list h1{
	font-weight:bold;
	font-size:20px;
	float:right;
	padding-bottom:4px;
}

#main_video_list p , ul{
	color:#444;
	font-size:12px;
	line-height:14px;
}
#main_video_list p , ul a{
	color:#444;
	text-decoration:none;
}
#main_video_list ul{
	list-style:inside disc;
}
#main_video_list p strong{
	/*color:#444;*/
}
#video_list_thumbnails{
	width:605px;
	float:left;
}

#video_list_thumbnails ul{
	list-style:none;
	margin:20px 0px 0px 0px;
	list-style-position:outside;

}
#video_list_thumbnails ul li{
	margin:0px 0px 25px 0px;
	float:right;
	width:286px;
	height:143px;
	direction:rtl;
	overflow:hidden;
	position:relative;
}
#video_list_thumbnails img{
	list-style:none;
	padding:5px;
	border: #cbcbcb solid 1px;
	background-color:#f4f4f4;
	margin-bottom:8px;
}
#video_list_thumbnails img:hover{
	background-color:#ccc;
	border: #333 solid 1px;
}
#video_list_thumbnails .last_item{
	/*margin:0px 0px 25px 0px;*/
	float:left;
}

#showreel_area{
	width:320px;
	float:left;
	margin: 20px 0px 0px 15px;
}
#showreel_area ul{
	list-style:none;
	margin: 0px 0px 0px 30px;
}
#showreel_area ul li{
	width:80px;
	height:90px;
	float:left;
	margin: 0px 0px 0px 12px;
}
#showreel_area ul li img{
	position:relative;
	width:80px;
	height:57px;
	left:0px;
	top:0px;
	z-index:0;
}
.shwr_a{
	position:relative;
	font-size:12px;
	font-weight:bold;
	color:#444444;
	z-index:10;
	text-align:center;
	float:left;
	width:80px;
}
.shwr_b{
	font-size:17px;
	font-weight:bold;
	color:#999999;
	text-align:center;
}
.videoarrow{
	background-image:url(../images/arrowMovie.png);
	position:absolute;
	top:26px;
	left:120px;
	width:54px;
	height:54px;
	z-index:30;
}

/*-----------------------------------------------*/
/* main block project details */
/*-----------------------------------------------*/
#main_project_details{
	width:940px;
}
#main_project_details h1{
	font-weight:bold;
	font-size:20px;
	float:right;
	padding-bottom:4px;
}
#project_detail_header{
	width:100%;
	height:25px;
	padding-top:16px;
	padding-bottom:18px;
}
#project_detail_header h2{
	color:#444;
	font-size:25px;
	font-weight:lighter;
	float:right;
	direction:rtl;
}
#big_pic{
	padding:7px;
	background-color:#f4f4f4;
	border: #cbcbcb solid 1px;
	float:right;
	height:501px;
	width:604px;
	direction:rtl;
	overflow:hidden;
}
#big_pic #img_container{
	height:354px;
	width:604px;
	overflow:hidden;
}
#big_pic h3{
	font-size:13px;
	color:#444;
	font-weight:bold;
	padding:15px 0 ;
	float:right;
}
#big_pic p{
	padding:0px;
	margin:0px;
	display:inline-block;
	float:left;
	width:604px;
	color:#777777;
	font-size:13px;
	line-height: 16px;
}

#thumbnail_container{
	height:517px;
	overflow:hidden;
	margin: 0px;
	padding: 0px;
}
#project_detail_thumbnails{

}
#project_detail_thumbnails ul{
	list-style:none;
	*margin-top: -14px;
	/*the asterix before of the margin is because of the stupid ie7 bugs... it will appear only on IE7 */
	padding:0px;
	vertical-align:top;
}
#project_detail_thumbnails ul li{
	width:292px;
	height:135px;
	overflow:hidden;
}
#project_detail_thumbnails img{
	list-style:none;
	padding:7px;
	border: #cbcbcb solid 1px;
	background-color:#f4f4f4;
	margin:0px;
}
#project_detail_thumbnails img:hover{
	background-color:#ccc;
	border: #333 solid 1px;
}

#enlarge{
	position:relative;
	left:215px;
	top:10px;
}
#project_detail_bottom_nav{
	width:100%;
	height:40px;
	clear:both;
	padding-top:10px;
	margin-bottom:10px;
}
#back_to_list{
	float:right;
	padding-top:8px;
}
#back_to_list a{
	color:#444444 ;
	font-size:13px;
	font-weight:bold;
	line-height:16px;
	text-decoration:underline;
}
.boxed_symbol{
	width:21px;
	height:21px;
	border:#cbcbcb solid 1px;
	background-color:#fff;
	line-height:21px;
	text-align:center;
	color:#777;
	padding:0px;
	margin:0px;
	float:left;
}
.boxed_symbol a{
	color:#777;
	text-decoration:none;
}
.boxed_symbol:hover{
	color:#444;
	text-decoration:none;
	background-color:#eee;
}
.boxed_symbol_disabled{
	width:21px;
	height:21px;
	border:#F2F2F2 solid 1px;
	background-color:#fff;
	line-height:21px;
	text-align:center;
	color:#FBFBFB;
	padding:0px;
	margin:0px;
	float:left;
}
.boxed_symbol_disabled a{
	color:#F2F2F2;
	text-decoration:none;
}
.boxed_symbol_disabled:hover{
	color:#F2F2F2;
	text-decoration:none;
	background-color:#fff;
}
.next_images{
	color:#777;
	font-size:12px;
	width:117px;
	float:left;
	line-height:22px;
	height:22px;
	margin-left:5px;
}
.next_images_disabled{
	color:#F2F2F2;
	font-size:12px;
	width:117px;
	float:left;
	line-height:22px;
	height:22px;
	margin-left:5px;
}

.prev_images{
	color:#777;
	font-size:12px;
	width:117px;
	float:left;
	text-align:right;
	line-height:22px;
	height:22px;
	margin-right:5px;
}
.prev_images_disabled{
	color:#F2F2F2;
	font-size:12px;
	width:117px;
	float:left;
	text-align:right;
	line-height:22px;
	height:22px;
	margin-right:5px;
}

/*-----------------------------------------------*/
/* article list */
/*-----------------------------------------------*/

#article_list ul{
	list-style:none;
	/*margin:40px 0px 0px 0px;*/
	list-style-position:outside;

}
#article_list ul li{
/*	margin:0px 0px 25px 40px;
	float:right;
	width:286px;
	height:143px;
	direction:rtl;
	overflow:hidden;*/
	padding-bottom:15px;
}
#article_list h2{
	font-size:14px;
	font-weight:bold;
}
#article_list h2 a{
	color:#444;
	text-decoration:underline;
	line-height:16px;
}
#article_list h2 a:hover{
	color:#fff;
	background-color:#444;
	text-decoration:underline;
}
.author{
	font-size:12px;
	color:#999;
	line-height:16px;
}

/*-----------------------------------------------*/
/* article detailed*/
/*-----------------------------------------------*/
#article_detailed_title{
	font-size: 24px;
	color:#444;
	line-height: 28px;
}
#article_detailed_subtitle{
	font-size: 12px;
	color:#b2b2b2;
}

/*-----------------------------------------------*/
/* clients */
/*-----------------------------------------------*/
#main_clients_list{
	width:940px;
}
#main_clients_list h1{
	font-weight:bold;
	font-size:20px;
	float:right;
	padding-bottom:4px;
}

#main_clients_list p , ul{
	color:#444;
	font-size:12px;
	line-height:14px;
}
#main_clients_list p , ul a{
	color:#444;
	text-decoration:none;
}
#main_clients_list ul{
	list-style:inside disc;
}
#main_clients_list p strong{
	/*color:#444;*/
}


#clients_list_thumbnails ul{
	list-style:none;
	margin:40px 0px 0px 0px;
	list-style-position:outside;

}
#clients_list_thumbnails ul li{
	margin:0px 0px 2px 10px;
	float:right;
	width:180px;
	height:90px;
	direction:rtl;
	overflow:hidden;
}
#clients_list_thumbnails img{
	list-style:none;
	padding:3px;
	border: #cbcbcb solid 1px;
	background-color:#f4f4f4;
	margin-bottom:0px;
}
#clients_list_thumbnails img:hover{
	background-color:#ccc;
	border: #333 solid 1px;
}
#clients_list_thumbnails .last_item{
	margin:0px 0px 2px 0px;
}
/*-----------------------------------------------*/
/* form */
/*-----------------------------------------------*/
#form1{
	width:560px;
}
.form_message{
	float:right;
	text-align:right;
}
.label_message{
	float:left;
}
.label_rest{
	color:#777777;
	font-size:13px;
	margin:0px;
	padding:0px;
	line-height:16px;
	
}
.contact_message{
	width:557px;
	height:145px;
	border:#CCC 1px solid;
	color:#000;
}
.form_right{
	float:right;
	margin:0px;
	padding:0px;
	height:42px;
}
.form_left{
	float:left;
	padding:0px;
	margin:0px;
	height:42px;
}
.contact_input{
	width:250px;
	border:#CCC 1px solid;
	color:#000;
	margin:2px 0px 0px 0px;
	padding:0px;
}
#send_mail{
	background-color:#b4b4b4;
	color:#FFF;
	border: #CCC 1px solid;
	
}
#send_bt{
	clear:both;
	float:right;
	margin-top:10px;
}
/*-----------------------------------------------*/
/* footer home */
/*-----------------------------------------------*/

#footer{
	clear:both;
	border-top:#e6e6e6 solid 1px;
	padding-top:5px;
	width:940px;
	overflow:hidden;
	font-size:12px;
	text-align:center;
	direction:rtl;
	color:#999;
	margin-bottom:25px;
}
#footer ul{
	text-align:center;
	padding-bottom:0px;
	margin-bottom:0px;
	/*height:8px;*/
	overflow:hidden;
	line-height:18px;
	
}
#footer ul li{
	padding-left:1px;
	padding-right:1px;
	display:inline;
	color:#CCC;
	/*border-left:#CCC solid 1px;*/
}
#footer ul li.last_item {
	border-left:none;
}
#footer a{
	text-decoration:none;
	color:#999;
}
#footer img{
	position:relative;
	top:4px;
}
#footer ul li :hover{
	color:#000;
}
#footer li:hover {
	/*background-color:#333;*/
}
#footer p{
	padding-top:0px;
	margin-top:0px;
}

/*-----------------------------------------------*/
/* modal popup */
/*-----------------------------------------------*/
#pop{
	position:absolute;
	top:0px;
	left:0px;
	z-index:9999;
	width:1px;
	height:1px;
}
#hidepop{
	position:absolute;
	z-index:9000;
	background-color:#000;
	display:none;
}