@charset "UTF-8";
/* CSS Document */


.thumbnail-tablet {
  position: relative;
		
  -ms-zoom: 0.25;
  -moz-transform: scale(0.25);
  -moz-transform-origin: 0 0;
  -o-transform: scale(0.25);
  -o-transform-origin: 0 0;
  -webkit-transform: scale(0.25);
  -webkit-transform-origin: 0 0;
}
		

.thumbnail-tablet iframe {
  width: 700px;
  height: 914px;
  opacity: 0;
  transition: all 300ms ease-in-out;

}


.thumbnail-container-tablet {
  width: calc(700px * 0.25 + 32px);
  height: calc(914px * 0.25 + 42px);
  display: inline-block;
  overflow: hidden;
  position: relative;
  background-image: url("http://preview.4at5.net/email_domains/yes/hub_pages/images/blank3.gif");
  background-position: -120px 0px;
  background-repeat: no-repeat;
  background-size: 353px;
  padding: 52px 0px 0px 26px;
}


.thumbnail-mobile {
  position: relative;
		
  -ms-zoom: 0.25;
  -moz-transform: scale(0.25);
  -moz-transform-origin: 0 0;
  -o-transform: scale(0.25);
  -o-transform-origin: 0 0;
  -webkit-transform: scale(0.25);
  -webkit-transform-origin: 0 0;
}
		

.thumbnail-mobile iframe {
  width: 332px;
  height: 572px;
  opacity: 0;
  transition: all 300ms ease-in-out;
}


.thumbnail-container-mobile {
  width: calc(330px * 0.25 + 16px);
  height: calc(550px * 0.25 + 45px);
  display: inline-block;
  overflow: hidden;
  position: relative;
  background-image: url("http://preview.4at5.net/email_domains/yes/hub_pages/images/blank3.gif");
  background-position: 0px -120px;
  background-repeat: no-repeat;
  background-size: 353px;
  padding: 28px 0px 0px 17px;
}

		
		
.thumbnail-banner {
	padding: 22px 60px 80px 70px; 
	display: inline-block;
	vertical-align: top;
}


		

.overlay_button {
  position:absolute;
  width:700px;
  height:1000px;
  left:0px;
  top:0px;
  
}



.project-container {
	width: 400px;
	padding: 0px 20px 80px 60px;
	display: inline-block;
	vertical-align: top;
	
}

.project-container-img {
	padding: 0px 80px 100px 60px;
	display: inline-block;
	vertical-align: top;
	
}



.project-name {
	font-family: arial;
	font-size: 20px;
	text-decoration: none;
	color: #000000;
	text-transform: uppercase;
	font-weight: bold;
	padding: 40px 0px 0px 6px;
	
}

.project-type {
	font-family: arial;
	font-size: 16px;
	text-decoration: none;
	color: #666666;
	font-weight: normal;
	padding: 20px 0px 0px 6px;
	
}

.project-description {
	font-family: arial;
	font-size: 16px;
	text-decoration: none;
	line-height: 22px;
	color: #666666;
	font-weight: normal;
	padding: 20px 0px 0px 6px;
	
}

.sl::before {
	content: "SL: ";
	font-weight: bold;

}

.sl1::before {
	content: "SL1: ";
	font-weight: bold;

}

.sl2::before {
	content: "SL2: ";
	font-weight: bold;

}

.sl3::before {
	content: "SL3: ";
	font-weight: bold;

}


.ph::before {
	content: "PH: ";
	font-weight: bold;

}

.ph1::before {
	content: "PH1: ";
	font-weight: bold;

}

.ph2::before {
	content: "PH2: ";
	font-weight: bold;

}

.ph3::before {
	content: "PH3: ";
	font-weight: bold;

}


.project-link {
	color: #ffffff;
	text-decoration: none;
	
}