/* 
STYLE SHEET FOR PIXELNOVEL WEB SITE when user is not logged in
Created by Natalia Lukicheva
Pixelnovel

ToC

	1. defaults
	2. structure
	3. links and navigation
	4. fonts
	5. images
	6. tables
	7. forms
Notes
	main colors:
	font: #333
	hover: #0000cc
	green font: #009900
*/
* {
	padding:0; margin:0;}

p {
padding:6px 0;}
	
#wrapper.compact{
	width:960px;
    margin: 0 auto -300px auto;} /*footer height is different from reguser's one*/

#content.compact{
	width: 960px;
	margin:0; padding:0;}
	
/*  =header  --------- */
	
#masthead {
	padding-top:10px;}
/*	
#pixelnovel_logo {
	width:160px; height:55px;
	margin-left:10px;
	background:url(/resources/images/pixelnovel.gif) no-repeat;
	float:left;}*/
	
#pixelnovel_logo {
	width:250px; height:69px;
	margin:0 40px 0 0;
	background:url(/resources/images/pixelnovel-versioncontrol-logo.png) no-repeat;
	float:left;}*/	

#top_menu {
	width:510px;
	padding:18px 0 0 61px;
	float: left;}
	
#top_menu_signout{
	float:right; 
	width:100px; 
	padding-top:30px;
	text-align:right;}
	

#top_menu ul {
    margin:20px 0 0 0;
    list-style:none;
	text-align: center;}

#top_menu li, #top_menu li a, #top_menu li a:hover {
	overflow: hidden;
	height:45px;
	width:100px;
	font:normal bold 13px/40px Arial, Helvetica, sans-serif;
	color:#555;
	text-decoration:none;
    float:left;
    background:url(/resources/images/top_menu_divider.gif) no-repeat left top;}
	
#top_menu li a:hover{
	color:#360;}
	
#top_menu li.red, #top_menu li.red a, #top_menu li.red a:hover {
	color:#FF0000;}
#top_menu li.red a:hover {color:#360;}	


#top_menu li.green, #top_menu li.green a, #top_menu li.green a:hover {
	color#690;}
#top_menu li.green a:hover {color:#390;}	
	
	
#sign_up_container{
	float:right;
}

#sign_up{
	font-size:18px;
	color:#690;
	text-decoration:none;
	float:left;
	margin:18px 0 0 5px;
    width: 60px;
    height: 50px;
    display: block;
	text-align:right;}

#sign_up a, #sign_up a:hover{
    font-size:18px;
    color:#690;
    display: block;
    width: 60px;
    height: 30px;
    text-decoration:none;}

	
	
#sign_up a:hover{color:#360;}
.signup {float:left; margin-top:18px;}

.btn_smpl, .btn_smpl a, .btn_smpl a:hover{height:36px; width:30px;}
.btn_smpl {background:url(/resources/images/btn_signup_h.png) 0 0 no-repeat;}
.btn_smpl a{background:url(/resources/images/btn_signup.png) 0 0 no-repeat; display:block;}
.btn_smpl a:hover{background:none;}

.btn_smpl{float:left}

#billboard, #timeline_overview, #secure_files, #inobtrusive_UI_integration, #submit_version, #collaborate_share{
	width:960px;
	height:332px;
	background:url(/resources/images/billboard_ruler.png) no-repeat;
	}
	
#billboard{ 
	background:url(/resources/images/billborad_1.png);
	/*border-left:thin solid #ccc; */}
	
#playback_control{
	padding:50px 0 25px 12px;}

#billboard div.numbers {
height:36px;
width:31px;
float: left;
margin-right: 10px;
}
/*#billboard .numbers, */#billboard .numbers a{
	padding:0px;
/*	margin-right:10px;
	float:left;*/
	margin:0px;
	border:0;
	}
	
#billboard .one,  #billboard .one a, #billboard .one a:hover{height:36px; width:31px;}
#billboard .one { background:url(/resources/images/billboard_1_h.png) no-repeat;}
#billboard .one a{ background:url(/resources/images/billboard_1.png) no-repeat; display:block; }
#billboard .one a:hover{ background:none;}

