/* @override 
	http://localhost/picsengine3/site2/public/css/style.css
*/

/* @group global */

html, body {
	height: 100%;
}
body {
	background: #131313 url('../src/common/back.gif') repeat-x;
	font: 14px "Lucida Grande", Arial, Verdana, sans-serif;
}
body, h1, h2, h3, h4, h5, p, ul, li, img, form, dl, dd, dt {
	font-weight: normal;
	font-family: "Lucida Grande", Arial, Verdana, sans-serif;
	padding-top: 0px;
}
input, textarea {
	font-family: "Lucida Grande", Arial, Verdana, sans-serif;	
}

a, a:hover, a:active, a:visited, a:link {
	text-decoration: underline;
	color: #fff;
	outline: 0;
	cursor: pointer;
}

p {
	font: 12px "Lucida Grande", "Trebuchet MS", Verdana, sans-serif;
	color: #000000;
}

h1 {
	font: 24px "Trebuchet MS", Verdana;	
	color: #FFF;
}
h2 {
	font: 18px "Trebuchet MS", Verdana;
	color: #FFF;
	text-shadow: #000 0 2px 2px;
}
h3 {
	font: 14px "Trebuchet MS", Verdana;	
	color: #FFF;
	padding-top: 10px;
	text-shadow: #000 0 2px 2px;
}


/* @end */

/* @group error 404 */
#error_404 {
	width: 400px;
	margin: 0 auto 0 auto;
	overflow: auto;
}
#error_404 #logo {
	position: relative;
	margin-left: 16px;
}
#error_404 #message {
	background: #000;
	margin-top: 9px;
	padding: 20px;
	border-color: #303030;
	border-top-style: solid;
	border-top-width: 1px;
}
#error_404 p {
	padding: 5px 0 0 0;
}
/* @end */

/* @group form */
.form {
	overflow: auto; 
}
.form label {
	color: #626262; 
	font-size: 12px;
	clear: left;
	float: left;
	width: 265px;
	text-align: right;
	padding: 10px;
}
.form .input {
	float: left; 
}
.form .info {
	clear: left;
	padding-left: 285px; 
	padding-bottom: 6px;
}
.form .info p {
	width: 310px; 
	font-size: 11px;
}
.form .form_row .input input, .form .form_row textarea {
	 color: #626262; 
}
.form .form_row.focus label {
	color: #fff; 
}
.form .form_row.focus .input input, .form .form_row.focus textarea {
	border-color: #fff;
	color: #fff;
}
/* @end */

/* @group input */
.input input {
	background: #1c1c1c url('../src/common/input/back.gif') repeat-x;
	border: 1px solid #2f2f2f;
	padding: 6px;
	color: #fff;
	font-size: 12px;
	width: 300px;
}
.input input:focus {
	outline: 0; 
}
/* @end */

/* @group textarea */
textarea {
	background: #1c1c1c url('../src/common/input/back.gif') repeat-x;
	border: 1px solid #2f2f2f;
	padding: 6px 4px 6px 4px;
	color: #fff;
	font-size: 12px;
}
textarea:focus {
	outline: 0;
}
/* @end */

/* @group buttons */

