@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap');

@font-face {
  font-family: "Central Avenue WMC";
  src: url("https://wales-millennium-centre-production.s3.eu-west-2.amazonaws.com/fonts/CentralAvenueWMC-Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Objektiv Mk1";
  src: url("https://wales-millennium-centre-production.s3.eu-west-2.amazonaws.com/fonts/ObjektivMk1_Rg.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}


/* Default: mobile = no margins */
body {
	margin: 0;
}

/* Desktop layout */
@media (min-width: 992px) {

	/* Default desktop style (most pages) */
	body {
		margin: 2.5rem;
	}

}

	/**
	 * HTML
	 */
	body {
		font-family: "Objektiv Mk1";
		word-wrap: break-word;
		color: rgb(46, 40, 46);
		background-color:white !important;
	}
	main {
		padding-top: 1rem;
		padding-bottom: 1rem;
		background-color:rgb(245, 245, 245);
	}
	a {
		color: rgb(46, 40, 46);
		text-decoration:none;
	}
	a:hover {
		color: rgb(46, 40, 46);
		text-decoration:underline;
	}
	h1 {
		font-family: "Central Avenue WMC";
		color: rgb(46, 40, 46);
		font-weight:700;
		text-transform:uppercase;
	}
	h2 {
		font-family: "Central Avenue WMC";
		color: rgb(46, 40, 46);
		font-weight:700;
		text-transform:uppercase;
	}
	h3, h4 {
		font-family: "Central Avenue WMC";
		color: rgb(46, 40, 46);
		font-weight:700;
		text-transform:uppercase;
	}
	p, label {
		font-family: "Objektiv Mk1";
		color: rgb(46, 40, 46);
	}
	select {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		border: none;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}
	select::-ms-expand {
	    display: none; 
	}


	/**
	 * Bootstrap
	 */	 
	.btn {
		-webkit-border-radius: 100px;
		-moz-border-radius: 100px;
		border-radius: 100px;
		margin-top:2px;
	}
	.alert, .form-control {
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}
	.progress-bar {
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}
	.form-control {
		padding-bottom:10px;	
	}
	
	/**
	 * Navigation
	 **/
	#page-navigation {
		margin-top: 0px !important;
		margin-bottom: 0px !important;
		padding-top: 1rem !important;
		padding-bottom: 1rem !important;
		background-color: white !important;
	}
	#page-navigation-logo {
	}

	.page-navigation-menu a {
		color:rgb(46, 40, 46) !important;
		text-decoration: none;
		font-weight:700;
		text-transform:uppercase;
		padding-bottom:0rem !important;
		padding-left: 0rem !important;
		padding-right: 0rem !important;
		margin-left:1rem;
		margin-right:1rem;
		border-bottom: 1px solid transparent !important;
	}
	.page-navigation-menu a:hover {
		color:rgb(46, 40, 46) !important;
		text-decoration: none;
		font-weight:700;
		text-transform:uppercase;
		padding-bottom:0rem !important;
		padding-left: 0rem !important;
		padding-right: 0rem !important;
		margin-left:1rem;
		margin-right:1rem;
		border-bottom: 2px solid rgb(253, 175, 40) !important;
	}

	/**
	 * Section title
	 */
.section-title {
	-webkit-border-top-left-radius: 0px !important;
	-moz-border-top-left-radius: 0px !important;
	border-top-left-radius: 0px !important;
	-webkit-border-top-right-radius: 0px !important;
	-moz-border-top-right-radius: 0px !important;
	border-top-right-radius: 0px !important;
	-webkit-border-bottom-left-radius: 0px !important;
	-moz-border-bottom-left-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
	-webkit-border-bottom-right-radius: 0px !important;
	-moz-border-bottom-right-radius: 0px !important;
	border-bottom-right-radius: 0px !important;
}
.section-content {
	-webkit-border-top-left-radius: 0px !important;
	-moz-border-top-left-radius: 0px !important;
	border-top-left-radius: 00px !important;
	-webkit-border-top-right-radius: 0px !important;
	-moz-border-top-right-radius: 0px !important;
	border-top-right-radius: 0px !important;
	-webkit-border-bottom-left-radius: 0px !important;
	-moz-border-bottom-left-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
	-webkit-border-bottom-right-radius: 0px !important;
	-moz-border-bottom-right-radius: 0px !important;
	border-bottom-right-radius: 0px !important;
}
.section, .section-alt, #page-title, #home-page-section {
	-webkit-border-top-left-radius: 0px !important;
	-moz-border-top-left-radius: 0px !important;
	border-top-left-radius: 0px !important;
	-webkit-border-top-right-radius: 0px !important;
	-moz-border-top-right-radius: 0px !important;
	border-top-right-radius: 0px !important;
	-webkit-border-bottom-left-radius: 0px !important;
	-moz-border-bottom-left-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
	-webkit-border-bottom-right-radius: 0px !important;
	-moz-border-bottom-right-radius: 0px !important;
	border-bottom-right-radius: 0px !important;
}
	.section-title {
		background-color:rgb(245, 245, 245);
	}
	.section-title h1, .section-title h2, .section-title h3, .section-title h4  {
		color:rgb(46, 40, 46) !important;
	}

	/**
	 * Section content
	 */ 
	.section-content, .section-alt {
		background-color:rgb(245, 245, 245);
		border: 1px solid rgb(245, 245, 245);
	}
	.section-content h1, .section-content h2, .section-content h3, .section-content h4 {
		color: rgb(46, 40, 46);
	}
	.section-content p {
		color:rgb(46, 40, 46);
	}	
	.section-content a {
		color:rgb(46, 40, 46);
	}	
	.section-content a:hover {
		color: rgb(46, 40, 46);
	}


	/**
	 * Section
	 */
	.section {
		background-color:rgb(149, 216, 194) !important;
		border:1px solid rgb(149, 216, 194) !important;
	}
	.section h1, .section h2, .section h3, .section h4, .section p, .section svg, .section strong {
		color: rgb(0, 63, 74) !important;
	}


	.btn-standard {	 
		min-width:220px;
		width:220px;
		box-sizing:content-box;
	}

	#page-header {
	}


	#page-header h1 {
		color:white !important;
		font-family: "Central Avenue WMC";
	}

