mediagoblin/static/css/base.css

   1 body {
   2   background-color: #272727;
   3   color: #f7f7f7;
   4   font-family: sans-serif;
   5   padding:none;
   6   margin:0px;
   7 }
   8
   9 /* Carter One font */
  10
  11 @font-face {
  12   font-family: 'Carter One';
  13   font-style: normal;
  14   font-weight: normal;
  15   src: local('CarterOne'), url('http://themes.googleusercontent.com/font?kit=VjW2qt1pkqVtO22ObxgEBRsxEYwM7FgeyaSgU71cLG0') format('woff');
  16 }
  17
  18 /* text styles */
  19
  20 h1 {
  21   font-family: 'Carter One', arial, serif;
  22   margin-bottom: 20px;
  23   margin-top:40px;
  24 }
  25
  26 p {
  27   font-family: sans-serif;
  28   font-size:16px;
  29 }
  30
  31 a {
  32   color: #86D4B1;
  33 }
  34
  35 label {
  36   font-weight: normal;
  37 }
  38
  39 /* website structure */
  40
  41 .mediagoblin_header {
  42   width:100%;
  43   height:36px;
  44   background-color:#393939;
  45   padding-top:14px;
  46   margin-bottom:40px;
  47 }
  48
  49 a.mediagoblin_logo {
  50   width:34px;
  51   height:25px;
  52   margin-right:10px;
  53   background-image:url('../images/icon.png');
  54   background-position:0px 0px;
  55   display:inline-block;
  56 }
  57
  58 a.mediagoblin_logo:hover {
  59   background-position:0px -28px;
  60 }
  61
  62 .mediagoblin_container {
  63   width: 960px;
  64   margin-left: auto;
  65   margin-right: auto;
  66 }
  67
  68 .mediagoblin_header_right {
  69   float:right;
  70 }
  71
  72 /* common website elements */
  73
  74 .dotted_line {
  75   width:100%;
  76   height:0px;
  77   border-bottom: dotted 1px #5f5f5f;
  78   position:absolute;
  79   left:0px;
  80   margin-top:-20px;
  81 }
  82
  83 .button {
  84   font-family:'Carter One', arial, serif;
  85   height:32px;
  86   min-width:99px;
  87   background-color:#86d4b1;
  88   background-image: -webkit-gradient(linear, left top, left bottom, from(#86d4b1), to(#62caa2));
  89   background-image: -webkit-linear-gradient(top, #86d4b1, #62caa2);
  90   background-image:    -moz-linear-gradient(top, #86d4b1, #62caa2);
  91   background-image:     -ms-linear-gradient(top, #86d4b1, #62caa2);
  92   background-image:      -o-linear-gradient(top, #86d4b1, #62caa2);
  93   background-image:         linear-gradient(top, #86d4b1, #62caa2);
  94   box-shadow:0px 0px 4px #000;
  95   border-radius:5px;
  96   border:none;
  97   color:#272727;
  98   margin:10px 0px;
  99   font-size:1em;
 100   text-align:center;
 101   padding-left:11px;
 102   padding-right:11px;
 103 }
 104
 105 /* forms */
 106
 107 .form_box {
 108   width:300px;
 109   margin-left:auto;
 110   margin-right:auto;
 111   background-color:#393939;
 112   background-image:url("../images/background_lines.png");
 113   background-repeat:repeat-x;
 114   padding:1px 83px 30px 83px;
 115   font-size:18px;
 116 }
 117
 118 .submit_box {
 119   width:600px;
 120 }
 121
 122 .form_box h1 {
 123   font-size:28px;
 124 }
 125
 126 .form_field_input input {
 127   width:300px;
 128   font-size:18px;
 129 }
 130
 131 .form_field_box {
 132   margin-bottom:24px;
 133 }
 134
 135 .form_field_label,.form_field_input {
 136   margin-bottom:4px;
 137 }
 138
 139 .form_field_error {
 140   background-color:#87453b;
 141   border:none;
 142   font-size:16px;
 143   padding:9px;
 144   margin-top:8px;
 145   margin-bottom:8px;
 146 }
 147
 148 .form_submit_buttons {
 149   text-align:right;
 150 }
 151
 152 /* media pages */
 153
 154 img.media_image {
 155   display:block;
 156   margin-left:auto;
 157   margin-right:auto;
 158 }
 159
 160 ul.media_thumbnail {
 161   padding:0px;
 162 }
 163
 164 li.media_thumbnail {
 165   width:200px;
 166   height:133px;
 167   display:-moz-inline-stack;
 168   display:inline-block;
 169   vertical-align:top;
 170   margin:0px 10px 10px 0px;
 171   zoom:1;
 172 . *display:inline;
 173 }