a.button, .button, .button span, .button:hover {
	display: block;
	height: 36px;
	text-decoration: none;
}
.button:hover { color: #FFF; }
.button {
	float: left;
	font-size: 12px;
	color: #FFF;
	background: url('../src/common/button_left.png') no-repeat;
}
.button span {
	float: left;
	background: url('../src/common/button_right.png') no-repeat top right;
}
.button span span {
	margin: 0 10px 0 10px;
	padding: 5px 6px 0 6px;
	height: 31px;
	background: url('../src/common/button_center.png') repeat-x;
}
.button:active, .button.active { background: url('../src/common/button_active_left.png') no-repeat; }
.button:active span, .button.active span { background: url('../src/common/button_active_right.png') no-repeat top right; }
.button:active span span, .button.active span span { background: url('../src/common/button_active_center.png') repeat-x; }

/* @end */


/* @group select */
.select, .select div {
	height: 31px;
	background-image: url('../src/common/buy/select.gif');
	background-position: 0 -31px;
}
.select div {
	background-repeat: no-repeat;
	background-position: 0 0;
}
.select div div {
	background-position: right -62px; 
	overflow: hidden;
}
.select a {
	float: left;
	display: block;
	height: 15px;
	padding: 8px;
	font-size: 12px;
	text-decoration: none;
	text-shadow: #000 0 -1px 0; 
}
.select a.first {
	background: url('../src/common/buy/select.gif') no-repeat right -93px;
	padding-right: 24px; 
}
/* @end */

/* @group transluent panel */
.transluent_panel {
	position: absolute;
	margin: 0px;
}
.transluent_panel.tiny, .transluent_panel.tiny .back {
	height: 280px; 
}
.transluent_panel .back {
	position: absolute;
	background: #000;
	opacity: 0.6;
	-moz-opacity: 0.6;
	filter:alpha(opacity=60);
	width: 800px;
	height: 350px;	 
	z-index: 9;
}
.transluent_panel .loading, .transluent_panel .message {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	z-index: 10;	 
}
.transluent_panel .loading {
	background: url('../src/common/loading.gif') no-repeat center 110px; 
}
.transluent_panel .loading p, .transluent_panel .message p {
	font-size: 11px;
	text-align: center; 
	z-index: 11;
	color: #fff;
	margin-top: 130px;
}
/* @end */

/* @group structure */

#picsengine {
	width: 897px;
	margin: 0 auto 25px auto;
}

#head {
	width: 100%;
	height: 149px;
}

#logo {
	position: absolute;
	background: url('../src/common/logo.png') no-repeat;
	margin-top: 0px;
	margin-left: 10px;
	display: block;
	width: 750px;
	height: 149px;
}

#logo span {
	display: none;
}

/* @group menu */

#menu {
	list-style: none;
	float: right;
	margin-top: 63px;
	overflow: hidden;
}

#menu li {
	float: left;
}

#menu li a {
	float: left;
	display: block;
	height: 45px;
	text-decoration: none;
	font-size: 12px;
	text-shadow: #000 0 -1px 0; 
	font-weight: bold;
}

#menu li a:hover {
	text-decoration: underline;
}

#menu li a.current:hover, #menu li a.first_current:hover, #menu li a.last_current:hover {
	text-decoration: none;
}

#menu li a span {
	float: left;
	display: block;
	height: 45px;
}

#menu li a span span {
	padding: 11px 12px 0 15px;
	height: 34px;
}

/* @group normal */

/* @group first */

#menu li a.first span {
	background-position: 0 0;
}

#menu li a.first span span {
	background-position: top right;
	padding-left: 30px; /* 15 + 15 */
}

/* @end */

/* @group last */

#menu li a.last {
	margin-right: 7px;
}

/* @end */



#menu li a {
	background: url('../src/common/menu/normal_center.gif') repeat-x;
}

#menu li a span {
	background: url('../src/common/menu/normal_left.gif') no-repeat -15px 0;
}

#menu li a.after_current span span, #menu li a span span {
	background: url('../src/common/menu/normal_right.gif') no-repeat top right;
}

#menu li a.after_current span {
	background-image: url('../src/common/menu/normal_after_current.gif');
	background-position: 0 0;
}

#menu li a.before_current span span {
	background-image: url('../src/common/menu/normal_before_current.gif');
}

/* @end */

/* @group current */

/* @group first */

#menu li a.first_current {
	background-image: url('../src/common/menu/current_center.gif');
}

#menu li a.first_current span {
	background-image: url('../src/common/menu/current_left.gif');
}

#menu li a.first_current span span {
	background-image: url('../src/common/menu/current_right.gif');
}

/* @end */

/* @group last */

#menu li a.last_current {
	margin-right: 0px;
	background-image: url('../src/common/menu/current_center.gif');
}

#menu li a.last_current span {
	background-image: url('../src/common/menu/current_left.gif');
}

#menu li a.last_current span span {
	background-image: url('../src/common/menu/last_current_right.gif');
	padding-right: 19px;
}

/* @end */

#menu li a.current {
	background-image: url('../src/common/menu/current_center.gif');
}

#menu li a.current span {
	background-image: url('../src/common/menu/current_left.gif');
}

