/* Add here all your CSS customizations */


.ohnoah-logo {max-width:100px;}

#header .logo2 { float:left;margin-right:20px;}


#header .logo2 img {
	position: relative;
	color: transparent;
	max-width:90px;
	margin-top:10px;
	
}

.pbskids-logo {max-width:27px!important;margin-left:8px;}

.header-container {
	position: relative;

}
p {
	color: #ffffcc;
	line-height: 24px;
	margin: 0 0 20px;
}


#header .header-top i {
	margin-right: 6px;
	margin-left: 6px;
	position: relative;
	top: 1px;
}

.nav2 .nav>li>a {
position: relative;
display: block;
padding: 0;
}

.nav2 img {}

.nav2 ul {padding:0;}

.nav>li>a:hover, .nav>li>a:hover {background-color:transparent;}

.flexslider {
margin: 0 0 60px;
background: transparent!important; 
 border:none!important; 
position: relative; 
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow:none;
-moz-box-shadow:none;
-o-box-shadow:none;
box-shadow:none;
zoom: 1;
max-width:560px;
}

.rev-slide-bg {
	background:url(../imgs/slides/main_bg_ep14.jpg) no-repeat top center;

	width:100%;
}


.rev-slide-bg2 {
	background:url(../imgs/slides/main_bg_ep14-2.jpg) no-repeat top center;
	background-size:cover;
	width:100%;
	height:495px;
	position:relative;
	
}

.background-container {
	background:url(../imgs/slides/main_bg_ep14-2.jpg) no-repeat top center;
	background-size:cover;
	width:100%;
	height:495px;
	position:relative;
}


#noah {
position: relative;
/* margin-top: 110px; */
/* margin-bottom: 250px; */
/* margin-left: 400px; */
/* margin-right: -200px; */
z-index: 3;
/* float: left; */
left: -330px;
top: 120px;
}

#horse {
position: relative;
margin-top: -265px;
/* margin-bottom: 455px; */
left: 550px;
/* margin-right: -750px; */
z-index: 3;
/* margin-right: -550px; */
}

#main-hay {
position: relative;
margin-top: -400px;
margin-left: -30px;
z-index: 4;
/* margin-right: -550px; */
float: left;
}

#trees {
position: relative;
margin-top: -1023px;
margin-left: -300px;
z-index: 1;
/* margin-right: -550px; */
}

/*.slider-wrapper {

margin-top: -859px;
margin-bottom: 859px;
margin-left: 259px;
margin-right: -259px;
margin-top: -602px;
 margin-bottom: 602px; 
margin-left: -508px;
/* margin-right: 258px; */
/* width: 434px; 
height: 365px;
width: 512px;
position: relative;
margin-top: -275px;
background: url(../imgs/slider-bg.png) no-repeat;

}*/

.slider-wrapper {

height: 365px;
width: 512px;
position: relative;
margin-top: -318px;
/* top: 0; */
margin-left: 40px;
background: url(../imgs/slider-bg.png) no-repeat;

}



#noah2 {
position: relative;
/* margin-top: 110px; */
/* margin-bottom: 250px; */
/* margin-left: 400px; */
/* margin-right: -200px; */
z-index: 3;
/* float: left; */
left: -360px;
top: 120px;
}

#horse2 {
position: relative;
margin-top: -265px;
/* margin-bottom: 455px; */
left: 500px;
/* margin-right: -750px; */
z-index: 3;
/* margin-right: -550px; */
}


#home-characters-left {
position: relative;
/* margin-top: 110px; */
/* margin-bottom: 250px; */
/* margin-left: 400px; */
/* margin-right: -200px; */
z-index: 3;
/* float: left; */
left: -320px;
top: 170px;
}


#home-characters-right {
position: relative;
margin-top: -215px;
/* margin-bottom: 455px; */
left: 340px;
/* margin-right: -750px; */
z-index: 3;
/* margin-right: -550px; */
}




.slider-wrapper2 {

height: 365px;
width: 512px;
position: relative;
margin-top: -318px;
/* top: 0; */
/* margin-left: 340px; */
background: url(../imgs/slider-bg.png) no-repeat;

}

.nivo-controlNav {display:none;}

.slider-pad {
		padding:73px 0 0 15px;
}

.slider-pad2 {
		padding:73px 0 0 10px;
}

footer {
    
	display:none;
    background-color: #649a00;
	padding:20px;

}

.fTab {

    bottom: 0;

    padding: 1em;
	width:100px;
	margin:0 auto;
	margin-top:20px;
    background-color: #649a00;
    

}

.fTab.active {
    bottom: 300px;
}

.fTab.active + footer {
    max-height: 300px;
	display:block;
	
}

.mobile-button {/*max-width:255px;*/float:none;margin:0 auto 10px;}

