/*! HTML5 Boilerplate v8.0.0 | MIT License | https://html5boilerplate.com/ */

/* main.css 2.1.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
html,
button,
input,
select,
textarea {
    color: #2b2b2b;
}

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
  font-size: 1em;
  line-height: 1.4;
  min-width: 1280px;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
  resize: vertical;
}

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* Internet Explorer/Edge */
  user-select: none;           /* Non-prefixed version, currently
                                  not supported by any browser */
}

input::-ms-clear, input::-ms-reveal {
    display: none;
}

input:invalid {
    box-shadow:none;
}


/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
 * Extends the .sr-only class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
  visibility: hidden;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
  *,
  *::before,
  *::after {
    background: #fff !important;
    color: #000 !important;
    /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]::after {
    content: " (" attr(href) ")";
  }

  abbr[title]::after {
    content: " (" attr(title) ")";
  }

  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }

  pre {
    white-space: pre-wrap !important;
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  /*
   * Printing Tables:
   * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
   */
  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}

/* fin de html5 boilerplate */


.cien{
    width: 100%;
}

td{
    
    padding: 0px;
}

a{
    color: #2b2b2b;
    text-decoration: none;
    outline: none;
}

a:focus{
    outline: none;
}    

a img{
    outline: none;
}    

a:visited{
    color: #2b2b2b;
}

a:hover,
button[type='submit']:hover,
input[type='submit']:hover {
	border-bottom: 0px;
}

:focus {
	outline: 0;
}

.selectContainer select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #000;
}

#impersonate, 
#maintenanceBanner,
#trialBanner {
    background-color: #333333;
    height: 35px;
    color: white;
    font-size: 13px;
    font-weight: 500;
}

#fulfillBanner {
	background-color: #FF9800;
	height: 35px;
    color: white;
    font-size: 13px;
}

#impersonate.separator {
	border-bottom: 1px solid white;
}

#impersonate .center, 
#maintenanceBanner .center,
#trialBanner .center,
#fulfillBanner .center {
    text-align: center;
    padding-top: 8px;
}

#maintenanceBanner a,
#trialBanner a, #impersonate a,
#fulfillBanner a {
	background-color: #e5e5e5;
    border: 1px solid #e5e5e5;
    border-radius: 3px;
    color: #1E1E1E;
    font-weight: 600;
    margin-left: 5px;
    padding-left: 8px;
    padding-right: 8px;
    text-decoration: none;
}

#fulfillBanner a {
	background-color: white !important;
    border: 1px solid white !important;
}

.screen_padding{
    max-width: 1200px;
    min-width: 900px;
    position: relative;
}

#container{
    min-width: 900px;
    max-width: 1200px;
    padding: 30px 0px 50px;
    white-space: nowrap;
}

.hidden{
    display: none;
}

#left_container{
    display: inline-block;
    white-space: normal;
    width: 940px;
    margin-right: 30px;
    padding-right: 30px;
    border-right: 1px solid #ececec;
    min-height: 500px;
    vertical-align: top;
}

#right_container{
    display: inline-block;
    white-space: normal;
    width: 240px;
    vertical-align: top;
}

#single_container{
    float: left;
    margin-right: 30px;
    padding-right: 30px;
    min-height: 500px;
    white-space: normal;
    width: 900px;
}

.two-col-gr{
    white-space: normal;
}

.rightPanel{
    min-height: 500px;
    margin: 7px 0 18px 0;
}

.rightPanel ul {
	padding: 0 0 0 15px;
    margin-bottom: 5px;
}

ul#menu > li{
    display: inline-block;   /* You can also add some margins here to make it look prettier */
    margin-right: 5px;
    *display:inline; /* this fix is needed for IE7- */
}

.menu_option{
    color: #333333;
    background-color: transparent;
}

.menu_option a{
    text-decoration: none;
    color: #2b2b2b;
    padding: 0px 8px;
}

.menu_selected a{
    text-decoration: none;
    color: #2b2b2b;
    padding: 0px 8px;
}

#accountSelector{
    float: left;
    width: 350px;
}

#uniqueAccount{
    float: left;
    line-height: 30px;
    margin-top: 6px;
    font-size: 13px;
    color: #2b2b2b;
}

.selectContainer{
    line-height: 40px;
    width: 440px;
    background: url("../../images/icon/selectArrow.png") no-repeat 415px center #ffffff;
    overflow: hidden;
    position: relative;
    border: 1px solid #cdcdcd;
    display: inline-block;
}

.account .selectContainer {
	width: 225px;
	height:36px;
	margin-bottom: 6px;
	background: #ffffff url("../../images/icon/selectArrow.png") no-repeat scroll 205px center;
}

.bt .selectContainer{
    width: 229px;
}



#accountSelector select, .selectContainer select {
    border: 0px;
    background: transparent;
    -webkit-appearance: none;
    color: #475055;
    font-size: 13px;
    width: 350px;
    padding-left: 8px;
    padding-right: 35px;
    text-overflow: ellipsis;
    overflow: hidden;
	-webkit-padding-end: 50px !important;
}

.selectContainer select{
    width: 467px;
    font-size: 13px;
}    

.puContent .selectContainer select, .puContentBig .selectContainer select{
    font-size: 13px;
}    

.bt .selectContainer select{
    width: 270px;
}    

.bt .expDate .selectContainer{
    width: 87px;
    background-position: 65px center;
}

.bt .expDate select {
    width: 120px;
}

.menu_selected{
    font-weight: 600;
    border-bottom: 3px solid #2b2b2b;
}

#menubar {
    height: 53px;
    background-color: white;
}

.menu_separator {
    border-bottom: 1px solid #dadcdd;
}

#menu {
    font-size: 14px;
    margin: 0 auto;
    max-width: 1217px;
    min-width: 900px;
    padding: 21px 10px 0px;
    line-height: 28px;
    font-weight: 400;
    height: 30px;
}

.content {
	background: white;
}

.submenu_options {
    max-width: 1225px;
    min-width: 900px;
    padding-left: 29px;
}

.submenu_separator {
    background-color: #f9f9f9;
    clear: both;
    border-bottom: 1px solid #d2d8dc;
    margin-bottom: 10px;
}

.submenu_separator_empty {
	clear: both;
}

.float_right{
    float:right;
}

.clear {
	clear: both;
}

.push{
    height: 70px;
}

html{
    /* necesario para que el footer se quede abajo */
    height: 100%;
}

.left_footer{
    float:left;
    padding: 17px 0px 0px 0px
}

.right_footer{
    float:right;
    padding: 18px 0px 0px 0px
}

.bold{
    font-weight: bolder;
}

.semibold {
	font-weight:600;
}

.centerText{
    text-align: center;
}

.text24{
    font-size: 24px;
}

#top{
    height: 78px;
    position: relative;
    background-color: white;
}

a.signInLink{
    color: #ffffff;
    font-weight: bold;
}

#username_logoff{
    position: absolute;
    right: 8px;
    top: 22px;
    font-size: 12px;
}

#username{
    float: right;
    font-size: 16px;
    margin-top: 2px;
    max-width: 345px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: white;
}

#username a {
    color: #2b2b2b;
}

#logoff, #logoff a{
    color: #7f8183;
    font-size: 11px;
}

img.gravatar {
	float: right; 
	position: absolute; 
	top: 0px;
}

img.gravatar.userBubble,
img.gravatar.userBubbleSmaller,
img.gravatar.userBubbleSmallest {
	position: absolute;
	top: 0px;
	left: 0px;
}

img.gravatar.userBubbleSmaller {
	margin: 0px;
}

img.gravatar.userBubbleSmallest {
	left: -5px;
}

.userBubbleSmallest {
	width: 16px;
	height: 16px;
	border-radius: 9px;
	background-color: #f0f5f8;
	display: inline-block;
	vertical-align: middle;
    margin-left: 4px;
    position: relative;
}

.userBubbleSmallest p {
	line-height: 16px;
	margin: 0 auto;
	color: #8C9497;
	font-size: 8px;
	margin-left: 5px;
}

.userBubbleSmaller {
	background-color: #d5dee3; 
	width: 30px; 
	height: 30px; 
	border-radius: 15px; 
	text-align: center; 
	margin: initial; 
	vertical-align: middle;
}

.userBubbleSmaller p {
	color: white;
    font-size: 13px;
    font-weight: 500;
    line-height: 30px;
    margin: 0 auto;
}

.add-users .userBubbleSmaller {
	width: 36px; 
	height: 36px; 
	border-radius: 18px;
}

.add-users .userBubbleSmaller p {
	line-height: 36px;
}

.group .userBubbleSmaller {
	background-image: url('../../images/icon/groups-icon@2x.png');
	background-repeat: norepeat;
	background-size: 33px 33px;
}

.userBubbleSmall {
	background-color: #d5dee3; 
	width: 42px; 
	height: 42px; 
	border-radius: 22px; 
	text-align: center; 
	margin: initial; 
	vertical-align: middle;
}

.userBubbleSmall span {
	color: white; 
	font-size: 22px; 
	line-height: 42px;
}

.group .userBubbleSmall {
	background-image: url('../../images/icon/groups-icon@2x.png');
	background-repeat: norepeat;
	background-size: 43px 43px;
}

.userBubbleMedium {
	background-color: #d5dee3; 
	width: 52px; 
	height: 52px; 
	border-radius: 26px; 
	text-align: center; 
	margin: initial; 
	vertical-align: middle;
}

.userBubbleMedium span {
	color: white; 
	font-size: 22px; 
	line-height: 52px;
}

.group .userBubbleMedium {
	background-image: url('../../images/icon/groups-icon@2x.png');
	background-repeat: norepeat;
	background-size: 53px 53px;
}
        
#username a.userPictureSmall img{
    margin: 0px 15px;
}    

#username_logoff A{
    text-decoration: none;
}

#logo{
    height: 78px;
    line-height: 78px;
    padding-top: 23px;
    position: absolute;
}

#logo img{
    max-height: 60px;
    max-width: 250px;
    vertical-align: top;
}

#logo .logo_img {
    max-height: 40px;
	max-width: 170px;
	width: 170px;
	height: 40px;
	background-image: url("../../images/logos/justinmind-logo-top.svg");
	display: block;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

#logo .title{
    margin: 0 20px;
}

#branding{
    margin: 15px 15px 40px;
    text-align: center;
}

#branding img{
    max-height: 100px;
}

body{
    text-align: center;
    font-family: Montserrat, -apple-system, BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
    font-size: 14px;
    height: 100%;
    background-color: white;
}

/* TODO: habrá que ver si esto es necesario */
body div{
    margin: 0 auto;
    text-align: left;
}

#left_container > div {
	margin-left: 0px;
}

.menu_adm_option{
	display: inline-block;
    padding: 14px 0px 10px;
    font-size: 12px;
    margin-right: 20px;
}

.menu_adm_option A {
    text-decoration: none;
    color: #7f8183;
}

.menu_adm_option.bold {
    border-bottom: 3px solid #000;
}

.menu_adm_option.bold a {
	color: #000;
}

/* http://ryanfait.com/resources/footer-stick-to-bottom-of-page/ */
/* una alternativa: http://www.cssstickyfooter.com/using-sticky-footer-code.html */
/* El important es para que IE6 lo ignore y use el 100% mientras que el resto
    de browsers utilizan la propiedad marcada con !important (en caso de props
    repetidas, sin el !important, se utiliza siempre la �ltima.

*/
.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -50px;
}


.wrapper.loop{
    background-image: url(../../images/widgets/loop_JIM.png);
    background-position: center top;
    background-repeat: no-repeat;
}



.wrapper.superuser{
    background-image: url(../../images/widgets/superuser.png);
    background-position: center top;
    background-repeat: no-repeat;
    overflow: hidden;
}

.signUpLinks p {
    color: #2b2b2b;
    font-size: 14px;
}

.signUpLinks p.title {
    font-size: 32px;
    padding: 0;
    margin: 0;
    font-weight: 300;
}    

.signUpLinks a {
    color: #ffffff;
}

.signUpLinks {
    margin-top: 30px;
    margin-left: 5px;
}    

.events {
    padding-right:16px;
}    

.events tr.odd {
    background-color: #fafafa;
}

.events tr {
    height: 35px;
}

.events td {
    font-size: 12px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.eventText {
    width: 520px;
    color: #969696;
    padding-left: 30px;
    background-repeat: no-repeat;
    background-position: 10px center;
    max-width: 472px;
	padding-right: 15px;
}

#single_container .eventText {
    width: 730px;
}

.eventText.plus {
    background-image: url(../../images/icon/blackPlus.png);
}

.eventText.minus {
    background-image: url(../../images/icon/blackMinus.png);
}

.eventText.comment {
    background-image: url(../../images/icon/blackComment.png);
}

.eventDate {
    width: 190px;
    color: #969696;
}

.eventAuthor {
    color: #393e41;
    width: 160px;
    max-width: 160px;
}

a.button img {
    padding-bottom: 2px;
}    

a.button {
    background-color: #121212;
    background-position: center;
    color: #ffffff;
    display: inline-block;
    font-size: 14px;
    height: 35px;
    line-height: 35px;
    margin-right: 20px;
    min-width: 80px;
    padding: 0 20px;
    text-align: center;
    text-decoration: none;
    font-weight:500;
    border-radius: 3px;
    border: 1px solid #121212;
    transition: all 0.25s ease-in-out;
}

#popup, #popup2, #fileErrorPopup {
	padding: 0px;
}

ui-dialog.popup{
	box-shadow: 1px 3.0px 3px rgba(0,0,0,0.2);
}

#popup a.button, #popup2 a.button {
    min-width: 78px;
    margin-right: 20px;
    color: #ffffff;
}

#popup a.button:hover, #popup2 a.button:hover {
    color: #121212;
}

.popupConfirm #popup a.button{
	background-color: #eb4a4c;
	border: 1px solid #eb4a4c;
}

.popupConfirm #popup a.button:hover{
	color: #eb4a4c;
	background-color: #fff;
}

a.button:hover {
	background-color: #fff;
	color: #121212;
}

a.button.disabled,
#popup a.button.disabled,
#popup2 a.button.disabled {
	color: #B3B3B3;
	cursor: default;
	background-color:#EDEDED;
	pointer-events: none;
	border: none;
}

a.button.disabled:hover{
    opacity:1;
}

#accountOwner a.button{
    margin-top: -10px;
}  

a.buttonSmall{
    color: #313334;
    text-decoration: none;
    background-color: #e4e4e4;
    padding: 4px 12px 4px 6px;
    display: inline-block;
}

a.buttonSmall.green{
  background-color: #62a129;
  color: #ffffff;
}

a.buttonSmall img{
    padding-bottom: 2px;
}

#popup a.secondAction, #popup2 a.secondAction{
    color: #333333;
    font-size: 13px;
    text-decoration: none;
    display: inline-block;
	text-align: center;
	border-bottom: 1px solid #333333;
}

#popup a.secondAction:hover, #popup2 a.secondAction:hover{
	border-bottom-color: #ffffff;
}

