/* @override http://t.dev/engine/css/style.css

	http://t.dev/engine/css/big.css
	http://t.dev/min/g=css&debudg */

@import "reset.css";

  /* ----------- Non-Retina Screens ----------- */
@media screen 
and (min-device-width: 1200px) 
and (max-device-width: 1600px) 
and (-webkit-min-device-pixel-ratio: 1) { 
	html {
		zoom: 1;
	  }
}

/* ----------- Retina Screens ----------- */
@media screen 
and (min-device-width: 1200px) 
and (max-device-width: 1600px) 
and (-webkit-min-device-pixel-ratio: 2)
and (min-resolution: 192dpi) {
	html {
		zoom: 2;
	  }
}

::selection,
#nmLink::selection {
	/* Safari */
	background-color: rgba(0, 0, 0, 0);
}

::-moz-selection {
	/* Firefox */
	background-color: rgba(0, 0, 0, 0);
}

body {
	background: url(../img/bg.jpg) repeat;
	color     : white;
	font      : bold 10pt "Courier New", Courier, mono;
	overflow  : hidden;
}

/* rest a styles */
a {
	color          : white;
	text-decoration: none;
}

#wrapper {
	height  : 100vh;
	/* width: calc(50% - 10px); */
}

#firstName.active,
#lastName.active,
#lastName.fnActive,
#eith.inactive,
#firstName.inactive,
#atSign.active,
#domain.active,
#firstName.asActive,
#lastName.asActive,
#atSign.inactive,
#domain.inactive,
#titleContainer.fnActive,
#titleContainer.asActive,
#titleContainer.lnActive,
#titleContainer.dActive,
#titleInfo.active,
footer:hover #copyright,
#music #artistsList li,
#music #artistsList .alImage,
#vcard #resume,
.gSection .poloroid {
	-webkit-transition: all 0.1s ease-out;
	-moz-transition   : all 0.1s ease-out;
	-o-transition     : all 0.1s ease-out;
	-ms-transition    : all 0.1s ease-out;
	transition        : all 0.1s ease-out;
}

#atSign,
#domain,
#lastName,
#firstName,
#titleContainer,
#titleInfo,
footer #copyright {
	-webkit-transition: all 0.1s ease-in;
	-moz-transition   : all 0.1s ease-in;
	-o-transition     : all 0.1s ease-in;
	-ms-transition    : all 0.1s ease-in;
	transition        : all 0.1s ease-in;
}

#headerContainer {
	height            : 354px;
	background        : url(../img/headerShad.png) repeat-x 0 bottom;
	position          : relative;
	min-width         : 320px;
	z-index           : 1;
	-webkit-transform : translate3d(0, 0, 0);
	width             : 100%;
	margin-left       : auto;
	margin-right      : auto;
	-moz-box-shadow   : 0 1px 0 rgba(255, 255, 255, 0.03);
	-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03);
	box-shadow        : 0 1px 0 rgba(255, 255, 255, 0.03);
	-moz-opacity      : 1;
	-ms-filter        : "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)";
	/* IE8 */
	filter            : progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF);
	/* IE6 & 7 */
	zoom              : 1;
	opacity           : 1;
	overflow          : visible;
}

header {
	background: url(../img/bgHeader.jpg) #404040;
	overflow  : visible;
}

footer {
	position : absolute;
	width    : 100%;
	z-index  : 10;
	bottom   : 0;
	min-width: 320px;
}

footer div {
	color         : #141414;
	font-weight   : bold;
	font-size     : 11px;
	padding-left  : 10px;
	text-align    : right;
	letter-spacing: 1px;
}

footer #copyright {
	position   : absolute;
	bottom     : 7px;
	right      : 85px;
	white-space: nowrap;
	overflow   : hidden;
	width      : 0px;
}

footer:hover #copyright {
	width: 350px;
}

#title {
	text-align       : center;
	position         : relative;
	margin-bottom    : -45px;
	top              : 65px;
	font-size        : 18px;
	text-shadow      : 0 -4px 4px rgba(0, 0, 0, 0.38), 0 4px 4px rgba(0, 0, 0, 0.38);
	letter-spacing   : 4px;
	height           : 45px;
	cursor           : default;
	-webkit-transform: translate3d(0, 0, 0)
}

#titleInfo {
	font-size   : 12px;
	text-align  : center;
	position    : relative;
	line-height : 65px;
	height      : 1px;
	bottom      : 15px;
	-moz-opacity: 0;
	filter      : alpha(opacity=0);
	opacity     : 0;
}

#titleInfo img {
	position     : relative;
	top          : 12px;
	padding-right: 4px;
}

#titleInfo.active {
	-moz-opacity               : 1;
	-ms-filter                 : "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)";
	/* IE8 */
	filter                     : progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF);
	/* IE6 & 7 */
	zoom                       : 1;
	opacity                    : 1;
	/* -webkit-transition-delay: 100ms; */
}

#atSign,
#domain {
	color: #000000;
}