/* Hub + wall pages use #page-title-row */
body#charity-wall #page-title-row,
body#charity-hub #page-title-row,
body#campaign-wall #page-title-row,

/* All other pages use #page-title */
body:not(#charity-wall):not(#charity-hub):not(#campaign-wall) #page-title {
	padding-top: 7rem;
	padding-bottom: 7rem;
	font-weight: 700;

	background-image:
		linear-gradient(
			rgba(46, 40, 46, 0.45),
			rgba(46, 40, 46, 0.45)
		),
		url("https://wales-millennium-centre-production.s3.eu-west-2.amazonaws.com/images/join-and-give.jpg");

	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

	border-bottom: 3rem solid rgb(46, 40, 46);
}
	#page-title-row h1 {
		font-weight:700;
		text-transform:uppercase;
	}

	#page-title {
	}

	.shadow, .btn {
		-webkit-box-shadow: none !important;
		-moz-box-shadow: none !important;
		box-shadow: none !important;
	}
	.card-header {
		background-color:rgb(46, 40, 46);
	}
	.card-header a, .card-header h1, .card-header h2, .card-header h3, .card-header h4  {
		color:white !important;
	}
	.card-body, .card {
		background-color:transparent;
	}

	/**
	 * Buttons
	 **/
	#header-button, #page-button {
		background-color: rgb(253, 175, 40) !important;
		border-color: rgb(35, 50, 82);
		color: rgb(46, 40, 46);
	}

	.btn-primary, .btn-outline-primary, .btn-secondary, .btn-outline-secondary, .btn-danger, .btn-warning  {
		background-color: rgb(253, 175, 40) !important;
		border-color: rgb(253, 175, 40) !important;
		color: rgb(46, 40, 46) !important;
		text-decoration:none;
	}
	.btn-primary:hover, .btn-outline-primary:hover, .btn-secondary:hover, .btn-outline-secondary:hover, .btn-danger:hover, .btn-warning:hover  {
		background-color: rgb(253, 194, 91) !important;
		border-color: rgb(253, 194, 91) !important;
		color: rgb(46, 40, 46) !important;
		text-decoration:none;
	}
		
	/**
	 * Footer
	 */
	#footer-content {
	}

/* Only these pages use #footer-content with background */
body#charity-wall #page-footer,
body#charity-hub #page-footer,
body#campaign-wall #page-footer {
	background-color: rgb(0, 85, 101);
}


/* All other pages use #page-footer with padding only (no background) */
body:not(#charity-wall):not(#charity-hub):not(#campaign-wall) #page-footer {
	background-color: transparent;
}

	#footer-content {
		padding: 3rem 2rem 2rem 2rem !important;
		background-color: rgb(0, 85, 101);
	}

	#footer-content p, #footer-content a, #footer-content svg {
		color:rgb(255, 255, 255);
		text-decoration:none;
		font-weight:700;
	}
	#footer-content h2, #footer-content h3, #footer-content h4 {
		color:rgb(255, 255, 255);
		text-transform:uppercase;
		font-weight:700;
		margin-bottom:20px;
		padding-bottom:15px;
	}

	#footer-content h3 {
		border-bottom: 1px solid rgb(0, 255, 194);
	}

	#footer-content a:hover {
		color:rgb(255, 255, 255);
		text-decoration:underline;
		font-weight:700;
	}

	#footer-content hr {
		color: rgb(0, 255, 194) !important;
		border-width:0.8px !important;
		border: 0.8px solid rgb(0, 255, 194) !important;
	}	
	
	#footer-strapline, #page-footer-column hr {
		visibility: hidden;
		display: none;
	}

	/**
	 * Media queries
	 */
	@media (min-width: 0px) {
		#logo {
			min-width:100px;
			max-width:100px;
		}
	}
	
	@media (min-width: 576px) {
		#logo {
			min-width:100px;
			max-width:100px;
		}
	}

	@media (min-width: 768px) {
		#logo {
			min-width:200px;
			max-width:200px;
		}
	}

	@media (min-width: 992px) {
		#logo {
			min-width:200px;
			max-width:200px;
		}
	}

	@media (min-width: 1200px) {
		#logo {
			min-width:200px;
			max-width:200px;
		}
	}