html{height:100%;}
body{height:100%;display:none;font-family: 'Open Sans', sans-serif;background-color:black;margin:0px;-webkit-font-smoothing: antialiased;}
#container{width:960px;background-color:black;margin-left:50%;left:-480px;}

.kyle{line-height:1.3em;}

/* SIMPLIFIERS */
.marg-b{margin-bottom:20px;}
.marg-r{margin-right:20px;}
.clear{clear:both;}
.pos-rel{position:relative;}
.pos-abs{position:absolute;}
.font-small{font-size:12px;}
.font-med{font-size:14px;}
.font-bld{font-weight:700;}
.curs-point{cursor:pointer;}
.bg-white{background-color:white;}
.relativizer{position:relative;}
.invis{display:none;}
.top-line{-webkit-box-shadow:inset 0 1px 1px #3f3f3f;-moz-box-shadow:inset 0 1px 1px #3f3f3f;box-shadow:inset 0 1px 1px rgba(255,255,255,0.5);}

/* ANIMATORS */
.t-op-03{font-smoothing: antialiased;-webkit-font-smoothing:antialiased;transition: none; -webkit-transition: none; transition: opacity 0.3s;-moz-transition: opacity 0.3s;-webkit-transition: opacity 0.3s;-o-transition: opacity 0.3s;-webkit-backface-visibility: hidden;
-moz-backface-visibility:    hidden;
-ms-backface-visibility:     hidden;
backface-visibility:         hidden; }

.animate-opacity-08{transition: opacity 0.8s;-moz-transition: opacity 0.8s;-webkit-transition: opacity 0.8s;-o-transition: opacity 0.8s;}
.t-all-01{transition: all 0.1s;-moz-transition: all 0.1s;-webkit-transition: all 0.1s;-o-transition: all 0.1s;}
.t-all-03{transition: all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;-o-transition: all 0.3s;}
.t-all-04{transition: all 0.4s;-moz-transition: all 0.4s;-webkit-transition: all 0.4s;-o-transition: all 0.4s;}
.t-all-06{transition: all 0.6s;-moz-transition: all 0.6s;-webkit-transition: all 0.6s;-o-transition: all 0.6s;}
.t-all-08{transition: all 0.8s;-moz-transition: all 0.8s;-webkit-transition: all 0.8s;-o-transition: all 0.8s;}
.t-all-1s{transition: all 1.0s;-moz-transition: all 1.0s;-webkit-transition: all 1.0s;-o-transition: all 1.0s;}
.t-all-12{transition: all 1.2s;-moz-transition: all 1.2s;-webkit-transition: all 1.2s;-o-transition: all 1.2s;}
.t-all-15{transition: all 1.5s;-moz-transition: all 1.5s;-webkit-transition: all 1.5s;-o-transition: all 1.5s;}
.t-all-2s{transition: all 2.0s;-moz-transition: all 2.0s;-webkit-transition: all 2.0s;-o-transition: all 2.0s;}

/* NAVIGATION */
#nav{top:155px;display:block;width:960px;height:50px;background-image:url("images/UI/noise.png");color:white;overflow:hidden;-webkit-box-shadow:inset 0 1px 1px #3f3f3f;-moz-box-shadow:inset 0 1px 1px #3f3f3f;box-shadow:inset 0 1px 1px #3f3f3f;}
.nav-item{width:192px;height:50px;float:left;text-align:center;display:table;overflow:hidden;}
.nav-item:hover{background-image:url("images/UI/noise.png");}
.nav-item-container{overflow:hidden;}
.nav-item-current{background-image:url("images/UI/noise.png");color:white;-moz-box-shadow:inset 0 0 10px #000000;-webkit-box-shadow:inset 0 0 10px #000000,inset 0 1px 1px #3f3f3f;-moz-box-shadow:inset 0 0 10px #000000,inset 0 1px 1px #3f3f3f;box-shadow:inset 0 0 10px #000000,inset 0 1px 1px #3f3f3f;}
.nav-in{display:table-cell;vertical-align:middle;width:100%;margin:0 auto;text-align:center;}
.nav-el{display:block;overflow:hidden;}                                                                       
.nav-item:hover .white-light{opacity:0.4;filter: alpha(opacity = 40);}
.white-light{opacity:0.0;filter: alpha(opacity = 0);width:100px;height:20px;position:absolute;z-index:3;left:40px;top:20px;-moz-box-shadow: 0 0 40px 5px white;
-webkit-box-shadow: 0 0 40px 5px white;-moz-box-shadow: 0 0 40px 5px white;
box-shadow: 0 0 40px 5px white;}
.blue-light{opacity:0.7;filter: alpha(opacity = 70);width:100px;height:20px;position:absolute;z-index:3;left:40px;top:50px;-moz-box-shadow: 0 0 40px 5px #00CCFF;
-webkit-box-shadow: 0 0 40px 5px#00CCFF;-moz-box-shadow: 0 0 40px 5px#00CCFF;
box-shadow: 0 0 40px 5px #00CCFF;animation:lightAnim 4s;-moz-animation:lightAnim 4s infinite;-webkit-animation:lightAnim 4s infinite;}
.green-light{width:150px;height:10px;opacity:0.6;filter: alpha(opacity = 60);filter: alpha(opacity = 100);position:absolute;z-index:3;left:20px;top:50px;-moz-box-shadow: 0 0 40px 5px #66FF66;
-webkit-box-shadow: 0 0 40px 5px #66FF66;
box-shadow: 0 0 40px 5px #66FF66;animation:lightAnim 4s;-moz-animation:lightAnim 4s infinite;-webkit-animation:lightAnim 4s infinite;}

#logo{display:none;width:300px;height:144px;margin:0 auto;background-image:url("images/logo.png");background-size: 100% auto;z-index:2;margin-top:10px;margin-bottom:10px;
animation:logoAnim 10s;-moz-animation:logoAnim 10s infinite;-webkit-animation:logoAnim 10s infinite;}

@keyframes lightAnim{0%{top:28px;opacity:0.5;}50%{top:20px;opacity:0.5;}100%{top:28px;opacity:0.5;}}
@-moz-keyframes lightAnim{0%{top:28px;opacity:0.5;}50%{top:20px;opacity:0.5;}100%{top:28px;opacity:0.5;}}
@-webkit-keyframes lightAnim{0%{top:28px;opacity:0.5;}50%{top:20px;opacity:0.5;}100%{top:28px;opacity:0.5;}}

@keyframes logoAnim{0%{opacity:1.0;}50%{opacity:1.0;}53%{opacity:0.6;}55%{opacity:1.0;}57%{opacity:0.6;}59%{opacity:1.0;}100%{opacity:1.0;}}
@-moz-keyframes logoAnim{0%{opacity:1.0;}50%{opacity:1.0;}53%{opacity:0.6;}55%{opacity:1.0;}57%{opacity:0.6;}59%{opacity:1.0;}100%{opacity:1.0;}}
@-webkit-keyframes logoAnim{0%{opacity:1.0;}50%{opacity:1.0;}53%{opacity:0.6;}55%{opacity:1.0;}57%{opacity:0.6;}59%{opacity:1.0;}100%{opacity:1.0;}}

/*PAGE INNER */
#page-inner{width:inherit;height:inherit;position:relative;top:50px;}

/* GAME */
#pi-game{width:960px;height:inherit;background-color:white;margin-top:20px;}
#iphone-login-screen {
	margin: 0 auto;
}
#tagline {
	padding-top: 40px;
	padding-bottom: 20px;
	font-size: 26px;
	font-weight: normal;
	color: #333;
}
#game-desc {
	width: 650px;
	text-align: center;
	margin: 0 auto;
	font-size: 15px;
	color: #333333;
	margin-top: 40px;
}

