/* CLASSES RULES */ #class_wrap { width: 1000px; min-height: 610px; background: url(../images/background_wood.jpg) repeat-y 24px 0; } #class_wrap:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #class_search_bar { padding-top: 15px; } #class_search_bar:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #class_search_bar h1 { width: 265px; height: 50px; display: inline; float: left; background: url(../images/header_choose_class_new.png) no-repeat 0 0; text-indent: -9999px; } #class_search_options { width: 735px; height: 50px; display: inline; float: right; background: url(../images/background_classes_search.png) no-repeat 0 0; } #class_search_options form { padding: 15px 0 0 310px; } #class_search_options form:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #class_search_options select { width: 155px; height: 23px; float: left; } #class_search_options input { margin: 0 0 0 40px; padding: 5px 0 0 5px; width: 147px; height: 18px; float: left; color: #fff; background: url(../images/input_background.gif) repeat-x 0 0; font: 11px Verdana, Arial, Helvetica, sans-serif; } #class_search_options .button { margin: 0 0 0 10px; padding: 0; width: 34px; height: 23px; cursor: pointer; } #class_inner_wrap { margin: 0 0 0 9px; padding: 23px 46px 10px 46px; width: 890px; background: url(../images/background_classes_new.png) no-repeat 0 0; } #ClassContent { height: 100%; background: url(../images/background_classes_brief.gif) repeat-y 0 0; } .classes_left { margin-top: -4px; width: 600px; float: left; } .class { width: 600px; } .class:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } .class_brief { width: 600px; display: block; } .class_brief:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } .class_brief img { margin-right: 15px; display: inline; float: left; border: 2px solid #db6035; } .brief { width: 273px; display: inline; float: right; } .brief h2 a { margin: 0 0 10px 0; color: #264a6d; font-size: 21px; font-weight: normal; } .brief h2 a:hover { text-decoration: none; } .brief p { margin-bottom: 15px; color: #264a6d; font-size: 16px; font-weight: normal; line-height: 27px; } .brief a img { border: none; } /* #category_nav { position: absolute; z-index: 10px; background: url(../images/classes_browse_by_category_middle.gif) repeat-y 0 0; } #category_nav li { list-style: none; } #category_nav a { display: none; width: 227px; height: 21px; padding: 4px; text-align: center; text-indent: 0px; color: #fff; text-decoration: none; line-height: 21px; font-size: 18px; } #category_nav a:hover { display: block; text-decoration: underline; } #category_nav a.active { display: block; text-decoration: underline; } #category_nav #browse_btn { height: 29px; line-height: 29px; } #category_nav #browse_btn:hover { } #category_nav #browse_btn.active { } */ #category_container { position: relative; z-index: 999; } #category_container_detail { position: relative; } #category_nav { list-style: none; background: url(../images/classes_browse_by_category_middle.gif) repeat-y 0 0; } #category_nav li { clear: both; display: none; width: 227px; height: 21px; padding: 1px; text-indent: 0px; text-align: center; } #category_nav li.head { display: block; width: 235px; height: 21px; padding: 0px; margin: 0px; margin-bottom: -7px; background: url(../images/classes_browse_by_category_top.gif) top left no-repeat; } #category_nav li.foot { display: block; width: 235px; height: 14px; padding: 0px; margin: 0px; background: url(../images/classes_browse_by_category_bottom.gif) 0 0 no-repeat;} #category_nav a { width: 227px; height: 21px; color: #fff; text-decoration: none; line-height: 21px; font-size: 18px; } #category_nav a:hover { display: block; text-decoration: underline; } #category_nav a.active { display: block; text-decoration: underline; } #category_nav #browse_btn { height: 29px; line-height: 29px; } #category_nav #browse_btn:hover { } #category_nav #browse_btn.active { } #browse_by_category_detail #category_nav { position: absolute; z-index: 10; padding: -4px; overflow: hidden; color: #fff; } #browse_by_category_detail { margin: 0 0 0 34px; width: 235px; height: 61px; background-color: #F2EFDB; } #browse_by_category_detail #browse_btn { } #browse_by_category_detail #browse_btn:hover { } #browse_by_category_detail #browse_btn.active { } .submited_by_bar { width: 585px; height: 44px; margin-left: -4px; padding: 18px 13px 0; color: #fff; background: url(../images/class_submitted_by_bar.gif) no-repeat 0 0; } .submited_by_bar span { margin: 0 5px; } .submited_by_bar a { color: #fff; } .submited_by_bar .left { margin: 0; float: left; } .submited_by_bar .right { margin: 6px 0 0 0; padding-right: 10px; float: right; } .submited_by_bar .right span { float: right; } .submited_by_bar .right img { margin-right: 7px; } .submited_by_bar ul.rating { margin: 1px 0 0 0; } .class_btn { margin: 0 5px 0 -4px; display: block; height: 58px; text-indent: -9999px; cursor: pointer; } #most_recent { width: 146px; float: left; background: url(../images/classes_most_recent.png) no-repeat 0 0; } #browse_by_category { width: 235px; float: left; } #most_popular { width: 146px; float: left; background: url(../images/classes_most_popular.png) no-repeat 0 0; } #most_recent:hover { background-position: 0 -58px; } #browse_by_category:hover { background-position: 0 -58px; } #most_popular:hover { background-position: 0 -58px; } #most_recent.active { background-position: 0 -58px; } #browse_by_category.active { background-position: 0 -58px; } #most_popular.active { background-position: 0 -58px; } .classes_right { margin: -4px -4px 0 0; width: 271px; float: right; } .classes_right .submit_class_wrap {} .classes_right .submit_class_wrap .submit_class { padding: 60px 20px 20px 20px; width: 231px; height: 237px; color: #fff; background: url(../images/submit_class_bg.gif) no-repeat 0 0; } .classes_right .submit_class_wrap .submit_class p { margin-bottom: 20px; } .classes_right .tell_friends p { padding: 0 0 10px 10px; } .classes_right .miss_lauras_favorites ul { margin-left: 25px; } .classes_right .miss_lauras_favorites li { padding: 0 0 15px 0; margin-bottom: 10px; list-style-image: url(../images/icon_star.gif); background: url(../images/parents_blog_line_2.gif) no-repeat bottom left; } .classes_right .miss_lauras_favorites li.last { padding: 0 0 10px 0; background: none; } .classes_right .miss_lauras_favorites a { text-decoration: none; } .classes_right .miss_lauras_favorites a:hover { text-decoration: underline; } .class_rule { display: block; height: 25px; background: url(../images/rule_classes.gif) no-repeat 0 0; } #class_bottom { margin: 0 0 0px 9px; padding-bottom: 3px; background: transparent url(../images/background_wood.jpg) repeat-y scroll 15px 0; } #how_inner_wrap { margin: 0 0 0 9px; padding: 23px 46px 10px 46px; width: 890px; min-height: 567px; background: url(../images/background_how_to.png) no-repeat 0 0; } #how_inner_wrap h2 { margin: 0; color: #264a6d; font-size: 21px; font-weight: normal; } .how_list { list-style: none; } .how_list:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } .how_list li { padding-right: 70px; width: 250px; display: inline; float: left; background: url(../images/background_how_to.gif) no-repeat 0 0; text-align: center; position: relative; } .how_list li.last { padding-right: 0; background: none; } .how_list a img { margin-bottom: 8px; border: 2px solid #db6035; display: block; } #pagination_wrap:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #pagination { width: 360px; color: #264a6d; float: right; } #pagination:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #pagination a { color: #264a6d; text-decoration: none; } #pagination a:hover { text-decoration: underline; } #pagination span.left { margin-top: 4px; width: 225px; float: left; font: 10px Verdana, Arial, Helvetica, sans-serif; text-align: right; } #pagination span.right { float: right; text-align: right; } #pagination span.right img { margin-bottom: 3px; vertical-align: middle; } /* OLD STYLES GET RID OF SOON! */ /* LANDING PAGE RULES*/ #classes_left { padding-top: 3px; width: 605px; display: inline; position: relative; float: left; } #classes_left h2 { width: 605px; height: 72px; background: url(../images/header_choose_class_large.png) no-repeat 0 0; text-indent: -9999px; } #classes_left #class_menu_left { margin-left: 1px; width: 36px; height: 326px; display: inline; float: left; background: url(../images/header_choose_class_left.png) no-repeat 0 0; } #classes_left #class_menu_right { margin-right: 12px; width: 556px; height: 326px; display: inline; float: right; background: #f2efdb; } #classes_left #class_menu_right img.rule { margin: 5px 0 6px 0; } #classes_left #class_menu_right .brief { width: 541px; } #classes_left #class_menu_right .brief:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #classes_left #class_menu_right .brief p { margin: 0; line-height: 21px; } #classes_left #class_menu_right .brief img { margin-right: 10px; float: left; border: 2px solid #db6035; } #classes_left #class_menu_right .brief a { font-weight: bold; } #classes_left #class_menu_right .brief a:hover { text-decoration: none; } #class_menu_footer { width: 605px; height: 66px; display: block; clear: both; background: url(../images/header_choose_class_large_bottom.png) no-repeat 0 0; } #class_menu_footer:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #classes_right { width: 395px; display: inline; float: right; } #classes_right h2 { margin-top: 18px; width: 368px; height: 66px; background: url(../images/header_how_to_refrence.png) no-repeat 0 0; text-indent: -9999px; } #reference { width: 368px; height: 342px; background: url(../images/class_how_to_background.png) } #reference p { color: #FFFFFF; } #reference form { margin: 0 0 13px 17px; } #reference form:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #reference input { padding: 5px 0 0 5px; width: 289px; height: 18px; float: left; color: #fff; background: url(../images/input_invite_background.gif) repeat-x 0 0; font: 11px Verdana, Arial, Helvetica, sans-serif; } #reference input.button { margin-left: 5px; padding: 0; width: 34px; height: 23px; background: none; background: url(../images/button_go.png) no-repeat top left; cursor: pointer; } #reference_content { margin-left: 17px; width: 332px; height: 284px; border: none; overflow-y: scroll; } #reference_content .wrap { width: 312px; background: #5d3766; font: 11px Verdana, Arial, Helvetica, sans-serif; } #reference_content .wrap p { margin: 0 5px 0 0; line-height: 18px; } #reference_content .wrap p:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #reference_content .wrap p img { margin-right: 10px; float: left; border: none; } #reference_content .wrap a { color: #fff; } #reference_content .wrap a:hover { text-decoration: none; } #reference_content .wrap .rule { margin: 5px 0 4px 0; width: 312px; height: 6px; display: block; background: url(../images/reference_menu_rule_large.gif) no-repeat 0 0; color: none; border: none; } /* CLASS DETAIL PAGE RULES */ #classes_detail_left { width: 281px; display: inline; position: relative; float: left; } #classes_detail_left h2 { width: 281px; height: 75px; background: url(../images/header_choose_class.png) no-repeat 0 0; text-indent: -9999px; } #classes_detail_left #pagination_wrapper { display: block; width: 241px; height: 66px; padding: 0 20px; clear: both; font-size: 11px; background: url(../images/header_choose_class_bottom.png) no-repeat top left; } #classes_detail_left #pagination_wrapper #pagination { width: 165px; font-family: Arial, Helvetica, sans-serif; } #classes_detail_left #pagination_wrapper .right { width: auto; margin-top: 15px; } #class_menu_left { margin-left: 1px; width: 36px; height: 326px; display: inline; float: left; background: url(../images/header_choose_class_left.png) no-repeat 0 0; } #favorite_responce { display: none; } #new_total { display: none; } #class_menu_right { margin-right: 12px; width: 232px; height: 265px; display: inline; float: right; background: #f2efdb; } #class_menu_right p { margin: 0; } #class_menu_right p a { padding-right: 5px; } #class_menu_right p:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #class_menu_right p img { margin-right: 10px; float: left; border: 2px solid #db6035; } #class_menu_right #pagination_wrap { background-color: #F2EFDB; padding-right: 7px; } #class_menu_right #pagination_wrap #pagination span.left { width: auto; margin-left: 135px; } #class_menu_right a { font-weight: bold; } #class_menu_right a:hover { text-decoration: none; } #class_menu_right img.rule { margin: 5px 0 5px 0; } #classes_detail_right { margin-top: 18px; width: 719px; display: inline; float: right; } #classes_detail_right:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #video { width: 426px; display: inline; float: left; } #video .body_wrap { margin-left: 12px; padding: 7px; background-color: #F2EFDB; } #video .body_wrap p { margin-bottom: 12px; } #video .body_wrap p.rule { height: 5px; width: 400px; margin: 7px 0 3px 0; background: url(../images/class_menu_rule.gif) repeat-x top left; } #video form { margin-left: 12px; padding: 2px 10px 3px 10px; width: 394px; display: block; background: #f2efdb; } #video form p { margin-bottom: 15px; } #video #form_header { margin-bottom: 5px; width: 394px; } #video #form_header:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #video #form_header h2 { float: left; color: #08253d; font: 17px Georgia, "Times New Roman", Times, serif; } #video #form_header p { margin: 0; float: right; font-size: 11px; } #video #form_header p img { margin-right: 5px; vertical-align: middle; } #video #wysiwyg { width: 394px; height: 98px; display: block; margin-bottom: 5px; } #video #wysiwyg:after { clear: both; } #video #rating { width: 394px; } #video #rating:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #video #rating p { margin-top: 3px; padding-top: 4px; display: inline; float: left; font: 10px Verdana, Arial, Helvetica, sans-serif; } #video #rating p img { vertical-align: bottom; } #video #rating ul { float: left; margin: 5px 0 0 5px; } #video #SubmitReview { float: right; cursor: pointer; width: 70px; height: 26px; } #vid_header { padding-top: 15px; width: 426px; height: 35px; color: #fff; background: url(../images/header_class_title.png) no-repeat 0 0; } #vid_header:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #vid_header h3 { margin: 2px 0 0 20px; display: inline; float: left; font-size: 17px; font-weight: normal; } #vid_header #vid_options { display: inline; float: right; } #vid_header #vid_options a { margin-right: 7px; } #class_video { margin-left: 12px; display: block; } #class_photo { margin-left: 12px; padding: 0 0 7px 7px; display: block; background: url(../images/class_photo.gif) no-repeat top left; width: 414px; } #reviews { margin-left: 12px; padding: 2px 10px 3px 10px; width: 394px; display: block; background: #f2efdb; } #reviews #review_header { width: 394px; } #reviews #review_header:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #reviews #review_header h2 { float: left; color: #08253d; font: 17px Georgia, "Times New Roman", Times, serif; } #reviews #review_header p { margin: 0; float: right; font-size: 11px; } #reviews #review_header p img { margin-left: 5px; vertical-align: middle; } #reviews #review_header a { font-size: 11px; } #reviews_content { margin: 8px 0; width: 394px; height: 140px; border: none; overflow-y: scroll; overflow-x: hidden; } #reviews_content .wrap { width: 374px; color: #08253d; background: #f2efdb; font: 11px Verdana, Arial, Helvetica, sans-serif; } #reviews_content .wrap p { margin: 0 5px 0 0; line-height: 18px; } #reviews_content .wrap p:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #reviews_content .wrap p span { margin-left: 10px; float: right; vertical-align: top; display: inline; } #reviews_content .wrap p { margin-left: 44px; } #reviews_content .wrap p#review_head { margin-left: 0; } #reviews_content .wrap p span ul { margin-top: -16px; position: static; } #reviews_content .wrap img.thumb { margin-right: 10px; float: left; border: 2px solid #db6035; } #reviews_content .wrap a { color: #08253d; } #reviews_content .wrap a:hover { text-decoration: none; } #reviews_content .wrap .rule { margin: 8px 0 10px 0; width: 374px; height: 5px; display: block; background: url(../images/class_reviews_rule.gif) no-repeat 0 0; color: none; border: none; } #ReviewForm #review_form { min-height: 91px; background: #F2EFDB none repeat scroll 0% } #tab_menu { width: 293px; display: inline; position: relative; float: right; } #tabs { width: 293px; height: 50px; background: url(../images/class_tab_background.png) no-repeat 0 0; } #tabs:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } a#tab_1 { margin: 5px 7px 0 7px; width: 120px; height: 45px; display: block; float: left; background: url(../images/class_tab_materials.gif) no-repeat 0 0; text-indent: -9999px; } a#tab_2 { margin-top: 5px; width: 120px; height: 45px; display: block; float: left; background: url(../images/class_tab_how.gif) no-repeat 0 0; text-indent: -9999px; } #right_bar { width: 31px; height: 346px; position: absolute; top: 50px; left: 261px; background: url(../images/class_tab_background_right.png) no-repeat 0 0; } #store { width: 261px; height: 346px; background: #c11e6f url(../images/stitches_classes_tab_section.png) repeat-y 0 0; } #store h4 { width: 261px; height: 41px; background: url(../images/header_class_store.gif) no-repeat 0 0; text-indent: -9999px; } #store_content { margin-left: 13px; width: 234px; height: 262px; border: none; overflow-y: scroll; } #store_content .wrap { width: 214px; background: #c11e6f; font: 11px Verdana, Arial, Helvetica, sans-serif; } #store_content p { margin: 0 5px 0 0; color: #fff; line-height: 17px; } #store_content p:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #store_content p img { margin-right: 10px; float: left; border: none; } #store_content a { color: #fff; } #store_content a:hover { text-decoration: none; } #store_content hr { margin: 5px 0 4px 0; width: 214px; height: 6px; display: block; background: url(../images/shop_menu_rule.gif) no-repeat 0 0; color: none; border: none; } #store_content .wrap .rule { margin: 5px 0 4px 0; width: 214px; height: 6px; display: block; background: url(../images/shop_menu_rule.gif) no-repeat 0 0; color: none; border: none; } #store p.all_items { margin: 10px 0 0 13px; color: #fff; font-size: 14px; } #store p.all_items a { color: #fff; font-size: 12px; } #store p.all_items img { margin: 0 4px 2px 4px; vertical-align: middle; } #how_to { width: 261px; height: 346px; background: #5d3766 url(../images/stitches_classes_tab_section.png) repeat-y 0 0; } #how_to h4 { width: 261px; height: 41px; background: url(../images/header_class_reference.gif) no-repeat 0 0; text-indent: -9999px; } #how_to p { color: #FFFFFF; } #how_to form { margin: 5px 0 5px 13px; } #how_to form:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #how_to input { padding: 5px 0 0 5px; width: 188px; height: 18px; float: left; color: #fff; background: url(../images/input_invite_background.gif) repeat-x 0 0; font: 11px Verdana, Arial, Helvetica, sans-serif; } #how_to input.button { margin-left: 5px; padding: 0; width: 34px; height: 23px; background: none; background: url(../images/button_go.png) no-repeat top left; cursor: pointer; } #how_to_content { margin-left: 13px; width: 234px; height: 262px; border: none; overflow-y: scroll; } #how_to_content .wrap { width: 214px; background: #5d3766; font: 11px Verdana, Arial, Helvetica, sans-serif; } #how_to_content .wrap p { margin: 0 5px 0 0; line-height: 18px; } #how_to_content .wrap p:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; } #how_to_content .wrap p img { margin-right: 10px; float: left; border: none; } #how_to_content .wrap a { color: #fff; } #how_to_content .wrap a:hover { text-decoration: none; } #how_to_content .wrap .rule { margin: 5px 0 4px 0; width: 214px; height: 6px; display: block; background: url(../images/reference_menu_rule.gif) no-repeat 0 0; color: none; border: none; } #needle_thread_left { width: 275px; height: 189px; position: absolute; left: 18px; top: 440px; z-index: 150; background: url(../images/class_needle_thread_left.png) no-repeat 0 0; } #needle_thread_right { width: 285px; height: 220px; position: absolute; left: 707px; top: 410px; z-index: 125; background: url(../images/class_needle_thread_right.png) no-repeat 0 0; } #needle_thread_left_large { width: 587px; height: 189px; position: absolute; left: 18px; top: 446px; z-index: 150; background: url(../images/class_needle_thread_left_large.png) no-repeat 0 0; } #needle_thread_right_large { width: 387px; height: 220px; position: absolute; left: 605px; top: 407px; z-index: 125; background: url(../images/class_needle_thread_right_large.png) no-repeat 0 0; } /* Rating Styles */ .rating{ width: 88px; height:14px; margin:0 0 0 90px; padding:0; list-style:none; position: relative; background: url(../images/star_matrix.gif) no-repeat 0 0;} .rated{ width: 88px; height:14px; margin:0 0 0 45px; padding:0; list-style:none; position: relative; background: url(../images/star_matrix.gif) no-repeat 0 0;} /* add these classes to the ul to effect the change to the correct number of stars */ .nostar {background-position:0 0 } .onestar {background-position:0 -14px} .twostar {background-position:0 -28px} .threestar {background-position:0 -42px} .fourstar {background-position:0 -56px} .fivestar {background-position:0 -70px} ul.rating li { cursor: pointer; float:left; text-indent:-999em; } ul.rating li a {position:absolute; left:0; top:0; width:19px; height:14px; text-decoration:none; z-index: 200; } ul.rating li.one a { left:0px; } ul.rating li.two a { left:19px; } ul.rating li.three a { left:38px; } ul.rating li.four a { left:57px; } ul.rating li.five a { left:76px; } ul.rating li a:hover { z-index: 2; width:88px; height:14px; overflow:hidden; left:0; background: url(../images/star_matrix.gif) no-repeat 0 0} ul.rating li.one a:hover { background-position:0 -14px; } ul.rating li.two a:hover { background-position:0 -28px; } ul.rating li.three a:hover { background-position:0 -42px; } ul.rating li.four a:hover { background-position:0 -56px; } ul.rating li.five a:hover { background-position:0 -70px; } /* Class Submission Styles */ .input_wrap { margin-bottom: 10px; display: block; min-height: 28px; height: auto; } .input_wrap label { margin: 2px 0 0 10px; width: 125px; float: left; display: block; } .input_wrap .chk { width: auto; float: left; } .input_wrap label.chk { margin-right: 20px; } .input_wrap input.chk { margin-top: 4px; } .input_wrap input, .input_wrap select, .input_wrap textarea { padding: 3px; width: 435px; float: left; border: 2px #db6035 solid; } .input_wrap textarea { height: 100px; } .input_wrap select { width: 445px; height: 28px; } .input_wrap option { padding: 2px 3px 1px; } .input_wrap .btn { margin-left: 135px; width: auto; color: #fff; background-color: #db6035; } .thanks p { margin-bottom: 10px; }