a#secondButton{
    margin-right: 20px;
}    

.bigPlus{
    background: url(../../images/icon/bigPlus.png) 10px center no-repeat;
}    

.subtitle{
    font-size: 16px;
    color: #006699;
    padding: 0px 0px 6px 6px;
    unicode-bidi: embed;
}

a.subtitle{
    color: #006699;
    font-weight: bold;
    text-decoration: underline;
}

.binpadding{
    padding-top: 12px;
	width: 870px;
	display: inline-block;
	border-bottom: 1px solid #d7d7d7;
	padding-right: 15px;
	padding-left: 15px;
}

.grey, .grey a{
    color: #393e41;
}

.darkGrey{
    color: #231f20;
}    

.lightGrey{
    color: #bec5ca;
}

.mediumGrey {
	color: #93969a;
}

.hardMediumGrey {
	color: #808080;
}

.project img {
	height: 28px;
	width: 28px;
	box-sizing: border-box;
}

.project img.smallFolder {
	height: 18px;
	width: 18px;
	margin-right: 9px;
	vertical-align: sub;
}

.project img.userBubble {
	margin-left:5px;
}

.project img.gravatar.userBubble {
	margin-left:0px;
}

.project div.userPicture {
	display: inline-block;
	position: relative;
	margin-left:5px;
}

.userBubbleSmaller {
	box-sizing: border-box;
	position: relative;
}

#user-profile .userBubbleSmaller {
	width: 50px;
	height: 50px;
	border-radius: 25px;
}

#user-profile .userBubbleSmaller p {
	font-size: 26px;
	line-height: 50px;
}

img.userBubble {
	height: 30px;
	width: 30px;
	border-radius: 15px;
	padding: 0px;
	object-fit: contain;
}

.add-users img.userBubble {
	width: 36px;
	height: 36px;
	border-radius: 18px;
}

.buttonArea .options{
	display: inline-block;
}

.options{
	cursor: pointer;
}

.options img{
	width: 16px;
	height: 16px;
}

.member .options img {
	margin-right:5px;
}

.project img.thumbnail {
	border: 1px solid #cccccc;
	border-radius: 3px;
	object-fit: contain;
	background-color: #e4e7eb;
}

.project td.projectIcon {
	padding-left:5px;
}

.project:hover {
	background-color: #f6f7f8;
}

.fileNumber {
  	color: grey;
	float: right;
	font-size: 11px;
	font-weight: 700;
	line-height: 18px;
	width: 33px;
	text-align: center;
	border: 1px solid grey;
	border-radius: 10px;
}

.eventText a{
    color: #393e41;
    border-bottom: 1px solid #393e41;
}

.eventText a:hover{
    border-bottom: none;
}

.wideColumn{
    width: 375px;
}

.narrowColumn{
    width: 100px;
}

.textSmall {
    font-size: 12px;
}

.textSmaller {
    font-size: 11px;
}

.textSmallest {
	font-size: 10px;
}

.textBig{
    font-size:16px;
    padding-bottom: 10px;
}

.textTiny{
    font-size:9px;
    margin-top:2px;
}

.subsubtitle{
    font-size: 15px;
    font-weight: 600;
    padding-bottom: 6px;
}

.puSubtitle{
    font-size: 16px;
    padding-bottom: 6px;
}

div.button_small{
    overflow:hidden;
    padding: 1px;
    float: left;
}

div.pushed_small{
    overflow:hidden;
    padding: 2px 1px 0px 1px;
    float: left;
}

.flat-contents div.button-flat {
	width: auto;
	margin-left: 0px;
	display: inline-block;
	margin-bottom: 10px;
	line-height: 34px;
}

div.button-flat{
	background-color: #121212;
	border-radius: 3px;
	border: 1px solid #121212;
	color: #fff;
	cursor: pointer;
	line-height: 40px;
	margin-top: 16px;
	margin-left: 32px;
	padding: 0px 12px;
	text-align: center;
	text-decoration: none;
	transition: all 0.25s ease-in-out, background-position 0s;
	font-weight: 500;
	width: 130px;
}

div.button-flat:hover {
    color: #121212;
    background-color: #fff;
    
}

.narrow-contents.cancel .buttons {
	font-size: 13px;
}

.narrow-contents.cancel #bigButton {
    display: inline-block;
    line-height: 34px;
    margin-right: 20px;
    height: 34px;
}

.narrow-contents.cancel #bigButton a {
	line-height: 34px;
}

.narrow-contents.cancel .cancelLink a {
	border-bottom: 0px;
	color: #2b2b2b;
}
.narrow-contents.cancel .cancelLink{
    margin-left:22px;
    background-color: #fff;
    border: 1px solid #2b2b2b;
    border-radius: 3px;
    cursor: pointer;
    line-height: 35px;
    margin-top: 16px;
    margin-left: 0px;
    padding: 0px 12px;
    text-align: center;
    text-decoration: none;
    transition: all 0.25s ease-in-out;
    font-weight: 500;
    width: auto;
    display: inline-block;
}

.narrow-contents.cancel .cancelLink:hover{
    background-color: #898989;
}

.narrow-contents.cancel .cancelLink:hover a{
	color: #fff;
}

.pushed-flat{
    opacity: .5;    
}

.grey-bg{
    color: #4a4d50;
    background-color: #d5d5d5;
}

.orange-bg{
    background-color: #ff7e00;
    color: #ffffff;
}

div.button_small a{
    background-image: url('../../images/widgets/sp.png');
    background-repeat: no-repeat;
    background-position: 0px -68px;
    float:left;
    height:26px;
    padding: 0px 0px 0px 8px;
    display: block;
    text-align:left;
    line-height: 24px;
    text-decoration: none;
    color: #333333;
}

div.button_small a span{
    background-image: url('../../images/widgets/sp.png');
    background-position: right -94px;
    background-repeat: no-repeat;
    
    height:26px;
    float:left;
    padding: 0px 10px 0px 2px;
}

div.pushed_small a {
    background-image: url('../../images/widgets/sp.png');
    background-repeat: no-repeat;
    background-position: 0px -68px;
    float:left;
    height:26px;
    padding: 0px 0px 0px 8px;
    
    display: block;
    text-align:left;
    line-height: 24px;
    text-decoration: none;
    color: #333333;
}

div.pushed_small a span.right {
    background-image: url('../../images/widgets/sp.png');
    background-repeat: no-repeat;
    background-position: right -94px;
    
    height:26px;
    float:left;
    padding: 0px 10px 0px 2px;
}

.popup_buttons {
  clear: both;
  display: flex;
  align-items: center;
  justify-content: left;
  margin-bottom: 34px;
  margin-top: 28px;
  margin-left: 34px;
  margin-right: 34px;
}

#popup .popup_buttons.working .button, #popup2 .popup_buttons.working .button{
	background: transparent url(../../images/web/360-loading.gif) no-repeat center center;
    background-size: 110px 10px;
    color: transparent !important;
    border: none;
    margin: 0px;
    transition: all 0s;
}

.popup_buttons.working .secondAction{
	display: none !important;
}

.popupConfirm .popup_buttons {
	justify-content: center;
}

.popup_buttons .button_small, .popup_buttons .pushed_small {
  margin-right: 10px;
}

.popup_buttons.confirm {
    justify-content: center;
}

.popup a.button.disable {
	pointer-events:none; 
	opacity: 0.5;
	transition: all 0s ease-in-out;
}

.acMenuLabel {
    font-size:12px;
    padding-left: 12px;
}

.acMenuLabel ul.jd_menu li {
    color: #2b2b2b;
    padding: 2px 3px;
    text-decoration: none;
}

.acMenuLabel .jdm_events {
    background-color: #ffffff;
    border: medium none;
    box-shadow: 0 1px 3px #c5c5c5;
    padding: 10px;
}

.acMenuLabel ul.jdm_events li {
    text-decoration: none;
    height: 18px;
    font-size: 11px;
}

.acMenuLabel ul.jdm_events li a {
    text-decoration: none;
    color: #2b2b2b;
    border-bottom: none;
    box-sizing: border-box;
    height: 16px;
    display: inline-block;
}

.acMenuLabel ul.jdm_events li a:hover {
    border-bottom: 1px solid #2b2b2b;
    height: 16px;
}

.acMenuLabel ul.jdm_events li.jdm_hover a {
    color: #08d0d0 !important;
}

.member .acMenuLabel {
	bottom: 6px;
    clear: both;
    position: absolute;
    right: -4px;
}

.dlMenuLabel{
    font-size:12px;
    color: #006699; 
}

.tlMenuLabel{
    font-size:12px;
    color: #006699;
}

.groupMenu{
    font-size:12px;
    color: #006699;
    padding-left: 30px;
}

#popup, #popup2{
    display: none;
}

#popup .info, #popup2 .info{
    margin-top: 5px;
    text-align: center;
    font-size: 12.7px;
}

#popup a.bottomRight, #popup2 a.bottomRight{
    position:absolute;
    right:40px;
    bottom:40px;
}

#popup .errorTop, #popup2 .errorTop{
    width: calc(100% - 40px);
}

input.protoFile {
    top: -16px;
    opacity:0;
    position:relative;
    font-size:8px;
    cursor: pointer;
    
    filter: alpha(opacity="0");
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity="0");
    
}

.protoFileIE{
    top:0px;
    position:relative;
    font-size:12px;
    cursor:pointer;
    width: 330px;
}

a.clickFile {
    color: #006699;
    text-decoration: none;
    font-size: 12px;
    cursor: pointer;
}

.clickFile{
    cursor: pointer;
}

.protoFile {
    cursor: pointer;
}

textarea{
    padding: 15px;
}

#publishPrototype textarea{
    height: 120px;
    width: 535px;
}

#publishPrototype .createProject {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    margin-left: 15px;
    margin-top: 16px;
}

#publishPrototype .selectContainer {
    margin: 15px 0px 0px;
}

#publishPrototype .formEl {
	width: 78% !important;
    margin-left: 0px;
    display: inline-block;
}

.lightBg{
    background-color: #f2f2f2;  
}

.paddingTop10{
    padding-top: 10px;
}

.paddingTop20{
    padding-top: 20px;
}

.paddingTop3{
    padding-top: 3px;
}

a.paddingTop3{
    display:inline-block;
}

.paddingBottom20{
    padding-bottom: 20px;
}

a.copyLink.marginLeft0{
	margin-left: 0px;
}

#testingTools div{
    display: inline-block;
    padding: 4px;
    width: 180px;
    margin-bottom: 5px;
}

.tt{
    height: 32px;
    vertical-align: middle;
}

.tt.tool10{
    background-position: 26px -6px;
}

.tt.tool3{
    background-position: -350px -6px;
}

.tt.tool1{
    background-position: 26px -50px;
}

.tt.tool6{
    background-position: -350px -46px;
}

.tt.tool2{
    background-position: -176px -1px;
}

.tt.tool7{
    background-position: -542px -6px;
}

.tt.tool9{
    background-position: -176px -49px;
}

.tt.tool8{
    background-position: -542px -51px;
}

.tt.tool12{
    background-position: 25px -92px;
}

.greyscale {
     -moz-filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
     -o-filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
     -webkit-filter: grayscale(100%);
     filter: gray;
     filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
}

.puContent{
    min-width: 470px;
    font-size: 15px;
    margin-top: 0px;
    margin-left: 34px;
    margin-right: 34px;
}

.puContent.warning{
    width:450px;
    margin-right: 34px;
    margin-left: 34px;
    margin-top: 5px;
}

.puContent.question{
    width:450px;
    min-height:95px;
    margin-right: 34px;
    margin-left: 34px;
}

.puContent.add-users {
    margin-right: 20px;
}

.puContent.get-link {
	min-width: 360px;
}

.puContent.narrow {
    min-width: 420px;
}

.puContent.long{
    width:490px;
}

.puContentBig{
    min-width: 575px;
    max-width: 960px;
    margin-bottom: 25px;
    font-size: 13px;
}

.confirmSign{
    margin: 0px 0px 15px 0px;
    text-align: center;
}   

.confirmTitle{
    font-size: 11.25pt;
    text-align: center;
    max-width: 600px;
    line-height: 21px;
    margin-bottom: 10px;
	font-weight: 600;
} 

.confirmText{
    font-size: 10pt;
    text-align: center;
    max-width: 600px;
    line-height: 18px;
    font-weight: 400;
}

.confirmText .secondLine{
	font-size: 13px;
	font-weight: 400;
}

.confirmText.licenseError{
    width:425px;
}    

.group{
    background-color: #f8fafb;
}

.member > div {
    display: inline-block;
    line-height: 18px;
    padding-left: 9px;
    max-width: 365px;
}

.superuser .member > div {
	width: 780px;
	max-width: 780px;
}

.superuser .column .member > div{
	max-width: 355px;
	width: auto;
}

.superuser .column .member .userInfo {
	width: 348px;
}

.column .member.group > div {
	max-width: 345px;
}

.owner-user {
	position: relative;
}

.owner-icon {
	position: absolute;
	top: 20px;
	left: -2px;
}

div.img-user {
	padding-left: 0px;
	float: left;
	position: relative;
}

.fixedWidth {
	text-overflow: ellipsis;
	overflow: hidden;
	width: 203px;
	display: inline-block;
}

.blockLink.fixedWidth {
	width: 260px;
}

.superuser a.textSmall {
	float: right;
}

.superuser .userActions {
	display: inline-block;
}

.member {
    background-color: white;
    border: 1px solid #f9f9f9;
    height: 90px;
    margin-bottom: 24px;
    padding-left: 15px;
    padding-top: 15px;
    position: relative;
    box-shadow: 0px 2px 3px #e5e5e5;
    border-radius: 4px;
}

.reviewer .member, .listContainer.onsite .member {
	height: 65px;
}

.onsite .member {
	height: 90px;
}

.users {
    position: relative;
}   

.users input {
	box-sizing: border-box;
} 

.branding {
    position: relative;
    display: table-cell;
} 

.users label, .branding label, .account label {
    display: block;
    font-weight: 600;
    margin-top: 15px;
    margin-bottom: 5px;
}

.users .protectedTitle{
    display: block;
    font-weight: 600;
    margin-top: 0px;
    margin-bottom: 5px;
}

.users .protectedValue{
    margin-bottom: 22px;
}

.users input[type='text'], .users input[type='password']{
    width: 550px;
}    

.users input[type='text']:disabled{
    background-color:#f3f3f3;
    opacity:0.65;
}

.branding input[type='text']{
    width: 375px;
}

.users .selectContainer{
    width: 566px;
    background-position: 542px center;
}

.users .selectContainer select{
    width: 600px;
}

.memberActivations {
    float: left;
    padding-top: 8px;
}

.userInfo.onsite {
	height: 90px;
}

.member #loginInfo {
	float:left; 
	width: 90px; 
	border-right: 1px solid #d5d5d5; 
	margin-right: 20px;
}