#game-container {
	text-align: center;
}

#backstory {
	background: #85c44f;
	border-top: 1px solid #77b145;
	border-bottom: 1px solid #77b145;
	color: #fff;
	font-size: 13px;
	line-height: 1.65em;
	margin: 50px 0;
	padding: 50px 0;
	text-align: center;
	position: relative;
}

#hex-separator, #hex-separator-btm {
	position: absolute;
	top: -6px;
	left: 454px;
}

#hex-separator-btm {
	top: auto;
	bottom: -7px;
	-webkit-transform: rotateZ(180deg);
	-moz-transform: rotateZ(180deg);
	transform: rotateZ(180deg);
}

#backstory-title, #credits-title {
	margin: 0;
	padding: 0;
}

#backstory-container {
	margin: 0 auto;
	width: 650px;
}

.backstory-desc {
	margin-top: -4px;
}

.span1 .backstory-desc {
	margin-top: 17px;
}

.span1, .span2 {
	width: 305px;
	margin-right: 40px;
	padding: 0;
	text-align: left;
	float: left;
}

.span2 {
	margin-right: 0;
}

#setup-render {
	text-align: center;
	margin-top: 30px;
}

#credits {
	width: 650px;
	margin: 0 auto;
	font-size: 13px;
	text-align: left;
}

