883km.github.io/proj2.css at main · 883km/883km.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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
body {
	margin: 0;
	padding: 0;
	overflow: hidden;
	height: 100%;
	max-height: 100%;
	font-family:Sans-serif;
	line-height: 1.5em;
}

main {
	position: fixed;
	top: 50px; /* Set this to the height of the header */
	bottom: 50px; /* Set this to the height of the footer */
	left: 420px;
	overflow: auto;
	background: #fff;
}

img {
	max-width: 100%; /* Adjust the percentage as needed */
	height: auto; /* This maintains the aspect ratio of the image */
}

#header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 50px;
	overflow: hidden; /* Disables scrollbars on the header frame. To enable scrollbars, change "hidden" to "scroll" */
	background: #BCCE98;
}

#footer {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 60px;
	overflow: hidden; /* Disables scrollbars on the footer frame. To enable scrollbars, change "hidden" to "scroll" */
	background: #BCCE98;
}

#left {
	position: absolute;
	top: 50px; /* Set this to the height of the header */
	bottom: 50px; /* Set this to the height of the footer */
	left: 0;
	width: 420px;
	overflow: auto; /* Scrollbars will appear on this frame only when there's enough content to require scrolling. To disable scrollbars, change to "hidden", or use "scroll" to enable permanent scrollbars */
	background: #DAE9BC;
}

.innertube {
	margin: 15px; /* Provides padding for the content */
}

p {
	color: #555;
}

nav ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

nav ul a {
	color: darkgreen;
	text-decoration: none;
}

.bulletpoint li {
	font-size: 16px;
	line-height: 1.5;
}

.button1-container {
	display: flex;
	flex-direction: column;
	align-items: center; /* Align items (buttons) in the center horizontally */
	justify-content: center; /* Align items (buttons) in the center vertically */
	height: 100%; /* Make the container take full height of the parent */
}

.button1 {
	font-size: 18px;
	padding: 10px 10px;
	height: 50px;
    border-radius: 5px;
    cursor: pointer;
}

.buttonnext-container {
	display: flex;
	flex-direction: column;
	align-items: flex-end; /* Align items (buttons) in the center horizontally */
	justify-content: center; /* Align items (buttons) in the center vertically */
	height: 100%; /* Make the container take full height of the parent */
}

.next-button {
    font-size: 18px;
    padding: 10px 20px;
    height: 45px; /* Adjust the height of the button as needed */
    border-radius: 5px; /* Add rounded corners to the button */
    cursor: pointer; /* Change the cursor to a hand when hovering over the button */
}


/*IE6 fix*/
* html body{
	padding: 50px 200px 50px 200px; /* Set the first value to the height of the header, the second value to the width of the right column, third value to the height of the footer, and last value to the width of the left column */
}

* html main{
	height: 100%;
	width: 100%;
}