#menu li a.current span span {
	background-image: url('../src/common/menu/current_right.gif');
}

/* @end */
/* @end */

/* @group footer */
#footer {
	text-align: center;
	font-size: 11px; 
	padding-bottom: 14px;
}
#footer ul {
	list-style: none; 
	padding-bottom: 6px;
}
#footer ul li {
	display: inline;
	padding: 0 5px 0 5px;
	color: #fff;
}
/* @end */

/* @end */

/* @group black */

.black {
	padding-top: 10px;
	height: 575px;
}
.black .footer {
	overflow: hidden;
	background: url('../src/common/footer.gif') no-repeat left bottom;
	padding-bottom: 15px;
}

/* @end */

/* @group grey */

.grey {
	width: 100%;
	overflow: hidden;
	background: url('../src/common/grey/grey.gif') repeat-y;
	margin-bottom: 15px;
}

.black_to_grey {
	background: url('../src/common/grey/black_to_grey.gif') no-repeat;
}

.grey .footer {
	background: url('../src/common/grey/footer.gif') no-repeat bottom left;
}


/* @end */

/* @group homepage */
#top {
	overflow: visible;
}

.main_link {
	clear: both;
	height: 475px;
	width: 100%;
	display: block;
}

#maintext {
	width: 645px;
	height: 59px;
	margin-top: 10px;
}

#button_see {
	display: block;
	width: 800px;
	height: auto;
	margin-left: 50px;
}

#maintext span, #top h1, #button_see span {
}

#screenshot {
	margin-left: 7px;
	padding: 0 0 0 0;
	background: url('../src/common/homepage/screen_1.jpg') no-repeat bottom left;
}

.links {
	margin: 0 auto 0 auto;
	width: 780px;
}
.links a, .links a:visited {
	color: #363636;
}
.links a {
	font-size: 11px;
	width: 268px;
	text-align: right;
}
.links a:hover {
	color: #FFF; 
}
.links .quicktime, .links .buy {
	margin: 38px 7px 0 7px;
}
.links .quicktime {
	 background: url('../src/common/homepage/quicktime.gif') no-repeat 0 1px;
	 padding-left: 16px;
	 width: 252px;
	 text-align: left;
}
.links .quicktime:hover {
	background-image: url('../src/common/homepage/quicktime_hover.gif'); 
}

/* @group specs */

#specs .footer {
	padding: 30px 0 30px 0;
	overflow: hidden;
}
#specs_previous, #specs_next {
	position: absolute;
	margin-top: 160px;
	z-index: 1000;
}
#specs_previous {
	margin-left: -12px;
}
#specs_next {
	margin-left: 870px;
}
#specs_container {
	position: relative;
	overflow: hidden;
	width: 883px;
}
#specs_content {
	width: 5000px;
}
#specs .content {
	float: left;
	padding: 10px 0 0 38px; 
	overflow: hidden;
	width: 852px;
}

#specs h1 {
	height: 32px; 
	background-position: 40px 0;
	background-repeat: no-repeat;
}
#specs h1 span {
	display: none; 
}

#specs h2 {
	padding-bottom: 4px;
}
#specs .thumbnails {
}
#specs .comments {
}
#specs .tags {
}
#specs .exif {
}
#specs .albums {
}

#specs p {
	font-size: 12px;
	color: #CCCCCC;
	line-height: 18px;
	width: 800px;
}
#specs p strong {
	color: #FFF;
}

#specs .col {
	float: left;
	width: 275px;
	margin-right: 0px;
	margin-left: 9px;
}

/* @end */
/* @end */

/* @group buy */

#buy {
	padding: 0 0 30px 48px;
}
#buy_top {
	background: url('../src/common/buy/separator.gif') no-repeat bottom center; 
	overflow: hidden;
	padding-bottom: 30px;
	width: 800px;
}
#buy_top .col_left p a {
	display: block;
	margin-top: 10px;
}
#buy p {
	padding: 4px 3px 0 3px; 
}
#buy strong {
	color: #fff; 
}
#buy .col_left {
	float: left;
	width: 400px; 
}
#buy .col_right {
	float: left;
	width: 400px;
	text-align: right;
}
#buy h1 span {
	display: none; 
}
#buy .col_left h1 {
	display: block;	 
	width: 343px;
	height: 34px;
}
#buy .col_right h1 {
	display: block;
	width: 400px;
	height: 34px;
}