#lastName.fnActive {
	margin-left: -16px;
}

#eith.inactive,
#firstName.inactive {
	-moz-opacity: 0;
	filter      : alpha(opacity=0);
	opacity     : 0;
}

#atSign.active,
#domain.active {
	color: white;
}

#firstName.asActive {
	margin-right: -92px;
}

#lastName.asActive {
	margin-left: 16px;
}

#atSign.inactive,
#domain.inactive {
	color       : #000000;
	-moz-opacity: 0;
	filter      : alpha(opacity=0);
	opacity     : 0;
}

#titleContainer {
	line-height: 10px;
}

#titleContainer.fnActive {
	margin-left: 55px;
}

#titleContainer.asActive {
	margin-left: 64px;
}

#titleContainer.lnActive {
	margin-left: 44px;
}

#titleContainer.dActive {
	margin-left: -90px;
}

#titleDots {
	margin-top  : 4px;
	-moz-opacity: 0;
	filter      : alpha(opacity=0);
	opacity     : 0;
}

#titleDots span {
	font-size         : 7px;
	text-shadow       : 0 0 6px #e80000, 0 0 7px #ffffff;
	-webkit-transition: all 200ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	-moz-transition   : all 200ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	-ms-transition    : all 200ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	-o-transition     : all 200ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	transition        : all 200ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	/* custom */
}

#titleDots span span {
	position: relative;
}

#titleDots span span.active {
	-moz-opacity: 1;
	-ms-filter  : "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)";
	/* IE8 */
	filter      : progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF);
	/* IE6 & 7 */
	zoom        : 1;
	opacity     : 1;
}

#titleDot1 {
	position: relative;
	right   : 60px;
}

#titleDot2 {
	position: relative;
	right   : 26px;
}

#titleDot3 {
	position: relative;
	right   : -18px;
}

#titleDot4 {
	position: relative;
	right   : -82px;
}

#content {
	position : absolute;
	top      : 354px;
	bottom   : 0;
	left     : 0;
	right    : 0;
	min-width: 320px;
	/* height: 100vh; */
}

#bgClose {
	width   : 100%;
	height  : 100%;
	position: absolute;
	z-index : 3;
}

#heart {
	min-width              : 320px;
	height                 : 600px;
	margin-left            : auto;
	margin-right           : auto;
	background             : url(../img/heart.png) no-repeat center top;
	-webkit-background-size: 882px 496px;
	-moz-background-size   : 882px 496px;
	-o-background-size     : 882px 496px;
	background-size        : 882px 496px;
}

#heartBeat {
	width                  : 90px;
	height                 : 101px;
	position               : relative;
	/* left                : 397px; */
	top                    : 165px;
	background             : url(../img/heartBeat.png) no-repeat;
	-webkit-background-size: 1440px 101px;
	-moz-background-size   : 1440px 101px;
	-o-background-size     : 1440px 101px;
	background-size        : 1440px 101px;
	margin                 : auto;
}

#crack {
	height                 : 259px;
	margin-left            : auto;
	margin-right           : auto;
	position               : relative;
	background             : url(../img/crack.png) no-repeat center;
	-webkit-background-size: 741px 259px;
	-moz-background-size   : 741px 259px;
	-o-background-size     : 741px 259px;
	background-size        : 741px 259px;
	min-width              : 320px;
	top                    : 20px;
	/* left                : 17px; */
	background-position-x  : calc(50% + 17px);
}

.crackSection {
	position: absolute;
	z-index : 1;
}

.crackSection img,
#piHover {
	-webkit-transition: all 0.5s ease-in;
	-moz-transition   : all 0.5s ease-in;
	-o-transition     : all 0.5s ease-in;
	-ms-transition    : all 0.5s ease-in;
	transition        : all 0.5s ease-in;
	-moz-opacity      : 0;
	filter            : alpha(opacity=0);
	opacity           : 0;
}

.crackSection img.active,
#piHover.active {
	-webkit-transition: all 0.5s ease-out;
	-moz-transition   : all 0.5s ease-out;
	-o-transition     : all 0.5s ease-out;
	-ms-transition    : all 0.5s ease-out;
	transition        : all 0.5s ease-out;
	-webkit-transform : translate3d(0, 0, 0);
	-moz-opacity      : 1;
	-ms-filter        : "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)";
	/* IE8 */
	filter            : progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF);
	/* IE6 & 7 */
	zoom              : 1;
	opacity           : 1;
}

#filmCrack {
	top : -91px;
	left: calc(50% - 220px);
}

#musicCrack {
	left: calc(50% - 130px);
	top : -75px;
}

#artCrack {
	right: calc(50% - 73px);
	top  : -96px;
}

#vfxCrack {
	left: calc(50% - 133px);
	top : -95px;
}

#designCrack {
	left: calc(50% - 133px);
	top : -96px;
}

#vcardCrack {
	left: calc(50% - 344px);
	top : -114px;
}

