/* --- CSS for LinksPage and All LinkSourceType Pages --- */
/*--- in the oder of how things appear on the page ---*/

/*--- Welcome Page - This should be in functionalpages.css now ---*/
  #logo { width: 100%; }
  .odrivecolor { color:#fff; background-color: #51b7e0; border:none;  }
  .odrivecolor:hover { color:#fff; background-color: #0FA0CE; border:none; } 

/*--- Verified Email Page CSS ---*/
  .verified-page-title { font-size:3rem; font-weight:300; line-height:3rem; }
  .verify-forum-email-form { padding-top:0; }
  .verify-forum-email-form .input-row { width: 400px; color: #333; background: #fff; font-size:2rem; display:block; margin-bottom:20px; font-weight:300;}
  .verify-forum-email-form .input-checkbox-row {color:#333; background: #fff; font-size:2rem; display:flex; margin-bottom:20px; font-weight:300;}
  .verify-forum-email-form .input-row > input {  border:solid 1px #ccc; width: 100%; font-weight:300; }
  .verify-forum-email-form .input-row input:focus { outline: none; border:solid 1px #45a0c4;}
  .verify-forum-email-form .input-row .no-input-text-field { text-align: left; padding-left: 9px; width: 100%; font-weight:300; }
  .verify-forum-email-form .input-title{ font-size:1.2rem; color:#999; padding-left:10px; text-transform:uppercase; text-align:left; padding-bottom:1px; margin-bottom:5px; font-weight:700;}
  .verify-forum-email-form .error { padding-bottom:10px; padding-left:10px; color:red; }
  .verify-forum-email-form .form-back { padding-top:20px; padding-left:30px; }

/*---- For new link pages -----*/

#linkbottomline { clear:both; display:block; width:100%; border-top:solid 1px #ccc; }

.links-valign { vertical-align: 30%; }

.link-post { text-align:center; line-height:2.2rem; }

.landing-video { width:560px; height:315px; }
.main-video-holder { margin:0 auto; width:100%; text-align:center; }

/*--- For links with testimonials ---*/
#testimonials .row { margin:0 3%; }
#testimonials .quote-holder { background-color:#fff; border:solid 1px #e1e8ed; border-radius:5px; display:inline-block; padding:20px; text-align:center; margin:10px 1px; }
#testimonials .quote { font-size: 16px; line-height:20px; position:relative; text-align:left; color:#333; }
#testimonials .quote-from { padding-top:0;  text-align:left; }
#testimonials .quote-logo { width:50%; }
#testimonials .column { margin:1% 1%; width: 30.6666666667%; }


/*--- Closing top X for Webservice ---*/
  #closer { 
	width:100%;
	height:20px; 
	padding-top:20px;
  }
  #closer img {width:15px; height:17px; float:right; }


/*--- LinksPage CSS here ---*/
  #linkmenu-container{
	width: 100%;
	border-bottom:solid 1px #ccc;
  }
  #linkmenu { padding-left:10px; padding-bottom:20px; }
  #linkmenu .tabs { font-size:11px; text-transform:uppercase; cursor:pointer; display:inline-block; } /* --- for selectable stuff --- */
  #linkmenu .tabs:hover { text-decoration:underline; }
  #linkmenu .menu-spacer { padding-right:5%;}
  #linkmenu .tab-poof1 { display:none; }
  #linkmenu .tab-poof2 { display:none; }
  .targetDiv { display:none; }
  


/* --- Beginning of LINKS PAGE --- */
  .links-row{ padding:10px 10px 10px 10px;}
  .links-row:hover {background-color:#efefef; text-decoration:none;}
  .links-title { font-size:24px; font-weight:300; padding-left:15px; color:#333; text-decoration:none;}
  .links-title:hover { text-decoration:none;}
  .links-description {font-size:11px; color:#999; padding:5px 0 0 16px; text-decoration:none;}
  .links-description:hover { text-decoration:none;}
  .links-rows { padding-left:20px;}
  .targetDiv a {text-decoration:none;} /* -- kills underline on IE --*/
  .targetDiv a:hover {text-decoration:none;}

/* --- Beginning of LINKS MINE --- */
  .sourcelink-row{ padding-top:0; }
  .sourcelink-row:hover {text-decoration:none;}
  .sourcelink-row .list-container{ border: none;}
  .sourcelink-title { font-size:24px; font-weight:300; padding-left:15px; color:#333; text-decoration:none;}
  .sourcelink-title:hover { text-decoration:none;}
  .sourcelink-description {font-size:11px; color:#999; padding:5px 0 0 16px; text-decoration:none;}
  .sourcelink-description:hover { text-decoration:none;}
  .sourcelink-rows { padding-left:20px;}
  .sourcelinks-topborder { border-top:solid 1px #ccc; padding-top: 10px;}
  .sourcelinks-bottomborder {}

/*--- Links page icons ---*/
  .links-icon-corners { color:#333; border-radius: 10px; border:solid 1px #e1e8ed; background: #fff; padding: 5px; width: 100%; }
  .links-icon-corners:hover { border:solid 1px #ccd6dd; }
  .links-icon-top{ width:50px; height:50px; display:inline; }



/*--- Begin of LinkSource page css ---*/
  #linkheader {
	width:auto;
	padding: 20px 10px 40px 10px;
	float:left;
  }
	#linkheader .thumb { display:inline-block; margin-right:20px; font-size:8px; }
	#linkheader .thumb img { height:50px; width:50px; }
	#linkheader .title { display:inline-block; vertical-align:65%; }
	#linkheader .title .main { font-size:2.4rem; font-weight:300; }
	#linkheader .title .sub { font-weight:400; font-size:1.1rem; color:#999; padding-top:1px; }

  #linkbutton{ 
	padding: 25px 0 20px 0;
  }

  #linklist{
	padding: 0 0 150px;
	clear:both;
  }

/* Thomas' CSS for linklist React Module */
  .list-container { border-top: solid 1px #ccc; padding-top: 15px; }
  .list-container-mine { }
  .link-listview { color: #333333; }
  .link-listview table { table-layout: fixed; width: 100%; }
  .link-listview tr { cursor: pointer; }
  .link-listview tr:hover { background-color: #f6f6f6; }
  .link-listview tr.rowheading { background-color: #ffffff; cursor: default; }
  .link-listview .heading { /*-- Unused --*/ }
  .link-listview .heading.name { font-size:1.1rem; color:#999; height: 30px; text-align: left; width: 35px; white-space: nowrap; padding-top:15px; }
  .link-listview .heading.name-text { font-size:1.1rem; color:#999; height: 30px; text-align: left; width: auto; padding-top:15px; }
  .link-listview .heading.spacename-text { font-size:1.1rem; color:#999; height: 30px; text-align: left; width: 150px; padding-top:15px; }
  .link-listview .heading.orgname-text { font-size:1.1rem; color:#999; height: 30px; text-align: left; width: auto; padding-top:15px; }
  .link-listview .heading.orgmembername-text { font-size:1.1rem; color:#999; height: 30px; text-align: left; width: auto; padding-top:15px; }
  .link-listview .heading.orgmemberrole-text { font-size:1.1rem; color:#999; width: 200px; text-align: left; padding-top:15px; }
  .link-listview .heading.orgpurchaseoption-text { font-size:1.1rem; color:#999; width: 200px; text-align: left; padding-top:15px; }
  .link-listview .heading.orgstoragename-text { font-size:1.1rem; color:#999; height: 30px; text-align: left; width: 200px; padding-top:15px; }
  .link-listview .heading.orgstoragepath-text { font-size:1.1rem; color:#999; height: 30px; text-align: left; width: auto; padding-top:15px; }
  .link-listview .heading.server-text { font-size:1.1rem; color:#999; width: 300px; text-align: left; padding-top:15px; }
  .link-listview .heading.username-text { font-size:1.1rem; color:#999; width: 200px; text-align: left; padding-top:15px; }
  .link-listview .heading.path-text { font-size:1.1rem; color:#999; width: 200px; text-align: left; padding-top:15px; }
  .link-listview .heading.backup-path-text { font-size:1.1rem; color:#999; width: 300px; text-align: left; padding-top:15px; }
  .link-listview .heading.longpath-text { font-size:1.1rem; color:#999; width: 400px; text-align: left; padding-top:15px; }
  .link-listview .heading.members-text { font-size:1.1rem; color:#999; width: auto; text-align: left; padding-top:15px; }
  .link-listview .heading.description-text { font-size:1.1rem; color:#999; width: 150px; text-align: left; padding-top:15px; }
  .link-listview .heading.number-text { font-size:1.1rem; color:#999; width: 80px; text-align: left; padding-top:15px; }
  .link-listview .heading.accountname-text { font-size:1.1rem; color:#999; width: 300px; text-align: left; padding-top:15px; }
  .link-listview .heading.selection-spacing { }
  .link-listview .heading.subscription-type-text { font-size:1.1rem; color:#999; width: 100px; text-align: left; padding-top:15px; }
  .link-listview .heading.subscription-rate-text { font-size:1.1rem; color:#999; width: 100px; text-align: left; padding-top:15px; }
  .link-listview .heading.subscription-started-date { font-size:1.1rem; color:#999; width: 150px; text-align: left; padding-top:15px; }
  .link-listview .heading.subscription-end-date { font-size:1.1rem; color:#999; width: 400px; text-align: left; padding-top:15px; }
  .link-listview .heading.billing-date { font-size:1.1rem; color:#999; height:40px; width: 150px; text-align: left; }
  .link-listview .heading.billing-invoice-nbr { font-size:1.1rem; color:#999; width: 150px; text-align: left; }
  .link-listview .heading.billing-description { font-size:1.1rem; color:#999; width: auto; text-align: left; }
  .link-listview .heading.billing-amount { font-size:1.1rem; color:#999; width: 150px; text-align: left; }
  .link-listview .heading.date-text { font-size:1.1rem; color:#999; height: 30px; text-align: center; width: 150px; padding-top:15px;  }
  .link-listview .name-text { height: 45px; padding-left: 10px; padding-right: 5px; width: auto; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .name-text:active { color: #aaaaaa; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .spacename-text { padding-left: 10px; padding-right: 5px; width: 150px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .orgname-text { padding-left:10px; padding-right: 5px; width: auto; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .orgmembername-text { padding-left:10px; padding-right: 5px; width: auto; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .orgmemberrole-text { width: 200px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .orgpurchaseoption-text { width: 200px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .orgstoragename-text { padding-left:10px; padding-right: 5px; width: 200px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .orgstoragepath-text { padding-left:10px; padding-right: 5px; width: auto; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .server-text { width: 300px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .username-text { width: 200px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .accountname-text { width: 300px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .path-text { width: 200px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .backup-path-text { width: 300px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .longpath-text { width: 400px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .members-text { width: auto; text-align: left; overflow:auto; white-space: normal; }
  .link-listview .description-text { width: 150px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .number-text { width: 80px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .thumbnail { width: 35px; height: 35px; margin: 5px 0 5px 0; padding: 5px 0 5px 0; }
  .link-listview .thumbnail .imgdiv { position: relative; width: 35px; height: 35px; overflow: hidden; }
  .link-listview .thumbnail .imgdiv .imgstylefallback { position: absolute; width: 35px; height: 35px; top: 0; left: 0; }
  .link-listview .selectable-icon { width: 40px; height: 35px; }
  .link-listview .selectable-icon .imgdiv { position: relative; width:40px; height: 35px; overflow: hidden; }
  .link-listview .selection-spacing { width: 0; }
  .link-listview .inline-edit-input { border: 1px solid #51b7e0; width: 90%; height: 100%; padding-left: 4px; }
  .link-listview .image-wrapper { position: relative; text-align: center; height: 45px; }
  .link-listview .image-wrapper:before { height: 100%; content: " "; vertical-align: middle; display: inline-block; }
  .link-listview .subscription-type-text { width: 100px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .subscription-rate-text { width: 100px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .subscription-started-date { width: 150px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .subscription-end-date { width: 400px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .subscription-selectable-icon { width: 40px; height: 35px; }
  .link-listview .subscription-selectable-icon .imgdiv { position: relative; width:40px; height: 35px; overflow: hidden; }
  .link-listview .billing-date { height:40px; width: 150px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 20px;}
  .link-listview .billing-invoice-nbr { height: 45px; width: 150px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .billing-uninvoice-nbr { font-style: italic; width: 150px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .billing-description { width: auto; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .billing-amount { width: 150px; text-align: left; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  .link-listview .date-text { text-align: center; width: 150px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }

/*--- Begin of ModuleForm Provider Logos css ---*/
  .moduleformheader {
	width:auto;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:20px;
  }
  .moduleformheader .thumb { display:inline-block; font-size:8px; }
  .moduleformheader .thumb img { height:50px; width:50px; }

/*---Dropdown Arrow menu for Link list ---*/
  .dropdown-menu { position: absolute; z-index: 100; margin-top: -1px; /* For the drop down arrow */ }
  .dropdown-menu.left { left: 0; }
  .dropdown-menu.right { right: 0; }
  .dropdown-menu.arrow { top: 100%; }
  .dropdown-menu.arrow .dropdown-menu-container { top: 16px; }
  .dropdown-menu .menu-body { text-transform: uppercase; }
  .dropdown-menu .menu-body ul { padding: 0; margin: 0 0; list-style-type: none; }
  .dropdown-menu .dropdown-menu-container { position: relative; border: 1px solid #51b7e0; background: white; min-width: 120px; }
  .subscription-selectable-icon .dropdown-menu .dropdown-menu-container { position: relative; border: 1px solid #51b7e0; background: white; min-width: 220px; /*min-width: 120px;*/ }
  .dropdown-menu.arrow.left:before,
  .dropdown-menu.arrow.left:after { left: 3%; }
  .dropdown-menu.arrow.right:before,
  .dropdown-menu.arrow.right:after { right: 3%; }
  .dropdown-menu.arrow:before,
  .dropdown-menu.arrow:after { position: absolute; width: 0; height: 0; border: 8px solid transparent; display: block; content: " "; }
  .dropdown-menu.arrow:before { top: 0; border-bottom-color: #51b7e0; }
  .dropdown-menu.arrow:after { top: 2px; border-bottom-color: #ffffff; }
  .dropdown-menu .menu-item { color: #51b7e0; font-size: 14px; padding: 20px 20px; }
  .dropdown-menu .menu-item:hover { color: #ffffff; background-color: #51b7e0; }

/*--- LinkSourceType Page Content CSS ---*/
  #gallery{
	width:100%;
	padding-bottom:40px;
  }
  #gallery .screenshot { font-size:8px; box-sizing: border-box; position:relative; }
  #gallery .three { width:33% }
  #gallery .four { width:24.5% }

  #description{
	padding-bottom:40px;
  }

  #highlights{
	padding-bottom:40px;
  }
  .odriveonly { font-weight:400; font-size:1.1rem; text-transform:uppercase; color:#ff3399; }

  #relatedinformation{
	padding-bottom:40px;
  }
  .blogtitle { font-style: italic; } 

  #faqs{
	padding-bottom:20px;
  }
  .faqlink { color:#51b7e0; }
  
  #usageguide{
	padding-bottom:20px;
  }
  
  /*---  Links Mine Bottom add link options ---*/
 #linksMineOptions { margin-left:15px;}
 #linksMineOptions .addlink-plus { font-size:4.2rem; font-weight:300; line-height:3.4rem; display:inline; }
 #linksMineOptions .addlink-icon-container { display:inline; height:25px; width:25px; }
 #linksMineOptions .addlink-text-container { display:inline; height:25px; width:auto; vertical-align:60%; padding-left:13px; }
 #linksMineOptions .addlink-plus:hover { color:#51b7e0;  text-decoration:none; }
 #linksMineOptions .addlink-text { font-size:1.5rem; display:inline; }

  /*---  Links Mine Bottom add link options ---*/
 .spacesMineOptions { margin-left:5px; }
 .spacesMineOptions .addlink-plus { font-size:4.2rem; font-weight:300; line-height:3.4rem; display:inline; }
 .spacesMineOptions .addlink-icon-container { display:inline; height:25px; width:25px; }
 .spacesMineOptions .addlink-text-container { display:inline; height:25px; width:auto; vertical-align:60%; padding-left:15px; }
 .spacesMineOptions .addlink-plus:hover { color:#51b7e0;  text-decoration:none; }
 .spacesMineOptions .addlink-text { font-size:1.5rem; display:inline; }

/* --- Form popover management --- */
  #editCover{ position:fixed; top:0; left:0; background:rgba(255,255,255,1); z-index:5; width:100%; height:100%; display:none; overflow-y:auto; }
  #editScreen:target, #editScreen:target + #editCover{ display:block; opacity:2; }
  #purchaseScreen:target, #purchaseScreen:target + #editCover{ display:block; opacity:2; }
  #purchaseUnitsScreen:target, #purchaseUnitsScreen:target + #editCover{ display:block; opacity:2; }
  #refundScreen:target, #refundScreen:target + #editCover{ display:block; opacity:2; }
  #cancelAutoRenewScreen:target, #cancelAutoRenewScreen:target + #editCover{ display:block; opacity:2; }
  #reactivateScreen:target, #reactivateScreen:target + #editCover{ display:block; opacity:2; }
  #renewScreen:target, #renewScreen:target + #editCover{ display:block; opacity:2; }
  #thirtydaytrialScreen:target, #thirtydaytrialScreen:target + #editCover{ display:block; opacity:2; }
  #createEncryptionScreen:target, #createEncryptionScreen:target + #editCover{ display:block; opacity:2; }
  #trialScreen:target, #trialScreen:target + #editCover{ display:block; opacity:2; }
  #pickLinkScreen:target, #pickLinkScreen:target + #editCover{ display:block; opacity:2; }

/* --- Form Module CSS - differs from Dialog because dialog is for confirmation and unlink --- */
  #linkform{
	width:100%;
	margin:0 auto;
	padding-top:40px;
  }
  #linkform .dialog-layout{ width:360px; margin:0 auto; background: #fff; color:#333; border-radius: 10px; text-align:center;} /* -- No border on mobile + full background --*/
  #linkform .backup-dialog-layout{ width:500px; margin:0 auto; background: #fff; color:#333; border-radius: 10px; text-align:center;} /* -- No border on mobile + full background --*/
  #linkform .signin-email-dialog-layout{ width:320px; margin:0 auto; background: #fff; color:red; border-radius: 10px; text-align:center;} /* -- No border on mobile + full background --*/
  #linkform .share-link-dialog-layout{ width:600px; margin:0 auto; background: #fff; color:#333; border-radius: 10px; text-align:center;} /* -- No border on mobile + full background --*/
  #linkform .verify-email-dialog-layout {padding:40px; width:360px; margin:0 auto; background: #fff; color:#333; border-radius: 10px; text-align:center; }
  #linkform .verify-email-dialog-layout .title { color:#333; font-size:2.4rem; font-weight:300; text-align:center; margin-top:-20px; padding-bottom:15px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  #linkform .verify-email-dialog-layout .sub-title {color:#333; font-size:1.4rem; font-weight:400; text-align:center; padding-bottom:20px; width:100%;}
  #linkform .title {color:#333; font-size:2.4rem; font-weight:300; text-align:center; padding-bottom:40px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
  #linkform .share-link-dialog-layout .sub-title {color:#333; font-size:1.4rem; font-weight:300; text-align:center; padding-bottom:10px; width:100%; margin-top:-10px;}
  #linkform .sub-title {color:#333; font-size:1.4rem; font-weight:300; text-align:justify; padding-bottom:10px; width:100%; margin-top:-10px;}
  #linkform .context{ font-size:11px; color:#aaa; margin:-8px; padding-bottom:20px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap;}
  #linkform .error{ font-size:1.4rem; color:red; padding:0 10px 20px 10px; white-space: pre-line;}
  #linkform .input-title{ font-size:1.1rem; color:#999; padding-left:10px; text-transform:uppercase; text-align:left; padding-bottom:1px;} 
  #linkform .textarea-title{ font-size:1.1rem; color:#999; padding-left:10px; text-transform:uppercase; text-align:left; padding-bottom:1px;}
  #linkform .sharelink-field-title {color:#999; font-size:1.2rem; font-weight:300; text-align:left; padding-bottom:5px; padding-left:10px; width:100%; }
  #linkform .sharelink-text-format {color:#333; font-size:1.7rem; font-weight:300; text-align:left; padding-bottom:10px; padding-left:10px; width:100%; }
  #linkform .input-row { color:#333; background: #fff; font-size:2rem; display:block; margin-bottom:20px; font-weight:300;}
  #linkform .input-checkbox-row {color:#333; background: #fff; font-size:2rem; display:flex; margin-bottom:20px; font-weight:300;}
  #linkform .input-row > input { border:solid 1px #ccc; width: 100%; font-weight:300; }
  #linkform .input-row input:focus { outline: none; border:solid 1px #45a0c4;}
  #linkform .input-row .no-input-text-field { text-align: left; padding-left: 9px; width: 100%; font-weight:300; }
  #linkform .textarea-row { color:#333; background: #fff; font-size:2rem; display:block; margin-bottom:20px; font-weight:300;}
  #linkform .textarea-row > textarea { border:solid 1px #ccc; width: 100%; font-weight:300; height:250px; }
  #linkform .textarea-row textarea:focus { outline: none; border:solid 1px #45a0c4;}
  #linkform .formbutton { text-align:center; margin-top:10px; margin-bottom:0; }
  #linkform .formbutton .disabled { opacity: 0.6; }
  #linkform .formbutton .submitting { opacity: 0.6; }
  #linkform .select {width: 100%; color:#333; background: #fff;display:block; margin-bottom:20px; font-weight:300; position: relative}
  #linkform .select .label {font-size:1.1rem; color:#999; padding-left:10px; text-transform:uppercase; text-align:left; padding-bottom:1px; display:block}
  #linkform .select .current-value {
      color: #51b7e0;
      cursor: pointer;
      border: 1px solid #51b7e0;
      background-image: url("/images/browser-icons/icon-menuarrow-blue-20rpad.png");
      background-size: auto;
      background-position: right;
      background-repeat: no-repeat;
      text-align: left;
      font-weight: 300;
      padding: 10px 10px 10px 10px;
  }
  #linkform .select .dropdown-menu.right {width:100%;}
  #linkform .select .dropdown-menu .menu-body {text-align: left;}
  #linkform .cancel {text-align:center; padding-top:20px; margin-bottom:0;}
  ::-webkit-input-placeholder { color: #ccc; font-weight:300; font-size:1.8rem;}
  :-moz-placeholder { color: #ccc; font-weight:300; font-size:1.8rem;}
  ::-moz-placeholder { color: #ccc; font-weight:300; font-size:1.8rem;}
  :-ms-input-placeholder { color: #ccc; font-weight:300; font-size:1.8rem;}

  /*--- Cancellation modal code ---*/
  .dialog-layout-cancelation { padding:40px; }
  .dialog-layout-cancelation { width:360px; margin:0 auto; background: #fff; color:#333; border-radius: 10px; text-align:center;} /* -- No border on mobile + full background --*/
  .dialog-layout-cancelationconfirm { padding:40px; }
  .dialog-layout-cancelationconfirm { width:360px; margin:0 auto; background: #fff; color:#333; border-radius: 10px; text-align:center;} /* -- No border on mobile + full background --*/
  .dialog-layout-cancelationconfirm .confirm-cancel-title {color:#333; font-size:3.0rem; font-weight:300; text-align:center; margin-top:0; padding-bottom:15px;}
  .dialog-layout-cancelationconfirm .confirm-cancel-subtitle {color:#333; font-size:1.4rem; font-weight:400; text-align:center; padding-bottom:25px; width:100%;}

/*---- Dialog Module version of overlay - see #EditCover - they should match --- */
  .module-popover { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 5; }
  .module-popover .module-popover-inner { height: 100%; width: 100%; overflow-y: auto; }
  .module-popover.vertically-center .module-popover-inner { overflow-y: hidden; text-align: center; }

  .module-multi-popover { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 10; }
  .module-multi-popover .module-popover-inner { height: 100%; width: 100%; overflow-y: auto; }
  .module-multi-popover.vertically-center .module-popover-inner { overflow-y: hidden; text-align: center; }

  .confirm-buttons{ /* unused */ }
  .confirmation { opacity: 1.0; }
  .confirmation .submitting { opacity: 0.6; cursor: default; }
  .form-cancel { padding-top:20px; }

  .confirm-unlink-popover { padding-top:40px; }
  .confirm-unlink-popover .dialog-container { display: inline-block; width: 360px; background-color: #ffffff; color: #333333; margin: 0 auto; border-radius: 10px; }
  /* similar to dialog-layout ^^ */
  .confirm-unlink-popover .focustitle { font-size: 1.8rem; font-weight:300; padding-bottom:20px; }
  /* similar to #form .title ^^ */
  .confirm-unlink-popover .title { /*unused*/ }
  .confirm-unlink-popover .subtitle { padding-bottom:20px; }

  .display-empty-list-placeholder { text-align: center; font-size: 1.8rem; font-weight:300; padding-top: 20px; padding-bottom:20px; }

/* --- FORM BOX HEIGHTS --- */
.ftp {height: 470px; }

 /*  Accordion CSS Styling */
 #accordionLinks { 
   width:100%;
   border:none;
   font-size: 1.4rem;
   display:none;
 } 
 .accordionheight {}
 .ui-widget { font-family:inherit; }
 .ui-widget-content { background:none; background-color:none; border:none;  padding: 0;  margin: 0; }
 .ui-accordion .ui-accordion-header .ui-accordion-header-icon { display:none; }
 .ui-accordion .ui-accordion-icons { padding:0; margin:0; }
 .ui-accordion .ui-accordion-header { border: none; display: block; cursor: pointer; position: relative; margin:0; padding-bottom:5px; }
 #accordionLinks .ui-accordion { padding:10px 0 20px; }
 #accordionLinks .ui-accordion-content { padding:10px 0 20px; }
 .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background-color: none; background:none; color:#51b7e0; }
 .ui-state-focus { outline: none; }
 
 
/*---- Browser from the Web App ----*/
.space-membership-picker-container {
  color: #333333;
  text-align: left;
  padding: 5px 0 15px 0;
}

.web-picker-container {
  border: 1px solid #ccc;
  border-radius: 10px;
  color: #333333;
  text-align: left;
  padding: 5px 10px 15px 10px;
}

.web-picker-layout {
}
.web-picker-layout .browser-scroll {
}
.web-picker-layout .browser-scroll .destination-path-style {
  color: #999;
}
.web-picker-layout .browser-scroll .destination-path-style-filled {
  color: #555;
}

.web-browse-layout {
  border: 1px solid #ccc;
  border-radius: 10px;
  color: #333333;
  text-align: left;
  padding: 5px 10px 15px 10px;
}
.web-browse-layout .browser-scroll {
}

.browser-listview {
}
.browser-listview .listcontainer {
  height: 250px;
  overflow-y: auto;
}
.browser-listview table {
  table-layout: fixed;
  width: 100%;
}
.browser-listview tr {
  cursor: pointer;
}
.browser-listview tr:hover {
  background-color: #f6f6f6;
}
.browser-listview tr.rowheading {
  background-color: #ffffff;
  cursor: default;
}
.browser-listview .heading {
  color: #bbb;
  padding-top: 5px;
}
.browser-listview .heading.name {
  height: 0;
  text-align: left;
  width: 35px;
  font-size:0;
}
.browser-listview .heading.type-text {
  width: 150px;
  text-align: left;
}
.browser-listview .heading.visit-text {
  width: 50px;
  text-align: left;
}
.browser-listview .heading.account-name-text {
  width: 250px;
  text-align: left;
}
.browser-listview .heading.date-text {
  width: 150px;
  text-align: center;
}
.browser-listview .heading.size-text {
  width: 150px;
  text-align: center;
}
.browser-listview .heading.selection-spacing {
  width: 5px;
}
.browser-listview .account-name-text {
  width: 250px;
  text-align: left;
}
.browser-listview .type-text {
  width: 150px;
  text-align: left;
}
.browser-listview .date-text {
  width: 150px;
  text-align: center;
}
.browser-listview .size-text {
  width: 150px;
  text-align: center;
}
.browser-listview .name-text {
  padding-left: 10px;
  padding-right: 5px;
  width: auto;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.browser-listview .name-text:active {
  color: #aaaaaa;
}
.browser-listview .selectable-icon {
  width: 40px;
  height: 35px;
}
.browser-listview .selectable-icon .imgdiv {
  position: relative;
  width: 40px;
  height: 35px;
  overflow: hidden;
}
.browser-listview .thumbnail {
  width: 35px;
  height: 35px;
  margin: 5px 0 5px 0;
  padding: 5px 0 5px 0;
}
.browser-listview .thumbnail .imgdiv {
  position: relative;
  width: 35px;
  height: 35px;
  overflow: hidden;
}
.browser-listview .selection-spacing {
  width: 5px;
}
.browser-listview .image-wrapper {
  position: relative;
  text-align: center;
  height: 45px;
}
.browser-listview .image-wrapper:before {
  height: 100%;
  content: " ";
  vertical-align: middle;
  display: inline-block;
}
.browser-listview .inline-edit-input {
  border: 1px solid #51b7e0;
  width: 90%;
  height: 100%;
  padding-left: 4px;
}

.member-listview {
}
.member-listview .listcontainer {
  height: 250px;
  overflow-y: auto;
}
.member-listview table {
  table-layout: fixed;
  width: 100%;
}
.member-listview tr {
  cursor: pointer;
}
.member-listview tr:hover {
  background-color: #f6f6f6;
}
.member-listview tr.rowheading {
  background-color: #ffffff;
  cursor: default;
}
.member-listview .heading {
  color: #bbb;
  padding-top: 5px;
}

.member-listview .heading.name-text { font-size:1.1rem; color:#999; height: 30px; text-align: left; width: auto; }
.member-listview .heading.permission-text { font-size:1.1rem; color:#999; height: 30px; text-align: center; width: 100px; }
.member-listview .heading.date-text { font-size:1.1rem; color:#999; height: 30px; text-align: center; width: 150px; }
.member-listview .name-text { padding-left: 10px; padding-right: 5px; width: auto; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-listview .name-text:active { color: #aaaaaa; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-listview .permission-text { text-align: center; width: 100px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-listview .date-text { text-align: center; width: 150px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }

.member-listview .heading.type-text {
  width: 150px;
  text-align: left;
}
.member-listview .heading.visit-text {
  width: 50px;
  text-align: left;
}
.member-listview .heading.account-name-text {
  width: 250px;
  text-align: left;
}
.member-listview .heading.selection-spacing {
  width: 5px;
}
.member-listview .account-name-text {
  width: 250px;
  text-align: left;
}
.member-listview .type-text {
  width: 150px;
  text-align: left;
}
.member-listview .selectable-icon {
  width: 40px;
  height: 35px;
}
.member-listview .selectable-icon .imgdiv {
  position: relative;
  width: 40px;
  height: 35px;
  overflow: hidden;
}
.member-listview .thumbnail {
  width: 35px;
  height: 35px;
  margin: 5px 0 5px 0;
  padding: 5px 0 5px 0;
}
.member-listview .thumbnail .imgdiv {
  position: relative;
  width: 35px;
  height: 35px;
  overflow: hidden;
}
.member-listview .selection-spacing {
  width: 5px;
}
.member-listview .image-wrapper {
  position: relative;
  text-align: center;
  height: 45px;
}
.member-listview .image-wrapper:before {
  height: 100%;
  content: " ";
  vertical-align: middle;
  display: inline-block;
}
.member-listview .inline-edit-input {
  border: 1px solid #51b7e0;
  width: 90%;
  height: 100%;
  padding-left: 4px;
}

.bread-crumb {
  padding: 0 0 0 5px;
  margin: 0 0 20px 0;
  text-align: left;
}
.homeicon {
  width: 20px;
  padding-left: 5px;
}
.bread-crumb li {
  display: inline;
  font-size: 14px;
}
.bread-crumb li:after {
  content: url("/images/browser-icons/icon-breadcrumb-grey.png");
  padding-left: 5px;
  vertical-align: middle;
}
.bread-crumb li:last-child:after {
  content: '';
}
.bread-crumb .bread-text {
  color: #51b7e0;
}
.bread-crumb .bread-text:active {
  color: #aaaaaa;
}

.bread-crumb-file-path {
  padding: 0;
  text-align: left;
}
.bread-crumb-file-path li {
  display: inline;
  font-size: 20px;
}
.bread-crumb-file-path li:after {
  content: "/";
  padding-left: 0;
}
.bread-crumb-file-path li:last-child:after {
  content: '';
}
.bread-crumb-file-path .bread-text-file-path {
  color: #51b7e0;
}
.bread-crumb-file-path .bread-text-file-path:active {
  color: #aaaaaa;
}

.clickable {
  cursor: pointer;
}

.browser-navigationbar {
  padding-bottom: 15px;
  border-bottom: 1px solid #cccccc;
}
.browser-navigationbar:before,
.browser-navigationbar:after {
  display: table;
  content: " ";
}
.browser-navigationbar:after {
  clear: both;
}
.browser-navigationbar .item {
  position: relative;
  float: left;
  margin: 0 10px 0 0;
}
.browser-navigationbar .item img {
  vertical-align: middle;
}
.browser-navigationbar .item.large span {
  color: #51b7e0;
  line-height: 35px;
  vertical-align: middle;
  padding: 0 10px;
}
.browser-navigationbar .item.large img {
  width: 34px;
  height: 35px;
}
.browser-navigationbar .item.pull-right {
  float: right;
  margin: 0 0 0 10px;
}
.browser-navigationbar .item.large {
  margin: 0 40px 0 0;
}
.browser-navigationbar .item.large.pull-right {
  float: right;
  margin: 0 0 0 40px;
}

.action-bar {
  padding-top: 10px;
  padding-bottom: 3px;
}

.browser-pickbar {
  border-top: 1px solid #cccccc;
  padding-top: 8px;
  color: #999;
  font-size: 12px;
  font-weight: 300;
}
.browser-pickbar:before,
.browser-pickbar:after {
  display: table;
  content: " ";
}
.browser-pickbar:after {
  clear: both;
}
.browser-pickbar .item {
  position: relative;
  float: left;
  margin: 0 10px 0 0;
}
.browser-pickbar .item img {
  vertical-align: middle;
}
.browser-pickbar .item.large span {
  color: #51b7e0;
  line-height: 35px;
  vertical-align: middle;
  padding: 0 10px;
}
.browser-pickbar .item.large img {
  width: 34px;
  height: 35px;
}
.browser-pickbar .item.pull-right {
  float: right;
  margin: 0 0 0 10px;
}
.browser-pickbar .item.large {
  margin: 0 40px 0 0;
}
.browser-pickbar .item.large.pull-right {
  float: right;
  margin: 0 0 0 40px;
}
.browser-pickbar .back-text-style {
  color: #51b7e0;
}
/*---- End Browser from the Web App ----*/

/*---- Begin Loading Browser Busy ----*/
#busy-overlay {
    position: relative;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    /*border: 1px solid #ddd;*/
    /*background: #000;*/
    /*opacity: 0.8;*/
    /*filter: alpha(opacity=80);*/
}
#busy-overlay-subscriptions {
    position: absolute;
    left: 50%;
    top: 20%;
    bottom: 0;
    right: 0;
}
#busy-loading {
    position: absolute;
    top: 40%;
    left: 50%;
}

.processing-imagebox img {
  width: 20px;
  height: 20px;
  -webkit-animation: spin 1.0s linear infinite;
  animation: spin 1.0s linear infinite;
}

@-moz-keyframes spin {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/*---- End Loading Browser Busy ----*/

/*---- Media tags ----*/

@media (min-width: 320px) {
/*--- Miscellaneous or one-offs ---*/
  /*#linkheader .thumb { display:none; margin-right:0px; font-size:8px;  }*/
  #gallery .three { width:100%; clear:both; }
  #gallery .four { width:100%; clear:both; }
  #linkheader { padding-bottom:20px; }
  #linkheader .sub { font-size:1.1rem; }
  .buttonsmallscreen { width:100%; }
  .button-secondary-text {text-align: center; color: #999;}
  .buttonsmallscreen-disabled { width:100%;  opacity: 0.6; cursor: none; }
  .buttonsmallscreen-disabled:hover { width:100%;  opacity: 0.6; background-color: #51b7e0; cursor: none; }
  #linkbutton{ padding:0; padding-bottom:20px; }
  .dialog-layout-cancelation { width:300px; }
  .landing-video { width:300px; height:169px; }

/*--- Link menu font-scaling and disappearing of tabs when screen is smaller ---*/
  .links-title { font-size:2rem; }
  #linkmenu .tab-poof1 { display:none; }
  #linkmenu .tab-poof2 { display:none; }
 
/*--- Link/Edit form module ---*/
  #linkform { padding:20px 0 0 0; }
  #linkform .dialog-layout{ width:320px; padding-top:20px; }
  #linkform .backup-dialog-layout{ width:500px; padding-top:20px; }
  #linkform .signin-email-dialog-layout{ width:320px; padding-top:20px; }
  #linkform .share-link-dialog-layout{ width:600px; padding-top:20px; }
  #linkform .title {color:#333; font-size:1.8rem; font-weight:300; text-align:center; padding-bottom:20px;}
  #linkform .input-title{ font-size:.8rem; color:#999; padding-left:10px; text-transform:uppercase; text-align:left; padding-bottom:1px;}
  #linkform .textarea-title{ font-size:.8rem; color:#999; padding-left:10px; text-transform:uppercase; text-align:left; padding-bottom:1px;}
  #linkform .input-row > input { border:solid 1px #ccc; width: 95%; font-weight:400; }
  #linkform .input-row { color:#333; background: #fff; font-size:1.2rem; display:block; margin-bottom:8px; font-weight:400;}
  #linkform .textarea-row > textarea { border:solid 1px #ccc; width: 100%; font-weight:400; }
  #linkform .textarea-row { color:#333; background: #fff; font-size:1.2rem; display:block; margin-bottom:8px; font-weight:400;}
  #linkform .formbutton { text-align:center; margin-top:10px; }
  #linkform .cancel {text-align:center; padding-top:10px; margin-bottom:0;}
  ::-webkit-input-placeholder { color: #aaa; font-weight:300; font-size:1.2rem;}
  :-moz-placeholder { color: #aaa; font-weight:300; font-size:1.2rem;}
  ::-moz-placeholder { color: #aaa; font-weight:300; font-size:1.2rem;}
  :-ms-input-placeholder { color: #aaa; font-weight:300; font-size:1.2rem;}
  
/*--- Unlink module ---*/
  .confirm-unlink-popover { padding-top:0; }
  .confirm-unlink-popover .dialog-container { width:320px; padding-top:20px; }
  .confirm-unlink-popover .focustitle { color:#333; font-size:1.8rem; font-weight:300; text-align:center; }
  .module-popover { background: rgba(255,255,255,1); }
  .module-popover .inner { margin-top: 0; }
  .module-popover.vertically-center .module-popover-inner { padding:0; }
}

.side-by-side-group {text-align: center;}
.side-by-side-detail {display: inline-flex;}

@media (min-width: 400px) {
/*--- Miscellaneous or one-offs ---*/
  #gallery .three { width:100%; clear:both; }
  #gallery .four { width:100%; clear:both; }
  #linkheader .sub { font-size:1.1rem; }
  .buttonsmallscreen { width:100%; }
  .landing-video { width:380px; height:214px; }

/*--- Link menu font-scaling and disappearing of tabs when screen is smaller ---*/
  .links-title { font-size:2rem; }
  #linkmenu .tab-poof1 { display:inline-block; }
  #linkmenu .tab-poof2 { display:none; }

  .dialog-layout-cancelation { width:360px; }
}

@media (min-width: 550px) {
/*--- Miscellaneous or one-offs ---*/
  #gallery .three { width:100%; clear:both;}
  #gallery .four { width:100%; clear:both;}
  #linkbutton { float:right; text-align:right; clear:none; max-width:29%; padding-top:25px; }
  #linkheader { width:60%; }
  #linkheader .title { max-width:100%; }
  .buttonsmallscreen { width:auto; }
  .buttonsmallscreen-disabled { width:auto;  opacity: 0.6; cursor: none; }
  .buttonsmallscreen-disabled:hover { width:auto;  opacity: 0.6; background-color: #51b7e0; cursor: none; }
  .landing-video { width:530px; height:298px; }

/*--- Link menu font-scaling and disappearing of tabs when screen is smaller ---*/
  .links-title { font-size:2.4rem; }
  #linkmenu .tab-poof1 { display:inline-block; }
  #linkmenu .tab-poof2 { display:inline-block; }
  #linkmenu .tab-poof3 { display:none; }
  
/* --- Unlink module --- */
  .confirm-unlink-popover {   padding-top:20px; }
  .confirm-unlink-popover .dialog-container { padding:40px; }
  .confirm-unlink-popover .focustitle { font-size:2.4rem; }
  .module-popover { background: rgba(0,0,0,0.6); }

/* --- Link/Edit forms module --- */
  #linkform .dialog-layout{ padding:40px; }
  #linkform .backup-dialog-layout{ padding:40px; }
  #linkform .signin-email-dialog-layout{ padding:40px; margin-top:40px; }
  #linkform .share-link-dialog-layout{ padding:40px; margin-top:40px; }
  #linkform .verify-email-dialog-layout{ padding:40px; }
  #linkform .title {color:#333; font-size:2.4rem; font-weight:300; text-align:center; padding-bottom:20px;}
  #linkform .input-title{ font-size:1.1rem; color:#999; padding-left:10px; text-transform:uppercase; text-align:left; padding-bottom:1px;}
  #linkform .textarea-title{ font-size:1.1rem; color:#999; padding-left:10px; text-transform:uppercase; text-align:left; padding-bottom:1px;}
  #linkform .input-row > input { border:solid 1px #ccc; width: 100%; font-weight:300; }
  #linkform .textarea-row > textarea { border:solid 1px #ccc; width: 100%; font-weight:300; }

  .dialog-layout-cancelation { width:360px; }

}

@media (min-width: 300px) {
/*--- Miscellaneous or one-offs ---*/
  #gallery .three { width:32%;}
  #gallery .four { width:49%;}
  #linkheader .sub { font-size:1.2rem; }
  #editCover{ position:fixed; top:0; left:0; background:rgba(0,0,0,.6); z-index:5; width:100%; height:100%; display:none; }
  #editScreen:target, #editScreen:target + #editCover{ display:block; opacity:1; }
  #editNameScreen:target, #editNameScreen:target + #editCover{ display:block; opacity:1; }
  #editEmailScreen:target, #editEmailScreen:target + #editCover{ display:block; opacity:1; }
  #editAccountScreen:target, #editAccountScreen:target + #editCover{ display:block; opacity:1; }
  #closeAccountScreen:target, #closeAccountScreen:target + #editCover{ display:block; opacity:1; }
  #expireSessionsScreen:target, #expireSessionsScreen:target + #editCover{ display:block; opacity:1; }
  #editBillingScreen:target, #editBillingScreen:target + #editCover{ display:block; opacity:1; }
  #applyPromoScreen:target, #applyPromoScreen:target + #editCover{ display:block; opacity:1; }
  #verifyEmailScreen:target, #verifyEmailScreen:target + #editCover{ display:block; opacity:1; }
  #linkmenu .tab-poof3 { display:none; }

  .dialog-layout-cancelation { width:360px; }
  .landing-video { width:360px; height:315px; }

  #testimonials .quote-logo { width:30%; }
  #testimonials .column { margin:1% 1%; width: 97%; }

}

@media (min-width: 600px){
  #linkform { padding:40px 0 0 0; }
  .confirm-unlink-popover {   padding-top:40px; }
  #linkmenu .tab-poof3 { display:none; }

  .landing-video { width:580px; height:300px; }

  #testimonials .quote-logo { width:25%; }
}

@media (min-width: 750px) {
  #gallery .three { width:33%;}
  #gallery .four { width:24%;}
  #linkheader .thumb { display:inline-block; margin-right:20px; }
  #linkheader .sub { font-size:1.1rem; }
  #linkheader .title { max-width:80%; }
  #linkmenu .tab-poof3 { display:inline-block; }
  
  #linkform .input-row { color:#333; background: #fff; font-size:2rem; display:block; margin-bottom:20px; font-weight:300;}
  #linkform .textarea-row { color:#333; background: #fff; font-size:2rem; display:block; margin-bottom:20px; font-weight:300;}
  ::-webkit-input-placeholder { color: #aaa; font-weight:300; font-size:1.8rem;}
  :-moz-placeholder { color: #aaa; font-weight:300; font-size:1.8rem;}
  ::-moz-placeholder { color: #aaa; font-weight:300; font-size:1.8rem;}
  :-ms-input-placeholder { color: #aaa; font-weight:300; font-size:1.8rem;}

  .dialog-layout-cancelation { width:700px; }
  .landing-video { width:640px; height:360px; }

  #testimonials .quote-logo { width:45%; }
  #testimonials .column { margin:1% 1%; width: 30.666667%; }
}

@media (min-width: 1000px) {
  #gallery .four { width:24%;}
  #footer {  }
  
  .landing-video { width:900px; height:506px; text-align:center;}
}

@media (min-width: 1200px) {
  #footer {  }
  
}

/*--- Specifically for links in link and addon accordions ---*/
.linky { color:#51b7e0; }
.linky:hover { color: #0FA0CE; }