.member .memberTitleInfo {
	color: #959595;
    font-size: 10px;
    font-weight: 600;
    line-height: 10px;
    padding-top: 7px;
}

.userInfo.onsite .memberTitleInfo {
	display: block;
}

.member .memberInfo {
    font-size: 10px;
}

.chooseColor {
	position:relative;
}

.chooseColor #customColor1,
.chooseColor #customColor3 {
    width: 30px !important;
	height: 26px;
	padding-left: 0px;
	border-radius: 3px;
	border-color: transparent;
	position: absolute;
	top: 28px;
	left: 12px;
}

.chooseColor #customColor2,
.chooseColor #customColor4 {
    width: 149px !important;
	padding-left: 86px;
	color: #2b2b2b;
	font-size: 15px;
	text-transform: lowercase;
}

.chooseColor #octothorpe {
	left: 71px;
	z-index: 50;
	position: absolute;
	font-size: 18px;
	color: #2b2b2b;
	margin-top: 11px;
	font-weight: 300;
}

#defaultColorBackground,
#defaultColorText {
    font-size:10px;
}

.branding .verticalSeparator {
    background-color: #dadada;
    float: left;
    height: 200px;
    left: 40px;
    position: relative;
    width: 1px;
    top: 5px;
}

.deleteLogoContainer {
	position: absolute;
	bottom: 15px;
	right: -10px;
	z-index: 100;
}

.column{
    float: left;
    width: 48%;
    margin-right: 30px;
}

.column.even {
	margin-right: 0px;
}

#userList .column {
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
	margin-right: 5px;
}

.member.last{
    border-bottom: none;
}

.memberSmall{
    line-height: 44px;
    border-bottom: 1px solid #d7d7d7;
    color: #393e41;
    font-weight: 400;
    display: block;
    font-size: 13px;
}

.memberSmall.selectable {
	cursor: pointer;
}

.memberSmall .userPictureSmall{
    margin-right: 6px;
}    

.memberSmall.last{
    border-bottom: none;
}    

.onsite  .memberSmall.userPictureSmall img {
	margin: 0;
}

.title{
    font-size:22px;
    font-weight: 300;
    margin-bottom: 20px;
}

.title2 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 22px;
    display:block;
}

.logoBranding {
	margin-top: 20px;
}

.nopadding{
    padding: 0px;
}

#users{
    max-height: 380px;
    overflow: auto;
}

textarea.publishJS{
    background-color: white;
    height: 167px;
    margin: 0px 0px 20px 0px;
}

textarea.publishJSTop{
    background-color: white;
    height: 100px;
    margin-right: 20px;
}

textarea.publishJSBottom{
    background-color: white;
    height: 100px;
    margin: 00px 20px 20px 0px;
}

div.content.textSmall{
    padding-top: 10px;
    padding-left: 10px; 
}

div.content.jsFree{
	padding: 28px 0px 16px 0px;
	width: 470px;
}

.run-test div.content.jsFree {
	padding: 28px 0px 18px 0px;
}

.vs{
    padding: 8px 0px 8px 0px;
}

.link{
    color: #2b2b2b;
    border-bottom: 1px solid #2b2b2b;
    font-size: 13px;
    text-decoration: none;
}

.link:hover{
    border-bottom: 0px;
}

.testLink{
    background-color: #FFFFFF;
    color: #121212;
    font-size: 13px;
    font-weight: 600;
    height: 147px;
    margin-top: 20px;
    padding-left: 0px;
    padding-top: 20px;
    text-decoration: underline;
}

.tt input[type='radio']{
    border: 0;
    background-color: inherit;
    margin-top: 9px;
}

div.tt{
    background-image: url(../../images/logos/testing.png);
    background-repeat: no-repeat;
}    

#toolContent{
    min-height: 250px;
    margin-top: 20px;
    font-size: 13px;
}

#toolContent textarea{
    padding: 15px;
}    

.buttonArea{
    margin-bottom: 25px;
    height:40px;
}

.buttonArea.readOnly{
   margin-bottom: 0px;
}

.helpUsers {
    float: right;
    font-size: 12px;
    line-height: 40px;
}

.helpUsers a {
	margin-right: 5px;
}

#paginate {
	float: right;
    margin-bottom: 25px;
    font-size: 11px;
}

#paginate #prevPage {
	background-color: #e5e5e5;
    border: none;
    margin-right: 10px;
}

#paginate #nextPage {
	background-color: #e5e5e5;
    border: none;
    margin-left: 10px;
}


.deleteArchived{
    float:right;
    margin-right:20px;
}

.restoreArchived{
    float: right;
    margin-right:15px;
}

.resendInvitation, .removeReviewer{
    float: right;
    margin-right: 10px;
}

.resend {
	margin: 0 8px;
	cursor: hand;
	text-decoration: underline;
}

.switch.middle{
    vertical-align:middle;
    margin-top:2px;
}

.projects tr {
	font-size: 12.5px;
	font-weight: 400;
	color: #82888c;
	border-bottom: 0.5px solid #ced3d6;
	height: 60px;
}

.projects tr.container {
	border-bottom: 0px;
}

.projects th {
	font-size: 12px;
	font-weight: 600;
	color: #2b2b2b;
	cursor: pointer;
}

.projects thead tr {
	height: 40px;
}

.projects .icon{
	width: 40px;
}

.projects col.switch{
	width: 93px;
}

.projects td.projectName{
	font-size: 12.5px;
	font-weight: 600;
}

.projects .projectName{
	padding-left: 7px;
	padding-right: 10px;
	max-width: 300px;
}

.projects .user .projectName-container {
	display: flex;
	align-items: center;
}

.projects .user .projectName-container .user-name {
	flex-grow: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.projects .user .projectName-container .pendingactivation {
	flex-grow: 10;
}

.projects .userEmail{
	max-width: 260px;
}

.projects.notification .projectName{
	max-width: none;
}

.projects .permission {
	width: 160px;
}

.projects .owner {
	width: 160px;
}

.projects .ownerName {
	max-width: 150px;
	padding-right: 10px;
}

.projects .date {
	width: 160px;
}

.projects .user-test {
	width: 40px;
}

.projects .email {
	width: 275px;
}

.projects.notOwner .email {
	width: 315px;
}

.projects .role {
	width: 140px;
	padding-left: 0.5px;
}

.projects.notOwner .role {
	width: 150px;
}

.projects.groups .role {
	width: 160px;
}

.projects .activations {
	width: 130px;
}

.projects .number {
	width: 150px;
}

.projects .options {
	width: 30px;
}

.projects th img {
	width: 10px;
	padding-left: 10px;
}

.projects td {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.projects td.indent {
	width: 58px;
}

.project-menu{
	display: none;
	position: absolute;	
	z-index: 100;
}

.projects td.switch{
	text-align: right;
	padding-right: 25px;
}

input[type="text"].rename {
	font-weight: 600;
	width: 100%;
	height: 33px;
	padding-left: 3px;
	margin-left: -5px;
}

input[type="text"].newfolder {
	height: 28px;
	margin-right: 30px;
	margin-bottom: 0px !important;
	background-color: #ffffff;
	font-family: Montserrat;
	padding-left: 3px;
	margin-left: -3px;
}

.projectName.archived {
	margin-bottom: 0px;
}

.archivedProjectName{
    margin-bottom: 5px;
}

.projectBreadCrumb{
    font-size: 15px;
    color: #2b2b2b;
    padding-bottom: 20px;
}

.projectBreadCrumb a{
    text-decoration: none;
    border-bottom: 1px solid #2b2b2b;
}

.projectBreadCrumb a:hover {
	border-bottom: 0px;
}

.projectBreadCrumb img{
    padding-bottom: 2px;
    padding-right: 2px;
    height: 12px;
}    

.projectBreadCrumb.bottomLine{
    border-bottom: 1px solid #d7d7d7;
    margin-bottom: 30px;
}

.prototypeContainer{
	width: 100%;
    height: 100%;
    position: relative;
    margin-bottom: 24px;
}

.prototypeFreeOverlay{
	width: 100%;
    height: 100%;
    position: absolute;
    z-index:99;
	display:table;
 	background-color: #FFFFFFAA;
}

.prototypeFreeOverlay a{
	display: table-cell;
    text-align: center;
    vertical-align: middle;
}

.prototype {
    background-color: white;
    border: 1px solid #f9f9f9;
    padding-left: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
    position: relative;
    box-shadow: 0px 2px 3px #e5e5e5;
    border-radius: 4px;
    font-size: 12px;
}

table.projects  {
  table-layout: auto;
  width: 100%;
  border-collapse: collapse;
}

.prototype.notification {
    margin-left: 4px;
    margin-bottom: 0px;
}

.projects.notifications .proto > a:first-child {
    margin-right: 6px;
}

.prototypeName{
    background: url(../../images/icon/sheet@2x.png) left 3px no-repeat;
    padding-left: 20px;
    margin-bottom: 8px;
    background-size: 13px 17px;
}

.prototypeDetail{
    background-color: #fafafa;
    color: #231f20;
    margin: 16px 16px 16px 0px;
    padding: 7px;
}

.styleNormal{
    font-style: normal;
}

.prototypeDescription{
    padding-left:4px;
    padding-bottom: 10px;
    font-weight: 600;
}    

.commentsText{
    color: #737373;
    text-decoration: none;
    font-style: italic;
}

.commentsText a{
    text-decoration: none;
}    

a.blockLink{
    font-size: 15px;
    font-weight: 600;
    display: inline-block;
}

.members a.blockLink{
    overflow: hidden;
    text-decoration: underline;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline;
    text-transform: uppercase;
}

.members div.readOnly {
    color: #2b2b2b;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
}

.members div.readOnly.owner,
.members div.readOnly.developer {
	overflow: hidden;
    text-overflow: ellipsis;
    max-width: 285px;
}

.members span.readOnly.owner,
.members span.readOnly.developer {
	max-width: 260px;
}

.members a.blockLink.small {
	display: block;
	font-weight: 500;
}

.members.listContainer a.blockLink {
	display: inline;
} 

.members a.button {
	cursor: pointer;
}

.member .userInfo > * {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 335px;
}

.member .userInfo {
	margin-left: 5px;
    text-overflow: ellipsis;
}

.onsite .member .userCell {
	border-left: 1px solid #c5c5c5;
	padding-left: 15px;
	padding-right: 15px;
}

.onsite .member .userCell > div {
	text-overflow: ellipsis;
	display: block;
    overflow: hidden;
    white-space: nowrap;
}

.projects .projectName.user .pendingactivation {
	color: #EB4A4C;
	font-size: 10px;
}
    
h1, h2{
    font-weight: normal;
}

.bAreaLinks{
    float:left;
    padding: 10px 10px 0px 20px;
}

.float{
    clear:both;
    float:left;
}

.puInvite{
    width: 475px;
}

.clickable{
    cursor: pointer;
    margin-bottom: 1px;
    margin-left: 5px;
}


.button3{
    border: 1px solid #999999;
    background-image: url('../../images/widgets/boton2_bg.gif');
    background-repeat: repeat-x;
    padding: 0 6px 0 6px;
    height: 19px
}

.error{
    color: #ef4747;
    font-size: 13px;
}

input + div.error {
	position: absolute;
}

.pricesConfig input + div.error {
	position: static;
}

div.content tr.error td div{
    padding-left: 10px;
    padding-bottom: 4px;
}

div.form td {
    font-size: 13px;
}

div.form th {
    padding-right: 8px;
    font-weight: normal;
}

div.form .formEl {
    padding-bottom: 27px;
}

div.form .formEl:last-child {
    padding-bottom: 0px;
}

div.form > * {
	display: block;
}

div.login.form th {
    padding-right: 0px;
    padding-left: 18px;
    font-weight: bold;
}

div.form label{
    text-align: left;
    font-size: 13px;
    display: block;
}

div.form input[type='text'][type='password'][type='textarea']{
    width: 440px;
    font-size: 14px;
    border: 1px solid #c0c0c0;
    background-color: #ffffff;
    height: 22px;
    padding: 0px;
    margin: 0px;
    line-height: 22px;
}

.login{
    position: relative;
}

.form input.login {
    width: 210px;
}

.form input.signup {
    width: 159px;
}

.errorBk{
    background-color: #FFE8E8;
}

.errorInput, input:not([type=submit]).errorInput, select.errorInput, textarea.errorInput{
    border: 1px solid #ef4747 !important;
    background-color: #ffffff;
}

.errorTop, .errorTopSignIn {
  background-color: #ef4747;
  color: #FFFFFF;
  display: none;
  font-size: 12px;
  left: 0;
  padding-left: 36px;
  position: absolute;
  display: none;
  background-image: url(../../images/widgets/warning-icon@2x.png);
  background-repeat: no-repeat;
  background-position: 11px center;
  background-size: 16px 15px;
  font-weight: 400;
}

.errorTop {
  padding-bottom: 5px;
  padding-top: 5px;
}

.errorTop[style*="display: block;"] + .puContent {
	margin-top: 40px;
}

.errorTopSignIn {
  line-height: 27px;
}

.errorTop.special-error, .errorTopSignIn.special-error{
    position: static;
    box-sizing: border-box;
    line-height: 26px;
    margin: -20px -20px 20px;
    width: auto;
}

.signin .errorTop.special-error, .signin .errorTopSignIn.special-error{
    margin: -20px 0px 20px;
    width: 350px;
}

.sMess{
    background-color: #ef4747;
    color: white;
    padding-left: 4px;
    font-size: 13px;
    font-weight: normal;
    line-height: 18px;
}

.sMess div {
    max-width: 1200px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.sMess p{
    margin: 0;
}

.sMess a{
    color: white;
    font-weight: bold;
    text-decoration: underline;
}

.errorTopMain{
    background-color: #ef4747;
    color: #FFFFFF;
    display: none;
    font-size: 12px;
    height: 37px;
    left: 0;
    line-height: 37px;
    padding-left: 33px;
    position: fixed;
    top: 0;
    width: 100%;
    background-image: url(../../images/widgets/warning-icon@2x.png);
    background-repeat: no-repeat;
    background-position: 11px center;
	background-size: 18px 17px;
}

.errorTopMain a{
    color: white;
    font-weight: bold;
    text-decoration: underline;
}

#messageTopMain{
    background-color: #3DBA4D;
    color: #FFFFFF;
    display: none;
    font-size: 12px;
    height: 37px;
    left: 0;
    line-height: 37px;
    padding-left: 33px;
    position: fixed;
    top: 0;
    width: 100%;
    background-image: url(../../images/widgets/info-icon-small.png);
    background-repeat: no-repeat;
    background-position: 10px center;
}

.form td div.recaptcha{
    width: 315px;
    margin: auto;
    padding-top:4px;
    padding-left: 10px;
    
}

.form.login div.recaptcha div{
    padding: 0px;
}

div.regButton{
    overflow:hidden;
    padding: 1px;
    float: left;
}

div.regPushed{
    overflow:hidden;
    padding: 2px 1px 0px 1px;
    float: left;
}

div.regButton a{
    background-image: url('../../images/widgets/regHead.png');
    float:left;
    height:41;
    padding: 0px 0px 0px 8px;
    display: block;
    text-align:left;
    line-height: 41px;
    text-decoration: none;
    font-weight: bold;
    color: #ffffff;
}

div.regButton a span{
    background-image: url('../../images/widgets/regTail.png');
    background-position: right;
    background-repeat: no-repeat;
    
    height:41;
    float:left;
    padding: 0px 10px 0px 2px;
}

div.regPushed a{
    background-image: url('../../images/widgets/regHead.png');
    float:left;
    height:41;
    padding: 0px 0px 0px 8px;
    
    display: block;
    text-align:left;
    line-height: 41px;
    text-decoration: none;
    font-weight: bold;
    color: #ffffff;
}

div.regPushed a span.right{
    background-image: url('../../images/widgets/regTail.png');
    background-repeat: no-repeat;
    background-position: right;
    
    height:41px;
    float:left;
    padding: 0px 10px 0px 2px;
}

.acceptTerms{
    margin-top: 10px;
    padding-left:32px;
    font-size: 13px;
    line-height: 20px;
    position: relative;
}

.acceptTerms input{
    position: absolute;
    top: 1px;
}

.acceptTerms a{
    color: #EE8334;
}

.formSeparator{
    height: 18px;
}

.required{
    color: #EA6401;
    text-align: center;
    width: 15px;
}


tr.error td div{
    padding-left:0px;
}

input[type='text']:focus, input[type='password']:focus, input[type='email']:focus, textarea:focus,
.bt .fieldset input:not([type=submit]):not([type="checkbox"]):focus,
.bt .fieldset textarea:focus{
    border: 1.5px solid #0099ff;
    box-shadow: none;
    outline: none;
}

input[type='text'], input[type='password'], input[type='email'], textarea,
.bt .fieldset input:not([type=submit]):not([type="checkbox"]),
.bt .fieldset textarea{
    width: 100%;
    height: 43px;
    font-size: 13px;
    padding-left: 15px;
    border: 1px solid #ced3d6;
    background-color: #ffffff;
    border-radius: 4px;
    box-sizing: border-box;
}

.puContent input[type='text'],
.puContent input[type='password'],
.puContent input[type='email'],
.puContent textarea,
.puContent .bt .fieldset input:not([type=submit]):not([type="checkbox"]),
.puContent .bt .fieldset textarea,
.ui-widget .puContent textarea,
.users input {
    font-size: 13px;
    font-family: Montserrat;
}

.puContent #modifyAccountForm input[type='text'],
.puContent #modifyAccountForm input[type='password'],
.puContent #modifyAccountForm input[type='email'],
.puContent #modifyAccountForm textarea,
.puContent #modifyAccountForm .bt .fieldset input:not([type=submit]):not([type="checkbox"]),
.puContent #modifyAccountForm .bt .fieldset textarea{
    margin-bottom: 10px;
}

.puContent input[type='text'].errorInput,
.puContent input[type='password'].errorInput,
.puContent input[type='email'].errorInput,
.puContent textarea.errorInput,
.puContent .bt .fieldset input:not([type=submit]):not([type="checkbox"]).errorInput,
.puContent .bt .fieldset textarea.errorInput,
.users input.errorInput,
.select2.errorInput {
    margin-bottom: 0px;
}

.puContentBig input[type='text'],
.puContentBig input[type='password'],
.puContentBig input[type='email'],
.puContentBig textarea,
.puContentBig .bt .fieldset input:not([type=submit]):not([type="checkbox"]),
.puContentBig .bt .fieldset textarea{
    font-size: 13px;
}

.bt .fieldset input:not([type=submit]):not([type="checkbox"]), .bt .fieldset textarea{
    width: 472px;
    height: 42px;
}    

.boxed-form input[type='text'], .boxed-form input[type='password'], .boxed-form input[type='email'], .boxed-form textarea{
    width: 100%;
    box-sizing: border-box; 
    margin-top: 20px;
}

.boxed-form .form-title{
    font-size: 24px;
    color: #475055;
    margin-top: 5px;
    position: relative;
}

.boxed-form p {
    font-size: 15px;
    margin: 0;
}    


input[type="checkbox"]{
    margin: 4px;
}

.loginInput {
    padding-right: 18px;
}

.jsFree input[type='text']{
    width: 550px;
}

.padding20{
    padding-left: 20px;
}

.paddingBottom0{
    padding-bottom: 0px;
}

.padding10{
    padding-left: 10px;
}

.logoSize{
    height: 40px;
}

.userIcon {
    padding-right: 4px;
    padding-bottom: 2px;
}

.generating {
    padding-top: 25px;
    position: absolute;
    z-index:151;
    text-align: center;
    border-top: 2px solid #5dd1d1;
    border-bottom: 2px solid #5dd1d1;
}

.generating.progress-icon img {
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	height: 32px;
}

.generating.errorPrototype {
    padding-top: 25px;
    position: absolute;
    z-index:151;
    text-align: center;
    border-top: 2px solid #ef4747 !important;
    border-bottom: 2px solid #ef4747 !important;
    color: #ef4747;
    font-size: 12px;
    font-weight: 600;
    box-sizing: border-box;
}

.generating .errorMessage {
    position: absolute;
    bottom: 13px;
    right: 10px;
    background-color: white;
	height: 24px;
	padding-left: 60px;
}

.generating .errorMessage img {
    padding-bottom: 4px;
}    

.generating .errorMessage a {
    color: #ef4747;
    text-decoration: none;
    padding-left: 15px;
    background-image: url(../../images/icon/redCross.png);
    background-repeat: no-repeat;
    background-position: left center;
    margin-left: 20px;
}    

.overlay {
    background: white;
    position: absolute;
    opacity: .50;
    filter: alpha(opacity="50");
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity="50");
    z-index:150;
}