#billboard .two,  #billboard .two a, #billboard .two a:hover{height:36px; width:31px;}
#billboard .two { background:url(/resources/images/billboard_2_h.png) no-repeat;}
#billboard .two a{ background:url(/resources/images/billboard_2.png) no-repeat; display:block; }
#billboard .two a:hover{ background:none;}

#billboard .thr,  #billboard .thr a, #billboard .thr a:hover{height:36px; width:31px;}
#billboard .thr { background:url(/resources/images/billboard_3_h.png) no-repeat;}
#billboard .thr a{ background:url(/resources/images/billboard_3.png) no-repeat; display:block; }
#billboard .thr a:hover{ background:none;}

#billboard .fou,  #billboard .fou a, #billboard .fou a:hover{height:36px; width:31px;}
#billboard .fou { background:url(/resources/images/billboard_4_h.png) no-repeat;}
#billboard .fou a{ background:url(/resources/images/billboard_4.png) no-repeat; display:block; }
#billboard .fou a:hover{ background:none;}

#billboard .fiv,  #billboard .fiv a, #billboard .fiv a:hover{height:36px; width:31px;}
#billboard .fiv { background:url(/resources/images/billboard_5_h.png) no-repeat;}
#billboard .fiv a{ background:url(/resources/images/billboard_5.png) no-repeat; display:block; }
#billboard .fiv a:hover{ background:none;}

.play_pause{
	float:right;}

#billboard .play,  #billboard .play a, #billboard .play a:hover{height:36px; width:31px;}
#billboard .play { background:url(/resources/images/billboard_play_h.png) no-repeat;}
#billboard .play a{ background:url(/resources/images/billboard_play.png) no-repeat; display:block; }
#billboard .play a:hover{ background:none;}

#billboard .pause,  #billboard .pause a, #billboard .pause a:hover{height:36px; width:31px;}
#billboard .pause { background:url(/resources/images/billboard_pause_h.png) no-repeat;}
#billboard .pause a{ background:url(/resources/images/billboard_pause.png) no-repeat; display:block; }
#billboard .pause a:hover{ background:none;}

#billboard .signup,  #billboard .signup a, #billboard .signup a:hover{height:48px; width:278px;}
#billboard .signup { background:url() no-repeat;}
#billboard .signup a{ background:url() no-repeat; display:block; }
#billboard .signup a:hover{ background:none;}

#billboard .signup{
	position:absolute; 
	left:6px; 
	top:245px;}

#billboard .left{
	width: 285px;
	float:left; 
	position:relative;}	
	
#billboard .right{
	float:right; 
	position:relative;
	background:url(/resources/images/billboard_photoshop_versioncontrol.png) top right no-repeat;
	width:640px;
	height:323px;}	
	
#timeline_overview p, #secure_files p, #inobtrusive_UI_integration p, #submit_version p, #collaborate_share p{
	padding:10px 0 0 15px;
	width:270px;
	font:normal normal normal 18px/26px Arial, Helvetica, sans-serif;
	letter-spacing:1px;
	color:#999;}

#timeline_overview h1, #secure_files h1, #inobtrusive_UI_integration h1, #submit_version h1, #collaborate_share h1{
	padding:25px 0 0 15px;
	font:normal normal normal 24px Arial, Helvetica, sans-serif;
	letter-spacing:1px;
	color:#000;
	margin:0;
}

#features_preview, #promo{
	width:950px;
	margin:0 auto;}
	
#features_preview h1, #features_preview h1 a, #features_preview h1 a:hover {
	padding:22px 0 10px 0;
	font:normal normal normal 18px Arial, Helvetica, sans-serif;
	letter-spacing:1px;
	text-decoration:none;
	color:#390;
	margin:0;}
#features_preview h1 a:hover {
	color:#690;}
	
#features_preview p {
	font:normal normal normal 13px/20px Arial, Helvetica, sans-serif;
	color:#333;
	margin-bottom:20px;
	padding:0;
}




#promo h1, #promo h1 a, #promo h1 a:hover {
	padding:12px 0 10px 0;
	font:normal normal normal 18px Arial, Helvetica, sans-serif;
	letter-spacing:1px;
	text-decoration:none;
	color:#444;
	margin:0;}
#promo h1 a:hover {
	color:#444;}
	