.def-title { width: 130px; float: left; font-size: 13px; clear: left; }
.def-desc  { width: 520px; float: left; }

.link-list {
	list-style-type: none;
	width: 150px;
}

.copyright {
	text-align: center;
	padding: 20px 0;
	background: #eaeaea;
	font-size: 12px;
	color: #555555;
	margin-top: 50px;
}

/* TECH */
#pi-tech{margin-top:20px;position:absolute;display:none;}
.pi-tech-row{width:960px;margin-bottom:20px;position:relative;background-color:white;height:inherit;overflow:hidden;}
.pitr-image{float:left;opacity:0.75;filter: alpha(opacity = 75);width:200px;height:200px;margin-left:50px;display:inline-block;}
.pi-tech-row:hover .pitr-image{opacity:1.0;filter: alpha(opacity = 100);}
.pitr-text-block{width:610px;left:300px;top:50px;float:right;margin-right:50px;padding-top:50px;padding-bottom:50px;display:inline:block;}
.pitr-text-block-half-container{width:610px;position:absolute;top:50px;left:300px;}
.pitr-text-block-half-l{width:280px;}
.pitr-text-block-half-r{width:280px;position:absolute;left:330px;top:0px;}
.pitr-header{font-weight:600;}
.pitr-text-body{margin-top:10px;line-height:1.6em;display:block;}
.pitr-line{display:block;width:inherit;height:1px;background-color:grey;position:relative;top:5px;}

#core-img{background-image:url("images/core_game.png");margin-top:35px;-ms-interpolation-mode: bicubic;}
#server-img{background-image:url("images/server.png");margin-top:45px;-ms-interpolation-mode: bicubic;}
#app-img{background-image:url("images/app.png");margin-top:55px;}
#graphics-img{background-image:url("images/graphics.png");margin-top:30px;-ms-interpolation-mode: bicubic;}
#audio-img{background-image:url("images/audio.png");margin-top:25px;-ms-interpolation-mode: bicubic;}