.uploading {
    margin-left: 0px;
    position: absolute;
    z-index:150;
    background: white url(../../images/layout/uploading.gif) no-repeat center center;
    opacity: .50;
    filter: alpha(opacity="50");
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity="50");
}

.smallIcon {
    width: 15px;
}

.box {
    width: 340px;
    border: 1px solid #e1e1e1;
    border-radius: 6px;
    background: #ffffff;
}

.accountStatusBox {
    font-size: 13px;
    padding-top: 6px;
}

.accountStatusBox a {
	border-bottom: 1px solid #2b2b2b;
}

.accountStatusBox a:hover {
    border-bottom: 1px solid transparent;
}

.rememberMe {
    position: relative;
    margin-top: 4px;
}

.form td div.rememberMe {
    font-weight: normal;
}


.bigTittle{
    color: #2e2e2e;
    font-size: 26px;
    padding-bottom: 10px;
}



.textRight{
    text-align: right;
}

.blackBorder{
    border: 1px solid black;
}


.textMedium{
    font-size: 16px;
    font-weight: normal;
    padding-bottom: 8px;    
}

#locked-slots {
	display: inline;
    vertical-align: middle;
    background-color: #FF9800;
    padding: 3px 5px 3px 6px;
    border-radius: 3px;
    color: white;
    font-size: 10px;
    margin-left: 5px;
}

/* column container */
.colmask {
    position:relative;  /* This fixes the IE7 overflow hidden bug */
    clear:both;
    float:left;
    width:100%;         /* width of whole page */
}
/* common column settings */
.colright,
.colmid,
.colleft {
    float:left;
    width:100%;         /* width of page */
    position:relative;
}
.col1,
.col2,
.col3 {
    float:left;
    position:relative;
}

/* 3 Column settings */
.threecol{
    background-color: #f5f5f5;
    border-top: 1px solid #e4e4e4;
    padding: 7px 0 28px 0;
    color: #222222;
    font-size: 12px;
    line-height: 21px;
    margin-bottom: 38px;
}

.threecol .colmid {
    right:38%;          /* width of the right column */
}
.threecol .colleft {
    right:24%;          /* width of the middle column */
}
.threecol .col1 {
    width:24%;          /* width of center column content (column width minus padding on either side) */
    left:100%;          /* 100% plus left padding of center column */
    text-align: center;
}
.threecol .col2 {
    width:38%;          /* Width of left column content (column width minus padding on either side) */
    left:38%;           /* width of (right column) plus (center column left and right padding) plus (left column left padding) */
}
.threecol .col3 {
    width:38%;          /* Width of right column content (column width minus padding on either side) */
    left:62%;           /* Please make note of the brackets here:
                    (100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */
}

.userbase td{
    padding-bottom: 20px;
}

.userbase ul.jd_menu li{
    padding-left: 0px;
}

.userbase ul.jd_menu li ul li{
    padding-left: 4px;
}

.dottedSeparator{
    border-top: 1px dotted #999999;
    padding-top: 8px;
}

.progressBar{
    margin: 15px 0px 15px 0px;
    width: 100%;
    border: 1px solid #f5f5f5;
    background-color: #e4e4e4;
    height: 9px;
}


.progressBarContents{
    height: 100%;
    background-color: #21c0c0;
    margin:0;
}

.rpLink{
    font-size: 13px;
    padding-bottom: 4px;
    height: 25px;
}

.rpLink a{
	border-bottom: 1px solid #2b2b2b;
	padding-bottom: 1px;
}

.rpLink a:hover{
	border-bottom: 0px;
}

.paddingTB6{
    padding: 6px 0px 6px 0px;
}

.black{
    color: black;
}

#nextPayment{
    font-size: 14px;
    margin-bottom: 20px;
}

.planSel{
    background-color: #ffffff;
    border: 4px solid #a9c96f;
    float: left;
    height: 275px;
    padding: 0px;
    width: 194px;        
}

.top {
    padding-top: 10px;
}

.plan .top{
    height: 67px;
    background-color: #ececec;
    width: 178px;
    margin: 0px;
}

.planSel .top{
    background-color: #f6f9f0;
    height: 77px;
    margin: 0px;
}


.leftCorners, .leftCorners .top{
    border-top-left-radius: 7px;
    border-bottom-left-radius: 7px;
}

.rightCorners, .rightCorners .top{
    border-right: 1px solid #dadada;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
}


.plan h1{
    font-size: 16pt;
    font-weight: bold;
    margin: 0px;
    padding-top: 3px;
}

.plan h2, .planSel h2 {
    font-size: 14pt;
    font-weight: normal;
    margin: 4px 0px;
    
}

.planSel h1{
    font-size: 20pt;
    font-weight: bold;
    margin: 0px;
    padding-top: 3px;
}

.plan h3, .planSel h3{
    font-size: 12pt;
    margin: 0px;
    font-weight: normal;
    margin: 10px 0px;
}

.oButton{
    margin-top: 15px;
    background-image: url("../../images/widgets/oButton.gif");
    width: 100px;
    height: 41px;
    color: white;
}

.oButton a{
    line-height: 40px;
    text-align: center;
    font-weight: bold;
    display: block;
    color: #ffffff;
    text-decoration: none;
}

.oButton a:link {
    color: #ffffff;
}

.oButton a:visited {
    color: #ffffff;
}

.oButton a:hover {
    color: #ffffff;
    text-decoration: underline;
}

.oButton a:active {
    color: #ffffff;
}

.orangeBold{
    color: #f06f0b;
    font-weight: bold;
}

.ui-widget-overlay.fullPage{
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    margin:0px;
    z-index:1001;
}

#impersonate + #container > .ui-widget-overlay.fullPage{
    top:35px;
}

.ui-widget-overlay.fullPage{
    top:35px;
}

.spContents{
    background-color:#ffffff;
    z-index:1002;
    width: 580px;
    padding: 0px 20px;
}

.narrow-contents img.icon{
	height: 40px;
}

.narrow-contents, .flat-contents{
    background-color:#ffffff;
    width: 410px;
    padding: 0px 34px 34px 34px;
}

.narrow-contents.cancel {
	width: 632px;
}

.narrow-contents.upgrade-users {
	width: 350px;
}

.flat-contents{
	width: 645px;
}

.narrow-contents h2.popupTitle{
    margin-top: 5px;
}

.narrow-contents.cancel h2.popupTitle {
	margin-top: 20px;
}

h2.dialogTitle{
    font-weight: bold;
    line-height: 18px;
    font-size: 16px;
    margin-top: 0px;
}

h2.popupTitle{
    font-weight: 600;
    font-size: 16px;
    margin-top: 0px;
}

.narrow-contents .textStandard, .flat-contents .textStandard{
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
}

.spContents .buttons{
    height: 25px;
    margin: 20px 0 20px 0;
}

.yourPlan{
    background-color: #ffffff;
}

.accountSection{
    font-size: 14px;
    overflow: hidden;
    position: relative;
    min-width: 790px;
    border: 1px solid #dadada;
    background-color: white;
    margin-bottom: 20px;
}

#accountOwner{
    padding: 0px 0px 0px 0px;
    font-size: 14px;
}

.white{
    color: #ffffff;
}

.yellowPlan{
    color: #ffff80;
    font-size: 18px;
    font-weight: bold;
    padding: 6px 0px;
}

.smallPadding{
    padding: 1px 0px 1px 0px;
}

.hiddenSignIn{
    
    display: none;
}

.hiddenBilling{
    display: none;
}

.form td div.billingLink{
    font-weight: normal;
    padding: 0px;
}

.billingLink{
    margin: 0px 18px;
    
}

.billing {
	margin-bottom: 34px;
	margin-top: 34px;
	
}

.fr{
	display: flow-root;
}

.signInBlock{
    background: white;
    float: left;
    position: absolute;
    left: 120px;
    top: 120px;
    width:300px;
    padding: 20px;
    box-shadow: 0 0 10px rgba(0,0,0,.4);
}

.signInBlock .overlay-close {
    color: #000000;
    cursor: pointer;
    height: 20px;
    position: absolute;
    right: -10px;
    width: 20px;
    background: url("../../images/widgets/popup_close.png") no-repeat scroll #FFFFFF;
}

.form .signInText{
    margin: 0px 18px;
    text-align:center;
    padding: 0;
    font-weight: normal;
}

div.flat-popup, div.popupConfirm, div.popup{
    border: 0px;
    background-color: #ffffff;
}

div.popup .ui-widget-header{
	border: none;
	background-color: #f6f7f8;
	font-size: 15px;
	color: #2b2b2b;
	font-weight: 500;
	padding-left: 34px;
	height: 40px;
	line-height: 40px;
	border-radius: 5px 5px 0 0;
}

div.flat-popup .ui-widget-header, div.flat-popup .ui-dialog-content, div.flat-popup .popup_buttons, div.ui-widget.ui-widget-content,
div.popupConfirm .ui-widget-header, div.popupConfirm .ui-dialog-content, div.popupConfirm .popup_buttons, .ui-menu.ui-widget.ui-widget-content,
div.popupError .ui-widget-header, div.popupError .ui-dialog-content, div.popupError .popup_buttons {
    border:none;
    background-color: #ffffff;
    border-radius: 0px;
    padding-top: 8px;
    color: #2b2b2b;
    font-family: Montserrat;
    font-size: 12px;
    font-weight: 500;
    border-radius: 5px;
}