#promo p {
	font:normal normal normal 13px/20px Arial, Helvetica, sans-serif;
	color:#333;
	margin-bottom:20px;
	padding:0;}

#features_preview .column1, #features_preview .column2, #promo .column1, #promo .column2{
	width:280px;
	float:left;
	padding:0;
}

#features_preview .column3, #promo .column3{
	width:300px;
	float:left;
	padding:0;
}

#promo .column3{width:280px;}


#features_preview .column1, #features_preview .column2, #promo .column1, #promo .column2{
	margin-right:45px;}

#promo .column1, #promo .column2, #promo .column3{
	height:160px;
	background:url(/resources/images/promo_bg.png) top left no-repeat;
	}

#promo .quote{
	background:url(/resources/images/quote_bg.png) top left no-repeat;
	padding:0 10px;
}

#promo .column1 p, #promo .column2 p, #promo .column3 p{
margin-right:10px;}


/*  =timeline pricing ------------------*/
#pr_bubble_left{
	width:165px; height:122px;
	background:url(/resources/images/pricing_bubble_left.png) no-repeat;
	padding:30px 0 0 30px;
	float:left}
	
	
#pr_bubble_right{
	width:160px; height:122px;
	background:url(/resources/images/pricing_bubble_right.png) no-repeat;
	padding:30px 0 0 35px;
	float:right;}

h1.pr_header, span.pr_header{
		margin:10px 0;
		font-family:Arial, Helvetica, sans-serif; 
		font-size:16px;
		text-transform: lowercase;
		color:#333;
		line-height:1.5;
		font-weight:bold;
		text-decoration:none;
		letter-spacing:0.2px;}
		
		
.bt_green, .bt_green a, .bt_green a:hover, .bt_green div.hover{
	width:230px; height:43px;
	color:#FFF;
	font:normal normal 16px/35px Arial, Helvetica, sans-serif; 
	text-decoration:none;
	text-align:center;
	letter-spacing:0.2px;
	display:block;	
/*	margin:20px auto;*/
}

/*  = customer logo background   ------------------*/

.bt_customer_logo, .bt_customer_logo a, .bt_customer_logo a:hover, .bt_customer_logo div.hover{
	width:150px; height:90px;
	display:block;	
}
.bt_customer_logo{
    background:url(/resources/images/customers/btn_custlogo_h.png) no-repeat;
}

.bt_customer_logo a {
	background:url(/resources/images/customers/btn_custlogo.png) no-repeat; display:block}
	
.bt_customer_logo a:hover {
	background:none;}
	
/*  =customer page - stamp box, twitter cloud ------------------*/

#stamp, #stamp_sm, #tweetcloud {
	font:italic normal bold 18px/1.5 "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#690;
	margin-bottom:20px;
	padding:0 0 30px 30px;
	display:block;
	background:#FFF url(/resources/images/stamp_left.png) bottom left no-repeat;}

#stamp_h, #stamp_h_sm{/*header*/
padding:25px 0 0 0;
height:55px;
display:block;
background:#FFF url(/resources/images/divider_bg.png) top 10px no-repeat;
}



#tweetcloud {
	padding:0;
	height:185px;
	width:305px;
	background:#FFF url(/resources/images/tweetcloud.png) top left no-repeat;}
	
#tweetcloud_inside{
	width:240px;
	margin-top:58px;
	}
	
#tweetcloud_inside div.twitter, #tweetcloud_inside div.twitter a, #tweetcloud_inside div.twitter a:hover{
	font:normal normal bold 14px/1.5 "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-decoration:none;
	color:#999;
	margin:0; padding:0;
 	}
	
#tweetcloud_inside div.twitter a:hover{color:#06C}
	
#stamp_inside, #stamp_inside_sm{
	margin:0; padding:20px 20px 0 0;
	background:url(/resources/images/stamp_right.png) top right no-repeat;}

#stamp_inside span.long, #stamp_inside_sm span.long, #tweetcloud span.long,
#stamp_inside span.long a, #stamp_inside_sm span.long a, #tweetcloud span.long a,
#stamp_inside span.long a:hover, #stamp_inside_sm span.long a:hover, #tweetcloud span.long a:hover{
	font:italic normal normal 16px/1.5 "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-decoration:none;
	color:#444;}
	
