﻿/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

html, body {
    overflow:hidden;    
}

body {
    font-family:Arial, Helvetica, sans-serif;
    background-color: #000;
}

a {
    color:#ff0000;
    text-decoration: none;
}

#container {
    width:100%;
    /*max-width: 1600px;
    max-height: 1000px;*/
    margin: 0 auto;
    position: fixed;
    right: 0;
    left: 0;
}

.full-section {
    position: fixed;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.section {
    position: fixed;
    width: 100%;
    height: 100%;
    /*max-width: 1600px;
    max-height: 1000px;*/
    overflow: hidden;
    /*
    background: url(../images/nav/canvasframe.png) no-repeat;
    background-size: cover;*/
}

#debug-scrollpos{
	position: fixed;
	background: #fff;
	top: 0;
	right: 0;
	display:none;
}

.clickable,
.clickable-nozindex {
    cursor: pointer;
}

.block {
    width:500px;
    height:300px;
    border: 1px solid #fff;
    position:absolute;
    top:0px;
    left:0px;
    display:none;
    -moz-border-radius: 10px;
    border-radius: 10px;
    color: #fff;
    padding:10px;
    font-size: 23px;
}

.perspective-400 {
  -webkit-perspective: 400px;
     -moz-perspective: 400px;
      -ms-perspective: 400px;
          perspective: 400px;
}

.perspective-800 {
  -webkit-perspective: 800px;
     -moz-perspective: 800px;
      -ms-perspective: 800px;
          perspective: 800px;
}

.perspective-1600 {
  -webkit-perspective: 1600px;
     -moz-perspective: 1600px;
      -ms-perspective: 1600px;
          perspective: 1600px;
}

.img-responsive {
    max-width: 100%;
    height: auto;
}

.canvas-overlay,
.canvas-overlay-video {
    width:100%;
    height:100%;
    /*max-width: 1600px;
    max-height: 1000px;*/
    position: absolute;
    right: 0;
    left: 0;
    background: url(../images/nav/canvasframe.png) center no-repeat;
    background-size: cover;
    pointer-events: none;
    /*display: inline-block;
    overflow: hidden;
    background-repeat: no-repeat;
    background-image: url(../images/nav/canvasframe.png);
    pointer-events: none;
    */
}
.canvas-overlay-video {
    background: url(../images/nav/canvasframe-video.png) center repeat-y;
    background-size: contain;
}
.canvas-left {
    position: absolute;
    width: 310px;
    height: 1000px;
    background-position: 0 0;
}
.canvas-right {
    position: absolute;
    left: 1230px;
    width: 370px;
    height: 1000px;
    background-position: -1230px 0;
}
.canvas-bottom {
    position: absolute;
    top: 668px;
    left: 310px;
    width: 920px;
    height: 332px;
    background-position: -310px -668px;
}

.bg,
.bg-long,
.bg-short {
    width:100%;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
}

/**Preloading**/
#preloading-container {background:#ffffff url('../images/preloader.gif') center center no-repeat; width:100%; height:100%; margin:0 auto; position:fixed; }
/*#preloading-done-container {display:none;}*/

/* Nav
################################################ */
#top-control-sound {
    width:28px;
    height:29px;
    position: fixed;
    top: 5px;
	right: 213px;
}
#top-control-sound-btn {
    width:100%;
    height:100%;
    background: url(../images/nav/audioon.jpg) no-repeat;
}
#top-control-sound-btn.btn-click {
    background: url(../images/nav/audiooff.jpg) no-repeat !important;
}

#top-control {
    /*position: absolute;*/
    position: fixed;
	top: 5px;
	right: 5px;
	color: #ff0000;
	/*opacity:0.5;
    filter:alpha(opacity=50);*/
}
#top-control-logo {
    width: 198px;
    height: 119px;
    background: url(../images/nav/logo.jpg) no-repeat;
}
#top-control-nav {
    width: 198px;
    height: 38px;
    background: url(../images/nav/nav.png) no-repeat;
    /*display:none;*/
}
#top-control-nav-expand {
    position:relative;
    width: 198px;
    height: 330px;/*263px;*/
    background: url(../images/nav/navplate.png) repeat-y;
    display:none;
    padding-top:5px;
}
.top-control-nav-item {
    width:198px;
    height:28px;
    position:relative;
    top:0px;
    left:0px;
    padding-bottom:5px;
}

#top-control-nav-videos {
    /*top:5px;*/
    background: url(../images/nav/navvideosOFF.jpg) no-repeat;
}
#top-control-nav-videos.btn-over{
    background: url(../images/nav/navvideos.jpg) no-repeat;
}

#top-control-nav-games {
    /*top:38px;*/
    background: url(../images/nav/navgamesOFF.jpg) no-repeat;
}
#top-control-nav-games.btn-over{
    background: url(../images/nav/navgames.jpg) no-repeat;
}

#top-control-nav-mobileapps {
    /*top:71px;*/
    background: url(../images/nav/navmobileappsOFF.jpg) no-repeat;
}
#top-control-nav-mobileapps.btn-over{
    background: url(../images/nav/navmobileapps.jpg) no-repeat;
}

#top-control-nav-printcreate {
    /*top:104px;*/
    background: url(../images/nav/navprintcreateOFF.jpg) no-repeat;
}
#top-control-nav-printcreate.btn-over{
    background: url(../images/nav/navprintcreate.jpg) no-repeat;
}

#top-control-nav-takeaways {
    /*top:137px;*/
    background: url(../images/nav/navtakeawaysOFF.jpg) no-repeat;
}
#top-control-nav-takeaways.btn-over{
    background: url(../images/nav/navtakeaways.jpg) no-repeat;
}

#top-control-nav-ourtravels {
    /*top:170px;*/
    background: url(../images/nav/navourtravelsOFF.jpg) no-repeat;
}
#top-control-nav-ourtravels.btn-over{
    background: url(../images/nav/navourtravels.jpg) no-repeat;
}

#top-control-nav-partners {
    background: url(../images/nav/navpartnersOFF.jpg) no-repeat;
}
#top-control-nav-partners.btn-over{
    background: url(../images/nav/navpartners.jpg) no-repeat;
}
#top-control-nav-shop {
    background: url(../images/nav/navshopOFF.jpg) no-repeat;
}
#top-control-nav-shop.btn-over{
    background: url(../images/nav/navshop.jpg) no-repeat;
}

#bottom-control {
    width:206px;
    height:108px;
    /*position:absolute;*/
    position: fixed;
    bottom:40px;
    right:0px;
}
#bottom-control-btn {
    width:100%;
    height:100%;
    background: url(../images/nav/button.png) no-repeat;
}
#bottom-control-btn.btn-over {
    background: url(../images/nav/buttonover.png) no-repeat !important;
}
#bottom-control-btn.btn-click {
    background: url(../images/nav/buttonclick.png) no-repeat !important;
}

/* home DVD */
#home-order-position {
	top:268px;
	position:absolute;
}

#home-order-btn {
    width: 155px;
    height: 57px;
    position:absolute;
    top:2px;
    left:22px;
}

#home-order-reveal-btn {
    width: 183px;
    height: 60px;
    position:absolute;
    top:0px;
    left:8px;  
}

#home-buydigi-btn {
    width: 183px;
    height: 29px;
    position:absolute;
    top:31px;
    left:8px; 
    cursor:pointer;
}

#home-buydvd-btn {
    width: 183px;
    height: 29px;
    position:absolute;
    top:0px;
    left:8px; 
    cursor:pointer;
}

#home-order-position-base {
	top:310px;
	position:absolute;
}

#home-order-btn-base {
    width: 155px;
    height: 57px;
    position:absolute;
    top:2px;
    left:22px;
}

#home-order-reveal-btn-base {
    width: 183px;
    height: 60px;
    position:absolute;
    top:0px;
    left:8px;  
}

#home-buydigi-btn-base {
    width: 183px;
    height: 29px;
    position:absolute;
    top:31px;
    left:8px; 
    cursor:pointer;
}

#home-buydvd-btn-base {
    width: 183px;
    height: 29px;
    position:absolute;
    top:0px;
    left:8px; 
    cursor:pointer;
}

#home-buybox {
    width: 184px;
    height: 219px;
    position:absolute;
    top:10px;
    left:10px; 
    cursor:pointer;
}

#home-est {
    width: 198px;
    height: 381px;
    position:absolute;
    top:150px;
    left:0px; 
}

