/* Global styles */

/* General begin */

html {
	
	scroll-behavior: smooth;
	
}

body {
	
	font-family: var(--font);
	background: var(--primary-colour);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	
}

.main-menu {
	
	margin: auto;
	width: 100%;
	height: 100%;
	overflow: hidden;
	pointer-events: none;
	position: fixed;
	top: 0px;
	z-index: 10;
	
}

/* container for all content */
.site-content {
	
	/* padding-top: 92px; */
	/* padding-bottom: 82px; */
	/* max-width: 1140px; */
	/* padding-left: 16px; */
	/* padding-right: 16px; */
	text-align: center;
	margin: 0 auto;
	
}

.padding-header {
	
	padding-top: 238px;
	padding-left: 16px;
	padding-right: 16px;
	padding-bottom: 192px;

}

.top-bottom-padding {
	
	padding-top: 192px;
	padding-bottom: 192px;

}

.height-100 {
	
	min-height: 100vh;
	
}

.vert-hor-cen {
	
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
	position: absolute;
	
}

/* small screens */
.content-width {
	
	width: calc(100% - 32px);
	padding-left: 16px;
	padding-right: 16px;
	
}

/* big screens */
@media (min-width: 768px) {
	
	.content-width {
		
		max-width: 900px;
		margin: 0 auto;
		
	}
	
}

.text-left {
	
	text-align: left;
	
}

.no-underline a {
	
	text-decoration: none;
	
}

.padding-footer {
	
	padding-top: 192px;
	padding-left: 16px;
	padding-right: 16px;
	padding-bottom: 192px;

}

.darken {
	
	background-color: rgba(0, 0, 0, 0.4);
	
}

.accent-text {
	
	color: var(--accent-text-colour);
	
}

/* all links accent text colour */
.accent-text a {
	
	color: var(--accent-text-colour);
	
}

.clip {
	
	overflow: hidden;
	
}

.divider-primary {
	
	width: 100%;
	height: 2px;
	background-color: var(--primary-colour);
	
}

.divider-accent {
	
	width: 100%;
	height: 2px;
	background-color: var(--accent-colour);
	
}

.float-accent {
	
	background-color: var(--accent-colour);
	color: var(--accent-text-colour);
	border-radius: 13px;
	padding: 32px;
	max-width: 500px;
	margin: 0 auto;
	box-shadow: var(--shadow);
	
}

.float-accent a {
	
	color: var(--accent-text-colour) !important;
	
}

.float-primary {
	
	background-color: var(--primary-colour);
	color: var(--primary-text-colour);
	border-radius: 13px;
	padding: 32px;
	max-width: 500px;
	margin: 0 auto;
	box-shadow: var(--shadow);
	margin-bottom: 16px;
	
}

/* General end */



/* Text begin */

/* load Lato-Light font */
@font-face {
	
	font-family: 'Lato-Light';
	src: url('../fonts/Lato-Light/lato.woff2');
	src: url('../fonts/Lato-Light/lato.woff2') format('woff2'),
	url('../fonts/Lato-Light/lato.eot?#iefix') format('embedded-opentype'),
	url('../fonts/Lato-Light/lato.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
	
}

/* everything set to font */
h1,h2,h3,h4,h5,h6,p,label,li,a {
	
	font-family: var(--font);
	font-weight: normal;
	
}

/* text sizes */
h1 { font-size: 32px; }
h2 { font-size: 24px; }
h3 { font-size: 20px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }
p { font-size: 16px; }
label { font-size: 16px; }
li { font-size: 16px; }
ul { }
ol { }

/* remove all bullet points and their spacing */
ul, ol {
	
	list-style: none;
	margin: 0;
	padding: 0;
	
}

/* links */
.site-content a {
	
	color: var(--primary-text-colour);
	/* text-decoration: none; */
	/* font-weight: bold; */
	
}

.site-content a:hover {
	
	color: var(--primary-text-colour);
	/* font-weight: bold; */
	
}

/* Text end */



/* Button begin */

.site-content .button {
	
	padding-top: 10px;
	padding-left: 14px;
	padding-right: 14px;
	padding-bottom: 12px;
	border-radius: 7px;
	background-color: var(--primary-button-bg-colour);
	color: var(--primary-button-text-colour);
	border: none;
	width: max-content;
	margin: 0 auto;
	font-family: var(--font);
	font-size: 16px;
	
}

.site-content .button-positive {
	
	padding-top: 10px;
	padding-left: 14px;
	padding-right: 14px;
	padding-bottom: 12px;
	border-radius: 7px;
	background-color: var(--positive-button-bg-colour);
	color: var(--primary-button-text-colour);
	border: none;
	width: max-content;
	margin: 0 auto;
	font-family: var(--font);
	font-size: 16px;
	
}

.site-content .button-negative {
	
	padding-top: 10px;
	padding-left: 14px;
	padding-right: 14px;
	padding-bottom: 12px;
	border-radius: 7px;
	background-color: var(--negative-button-bg-colour);
	color: var(--primary-button-text-colour);
	border: none;
	width: max-content;
	margin: 0 auto;
	font-family: var(--font);
	font-size: 16px;
	
}

/* Buttons end */



/* Header begin */

/* main container */
.header-wrapper {
	
	text-align: center;
	position: relative;
	
}

/* all links accent text colour */
.header-wrapper a {
	
	color: var(--accent-text-colour);
	
}

/* titles container */
.header-titles {
	

	
}

/* Header end */



/* Footer begin */

/* main container */
.footer-wrapper {
	
	text-align: center;
	position: relative;
	height: auto;
	
}

/* global navigation container */
#global-navigation-wrapper {
	
	margin: 0 auto;
	display: flex;
	margin-left: 0;
	width: 100%;
	
}

/* global navigation store section */
#g-n-store {
	
	width: calc(100% / 3);
	text-align: right;
	
}

/* global navigation website section */
#g-n-home {
	
	width: calc(100% / 3);
	text-align: center;
	margin-left: 24px;
	margin-right: 24px;
	
}

/* global navigation members section */
#g-n-members {
	
	width: calc(100% / 3);
	text-align: left;
	
}

/* big screens */
@media (min-width: 768px) {
	
	/* global navigation container */
	#global-navigation-wrapper {
		
		margin: 0 auto;
		display: flex;
		max-width: 1140px;
		width: 100%;
		
	}
	
	/* global navigation store section */
	#g-n-store {
		
		width: calc(100% / 3);
		text-align: center;
		
	}
	
	/* global navigation website section */
	#g-n-home {
		
		width: calc(100% / 3);
		text-align: center;
		
	}
	
	/* global navigation members section */
	#g-n-members {
		
		width: calc(100% / 3);
		text-align: center;
		
	}
	
}

/* global navigation list style none */
.footer-list {
	
	list-style: none;
	width: fit-content;
	margin: 0 auto;
	
}

/* global navigation link styles */
.footer-list a {
	
	color: var(--accent-text-colour);
	text-decoration: none;
	font-size: 12px;
	display: block;
	padding: 7px;
	
}

/* global navigation hover link styles */
.footer-list a:hover {
	
	color: var(--accent-text-colour);
	opacity: 70%;
	
}

/* bar base */
#base {
	
	width: 100%;
	height: 46px;
	/* background-color: black; */
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 9;
	backdrop-filter: blur(13px) !important;
	-webkit-backdrop-filter: blur(13px) !important; /* Safari support */
	
}

/* copyright text */
#copyright-text {
	
	text-align: center;
	font-size: 9px;
	line-height: 46px;
	color: var(--accent-text-colour);
	
}

/* Footer end */