git.roojs.org Git - bootswatch/blob - css/bootswatch.css

   1 body {
   2         padding-bottom: 20px;
   3 }
   4
   5 .nav i {
   6         opacity: 0.5;
   7 }
   8
   9 .nav a:hover i {
  10         opacity: 1;
  11 }
  12
  13 .tooltip-inner {
  14         max-width: 500px;
  15 }
  16
  17 .alert a {
  18         font-weight: bold;
  19         text-decoration: underline;
  20 }
  21
  22 .alert p {
  23         margin: 0;
  24 }
  25
  26 .hero-unit {
  27         margin-top: 60px;
  28         margin-bottom: 60px;
  29 }
  30
  31 .hero-unit h1, .hero-unit p {
  32   text-align: center;
  33   margin-bottom: 15px;
  34 }
  35
  36 #social {
  37   margin-top: 45px;
  38 }
  39
  40 .twitter-follow-button {
  41   width: 160px !important;
  42 }
  43
  44 .rss-button {
  45         width: 40px;
  46         height: 14px;
  47         font-size: 11px;
  48         line-height: 14px;
  49         font-weight: bold;
  50         margin: 0;
  51         padding: 2px 5px 2px 4px;
  52 }
  53
  54 .icon-rss {
  55     background: url(../img/rss-icons.png) no-repeat 0 0;
  56         opacity: .65;
  57         width: 16px;
  58 }
  59
  60 .icon-envelope {
  61         opacity: .65;
  62 }
  63
  64 .about {
  65   margin-top: 20px;
  66 }
  67
  68 .about h3 {
  69   margin: 0 0 5px 35px;
  70 }
  71
  72 .about img {
  73   float: left;
  74   opacity: 0.6;
  75 }
  76
  77 #gallery {
  78   margin: 45px 0 30px 0;
  79   padding-right: 20px;
  80   text-align: center;
  81 }
  82
  83 .thumbnail {
  84         background-color: #eee;
  85 }
  86
  87 .thumbnail img {
  88   max-width: 100%;
  89   -webkit-border-radius: 7px;
  90      -moz-border-radius: 7px;
  91           border-radius: 7px;
  92 }
  93
  94 .thumbnail .label {
  95         vertical-align: top;
  96 }
  97
  98 .thumbnail p {
  99         max-width: 352px;
 100 }
 101
 102 .thumbnail .btn-toolbar {
 103   text-align: right;
 104 }
 105
 106 .thumbnail .btn-group {
 107     margin-top: 10px;
 108 }
 109
 110 .modal .label {
 111  vertical-align: text-top;
 112 }
 113
 114 .modal p {
 115         margin-bottom: 1em;
 116 }
 117
 118 .modal p:last-child {
 119         margin-top: 2em;
 120 }
 121
 122 /* Landscape phones and down */
 123 @media (max-width: 480px) {
 124
 125         body, .navbar {
 126                 margin: 0;
 127         }
 128
 129         body {
 130                 padding: 0;
 131         }
 132
 133         .container {
 134                 padding: 20px;
 135         }
 136
 137         .span4 {
 138                 width: 100%;
 139         }
 140
 141         .hero-unit {
 142                 padding: 40px 20px 80px;
 143                 margin-bottom: 20px;
 144         }
 145
 146         .hero-unit h1 {
 147           font-size: 36px;
 148         }
 149
 150         .hero-unit p {
 151                 font-size: 13px;
 152                 line-height: 20px;
 153         }
 154
 155         #social {
 156                 margin-top: 0px;
 157                 margin-bottom: 40px;
 158         }
 159
 160         .about {
 161           margin-top: -10px;
 162         }
 163
 164         .about h3 {
 165           margin-top: 20px;
 166         }
 167
 168 }
 169
 170 /* Landscape phone to portrait tablet */
 171 @media (max-width: 767px) {
 172
 173         .hero-unit {
 174                 margin-top: 0;
 175                 padding-bottom: 80px;
 176         }
 177
 178         .thumbnails > .span4 {
 179                 margin-left: 0;
 180         }
 181
 182 }
 183
 184 /* Portrait tablet to landscape and desktop */
 185 @media (min-width: 768px) and (max-width: 980px) {
 186
 187         .hero-unit {
 188                 margin-top: 0;
 189         }
 190
 191         .thumbnail .btn {
 192                 font-size: 11px;
 193         }
 194
 195 }
 196
 197 /* Large desktop */
 198 @media (min-width: 1200px) {
 199
 200
 201 }