div.popupConfirm .popup_buttons,
div.popupError .popup_buttons,
div.flat-popup .popup_buttons {
	padding-top: 0px;
}

div.popup #popup,
div.popup #popup2 {
	margin-top: 28px;
	overflow: visible;
}

.ui-menu.ui-widget.ui-widget-content{
	box-shadow: 0px 3.0px 3px rgba(0,0,0,0.2);
}

.ui-menu li.ui-menu-item {
	padding-left: 8px;
	padding-right: 8px;	
}

.ui-menu li.ui-menu-divider {
	margin: 0px 0 5px 0;
}

.ui-menu li.ui-menu-item {
	height: 28px;
}

.ui-menu li.ui-menu-item .ui-menu-item-wrapper.ui-state-active{
	background: #ffffff;
	border: 0px;
	color: #82888c;
	margin: 0;
	font-weight: 500;
}

.ui-menu li.ui-menu-item .ui-menu-item-wrapper.ui-state-active a{
	color: #82888c;
	font-weight: 500;
}

div.flat-popup.ui-widget-content, div.popupConfirm.ui-widget-content, div.popupError.ui-widget-content{
	box-shadow: 1px 3.0px 3px rgba(0,0,0,0.2);
}

div.flat-popup .ui-icon-closethick, div.popupError .ui-icon-closethick, div.popupConfirm .ui-icon-closethick{
	background-image: none !important;
}

div.ui-dialog.ui-widget.ui-widget-content{
    padding: 0;
    box-shadow:0px 3.0px 3px rgba(0,0,0,0.2);
    border-radius: 5px;
}

.buttons{
    font-size: 14px;
}

.flat-popup .ui-dialog-titlebar-close, .ui-dialog.popupConfirm .ui-dialog-titlebar-close, .popup .ui-dialog-titlebar-close,
.flat-popup .ui-dialog-titlebar-close:hover, .ui-dialog.popupConfirm .ui-dialog-titlebar-close:hover, .popup .ui-dialog-titlebar-close:hover, 
.ui-dialog.popupError .ui-dialog-titlebar-close, .ui-dialog.popupError .ui-dialog-titlebar-close:hover {
    border: 0px;
	background: transparent;
	background-image: url('../../images/close.png');
	background-size: 14px 14px;
	background-repeat: no-repeat;
	margin-top: -5px;
}

.popup.ui-dialog .ui-dialog-titlebar-close{
	margin-top: -12px !important;
	margin-right: 2px;
}

div.flat-popup .ui-dialog-titlebar.ui-widget-header {
	background-color: white;
	height: 20px;
	line-height: 20px;
	margin-bottom: 0px;
}

.ui-dialog.flat-popup .ui-dialog-titlebar-close,
.ui-dialog.popupConfirm .ui-dialog-titlebar-close,
.ui-dialog.popupError .ui-dialog-titlebar-close {
	margin-top: 2px !important;
	margin-right: 6px !important;
}

.popup .ui-icon, .popup .ui-icon:hover, .popup .ui-icon:active{
	background-image: none !important;
}

.ui-dialog .ui-dialog-title {
	margin: .1em 0px !important;
}

.textStandard{
    font-size: 14px;
}

.white_arrow{
    background-image: url('../../images/layout/white_arrow.png');
    background-repeat: no-repeat;
    width: 55px;
    height: 52px;
}

.leftmenu .col1{
    left: 100%;
    width: 71%;
}

.leftmenu .col2{
    left: 6%;
    width: 21%;
}

.leftmenu .colleft{
    right: 75%;
}

.shim{
    /* cross-browser min-width substitution
    
       Put a <div class="shim">&nbsp;</div> inside the element you want
       to hava a min-width. (http://stackoverflow.com/questions/93274/min-width-in-msie-6#93530) 
    */
    width: 300px;
    height: 0px;
    line-height: 0px;
}

#customColor{
    margin-bottom: 130px;
}

fieldset{
    margin-bottom: 20px;    
}

fieldset label{
    display: block;
    font-weight: bold;
    margin-bottom: 3px; 
}

fieldset input:not([type=submit]),
fieldset textarea{
    width: 100%;
    box-sizing: border-box;
    padding: 9px 8px;
    border: none;
    background: #f4f4f4;
    border-radius: 4px;
    box-shadow: 0 0 5px rgba(0,0,0,.5);
    position:relative;
}

fieldset input:not([type="submit"]):focus, 
fieldset textarea:focus,
fieldset select:focus{
    outline: none;
    box-shadow: 0 0 2px rgba(0,0,0,.5);
}

fieldset input[type=radio],
fieldset input[type=checkbox]{
    width: auto;
}

fieldset select{
    padding: 9px 8px 9px 8px;
    background: #f4f4f4;                  
    border: none;
    border-radius: 4px;
    box-shadow: 0 0 5px rgba(0,0,0,.5);
    position:relative;          
}

/* Better selects for Webkit */
@media screen and (-webkit-min-device-pixel-ratio:0){
    fieldset select{
        -webkit-appearance: none;   
        padding-right: 35px;
        background: #f4f4f4 url(../img/select-icon) no-repeat right center;
    }
}
    
.secondary-check{
    font-size: 12px;
}

.bottom-link.ondemand{
    height: 40px;
}

.bottom-link{
    position: absolute;
    bottom: 0px;
    width: 100%;
}    

.bottom-link a {
    font-size: 12px;
    font-weight: 300;
    bottom: 2px;
    position: absolute;
}

.bottom-link img, .bottom-link-resetpassword img {
	float: right;
}

.bottom-link-resetpassword a{
   font-size: 12px;
   font-weight: 300;
   line-height: 320px;
}

.bottom-link-resetpassword{
    margin-top: 95px;
}

.boxed-form{
    box-shadow: 3px 3px 1px 0px rgba(0, 0, 0, 0.13);
    padding: 20px;
    background: #fff;
    position: relative;
}


fieldset input:not([type="submit"]).error, 
fieldset textarea.error,
fieldset select.error,
.newsletter input.newslt-input.error:focus
{
    outline: none;
    box-shadow: 0 0 5px red;
}

label.error{
    font-weight: normal;
    color: red;
    display: inline-block;
}


#usernote-login, #usernote-password {
    position: relative;
}    



.signin #usernote-login form, .signin #usernote-password form {
    width: 320px;
}

#usernote-login {
	padding: 30px 30px 10px 30px;
	background-color: #ffffff;
	border: 10px solid #00AAAA;
    border: 10px solid rgba(0, 173, 173, .75);
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
    border-radius: 10px;
    height: 400px;
    width: 320px;
}

.call{
    display: inline-block;
    color: #fff;
    font-weight: 500;
    font-style: normal;
    padding: 11px 29px;
    word-spacing: .15em;
    position:relative;
}

/* USERTESTING CSS */





.checkTools{
    padding-bottom: 20px;
}

.helpIndent{
    padding-left: 30px;
}

.importantNote{
    background-color: #ffffbb;
    padding: 10px;
    border: 1px solid #ffddbb;
    margin-bottom: 10px; 
}

.flat-popup textarea{
    font-size: 14px;
}

#secondStep{
    margin-bottom:21px;
}

.creator{
    font-size: 12px;
    line-height: 20px;
}
    
.publicLink{
    text-decoration: underline;
    font-size: 11px;
}

a.switch{
    text-decoration: none;   
}

.switchOff{
    display: inline-block;
    width: 40px;
    height: 20px;
    background-image: url(../../images/toggle-off-usernote.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.switchOn{
    display:inline-block;
    width: 40px;
    height: 20px;
    background-image: url(../../images/toggle-on-usernote.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.notifSwitch{
    padding: 2px 10px 0px 0px;
}

.arrow-bg{
    width: 65px;
    background: url(../../images/widgets/show.png) 50px center no-repeat;
}    


/*  Braintree forms */

.bt .boxed-form{
    box-shadow: none;
    padding: 20px 34px;
    background: transparent;
    border-radius: 0px;
    position: relative;
}

.bt  .submit-form{
    text-align: left;
}

.marginTop10{
    margin-top: 10px;
}  

.marginTop20{
    margin-top: 20px;
}   

.bt .fieldset input:not([type="submit"]):not([type="checkbox"]).error, 
.bt .fieldset textarea.error,
.bt .selectContainer.error,
.bt .fieldset .select2.error
{
    border: 1px solid #FF0000;
    outline: medium none;    
}

.bt .fieldset{
    border: 0;
    margin: 0;
    padding: 0;
}


.bt .fieldset input[type=radio],
.bt .fieldset input[type=checkbox]{
    width: auto;
}

.bt .boxed-form input{
    margin-bottom: 34px;
    margin-top: 0px;
    width: 100%;
    -webkit-appearance: none;
}

.bt .boxed-form input.error {
	margin-bottom: 0px;
}

.bt .boxed-form input[type=checkbox]{
    -webkit-appearance: checkbox;
}

.bt .boxed-form input#cvv{
    margin-bottom: 0px;
}

.bt .boxed-form input[type=checkbox]{
    margin-bottom: 0px;
    width: auto;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #969696;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #969696;
    opacity: 1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #969696;
    opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #969696
}

/* Form Picker Element (<select>) */
.bt .picker {
    position: relative;
    width: 468px;
    overflow: hidden;
    border: 3px solid #e5e5e5;
    border-radius: 7px;
    max-width: 100%;
    margin-bottom: 15px;
}

.bt .expDate .picker{
    margin-bottom: 0px;
}

.bt .picker:after {
    content: "\25BE";
    z-index: 0;
    position: absolute;
    right: 4%;
    top: 4%;
    color: #243030;
    font-size: 20px;
}

.bt .picker:first-child {
    margin-left: 0;
}

.bt .picker.form-control {
	border: 1px solid #cccccc; 
	border-radius:0px; 
	margin-bottom:0px; 
	width: 385px; 
	font-size: 13px; 
	padding: 0px;
}

.bt .picker.form-control.errorInput {
    border: 1px solid #ef4747;
    margin-bottom: 0;
}

.bt .picker select {
    position: relative;
    display: block;
    min-width: 100%;
    width: 105%;
    height: 34px;
    padding: 9px 5px;
    border: none;
    background: transparent;
    outline: none;
    -webkit-appearance: none;
    cursor: pointer;
    height: 36px;
    color: #777777;
}


.bt h2.separator{
    padding: 0px 0px 15px 0px;
    margin-bottom: 32px;
    border-top: 0px;
}

.bt .expDate{
    width: 88px;
    float: left;
    margin-right: 14px;
}

form.bt{
    width: 472px;
}

.bt p{
    margin: 0px;
}

.bt .call.user {
    background: none repeat scroll 0 0 #121212;
    border: 1px solid #121212;
    color: #FFFFFF;
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    font-family: Montserrat;
    padding: 0px 20px;
    word-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
    height: 40px;
    line-height: 40px;
    border-radius: 3px;
    transition: all 0.25s ease-in-out;
}

.bt .call.user:hover{
    background-color: #fff;
    color: #121212;
}

.bt .call:hover{
    text-decoration: none;
    opacity: 0.75;
}

#upgradeBlock{
    margin: 30px;
    margin-right: 0px;
    position: relative;
    float: left;
    width: 865px;
}

#upgradeBlock.willBeDowngraded{
    width: auto;
	height: auto;
}

#upgradeBlock p, #upgradeBlock #usersText, #downgradeBlock #downgradeUsersText{
    margin-bottom: 10px;
    font-size: 14px;
    margin: 0px;
    font-weight: 400;
    display: inline-block;
}

#upgradeBlock .separator, #downgradeBlock .separator{
    border-bottom: 1px solid #e3e3e3;
    padding-bottom: 10px;
    margin-bottom: 12px;
    font-size: 13px;
    width: 100%;
}

#downgradeBlock .separator {
	border-bottom: 0px;
}

#upgradeBlock .separator img, #downgradeBlock .separator img{
    padding-bottom: 3px;
    padding-right: 10px;
}

#upgradeBlock .separator img, #downgradeTo img  {
	width: 26px;
	height: 26px;
}

.professional #upgradeBlock p img {
	width: 30px;
	height: 37px;
}

.jcolor{
    color: #2b2b2b;
}    

#currentSubscription, #upgradeTo{
    float: left;
    width: 265px;
}

#willBeDowngraded{
   float: left;
    width: 400px;
    border-left: 1px solid #c3c3c3;
    padding-left: 50px;
    margin-left: 40px;
    height: 230px;
}

#willBeDowngraded p.textStandard{
    font-size: 10pt;
    margin-top: -10px;
}    

#currentSubscription{
    width: 260px;
}

#upgradeTo{
    border-left: 1px solid #c3c3c3;
    padding-left: 50px;
    margin-left: 40px;
}

#arrow{
    position: absolute;
    top: 65px;
    left: 283px;
}

#upgradeBlock.willBeDowngraded #arrow{
    top: 80px;
}

#upgradeBlock p.subscriptionPrice, #downgradeBlock p.subscriptionPrice {   
    font-size: 15px;
    font-weight: 600;
    margin-top: 7px;
    margin-bottom: 5px;
}

#downgradeBlock p.subscriptionPrice {
    padding-top: 10px;
}

#plusButton, #minusButton, #downgradePlusButton, #downgradeMinusButton{
    cursor: pointer;
    display: inline-block;
}

#upgradeBlock #plusButton img, #downgradeBlock #downgradePlusButton img{
    padding-right: 6px;
    padding-bottom: 0px;
}

#upgradeBlock #minusButton img, #downgradeBlock #downgradeMinusButton img{
    padding-right: 0px;
    padding-bottom: 0px;
}

#plusButton, #downgradePlusButton{
    padding-left: 26px;
}

#ad{
    background-image: url("../../images/widgets/box_upgrade.png");
    background-position: left center;
    background-repeat: no-repeat;
    display: none;
    float: left;
    font-size: 13px;
    font-weight: 600;
    height: 81px;
    margin-left: 15px;
    margin-top: 42px;
    padding: 5px 0px 32px 32px;
    width: 200px;
    color: #82888c;
}

#upgradeBlock .boxTitle{
    font-size: 13px;
	padding-bottom: 26px;
}

#upgradeButton.working, .buttons.working #bigButton, #cancelling.working{
    background: transparent url(../../images/web/360-loading.gif) no-repeat center center;
    background-size: 110px 10px;
}    

#upgradeButton.working span.right{
    color: transparent;
}    

.narrow-contents .buttons.working{
    height: auto;
    width: auto;
}

.narrow-contents .working #bigButton a, .narrow-contents .working:hover #bigButton a{
	color: transparent;
}

.button-flat#undoDowngradeButton {
	margin-left: 0px;
}

.button-flat#undoDowngradeButton.working{
    background: #FFFFFF url(../../images/web/360-loading.gif) no-repeat center center ;
    background-size: 110px 10px;
    color: transparent;
}    

