/* reset.css */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:400;}ol,ul{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400;}q:before,q:after{content:'';}fieldset,img,abbr,acronym{border:0;}
tr.darker {font-weight:bold;color:#000;border-top:1px solid #ddd}

body {
	color: #333;
	margin: 0;
	padding: 0;
	font: 0.875em/1.1em Calibri, Arial, sans-serif;
	background-image: url('/img/preview_background.png');
	background-repeat: repeat-y;
	margin-bottom: 20px;
}

body, html {
	height: 100%;
}

input {
	outline-style: none;
}

h1 {
	font-size: 1.5em;
	line-height:0.9em;
	text-transform: uppercase;
}

h2 {
	font-size: 1.22em;
	text-transform: uppercase;
}

a {
	text-decoration: none;
	color: #900;
}
	a:focus, a:active {
		outline: none;
	}


form table th,
form table td {
	padding: 10px;
	padding-left: 0;
}
.news-social-media {
	margin-top:10px;
}
form table tr.disabled {
	color: #f00;
}
#tell-a-friend-form {
	position:relative;
	display:none;
	
}
form.small {
	margin-left:25px;
	width:330px;
}
form.small fieldset {
	width:280px;
	overflow:hidden;
}
form.small div.input label {
	width:120px;
}
.news-social-media {position:relative;}
	#share-text {position:absolute;left:190px;top:-1px;}
	.news-clearer {
		background-color: #666;
		border: none;
		height: 1px;
		margin: 1em 0;
	}

	.news-share-icon {
		float: right;
		margin: 0 6px;
	}
.news-social-media {
	height:30px;
}
form.small div.input input[type="text"],
form.small div.input input[type="password"], 
form.small div.input select, 
form.small div.input textarea {
    width:160px;
}

form.small div.submit {
	clear:both;
	width:280px;
	padding: 8px 15px 8px 15px;
}
/* http://www.quirksmode.org/css/forms.html */
div.input label, div.input input[type="text"], div.input input[type="password"], div.input textarea, div.input select {
	display: block;
	width: 300px;
	float: left;
	margin-top: 10px;
	/*margin-right: 10px;*/
}

/*
 * Review details - user
 */
#tabs .ui-tabs-panel a {color:#990000}
#tabs .ui-tabs-panel a:hover {color:#222}
.ui-tabs-panel h4 {font-size:14px;text-decoration:underline}
.ui-tabs-panel {font-size:12px;}
.ui-tabs-panel dt {
	clear:both;
	width:120px;
	padding-right:20px;
	margin:10px 13px 10px 0;
	text-align:left;
}
.ui-tabs-panel dd {
	position:relative;
	margin: -24px 0 0 140px;
	display:block;
	float:left;
	width:270px;
	color:#555;
}
div.input input[type="text"],div.input input[type="password"], div.input select, div.input textarea {
	font: 0.835em Calibri, Arial, sans-serif;
	border: 1px solid #c8c8c8;
	background: #eee;
	color: #333;
	padding: 3px;
    -moz-border-radius:4px; 
    -webkit-border-radius:4px; 
}

div.input.text label, div.input .text label, div.input.password label, div.input.select label, div.input.textarea label {
	text-align: right;
	width: 170px;
	padding-right: 20px;
	margin-right: 0px;
	margin-top: 13px;
}
	div.input label.required {
		font-weight: bold;
	}

div.input.checkbox label {
	display: block;
	width: 310px;
	float: right;
	margin-top: 9px;
	margin-right: 10px;
}
div.input input[type="checkbox"]{
	text-align: right;
	padding-right: 20px;
	margin-left: 144px;
	margin-right: 0px;
	margin-top: 13px;
}
div.input, div.input br {
	clear: left;
}

/* */
div.tooltip-div { 
    background-color:#000; 
    border:2px solid #fff; 
    padding:5px 10px; 
    width:200px; 
    display:none; 
    color:#fff; 
    text-align:left;
	font-size: 0.835em;
 
    /* outline shadow for mozilla/firefox only */ 
    -moz-box-shadow:0 0 10px #000; 
    -webkit-box-shadow:0 0 10px #000; 

    /* corner radius for mozilla/firefox only */ 
    -moz-border-radius:5px; 
    -webkit-border-radius:5px; 
}

