/*Tungsten and Proxima Nova font faces*/
@font-face {
	font-family: "Tungsten";
	src: url("fonts/tungsten-medium.ttf"),
		url("fonts/tungsten-medium.woff") format("woff"),
		url("fonts/tungsten-medium.woff2") format("woff2");
	font-weight: "normal";
}

@font-face {
	font-family: "Tungsten-Bold";
	src: url("fonts/tungsten-bold.ttf"),
		url("fonts/tungsten-bold.woff") format("woff"),
		url("fonts/tungsten-bold.woff2") format("woff2");
	font-weight: "bold";
}

@font-face {
	font-family: "Proxima-Nova";
	src: url("fonts/Proxima-Nova.ttf"), 
		url("fonts/ProximaNova-Regular.woff") format("woff"), 
		url("fonts/ProximaNova-Regular.woff2") format("woff2");
}

/*Browser highlight styling*/
::selection {
	background-color: #0085bd;
	color: #fff;
}	

/*Colour classes as per Breakers style guide*/
.black {
	background-color: #373636;
}

.dark-blue {
	background-color: #002b56;
}

.white {
	background-color: #ffffff;
}

.light-blue {
	background-color: #0085bd;
}

.sandstone {
	background-color: #f0e6c5;
}

/*Classes using various fonts*/
.tungsten {
	font-family: "Tungsten";
	font-weight: "normal";
}

.tungsten-bold {
	font-family: "Tungsten-Bold";
	font-weight: "bold";
}

/*Colour and size of social icons*/
#social a {
	color: #fff;
	font-size: 125%;
}

/*Hover colour for social icons*/
#social a:hover {
	color: #cccccc;
}

/*Padding and margin styling for navigation links*/
#nav-sm, #nav-lg {
	margin: 0 auto;
}

#nav-sm a, #nav-lg a {
    padding: 5px 22px;
    
}

/*Removing border from navigation bar*/
.navbar {
    border: none;
}

/*Mobile hamburger icon components*/
.icon-bar {
	width: 22px; 
	height: 2px;
	background-color: #B6B6B6;
	display: block;
	transition: all 0.2s;
	margin-top: 4px
}

/*Mobile hamburger icon*/
.navbar-toggler {
	border: none;
  	background: transparent !important;
}

/*Removing outline of hamburger icon on focus*/
.navbar-toggler:focus {
	outline: none;
}

/*Animation for top bar of hamburger icon on click*/
.navbar-toggler .top-bar {
	margin-top: 0px;
 	transform: rotate(45deg);
	transform-origin: 10% 10%;
}

/*Hide middle bar on click*/
.navbar-toggler .middle-bar {
  	opacity: 0;
}

/*Animation for bottom bar on click*/
.navbar-toggler .bottom-bar {
  	transform: rotate(-45deg);
  	transform-origin: 10% 90%;
}

/*Original state of hamburger components*/
.navbar-toggler.collapsed .top-bar {
  	transform: rotate(0);
}

.navbar-toggler.collapsed .middle-bar {
  	opacity: 1;
}
 
.navbar-toggler.collapsed .bottom-bar {
  	transform: rotate(0);
}

/*Styling for map iframe*/
iframe {
	border: 0px;
	margin: 0;
	width: 100%;
}

body {
	/*Padding at top of body to compensate for header elements*/
	padding-top: 126px;
	/*Set default font to Proxima Nova*/
	font-family: "Proxima-Nova" !important;
}

/*When desktop navigation bar hides reduce padding at top of screen*/
@media screen and (max-width: 992px) {
	body {
		padding-top: 76px;
	}
}

/*Margin around page text content*/
.body-text {
	margin: 35px;
}

/*Margin around page content blocks*/
article {
	margin: 30px 2%;
}

/*Change font of header elements and set bold*/
h4, h5, h6, label {
	font-family: Proxima-Nova;
	font-weight: bold !important;
}

/*Styling for page buttons*/
.btn-primary {
	color: #002b56 !important;
	background-color: #fff !important;
	border-color: #002b56 !important;
}

/*Button hover styling*/
.btn-primary:hover {
	color: #fff !important;
	background-color: #002b56 !important;
	border-color: #002b56 !important;
}

/*Set position relative for hero image to allow centering of page title*/
.hero-image {
	position: relative;
}

