medabots.github.io/style.css at master · Medabots/medabots.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
@charset "UTF-8";
@-ms-viewport { width:device-width; }
@viewport { width:device-width; }
body { margin:0; background:#FFF; }
.header { position:relative; width:100%; overflow:hidden; height:40px; background:#FFF; padding:0 0 8px; }
.header h1, .logo-1x, .logo-2x, .logo-4x { position:absolute; width:100%; top:0; left:0; text-align:center; margin:0; padding:0; font-size:12px; display:block; }
h2 { background:#000; padding:8px; color:#FFF; font-family:"Century Gothic",CenturyGothic,"Century-Gothic","STHeiti",AppleGothic,Arial,sans-serif; font-size:26px; font-weight:normal; margin:0; }
.logo-2x, .logo-4x { display:none; }
.descc { width:100%; max-width:500px; }
.desc { background:#FFF; font-size:15px; font-family:Candara,Calibri,Segoe,Segoe UI,Optima,Arial,sans-serif; padding:8px; }
.screens { background-repeat:repeat; background-position:left top; width:100%; overflow:hidden; background-image:url(medarot-screen-placeholder.png); background-color:#000; }
.screens img { vertical-align:middle; }
.container { max-width:1120px; width:100%; margin:0 auto; }
a { text-decoration:none; color:#D68C10; }
a:hover { color:#F2583A; }
.buttons { width:100%; overflow:hidden; }
.button { float:left; max-width:100%; }
.buttoni { padding:8px 8px 0 0; }
.button a { display:block; padding:8px; background:#D68C10; color:#FFF; font-weight:bold; font-size:18px; font-family:Candara,Calibri,Segoe,Segoe UI,Optima,Arial,sans-serif;  }
.button a:hover { background:#F2583A; }
@media only screen and (min-width:320px) {
	.logo-2x { display:block; }
	.header { height:80px; }
}
@media only screen and (min-width:640px) {
	.logo-4x { display:block; }
	.header { height:160px; }
}
@media only screen and (max-width:1119px) {
	.container { max-width:640px; }
}
@media only screen and (max-width:639px) {
	.container { max-width:320px; }
}
@media only screen and (max-width:319px) {
	.container { max-width:160px; }
	.button { float:none; }
	.buttoni { padding:8px 0 0; }
}
@media only screen and (max-width:180px) {
	h2 { font-size:18px; }
	.desc { font-size:12px; }
}