﻿html
{
	height:100%;
	margin:0px;

	background-color:black;

	font-family:"Lato",Arial;
	font-size:18px;
	font-weight:400;

	color:white;
}
body
{
	height:100%;
	margin:0px;
	padding:0px;
}
h2
{
	margin-left:-5px;
	margin-bottom:15px;

	font-size:65px;
	font-weight:300;
}
@media(max-width:767px){
h2
{
	font-size:44px;
}
}
h3
{
	margin-left:-2px;
	margin-top:15px;

	font-size:30px;
	font-weight:300;
}
@media(max-width:767px){
h3
{
	font-size:24px;
}
}
h4
{
	text-transform:uppercase;
	font-size:22px;
	font-weight:300;
	letter-spacing:3px;
}
img
{
	max-width:100%;
}
a:link
{
	text-decoration:none;
	color:gray;
}
a:visited
{
	text-decoration:none;
	color:gray;
}
a:hover
{
	text-decoration:none;
	color:rgb(45,130,255);
}
a:active
{
	text-decoration:none;
	color:rgb(45,130,255);
}
a:link.white-theme
{
	text-decoration:underline;
	color:rgb(45,115,210);
}
a:visited.white-theme
{
	text-decoration:underline;
	color:rgb(45,115,210);
}
a:hover.white-theme
{
	text-decoration:underline;
	color:rgb(55,55,55);
}
a:active.white-theme
{
	text-decoration:underline;
	color:rgb(55,55,55);
}
#viewport
{
	overflow:hidden;

	width:100%;
}
.content
{
	position:relative;

	width:1100px;
	margin:auto;
}
@media(max-width:767px){
.content
{
	width:auto;

	margin-left:30px;
	margin-top:0px;
	margin-right:30px;
	margin-bottom:0px;
}
}
.rsOverflow
{
	position:relative;
	float:left;

	width:100%;
	height:100%;
}
.rsContainer
{
	position:relative;

	width:100%;
	height:100%;
}
.rsSlide
{
	position:absolute;
	display:block;

	left:0px;
	top:0px;

	width:100%;
	height:100%;
}
.row:after
{
	content:"";

	display:table;
	clear:both;
}
.column-2
{
	position:relative;
	float:right;

	width:500px;
}
@media(max-width:767px){
.column-2
{
	float:none;

	width:100%;
}
}
.column-2:first-child
{
	float:left;
}
.column-3
{
	position:relative;
	float:left;

	width:345px;
	margin-left:30px;
}
@media(max-width:767px){
.column-3
{
	float:none;

	width:100%;
	margin:0px;
}
}
.column-3:first-child
{
	margin-left:0px;
}
.area-fit
{
	position:relative;
	display:table;
	table-layout:fixed;

	width:100%;
	height:100%;
}
.center-vertical
{
	display:table-cell;
	vertical-align:middle;
}
.center-horizontal
{
	text-align:center;
}
.center-item img
{
	position:absolute;

	left:0px;
	top:0px;
	right:0px;
	bottom:0px;

	margin:auto;
}
.circle
{
	/* Make the div appear circular */
	-webkit-border-radius:100%;
	-moz-border-radius:100%;
	-ms-border-radius:100%;
	-o-border-radius:100%;
	border-radius:100%;

	position:absolute;
	z-index:2;

	width:150px;
	height:150px;
	margin:auto;

	border:5px solid rgb(235,235,235);

	background-color:rgb(247,247,247);
}
@media(max-width:767px){
.circle
{
	width:80px;
	height:80px;
}
}
.circle a
{
	position:absolute;

	width:100%;
	height:100%;

	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
}
.circle img
{
	/* Crop the image to a circle */
	-webkit-border-radius:100%;
	-moz-border-radius:100%;
	-ms-border-radius:100%;
	-o-border-radius:100%;
	border-radius:100%;
}
.circle .label
{
	position:absolute;
	display:table;

	width:100%;
	height:100%;

	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
}
.circle .label .label-text
{
	display:table-cell;

	padding-bottom:5%;

	font-size:26px;
	font-weight:400;

	vertical-align:middle;

	color:white;
}
@media(max-width:767px){
.circle .label .label-text
{
	font-size:14px;
}
}
.circle .label .label-image
{
	display:table-cell;

	width:80%;
	height:80%;

	padding:10%;

	vertical-align:middle;
}
.circle .label .label-image img
{
	/* No corner beveling */
	-webkit-border-radius:0%;
	-moz-border-radius:0%;
	-ms-border-radius:0%;
	-o-border-radius:0%;
	border-radius:0%;

	width:100%;
}
.primary
{
	position:relative;
	overflow:hidden;

	height:320px;

	background-position:top center;
	background-size:cover;
}
@media(max-width:767px){
.primary
{
	height:200px;
}
}
@media(max-width:480px){
.primary
{
	height:160px;
}
}
.primary .angle
{
	/* Rotate the element so that it renders across the screen at an angle */
	-webkit-transform:rotate(5deg);
	-moz-transform:rotate(5deg);
	-ms-transform:rotate(5deg);
	transform:rotate(5deg);

	position:absolute;

	left:-10%;
	bottom:-100px;

	width:120%;
	height:200px;

	background-color:white;
}
.about
{
	position:relative;

	min-width:1250px;

	padding-top:50px;
	padding-bottom:200px;

	background-color:white;
	color:rgb(59,59,59);
}
@media(max-width:767px){
.about
{
	margin-top:-40px;

	padding-top:0px;
}
}
@media(max-width:480px){
.about
{
	margin-top:-80px;
}
}
@media(max-width:767px){
.about
{
	min-width:100%;

	padding-bottom:0px;
}
}
@media(min-width:767px){
.about .content
{
	/* Ease in any changes */
	-webkit-transition:opacity 1.5s ease-out;
	-moz-transition:opacity 1.5s ease-out;
	-ms-transition:opacity 1.5s ease-out;
	-o-transition:opacity 1.5s ease-out;
	transition:opacity 1.5s ease-out;

	opacity:0.0;
}
}
.about-active .content
{
	opacity:1.0;
}
@media(max-width:767px){
.about .portrait
{
	position:relative;
	display:table;
	table-layout:fixed;

	width:100%;

	padding-top:10px;
}
}
.about .portrait img
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.6s linear;
	-moz-transition:opacity 0.6s linear;
	-ms-transition:opacity 0.6s linear;
	-o-transition:opacity 0.6s linear;
	transition:opacity 0.6s linear;

	position:absolute;

	right:0px;
	bottom:0px;

	opacity:0.0;
}
@media(max-width:767px){
.about .portrait img
{
	position:relative;
	display:table-cell;
	vertical-align:bottom;
	float:right;
	margin-bottom:-1px;
}
}
.about-active .portrait img
{
	opacity:1.0;
}
.welcome
{
	position:relative;
	overflow:hidden;

	padding-top:140px;
}
.welcome .text
{
	margin:auto;

	text-align:center;
}
.welcome .graphic
{
	position:relative;

	height:540px;
}
@media(max-width:767px){
.welcome
{
	padding-top:85px;
}
.welcome .text
{
	padding-bottom:55px;
}
.welcome .graphic
{
	height:240px;
}
}
.specialties
{
	margin-bottom:150px;

	padding-left:0px;
	padding-top:140px;
	padding-right:0px;
	padding-bottom:140px;

	background-color:white;
	color:rgb(59,59,59);
}
@media(max-width:767px){
.specialties
{
	padding-top:60px;
	padding-bottom:40px;
}
}
.specialties h4
{
	margin-bottom:50px;

	text-align:center;
}
.specialties ul
{
	height:115px;
	margin:0px;
	padding:0px;

	list-style:none;

	text-align:center;
}
.gallery .rsNav
{
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;

	position:absolute;
	z-index:1;

	bottom:0px;
	left:0px;
	right:0px;

	width:80%;
	height:8px;
	margin:auto;

	text-align:center;
}
.gallery .rsNav div, .exposition .slide-navigation a
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.5s ease;
	-moz-transition:opacity 0.5s ease;
	-ms-transition:opacity 0.5s ease;
	-o-transition:opacity 0.5s ease;
	transition:opacity 0.5s ease;

	/* Make the navigation buttons appear circular */
	-webkit-border-radius:100%;
	-moz-border-radius:100%;
	-ms-border-radius:100%;
	-o-border-radius:100%;
	border-radius:100%;

	display:inline-block;

	width:9px;
	height:9px;
	margin-left:9px;
	margin-top:0px;
	margin-right:9px;
	margin-bottom:0px;

	background-color:rgb(21,162,255);

	opacity:0.5;

	cursor:default;
}
@media(max-width:767px){
.gallery .rsNav div, .exposition .slide-navigation a
{
	width:12px;
	height:12px;
	margin-left:12px;
	margin-right:12px;
}
}
.gallery .rsNav div:hover, .gallery .rsNav .rsNavSelected, .exposition .slide-navigation a:hover, .exposition .slide-navigation a.active
{
	/* Apply a glow around the selected and hovered navigation buttons */
	-webkit-box-shadow:0px 0px 10px 5px rgba(21,162,255,0.6);
	-moz-box-shadow:0px 0px 10px 5px rgba(21,162,255,0.6);
	-ms-box-shadow:0px 0px 10px 5px rgba(21,162,255,0.6);
	-o-box-shadow:0px 0px 10px 5px rgba(21,162,255,0.6);
	box-shadow:0px 0px 10px 5px rgba(21,162,255,0.6);

	opacity:1.0;
}
.gallery
{
	position:relative;

	padding-left:0px;
	padding-top:0px;
	padding-right:0px;
	padding-bottom:180px;

	text-align:center;

	z-index:4;
}
.gallery h4
{
	margin-bottom:50px;

	text-align:center;

	color:rgb(137,137,137);
}
.gallery .slides
{
	position:relative;

	width:450px;
	height:410px;
	margin:auto;
}
@media(max-width:767px){
.gallery .slides
{
	width:250px;
	height:310px;
}
}
.gallery .slide
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.25s ease;
	-moz-transition:opacity 0.25s ease;
	-ms-transition:opacity 0.25s ease;
	-o-transition:opacity 0.25s ease;
	transition:opacity 0.25s ease;

	opacity:0.3;
}
.gallery .rsActiveSlide .slide
{
	opacity:1.0;
}
.gallery .slide-title
{
	display:block;

	margin-bottom:18px; 

	font-size:32px;
	font-weight:300;

	color:rgb(21,162,255);
}
@media(max-width:767px){
.gallery .slide-title
{
	font-size:28px;
}
}
.gallery .slide-media
{
	position:relative;

	width:100%;
	height:0px;

	padding-top:56.22%; /* Background Aspect Ratio: 450px/253px */

	background-size:contain;
	background-repeat:no-repeat;
}
@media(max-width:767px){
.gallery .slide-media
{
	padding-top:56.4%; /* Background Aspect Ratio: 250px/141px */
}
}
.gallery .slide-image-link
{
	font-size:12px;
}
.delay-load-video:hover
{
	cursor:pointer;
}
.video-player-icon
{
	position:absolute;

	width:10%;
	height:0px;

	padding-top:6.5%;

	left:45%;
	top:44%;

	background-image:url("http://www.russellmatteson.com/images/youtube-dark.svg");
	background-size:contain;
	background-repeat:no-repeat;
}
@media(max-width:767px){
.video-player-icon
{
	width:20%;

	padding-top:12%;

	left:40%;
	top:39.5%;
}
}
.delay-load-video:hover .video-player-icon
{
	background-image:url("http://www.russellmatteson.com/images/youtube-color-gradient.svg");
}
@media(max-width:767px){
.delay-load-video:hover .video-player-icon
{
	background-image:url("http://www.russellmatteson.com/images/youtube-color-solid.svg");
}
}
.gallery .video-frame
{
	position:absolute;

	width:100%;
	height:100%;

	top:0px;
	left:0px;
}
.exposition
{
	position:relative;

	height:800px;

	margin-bottom:150px;

	background-color:white;
	color:rgb(59,59,59);
}
@media(max-width:767px){
.exposition
{
	height:920px;

	margin-bottom:80px;
}
}
.exposition .slide-navigation
{
	position:absolute;
	z-index:4;

	bottom:100px;
	left:0px;
	right:0px;

	width:150px;
	height:8px;
	margin:auto;

	text-align:center;
}
.exposition .slides
{
	position:relative;
	overflow:hidden;

	width:100%;
	height:100%;

	padding-bottom:180px;
}
.exposition .slide
{
	/* Ease in any changes */
	-webkit-transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
	-o-transition:all 0.5s ease;
	transition:all 0.5s ease;

	position:absolute;
	z-index:0;

	width:100%;
	height:100%;

	margin-top:100px;

	opacity:0.0;
}
.exposition .active-slide
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.5s ease 0.1s, margin-top 0.5s ease 0.5s;
	-moz-transition:opacity 0.5s ease 0.1s, margin-top 0.5s ease 0.5s;
	-ms-transition:opacity 0.5s ease 0.1s, margin-top 0.5s ease 0.5s;
	-o-transition:opacity 0.5s ease 0.1s, margin-top 0.5s ease 0.5s;
	transition:opacity 0.5s ease 0.1s, margin-top 0.5s ease 0.5s;

	margin-top:0px;

	opacity:1.0;
}
.exposition .slide-text
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-moz-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-ms-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-o-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);

	opacity:0.0;
}
.exposition .active-slide .slide-text
{
	opacity:1.0;
}
.exposition h3
{
	color:rgb(83,83,83);
}
.exposition .hover-gallery
{
	position:relative;

	height:100%;
}
.exposition .hover-picker
{
	position:relative;

	height:200px;

	margin-left:-25px;
	margin-right:-55px;
}
@media(max-width:767px){
.exposition .hover-picker
{
	height:85px;
	
	margin-left:-20px;
	margin-top:25px;
	margin-right:auto;
	margin-bottom:25px;
}
}
.exposition .hover-button .circle:hover, .exposition .active-button .circle
{
	/* Apply a glow around the selected and hovered buttons */
	-webkit-box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
	-moz-box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
	-ms-box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
	-o-box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
	box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
}
.exposition .hover-collection
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.5s cubic-bezier(0.23,1.0,0.32,1.0);
	-moz-transition:opacity 0.5s cubic-bezier(0.23,1.0,0.32,1.0);
	-ms-transition:opacity 0.5s cubic-bezier(0.23,1.0,0.32,1.0);
	-o-transition:opacity 0.5s cubic-bezier(0.23,1.0,0.32,1.0);
	transition:opacity 0.5s cubic-bezier(0.23,1.0,0.32,1.0);

	position:absolute;

	width:50%;
	height:100%;

	left:0px;
	top:0px;

	margin-left:50%;

	padding-left:100px;

	opacity:0.0;
}
@media(max-width:767px){
.exposition .hover-collection
{
	position:relative;

	width:100%;

	margin-left:0%;

	padding-left:0px;
}
}
.exposition .active-slide .hover-collection
{
	opacity:1.0;
}
.exposition .waypoint-container
{
	/* Ease in any changes */
	-webkit-transition:margin-left 0.5s ease;
	-moz-transition:margin-left 0.5s ease;
	-ms-transition:margin-left 0.5s ease;
	-o-transition:margin-left 0.5s ease;
	transition:margin-left 0.5s ease;

	margin-left:33%;
}
.exposition-active .waypoint-container
{
	margin-left:0%;
}
.exposition .hover-item
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.5s ease;
	-moz-transition:opacity 0.5s ease;
	-ms-transition:opacity 0.5s ease;
	-o-transition:opacity 0.5s ease;
	transition:opacity 0.5s ease;

	position:absolute;

	width:auto;
	height:auto;

	bottom:355px;

	opacity:0.0;
}
@media(max-width:767px){
.exposition .hover-item
{
	width:100%;

	top:0px;
	bottom:auto;
}
}
.exposition-active .hover-item
{
	/* Ease in any changes */
	-webkit-transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
	-o-transition:all 0.5s ease;
	transition:all 0.5s ease;

	margin-left:33%;

	opacity:0.0;
}
.exposition-active .active-item
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.5s ease 0.1s, margin-left 0.5s ease 0.5s;
	-moz-transition:opacity 0.5s ease 0.1s, margin-left 0.5s ease 0.5s;
	-ms-transition:opacity 0.5s ease 0.1s, margin-left 0.5s ease 0.5s;
	-o-transition:opacity 0.5s ease 0.1s, margin-left 0.5s ease 0.5s;
	transition:opacity 0.5s ease 0.1s, margin-left 0.5s ease 0.5s;

	margin-left:0px;

	opacity:1.0;
}
.exposition-active .hover-item img
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-moz-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-ms-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-o-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);

	opacity:0.0;
}
.exposition-active .active-item img
{
	opacity:1.0;
}
.exposition .circle
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-moz-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-ms-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-o-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);

	opacity:0.0;
}
.exposition .active-slide .circle
{
	opacity:1.0;
}
.exposition .circle-1
{
	bottom:0px;
	left:0px;
}
.exposition .active-slide .circle-1
{
	bottom:0px;
	left:0px;
}
.exposition .circle-2
{
	bottom:18px; /* slope = 5 degrees = 0.0875; y = (diameter + 60) * slope */
	left:210px; /* x = diameter + 60 */
}
.exposition .active-slide .circle-2
{
	bottom:18px; /* slope = 5 degrees = 0.0875; y = (diameter + 60) * slope */
	left:210px; /* x = diameter + 60 */
}
.exposition .circle-3
{
	bottom:37px; /* slope = 5 degrees = 0.0875; y = (diameter + 60) * 2 * slope */
	left:420px; /* x = (diameter + 60) * 2 */
}
.exposition .active-slide .circle-3
{
	bottom:37px; /* slope = 5 degrees = 0.0875; y = (diameter + 60) * 2 * slope */
	left:420px; /* x = (diameter + 60) * 2 */
}
@media(max-width:767px){
.exposition .circle-2
{
	bottom:0px;
	left:104px; /* x = diameter + 24 */
}
.exposition .active-slide .circle-2
{
	bottom:0px;
	left:104px; /* x = diameter + 24 */
}
.exposition .circle-3
{
	bottom:0px;
	left:209px; /* x = (diameter + 24) * 2 */
}
.exposition .active-slide .circle-3
{
	bottom:0px;
	left:209px; /* x = (diameter + 24) * 2 */
}
}
.exposition .angle
{
	/* Rotate the element so that it renders across the screen at an angle */
	-webkit-transform:rotate(-5deg);
	-moz-transform:rotate(-5deg);
	-ms-transform:rotate(-5deg);
	transform:rotate(-5deg);

	position:absolute;
	z-index:3;

	left:-10%;
	bottom:-100px;

	width:120%;
	height:450px;

	background-color:black;
}
.exposition .angle-fade
{
	/* Rotate the element so that it renders across the screen at an angle */
	-webkit-transform:rotate(-5deg);
	-moz-transform:rotate(-5deg);
	-ms-transform:rotate(-5deg);
	transform:rotate(-5deg);

	position:absolute;
	z-index:1;

	left:-10%;
	bottom:0px;

	width:120%;
	height:450px;

	background:-webkit-linear-gradient(rgba(21,162,255,0.0) 0%, rgba(21,162,255,1.0) 22%);
	background:-moz-linear-gradient(rgba(21,162,255,0.0) 0%, rgba(21,162,255,1.0) 22%);
	background:-ms-linear-gradient(rgba(21,162,255,0.0) 0%, rgba(21,162,255,1.0) 22%);
	background:linear-gradient(rgba(21,162,255,0.0) 0%, rgba(21,162,255,1.0) 22%);
}
@media(max-width:767px){
.exposition .angle-fade
{
	bottom:235px;

	height:150px;
}
}
.exposition .cover
{
	position:absolute;
	z-index:10;

	top:980px;

	width:100%;
	height:1px;

	background-color:black;
}
.details
{
	position:relative;
	overflow:hidden;

	padding-left:0px;
	padding-top:100px;
	padding-right:0px;
	padding-bottom:200px;

	background-color:white;
	color:rgb(59,59,59);
}
.details h3
{
	color:rgb(83,83,83);
}
.details .graphic
{
	padding-left:0px;
	padding-top:100px;
	padding-right:0px;
	padding-bottom:100px;
}
@media(max-width:767px){
.details .graphic
{
	padding-top:30px;
	padding-bottom:60px;
}
}
.details .expanding-circles
{
	/* Ease in any changes */
	-webkit-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-moz-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-ms-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	-o-transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);
	transition:opacity 0.75s cubic-bezier(0.23,1.0,0.32,1.0);

	position:relative;

	width:360px;
	height:360px;
	margin:auto;
}
@media(max-width:767px){
.details .expanding-circles
{
	width:192px;
	height:192px;
}
}
.details .expanding-circles .center
{
	/* Make the div appear circular */
	-webkit-border-radius:100%;
	-moz-border-radius:100%;
	-ms-border-radius:100%;
	-o-border-radius:100%;
	border-radius:100%;

	-webkit-box-shadow:0px 0px 15px 0px rgba(0,0,255,0.2);
	-moz-box-shadow:0px 0px 15px 0px rgba(0,0,255,0.2);
	-ms-box-shadow:0px 0px 15px 0px rgba(0,0,255,0.2);
	-o-box-shadow:0px 0px 15px 0px rgba(0,0,255,0.2);
	box-shadow:0px 0px 15px 0px rgba(0,0,255,0.2);

	position:absolute;
	z-index:3;

	left:0px;
	top:0px;
	right:0px;
	bottom:0px;

	width:110px;
	height:110px;
	margin:auto;

	border:5px solid white;

	background-color:rgb(188,241,255);
}
@media(max-width:767px){
.details .expanding-circles .center
{
	width:65px;
	height:65px;
}
}
.details .expanding-circles .center img
{
	/* Crop the image to a circle */
	-webkit-border-radius:100%;
	-moz-border-radius:100%;
	-ms-border-radius:100%;
	-o-border-radius:100%;
	border-radius:100%;

	background-color:white;
}
.details .expanding-circles .circle
{
	/* Ease in any changes */
	-webkit-transition:all 0.75s cubic-bezier(0.23,1.0,0.32,1.0), -webkit-box-shadow 0.2s cubic-bezier(0.23,1.0,0.32,1.0);
	-moz-transition:all 0.75s cubic-bezier(0.23,1.0,0.32,1.0), -moz-box-shadow 0.2s cubic-bezier(0.23,1.0,0.32,1.0);
	-ms-transition:all 0.75s cubic-bezier(0.23,1.0,0.32,1.0), -ms-box-shadow 0.2s cubic-bezier(0.23,1.0,0.32,1.0);
	-o-transition:all 0.75s cubic-bezier(0.23,1.0,0.32,1.0), -o-box-shadow 0.2s cubic-bezier(0.23,1.0,0.32,1.0);
	transition:all 0.75s cubic-bezier(0.23,1.0,0.32,1.0), box-shadow 0.2s cubic-bezier(0.23,1.0,0.32,1.0);

	opacity:0.0;
}
.details-active .expanding-circles .circle
{
	opacity:1.0;
}
.details-active .expanding-circles .circle:hover
{
	/* Apply a glow around the hovered button */
	-webkit-box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
	-moz-box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
	-ms-box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
	-o-box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
	box-shadow:0px 0px 10px 0px rgba(21,162,255,1.0);
}
.details .expanding-circles .circle-1
{
	top:40px; /*circlecenter=sin(60)*(regionradius-(circleradius+30)); top=regionradius-(circlecenter+circleradius)*/
	left:auto;
	right:67px; /*circlecenter=cos(60)*(regionradius-(circleradius+30)); right=regionradius-(circlecenter+circleradius)*/
	bottom:auto;
}
.details-active .expanding-circles .circle-1
{
	top:-69px; /*circlecenter=sin(60)*(regionradius+21); top=regionradius-(circlecenter+circleradius)*/
	left:auto;
	right:4px; /*circlecenter=cos(60)*(regionradius+21); right=regionradius-(circlecenter+circleradius)*/
	bottom:auto;
}
.details .expanding-circles .circle-2
{
	top:0px;
	left:30px; /*circlecenter=cos(180)*(regionradius-(circleradius+30)); left=circlecenter+regionradius-circleradius*/
	right:auto;
	bottom:0px;
}
.details-active .expanding-circles .circle-2
{
	top:0px;
	left:-96px; /*circlecenter=cos(180)*(regionradius+21); left=circlecenter+regionradius-circleradius*/
	right:auto;
	bottom:0px;
}
.details .expanding-circles .circle-3
{
	top:auto;
	left:auto;
	right:67px; /*circlecenter=cos(60)*(regionradius-(circleradius+30)); right=regionradius-(circlecenter+circleradius)*/
	bottom:40px; /*circlecenter=sin(60)*(regionradius-(circleradius+30)); bottom=regionradius-(circlecenter+circleradius)*/
}
.details-active .expanding-circles .circle-3
{
	top:auto;
	left:auto;
	right:4px; /*circlecenter=cos(60)*(regionradius+21); right=regionradius-(circlecenter+circleradius)*/
	bottom:-69px; /*circlecenter=sin(60)*(regionradius+21); bottom=regionradius-(circlecenter+circleradius)*/
}
@media(max-width:767px){
.details .expanding-circles .circle-1
{
	top:auto;
	left:auto;
	right:21px; /*circlecenter=cos(-30)*(regionradius-(circleradius+16)); right=regionradius-(circlecenter+circleradius)*/
	bottom:36px; /*circlecenter=sin(-30)*(regionradius-(circleradius+16)); bottom=circlecenter+regionradius-circleradius*/
}
.details-active .expanding-circles .circle-1
{
	top:auto;
	left:auto;
	right:-37px; /*circlecenter=cos(-30)*(regionradius+11); right=regionradius-(circlecenter+circleradius)*/
	bottom:3px; /*circlecenter=sin(-30)*(regionradius+11); bottom=circlecenter+regionradius-circleradius*/
}
.details .expanding-circles .circle-2
{
	top:16px; /*circlecenter=-sin(90)*(regionradius-(circleradius+16)); top=circlecenter+regionradius-circleradius*/
	left:0px;
	right:0px;
	bottom:auto;
}
.details-active .expanding-circles .circle-2
{
	top:-51px; /*circlecenter=-sin(90)*(regionradius+11); top=circlecenter+regionradius-circleradius*/
	left:0px;
	right:0px;
	bottom:auto;
}
.details .expanding-circles .circle-3
{
	top:auto;
	left:21px; /*circlecenter=cos(210)*(regionradius-(circleradius+16)); left=circlecenter+regionradius-circleradius*/
	right:auto;
	bottom:36px; /*circlecenter=sin(210)*(regionradius-(circleradius+16)); bottom=circlecenter+regionradius-circleradius*/
}
.details-active .expanding-circles .circle-3
{
	top:auto;
	left:-37px; /*circlecenter=cos(210)*(regionradius+11); left=circlecenter+regionradius-circleradius*/
	right:auto;
	bottom:3px; /*circlecenter=sin(210)*(regionradius+11); bottom=circlecenter+regionradius-circleradius*/
}
}
.details .text
{
	padding-left:0px;
	padding-top:100px;
	padding-right:0px;
	padding-bottom:100px;
}
.details .angle
{
	/* Rotate the element so that it renders across the screen at an angle */
	-webkit-transform:rotate(-5deg);
	-moz-transform:rotate(-5deg);
	-ms-transform:rotate(-5deg);
	transform:rotate(-5deg);

	position:absolute;
	z-index:1;

	left:-10%;
	bottom:-100px;

	width:120%;
	height:200px;

	background-color:black;
}
.details .angle-fade
{
	/* Rotate the element so that it renders across the screen at an angle */
	-webkit-transform:rotate(-5deg);
	-moz-transform:rotate(-5deg);
	-ms-transform:rotate(-5deg);
	transform:rotate(-5deg);

	position:absolute;
	z-index:0;

	left:-10%;
	bottom:0px;

	width:120%;
	height:200px;

	background:-webkit-linear-gradient(rgba(21,162,255,0.0) 0%, rgba(21,162,255,1.0) 50%);
	background:-moz-linear-gradient(rgba(21,162,255,0.0) 0%, rgba(21,162,255,1.0) 50%);
	background:-ms-linear-gradient(rgba(21,162,255,0.0) 0%, rgba(21,162,255,1.0) 50%);
	background:linear-gradient(rgba(21,162,255,0.0) 0%, rgba(21,162,255,1.0) 50%);
}
@media(max-width:767px){
.details .angle-fade
{
	bottom:30px;

	height:140px;
}
}
footer
{
	padding-left:0px;
	padding-top:100px;
	padding-right:0px;
	padding-bottom:200px;

	text-align:center;
	font-size:14px;
}
footer .linkedin-image
{
	padding-right:4px;
	height:20px;
	vertical-align:bottom;
}
footer .linkedin-text
{
	display:inline-block;
	padding-bottom:1px;
}