/* Legal
################################################ */
#legal-container {
    width:100%;
    height:40px;
    position: fixed;
    bottom: 0;
    background: url(../images/nav/legalbgstrecth.jpg) repeat-x;
}
#legal-bg {
    width:100%;
    height:40px;
    max-width: 1600px;
    margin: 0 auto;
    position: absolute;
    right: 0;
    left: 0;
    background: url(../images/nav/legalstrip.jpg) center no-repeat;
}
#legal-text {
    width:473px;
    height:36px;
    font-size:9px;
    line-height:9px;
    text-align:center;
    position:absolute;
	left:50%;
    margin-left:-330px;
    top:3px;
}
#legal-textb {
    width:100px;
    height:36px;
    font-size:11px;
    font-weight: bold;
    line-height:11px;
    text-align:center;
    position:absolute;
    left:420px;
    top:12px;
}
#fb-btn {
    width:93px;
    height:27px;    
    position:absolute;
    /*top:7px;
    left:320px;
    */
    left:50%;
    top:7px;
    margin-left:-480px;
}
#fb-btn.btn-over {
    background: url(../images/nav/facebookover.jpg) no-repeat !important;
}
#twitter-btn {
    width:133px;
    height:28px;    
    position:absolute;
    /*top:7px;
    right:283px;    
    */
    left:50%;
    top:7px;
    margin-left:384px;
}
#twitter-btn.btn-over {
    background: url(../images/nav/twitterover.jpg) no-repeat !important;
}

#flag-btn {
    width:76px;
    height:26px;    
    position:absolute;
    /*top:7px;
    right:283px;    
    */
    left:50%;
    top:14px;
    margin-left:195px;
}

/* Scene Video
################################################ */
.sceneVideo {
    position:relative;
    left:0px;
}

#main-to-videos-videoBG {
    width:100%;
    height:auto; /*480/1000*/
    /*width:1600px;
    height: 480px;*/
    background-color: #000;
    position:absolute;
    top:0px;
    left:0px;
}  
#main-to-videos-video {
    width:100%;
    height:100%;
    height:auto;
    display: block;
}
#main-to-videos-dash1 {
    background: url(../images/videos/main-to-videos-dash1.png) no-repeat;
    background-size:cover;
    width:7px; /*7/1600*/
    height:114px; /*114/480*/
    position:absolute;
    top:0px;
    left:913px; /*913/1600*/
}
#main-to-videos-dash2 {
    background: url(../images/videos/main-to-videos-dash2.png) right center no-repeat;
    background-size:cover;
    width:82px; /*82/1600*/
    height:7px; /*7/480*/
    position:absolute;
    top:125px; /*120/480*/
    left:820px; /*310/1600*/
    /*left:890px;*/
}
#main-to-videos-dash3 {
    background: url(../images/videos/main-to-videos-dash3.png) no-repeat;
    background-size:cover;
    width:7px; /*7/1600*/
    height:340px; /*340/480*/
    position:absolute;
    top:145px; /*135/480*/
    left:800px; /*300/1600*/
}

/*#####*/
#main-to-sherman-videoBG {
    width:100%;
    height:auto; /*480/1000*/
    /*width:1600px;
    height: 480px;*/
    background-color: #000;
    position:absolute;
    top:0px;
    left:0px;
}  
#main-to-sherman-video {
    width:100%;
    height:100%;
    height:auto;
    display: block;
}
#main-to-sherman-dash1 {
    background: url(../images/main/main-to-sherman-dash1.png) no-repeat;
    background-size:cover;
    width:7px; /*7/1600*/
    height:114px; /*114/480*/
    position:absolute;
    top:0px;
    left:790px; /*913/1600*/
}
#main-to-sherman-dash2 {
    background: url(../images/main/main-to-sherman-dash2.png) right center no-repeat;
    background-size:cover;
    width:475px; /*598/1600*/
    height:7px; /*7/480*/
    position:absolute;
    top:125px; /*120/480*/
    left:287px; /*310/1600*/
    /*left:890px;*/
}
#main-to-sherman-dash3 {
    background: url(../images/main/main-to-sherman-dash3.png) no-repeat;
    background-size:cover;
    width:7px; /*7/1600*/
    height:340px; /*340/480*/
    position:absolute;
    top:145px; /*135/480*/
    left:270px; /*300/1600*/
}

/*#####*/
#sherman-to-peabody-videoBG {
    width:100%;
    height:auto; /*480/1000*/
    background-color: #000;
    position:absolute;
    top:0px;
    left:0px;
}  
#sherman-to-peabody-video {
    width:100%;
    height:100%;
    height:auto;
    display: block;
}
#sherman-to-peabody-dash1 {
    background: url(../images/peabody/sherman-to-peabody-dash1.png) no-repeat;
    background-size:cover;
    width:7px;
    height:308px;
    position:absolute;
    top:10px;
    left:1031px;
}
#sherman-to-peabody-dash2 {
    background: url(../images/peabody/sherman-to-peabody-dash2.png) right center no-repeat;
    background-size:cover;
    width:888px;
    height:7px;
    position:absolute;
    top:330px;
    left:140px;
    /*left:890px;*/
}
#sherman-to-peabody-dash3 {
    background: url(../images/peabody/sherman-to-peabody-dash3.png) no-repeat;
    background-size:cover;
    width:7px;
    height:114px;
    position:absolute;
    top:355px;
    left:120px;
}

/*#####*/
#peabody-to-penny-videoBG {
    width:100%;
    height:auto; /*480/1000*/
    background-color: #000;
    position:absolute;
    top:0px;
    left:0px;
}  
#peabody-to-penny-video {
    width:100%;
    height:100%;
    height:auto;
    display: block;
}
#peabody-to-penny-dash1 {
    background: url(../images/penny/peabody-to-penny-dash1.png) no-repeat;
    background-size:cover;
    width:7px;
    height:243px;
    position:absolute;
    top:10px;
    left:1161px;
}
#peabody-to-penny-dash2 {
    background: url(../images/penny/peabody-to-penny-dash2.png) right center no-repeat;
    background-size:cover;
    width:469px;
    height:7px;
    position:absolute;
    top:270px;
    left:680px;
    /*left:890px;*/
}
#peabody-to-penny-dash3 {
    background: url(../images/penny/peabody-to-penny-dash3.png) no-repeat;
    background-size:cover;
    width:7px;
    height:179px;
    position:absolute;
    top:290px;
    left:660px;
}

/*#####*/
#penny-to-takeaways-videoBG {
    width:100%;
    height:auto; /*480/1000*/
    background-color: #000;
    position:absolute;
    top:0px;
    left:0px;
}  
#penny-to-takeaways-video {
    width:100%;
    height:100%;
    height:auto;
    display: block;
}
#penny-to-takeaways-dash1 {
    background: url(../images/takeaways/penny-to-takeaways-dash1.png) no-repeat;
    background-size:cover;
    width:7px;
    height:146px;
    position:absolute;
    top:5px;
    left:1003px;
}
#penny-to-takeaways-dash2 {
    background: url(../images/takeaways/penny-to-takeaways-dash2.png) right center no-repeat;
    background-size:cover;
    width:888px;
    height:7px;
    position:absolute;
    top:160px;
    left:110px;
    /*left:890px;*/
}
#penny-to-takeaways-dash3 {
    background: url(../images/takeaways/penny-to-takeaways-dash3.png) no-repeat;
    background-size:cover;
    width:7px;
    height:308px;
    position:absolute;
    top:170px;
    left:100px;
}

/* Splash
################################################ */
#splash-container {
    /*background: #eee url(../images/splashintro/splashbg.jpg) repeat-x;*/
    /*background-size: cover;*/
    background-color: #fff;
}
#splash-wrapper {
    /*width:100%;
    height:100%;
    max-width:1600px;*/
    width:100%;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
    background: url(../images/splashintro/bg-pre.jpg) center no-repeat;
    background-size:contain;
}
#splash-title {
    width: 73%; /*1166/1600*/
    height: 6%; /*62/1000*/
    position:absolute;
    top:0px;
    left:50%;
    margin-left:-36%;
    text-align:center;
}
#splash-logo {
    width: 23%; /*381/1600*/
    height: 22%; /*223/1000*/
    position:absolute;
    bottom:10%; /*100/1000*/
    left:12%; /*200/1600*/
    background:url(../images/splashintro/logo.png) center no-repeat;
    background-size: contain;
}

#splash-buybox-btn {
    width: 15.3%; /*245/1600*/
    height: 29.2%; /*292/1000*/
    position:absolute;
    bottom:28.8%; /*370/1000*/
    left:21.3%;  
    background:url(../images/splashintro/pixel.gif) bottom;
    background-size: contain;
    cursor:pointer;
}

