/* =============================================
   Image banner on default page
   ============================================= */

section.banner-image {
	position: relative;
	background-size: cover;
}

section.banner-image img {
	display: block;
	width: 100%;
	height: auto;
}

section.banner-image .banner-text-box {
	width: 100%;
	text-align: center;
	max-width: 100%;
	margin-left: 0;
	height: 100%;
	background: rgba(0,0,0,0);
	background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 38%, rgba(0,0,0,0) 100%);
	background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,0,0,0)), color-stop(38%, rgba(0,0,0,0.25)), color-stop(100%, rgba(0,0,0,0)));
	background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 38%, rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 38%, rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 38%, rgba(0,0,0,0) 100%);
	background: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,0.3) 38%, rgba(0,0,0,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=1 );
}

.banner-text-box .banner-text-viewport {
	width: 40%;
	margin-left: 20%;
	text-align: center;
	padding-bottom: 2rem;
}

.banner-text-box h1, .banner-text-box p {
	color: #fff;
}

.banner-text-box h1 {
	font-weight: 400;
	font-size: 2vw;
	/*width: 34%;*/
	padding: 3.5rem 0 1rem;
	text-shadow: 0 0 70px rgba(38, 21, 3, 0.45);
	border-bottom: 1px solid rgba(255,255,255,.5);
	/*margin-left: 25%;*/
	text-transform: uppercase;
	background:transparent!important;
}

.banner-text-box p {
	font-size: 4vw;
	font-weight: 500;
	line-height: 1.3;
	text-shadow: 0 0 70px rgba(38, 21, 3, 0.45);
	background:transparent!important;
	margin-bottom: 0;
}

.banner-text-viewport span.added-info {
    display: block;
    text-transform: initial;
    font-style: italic;
    font-weight: 100;
    opacity: .85;
}

@media screen and (min-width:2000px) {
	.banner-text-box p {
		font-size: 3.5vw;
	}
}

@media screen and (max-width: 1024px) {

.banner-text-box h1 {
	font-size: 2.6vw;
	padding: 1.5rem 0 1rem;
}

.banner-text-box p {
	padding: 0 0 1rem;
}

.toggle span.drop-down-arrow {
	float: none;
}

}

@media screen and (max-width: 639px) {

	section.banner-image .banner-text-box {
		background: rgba(0,0,0,0);
		background: -moz-linear-gradient(left, rgba(0,0,0,.35) 0%, rgba(0,0,0,.35) 40%, rgba(0,0,0,0) 100%);
		background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,0,0,.35)), color-stop(40%, rgba(0,0,0,.35)), color-stop(100%, rgba(0,0,0,0)));
		background: -webkit-linear-gradient(left, rgba(0,0,0,.35) 0%, rgba(0,0,0,.35) 40%, rgba(0,0,0,0) 100%);
		background: -o-linear-gradient(left, rgba(0,0,0,.35) 0%, rgba(0,0,0,.35) 40%, rgba(0,0,0,0) 100%);
		background: -ms-linear-gradient(left, rgba(0,0,0,.35) 0%, rgba(0,0,0,.35) 40%, rgba(0,0,0,0) 100%);
		background: linear-gradient(to right, rgba(0,0,0,.35) 0%, rgba(0,0,0,.35) 40%, rgba(0,0,0,0) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=1 );
	}

	.banner-text-box .banner-text-viewport {
		width: 60%;
		margin-left: 0;
		text-align: center;
	}

	.banner-text-box h1 {
		font-size: 5vw;
		padding: 1rem 0 .5rem;
		margin: 0 0 2px 15px;
		width: 100%;
		line-height: 1.3;
	}

.banner-text-box p {
    font-size: 8vw;
    padding: .6rem 0 .8rem;
    width: 100%;
    margin: 0 0 0 15px;
}
.banner-text-box .banner-text-viewport {
    width: 60%;
    margin-left: 0;
    text-align: center;
}
}