div.input div.error-message {
	font-size: 0.835em;
	margin-left: 185px;
	min-width: 50px;
	color: #900;
	clear: left;
}
	div.input input.form-error {
		background-image: url("/img/validation-error.png");
		background-position: 285px 2px;
		background-repeat: no-repeat;
		border: 1px solid #900;
	}
	div.input input.form-success {
		background-image: url("/img/validation-success.png");
		background-position: 285px 2px;
		background-repeat: no-repeat;
		border: 1px solid #060;
	}
	div.input textarea.form-error {
		border: 1px solid #900;
	}
div.input.form-first, p.form-first {
	margin-top:15px;
}
div.input.information,p.information {
	padding-left: 40px;
		background-image: url("/img/information.png");
		background-repeat: no-repeat;
}

fieldset {
	border: 1px solid #cdcdcd;
	padding: 0px 25px 25px 25px;
	margin-bottom: 20px;
	width:500px;

    /* corner radius for mozilla/firefox only */ 
    -moz-border-radius:5px; 
    -webkit-border-radius:5px; 
}
	fieldset legend {
		margin-left: -10px;
		padding: 0px 10px;
		background: #fff;
	}
	
form div.submit {
	float: left;
	border: 1px solid #cc7f7f;
	background: #b34040;
	color: #333;
	padding: 15px 25px 15px 25px;
	width:500px;
    -moz-border-radius:4px; 
    -webkit-border-radius:4px; 
}
	form div.submit input {
		display: block;
		margin: 0px;
		padding: 0px;
	}
	
	form div.submit .continue {
		float: right;
	}

#main-content-area.medium form div.submit,
#main-content-area.medium fieldset {
	width: 650px;
}

#main-content-area.big form div.submit,
#main-content-area.big fieldset {
	width: 800px;
}

div.clear {
	clear: both;
}





