/*

Vidivault main stylesheet

version 1.1

Created: 2013


*/


/* --- basic resets --- */

	html, body, div, span, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	abbr, address, cite, code,
	del, dfn, em, img, ins, kbd, q, samp,
	small, strong, sub, sup, var,
	b, i,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, figcaption, figure, 
	footer, header, hgroup, menu, nav, section, summary,
	time, mark, audio, video {
		margin:0;
		padding:0;
		border:0;
		outline:0;
		font-size:100%;
		vertical-align:baseline;
		background:transparent;
	}

	body {
		line-height:1;
	}

	article,aside,details,figcaption,figure,
	footer,header,hgroup,menu,nav,section { 
		display:block;
	}

	blockquote, q {
		quotes:none;
	}

	blockquote:before, blockquote:after,
	q:before, q:after {
		content:'';
		content:none;
	}

	a {
		margin:0;
		padding:0;
		font-size:100%;
		vertical-align:baseline;
		background:transparent;
		text-decoration: none;
	}

	table {
		border-collapse:collapse;
		border-spacing:0;
	}

	input, select {
		vertical-align:middle;
	}
	
/* --- end basic resets --- */




/* --- page structure --- */

	body {
		background: url('../images/bg.png') repeat-x;
	}

	#container {
		width: 810px;
		position: relative;	
		margin-left: auto;
		margin-right: auto;
		margin-top: 20px;
	}
	
	#brand_img {
		z-index: -1;
		width: 500px;
		height: 300px;
		position: fixed;
		bottom: 0;
		right: 0;
		background: url('../images/cloud_video.png') no-repeat;
	}
	
	#header {
		margin: 0 0 20px 0;
		width: 800px;
		height: 75px;
		position: relative;	
		float: left;
	}
	
	#logo {
		margin-left: auto;
		margin-right: auto;
		width: 250px;
		height: 75px;
		position: relative;	
	}	
	
	#main_page {
		width: 800px;
		position: relative;	
		float: left;
		padding-bottom: 25px;
		margin-bottom: 25px;
		background: #fff;
		font: normal 12px Verdana, Tahoma, sans-serif;
		box-shadow: rgba(0,0,0, 0.4) 0px 0px 8px;/*0.1 actually means 10 %*/
		-o-box-shadow: rgba(0,0,0, 0.4) 0px 0px 8px;
		-moz-box-shadow: rgba(0,0,0, 0.4) 0px 0px 8px;
		-webkit-box-shadow: rgba(0,0,0, 0.4) 0px 0px 8px;
		-webkit-border-radius: 20px 0px 20px 0px;
		-moz-border-radius: 20px 0px 20px 0px;
		-o-border-radius: 20px 0px 20px 0px;
		border-radius: 20px 0px 20px 0px;
		behavior: url(PIE.htc);	
	}	
	
	#user_bar {
		padding: 10px;
		width: 780px;
		height: 30px;
		position: relative;	
		float: left;
		text-align: right;
		border-bottom: 1px solid #f89838; 
		background: #eee;
		-webkit-border-radius: 20px 0px 0px 0px;
		-moz-border-radius: 20px 0px 0px 0px;
		-o-border-radius: 20px 0px 0px 0px;
		border-radius: 20px 0px 0px 0px;
		behavior: url(PIE.htc);			
	}		
	
	#nav {
		margin: 20px 0 0px 20px;
		width: 190px;
		position: relative;	
		float: left;
		border-right: 1px solid #ccc;
	}	
	
	#main_content {
		padding-left: 15px;
		margin: 20px 0 20px 0px;
		width: 555px;
		position: relative;	
		float: right;
	}	
	
	#share_content {
		padding-left: 15px;
		margin: 20px 0 20px 0px;
		width: 650px;
		position: relative;	
		float: left;
		border: 1px solid green;
	}	
	
	#folder_nav {
		margin: 0px 0 20px 0px;
		width: 190px;
		position: relative;	
		float: left;
	}
	
	#support_nav {
		margin: 0px 0 0px 0px;
		width: 190px;
		position: relative;	
		float: left;
	}	
	
	#inner_nav {
		margin: 20px 0 0px 0px;
		width: 190px;
		position: relative;	
		float: left;
	}			
		
	
	.folder_link {
		width: 150px;
		padding: 5px;
		position: relative;	
		float: left;
		background: #eee; 
		margin-bottom: 5px;
	}	
	
	.folder_link:hover {
		width: 150px;
		padding: 5px;
		position: relative;	
		float: left;
		background: #d8d8d8; 
		margin-bottom: 5px;
	}		
	
	
	.main_link {
		width: 150px;
		padding: 5px;
		position: relative;	
		float: left;
		background: #f89838; 
		margin-bottom: 5px;
	}		
	
	.main_link:hover {
		width: 150px;
		padding: 5px;
		position: relative;	
		float: left;
		background: #fad5b0; 
		margin-bottom: 5px;
	}				
	






