/* Colors---------------------------------------- Olive Green: #839C21 Grey: #575757 Homework Help: Your Resources, Orange: #509EB3 Your Locker, Maroone: #961129 ---------------------------------------------- */ /*--------------------------- Elements ---------------------------*/ #teens .page_content { background: url(../images/teen/teen_main_bg.jpg) no-repeat 0 0; padding: 0 0 30px 0; width: 758px; } .teens_top { padding: 15px 15px; } #teens h2.sifr { color: #FFFFFF; font-size: 2em; padding: 25px 0 10px 23px;} h4.sifr { color: #000000; font-size: 2.2em; padding: 16px 0 0 16px;} #homework_help h4.sifr {width: 300px;} /*--------------------------- Teens Featured Events ---------------------------*/ #teens #featured_events { background: url(../images/teen/teen_feature_tabbed_bg.png) no-repeat left 18px; height: 275px; } #teens #featured_events_header { background: transparent; } #teens #featured_events_header h3 { color: #FFFFFF; width: 150px; font-size: 14px; padding-left: 25px; } #teens #featured_events_tabs a { background: url(../images/teen/teen_feature_tab.png) no-repeat; color: #000; } #teens #featured_events_tabs a.selected { background: url(../images/teen/teen_feature_tab_selected.png) no-repeat; color: #FFF; } #teens #featured_events .event { background: transparent; border: 0; /*margin-top: -15px; */position: absolute; /*padding-top: 25px;*/ margin-left: 10px; } #teens .event .event_details { width: 519px; } #teens .event .event_details p.title { color: #FFFFFF; } #teens .event .event_details p.description { color: #FFFFFF; font-size: 12px; } #teens .event .event_details p.location { color: #FFFFFF; } #teens #featured_events .add_comment { background: url(../images/teen/teen_feature_social_border.jpg) no-repeat right center; color: #575757; font-size: 1.1em; line-height: 13px; margin: 0 8px 0 0; padding: 0 12px 0 0; } #teens #featured_events .add_comment span { background: url(../images/teen/teen_feature_comment_bubble.jpg) no-repeat left 0; color: #FFFFFF; display: block; float: left; font-size: 1.2em; height: 27px; margin: -3px 5px 0 0; padding: 4px 0 0 0; text-align: center; width: 23px; } #teens #featured_events .social .share_this { background: url(../images/teen/teen_feature_share_this.jpg) no-repeat left center; color: #575757; font-size: 1.1em; padding: 5px 0 5px 23px; } /*--------------------------- Teens Staff Recommendations ---------------------------*/ #teens .staff_recommendations { display: block; background: url(../images/teens-rec-more.jpg) no-repeat; height: 33px; padding-bottom: 0; } #teens #recommended_book { padding: 12px; } #teens #recommended_book h3 { color: #839C21; margin: 0; } #teens #recommended_book .librarian { color: #839C21; } #teens #other_books p.title a { color: #222; font-size: 11px; line-height: 13px; } #teens #other_books span.author { font-size: 10px; } #recommended_book { background: url(../images/teen/teen_recommended_books_bg.jpg) no-repeat 530px 15px ; float: left; width: 521px; border-right: 0px; } #recommended_book p { font-size: 1.2em; line-height: 1.4em; max-width: 280px; } #recommended_book .cover { float: left; margin: 0 10px 0 0; width: 188px; } #recommended_book .book_content { margin: 0 0 0 198px; } #recommended_book .title { color: #839C21; font-size: 2.2em; /*margin: 0 0 0 200px; width: 320px;*/ } #recommended_book .tile a { color: #839C21; } #recommended_book .details p { line-height: 1.4em; padding: 0 0 15px 0; } #home #recommended_book .title { margin: 0; width: 320px; } #recommended_book .author { color: #575757; font-size: 1.4em; font-style: italic; padding: 5px 0; } #recommended_book .librarian { color: #839C21; font-size: 1.2em; padding: 10px 0 0 0; } #recommended_header { background: url(../images/teen/recommended_header.jpg) no-repeat 0 26px; margin: -40px 0 0 0;} /*--------------------------- Teens Social ---------------------------*/ /*Large Social*/ #teens .social { padding: 10px 0 5px 0; } #teens .social .rating {background: url(../images/teen/teen_social_border.jpg) no-repeat right center; float: left; list-style: none; margin: 0 8px 0 0; padding: 0 12px 0 0; } #teens .social .rating li { display: inline; font-size: 1em; padding: 0 0 0 0; } #teens .social .rating .star { background: url(../images/teen/teen_rating_star.jpg) no-repeat; display: block; float: left; height: 14px; text-indent: -9999em; width: 13px; } #teens .social .rating .star:hover, #teens .social .rating .full { background-position: left bottom; } #teens .add_comment { background: url(../images/teen/teen_social_border.jpg) no-repeat right center; color: #000; font-size: 1.1em; line-height: 13px; margin: 0 8px 0 0; padding: 0 12px 0 0; } #teens .add_comment span { background: url(../images/teen/teen_comment_bubble.jpg) no-repeat left 0; color: #000; display: block; float: left; font-size: 1.2em; height: 27px; margin: -3px 5px 0 0; padding: 4px 0 0 0; text-align: center; width: 23px; } #teens .social .share_this { background: url(../images/teen/teen_share_this.jpg) no-repeat left center; color: #000; font-size: 1.1em; padding: 5px 0 5px 23px; } /*Small Social*/ #teens .social_small { padding: 10px 0 5px 0; } #teens .social_small .rating { border: 0; list-style: none; margin: 0 0 5px 0; overflow: hidden; padding: 0; } #teens .social_small .rating li { display: inline; font-size: 1em; } #teens .social_small .rating .star { background: url(../images/teen/teen_rating_star.jpg) no-repeat; display: block; float: left; height: 14px; text-indent: -9999em; width: 13px; } #teens .social_small .rating .star:hover, #teens .social_small .rating .full { background-position: left bottom; } #teens .social_small .add_comment { background: url(../images/teen/teen_comment_bubble_small.jpg) no-repeat right center; border: none; color: #000 !important; display: block; float: left; font-size: 1.2em; line-height: 24px; margin: 0 8px 0 -5px; padding: 0 8px 3px 0; text-align: center; width: 37px; } #teens .social_small .share_this { background: url(../images/teen/teen_share_this.jpg) no-repeat left center; color: #000 !important; display: block; float: left; height: 22px; text-indent: -9999em; width: 16px; } /*--------------------------- Teens Feature Carousel ---------------------------*/ #teens #feature_carousel { background-color: #3E4910; height: 212px; } #teens #feature_carousel .header { background: #849E33 url(../images/teen/teen_feature_carousel_header_bg.jpg) no-repeat; height: 35px; } #teens #feature_carousel .tabs { height: 20px; padding: 15px 0 0 0; border: 0; } #teens #feature_carousel .tabs li { display: block; float: left; } #teens #feature_carousel .tabs li.sifr {color: #ffffff; } #teens #feature_carousel .tabs span { color: #fff; display: block; font-size: 14px; height: 20px; line-height: 20px; padding: 0 10px; width: 75px; } #teens #feature_carousel .tabs a { background: url(../images/black_20.png) repeat; color: #fff; display: block; float: left; font-size: 10px; height: 20px; line-height: 20px; margin: 0 5px 0 0; padding: 0 10px; text-align: center; text-transform: uppercase; } #teens #feature_carousel .tabs span.sIFR-alternate { display: none; } #teens #feature_carousel .tabs a.selected { background-image: none; background-color: #3E4910; } #teens #feature_carousel .carousel { margin: 0 auto; padding: 25px 0 0 0; position: relative; } #teens #feature_carousel .carousel .previous { display: block; height: 78px; left: 5px; padding: 47px 0 0 0; position: absolute; text-indent: -9999em; top: 25px; width: 20px; } #teens #feature_carousel .carousel .previous span { background: url(../images/teen/teen_carousel_arrow_left.jpg) no-repeat; display: block; height: 126px; margin: -47px 0 0 0 ; width: 25px; } #teens #feature_carousel .carousel .next { display: block; height: 78px; padding: 47px 0 0 0; position: absolute; right: 5px; text-indent: -9999em; top: 25px; width: 25px; border: 0; } #teens #feature_carousel .carousel .next span { background: url(../images/teen/teen_carousel_arrow_right.jpg) no-repeat left top; display: block; height: 126px; margin: -47px 0 0 0 ; width: 25px; } #teens #feature_carousel .carousel .disabled span { background-position: left bottom; } #teens #feature_carousel .carousel_items { height: 125px; left: 0; position: absolute; width: 5000px; border: 0; padding: 0; } #teens #feature_carousel .carousel_items li { display: block; float: left; list-style: none; list-style-image: none;} #teens #feature_carousel .carousel_items a { display: block; float: left; margin: 0 10px 0 0; overflow: hidden; width: 90px; } #teens #feature_carousel .carousel_container { margin: 0 auto; overflow: hidden; position: relative; width: 695px; } /*--------------------------- Homework Help ---------------------------*/ #teens .homework_help { background: url(../images/teen/homework_help_bg.jpg) no-repeat; color: #fff; height: 428px; width:378px; } #teens .homework_help .padded { padding: 30px 60px 30px 80px;} #teens .homework_help h5.sifr { color: #CC3300; font-size: 1.3em;} #teens .homework_help ul { padding: 0; border: 0; list-style: none; } #teens .homework_help li { margin: 0 0 5px 0; list-style-image: none; } #teens .homework_help li a{ color: #CC3300; font-weight: bold; font-size: 12px; line-height: 1.8em;} #teens .homework_help li p{ color: #575757; font-size: 11px; line-height: 12px;} /*--------------------------- Your Locker ---------------------------*/ #teens .your_locker { background: #841929; height: 428px; } #teens .your_locker div { padding: 20px; } #teens .your_locker h4 { color: #FFF; padding: 15px 0 0 0; } #teens .your_locker a { color: #FFF; } #teens .your_locker ul { padding:0; border: 0; list-style: none !important; } #teens .your_locker li { list-style-image: none; margin: 0 0 15px 0; font-size: 13px; } .locker_post_time { color: #666; font-size: .9em; font-style: italic; }