/*raw elements */
	body {margin: 0; padding: 0; font-family: 'Bricolage Grotesque', sans-serif; font-weight: 200; justify-content: center; align-items: center;}
	h1 {font-size: 2.5vw; text-align: center; line-height: 0.8em; color: #227C9D; font-family: 'Bricolage Grotesque'; margin: 0;}
	h2 {font-family: 'Bricolage Grotesque'; margin: 0;}
	h3 {font-family: 'Bricolage Grotesque'; margin: 0;  color: #dde8ee;}
	a[href^="mailto:"] {color: inherit; }
	a[href^="tel:"]    {color: inherit; }
	a:link {color: inherit;}
	a:hover {color: inherit; background-color: #A5B9C1;}
	a:visited{color:inherit;}
	
	
	/*element IDs */
	#AM-photo {border-radius: 50%; width: 25%; filter: drop-shadow(5px 5px 5px #000000);}
	#AM-photo:hover {border-radius: 50%; width: 25%; -webkit-filter: grayscale(100%); filter: grayscale(100%) drop-shadow(5px 5px 5px #000000);}
	#body-div1 {color: white;}
	#body-div2 {color: #205266;}
	#chin-photo {display: block; max-width: 750px; width: 100vw;}
	#chin-photo2 {display: block;}
	#chin-photo3 {display: block; max-width: 1250px; width: 100vw;}
	#chin-photo4 {display: block; width: 100vw; max-width: 1250px;}
	#chin-photo5 {display: block; max-width: 750px; width: 100vw;}
	#element iframe {width: 50vw; height: 37vw;}
	#map_location {width: 50vw; height:25vw; display:block; border: 0;}
	#pacifico {font-family: 'Pacifico' !important; font-size: 2.5vw;}
	#top-logo {width: 750px;}
	#home-office {width: 98vw; max-width: 750px; z-index: -5;}
	#soon2 {color: #205266;}
	#eye {width: 100%; display: block;}
	#thank_you_coffee {width: 75vw;}
	#thank_you {font-size: 4.5vw; font-family: 'Pacifico'; color: #227C9D;}
	
	
	#link_phone, #link_email, #link_fax, #link_enquiry{#205266 !important}
	
	.white-text {color: white;}

	/*element classes */
	.a_style {color: red;}
	.a_style:visited {color: red;}
	.about_text {padding-right: 4vw; padding-left: 4vw;}
	.blog_container {display: grid; }
	.blog_h1 {font-family: 'Pacifico', 'Bricolage Grotesque';}
	.blog_inner1 {flex: 1; color: white; border: 1px; border-color: black;}
	.blog_inner2 {flex: 2; color: red; border: 1px; border-color: black;}
	.blog_list_photo {display: block;}
	.blog_text {padding-right: 4vw; padding-left: 4vw; text-align: left; font-family: 'Bricolage Grotesque'; font-weight:200;}
	.blog_text h2 {text-align: center;}
	.body-content {color: #205266; line-height: 1.5em;}
	.body-content1 {color: #000000; font-family: 'Bricolage Grotesque'; font-weight: 200; vertical-align: middle; font-size: 1.4vw; text-align: center; margin: auto;}
	.body-content2 {color: #dde8ee; line-height: 1.5em;}
	.body-content3 {color: #dde8ee; line-height: 1.5em;}
	.bottom-logo {width:30vw;}
	.cond_list {margin: 0px;}
	.container  {display: flex; justify-content: center; align-items: center; width: 100%; padding: 0px; flex-direction: row;}
	.container2 {display: flex; justify-content: center; align-items: center; width: 100%; padding: 0px; flex-direction: row;}
	.container3 {display: flex; justify-content: center; align-items: center; width: 100%; padding: 0px; flex-direction: row; background-color: #205266; color: #000000;}
	.container_dark {display: flex; justify-content: center; align-items: center; width: 100%; background-color: #205266; flex-direction: row;}
	.container_dark2 {display: grid; grid-template-columns: 1fr 1fr; grid-gap: 0px; justify-content: center; align-items: center; width: 100%; background-color: #205266; flex-direction: row;}
	.container_dark3 {display: grid; grid-template-columns: 1fr 1fr; grid-gap: 0px; justify-content: center; align-items: center; width: 100%; background-color: #205266; flex-direction: row;}
	.container_dark4 {display: flex; justify-content: center; align-items: center; width: 100%; background-color: #205266; flex-direction: row;}
	.container_dark5 {display: flex; justify-content: center; align-items: center; width: 100%; background-color: #205266; flex-direction: row;}
	.container_dark6 {display: flex; justify-content: center; align-items: center; width: 100%; background-color: #205266; flex-direction: row;}
	.container_footer {text-align: center; font-style: italic; color: #227C9D;}
	.container_form {max-width: 50vw; margin: 0 auto; padding: 20px; border: 1px solid #ccc; border-radius: 1px; background-color: #205266; color: #dde8ee;}
	.container_form h2 {font-family: 'Bricolage Grotesque';}
	.container_form2 {max-width: 900px; min-width: 75%; margin: 0 auto; padding: 20px; border: 0px solid #ccc; border-radius: 1px; background-color: #205266; color: #dde8ee;}
	.element {flex: 1; padding: 0px; font-size: 1.3vw; font-family: 'Bricolage Grotesque'; font-weight: 200; margin: 0px; text-align: center;}
	.element ul {text-align: left;}
	.element:first-child {margin-right: 0px;}
	.element_dark {display: flex; flex: 1; padding: 0px; font-size: 1.3vw; background-color: #205266; color: #dde8ee; font-family: 'Bricolage Grotesque'; font-weight: 200;}
	.element_dark h1 {color: #dde8ee; font-family: 'Bricolage Grotesque';}
	.element_dark h2 {font-family: 'Bricolage Grotesque';}
	.element_dark2 {height: 100%; padding: 20px; font-size: 1.3vw; background-color: #205266; color: #dde8ee; font-family: 'Bricolage Grotesque'; font-weight: 200;}	
	.element_dark2 h1 {color: #dde8ee; font-family: 'Bricolage Grotesque';}
	.element_fees {flex: 1; padding: 0px; font-size: 1.3vw; font-family: 'Bricolage Grotesque'; width: 50%;}
	.element_inner {padding: 10px; text-align: center; font-weight: 200;}
	.element_inner ul {text-align: left;}
	.element_inner2 {padding: 10px;}
	.element_inner3 {padding: 10px; text-align: center; width:100%;}
	.element_inner_about {flex: 2; padding: 0px; text-align: center;}
	.element_inner_blog {flex: 2; padding: 0px; text-align: center;}
	.element_light {flex: 1; padding: 0px; font-size: 1.3vw; background-color: #205266; color: #dde8ee; font-family: 'Bricolage Grotesque'; font-weight: 200;}
	.element_light h1 {color: #366375; font-family: 'Bricolage Grotesque';}
	.element_slim {flex: 0.5; color: #205266;}
	.element_outer {flex: 0.1; padding: 0px; font-size: 1.3vw; font-family: 'Bricolage Grotesque'; font-weight: 200;}
	.find_out_more {font-family: 'Pacifico';}
	.image-box {flex: 1; text-align: center; padding: 0px;}
	.image-box img {width: 100%; height: auto; display: block;}
	.image-box:first-child {margin-right: 0px;}
	.image-box-centre {flex: 1; text-align: center; padding: 0px;}
	.image-box-centre img {width: 35%; height: 100%;}
	.image-container {text-align: right; background-color: white;}
	.image-container img {max-width: 100%; height: auto;}
	.input-group {margin-bottom: 15px; text-align: left;}
	.input-group input[type="submit"] {background-color: #dde8ee; color: #205266; padding: 8px; border: none; cursor: pointer; font-size: 1.4vw;}
	.input-group input[type="submit"]:hover {background-color: #662052; color: #dde8ee;}
	.input-group label {display: block; margin-bottom: 5px;}
	.input-group textarea {resize: vertical;}
	.input-group input,	.input-group textarea {width: 98%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; font-family: 'Bricolage Grotesque'}
	.inp_left {width: 100%;}
	.menu {background-color: #205266; color: #dde8ee; width: 100%; box-shadow: 0px 10px 8px #888888; z-index: 100; text-align: center;}
	.menu a {text-decoration: none; color: inherit; transition: font-size 0.3s, width 0.3s; font-family: 'Bricolage Grotesque'; font-weight: 400; z-index: 5;}
	.menu li {padding: 10px; font-family: 'Bricolage Grotesque';}
	.menu ul {list-style: none; padding: 0; display: flex; justify-content: space-around; align-items: center; margin: 0;}
	.menu2 {background-color: #205266; color: #dde8ee; width: 100%; box-shadow: 0px 10px 8px #888888; z-index: 100; text-align: center; display: none;}
	.menu2 a {text-decoration: none; color: inherit; transition: font-size 0.3s, width 0.3s; font-family: 'Bricolage Grotesque';}
	.menu2 li {padding: 10px; }
	.menu2 ul {list-style: none; padding: 0; display: flex; justify-content: space-around; align-items: center; margin: 0;}
	.item1, .item2, .item3, .item4, .item5, .item6, .item7, .item8, .item9 {width:100%;}
	.p {line-height: 1em;}
	
	.phone {color: inherit;}
	.references {font-family: 'Bricolage Grotesque'; font-weight:200; font-style: italic;}
	.response {font-style: italic;}
	.soon {font-family: 'Pacifico'; font-size: 2.5vw;}
	.span_style1 {color: '#888888';}
    
    
    /*blog table elements*/
    .data_table {border: none; max-width: 1250px; width: 100vw; table-layout: fixed; background-color: #205266; color: #dde8ee; filter: drop-shadow(5px 5px 5px #000000);}
    .data_table:hover {border: none; max-width: 1250px; width: 100vw; table-layout: fixed; background-color: #266279; color: #dde8ee; filter: drop-shadow(5px 5px 5px #000000);}
    .data_table td {border: none;}
    .data_table_row1 {border: none; max-width: 1250px; width: 100vw; text-align: left;}
    .data_table_column1 {border: none; width: 30%; text-align: left;}
    .data_table_column2 {border: none; width: 65%; text-align: center; font-weight: 400; font-family: 'Bricolage Grotesque';}
    .data_table_column2 h2 {text-align: center;}
    .data_table_column2 a {border: none; width: 65%; text-align: left; font-weight: 400; font-family: 'Bricolage Grotesque'; text-decoration: none;}
    .blog_list_photo {width: 100%;}
    .blog_link:hover {-webkit-filter: grayscale(100%); filter: grayscale(100%) drop-shadow(5px 5px 5px #000000)}
    
    
    /*#data_table {width: 70vw;}*/
		
	@media (max-width: 900px) {
		.container {flex-direction: column;}
		.container2 {flex-direction: column-reverse;}
		.container3 {flex-direction: column;}
		.container_dark, .container_dark2 {flex-direction: column;}
		.container_dark2 {display: block;}
		.container_dark4 {flex-direction: column-reverse;}
		.container_dark5 {flex-direction: column;}
		.container_dark6 {flex-direction: column-reverse;}
		.container_form {max-width: 90vw;}
		.element_dark2 h1 {display: inline-block; }
		h1 {font-size: 4.5vw; line-height: 0.8em;}
		h2 {font-size: 4vw;}
		#pacifico {font-size: 4vw;}
		body {font-size: 3.2vw; font-weight: 200;}
		#body-div1 {color: white; display: none;}
		.element {font-size: 3.0vw;}
		.element_dark {font-size: 3.2vw; width: 100vw; display: flex;}
		.element_dark2 {font-size: 3.2vw; width: 100vw; display: block;}
		.element_light {font-size: 3.2vw;}
		.element_slim {display: none;}
		.body-content1{font-size: 2.3vw;}
		.element_inner2 {padding: 0px;}
		#chin-photo2 {display: block;}
		#AM-photo {width: 50%;}
		#AM-photo:hover {width: 50%;}
		#top-logo {width: 75vw; text-align: center;}
		#element iframe {width: 90vw; height: 37vw;}
		#map_location {width: 90vw; height: 37vw; display:block;}
		#eye {width: 100vw; display: block; }
		.bottom-logo {width:85vw;}
		.image-container {text-align: center; background-color: white;}
		.menu {display: block;}
		.menu ul {list-style: none; padding: 0; display: flex; justify-content: space-around; align-items: center; margin: 0; font-size: 2vw;}
		.menu2 ul {list-style: none; padding: 0; display: flex; justify-content: space-around; align-items: center; margin: 0; font-size: 2vw;}
		.menu2 {display: flex;}
        .soon {font-size: 24px;}
        #clipboard {display: none;}
		.input-group input[type="submit"] {background-color: #dde8ee; color: #205266; padding: 8px; border: none; cursor: pointer; font-size: 2.4vw;}
		}
		
	@media (max-width: 700px) {
		h1 {font-size: 9vw;}
		h2 {font-size: 7vw;}
		#pacifico {font-size: 7vw;}
		body {font-size: 4vw; font-weight: 200;}
		.element {font-size: 4vw;}
		.element_dark {font-size: 4vw;}
		.element_dark2 {font-size: 4vw;}
		.element_light {font-size: 4vw;}
		.body-content1{font-size: 4vw;}
		.bottom-logo {width: 90vw;}
		.menu ul {font-size: 3vw;}
		.menu2 ul {font-size: 3vw;}
        .soon {font-size: 3.75vw;}
        .container3 {flex-direction: column;}
        .container_dark5 {flex-direction: column;}
        .container_dark6 {flex-direction: column-reverse;}
        .container_form {max-width: 90vw;}
        #body-div1 {color: white; display: none;}
        #clipboard {display: none;}
        #chin-photo2 {display: block;}
        #element iframe {width: 90vw; height: 37vw;}
		#eye {width: 100vw; display: block; }
		.data_table_column1 {border: none; width: 45%; text-align: left;}
        .data_table_column2 {border: none; width: 45%; text-align: center; font-weight: 400; font-family: 'Bricolage Grotesque';}
		}
		
	@media (max-width: 600px){
		.menu ul {font-size: 3vw;}
		.menu2 ul {font-size: 3vw;}
		}
		
	@media (min-width: 901px) and (max-width: 1150px) {
		.menu a {font-size: 2vw; width: 80px;}
		.menu2 a {font-size: 2vw; width: 80px;}
		h1 {font-size: 2.5vw;}
		h2 {font-size: 2vw;}
		#pacifico {text-align: center; font-size: 2vw;}
		body {font-size: 1.3vw; font-weight: 200;}
		.body-content1{font-size: 1.3vw;}
		.element {font-size: 1.3vw;}
		.element_dark, .element_dark2 {font-size: 1.3vw;}
		.element_light {font-size: 1.3vw;}
		.element_slim {display: none;}
		#clipboard {width: 40vw;}
		#clipboard {display: block;}
		.container_form {max-width: 100vw;}
		#chin-photo2 {display: block;}
		#top-logo {width: 360px;}
		.bottom-logo {width:50vw;}
		#AM-photo {width: 35%;}
		#AM-photo:hover {width: 35%;}
		#body-div1 {color: white; display: none;}
		.soon {font-size: 2.5vw;}
		#eye {width: 100vw; display: block; }
		}
		
	@media (min-width: 1151px) and (max-width: 1400px){
		.menu a {font-size: 2vw; width: 90px;}
		.menu2 a {font-size: 2vw; width: 90px;}
		h1 {font-size: 2.5vw;}
		h2 {font-size: 2vw;}
		#pacifico {text-align: center; font-size: 2vw;}
		body {font-size: 1.4vw; font-weight: 200;}
		.element {font-size: 1.4vw;}
		.element_dark, .element_dark2 {font-size: 1.4vw;}
		.element_light {font-size: 1.4vw;}
		.body-content1{font-size: 1.4vw;}
		.element_slim {display: none;}
		#clipboard {width: 40vw;}
		#clipboard {display: block;}
		#chin-photo2 {display: block;}
		#top-logo {width: 480px;}
		#body-div1 {color: white; display: none;}
		.bottom-logo {width: 50vw;}
		#eye {width: 100vw; display: block; }
		}

	@media (min-width: 1401px){
		.menu a {font-size: 1.3vw; width: 100px;}
		.menu2 a {font-size: 1.3vw; width: 100px;}
		h1 {font-size: 2.5vw;}
		h2 {font-size: 2vw;}
		#pacifico {text-align: center; font-size: 2vw;}
		body {font-size: 1.4vw; font-weight: 200;}
		.element {font-size: 1.4vw;}
		.element_dark, .element_dark2 {font-size: 1.4vw;}
		.element_light {font-size: 1.4vw;}
		.body-content1{font-size: 1.4vw;}
		#clipboard {width: 40vw;}
		#clipboard {display: block;}
		#chin-photo2 {display: block;}
		#top-logo {width: 600px;}
		.bottom-logo {width:40vw;}
		
		}

	@media (min-width: 1440px){
		.container {display: flex; justify-content: center; align-items: center; }
		}
		
/* This is where to delete from if it doesn't work   */		

/* ============================
   FONT FACE DECLARATIONS
   ============================ */

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJfedw.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1xlFd2JQEk.woff2") format("woff2");
}

@font-face {
  font-family: "Nunito";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/nunito/v25/XRXV3I6Li01BKofINeaB.woff2") format("woff2");
}

@font-face {
  font-family: "Nunito";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/nunito/v25/XRXW3I6Li01BKofINeaBTMnFcQ.woff2") format("woff2");
}

@font-face {
  font-family: "Karla";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/karla/v23/qkBIXvYC6trAT55ZBi1ueQ.woff2") format("woff2");
}

@font-face {
  font-family: "Karla";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://fonts.gstatic.com/s/karla/v23/qkBIXvYC6trAT55ZBi1ueQ.woff2") format("woff2");
}

/* ============================
   BASE FONT OVERRIDES
   ============================ */

body {
  font-family: 'Bricolage Grotesque', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Headings */
h1, h2, h3,
.menu, .menu a, .menu li,
.references,
.data_table_column2,
.data_table_column2 a {
  font-family: 'Bricolage Grotesque', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Content */
.element,
.element_dark,
.element_dark2,
.element_light,
.body-content1,
.blog_text {
  font-family: 'Bricolage Grotesque', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Forms & UI */
.input-group input,
.input-group textarea,
.input-group label,
button {
  font-family: 'Bricolage Grotesque', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}