/*Center page title and set font size*/
.page-header {
	text-align: center;
	font-size: 600%;
	margin: 0;
	color: #fff;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	/*Use z index to ensure display on top of image*/
	z-index: 100;
}

/*Reduce font size of page title as screen gets smaller*/
@media screen and (max-width: 992px) {
	.page-header {
		font-size: 400%;
	}
}

@media screen and (max-width: 662px) {
	.page-header {
		font-size: 300%;
	}
}

@media screen and (max-width: 508px) {
	.page-header {
		font-size: 250%;
	}
}

/*Carousel caption hover animation on home page*/
#carousel-caption {
	opacity: 0.0;
	transition: opacity 0.3s ease-in-out;
}

div.carousel-inner:hover #carousel-caption {
	opacity: 1.0;
	transition: opacity 0.3s ease-in-out;
}

div.carousel-inner img {
	transition: 0.3s ease-in-out;
}

div.carousel-inner:hover img {
	filter: brightness(0.7);
	transition: 0.3s ease-in-out;
    font-family: "Proxima-Nova" !important;
}

/*Turn carousel indicators into dots*/
.carousel .carousel-indicators li {
  	width: 10px;
  	height: 10px;
  	border-radius: 100%;
  	margin: 0 .75%;
}

/*Styling for page cards*/
.insert {
	padding-top: 10px;
}

.insert p {
	margin-bottom: 0;
}

/*Responsive styling to ensure card borders display correctly with rounded edges at all breakpoints*/
@media screen and (max-width: 767px) {
	.card-sm-t,
	.card-sm-m {
		border-bottom-width: 0 !important;
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	.card-sm-m,
	.card-sm-b {
		border-top-left-radius: 0 !important;
		border-top-right-radius: 0 !important;
	}
}

@media screen and (max-width: 1199px) and (min-width: 768px) {
	article .list-group .row-cols-md-2 .col-right,
	article .row .col-right {
		border-left-width: 0 !important;
	}

	.card-md-tl,
	.card-md-tr {
		border-top-width: 1px !important;
		border-bottom-width: 1px !important;
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	.card-md-bl,
	.card-md-br,
	.card-md-ml,
	.card-md-mr,
	.card-md-b {
		border-top-width: 0 !important;
		border-top-left-radius: 0 !important;
		border-top-right-radius: 0 !important;
		border-bottom-width: 1px !important;
	}

	.card-md-tl {
		border-top-left-radius: .25rem !important;
		border-top-right-radius: 0 !important;
	}

	.card-md-tr {
		border-top-left-radius: 0 !important;
		border-top-right-radius: .25rem !important;
	}

	.card-md-bl {
		border-bottom-left-radius: .25rem !important;
		border-bottom-right-radius: 0 !important;
	}

	.card-md-br,
	.card-md-mr {
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: .25rem !important;
	}

	.card-md-ml {
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	.card-md-b {
		border-bottom-left-radius: .25rem !important;
		border-bottom-right-radius: .25rem !important;
	}
}

@media screen and (min-width: 1200px) {
	.card-lg-l,
	.card-lg-m {
		border-right-width: 0 !important;
		border-top-right-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	.card-lg-m,
	.card-lg-r {
		border-top-left-radius: 0 !important;
		border-bottom-left-radius: 0 !important;
	}
}

/*Set font colour in footer*/
footer {
	color: #fff;
}

/*Footer navigation link styling*/
footer .card .nav a {
	color: rgba(255,255,255,.5);
	font-size: 95%;
}

/*Padding for navigation links*/
footer .card .nav-link {
	padding: .25rem 1rem;
}

/*Hover colour for footer links*/
footer .card .nav-link:hover {
	color: rgba(255, 255, 255, .75);
}

/*Active page colour*/
footer .card a.nav-link.active {
	color: #fff;
}

footer .card a {
	color: #fff;
}

/*Hover animation for footer navigation links*/
footer .card a:hover {
	text-decoration: underline;
}

/*Remove margin from footer text*/
footer p {
	margin: 0;
}

/*Spacing styling for footer elements*/
footer div .card.footer-text {
	padding: 5px;
}

footer button {	
	margin-top: 15px;
}

/*Footer mobile icon spacing*/
footer .card .row .footer-icon-mobile {
	font-size: 150%;
	padding: 0 .5rem;
}

/*Footer slogan colour*/
#footer-slogan {
	color: #fff;
}