#bigButton{
    background-color: #121212;
    color: #ffffff;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    height: 40px;
    line-height: 40px;
    margin: 10px 20px 0 0;
    text-align: center;
    text-decoration: none;
    min-width: 140px;
    width: auto;
    padding: 0px 20px;
    border-radius: 3px;
    border:1px solid #121212;
    transition: all 0.25s ease-in-out, background-position 0s;
}

#bigButton:hover{
    background-color: #fff;
}

#bigButton a{
    color: #ffffff;
}    

#bigButton:hover a{
    color: #121212;
}    

#adUsersDiv, #adSavingsDiv{
    float: left;
}    

#adSavingsDiv{
    line-height: 1.7em;
    padding-left: 15px;
    margin-top: 15px;
}

#adSavingsDiv .jcolor{
    color: #2b2b2b;
    font-size: 22pt;
    font-weight: 600;
}    

#adSavingsDiv div{
    text-align: center;
}    

#adSavingsDiv > div.flex {
	display:flex;
}

#adUsersDiv{
    border-right: 1px solid #C7C7C7;
    height: 74px;
    padding-right: 13px;
    margin-top: 17px;
}

#adUsersDiv > div,
#adSavingsDiv > div {
    margin-bottom: 8px;
}    

#adUsers{
    padding-left: 6px;
    background-image: url("../../images/widgets/big-dot.png");
    background-position: 6px 0;
    background-repeat: no-repeat;
    color: #FFFFFF;
    font-size: 17pt;
    font-weight: 400;
    height: 30px;
    line-height: 30px;
    text-align: center;
    width: 30px;
    background-size: 30px;
}
    
.floatLeft{
    float: left;
}

.floatRight {
	float: right;
}

.cancelLink{
    padding-top: 12px;
    display: inline-block;
    color: #121212;
}

.cancelLink a {
    border-bottom: 1px solid #121212;
}

.cancelLink a:hover {
    border: 0px;
}

#usersText{
    width: 180px;
}
    
.bt .page #ajaxbutton.separator {
    border-top: 1px solid #DFDFDF;
    padding-top: 22px;
    margin-bottom: 20px;
    padding-bottom: 0px;
    border-bottom: none;
}

#downgradeBlock .textStandard {
    margin-bottom: 15px;
}

#adUsersDiv div.adUsersText{
    text-align: center;
    padding: 0px;
    margin-bottom: 0px;
}

#adUsersDiv div.floatLeft{
    margin-bottom: 0px;
    font-size: 18px;
}

#upgradeDiscountText {
    font-size: 13px;
    font-weight: 600;
    position: absolute;
    top: 158px;
    left: 470px;
}

#upgradeButton.button-flat,
#upgradeLicButton.button-flat {
	margin-left: 0px;
	line-height: 35px;
	padding: 0px 0px;
}

.subscription #upgradeDiscountText {
    right: 137px;
}

.contact-users-up,
.contact-users-down {
    cursor: pointer;
    left: 345px;
    position: absolute;
    width: 15px;
    height: 15px;
}

.contact-users-up#up {
	top: 10px;
	background-image: url('../../images/icon/spinner-up-arrow@2x.png');
	background-size: 15px 9px;
	background-repeat: no-repeat;
}

.contact-users-down#down {
	top: 25px;
	background-image: url('../../images/icon/spinner-down-arrow@2x.png');
	background-size: 15px 9px;
	background-repeat: no-repeat;
}

input[type="file"]{
    line-height: 0;
    font-size: 50px;
    position: absolute;
    opacity: 0;
    filter: alpha(opacity = 0);-ms-filter: "alpha(opacity=0)";
    cursor: pointer;
    _cursor: hand;
    margin: 0;
    padding:0;
    left:0;
}

.puContent .add-file-btn, .puContentBig .add-file-btn{
    font-size: 13px;
}    

.add-file-btn{
    position:relative;
    overflow:hidden;
    cursor:pointer;
    text-align:center;
    background-color:white;
    color:black;
    border: 1px solid black;
    display:block;
    width:104px;
    height:35px;
    font-size:14px;
    font-weight: 500;
    line-height:35px;
    float:left;
    margin-right: 15px;
    border-radius: 3px;
    transition: all 0.25s ease-in-out;
}

.add-file-btn:hover {
	opacity: 0.4;
}

#publishPrototype {
	height: 100%;
}

.file-path{
    padding-top: 8px;
    font-size: 13px;
    margin: 0px;
	height: 29px;
	color: #82888c;
}    

#userPicture {
	padding: 5px;
	background-color: white;
	border-radius: 0px;
	height: 133px;
	width: 133px;
	border: 1px solid #cdcdcd;
	margin: 0px;
    position: absolute;
    right: 155px;
    top: 40px;
}

#userPicture #hasPicture,
#userPicture .noimage #pictureImage {
	background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
}

#userPicture .noimage {
    height: 133px;
    position: relative;
    width: 133px;
    z-index: 0;
    margin: 0px;
	background-image: url("../../images/icon/upload-picture-profile@2x.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 42px 37px;
}

#userPicture img,
#userPicture #pictureImage {
	width: 133px;
    height: 133px;
    object-fit: contain;
}

.userPicture {
	margin: 0px;
}

.userPictureMedium{
   	border-radius: 26px;
    height: 52px;
    padding: 0;
    vertical-align: initial;
    width: 52px;
    object-fit: contain;
}

.form.list .userPictureMedium {
	vertical-align: middle;
}

#username_logoff .userPicture img {
    width: 43px;
    height: 43px;
    border-radius: 21px;
    padding: 0px;
    object-fit: contain;
}

#username_logoff .userPicture {
    padding-left: 17px;
    padding-right: 12px;
}    

#username_logoff .separator{
    border-right: 1px solid #c9d2d7;
    float: left;
    height: 32px;
    margin-left: 20px;
    margin-top: 6px;
}    

.memberSmall.userPictureSmall img:not(.gravatar){
    margin: 0px 5px 4px 6px;
}

.memberSmall .inviteNames {
	display: inline-block;
    height: 47px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
    width: 80%;
}    

.userPictureSmall > img {
    width:  30px;
    height: 30px;
    border-radius:17px;
    padding: 0px;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
    display: inline-block;
    object-fit: contain;
}

.dialogTitle {
    display: none;
}

.errorPopup.dialogTitle {
	margin-bottom: 0px;
    margin-top: 10px;
    font-weight: 800;
}

.leftColumn{
    float: left;
    width: 570px;
}

.rightColumn{
    float: left;
    width: 378px;
    height: 520px;
    padding-left: 20px;
    border-left: 1px solid #e3e3e3;
    overflow: auto;
}

.leftColumn input {
    margin-bottom: 20px;
    width: 535px;
    box-sizing: border-box;
}

.leftColumn textarea {
    height: 180px;
    width: 521px;
    margin-bottom: 20px;
}

.leftColumn input.errorInput {
    margin-bottom: 0px;
}

.twoColumnContainer{
    width: 971px;
}

.radio-item {
  display: inline-block;
  position: relative;
  padding: 0 6px;
  margin: 10px 0 0;
}

.radio-item input[type='radio'] {
  display: none;
}

.radio-item label {
  color: #666;
  font-weight: normal;
  position: relative;
}

.radio-item label:before {
  content: " ";
  display: inline-block;
  position: relative;
  top: 5px;
  margin: 0 4px 3px 0;
  width: 10px;
  height: 10px;
  border-radius: 8px;
  border: 2px solid #484a4f;
  background-color: #484a4f;
}

.radio-item input[type=radio]:checked + label:after {
  border-radius: 5px;
  width: 6px;
  height: 6px;
  position: absolute;
  top: 9px;
  left: 4px;
  content: " ";
  display: block;
  background: #f6f7f8;
}

.tt.radio-item label:before {
    top: 8px;
}

input[type="checkbox"] {
    display:none;
}

.plans input[type="checkbox"] {
	display:block;
	accent-color: #2b2b2b;
	margin-left: 40px;
}

.plans td {
	vertical-align: middle;
}

.plans thead td{
	text-align: center;
	width: 100px;
	font-weight: 500;
	height: 50px;
}

.plans thead td:first-of-type {
	text-align: left;
}

input[type="checkbox"] + label span {
    display:inline-block;
    width:15px;
    height:15px;
    margin: 16px 10px 0 0;
    background:url(../../images/icon/checkbox.png) left top no-repeat;
    background-size:  45px 15px;
}

.projectName input[type="checkbox"] + label span{
    margin-top: 9px;
}

input[type="checkbox"]:checked + label span {
    background:url(../../images/icon/checkbox.png) -30px top no-repeat;
    background-size:  45px 15px;
}

.projectName label{
    display: inline-block;
    line-height: 31px;
    width: 100%;
}

.boxed-form input[type="checkbox"] + label span, input[type="checkbox"].square + label span {
    margin: 0 7px -2px 0;
    background:url(../../images/icon/checkbox2.png) left top no-repeat;
    float: none;
}

.boxed-form input[type="checkbox"]:checked + label span, input[type="checkbox"]:checked.square + label span {
    background:url(../../images/icon/checkbox2.png) -27px top no-repeat;
}


.pageButtonArea{
    margin-top:35px;
    margin-bottom: 35px;
}

.pageButtonArea #ajaxbutton{
    display: inline-block;
}    

.styleGreen{
    color: #08d0d0;
}

.styleGreen14px{
    font-size: 14px;
    color: #08d0d0;
}

.text13{
    font-size: 13px;
}    

.regular{
    font-weight: 400;
}

.light{
    font-weight: 300;
}
    
#pictureFile {
    height: 140px;
    width: 140px;
    margin: 0px;
	z-index: 3;
	overflow: hidden;
}

#pictureImg {
	padding: 5px;
	background-color: white;
	border-radius: 0px;
	height: 147px;
	width: 147px;
	border: 1px solid #ced3d6;
	margin: 0px;
	position: relative;
}

#pictureImg img {
	margin: 0 auto;
    width: 147px;
    height:147px;
    object-fit: contain;
}

#userPicture .removePicture {
	width: 25px;
	height: 25px;
	z-index: 4;
}

.centerPicture {
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

.inviteUsers label{
    font-size: 14px;
    color: #393e41;
    font-weight: 600;
    padding-bottom: 8px;
    display :inline-block;
}    

.link.separator{
    border-bottom: 1px solid #d7d7d7;
    padding-bottom: 22px;
    margin-bottom: 22px;
}

#accountSelector .select2 {
	border: 1px solid #e4e7eb;
	border-radius: 5px;
	height: 36px;
}

#ajaxbutton.regButton.call.user.working, #ajaxbutton.working .regButton.call.user, #braintreeButton.working, #editVersion.working, #newVersion.working{
    background: transparent url(../../images/web/360-loading.gif) no-repeat center center;
    color: transparent;
    background-size: 110px 10px;
}

#ajaxbutton.regButton.call.user.working + .secondAction, #ajaxbutton.working .regButton.call.user + .secondAction{
    display: none;
}

.clearlink {
	font-size: 13px;
	border-bottom: 1px solid #2b2b2b;
}

.clearlink:hover {
	border-bottom: 0px;
}

.editor{
    height: 50px;
    border-bottom: 0px;
    cursor: auto;
}

.editorText{
    width: 195px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    color: #313131;
}

.editorText img.userPictureMedium{
    margin-left: 0px;
    vertical-align: middle;
}

.editor .removeReviewer, .editor .resendInvitation, .editor .removeReviewer img, .editor .resendInvitation img{
    margin-right: 0px;
}

.search{
    position: relative;
    display: inline-block;
}
    
.search .form-control:focus{
	border: none;
    border-bottom: 1px solid #ced3d6;
}
    
.search .form-control {
    background-color: #ffffff;
    border: none;
    height: 40px;
    outline: medium none;
    position: absolute;
    right: 0;
    width: 100px;
    padding-left: 40px;
    padding-right: 0px;
    background: rgba(0, 0, 0, 0) url("../../images/icon/searchbar-icon.png") no-repeat scroll 12px 10px;
    border-left: 1px solid #ced3d6;
    border-radius: 0px;
    transition: all .25s ease;
}

.form-control {
    background-color: #FFFFFF;
    background-image: none;
    border: 1px solid #CCCCCC;
    color: #777777;
    display: block;
    font-size: 15px;
    height: 35px;
    line-height: 1.4;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}

.search #searchButton:hover {
    background-color: transparent;
    color: black;
}

.search #searchButton {
	background-color: #121212;
    border: medium none;
    color: white;
    display: none;
    font-size: 10px;
    padding: 4px 10px;
    position: absolute;
    right: 0;
    top: 8px;
    border-radius: 3px;
    border: 2px solid #121212;
}

.i-loupe {    
    height: 30px;
    width: 30px;
    color: rgba(0, 0, 0, 0);
    font: 0px/0 a;
    background: url("../../images/sprite.png") no-repeat scroll -300px -100px rgba(0, 0, 0, 0);
    display: inline-block;
    vertical-align: middle;
}

.sort-control{
    width: 100px;
    display: inline-block;
    position: absolute;
}

.sort-control .selectContainer {
    border: 2px solid #21C0C0;
    line-height: 41px;
    width: 175px;
    background-position: 150px;
}

.sort-control .selectContainer select{
    width: 210px;
    outline: none;
}

.form .form-control{
    margin-bottom: 20px;
}

.license.add-file-btn {
    width: auto;
    padding: 0px 10px;
}

.downloadBanner {
    margin-top: 45px;
    font-size: 13px;
}

.downloadBanner a {
    display: inline-block;
    font-size: 15px;
    padding: 7px 0px;
    transition: all 0.25s ease-in-out;
    text-transform: none;
    border-radius: 3px;
    font-weight: 500;
    text-align: center;
    background-position: left top;
    text-decoration: none;
    border: 1px solid #121212 !important;
    margin-top: 13px;
    width: 195px;
}

.empty .downloadBanner {
	margin-top: 15px;
}

.downloadBanner a:hover {
    opacity: 0.6;
    border: 1px solid #121212;
}

.downloadBanner a {
    color: #121212 !important;
    box-sizing: content-box;
}

.expanded{
    width: 16px;
    height: 12px;
    background-image: url(../../images/icon/selectArrow.png);
    background-repeat: no-repeat;
    display: inline-block;
    background-position: 0px 3px;
}

.collapsed{
    width: 16px;
    height: 12px;
    background: url(../../images/icon/selectArrow2.png) left center no-repeat;
    background-repeat: no-repeat;
    display: inline-block;
    background-position: 3px 0px;
}

.lock {
	bottom: 30px;
    position: absolute;
    right: 20px;
}

.col-left-img {
	position: relative;
	height: 328px;
}

.marginTop15 {
	margin-top: 15px;
}

#invoiceTable {
	width: 100%;
	border: 1px solid #e5e9eb;
	margin-top: 25px;
	border-collapse: collapse;
}

#invoiceTable tr:first-child{
	background-color: #f6f7f8;
	height:40px;
}