/* --- font styles --- */	

	h2 {
		margin: 15px 0 15px 0;
		font: 15px Verdana, Tahoma, sans-serif;
		color: #333;		
	}

	p {
		font: 12px Verdana, Tahoma, sans-serif;
		color: #666;
	}		
	
	.share_links {
		font: normal 12px Verdana, Tahoma, sans-serif;
		font-weight: bold;
	}
	
	.red {
		color: #F53232;
	}


	
	
	
	
/* --- login page --- */	
	
	#login_box {
		margin-left: 150px;
		width: 400px;
		padding: 50px;
		position: relative;	
		float: left;
		background: #fff;
		font: normal 12px Verdana, Tahoma, sans-serif;
		box-shadow: rgba(0,0,0, 0.4) 0px 0px 8px;/*0.1 actually means 10 %*/
		-o-box-shadow: rgba(0,0,0, 0.4) 0px 0px 8px;
		-moz-box-shadow: rgba(0,0,0, 0.4) 0px 0px 8px;
		-webkit-box-shadow: rgba(0,0,0, 0.4) 0px 0px 8px;
		-webkit-border-radius: 20px 0px 20px 0px;
		-moz-border-radius: 20px 0px 20px 0px;
		-o-border-radius: 20px 0px 20px 0px;
		border-radius: 20px 0px 20px 0px;
		behavior: url(PIE.htc);	
		margin-top: 50px;
	}	
	
	#login_box td {
		padding: 0 0 15px 15px;;
	}
	
	.login_form_box {

	}	
	
	.login_form_box input[type=text], input[type=password]  {
		width: 250px;
		padding: 5px;
	}		
	
	
		
	



/* --- folder page --- */		


	#folder_container {
		margin-left: 0px;
		width: 400px;
		position: relative;	
		float: left;
	}	
	
	#add_folder {
		margin-top: 15px;
		margin-bottom: 25px;
		width: 400px;
		position: relative;	
		float: left;
	}	
	
	#add_folder_btn {
		padding: 15px;
		position: relative;	
		float: left;
		background: #f89838; 
	}		
	
	#add_folder_div {
		display: none;
		width: 400px;
		position: relative;	
		float: left;
		border: 1px solid #f89838; 
	}	
	
	#add_folder_success {
		margin-top: 5px;
		padding: 10px;
		display: none;
		width: 380px;
		position: relative;	
		float: left;
		background: #f89838; 
	}	
	
	#edit_folder_success {
		margin-top: 5px;
		padding: 10px;
		display: none;
		width: 380px;
		position: relative;	
		float: left;
		background: #f89838; 
	}				
	
	.add_folder_input_style {
		margin: 5px 0 0px 5px;
		width: 378px;
		padding: 5px;	
		border: 1px solid #ccc;
		}	
	

	
	.add_folder_buttons {
		margin: 5px 0px 5px 0;
		width: 150px;
		position: relative;	
		float: right;
	}				
		
	.commit_add_btn {
		margin: 0 5px 0 0;
		padding: 5px;	
		width: 60px;
		position: relative;	
		float: left;
		background: #f89838; 
	}		
	
	.commit_add_close_btn {
		margin: 0 5px 0 0;
		padding: 5px;	
		width: 60px;
		position: relative;	
		float: left;
		background: #ccc; 
	}		
	
	#folder_list {
		width: 400px;
		position: relative;	
		float: left;
	}		
	
	.folder_div {
		margin-bottom: 5px;
		width: 400px;
		position: relative;	
		float: left;
	}	
	
	.folder_name {
		width: 400px;
		position: relative;	
		float: left;
	}	
	
	.folder_name_text {
		padding: 5px;
		width: 310px;
		position: relative;	
		float: left;
		background: #eee;
	}
	
	.folder_name_edit_btn {
		padding: 5px;	
		width: 65px;
		position: relative;	
		float: right;
		background: #ccc;
	}	
	
	.folder_edit_input {
		display: none;
		padding-top: 10px;
		width: 398px;
		position: relative;	
		float: left;
		border-left: 1px solid #eee; 
		border-bottom: 1px solid #eee; 
		border-right: 1px solid #eee; 
		margin-bottom: 15px;
	}	
	
	.folder_input_style {
		margin: 0 0 0px 5px;
		width: 376px;
		padding: 5px;	
		border: 1px solid #ccc;
		}
		
	.edit_folder_buttons {
		margin: 5px 0px 5px 0;
		width: 150px;
		position: relative;	
		float: right;
	}				
		
	.commit_edit_btn {
		margin: 0 5px 0 0;
		padding: 5px;	
		width: 60px;
		position: relative;	
		float: left;
		background: #f89838; 
	}		
	
	.commit_close_btn {
		margin: 0 5px 0 0;
		padding: 5px;	
		width: 60px;
		position: relative;	
		float: left;
		background: #ccc; 
	}		
	
	
	
	
	
	
	
	