/*
*	MAIN STUFF
*
*
*
*
*
*
*/
#wrapper {
	/*position: absolute;
	width: 100%;
	height: 100%;*/
}

	#top-bar-background {
		background: #fff url("/img/top_bar.gif") repeat-x;
		position: absolute;
		z-index: -1;
		width: 100%;
		height: 51px;
		position: fixed;
		z-index:10;
	}

	#top-bar {
		position: fixed;
		width: 1000px; 
		height: 51px;
		z-index:20;
	}
	
		#main-navigation {
			float: left;
			margin: 16px 0 0 9px;
		}
			#main-navigation li {
				float: left;
				margin: 0 7px;
				
			}
				
				#main-navigation li a {
					display: block;
					font-size: 16px;
					text-transform: uppercase;
				/*	text-shadow: #fff 0px 0px 1px;
					filter: Shadow(
						Color = #fff,
						Direction = 135,
						Strength = 4
					);*/
				}
				
				#main-navigation li a.normal {
					color: #777;
				}
				
				#main-navigation li a.active {
					color: #000;
				}
				
		#login {
			float: right;
			margin: 5px 0 0 0;
		}
		
			#login input[type = "submit"] {
				background: transparent url("/img/login_button.gif") no-repeat center top;
				border: 0;
				float: left;
				margin: 7px 12px 7px 5px;
				text-indent: -4096px;
				width: 38px;
				height: 19px;
				font-size: 0px;
				cursor: pointer;
			}
			
			#login input[type = "text"],
			#login input[type = "password"] {
				color: #666;
				border: 0;
				float: left;
				margin: 8px 3px 0 5px;
				font-size: 10px;
				padding: 0 0 0 5px;
				width: 100px;
				height: 16px;
				border: 1px solid #abadb3;
			}
			
			* html #login input[type = "text"],
			* html #login input[type = "password"] {
				width: 178px;
			}
	
	
	
	#search-bar-background {
		background-color: #eaeaea;
		position: absolute;
		position: fixed;
		top: 51px;
		left: 0;
	/*	opacity: 0.3;
		-moz-opacity: 0.3;
		filter:alpha(opacity=30);
	*/	width: 100%;
		height: 31px;
		z-index:20;
	}
	
	#search-bar {
		position: fixed;
		position: absolute;
		position: fixed;
		top: 51px;
		width: 1000px;
		height: 31px;
		z-index:30;
	}
	 
		#search-bar input.search-submit {
			background: transparent url("/img/search_button.gif") no-repeat center top;
			border: 0;
			float: left;
			margin: 7px 12px 7px 5px;
			text-indent: -4096px;
			width: 65px;
			height: 18px;
			font-size: 0px;
			cursor: pointer;
		}
		
		#search-bar input#search-string {
			color: #666;
			border: 0;
			float: left;
			font-size: 10px;
			margin: 6px 1px 0px 15px;
			padding: 3px 0px 1px 5px;
			width: 173px;
			height: 16px;
		}
		
		* html #search-bar input#search-string {
			width: 178px;
		}

			#search-bar-query {
				float: left;
			}
		
			#search-bar-checkboxes {
				float: left;
				margin-top: 4px;
			}
		
				#search-bar-checkboxes label {
					color: #666;
					float: left;
					font-size: 13px;
					margin: 2px 5px 0 5px;
					text-transform: uppercase;
				}
				
				#search-bar-checkboxes input {
					float: left;
					margin-top: 6px;
					height: 13px;
				}
	/*#taskbar {
		float: right;
		margin-right: 20px;
		color: #666;
		font-size: 13px;
		margin: 6px 5px 0 5px;
		text-transform: uppercase;
	}*/
	#taskbar {
		position:absolute;
		top:0px;
		left:750px;
		color:#666;
		font-size:13px;
		margin: 6px 5px 0 5px;
		text-transform: uppercase;
		width:450px;
	}
	
		#taskbar a {
			margin-left: 15px;
		}
				
	#content-wrapper {
		/*height: 100%;*/
		position: absolute;
		top: 110px;
		/*left:35px;*/
	}
	
		#content {
			height: 100%;
		}
	
		#ajax-loading {
			position: fixed;
			top: 110px;
			left: 0px;
			width: 400px;
			float: left;
			text-align: right;
		}
	
		#preview-pane {
			position: fixed;
			top: 82px;
			width: 420px;
			left:0;
		}

		#left-pane {
			position: fixed;
			top: 175px;
			left:0;
			width: 420px;
			padding-left: 20px;
		}
		
			#left-pane h1 {
				padding-bottom: 30px;
			}
		
			/*#left-pane ul.project-list li {
				margin-bottom: 0.5em;
			}

				#left-pane ul.project-list li span {
					float: left;
					width: 100px;
				}*/
			
			#left-pane .project-list th,
			#left-pane .project-list td {
				padding: 0 20px 5px 0;
			}
		
		#preview {
			width: 420px;
			float: left;
			margin-top: 50px;
		}
		
			#preview-display {
				width: 420px;
				height: 400px;
				display: table-cell;
				text-align: center;
				vertical-align: middle;
				margin-bottom: 30px;
				*padding-top:35px;
			}
			
				#preview-display img {
					border: 1px #000 solid;
				}
			
			#preview-menu {
				width: 420px;
				height: 34px;
				background: #eaeaea url('/img/bg_preview_menu_red.png') repeat-x;
			}
				
				#preview-menu ul {
					
				}
					
					#preview-menu ul li {
						width: 85px;
						padding: 6px 10px;
						float: left;
						text-align: center;
						font-size: 0.65em;
						line-height: 1em;
					}
					
						#preview-menu ul li a {
							text-transform: uppercase;
							font-weight: bold;
							color: #fff;
						}
			
			#preview-content {
				width: 360px;
				padding: 30px 30px 30px 30px;
				font-size: 0.8em;
				overflow: auto;
			}
			
				#preview-content dl {
					
				}
				
				#preview-content dt {
					width: 100px;
					float: left;
				}
				
				#preview-content dd {
					margin-left: 125px;
					clear: right;
					margin-bottom: 15px;
				}
		
		#search-results,
		#main-content-area {
			padding-top: 65px;
			margin-left: 450px; 
			margin-right: 0px;
		}
		
		#main-content-area {
			width: 500px;
		}
			
			#main-content-area.medium {
				width: 650px
			}
			
			#main-content-area.big {
				width: 800px
			}
		
			#search-results h1 {
				
			}
			#fb-share-search {
			}
			#search-results.my_projects h1 {padding-bottom:0}
			.search-result-container {
				float: left;
				width: 120px;
				margin-right: 15px;
				margin-bottom: 15px;
				border: 1px solid rgb(150,150,150);
				padding: 10px;
				text-align: center;
			}
			#search-results.my_projects .message-box {margin-bottom:30px;}
				
				.search-result{
					width: 120px;
				}
				
				.search-result-image{
					display: table-cell;
					width: 120px;
					height: 120px;
					padding: 0px;
					text-align: center;
					vertical-align: middle;
					line-height: 1px;
					/*margin-bottom: 15px;*/
				}
				
				div.search-result table{
					width: 100px;
					margin: 5px 10px 0px 10px;
				}
				
				.search-result-image:hover{
					background: #939598;
				}
				
			.search-result-container-l {
				float: left;
				width: 350px;
				margin-right: 15px;
				margin-bottom: 15px;
				border: 1px solid rgb(150,150,150);
				padding: 10px;
				text-align: center;
			}
				
				.search-result-l {
					width: 350px;
				/*	height: 175px;
					min-height: 175px;
					max-height: 175px;
					font-size: 11px;
					line-height: 14px;
				*/}
				
				.search-result-image-l {
					display: table-cell;
					width: 350px;
					height: 350px;
					padding: 0px;
					text-align: center;
					vertical-align: middle;
					line-height: 1px;
					/*margin-bottom: 15px;*/
				}
				
				div.search-result-l table {
					width: 100px;
					margin: 5px 125px 0px 125px;
				}
				
				.search-result-image-l:hover{
					background: #939598;
				}
		
		#project-pane {
			position: fixed;
			left: 420px;
			top: 82px;
			height: 150px;
			width: 100%;
			background-color: #c1c1c1;
			border-bottom: 1px solid #111;
			z-index: 45;
			
		}
		
			#project-pane-content {
				padding: 20px;
			}
		
		#project-pane-wrap {
			left: 420px;
			background-color: #fff;
			height: 150px;
		}
		
		
		/* Paging */
		div.paging {
			background:#fff;
			color: #ccc;
			margin-bottom: 2em;
		}
		div.paging div.disabled {
			color: #ddd;
			display: inline;
		}
		div.paging span {
		}
		div.paging span.current {
			color: #000;
		}
		div.paging span a {
		}
		
	
	
	
	
	
	
	