/* TEAM */
#pi-team{display:none;margin-top:20px;position:absolute;}
.pi-team-row{width:960px;height:300px;margin-bottom:20px;position:relative;background-color:white;}
.pit-image{opacity:0.75;filter: alpha(opacity = 75);width:250px;height:300px;position:relative;}
.pi-team-row:hover .pit-image{opacity:1.0;filter: alpha(opacity = 100);}
.pit-text-block{height:200px;width:610px;left:300px;top:50px;position:absolute;}
.half-box-out{width:470px;height:200px;position:relative;float:left;}
.half-box-in{width:470px;height:180px;top:20px;background-color:white;position:relative;}
.pit-text{height:160px;width:280px;left:150px;top:10px;}
.pit-header{font-weight:600;letter-spacing: 0.1em;}
.pit-line{display:block;width:inherit;height:1px;background-color:grey;position:relative;top:5px;}
.pit-duty{margin-top:10px;}
.pit-left{margin-left:0px;}
.pit-right{margin-left:20px;}
.pit-contact{width:inherit;position:absolute;bottom:0px;}
.pit-portfolio{position:relative;float:left;}
.pit-social{position:absolute;float:left;margin-top:20px;}
.pit-social a{font-size:12px;float:left;text-decoration: none;color:black;}
.pit-social a:hover{font-size:12px;float:left;color:teal;text-decoration: none}
.pit-social div{margin-left:10px;margin-right:10px;float:left;font-size:12px;}
.pit-subtitle{font-variant:small-caps;}
.pit-header{margin-bottom:20px;}
.pit-text-body{margin-top:20px;font-style: italic;text-align:center;}

#t-jahfer{background-image:url("images/team/jahfer.png");}
#t-russell{background-image:url("images/team/russell.png");}
#t-stacie{background-image:url("images/team/stacie.png");}
#t-matt{background-image:url("images/team/matt.png");}
#t-kyle{background-image:url("images/team/kyle.png");}
#t-paul{background-image:url("images/team/paul.png");}

#social-jahfer{left:236px;}
#social-russell{left:236px;}
#social-stacie{left:236px;}
#social-matt{left:236px;}
#social-kyle{left:236px;}
#social-paul{left:236px;}

/* GALLERY */
.gallery-tall{width:245px;height:200px;float:left;}
#pi-gallery{margin-top:20px;height:inherit;display:none;position:absolute;}
#pig-img-container{width:960px;position:absolute;}
.pig-outer{width:225px;height:140px;background-color:red;float:left;}
.pig-right{margin-left:0px;margin-bottom:20px;}
.pig-row-top{position:relative;height:140px;width:960px;margin-top:0px;}
.pig-row-mid{position:relative;height:140px;width:960px;margin-top:20px;}


.pig-img-4:hover{opacity:1.0;filter: alpha(opacity = 100);}
.pigi:hover .pig-play{opacity:0.2;filter: alpha(opacity = 20);border-top: 25px solid transparent;border-bottom: 25px solid transparent;border-left: 45px solid white;margin-top:-175px;margin-left:222px;}
.pigi:hover .overlay{opacity:0.0;filter: alpha(opacity = 0);}
.pig-icon:hover{opacity:1.0 !important;filter: alpha(opacity = 100) !important;}

.pigi{cursor:pointer;position:relative;}
.pig-img-4{width:470px;height:300px;background-color:black;float:left;opacity:1.0;filter: alpha(opacity = 100);}
.pig-play{width: 0; height: 0; border-top: 50px solid transparent;border-bottom: 50px solid transparent;border-left: 90px solid black;position:absolute;margin-top:-200px;margin-left:210px;}
.overlay{width:inherit;height:inherit;background-color:white;opacity:0.1;filter: alpha(opacity = 10);}
.pig-icon{letter-spacing:0.3em;font-size:12px;padding:10px;height:20px;background-color:black;color:white;display:inline-block;margin-top:-35px;left:0px;position:absolute;z-index:10;overflow:hidden;opacity:0.75;filter: alpha(opacity = 75);transition: all 0.4s;-moz-transition: all 0.4s;-webkit-transition: all 0.4s;-o-transition: all 0.4s;}
/*.pig-img-4:after{content:"";display:block;width:470px;height:300px;background-color:orange;position:absolute;z-index:4;opacity:1.0;}*/

.pig-img-2w{width:470px;height:140px;background-color:black;float:left;}
.pig-img-2h{width:225px;height:300px;background-color:black;float:left;}
.pig-img-1{width:225px;height:140px;background-color:black;float:left;}

