/*
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, th, td { margin:0; padding:0; font-family: "EB Garamond","Helvetica Neue", sans-serif; }
table { border-collapse:collapse; border-spacing:0 }
iframe { border: 0; margin: 0; padding: 0; }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal }
q:before, q:after { content:''}
body { background: #000; color: #fff; }*/
div#browserno { background-color: #f00; width: 100%; text-align: center; position: absolute; z-index: 99402; top: 0; left: 0; }
div#browserno div.padded { padding: 30px 20px 10px 20px; font-size: 1.2em; color: #fff; }

div.periphery_top { text-align: center; background: #d3314a url(../../art/p_bg.jpg) repeat-x; width: 100%; height: 98%; position: relative; -moz-background-size: 100% 100%; -webkit-background-size: 100% 100%; background-size: 100% 100%; }
div.periphery_top div#periphery_line { background: url(../../art/periphery/b_line.png) repeat-y; width: 3px; position: absolute; }
div.periphery_top div#periphery_line2 { background: url(../../art/periphery/b_line.png) repeat-y; width: 3px; position: absolute; }
div#periphery_top h1 { color: #000; padding-top: 8px; font-size: 2.1em; }
div.periphery_top div.peripheryplay { position: absolute; width: 127px; height: 45px; cursor: pointer; z-index: 5; background: url(../../art/f_playbutton.png); pointer-events: all; }
div.periphery_top div.peripherymore { 
	position: absolute; 
	width: 127px; height: 45px; 
	cursor: pointer; 
	z-index: 20; 
	background: url(../../art/more_button.png) no-repeat; 
	pointer-events: all; }
div.periphery_top div#periphery_structure { 
	width: 731px; height: 392px; 
	padding-top: 80px; text-align: 
	left; position: absolute; 
	color: #000; 
	font-size: 18px; 
	margin: 0; 
	padding: 0; 
	background: url(../../art/periphery/topstructure.png); }
/*div.periphery_top div#periphery_line { background: url(../../art/periphery/b_line.png) repeat-y; width: 3px; position: absolute; }
*/div.periphery_intro { 
	text-align: left; 
	position: relative; 
	margin: auto; 
	width: 790px; height: 560px; 
	/*overflow: auto; */
	background: url(../../art/periphery/topstructure.png) no-repeat;
	background-position: center; }
div.periphery_intro p { position: absolute; color: #000; font-size: 18px; margin: 0; padding: 0; }
div.periphery_intro p#p_a { top: 55; right: 70; width: 300px; text-align: left; z-index: 1; }
div.periphery_intro p#p_b { top: 178px; left: 276px; width: 235px; z-index: 2; color: #d3314a; text-align: center; }
div.periphery_intro p#p_c { top: 317px; left: 302px; width: 180px; text-align: center;}
div.periphery_intro p#p_d { top: 461px; left: 90; width: 280px; text-align: right;}
div#periphery_main { 
	position: relative; 
	width: 100%; height: 100%; 
	text-align: center; 
	background: #000; 
	pointer-events: all; }
div#periphery_main div#p_instructions { 
	position: absolute; 
	z-index: 80; 
	cursor: pointer; 
	background: rgba(0,0,0,.6); 
	width: 980px; 
	/*left: 150;*/
	height: 730px; 
	text-align: center; }
div#periphery_main div#p_instructions span#swifter { width: 187px; height: 720px; z-index: 1; left: 665; top: 0; position: absolute; background: url(../../art/periphery/instructions_spin.png); display: none; }
div#periphery_main div#p_instructions span#peripheryplay2 { position: absolute; cursor: pointer; z-index: 5; pointer-events: all; bottom: 350; right: 440;}
div#periphery_main div#p_instructions p { position: relative; font-size: 1.4em; }
div#periphery_main div#p_instructions p#peri_0 { top: 90; }
div#periphery_main div#p_instructions p#peri_1 { color: #d3314a; top: 34%; left: 26%; width: 80;}
div#periphery_main div#p_instructions p#peri_2 { color: #d3314a; top: 42%; left: 65%; width: 100; }
div#periphery_main div#p_instructions p#peri_3 { top: 430; }

div.periphery_bottom { 
	text-align: center; 
	background: #d3314a url(../../art/p_bg_b.jpg) bottom left  repeat-x; 
	width: 100%;
	height: 100%;
	background-size: : 100%;
	position: relative ;
	clear: both;
	pointer-events: all;
	}
