/**
	@Author:	Trident Marketing Develpment
	@Date:		18 June 2020
	@Notes:		BPC landing page
		
	FONTS & COLORS
	-------------
	font-family: 'Roboto Condensed', sans-serif;
	available weight: 400, 400i, 700;
	inner max-width: 1070px;
	red: #d6121c
*/

* {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	}

html, body {
	width: 100%;
	height: 100%;
	font-size: 100%;
	}

body {
	margin: 0;
	padding: 0;
	position: relative;
	font-size: 18px;
	line-height: 1.3;
	background: #ffffff;
	}

body, input, textarea, table {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
	color: #222;
	color: rgb(34,34,34);
	}

p {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 1em;
	margin: 0 0 1em;
	}

a {
	color: #fff;
	text-decoration: none;
	}
a:hover,
a:active {
	color: #fff;
	text-decoration: underline;
	}

img {
	display: block;
	vertical-align: middle;
	}


.page-overlay {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	visibility: hidden;
	background: rgba(0,0,0,0.4);
	z-index: 600;
	opacity: 0;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
	}
header,
section,
footer {
	background: #ffffff;
	width: 100%;
	margin: 0;
	position: relative;
	}

.inner {
	position: relative;
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 20px;
	}
.inner-full {
	max-width: 100%;
	padding: 0;
	}
.inner-narrow {
	max-width: 900px;
	}
.inner-wide {
	max-width: 1600px;
	}

/* ----- [ Simple Grid System v2.8 ] ----------- */
.row {
	display: block;
	margin: 0 -15px;
	overflow: hidden;
	position: relative;
	}

.stretch {
	align-items: stretch;
	}

.row > .col {
	width: 100%;
	vertical-align: top;
	padding: 15px;
	}

.row.no-padding,
.row.padding-0 {
	margin: 0;
	}
.row.padding-1 {
	margin: 0 -1px;
	}
.row.padding-2 {
	margin: 0 -1px;
	}
.row.padding-5 {
	margin: 0 -5px;
	padding-top: 5px;
	}
.row.padding-5 {
	margin: 0 -5px;
	padding-top: 5px;
	}
.row.padding-10 {
	margin: 0 -10px;
	padding-top: 10px;
	}
.row.padding-20 {
	margin: 0 -20px;
	}
.row.padding-30 {
	margin: 0 -30px;
	}

.no-padding > .col,
.padding-0 > .col {
	padding: 0;
	}
.padding-1 > .col {
	padding: 1px;
	}
.padding-2 > .col {
	padding: 2px;
	}
.padding-5 > .col {
	padding: 5px;
	}
.padding-10 > .col {
	padding: 10px;
	}
.padding-20 > .col {
	padding: 20px;
	}
.padding-30 > .col {
	padding: 30px;
	}

.row-reverse {
	flex-direction: row-reverse;
	}

.col > img {
	max-width: 100%;
	}

/* 37.5 equivalent breakpoint */
@media only screen and (min-width: 600px) { 
	.row {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		flex-wrap: wrap;
		}
		
	.row > .col {
		width: auto;
		}

	.row-2 > .col { width: 50%; }
	.row-3 > .col { width: 33.333%; }
	.row-4 > .col { width: 25%;}
	.row-5 > .col { width: 20%;}
	.row-6 > .col { width: 16.666%;}

	.row-2 .span-2 { width: 100%; }
	.row-3 .span-2 { width: 66.666%; }
	.row-4 .span-2 { width: 50%; }
	.row-4 .span-3 { width: 75%; }
	.row-5 .span-2 { width: 40%; }
	.row-5 .span-3 { width: 60%; }
	.row-5 .span-4 { width: 80%; }
}



/* Vertical alignment per row */
.row-top {
	align-items: flex-start;
	}
.row-bottom {
	align-items: flex-end;
	}
.row-middle {
	align-items: center;
	}
	
/* Horizontal alignment per row */
.row-left {
	justify-content: flex-start;
	}
.row-right {
	justify-content: flex-end;
	}
.row-center {
	justify-content: center;
	}

.row-around {
	justify-content: space-around;
	}
.row-between {
	justify-content: space-between;
	}
.row-evenly {
	justify-content: space-around;
	}

.push-right {
	margin-right: auto;
	}
.push-left {
	margin-left: auto;
	}


/* Direction */
.row-reverse {
	flex-direction: row-reverse !important;
	}
.row-column {
	flex-direction: column;
	}
.row-column-reverse {
	flex-direction: column-reverse;
	}

.container {
	/*padding: 75px 0;*/
	margin: 0 auto;
	width: 100%;
	}

.page-header {
	height: 110px;
	background: #d6121c;
	/*background: #fff;*/
	/*border-bottom: 4px solid #fff;*/
	}
.page-header .inner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	/*align-items: center;*/
	height: 110px;
	/*max-width: 1000px;*/
	max-width: 100%;
	margin: 0 auto;
	padding: 15px 0;
	padding: 15px;
	}
	