#splash-order-btn {
    width: 9.1%; /*147/1600*/
    height: 10.4%; /*104/1000*/
    position:absolute;
    bottom:37%; /*370/1000*/
    left:36.6%;  
    background:url(../images/splashintro/buyblock.png) bottom no-repeat;
    background-size: contain;
}

#splash-order-reveal-btn {
    width: 12.3%; /*198/1600*/
    height: 10.4%; /*104/1000*/
    position:absolute;
    bottom:37%; /*370/1000*/
    left:36.6%;  
    background:url(../images/splashintro/block.png) bottom no-repeat;
    background-size: contain;
}

#splash-buydigi-btn {
    bottom:38.75%; /*370/1000*/
    left:36.65%;  
    width: 12.3%; /*197/1600*/
    height: 3.3%; /*33/1000*/
    position:absolute;
    background:url(../images/splashintro/block-digi.png) bottom no-repeat;
    background-size: contain;
    cursor:pointer;
}

#splash-buydvd-btn {
    bottom:42.2%; /*370/1000*/
    left:36.65%;  
    width: 12.3%; /*197/1600*/
    height: 3.3%; /*33/1000*/
    position:absolute;
    background:url(../images/splashintro/block-dvd.png) bottom no-repeat;
    background-size: contain;
    cursor:pointer;
}

#splash-watch-trailer-btn {
    width: 22.3%; /*357/1600*/
    height: 8%; /*80/1000*/
    position:absolute;
    /*bottom:5%; /*185/1000*/
    left:18%;
    /*left:50%;
    margin-left:17.375%;*/ /*230/1600*/    
    background:url(../images/splashintro/watchtrailer.jpg) bottom no-repeat;
    background-size: contain;
}
#splash-get-tickets-btn {
    width: 23.1%; /*371/1600*/
    height: 6.8%; /*68/1000*/
    position:absolute;
    bottom:36%; /*225/1000*/
    left:16.5%;
    /*left:50%;
    margin-left:17.375%;*/ /*230/1600*/    
    background:url(../images/splashintro/gettickets.jpg) bottom no-repeat;
    background-size: contain;
}
#splash-enter-site-btn {
    width: 17.125%; /*274/1600*/
    height: 14.4%; /*144/1000*/
    position:absolute;
    bottom:40px; /*40/1000*/
    left:20.5%;
    /*left:50%;
    margin-left:20.5%;*/ /*280/1600*/
    /*background:url(../images/splashintro/entersite.png) center no-repeat;*/
    background:url(../images/splashintro/redbutton.png) bottom no-repeat;
    background-size: contain;
}
#splash-enter-site-btn.btn-over{
    background:url(../images/splashintro/redbuttonOver.png) bottom no-repeat;
    background-size: contain;
}
#splash-enter-site-btn.btn-click{
    background: url(../images/splashintro/redbuttonPress.png) bottom no-repeat;
    background-size: contain;
}
#splash-bg1 {
    width: 100%;
    height:100%;
    background: url(../images/splashintro/head1.png);
    background-position:center;
    background-repeat:no-repeat;
    background-size: contain; 
    position:absolute;
    top:0px;
    left:0px;
}
#splash-bg2 {
    width: 100%;
    height:100%;
    /*background: url(../images/splashintro/head2.png) center no-repeat;*/
    background-position:center;
    background-repeat:no-repeat;
    background-size: contain;
    position:absolute;
    top:0px;
    left:0px;
    /*opacity:0;
    filter:alpha(opacity=0);*/
}

#splash-trailer-overlay-container {
    width:100%;
    height:100%;
    position:fixed;
    top:0px;
    left:0px;
    z-index:99999;
    display:none;
}
#splash-trailer-overlay-container {
    z-index:99998;
}
#splash-trailer-overlay-bg {
    width:100%;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
    background: url(../images/splashintro/blackcover.png) repeat;
}
#splash-trailer-overlay-content {
    width:925px;
    height:552px;
    position:absolute;
    top:50%;
    left:50%;
    margin-top:-276px;
    margin-left:-462px;
    background: url(../images/splashintro/videoframe.png) repeat;
}
#splash-trailer-overlay-close-btn {
    width:54px;
    height:54px;
    position:absolute;
    top:0px;
    right:0px;
    background: url(../images/splashintro/videoclose.png) no-repeat;
}
#splash-trailer-overlay-close-btn.btn-over {
    background: url(../images/splashintro/videocloseOver.png) no-repeat;
}
#splash-trailer-youtube {
    position:absolute;
    top:36px;
    left:36px;
}

/* Intro
################################################ */
#intro-videoBG {
    width:100%;
    height:100%;
    background-color: #000;
}  
#intro-video {
    /*width:100%;
    height:100%;
    height:auto;*/
    width:100%;
    height:auto;
    position:absolute;
    left:0px;
}
#intro-video-skip-btn {
    width:252px;
    height:46px;
    background: url(../images/splashintro/skip.png) no-repeat;
    position:absolute;
    bottom:40px;
    left:50%;
    margin-left:-126px;
}
#intro-video-skip-btn.btn-over{
    background: url(../images/splashintro/skipover.png) no-repeat !important;
}



/* Main Page
################################################ */
#main-bg {
    background: url(../images/main/mainbg.jpg) center no-repeat;
    background-size: cover;
}
#main-top-fade {
    position:absolute;
    top:0px;
    width:1600px;
    height:126px;
    background: url(../images/main/topfade.png) no-repeat;
}
#main-scroll-img {
    position:absolute;
    top:5px;
    left:50%;
    margin-left:-16%; /*264/1600*/
    width:33%; /*528/1600*/
    height:7%; /*72/1000*/
    background: url(../images/main/scroll.gif) no-repeat;
    background-size: contain;
}
#main-machine {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background: url(../images/main/machine.png) center no-repeat;
    background-size:cover;
}
#main-dot {
    background: url(../images/main/main-dots1.png) no-repeat;
    background-size: cover;
    width:40px; /*40/1600*/
    height:679px; /*679/1000*/
    position:absolute;
    left:1460px; /*880/1600*/
    top:300px; /*300/1000*/     
}
#main-dash-start {
    background: url(../images/main/main-dash-start.png) no-repeat;
    background-size: cover;
    width:40px;
    height:34px;
    position:absolute;
    left:880px;
    top:300px;
}
#main-dash1 {
    background: url(../images/main/main-dash1.png) no-repeat;
    background-size: cover;
    width:7px;
    height:647px;
    position:absolute;
    left:913px;
    top:350px;
}

/* Section videos
################################################ */
#section-videos-bg {
    background: url(../images/videos/bg.jpg) left center no-repeat;
    background-size: contain;
}

#section-videos-shermanpose {
    width: 25.8%; /*413/1600*/
    height: 91.3%; /*913/1000*/
    background: url(../images/videos/shermanpose.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:60px;
    top:8%; /*80/1000*/
}

#section-videos-pennypose {
    width: 25.8%; /*430/1600*/
    height: 91.3%; /*792/1000*/
    background: url(../images/videos/pennypose.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:1140px;
    top:19%; /*190/1000*/
}

#section-videos-datestamp {
    width: 27.75%; /*444/1600*/
    height: 21.3%; /*213/1000*/
    background: url(../images/videos/datestamp.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:6.25%; /*100/1600*/
    top:5%; /*50/1000*/
}

#section-videos-video-container {
    width: 45.75%; /*732/1600*/
    height: 41.2%; /*412/1000*/    
    position:absolute;
    left:435px;
    top:29.4%;
}
#section-videos-video-container iframe {
    width: 100%; /*732/1600*/
    height: 100%; /*412/1000*/
    position:absolute;
    top:0px;
    left:0px;
}
.section-videos-video-item {
    display:none;
}
.section-videos-video-item.active {
    display:block;
}

#section-videos-prev-btn {
    width: 18.8%; /*301/1600*/
    height: 4%; /*40/1000*/
    background: url(../images/videos/prev.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:451px;
    top:22.7%;    
}
#section-videos-prev-btn.btn-over {
    background: url(../images/videos/prevover.png) no-repeat;
    background-size:contain;
}

#section-videos-next-btn {
    width: 18.8%; /*301/1600*/
    height: 4%; /*40/1000*/
    background: url(../images/videos/next.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:845px;
    top:22.7%;
}
#section-videos-next-btn.btn-over {
    background: url(../images/videos/nextover.png) no-repeat;
    background-size:contain;
}
#section-videos-video-title {
    width: 17.8%; /*285/1600*/
    height: 2.3%; /*23/1000*/
    background: url(../images/videos/video1.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:660px;
    top:70.7%;
}

