overleaf/services/web/frontend/stylesheets/app/subscription.less

.form-helper {
	display: inline-block;
	width: 1.3em;
	height: 1.3em;
	line-height: 1.3;
	vertical-align: initial;
	background-color: @gray;
	color: #FFF;
	font-weight: bolder;
	border-radius: 50%;

	&:hover,
	&:focus {
		color: #FFF;
		text-decoration: none;
	}
}

.price-breakdown {
	text-align: center;
	margin-bottom: -10px;
}

.input-feedback-message {
	display: none;
	font-size: 0.8em;

	.has-error & {
		display: inline-block;
	}
}

.payment-submit {
	padding-top: (@line-height-computed / 2);
}

.payment-method-toggle {
	margin-bottom: (@line-height-computed / 2);

	&-switch {
		display: inline-block;
		width: 50%;
		text-align: center;
		border: solid 1px @gray-lighter;
		border-radius: @border-radius-large 0 0 @border-radius-large;
		padding: (@line-height-computed / 2);
		color: @btn-switch-color;

		&:hover,
		&:focus {
			color: @btn-switch-color;
			text-decoration: none;
		}

		&:hover {
			color: @btn-switch-hover-color;
		}

		& + & {
			border-left-width: 0;
			border-radius: 0 @border-radius-large @border-radius-large 0;
		}

		&-selected {
			color: @link-active-color;
			box-shadow: inset 0 -2px 0 0;

			&:hover,
			&:focus {
				color: @link-active-color;
			}
		}
	}
}

.team-invite .message {
	margin: 3em 0;
}

.capitalised {
	text-transform:capitalize;
}

.three-d-secure-container {
  > .three-d-secure-recurly-container {
    height: 400px;

    > div[data-recurly="three-d-secure-container"] {
      height: 100%;
    }
  }
}