/*------------------------------------------------------------
[Stylesheet - Application - express.css]

Project: 		ExtraFilm
Version: 		2.0
Primary use:	E-commerce

[Table of contents]

0.	General styles
1.	Error pages (404, 500, ...)
2.	Buttons pages (depreciated: don't add new styles here)
3.	Buttons dialogs (depreciated: don't add new styles here)
4.	Share album
5.	Subscribe
6.	New Loading Dialog
7.	Vertical align stuff
8.	Social sharing myprojects
-------------------------------------------------------------*/

/*------------------------------------------------------------

[0.	General Styles]

-------------------------------------------------------------*/

.storeimages, .locatePhotos, .singleupload, .fastImageUpload, /*.chooseStyle, .forgotPassword, .pocketChooseAlbum,.orderConfirmation,*/  .passwordConfirmation, /*.registration,*/ .unsubscribe, .bgcCode, .manageFriends {
	padding-left:216px; position:relative; margin-right:18px; overflow:hidden;min-height:350px}

.invitation {
	padding-left:216px; position:relative; margin-right:18px; overflow:visible; min-height:350px;}

#aspnetForm {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/*------------------------------------------------------------

[1.	Error pages (404, 500, ...)]

-------------------------------------------------------------*/
/* 2 - 404.html -- */
.content .pageNotFound {
	background:url(base/img/error_pages/404.jpg) 0 0 no-repeat; height:293px; width:376px; position:relative; float:left; margin-top:60px; margin-left:314px;  margin-bottom:150px;}
