/*
 * CUSTOM FONTS ARE USED
 */
@import url("fonts.css");

/*
 * TOOLS
 */
.clear {clear: both;}
.white {color: #fff;}
.pur-color {color: #a066ab !important;}
.sal-color {color: #59a056 !important;}
.sky-color{color: #196bac !important;}
.pin-color {color: #ee4d9b !important;}
.ros-color {color: #c53341 !important;}
.sun-color {color: #ffda00 !important;}
.orange-color {color: #faa61a !important;}
.cyan-color {color: #00aeef !important;}
.tcenter{text-align:center;}

/*
 * COMMON
 */
body{min-width:1200px;}/*for properly width changes*/
	
a {cursor: pointer;color: #fff;}
a:hover {text-decoration: underline;}

#content_wrapper {width:1200px;margin:0 auto;}
div.width_wrapper {width: 1024px;margin: 0 auto;position: relative;}/* general with of the site */

h1, h2, h3, .headline {}
h1, .headline {font-size: 16px;font-family: 'futura_medium';color: #ffda00;letter-spacing:0.1em;}
h2 {font-size: 12px;}
h3 {font-size: 18px;}
p, span {font-size: 16px;line-height: 22px;color: #000;}

.pull-left { float: left; }
.pull-right { float: right; }
.center { text-align: center; }

.clearfix {
  *zoom: 1;
}

.clearfix:before,
.clearfix:after {
  display: table;
  line-height: 0;
  content: "";
}

.clearfix:after {
  clear: both;
}

/*
 * BUTTONS
 */
.btn {}
.btn a {display:inline-block;position: relative;padding: 6px 20px;background: #5ba457;text-decoration: none;font-size: 16px;box-shadow: 3px 3px 5px #CCC;}
.btn a i {display: none;background: url(../images/btn-roll.png) no-repeat;width: 11px;height: 31px;position: absolute;right:-17px; top: 0}
.btn a:hover i {display: block;}

/*
 * SPRITE ELEMENTS
 */
.worm, 
.hameleon, 
.colibri, 
.cat,
.dragonfly,
/*.tree-book,*/
.butterfly,
.dog,
.red-bird,
.nordstrom-logo,
.think-logo,
.starbucks-logo,
.owl {background: url(../images/sprite-elements.png) no-repeat;}

/*
 * HEADER
 */
#header{position: relative; margin-bottom:45px; z-index: 100;}
.top-bg-head {height: 130px;background: #00aeef;}
#top-butterfly{height:130px;position:relative}
#top-butterfly img{ display: block; width: 357px; height: 88px; position:absolute; left: -17px; bottom: 0px;}

a.head-ad {
	display: inline-block;
	padding-right: 8px;
	margin-top: 7px;
	margin-left: 89px;
	line-height: 41px;
	font-family: 'futura_heavyregular';
	text-decoration: none;
	background: url(../images/footer-ad-arrows.png) no-repeat right;
	color: #f6d808;
	font-size:12px;
	text-decoration: none;
	letter-spacing:0.7px
}
	a.head-ad:hover {color: #fff;background: url(../images/footer-ad-arrows-roll.png) no-repeat right;}
	a.head-ad span {color: #fff;font-family: 'futura_heavyregular';font-size: 16px;}
	a.head-ad:hover span {color: #f6d808;}

.social-links { float: right; margin-top: 11px; margin-right: 2px; }
.social-links li { display: inline-block; }
	.social-links li a { display: block; width: 31px; height: 31px; background: url(../images/socials.png) no-repeat top left; }
	.social-links li.twitter a { background-position: -53px 0; }
	.social-links li.pinterest a { background-position: -104px 0; }
	.social-links li.shopping a { width: 32px; background-position: -155px 0; }
	.social-links li a:hover { background-position: 0 -35px; }
	.social-links li.twitter a:hover { background-position: -53px -35px; }
	.social-links li.pinterest a:hover { background-position: -104px -35px; }
	.social-links li.shopping a:hover { background-position: -155px -35px; }


.blog-circle { display: block; float: right; margin-right: 63px; width:114px; height:89px; background:url('../images/blog.png') no-repeat  0 -14px;}
.blog-circle:hover { background-position: 0 -142px; }

/* logo between navigation bar */
h1#logo{display:block;position:absolute;top:-68px;left:288px;width:448px;}
h1#logo a{display: block;margin:0 auto;width: 448px;height: 148px;text-indent:-3000px;background: url(../images/logo.png) no-repeat;}

/* navbar */
.top-navbar {display: block;width:278px; font-size: 0;}
.top-navbar-r {float: right;}
.top-navbar-l {float: left;text-align: right;}
.top-navbar li {position: relative; display: inline-block; background: #00aeef;padding: 0 1px 2px 2px;width: 95px;text-align: center;margin-left: -2px;}
.top-navbar li a {position: relative; display: block;background: #ee4d9b;border: 2px solid #fff;width: 90px;line-height: 30px;text-decoration: none;font-size: 18px;}
.top-navbar li a i {position: absolute; top:30px;left:0; display: none;height: 19px;width: 53px;margin-top: 6px;margin-left: 19px;background: url(../images/navbar-roll-sprite.png) no-repeat;}
.top-navbar li a:hover i,  
.top-navbar li a.active i {display: block;}
.top-navbar-l li a.red {background: #c53341; cursor: default;}
.top-navbar-l li a.orange {background: #faa61a;}
.top-navbar-r li a.green {background: #5ba457;}	
.top-navbar-l li a.orange:hover i, 
.top-navbar-l li a.orange.active i {background-position: -53px 0;}
.top-navbar-r li a.green:hover i, 
.top-navbar-r li a.green.active i {background-position: -106px 0;}
.top-navbar-r li a.pink:hover i, 
.top-navbar-r li a.pink.active i {background-position: -159px 0;}

.top-navbar .sub-menu {position: absolute; top: 100%; display: none; padding-top: 2px; padding-bottom: 18px; margin-top: -2px; left: 0; z-index: 99; background: url(../images/nav/dropdown-bg-about-bottom.png) no-repeat bottom left; font-size: 0; }
	.top-navbar .sub-menu li { display: block; padding: 0 0 10px; background: url(../images/nav/dropdown-bg-about.png) repeat-y; width: auto; text-align: left; }
	.top-navbar .sub-menu li:first-child { padding-top: 37px; background: url(../images/nav/dropdown-bg-about-top.png) no-repeat top left; }
		.top-navbar .sub-menu li a { width: 204px; padding-left: 48px; margin: 0; line-height: 12px; background: transparent; border: none; font-size: 16px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;  }
		.top-navbar .sub-menu li a:hover, .top-navbar .sub-menu li a.current { color: #f6d808; }
.top-navbar > li > a:hover + ul { display: block; }
.top-navbar .sub-menu:hover { display: block; }

/*
 * HOME PAGE images of children
 */	
 #content_wrapper_home{}
.b-chil-links {}
.b-chil-link  {display: inline-block;z-index: 100;}
.b-chil-link .friend {float: left;height: 320px;width: 112px;background: url(../images/children-sprite.png) bottom left no-repeat;z-index: 99;overflow: visible;}
.b-chil-link .friend:hover,
.b-chil-link .friend.roll{background: url(../images/children-sprite_anim.png) bottom left no-repeat;}
.b-chil-link a i {position: absolute;display: none;width: 140px;height: 50px;background: url(../images/names-sprite.png) no-repeat;}
.b-chil-links a:hover i {display: block;}
	
	/* custom centered position of name above head */
	.brennan a i {margin-left: -10px;}
	.piere a i {background-position: -141px 0; width: 97px; margin-left: 11px;}
	.hanna a i {background-position: -237px 0; width: 109px; margin-left: 7px;}
	.max a i {background-position: -346px 0; width: 81px; margin-left: 30px; height: 57px}
	.london a i {background-position: -428px 0; width: 123px; margin-left: 6px;}
	.may a i {background-position: -553px 0; width: 70px; margin-left: 16px;}
	.carlos a i {background-position: -629px 0; width: 100px; margin-left: -6px;}
	.sammy a i {background-position: -734px 0; width: 123px; margin-left: 3px;}
	.sidney a i {background-position: -860px 0; width: 106px; margin-left: 3px; height: 57px}

	/* different width and background position for each character */
	.brennan .friend, .brennan .friend:hover, .brennan .friend.roll {background-position: 0 45px; width: 108px;}
	.piere .friend, .piere .friend:hover, .piere .friend.roll {background-position: -109px 45px; width: 107px;}
	.hanna .friend, .hanna .friend:hover, .hanna .friend.roll {background-position: -219px 45px; width: 125px;}
	.max .friend, .max .friend:hover, .max .friend.roll {background-position: -347px 45px; width: 111px;}
	.london .friend, .london .friend:hover, .london .friend.roll {background-position: -461px 45px; width: 117px;}
	.may .friend, .may .friend:hover, .may .friend.roll {background-position: -584px 45px; width: 115px;}
	.carlos .friend, .carlos .friend:hover, .carlos .friend.roll {background-position: -707px 45px; width: 94px;}
	.sammy .friend, .sammy .friend:hover, .sammy .friend.roll {background-position: -802px 45px; width: 110px;}
	.sidney .friend, .sidney .friend:hover, .sidney .friend.roll {background-position: -911px 45px; width: 104px;}	

/*
 * LEFT SIDEBAR
 */
.l-sidebar {float: left;margin-top:16px}
.l-sidebar__item a{display: block;width: 137px;height: 50px;background: url(../images/sidebar-left.png) no-repeat;margin-top: 3px;}
.l-sidebar__item a:hover,
.l-sidebar__item a.active{background: url(../images/sidebar-left-roll.png) no-repeat;text-decoration:none;}

	/* custom background position for the each nav link */
	.l-sidebar__item a.brennan__navlink{margin-top:0}
	.l-sidebar__item a.piere__navlink {	background-position: 0 -53px;}
	.l-sidebar__item a.hanna__navlink {	background-position: 0 -106px;}
	.l-sidebar__item a.max__navlink {	background-position: 0 -159px;}
	.l-sidebar__item a.london__navlink {	background-position: 0 -212px;}
	.l-sidebar__item a.may__navlink {	background-position: 0 -265px;}
	.l-sidebar__item a.carlos__navlink {	background-position: 0 -318px;}
	.l-sidebar__item a.sammy__navlink {	background-position: 0 -371px;}
	.l-sidebar__item a.sidney__navlink {	background-position: 0 -424px;}

/*
 * SIMPLE PAGE AFTER LEFT SIDEBAR: terms, privacy
 */
.r-post {float: left;width: 708px;margin:58px 0 0 93px}
.r-post p {font-size: 12px;}
.r-post h1 {margin-bottom: 21px;}
	
/*
 * CONTACT, ABOUT, PLEDGE, STUFF PAGES
 */
.content-box {float: left;margin:16px 0 40px 45px;width: 759px;height: 475px;background: #00aeef;padding-bottom: 8px;position: relative;}
.text-box {margin: 2px;border: #fff solid 2px;height: 100%;}
	
	/* about */
	.about, .partners .text-box, .bookstores .text-box {background: #c53341;}
	.worm {width: 67px;height: 36px;}
	.about h1 {padding-left: 47px;padding-top: 2px;margin-bottom: 24px;letter-spacing:0.1em;}
	.about p{padding: 3px 47px 0 47px;}
	.hameleon {position: absolute;width: 104px;height: 77px;background-position: 0 -36px;right: -21px;bottom: -37px;}

	/*partners*/
	.partners, .bookstores { height: auto; padding-bottom: 0; margin-bottom: 0; }
	.partners .text-box, .bookstores .text-box { padding-bottom: 35px; }
	.partners h1, .bookstores h1 { padding: 38px 40px 0; }
	.partners p, .bookstores p { padding: 24px 40px 0; }
	.red-bird { width: 73px;height: 67px;position: absolute;background-position: -4px -393px; right: -7px; bottom: -5px; }
	.logos-set { float: left; margin: 23px 0 0 92px; }
	.nordstrom-logo { display: inline-block; width: 262px; height: 32px; margin: 27px 53px 0 0; background-position: -4px -493px; vertical-align: top; }
	.think-logo { display: inline-block; width: 342px; height: 81px; background-position: 0px -536px; vertical-align: top; }
	.starbucks-logo { display: block; width: 102px; height: 102px; margin: 32px 0 0 70px; background-position: -327px -434px; vertical-align: top; }

	/*bookstores*/
	.bookstores p { font-size: 15px; }
	.bookstores ul { margin: 1px 85px 0 58px; list-style: outside; color: #ffffff; }
		.bookstores ul li { margin-bottom: 4px; font-size: 15px; line-height: 19px; }
	.bookstores .owl { position: absolute; width: 99px; height: 125px; bottom: -3px; right: -6px; background-position: -2px -625px; }
	.stores-group { float: right; width: 759px; margin: 4px 83px 0 0; }
		.stores-group h2 { margin: 28px 0 8px 46px; font-family: 'futura_medium'; font-size: 16px; text-transform: uppercase; color: #c53341; letter-spacing: 1px; }
		.stores-group ul { margin-left: 45px; border-bottom: 1px solid #c53341;  }
		.stores-group ul:last-child { border: none; }
			.stores-group ul li { width: 210px; display: inline-block; margin: 0 25px 25px 0; font-size: 15px; line-height: 22px; vertical-align: top; }
				.stores-group ul li a { font-size: 15px; color: #c53341; }

	
	/* pledge */
	.pledge {background: #faa61a;}
	.colibri {width: 70px;height: 55px;background-position: 0 -113px;margin-left: 154px;margin-top: 14px;}
	.pledge p, 
	.pledge span  {text-align: center;color: #000;font-size: 20px;line-height: 41px;}
	.cat {width: 166px;height: 154px;position: absolute;background-position: 0 -167px;right: 5px;bottom: -13px;}

	/* stuff */
	.content-box.stuff-cont {height: 156px;margin-bottom:32px}
	.content-box.stuff-cont-no-bg{height:auto;background:#fff;margin-top:0;margin-bottom:10px}
	.stuff {background: #59a056;}
	.dragonfly {width: 89px;height: 61px;position: absolute;background-position: 0 -321px;left: -30px;top: -7px;}
	.stuff p {padding: 3px 47px 0 47px;}	
	.stuff p {padding-top: 38px;}
	/*.tree-book {width: 260px;height: 225px;background-position: -168px 0px;margin: 0 25px 0 4px;float: left;}*/
	.tree-book {width: 260px;height: 225px;background-position: -168px 0px;margin: 0 25px 0 4px;float: left;}
	.descr {padding: 0 0 0 289px;}
	.descr p {font-size: 15px;padding-bottom: 9px;}
	.descr em {font-size: 15px;padding-bottom: 9px;}
	.descr p span {font-size: 20px;}
	.stuff-box-links{margin-top:0px;margin-left:-18px;}
	.stuff-box-links h3{padding:25px 0 10px;  }	
	.stuff-box-links a {
		color:#59a056; font-family: 'futura_medium';font-size:16px;letter-spacing:0.1em;
		background: url("../images/btn-roll-green-small.png") no-repeat scroll right center transparent;
    	padding-left: 18px;
    	padding-right: 10px;
    	text-decoration: none;
    	text-transform:uppercase;
	}
	.stuff-box-links a:hover, 
	.stuff-page .stuff-box-links a:hover {
    	background: url("../images/bio-link-arrow.png") no-repeat scroll right center transparent;
    	color: #f6d808 !important;
	}
	
	.space {
	padding-top: 10px;
	padding-bottom: 10px;
	height: 50px;
}
	
	/*contact*/
	.contact {background: #ee4d9b;}
	.contact p, 
	.contact a, 
	.contact span{text-align: center;font-size: 21px;text-decoration: none;line-height: 30px;}
	.contact a:hover {color: #f6d808;}
	.butterfly {position: absolute;width: 47px;height: 47px;background-position: -103px 0;top: 127px;left: 109px;}
	.dog {position: absolute;width: 220px;height: 198px;background-position: -166px -227px;right: 31px;bottom: 20px;}
	.contact p.bordered { border-bottom: 1px solid #ffffff; padding-bottom: 28px; margin: 81px 138px 29px; }


/*
 * FRIENDS BIO PAGES (1200x558)
 */
#content_wrapper.bio-page{min-height:538px;height:auto !important;height:538px;}
.bio-box{float:right;width:370px;/*height:180px;*/margin-top:163px;margin-right:45px}	
.bio-box-text{height:180px;}
.bio-box-links{margin-top:9px;margin-left:-18px;}
.bio-box-links h3{padding:25px 0 10px;  }	
.bio-box-links h3.bio-box-link-color{background:url(../images/crayons.png) no-repeat 0 center}
.bio-box-links h3.bio-box-link-charity{background:url(../images/charity.png) no-repeat 0 center;padding-top:15px;padding-left: 6px;margin-left:-6px;}
.bio-box-links a {
	color:#FFDA00; font-family: 'futura_medium';font-size:16px;letter-spacing:0.1em;
	background: url("../images/bio-link-arrow.png") no-repeat scroll right center transparent;
    padding-left: 40px;
    padding-right: 10px;
    text-decoration: none;
    text-transform:uppercase;
}
.bio-box-links a:hover, 
.bio-page.pierre-bg .bio-box-links a:hover, 
.bio-page.sammy-bg .bio-box-links a:hover {
    background: url("../images/bio-link-arrow-roll.png") no-repeat scroll right center transparent;
    color: #FFFFFF !important;
}
	/* brennan */
	.bio-page.brennan-bg{background:url(../images/bgs/brennan.gif) no-repeat;}

	/* pierre */
	.bio-page.pierre-bg{background:url(../images/bgs/pierre.gif) no-repeat;}
	.bio-page.pierre-bg .bio-box-links a{background: url("../images/bio-link-arrow-blue.png") no-repeat scroll right center transparent;}

	/* hanna */
	.bio-page.hanna-bg{background:url(../images/bgs/hanna.gif) no-repeat;}

	/* max */
	.bio-page.max-bg{background:url(../images/bgs/max.gif) no-repeat;}

	/* london */
	.bio-page.london-bg{background:url(../images/bgs/london.gif) no-repeat;}

	/* may */
	.bio-page.may-bg{background:url(../images/bgs/may.gif) no-repeat;}

	/* carlos */
	.bio-page.carlos-bg{background:url(../images/bgs/carlos.gif) no-repeat;}

	/* sammy */
	.bio-page.sammy-bg{background:url(../images/bgs/sammy.gif) no-repeat;}
	.bio-page.sammy-bg .bio-box-links a{background: url("../images/bio-link-arrow-blue.png") no-repeat scroll right center transparent;}

	/* sidney */
	.bio-page.sidney-bg{background:url(../images/bgs/sidney.gif) no-repeat;}


/*
 * COLORING PAGES
 */ 
#content_wrapper.coloring-page{min-height:538px;height:auto !important;height:538px;}
.coloring-box{float:right;width:525px;margin-top:110px;text-align:center;}	
.coloring-box-imgs{height:370px;}
.coloring-box {min-height: 380px;position: relative;}
.coloring-box a {font-size: 14px;text-decoration: none;color:#59A056 ;}
.coloring-box a img {border: 2px solid #9B9EA1;height: 240px;position: absolute;width: 159px;}
.coloring-box a:hover img {border: 6px solid #59A056;margin-left: -4px;margin-top: -4px;}
.coloring-box a:hover {color: #00AEEF !important;}

	/* brennan */
	.coloring-page.brennan-bg{background:url(../images/bgs/brennan-coloring.gif) no-repeat 0 1px;}
	.brennan-pg .img-one { left: 230px; top: 0;}
	.brennan-pg .img-two { left: 82px; top: 47px;}
	.brennan-pg .img-three { left:362px; top: 84px;}

	/* pierre */
	.coloring-page.pierre-bg{background:url(../images/bgs/pierre-coloring.gif) no-repeat 0 1px;}

	.pierre-pg .img-one { left: 93px; top: 13px;}
	.pierre-pg .img-two { left: 219px; top: 90px;}
	.pierre-pg .img-three { left: 351px; top: 10px;}
	.pierre-pg.coloring-box a:hover img {border: 6px solid #faa61a;}

	/* hanna */
	.coloring-page.hanna-bg{background:url(../images/bgs/hanna-coloring.gif) no-repeat 0 -2px;}

	.hanna-pg .img-one { left: 356px; top: 3px;}
	.hanna-pg .img-two { left: 196px; top: 80px;}
	.hanna-pg .img-three { left: 63px; top: 8px;}

	.hanna-pg.coloring-box a:hover img {border: 6px solid #ee4d9b;}

	/* max */
	.coloring-page.max-bg{background:url(../images/bgs/max-coloring.gif) no-repeat}

	.max-pg .img-one { left: 323px; top: -42px;}
	.max-pg .img-two { left: 197px; top: 78px;}
	.max-pg .img-three { left: 35px; top: 3px;}

	.max-pg.coloring-box a:hover img {border: 6px solid #0e6bad;}

	/* london */
	.coloring-page.london-bg{background:url(../images/bgs/london-coloring.gif) no-repeat 0 1px;}

	.london-pg .img-one { left: 361px; top: 24px;}
	.london-pg .img-two { left: 210px; top: 33px;}
	.london-pg .img-three { left: 65px; top: 0;}

	.london-pg.coloring-box a:hover img {border: 6px solid #a066ab;}	

	/* may */
	.coloring-page.may-bg{background:url(../images/bgs/may-coloring.gif) no-repeat 0 1px;}

	.may-pg .img-one { left: 313px; top: -33px;}
	.may-pg .img-two { left: 205px; top: 108px;}
	.may-pg .img-three { left: 34px; top: -8px;}

	/* carlos */
	.coloring-page.carlos-bg{background:url(../images/bgs/carlos-coloring.gif) no-repeat 0 1px;}

	.carlos-pg .img-one { left: 60px; top: 3px;}
	.carlos-pg .img-two { left: 378px; top: 15px;}
	.carlos-pg .img-three { left: 217px; top: 54px;}

	.carlos-pg.coloring-box a:hover img {border: 6px solid #c53341;}

	/* sammy */
	.coloring-page.sammy-bg{background:url(../images/bgs/sammy-coloring.gif) no-repeat;}

	.sammy-pg .img-one { left: 324px; top: 117px;}
	.sammy-pg .img-two { left: 244px; top: 18px;}
	.sammy-pg .img-three { left: 61px; top: -15px;}

	.sammy-pg.coloring-box a:hover img {border: 6px solid #faa61a;}

	/* sidney */
	.coloring-page.sidney-bg{background:url(../images/bgs/sidney-coloring.gif) no-repeat 0 -1px;}

	.sidney-pg .img-one { left: 350px; top: -5px;}
	.sidney-pg .img-two { left: 189px; top: 110px;}
	.sidney-pg .img-three { left: 84px; top: 4px;}

	.sidney-pg.coloring-box a:hover img {border: 6px solid #00aeef;}
	.sidney-pg.coloring-box a:hover {color: #196bac !important;}

/*
 * FOOTER START
 */
#footer{width:100%;clear:both;background: #00aeef;min-height:55px; z-index: 199;}
#footer .width_wrapper{width:auto;max-width:1024px;}

	/* the same position of footer on the pages */
	#content_wrapper{position: relative; min-height:538px;padding-bottom:75px; z-index: 20;}
	#content_wrapper.home{min-height:418px;margin-top: 130px;}

	/* footer styling */
	#footer .my-world {display: block;float: left;position: relative;height: 37px;width: 53px;margin: 10px 35px 0 244px;background: url(../images/logo-footer.png) no-repeat;}
	#footer .copy {line-height: 55px;float: left;}
	#footer .copy, 
	#footer .copy a { color: #fff; font-size: 11px; text-decoration: none; }
	#footer .copy a:hover {color: #f6d808;}
	/*#footer a.foot-ad {float: right;padding-right: 8px;margin-right: 10px;line-height: 55px;font-family: 'futura_heavyregular';text-decoration: none;background: url(../images/footer-ad-arrows.png) no-repeat right;color: #f6d808;font-size:12px;text-decoration: none;letter-spacing:0.7px}*/