.crackButton {
	width           : 100px;
	height          : 100px;
	position        : absolute;
	cursor          : pointer;
	z-index         : 4;
	background-color: rgba(0, 0, 0, 0);
	/* border       : 1px solid; */
}

#filmButton {
	top : 22px;
	left: calc(50% - 151px);
}

#musicButton {
	top  : 84px;
	right: calc(50% - 91px);
}

#artButton {
	top : 63px;
	left: calc(50% - 329px);
}

#vfxButton {
	top : 30px;
	left: calc(50% + 113px);
}



#designButton {
	top : 67px;
	left: calc(50% + 227px);
}



.section {
	width                  : 972px;
	margin-right           : auto;
	margin-left            : auto;
	text-shadow            : 0 0 5px rgba(255, 255, 255, 0.5);
	text-align             : center;
	height                 : 349px;
	display                : none;
	-webkit-background-size: length_x length_y;
}

.section,
.section a,
.TxtStatus,
#music #npTrack,
#music #npArtist {
	text-shadow       : 0 0 3px rgba(0, 0, 0, 0.42);
	-webkit-transition: all 0.1s ease-out !important;
	-moz-transition   : all 0.1s ease-out !important;
	-o-transition     : all 0.1s ease-out !important;
	-ms-transition    : all 0.1s ease-out !important;
	transition        : all 0.1s ease-out !important;
	letter-spacing    : 1px;
}

.section a:hover,
.QapTcha:hover .TxtStatus,
#music #npTrack.hover,
#music #npArtist.hover {
	text-shadow       : 0 0 10px #ffffff;
	color             : white;
	-webkit-transition: all 0.1s ease-out !important;
	-moz-transition   : all 0.1s ease-out !important;
	-o-transition     : all 0.1s ease-out !important;
	-ms-transition    : all 0.1s ease-out !important;
	transition        : all 0.1s ease-out !important;
}

#film.section #nmAnim {
	width                  : 127px;
	height                 : 127px;
	margin-left            : auto;
	margin-right           : auto;
	position               : relative;
	right                  : 1px;
	bottom                 : 1px;
	background             : url(../img/nmAnim.png) no-repeat;
	-webkit-background-size: 9144px 127px;
	-moz-background-size   : 9144px 127px;
	-o-background-size     : 9144px 127px;
	background-size        : 9144px 127px;
}

#film.section {
	background             : url(../img/nmHeader.png) no-repeat 208px top;
	-webkit-background-size: 580px 297px;
	-moz-background-size   : 580px 297px;
	-o-background-size     : 580px 297px;
	background-size        : 580px 297px;
	color                  : #000000;
	text-shadow            : 0 -1px 3px rgba(0, 0, 0, 0.6);
}

#film.section a {
	font-size: 16px;
	position : relative;
	top      : 15px;
}

#film.section h2 {
	position : relative;
	top      : -45px;
	left     : 8px;
	font-size: 13px;
}

#film.section h2 span {
	margin-left : 30px;
	margin-right: 30px;
}

#film.section h2 span:nth-child(2) {
	margin-right: 80px;
	margin-left : 10px;
}

#film.section h2 span:nth-child(3) {
	margin-left: 80px;
	;
}

#vfx.section {
	background             : url(../img/piHeader.png) no-repeat 9px 0;
	-webkit-background-size: 932px 481px;
	-moz-background-size   : 932px 481px;
	-o-background-size     : 932px 481px;
	background-size        : 932px 481px;
	color                  : #000000;
	text-shadow            : 0 -1px 3px rgba(0, 0, 0, 0.6);
}

#piAnim {
	background-image       : url(../img/piAnim.png);
	-webkit-background-size: 3760px 231px;
	-moz-background-size   : 3760px 231px;
	-o-background-size     : 3760px 231px;
	background-size        : 3760px 231px;
	width                  : 94px;
	height                 : 231px;
	position               : absolute;
	top                    : 77px;
	left                   : 435px;
	display                : none;
}

#piLogo {
	width                  : 70px;
	height                 : 67px;
	background             : url(../img/piLogo.png) no-repeat 0;
	-webkit-background-size: 70px 67px;
	-moz-background-size   : 70px 67px;
	-o-background-size     : 70px 67px;
	background-size        : 70px 67px;
	position               : absolute;
	left                   : 451px;
	top                    : 90px;
}

#piHover {
	width                  : 640px;
	height                 : 319px;
	background             : url(../img/piHover.png) no-repeat;
	-webkit-background-size: 640px 319px;
	-moz-background-size   : 640px 319px;
	-o-background-size     : 640px 319px;
	background-size        : 640px 319px;
	position               : absolute;
	left                   : 172px;
	top                    : 6px;
	-moz-opacity           : 0;
	filter                 : alpha(opacity=0);
	opacity                : 0;
}

#piHover.active {
	-moz-opacity: 1;
	-ms-filter  : "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)";
	/* IE8 */
	filter      : progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF);
	/* IE6 & 7 */
	zoom        : 1;
	opacity     : 1;
}