#invoiceTable tr:not(:first-child) {
	height:46px;
	border-bottom: 0.5px solid #ced3d6;
}

#invoiceTable td {
	padding-left: 22px;
	font-size: 12.5px;
	color: #2b2b2b;
	width: 300px;
}

#invoiceTable td a {
	padding-bottom: 1px;
	border-bottom: 1px solid #2b2b2b;
}

#invoiceTable td a:hover {
    border-bottom: 0px;
}

#invoiceTable tr:first-child td {
	font-weight: 500;
}

.rzContents {
	width: auto;
	height: auto;
	background-color:#ffffff;
    z-index:1002;
}

.rzContents .selectContainer {
	background: #ffffff url("../../images/icon/selectArrow.png") no-repeat scroll 210px center;
}

.popupTitle {
	font-size: 18px;
	font-weight: 800;
	margin-top: 10px;
	line-height:22px;
}

.popupMessage{
    font-size:12.7px;
    min-height: 70px;
}

.info-bold {
	font-size: 17px;
	margin-top: 20px;
}

.info-big .floatRight {
    float: right;
    width: 150px;
    text-align: end;
    padding-right: 40px;
    font-size:17px;
}

.info-big .floatLeft {
	font-size:17px;
}

#renewPrice {
	color: black;
	font-weight:600;
	font-size: 17px;
}

.member .userInfo .ownerText {
	font-size: 12px; 
	color: red; 
	display:inline-block;
}

.member .userInfo .developerText {
    font-size: 12px; 
    color: #9c70bf; 
    display:inline-block;
}

.member .userTags .readOnly.ownerText{
    color: white;
    background-color: #ff6575;
    padding: 1px 5px 1px 5px;
    border-radius: 3px;
    font-size: 11px;
    text-transform: capitalize;
    font-weight: 600;
	letter-spacing: 0px;
}

.member .userTags {
    position: absolute;
    right: 10px;
    top: 14px;
    display:inline-block;
}

.member .userTags .readOnly.developerText{
    color: white;
    background-color: #9c70bf; ;
    padding: 1px 5px 1px 5px;
    border-radius: 3px;
    font-size: 11px;
    text-transform: capitalize;
    font-weight: 400;
    letter-spacing: 0px;
}

.account .accountTab {
	background-color: white;
    display: inline-block;
    height: 20px;
    cursor: pointer;
    width: 49.5%;
    text-align: center;
    border-bottom: 2px solid #e5e5e5;
    padding-bottom: 8px;
    color: #969696;
    font-size: 12px;
    font-weight: 400;
}

.account .accountTab.selected {
	border-bottom: 2px solid #21c0c0;
	color: #222;
	font-weight: 600;
}

.form.account #box {
	background-color:#f3f3f3; 
	width: 850px; 
	height: 355px;
}

.form.account #modifyAccountForm label{
  margin-top: 2px;
}

.form.account .ellipsisText {
	display:block; 
	overflow: hidden; 
	text-overflow: ellipsis;
	padding-right: 10px;
	white-space: nowrap;
}

.form.account #currentAccountForm {
	float:left; 
	border: 2px solid #21c0c0; 
	border-radius: 5px; 
	background-color: white; 
	padding-left: 25px; 
	margin: 20px 20px 20px 25px; 
	padding-right: 25px;
}

.form.account #currentAccountForm .readText {
	height: 36px; 
	line-height: 36px; 
	margin-bottom: 11px; 
	margin-left: 0; 
	width: 155px; 
	overflow: hidden; 
	text-overflow: ellipsis;
}

.form.account #modifyAccountForm select {
	width: 197px;
}

.accountSection.professional #upgradeBlock {
	width: 100%; 
	height:200px; 
	margin-top:0px;
}

.accountSection.professional .separator {
	padding-top: 75px; 
	position: absolute; 
	width: 92%;
}

.accountSection.professional #professionalUsers {
	background-color: #121212;
    border-radius: 22px;
    color: white;
    font-size: 25px;
    font-weight: 600;
    margin-left: 10px;
    padding: 2px 12px;
    height: 36px;
    display: inline-block;
}

.accountSection.professional #upgradeTo {
	background-color: white;
    border: medium none;
    box-shadow: 0 0 15px #dddddd;
    margin-left: 40px;
    margin-top: 34px;
	padding: 30px;
    text-align: center;
    position:relative;
}

.accountSection.professional #contactUpgradeProfessional {
	float: none;
    margin: 0 auto;
    width:120px;
    padding: 0px;
    line-height:35px;
}

.initDB .selectContainer select {
    width: 360px;
    font-size: 13px;
    color: #969696;
}

.initDB input {
	margin-bottom: 18px;
    width: 100% !important;
}

.initDB #authType-field .select2{
  margin-bottom: 18px !important;
}

.initDB .selectContainer {
	background: #ffffff url("../../images/icon/selectArrow.png") no-repeat scroll 300px center;
  margin-top: 0;
  width: 320px;
}

.configLicense {
	background-color: white;
	padding: 35px 30px;
	font-size: 12px;
}

.configLicense #leftcol {
	float:left; 
	padding-right:30px; 
	border-right:1px solid #c5c5c5; 
	width:305px;
}

.configLicense #rightcol {
	float:left; 
	padding-left: 35px;
	padding-top: 5px;
}

.configLicense #leftcol .margin,
.configLicense #rightcol .margin {
	margin-bottom:45px;
}

.configLicense #leftcol > div > div {
	padding-left: 60px;
    padding-top: 5px;
}

.configLicense span {
	text-transform: uppercase;
	font-weight: bold;
}

.thanks {
	padding: 60px 110px 40px;
    text-align: center;
}

.thanks #heartLogo {
	background-image: url("../../images/icon/thanks-hearth-icon@2x.png");
	background-repeat: no-repeat;
	background-size: 42px 38px;
	width: 42px;
	height: 38px;
	margin: 0 auto;
	margin-bottom: 10px;
}

.thanks span {
    font-size: 27px;
    font-weight: 900;
}

.thanks #title {
    color: #969696;
    font-size: 16px;
    font-weight: 300;
    margin-bottom: 20px;
    text-align: center;
}

.thanks #message {
    color: #969696;
    font-weight: 300;
    margin: 0 auto 50px;
    padding-top: 8px;
    text-align: center;
}

.thanks .secondAction {
	color: black;
}

#emptyResults {
	background-image: url("../../images/icon/noresults-img@2x.png");
	background-repeat: no-repeat;
	background-size: 115px 116px;
	width: 100%;
    height: 350px;
    background-position: center center;
}

#userList {
	display: none; 
	height: 70px; 
	padding: 7px; 
	border: 1px solid #d5d5d5; 
	margin-top: 10px; 
	overflow: auto;
}

#viewMore {
	cursor: pointer;
	user-select:none;
	font-weight: 400;
	color: #969696;
	text-decoration: underline;
}

.hosted-field{
  height: 43px;
  border: 1px solid #cdcdcd;
  transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;    
  box-shadow: none;
  box-sizing: border-box;
  padding: 6px 12px;      
}

.hosted-field.error{
  border: 1px solid #ef4747;
}

div.hosted-field.braintree-hosted-fields-focused{
  border-color: #21c0c0;
  outline: none;
}


.loading {
  background-color: transparent;
  font-size: 0px;
  background-image: url("../../images/widgets/dots-moving.gif");
  background-repeat: no-repeat;
  background-size: 90px 15px;
  background-position: 0px -2px;
  width: 90px;
  display: inline-block;
  line-height: 17px;
  border-bottom: 0px !important;
}

.invoiceNumber, .invoiceFile {
  display:none;
}

.bigToken {
  font-size: 56px;
  text-align: center;
  border: 2px solid #e2e2e2;
  margin: 5px;
  padding-top: 15px;
  padding-bottom: 15px;
}

.boldBlack {
    color: #121212;
    font-weight: 700;
}

#contact_link{
    color: #fff;
    font-weight: 600;
    font-size: 15px;
}

#contact_link:hover{
    color: #121212;
}

.deleteTrash {
	background-color: #f6f7f8;
	color: #82888c;
	font-size: 12px;
	height: 47px;
	line-height: 47px;
	padding-left: 20px;
	margin-bottom: 30px;
}

.deleteTrashButton {
	float:right;
}

.deleteTrashButton a {
	border: 1px solid #121212;
	border-radius: 3px;
	color: #2b2b2b;
	margin-right: 25px;
	line-height: 27px;
	padding: 5px 15px;
}

.deleteTrashButton a:hover{
	color: #82888c;
}

.empty img{
	height: 80px;
	margin-bottom: 10px;
}

.empty{
	font-size: 13px;
	text-align: center;
	position: relative;
	margin: 0 auto;
	margin-top: 60px;
	height: 180px;
	padding-top: 25px;
}

.empty div {
	text-align: center;
	color: #2b2b2b;
	margin-top: 5px;
}

.empty div.bold {
	font-size: 15px;
}

.popup .empty div {
	color: #82888c;
}

.users-list-container .empty img {
	height: 50px;
	margin-bottom: 5px;
}

.users-list-container .empty {
	font-size:12px;
	padding-top: 15px;
	height: 145px;
}

.icon-mini{
	width: 20px;
	height: 20px;
	margin-left: 9px;
	margin-right: 8px;
	margin-top: -5px;
}

.table-popup{
	height: 250px;
	overflow-y: scroll;
	font-size: 13px;
	font-weight: 400;
	border:1px solid #dadada;
	width:470px;
}

.table-popup div{
	border-bottom: 0.5px solid #ced3d6;
	font-size: 12px;
	font-weight: 500;
	cursor: pointer;
	line-height: 40px;
	color: #2b2b2b;
	text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    margin: 0px;
    white-space: nowrap;
}

.table-popup input[type="radio"]{
	visibility: hidden;
}

.table-popup div.current {
	background-color: #f6f7f8; 
}

.ui-dialog-content .popup-content-title {
	font-size:13px;
	margin-top: -6px;
	margin-bottom: 18px;
}

.userImage36 {
	width: 36px;
	height: 36px;
	border-radius: 18px;
	padding: 0px;
	object-fit: contain;
}

.userImage30 {
	width: 30px;
	height: 30px;
	border-radius: 15px;
	padding: 0px;
	object-fit: contain;
}

.userCard {
	display: flex;
	margin-bottom: 18px;
}

.userCard .username {
	margin-left: 15px;
	color: #2b2b2b;
	font-size: 14px;
	font-weight: 500;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 320px;
	white-space: nowrap;
}

.userCard .username .email {
	color: #82888c;
	font-size: 12px;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 320px;
	white-space: nowrap;
}

.userCard .select2{
	width: 95px !important;
	height: 30px;
}

.userCard .select2 .select2-selection--single{
	padding: 0px 0px 0px 9px;
}

.userCard .select2-selection__rendered{
	line-height: 27px;
	color: #484a4f;
}

.users-list{
  overflow: hidden;
  overflow-y: auto;
  height: 240px;
}

span.checkbox {
	width: 15px;
	height: 15px;
	margin: 12px 10px 0 0;
	background: url(../../images/checkbox.png) left top no-repeat;
	background-size: 45px 15px;
}

span.checkbox.active {
  background: url(../../images/icon/checkbox.png) -30px top no-repeat;
  background-size: 45px 15px;
}

span.lock {
	width: 10px;
	height: 14px;
	position: static;
	margin: 12px 10px;
}

span.lock {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10.0' height='13.75' viewBox='18.500000000001137 2.0000000000000284 10.0 13.75' preserveAspectRatio='none'%3E%3Cg%3E%3Cdefs%3E%3Cpath id='mi-2c7e51a0-Path_12-c85bb' d='M23.500122070313637 2.0000000000000284 C25.567993164063637 2.0000000000000284 27.250000000001137 3.7668685913086217 27.250000000001137 5.939020792643258 L27.250000000001137 5.939020792643258 L27.250000000001137 8.216667175292997 L28.222981770834473 8.21710459391279 C28.356689453126137 8.21710459391279 28.471557617188637 8.323275248209665 28.495442708334473 8.458816528320341 L28.500000000001137 8.51087188720706 L28.500000000001137 15.448115030924507 C28.500000000001137 15.612248738606798 28.373413085938637 15.750000000000028 28.222981770834473 15.750000000000028 L28.222981770834473 15.750000000000028 L18.777018229167805 15.750000000000028 C18.626586914063637 15.750000000000028 18.500000000001137 15.612248738606798 18.500000000001137 15.448115030924507 L18.500000000001137 15.448115030924507 L18.500000000001137 8.51087188720706 C18.500000000001137 8.351249694824247 18.626586914063637 8.21710459391279 18.777018229167805 8.21710459391279 L18.777018229167805 8.21710459391279 L19.750000000001137 8.216667175292997 L19.750000000001137 5.939020792643258 C19.750000000001137 3.817385355631539 21.354899088542805 2.0824000040690387 23.356486002605305 2.0028508504232057 Z M23.500122070313637 3.4828364054362266 C22.21040852864697 3.4828364054362266 21.161173502605305 4.584398905436226 21.161173502605305 5.939020792643258 L21.161173502605305 5.939020792643258 L21.160685221355305 8.216667175292997 L25.838663736980305 8.216667175292997 L25.839029947917805 5.939020792643258 C25.839029947917805 4.628094991048206 24.85640462239697 3.554166158040393 23.624145507813637 3.4862467447916954 Z '%3E%3C/path%3E%3C/defs%3E%3Cg style='mix-blend-mode:normal'%3E%3Cuse xmlns:xlink='http://www.w3.org/1999/xlink' xlink:href='%23mi-2c7e51a0-Path_12-c85bb' fill='%23484A4F' fill-opacity='1.0'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

span.lock.open {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10.0' height='13.75' viewBox='18.500000000001137 2.0 10.0 13.75' preserveAspectRatio='none'%3E%3Cg%3E%3Cdefs%3E%3Cpath id='mi-2c7e51a0-Path_11-c85bb' d='M23.500122070313637 2.0 C25.567993164063637 2.0 27.250000000001137 3.7668685913085933 27.250000000001137 5.9390207926432295 L27.250000000001137 5.9390207926432295 L25.839029947917805 5.9390207926432295 C25.839029947917805 4.584398905436197 24.789794921876137 3.482836405436198 23.500122070313637 3.482836405436198 C22.21040852864697 3.482836405436198 21.161173502605305 4.584398905436197 21.161173502605305 5.9390207926432295 L21.161173502605305 5.9390207926432295 L21.160685221355305 8.216667175292969 L28.222981770834473 8.217104593912762 C28.356689453126137 8.217104593912762 28.471557617188637 8.323275248209637 28.495442708334473 8.458816528320312 L28.500000000001137 8.510871887207031 L28.500000000001137 15.448115030924479 C28.500000000001137 15.61224873860677 28.373413085938637 15.75 28.222981770834473 15.75 L28.222981770834473 15.75 L18.777018229167805 15.75 C18.626586914063637 15.75 18.500000000001137 15.61224873860677 18.500000000001137 15.448115030924479 L18.500000000001137 15.448115030924479 L18.500000000001137 8.510871887207031 C18.500000000001137 8.351249694824219 18.626586914063637 8.217104593912762 18.777018229167805 8.217104593912762 L18.777018229167805 8.217104593912762 L19.750000000001137 8.216667175292969 L19.750000000001137 5.9390207926432295 C19.750000000001137 3.8173853556315107 21.354899088542805 2.0824000040690103 23.356486002605305 2.0028508504231772 Z '%3E%3C/path%3E%3C/defs%3E%3Cg style='mix-blend-mode:normal'%3E%3Cuse xmlns:xlink='http://www.w3.org/1999/xlink' xlink:href='%23mi-2c7e51a0-Path_11-c85bb' fill='%23484A4F' fill-opacity='1.0'%3E%3C/use%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.popupText {
	font-size: 13px;
	font-weight: 400;
	margin-top: -6px;
	margin-bottom: 18px;
}

.popupWarning {
	padding: 10px;
  	font-size: 13px;
  	margin-right: 10px;
	margin-bottom: 20px;
	background-color: rgba(253,244,0,0.2);
	font-weight: 400;
	padding-left: 32px;
	background-image: url('../../images/warning.png');
	background-repeat: no-repeat;
	background-size: 15px 15px;
	background-position: 8px 12px;
}

div.userCartouche:after{
  display: inline-block;
  content: "\00d7"; /* This will render the 'X' */
  color: #82888c;
  padding-right: 5px;
  vertical-align: middle;
  cursor:pointer;
}
  
.userCartouche{  
  border: 1px solid #dadada;
  border-radius: 20px;
  display: inline-block;
  height: 25px;
  box-sizing: border-box;
  margin: 3px;
  cursor: default;
}

.userCartouche .image {
  display: inline-block;
  margin-left: 4px;
}

.userImage16 {
	width: 16px;
	height: 16px;
	border-radius: 9px;
	object-fit: contain;
}

.userCartouche .username {
	margin-left: 3px;
	color: #2b2b2b;
	font-size: 12px;
	font-weight: 400;
	margin-right: 7px;
	display: inline-block;
	vertical-align: middle;
	font-family: Montserrat;
    max-width: 135px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

#multiselect-container .userCard .username {
  margin-left: 15px;
  color: #2b2b2b;
  font-size: 14px;
  font-weight: 500;
  margin-top: 2px;
}

#multiselect-container .userCard {
  display: flex;
  padding-bottom: 7px;
  padding-top: 7px;
  margin-top: 1px;
  margin-bottom: 1px;
  cursor: pointer;
  font-family: Montserrat;
  padding-left: 15px;
}