#section-videos-overlay {
    width:100%;
    height:100%;
    background: url(../images/videos/bgoverlay.jpg) center no-repeat;
    background-size: cover;
    position:absolute;
    top:0px;
    left:0px;
}
.section-videos-overlay {
    width:50%;
    height:100%;
    position:absolute;
    top:0px;
}
#section-videos-overlay-left {
    left:0px;
    background: url(../images/videos/bgoverlay.jpg) left center no-repeat;
    background-size: cover;
}
#section-videos-overlay-right {
    right:0px;
    background: url(../images/videos/bgoverlay.jpg) right center no-repeat;
    background-size: cover;
}
#videos-dash1 {
    background: url(../images/videos/videos-dash1.png) no-repeat;
    background-size: cover;
    width:7px;
    height:207px;
    position:absolute;
    top:0px;
    left:790px;
}
#videos-dash2 {
    background: url(../images/videos/videos-dash2.png) no-repeat;
    background-size: cover;
    width:7px;
    height:211px;
    position:absolute;
    top:750px;
    left:790px;
}
#videos-dash-arrow-down1 {
    background: url(../images/dash-arrow-down.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:200px;
    left:772px;
}
#videos-dash-arrow-down2 {
    background: url(../images/dash-arrow-down.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:750px;
    left:772px;
}

/* Character Sherman
################################################ */
#character-sherman-bg {
    /*width:2192px !important;*/
    width:2740px;
    height:1000px;
    background: url(../images/sherman/shermanbg.jpg) left center no-repeat;
    background-size: contain;
}
/*
#sherman-dash1 {
    background: url(../images/sherman/sherman-dash1.png) no-repeat;
    background-size: cover;
    width:7px;
    height:856px;
    position:absolute;
    top:0px;
    left:270px;
}
*/
#sherman-dash1 {
    background: url(../images/sherman/sherman-dash1.png) no-repeat;
    background-size: cover;
    width:7px;
    height:211px;
    position:absolute;
    top:0px;
    left:270px;
}
#sherman-dash1-1 {
    background: url(../images/sherman/sherman-dash1-1.png) no-repeat;
    background-size: cover;
    width:7px;
    height:630px;
    position:absolute;
    top:220px;
    left:270px;
}
#sherman-dash2 {
    background: url(../images/sherman/sherman-dash2.png) no-repeat;
    background-size: cover;
    width:662px;
    height:7px;
    position:absolute;
    top:860px;
    left:285px;
}
#sherman-dash3 {
    background: url(../images/sherman/sherman-dash3.png) center bottom no-repeat;
    background-size: cover;
    width:7px;
    height:82px;
    position:absolute;
    top:770px;
    left:955px;
}
#sherman-dash4 {
    background: url(../images/sherman/sherman-dash4.png) no-repeat;
    background-size: cover;
    width:308px;
    height:7px;
    position:absolute;
    top:760px;
    left:970px;
}
#sherman-dash5 {
    background: url(../images/sherman/sherman-dash5.png) no-repeat;
    background-size: cover;
    width:7px;
    height:82px;
    position:absolute;
    top:770px;
    left:1285px;
}
#sherman-dash6 {
    background: url(../images/sherman/sherman-dash6.png) no-repeat;
    background-size: cover;
    width:533px;
    height:7px;
    position:absolute;
    top:860px;
    left:1300px;
}
#sherman-dash7 {
    background: url(../images/sherman/sherman-dash7.png) center bottom no-repeat;
    background-size: cover;
    width:7px;
    height:82px;
    position:absolute;
    top:770px;
    left:1840px;
}
#sherman-dash8 {
    background: url(../images/sherman/sherman-dash8.png) no-repeat;
    background-size: cover;
    width:308px;
    height:7px;
    position:absolute;
    top:760px;
    left:1860px;
}
#sherman-dash9 {
    background: url(../images/sherman/sherman-dash9.png) no-repeat;
    background-size: cover;
    width:7px;
    height:210px;
    position:absolute;
    top:770px;
    left:2170px;
}
#sherman-dash-arrow-down {
    background: url(../images/sherman/sherman-dash-arrow-down.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:200px;
    left:251px;
}
#sherman-dash-arrow-up1 {
    background: url(../images/sherman/sherman-dash-arrow-up.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:740px;
    left:935px;
}
#sherman-dash-arrow-up2 {
    background: url(../images/sherman/sherman-dash-arrow-up.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:740px;
    left:1822px;
}

/*#####*/
#character-sherman-shermanpose {
    width: 15.22%; /*417/2740*/
    height: 100%; /*1037/1000*/
    background: url(../images/sherman/shermanpose.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:0px; /*170/2740*/
    top:0px;
}

/*#####*/
#character-sherman-datesstamp {
    width: 12.3%; /*337/2740*/
    height: 100%; /*148/1000*/
    background: url(../images/sherman/datesstamp.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:0px; /*70/2740*/
    top:70%; /*700/1000*/
}

/*#####*/
#character-sherman-helmettext-container {
    width: 10.8%; /*297/2740*/
    height: 13.6%; /*136/1000*/
    position:absolute;
    left:2.18%; /*60/2740*/
    top:28%; /*280/1000*/
}
#character-sherman-helmettext {
    width: 100%;
    height: 100%;
    background: url(../images/sherman/helmettext.png) no-repeat;
    background-size:contain;
}

/*#####*/
#character-sherman-shermantext-container {
    width: 27%; /*742/2740*/
    height: 41.5%; /*415/1000*/
    position:absolute;
    left:570px;
    top:29%; /*250/1000*/
}
#character-sherman-shermantext {
    width: 100%;
    height: 100%;
    background: url(../images/sherman/shermantext.png) no-repeat;
    background-size:contain;
}

/*#####*/
#character-sherman-trojantext-container {
    width: 14.41%; /*395/2740*/
    height: 30%; /*300/1000*/
    position:absolute;
    left:870px;
    top:47%; /*440/1000*/
}
#character-sherman-trojantext {
    width: 100%;
    height: 100%;
    background: url(../images/sherman/trojantext.png) no-repeat;
    background-size:contain;
}

/*#####*/
#character-sherman-game0 {
    width: 13.0656%; /*358/2740*/
    height: 38.7%; /*387/1000*/
    background: url(../images/sherman/game0.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:1290px;
    top:7%;
}
#character-sherman-game3 {
    width: 13.0656%; /*358/2740*/
    height: 35%; /*350/1000*/
    background: url(../images/sherman/game3.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:1290px;
    top:44%;
}
#character-sherman-game4 {
    width: 9.416%; /*258/2740*/
    height: 44.8%; /*448/1000*/
    background: url(../images/sherman/game4.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:1650px;
    top:2%;
}
#character-sherman-game1 {
    width: 10.2554%; /*281/2740*/
    height: 45.3%; /*453/1000*/
    background: url(../images/sherman/game1.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:1650px;
    top:35%;
}
#character-sherman-game2 {
    width: 15.9854%; /*438/2740*/
    height: 60.9%; /*609/1000*/
    background: url(../images/sherman/game2.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:1935px;
    top:15%;
}


/* Character Peabody
################################################ */
#character-peabody-bg {
    width:2740px;
    height:1000px;
    background: url(../images/peabody/bg.jpg) left center no-repeat;
    background-size: contain;
}