#piClickSpace {
	width   : 900px;
	height  : 150px;
	position: absolute;
	top     : 85px;
	left    : 34px;
	cursor  : pointer;
}

#music.section {
	background             : url(../img/mHeader.png) no-repeat center 0;
	-webkit-background-size: 407px 252px;
	-moz-background-size   : 407px 252px;
	-o-background-size     : 407px 252px;
	background-size        : 407px 252px;
	padding-left           : 12px;
}

#music.section>div {
	float        : left;
	padding-left : px;
	padding-right: px;
}

#music #artists {
	width : 33%;
	height: 100%;
}

#music #nowPlaying {
	width : 33%;
	height: 100%;
}

#music #npCD {
	width       : 134px;
	height      : 134px;
	margin-left : auto;
	margin-right: auto;
	margin-top  : 50px;
	position    : relative;
	cursor      : pointer;
}

#music #npCDImage {
	width                  : 106px;
	height                 : 106px;
	overflow               : hidden;
	position               : absolute;
	left                   : 14px;
	top                    : 16px;
	-webkit-border-radius  : 50%;
	-moz-border-radius     : 50%;
	border-radius          : 50%;
	background             : url(../img/emptyNPImage.png) no-repeat center center;
	-webkit-background-size: 106px 106px;
	-moz-background-size   : 106px 106px;
	-o-background-size     : 106px 106px;
	background-size        : 106px 106px;
}

#music #npCDCover {
	background-image       : url(../img/cdLarge.png);
	-webkit-background-size: 134px 134px;
	-moz-background-size   : 134px 134px;
	-o-background-size     : 134px 134px;
	background-size        : 134px 134px;
	width                  : 134px;
	height                 : 134px;
	position               : absolute;
}

@-webkit-keyframes rotate {
	from {
		-webkit-transform: rotate(0deg);
	}

	to {
		-webkit-transform: rotate(360deg);
	}
}

@-moz-keyframes rotate {
	from {
		-moz-transform: rotate(0deg);
	}

	to {
		-moz-transform: rotate(360deg);
	}
}

@-o-keyframes rotate {
	from {
		-o-transform: rotate(0deg);
	}

	to {
		-o-transform: rotate(360deg);
	}
}

@keyframes rotate {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

#music #npCDLoader {
	width                            : 30px;
	height                           : 30px;
	position                         : absolute;
	background                       : url(../img/cdLoader.png) no-repeat center center;
	-webkit-background-size          : 30px 30px;
	-moz-background-size             : 30px 30px;
	-o-background-size               : 30px 30px;
	background-size                  : 30px 30px;
	top                              : 54px;
	left                             : 52px;
	-webkit-animation-name           : rotate;
	-moz-animation-name              : rotate;
	-o-animation-name                : rotate;
	animation-name                   : rotate;
	-webkit-animation-duration       : .5s;
	-moz-animation-duration          : .5s;
	-o-animation-duration            : .5s;
	animation-duration               : .5s;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-iteration-count   : infinite;
	-o-animation-iteration-count     : infinite;
	animation-iteration-count        : infinite;
	-webkit-animation-timing-function: linear;
	-moz-animation-timing-function   : linear;
	-o-animation-timing-function     : linear;
	animation-timing-function        : linear;
}

#music #tracks {
	width : 33%;
	height: 100%;
}

#nowPlaying #npTrack,
#nowPlaying #npArtist {
	text-transform: uppercase;
	text-shadow   : 0 2px 4px rgba(0, 0, 0, 0.42);
	white-space   : nowrap;
	overflow      : hidden;
	text-overflow : ellipsis;
	width         : 300px;
	margin-left   : auto;
	margin-right  : auto;
	margin-bottom : -10px;
	padding       : 5px 15px 5px 10px;
}

#nowPlaying #npTrack {
	font-size: 24px;
}

#nowPlaying #npArtist {
	font-size: 14px;
}

#nowPlaying #npTrack.hover,
#nowPlaying #npArtist.hover,
#music li:hover,
#music li a:hover {
	text-shadow: 0 0 10px #ffffff;
	color      : white;
}

#music #artists {
	text-align: right;
}

#music #tracks {
	text-align: left;
}

#music h2 {
	margin-top    : 15px;
	margin-bottom : 5px;
	text-transform: uppercase;
	color         : #8d8d8d;
	text-shadow   : -2px -2px 5px black;
	letter-spacing: 2px;
}

#music #artistsList {
	text-align: right;


}

#music li {
	position           : relative;
	height             : 30px;
	color              : silver;
	font-variant       : small-caps;
	letter-spacing     : 3px;
	-webkit-text-stroke: 1px transparent;
}

#music li a {
	cursor: pointer;
}

#music li a {
	color: silver;
}

#music #artists li>div {
	line-height   : 30px;
	vertical-align: middle;
	display       : inline-block;
}

#music #tracks li>div {
	line-height   : 10px;
	vertical-align: middle;
	display       : inline-block;
}

