body {
	margin:0;
	padding:0;
	color: #ccc;
	background-color:#262933;
	font-family: acumin-pro-extra-condensed, sans-serif;
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
	-moz-background-size:cover;
	background-attachment: fixed;
	-webkit-background-size:cover;
	background-image:url(images/background.jpg);
}
.clear {
	clear: both;
}
.clearlist {
	clear: both;
	width: 95vw;
	margin: 0  2.5vw auto;
	padding: 0 0 0 0;
	border-bottom: 2px solid rgba(249,249,249,0.20)
}
.head {
	width: 95%;
	margin: 2.5% auto;
	padding: 0 0 2.5vw 0;
	border-bottom: 2px solid rgba(249,249,249,0.20)
}
.logo {
	padding:0;
    width:19vw;
    height:9vw;
	float: left;
	background:url("images/3rf-lab-logo-r.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.logo a{
	padding:0;
    width:19vw;
    height:9vw;
	float: left;
	background:url("images/3rf-lab-logo.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
	transition: opacity .6s ease-in-out;
	-o-transition:opacity .6s ease-in-out;
	-moz-transition:opacity .6s ease-in-out;
	-webkit-transition:opacity .6s ease-in-out;
}
.logo a:hover,
.logo a:focus {
	opacity:0.0;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.flexy {
	display: flex;
	justify-content: space-between;
}
.topl {
	margin-left: 20px;
}
a.topl {
	padding: 0 0 .5vw 0;
	color: rgba(249,249,249,0.20);
	text-decoration: none;
	font-size: 25px;
	font-weight: 200;
	letter-spacing: 3px;
	transition:color .4s ease-in-out;
	border-bottom: 2px solid rgba(249,249,249,0.20)
}
a.topl:hover{
	color: rgba(249,249,249,0.80);
}
.listing {
	width: 95%;
	color: rgba(249,249,249,0.40);
	font-size: 55px;
	font-weight: 200;
	letter-spacing: 4px;
	margin: 2.5%;
	padding: 2.5%  0 .5% 0;
	border-bottom: 2px solid rgba(249,249,249,0.20)
}
.build {
	width: 20.9%;
	margin: 0 0 2.5% 2.5%;
	padding: 0;
	float: left;
	background-color: rgba(249,249,249,0.20)
}
.build a {
	text-decoration: none;
	color: white;
	font-weight: 600;
	font-size: 1.8vw;
	letter-spacing: .15vw;
}
.btn {
  	display: inline-block;
  	padding: .75vw 0 .75vw 1vw;
  	background: none;
	color: #fff;
	text-decoration: none;
  	font-weight: bold;
  	position: relative;
  	transition:color 0.25s ease;
  	background-color: rgba(249,249,249,0.05)
}
.btn:hover {
  color:red;
}
.btn::after {
  position: absolute;
  content: '';
  top:0;
  left: 0;
  width: 0;
  height: 100%;
  background-color: rgba(243,100,32,0.99);
  transform-origin:left;
  transition:width 0.25s ease;
  z-index:-1;
}
.btn:hover::after {
  width: 100%;
}
.trf {
	padding:0;
    width:8vw;
    height:8vw;
	margin: 2.5vw auto;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.trf a{
	padding:0;
    width:8vw;
    height:8vw;
	float: left;
	margin: auto;
	background:url("images/three-ring-focus.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
	opacity:0.15;
	transition: opacity .6s ease-in-out;
	-o-transition:opacity .6s ease-in-out;
	-moz-transition:opacity .6s ease-in-out;
	-webkit-transition:opacity .6s ease-in-out;
}
.trf a:hover,
.trf a:focus {
	opacity:0.9;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}





/* Small Devices, Tablets */
@media only screen and (max-width : 786px) {
.listing {
	width: 95%;
	color: rgba(249,249,249,0.40);
	font-size: 35px;
	font-weight: 200;
	letter-spacing: 4px;
	margin: 2.5%;
	padding: 2.5%  0 2.5% 0%;
	border-bottom: 2px solid rgba(249,249,249,0.20)
}
.clearlist {
	clear: both;
	width: 95%;
	margin: 5% 2.5%;
	padding: 2.5% 0;
	border-bottom: 2px solid rgba(249,249,249,0.20)
}
.build {
	width: 43%;
	margin: 2.5%;
	padding: 0;
	float: left;
	background-color: rgba(249,249,249,0.20)
}
.build a {
	font-size: 20px;
}
.btn {
  	display: inline-block;
  	padding: 1.5% 0 2.5% 2%;
  	background: none;
	color: #fff;
	text-decoration: none;
  	font-weight: bold;
  	position: relative;
  	transition:color 0.25s ease;
  	background-color: rgba(249,249,249,0.05)
}
.trf {
	padding:0;
    width:20vw;
    height:20vw;
	margin: 5% auto;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.trf a{
	padding:0;
    width:20vw;
    height:20vw;
	float: left;
	margin: auto;
	background:url("images/three-ring-focus.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
	opacity:0.15;
	transition: opacity .6s ease-in-out;
	-o-transition:opacity .6s ease-in-out;
	-moz-transition:opacity .6s ease-in-out;
	-webkit-transition:opacity .6s ease-in-out;
}
.logo {
	margin: 2.5% auto;
	padding:0;
    width:276px;
    height:139px;
	float: none;
	background:url("images/3rf-lab-logo-r.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.logo a{
	margin: 2.5% auto;
	padding:0;
    width:276px;
    height:139px;
	float: none;
	background:url("images/3rf-lab-logo.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
	transition: opacity .6s ease-in-out;
	-o-transition:opacity .6s ease-in-out;
	-moz-transition:opacity .6s ease-in-out;
	-webkit-transition:opacity .6s ease-in-out;
}	
.flexy {
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
}



/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
.listing {
	width: 95%;
	color: rgba(249,249,249,0.40);
	font-size: 35px;
	font-weight: 200;
	letter-spacing: 4px;
	margin: 2.5%;
	padding: 2.5%  0 2.5% 0%;
	border-bottom: 2px solid rgba(249,249,249,0.20)
}
.clearlist {
	clear: both;
	width: 95%;
	margin: 5% 2.5%;
	padding: 2.5% 0;
	border-bottom: 2px solid rgba(249,249,249,0.20)
}
.build {
	width: 93%;
	margin: 2.5%;
	padding: 0;
	float: left;
	background-color: rgba(249,249,249,0.20)
}
.build a {
	font-size: 20px;
}
.btn {
  	display: inline-block;
  	padding: 1.5% 0 2.5% 2%;
  	background: none;
	color: #fff;
	text-decoration: none;
  	font-weight: bold;
  	position: relative;
  	transition:color 0.25s ease;
  	background-color: rgba(249,249,249,0.05)
}
.trf {
	padding:0;
    width:28vw;
    height:28vw;
	margin: 5% auto;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.trf a{
	padding:0;
    width:28vw;
    height:28vw;
	float: left;
	margin: auto;
	background:url("images/three-ring-focus.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
	opacity:0.15;
	transition: opacity .6s ease-in-out;
	-o-transition:opacity .6s ease-in-out;
	-moz-transition:opacity .6s ease-in-out;
	-webkit-transition:opacity .6s ease-in-out;
}
.logo {
	margin: 2.5% auto;
	padding:0;
    width:276px;
    height:139px;
	float: none;
	background:url("images/3rf-lab-logo-r.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.logo a{
	margin: 2.5% auto;
	padding:0;
    width:276px;
    height:139px;
	float: none;
	background:url("images/3rf-lab-logo.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
	transition: opacity .6s ease-in-out;
	-o-transition:opacity .6s ease-in-out;
	-moz-transition:opacity .6s ease-in-out;
	-webkit-transition:opacity .6s ease-in-out;
}	
}