#gallery-img-1{background-image:url("images/gallery_image_1.png");}
#gallery-img-2{background-image:url("images/gallery_image_2.png");}
#gallery-img-3{background-image:url("images/gallery_image_3.png");}
#gallery-img-4{background-image:url("images/gallery_image_4.png");}
#gallery-img-5{background-image:url("images/gallery_image_5.png");}
#gallery-img-6{background-image:url("images/gallery_image_6.png");}
#gallery-img-7{background-image:url("images/gallery_image_7.png");}
#gallery-img-8{background-image:url("images/gallery_image_8.png");}
#gallery-img-9{background-image:url("images/gallery_image_9.png");}
#gallery-img-10{background-image:url("images/gallery_image_10.png");}
#gallery-img-11{background-image:url("images/gallery_image_11.png");}
#gallery-img-12{background-image:url("images/gallery_image_12.png");}
#gallery-img-13{background-image:url("images/gallery_image_13.png");}
#gallery-img-14{float:right;padding-left:0px;float:right;margin-right: 0px;background-image:url("images/gallery_image_14.png");}

/* PHYSICAL SETUP */

#pi-phys{width:960px;height:800px;position:absolute;top:20px;display:none;}
#pip-left{width:480px;height:600px;float:left;overflow:hidden;}
#pip-right{width:460px;height:600px;margin-left:20px;float:left;z-index:999;position:relative;}

.pip-cat{width:220px;height:50px;background-color:white;float:left;margin-bottom:20px;display:table;overflow:hidden;cursor:pointer;}
.pip-cat-in{display:table-cell;vertical-align:middle;margin:0 auto;text-align:center;}
.pip-cat-el{display:block;letter-spacing: 0.2em;}
.pip-cat-left{margin-right:20px;overflow:hidden;}
.pip-cat-right{margin-right:0px;}
.pipr-desc{position:relative;margin-top:20px;padding:40px;overflow:hidden;opacity:1.0;filter: alpha(opacity = 100);-moz-box-shadow: 0 0 50px black;
-webkit-box-shadow: 0 0 50px black;
box-shadow: 0 0 50px black;}
.pipr-desc-el{width:380px;}
.pipr-desc-text{width:380px;top:40px;left:40px;}
#pipr-desc-container{width:460px;height:500px;top:100px;margin-top:20px;position:absolute;}
.pipr-text-body{margin-top:10px;line-height:1.6em;}
.bg-desc-opacity{width:440px;top:10px;left:10px;background-color:green;}
.pipr-group{position:absolute;top:0px;}
#group-projection{}
#group-power{}
#group-network{}
#group-audio{}

#gradient-l{width:150px;height:800px;background-image:url("images/UI/gradient.png");position:absolute;z-index:20;left:-52px;}
#gradient-b{width:1160px;height:150px;background-image:url("images/UI/gradient-vert.png");position:absolute;z-index:20;left:-200px;top:650px;}
#solid-l{width:150px;height:800px;background-color:black;position:absolute;z-index:20;left:-200px;}
	/* 3D CUBE */
 #experiment {z-index:2;width:600px;height:800px;top:-6px;left:-50px;position:absolute;-webkit-perspective: 800;-webkit-perspective-origin: 50% 200px;perspective:; 800px;perspective-origin: 50% 200px;}