#buy_content {
	width: 800px;
}
#buy_content .select {
	width: 400px;
	margin: 20px auto 20px auto; 
}
#buy_content .select a {
	width: 170px;
}
#buy_content .select a span {
	display: block;
	width: 160px;
	text-align: left;
	padding-left: 16px;
	padding-right: 0;
	background: url('../src/common/buy/select_puce.gif') no-repeat 0px 3px; 
}
#buy_content .select a.selected span {
	background-position: 0px -38px; 
}

#buy_loading_panel, #buy_loading_panel .back {
	width: 800px;
	height: 380px;	 	 
}
#buy_loading_panel.tiny, #buy_loading_panel.tiny .back {
	height: 320px; 
}

#buy form .submit {
	clear: both;	
	margin: 83px auto 0 auto;
	display: block;
	width: 201px;
	height: 30px;
}
#buy form .submit span {
	display: none; 
}
#buy form hr {
	border: 0;
	height: 10px;
	display: block;
	clear: both;
}
/* @end */

/* @group license */
#buy_license {
	padding: 0 48px 30px 48px;
	overflow: hidden;
}
#buy_license h2 {
	font-size: 16px;
	padding: 0;
	margin-top: 10px;
	margin-bottom: 10px;
	color: #fff;
}
#buy_license p {
	padding-bottom: 30px;
	line-height: 1.5em;
}
#buy_license .col, .cols .col {
	float: left;
	width: 360px;
	padding-left: 50px;
}
#buy_license .col.first, .cols .col.first {
	padding: 0;
	width: 390px;
}
#buy_license ul {
	list-style: none;
}
/* @end */

/* @group demo */
#demo {
	padding: 0 48px 30px 48px;
	overflow: hidden;
}
#demo h1 {
	padding-bottom: 5px;
}
#demo p {
	padding-bottom: 5px;
}
#link_demo {
	display: block;
	width: 122px;
	height: 29px;
}
/* @end */

/* @group screencasts */
#screencasts {
	padding-top: 0; 
}
#screencasts .in {
	background: url('../src/common/screencast/back.jpg') repeat-x left bottom;
	height: 125px;
	margin: 0 7px 0 7px;
	padding: 0 24px;
	overflow: hidden;
}
#screencasts a.screencast {
	float: left;
	display: block;
	text-decoration: none; 
	width: 278px;
	height: 102px;
	background-position: 2px 4px;
	background-repeat: no-repeat;
}
#video_1 { background-image: url('../src/common/screencast/s_1.jpg'); }
#video_2 { background-image: url('../src/common/screencast/s_2.jpg'); }
#video_3 { background-image: url('../src/common/screencast/s_3.jpg'); }

#screencasts a.screencast:hover div {
	background: url('../src/common/screencast/over.png') no-repeat;
	height: 102px; 
}
#screencasts a.screencast h2, #screencasts a.screencast p {
	padding-left: 153px;
	width: 111px; 
}
#screencasts a.screencast h2 {
	padding-top: 18px;
	font-size: 14px; 
}
#screencasts a.screencast p {
	font-size: 11px; 
	padding-top: 5px;
	line-height: 14px;
}
#video {
	margin: 20px 0 20px 28px;
}
/* @end */

/* @group support */
#support {
	padding: 0 48px 30px 48px;
	overflow: hidden;
}
#col_left {
	width: 350px;
	float: left;
}
#col_right {
	float: right;
	width: 350px;
}

/* @group documentation */
#documentation {
	
}
#documentation li {
	padding: 15px 0 5px 0;
}
#documentation li a {
	display: block;
	text-decoration: none;
	padding-left: 25px;
	background: url('../src/common/puce.gif') no-repeat 5px center;
}
#documentation li a:hover {
	background-position: 10px center;
}
#documentation li a:hover span {
	text-decoration: underline;
}
#documentation li a p {
	font-size: 11px;
}

.screencast_exists a {
	display: block;
	background: #545454; 
	font-size: 11px;
	padding: 8px;
	color: #fff;
	margin: 0 0 10px 0;
	text-decoration: none;
}

