/*GENERAL*/
		body {
			font-family: 'Montserrat', sans-serif;
		}

		blockquote {
			font-style: italic;
			font-size: 150%;
		}

		footer {
			text-align: center;
		}

		h2 {
			text-align: center;
			text-transform: uppercase;
			margin-bottom: 1.5rem;
			font-weight: bold;
		}

		h4 {
			font-size: 125%;
			padding: 25px 0px;
		}

		h5 {
			text-transform: uppercase;
			font-weight: bold;
		}

		section,
		footer {
			padding: 5rem 0rem;
		}

		section h2:nth-of-type(2) {
			padding-top: 3rem;
		}

		li {
			list-style-type: none;
		}

		@media (max-width: 768px) {
			#how .row>div:not(:last-child) {
				margin-bottom: 3rem;
			}
		}

		@media (max-width: 768px) {
			#join .row>div:not(:last-child) {
				margin-bottom: 3rem;
			}
		}

		@media (max-width: 768px) {
			.hero-text {
				padding: 40% 0 !important;
			}
		}

		@media (max-width: 768px) {
			.topnav a {
				font-size: 10px !important;
			}
		}

		@media (max-width: 768px) {
			#partners {
				text-align: center;
			}
		}

		@media (max-width: 768px) {
			#partners blockquote {
				margin-top: 1rem
			}
		}

		@media (min-width: 768px) {
			.twitter-feed {
				width: 60% !important;
			}
		}

		@media (max-width: 768px) {
			.display-4 {
				font-size: 2.5rem !important;
			}
		}

		#join blockquote {
			font-size: 90%;
			margin: 2rem 0 0 0;
			padding: 2rem 0 .75rem 0;
			border-top: 1px dotted #ad8dbf;
		}

		#join blockquote+p {
			font-size: 80%;
		}

		#partners .col-md-3 {
			display: flex;
			justify-content: center;
			align-items: center;
		}

		@media (max-width: 768px) {
			#partners img {
				margin-bottom: 1rem
			}
		}

		#partners .row {
			padding: 2rem 0rem;
		}

		.card {
			margin-bottom: 1.25rem !important;
		}

		.jumbotron {
			height: auto;
			background-image: url('https://c402277.ssl.cf1.rackcdn.com/photos/18067/images/magazine_large/Armstrong_Cooperative_Solar_Plant_WW2125118.jpg?1573228029');
			background-size: cover;
			background-color: rgb(128, 128, 128, .8);
			background-blend-mode: multiply;
			margin: 0;
			position: relative;
		}

		.jumbotron .container {
			text-align: center;
			margin-top: 5rem;
			margin-bottom: 6rem;
		}

		.hero-text {
			text-align: center;
			padding: 9% 0;
			color: #fff;
		}

		.meta {
			font-style: italic;
			font-size: 80%;
		}

		.photo {
			background-color: rgb(128, 128, 128, .8);
			background-blend-mode: multiply;
		}

		/* .bg-secondary {background-image: url('img/birds.png'); background-blend-mode: multiply;} */
		.text-box {
			background-color: rgba(0, 0, 0, 0.2);
			padding: 15px 0;
		}

		.embed-container {
			position: relative;
			padding-bottom: 56.25%;
			height: 0;
			overflow: hidden;
			max-width: 100%;
			height: auto;
		}

		.embed-container iframe,
		.embed-container object,
		.embed-container embed {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}

		/*COLOUR*/
		body {
			color: #513b56
		}

		/*darkest*/

		.bg-dark {
			background-color: #3b333f !important;
		}

		/*purple dark*/
		.bg-secondary {
			background-color: #6e4784 !important;
		}

		/*purple med*/
		h2 {
			color: #ad8dbf !important;
		}

		/*purple light*/

		a,
		a:hover {
			color: #348aa7;
		}

		/*blue med*/
		.bg-primary {
			background-color: #348aa7 !important;
		}

		.bg-secondary a,
		.bg-dark a {
			color: #bdeaf9 !important;
		}

		/*blue lt*/

		blockquote,
		blockquote+p,
		h5,
		.meta {
			color: #afafaf;
		}

		/*gray, med*/
		.bg-light {
			background-color: #F7F7F9 !important;
		}

		/*gray, lt*/
		/* .bg-light, #partners .row:nth-child(odd) {background-color:#F7F7F9 !important;} */
		.jumbotron,
		.bg-dark,
		.bg-primary,
		.bg-secondary {
			color: #FFF;
		}

		/*white*/
		.card {
			background: rgba(255, 255, 255, 0.1)
		}

		/*white, low opacity*/


		/*OTHER*/
		.arrow {
			height: 50px;
			width: 100%;
			position: absolute;
			bottom: 0;
			left: 0;
			overflow: hidden;
		}

		.arrow:before {
			position: absolute;
			top: -50px;
			left: calc(50% - 35px);
			content: "";
			height: 50px;
			width: 50px;
			background: transparent;
			-webkit-transform-origin: 0% 100%;
			-moz-transform-origin: 0% 100%;
			-ms-transform-origin: 0% 100%;
			transform-origin: 0% 100%;
			-webkit-transform: rotate(45deg);
			-moz-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
			transform: rotate(45deg);
			box-shadow: 0 0 0 5000px rgba(255, 255, 255, 1);
		}

		.bg-img {
			/* The image used */
			/* background-image: url('https://c402277.ssl.cf1.rackcdn.com/photos/18067/images/magazine_large/Armstrong_Cooperative_Solar_Plant_WW2125118.jpg?1573228029'); */

			min-height: 650px;

			/* Center and scale the image nicely */
			background-position: center;
			background-repeat: no-repeat;
			background-size: cover;

			/* Needed to position the navbar */
			position: relative;
		}

		/* Position the navbar container inside the image */
		.container-hero {
			/* position: absolute;
  		  margin: 20px;
  		  width: auto; */

			position: relative;
			margin: 0 auto;
			/*width: 95%;*/
			/*padding-top: 20px; */
			background: rgba(0, 0, 0, 0);
			background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.5) 50%);
			padding: 20px 2.5% 0 2.5%;
		}

		/* The navbar */
		.topnav {
			overflow: hidden;
			/* background-color: #333; */
			font-weight: 700;
			border-bottom: 1px solid #fff;
			padding-bottom: 10px;
		}

		/* Navbar links */
		.topnav a {
			/*float: left;*/
			/*color: #f2f2f2;*/
			color: #000;
			text-align: center;
			padding: 5px 10px;
			text-decoration: none;
			/* font-size: 17px; */
		}

		.topnav a#logo img {
			width: 110px;
		}

		.topnav a#logo:hover {
			background-color: rgba(255, 255, 255, 0);
			opacity: .9;
		}

		.topnav a:hover {
			background-color: #eee;
			background-color: rgba(255, 255, 255, .85);
			color: black;
		}

		#google_translate_element {
			padding: 5px 2.5% 0 0;
			text-align: right;
		}

		#members .row {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
		}

		@media (min-width: 768px) {
			#members .col-md-6 {
				max-width: none;
			}
		}

		@media (max-width: 523px) {
			.topnav {
				text-align: right;
			}

			.topnav a#logo img {
				width: 75px;
			}
		}