/* General
       ========================================================================== */
	
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
	text-transform: uppercase;
}

.logo{
	color: #0a0a0a;
	line-height: 1;
}

.logo span{
	font-size: .9rem;
	font-weight: 300;
}

header{
	margin-top: 1rem;
}

.border-container{
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	margin-bottom: 1.8rem;
}

.instagram-icon{
	width: 38px;
	height: auto;
}

.instagram-icon-hover{
	position: absolute;
	right: 0;
	top: 0;
	width: 38px;
	height: auto;
	visibility: hidden;
}

.insta-hover{
	position: absolute;
	right: 0;
	top: 0;
	top: -9px;
	width: 38px;
	height: auto;
}

.insta-hover:hover .instagram-icon-hover{
		visibility: visible !important;
}

hr{
	border-bottom: 1px solid #0a0a0a;
}

.strapline{
	font-size: .9rem;
	font-weight: 300;
}

@media screen and (max-width: 39.9999em) {
	.logo{
		font-size: 1.3rem;
		margin-top: .3rem;
	}
	hr{
		margin-top: 0;
	}
	}

/* Medium and up */
@media screen and (min-width: 40em) {
	header{
	margin-top: 2rem;	
}	
	.strapline{
	font-size: 1.4rem;
	font-weight: 300;
	letter-spacing: 4px;
}
	.logo span{
	font-size: 1.4rem;
}
	.border-container{
	margin-bottom: 3.5rem;
}
	.insta-hover{
	top: -11px;
	width: 45px;
}
	.instagram-icon-hover{
	width: 45px;
}
	.instagram-icon{
	width: 45px;
}
}

.main-menu{
	display: none;
	border-top: 1px solid #0a0a0a;
}

.main-menu ul{
	list-style: none;
	text-transform: uppercase;
	padding-top: 1rem;
	margin-left: 0;
	text-align: center;
}

li a{
	color: #0a0a0a !important;
}

li a:hover{
	color: #1e7101 !important;
}

.active{
	color: #1e7101 !important;
}

.slide-toggle{
	position: absolute;
	top: 10px;
    width: 27px;
	right: 0.9375rem;
	opacity: 0.6;
}

.slide-toggle svg{
	width: 100%;
	height: auto;
}

/* Medium and up */
@media screen and (min-width: 40em) {
	.main-menu{
	border-top: 0;
	float: right;
	display: block;
	}
	.main-menu ul{
		letter-spacing: 2px;
		padding-top: 0rem;
		text-align: left;
	}
	.slide-toggle{
		display: none;
	}
	.orbit-bullets{
		float: right;
	}
	}

.footer{
	border-top: 1px solid #0a0a0a;
	padding-top: 1rem;
}

.footer p{
	text-transform: uppercase;
	font-size: .9rem;
	float: left;
}

.footer a{
	text-transform: uppercase;
	font-size: .9rem;
	float: right;
	}
	
	
/* Home
       ========================================================================== */


.orbit:focus{
	outline:0;
}

@media screen and (min-width: 40em) {
	.orbit{
	margin-bottom: 3.5rem;
}
}
	
/* Practice
       ========================================================================== */
       
.margin-bottom{
	margin-bottom: 1.5rem;
}

.margin-bottom-smaller{
	margin-bottom: 1rem;
}

@media screen and (min-width: 40em) {
	.margin-bottom{
	margin-bottom: 3.5rem;
	}
}
	
/* Design Process
       ========================================================================== */
@media screen and (min-width: 40em) {
	       
       .process-cell-1{
	       padding-right: 2.9375rem !important;
       }
       
        .process-cell-2{
	       padding-left: 2rem !important;
	       padding-right: 2rem !important;
       }
       
        .process-cell-3{
	       padding-left: 2.9375rem !important;
	   }
}

.process-img{
	cursor: pointer;
	margin-bottom: 1rem;
}

.process-img:hover{
	opacity: 0.7;
}

.close {
  position: absolute;
  right: 14px;
  top: 10px;
  width: 32px;
  height: 32px;
  cursor: pointer;
}

.close:before, .close:after {
  position: absolute;
  left: 15px;
  top: 0;
  content: ' ';
  height: 33px;
  width: 2px;
  background-color: #0a0a0a;
}

.close:hover:before, .close:hover:after{
  background-color: #1e7101;
}
.close:before {
  transform: rotate(45deg);
}
.close:after {
  transform: rotate(-45deg);
}

.white-close:before, .white-close:after{
	background-color: white !important;
}
	
/* Featured Projects
       ========================================================================== */
       
.button{
	background: transparent;
	border: 1px solid black;
	text-transform: uppercase;
	color: #0a0a0a;
}

.button:hover{
	color: white;
	background-color: #1e7101; 
}
	
/* Individual Project Pages
       ========================================================================== */

.is-link{
	cursor: pointer;
}

.is-link:hover{
	opacity: 0.7;
}

#image-swap{
	width: 100%;
	padding: 1.7rem;
}

@media screen and (min-width: 64em) {
	.special-spacer{
		margin-top: 13rem;
	    padding-left: 1.2rem;
	}
}

@media screen and (min-width: 64em) {
	.special-spacer-2{
		padding-right: 10rem;
	}
}
	
/* Contact
       ========================================================================== */
.contact-large{
	text-transform: uppercase;
	font-size: 1.4rem;
}

.contact-small{
	text-transform: uppercase;
	font-size: 1rem;
}