#music #artistsList .alArtist {
	position     : absolute;
	right        : 40px;
	white-space  : nowrap;
	overflow     : hidden;
	text-overflow: ellipsis;
	margin-left  : auto;
	margin-right : auto;
	padding-left : 10px;
}

#music #tracksList li {
	top: 5px;
}

#music #tracksList .track {
	position: absolute;
	left    : 30px;
	top     : 3px;
}

#music #tracksList .track a {
	display : block;
	position: relative;
}

#music #tracksList .tlArtist {
	font-size: 10px;
	top      : -20px;
	left     : 10px;
}

#music #tracksList .tlTrack {
	white-space  : nowrap;
	overflow     : hidden;
	text-overflow: ellipsis;
	padding      : 10px;
	top          : -10px;
}

#music #artistsList .alImage {
	width                      : 33px;
	height                     : 33px;
	-webkit-border-radius      : 8px;
	-moz-border-radius         : 8px;
	border-radius              : 8px;
	position                   : absolute;
	-moz-box-shadow            : -4px 0 6px rgba(0, 0, 0, 0.45);
	-webkit-box-shadow         : -4px 0 6px rgba(0, 0, 0, 0.45);
	box-shadow                 : -4px 0 6px rgba(0, 0, 0, 0.45);
	background                 : no-repeat center center;
	border                     : 1px solid #696969;
	transform                  : scale(.7, .7);
	-ms-transform              : scale(.7, .7);
	/* IE 9 */
	-webkit-transform          : scale(.7, .7);
	/* Safari and Chrome */
	-o-transform               : scale(.7, .7);
	/* Opera */
	-moz-transform             : scale(.7, .7);
	/* Firefox */
	right                      : -2px;
	-webkit-backface-visibility: hidden;
}

#music #tracksList .tlImage {
	width                : 24px;
	height               : 24px;
	position             : absolute;
	-webkit-border-radius: 12px;
	-moz-border-radius   : 12px;
	border-radius        : 12px;
	-webkit-transition   : -webkit-transform 0.5s ease-in-out;
	-moz-transition      : -moz-transform 0.5s ease-in-out;
	transition           : transform 0.5s ease-in-out;
}

#music #tracksList .tlImageCover {
	width                  : 34px;
	height                 : 34px;
	background-image       : url(../img/cdSmall.png);
	-webkit-background-size: 34px 34px;
	-moz-background-size   : 34px 34px;
	-o-background-size     : 34px 34px;
	background-size        : 34px 34px;
	position               : absolute;
	top                    : -5px;
	left                   : -1px;
}

#music #artistsList li:hover>.alImage {
	transform         : scale(1, 1);
	-ms-transform     : scale(1, 1);
	/* IE 9 */
	-webkit-transform : scale(1, 1);
	/* Safari and Chrome */
	-o-transform      : scale(1, 1);
	/* Opera */
	-moz-transform    : scale(1, 1);
	/* Firefox */
	-moz-box-shadow   : -6px 0 6px rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: -6px 0 6px rgba(0, 0, 0, 0.25);
	box-shadow        : -6px 0 6px rgba(0, 0, 0, 0.25);
	z-index           : 1;
}


@keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
	}
}

#music #tracksList li:hover>.tlImage {
	-webkit-animation: spin 1s linear infinite;
	-moz-animation   : spin 1s linear infinite;
	-o-animation     : spin 1s linear infinite;
	animation        : spin 1s linear infinite;
}

#vcard.section {
	background-repeat: no-repeat;
}

#vcard #resume {
	width                      : 170px;
	position                   : absolute;
	right                      : 33px;
	top                        : 64px;
	transform                  : scale(.9, .9);
	-ms-transform              : scale(.9, .9);
	/* IE 9 */
	-webkit-transform          : scale(.9, .9);
	/* Safari and Chrome */
	-o-transform               : scale(.9, .9);
	/* Opera */
	-moz-transform             : scale(.9, .9);
	/* Firefox */
	-webkit-backface-visibility: hidden;
}

#vcard #resume:hover {
	transform        : scale(1, 1);
	-ms-transform    : scale(1, 1);
	/* IE 9 */
	-webkit-transform: scale(1, 1);
	/* Safari and Chrome */
	-o-transform     : scale(1, 1);
	/* Opera */
	-moz-transform   : scale(1, 1);
	/* Firefox */
}

#QapTcha {
	margin-top : 1px !important;
	padding-top: 0 !important;
}

.QapTcha .bgSlider {
	width                  : 686px;
	height                 : 211px;
	background             : url(../img/bgSlider.png) rgba(255, 255, 255, 0);
	-webkit-background-size: 686px 211px;
	-moz-background-size   : 686px 211px;
	-o-background-size     : 686px 211px;
	background-size        : 686px 211px;
	border-style           : none;
	margin-left            : 120px;
}