.logo-wrapper {
	width: 120px;
	margin: 0 auto;
	}
.header-logo {
	width: 100%;
	}
	
.head-meta {
	display: none;
	color: #fff;
	}

@media only screen and (min-width: 600px) { 
	.head-meta {
		display: block;
		}
}



h1 {
	position: relative;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 44px;
	text-align: center;
	text-transform: uppercase;
	color: #424242;
	margin: 0;
	}


/* ----- [ split gallery ] ---------- */
.gallery-wrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: nowrap;
	flex-direction: column;
	width: 100%;
	height: auto;
	overflow: hidden;
	}

.item {
	position:relative;
	flex: 1;
	height: 100%;
	overflow: hidden;
	transition: flex 0.8s ease;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	background-position: center;
	background-size: cover;
	background-repeat: none;
	background-size: cover;
	background-size: 1000px;
	border-top: 4px solid #fff;
	/*
	border-left: 2px solid #fff;
	border-right: 2px solid #fff;
	*/
	}
.item:first-of-type {
	border-left: none;
	}
.item:last-of-type {
	border-right: none;
	}
	

.item-1 {
	background-image: url("https://images.unsplash.com/photo-1499198116522-4a6235013d63?auto=format&fit=crop&w=1233&q=80");
	}
.item-2 {
	background-image: url("https://images.unsplash.com/photo-1492760864391-753aaae87234?auto=format&fit=crop&w=1336&q=80");
	}
.item-3 {
	background-image: url("https://images.unsplash.com/photo-1503631285924-e1544dce8b28?auto=format&fit=crop&w=1234&q=80");
	}
.item-4 {
	background-image: url("https://images.unsplash.com/photo-1510425463958-dcced28da480?auto=format&fit=crop&w=1352&q=80");
	}
.item-5 {
	background-image: url("https://images.unsplash.com/photo-1503602642458-232111445657?auto=format&fit=crop&w=1234&q=80");
	}

.item:after {
	content:"";
	position: absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background: rgba(0,0,0,0.6);
	background: rgba(0,0,0,0.3);
	background: rgb(0,0,0);
	background: linear-gradient(90deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.1) 100%);
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	}

.gallery-wrap .item-content {
	opacity: 1;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	}

.item-content {
	position: relative;
	top: 10%;
	left: 0;
	width: auto;
	margin: 20px;
	margin: 40px 20px;
	z-index: 10;
	}
.item-text,
.item-content p {
	font-family: 'Roboto Condensed', sans-serif;
	opacity: 0;
	opacity: 1;
	width: 300px;
	font-size: 17px;
	color: #fff;
	margin: 1em 0 0;
	}

.item-logo {
	 height: 60px;
	 }
	 
.item-content p > br {
	display: none;
	}

	 
@media only screen and (min-width: 850px) { 
	.gallery-wrap {
		flex-direction: row;
		height: 70vh;
		height: calc(100vh - 110px);
		}
	
	.gallery-wrap:hover .item-content {
		opacity: 0;
		-moz-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		-webkit-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
		}
	.gallery-wrap:hover .item:hover .item-content {
		display:block;
		opacity: 1;
		}
	.gallery-wrap:hover .item:hover .item-text,
	.gallery-wrap:hover .item:hover .item-content p {
		display:block;
		opacity: 1;
		}
	
	.item {
		border-top: none;
		}
	.item-content {
		position: absolute;
		top: 55%;
		left: 0;
		width: auto;
		margin: 20px;
		z-index: 10;
		}

	.item:after {
		content:"";
		position: absolute;
		top:0;
		bottom:0;
		left:0;
		right:0;
		background: rgba(0,0,0,0.6);
		-moz-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		-webkit-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
		}
		
	.item:hover {
		flex: 7;
		}

	.item:hover:after {
		background: rgb(0,0,0);
		background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 44%, rgba(255,255,255,0) 100%);
		background: rgb(0,0,0);
		background: linear-gradient(90deg, rgba(0,0,0,0.7959558823529411) 0%, rgba(0,0,0,0.04525560224089631) 44%, rgba(255,255,255,0) 100%);
		}
	
	.item:hover .item-content {
		left: 30px;
		/*top: auto;
		bottom: 8%;*/
		}
	.item:hover > :focus:not(:hover) {
		transform: scale(1.05);
		}
	.item-text,
	.item-content p {
		opacity: 0;
		width: 300px;
		}
	
	.item-content p > br {
		display: inline;
		}
}

@media only screen and (min-width: 980px) {
	.item-logo {
		 height: 70px;
		 }
}

/* ----- [ Buttons ] --------------------------- */
button,
.button {
	font-family: 'Roboto Condensed', sans-serif;
	display: inline-block;
	padding: 6px 10px;
	color: #fff;
	background: #d6121c;
	width: auto;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-align: center;
	margin-bottom: 10px;
	border: 1px solid transparent;
	cursor: pointer;
	text-decoration: none;
	}
