article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { 	font-family: Georgia, serif; color: #000; }
body { margin: 0; font-size: 0.938em; line-height: 1.467em; font-style:italic; }

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

a { color: #009ee0; }
a:visited { color: #009ee0; }
a:hover { color: #009ee0; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

svg:not(:root) { overflow: hidden; }

figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }

/* ============================== */
/* ! Layout for desktop version   */
/* ============================== */


body { font-family: Georgia, serif; background-color:#f6f6f6; }

h2 { margin-bottom:20px; }
h3 { font-size:1em; font-weight:bold; margin-bottom:10px; }
p a { text-decoration:none; }
p a:hover { text-decoration:underline; color:#009EE0; }


#stage { position:relative; background-color:#000000; } 
#stage_nav_con, #content_nav_con { z-index:100; position:relative; margin:0 auto; }
#stage_nav, #content_nav { text-align:center; margin-bottom:40px; }
#stage_nav a.page, #content_nav a.page { margin:0 4px; width:30px; height:30px; display:inline-block; background:url(../img/icons.png) no-repeat 0 0; font-size:0; line-height:0; outline:none; }
#stage_nav a.active, #stage_nav a.page:hover, #content_nav a.active, #content_nav a.page:hover { background-position:-40px 0 ; }

#stage_nav a.prev, 
#content_nav a.prev,
#stage_nav a.next, 
#content_nav a.next { width:20px; height:30px; display:inline-block; background-image:url(../img/icons.png); background-repeat:no-repeat; font-size:0; line-height:0; outline:none; }
                   
#stage_nav a.next, #content_nav a.next { background-position: 0 -40px; }
#stage_nav a.next:hover, #content_nav a.next:hover { background-position: 0 -80px; } 
#stage_nav a.prev, #content_nav a.prev { background-position: -30px -40px; } 
#stage_nav a.prev:hover, #content_nav a.prev:hover { background-position: -30px -80px; } 
#stage_nav a.prev, #content_nav a.prev { margin-right:40px; }
#stage_nav a.next, #content_nav a.next { margin-left:40px; }
                                                            

#stage_bg { position:absolute; width:100%; top:0; text-align:center; height:100%; z-index:0;}
#stage_bg img { margin:0 auto; position:relative; width:100%; max-height:500px; }
#stage_bg img.selected { opacity:1; filter:alpha(opacity=100); }
#stage_bg img.none { display:none; opacity:0; filter:alpha(opacity=0); }

#stage .stage_content { text-align:center; margin-top:23%; margin-bottom:0; z-index:100; position:relative; min-height:240px; }
#stage .stage_text { color:#fff; font-size:2.000em; line-height:1.333em; width:80%; margin:0 auto; }
#stage .stage_text p { font-size:0.500em; }
#stage .stage_content .none { display:none; }

#logo { position:absolute; z-index:100; text-align:center; top:5%; width:100%; display:block; height:50px; }
#page { background-color:#fff; padding-top:75px; padding-bottom:35px;  }

#footer { background-color:#f6f6f6; min-height:200px; padding:30px 0 40px 0; }
#footer a.email { margin-left:10px; margin-bottom:15px; display:inline-block; font-weight:bold; text-decoration:none; }	
#footer a.email:hover { text-decoration:underline; }

div.button { background-color:#d9dadb; margin:20px 0; text-align:center; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
div.button a { display:block; text-decoration:none; font-size:0.800em; font-weight:bold; padding:9px 0; }
div.button_hover { background-color:#009ee0; }
div.button_hover a { color:#fff; }
div.button a:hover { color:#fff; }

div.split_con { text-align:center; width:100%; position:relative; z-index:100; }
div.split { width:100%; height:28px; display:inline-block;  background:url(../img/split.png) no-repeat top center;}
#footer div.split_con { top:-43px; }
#stage div.split_con { text-align:center; width:100%; position:absolute; z-index:100; bottom:-14px; }

.toggle_content { display:none; }
#footer .toggle_content { font-size:0.800em; }
#footer .toggle_content span { display:block; margin-bottom:4px; margin-top:10px; }
#footer h3 { margin-top:10px; }

iframe { margin-top:20px; }
#social iframe { margin-top:0; }
#social { margin:20px 0; }
#social .s_facebook, #social .s_google, #social .s_twitter { float:left; }

a.vimeo, a.facebook, a.twitter, a.toggle, a.email { background-image:url(../img/icons.png); background-repeat:no-repeat; padding-left:30px; }

a.vimeo { background-position:-172px -12px;  }
a.facebook { background-position:-142px -47px; }
a.twitter { background-position:-106px -88px; }
a.email { background-position:-80px -131px; padding-left:22px; white-space:nowrap; }
a.toggle { background-position:-42px -156px; padding-left:25px; font-weight:bold; color:#000; outline:none; margin-top:20px; display:block; }
a.toggle_open { background-position:-8px -180px; }

div.cd_con { display:none; }
div.cd_con_selected { display:block; }

.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; font-size:0; line-height:0; }
                                                                                                                             
.panel {
float: left;
width: 350px;
height: 350px;
margin: 0;
position: relative;
font-size: .8em;
-webkit-perspective: 700px;
-moz-perspective: 700px;
margin-bottom:20px; 
}

.panel .front {
float: none;
position: absolute;
top: 0;
left: 0;
z-index: 900;
width: inherit;
height: inherit;

background: #6b7077;
text-align: center;

-webkit-transform: rotateX(0deg) rotateY(0deg);
-webkit-transform-style: preserve-3d;
-webkit-backface-visibility: hidden;

-moz-transform: rotateX(0deg) rotateY(0deg);
-moz-transform-style: preserve-3d;
-moz-backface-visibility: hidden;

-o-transition: all .4s ease-in-out;
-ms-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
-webkit-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;
}
.panel.flip .front {
z-index: 900;
border-color: #eee;
background: #333;
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
}

.panel .back {
float: none;
position: absolute;
top: 0;
left: 0;
z-index: 800;
width: inherit;
height: inherit;

background: #333;
text-shadow: 1px  1px 1px rgba(0,0,0,0.6); 

-webkit-transform: rotateY(-180deg);
-webkit-transform-style: preserve-3d;
-webkit-backface-visibility: hidden;

-moz-transform: rotateY(-180deg);
-moz-transform-style: preserve-3d;
-moz-backface-visibility: hidden;

-o-transition: all .4s ease-in-out;
-ms-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
-webkit-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;
}

.panel.flip .back {
z-index: 1000;
background: #80868d;         
-webkit-transform: rotateX(0deg) rotateY(0deg);
-moz-transform: rotateX(0deg) rotateY(0deg);
}


.click .front {
cursor: pointer;
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
}
.click.flip .front {
-webkit-transform: rotateX(180deg);
-moz-transform: rotateX(180deg);
}
.click .back {
cursor: pointer;
-webkit-transform: rotateX(-180deg);
-moz-transform: rotateX(-180deg);
}
.click.flip .back {
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
}



/* -- cosmetics -- */
.panel .pad {padding: 0 ; }
.panel.flip .action {display: none; }
.block ol li {text-align: left; margin: 0 0 0 28px; }
.block .action {display: block; padding: 3px; background: #333; text-align: right; font-size: .8em; opacity: 0; position: absolute; cursor: pointer; -webkit-transition: opacity .2s linear; }
.block:hover .action {opacity: .7; }
.circle div {border-radius: 100px; }
.circle div h2 {padding-top: 3em; text-align: center; }


/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 1090px) {
.panel {		
	width: 300px;
	height: 300px;
	-webkit-perspective: 600px;
	-moz-perspective: 600px;			
}
}


@media handheld, only screen and (max-width: 930px) {
.panel {		
	width: 220px;
	height: 220px;
	-webkit-perspective: 440px;
	-moz-perspective: 440px;			
}

}


@media handheld, only screen and (max-width: 767px) {

body {
     
}



#stage .stage_text { font-size:1.5em; }

.panel {		
	width: 250px;
	height: 250px;
	-webkit-perspective: 500px;
	-moz-perspective: 500px;
	margin-left:90px; margin-right:90px;			
}


}



@media handheld, only screen and (max-width: 479px) {

body {            		             	
     	
}
#stage .stage_text { font-size:1em; }
#stage .stage_content { min-height:190px; }

.panel {		
	width: 280px;
	height: 280px;
	-webkit-perspective: 560px;
	-moz-perspective: 560px;
	margin-left:0px; margin-right:0px;			
}
#social .s_facebook, #social .s_google, #social .s_twitter { width:33%; }

}




/* ========================================== */
/* ! Provide higher res assets for iPhone 4   */
/* ========================================== */

@media only screen and (-webkit-min-device-pixel-ratio: 2) { 

/*	.logo {
background: url(logo2x.jpg) no-repeat;
background-size: 212px 303px;
}*/

}