.QapTcha .Slider {
	width                  : 305px;
	height                 : 178px;
	background             : url(../img/slider.png) no-repeat center center;
	-webkit-background-size: 305px 178px;
	-moz-background-size   : 305px 178px;
	-o-background-size     : 305px 178px;
	background-size        : 305px 178px;
	cursor                 : e-resize;
	position               : relative;
	left                   : 0;
	top                    : 0;
	padding-top            : 33px;
	padding-right          : 45px;
	cursor                 : url(../img/panEastCursor.cur), default;
	-webkit-transition     : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	-moz-transition        : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	-ms-transition         : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	-o-transition          : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	transition             : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	/* custom */
}

.QapTcha .Slider.ui-draggable-dragging {
	-webkit-transition: none;
	-moz-transition   : none;
	-ms-transition    : none;
	-o-transition     : none;
	transition        : none;
	/* custom */
	padding-left      : 20px !important;
}

.QapTcha .TxtStatus,
#vcard #resume a {
	color     : white;
	text-align: center;
	width     : 485px;
	margin-top: 15px;
}

.QapTcha .fgSlider {
	width      : 305px;
	height     : 178px;
	z-index    : 2;
	position   : relative;
	top        : -14px;
	margin-left: 20px;
}

#vcardForm {
	position: relative;
	top     : 49px;
	right   : 69px;
}

#vcardForm .QapTcha {}

#vcardForm input {
	display: none;
}

#vcardBG {
	width                  : 29px;
	height                 : 190px;
	background-image       : url(../img/vCardBG.png);
	-webkit-background-size: 29px 190px;
	-moz-background-size   : 29px 190px;
	-o-background-size     : 29px 190px;
	background-size        : 29px 190px;
	position               : absolute;
	left                   : 360px;
	top                    : 80px;
}

#vcardFG {
	background-image       : url(../img/vCardFG.png);
	-webkit-background-size: 322px 199px;
	-moz-background-size   : 322px 199px;
	-o-background-size     : 322px 199px;
	background-size        : 322px 199px;
	width                  : 322px;
	height                 : 199px;
	position               : absolute;
	top                    : 75px;
	left                   : 65px;
}

#design.section {
	background             : url(../img/dHeader.png) no-repeat -16px top;
	-webkit-background-size: 985px 355px;
	-moz-background-size   : 985px 355px;
	-o-background-size     : 985px 355px;
	background-size        : 985px 355px;
	color                  : #000000;
	text-shadow            : 0 -1px 3px rgba(0, 0, 0, 0.6);
}

#design #dGallery li {
	display              : inline-block;
	cursor               : pointer;
	cursor               : -moz-zoom-in;
	cursor               : -webkit-zoom-in;
	border-radius        : 5px;
	-moz-border-radius   : 5px;
	-webkit-border-radius: 5px;
	-moz-box-shadow      : 0 0 5px rgba(65, 248, 47, 0.51);
	-webkit-box-shadow   : 0 0 5px rgba(65, 248, 47, 0.51);
	box-shadow           : 0 0 5px rgba(65, 248, 47, 0.51);
	border               : 1px solid white;
	width                : 80px;
	height               : 80px;
	position             : relative;
	margin               : 15px 19px;
	-moz-opacity         : 0;
	filter               : alpha(opacity=0);
	opacity              : 0;
}

#design #dGallery li:hover {
	border-color: #86fe86;
}

#design #dGallery li.dgPlacerholder {
	border-color: rgba(255, 255, 255, 0.5) !important;
	cursor      : default;
}

#design #dGallery ul {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style   : preserve-3d;
	-ms-transform-style    : preserve-3d;
	-o-transform-style     : preserve-3d;
	transform-style        : preserve-3d;
	-webkit-perspective    : 1200px;
	-moz-perspective       : 1200px;
	-ms-perspective        : 1200px;
	-o-perspective         : 1200px;
	perspective            : 1200px;
	-webkit-transform      : scale(.8);
	-moz-transform         : scale(.8);
	transform              : scale(.8);
	margin-left            : auto;
	margin-right           : auto;
	width                  : 972px;
}

#projector {
	width                  : 85px;
	height                 : 85px;
	background-image       : url(../img/projector.png);
	-webkit-background-size: 850px 85px;
	-moz-background-size   : 850px 85px;
	-o-background-size     : 850px 85px;
	background-size        : 850px 85px;
	position               : absolute;
	left                   : 443px;
	top                    : 133px;
}

#flare {
	width                  : 565px;
	height                 : 277px;
	background-image       : url(../img/flare.png);
	-webkit-background-size: 11300px 277px;
	-moz-background-size   : 11300px 277px;
	-o-background-size     : 11300px 277px;
	background-size        : 11300px 277px;
	position               : absolute;
	left                   : 203px;
	top                    : 37px;
	-moz-opacity           : 0;
	filter                 : alpha(opacity=0);
	opacity                : 0;
}

#garage {
	height      : 349px;
	width       : 972px;
	z-index     : 10;
	top         : -1px;
	margin-left : auto;
	margin-right: auto;
	position    : absolute;
	overflow    : hidden;
	display     : none;
	left        : calc(50% - 486px);
	/* min-width: 320px; */
}