#stamp_inside span.long a, #stamp_inside_sm span.long a, #tweetcloud span.long a,	
#stamp_inside span.long a:hover, #stamp_inside_sm span.long a:hover, #tweetcloud span.long a:hover{font-weight:bold;}

#stamp_inside span.long a:hover, #stamp_inside_sm span.long a:hover, #tweetcloud span.long a:hover{color:#06C; }
	
#stamp .capital, #stamp_sm .capital, #tweetcloud .capital{
	font-size:40px;}

#stamp_sm {background-image:url(/resources/images/stamp_left_sm.png)}
#stamp_inside_sm {background-image:url(/resources/images/stamp_right_sm.png)}

h4 {
	font:normal normal bold 15px/1.2 Arial, Helvetica, sans-serif;
	color:#444;
	margin:16px 0;
	}
	
p.leader{
	clear:left;
	display:block;
	font:normal normal 18px/1.5 Arial, Helvetica, sans-serif; 
	color:#999;
	text-decoration:none;
	}

/*  =green button with any text label ------------------*/


.bt_green{
    background:url(/resources/images/button_green_h.png) no-repeat;
}

.bt_green a {
	background:url(/resources/images/button_green.png) no-repeat; display:block}
	
.bt_green a:hover {
	line-height:37px;
	background:none;}

/*  =flickrshop ------------------*/

.fs_download, .fs_download a, .fs_download a:hover,
.fs_buy, .fs_buy a, .fs_buy a:hover {  
	font:11px Arial, Helvetica, sans-serif; 
	color:#09f;
	text-decoration:none;}
	
.fs_download a, .fs_download a:hover,
.fs_buy a, .fs_buy a:hover {  
	font-size:18px;
	color:#09f;
	line-height:30px;}
	
.fs_download a:hover, .fs_buy a:hover{
	color:#06F;}
	
	
	
/*  =breadcrumb / path  --------- */	
#bread_container{ /*defined for unregistered users view*/
	clear:both;
	height:31px;
	padding:15px 0 30px 0;
	}

#breadcrumb {
    width:921px;
    background:url("/r/i/images/breadcrumb_bg.png") 43px 0px no-repeat #dedede;
	}
	
#breadcrumb div.path{
	float: left; 
	width: 878px; 
	overflow: hidden;
}
#breadcrumb div.path div.path_content {width: 1562px;}
/*the rest of the breadcrumb is defined in style.css*/

#mpush {
	clear:both;
	height:300px; }

#mfooter_container{
	background:url(/resources/images/footer_main_bg_c.png) repeat-x;
	width:100%;
	height:300px;}
	
#mfooter{
	width:960px;
	height:300px;
	margin:0 auto;}

#mfooter_l{
	float:left;
	width:13px; height:300px;
	background:url(/resources/images/footer_main_bg_l.png) no-repeat;}
	
#mfooter_c{
	float:left;
	width:934px; height:300px;
	background:url(/resources/images/footer_main_bg.png) repeat-x;}
	
#mfooter_c .copyright{
	width:900px; height:auto;
	text-align:center;
	margin: 0 auto;
	padding:52px 0 40px 0;
	color:#FFF;
	letter-spacing:1px;}

#mfooter_c .copyright a, #mfooter_c .copyright a:hover{
color:#FFF;
text-decoration:none;
letter-spacing:1px;}
	
#mfooter_c .column1, #mfooter_c .column2,  #mfooter_c .column3{
	width:280px;
	float:left;
	padding-right:15px;}
	
#mfooter_c .column1{
	margin-left:60px;}

#mfooter_c .column3{
	padding:0;}
	
#mfooter_r{
	float:right;
	width:13px; height:300px;
	background:url(/resources/images/footer_main_bg_r.png) no-repeat;}
	
#mfooter_r.grey{background:url(/resources/images/footer_grey_bg_r.png) no-repeat;}
#mfooter_l.grey{background:url(/resources/images/footer_grey_bg_l.png) no-repeat;}
#mfooter_c.grey{background:url(/resources/images/footer_grey_bg.png) repeat-x;}


/*  =regnow ------------------*/
#regnow table tr td{
	font-size:13px;
	line-height:18px;
	padding-bottom:6px;
}

