0
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
1 /*
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
2 * Skeleton V2.0.4
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
3 * Copyright 2014, Dave Gamache
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
4 * www.getskeleton.com
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
5 * Free to use under the MIT license.
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
6 * http://www.opensource.org/licenses/mit-license.php
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
7 * 12/29/2014
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
8 */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
9
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
10
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
11 /* Table of contents
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
12 ––––––––––––––––––––––––––––––––––––––––––––––––––
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
13 - Grid
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
14 - Base Styles
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
15 - Typography
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
16 - Links
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
17 - Buttons
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
18 - Forms
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
19 - Lists
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
20 - Code
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
21 - Tables
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
22 - Spacing
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
23 - Utilities
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
24 - Clearing
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
25 - Media Queries
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
26 */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
27
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
28
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
29 /* Grid
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
30 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
31 .container {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
32 position: relative;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
33 width: 100%;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
34 max-width: 960px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
35 margin: 0 auto;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
36 padding: 0 20px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
37 box-sizing: border-box; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
38 .column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
39 .columns {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
40 width: 100%;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
41 float: left;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
42 box-sizing: border-box; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
43
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
44 /* For devices larger than 400px */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
45 @media (min-width: 400px) {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
46 .container {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
47 width: 85%;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
48 padding: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
49 }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
50
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
51 /* For devices larger than 550px */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
52 @media (min-width: 550px) {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
53 .container {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
54 width: 80%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
55 .column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
56 .columns {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
57 margin-left: 4%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
58 .column:first-child,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
59 .columns:first-child {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
60 margin-left: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
61
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
62 .one.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
63 .one.columns { width: 4.66666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
64 .two.columns { width: 13.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
65 .three.columns { width: 22%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
66 .four.columns { width: 30.6666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
67 .five.columns { width: 39.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
68 .six.columns { width: 48%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
69 .seven.columns { width: 56.6666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
70 .eight.columns { width: 65.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
71 .nine.columns { width: 74.0%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
72 .ten.columns { width: 82.6666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
73 .eleven.columns { width: 91.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
74 .twelve.columns { width: 100%; margin-left: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
75
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
76 .one-third.column { width: 30.6666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
77 .two-thirds.column { width: 65.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
78
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
79 .one-half.column { width: 48%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
80
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
81 /* Offsets */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
82 .offset-by-one.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
83 .offset-by-one.columns { margin-left: 8.66666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
84 .offset-by-two.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
85 .offset-by-two.columns { margin-left: 17.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
86 .offset-by-three.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
87 .offset-by-three.columns { margin-left: 26%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
88 .offset-by-four.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
89 .offset-by-four.columns { margin-left: 34.6666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
90 .offset-by-five.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
91 .offset-by-five.columns { margin-left: 43.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
92 .offset-by-six.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
93 .offset-by-six.columns { margin-left: 52%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
94 .offset-by-seven.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
95 .offset-by-seven.columns { margin-left: 60.6666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
96 .offset-by-eight.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
97 .offset-by-eight.columns { margin-left: 69.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
98 .offset-by-nine.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
99 .offset-by-nine.columns { margin-left: 78.0%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
100 .offset-by-ten.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
101 .offset-by-ten.columns { margin-left: 86.6666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
102 .offset-by-eleven.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
103 .offset-by-eleven.columns { margin-left: 95.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
104
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
105 .offset-by-one-third.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
106 .offset-by-one-third.columns { margin-left: 34.6666666667%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
107 .offset-by-two-thirds.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
108 .offset-by-two-thirds.columns { margin-left: 69.3333333333%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
109
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
110 .offset-by-one-half.column,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
111 .offset-by-one-half.columns { margin-left: 52%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
112
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
113 }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
114
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
115
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
116 /* Base Styles
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
117 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
118 /* NOTE
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
119 html is set to 62.5% so that all the REM measurements throughout Skeleton
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
120 are based on 10px sizing. So basically 1.5rem = 15px :) */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
121 html {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
122 font-size: 62.5%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
123 body {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
124 font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
125 line-height: 1.6;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
126 font-weight: 400;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
127 font-family: "Open Sans", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
128 color: #515151; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
129
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
130
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
131 /* Typography
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
132 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
133 h1, h2, h3, h4, h5, h6 {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
134 margin-top: 0;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
135 margin-bottom: 2rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
136 font-weight: 300; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
137 h1 { font-size: 4.0rem; line-height: 1.2; letter-spacing: -.1rem;}
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
138 h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
139 h3 { font-size: 3.0rem; line-height: 1.3; letter-spacing: -.1rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
140 h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
141 h5 { font-size: 1.8rem; line-height: 1.5; letter-spacing: -.05rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
142 h6 { font-size: 1.5rem; line-height: 1.6; letter-spacing: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
143
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
144 /* Larger than phablet */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
145 @media (min-width: 550px) {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
146 h1 { font-size: 5.0rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
147 h2 { font-size: 4.2rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
148 h3 { font-size: 3.6rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
149 h4 { font-size: 3.0rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
150 h5 { font-size: 2.4rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
151 h6 { font-size: 1.5rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
152 }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
153
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
154 p {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
155 margin-top: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
156
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
157
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
158 /* Links
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
159 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
160 a {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
161 color: #00b4ff; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
162 a:hover {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
163 color: #008CD7; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
164
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
165
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
166 /* Buttons
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
167 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
168 .button,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
169 button,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
170 input[type="submit"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
171 input[type="reset"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
172 input[type="button"] {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
173 display: inline-block;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
174 height: 38px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
175 padding: 0 30px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
176 color: #555;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
177 text-align: center;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
178 font-size: 11px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
179 font-weight: 600;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
180 line-height: 38px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
181 letter-spacing: .1rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
182 text-transform: uppercase;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
183 text-decoration: none;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
184 white-space: nowrap;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
185 background-color: transparent;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
186 border-radius: 4px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
187 border: 1px solid #bbb;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
188 cursor: pointer;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
189 box-sizing: border-box; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
190 .button:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
191 button:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
192 input[type="submit"]:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
193 input[type="reset"]:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
194 input[type="button"]:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
195 .button:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
196 button:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
197 input[type="submit"]:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
198 input[type="reset"]:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
199 input[type="button"]:focus {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
200 color: #333;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
201 border-color: #888;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
202 outline: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
203 .button.button-primary,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
204 button.button-primary,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
205 input[type="submit"].button-primary,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
206 input[type="reset"].button-primary,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
207 input[type="button"].button-primary {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
208 color: #FFF;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
209 background-color: #33C3F0;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
210 border-color: #33C3F0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
211 .button.button-primary:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
212 button.button-primary:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
213 input[type="submit"].button-primary:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
214 input[type="reset"].button-primary:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
215 input[type="button"].button-primary:hover,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
216 .button.button-primary:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
217 button.button-primary:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
218 input[type="submit"].button-primary:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
219 input[type="reset"].button-primary:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
220 input[type="button"].button-primary:focus {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
221 color: #FFF;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
222 background-color: #1EAEDB;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
223 border-color: #1EAEDB; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
224
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
225
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
226 /* Forms
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
227 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
228 input[type="email"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
229 input[type="number"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
230 input[type="search"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
231 input[type="text"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
232 input[type="tel"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
233 input[type="url"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
234 input[type="password"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
235 textarea,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
236 select {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
237 height: 38px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
238 padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
239 background-color: #fff;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
240 border: 1px solid #D1D1D1;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
241 border-radius: 4px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
242 box-shadow: none;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
243 box-sizing: border-box; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
244 /* Removes awkward default styles on some inputs for iOS */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
245 input[type="email"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
246 input[type="number"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
247 input[type="search"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
248 input[type="text"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
249 input[type="tel"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
250 input[type="url"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
251 input[type="password"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
252 textarea {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
253 -webkit-appearance: none;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
254 -moz-appearance: none;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
255 appearance: none; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
256 textarea {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
257 min-height: 65px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
258 padding-top: 6px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
259 padding-bottom: 6px; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
260 input[type="email"]:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
261 input[type="number"]:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
262 input[type="search"]:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
263 input[type="text"]:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
264 input[type="tel"]:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
265 input[type="url"]:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
266 input[type="password"]:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
267 textarea:focus,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
268 select:focus {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
269 border: 1px solid #33C3F0;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
270 outline: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
271 label,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
272 legend {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
273 display: block;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
274 margin-bottom: .5rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
275 font-weight: 600; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
276 fieldset {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
277 padding: 0;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
278 border-width: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
279 input[type="checkbox"],
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
280 input[type="radio"] {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
281 display: inline; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
282 label > .label-body {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
283 display: inline-block;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
284 margin-left: .5rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
285 font-weight: normal; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
286
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
287
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
288 /* Lists
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
289 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
290 ul {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
291 list-style: circle inside; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
292 ol {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
293 list-style: decimal inside; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
294 ol, ul {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
295 padding-left: 0;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
296 margin-top: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
297 ul ul,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
298 ul ol,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
299 ol ol,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
300 ol ul {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
301 margin: 1.5rem 0 1.5rem 3rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
302 font-size: 90%; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
303 li {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
304 margin-bottom: 1rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
305
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
306
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
307 /* Code
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
308 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
309 code {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
310 padding: .2rem .5rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
311 margin: 0 .2rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
312 font-size: 90%;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
313 white-space: nowrap;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
314 background: #F1F1F1;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
315 border: 1px solid #E1E1E1;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
316 border-radius: 4px; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
317 pre > code {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
318 display: block;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
319 padding: 1rem 1.5rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
320 white-space: pre; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
321
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
322
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
323 /* Tables
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
324 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
325 th,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
326 td {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
327 padding: 12px 15px;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
328 text-align: left;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
329 border-bottom: 1px solid #E1E1E1; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
330
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
331 /*th:first-child,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
332 td:first-child {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
333 padding-left: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
334 th:last-child,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
335 td:last-child {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
336 padding-right: 0; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
337 */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
338
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
339 /* Spacing
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
340 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
341 button,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
342 .button {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
343 margin-bottom: 1rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
344 input,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
345 textarea,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
346 select,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
347 fieldset {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
348 margin-bottom: 1.5rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
349 pre,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
350 blockquote,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
351 dl,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
352 figure,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
353 table,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
354 p,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
355 ul,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
356 ol,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
357 form {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
358 margin-bottom: 2.5rem; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
359
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
360
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
361 /* Utilities
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
362 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
363 .u-full-width {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
364 width: 100%;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
365 box-sizing: border-box; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
366 .u-max-full-width {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
367 max-width: 100%;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
368 box-sizing: border-box; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
369 .u-pull-right {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
370 float: right; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
371 .u-pull-left {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
372 float: left; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
373
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
374
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
375 /* Misc
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
376 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
377 hr {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
378 margin-top: 3rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
379 margin-bottom: 3.5rem;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
380 border-width: 0;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
381 border-top: 1px solid #E1E1E1; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
382
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
383
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
384 /* Clearing
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
385 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
386
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
387 /* Self Clearing Goodness */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
388 .container:after,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
389 .row:after,
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
390 .u-cf {
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
391 content: "";
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
392 display: table;
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
393 clear: both; }
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
394
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
395
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
396 /* Media Queries
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
397 –––––––––––––––––––––––––––––––––––––––––––––––––– */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
398 /*
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
399 Note: The best way to structure the use of media queries is to create the queries
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
400 near the relevant code. For example, if you wanted to change the styles for buttons
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
401 on small devices, paste the mobile query code up in the buttons section and style it
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
402 there.
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
403 */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
404
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
405
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
406 /* Larger than mobile */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
407 @media (min-width: 400px) {}
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
408
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
409 /* Larger than phablet (also point when grid becomes active) */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
410 @media (min-width: 550px) {}
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
411
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
412 /* Larger than tablet */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
413 @media (min-width: 750px) {}
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
414
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
415 /* Larger than desktop */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
416 @media (min-width: 1000px) {}
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
417
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
418 /* Larger than Desktop HD */
|
Vimalkumar Velayudhan <vimal@biotechcoder.com>
parents:
diff
changeset
|
419 @media (min-width: 1200px) {}
|