layout.css

  1. 5.x themes/basic/layout.css
  2. 5.x themes/fp5_clean/layout.css
  3. 5.x themes/classic/layout.css

This is where the CSS directly related to the theme's layout goes. For example, CSS regarding corners of tables, width of page, etc.

File

themes/fp5_clean/layout.css
View source
  1. /**
  2. * @file
  3. * This is where the CSS directly related to the theme's layout goes. For example, CSS regarding
  4. * corners of tables, width of page, etc.
  5. */
  6. @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700);
  7. body
  8. {
  9. font-family: "Open Sans", Arial, Helvetica, sans-serif;
  10. padding: 0;
  11. margin: 0;
  12. background-color: #F2F2F2;
  13. }
  14. /*
  15. * Page top banner
  16. */
  17. .top-banner {
  18. background-color: white;
  19. text-align: center;
  20. width: 100%;
  21. margin: 0;
  22. border: 0;
  23. border-radius: 0;
  24. border-bottom: 1px solid #ccc;
  25. padding-bottom: 20px;
  26. margin-bottom: 20px;
  27. z-index: 9999 !important;
  28. }
  29. /* Don't display if this is a popup! */
  30. .page-is-popup .top-banner {
  31. display: none;
  32. }
  33. /* Tabs & search */
  34. table.tabs-search-table {
  35. width: 820px; /* size of page-content + padding */
  36. display: block;
  37. min-height: 33px;
  38. margin-left: auto;
  39. margin-right: auto;
  40. text-align: left;
  41. border: 0;
  42. border-spacing: 0;
  43. border-collapse: collapse;
  44. background-color: #F2F2F2;
  45. }
  46. /* Are we in a popup window? */
  47. .page-is-popup .tabs-search-table {
  48. width: 90%; /* set to same as page-content in a popup */
  49. }
  50. table.tabs-search-table td {
  51. padding: 0;
  52. margin: 0;
  53. }
  54. table.tabs-table-tabs {
  55. width: 100%;
  56. text-align: left;
  57. border: 0;
  58. border-spacing: 0;
  59. border-collapse: collapse;
  60. }
  61. .tabs-table-tabs td {
  62. padding: 0;
  63. margin: 0;
  64. }
  65. table.tabs-search-table td.search-td {
  66. text-align: right;
  67. width: 100%;
  68. vertical-align: bottom;
  69. padding-right: 30px;
  70. }
  71. .tab_left, .tab_left_i {
  72. display: none;
  73. }
  74. .tab_right, .tab_right_i {
  75. display: none;
  76. }
  77. .active_tab, .inactive_tab {
  78. border-collapse: separate;
  79. position: relative;
  80. top: 4px;
  81. color: #660000;
  82. cursor: default;
  83. border: 0 !important;
  84. border-radius: 0;
  85. padding: 10px 10px 5px 10px;
  86. }
  87. .active_tab {
  88. border-bottom: 3px solid white;
  89. background-color: white;
  90. border-top: 2px solid #ccc !important;
  91. }
  92. .inactive_tab {
  93. position: relative;
  94. top: 4px;
  95. border-bottom: 1px solid #ccc;
  96. color: #666;
  97. }
  98. .inactive_tab_over {
  99. border-collapse: separate;
  100. cursor: pointer;
  101. position: relative;
  102. top: 4px;
  103. border: 0;
  104. border-radius: 0;
  105. color: black;
  106. text-decoration: underline;
  107. padding: 10px 10px 5px 10px;
  108. }
  109. .inactive_tab_over_no_link {
  110. color: #A0A0A0;
  111. cursor: default;
  112. }
  113. .tab_text
  114. {
  115. font-family: Arial, Helvetica, sans serif;
  116. font-size: 0.8em;
  117. }
  118. /* Page content */
  119. .page-content {
  120. width: 800px;
  121. min-height: 400px;
  122. margin-left: auto;
  123. margin-right: auto;
  124. background-color: white;
  125. border: 0;
  126. padding: 20px;
  127. padding-bottom: 50px;
  128. margin-bottom: 2px;
  129. border-radius: 0;
  130. box-shadow: 0px 0px 50px #777;
  131. }
  132. .page-is-popup .page-content {
  133. min-height: 250px;
  134. width: 90%;
  135. }
  136. /* bottom message / footer region */
  137. .fp-bottom-message {
  138. font-size: 0.7em;
  139. width: 100%;
  140. color: white;
  141. background-color: #373B44;
  142. margin-top: 50px;
  143. margin-left: auto;
  144. margin-right: auto;
  145. padding-left: 40px;
  146. padding-top: 20px;
  147. padding-bottom: 40px;
  148. min-height: 70px;
  149. border-top: 1px solid #030304;
  150. }
  151. .page-is-popup .fp-bottom-message {
  152. width: 90%;
  153. margin: 0;
  154. background-color: transparent !important;
  155. min-height: 0;
  156. border-top: 0;
  157. padding: 0;
  158. }
  159. .fp-bottom-message .popup-contact {
  160. display: block;
  161. width: 800px;
  162. margin-left: auto;
  163. margin-right: auto;
  164. }
  165. .fp-bottom-message a {
  166. color: #ccc;
  167. }
  168. .fp-bottom-message a:hover {
  169. color: white;
  170. text-decoration: underline;
  171. }