| @media screen and (min-width: $media-size-tablet-start) { |
| footer { |
| padding: $whisk-footer-base-padding-tablet; |
| } |
| |
| #whiskHeader { |
| h1 { |
| font-size: $header-tablet-h1-font-size; |
| font-weight: $header-tablet-h1-font-weight; |
| font-style: $header-tablet-h1-font-style; |
| line-height: $header-tablet-h1-line-height; |
| } |
| h5 { |
| font-size: $header-tablet-h5-font-size; |
| font-weight: $header-tablet-h5-font-weight; |
| font-style: $header-tablet-h5-font-style; |
| line-height: $header-tablet-h5-line-height; |
| } |
| } |
| |
| // "Turn on" left index in this profile, as we have width to support it |
| #whiskIndexedLayout { |
| padding-top: $whisk-header-tablet-padding-top; |
| |
| // Show the index area |
| #whiskIndex { |
| display: block; |
| } |
| |
| // Make room on left for the Index |
| #whiskNodes { |
| display: table-cell; |
| // TODO: make a variable |
| padding-left: $index-menu-width + 40px; |
| } |
| } |
| |
| #whiskNodes { |
| padding-left: $whisk-nodes-padding-tablet-X; |
| padding-right: $whisk-nodes-padding-tablet-X; |
| |
| main { |
| clear: both; |
| display: table; |
| background: $color-bg-tablet-main; |
| position: relative; |
| |
| .content { |
| display: table-cell; |
| vertical-align: top; |
| position: relative; |
| width: $main-content-width-tablet; |
| padding: $whisk-nodes-main-content-padding-tablet; |
| |
| // YYY No top margin needed when content & image-wrapper are horz. |
| //margin-top: 0px; |
| } |
| |
| .image-wrapper { |
| // Alter to a 'block' display to get side-by-side layout |
| display: block; |
| position: relative; |
| |
| // Note: we have a border in side-by-side layout, but do not in vertical layout. |
| border: $color-bg-tablet-image-wrapper-border; |
| } |
| } |
| } |
| } |