gnastacast.github.io/differentials.css at master · gnastacast/gnastacast.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
html {
       /*overflow-y: scroll;*/
}
body
{
	float:none;
	overflow:auto;
	background:#fff;
}
h1,h2,p,a,ul
	{
		font-style:none;
		font-weight:normal;
		text-decoration:none;
		margin:0px;
		padding:0px;
		color:#000;
		font-family: Georgia;
		transition:color 0.2s;
		-webkit-transition:color 0.2s; /* Safari */
	}

h1
	{
		text-align:center;
		line-height:80pt;
		font-size: 80pt;
	}
h2
	{
		font-size:16pt;
		text-align:center;
	}
p
	{
		margin:40px 0px;
		font-size:20pt;
	}

#slide1_container
{
        /*left:100%;
		position:absolute;*/
		-webkit-transform:translateX(100%);
		transform:translateX(100%);
		-webkit-transition:all 1.0s ease-in-out;
		-moz-transition:all 1.0s ease-in-out;
		-o-transition:all 1.0s ease-in-out;
		transition:all 1.0s ease-in-out;
		overflow-y:auto; /* So the sliding bit doesn't stick out. */
		overflow-x:hidden;
		width:100%;
		height:100%;
        background:#fff;


	}

#slide1_content {
	/* This is the bit that moves. It has 4 images, so 4 * 450 = 1800. You could use javascript
	to work this out instead by counting images. */
	/*min-width:1800px;
	width:150%;
	*/
	-webkit-transition:all 1.0s ease-in-out;
	-moz-transition:all 1.0s ease-in-out;
	-o-transition:all 1.0s ease-in-out;
	transition:all 1.0s ease-in-out;
}

#slide1_controls span, p {
	margin:0;
}

#controls{
	z-index:101;
	position: fixed;
    top:10px;
    left:10px;
	vertical-align:center;
	height:auto;
    background:#fff;
}

#slide1_controls
{

	}

#slide1_controls span, a {
    cursor:pointer;
  }


#float_right
	{
		position:relative;
		float:right;
		margin-left:3%;
	}