1
/*
2
 * HTML5 Boilerplate
3
 *
4
 * What follows is the result of much research on cross-browser styling.
5
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
6
 * Kroc Camen, and the H5BP dev community and team.
7
 */
8
9
/* ==========================================================================
10
   Base styles: opinionated defaults
11
   ========================================================================== */
12
13
html,
14
button,
15
input,
16
select,
17
textarea {
18
    color: #222;
19
}
20
21
body {
22
    margin:0 auto;
23
    font-size: 1em;
24
    line-height: 1.6;
25
    background-image: url('http://mitan.in/followsheep/images/bg.jpg');
26
    border:1px solid #000;
27
    
28
}
29
30
body .container-fluid{
31
    background-image: url('http://mitan.in/followsheep/images/bg.jpg');
32
}
33
h1{
34
    width:100%;
35
    font-family:Comic sans MS;
36
}
37
.navigation {
38
    width:100%;
39
    font-size:22px;
40
    font-family:Comic sans MS;
41
    margin-left:34%;
42
}
43
.inside {
44
    width:100%;
45
    margin:0px 0px 0px 0px;
46
    position:relative;
47
    height:auto;
48
    }
49
.travelogue {
50
    margin:0px 0px 0px 30px;
51
    width:1070px;
52
    postion:relative;
53
}
54
.imgsize {
55
    width:300px;
56
    height:300px;
57
    margin:0px 0px 0px 10px;
58
    border-radius:1em 1em 1em 1em;
59
}
60
.imgsize1 {
61
    width:300px;
62
    height:200px;
63
    margin:10px 0px 0px 60px;
64
    border-radius:1em 1em 1em 1em;
65
    padding:2px 2px 2px 2px;
66
    display:inline;
67
68
}
69
.paragraph{
70
	font-family:Comic sans MS;
71
}
72
73
/*
74
 * Remove text-shadow in selection highlight: h5bp.com/i
75
 * These selection declarations have to be separate.
76
 * Customize the background color to match your design.
77
 */
78
79
::-moz-selection {
80
    background: #b3d4fc;
81
    text-shadow: none;
82
}
83
84
::selection {
85
    background: #b3d4fc;
86
    text-shadow: none;
87
}
88
89
/*
90
 * A better looking default horizontal rule
91
 */
92
93
hr {
94
    display: block;
95
    height: 1px;
96
    border: 0;
97
    border-top: 1px solid #ccc;
98
    margin: 1em 0;
99
    padding: 0;
100
}
101
102
/*
103
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
104
 */
105
106
img {
107
    vertical-align: middle;
108
}
109
110
/*
111
 * Remove default fieldset styles.
112
 */
113
114
fieldset {
115
    border: 0;
116
    margin: 0;
117
    padding: 0;
118
}
119
120
/*
121
 * Allow only vertical resizing of textareas.
122
 */
123
124
textarea {
125
    resize: vertical;
126
}
127
128
/* ==========================================================================
129
   Chrome Frame prompt
130
   ========================================================================== */
131
132
.chromeframe {
133
    margin: 0.2em 0;
134
    background: #ccc;
135
    color: #000;
136
    padding: 0.2em 0;
137
}
138
139
/* ==========================================================================
140
   Author's custom styles
141
   ========================================================================== */
142
.carousel-images{
143
	width:auto;
144
	height:300px;
145
}
146
.span10{
147
	border-color:solid 5px #000;
148
}
149
.box{
150
    width:300px;
151
    height:200px;
152
    margin:0px 0px 0px 60px;
153
    border-radius:1em 1em 1em 1em;
154
    padding:2px 2px 2px 2px;
155
    display:inline;
156
 }
157
.row{
158
    border:1px solid #000;
159
    border-radius:1em 1em 1em 1em;
160
    padding:5px 5px 5px 5px;
161
    margin-left:5px;
162
    box-shadow:0px 10px 10px 0px;
163
}
164
.positions {
165
    position:absolute;
166
    margin:95px 0px 0px 45px;
167
    padding:0px 10px 0px 0px;
168
    display:inline;
169
170
}   
171
.text{
172
    margin:10px 0px 0px 0px;
173
    width:68%;
174
    text-align:justify;
175
    float:right;
176
}
177
.text1 {
178
    position:relative;
179
    margin:0px 0px 0px 40px;
180
}
181
    
182
.images{
183
    width:200px;
184
    height:200px;
185
    display:inline
186
    margin:0px 0px 0px 0px;
187
    border-radius:1em 1em 1em 1em;
188
    padding:0px 0px 0px 10px;
189
}
190
.track1{
191
    width:0 auto;
192
    border:1px solid #000;
193
    border-radius:1em 1em 1em 1em;
194
}
195
a {
196
    text-decoration:none;
197
}
198
.sound {
199
    display:inline;
200
}
201
h4{
202
    margin-left:15px;
203
}
204
.content{
205
    width:auto;
206
    height:auto;
207
    margin:0 auto;
208
}
209
/* ==========================================================================
210
   Helper classes
211
   ========================================================================== */
212
213
/*
214
 * Image replacement
215
 */