.modal { 
    background-color:#fff; 
    display:none; 
    width:550px;
    height: 450px;
    padding:25px; 
    text-align:left; 
    border:2px solid #333; 
 
    opacity:0.8; 
    -moz-border-radius:6px; 
    -webkit-border-radius:6px; 
    -moz-box-shadow: 0 0 50px #ccc; 
    -webkit-box-shadow: 0 0 50px #ccc; 
}

.modal div.content { 
    width:500px;
    height: 360px;
    overflow: auto;
} 
 
.modal h2 { 
    background:url(/img/global/info.png) 0 50% no-repeat; 
    margin:0px; 
    padding:10px 0 10px 45px; 
    border-bottom:1px solid #333; 
    font-size:20px; 
}











/* everything is constructed with a single background image */

/* root element for tabs */
#flowtabs {
	
	/* dimensions */
	width:500px;
	height:31px !important;
	margin:0 !important; 
	padding:0;	
	
	/* IE6 specific branch (prefixed with "_") */
	_margin-bottom:-2px;
}

/* single tab */
#flowtabs li { 
	float:left; 
	margin:0; 
	padding:0; 
	text-indent:0; 
	list-style-type:none;
}

/* a- tag inside single tab */
#flowtabs li a {
	background: url(http://flowplayer.org/tools/img/tabs/blue_panes.jpg) no-repeat;
	display:block;
	height: 31px;   
	width: 100px; 	
	padding:0px;
	margin:0px;
	
	/* font decoration 
	color:#000;
	font-size:12px;*/
	line-height:33px;
	text-align:center;
	text-decoration:none;
}

