/** * 3Gapps.de * * 3Gapps.de Stylesheet * * @author Joram Höfs * @version 2.0 * * @creator My cold dead hands + TextMate * * @media all * * @date 2009-06-25 Dokument erstellt * @date 2009-11-20 Redesign * @date 2009-12-04 Dokument zur häfter neugeschrieben - BACKUPS machen! * * @colordef #fff; White * * @colordef #f8f9fd; UltraLightGrey * @colordef #f7f7f7; VeryLightGrey * @colordef #efefef; LightGrey * * @colordef #828282; MidGrey * @colordef #454545; DarkMidgrey * * @colordef #cfd5ed; LighterBlueGrey * @colordef #566fa2; LightBlueGrey; * @colordef #bac4e5; BlueGrey * @colordef #b1b7ca; DarkerBlueGrey * * @colordef #bbc4e5; SoftBlue * @colordef #34456c; Blue * * @fontdef "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; Serifenlos - durchgängig alle Texte */ /* ------------------------------------------------------------------------------------------------------*/ /** * Basislayout * @section base-layout */ /** * Dokument * * Definiert den Hintergrund für den Header, die Navigation und den Content */ body { background: #f7f7f7 url(../img/bg.gif) repeat-x; } /** * Page * * Die Page umfasst alle Elemenmte um sie horizontal im Viewport zu zentrieren */ #page { margin: auto; width: 940px; } /* ------------------------------------------------------------------------------------------------------*/ /** * Der Kopf * @subsection head */ /** * Head * * Der Head hat die Höhe bis einschließlich der weißen Linie unten */ #head { height: 84px; } /** * Logo */ #logo { background: url(../img/sprites.png) no-repeat 0px -311px; display: block; height: 0px !important; height /**/:62px; overflow: hidden; margin: 10px 0 0 0; padding: 62px 0 0 0; width: 142px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Die Spalten * @subsection cols */ /** * Die linke Spalte ist der Contentbereich */ #cols .box_lft { width: 629px; } /** * Die rechte Spalte ist der Sidebarbereich */ #cols .box_rgt { width: 300px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Der Foot * @subsection foot */ /** * Foot */ #foot { background:url(../img/foot_bg.gif) repeat-x; height: 25px; overflow: hidden; padding: 15px 0 0 0; width: 100%; } /** * Foot inner wrap */ #foot div { margin: auto; overflow: hidden; width: 940px } /** * Foot left */ #foot div.box_lft { color: #454545; font: 500 10px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; overflow: hidden; width: 550px; } /** * Foot right list */ #foot div.box_rgt { width: 350px; } /** * Foot right item */ #foot div.box_rgt ul li { border-right: 1px solid #454545; display: block; float: left; padding: 0 5px 0 5px; } /** * Foot right first,last */ #foot div.box_rgt ul li.fst, #foot div.box_rgt ul li.lst { border: 0; } /** * Foot right link */ #foot div.box_rgt ul li a { color: #454545; font: 500 10px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; text-decoration: none; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Das Filtermenü Oben mit den Dropdowns und der Suche * @section filter */ /** * Dropdowns und Suche */ #find { height: 41px; } /** * Filteroptionen */ #find ul {} /** * Dropdown */ #find ul li.drop_down a.btn { background: url(../img/sprites.png) repeat-x 0px -547px; color: #454545; cursor: pointer; display: block; font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; height: 23px; float: left; margin: 0 10px 0 0; padding: 8px 0 0 10px; text-decoration: none; width: 192px; } /** * Dropdown */ #find ul li.drop_down a.noBtn { visibility: hidden!important; } /** * Suche - UI */ #find ul li#find_col { background: url(../img/sprites.png) repeat-x 0px -610px; display: block; float: left; height: 31px; width: 300px; } /** * Suche - Input */ #find ul li#find_col #find_inp { border: 0; background: transparent; color: #454545; font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; height: 23px; outline: 0; padding: 8px 0 0 10px; width: 265px; } /** * Dropdown active */ #find ul li.drop_down a.open { background-position: 0px -579px; } /** * Alle Menüeinträge */ ul#find_menu li { list-style: none; margin: 0; } /** * Alle Menülinks */ ul#find_menu li a { color: #454545; display: block; font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; padding: 10px; text-decoration: none; } /** * Alle Menülinks:hover oder offene Menüs */ #find_menu li a:hover, #find_menu li a.open { background: #bac4e5; } /* MENÜS: Wenn Menütyp (base_menu oder sub_menu) bekannt und Menüstyle (double oder single bei base_menu) unbekannt dann mittels Menütyp selektieren: z.B. #find_menu ul.base_menu => Anonymer Style, bekannter Type => Menü wird generisch deklariert, für alle Styles des bekannten Types nutzbar Wenn Menütyp (base_menu oder sub_menu) unbekannt aber Menüstyle (double oder single bei base_menu) bekannt dann mittels Menüstyle selektieren: z.B. #find_menu ul.single => Bekannter Style, daraus ableitender Type: base_menu da single ein base_menu Style ist. => Spezifischer Menüstyle wird deklariert Wenn Menütyp (base_menu oder sub_menu) bekannt und Menüstyle (double oder single bei base_menu) bekannt dann mittels Menüstyle selektieren: z.B. #find_menu ul.single => Bekannter Style, daraus ableitender Type: base_menu da single ein base_menu Style ist => Spezifischer Menüstyle wird deklariert Wenn weder Menütyp noch Menüstyle bekannt sind dann mittels Element selektieren: z.B. #find_menu ul => Anonymes Menü => Element wird unabhängig von Style und Type deklariert, für alle nutzbar */ /** * Ein Menü * * Menutype: ? * Menustyle: ? */ #find_menu ul { display: none; position: absolute; top: 0; z-index: 9999; } /** * Ein Menüeintrag * * Menutype: ? * Menustyle: ? */ #find_menu ul li { border: 1px solid #b1b7ca; border-bottom: 0; background: #fff; float: left; } /** * Ein double-base_menu * * Menutype: base_menu * Menustyle: double */ #find_menu ul.double { width: 404px; } /** * Einträge in einem double-base_menu * * Menutype: base_menu * Menustyle: double */ #find_menu ul.double li { width: 200px; } /** * Ein single-base_menu * * Menutype: base_menu * Menustyle: single */ #find_menu ul.single { width: 204px; } /** * Einträge in einem single-base_menu * * Menutype: base_menu * Menustyle: single */ #find_menu ul.single li { width: 200px; } /** * Ungerade Einträge - rechte Spalte eines double-base_menu * * Menutype: base_menu * Menustyle: double */ #find_menu ul.double li.odd { border-left: 0; } /** * Erster linker Eintrag in einem double-base_menu * * Menutype: base_menu * Menustyle: double */ #find_menu ul.double li.fst_l { border-top-left-radius: 5px; -moz-border-radius-topleft: 5px;Im -webkit-border-top-left-radius: 5px; } /** * Erster rechter Eintrag in einem double-base_menu * * Menutype: base_menu * Menustyle: double */ #find_menu ul.double li.fst_r { border-top-right-radius: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; } /** * Letzter linker Eintrag in einem double-base_menu * * Menutype: base_menu * Menustyle: double */ #find_menu ul.double li.lst_l { border-bottom: 1px solid #b1b7ca; border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; } /** * Erster rechter Eintrag in einem double-base_menu * * Menutype: base_menu * Menustyle: double */ #find_menu ul.double li.lst_r { border-bottom: 1px solid #b1b7ca; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; } /** * Erster Eintrag in einem single-base_menu * * Menutype: base_menu * Menustyle: single */ #find_menu ul.single li.fst { border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; border-top-right-radius: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; } /** * Letzter Eintrag in einem single-base_menu * * Menutype: base_menu * Menustyle: single */ #find_menu ul.single li.lst { border-bottom: 1px solid #b1b7ca; border-left: 1px solid #b1b7ca; border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; } /** * Einträge in einem sub_menu * * Menutype: sub_menu * Menustyle: sub_menu_default */ #find_menu ul.base_menu li ul.sub_menu li { background: #cfd5ed; width: 300px!important; } /** * Erster Eintrag in einem sub_menu * * Menutype: sub_menu * Menustyle: sub_menu_default */ #find_menu ul.base_menu li ul.sub_menu li.fst { border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; border-top-right-radius: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; } /** * Letzter Eintrag in einem sub_menu * * Menutype: sub_menu * Menustyle: sub_menu_default */ #find_menu ul.base_menu li ul.sub_menu li.lst { border-bottom: 1px solid #b1b7ca; border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Sidebar * @section sidebar-generic * * Generische Elemente in der rechten Sidebar */ /** * Ein Rectangle Werbemittel in der Sidebar */ #cols .box_rgt .ad_rec { background: #fff; height: 250px; margin: 0 0 10px 0; width: 300px; } /** * Sidebar box */ #cols .box_rgt .box { margin: 0 0 10px 0; } /** * Sidebar box headline */ #cols .box_rgt .box strong { background: url(../img/sprites.png) 0px -641px no-repeat; color: #454545; display: block; font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 33px; padding: 0 0 0 11px; width: 300px; } /** * Sidebar box headline */ #cols .box_rgt .box a { color: #454545; text-decoration: none } /** * Textcontent in Box */ #cols .box_rgt .box .content { background: #efefef; border: 1px solid #828282; border-top: 0; border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; color: #454545; padding: 11px; } /** * Textcontent Überschrift */ #cols .box_rgt .box .content h4 { font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; } /** * Textcontent Absatz */ #cols .box_rgt .box .content p { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 15px; margin: 0 0 10px 0; } /** * Navigation in Box */ #cols .box_rgt .box ul li { background: #efefef; border: 1px solid #828282; border-top: 0; } /** * Navigation in Box: letzer Eintrag */ #cols .box_rgt .box ul li.lst { border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; } /** * Navigations Links */ #cols .box_rgt .box ul li a { color: #454545; display: block; font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 27px; text-decoration: none; padding: 0 0 0 11px; width: 287px; } /** * Navigations RSS */ #cols .box_rgt .box ul li a .rss { float: left; margin: 7px 10px 0 0; } /** * Alle Menülinks:hover oder offene Menüs */ #cols .box_rgt .box ul#cat_menu li a:hover, #cols .box_rgt .box ul#cat_menu li a.open { background: #bac4e5 } /** * Erstes Submenü - LEVEL 1 */ #cols .box_rgt .box #cat_menu ul { display: none; position: absolute; top: 0; width: 150px; z-index: 9999; } /** * Eintrag im ersten Submenü - LEVEL 1 */ #cols .box_rgt .box #cat_menu ul li { background: #cfd5ed; } /** * Links im ersten Submenü - LEVEL 1 */ #cols .box_rgt .box #cat_menu ul li a { width: 137px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Content * @section content-generic * * Generische Elemente im Content */ /* ------------------------------------------------------------------------------------------------------*/ /** * Basis Box * @subsection base-box */ /** * Box */ #cols .box_lft .box { background: #f7f7f7; border: 1px solid #828282; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #454545; margin: 0 0 11px 0; overflow: hidden; padding: 11px; width: 605px; /* 629 - 1 - 11 - 1 - 11*/ } /** * Box Absatz Überschriften */ #cols .box_lft .box h1, #cols .box_lft .box h2, #cols .box_lft .box h3, #cols .box_lft .box h4, #cols .box_lft .box h5, #cols .box_lft .box h6 { font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; margin: 0 0 6px 0; } /** * Box Absatz */ #cols .box_lft .box p { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 15px; } /** * Box Absatz Links */ #cols .box_lft .box p a { color: #566FA2; text-decoration: none; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Werbemittel * @subsection ad-box */ /** * Box */ #cols .box_lft .ad_box { background: #f7f7f7; border: 1px solid #828282; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #454545; margin: 0 0 11px 0; overflow: hidden; padding: 11px; width: 605px; /* 629 - 1 - 11 - 1 - 11*/ } /** * Anzeige Überschrift */ #cols .box_lft .ad_box strong.head { font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; margin: 0 0 6px 0; } /** * Anzeige wrap */ #cols .box_lft .ad_box div { margin: 2px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Benannte Box * @subsection named-box */ /** * Box */ #cols .box_lft .named_box { background: #f7f7f7; border: 1px solid #828282; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #454545; list-style: none; margin: 0 0 11px 0; overflow: hidden; width: 629px; } /** * Boxenbezeichner */ #cols .box_lft .named_box .nb_head { background: #efefef; border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; border-top-right-radius: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; padding: 0 0 0 5px; } /** * Boxenüberschrift */ #cols .box_lft .named_box .nb_head h1, #cols .box_lft .named_box .nb_head h2, #cols .box_lft .named_box .nb_head h3, #cols .box_lft .named_box .nb_head h4, #cols .box_lft .named_box .nb_head h5, #cols .box_lft .named_box .nb_head h6 { font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 23px; } /** * Boxeninhalt */ #cols .box_lft .named_box .nb_content { padding: 11px; } /** * Box Überschriften */ #cols .box_lft .named_box .nb_content h1, #cols .box_lft .named_box .nb_content h2, #cols .box_lft .named_box .nb_content h3, #cols .box_lft .named_box .nb_content h4, #cols .box_lft .named_box .nb_content h5, #cols .box_lft .named_box .nb_content h6 { font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; margin: 0 0 6px 0; } /** * Box Absatz */ #cols .box_lft .named_box .nb_content p { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 15px; margin: 0 0 10px 0; } /** * Box Absatz Links */ #cols .box_lft .named_box .nb_content p a { color: #566FA2; text-decoration: none; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * itunesLinkButton box * @subsection itunesLinkButton */ /** * Nach zwei Layout Elemente auf der Appseite wird diese Box mit dem iTunes-Link angezeigt */ #cols .box_lft .itunesLinkButton_box { background: #f7f7f7; border: 1px solid #828282; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #454545; list-style: none; margin: 0 0 11px 0; overflow: hidden; padding: 11px; width: 605px; /* 629 - 1 - 11 - 1 - 11*/ } /** * Der iTunes Button */ #cols .box_lft .itunesLinkButton_box a { background: url(../img/sprites.png) no-repeat -164px -239px; cursor: pointer; display: block; height: 0px !important; height /**/:34px; margin: 0 auto 0 auto; overflow: hidden; padding: 34px 0 0 0; width: 314px; } /** * Der iTunes Button */ #cols .box_lft .itunesLinkButton_box a:hover { background-position: -164px -203px; } /** * Der iTunes Button */ #cols .box_lft .itunesLinkButton_box a:active { background-position: -164px -203px; bottom: -1px; position: relative; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * partnerLinkButton box * @subsection partnerLinkButton */ /** * Nach zwei Layout Elemente auf der Appseite wird diese Box mit dem iTunes-Link angezeigt */ #cols .box_lft .partnerLinkButton_box { background: #f7f7f7; border: 1px solid #828282; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #454545; list-style: none; margin: 0 0 11px 0; overflow: hidden; padding: 11px; width: 605px; /* 629 - 1 - 11 - 1 - 11*/ } /** * Der iTunes Button */ #cols .box_lft .partnerLinkButton_box a { background: url(../img/holdirdeinappwidget01.gif) no-repeat; cursor: pointer; display: block; height: 0px !important; height /**/:34px; margin: 0 auto 0 auto; overflow: hidden; padding: 34px 0 0 0; width: 265px; } /** * Der iTunes Button */ #cols .box_lft .partnerLinkButton_box a:hover { background: url(../img/holdirdeinappwidget02.gif) no-repeat; } /** * Der iTunes Button */ #cols .box_lft .partnerLinkButton_box a:active { background: url(../img/holdirdeinappwidget02.gif) no-repeat; bottom: -1px; position: relative; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Image box * @subsection img-box */ /** * Image gallery */ #cols .box_lft .img_gal { background: #f7f7f7; border: 1px solid #828282; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-top: 0; border-top-left-radius: 0px; -moz-border-radius-topleft: 0px; -webkit-border-top-left-radius: 0px; border-top-right-radius: 0px; -moz-border-radius-topright: 0px; -webkit-border-top-right-radius: 0px; color: #454545; list-style: none; margin: 0 0 11px 0; overflow: hidden; width: 627px; /* 629 - 1 - 11 - 1 - 11*/ } /** * Image gallery item */ #cols .box_lft .img_box .img_gal ol li { display: none; width: 501px; text-align: center; padding: 11px 0 11px 0; } /** * Image gallery items */ #cols .box_lft .img_box .img_gal ol { display: block; float: left; width: 501px; } /** * Image gallery prev-next */ #cols .box_lft .img_box .img_gal .prev, #cols .box_lft .img_box .img_gal .next { background: #f7f7f7; cursor: pointer; display: block; float: left; width: 62px; } /** * Image gallery prev */ #cols .box_lft .img_box .img_gal .prev { border-right: 1px solid #828282; border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; } /** * Image gallery next */ #cols .box_lft .img_box .img_gal .next { border-left: 1px solid #828282; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; } /** * Image gallery prev-next hover */ #cols .box_lft .img_box .img_gal .prev:hover, #cols .box_lft .img_box .img_gal .next:hover { background-color: #cfd5ed; } /** * Image gallery prev/next arr */ #cols .box_lft .img_box .img_gal .prev span, #cols .box_lft .img_box .img_gal .next span { background: url(../img/sprites.png) no-repeat top left; display: block; height: 31px; margin: 60px 20px 20px 20px; width: 19px; } /** * Image gallery prev arr */ #cols .box_lft .img_box .img_gal .prev span { background-position: -164px -104px; } /** * Image gallery prev arr:hovver */ #cols .box_lft .img_box .img_gal .prev:hover span { background-position: -164px -72px; } /** * Image gallery next arr */ #cols .box_lft .img_box .img_gal .next span { background-position: -184px -104px; } /** * Image gallery prev arr:hover */ #cols .box_lft .img_box .img_gal .next:hover span { background-position: -184px -72px; } /** * Image box head */ #cols .box_lft .img_box .img_head { background: url(../img/sprites.png) no-repeat 0px -674px; height: 23px; width: 629px; padding: 10px 0 0 0; } /** * Image box head img-items */ #cols .box_lft .img_box .img_head ol { margin: auto; } /** * Image box head img-item */ #cols .box_lft .img_box .img_head ol li a { background: url(../img/sprites.png) no-repeat -176px -59px; display: block; float: left; height: 0px !important; height /**/:11px; margin: 0 2px 0 2px; overflow: hidden; padding: 11px 0 0 0; width: 11px; } /** * Imagebox head img-item hover / active */ #cols .box_lft .img_box .img_head ol li a:hover, #cols .box_lft .img_box .img_head ol li.act a { background-position: -164px -59px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Video Box * @subsection video-box */ /** * Box */ #cols .box_lft .video_box { background: #f7f7f7; border: 1px solid #828282; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #454545; list-style: none; margin: 0 0 11px 0; overflow: hidden; padding: 11px; width: 605px; /* 629 - 1 - 11 - 1 - 11*/ } /** * Box Absatz Überschriften */ #cols .box_lft .video_box h1, #cols .box_lft .video_box h2, #cols .box_lft .video_box h3, #cols .box_lft .video_box h4, #cols .box_lft .video_box h5, #cols .box_lft .video_box h6 { font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; margin: 0 0 6px 0; } /** * Video Object */ #cols .box_lft .video_box .video, #cols .box_lft .video_box object { height: 413px; margin: 0 auto 10px auto; width: 510px; } /** * Videobeschreibung */ #cols .box_lft .video_box p { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 15px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Applikationsliste * @subsection applist * * Die Liste mit den Apps */ /** * Ein Eintrag in einer Appliste */ #cols .box_lft #app_list li.item { background: #f7f7f7; border: 1px solid #828282; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; list-style: none; margin: 0 0 11px 0; overflow: hidden; width: 629px; } /** * Die Metainformationen in der linken Spalte des Appeintrages */ #cols .box_lft #app_list li .meta { border-right: 1px solid #828282; float: left; height: 114px; padding: 11px; text-align: center; width: 98px; } /** * Die Bewertung in Sternform */ #cols .box_lft #app_list li .meta .stars { margin: 10px auto 5px auto; } /** * Die Bewertungsliste mit den Sternen */ #cols .box_lft #app_list li .meta .stars ul { margin: 0 auto 0 auto; } /** * Die Bewertung in Textform */ #cols .box_lft #app_list li .meta .star_val { color: #454545; font: 500 9px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; } /** * Die Informationen in der rechten Spalte des Appeintrages */ #cols .box_lft #app_list li .data { background: #f8f9fd url(../img/item_bg.gif) top left repeat-x; border-top-right-radius: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; height: 114px; overflow: hidden; padding: 11px 0 11px 11px; width: 496px; } /** * Die Kurzbeschreibung und weitere Metainfos */ #cols .box_lft #app_list li .data .box_lft { width: 410px; } /** * Der Appname * * Kann H2 (in der Liste) oder H1 (auf der Einzelseite) sein * */ #cols .box_lft #app_list li .data .box_lft h2, #cols .box_lft #app_list li .data .box_lft h1 { margin: 0 0 10px 0; } /** * Der verlinkte Appname * * Kann H2 (in der Liste) oder H1 (auf der Einzelseite) sein * */ #cols .box_lft #app_list li .data .box_lft h2 a, #cols .box_lft #app_list li .data .box_lft h1 a { color: #454545; font: 600 13px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; text-decoration: none; } /** * Die Kurzbeschreibung */ #cols .box_lft #app_list li .data .box_lft p { color: #454545; font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 15px; height: 55px; } /** * Die weiteren Informationen */ #cols .box_lft #app_list li .data .box_lft .sub_meta { overflow: hidden; } /** * Erste Zeile: Der Hersteller */ #cols .box_lft #app_list li .data .box_lft .sub_meta p { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; height: auto; } /** * Der verlinkte Herstellername */ #cols .box_lft #app_list li .data .box_lft .sub_meta p a { color: #566fa2; text-decoration: none; } /** * Die linke Spalte der zweiten Zeile mit den weiteren Informationen */ #cols .box_lft #app_list li .data .box_lft .sub_meta .box_lft { width: 140px; padding: 10px 0 0 0; } /** * Die Größe */ #cols .box_lft #app_list li .data .box_lft .sub_meta .box_lft p { font-size: 10px; } /** * Die rechte Spalte der zweiten Zeile mit den weiteren Informationen */ #cols .box_lft #app_list li .data .box_lft .sub_meta .box_rgt { padding: 10px 0 0 0; width: 190px; } /** * Die letzet Änderung */ #cols .box_lft #app_list li .data .box_lft .sub_meta .box_rgt p { font-size: 10px; text-align: right; } /** * Die rechte Spalte des Appeintrages mit den Interaktionsflächen */ #cols .box_lft #app_list li .data .box_rgt { padding: 0 11px 0 0; width: 70px; } /** * Die Preisangabebox */ #cols .box_lft #app_list li .data .box_rgt .price { background: #bbc4e5; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #34456c; display: block; height: 12px; margin: 0 0 10px 0; padding: 10px; text-align: center; width: 48px; } /** * Die Preisangabebox */ #cols .box_lft #app_list li .data .box_rgt .price span { font: 600 13px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; } /** * Basis CSS der Badges */ #cols .box_lft #app_list li .data .box_rgt .badge { background: url(../img/sprites.png) no-repeat; height: 62px; margin: -21px 0 0 27px; position: absolute; width: 62px; z-index: 1337; } /** * New-Badge */ #cols .box_lft #app_list li .data .box_rgt .new { background-position: 0 -248px; } /** * $ Raise-Badge */ #cols .box_lft #app_list li .data .box_rgt .priceraise { background-position: 0px -186px; } /** * $ Drop-Badge */ #cols .box_lft #app_list li .data .box_rgt .pricedrop { background-position: 0px -62px; } /** * Update-Badge */ #cols .box_lft #app_list li .data .box_rgt .update { background-position: 0px -124px; } /** * Free-Badge */ #cols .box_lft #app_list li .data .box_rgt .free { background-position: 0px 0px; } /** * Paid-Badge */ #cols .box_lft #app_list li .data .box_rgt .paid { background-position: -1337px 0px; } /** * Der Knopf um die App zu kaufen/herunterladen */ #cols .box_lft #app_list li .data .box_rgt .paid_buy_btn, #cols .box_lft #app_list li .data .box_rgt .free_buy_btn, #cols .box_lft #app_list li .data .box_rgt .na_btn { background: url(../img/sprites.png) top left no-repeat; display: block; height: 0px !important; height /**/:69px; overflow: hidden; padding: 69px 0 0 0; width: 68px; } /** * Der Knopf um die App zu kaufen */ #cols .box_lft #app_list li .data .box_rgt .paid_buy_btn { background-position: -74px 0px; } /** * Der Knopf um die App zu herunterladen */ #cols .box_lft #app_list li .data .box_rgt .free_buy_btn { background-position: -74px -138px; } /** * App nicht verfügbar */ #cols .box_lft #app_list li .data .box_rgt .na_btn { background-position: -301px 0px; } /** * Der Knopf um die App zu kaufen hover */ #cols .box_lft #app_list li .data .box_rgt .paid_buy_btn:hover { background-position: -74px -69px; } /** * Der Knopf um die App zu herunterladen hover */ #cols .box_lft #app_list li .data .box_rgt .free_buy_btn:hover { background-position: -74px -207px; } /** * Der Knopf um die App zu kaufen active */ #cols .box_lft #app_list li .data .box_rgt .paid_buy_btn:active { background-position: -74px -69px; bottom: -1px; position: relative; } /** * Der Knopf um die App zu herunterladen active */ #cols .box_lft #app_list li .data .box_rgt .free_buy_btn:active { background-position: -74px -207px; bottom: -1px; position: relative; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Pagination * @subsection pagination * * Seitenpaginierung */ /** * Pagination */ #cols .box_lft .pagination { color: #454545; overflow: hidden; margin: 0 0 10px 0; } /** * Linke Spalte der Pagination */ #cols .box_lft .pagination .box_lft { width: 50%; } /** * Rechte Spalte der Pagination */ #cols .box_lft .pagination .box_rgt { width: 50%; text-align: right; overflow: hidden; } /** * Next/Prev */ #cols .box_lft .pagination .box_rgt .next, #cols .box_lft .pagination .box_rgt .prev { background: url(../img/sprites.png) no-repeat; display: block; float: right; height: 0px !important; height /**/:29px; margin: 0 5px 0 5px; overflow: hidden; padding: 29px 0 0 0; width: 68px; } /** * Prev */ #cols .box_lft .pagination .box_rgt .prev { background-position: -164px -29px; } /** * Prev:hover */ #cols .box_lft .pagination .box_rgt .prev:hover { background-position: -232px -29px; } /** * Next */ #cols .box_lft .pagination .box_rgt .next { background-position: -164px 0px; } /** * Next:hover */ #cols .box_lft .pagination .box_rgt .next:hover { background-position: -232px 0px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Table * @subsection pagination * * Seitenpaginierung */ /** * Smalltable */ #cols .box_lft table { background: #efefef; border-spacing: 0px; border: 1px solid #828282; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin: 0 0 10px 0; width: 100%; } /** * Tabellenzelle */ #cols .box_lft table thead th, #cols .box_lft table tfoot td, #cols .box_lft table tbody td { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; padding: 4px; } /** * Tabellenüberschrift */ #cols .box_lft table caption { font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; margin: 0 0 7px 0; } /** * Tabellenzellenüberschrift */ #cols .box_lft table thead th { font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; } /** * Bewertung als Sterne */ #cols .box_lft table tbody td.star_1 span, #cols .box_lft table tbody td.star_2 span, #cols .box_lft table tbody td.star_3 span, #cols .box_lft table tbody td.star_4 span, #cols .box_lft table tbody td.star_5 span { background: url(../img/sprites.png) no-repeat 0px 0px; display: block; height: 0px !important; height /**/:13px; overflow: hidden; padding: 13px 0 0 0; width: 80px; } /** * Linke Spalte */ #cols .box_lft table thead th.typ_rgt, #cols .box_lft table tbody td.typ_rgt { padding-right: 15px; } /** * Bewertung als Sterne: Bewertung 1 */ #cols .box_lft table tbody td.star_1 span { background-position: 0 -470px; } /** * Bewertung als Sterne: Bewertung 2 */ #cols .box_lft table tbody td.star_2 span { background-position: 0 -486px; } /** * Bewertung als Sterne: Bewertung 3 */ #cols .box_lft table tbody td.star_3 span { background-position: 0 -502px; } /** * Bewertung als Sterne: Bewertung 4 */ #cols .box_lft table tbody td.star_4 span { background-position: 0 -518px; } /** * Bewertung als Sterne: Bewertung 5 */ #cols .box_lft table tbody td.star_5 span { background-position: 0 -534px; } /** * Tabellenergebnis */ #cols .box_lft table tfoot td { border-top: 1px solid #828282; font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; } /*
------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * generic elements * @section generic-elements * * Generische Elemente */ .rss { background: url(../img/sprites.png) no-repeat -210px -547px; display: block; height: 0px !important; height /**/:12px; overflow: hidden; padding: 21px 0 0 0; width: 12px; } /* ------------------------------------------------------------------------------------------------------*/ /** * star-rating * @subsection star-rating * * Sternenbewertung */ /** * Standard Bewertung */ .rating, .fav { width: 80px; height: 16px; margin: 0 0 20px 0; padding: 0; list-style: none; clear: both; position: relative; background: url(../img/sprites.png) no-repeat 0 -374px; } /** * Als Favorit markieren */ .fav { width: 16px; } /** * Keine Bewertung - 0 Sterne */ .star_0 { background-position: 0 -374px; } /** * 1 Stern */ .star_1 { background-position: 0 -389px; } /** * 2 Sterne */ .star_2 { background-position: 0 -405px; } /** * 3 Sterne */ .star_3 { background-position: 0 -421px; } /** * 4 Sterne */ .star_4 { background-position: 0 -437px; } /** * 5 Sterne */ .star_5 { background-position: 0 -453px; } /** * Stern */ ul.rating li, ul.fav li { cursor: pointer; /*ie5 mac doesn't like it if the list is floated\*/ float: left; /* end hide*/ text-indent: -999em; } /** * Ajax Indikator */ ul.rating li.indicator { display: none; float: right; text-indent: 0; position: relative; left: 18px; } /** * Zu setzende Bewertung */ ul.fav li a, ul.rating li a { position: absolute; left: 0; top: 0; width: 16px; height: 16px; text-decoration: none; z-index: 200; } /** * Gesetzte Bewertung */ ul.rating li span, ul.fav li span { text-decoration: none; position: absolute; width: 16px; height: 16px; } /** * 1 Stern Link */ ul.fav li.s_1 a, ul.rating li.s_1 a { left: 0; -moz-outline: none; } /** * 2 Sterne Link */ ul.rating li.s_2 a { left: 16px; -moz-outline: none; } /** * 3 Sterne Link */ ul.rating li.s_3 a { left: 32px; -moz-outline: none; } /** * 4 Sterne Link */ ul.rating li.s_4 a { left: 48px; -moz-outline: none; } /** * 5 Sterne Link */ ul.rating li.s_5 a { left: 64px; -moz-outline: none; } /** * Item hover */ ul.fav li a:hover, ul.rating li a:hover { z-index: 2; width: 80px; height: 13px; overflow: hidden; left: 0; background: url(../img/sprites.png) no-repeat 0 -374px; } /** * Favorit hover */ ul.fav li a:hover { width: 16px; } /** * 1 Stern hover */ ul.fav li.s_1 a:hover, ul.rating li.s_1 a:hover { background-position: 0 -470px; } /** * 2 Sterne hover */ ul.rating li.s_2 a:hover { background-position: 0 -486px; } /** * 3 Sterne hover */ ul.rating li.s_3 a:hover { background-position: 0 -502px; } /** * 4 Sterne hover */ ul.rating li.s_4 a:hover { background-position: 0 -518px; } /** * 5 Sterne hover */ ul.rating li.s_5 a:hover { background-position: 0 -534px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * Content * @section content-specific * * Spezifische Elemente im Content */ /* ------------------------------------------------------------------------------------------------------*/ /** * pingback-box * @subsection pingback-box * * Box mit der Liste der Pingbacks */ /** * Ein Pingbackeintrag */ #ping.box ul li { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 15px; list-style: none; margin: 0 0 7px 0; overflow: hidden; } /** * Ein Pingbacklink */ #ping.box ul li a { color: #566FA2; font-weight: 600; padding: 0 0 0 10px; text-decoration: none; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * review-box * @subsection pingback-box * * Box mit den User Berichten */ /** * Bericht */ #review.named_box .nb_content ul li { list-style: none; margin: 0 0 20px 0; } /** * Letzer Bericht */ #review.named_box .nb_content ul li.lst { margin: 0; } /** * Verfasser + Datum */ #review.named_box .nb_content ul li .r_head { margin: 0 0 5px 0; overflow: hidden; } /** * Verfasser */ #review.named_box .nb_content ul li .r_head .box_lft { font: 600 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; width: 485px; } /** * Datum */ #review.named_box .nb_content ul li .r_head .box_rgt { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; text-align: right; width: 100px; } /** * Bericht */ #review.named_box .nb_content ul li .r_content p { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; line-height: 15px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * rating-box * @subsection rating-box * * Box mit den User-Bewertungen */ /** * Bewertungen */ #rating.named_box .nb_content { overflow: hidden; } /** * Bewertungen Aktulle/Durchschnitt */ #rating.named_box .nb_content .box_lft, #rating.named_box .nb_content .box_rgt { width: 48%; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * info-box * @subsection info-box * * Box mit den Infos zu dem App */ /** * Links */ #info.named_box .nb_content dl.links { overflow: hidden; } /** * Linkart */ #info.named_box .nb_content dl.links dt { display: block; font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; float: left; width: 120px; } /** * Linkeintrag */ #info.named_box .nb_content dl.links dd { display: block; font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; float: left; width: 380px; margin: 0 0 7px 0; } /** * Linkeintrag link */ #info.named_box .nb_content dl.links dd a { color: #566FA2; font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; text-decoration: none; } /** * Altersinformation */ #info.named_box .nb_content .age_info { overflow: hidden; } /** * Altersinformation Beschreibung */ #info.named_box .nb_content .age_info .age_desc { width: 400px; } /** * Altersinformation Zahl */ #info.named_box .nb_content .age_info .age { color: #34456c; background: #bbc4e5; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; font: 600 26px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; height: 42px; margin: 0 0 0 25px; padding: 8px 0 2px 0; text-align: center; width: 52px; } /** * Versions und Preishistorie */ #info.named_box .nb_content .history { overflow: hidden; } /** * Bewertungen Aktulle/Durchschnitt */ #info.named_box .nb_content .history .box_lft, #info.named_box .nb_content .history .box_rgt { width: 48%; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * partner-page * @subsection partner-page * * Die Partner Bannerseite */ /** * Options verstecken */ #banner.named_box .nb_content #banner_config .inp_radio { visibility: hidden; height: 0; } /** * Fieldset */ #banner.named_box .nb_content #banner_config fieldset { font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; border: 0; margin: 0 0 20px 0; } /** * Banner */ #banner.named_box .nb_content #banner_list { margin: auto; width: 495px; } /** * Bannerlist item */ #banner.named_box .nb_content #banner_list li { float: left; } /** * Bannerumbrüche */ #banner.named_box .nb_content #ban_4, #banner.named_box .nb_content #ban_6, #banner.named_box .nb_content #ban_8 { clear: both; } /** * Banner */ #banner.named_box .nb_content #banner_list li label { background-color: transparent; background-repeat: no-repeat; background-position: center center; border: 1px solid transparent; cursor: pointer; display: block; padding: 5px; } /** * Navigationsteps */ #banner.named_box .nb_content #banner_config #step_nav { border-bottom: 1px solid #ccc; margin: 0 0 15px 0; padding: 0 0 5px 0; } /** * Manufacturer */ #banner.named_box .nb_content #banner_config label { font-weight: 600; } /** * Selectbox */ #banner.named_box .nb_content #banner_config select { padding: 2px; } /** * Next/Prev Button */ #banner.named_box .nb_content #banner_config #step_nav button { margin: 8px 0 2px 0; } /** * Nav step */ #banner.named_box .nb_content #banner_config #steps li { color: #565656; display: inline; font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; list-style: none; } /** * Active nav step */ #banner.named_box .nb_content #banner_config #steps li.act { font-weight: 600; } /** * nav steps */ #banner.named_box .nb_content ol#steps { width: 545px; margin: auto; } /** * app item */ #banner.named_box .nb_content #apps li { border-bottom: 1px solid #ccc; margin: 0; } /** * app item name */ #banner.named_box .nb_content #apps li label { cursor: pointer; display: block; border: 1px solid transparent; width: 97%; height: 100%; margin: 4px 0 5px 0; padding: 8px; } /** * Ap item inner */ #banner.named_box .nb_content #apps li label span { position: relative; top: -13px; left: 10px; } /** * Bannerprview */ #banner.named_box .nb_content #create_banner { border: 0; background: url(../img/sprites.png) no-repeat -164px -143px; cursor: pointer; display: block; float: right; height: 0px !important; height /**/:29px; margin: 0 5px 0 5px; overflow: hidden; padding: 29px 0 0 0; width: 128px!important; margin: 15px auto 0 auto; } /** * Bannerprview hover */ #banner.named_box .nb_content #create_banner:hover { background-position: -164px -172px; } /** * Banner code */ #banner.named_box .nb_content #banner_code { font-family: Courier, Serif; font-size: 13px; padding: 5px; width: 530px; margin: auto; height: 120px; display: block; } /** * Next/Prev */ #banner.named_box .nb_content #next, #banner.named_box .nb_content #prev { border: 0; background: url(../img/sprites.png) no-repeat; cursor: pointer; display: block; float: right; height: 0px !important; height /**/:29px; margin: 0 5px 0 5px; overflow: hidden; padding: 29px 0 0 0; width: 68px!important; } /** * Prev */ #banner.named_box .nb_content #prev { background-position: -164px -29px; display: none; float: left; } /** * Prev:hover */ #banner.named_box .nb_content #prev:hover { background-position: -232px -29px; } /** * Next */ #banner.named_box .nb_content #next { background-position: -164px 0px; } /** * Next:hover */ #banner.named_box .nb_content #next:hover { background-position: -232px 0px; } /* ------------------------------------------------------------------------------------------------------*/ /* ------------------------------------------------------------------------------------------------------*/ /** * review-page * @subsection review-page * * Das Rezensionsformular */ #user_review fieldset { border: 1px solid #828282; padding: 20px; margin-bottom: 10px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #user_review legend { padding: 0 10px; margin: 0 10px; } #user_review label.left { float: left; padding-top: 3px; width: 100px; } #user_review input.text, #user_review textarea { border: 1px solid #828282; background: #fff; padding: 3px; font: 500 11px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif; } #user_review input.long { width: 450px; } #user_review input.middle { width: 309px; } #user_review input.short { text-align: right; width: 130px; } #user_review textarea { width: 550px; } #user_review textarea#text { height: 150px !important; } #user_review input.submit { border: 0; background: url(../img/sprites.png) no-repeat -294px -143px; cursor: pointer; display: block; float: right; height: 0px !important; height /**/:29px; margin: 0 5px 0 5px; overflow: hidden; padding: 29px 0 0 0; width: 128px!important; margin: 15px auto 15px auto; } #user_review input.submit:hover { background-position: -294px -172px; } p.submission_error { background: yellow; margin: 10px 0; padding: 5px 10px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #user_review img.article_img { border: 1px solid #fff; background: #fff; padding: 3px; cursor: pointer; } #user_review img.act { border: 1px solid #B7B7B7; background: #ccc; } #user_review input.radio { visibility: hidden; height: 0; } #user_review .article_box { float: left; width: 188px; height: auto; overflow: hidden; } #user_review .article_box p { padding: 2px; width: 180px; overflow: hidden; text-align: center; } /* ------------------------------------------------------------------------------------------------------*/ /** * advocate-page * @subsection advocate-page * */ .advocate ul { list-style-type: none; } .advocate .appicon { float:left; width: 50px; height: 50px; margin-right: 10px; } .advocate p.info { padding-bottom: 20px; } /* ------------------------------------------------------------------------------------------------------*/