/* --- file page --- */		

	.file_holder {
		margin: 0 0 10px 0;
		position: relative;	
		float: left;
	}
	
	.current_file_info {
		margin: 0 0 0px 0;
		position: relative;	
		float: left;
	}	
	
	.edit_file_info {
		margin: 0 0 0px 0;
		position: relative;	
		padding-bottom: 20px;
		float: left;
		width: 503px;
		display: none;
		border-left: 1px solid #f89838; 
		border-bottom: 1px solid #f89838; 
		border-right: 1px solid #f89838; 
	}	
	
	.share_file_info {
		padding: 5px;
		margin: 0 0 0px 0;
		position: relative;	
		float: left;
		width: 468px;
		border-left: 1px solid #eee; 
		border-bottom: 1px solid #eee; 
		border-right: 1px solid #eee; 
	}		
	
	.file_name_edit_btn {
		position: relative;	
		color: #000;
		padding: 6px 6px 5px 6px;	
		width: 50px;
		position: relative;	
		float: left;
		background: #ccc; 		
	}
	
	.edit_btn_spacer {
		position: relative;	
		color: #000;
		padding: 6px;	
		width: 49px;
		height: 15px;
		position: relative;	
		float: left;
		border-right: 1px solid #f89838; 
	}		
	
	.file_share_btn {
		position: relative;	
		color: #000;
		padding: 6px;	
		width: 50px;
		position: relative;	
		float: left;
		background: #eee; 		
	}		
		

	.folder_files .table_heads td:first-child {
		margin: 0 0px 0px 0px;
		padding: 5px;	
		width: 340px;
		position: relative;	
		float: left;
		background: #f89838;
		border-top: 1px solid #f89838;
		border-left: 1px solid #f89838;
		border-bottom: 1px solid #f89838;
	}	
	
	.folder_files .table_heads td:first-child + td {
		margin: 0 0px 0px 0;
		padding: 5px;	
		width: 80px;
		position: relative;	
		float: left;
		background: #f89838;
		border-top: 1px solid #f89838;
		border-left: 1px solid #f89838;
		border-right: 1px solid #f89838;
		border-bottom: 1px solid #f89838;
	}	
	
	.folder_files .table_heads td:first-child + td + td{
		margin: 0 0px 0px 0;
		width: 100px;
		position: relative;	
		float: left;
	}	
	
	.folder_files .table_heads td:first-child + td + td{
		margin: 0 0px 0px 0px;

	}	

	.folder_files td:first-child {
		margin: 0 0px 0px 0;
		padding: 5px;	
		width: 340px;
		height: 100%;
		position: relative;	
		overflow: hidden;
		float: left;
		white-space: nowrap;
		text-wrap: none;
		border-bottom: 1px solid #ccc;
		border-left: 1px solid #f89838;
	}	
	
	.folder_files td:first-child + td {
		margin: 0 0px 0px 0;
		padding: 5px;	
		width: 80px;
		height: 100%;
		position: relative;	
		float: left;
		border-bottom: 1px solid #ccc;
		border-left: 1px solid #ccc;
		border-right: 1px solid #ccc;
	}	
	
	.folder_files td:first-child + td + td{
		margin: 0 0px 0px 0;	
		width: 100px;
		height: 100%;
		position: relative;	
		float: left;
	}	
	
	.folder_files_edit .edit_table_head td:first-child {
		margin: 0 1px 0px 0;
		padding: 5px;	
		width: 183px;
		height: 100%;
		position: relative;	
		overflow: hidden;
		float: left;
		background: #eee;
		white-space: nowrap;
		text-wrap: none;
	}	
	
	.folder_files_edit .edit_table_head td:first-child + td {
		margin: 0 0px 0px 0;
		padding: 5px;	
		width: 125px;
		height: 100%;
		position: relative;	
		float: left;
		background: #eee;
	}	
	
	.folder_files_edit .edit_table_head td:first-child + td + td{
		margin: 0 0px 0px 0;
		padding: 5px;	
		width: 102px;
		height: 100%;
		position: relative;	
		float: left;
		background: #eee;
	}	

	
	.folder_files_edit td:first-child {
		margin: 0 1px 0px 0;
		padding: 5px;	
		width: 183px;
		height: 19px;
		position: relative;	
		overflow: hidden;
		float: left;
		white-space: nowrap;
		text-wrap: none;
		border-bottom: 1px solid #eee;
		border-right: 1px solid #eee;
		border-left: 1px solid #eee;
	}	
	
	.folder_files_edit td:first-child + td {
		margin: 0 0px 0px 0;
		padding: 5px;	
		width: 125px;
		height: 100%;
		position: relative;	
		float: left;
		border-bottom: 1px solid #eee;
		border-right: 1px solid #eee;		
	}	
	
	.folder_files_edit td:first-child + td + td{
		margin: 0 0px 0px 0;
		padding: 5px;	
		width: 102px;
		height: 100%;
		position: relative;	
		float: left;
		border-bottom: 1px solid #eee;	
		border-right: 1px solid #eee;
	}		
	
						
	.edit_file_buttons {
		margin: 5px 0px 5px 0;
		width: 150px;
		position: relative;	
		float: right;
	}	
	
	.share_file_buttons {
		margin: 5px 0px 5px 0;
		position: relative;	
		float: right;
	}					
		
	.file_commit_edit_btn {
		margin: 0 5px 0 0;
		padding: 5px;	
		width: 60px;
		position: relative;	
		float: left;
		background: #f89838; 
	}		
	
	.file_commit_close_btn {
		margin: 0 5px 0 0;
		padding: 5px;	
		width: 60px;
		position: relative;	
		float: left;
		background: #ccc; 
	}	
	
	.share_link_close {
		margin: 0 5px 0 0;
		padding: 5px;	
		width: 60px;
		position: relative;	
		float: left;
		background: #ccc; 
	}		
	
	
	.current_file_shares {
		padding-bottom: 15px;
		margin: 15px 0 0 15px;
		width: 475px;
		position: relative;	
		float: left;
		border: 1px solid #ccc;
	}			
	
	.current_file_shares_head {
		width: 465px;
		position: relative;	
		float: left;
		padding: 5px;
		background: #ccc;
	}	
	
	.current_file_shares_content {
		width: 475px;
		position: relative;	
		float: left;
	}
	
	.close_file_share_box {
		width: 445px;
		position: relative;	
		float: left;
		margin: 15px 0 0 15px;		
	}	
	
	.close_file_share_btn {
		position: relative;	
		color: #000;
		padding: 6px;	
		width: 50px;
		position: relative;	
		float: right;
		background: #ccc; 		
	}
	
	.share_holder {
		margin: 15px 0 0 15px;
		width: 445px;
		position: relative;	
		float: left;
		border: 1px solid #eee;
	}		
	
	.share_button_control {
		padding: 5px;
		margin: 10px 0 10px 0px;
		width: 435px;
		position: relative;	
		float: left;
	}
	
	.reshare_link {
		padding: 5px;
		margin: 5px 0 10px 0px;
		width: 425px;
		position: relative;	
		float: left;
	}	
	
	.edit_share_buttons {
		margin: 0px 0 0px 15px;
		width: 447px;
		position: relative;	
		float: left;
	}	
	
	.share_delete_btn {
		margin: 0 5px 0 5px;
		position: relative;	
		color: #000;
		padding: 6px;	
		width: 50px;
		position: relative;	
		float: right;
		background: #f53232; 		
	}	
	
	.share_save_btn {
		margin-right: 5px;
		position: relative;	
		color: #000;
		padding: 6px;	
		width: 50px;
		position: relative;	
		float: right;
		background: #5dc94e; 		
	}
	
	.save_new_share {
		margin-top: 10px;
		margin-right: 8px;
		position: relative;	
		color: #000;
		padding: 6px;	
		width: 50px;
		position: relative;	
		float: right;
		background: #5dc94e; 		
	}	
	
	.share_close_btn {
		position: relative;	
		color: #000;
		padding: 6px;	
		width: 50px;
		position: relative;	
		float: right;
		background: #ccc; 		
	}	
	
	.add_share {
		margin: 15px 0 0 15px;
		width: 475px;
		position: relative;	
		float: left;
	}		
	
	.add_share_options {
		padding: 10px;
		margin: 0px 0 0 15px;
		width: 455px;
		position: relative;	
		float: left;
		border: 1px solid #f89838;
	}				
											
	.add_file_share_btn {
		position: relative;	
		color: #000;
		padding: 6px;	
		position: relative;	
		float: left;
		background: #f89838;		
	}	
	
	.del_file_btn {
		margin-left: 5px;
		position: relative;	
		color: #000;
		padding: 6px;	
		position: relative;	
		float: left;
		background: #f53232;		
	}		
	
	.show_edit_share_buttons {
		position: relative;	
		color: #000;
		padding: 6px;	
		width: 50px;
		position: relative;	
		float: right;
		background: #f89838;			
	}
	
	.show_share_link {
		position: relative;	
		color: #000;
		padding: 6px;	
		position: relative;	
		float: right;
		background: #f89838;			
	}	
	
	.share_link_print td:first-child {
		position: relative;	
		width: 40px;
		color: #000;
		padding: 6px;	
		position: relative;	
		float: left;
		background: #eee;	
		border-bottom: 1px solid #eee;			
	}		
	
	.share_link_print td:first-child + td {
		position: relative;	
		color: #000;
		width: 380px;
		padding: 6px;	
		position: relative;	
		float: left;
		border-bottom: 1px solid #eee;			
	}	
	
	.save_new_share_div {
		width: 450px;
		margin: 0px 0 0 0;
		position: relative;	
		float: left;
	}	
	
	.save_new_share_msg {
		display: none;
		padding: 6px;
		margin: 10px 0 0 0;
		position: relative;	
		float: left;
		background: #5dc94e; 	
	}
	
	.delete_share_msg {
		display: none;
		padding: 6px;
		margin: 10px 0 0 0;
		position: relative;	
		float: left;
		background: #F53232; 	
	}		
	
	.save_gif {
		display: none;
		margin: 10px 20px 0 0;
		position: relative;	
		float: right;	
	}									
	
	.edit_share_div {
		width: 450px;
		margin: 0px 0 0 0;
		position: relative;	
		float: left;
		border: 1px solid red;
	}		
	