#peabody-dash1 {
    background: url(../images/peabody/peabody-dash1.png) no-repeat;
    background-size: cover;
    width:7px;
    height:341px;
    position:absolute;
    top:10px;
    left:120px;
}
#peabody-dash1-1 {
    background: url(../images/peabody/peabody-dash1-1.png) no-repeat;
    background-size: cover;
    width:7px;
    height:373px;
    position:absolute;
    top:370px;
    left:120px;
}
#peabody-dash2 {
    background: url(../images/peabody/peabody-dash2.png) no-repeat;
    background-size: cover;
    width:750px;
    height:7px;
    position:absolute;
    top:760px;
    left:140px;
}
#peabody-dash3 {
    background: url(../images/peabody/peabody-dash3.png) center bottom no-repeat;
    background-size: cover;
    width:7px;
    height:130px;
    position:absolute;
    top:637px;
    left:890px;
}
#peabody-dash4 {
    background: url(../images/peabody/peabody-dash4.png) no-repeat;
    background-size: cover;
    width:146px;
    height:7px;
    position:absolute;
    top:627px;
    left:910px;
}
#peabody-dash5 {
    background: url(../images/peabody/peabody-dash5.png) no-repeat;
    background-size: cover;
    width:7px;
    height:244px;
    position:absolute;
    top:637px;
    left:1070px;
}
#peabody-dash6 {
    background: url(../images/peabody/peabody-dash6.png) no-repeat;
    background-size: cover;
    width:464px;
    height:7px;
    position:absolute;
    top:890px;
    left:1090px;
}
#peabody-dash7 {
    background: url(../images/peabody/peabody-dash7.png) center bottom no-repeat;
    background-size: cover;
    width:7px;
    height:53px;
    position:absolute;
    top:844px;
    left:1553px;
}
#peabody-dash8 {
    background: url(../images/peabody/peabody-dash8.png) no-repeat;
    background-size: cover;
    width:556px;
    height:7px;
    position:absolute;
    top:890px;
    left:1580px;
}
#peabody-dash9 {
    background: url(../images/peabody/peabody-dash9.png) center bottom no-repeat;
    background-size: cover;
    width:7px;
    height:73px;
    position:absolute;
    top:824px;
    left:2124px;
}
#peabody-dash10 {
    background: url(../images/peabody/peabody-dash10.png) no-repeat;
    background-size: cover;
    width:147px;
    height:7px;
    position:absolute;
    top:810px;
    left:2144px;
}
#peabody-dash11 {
    background: url(../images/peabody/peabody-dash11.png) center top no-repeat;
    background-size: cover;
    width:7px;
    height:185px;
    position:absolute;
    top:820px;
    left:2300px;
}
#peabody-dash-arrow-down {
    background: url(../images/dash-arrow-down.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:340px;
    left:103px;
}
#peabody-dash-arrow-up1 {
    background: url(../images/dash-arrow-up.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:607px;
    left:870px;
}
#peabody-dash-arrow-up2 {
    background: url(../images/dash-arrow-up.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:810px;
    left:1535px;
}
#peabody-dash-arrow-up3 {
    background: url(../images/dash-arrow-up.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:810px;
    left:2104px;
}

/*#####*/
#character-peabody-peabodypose {
    width: 15.1%; /*414/2740*/
    height: 100%; /*1106/1000*/
    background: url(../images/peabody/peabodypose.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:0px;
    top:0px;
}

/*#####*/
#character-peabody-datesstamp {
    width: 14.5%; /*398/2740*/
    height: 100%; /*147/1000*/
    background: url(../images/peabody/datestamp.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:0px; /*70/2740*/
    top:78%; /*700/1000*/
}

/*#####*/
#character-peabody-attiretext-container {
    width: 12.44%; /*341/2740*/
    height: 18.4%; /*184/1000*/
    position:absolute;
    left:2.18%; /*60/2740*/
    top:36%; /*360/1000*/
}
#character-peabody-attiretext {
    width: 100%;
    height: 100%;
    background: url(../images/peabody/attiretext.png) no-repeat;
    background-size:contain;
}

/*#####*/
#character-peabody-peabodytxt-container {
    width: 27%; /*742/2740*/
    height: 41.5%; /*415/1000*/
    position:absolute;
    left:570px;
    top:23%; /*230/1000*/
}
#character-peabody-peabodytxt {
    width: 100%;
    height: 100%;
    background: url(../images/peabody/peabodytxt.png) no-repeat;
    background-size:contain;
}

/*#####*/
#character-peabody-appbutton-container {
    width: 21.2%; /*581/2740*/
    height: 72.6%; /*726/1000*/    
    position:absolute;
    left:1320px;
    top:10%; /*100/1000*/
}
#character-peabody-appbutton {
    width: 90%;
    height: 90%;
    background: url(../images/peabody/appbutton.png) no-repeat;
    background-size:contain;
    pointer-events: none;
}

/*#####*/
#character-peabody-appbutton2-container {
    width: 21.46%; /*588/2740*/
    height: 73.3%; /*733/1000*/    
    position:absolute;
    left:1880px;
    top:0%; /*80/1000*/
}
#character-peabody-appbutton2 {
    width: 90%;
    height: 90%;
    background: url(../images/peabody/appbutton2.png) no-repeat;
    background-size:contain;
    pointer-events: none;
}

/*#####*/
ul.peabody-appbutton-wrapper {
    width: 70%;
    height: 8%;
    position: absolute;
    bottom: 5%;
    left: 7%;        
    margin: 0px;
    padding: 0px;
    text-align: center;
    /*background:#000;*/
}
li.appbutton-itunes,
li.appbutton-android {
    width: 45%;
    height: 100%;
    display: inline-block;
    zoom: 1;
    margin: 0px;
    padding: 0px;
    list-style: none;
    padding: 0px;
    vertical-align: top;
}
.appbutton-itunes {
    background: url(../images/peabody/itunesTHMB.png) center no-repeat;
    background-size: contain;
}
.appbutton-android {
    background: url(../images/peabody/androidTHMB.png) center no-repeat;
    background-size: contain;
}


/* Character Penny
################################################ */
#character-penny-bg {
    width:2740px;
    height:1000px;
    background: url(../images/penny/bg.jpg) left center no-repeat;
    background-size: contain;
}

#penny-dash1 {
    background: url(../images/penny/penny-dash1.png) no-repeat;
    background-size: cover;
    width:7px;
    height:309px;
    position:absolute;
    top:0px;
    left:660px;
}
#penny-dash2 {
    background: url(../images/penny/penny-dash2.png) no-repeat;
    background-size: cover;
    width:7px;
    height:270px;
    position:absolute;
    top:320px;
    left:660px;
}
#penny-dash3 {
    background: url(../images/penny/penny-dash3.png) no-repeat;
    background-size: cover;
    width:329px;
    height:7px;
    position:absolute;
    top:580px;
    left:670px;
}
#penny-dash4 {
    background: url(../images/penny/penny-dash4.png) center bottom no-repeat;
    background-size: cover;
    width:7px;
    height:64px;
    position:absolute;
    top:524px;
    left:999px;
}
#penny-dash5 {
    background: url(../images/penny/penny-dash5.png) no-repeat;
    background-size: cover;
    width:146px;
    height:7px;
    position:absolute;
    top:514px;
    left:1015px;
}
#penny-dash6 {
    background: url(../images/penny/penny-dash6.png) no-repeat;
    background-size: cover;
    width:7px;
    height:248px;
    position:absolute;
    top:544px;
    left:1170px;
}
#penny-dash7 {
    background: url(../images/penny/penny-dash7.png) no-repeat;
    background-size: cover;
    width:819px;
    height:7px;
    position:absolute;
    top:800px;
    left:1190px;
}
#penny-dash8 {
    background: url(../images/penny/penny-dash8.png) center bottom no-repeat;
    background-size: cover;
    width:7px;
    height:80px;
    position:absolute;
    top:727px;
    left:2009px;
}

#penny-dash-arrow-down {
    background: url(../images/dash-arrow-down.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:280px;
    left:643px;
}
#penny-dash-arrow-up1 {
    background: url(../images/dash-arrow-up.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:500px;
    left:980px;
}
#penny-dash-arrow-up2 {
    background: url(../images/dash-arrow-up.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:690px;
    left:1990px;
}

#penny-dash9 {
    background: url(../images/penny/penny-dash9.png) no-repeat;
    background-size: cover;
    width:114px;
    height:7px;
    position:absolute;
    top:717px;
    left:2019px;
}
#penny-dash10 {
    background: url(../images/penny/penny-dash10.png) center top no-repeat;
    background-size: cover;
    width:7px;
    height:147px;
    position:absolute;
    top:747px;
    left:2143px;
}

/*#####*/
#character-penny-pennypose {
    width: 20.36%; /*558/2740*/
    height: 100%; /*1106/1000*/
    background: url(../images/penny/pennypose.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:250px;
    top:0px;
}

/*#####*/
#character-penny-datesstamp {
    width: 11.53%; /*316/2740*/
    height: 100%; /*142/1000*/
    background: url(../images/penny/datestamp.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:540px; /*540/2740*/
    top:61%; /*560/1000*/
}

/*#####*/
#character-penny-headtxt-container {
    width: 15.4%; /*422/2740*/
    height: 18.5%; /*185/1000*/
    position:absolute;
    left:22.5%; /*560/2740*/
    top:30%; /*300/1000*/
}
#character-penny-headtxt {
    width: 100%;
    height: 100%;
    background: url(../images/penny/headtxt.png) no-repeat;
    background-size:contain;
}

/*#####*/
#character-penny-pennytext-container {
    width: 26.93%; /*738/2740*/
    height: 32.4%; /*324/1000*/
    position:absolute;
    left:730px;
    top:15%; /*150/1000*/
}
#character-penny-pennytext {
    width: 100%;
    height: 100%;
    background: url(../images/penny/pennytext.png) no-repeat;
    background-size:contain;
}