div.periphery_bottom div.inner { padding: 30px 0 30px 0; }
div#periphery_bottom h2 { color: #000; padding-bottom: 8px; font-size: 1.6em; text-align: center; }
div.periphery_bottom div#periphery_bottomline { z-index: 1; background: url(../../art/periphery/b_line.png) repeat-y; width: 3px; position: absolute; }
div.periphery_bottom div#periphery_bottomtitle { z-index: 2; position: absolute; bottom: 25; width: 100%; text-align: center; }
div.periphery_bottom div#pbottom_structure { z-index: 2; position: absolute; width: 572px; height: 572px; background: url(../../art/periphery/bottomstructure.png) no-repeat; }
div.periphery_bottom div#pbottom_structure div { text-align: left;  padding: 40px;  position:absolute; top:100; width:143; left: 550; color: #000; }
div.periphery_bottom div#pbottom_structure div p { margin: 1.1em 0; }
div.periphery_bottom div#pbottom_structure div a { color: 000; }
div.periphery_bottom div#pbottom_structure div.pbottom_t { color: #d3314a; width: 430px; left: 30; top: -36; position: relative; text-align: left; /*float: left; margin-right: 40px;*/ }
div.periphery_bottom div#pbottom_structure div.pbottom_t a { color: #d3314a; }
div.periphery_bottom div#pbottom_structure div.pbottom_b { color: #000; width: 430px; left: 30; top: -80; position: relative; text-align: left; /*float: left; margin-right: 40px;*/ }
div.periphery_bottom div#pbottom_structure div.pbottom_l { color: #000; width: 137px; left: 552; top: 240; position: absolute; text-align: left; /*float: left; margin-right: 40px;*/ }
div.periphery_bottom div#pbottom_structure div.pbottom_r { color: #000; width: 150px; left: -210; top: 98; position: absolute; text-align: right; /*float: left; margin-right: 40px;*/ }


div#periphery_main div#periphery_linewhite { background: url(../../art/periphery/b_linewhite.png) repeat-y; width: 3px; position: absolute; z-index: 1; }
#periphery_main div#p_legmore { position: absolute; z-index: 10; bottom: 10; width: 127px; height: 45px; cursor: pointer; background: url(../../art/periphery/periphery_more.png) no-repeat; }

div#periphery_main #p_outerouter {
	text-align: center;
	position: absolute;
	width: 100%;
	z-index: 4;
}

#periphery_main .home_button {
	z-index: 5; opacity: 0.5;
}

#periphery_bottom .home_button {
	z-index: 2; opacity: 1;
}

div#periphery_main #p_outerouter #p_outerinner {
	height: 100%;
	margin: 0 auto;
	position: relative;
    transform-style: preserve-3d;
   -webkit-transform-style: preserve-3d;
	text-align: left;
	width:100%;	
}


#p_outerinner #p_container {
	position: relative;
	height: 730px;
	width: 980px;
	margin: 0 auto;
	text-align: center;
    transform-style: preserve-3d;
   -webkit-transform-style: preserve-3d;
	perspective: 1000;	
	-webkit-perspective: 1000;	
	 z-index: 1;
}

#p_outerinner #p_container #pcard {
	overflow: visible !important;
   	width: 743px;
 	height: 723px;
	position: relative;
	z-index: 10;
	margin: 0 auto;
	text-align: center;
  	transform-style: preserve-3d;
  	transition: all .5s linear;
  	transform-origin: center center;
  	-webkit-transform-style: preserve-3d;
  	-webkit-transition: all .5s linear;
  	-webkit-transform-origin: center center;
}

#p_outerinner #p_container #leftbutton {
	z-index: 40;
	display: block; 
	position: absolute; 
	left: -40; 
	top: 250; 
	height: 31px; 
	width: 23px; 
	background: url(../../art/periphery/leftar.png);
}

#p_outerinner #p_container #rightbutton {
	z-index: 40;
	display: block; 
	position: absolute; 
	left: 1280; 
	top: 250; 
	height: 31px; 
	width: 23px; 
	background: url(../../art/periphery/rightar.png);
}

#p_outerinner #p_container div.buttonoff {
	opacity: .2;
}

#p_outerinner #p_container div.buttonon {
	opacity: .6;
	cursor: pointer;
}

#p_outerinner #p_container div.buttonon:hover {
	opacity: 1;
}

#p_outerinner #p_controls #p_scrubber {
	width: 588px;
	float: left;
	margin: 17px 15px 9px 0px;
	height: 2px; 
	background-color: #888; 
	position: relative;
	z-index: 2;
}

