/* ==========================================================================
   Base styles
   ========================================================================== */

.fr-layout {
	background: #fff;
	color: #000;
}

.fr-layout h1,
.fr-layout h2,
.fr-layout h3,
.fr-layout h4,
.fr-layout h5,
.fr-layout h6,
.nav-link,
.btn.btn-danger {
	font-weight:  400;
	font-family: 'Oswald', sans-serif;
	color: inherit;
	text-transform: uppercase;
}

.modal-dialog {
	max-width: 800px;
	margin: 30px auto;
}

.modal-body {
	position:relative;
	padding:0px;
}
.btn-close {
	position:absolute;
	right:-30px;
	top:0;
}

.franchise-section + .franchise-section {
	border-top: 1px solid #d8d8d8;
}

.nav-link.active {
	background: none;
}

/* ==========================================================================
   Franchise: Hero
   ========================================================================== */

#fr-hero {
	background-color: #d1212e;
	padding-top: 120px;
	padding-bottom: 120px;
	color: #fff;
	position: relative;
}

#fr-hero .row {
	position: relative;
	z-index: 10;
}

#fr-hero::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 100%;
	z-index: 1;
	background-repeat: no-repeat;
	background-image: url(../hh-images/canada-east.png);
	background-size: contain;
	opacity: 0.1;
}

#fr-hero::after{
	content: "";
	position: absolute;
	right: 1rem;
	bottom: 1rem;
	width: 132px;
	height: 80px;
	z-index: 2;
	background-image: url(../hh-images/burger.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}


/* ==========================================================================
   Franchise: Navbar
   ========================================================================== */

#navbar-franchise {
	background-color: #bc1a28;
}

#navbar-franchise a:not(.dropdown-item) {
	color: #fff;
}

/* ==========================================================================
   Franchise: sections
   ========================================================================== */
.franchise-section-tag {
	font-family: 'trend_hm_sansfour', sans-serif;
	font-weight: normal;
	font-size: 60px;
	line-height: 1;
	color: #ccc;
	opacity: 0.5;
	display: block;
	padding-top: 80px;
	margin-bottom: -40px;
}

@media screen and (min-width: 768px ) {
	.franchise-section-tag {
		font-size: 72px;
	}
}

.video-btn {
	background-color: #d1212e;
	display: block;
	color: #fff;
	position: relative;
}
.video-btn:hover,
.video-btn:visited,
.video-btn:focus {
	color: #fff;
}

.video-btn img {
	opacity: 0.4;
}

.video-btn span {
	width: 60px;
	height: 60px;
	font-size: 36px;
	text-align: center;
	color: #fff;
	position: absolute;
	left: 50%;
	margin-left: -30px;
	top: 50%;
	margin-top: -30px;
	z-index: 10;
	display: block;
}

.video-btn:hover span svg {
	transform: scale(1.2);
}

.video-btn span svg {
	width: 100%;
	height: 100%;
}

.btn-close {
	color: #fff;
}
.btn-close svg {
	fill: #fff;
}

.rounded-image {
	height: 300px;
	overflow: hidden;
	border: 10px solid #d1212e;
	margin-left: auto;
	margin-right: auto;
}

.rounded-image img {
	height: 100%;
	max-width: none;
	width: 100%;
	object-fit: cover;
}

#myModal .modal-body {
	padding: 0;
}

.feature-icon img {
	max-width: 100%;
}

.list-group-item .badge {
	background-color: #d1212e;
	padding-top: 7px;
	margin-bottom: auto;
}

.list-group-item svg {
	margin-right: 5px;
	color: #d1212e;
}

.card-regions {
	background-size: cover;
}

.fr-layout h4.text-bright-red {
	color: #d1212e;
}

div.wpforms-container-full .wpforms-form button[type=submit].btn-danger {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
}

div.wpforms-container-full .wpforms-form input[type=submit].btn-danger:active, 
div.wpforms-container-full .wpforms-form button[type=submit].btn-danger:hover {
	color: #fff;
    background-color: #bb2d3b;
    border-color: #b02a37;
}

#navbar-franchise .nav-pills .nav-link.active {
	background: transparent;
}

#navbar-franchise .nav-pills .nav-link:hover {
	color: #f8f78e;
}
