/* Bento styles based off /css/v9/bento.css */ #sub-header { padding-top: 20px; margin-right: 15px; } #sub-header h2 { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important; } .button-red { border: 1px solid #810000; padding: 4px 18px !important; background: #810000 url(/database-templates/site/images/buttons/bg_button_red2.png) repeat-x 0 0; } .button-red { -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; } /* BENTO TEMPLATES GENERAL */ /*///////////////////////////*/ #related-nav { margin-bottom: 30px; } #nav-templates { color: #000 !important; } #sub-nav a:link { color: #666; } .page-nav-next { float: right; padding-right: 22px; background: url(/database-templates/images/bento/bullet_arrow_forward.png) no-repeat 100% 1px; } .page-nav-prev { padding-left: 22px; background: url(/database-templates/images/bento/bullet_arrow_back.png) no-repeat 0 1px; } .clear { clear: both; } #lower-area { width: 690px; } #right-col { width: 250px; } h2, h3, h4, h5, h6 { font-family: "Lucida Grande", Lucida, Helvetica, Arial, sans-serif !important; } /* Content */ #zoom { width: 820px !important; } .callout { background: #f2f2f2 url(/database-templates/images/site/bg_callout_btx.png) repeat-x 0 0; } .callout h2 { color: #333 !important; font-size: 130% !important; } #lower-area h3 { font-size: 120%; padding-top: 10px; } /* Sidebar */ #right-col .callout { background: #F2F2F2 url(/database-templates/images/bento/templates/bg_callout_btx.png) repeat-x 0 100%; border: 1px solid #d4d4d4; } #top-downloads { background-position: 0 -450px !important; } .sidebar-nav { padding: 0; margin-bottom: 10px; } .sidebar-nav h4 { margin-bottom: 0 !important; font-size: 110% !important; font-weight: bold; color: #666666; border-bottom: 1px solid #d4d4d4; padding: 8px 20px 5px 20px; background: url(/database-templates/images/site/bg_sidebar_heading.png) repeat-x 0 0; } .sidebar-nav h4 { -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; } .sidebar-nav li { border-bottom: 1px solid #d4d4d4; border-top: 1px solid #fff; } .sidebar-nav li a { display: block; padding: 10px 20px; text-decoration: none; color: #666666; background: url(/database-templates/images/site/buttons/arrow_gray_right.png) no-repeat 95% 15px; } .sidebar-nav li a:hover { text-decoration: none; color: #666666; background: url(/database-templates/images/site/buttons/arrow_black_right.png) no-repeat 95% 13px; } .sidebar-nav li.last { border-bottom: 0; } #all-cats a { padding-left: 50px; } /* Sidebar Search */ #template-search { padding: 0; margin-bottom: 10px; background: url(/database-templates/images/site/bg_sidebar_callout_search.jpg) repeat-x 0 0 !important; } #template-search form { padding: 10px; padding-left: 45px; background: url(/database-templates/images/site/icons/icon_search_glass.png) no-repeat 10px 5px; } #template-search input { padding: 3px 10px; color: #777; width: 165px; } #template-search input { border: 1px solid #ccc; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; } #template-search p { margin: 0 0 0 10px !important; padding: 0 0 10px 0; } #template-search h4, #template-search p { width: 150px; } /* Sidebar Template Submit */ #template-submit { padding: 10px; margin-bottom: 10px; background: url(/database-templates/images/site/bg_sidebar_callout_submit.jpg) repeat-x 0 0 !important; } #template-submit img { float: left; } #template-submit h4 { margin-bottom: 2px; } #template-submit h4 a { color: #666666; background: url(/database-templates/images/site/buttons/arrow_gray_right.png) no-repeat 100% 6px; } #template-submit h4 a:hover { color: #222; } #template-submit p { color: #666666; font-size: 90%; margin-bottom: 0; } #template-submit h4, #template-submit p { margin-left: 55px !important; } /* Social */ #social { padding: 6px 0; margin-bottom: 10px; } #social img { vertical-align: middle; margin: 0 2px; } #social p { height: 25px; color: #666666; margin-bottom: 0; } #social #share { float: left; width: auto; } #social iframe { vertical-align: middle; } #social #follow { line-height: 170% !important; } #btx-home #social { margin-left: 75px; } #btx-home #social img { float: none; vertical-align: bottom !important; margin: 0 2px; } #btx-home #social #share { margin-left: 0; width: auto; } #btx-home .fb-like { } #btx-home #social iframe { width: auto !important; } span.divider { border-left: 1px solid #ccc; border-right: 1px solid #ccc; padding: 0 15px; margin: 0 18px; } /* BENTO TEMPLATES MAIN PAGE */ /*///////////////////////////*/ /* Featured Template */ #featured { padding-bottom: 20px !important; background: none; } #featured h2 { height: 40px; text-indent: -4000px; margin-bottom: 0; padding-top: 10px; background: url(/database-templates/images/bento/heading_featured_template.png) no-repeat 50% 10px; } #featured h2.sub-head { background: none; color: #616161 !important; font-weight: normal; font-size: 150% !important; text-indent: -5000px; text-align: center; margin-bottom: 10px; padding: 0; background: url(/database-templates/images/bento/heading2_feature_template.png) no-repeat 50% 0; } #featured img { float: left; padding: 0 0 30px 10px; } #featured p img { padding: 0; } #featured h3 { padding-top: 0; font: normal 200% "Helvetica Neue", Helvetica, Geneva, Arial, sans-serif; } #featured h4 { font-size: 130%; font-weight: bold; } #featured h3, #featured h4, #featured p { margin-left: 340px; } /* #featured ul { margin-left: 360px !important; } */ #btx-home #detail-desc { float: right; display: block; background: none; margin: 0; width: 305px; height: 170px; font: 100% 'Lucida Grande', Helvetica, Arial, Verdana, sans-serif; color: #333; border: 0; overflow: visible; } /* What are Bento Templates */ #templates-info { clear: both; margin: 20px 0; background: url(/database-templates/images/site/bg_callout_what_is_btx.jpg) repeat-x 0 0; padding-bottom: 5px; } #templates-info img { float: left; margin: 10px 10px 0 0; } #templates-info p { margin-left: 75px; } #whats-new-list { margin-bottom: 10px; } /* General Template List such as Other Feature Templates, What's New, etc... */ .template { clear: both; padding: 10px 0 5px 0; border-top: 1px solid #ddd; clear: both; } .template.first { border-top: 0; padding-top: 0; } .template.last { } .template h4, .template p { margin-left: 75px; } .template h4 { font: bold 110% "Lucida Grande", Helvetica, Arial, sans-serif !important; padding-top: 0; margin-bottom: 3px !important; } .template img { float: left; margin: 0 10px 10px 0; } /* BENTO TEMPLATES DETAIL PAGE */ /*/////////////////////////////*/ #details { margin-bottom: 20px; background: #fff; padding-bottom: 0; } #details h2 { font-size: 160% !important; margin-bottom: 0; } #details .snapshot { width: 320px; float: left; } #details img#preview { width: 300px; margin-bottom: 10px; } #details #larger-screenshot img { max-width: 600px; } #details .snapshot ul { margin: 10px 0 60px 0; } #details .snapshot li { line-height: 12px; list-style: none; margin-bottom: 8px; float: left; margin-right: 8px; padding-right: 8px; border-right: 1px solid #999; } #details .snapshot li a { float: left; display: block; } #details .snapshot li:last-child { border-right: 0; } #details #template-description { margin-left: 320px; } #details .note { font-style: italic; font-size: 85% !important; line-height: 125%; } #detail-desc { background: none; margin: 5px 0 0 0; width: 330px; height: 190px; font: 100% 'Lucida Grande', Helvetica, Arial, Verdana, sans-serif; color: #333; line-height: 140%;border: 0; overflow: visible; } /* CATEGORY ICONS */ .arts { background: url(/database-templates/images/icons/tn/cat_arts_photography_sm.png) no-repeat 10px 4px; } .business { background: url(/database-templates/images/icons/tn/cat_business_sm.png) no-repeat 10px 2px; } .contacts { background: url(/database-templates/images/icons/tn/cat_contacts_sm.png) no-repeat 10px 3px; } .cooking { background: url(/database-templates/images/icons/tn/cat_cooking_food_sm.png) no-repeat 19px 2px; } .education { background: url(/database-templates/images/icons/tn/cat_education_sm.png) no-repeat 10px 7px; } .events { background: url(/database-templates/images/icons/tn/cat_events_sm.png) no-repeat 10px 4px; } .finance { background: url(/database-templates/images/icons/tn/cat_finance_sm.png) no-repeat 13px 6px; } .health { background: url(/database-templates/images/icons/tn/cat_health_sm.png) no-repeat 10px 2px; } .home { background: url(/database-templates/images/icons/tn/cat_home_sm.png) no-repeat 10px 4px; } .internet { background: url(/database-templates/images/icons/tn/cat_internet_sm.png) no-repeat 10px 3px; } .music-movies { background: url(/database-templates/images/icons/tn/cat_music_movies_sm.png) no-repeat 10px 7px; } .research { background: url(/database-templates/images/icons/tn/cat_research_sm.png) no-repeat 10px 3px; } .sports { background: url(/database-templates/images/icons/tn/cat_sports_sm.png) no-repeat 10px 4px; } .time { background: url(/database-templates/images/icons/tn/cat_time_sm.png) no-repeat 10px 4px; } .travel { background: url(/database-templates/images/icons/tn/cat_travel_sm.png) no-repeat 12px 3px; } /* a.by-filemaker { background-image: url(/database-templates/images/bento/templates/cat_filemaker_sm.png); } */ /* SEARCH RESULTS PAGE */ /*/////////////////////*/ #search-options { position: relative; padding: 10px 10px 15px 10px; border: 1px solid #c3c4c3; border-bottom: 1px solid #696969; background: url(/database-templates/images/site/bg_search_options.png) repeat-x 0 0; } #search-options h2 { float: left; width: 200px; padding: 5px 0 20px 50px; font-size: 140% !important; background: url(/database-templates/images/site/graphic_search_glass.png) no-repeat 0 0; } #search-options .options { margin-left: 260px; } .options { padding: 5px 10px 10px 0; } .options input { border: 1px solid #ccc; padding: 3px 10px; margin-right: 10px; } .options .button-blue { position: absolute; top: 14px; right: 20px; width: 40px !important; display: block !importnat; } #search-form { margin-bottom: 10px; } input#search-field { color: #616161; } input#search-field { border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; } #search-form .button-blue2 { cursor: pointer; display: inline; color: #fff; border: 1px solid #82b0cf; background: url(/database-templates/images/site/buttons/bg_button_blue2.png) repeat-x; } #search-form .button-blue2 { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } #select-english, #select-all-languages { color: #333; text-decoration: none; padding-left: 18px; background: url(/database-templates/images/site/radio_button.png) no-repeat 0 0; margin-right: 25px; } #select-english.selected, #select-all-languages.selected { background: url(/database-templates/images/site/radio_button_selected.png) no-repeat 0 0; } #select-all-languages { padding-right: 25px; margin-right: 20px; border-right: 1px solid #ccc; } .results strong { padding-right: 20px; border-right: 1px solid #ccc; } .search-cat, .search-lang { font-weight: normal; margin: 0 0 0 10px; padding-left: 13px; } #search-params { border-bottom: 1px solid #ddd; margin: 20px 0;} #search-params .results { float: left; margin-top: 5px; } #search-params .langs { float: left; } #search-params .langs li { float: left; list-style: none; border-right: 1px solid #ccc; margin: 0 10px 0 0; padding: 0 10px 0 0; } #search-params .langs .selected, #search-params .langs .selected a { color: #333 !important; font-weight: bold; } #search-params #lang-other { border: 0 !important; } .result { margin-bottom: 10px; clear: both; } .result img { float: left; margin-top: 12px; width: 80px; } .result h3, .result p, .result .search-desc { margin-left: 110px; } .result h3 { margin-bottom: 2px !important; font-size: 100% !important; } .result h3 p { color: #000; } .bento3 { font-weight: normal; padding-left: 5px; color: #000; } /* SUBMIT FORM/POPUP PAGES */ /*/////////////////////////*/ .popup body { width: 800px !important; background: #f7f7f7; padding: 0 55px; } #page-wrapper { width: 690px; margin: 0 auto; } .popup #bento-logo { margin: 20px 0; } .popup #main { width: 690px !important; padding: 10px 0 0 0 !important; margin: 0 !important; background: url(/database-templates/images/bento/templates/bg_content_top_popup.png) no-repeat 0 0 !important; } .popup .main-wrapper { padding: 10px 40px 20px 20px !important; width: 650px !important; background: url(/database-templates/images/bento/templates/bg_content_bottom_popup.png) no-repeat 0 100%; } .popup #main h2 { margin-top: 0; padding-top: 0; font: normal 200% "Helvetica Neue", Helvetica, Arial, sans-serif !important; } .popup .intro { margin: 0 0 10px 0; padding: 0; font-size: 120%; color: #555; } .popup form { background: url(/database-templates/images/bento/templates/graphic_bento_popup.jpg) no-repeat 95% 10px; } body.in-prod.popup form, body.reply.popup form { background: none; } .popup form p { margin: 10px 0; width: 450px; } .popup input, .popup select { width: 200px; margin: 10px 0; padding: 3px; } .popup select { width: auto; } .popup textarea { width: 450px; height: 150px; margin-top: 10px; margin-bottom: 0; padding: 5px; font: normal 115% "Lucida Grande", Helvetica, Arial, sans-serif; } .popup sup { color: #900; font-size: 125%; margin-left: 3px; vertical-align: middle; } .popup label { font-size: 110%; } .popup .popup-callout-top { clear: both; margin-top: 10px; background: url(/database-templates/images/bento/templates/bg_callout_top_popup.png) no-repeat 0 0; padding-top: 5px; } .popup .popup-callout-bottom { width: 410px; padding: 10px 20px 20px 25px; background: url(/database-templates/images/bento/templates/bg_callout_bottom_popup.png) no-repeat 0 100%; } .popup .popup-callout-bottom p { width: auto; } .popup #btx-terms { width: 390px; height: 350px; margin-bottom: 10px; overflow: auto; } .acceptance p { margin: 0 0 3px 0 !important; padding: 0; } .acceptance strong { font-size: 110%; margin-left: 20px; } #accept-check { position: relative; } #accept-check input { position: absolute; top: 0; left: 0; margin: 0; padding: 0; width: auto !important; } #continue, #upload-now, #button-report { width: auto; height: auto; } /* .popup .tabbed-nav { margin-top: 30px; padding: 0; padding-bottom: 15px; } .popup .tabbed-nav li { list-style: none; float: left; padding-right: 10px; border-right: 1px solid #ddd; margin-right: 10px; } .popup .tabbed-nav li.last { border-right: 0; } .popup .tabbed-nav li a { font-size: 110%; } .popup .tabbed-nav li a.selected { color: #000; font-weight: bold; } */ .popup .popup-callout2-top { clear: both; margin-top: 30px; background: url(/database-templates/images/bento/templates/bg_callout2_top_popup.png) no-repeat 0 0; padding-top: 5px; } .popup .popup-callout2-bottom { width: 410px; padding: 10px 20px 20px 20px; background: url(/database-templates/images/bento/templates/bg_callout2_bottom_popup.png) no-repeat 0 100%; } .popup ol { padding: 0 20px; } .popup ol li { font-size: 130%; border-bottom: 1px solid #ddd; padding-bottom: 10px; margin-bottom: 20px; } .popup ol li.last { border: 0; } .popup #main ol ul { margin-top: 10px; padding-left: 15px !important; } .popup #main ul li { font-size: 11px; margin-bottom: 10px; padding-bottom: 0; border: 0; } /* How to Write a Great Description Article... */ #article-wrapper { height: 390px; overflow: scroll; } #article-wrapper ol { margin-left: 25px; } #article-wrapper ol li { border: 0 !important; font-size: 1em; margin: 0; padding: 0 0 3px 0; } #article-wrapper blockquote { background: #dfdfdf; padding: 10px; font-size: 125%; } #article-wrapper blockquote p { font-size: 100%; } #article-wrapper li { margin-bottom: 5px; } #article-wrapper .line { border-bottom: 1px solid #ddd; margin-bottom: 20px; padding-bottom: 20px; } /* Errors */ .popup form.errors { background: url(/database-templates/images/bento/templates/graphic_error_lg.png) no-repeat 95% 10px; } .popup form .error { color: #900; } .popup .error-message { background: url(/database-templates/images/bento/templates/graphic_error_sm.png) no-repeat 98% 0; min-height: 70px; } .popup .error-message p, .popup .error-message ul { font-size: 1em; color: #900; width: 340px; } .popup .error-message p { margin: 0; padding: 17px 0 0 0; font-size: 120%; } .popup .error-message ul { padding-left: 20px; } .popup .error-message li { font-size: 100% !important; margin-bottom: 5px !important; } input.error, textarea.error, select.error { border: 1px solid #900; margin-right: 15px; } textarea.error { margin-bottom: 5px; } /* hiding error messages for intl */ label.error { display: none; } /* Footer */ .popup #footer { width: 700px !important; padding: 20px 0 20px 0 !important; background: none !important; } .popup #footer ul, .popup #footer p { background: none !important; }