button:hover,
.button:hover {
	color: #fff;
	background: #d6121c;
	border: 1px solid #fff;
	text-decoration: none;
	}

@media only screen and (min-width: 850px) { 
	button,
	.button {
		font-size: 16px;
		padding: 10px 15px;
		}
}


/* ----- [ Utility ] ------------------ */
.centered,
.centered p,
.centered h2,
.centered h3,
.text-centered,
.text-center {
	text-align: center;
	}
.text-left,
.text-left p,
.text-left h2,
.text-left h3 {
	text-align: left;
	}
.text-right,
.text-right p,
.text-right h2,
.text-right h3 {
	text-align: right;
	}
	
.text-small {
	font-size: 1em;
	}



/* ----- [ Footer ] ---------------------------- */
.page-footer {
	color: #fff;
	background: #000 url("../images/bpc-footer-2.jpg") bottom right no-repeat;
	background-size: cover;
	padding: 0;
	border-top: 8px solid #fff;
	}

@media only screen and (min-width: 650px) { 
	.page-footer {
		background-size: 450px;
		}
}

.page-footer .inner {
	max-width: 1200px;
	padding: 40px 20px 10px;
	}
	
.page-footer .col {
	margin-right: 40px;
	}
	
.page-footer h2 {
	color: #d6121c;
	font-size: 1.8em;
	line-height: 1.3em;
	font-weight: 400;
	margin: 0;
	text-transform: none;
	}
.page-footer p,
.page-footer li {
	font-size: 0.9em;
	line-height: 1.6em;
	font-weight: 300;
	margin: 0 0 1em;
	}
.page-footer .col:last-of-type p {
	margin: 0;
	}
.page-footer strong {
	font-size: 1.1em;
	color: #d6121c;
	font-weight: 400px;
	}
.foot-phone {
	display: inline-block;
	width: 1.3em;
	}

.page-footer a {
	color: #fff;
	border-bottom: 1px solid transparent;
	text-decoration: none;
	}
.site-credits a {
	color: #999;
	border-bottom: 1px solid transparent;
	}
.page-footer a:hover,
.site-credits a:hover {
	color: #fff;
	border-bottom: 1px solid #ba0137;
	}

.footer-logo-wrapper {
	max-width: 95px;
	margin: 0 0 16px;
	padding: 0;
	}
.footer-logo {
	max-width: 100%;
	}

p.copyright-credits {
	margin: 0 0 1em;
	padding: 0 15px;
	font-size: 0.8rem;
	color: #666;
	width: 100%;
	}
.copyright-credits a {
	color: #ba0137;
	}
#editpage {
	position: fixed;
	bottom: 0;
	left: 0; 
	padding: 5px 6px; 
	background: #db1174; 
	color: #fff; 
	display: block;
	font-weight: bold; 
	z-index: 1000;
	}
#editpage:hover {
	background: #ffffcc;
	color: #000; 
	}	

/* ----- [ Social Media Icons ] ---------------- */
/* ----- [ SVG Social Media Icons ] --------------- */
/*
.social-icons-wrapper {
	text-align: left;
	}

.social-icon {
    color: #fff;
    text-align: left;
    display: inline-block;
    margin-right: 10px !important;
	}

.social-icon a {
    color: #fff;
    border: none;
	}

.social-icon a:hover,
.social-icon a:active {
    color: #d6121c;
    border: none;
	}

.social-icon svg {
	height: 20px;
	width: 20px;
    fill: currentColor;
    max-width: 100%;
    max-height: 100%;
    vertical-align: middle;
	}

.social-networks a:hover {
	opacity: 1;
	}
*/
.social-icons-header {
	text-align: right;
	margin: 0 -10px 16px 0;
	}
.social-icons-footer {
	text-align: left;
	}
	
.social-icon {
    display: inline-block;
    color: #fff;
    text-align: left;
    margin-right: 10px;
	}
.social-icon a {
    color: #fff;
    border: none;
	}
.social-icons-header .social-icon a {
    color: #d6121c;
    background: #fff;
    text-align: center;
    display: block;
    line-height: 36px;
    height: 36px;
    width: 36px;
    border-radius: 50%;
    border: none;
	}

.social-icons-header .social-icon a:hover,
.social-icons-header .social-icon a:active {
    color: #000;
    border: none;
	}
.social-icons-footer .social-icon a:hover,
.social-icons-footer .social-icon a:active {
    color: #d6121c;
    border: none;
	}
	
.social-icons-header .fab {
	font-weight: 400;
	font-size: 1.3em;
	line-height: 36px;
	text-align: center;
	vertical-align: middle;
	margin-top: -3px;
	}
.social-icons-footer .fab {
	font-weight: 400;
	font-size: 1.3em;
	text-align: center;
	vertical-align: middle;
	margin-right: 5px;
	}