#garageBGContainer {
	height                 : 349px;
	width                  : 972px;
	overflow               : hidden;
	position               : absolute;
	-webkit-mask-image     : url("/engine/img/garageMask.svg#garageMask");
	-webkit-mask-repeat    : no-repeat;
	-webkit-mask-position-y: -349px;
	mask-image             : url("/engine/img/garageMask.svg#garageMask");
	mask-repeat            : no-repeat;
	mask-position-y        : -349px;
	transition             : all 650ms cubic-bezier(.51, .01, .50, 1.01);
}

#garageBG {
	height                 : 349px;
	width                  : 972px;
	position               : absolute;
	top                    : 0;
	left                   : 0;
	background             : url(../img/garageTexture.png) no-repeat 0 -349px;
	-webkit-background-size: 972px 349px;
	-moz-background-size   : 972px 349px;
	-o-background-size     : 972px 349px;
	background-size        : 972px 349px;
}

#garageContainer {
	position: relative;
	bottom  : 355px;
}

#garageBGContainer,
#garageBG,
#garageContainer {
	transition: all 650ms cubic-bezier(.51, .01, .50, 1.01);
}

#art.section {
	background             : url(../img/artBG.png) no-repeat center 5px;
	-webkit-background-size: 946px 364px;
	-moz-background-size   : 946px 364px;
	-o-background-size     : 946px 364px;
	background-size        : 946px 364px;
}

#gallery {
	width: 701px;

	margin-left : auto;
	margin-right: auto;
	height      : 272px;
	overflow    : visible;
	margin-top  : -7px;
}

.gSection {
	width         : 701px;
	height        : 272px;
	overflow      : visible;
	/* padding-top: 16px; */
}

.gSection ul {
	display       : inline-block;
	vertical-align: top;
}

.gSection .image {
	cursor    : pointer;
	cursor    : -moz-zoom-in;
	cursor    : -webkit-zoom-in;
	position  : relative;
	margin-top: 2px;
}

.gSection .poloroid {
	background                 : no-repeat center 8px;
	-webkit-backface-visibility: hidden;
	width                      : 45px;
	height                     : 48px;
}

.gSection li:hover .poloroid {
	transform        : rotate(0deg) !important;
	-ms-transform    : rotate(0deg) !important;
	/* IE 9 */
	-moz-transform   : rotate(0deg) !important;
	/* Firefox */
	-webkit-transform: rotate(0deg) !important;
	/* Safari and Chrome */
	-o-transform     : rotate(0deg) !;
	/* Opera */
}

.gSection .clip {
	position: absolute;
	top     : -20px;
	left    : 15px;
}

.gColumn {
	width       : 45px;
	margin-left : 3px;
	margin-right: 3px;
	position    : relative;
}

.gColumn0,
.gColumn12 {
	top: 1px;
}

.gColumn1,
.gColumn11 {
	top: 2px;
}

.gColumn2,
.gColumn10 {
	top: 4px;
}

.gColumn3,
.gColumn9 {
	top: 5px;
}

.gColumn4,
.gColumn8 {
	top: 5px;
}

.gColumn5,
.gColumn7 {
	top: 6px;
}

.gColumn6 {
	top: 7px;
}

#galleryFolders {
	z-index : 3;
	position: absolute;
	width   : 972px;
}

#galleryFolders span {
	margin-right  : 50px;
	margin-left   : 50px;
	cursor        : pointer;
	letter-spacing: 3px;
}

#galleryNav {
	margin-left   : auto;
	margin-right  : auto;
	padding-top   : 10px;
	padding-bottom: 10px;
}

#galleryStatus {
	margin-bottom: -3px;
	z-index      : -24;
	margin-top   : -2px;
}

#gsTrack {
	background-color     : rgba(0, 0, 0, 0.46);
	-moz-box-shadow      : inset 0 -1px 0 rgba(255, 255, 255, 0.29), inset 0 1px 0 rgba(0, 0, 0, 0.29);
	-webkit-box-shadow   : inset 0 -1px 0 rgba(255, 255, 255, 0.29), inset 0 1px 0 rgba(0, 0, 0, 0.29);
	box-shadow           : inset 0 -1px 0 rgba(255, 255, 255, 0.29), inset 0 1px 0 rgba(0, 0, 0, 0.29);
	border-radius        : 5px;
	-moz-border-radius   : 5px;
	-webkit-border-radius: 5px;
	height               : 5px;
	z-index              : -1;
	margin               : -20px 170px 20px;
}

#gsDot {
	height                 : 55px;
	width                  : 70px;
	background-image       : url(../img/gsDot.png);
	-webkit-background-size: 70px 55px;
	-moz-background-size   : 70px 55px;
	-o-background-size     : 70px 55px;
	background-size        : 70px 55px;
	position               : relative;
	top                    : 10px;
	-webkit-transition     : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	-moz-transition        : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	-ms-transition         : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	-o-transition          : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	transition             : all 500ms cubic-bezier(0.145, 0.890, 0.075, 0.875);
	/* custom */
}