.games-bg .mobile-button {
	max-width:367px;	
	margin-bottom:27px;
}


.games-bg .mobile-button.first {
	max-width:367px;	
	margin-right:36px;
}


#footerSlideContainer {
	position: fixed;
	bottom:0;
	width: 100%;
}
#footerSlideButton {
	background: url(../imgs/sliderbutton.png) top center no-repeat transparent;
	position: absolute;
	top: -44px;
	right: 37%;
	width:91px;
	height:44px;
	border: none;
	cursor: pointer;
}
#footerSlideContent {
	width: 100%;
	height: 0px;
	background: #649a00;
	border: none;
}
#footerSlideText {
	padding: 15px 10px 25px 25px;
}


#footer-expand-button {
	background: url(../imgs/sliderbutton.png) top center no-repeat transparent;
	position: relative;
	width:259px;
	height:79px;
	border: none;
	cursor: pointer;
	margin: 20px auto 0;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;

}

#footer-expand {

position: relative;
width: 100%;
bottom: -20px;
bottom: 0;
padding-bottom: 0;
padding-top: 0;
margin-bottom: 0;
margin-top: 0;
padding: 0;

}

#footer-expand.active {
margin-top: -450px;
margin-top: -200px;
border-top: none;
}


#footer-expand-content {
	display:none;
}

#footer-expand-content.active {
display:block;
	width: auto;

	background: #0b6526;
	border: none;
	padding:10px 0;

}

html {
  height: 100%;
  width: 100%;

}
 
body {
  height: 100%;
  padding: 0;

  margin: 0;

}

#headband-grownups-block ul li.label {position:relative!important;}

.green {  background:#2a6132;}

.games-bg {
	background:url(../imgs/wide_bg_games.gif) no-repeat center center;
	background-size:cover;
	height:519px;

}

.characters-bg {
	background:url(../imgs/bg-characters.gif) no-repeat center center;
	background-size:cover;

}

.credits-bg {
    background-image: url('../imgs/bg-credit.png');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center bottom; 
background-color: #2e74ae;

}

.activities-bg {
    background-image: url('../imgs/bg-activities.png');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center bottom; 
background-color: #9BDECC;

}


body.sub-page {
	/*background:#97c03e;*/
}

#header.sub-page {
	/*background:#97c03e;
	background-image:none;*/
}

.games-cont {
	padding-top:43px;
}

.video-bg {
background:url(../imgs/wide_bg_video.gif) no-repeat center center;
background-size:cover;
margin-top: -35px;

}
.wrapper-credits {
height: inherit;
width: auto;
max-width:1400px;
position: relative;
margin-top: 20px;
top: 0;
margin-left: 0;
background: transparent;
}

.wrapper-activities{
height: inherit;
width: auto;
max-width:560px;
position: relative;
margin-top: 0px;
top: 0;
margin-left: 0;
background: transparent;
}


.slider-wrapper-characters {
height: inherit;
width: auto;
max-width:560px;
position: relative;
margin-top: 20px;
top: 0;
margin-left: 0;
background: transparent;
}

.char-description {
	width:100%;
	border:10px solid #fbce5b;
	border-radius:15px;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	background:#fffecb;
	color:#000;	
	padding:10px;
	margin-top:20px;
	text-align:left;
}

.char-description p {
		color:#000;	
		font-size:18px;
		line-height:normal;
}

.char-name {
	font-weight:bold;
	font-size: 36px;
line-height: normal;
	color:#478c7a;	
}

#now-playing-list .playlistItem {
	font-size:1.2em!important;
}


@media (min-width: 992px) {
.container {
width: 960px;
}

.games-bg {
	min-height:519px;
}
}

@media only screen 
and (min-width : 768px) 
and (max-width : 1024px) {
.container {
width: auto;
overflow:hidden;
padding:0;
}

#noah2 {
position: relative;
/* margin-top: 110px; */
/* margin-bottom: 250px; */
/* margin-left: 400px; */
/* margin-right: -200px; */
z-index: 3;
/* float: left; */
left: -360px;
top: 120px;
}

#horse2 {
position: relative;
margin-top: -265px;
/* margin-bottom: 455px; */
left: 500px;
/* margin-right: -750px; */
z-index: 3;
/* margin-right: -550px; */
}




.slider-wrapper2 {

height: 365px;
width: 512px;
position: relative;
margin-top: -318px;
/* top: 0; */
margin-left: 0;
background: url(../imgs/slider-bg.png) no-repeat;

}



}


/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {

/*#header  {padding:0;margin:0;}*/

#header > .container {height:60px;}

.container {
width: auto;
overflow:hidden;
}

#noah2 {
position: relative;
/* margin-top: 110px; */
/* margin-bottom: 250px; */
/* margin-left: 400px; */
/* margin-right: -200px; */
z-index: 3;
/* float: left; */
left: -360px;
top: 120px;
}

