*{
  margin:0;
  padding:0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent; /* for remove highlight */

}

  li{
    list-style-type: none;
  }

  ::selection{
  	background:hsl(0,0%,90%)
  }

html,body {
  background: hsl(80,33%,96%);
  position: relative;
  height:100%;
  font: 7.5pt/11pt "Helvetica Neue", sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  color:hsl(0,0%,100%);
}


/* Global */

a{
  text-decoration: none;
  color:hsl(0,0%,100%);
}

	a.hover:hover{
		color:black!important;
	}

  p{
    margin-bottom:10px;
  }

img{
  max-width:100%;
}

.height{
  height:100%;
}

.vh{
  height: 100vh
}

.margin-bottom{
	margin-bottom:7px;
}

.z{
  z-index:3;
}

  .zz{
    z-index:6;
  }

.flex-justify{
  display: flex;
  justify-content: center;
}


.flex-align{
  display: flex;
  align-items: center;
}

.clear{
  clear:both;
}

/* Display */

.hide{
  display: none;
}

/* Grid */

.grid{
  position:relative;
  float:left;
}

  .full{
    width:100%;
  }

  .half{
    width:50%;
  }

  .fourth{
	  width:25%
  }

/* Positioning */

.absolute{
  position: absolute;
}

.fixed{
  position: fixed;
}

  .right{
    float:right;
    text-align:right;
  }

  .top-left{
    top:0;left:0;
  }

  .top-right{
    top:0;right:0;
  }

  .bottom-right{
    bottom:0;right:0;
  }

  .bottom-left{
	 bottom:0;left:0;
  }

.center--h{
  top:45vh;
  left:50vw;
  /*margin-left:-87px; */
  transform: translateX(-50%);
}


/* Spacing */

.padding{
  padding:7px;
}

  .padding--medium{
    padding:28px;
  }

  .margin--medium{
    margin:28px;
  }


/* Typography */

.uppercase{
  text-transform: uppercase;
}

/* Nav */

li{
  cursor: pointer;
}

.radio{
  width:8px;
  height:8px;
  border:1px solid hsl(0,0%,30%);;
  border-radius:10px;
  margin:3px;
  margin-right:7px;
  margin-left:7px;
}

  .radio .fill{
    width:4px;
    height:4px;
    margin:1px;
    background:hsl(0,0%,30%);;
    border-radius:5px;
  }

  .a .radio .fill, .first-click .radio .fill{
    display: block!important;
    opacity: 1;
  }

  .radio .project{
	  opacity: 0;
  }

  #filters li.a{
    display: block;
  }

  #filters li:before{
	  position: relative;
	  float: left;
	  width:7px;
	  height: 7px;
	  margin-right: 10px;
	  top: 4px;
	  content:'';
  }