Specifics of Amarone page style

Amarone employs two new theme features:

1. Special Fonts Provided Via Google Fonts API
   Amarone requests two fonts (“PT Sans Narrow” and “Open Sans Condensed”, via Google’s Fonts API) to be used within the pages of your site. (Google Fonts allows a wider range of font choices than the generic ones available from the user's system.) However, if you do not want your customers to download the fonts (e.g., for security reasons), you can disable these downloads by deleting the reference
   <link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700|Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
    from the “Page Directives” of the master pages (HorizontalMenu.master, VerticalMenu.master, Blank.master, and Popup.master). If these Google fonts are not available to the pages, the next font-family specified in the stylesheets will be used. (In Amarone’s case, Arial. You may need to reduce the font-size when using Arial, as the current default size was chosen specifically for “PT Sans Narrow” and “Open Sans Condensed”.)
   Also when you create new master page you would need to add this link to the Page Directives section of the Master Page

2. Fixed Header/Menu Banner
   Amarone employs a fixed “header banner” and “horizontal menu”, behind which the page contents scroll, i.e., the header/menu will always be visible and accessible to your user regardless of the amount of page scroll. This requires that the page contents and menus be initially positioned a certain number of pixels down from the top of the page. The default height of the banner is 110px. If your own header banner is a different height, but you may need to override the following styles (via addition to Styles.css):

a.     pBack { /* offset of page content from top */
 margin-top: 120px /* default banner height 110px + header banner/top of content panel margin 10px */}

b.    .MLMmenuAlign { /* offset of horizontal menu from top */
 top: 60px; /* menu positioned below company logo, but still within header banner */}

To change Page Directives right click in the Master page Design area and select Page Directives.

To use vertical menus in Amarone, the following style changes should be made to improve look-and-feel:

1. Since the horizontal menu no longer occupies the header banner, the latter's height should be reduced:
   .pcT {
     height: 30px; /* originally, height: 90px; */ }

2. The menu/page content should be shifted up the same amount that the header banner's height has been reduced:
   .pBack {
       margin-top: 60px; /* originally, height: 120px; */ }

3. Maintain centering of menu/page content:
   .pBack {
      width: 100%; /* originally, width: 1000px; increases page width to accommodate vertical menu */ }
   .pageC {
    /* width: 100%; */ /* comment out to allow vertical menu and page widths to define overall page width */ }
   .pageL {
     /* display: none; */
     width: 50%; /* display left margin (to center menu/page content) */ }
   .pageR {
     /* display: none; */
     width: 50%; /* display right margin (to center menu/page content) */ }