0x1998 - MANAGER
Edit File: typo.css
/* # ------------------------------------------------------------------------ # JA Rave template for Joomla 1.5.x # ------------------------------------------------------------------------ # Copyright (C) 2004-2009 J.O.O.M Solutions Co., Ltd. All Rights Reserved. # @license - Copyrighted Commercial Software # Author: J.O.O.M Solutions Co., Ltd # Websites: http://www.joomlart.com - http://www.joomlancers.com # This file may not be redistributed in whole or significant part. # ------------------------------------------------------------------------ */ /* COMMON STYLE --------------------------------------------------------- */ /* Button Black*/ a.btn-black { background-color: #666; border-color: #666; } a.btn-black span { border-color: #999; } a.btn-black:hover, a.btn-black:active, a.btn-black:focus { border-color: #333; } /* Button Blue*/ a.btn-blue { background-color: #08c; border-color: #08c; } a.btn-blue span { border-color: #6ab9e1; } /* Common style for Dark Buttons --- */ a.btn-blue, a.btn-red, a.btn-green, a.btn-orange, a.btn-black { background-image: url(../images/typo/grad-d1-trans.png); color: #fff; border: 1px solid #ccc; } a.btn-blue:hover, a.btn-blue:active, a.btn-blue:focus, a.btn-red:hover, a.btn-red:active, a.btn-red:focus, a.btn-green:hover, a.btn-green:active, a.btn-green:focus, a.btn-orange:hover, a.btn-orange:active, a.btn-orange:focus, a.btn-black:hover, a.btn-black:active, a.btn-black:focus { background-image: url(../images/typo/grad-d1-trans.png); background-position: bottom; border-color: #aaa; color: #fff; } a.btn-blue:hover, a.btn-blue:active, a.btn-blue:focus { border-color: #006ea6; } /* Button green*/ a.btn-green { background-color: #669900; border-color: #669900; } a.btn-green span { border-color: #b1cb7d; } a.btn-green:hover, a.btn-green:active, a.btn-green:focus { border-color: #4d7300; } a.btn-icn-info span { background-image: url(../images/typo/information.png); } a.btn-icn-ok span { background-image: url(../images/typo/tick.png); } a.btn-icn-save span { background-image: url(../images/typo/disk.png); } a.btn-icn-tip span { background-image: url(../images/typo/lightbulb.png); } a.btn-icn-warning span { background-image: url(../images/typo/exclamation.png); } /* Button orange*/ a.btn-orange { background-color: #e58c00; border-color: #e58c00; } a.btn-orange span { border-color: #f1c073; } a.btn-orange:hover, a.btn-orange:active, a.btn-orange:focus { border-color: #a96700; } /* Button red*/ a.btn-red { background-color: #cc0000; border-color: #cc0000; } a.btn-red span { border-color: #e47878; } a.btn-red:hover, a.btn-red:active, a.btn-red:focus { border-color: #9a0000; } /* BUTTONS --------------------------------------------------*/ /* Common Buttons Style ---*/ a.ja-typo-btn { display: block; text-decoration: none; white-space: nowrap; border: 1px solid #ccc; color: #333; background: url(../images/typo/grad-l1-trans.png) repeat-x bottom; } a.ja-typo-btn:hover, a.ja-typo-btn:active, a.ja-typo-btn:focus { border: 1px solid #aaa; background-position: bottom; color: #333; text-decoration: none; } /* Big Buttons ----*/ a.ja-typo-btn-big { text-align: center; border: 1px solid #ccc; font-size: 125%; line-height: normal; font-weight: bold; } a.ja-typo-btn-big span { padding: 8px 15px; border: 1px solid #fff; display: block; } /* Icon Buttons ---*/ a.ja-typo-btn-icn { height: 30px; color: #333; display: block; } a.ja-typo-btn-icn span { padding: 0 15px 0 33px; display: block; background-repeat: no-repeat; background-position: 10px 7px; border: 1px solid #fff; } a.ja-typo-btn-icn span span { height: auto; line-height: 28px; padding: 0; display: inline; background: none; border: none; } /* Small Buttons --- */ a.ja-typo-btn-sm { text-align: center; border: 1px solid #ccc; font-size: 100%; line-height: normal; } a.ja-typo-btn-sm span { padding: 5px 10px; border: 1px solid #fff; display: block; } /* Blockquote ---*/ blockquote { font-family: Georgia, Times, serif; font-size: 100%; } blockquote span.close { background: url(../images/typo/sc-q.gif) no-repeat bottom right; display: inline-block; padding: 0 20px 0 0; } blockquote span.open { background: url(../images/typo/so-q.gif) no-repeat left top; display: inline-block; padding: 0 0 0 20px; } /* Style 2 */ fieldset.fieldset-2 { border: 1px solid #08c; } fieldset.fieldset-2 legend { color: #08c; } /* FORM --------------------------------------------------*/ /* Fieldset ----*/ /* Common Style + Style 1 */ fieldset.ja-typo-fieldset { border: 1px solid #ddd; padding: 10px; } fieldset.ja-typo-fieldset legend { padding: 0 10px; } /* Big Number ---*/ p.blocknumber { position: relative; padding: 5px 0 5px 55px !important; min-height: 44px; } p.box-download { background-image: url(../images/typo/download-big.png); } /* Box with icons */ p.box-download, p.box-sticky { background-repeat: no-repeat; background-position: 10px 15px; } p.box-grey-1 { background: #f7f7f7; border-color: #dddddd; } /* Box without icons - Style 1*/ p.box-grey-1, p.box-hilite-1 { padding: 10px 15px !important; } p.box-grey-2 { background: #f7f7f7; border-color: #dddddd; border-style: dotted; } /* Box without icons - Style 2*/ p.box-grey-2, p.box-hilite-2 { padding: 10px 15px !important; } p.box-hilite-1 { background: #ffffdd; border-color: #d2d2b6; } p.box-hilite-2 { background: #ffffdd; border-color: #d2d2b6; border-style: dotted; } p.box-sticky { background-image: url(../images/typo/sticky-big.png); } p.icon-cart span.icon { background-position: right -54px; } p.icon-doc span.icon { background-position: right -72px; } p.icon-error { color: #CC0000; } p.icon-error span.icon { background-position: left -54px; } p.icon-key span.icon { background-position: left -108px; } p.icon-message { color: #2C79B3; } p.icon-message span.icon { background-position: left -72px; } p.icon-mobi span.icon { background-position: right -126px; } p.icon-note span.icon { background-position: right -90px; } p.icon-photo span.icon { background-position: right -108px; } p.icon-tag span.icon { background-position: left -126px; } p.icon-tips { color: #E58C00; } p.icon-tips span.icon { background-position: left -90px; } /* MESSAGE BOXES AND LEGENDS STYLE -----------------------------------------------------------------*/ /* Box style ---*/ p.ja-typo-box { border: 1px solid #ddd; padding: 10px 10px 10px 50px !important; } /* ICON STYLE -----------------------------------------------------------------*/ /* Tips, Error, Message, Hightlight ---*/ p.ja-typo-icon { padding-left: 25px !important; position: relative; } p.ja-typo-icon span.icon { background-image: url(../images/typo/icons-sprites-silk.png); /*background-image: url(../images/typo/icons/icons-sprites-tango.png);*/ background-repeat: no-repeat; width: 18px; height: 18px; display: block; position: absolute; top: 2px; left: 0; } /* PREFORMATTED TEXT -------------------------------------------------------------*/ /* Pre, Code ---*/ pre, .code { background-color: #ffffdd !important; border: 1px solid #ccc !important; border-left-width: 5px !important; font: 1em/1.5 Monaco, Consolas, "Courier News", monospace !important; padding: 10px 15px !important; } /* TAGS --------------------------------------------------*/ span.ja-typo-tag { padding: 3px 12px; margin: 0 2px; display: inline-block; line-height: normal; white-space: nowrap; background: #666; color: #fff; } span.tag-blue { background: #08c; } span.tag-green { background: #669900; } span.tag-grey { background: #ccc; color: #333; } span.tag-orange { background: #e58c00; } span.tag-red { background: #cc0000; } /* sub & sup tags ---*/ sub, sup { color: #CC0000; font-size: 11px; font-weight: bold; } ul#ja-typo-nav { margin: 0; padding: 0; } ul#ja-typo-nav li { margin: 0 5px 0 0; padding: 0; display: block; float: left; } ul#ja-typo-nav li a { display: block; padding: 30px 10px 10px; color: #666; text-transform: uppercase; font-family: "Arial Narrow", Arial, sans-serif; letter-spacing: 1px; text-decoration: none; } ul#ja-typo-nav li a:hover, ul#ja-typo-nav li a:active, ul#ja-typo-nav li a:focus { color: #333; } ul#ja-typo-nav li.active a { background: #333; color: #fff; } /* LIST STYLES -----------------------------------------------------------------*/ /* Special list style ---*/ ul.ja-typo-list li { background: none; margin-left: 8px; padding: 0 0 0 25px; position: relative; overflow: hidden; } ul.ja-typo-list span.icon { background-image: url(../images/typo/icons-sprites-silk.png); /*background-image: url(../images/typo/icons/icons-sprites-tango.png);*/ background-repeat: no-repeat; width: 18px; height: 18px; display: block; position: absolute; top: 0; left: 0; } ul.list-arrow span.icon { background-position: left top; } ul.list-check span.icon { background-position: left -36px; } ul.list-star span.icon { background-position: left -18px; } /* SPECIAL MODULE STYLE --------------------------------------------------*/ /* Badge ---*/ .badge { background-image: url(../images/typo/badge.png); background-repeat: no-repeat; height: 46px; position: absolute; right: 0; width: 45px; } .badge-hot .badge { background-position: 0 0; } .badge-new .badge { background-position: 0 -46px; } .badge-pick .badge { background-position: 0 -92px; } .badge-top .badge { background-position: 0 -138px; } .blocknumber .bignumber { background-image: url(../images/typo/blocknumber-bg.png); background-repeat: no-repeat; color: #FFFFFF; display: block; width: 44px; height: 44px; line-height: 44px !important; position: absolute; top: 0; left: 0; font: bold 20px/normal Arial, sans-serif; text-align: center; } .blocknumber-1 .bignumber { background-position: left top; } .blocknumber-2 .bignumber { background-position: left -44px; } .blocknumber-3 .bignumber { background-position: left -88px; } /* Dropcap ---*/ .dropcap { display: block; float: left; font: 60px/40px Georgia, Times, serif; padding: 7px 8px 0 0; } /* Inline Words Hilite ---*/ .highlight { background: #ffffdd; font-weight: bold; padding: 1px 5px; } .ja-typo-block { float: left; padding-top: 20px; } .ja-typo-blockct { padding: 0 10px; } .ja-typo-blockct .inputbox { color: #999; font-style: italic; } .ja-typo-blockrow { border-bottom: 1px dotted #ddd; padding: 0 0 20px; } .ja-typo-blockrow > h2.ja-typo-title { margin-bottom: -20px; margin-top: 20px !important; } /* Blockswrap Actions ---*/ .ja-typo-blocks-actions { font-size: 85%; position: absolute; right: 5px; top: 5px; color: #999; } .ja-typo-blocks-actions a { font-size: 85%; text-transform: none; font-family: Arial, Helvetica, sans-serif; font-weight: normal; color: #c00; text-decoration: none; } /* TYPO PAGE LAYOUT -------------------------------------------------------------*/ .ja-typo-blockswrap { margin: 15px 0; } .ja-typo-blockswrap .cols-1 .ja-typo-block { width: 100%; float: none; } .ja-typo-blockswrap .cols-2 .ja-typo-block { width: 49.5%; float: left; } .ja-typo-blockswrap .cols-3 .ja-typo-block { width: 33%; float: left; } .ja-typo-blockswrap .cols-4 .ja-typo-block { width: 24.9%; float: left; } .ja-typo-blockswrap .ja-typo-block.last { float: right; } .ja-typo-blockswrap h1.ja-typo-title { font-size: 175%; border-bottom: 5px solid #ddd !important; padding: 5px 5px 5px 0px; margin: 0; font-family: "Arial Narrow", Helvetica, Arial, sans-serif; text-transform: uppercase; font-weight: bold; position: relative; color: #666; } .ja-typo-blockswrap h2.ja-typo-title { font-size: 115%; margin: 0; padding: 0 10px; font-family: "Arial Narrow", Helvetica, Arial, sans-serif; text-transform: uppercase; } .ja-typo-blockswrap h2.ja-typo-title span { background: #f2f2f2; color: #666; padding: 3px 10px; display: inline-block; } .ja-typo-blockswrap:hover h1.ja-typo-title { border-bottom: 5px solid #333 !important; color: #333; } .ja-typo-blockswrap:hover h2.ja-typo-title span { background: #ddd; color: #333; } /* BUBBLES -----------------------------------------------------------------*/ /* Common Style + Style 1 */ .ja-typo-bubble { margin: 20px 0; position: relative; } .ja-typo-bubble .ja-typo-bubblect { border: 1px solid #d5d5d5; padding: 10px 15px; } .ja-typo-bubble p.ja-typo-bubble-meta { margin: -1px 0 0; height: 25px; padding-left: 65px; } .ja-typo-bubble span.ja-typo-bubble-arrow { display: block; position: absolute; bottom: 0; left: 28px; width: 25px; height: 25px; background: url(../images/typo/bubble-arrow.png) 0 0; } .ja-typo-bubble span.ja-typo-bubble-author { font-weight: bold; display: block; padding-top: 5px; } /* Style 2 --- */ .bubble-2 .ja-typo-bubblect { border: 0 !important; background: #ddd; } .bubble-2 span.ja-typo-bubble-arrow { background-position: -25px 0; } /* Style 3 --- */ .bubble-3 .ja-typo-bubblect { border: 1px solid #08c; } .bubble-3 span.ja-typo-bubble-arrow { background-position: 0 -25px; } /* Style 4 --- */ .bubble-4 .ja-typo-bubblect { border: 0 !important; background: #08c; color: #fff; } .bubble-4 span.ja-typo-bubble-arrow { background-position: -25px -25px; } /* Style 5 --- */ .bubble-5 .ja-typo-bubblect { border: 1px solid #333; } .bubble-5 span.ja-typo-bubble-arrow { background-position: -50px -50px; } /* Style 6 --- */ .bubble-6 .ja-typo-bubblect { border: none !important; background: #333; color: #fff; } .bubble-6 span.ja-typo-bubble-arrow { background-position: -25px -50px; } /* Legend ---*/ .ja-typo-legend { border: 1px solid #ddd; margin: 20px 0; padding: 20px 15px 15px; position: relative; } .ja-typo-legend .legend-title { background: #fff; display: block; float: left; font-family: Arial, sans-serif; font-size: 125%; font-weight: bold; left: 10px; line-height: normal; margin: 0 !important; padding: 5px !important; position: absolute; top: -17px; } /* Legend Style 2 */ .legend-2 { border: 1px solid #08c; } .legend-2 .legend-title { color: #08c; } #ja-typo { background: #fff; padding: 20px 0 0 !important; } #ja-typo .ja-content-main { width: 100%; } /*Use for Demo Page Only*/ #ja-typo .moduletable_badge { margin: 0; padding: 0; min-height: 40px; border-bottom: none; } #ja-typo .moduletable_badge .ja-box-ct { border: 1px solid #ddd; padding: 20px; background: #f7f7f7; } /* Block Actions ---*/ #ja-typo .typo-wrap { } #ja-typo .typo-wrap a.typo-view-details { background: #333; border: 1px solid #1f1f1f; font-weight: bold; color: #fff; text-decoration: none; text-transform: capitalize; padding: 2px 8px 1px; } /*Use for Demo Page Only*/ #ja-typo a.ja-typo-btn { margin: 20px 30px 10px 0; float: left; } /*Use for Demo Page Only*/ #ja-typo fieldset { margin-top: 20px; } /* TYPO HEAD -------------------------------------------------------------*/ #ja-typo-head { background: #fff; padding: 0; }