.content .pageNotFound h1 {
 	position:absolute; top:50px; width:323px; left:26px; top:92px; color:#160C49; text-align:center;}
.content .pageNotFound p {
	position:absolute; width:323px; left:26px; top:174px; text-align:justify; }
.content .pageNotFound .buttonArrow{
	position:absolute; bottom:20px; right:27px;}

/* 2 - 500.html -- */
.content .error500 {
	background:url(base/img/error_pages/wave.jpg) 0 20px no-repeat; padding:90px 0 0 200px; height:220px }
.content .error500 h1 {
 	width:400px}
.content .error500 p {
	width:400px; margin-bottom:15px}

/* 2 - session-expired.html -- */
.content .sessionExpired {
	background:url(base/img/error_pages/wave.jpg) 0 20px no-repeat; padding:90px 0 0 200px; height:220px }
.content .sessionExpired  h1 {
 	width:400px}
.content .sessionExpired p {
	width:400px; margin-bottom:15px}

/*------------------------------------------------------------

[2.	Buttons pages (depreciated: don't add new styles here)]

-------------------------------------------------------------*/
.ok .btnMiddle 						{	width:30px	}
.send .btnMiddle 					{	padding:0 40px	}
.continue .btnMiddle 				{	width:/*80px*/150px	}
.formStoreImages .continue .btnMiddle { width:180px}
.btnLogin .btnMiddle 				{	padding:0 33px	}
.checkOut .btnMiddle 				{	padding:0 25px	}
.join .btnMiddle 					{	padding:0 32px	}
.upload .btnMiddle 					{	padding:0 32px	}
.locateUpload .btnMiddle 			{	width:160px	}
.locateLogin .btnMiddle 			{	width:160px	}
.locateUse .btnMiddle 				{	width:160px	}
.nejTack .btnMiddle 				{	padding:0 32px	}
.jaTack .btnMiddle 					{	padding:0 34px	}
.clickToStart .btnMiddle			{	width:155px 	}
.adjustProject .btnMiddle 			{	width:100px;	}
.JoinUsSmall .btnMiddle 			{	width:135px;font-size:11px	}
.clickHereSmall .btnMiddle 			{	padding:0 10px	}
.applyCode .btnMiddle 				{	padding:0 3px	}
.createOffline .btnMiddle,
.createOnline .btnMiddle 			{	width:110px	}
.clickHere .btnMiddle 				{	width:104px		}
.learnMore .btnMiddle 				{	width:140px		}
.joinUs .btnMiddle 					{	width:107px		}
.btnProducts .btnMiddle 			{	padding:0 20px	}
.download .btnMiddle 				{	width:114px	}
.importContact .btnMiddle 			{	width:125px		}
.removeContact .btnMiddle 			{	width:125px		}
.addContact .btnMiddle 				{	width:125px		}
.addMoreFriends .btnMiddle 			{	padding:0 20px	}
.close .btnMiddle 					{	padding:0 50px	}
.orderPrints .btnMiddle 			{	padding:0 35px 0 30px	}
.orderHere .btnMiddle 				{	padding:0 35px 0 30px	}
.continueShopping .btnMiddle		{	width:220px	}
.confirm .btnMiddle					{	width:150px		}
.becomeMember .btnMiddle			{	width:140px		}
.toHomepage .btnMiddle				{	width:180px		}
.saveCopy .btnMiddle				{	width:130px		}
.shoppingCart .checkOut .btnMiddle	{	width:100px		}
.invitation .continue .btnMiddle 	{	width:120px 	}
.downloadPDF .btnMiddle 			{	width:250px 	}
/* Go */
.btnPurpleArrowsRightSmall .btnMiddle
									{	padding:0 5px 0 1px	}
.goMyOrders .btnMiddle				{ 	width:117px	}
.btnMyProjects .btnMiddle			{ 	width:78px	}
.btnMyAlbums .btnMiddle				{ 	width:160px	}
.btnAlbumsFromFriends .btnMiddle	{ 	width:160px	}
.uploadButton .btnMiddle 			{	width: 95px	}

.addToCart .btnMiddle 				{	padding:0 25px	}
.addAllPhotos .btnMiddle 			{	padding:0 10px	}

.btnFloating						{   position:absolute; left:180px; top:275px;z-index:3;}
li.lazy{background-image:url('img/ani_gif.gif');background-repeat:no-repeat;background-attachment:scroll;background-position:center; }
/*------------------------------------------------------------

[3.	Buttons dialogs (depreciated: don't add new styles here)]

-------------------------------------------------------------*/
#maindialog .edit .btnMiddle {width:150px}
#maindialog .order .btnMiddle {width:150px}
#maindialog .yes .btnMiddle {width:150px}
#maindialog .no .btnMiddle {width:150px}
#maindialog .cancel .btnMiddle {width:150px}
#maindialog .continue .btnMiddle {width:150px}
#maindialog .save .btnMiddle {width:150px}
#maindialog .insertText .btnMiddle { width:150px}
#maindialog .dialogOk .btnMiddle { width:150px}
#maindialog .delete .btnMiddle { width:150px}
#maindialog .keep .btnMiddle { width:150px}
#maindialog .addPages .btnMiddle {width:150px}
#maindialog .saveItFirst .btnMiddle {width:150px}
#maindialog .startAllOver .btnMiddle {width:150px}
#maindialog .btnSelect .btnMiddle {width:150px}
#maindialog .ok .btnMiddle {width:150px}
#maindialog .apply .btnMiddle {width:150px}

/*------------------------------------------------------------

[4.	Buttons dialogs (depreciated: don't add new styles here)]

-------------------------------------------------------------*/
/* 4 - home-invitationsharing-member.html home-invitationsharing-nomember.html -- */
.invitation .boxRcBig {
	overflow:hidden}
.invitation ul.listPhotos {
	margin:5px 15px 0 0;padding:0; zoom:1; display:block; width:400px; float:left; height:130px}
.invitation ul.listPhotosSmall li {
	background:url(base/img/share_album/bg-photo-container.png) 0 0 no-repeat;margin:0;padding:0; list-style:none;
	height:130px;width:130px;position:relative; float:left;	margin-right:0px; font-weight:bold; text-align:center;font-size:6.4em}
.invitation ul.listPhotosSmall li a, .invitation ul.listPhotosSmall li span {
	font-size:11px}
.invitation ul.listPhotosSmall li img {
	vertical-align:middle;margin-top:-1px}
.boxLoginInvitation {
	width:300px; float:right}
.invitation .continue {
	position:absolute; right:15px; bottom:15px}

/* 4 - home-invitationsharing-loggedin.html -- */
.invLoggedIn .boxRcBig {
	width:460px}
.invLoggedIn ul.listPhotos {
	float:none}
.invNoMember .boxFixed{
	width:766px; height:187px; background:url(base/img/share_album/invitation-box.jpg) no-repeat; margin-bottom:15px}
.invNoMember .boxFixed .boxRcContent {
	padding:20px 15px 20px 20px}
.invNoMember ul.listPhotos {
	margin-right:4px}
.invNoMember .joinEF {
	width: 320px; float:left}
.invNoMember p {
	margin-bottom:10px}

/*------------------------------------------------------------

[5.	Subscribe]

-------------------------------------------------------------*/
.unsubscribe .prospectsubscribe {
	border:none; margin:0}

/*------------------------------------------------------------

[6.	New Loading Dialog]

-------------------------------------------------------------*/
.loadingscroll
{
	width: 100%;
	height: 100px;
	text-align: center;
	background:#FFFFFF url(img/ani_gif.gif) no-repeat scroll 50% 85%;
	display: none;
	clear:both;
}

#layerback
{
	z-index: 100;
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	/*background: #c7c7c7;*/
	background-image:url(img/dialog-overlay.gif);
	background-repeat:repeat;
	opacity: 0;
}
#layertop
{
	z-index: 200;
	position: absolute;
	width: 250px;
	height: 100px;
	left: -1000px;
	text-align: center;
	padding: 15px;
	background:#FFFFFF url(img/loading3.gif) no-repeat scroll 50% 85%;
}
.longloadingdialog{
	border:#99BE0E 2px solid
}
.blockingShield {
	bottom:0;
	left:0;
	right:0;
	top:0;
	position: fixed;
	z-index: 1000;
		-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

/*------------------------------------------------------------

[7.	Vertical align stuff]

-------------------------------------------------------------*/
.valignblock {
	display: inline-block;
}

/*------------------------------------------------------------

[8.	Social sharing myprojects]

-------------------------------------------------------------*/
/* - myextrafilm-projects.html -- */
#dcsPopupShare{padding-bottom:20px;}
a.lightBlue{color:#00a0d2;}
a.lightPurple{color:#6A648A;}
#dcsPopupShare input.shareLink{width:540px; margin:5px 0px 0px 0px;}
#maindialog.PopupShare .button{float:none; margin:0px 0px 10px;}
#maindialog.PopupShare a.fbLink {color: #3A5997;}
#maindialog.PopupShare .fbLink {
	font-weight:bold;display:block; margin:5px 0 10px; padding:5px 0px 5px 30px; background:url(base/img/icons/icon-fb-project.png) left center no-repeat; color: #3A5997;}
#maindialog.PopupShare .dialogMiddle{padding-bottom:10px;}

.myProjects {
	position:relative; margin-left:20px; float:left; display:inline}
.myProjects .noProducts {width:960px}
.myProjects .noProducts h1{margin-bottom:10px; margin-left:0px; font-size:19px}
.myProjects h1{margin-left:15px; margin-bottom:10px; font-size:19px}
.myProjects .wrapper {
	margin-bottom:20px; float:left; clear:both}
/*.myProjects .boxMyPhotoAlbums .boxRcContent, .myProjects .boxMyCalendars .boxRcContent  {
	padding:0; overflow:hidden; padding-bottom:30px}*/
.myProjects p {
	padding-left:100px; padding-top:25px; margin:7px auto 0 11px; font-weight:bold}
.myProjects .clickToStart {
	position:absolute;right:33px;bottom:17px}
.myProjects .boxRcWhite{float:left; width:961px; margin-right:0px; overflow:hidden}
.myProjects .wrapper .boxRcWhite .boxRcContent{padding:0px;}
/*
.boxMyPhotobooks p {
	background:url(base/img/myextrafilm/icon-noalbums.png) left top no-repeat}
.boxMyCalendars p {
	background:url(base/img/myextrafilm/icon-nocalendars.png) left top no-repeat}
.boxMyAgendas p {
	background:url(base/img/myextrafilm/icon-noagendas.png) left top no-repeat}
.boxMyFun_Ideas p {
	background:url(base/img/myextrafilm/icon-nofunideas.png) left top no-repeat}
.boxMyWall_Decoration p {
	background:url(base/img/myextrafilm/icon-nowalldeco.png) left top no-repeat}
.boxMyCards p {
	background:url(base/img/myextrafilm/icon-nocards.png) left top no-repeat}
.boxMyExtraBox_voucher p {
	background:url(base/img/myextrafilm/icon-noExtraBox_voucher.png) left top no-repeat}*/
.myProjects .boxProject {position:relative; padding: 15px; display: table;}
.myProjects .boxProject .boxProject {
	border-bottom: 1px solid #e6e6e6; padding: 15px 0;}
.myProjects .boxProject .boxProject:last-child {border: none;}
.bpBottom {
	margin-top:35px; margin-bottom:30px}
.boxRcGreyWhiteWithTab h2 {
	margin-left:20px}
.noneCreated .contentBox {
	padding:0!important}
.myProjects .boxRcGreyWhiteWithTab .boxRcContent h2 {
	padding:0; font-size:14px}
.noneCreated h2, .myProjects .fixedTop h2 {
	padding:10px 0 0 20px; font-size:14px;}
.noneCreated p {
	margin-left:31px; height:77px}
.myProjects hr {
	position:relative;  width:100%; margin: 12px 0 20px 0; background:#ececec; clear: both;}
.myProjects .left {
	border-right:#dad8e2 solid 1px;}
.boxProject .img{
	position:relative; width:65px; float: left; height:65px; border:#ecebf0 solid 1px; padding:3px; line-height:63px;text-align:center; margin: 0 15px 0 0;}
.boxProject .img a{
	height: 65px;
  width: 65px;
	line-height: 65px;
  vertical-align: middle;
  display: table-cell;
  float: none;
  margin: 0 auto;
	text-align: center;}
.boxProject .img img {
	line-height:65px; vertical-align:middle; display: table-cell;	text-align: center; margin: 0 auto;}
.boxProject .col03 dl {
	margin-left:0px}
.boxProject dl.date {
	margin-left:0px}
.boxProject .img img.unavailable {position:absolute; top:3px; left:3px}
.boxProject.unavailable h3, .boxProject.unavailable dt, .boxProject.unavailable dd {color:#B5B2C4}
.boxProject .column{margin: 0px; padding: 0 15px 0 0; display: table-cell; vertical-align: middle;}
.boxProject .col01{width: 350px; display: table; vertical-align: middle;}
.boxProject .col02{width: 175px;}
.boxProject .col03{width: 140px;}
.boxProject .col04{width: 180px;}
.boxProject .col05{padding: 0; width:30px;}
.project-info, .boxProject .col01 dl {display: inline; display: table-cell; vertical-align: middle; width: 230px; max-width: 220px; padding: 0 25px 0 0; word-wrap: break-word;}
.boxProject h3 {
	font-weight:bold; margin:0 0 5px 0; color:#160C49; font-size: 12px;}
.boxProject dl {margin: 0;}
.boxProject dl .unavailable{color:#F00; font-weight:bold}
.boxProject dt {
	font-weight:normal; margin: 0;}
.boxProject .delLink, .boxProject .delLinkShared {
	font-weight:bold;display:block; margin:0px; padding:0; background:url(base/img/icons/icon-trash-project.png) left center no-repeat; font-size:10px; text-align:right; width:30px; height:30px;}
.boxProject a.fbLink {color: #3A5997; float:left}
.boxProject .fbLink {
	font-weight:bold;display:block; margin:5px 0 10px; padding:5px 0px 5px 30px; background:url(base/img/icons/icon-fb-project.png) left center no-repeat; color: #3A5997;}
.boxProject .Project {
	margin-left:140px; margin-top:10px;margin-bottom:10px; display:block}
.adjustProject {
	display:block; float:left}

.shareBox{	width:509px; height:175px; border: 1px solid #D7D5DC; display: inline; float: left; position: relative; margin-top:40px;}
/*.shareBox .imgBox {display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 10;}*/
.shareBox .button{right:17px; bottom:13px; position:absolute; line-height:2.4em;}
.shareBox a.button:hover .btnMiddle{text-decoration:underline; }

.shareBox .seoText{
	color: #150C48;
    font-family: Ariel,sans-serif;
    font-size: 16px;
    height: 72px;
    left: 263px;
    padding-top: 30px;
    position: absolute;
    text-align: center;
    top: 20px;
    width: 235px;
}

.newsTextShare {
	color: #150C48;
    font-family: Ariel,sans-serif;
    font-size: 12px;
	text-align:center;
	position:absolute;
	top:84px;
	padding:0 10px 0 10px;
	z-index: 11;
}