#hello{top:380px;left:20px;position:absolute;width:560px;height:600px;-webkit-transition: -webkit-transform 1.0s;-webkit-transform-style: preserve-3d;  -webkit-transform: rotateY(0deg) translateZ(0px) translateX(0px) translateZ(0px);-moz-transition: -moz-transform 1.0s;-moz-transform-style: preserve-3d;  -moz-transform: rotateY(0deg) translateZ(0px) translateX(0px) translateZ(0px);}

 #cube {position: relative;top:40px;margin: 0 auto;height: 500px;width: 300px;-webkit-transition: -webkit-transform 0.7s;-webkit-transform-style: preserve-3d;-moz-transition: -moz-transform 0.7s;-moz-transform-style: preserve-3d;}

 #projector {position: relative;top:0px;margin: 0 auto;height: 200px;width: 100px;-webkit-transition: -webkit-transform 1.7s;-webkit-transform-style: preserve-3d;-webkit-transform: rotateY(0deg) translateX(0px)translateY(0px)translateZ(300px);moz-transition: -moz-transform 1.7s;-moz-transform-style: preserve-3d;-moz-transform: rotateY(0deg) translateX(0px)translateY(0px)translateZ(300px);}

 #projector2 {position: relative;top:-200px;margin: 0 auto;height: 200px;width: 100px;-webkit-transition: -webkit-transform 0.8s;-webkit-transform-style: preserve-3d;-webkit-transform:rotateY(0deg) translateX(300px)translateY(0px)translateZ(0px);-moz-transition: -moz-transform 0.8s;-moz-transform-style: preserve-3d;-moz-transform:rotateY(0deg) translateX(300px)translateY(0px)translateZ(0px);}

 #projector3 {position: relative;top:-400px;margin: 0 auto;height: 200px;width: 100px;-webkit-transition: -webkit-transform 0.9s;-webkit-transform-style: preserve-3d;-webkit-transform:rotateY(0deg) translateX(0px)translateY(0px)translateZ(-300px);-moz-transition: -moz-transform 0.9s;-moz-transform-style: preserve-3d;-moz-transform:rotateY(0deg) translateX(0px)translateY(0px)translateZ(-300px);}

 #projector4 {position: relative;top:-600px;margin: 0 auto;height: 200px;width: 100px;-webkit-transition: -webkit-transform 1.0s;-webkit-transform-style: preserve-3d;-webkit-transform:rotateY(0deg) translateX(-300px)translateY(0px)translateZ(0px);-moz-transition: -moz-transform 1.0s;-moz-transform-style: preserve-3d;-moz-transform:rotateY(0deg) translateX(-300px)translateY(0px)translateZ(0px);}

 #box1{top:0px;position: relative;margin: 0 auto;height: 10px;width: 40px;-webkit-transition: -webkit-transform 1.0s;-webkit-transform-style: preserve-3d;-webkit-transform:rotateX(-15deg) translateX(-19px)translateY(-50px)translateZ(-10px);-moz-transition: -moz-transform 1.0s;-moz-transform-style: preserve-3d;-moz-transform:rotateX(-15deg) translateX(-19px)translateY(-50px)translateZ(-10px);}
.p-box{top:0px;position: relative;margin: 0 auto;height: 10px;width: 40px; -webkit-transition: -webkit-transform 1.0s;-webkit-transform-style: preserve-3d; -moz-transition: -moz-transform 1.0s;-moz-transform-style: preserve-3d;}
 #box2{-webkit-transform:rotateZ(15deg)rotateY(90deg) translateX(-10px)translateY(-50px)translateZ(-19px);-moz-transform:rotateZ(15deg)rotateY(90deg) translateX(-10px)translateY(-50px)translateZ(-19px);}
 #box3{-webkit-transform:rotateY(-180deg)rotateX(-15deg) translateX(0px)translateY(-50px)translateZ(-10px);-moz-transform:rotateY(-180deg)rotateX(-15deg) translateX(0px)translateY(-50px)translateZ(-10px);}
 #box4{-webkit-transform:rotateY(-90deg)rotateX(-15deg) translateX(-10px)translateY(-50px)translateZ(0px);-moz-transform:rotateY(-90deg)rotateX(-15deg) translateX(-10px)translateY(-50px)translateZ(0px);}