/*#####*/
#character-penny-pennygame-container {
    width: 23.72%; /*650/2740*/
    height: 59.7%; /*597/1000*/    
    position:absolute;
    left:1730px;
    top:5%; /*50/1000*/
}
#character-penny-pennygame {
    width: 100%;
    height: 100%;
    background: url(../images/penny/pennygame.png) no-repeat;
    background-size:contain;
}

/*#####*/
#character-penny-download-container {
    width: 39.23%; /*1075/2740*/
    /*height: 53.4%;*/ /*534/1000*/
	height: 61.2%; /* 612/1000 */
    position:absolute;
    left:1460px;
    top:8%; /*150/1000*/
}
#character-penny-download-title {
	width:39.5348%; /* 425/1075 */
	height:17.1568%; /* 105/612 */
	position:absolute;
	top:0px;
	right:2%;
}
#character-penny-download-title.nav1 {
    background: url(../images/penny/nav/nav1title.png) no-repeat;
    background-size:contain;
}
#character-penny-download-title.nav2 {
    background: url(../images/penny/nav/nav2title.png) no-repeat;
    background-size:contain;
}
#character-penny-download-title.nav3 {
    background: url(../images/penny/nav/nav3title.png) no-repeat;
    background-size:contain;
}
#character-penny-download-nav-container {
	width:100%;
	height:12.745%; /* 78/612 */
	/*background:#000;*/
	position:absolute;
	bottom:0px;
}
#character-penny-download-nav1 {
	width: 30%;
	height:100%;
	background: url(../images/penny/nav/nav1off.png) no-repeat;
    background-size:contain;
	position:absolute;
	left:5%;
}
#character-penny-download-nav1.btn-over {
	background: url(../images/penny/nav/nav1on.png) no-repeat;
    background-size:contain;
}
#character-penny-download-nav1.active {
	background: url(../images/penny/nav/nav1selected.png) no-repeat;
    background-size:contain;
}
#character-penny-download-nav2 {
	width: 30%;
	height:90%;
	background: url(../images/penny/nav/nav2off.png) no-repeat;
    background-size:contain;
	position:absolute;
	left:39%;
}
#character-penny-download-nav2.btn-over {
	background: url(../images/penny/nav/nav2on.png) no-repeat;
    background-size:contain;
}
#character-penny-download-nav2.active {
	background: url(../images/penny/nav/nav2selected.png) no-repeat;
    background-size:contain;
}
#character-penny-download-nav3 {
	width: 30%;
	height:90%;
	background: url(../images/penny/nav/nav3off.png) no-repeat;
    background-size:contain;
	position:absolute;
	left:68%;
}
#character-penny-download-nav3.btn-over {
	background: url(../images/penny/nav/nav3on.png) no-repeat;
    background-size:contain;
}
#character-penny-download-nav3.active {
	background: url(../images/penny/nav/nav3selected.png) no-repeat;
    background-size:contain;
}
#character-penny-download {
    width: 100%;
    height: 87.254%; /*534/612*/
    background: url(../images/penny/nav/dlframe.png) no-repeat;
    background-size:contain;
}
#character-penny-download-slide-container {
    width:94%;
    height:64%;
    position:absolute;
    top:19%; /*90/1000*/
    left:3%;
}
.character-penny-download-item-title {
    width:31.4%;
    height:10%;
    /*background: url(../images/penny/downloads/Bookmarks.png) no-repeat;*/
    background-repeat: no-repeat;
    background-size:contain;
    position:absolute;
    left:1%;
    top:6.5%; /*180/534*/
}
#character-penny-download-item-title-1 {
    left:1%;
}
#character-penny-download-item-title-2 {
    left:34%;
}
#character-penny-download-item-title-3 {
    left:67%;
}

.character-penny-download-item-frame {
    width:31.4%; /*312/934*/
    height:85%; /*275/316*/
    background: url(../images/penny/dlbutton.png) no-repeat;
    background-size:contain;
    position:absolute;
    top:15%; /*90/1000*/
    left:1%;
    overflow:hidden;
}
.character-penny-download-item-frame.btn-over {
    background: url(../images/penny/dlbuttonOver.png) no-repeat;
    background-size:contain;
}
#character-penny-download-item-frame-1 {
    left:1%;
}
#character-penny-download-item-frame-2 {
    left:34%;
}
#character-penny-download-item-frame-3 {
    left:67%;
}
.character-penny-download-item-bg,
.character-penny-download-item-bg-next {
    width:97.7%; /*105/934*/
    height:97%; /*164/316*/
    /*background: url(../images/penny/downloads/Calendar.jpg) no-repeat;*/
    background-repeat: no-repeat;
    background-size:contain;
    position:absolute;
    top:1.2%;
    left:1.2%;
}
.character-penny-download-item-overlay-container {
    width:100%;
    height:82.5%;
    position:absolute;
    background: url(../images/splashintro/blackcover.png);
    color:#fff;
    text-align:center;
    display:none;
}
.character-penny-download-item-overlay-wallpaper {
    padding-top:5%;
    line-height:140%;
}
.character-penny-download-item-overlay-wallpaper-title {
    color:#ff0000;
    font-weight:bold; 
}
.character-penny-download-item-overlay-wallpaper-item:hover {
    color:#ff0000;
}

#character-penny-download-prev-btn {
    width:11.24%; /*105/934*/
    height:51.89%; /*164/316*/
    background: url(../images/penny/arrow.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:-11%;
    top:25%; /*180/534*/
}
#character-penny-download-prev-btn.btn-over {
    background: url(../images/penny/arrowOver.png) no-repeat;
    background-size:contain;
}
#character-penny-download-next-btn {
    width:11.24%; /*105/934*/
    height:51.89%; /*164/316*/
    background: url(../images/penny/arrow-right.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:100%;
    top:25%; /*180/534*/
}
#character-penny-download-next-btn.btn-over {
    background: url(../images/penny/arrowOver-right.png) no-repeat;
    background-size:contain;
}

/* Section Takeaways
################################################ */
#section-takeaways-bg {
    background: url(../images/takeaways/bg.jpg) center no-repeat;
    background-size: contain;
}

#section-takeaways-pose {
    width: 45.56%; /*729/1600*/
    height: 89.1%; /*891/1000*/
    background: url(../images/takeaways/pose.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:780px;
    top:11%;    
}

#section-takeaways-slide-container {
    width: 42%; /*672/1600*/
    height: 56.1%; /*561/1000*/
    background: url(../images/takeaways/container.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:140px;
    top:18%;
}

#section-takeaways-slide-frame {
    width: 75.89%; /*510/672*/
    height: 50.5%; /*280/561*/
    position:absolute;
    left:137px;
    top:23%;
}
#section-takeaways-slide-frame img{
    width:100%;
    height:100%;
}
#section-takeaways-slide-frame-overlay,
#section-takeaways-slide-frame-gif {
    width:100%;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
}
#section-takeaways-slide-frame-overlay {
    /*background: url(../images/takeaways/facebookcopy.png) center no-repeat;*/
    background-position:center;
    background-size: contain;
}

#section-takeaways-slide-prev-btn {
    width: 41.07%; /*276/672*/
    height: 12.65%; /*71/561*/
    background: url(../images/takeaways/prev.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:115px;
    top:75%;
}
#section-takeaways-slide-prev-btn.btn-over {
    background: url(../images/takeaways/prevOver.png) no-repeat;
    background-size:contain;
}
#section-takeaways-slide-next-btn {
    width: 41.07%; /*276/672*/
    height: 12.65%; /*71/561*/
    background: url(../images/takeaways/next.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:396px;
    top:75%;
}
#section-takeaways-slide-next-btn.btn-over {
    background: url(../images/takeaways/nextOver.png) no-repeat;
    background-size:contain;
}

#section-takeaways-slide-twitter-btn {
    width: 6.99%; /*47/672*/
    height: 7.66%; /*43/561*/
    /*background: url(../images/takeaways/twitterOver.png) no-repeat;*/
    background-size:contain;
    position:absolute;
    left:502px;
    top:86.7%;
}
#section-takeaways-slide-twitter-btn.btn-over {
    background: url(../images/takeaways/twitterOver.png) no-repeat;
    background-size:contain;
}

#section-takeaways-slide-fb-btn {
    width: 6.99%; /*45/672*/
    height: 7.66%; /*45/561*/
    /*background: url(../images/takeaways/facebookOver.png) no-repeat;*/
    background-size:contain;
    position:absolute;
    left:540px;
    top:86.6%;
}
#section-takeaways-slide-fb-btn.btn-over {
    background: url(../images/takeaways/facebookOver.png) no-repeat;
    background-size:contain;
}