.doc_page {
	padding: 0 48px 40px 48px; 
}
.doc_page h1 {
	padding-bottom: 15px; 
}
.doc_page h2 {
	padding-top: 15px;
	padding-bottom: 5px; 
}
.doc_page h3 {
	padding-bottom: 5px; 
	padding-top: 15px;
}
.doc_page p strong {
	color: #fff; 
}
.doc_page .img_center {
	padding: 10px 0 0 0;
	text-align: center;
}
.doc_page hr {
	border: 0;
	height: 50px;
}
.doc_page code {
	margin: 10px 0 10px 0;
	display: block;
	white-space: pre;
	padding: 10px;
	background-color: #141414;
	overflow: auto;
}
.doc_page span {
	color: #3c5c85;
}


/* @end */

/* @group contact */
#contact {

}
#contact label {
	text-align: left;
	padding: 5px 0 2px 0; 
}
#contact .value {
	clear: left; 
}
#contact input {
	width: 336px; 
}
#contact textarea {
	 width: 340px;
	 max-width: 340px;
	 height: 100px;
	 margin-bottom: 10px;
}
#contact .submit {
	clear: both; 
	font-size: 12px;
	width: 102px;
	height: 29px;
	display: block;
	margin: 0 auto 0 auto;
}
#contact .submit span {
	display: none; 
}

#contact_loading_panel, #contact_loading_panel .back {
	width: 352px;
	height: 295px;	 	 
}

/* @end */

/* @group faq */
#faq {
	float: left;
	margin-left: 25px;
}
#faq ul {
	list-style-type: decimal;
	color: #fff;
	font-size: 11px;
	list-style-position: inside;
}
#faq ul li {
	border-bottom: 1px solid #fff;
	border-color: #141414;
	color: #5f5f5f; 
}
#faq ul li a {
	display: block;
	padding: 3px 0 3px 0;
	text-decoration: none;
	font-size: 12px;
	color: #5f5f5f; 
}
#faq ul li:hover, #faq ul li a:hover {
	color: #fff; 
}
#faq ul li, #faq ul li p {
	width: 426px;
}
#faq ul li p strong {
	color: #fff;
}


/* @end */

/* @end */

/* @group client */
#client {
	padding: 0 48px 30px 48px;
	overflow: hidden;
}
#client .col {
	float: left;
	width: 360px;
	padding-left: 50px;
}
#client .col.first {
	padding: 0;
	width: 390px;
}
#client p {
	padding: 5px 0 0 0;
}
#client #link_save {
	margin-left: 55px;
	width: 201px;
}
#client #link_download {
	width: 122px;
	margin-top: 10px;
}
#client #link_save, #client #link_download {
	display: block;
	height: 29px;
}
#client #link_save span, #client #link_download span {
	display: none;
}

/* @group domains */
#domains_form {
	 padding: 10px 0 0 0;
}
#domains_form .input {
	clear: left;
	padding-bottom: 4px;
}
/* @end */

/* @group login */

#client .form_row.last {
	clear: both;
	margin-bottom: 25px;
	padding-bottom: 15px; 
}
#client .submit {
	clear: both; 
	display: block;
	width: 102px;
	height: 29px; 
	margin: 0 auto 0 auto;
}
#client .submit span {
	display: none; 
}

#login_loading_panel, #login_loading_panel .back {
	width: 800px;
	height: 105px;	 	 
}
#login_loading_panel .loading p, #login_loading_panel .message p {
	margin-top: 50px; 
}
#login_loading_panel .loading {
	background-position: center 30px; 
}

/* @end */

/* @group instructions */
#client_instructions {
	padding-top: 35px;
	padding-bottom: 10px;
}
/* @end */


/* @end */

/* @group boxes */
.box, .box .top, .box .bottom {
	display: block;
}
.box {
	margin-top: 10px;
	margin-bottom: 0px;
}
.box .top {
	background-repeat: no-repeat;
}
.box .bottom {
	background-position: -730px bottom;
	background-repeat: no-repeat;
}
.box h2 {
	padding: 8px 8px 6px 8px;
}
#client .box p, .box p {
	padding: 6px 8px 8px 8px;
}
/* @end */