/* adjust the background image position on each tab */
#flowtabs #t1 			{ background-position: 0 0; }
#flowtabs #t2 			{ background-position: -189px 0; }
#flowtabs #t3 			{ background-position: -378px 0; }
#flowtabs #t4 			{ background-position: -567px 0; width:192px;}
 
/* mouseover state */
#flowtabs a:hover 		{ color:#fff;	 }
#flowtabs #t1:hover 	{ background-position:      0 -33px; }
#flowtabs #t2:hover 	{ background-position: -189px -33px; }
#flowtabs #t3:hover 	{ background-position: -378px -33px; }
#flowtabs #t4:hover 	{ background-position: -567px -33px; }

/* currently selected tabs */
#flowtabs a.current		{ cursor:default; color:#fff; line-height:34px; }
#flowtabs #t1.current { background-position:      0 -66px; }
#flowtabs #t2.current { background-position: -189px -66px; }
#flowtabs #t3.current { background-position: -378px -66px; }
#flowtabs #t4.current { background-position: -567px -66px; }


/* panes */
#flowpanes {
	background: url(http://flowplayer.org/tools/img/tabs/blue_panes.jpg) no-repeat 0 -100px;
	width:500px;
	height:450px;	
}


/* single pane */
#flowpanes div {
	display:none;	
	color:#fff;	
	margin:20px 40px;
}

/* some decorations for elements inside single pane */
#flowpanes div h4 {
	font-weight:normal;
	color:#ddd;
	letter-spacing:1px;
	margin:10px 0 0 0;
	font-size:22px;	
}

#flowpanes a {
	color:#cc9;		
	font-size:14px;
}

#flowpanes p, #flowpanes samp {
	color:#ccc;		
}

#flowpanes div.narrow {
	padding-right:160px;		
}

.message-box {
	width: 540px;
}

.flash {
	padding: 8px;
	font-weight: bold;
	position: absolute;
	left: 450px;
	width: 450px;
}

.flash_failure {
	background-color: #fecccc;
}

.flash_success {
	background-color: #ccfecc;
}
#left-pane .active-link {
	color:#222;
	text-decoration:none;
}
#taskbar a, #left-pane a {
	color:#000;
}
#taskbar .active-link, #taskbar a:hover, 
#left-pane .active-link, #left-pane a:hover {
	/*color:#222;*/
	color:#900;
}
#left-pane ul li {
	margin-bottom:8px;
}
.lost-pwd-in-form {text-align:right;margin:0;}
.or-separator {padding-top:10px;margin: 15px 0 5px 200px;font-size:16px;font-weight:bold;line-height:23px;}
div.explanation {
	clear:both;
	font-family: helvetica, arial, sans-serif;
	font-size:10px;
	text-align:right;
	
}

#CartConfirmForm dl {
	margin-top: 1em;
}

#CartConfirmForm dl dt {
	font-weight: bold;
	float: left;
	width: 150px;
}

#CartConfirmForm dl dd {
	margin-bottom: 3px;
}
.order_history th {border-bottom:1px solid #000}
.order_history p {margin:0 0 3px 0;color:#666}
.order_history p.header{color:#000;}
.order_history td, .order_history th {
		padding:8px 0;
}
.order_history th {font-weight:bold}
tr.order_row td {
	border-bottom:1px solid #ccc;
	font-weight:bold;
}
tr.order_picture_row td.amount {
	color:#777;
}
td.order_picture_content img {float:left;margin-top:4px;}
td.order_picture_content p {margin-left:115px}
table.classic_table th {font-weight:bold;}
table.classic_table th,
table.classic_table td {
	padding: 5px 5px 5px 0;
}
#credits-box {
	position:absolute;
	left:449px;
	top:-16px;
	width:500px;
	padding:15px 25px;
	margin:15px 0;
	border:1px solid #cdcdcd;
	-moz-border-radius:5px;
}

.use_type label, .use_type input, .size input, .size label, .payment_method input, .payment_method label {margin-bottom:4px;margin-right:3px}