* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;	
}

html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-ms-overflow-style: scrollbar;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	scroll-behavior: smooth;
	background: #f9f6f2;
	color: #1a1a19;
	font: 400 100%/1.33rem "acumin-pro", sans-serif;
}



ul {
	list-style: none;
}

a {
	text-decoration: none;
	font-weight: 400;
    color: #1a1a19;
}

#mission a {
	font-weight: 600;
}

a:hover {
	color: #FAA700;
}

h1 {
	font: 500 100% "acumin-pro", sans-serif;
}

h2 {
	display: inline;
	font: 600 0.9em/1.5rem "acumin-pro", sans-serif;
}

p {
	display: inline;
	font-size: 0.9em;
}

img {
	display: block;
	margin: 2.5rem auto 0;
	width: 100%;
}

#logoS {
	position: fixed;
	margin: 0;
	width: 7rem;
}

#logoL {
	max-width: 45rem;
}

#sunlogo {
	width: 11rem;
}

div {
	margin: 0.5rem 1rem;
}

.color{
	margin: 0;
	padding: 0 5%;
}

.color:nth-child(even) {
	background: #1a1a19;
	color:#f9f6f2;
}

article {
	margin: 0 auto;
	padding: 2.5rem 0;
	max-width: 60rem;
}

#about, #sustainability {
	max-width: 35rem;
}

section {
	padding: 2rem 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

blockquote {
	margin: 0 auto;
	padding: 2rem 0;
	width: 82.6%;
	max-width: 30rem;
	text-align: center;
	font: 800 1.372rem/1.75rem big-caslon-fb, serif;
	font-style: italic;
	color: #1a1a19;
}

blockquote span {
	font-size: 1.235rem;
	font-style: normal;
	white-space: nowrap;
}

#clients div {
	width: 100%;
	height: 200px;
	overflow: auto;
	scrollbar-width: thin;
	scrollbar-color: #f9f6f2 #1a1a19;
}

hr {
	border-top: 1.5px solid #1a1a19;
}

/* Works on Chrome, Edge, and Safari */
#clients div::-webkit-scrollbar {
	width: 4px;
}

#clients div::-webkit-scrollbar-track {
	background: #1a1a19;
}

#clients div::-webkit-scrollbar-thumb {
	background-color: #f9f6f2;
}

#clients ul {
	column-count: 5;
	font-size: 0.85rem;
}

#clients a {
	font-family: acumin-pro-semi-condensed, sans-serif;
    font-weight: 400;
    font-style: normal;
	color: #f9f6f2;
}

div.flex {
	flex: 1 1 0;
	min-width: 20rem;
}

#contact a {
	color: #f9f6f2;
}

address {
	font-style: normal;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

iframe {
	padding: 2.5rem 0 0;

}

footer {
	line-height: 2.5rem;
	text-align: center;
	font-size: 0.729rem;
	text-transform: uppercase;
	background: #1a1a19;
	color: #f9f6f2;
}



/* Navigations */

header {
    width: 100%;
    margin: 0 0 5rem;
    position: sticky;
    position: -webkit-sticky;

    box-shadow: 0px -2px 12px #1a1a19;

    top: 0px;
    z-index: 2;
    background: #f9f6f2;
    padding: 0 5%;
}

nav {
    width: 100%;
    position: sticky;
    position: -webkit-sticky;
    left: 0px;
}

nav ul {
	margin: 0 auto;
    max-width: 35rem;  
    height: 2.5rem;
    line-height: 2.5rem;
	display: flex;
	justify-content: space-around;
}

nav a {
	font-size: 0.9rem;
	color: #1a1a19;
	padding-top: 1px;
	transition: border 0.4s linear;
	border-bottom: 4px solid rgba(0, 0, 0, 0);
}

nav a:hover {
	border-bottom: 4px solid #1a1a19;
	color: #1a1a19;
}

.sticky {
    width: 100%;
    top: 2.5rem;
    z-index: 1;
    background: #f9f6f2;
    padding: 0;
}




/* Tables */

table {
	border-spacing: 0;
	width: 100%;
    font-size: 0.81rem;
}

tr:nth-child(even) {
	background: #e2dfdc;
}

tr.noColor {
	background: #f9f6f2;
}

th, td {
	padding: 0 0.5rem;
	text-align: right;
}

th:first-child {
	padding: 0;
	text-align: left;
}

td {
	font-family: acumin-pro-semi-condensed, sans-serif;
    font-weight: 400;
    font-style: normal;
}

td:first-child {
	text-align: left;
}

.table {
	font-size: 0.81rem;
}



/* Media Based */

@media (max-width: 80rem) {
  #clients ul {
	column-count: 4;
  }

@media (max-width: 60rem) {
  #clients ul {
	column-count: 3;
  }

@media (max-width: 40rem) {
  #clients ul {
	column-count: 2;
  }

}