PageRenderTime 53ms CodeModel.GetById 1ms app.highlight 47ms RepoModel.GetById 1ms app.codeStats 1ms

/BlogEngine/BlogEngine.NET/themes/Indigo/style.css

#
CSS | 883 lines | 689 code | 129 blank | 65 comment | 0 complexity | cb96a8be3743d96e9026cc5aa1415a8d MD5 | raw file
  1/*#############################################################
  2Name: Indigo
  3Description: A lightweight (7kb images), simple and professional design.
  4Date: 2006-07-27
  5Author: Viktor Persson
  6URL: http://arcsin.se
  7Adapted by: Al @ http://www.nyveldt.com/blog/
  8
  9Feel free to use and modify but please provide credits.
 10#############################################################*/
 11
 12/* standard elements */
 13* {
 14	margin: 0;
 15	padding: 0;
 16}
 17a {
 18	color: #F70;
 19}
 20a:hover {
 21	color: #C60;
 22}
 23body {
 24	background: #0094D6 url(img/bg.gif) repeat-x;
 25	color: #466;
 26	font: normal 62.5% "Lucida Sans Unicode",sans-serif;
 27	margin: 0;
 28	
 29}
 30input {
 31	color: #555;
 32	font: normal 1.1em "Lucida Sans Unicode",sans-serif;
 33}
 34p,cite,code,ul {
 35	font-size: 1.2em;
 36	padding-bottom: 1.2em;
 37}
 38h1 {
 39	font-size: 1.4em;
 40	margin-bottom: 4px;
 41}
 42h2 {
 43	font-size: 1.2em;
 44	margin-bottom: 4px;
 45}
 46code {
 47	background: url(img/bgcode.gif);
 48	border: 1px solid #F0F0F0;
 49	border-left: 6px solid #39F;
 50	color: #555;
 51	font: normal 1.1em "Lucida Sans Unicode",serif;
 52	margin-bottom: 12px;
 53	padding: 8px 10px;
 54	white-space: pre;
 55}
 56cite {
 57	background: url(img/quote.gif) no-repeat;
 58	color: #666;
 59	display: block;
 60	font: normal 1.3em "Lucida Sans Unicode",serif;
 61	padding-left: 28px;
 62}
 63h1,h2,h3 {
 64	color: #06C;
 65	padding-top: 6px;
 66}
 67/* misc */
 68.clearer {
 69	clear: both;
 70}
 71
 72#postnavigation{
 73	height: 20px;
 74	margin-bottom: 10px;
 75	text-align: center;
 76	color: Gray;
 77}
 78
 79/* structure */
 80.container {
 81	background: url(img/topleft.gif) no-repeat;
 82}
 83
 84.header {
 85	height: 92px;
 86}
 87
 88/* title */
 89.title {
 90	float: left;
 91	padding: 28px 0 0 76px;
 92	color: #FFF;
 93	
 94}
 95.title h1 {
 96	color: #FFF;
 97	font: normal 2em Verdana,sans-serif;
 98}
 99.title a {
100	text-decoration: none;
101	color: #FFF;
102}
103
104/* navigation */
105.navigation {
106	float: left;
107	height: 92px;
108	margin-left: 24px;
109	padding: 0 16px;
110}
111.navigation a {
112	color: #FFF;
113	float: left;
114	font: bold 1.2em "Trebuchet MS",sans-serif;
115	margin-top: 56px;
116	padding: 8px 18px;
117	text-align: center;
118	text-decoration: none;
119}
120.navigation a:hover {
121	background-color: #4A91C3;
122	color: #FFF;
123}
124
125/* main */
126.main {
127	background: #FFF url(img/bgmain.gif) no-repeat;
128	clear: both;
129	padding: 12px 12px 0 52px;
130}
131
132/* main left */
133.sidenav {
134	float: left;
135	width: 24%;
136}
137.sidenav h1 {
138	border-bottom: 1px dashed #DDD;
139	color: #E73;
140	font-size: 1.2em;
141	height: 20px;
142	margin-top: 1.2em;
143}
144.sidenav img {
145	border: none;
146}
147.sidenav ul 
148{
149	text-transform: capitalize;
150	margin: 0;
151	padding: 0;
152}
153.sidenav li { 
154	border-bottom: 1px dashed #EEE;
155	list-style: none;
156	margin: 0;
157}
158.sidenav li a {
159	color: #777;
160	/* display: block; */
161	font-size: 1em;
162	padding: 3px 6px 3px 3px;
163	text-decoration: none;
164	
165}
166.sidenav li a:hover {
167	color: #111;
168	background: url(img/nav_li.gif) no-repeat;
169}
170
171#blogroll 
172{
173	font-size: 0.8em;
174}
175.open
176{
177	font-size: 1em;
178}
179
180/*----------------------------
181				Recent posts
182----------------------------*/
183
184ul.recentPosts li{
185	padding-bottom: 10px;
186}
187
188ul.recentPosts li a{
189	font-weight: bold;
190}
191
192ul.recentPosts li span{
193	display: block;
194	text-indent: 10px;
195	text-transform: none;
196}
197
198/*----------------------------
199			Recent comments
200----------------------------*/
201
202ul.recentComments li{
203	padding-bottom: 10px;
204	text-transform: none;
205}
206
207ul.recentComments li a.postTitle{
208	font-weight: bold;
209}
210
211/* content */
212.content {
213	float: left;
214	margin-right: 4%;
215	width: 69%;
216	
217}
218.content .postheader {
219	text-decoration: none;
220	color: #06C;
221}
222.content .descr {
223	color: #C60;
224	margin-bottom: 6px;
225}
226.content li {
227	list-style: url(img/li.gif);
228	margin-left: 18px;
229}
230.postcontent {
231	font-size: 1.2em;
232	padding-bottom: 1.2em;
233}
234.postcontent p {
235	font-size: inherit;
236	padding-bottom: 1.2em;
237}
238#ctl00_cphBody_divText {
239	font-size: 1.2em;
240	padding-bottom: 1.2em;
241}
242#ctl00_cphBody_divText p {
243	font-size: inherit;
244	padding-bottom: 1.2em;
245}
246.postfooter {
247	padding:2px 3px 3px 8px;
248	border:1px solid #e3e4e4;
249	background-color:#f5f5f5;
250	font-size:0.9em;
251	color:#505050;
252}
253.postfooter img{
254	border: none;
255}
256
257/*----------------------------
258					 Widgets
259----------------------------*/
260
261div.widgetzone{
262	padding: 0;
263	background: none;
264	width:100%;
265}
266
267div.widgetzone .clear{
268	clear: left;
269}
270
271div.widget{
272	background: white;
273	margin-bottom: 10px;
274	width: 100%;
275	z-index: 1;
276	min-width: 1px;
277	clear: both;
278}
279
280div.widget .content{
281	line-height: 16px;
282	color: #666666;
283	width: 100%;
284	float: none;
285	margin: 0;
286}
287
288div.widget h4{
289	font-size: 1.2em;
290	border-bottom: 1px dashed #DDD;
291	color: #E73;
292	padding-bottom: 5px;
293	margin: 0;
294	margin-bottom: 5px;	
295	z-index: 0;
296	letter-spacing: 1px;
297}
298
299div.widget a.edit, div.widget a.move{
300	font-size: 10px;
301	font-weight: normal;
302	float: right;
303	z-index: 1;
304	margin-left: 5px;
305}
306
307div.widget a.delete{
308	font-weight: bold;
309	color: #999999;
310	float: right;
311	margin-left: 5px;
312	z-index: 1;
313	text-decoration: none;
314}
315
316div.widget a.delete:hover{
317	color: black;
318}
319
320.widgetzone .widget .content ul {
321	list-style-type: none !important;
322	margin: 0 !important;
323	padding: 0 !important;
324	text-transform: capitalize;
325}
326
327.widgetzone .widget .content ul li {
328	list-style: none !important;
329	margin: 0;
330	padding: 0;
331	margin-bottom: 3px;
332}
333
334.widgetzone div.search{
335	background: none;
336	border: none;
337	padding-left: 10px;
338}
339
340.widgetzone div#moveWidgetToContainer {
341	text-align: right;
342	margin: 3px;
343}
344
345
346/* search form */
347#searchbox input 
348{
349	border: 3px double #E5E5E5;
350	padding: 2px 3px;
351}
352#searchbutton {
353	border: 1px solid #AAA;
354	margin-left: 5px;
355	padding: 2px 3px;
356}
357#searchcomments
358{
359	margin-right: 3px;
360}
361
362/* footer */
363.footer {
364	background: #0094D6 url(img/bgfooter.gif) repeat-x;
365	color: #C1DEF0;
366	font-size: 1.1em;
367	line-height: 40px;
368	text-align: center;
369}
370.footer a {
371	color: #FFF;
372	text-decoration: none;
373}
374.footer a:hover {
375	color: #FFF;
376	text-decoration: underline;
377}
378
379/* related posts */
380#relatedPosts a {
381	display: block;
382	margin-top: 5px;
383	margin-left: 15px;
384	margin-bottom: 5px;
385	font-size: 1.2em;
386}
387
388/* comments */
389.comment 
390{
391	border-top: 1px solid #DDDDDD;
392	border-bottom: 1px solid #DDDDDD;
393	padding-top: 10px;
394	margin-bottom: 5px;
395	padding-bottom: 5px;
396}
397
398.comment .date {
399	text-align: left;
400	margin: 0;
401	padding: 3px 0px;
402}
403.comment .author {
404	margin: 0;
405	text-align: left;
406	padding-top: 3px;
407	margin: 5px 0px 3px 0px;
408	clear: both;
409}
410
411.self {
412	background-color:#F5F5F5;
413}
414
415.comment .gravatar {
416	float: left;
417	clear: both;
418	margin: 5px 5px 5px 5px;
419}
420
421.comment .gravatar img {
422	height: 80px;
423}
424
425.comment .content {
426	min-height: 85px;
427	margin: 5px 0 0 5px;
428}
429.commentForm {
430	padding: 5px;
431}
432
433.commentForm label {
434	float: left;
435	display: block;
436	width: 80px;
437}
438
439.commentForm input {
440	width: 345px;
441}
442
443.commentForm textarea {
444	width: 100%;
445	height: 150px;
446}
447
448#commentMenu{
449	padding: 0;
450	margin:0;
451	clear:both;
452}
453
454#commentMenu li{
455	float:left;
456	border:1px solid silver;
457	border-bottom: none;
458	margin:0;
459	list-style:none;
460	margin-right:5px;
461	padding: 3px 8px;	
462	cursor:pointer;
463	position:relative;
464	top: 2px;
465	background:#d8d8d8;
466}
467
468#commentMenu li.selected{
469	background:white;
470	border-bottom:1px solid white;
471}
472
473#commentPreview{
474	display:none;
475	clear:both;
476}
477
478/* Archive */
479#archive p
480{
481	font-size: 1.2em;
482}
483#archive img
484{
485	border: none;
486	padding-right: 5px;
487}
488#archive h2 {
489	font-size: 1.2em;
490	margin-bottom: 4px;
491}
492#archive span 
493{
494	display: block;
495	margin-bottom: 3px;
496	font-size: 1.1em;
497}
498
499#archive span a 
500{
501	margin-left: 4px;
502}
503
504/*----------------------------
505				 Tag cloud
506----------------------------*/
507
508#tagcloud {
509	margin-bottom: 10px;
510	white-space: normal;
511}
512
513#tagcloud li {
514	display: inline;
515	border-bottom: none;
516}
517
518#tagcloud a {
519	margin-right: 3px;
520	display: inline;
521	padding: 3px 1px 3px 1px;
522}
523
524#tagcloud li a:hover {
525	color: #111;
526	background: none;
527}
528
529#tagcloud a.biggest {
530	font-size: 20px;
531}
532
533#tagcloud a.big {
534	font-size: 17px;
535}
536
537#tagcloud a.medium {
538	font-size: 13px;
539}
540
541#tagcloud a.small {
542	font-size: 12px;
543}
544
545#tagcloud a.smallest {
546	font-size: 10px;
547}
548
549/*----------------------------
550					 Calendar
551----------------------------*/
552
553#calendarContainer {
554	text-transform: capitalize;
555	margin: 0 auto;
556}
557
558.calendar {
559	border: none;
560	margin: 0 auto;
561	font-size: 1.2em;
562	width: 80%;
563}
564
565.calendar .weekend {
566	background-color: #F1F1F1;
567}
568
569.calendar .other {
570	color: silver;
571}
572
573.calendar a.exist {
574	display: block;
575	font-weight: bold;
576	background-color: #F1F1F1;
577}
578
579.calendar td {
580	vertical-align: top;
581	background: white;
582}
583
584/*----------------------------
585					Star rater
586----------------------------*/
587
588.rating p{
589	display: inline;
590	position: relative;
591	top: 14px;
592	left: 55px;
593}
594
595.star-rating {
596	position: relative;
597	width: 125px;
598	height: 25px;
599	overflow: hidden;
600	list-style: none;
601	margin: 0;
602	padding: 0;
603	background-position: left top;
604}
605
606.star-rating li {
607	display: inline;
608}
609
610.star-rating a, .star-rating .current-rating {
611	position: absolute;
612	top: 0;
613	left: 0;
614	text-indent: -1000em;
615	height: 25px;
616	line-height: 25px;
617	outline: none;
618	overflow: hidden;
619	border: none;
620}
621
622.star-rating a:hover, .star-rating a:active, .star-rating a:focus {
623	background-position: left bottom;
624}
625
626.star-rating a.one-star {
627	width: 20%;
628	z-index: 6;
629}
630
631.star-rating a.two-stars {
632	width: 40%;
633	z-index: 5;
634}
635
636.star-rating a.three-stars {
637	width: 60%;
638	z-index: 4;
639}
640.star-rating a.four-stars {
641	width: 80%;
642	z-index: 3;
643}
644.star-rating a.five-stars {
645	width: 100%;
646	z-index: 2;
647}
648.star-rating .current-rating {
649	z-index: 1;
650	background-position: left center;
651	margin: 0px;
652}
653
654/* smaller star */
655.small-star {
656	width: 50px;
657	height: 10px;
658}
659.small-star, .small-star a:hover, .small-star a:active, .small-star a:focus, .small-star .current-rating {
660	background-image: url(../../pics/star_small.gif);
661	line-height: 10px;
662	height: 10px;
663}
664
665/*----------------------------
666				Contact page
667----------------------------*/
668
669#contact{
670	padding: 10px;
671}
672
673#contact h1{
674	margin-top: 0;
675}
676
677#contact label{
678	display: block;
679	padding-top: 5px;	
680}
681
682#contact input.field{
683	width: 200px;
684}
685
686#contact textarea{
687	display: block;	
688	overflow: auto;
689	width: 75%;
690	height: 150px;
691	margin: 0;
692}
693
694/* code styles for CodeFormatter Extension*/
695.csharpcode, .csharpcode pre
696{
697	font-size: small;
698	color: black;
699	font-family: Consolas, "Courier New", Courier, Monospace;
700	background-color: #ffffff;
701	/*white-space: pre;*/
702}
703
704.csharpcode pre { margin: 0em; }
705
706.csharpcode .rem { color: #008000; }
707
708.csharpcode .kwrd { color: #0000ff; }
709
710.csharpcode .str { color: #006080; }
711
712.csharpcode .op { color: #0000c0; }
713
714.csharpcode .preproc { color: #cc6633; }
715
716.csharpcode .asp { background-color: #ffff00; }
717
718.csharpcode .html { color: #800000; }
719
720.csharpcode .attr { color: #ff0000; }
721
722.csharpcode .alt 
723{
724	background-color: #f4f4f4;
725	width: 100%;
726	margin: 0em;
727}
728
729.csharpcode .lnum { color: #606060; }
730
731/*----------------------------
732				Search page
733----------------------------*/
734
735.searchresult{
736	margin-bottom: 20px;
737}
738
739.searchresult a{
740	font-weight: bold;
741}
742
743.searchresult span.text{
744	clear: both;
745	display: block;
746	margin: 3px 0;
747}
748
749.searchresult span.type{
750	display: block;
751}
752
753.searchresult span.url{
754	color: Gray;
755}
756
757.searchpage ul.paging{
758 list-style-type: none;
759 margin:0px;
760 margin-bottom: 20px;
761 padding:0px;
762}
763
764.searchpage ul.paging li{
765 display: inline;
766 border: 1px solid gray; 
767 background: #f1f1f1;
768 margin-right: 5px;
769}
770
771.searchpage ul.paging li a{
772 padding: 5px 8px;
773}
774
775.searchpage ul.paging li.active{
776 background: #f1f1f1;
777 border: 1px solid black;
778}
779
780/*----------------------------
781			Syntax highlighter
782----------------------------*/
783
784.code
785{
786	font-size: 12px;
787	color: black;
788	font-family: Consolas, "Courier New", Courier, Monospace;
789	background-color: #F1F1F1;
790  line-height: normal;
791}
792
793.code p{
794	padding: 5px;
795}
796
797.code .rem { color: #008000; }
798
799.code .kwrd { color: #0000ff; }
800
801.code .str { color: #006080; }
802
803.code .op { color: #0000c0; }
804
805.code .preproc { color: #0000ff; }
806
807.code .asp { background-color: #ffff00; }
808
809.code .html { color: #800000; }
810
811.code .attr { color: #ff0000; }
812
813.code .alt {	background-color: #f4f4f4; }
814
815.code .lnum { color: #606060;}
816
817/*----------------------------
818					XFN tags
819----------------------------*/
820
821div.post .postcontent a[rel] {
822	padding-right:11px;
823	background-repeat: no-repeat;
824	background-position: right center;
825}
826div.post .postcontent a[rel="me"] {	
827	background-image:url('../../pics/xfn/me.gif');
828}
829
830/*-------- [ These should cascade to pick the correct icon for the contact ]--*/
831
832/*-------- [ Normal contacts ]--*/
833div.post .postcontent a[rel~="contact"] ,
834div.post .postcontent a[rel~="acquaintance"],
835div.post .postcontent a[rel~="friend"] {
836	background-image:url('../../pics/xfn/contact.gif');
837}
838/*-------- [ Normal contacts youve met ]--*/
839div.post .postcontent a[rel~="contact"][rel~="met"] ,
840div.post .postcontent a[rel~="acquaintance"][rel~="met"] ,
841div.post .postcontent a[rel~="friend"][rel~="met"] {
842	background-image:url('../../pics/xfn/contactMet.gif');
843}
844
845/*-------- [ Colleague and co worker icon more important than contact ]--*/
846div.post .postcontent a[rel~="colleague"] ,
847div.post .postcontent a[rel~="co-worker"] {
848	background-image:url('../../pics/xfn/colleague.gif');
849}
850/*-------- [ Colleague and co worker icon when met ]--*/
851div.post .postcontent a[rel~="colleague"][rel~="met"] ,
852div.post .postcontent a[rel~="co-worker"][rel~="met"] {
853	background-image:url('../../pics/xfn/colleagueMet.gif');
854}
855
856/*-------- [ Sweethearts are more important than work!!! ]--*/
857div.post .postcontent a[rel~="muse"] ,
858div.post .postcontent a[rel~="crush"] ,  
859div.post .postcontent a[rel~="date"] ,
860a[rel~="sweetheart"] {
861	background-image:url('../../pics/xfn/sweet.gif');
862}
863/*-------- [ ...and if youve met them thats even better ]--*/
864div.post .postcontent a[rel~="muse"][rel~="met"] ,
865div.post .postcontent a[rel~="crush"][rel~="met"] ,  
866div.post .postcontent a[rel~="date"][rel~="met"] ,
867div.post .postcontent a[rel~="sweetheart"][rel~="met"] {
868	background-image:url('../../pics/xfn/sweetMet.gif');
869}
870
871/*  Comment notification unsubscription  */
872#commentNotificationUnsubscription {
873	margin-bottom: 10px;
874	color: Gray;
875	background: #ffc;
876	border: 1px solid silver;
877	padding: 10px;
878}
879
880#commentNotificationUnsubscription h1 {
881	margin: 0 auto 12px auto;
882	padding: 0;
883}