#multiselect-container .userCard:hover {
  background-color: #f9f9f9;
}

#multiselect-container .userCard .username .email {
  color: #82888c;
  font-size: 12px;
  display: block;
}

.puContent.add-users.isFree,
.under_buttons.isFree,
.puContent.add-users.isFree .users-list.invite > * {
    pointer-events: none;
    opacity: 0.7;
}

.puContent.add-users.isFree .users-list.invite {
	pointer-events: auto;
}

.users-list-container{
  width: 424px;
  display: none;
  transition: height 2s ease;
  position: absolute;
  background-color: #fff;
  left: -1.5px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  z-index: 1;
  border: 1.5px solid #0099ff;
  border-top: 1px solid transparent;
}

.multiselect-users-list{
  overflow: hidden;
  overflow-y: auto;
  height: 195px;
  padding-top: 5px;
}

#search input[type="text"],
#search input[type="text"]:focus,
#search input[type="text"]:active {
  border: 0px;
  border-color: #fff;
  outline: none !important;
  color: #2b2b2b;
  line-height: 31px;
  font-family: Montserrat;
  font-size: 13px;
  width: 100%;
  margin-bottom: 0px;
  height: auto;
  padding-left:0px;
}

#search input.notEmpty::placeholder{
  color: #fff;
}

#multiselect-container{
  display: flex;
  flex-wrap: wrap;
  width: 424px;
  border: 1px solid #ced3d6;
  border-radius: 4px;
  min-height: 43px;
  max-height: 73px;
  margin: 0;
  background-color: #fff;
  margin-right: 82px;
  position: relative;
}

#multiselect-container.open{
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
	border: 1.5px solid #0099ff;
	border-bottom: 1px solid #e7e9eb;
	top: -0.5px;
	left: -0.5px;
}

#multiselect-container .select2{
    width: 100px !important;
    border: 0px;
    color: #484a4f;
    position: absolute;
}

#multiselect-container .select2.select2-container--open {
	top: 0px;
	left: 4px;
}

#multiselect-container > #dropdown {
	width: 100%;
	min-height: 43px;
	max-height: 73px;
	overflow-y: auto;
	overflow-x: hidden;
	display: flex;
	flex-wrap: wrap;
}

#search,
#search-group {
  padding: 5px 0px 5px 14px;
  transition: all 2s ease;
  width: 280px;
  margin:0px;
}

#search input[type="text"].term {
	font-size:11px;
}

#multiselect-container .search-group {
  width: calc(100% - 30px);
  border-left: none;
}

#multiselect-container.add-group input.term.notEmpty {
	display: none;
}

.select2-container--invite.select2-container--open .select2-dropdown {
  box-shadow: 0 1px 4px 2px rgb(0 0 0 / 10%);
  width: 95px !important;
  border: 0px;
  top: -3px;
}

#select-role {
	width: 104px;
	height:43px;
	margin:0px;
	margin-left:4px;
	border-right: 1px solid #e7e9eb;
	border-radius: 0px;
}

#adduser{
  height: 45px;
  border-top: 1px solid #e7e9eb;
  padding-left: 15px;
}

#adduser a{
  font-family: Montserrat;
  font-size: 13px;
  color: #2b2b2b;
  text-decoration: none;
  border-bottom: 1px solid #2b2b2b;
  line-height: 11px;
  margin-left: 7px;
  margin-top: 17px;
  display: inline-block;
  vertical-align: top;
  padding-bottom: 2px;
}

#adduser a:hover{
  border-bottom: 0px;
}

.addusers{
  height: 20px;
  width: 26px;
  padding-top: 13px;
}

.users-list.invite{
	margin-top: 24px;
	width: 520px;
	padding-right: 15px;
	position: relative;
}

.users-list.invite.hidden {
	display: none;
}

.userCard .owner{
	background-color: #eaeaea;
	border-radius: 15px;
	font-size: 12px;
	color: #2b2b2b;
	font-weight: 400;
	font-style: italic;
	line-height: 24px;
	height: 24px;
	text-align: center;
	margin-top: 6px;
	margin-right: 0px;
	margin-left: 0px;
	padding: 0px 15px;
}

a#searchadd.button {
	position: absolute;
	top: 0px;
	right: 34px;
	margin: 0;
	width: 60px;
	height: 32px;
	padding: 0;
	line-height: 32px;
	font-size: 13px;
}

.userCard .options,
.userCard .removeUserIcon {
	margin-left: 5px;
	margin-right: 0px;
	margin-top: 3px;
}

.userCard .options img {
	height: 16px;
	cursor: pointer;
}

.userCard .removeUserIcon img {
	height: 21px;
	cursor: pointer;
}

.userCard .project-menu, .member .project-menu{
	position: fixed;
}

.linkarea{
	padding: 4px 34px 30px 34px;
	background-color: #f8f9f9;
	border-top: 1px solid #e3e6e7;
	border-radius: 0px 0px 5px 5px;
}

.linkarea p{
	font-size: 14px;
	font-weight: 500;
	color: #2b2b2b;
	margin-bottom: 8px;
}

.select2.select2-container--invitegetlink{
	width: 275px !important;
}

a.copyLink{
	position: relative;
	margin-left: 20px;
}

div.ui-dialog {position:fixed;} 

input.newfolder {
	width: 200px;
}

.user{
	padding-left: 12px;
}

.user .email {
	padding-left: 8px;
	color: #82888c;
	font-weight: 400;
}

.user .owner {
	padding-right: 20px;
	float: right;
	font-style: italic;
}

.projects .projectName {
	color: #2b2b2b;
}

.projects .project .projectName svg{
	transform: rotate(-90deg);
	transition: transform 0.5s ease;
}

.projects .project.open .projectName svg{
    transform: rotate(0deg);
}

.projects .project.folder {
	cursor: pointer;
}

.project img.icon-test {
	height: 16px;
	width: 16px;
}

.bottom-img {
	height: 62px;
}

.projects.history th,
.projects.changes th {
	cursor: pointer;
}

.projects.history .version {
	width: 70px;
	text-align: center;
}

.projects.history .date,
.projects.history .user {
	width: 150px;
}

.projects .user-annotation {
	width: 30px;
}

.projects .user-editor {
	height: 35px;
}

.projects.changes .action {
	width: 70px;
	padding-left:15px;
}

.projects.changes .type {
	width: 105px;
}

.projects.history thead,
.projects.changes thead, 
.projects.history tbody tr,
.projects.changes tbody tr {
	display: table;
	width: 100%;
	table-layout: fixed;
	color: #2b2b2b;
}

.projects.history thead,
.projects.changes thead {
	background-color: #f6f7f8;
}

.projects.history tbody,
.projects.changes tbody {
	display: block;
    height: 300px;
    overflow-y: auto;
}

.projects.history td {
	padding-left:2px;
}

table.projects.history {
	width: 700px;
}

table.projects.changes {
	width: 420px;
}

.projects.history tbody tr[selected="selected"] {
	background-color: #D9F0FF;
	font-weight: 600;
}

#changes-pane {
	display: flex;
	margin-top:18px;
}

#changes-pane p {
	font-size: 12px;
	line-height: 6px;
	font-weight: 600;
}

table.projects.history,
table.projects.changes {
	border: 1px solid #cecece;
}

table.projects.history tr,
table.projects.changes tr {
	height: 40px;
}

table.projects.changes {
	height: 90px;
	width: 420px;
}

.projects.changes tbody {
	display: block;
    height: 80px;
    overflow-y: auto;
}

.project img.icon-annotation {
	height: 16px;
	width: 14px;
	cursor: pointer;
}

#changes-pane .annotation {
	width: 250px;
	margin-left: 30px;
	position: relative;
}

#changes-pane #annotation-area {
	border: 1px solid #cdcdcd;
	height: 120px;
}

#changes-pane .annotation textarea {
	width: 100%;
	height: 95px;
	font-size: 13px;
	resize: none;
    border: none;
    overflow: auto;
    outline: none;
}

#changes-pane .annotation #save-comment-button {
	right: 15px;
	position: absolute;
	bottom: 6px;
	font-size: 13px;
	cursor: pointer;
}

#user-separator {
	border-bottom: 1px solid #cdcdcd; 
	margin: 20px 0 30px 0;
}

#user-profile {
	display:inline-block;
	vertical-align:top;
}

#edit-user-profile #user-name {
	max-width: 400px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

#edit-user-profile #user-email {
	display: inline-block; 
	max-width: 290px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

#user-profile-data {
	font-size: 12.5px;
	font-weight: 500;
	color: #82888c;
}

#user-profile-activations {
	display: inline-block;
	position: absolute;
	right: 40px;
}

.getstarted{
	text-align: center;
	width: 580px;
	margin: 0 auto;
	margin-top: 80px;
}

.getstarted img{
	height: 50px;
}

.getstarted h1{
	font-size: 26px;
	font-weight: 700;
	color: #333333;
}

.getstarted h2{
	font-size: 13.5pt;
	font-weight: 400;
	color: #000000;
	line-height: 34px;
}

.getstarted a.button {
	margin-top: 20px;
	margin-bottom: 35px;
}

.getstarted a.link{
	color: #0099ff;
	text-decoration: none;
	border-bottom: 1px solid #0099ff;
}

.getstarted a.link:hover{
    border-bottom: 0px;
}

.getstarted hr{
	color: #e7e9eb;
	width: 500px;
	margin: 0 auto;
}

div#notifications {
	position: sticky;
	height: auto;
	width: auto;
	bottom: 5px;
	margin: 0 auto;
	pointer-events: none;
}

div#notifications .notification {
	margin-bottom:5px; 
	text-align: center; 
	font-size:13px;
	font-weight:500;
	background-color: #0099FF; 
	color: white; 
	height: 28px; 
	padding: 5px 13px; 
	display: none; 
	border-radius: 3px; 
	line-height: 28px;
}

.testURL {
	color: #82888c;
	font-size: 13.33px;
	width: 470px;
	text-indent: 0px;
	padding-left: 0px;
	word-break: break-all;
}

#password-popup {
  display: none;
  position: absolute;
  padding: 2.5px 0px 0px 15px;
  z-index: 200;
}

#password-popup p {
  text-align: start;
}

#password-popup .popup-title {
  font-size: 13px;
  color: #484A4F;
  margin-block-end: 0.5em;
}

#password-popup .condition {
  display: flex;
  align-items: center;
}

#password-popup .condition p {
  font-size: 12.5px;
  margin-block-start: 0.285em;
  margin-block-end: 0.285em;
}

#password-popup .condition.NONE p {
  color: #82888C;
}

#password-popup .condition.PASS p {
  color: #0099FF;
}

#password-popup .condition.FAIL p {
  color: #F24541;
}

#password-popup .condition .condition-image {
  width: 16px;
  height: 16px;
  background-size: 16px 16px;
  margin-right: 0.4em;
  margin-left: 0px;
}

#password-popup .condition.NONE .condition-image {
  background-image: url("../../images/web/dot_icon_signin_dialog@2x.png");
}

#password-popup .condition.PASS .condition-image {
  background-image: url("../../images/web/check_icon_signin_dialog@2x.png");
}

#password-popup .condition.FAIL .condition-image {
  background-image: url("../../images/web/cross_icon_signin_dialog@2x.png");
}

span.eye{    
    background-image: url("../../images/web/show_icon_signin_dialog@2x.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 30px 30px;
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 7.5px;
    right: 16px;
    z-index: 1;
    cursor: pointer;
}

span.eye.visible{
    background-image: url("../../images/web/hide_icon_signin_dialog@2x.png");
}

input.shortInput {
	width: 200px;
}

input.mediumInput {
    width: 650px;
}

.ssoSettings input{
	width: 750px;
}

.ssoSettings textarea{
	width: 750px;
	height: 220px;
}

.ssoSettings input[type=checkbox] {
	display: none;
}

.ssoSettings input[type=checkbox] ~ label {
    display:inline-block;
    padding: 0 0 0 50px;
    background:url(../../images/toggle-off-usernote.png) no-repeat;
    height: 20px;
    background-size: 40px 20px;
}

.ssoSettings input[type=checkbox]:checked ~ label {
    background:url(../../images/toggle-on-usernote.png) no-repeat;
    height: 20px;
    display:inline-block;
    background-size: 40px 20px;
}

a.quote_link {
	font-weight: 400;
	border-bottom: 1px solid #2b2b2b;
}

a.quote_link:hover {
	border-bottom: 0px;
}