.screen{}
.screen p{margin:65px;font-size:72px;text-align:center;color:grey;font-family: sans-serif;opacity:0.9;filter: alpha(opacity = 90);background-image:url("images/cube_face_1.png");}
.glow-bright{-moz-box-shadow: 0 0 10px #91f9ff;
-webkit-box-shadow: 0 0 10px#91f9ff;
box-shadow: 0 0 10px #91f9ff;}

.screen-1{background-image:url("images/cube_face_1.png");}
.screen-2{background-image:url("images/cube_face_2.png");}
.screen-3{background-image:url("images/cube_face_3.png");}
.screen-4{background-image:url("images/cube_face_4.png");}

.screen-1-h{background-image:url("images/cube_face_1_highlight.png");}
.screen-2-h{background-image:url("images/cube_face_2_highlight.png");}
.screen-3-h{background-image:url("images/cube_face_3_highlight.png");}
.screen-4-h{background-image:url("images/cube_face_4_highlight.png");}

.fallback{width:753px;height:602px;position:absolute;margin-top:-15px;margin-left:-97px;z-index:800;opacity:1.0;filter: alpha(opacity = 100);}

.fallback-cube1{background-image:url("images/cube_1.png");height:inherit;z-index:801;}
.fallback-cube2{background-image:url("images/cube_2.png");height:inherit;z-index:802;}
.fallback-cube3{background-image:url("images/cube_3.png");height:inherit;z-index:803;}
.fallback-cube4{background-image:url("images/cube_4.png");height:inherit;z-index:804;}
.fallback-hide{display:none;}
.top-z{z-index:805;}


.glow-dark{-moz-box-shadow: 0 0 40px #1c3b3d;
-webkit-box-shadow: 0 0 40px#1c3b3d;-moz-box-shadow: 0 0 40px#1c3b3d;
box-shadow: 0 0 40px #1c3b3d;}

.screen{position:absolute;width:285px;height:190px;margin-left:-1px;top:60px;background-color:white;}

.face {overflow:hidden;position: absolute;height: 480px;width: 280px;padding: 1px;background-color:#232323;}

.p-face {overflow:hidden;position: absolute;height: 150px;width: 80px;padding: 1px;}

.b-face{overflow:hidden;background-color:white;position: absolute;height: 20px;width: 60px;padding: 1px;}

.top{overflow:hidden;position: absolute;height: 60px;width: 60px;padding: 1px;}
    
#cube .one {-webkit-transform: translateZ(140px);-moz-transform: translateZ(140px);}
#cube .two {-webkit-transform: rotateY(90deg) translateZ(140px);-moz-transform: rotateY(90deg) translateZ(140px);}
#cube .three {-webkit-transform: rotateY(180deg) translateZ(140px);-moz-transform: rotateY(180deg) translateZ(140px);}
#cube .four {-webkit-transform: rotateY(-90deg) translateZ(140px);-moz-transform: rotateY(-90deg) translateZ(140px);}

/*FRONT */
#projector .one-p {-webkit-transform: translateZ(40px) translateY(0px);-moz-transform: translateZ(40px) translateY(0px);background-image:url("images/speaker_front.png");}
#projector .two-p {-webkit-transform: rotateY(90deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(90deg) translateZ(40px) translateY(0px);}
#projector .three-p {-webkit-transform: rotateY(180deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(180deg) translateZ(40px) translateY(0px);}
#projector .four-p {-webkit-transform: rotateY(-90deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(-90deg) translateZ(40px) translateY(0px);}

#projector2 .one-p {-webkit-transform: translateZ(40px) translateY(0px);-moz-transform: translateZ(40px) translateY(0px);}
/*FRONT*/
#projector2 .two-p {-webkit-transform: rotateY(90deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(90deg) translateZ(40px) translateY(0px);background-image:url("images/speaker_front.png");}
#projector2 .three-p {-webkit-transform: rotateY(180deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(180deg) translateZ(40px) translateY(0px);}
#projector2 .four-p {-webkit-transform: rotateY(-90deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(-90deg) translateZ(40px) translateY(0px);}

#projector3 .one-p {-webkit-transform: translateZ(40px) translateY(0px);-moz-transform: translateZ(40px) translateY(0px);}
#projector3 .two-p {-webkit-transform: rotateY(90deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(90deg) translateZ(40px) translateY(0px);}
#projector3 .three-p {-webkit-transform: rotateY(180deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(180deg) translateZ(40px) translateY(0px);background-image:url("images/speaker_front.png");}
/*FRONT*/
#projector3 .four-p {-webkit-transform: rotateY(-90deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(-90deg) translateZ(40px) translateY(0px);}

#projector4 .one-p {-webkit-transform: translateZ(40px) translateY(0px);-moz-transform: translateZ(40px) translateY(0px);}
#projector4 .two-p{-webkit-transform: rotateY(90deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(90deg) translateZ(40px) translateY(0px);}
/* FRONT */
#projector4 .three-p {-webkit-transform: rotateY(180deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(180deg) translateZ(40px) translateY(0px);}
#projector4 .four-p {-webkit-transform: rotateY(-90deg) translateZ(40px) translateY(0px);-moz-transform: rotateY(-90deg) translateZ(40px) translateY(0px);background-image:url("images/speaker_front.png");}

#box1 .one {-webkit-transform: translateZ(30px) translateY(20px);-moz-transform: translateZ(30px) translateY(20px);}
#box1 .two {-webkit-transform: rotateY(90deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(90deg) translateZ(30px) translateY(20px);}
#box1 .three {-webkit-transform: rotateY(180deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(180deg) translateZ(30px) translateY(20px);}
#box1 .four {-webkit-transform: rotateY(-90deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(-90deg) translateZ(30px) translateY(20px);}

#box2 .one {-webkit-transform: translateZ(30px) translateY(20px);-moz-transform: translateZ(30px) translateY(20px);}
#box2 .two {-webkit-transform: rotateY(90deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(90deg) translateZ(30px) translateY(20px);}
#box2 .three {-webkit-transform: rotateY(180deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(180deg) translateZ(30px) translateY(20px);}
#box2 .four {-webkit-transform: rotateY(-90deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(-90deg) translateZ(30px) translateY(20px);}

#box3 .one {-webkit-transform: translateZ(30px) translateY(20px);-moz-transform: translateZ(30px) translateY(20px);}
#box3 .two {-webkit-transform: rotateY(90deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(90deg) translateZ(30px) translateY(20px);}
#box3 .three {-webkit-transform: rotateY(180deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(180deg) translateZ(30px) translateY(20px);}
#box3 .four {-webkit-transform: rotateY(-90deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(-90deg) translateZ(30px) translateY(20px);}

#box4 .one {-webkit-transform: translateZ(30px) translateY(20px);-moz-transform: translateZ(30px) translateY(20px);}
#box4 .two {-webkit-transform: rotateY(90deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(90deg) translateZ(30px) translateY(20px);}
#box4 .three {-webkit-transform: rotateY(180deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(180deg) translateZ(30px) translateY(20px);}
#box4 .four {-webkit-transform: rotateY(-90deg) translateZ(30px) translateY(20px);-moz-transform: rotateY(-90deg) translateZ(30px) translateY(20px);}

#b-five {-webkit-transform: rotateX(90deg) translateZ(10px) translateY(0px);-moz-transform: rotateX(90deg) translateZ(10px) translateY(0px);}
#b-six {-webkit-transform: rotateX(90deg) translateX(0px) translateZ(10px) translateY(0px);-moz-transform: rotateX(90deg) translateX(0px) translateZ(10px) translateY(0px);}

.border-a{-moz-box-shadow: 0 0 10px #888;
-webkit-box-shadow: 0 0 10px#888;
box-shadow: 0 0 10px #888;}

.border-b{-moz-box-shadow: 0 0 8px #202020;
-webkit-box-shadow: 0 0 8px#202020;
box-shadow: 0 0 8px #202020;}

.col{background-color:#1a1a1a;}
.col2{background-color:white;}

.selection{color:orange;-moz-box-shadow: 0 0 5px orange
-webkit-box-shadow: 0 0 5px orange;
box-shadow: 0 0 5px orange;background-color:#FFFF99;}

.group:before,
.group:after {
    content:"";
    display:table;
}
.group:after {
    clear:both;
}
.group {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}
.ir { border: 0; font: 0/0 a; text-shadow: none; color: transparent; background-color: transparent; }