/*******************************************************
 * Textbox Styles
 *
 * Includes custom styling for the Textbox pattern
 *
 *******************************************************/

.path-patterns .textbox__content {
	margin: initial;
	position: initial;
}

.textbox__content {
	background-color: var(--gt-light);
	margin: -31em 10em 10em 10em;
	opacity: .9;
	padding: 30px;
	position: absolute;
	width: 500px;
}

.textbox__content .textbox__block {
	font-size: 14px;
	margin: 2em 0 0;
}

.textbox__content .textbox__subtitle {
	color: var(--gt-navy);
	font-weight: inherit;
	text-transform: uppercase;
}

/*** Border Styles ***/

.textbox__content .top-left-border {
	position: relative;
	padding: 1.5rem 1.5rem 0 1.5rem;
}

.textbox__content .top-left-border:before {
	bottom: -3px;
	width: 3px;
	background-image: -webkit-linear-gradient(top, #004f9f 0%, #004f9f 40%, transparent 50%);
	background-image: -moz-linear-gradient(top, #004f9f 0%, #004f9f 40%, transparent 50%);
	background-image: -o-linear-gradient(top, #004f9f 0%, #004f9f 40%, transparent 50%);
}

.textbox__content .top-left-border:after {
	right: -3px;
	height: 3px;
	background-image: -webkit-linear-gradient(left, #004f9f 0%, #b3a369 30%, #004f9f 40%, transparent 50%);
	background-image: -moz-linear-gradient(left, #004f9f 0%, #b3a369 30%, #004f9f 40%, transparent 50%);
	background-image: -o-linear-gradient(left, #004f9f 0%, #b3a369 30%, #004f9f 40%, transparent 50%);
}

.textbox__content .top-left-border:before, .textbox__content .top-left-border:after {
	content: "";
	position: absolute;
	top: -3px;
	left: -3px;
}

.textbox__content .bottom-right-border {
	position: relative;
	padding: 0 1.5rem 1.5rem 1.5rem;
}

.textbox__content .bottom-right-border:before {
	top: -3px;
	width: 3px;
	background-image: -webkit-linear-gradient(transparent 50%, #004f9f 60%, #004f9f 90%);
	background-image: -moz-linear-gradient(transparent 50%, #004f9f 60%, #004f9f 90%);
	background-image: -o-linear-gradient(transparent 50%, #004f9f 60%, #004f9f 90%);
}

.textbox__content .bottom-right-border:after {
	left: 3px;
	height: 3px;
	background-image: -webkit-linear-gradient(left, transparent 50%, #004f9f 60%, #b3a369 75%, #004f9f 90%);
	background-image: -moz-linear-gradient(left, transparent 50%, #004f9f 60%, #b3a369 75%, #004f9f 90%);
	background-image: -o-linear-gradient(left, transparent 50%, #004f9f 60%, #b3a369 75%, #004f9f 90%);
}

.textbox__content .bottom-right-border:before, .textbox__content .bottom-right-border:after {
	content: "";
	position: absolute;
	bottom: -3px;
	right: -3px;
}