#p_outerinner #p_controls #p_scrubber #p_progress {
	width: 0;
	position: absolute;
	height: 2px;
	top: 0;
	background-color: #d3314a;
	z-index: 2;
}

.norm #target {
	position: relative;
	width: 100%;
	height: 100%;
}

#textLeft{
	width: 480px;
	float: left;	
}
#textRight{
	width: 480px;
	float: right;	
}
.clear{
	clear: both;
}

#p_outerinner #p_controls #p_playElement{
	display: block;
	float: left;
	cursor: pointer;
	width: 26px;
	height: 38px;
	position: relative;
	z-index: 2;
}

.playRed {
	background-image: url(../../art/periphery/playRed.png);
}

.pauseRed {
	background-image: url(../../art/periphery/pauseRed.png);
}

.playWhite {
	background-image: url(../../art/periphery/playWhite.png);
}

.pauseWhite {
	background-image: url(../../art/periphery/pauseWhite.png);
}

#cradleContent .more_button{
	color:blue;
}

#legacyContent .more_button{
	color:green;
}

.more_button{
	position: absolute;
	width:127px;
	height: 45px;
	cursor: pointer;
	z-index: 5;
	background: url(../../art/cradle/cradle_more.png) no-repeat; 
	pointer-events: all;
}

#p_pauseElement:hover;{
	display: block;
	cursor: pointer;
	width: 27px;
	height: 38px;
	background-image: url(images/playGray.png);
}

#p_outerinner #p_controls #p_refresh{
	display: block;
	float: left;
	cursor: pointer;
	width: 27px;
	height: 38px;
	background: url(../../art/periphery/refresh_red.png);
	margin-left: 25px;
}

#p_refresh:hover;{
	display: block;
	float: left;
	cursor: pointer;
	width: 27px;
	height: 38px;
	background: url(../../art/periphery/refresh_white.png);
	margin-left: 320px;
}

#periphery_arrows {
	background: url(../../art/periphery/arrows2.png) no-repeat;
	background-size: 100%;
	width: 743px;
	height: 723px;
	position: absolute;
	margin: 0 auto;
	left: 50%;
	margin-left: -371px;
	text-align: center;
	z-index: 85;
	pointer-events: none;
}

#p_play_bg {
	background: url(../../art/periphery/play_bg.png);
	width: 155px;
	height: 155px;
	position: absolute;
	z-index: 100;
	left: 50%;
	margin-left: -77px;
	top: 50%;
	margin-top: -77px;
	cursor: pointer;
}

#p_play_instructions {
	background: url(../../art/periphery/play_bg.png);
	width: 155px;
	height: 155px;
	position: absolute;
/*	z-index: 100;*/
	left: 50%;
	margin-left: -77px;
	top: 50%;
	margin-top: -77px;
	cursor: pointer;
}

#p_pause_bg {
	background: url(../../art/periphery/pause_bg.png);
	width: 155px;
	height: 155px;
	position: absolute;
	z-index: 10;
	left: 564;
	top: 284;
	cursor: pointer;
}

#p_outerinner #p_endscreen {
	position: relative;
	height: 725px;
	width: 725px;
	z-index: 1;
	margin: 0 auto;
	top: 0;
	left: 0;
}

#p_outerinner #p_endscreen div#p_person_a {
	width: 720px;
	height: 720px;
	position: absolute;
	z-index: 1;	
	background: url(../../art/periphery/endscreen_norm_circ.png);
	top: 0;
	left: 0;
}

#p_outerinner #p_endscreen div#p_person_b {
	width: 720px;
	height: 720px;
	position: absolute;
	z-index: 1;	
	background: url(../../art/periphery/endscreen_yeti_circ.png);
	top: 0;
	left: 0;
}

#p_outerinner #p_endscreen div#p_people_data {
	position: absolute;
	z-index: 2;	
	height: 725px;
	left: 0;
	width: 725px;
	background: url(../../art/periphery/semicircle5.png);
	background-size: 100%;
	opacity: 0.7;
	transform-origin: center center;
	-webkit-transform-origin: center center;
}

#p_outerinner #p_endscreen div#p_people_data div {
	width: 720px;
	position: absolute;
}

#p_outerinner #p_endscreen div#p_person_overlay {
	width: 720px;
	height: 720px;
	z-index: 3;
	position: absolute;
	cursor: pointer;
	text-align: center;
	font-size: 1.5em;
	padding-top: 310px;
	line-height: 2em;
}


#p_outerinner #p_endscreen div#p_person_overlay:hover {
	color: #d3314a;
	opacity: 1.0;
}