.text-and-link > a {

	display: block;

	text-decoration: none;

	color: inherit; }



.text-and-link .separator {

	display: none; }



.text-and-link {

	margin: 85px auto; }



.text-and-link-wrapper {

	position: relative;

	padding: 110px 70px;

	background-color: #000; }

.text-and-link-wrapper .title {

	font-size: 3rem;

	line-height: 3rem;

	text-align: center;

	color: #fff;

	font-weight: 600; }


.text-and-link-wrapper:after {

	content: "";

	z-index: -1;

	position: absolute;

	top: 0; right: -60px; bottom: -60px; left: 0;

	margin: auto;

	width: 100%;

	height: 100%;

	background: url(../../svg/dot-grey.svg) bottom right; }



.text-and-link .arrow {

	transition: var(--basic-transition);

	display: block;

	margin: 20px auto 0; }



.text-and-link a:hover .arrow {

	transform: translate(25px, 0); }



@media (min-width: 768px) {

	.text-and-link .separator {

		display: inline-block; }



	.text-and-link > a {

		display: inline-block;

		vertical-align: middle;

		padding-right: var(--gutter);

		width: calc(var(--col-6) - var(--gutter)); }



	.text-and-link-wrapper {

		width: 100%; }

}