.custom-fancybox .fancybox-caption {
	/* position: absolute; */
	/* bottom: 0px; */
	left      : 50%;
	transform : translateX(-50%);
	text-align: center;
	font      : bold 21px "Courier New", Courier, mono;
	margin-top: 15px;
	color     : #333;
	width     : 100%;
	background: rgb(255, 255, 255);
	padding   : 10px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	/* background blur */

}

.custom-fancybox .fancybox-caption span {
	font-size: 14px;
	display  : block;
}

.custom-fancybox .fancybox-content {
	border       : 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 2px;
	background   : rgb(255, 255, 255);
	background   : linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(237, 237, 237, 1) 1%, rgba(237, 237, 237, 1) 71%, rgba(255, 255, 255, 1) 100%);
	padding      : 10px;
	/* position  : relative; */
}

.custom-fancybox .fancybox-image {
	border: 1px solid rgba(0, 0, 0, 0.1);
}

.custom-fancybox .fancybox-container {
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.custom-fancybox .fancybox-button--close {
	display: none;
}

.custom-fancybox .fancybox-button--small {
	display: none;
}

.custom-fancybox .fancybox-bg {
	/* position: relative; */
}

.custom-fancybox .fancybox-bg:before {
	content                : '';
	position               : absolute;
	width                  : 100%;
	height                 : 100%;
	opacity                : 0.9;
	backdrop-filter        : blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

.activeSlide {
	cursor: default !important;
}

#error404.section {
	background             : url(../img/404BG.png) no-repeat 234px;
	-webkit-background-size: 514px 349px;
	-moz-background-size   : 514px 349px;
	-o-background-size     : 514px 349px;
	background-size        : 514px 349px;
}

#error404.section img {
	position: absolute;
}

#error404.section #mg404 img {
	left: 237px;
	top : 1px;
}

#error404.section #fg404 img {
	left: 387px;
	top : 110px;
}

@-webkit-keyframes pulse {
	0% {
		opacity: 0;
	}

	20% {
		opacity: 1;
	}

	60% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@-moz-keyframes pulse {
	0% {
		opacity: 0;
	}

	20% {
		opacity: 1;
	}

	60% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@-ms-keyframes pulse {
	0% {
		opacity: 0;
	}

	20% {
		opacity: 1;
	}

	60% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@-o-keyframes pulse {
	0% {
		opacity: 0;
	}

	20% {
		opacity: 1;
	}

	60% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@keyframes pulse {
	0% {
		opacity: 0;
	}

	20% {
		opacity: 1;
	}

	60% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

#mg404 {
	-webkit-animation-name           : pulse;
	-moz-animation-name              : pulse;
	-o-animation-name                : pulse;
	animation-name                   : pulse;
	-webkit-animation-duration       : 3s;
	-moz-animation-duration          : 3s;
	-o-animation-duration            : 3s;
	animation-duration               : 3s;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-iteration-count   : infinite;
	-o-animation-iteration-count     : infinite;
	animation-iteration-count        : infinite;
	-webkit-animation-timing-function: ease-out;
	-moz-animation-timing-function   : ease-out;
	-o-animation-timing-function     : ease-out;
	animation-timing-function        : ease-out;
}

#ieMessage {
	color     : white;
	position  : absolute;
	text-align: center;
	width     : 100%;
	bottom    : 50px;
}

#ieMessage a {
	color: red;
}

/* @group FlashBlock for soundmanager */

/**
 * SoundManager 2 + useFlashBlock
 * ------------------------------
 * Flash positioning and flashblock / clicktoflash handling
 */

#sm2-container {
	/**
  * where the SM2 flash movie goes. by default, relative container.
  * set relative or absolute here, and don't touch it later or bad things will happen (see below comments.)
  */
	position : absolute;
	width    : 1px;
	height   : 1px;
	overflow : hidden;
	/* screw IE 6, just make it display nice */
	_overflow: hidden;
}

#sm2-container object,
#sm2-container embed {
	/**
  * the actual SWF movie bit.
  * important: The SWF needs to be able to be moved off-screen without display: or position: changes.
  * changing display: or position: or overflow: here or on parent can cause SWF reload or other weird issues after unblock
  * e.g., SM2 starts but strange errors, no whileplaying() etc.
  */
	width     : 48px;
	height    : 48px;
	/* some flash blockers may also respect this rule */
	max-width : 48px;
	max-height: 48px;
}

#sm2-container.swf_timedout {
	/* expand to show the timed-out SWF content */
	position: relative;
	width   : 48px;
	height  : 48px;
}

#sm2-container.swf_timedout,
#sm2-container.swf_timedout object,
#sm2-container.swf_timedout embed {
	/**
  * when SM2 didn't start normally, time-out case. flash blocked, missing SWF, no flash?
  * 48px square flash placeholder is typically used.
	*/
	display: block;
}