216
217
.ir {
218
    background-color: transparent;
219
    border: 0;
220
    overflow: hidden;
221
    /* IE 6/7 fallback */
222
    *text-indent: -9999px;
223
}
224
225
.ir:before {
226
    content: "";
227
    display: block;
228
    width: 0;
229
    height: 100%;
230
}
231
232
/*
233
 * Hide from both screenreaders and browsers: h5bp.com/u
234
 */
235
236
.hidden {
237
    display: none !important;
238
    visibility: hidden;
239
}
240
241
/*
242
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
243
 */
244
245
.visuallyhidden {
246
    border: 0;
247
    clip: rect(0 0 0 0);
248
    height: 1px;
249
    margin: -1px;
250
    overflow: hidden;
251
    padding: 0;
252
    position: absolute;
253
    width: 1px;
254
}
255
256
/*
257
 * Extends the .visuallyhidden class to allow the element to be focusable
258
 * when navigated to via the keyboard: h5bp.com/p
259
 */
260
261
.visuallyhidden.focusable:active,
262
.visuallyhidden.focusable:focus {
263
    clip: auto;
264
    height: auto;
265
    margin: 0;
266
    overflow: visible;
267
    position: static;
268
    width: auto;
269
}
270
271
/*
272
 * Hide visually and from screenreaders, but maintain layout
273
 */
274
275
.invisible {
276
    visibility: hidden;
277
}
278
279
/*
280
 * Clearfix: contain floats
281
 *
282
 * For modern browsers
283
 * 1. The space content is one way to avoid an Opera bug when the
284
 *    `contenteditable` attribute is included anywhere else in the document.
285
 *    Otherwise it causes space to appear at the top and bottom of elements
286
 *    that receive the `clearfix` class.
287
 * 2. The use of `table` rather than `block` is only necessary if using
288
 *    `:before` to contain the top-margins of child elements.
289
 */
290
291
.clearfix:before,
292
.clearfix:after {
293
    content: " "; /* 1 */
294
    display: table; /* 2 */
295
}
296
297
.clearfix:after {
298
    clear: both;
299
}
300
301
/*
302
 * For IE 6/7 only
303
 * Include this rule to trigger hasLayout and contain floats.
304
 */
305
306
.clearfix {
307
    *zoom: 1;
308
}
309
310
/* ==========================================================================
311
   EXAMPLE Media Queries for Responsive Design.
312
   Theses examples override the primary ('mobile first') styles.
313
   Modify as content requires.
314
   ========================================================================== */
315
316
@media only screen and (min-width: 35em) {
317
    /* Style adjustments for viewports that meet the condition */
318
}
319
320
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
321
       only screen and (min-resolution: 144dpi) {
322
    /* Style adjustments for high resolution devices */
323
}
324
325
/* ==========================================================================
326
   Print styles.
327
   Inlined to avoid required HTTP connection: h5bp.com/r
328
   ========================================================================== */
329
330
@media print {
331
    * {
332
        background: transparent !important;
333
        color: #000 !important; /* Black prints faster: h5bp.com/s */
334
        box-shadow:none !important;
335
        text-shadow: none !important;
336
    }
337
338
    a,
339
    a:visited {
340
        text-decoration: underline;
341
    }
342
343
    a[href]:after {
344
        content: " (" attr(href) ")";
345
    }
346
347
    abbr[title]:after {
348
        content: " (" attr(title) ")";
349
    }
350
351
    /*
352
     * Don't show links for images, or javascript/internal links
353
     */
354
355
    .ir a:after,
356
    a[href^="javascript:"]:after,
357
    a[href^="#"]:after {
358
        content: "";
359
    }
360
361
    pre,
362
    blockquote {
363
        border: 1px solid #999;
364
        page-break-inside: avoid;
365
    }
366
367
    thead {
368
        display: table-header-group; /* h5bp.com/t */
369
    }
370
371
    tr,
372
    img {
373
        page-break-inside: avoid;
374
    }
375
376
    img {
377
        max-width: 100% !important;
378
    }
379
380
    @page {
381
        margin: 0.5cm;
382
    }
383
384
    p,
385
    h2,
386
    h3 {
387
        orphans: 3;
388
        widows: 3;
389
    }
390
391
    h2,
392
    h3 {
393
        page-break-after: avoid;
394
    }
395
}
396
397
398
#thumbnails {
399
margin:10px 0 0 15px;
400
}
401
402
#thumbs {
403
margin: 100px 100px 0;
404
border-top: 5px solid #2D912D;
405
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2D912D), to(transparent));
406
    background-image: -webkit-linear-gradient(#2D912D, transparent);
407
    background-image:
408
        -moz-linear-gradient(#2D912D, transparent),
409
        -moz-linear-gradient(#2D912D, transparent)
410
    ;
411
    background-image:
412
        -o-linear-gradient(#2D912D, transparent),
413
        -o-linear-gradient(#2D912D, transparent)
414
    ;
415
    background-image: 
416
        linear-gradient(#2D912D, transparent),
417
        linear-gradient(#2D912D, transparent)
418
    ;
419
    -moz-background-size:5px 100%;
420
    background-size:5px 100%;
421
    background-position:0 0, 100% 0;
422
    background-repeat:no-repeat;
423
}