Various style fixes
[snf-cloudcms] / cloudcms / static / cloudcms / css / modules.css
1 body                                                                                    { overflow-y: scroll;}\r
2 \r
3 .wrapper                                        { margin:0 auto; position:relative; width:820px; padding:36px 70px; }\r
4 .container .wrapper,\r
5 .footer .wrapper                                { border: 1px solid #808080; border-top:0 none;}\r
6 .footer .wrapper                                                                { padding:20px 70px 25px; }\r
7 .centered                                       { text-align:center;}\r
8 img.left                                                                { margin:0 1em 1em 0; float:left;}\r
9 img.right                                                               { margin:0 0 1em 1em; float:right;}\r
10 \r
11  \r
12 /* footer */\r
13 .footer                                         { font-size:0.923em;color:#B3B3B3; }\r
14 .footer a                                       { color:#B3B3B3; text-decoration:none; transition:color 0.15s ease-in-out 0s; -moz-transition: color 0.15s ease-in-out 0s;  -webkit-transition: color 0.15s ease-in-out 0s;  -o-transition: color 0.15s ease-in-out 0s; } \r
15 .footer:hover a                                 { color:#808080;}\r
16 .footer a:hover                                 { color:#000;}\r
17 .footer ul                                      { float:left; margin:0 10px 0 0; width:125px;  padding:0;}\r
18 .footer ul li                                   { padding:0; margin:0; list-style:none outside;}\r
19 .footer ul li:first-child                       { margin-bottom:1em;    }\r
20 .footer .clearfix                               { padding-bottom:20px;}\r
21 .footer .clearfix ul:first-child                { margin-left:0;}\r
22 \r
23 \r
24 /*top message*/\r
25 .top-msg                                            { margin:-36px -70px 36px; background:blue; padding:50px; color:#fff; display:none; position:relative; font-size:1.538em; text-align:center;}\r
26 .top-msg p                                                                              { text-align:center; }\r
27 .top-msg p.title                                    { font-size:1.3em;  }\r
28 .top-msg p.title span                           { border-bottom:2px dotted #fff; padding:0 0 10px 0;}\r
29 .top-msg.active                                 { display:block;}\r
30 .top-msg +.mainlogo                             { margin-top:-73px;}\r
31 .top-msg .close                                 { position:absolute; bottom:20px; right:20px; font-size:1.3em; font-weight:bold; border:0 none; color:#fff; text-decoration:none;}\r
32 .top-msg .close:hover                           { color:#000;}\r
33 \r
34 /* container */\r
35 .container .wrapper                             { padding-bottom:100px;}\r
36 .mainlogo h1                                                                    { line-height:100%; font-size:1em; }\r
37 .container .navigation                          { margin:20px 0 0; font-size:1.154em; height:95px;}\r
38 .container .navigation ul                       { margin:5px 0; padding:0;}\r
39 .container .navigation ul + ul                                  { font-size:0.933em; }\r
40 .container .navigation ul li                    { list-style:none outside; padding:0; margin:0 1em 0 0; display:inline-block;}\r
41 .container .navigation ul li a                  { color:#000; text-decoration:none; }\r
42 .container .navigation ul li a:hover            { color:#F89A1C; }      \r
43 .container .navigation ul li.active a           { color:#F89A1C; }                                      \r
44 \r
45 .dotted                                         { background:url(../images/double-dots.jpg) no-repeat bottom center; padding:0 0 30px; margin-bottom:30px;}\r
46 .full-dotted                                                                    { background:url(../images/dots.jpg) repeat-x top; margin-top:20px; padding-top:20px; }\r
47 .full-dotted:first-child                                                { background:none; padding-top:0; margin-top:0; }\r
48 .two-cols .rt                                   { float:right; width:400px;}\r
49 .two-cols .lt                                   { float:left; width:400px;}\r
50 .two-cols-blog .rt                              { float:right; width:220px; margin-left:80px; padding-right:65px;}\r
51 .two-cols-blog .lt                                  { overflow:hidden;}\r
52 .container h2                                                                   { font-weight:700; font-size:1.308em; margin-bottom:1em; }\r
53 .container h3                                                   { font-weight:normal; margin-bottom:1em; }\r
54 .container h2 em                                                                { color: #3582AC; font-style:normal; }\r
55 /*.content a                                                            { border-bottom: 1px solid #F89A1C; text-decoration:none; color:#000; }\r
56 .content a:hover                                                    { border-bottom: 1px solid #F89A1C; text-decoration:none; color:#F89A1C; }*/\r
57 \r
58 \r
59 .content a                                                              { text-decoration:none; }\r
60 .content a:hover                                                    { text-decoration:underline; }\r
61 \r
62 .container ul.options                           { padding:0; margin:0; font-size:1.154em;}\r
63 .container ul.options li                        { list-style:none outside; margin:0 0 1em 0;padding:0;}\r
64 .container ul.options li h3                                             { font-size:1em; margin-bottom:0; }\r
65 .container ul.options li a                                      { border:0 none;}\r
66 .container ul.options li a:hover                                { text-decoration:underline;}\r
67 .container .extra ul.options                                    { font-size:1em; margin:0 ; padding:15px; }\r
68 .landing h2, .landing a:hover                   { color:#01A1AE;}\r
69 .faq h2, .faq a:hover, .faq .current a          { color:#EF4F54; border:0 none;}\r
70 .faq .current a                                                                 { text-decoration:underline }\r
71 .question h2                                                                    { color:#EF4F54 }\r
72 .content .backlink                                                              { margin:1em 0; }\r
73 .faq h3                                                                                 { color:#4085a6; margin:0;}\r
74 .faq ul                                         { padding:0; margin:0; }\r
75 .faq ul li                                      { padding:0; margin:0 0 8px 0; list-style:none outside none;line-height:140%;  }\r
76 .faq ul li a                                    { color:#222222; border:0 none; } \r
77 .faq .faq-category                                                              { margin: 0 0 1.5em;}\r
78 .follow h3 a                                    { color:#4085A6;}\r
79 .follow a                                                       { border:0 none;}\r
80 .follow ul                                      { margin:0; padding:0;}\r
81 .follow ul li                                   { list-style:none outside; padding:0; margin:0 0 20px 0; font-size:0.923em; color:#808080;}\r
82 .follow ul li p.title                           { margin-bottom:0; color:#000;}\r
83 .follow ul li p.title a                         { color:#000;}\r
84 .follow ul li p a                               { color:#808080;}   \r
85 .posts ul                                       { margin:0;padding:0; }\r
86 .posts ul li                                    { padding:0; margin:0 0 50px; list-style:none outside; }\r
87 .posts ul li img                                { max-width:100%; margin-bottom:1em;}\r
88 .posts ul li p.info                             { padding-bottom:10px; margin:20px 0; font-size:0.769em; color:#808080; background:url(../images/dots.jpg) repeat-x bottom ;}\r
89 .article p.info                                                                 { margin-top:20px; padding-top:10px; font-size:0.769em; color:#808080; }\r
90 .article h2, .posts h2                          { color:#ef4f53; }\r
91 .posts h2 a, .posts h2 a:hover                  { border:0 none;color:#ef4f53;}\r
92 .posts p.date, .article p.date                  { margin:0; font-size:1.077em; color:#3582AC; }\r
93 p.info a                                        { color:#808080; border-bottom:0 none; }\r
94 p.info a:hover                                  { color:#000; border-bottom:0 none;}\r
95 .bg-wrap                                        { background-position:right top; background-repeat:no-repeat;}\r
96 .bg-wrap .extra                                 { display:none;}\r
97 .bg-wrap.open .extra                            { display:block;}\r
98 .bg-wrap .extra .hide-extra                     { display:block; text-align:right; border:0 none; height:16px; overflow:hidden;}\r
99 .bg-wrap .extra .hide-extra img                 { margin-top:0; vertical-align:top; display:inline; }\r
100 .bg-wrap .extra .hide-extra:hover img           { margin-top:-32px;}\r
101 .pithos h2,                       \r
102 .pithos .extra .options li h3                   { color:#BC742B; }\r
103 .cyclades h2,                 \r
104 .cyclades .extra .options li h3                 { color:#00A1B0; }\r
105 a.btn_01                                        { display:block; text-align:center; background:#F6921E; color:#000; padding:10px; text-decoration:none; border:0 none;}\r
106 a.btn_01:hover                                  { background:#3582AC; color:#000; text-decoration:none;}\r
107 a.btn_01 em                                     { font-style:normal; display:block; }\r
108 a.btn_01 span                                   { color:#fff; }\r
109 .lt .box-more                                   { text-align:center; padding:5px 10px; }\r
110 .lt .box-more.border                            { border:1px solid #ccc;}\r
111 .lt .box-more p                                 { cursor:pointer; background:url(../images/arrow_02.jpg) no-repeat right center; padding-right:20px; }\r
112 a.btn_01, .box-more                             { width:80%; margin:0 auto 20px; }\r
113 .lt .box-more ul.col                            { width:30%; margin:0; padding:0; vertical-align:top; text-align:left; display:inline-block;}\r
114 .lt .box-more .clearfix                         { display:none; }\r
115 .lt .box-more ul.col li                         { list-style:none outside; }\r
116 .lt .box-more ul.col li a                       { color:#B3B3B3; text-decoration:none; border:0 none;}\r
117 .lt .box-more ul.col li a:hover                 { color:#000;}\r
118 .article img                                                        { margin-bottom:1em; max-width:100%;}\r
119 a.videolink                                                         { border: 0 none; display:block; width:367px; height:207px; background:url(../images/video_image_hover.png) no-repeat; text-decoration:none;}\r
120 a.videolink:hover                                               { background:url(../images/video_image.png)no-repeat; text-decoration:none; border:0 none;}\r
121 .container .full                                                                { position:relative;}\r
122 .container .bottom-bordered                     { border-bottom:1px dashed #000000;margin-bottom:20px }\r
123 .container .lt-div                              { width:234px; float:left; }\r
124 .container .overflow-hidden                     { overflow:hidden;}\r
125 .documentation .wrap                                                    { width:500px; }\r
126 \r
127 \r
128 /* resources*/\r
129 .resources .categories .clear                   { color: #000000; position:relative; top:-1px; line-height:100%; display:inline-block;}\r
130 .resources  a, .resources  a:hover              { border:0 none;}\r
131 .resources .categories ul                           { margin:0;padding:0;}\r
132 .resources .categories ul li                    { float: left; list-style:none outside;}\r
133 .resources .categories .title                   { margin-bottom: 0.5em; }\r
134 .resources .categories ul li a                  { color: #000000;   margin-right: 22px; text-decoration: none; }\r
135 .resources .categories ul li a:hover, \r
136 .resources .categories ul li a.selected         { color: #000000;}\r
137 .resources .categories ul li.active a                   { text-decoration: underline }\r
138 .resources .categories ul li.inactive           { opacity: 0.3; }\r
139 .resources .categories ul li.active             { opacity: 1; }\r
140 .resources .list                                { line-height: 1em; margin-top: 60px; position: relative; margin-right:-35px; }\r
141 .resources .list .resource-wrapper.first .resource      { margin-left: 0; }\r
142 .resources .list .resource-wrapper              { float: left; height: 250px; margin-bottom: 22px; margin-right: 35px; overflow: hidden; position: relative; width: 250px; }\r
143 .resources .list .resource-wrapper.first        { margin-left: 0; }\r
144 .resources .list .resource-wrapper.hidden       { display: none; }\r
145 .resources .list .resource                      { border: 1px solid #000000; height: 188px; overflow: hidden; padding: 30px; }\r
146 .resources .list .resource .date                { color: #808080; margin-bottom: 3px; }\r
147 .resources .list .resource .description         { transition:color top 0.35s ease-in-out 0s; -moz-transition: top 0.35s ease-in-out 0s; -webkit-transition: top 0.35s ease-in-out 0s;   -o-transition: top 0.35s ease-in-out 0s; color: #FFFFFF; font-size: 1.1em; height: 150px; margin-left: -30px; padding: 30px; position: absolute; top: -270px; width: 190px; }\r
148 .resources .list .resource .title               { line-height: 1.4em; }\r
149 .resources .list .resource .category            { color: #808080; margin-top: 30px; }\r
150 .resources .list .resource .category a          { color: #808080; }\r
151 .resources .list .resource .download            { bottom: 0; cursor: pointer; font-size: 1.1em; margin-bottom: 3px; margin-left: -10px; position: absolute; width: 190px; }\r
152 .resources .list .resource .download a          { color: #000000; display: block; padding: 5px 5px 5px 15px; text-decoration: none; }\r
153 .resources .list .resource .download a:hover, \r
154 .resources .list .resource .download a .hovered { color: #FF5D00;}\r
155 .resources .list .resource .download a:hover .download-image, \r
156 .resources .list .resource .download a .hovered .download-image { background-image: url(../images/resource_down_arrow-active.png); }\r
157 .resources .list .resource .download a .download-image { background: url(../images/resource_down_arrow.png) no-repeat; display: block; float: left; height: 30px; margin-right: 10px; margin-top: -7px; width: 30px; }\r
158 .resources .list .resource .download img        { margin-right: 10px; vertical-align: middle;}\r
159 .resources .list .resource:hover .description, \r
160 .resources .list .resource .hover .description { display: block; top: 0; }\r
161 .resources .list .resource-cat-1.resource               { border-color: #4085A5  }\r
162 .resources .list .resource-cat-1.resource .title        { color: #4085A5 }\r
163 .resources .list .resource-cat-1.resource .description  { background-color: #4085A5 }\r
164 .resources  .filter-item a                                                              { display:inline-block; line-height:100%; }\r
165 .resources  .filter-item a:hover                                                { text-decoration:underline }\r
166 .resources .list .resource-cat-2.resource               { border-color: #FF6F00  }\r
167 .resources .list .resource-cat-2.resource .title        { color: #FF6F00  }\r
168 .resources .list .resource-cat-2.resource .description  { background-color: #FF6F00  }\r
169 .resources .list .resource-cat-2.resource .description p{ line-height:130%; }\r
170 \r
171 table                                                                                   { width:80%; color:#B3B3B3;}\r
172 table th, table td                                                              { padding:5px 5px 5px 0;  }1234\r
173 /*table td                                                                              { border-top: 1px solid #DDDDDD; }*/\r
174 table th                                        { color:#222; font-weight:normal;}\r
175 table td.consumed                                                               { color: #9D261D; }\r
176 \r
177 /*.zebra-striped tbody tr:nth-child(2n+1) td, \r
178 .zebra-striped tbody tr:nth-child(2n+1) th              { background-color: #F9F9F9; }*/\r
179 .zebra-striped tbody tr:hover td, \r
180 .zebra-striped tbody tr:hover th                                { color:#000; }\r
181 \r
182 .buttons-list.fixpos                                                    { position:absolute; bottom:0; right:0; }\r
183 .button.back.right                                                              { right: 0; }\r
184 .buttons-list .button                                                   { margin-left: 10px; }\r
185 .button.back                                                                    {  z-index: 500; }\r
186 /* Styles for blue button-like back link\r
187 a.button                                                                                { border:0 none;  color: #FFFFFF;  display: inline-block;  text-align: center; background-color: #3582AC; letter-spacing: 1px;  line-height: 22px; padding: 0.8em 22px; text-decoration: none;}\r
188 a.button:hover                                                                  { background-color: #F89A1C; border:0 none; color:#fff;}*/\r
189 \r
190 /*pagination*/\r
191 .pagination .next-prev                          { float:left; }\r
192 .pagination .nums                               { text-align:right;}\r
193 .pagination .nums span                          { color:#000;}\r
194                     \r
195 .two-cols .lt .clients-wrapper p                                { padding:0; }\r
196 \r
197 \r
198 /* colors for links */\r
199 .container ul.options li a                                              { display:inline-block; line-height:100%; }\r
200 .container ul.options li a:hover                                { text-decoration: none; }\r
201 .container ul.options li a.red                                  { color:#F24E53 }\r
202 .container ul.options li a.red:hover                    { border-bottom:1px solid #F24E53; }\r
203 .container ul.options li a.grey                                 { color:#F89A1C }\r
204 .container ul.options li a.grey:hover                   { border-bottom:1px solid #F89A1C; }\r
205 .container ul.options li a.blue                                 { color:#3582AC }\r
206 .container ul.options li a.blue:hover                   { border-bottom:1px solid #3582AC; }\r
207 \r
208 /* homepage clouds animation */\r
209 #animation                                      { width:94%; height:120px; padding:0 3%; background:url(../images/okeanos_landing.png) no-repeat; max-width:375px; }\r
210 #animation div                                  { margin:0 2%; float:left; width:29%; height:100%; position:relative; }                    \r
211 #animation div a                                { position:absolute; left:0; top:0; border:0 none; }\r
212 #animation div a img                                                    { width:100%; }\r
213 #animation p                                    { position:absolute; bottom:0; left:0; width:100%; text-align:center; }\r
214 #animation p img                                { display:inline-block; width:65%; }\r
215 \r
216 /* Weird bug in pages that contain captcha. An extra iframe appears in chrome :S*/\r
217 .container +iframe                                                              { display:none; }\r
218 \r
219 /* Style for im/projects */\r
220 table.alt-style                                                                 { color:#000; width:100%; }\r
221 table.alt-style caption                                                 { font-weight:normal;  font-size:1.154em; }\r
222 table.alt-style tr th                                                   { font-weight:normal; color:#3582AC }\r
223 table.alt-style tr td                                                   { color:#222; }\r
224 table.alt-style tr td:first-child,\r
225 table.alt-style tr th:first-child                               { padding-left:5px; }\r
226 table.alt-style tr td a                                                 { margin:0 0 0 20px; }\r
227 table.alt-style tr td:first-child a                             { margin:0; }\r
228 .content a.submit                                                               { margin:0; display:inline-block; margin:10px 0 ;  height:auto;}\r
229 table.alt-style tr:nth-child(2n) td                             { background:#F2F2F2 }\r
230 dl.alt-style                                                                    { width:500px; }\r
231 dl.alt-style dt                                                                 { width:50%; float:left; color:#3582AC; font-weight:normal;}\r
232 dl.alt-style dt:nth-child(2n)                                   { background:black; }\r
233 .projects                                                                               { padding-bottom:30px; }\r
234 .projects h2 span                                                               { color:#3582AC;}\r
235 .projects h2 em                                                                 { float:right; }\r
236 .projects h3                                                                    { font-size:1.154em; }\r
237 .projects .submit-rt                                                    { margin:0; text-align:right; }\r
238 .projects +.buttons-list.fixpos                                 { left:0; right:auto; }\r
239 \r
240 /* new faq-userguide styles */\r
241 \r
242 .faq .two-cols .lt                                                              { width:460px; }\r
243 .faq .two-cols .rt                                                              { width:340px; text-align:center; }\r
244 .lt-small .rt                                                                   { width:520px; }\r
245 .lt-small .lt                                                                   { width:280px; }\r
246 .unequal-dotted                                                                 { background:url(../images/double-dots-unequal.jpg) no-repeat top center; padding: 30px 0 0 ; margin-top:30px;}\r
247 .unequal-dotted:first-child                                             { background:none; padding-top:0; margin-top:0; }\r
248 .tirkouaz h2,\r
249 .tirkouaz h2 a,\r
250 .tirkouaz h3,\r
251 .tirkouaz a:hover,\r
252 .tirkouaz li.current a                                                  { color:#00A1B0; }\r
253 .yellow h2,\r
254 .yellow h2 a,\r
255 .yellow h3,\r
256 .yellow a:hover,\r
257 .yellow li.current a                                                    { color:#F6921E; }\r
258 .purple h2,\r
259 .purple h2 a,\r
260 .purple h3,\r
261 .purple a:hover,\r
262 .purple li.current a                                                    { color:#7B499C; }\r
263 .blue h2,\r
264 .blue h2 a,\r
265 .blue h3,\r
266 .blue a:hover,\r
267 .blue li.current a                                                              { color:#3582AC; }\r
268 .brown h2,\r
269 .brown h2 a,\r
270 .brown h3,\r
271 .brown a:hover,\r
272 .brown li.current a                                                             { color:#BC742B; }\r
273 \r
274 .question .content a:hover                                              { color:#F6921E }\r
275 .details .extra-menu                                                    { background: url(../images/dots.jpg) repeat-x  center top ;padding-top:20px; margin-top:20px; }\r
276 .details .extra-menu h3                                                 { margin-bottom:1em; font-weight:bold;}\r
277 .details .faq-category h2                                               { font-size:1em; }\r
278 .question .next-prev                                                    { margin:10px 0; }\r
279 .question .next                                                                 { float:right; }\r
280 .details img                                                                    { max-width:100%; }\r
281 .question .section                                                              { margin-top:1em; }\r
282 .question pre                                                                   { border:1px dashed #000; padding:5px; margin:10px 0; line-height:auto; }\r
283 .widjets                                                                                { margin: 0; padding:0; }\r
284 .widjets li                                                                             { width:50%; float:left; list-style:none outside; margin:30px 0; }\r
285 .widjets li div                                                                 { border:1px dashed #000; padding:20px 20px 70px; width:60%; margin:0 auto; position:relative; }\r
286 .widjets li div img                                                             { max-width:100%; }\r
287 .widjets li .btn                                                                { text-align:center; position:absolute; bottom:0; left:0; right:0; }\r
288 \r
289 /* billing styles */\r
290 .alt-style .table-div                                                   { border:1px dashed #000; }\r
291 .billing table.complex tr:nth-child(2n) td              { background:transparent; }\r
292 .billing table.alt-style tr.zebra td                    { background:#F2F2F2; }\r
293 .billing .highlight                                                             { text-align:center; padding:10px; border:1px dashed #000; font-size:1.231em; margin:0 0 2em;}\r
294 .billing .highlight em                                                  { color:#3582AC; font-style:normal; font-weight:bold; }\r
295 .billing table.marginless                                               { margin-bottom:0; }\r
296 .billing .sum                                                                   { background:#5A97B8; padding:5px 5px 5px 10px; color:#fff; }\r
297 .billing.details .last                                                  { width:15%;}\r
298 .billing.details .prelast                                               { width:10%;}\r
299 .billing.list .last                                                             { width:20%; }\r
300 .billing.list .prelast                                                  { width:20%; }\r
301 .billing form                                                                   { margin-top:50px; }\r
302 .billing .categories                                                    { margin-bottom:2em; }\r
303 .billing .categories .clear                     { color: #000000; position:relative; top:-1px; line-height:100%; display:inline-block;}\r
304 .billing  a, .billing  a:hover                  { border:0 none;}\r
305 .billing .categories ul                             { margin:0;padding:0;}\r
306 .billing .categories ul li                      { float: left; list-style:none outside;}\r
307 .billing .categories .title                     { margin-bottom: 0.5em; }\r
308 .billing .categories ul li a                    { color: #000000;   margin-right: 22px; text-decoration: none; }\r
309 .billing .categories ul li a:hover, \r
310 .billing .categories ul li a.selected           { color: #000000;}\r
311 .billing .categories ul li.active a                             { text-decoration: underline }\r
312 .billing .categories ul li.inactive             { opacity: 0.3; }\r
313 .billing .categories ul li.active               { opacity: 1; }\r
314 .billing .resource-cat-1.filter-item a,\r
315 .billing .resource-cat-1.filter-item a:hover    { color:#ff6f00 }\r
316 .billing .resource-cat-2.filter-item a,\r
317 .billing .resource-cat-2.filter-item a:hover    { color:#4085A5 }\r
318 \r
319 .table_sorting tr th                                                    { cursor:pointer; }\r
320 .table_sorting tr th:hover                                              { text-decoration:underline }