#section-takeaways-slide-tumblr-btn {
    width: 6.845%; /*46/672*/
    height: 7.66%; /*45/561*/
    /*background: url(../images/takeaways/tumblrOver.png) no-repeat;*/
    background-size:contain;
    position:absolute;
    left:576px;
    top:86.7%;
}
#section-takeaways-slide-tumblr-btn.btn-over {
    background: url(../images/takeaways/tumblrOver.png) no-repeat;
    background-size:contain;
}

#section-takeaways-slide-iframe-btn {
    width: 6.54%; /*44/672*/
    height: 7.84%; /*44/561*/
    /*background: url(../images/takeaways/iframeOver.png) no-repeat;*/
    background-size:contain;
    position:absolute;
    left:612px;
    top:86.7%;
}
#section-takeaways-slide-iframe-btn.btn-over {
    background: url(../images/takeaways/iframeOver.png) no-repeat;
    background-size:contain;
}

#takeaways-dash1 {
    background: url(../images/takeaways/takeaways-dash1.png) no-repeat;
    background-size: cover;
    width:7px;
    height:436px;
    position:absolute;
    top:0px;
    left:100px;
}
#takeaways-dash2 {
    background: url(../images/takeaways/takeaways-dash2.png) no-repeat;
    background-size: cover;
    width:84px;
    height:7px;
    position:absolute;
    top:446px;
    left:120px;
}
#takeaways-dash-arrow-right {
    background: url(../images/dash-arrow-right.png) no-repeat;
    background-size: cover;
    width:38px;
    height:43px;
    position:absolute;
    top:426px;
    left:204px;
}
#takeaways-dash3 {
    background: url(../images/takeaways/takeaways-dash3.png) no-repeat;
    background-size: cover;
    width:7px;
    height:437px;
    position:absolute;
    top:456px;
    left:220px;
}
#takeaways-dash4 {
    background: url(../images/takeaways/takeaways-dash4.png) no-repeat;
    background-size: cover;
    width:533px;
    height:7px;
    position:absolute;
    top:900px;
    left:240px;
}
#takeaways-dash5 {
    background: url(../images/takeaways/takeaways-dash5.png) center bottom no-repeat;
    background-size: cover;
    width:7px;
    height:82px;
    position:absolute;
    top:810px;
    left:793px;
}
#takeaways-dash-arrow-up {
    background: url(../images/dash-arrow-up.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:800px;
    left:773px;
}
#takeaways-dash6 {
    background: url(../images/takeaways/takeaways-dash6.png) no-repeat;
    background-size: cover;
    width:469px;
    height:7px;
    position:absolute;
    top:810px;
    left:813px;
}
#takeaways-dash7 {
    background: url(../images/takeaways/takeaways-dash7.png) no-repeat;
    background-size: cover;
    width:7px;
    height:146px;
    position:absolute;
    top:820px;
    left:1292px;
}


/* Section Ourtravels
################################################ */
#section-ourtravels-overlay {
    width:100%;
    height:100%;
    background: url(../images/ourtravels/bg.jpg) center no-repeat;
    background-size: cover;
    position:absolute;
    top:0px;
    left:0px;
}
.section-ourtravels-overlay {
    width:100%;
    height:50%;
    position:absolute;    
}
#section-ourtravels-overlay-top {
    top:0px;
    background: url(../images/ourtravels/bg.jpg) center top no-repeat;
    background-size: cover;
}
#section-ourtravels-overlay-bottom {
    top:0px;
    background: url(../images/ourtravels/bg.jpg) center bottom no-repeat;
    background-size: cover;
}
#section-ourtravels-bg {
    /*
    background: url(../images/ourtravels/bg.jpg) center no-repeat;
    background-size: contain;
    */
}

#section-ourtravels-shermanpose {
    width: 35.62%; /*570/1600*/
    height: 100%; /*1000/1000*/
    background: url(../images/ourtravels/shermanpose.png) center no-repeat;
    background-size:cover;
    position:absolute;
    left:0px;
    top:0%;
}

#section-ourtravels-peabodypose {
    width: 29%; /*464/1600*/
    height: 100%; /*1000/1000*/
    background: url(../images/ourtravels/peabodypose.png) center no-repeat;
    background-size:cover;
    position:absolute;
    left:1150px;
    top:0%;
}

#section-ourtravels-slide-container {
    width: 58.56%; /*937/1600*/
    height: 58.4%; /*584/1000*/
    background: url(../images/ourtravels/container.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:350px;
    top:13%;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

#section-ourtravels-slide-frame {
    width: 42.6%; /*395/937*/
    height: 67.8%; /*395/584*/
    position:absolute;
    left:269px;
    top:21.7%;
}
#section-ourtravels-slide-frame img{
    width:100%;
    height:100%;
}

#section-ourtravels-slide-prev-btn {
    width: 29.45%; /*276/937*/
    height: 12.15%; /*71/584*/
    background: url(../images/ourtravels/prev.png) no-repeat;
    background-size:cover;
    position:absolute;
    left:0px;
    top:82%;
}
#section-ourtravels-slide-prev-btn.btn-over {
    background: url(../images/ourtravels/prevOver.png) no-repeat;
    background-size:cover;
}
#section-ourtravels-slide-next-btn {
    width: 29.45%; /*276/937*/
    height: 12.15%; /*71/584*/
    background: url(../images/ourtravels/next.png) no-repeat;
    background-size:cover;
    position:absolute;
    left:660px;
    top:82%;
}
#section-ourtravels-slide-next-btn.btn-over {
    background: url(../images/ourtravels/nextOver.png) no-repeat;
    background-size:cover;
}

#section-ourtravels-wabac {
    width: 23.26%; /*218/937*/
    height: 3.59%; /*21/584*/
    /*background: url(../images/ourtravels/wabacwednesdayOver.png) no-repeat;*/
    background-size:cover;
    position:absolute;
    left:420px;
    top:94%;
}
#section-ourtravels-wabac.btn-over {
    background: url(../images/ourtravels/wabacwednesdayOver.png) no-repeat;
    background-size:cover;
}

#section-ourtravels-text {
    width: 42.79%; /*401/937*/
    height: 21%; /*123/584*/
    position:absolute;
    left:265px;
    top:100%;
}
#section-ourtravels-text img {
    width:100%;
    height:100%;
}


/* Section Partners
################################################ */
#section-partners-bg {
    background: url(../images/partners/bg.jpg) center no-repeat;
    background-size: contain;
}
#section-partners-item-container {
    width:55.75%; /* 892/1600 */
    height:66.6%; /* 666/1000 */
    /*background:#000;*/
    position:absolute;
    left:380px;
    top:22%;
}

.section-partners-item-frame {
    width:25%; /* 223/892 */
    height:33.3333%; /* 222/666 */
}
.section-partners-item {
    width:80.5%; /*177/223*/
    height:80.5%; /*177/222*/
    position:absolute;
    top:10%;
    left:9.8%;
}
.section-partners-item-overlay {
    width:100%;
    height:100%;
    background: url(../images/partners/logoframe.png) center no-repeat;
    background-size: contain;
    position:absolute;
    top:0%;
    left:0%;
}
#section-partners-logo1 {
    position:absolute;
    top:0%;
    left:0%;
}
#section-partners-logo1 .section-partners-item {
    background: url(../images/partners/logos/logo1.jpg) center no-repeat;
    background-size: contain;
}

#section-partners-logo2 {
    position:absolute;
    top:0%;
    left:23%;
}
#section-partners-logo2 .section-partners-item {
    background: url(../images/partners/logos/logo2.jpg) center no-repeat;
    background-size: contain;
}

#section-partners-logo3 {
    position:absolute;
    top:0%;
    left:46%;
}
#section-partners-logo3 .section-partners-item {
    background: url(../images/partners/logos/logo3.jpg) center no-repeat;
    background-size: contain;
}

#section-partners-logo4 {
    position:absolute;
    top:0%;
    left:69%;
}
#section-partners-logo4 .section-partners-item {
    background: url(../images/partners/logos/logo4.jpg) center no-repeat;
    background-size: contain;
}

#section-partners-logo5 {
    position:absolute;
    top:30%;
    left:12%;
}
#section-partners-logo5 .section-partners-item {
    background: url(../images/partners/logos/logo5.jpg) center no-repeat;
    background-size: contain;
}