#horse2 {
position: relative;
margin-top: -265px;
/* margin-bottom: 455px; */
left: 500px;
/* margin-right: -750px; */
z-index: 3;
/* margin-right: -550px; */
}




.slider-wrapper2 {

height: 365px;
width: 512px;
position: relative;
margin-top: -318px;
/* top: 0; */
margin-left: 0;
background: url(../imgs/slider-bg.png) no-repeat;

}



}


@media (max-width: 767px) {



#header > .container {height:auto;}
#header {min-height:inherit; padding-bottom:0;}

  #slider-container {display: none !important;}
  
  #narrow-container {text-align: center; display: inline-block !important; padding-top:10px; background:#2a6132;}
  
    ul,li { list-style-type: none;
  list-style-position:inside;
  margin:0;
  padding:5px 0px 5px 0px;
 max-width:100%;
 height:auto;
  }


#header.home-page {
	padding:0;
}

.container.home-page {
	background:url(../imgs/pocket-home-top-2.png) no-repeat left center;
	text-align:left;	
	height:70px!important;
	padding:0;
	display:block;
}

}



@media (min-width: 481px) {
footer, .fTab {display:none;}

#footerSlideContainer {display:none;}

#footer-expand {display:none;}

}
@media (max-width: 720px) {
.mobile-button {width:80%;max-width:80%;float:none;margin:0 auto 10px;}

}

@media (max-width: 480px) {
	#header.sub-page{

padding-bottom: 10px;
}
	
	
.nav>li>a>img {
max-width: 50px;
margin-top:10px;
}

.nav>li>a>img.nav-2 {
margin-left:10px;
margin-right:-2px;
}


.footer-desktop {display:none;}

#player #controlrack button {
	width: 22%!important;
	height: 50px;
}

#player #controlrack button.play-pause.playing:before {
 content: ""!important; 
}
#player #controlrack button.play-pause:before {
content: ""!important;
}

#player #controlrack button.play-pause.playing:after {
margin: -4px 0 0 0!important;
}

}

@media (max-width: 389px) {
.nav>li>a>img {
max-width: 50px;
margin-top:10px;
}

.nav>li>a>img.nav-2 {
margin-left:0;
margin-right:-10px;
}

#header .logo2 {
float: left;
margin-right: 10px;
margin-left: -10px;
}
}


@media (max-width: 320px) {
	#player #controlrack button {
	width: 18%!important;
	height: 50px;
}

#player #controlrack button.previous:before {
border-right: 12px solid #FFF !important;
}

#player #controlrack button.next:after {
border-left: 12px solid #fff !important;
}
}


/* GAMES - MOBILE */

@media (min-width: 732px) and (max-width : 949px)  {
	
	.games-bg .mobile-button {
	max-width:325px;	
	margin-bottom:24px;
}


.games-bg .mobile-button.first {	
	margin-right:31px;
	max-width:325px;
}

.games-cont {
	padding-top:39px;
}
	
}

@media (min-width: 480px) and (max-width : 731px)  {
	
		.games-bg .mobile-button {
	max-width:390px;	
	margin-bottom:27px;
}


.games-bg .mobile-button.first {	
	margin-right:0;
	max-width:390px;
}

.games-cont {
	padding-top:22px;
}

.games-bg {
	height:auto;

}
}

@media (max-width: 479px) {
	
			.games-bg .mobile-button {
	max-width:309px;	
	width:98%;
	margin-bottom:27px;
}


.games-bg .mobile-button.first {	
	margin-right:0;
	max-width:309px;
	width:98%;
}

.games-cont {
	padding-top:22px;
}

.games-bg {
	height:auto;

}
	
}

/* END GAMES - MOBILE */


/* CHARACTERS - MOBILE */

.character-espanol {
	text-align:center;
	position:absolute;
	width:100%;
	bottom:-25px;
}

.character-espanol img {
	display:inline!important;
}



@media (min-width: 481px) {
	
	

	
	.char-description {
margin-top: -100px!important;
z-index: 999;
position: relative;
}

.flex-direction-nav .flex-next {
right: 0!important;
}
	.flex-direction-nav .flex-prev {
left: 0!important;
}
}

@media (min-width: 321px) and (max-width : 480px)  {
	
		.char-description {
margin-top: -160px!important;
z-index: 999;
position: relative;
}



	.flex-direction-nav a {

margin: -60px 0 0!important;
	}
	
}

@media (max-width : 320px)  {
	
		.char-description {
margin-top: -180px!important;
z-index: 999;
position: relative;
}
	
	.flex-direction-nav a {

margin: -70px 0 0!important;
	}
	
}



/* END CHARACTERS - MOBILE */