html {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
	height:100%;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body {
	background: #fff url(/wp-content/themes/tribe/images/front/bg-h.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: right;
  background-attachment: fixed;
  color: #000;
  font-family: 'Lora', serif;
  font-size: 1em;
  line-height: 1.5;
  height:100%;
	margin:0;
}

#content {
  width:55%;
  position: absolute;
  top: 30%;
  margin:0 auto;
	text-align: center;
}

@media only screen and (max-width: 760px) {

	body {
		background-image:url(/wp-content/themes/tribe/images/front/bg-v2.png);
		background-position: center bottom;
    background-size: cover;
	}

	#content {
		width:100%;
		text-align:center;
	}

	#logo-container, #social-icons, #essays, #portfolio-highlights, #core, #we {
		margin-left:auto !important;
		margin-right:auto;
		width:80% !important;
		max-width:480px;
	}

  #we {
    padding-left:0 !important;
    width:100% !important;
  }

  #core h1 {
    font-size:24px !important;
  }

  .do {
    font-size:14px !important;
  }

  #portfolio-highlights {
    margin-bottom:240px !important;
  }
}

@media only screen and (max-width: 500px) {

  .do {
    font-size:11px !important;
  }

}

#logo-container, #social-icons, #essays, #portfolio-highlights, #core {
	margin-left:30%;
}

#logo-container {
	border-bottom:1px solid #ddd;
	margin-bottom:1px;
	padding-bottom:2%;
}

#logo {
  width:100%;
}

#social-icons {
	border-top:1px solid #ddd;
	padding-top:2%;
	text-align:center;
}

.social-icon {
	width:16px;
	height:16px;
	margin-left:3px;
	margin-right:3px;
}

#contact {
  margin:0;
  font-family: monospace;
  font-size:1em;
}

#essays {
  margin-top:20px;
}

#core {
  margin-top:20vh;
}

#core h1 {
  font-family: 'Lora', serif;
  font-size:2vw;
  font-weight:400;
  line-height:1.15;
}


#we {
  margin-top:30px;
  background: url(/wp-content/themes/tribe/images/front/arrow.png);
  background-repeat: none;
  background-position: center right;
  background-size: auto 50px;
  padding-left:30%;
}

#we div {
  margin:auto;
}

.do {
  display:inline-block;
  box-shadow:1px 1px 4px rgba(0,0,0,0.15);
  padding:5px 8px;
  font-family: 'Roboto Slab', serif;
  font-weight:500;
  font-size:1.2vw;
  margin:2px;
  background:#fff;
}

#portfolio-highlights {
  margin-top:70px;
  margin-bottom:20vh;
}

.companies {
  padding:0;
  list-style:none;
  text-align:left;
  margin:auto;
  max-width:280px;
}

.company {
  display:inline-block;
  width:32%;
}

.company img {
  width:100%;
  filter: grayscale(100%);
}

.company img:hover {
  filter:none;
}

.btn {
  font-weight:600;
  padding:10px 1.2rem;
  width:auto;
  text-decoration:none;
  border-radius:4px;
  margin-top:2em;
  box-shadow:2px 2px 7px rgba(0,0,0,0.25);
  font-family: 'Lato', sans-serif;
  text-align:center;
  display:inline-block;
  margin:auto;
}

.btn-secondary {
  color:#fff;
  background-color:#1c1c2e;
  font-size:.8rem;
}

.btn, a img {
  -webkit-transition: all .1s ease-in-out;
  transition: all .1s ease-in-out;
}

.btn:hover, a img:hover {
  transform: scale(1.1);
}

.btn:active, a img:active{
  transform:scale(.9);
}