#section-partners-logo6 {
    position:absolute;
    top:30%;
    left:35%;
}
#section-partners-logo6 .section-partners-item {
    background: url(../images/partners/logos/logo6.jpg) center no-repeat;
    background-size: contain;
}

#section-partners-logo7 {
    position:absolute;
    top:30%;
    left:58%;
}
#section-partners-logo7 .section-partners-item {
    background: url(../images/partners/logos/logo7.jpg) center no-repeat;
    background-size: contain;
}

#section-partners-logo8 {
    position:absolute;
    top:60%;
    left:23.5%;
}
#section-partners-logo8 .section-partners-item {
    background: url(../images/partners/logos/logo8.jpg) center no-repeat;
    background-size: contain;
}

#section-partners-logo9 {
    position:absolute;
    top:60%;
    left:47%;
}
#section-partners-logo9 .section-partners-item {
    background: url(../images/partners/logos/logo9.jpg) center no-repeat;
    background-size: contain;
}

/*#####*/
#partners-dash1 {
    background: url(../images/partners/partners-dash1.png) no-repeat;
    background-size:cover;
    width:7px;
    height:500px;
    position:absolute;
    top:0px;
    left:1292px;
}
#partners-dash2 {
    background: url(../images/partners/partners-dash2.png) right center no-repeat;
    background-size:cover;
    width:49px;
    height:7px;
    position:absolute;
    top:510px;
    left:1233px;
}
#partners-dash-arrow-left {
    background: url(../images/dash-arrow-left.png) no-repeat;
    background-size: cover;
    width:38px;
    height:43px;
    position:absolute;
    top:490px;
    left:1180px;
}

/*#####*/
#partners-overlay-container {
    width:100%;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
    z-index:99999;
    display:none;
}
#partners-overlay-container {
    z-index:99998;
}
#partners-overlay-bg {
    width:100%;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
    background: url(../images/splashintro/blackcover.png) repeat;
}
#partners-overlay-content-wrapper {
    width:66.375%; /* 1062/1600 */
    height:57.1%; /* 571/1000 */
    position:absolute;
    top:20%;
    left: 300px;    
}
#partners-overlay-close-btn {
    width:5.0847%; /* 54/1062 */
    height:9.457%; /* 54/571 */
    position:absolute;
    top:-4%;
    right:-2.5%;
    background: url(../images/partners/close.png) center no-repeat;
    background-size: contain;
}
#partners-overlay-close-btn.btn-over {
    background: url(../images/partners/closeOVER.png) center no-repeat;
    background-size: contain;
}
#partners-overlay-content-bg {
    width:99.2467%; /* 1054/1062 */
    height:98.774%; /* 564/571 */
    position:absolute;
    top:0.5%;
    left:0.4%;
    /*background: url(../images/partners/content/content1.jpg) center no-repeat;*/
    background-position:center;
    background-repeat: no-repeat;
    background-size: contain;
}
#partners-overlay-content-frame {
    width:100%;
    height:100%;
    position:absolute;
    top:0%;
    left:0%;
    background: url(../images/partners/contentframe.png) no-repeat;
    background-size:contain;
}
#partners-overlay-content-pic {
    width:16.6666%; /* 177/1062 */
    height:30.9982%; /* 177/571 */
    position:absolute;
    top:4.5%;
    left:2.4%;
    /*background: url(../images/partners/logos/logo1.jpg) center no-repeat;*/
    background-position:center;
    background-repeat: no-repeat;
    background-size: contain;
}
#partners-overlay-content-link {
    width:17.2316%; /* 183/1062 */
    height:5.2539%; /* 30/571 */
    position:absolute;
    top:38.5%;
    left:2.4%;
    background: url(../images/partners/visitsite.png) center no-repeat;
    background-size: contain;
}
#partners-overlay-content-link.btn-over {
    background: url(../images/partners/visitsiteOVER.png) center no-repeat;
    background-size: contain;
}

/* Section Shop
################################################ */
#section-shop-bg {
    background: url(../images/shop/bg.jpg) center no-repeat;
    background-size: contain;
}

/*#####*/
#section-shop-copyblock {
    width: 41.0625%; /*657/1600*/
    height: 85.5%; /*855/1000*/
    background: url(../images/shop/copyblock.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:3%;
    top:0px;
}

#section-shop-copyblock-button {
    width: 77.1689%; /*507/657*/
    height: 14.15204%; /*121/855*/
    background: url(../images/shop/button.png) center no-repeat;
    background-size:contain;
    position:absolute;
    /*left:62px;*/
    left:10%;
    top:85.8%; /*679/1000*/
}
#section-shop-copyblock-button.btn-over {
    background: url(../images/shop/buttonover.png) center no-repeat;
    background-size: contain;
}

/*#####*/
#section-shop-peabodypose {
    width: 30.3125%; /*485/1600*/
    height: 98.5%; /*985/1000*/
    background: url(../images/shop/peabodypose.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:45%;
    top:0px;
}

/*#####*/
#section-shop-shoptxt {
    width: 16.25%; /*260/1600*/
    height: 12.4%; /*124/1000*/
    background: url(../images/shop/shoptxt.png) no-repeat;
    background-size:contain;
    position:absolute;
    left:1100px;
    top:63%;
}

/*#####*/
#shop-dash1 {
    background: url(../images/shop/shop-dash1.png) no-repeat;
    background-size:cover;
    width:7px;
    height:621px;
    position:absolute;
    top:0px;
    left:1234px;
}

#shop-dash-arrow-down {
    background: url(../images/dash-arrow-down.png) no-repeat;
    background-size: cover;
    width:43px;
    height:38px;
    position:absolute;
    top:600px;
    left:1217px;
}



/* Overlay
################################################ */
#overlay-container,
#overlay-loading-container {
    width:100%;
    height:100%;
    position:fixed;
    top:0px;
    left:0px;
    z-index:99999;
    display:none;
}
#overlay-container {
    z-index:99998;
}
#overlay-bg,
#overlay-loading-bg {
    width:100%;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
    background-color:#000;
    opacity:0.5;
    filter:alpha(opacity=50);
}
#overlay-loading-content {
    width:100%;
    height:100%;
    position:absolute;
    top:0px;
    left:0px;
    color: #fff;
    font-size:1.5em;
}
#overlay-content-wrapper {
    width:80%;
    /*height:100%;*/
    margin: 0 auto;
}
#overlay-content {
    width:100%;
    height:auto;
    position:relative;
    /*
    top:50%;
    margin-top:200px;
    */
}
#overlay-content-html {
    /*padding:5px 10px 10px 10px;*/
    /*background: #fff;*/
    color:#fff;
}
#overlay-close-btn {    
    position:relative;
    top:0px;
    right:0px;
    text-align:right;
    color: #fff;
}

.overlay-page {
    display:none;
}



/* z-index Value
################################################ */

#debug-scrollpos,
#preloading-container{
    z-index:10000;
}
#legal-container {
    z-index:9901;
}
#splash-container {
    z-index:9900;
}
#intro-container {
    z-index:9800;
}
#top-control-sound,
#top-control,
#bottom-control {
    z-index:9799;
}
#main-to-videos-videoBG,
#main-to-sherman-videoBG,
#sherman-to-peabody-videoBG,
#peabody-to-penny-videoBG,
#penny-to-takeaways-videoBG {
    z-index:9798;
}

.clickable {
    z-index:1001
}
.canvas-overlay,
.canvas-overlay-video {
    z-index:1000;
}

.section {
    z-index:1;
}

/* Media Query
############################################ */
@media (min-width: 1600px){
    /*
    #splash-wrapper {
        position:absolute;
        left:50%;
        margin-left:-800px;
    } 
    */  
}
@media (max-width: 1175px){
    /*
    #splash-enter-site-btn {
        width: 25%;
        height: 8%;
        bottom:15%;
        right:2%;
    }
    */
    #splash-logo {
        width: 25%;
        height: 22%;
        bottom:10%;
        left:2%;
    }
}
@media (max-width: 960px){
    /*
    #splash-enter-site-btn {        
        right: 20px;
    }
    */
    #splash-logo {
        left:20px;
    }
}
@media (max-width: 840px){
    /*
    #splash-enter-site-btn {
        width: 23%;
        height: 8%;
        bottom:18%;
        right: 0px;
    }
    */
    #splash-logo {
        width: 23%;
        height: 22%;        
        bottom:10%;
        left:0px;
    }
}
/*
@media (max-width: 700px){
    #splash-enter-site-btn {
        width: 23%;
        height: 8%;
        bottom:80px;
        right: 0px;
    }
    #splash-logo {
        width: 23%;
        height: 22%;        
        bottom:0px;
        left:0px;
    }
}
*/