/*   ---------  upload pages   -----------  */	
	
	#upload_table td {
		margin: 0 0px 0px 0;
		padding: 5px;	
		border-bottom: 1px solid #ccc;
	}	
	
	#success_message {
		display: none;
		margin: 15px 0 0 0;
		position: relative;	
		float: left;	
	}
	
	.upload_button {
		padding: 6px;
		margin: 0px 0 0 0;
		position: relative;	
		float: right;	
		background: #f89838; 	
		border: 0;
	}	
	

	#file_uploader {
		width: 500px;
		margin: 0px 0 0 0;
		position: relative;	
		float: left;
	}			
	
	
	
	
	
	
/*   ---------  share pages   -----------  */	

	#video_box {
		margin: 30px 0 0 150px;
		width: 500px;
		height: 350px;
		float: left;
		position: relative;	
		border: 1px solid #f89838; 
		overflow: hidden;
	}	
	
	#video_details {
		padding: 5px 15px 10px 15px;
		margin: 5px 0 50px 150px;	
		float: left;
		width: 470px;
		height: 150px;
		position: relative;	
		border: 1px solid #eee;
	}
	
	#video_details_own {
		padding: 5px 15px 10px 15px;
		margin: 50px 0 100px 150px;	
		float: left;
		width: 470px;
		height: 150px;
		position: relative;	
		border: 1px solid #eee;
	}	
	
	#video_details_text {
		margin: 0px 0 0 0px;	
		float: left;
		width: 350px;
		height: 120px;
		position: relative;	
	}		
	
	#video_details_dl {
		margin: 0px 0 0 0px;	
		float: right;
		width: 100px;
		height: 120px;
		position: relative;	
	}			
	
	.file_download_button {
		margin-top: 100px;
		padding: 10px;
		background: #f89838;
		border: 0;
		position: relative:
		float: right;
	}
	
	.support_download_button {
		padding: 5px 5px 6px 5px;
		background: #ccc;
		border: 0;
		position: relative:
		float: left;
	}