1 /* ---------- Preview Styles ----------- */
4 float: none !important;
7 background-color: #fff;
8 font-family: Georgia, "Times New Roman", Times, serif;
12 word-wrap: break-word;
15 .color-preview-header {
16 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
23 .color-preview-site-name {
29 margin-left: 15px; /* LTR */
32 [dir="rtl"] .color-preview-site-name {
36 .color-preview-main-menu {
40 .color-preview-main-menu-links a {
42 padding: 0.6em 1em 0.4em;
44 .color-preview-main-menu-links {
49 .color-preview-main-menu-links a {
52 background: rgba(255, 255, 255, 0.7);
53 text-shadow: 0 1px #eee;
54 border-top-left-radius: 8px;
55 border-top-right-radius: 8px;
57 .color-preview-main-menu-links a:hover,
58 .color-preview-main-menu-links a:focus {
60 background: rgba(255, 255, 255, 0.95);
61 text-decoration: none;
64 .color-preview-main-menu-links li a.is-active {
68 .color-preview-main-menu-links li {
70 list-style-type: none;
71 padding: 0.6em 0 0.4em;
73 .color-preview-sidebar,
74 .color-preview-content {
76 float: left; /* LTR */
79 [dir="rtl"] .color-preview-sidebar,
80 [dir="rtl"] .color-preview-content {
83 .color-preview-sidebar {
84 margin-left: 15px; /* LTR */
87 [dir="rtl"] .color-preview-sidebar {
91 .color-preview-content {
92 margin-left: 30px; /* LTR */
95 [dir="rtl"] .color-preview-content {
99 .color-preview-sidebar .preview-block {
104 .color-preview-sidebar h2 {
105 border-bottom: 1px solid #d6d6d6;
111 text-shadow: 0 1px 0 #fff;
113 .color-preview .preview-block .preview-content {
116 .color-preview .preview-block-menu .preview-content,
117 .color-preview .preview-block-menu .preview-content ul {
120 .color-preview-main {
124 .color-preview-page-title {
130 .color-preview-footer-wrapper {
132 color: rgba(255, 255, 255, 0.65);
133 display: block !important;
135 padding: 20px 20px 25px;
137 .color-preview-footer-wrapper a {
139 color: rgba(255, 255, 255, 0.8);
141 .color-preview-footer-wrapper a:hover,
142 .color-preview-footer-wrapper a:focus {
144 color: rgba(255, 255, 255, 0.95);
145 text-decoration: underline;
147 .color-preview-footer-wrapper .preview-footer-column {
149 float: left; /* LTR */
154 [dir="rtl"] .color-preview-footer-wrapper .preview-footer-column {
157 .color-preview-footer-wrapper .preview-block {
158 border: 1px solid #444;
159 border-color: rgba(255, 255, 255, 0.1);
163 .color-preview-footer-columns .preview-block-menu {
168 .color-preview-footer-columns h2 {
169 border-bottom: 1px solid #555;
170 border-color: rgba(255, 255, 255, 0.15);
172 text-transform: uppercase;
174 .color-preview-footer-columns .preview-content {
177 .color-preview-footer-columns .preview-content ul {
178 margin-left: 0; /* LTR */
179 padding-left: 0; /* LTR */
181 [dir="rtl"] .color-preview-footer-columns .preview-content ul {
185 .color-preview-footer-columns .preview-content li {
187 list-style-image: none;
191 .color-preview-footer-columns .preview-content li a {
192 border-bottom: 1px solid #555;
193 border-color: rgba(255, 255, 255, 0.15);
196 padding: 0.8em 2px 0.8em 20px; /* LTR */
199 [dir="rtl"] .color-preview-footer-columns .preview-content li a {
203 .color-preview-footer-columns .preview-content li a:hover,
204 .color-preview-footer-columns .preview-content li a:focus {
205 background-color: #1f1f21;
206 background-color: rgba(255, 255, 255, 0.05);
207 text-decoration: none;