90 |
91 |
92 |
93 |
94 |
95 |
Graduate Certificate
96 |
GC
97 |
98 |
99 |
Doctorate
100 |
D
101 |
102 |
103 |
Master
104 |
M
105 |
106 |
107 |
108 |
109 |
110 |
111 |
A
112 |
113 |
114 | $factsheet ) {
117 | $factsheet_character = trim( substr( $factsheet_name, 0, 1 ) );
118 |
119 | // Avoid indefinite loops by skipping factsheets that don't start with a-z.
120 | if ( ! preg_match( '/^[a-zA-Z]$/', $factsheet_character ) ) {
121 | continue;
122 | }
123 |
124 | // Output the letter separators between sets of factsheets.
125 | while ( 0 !== strcasecmp( $factsheet_character, $letter ) ) {
126 | echo ' ';
127 |
128 | // It's funny and sad, but this works. a becomes b, z becomes aa.
129 | $letter++;
130 | ?>
131 |
132 |
133 |
134 |
135 |
136 |
145 |
146 |
147 |
155 |
158 |
159 |
167 |
168 |
171 |
172 |
173 |
176 |
177 |
178 | ' . esc_html( $factsheet_name ) . '';
180 |
181 | if ( ! empty( $item['degree_type'] ) ) {
182 | echo ' | ' . esc_html( $item['degree_type'] );
183 | }
184 |
185 | if ( ! empty( $item['program_name'] ) ) {
186 | echo ' | ' . esc_html( $item['program_name'] );
187 | }
188 | ?>
189 |
190 |
191 |
199 |
200 |
201 |
204 |
205 |
208 |
209 |
210 |
215 |
220 |
224 |
225 |
226 |
227 |
243 |
244 |
245 |
246 |
247 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
Program URL:
26 |
27 |
28 |
29 | Faculty working with Students:
30 |
31 |
32 |
33 |
34 | Students:
35 |
36 |
37 |
38 |
39 | Students receiving assistantships or scholarships:
40 | %
41 |
42 |
43 |
44 |
Priority deadline:
45 |
46 |
47 | ' . esc_html( $fs_deadline['semester'] ) . ' ' . esc_html( $fs_deadline['deadline'] ) . ' ' . esc_html( $fs_deadline['international'] ) . '';
66 | }
67 | ?>
68 |
69 |
70 |
71 |
72 |
73 |
Campus:
74 |
75 |
76 | $fs_location_status ) {
78 | if ( 'No' === $fs_location_status || 'By Exception' === $fs_location_status ) {
79 | continue;
80 | }
81 | echo '' . esc_html( $fs_location ) . ': ' . esc_html( $fs_location_status ) . ' ';
82 | }
83 | ?>
84 |
85 |
86 |
87 |
88 |
89 |
Tests required:
90 |
91 |
92 | ' . esc_html( $fs_requirement['score'] ) . ' ' . esc_html( $fs_requirement['test'] ) . ' ' . esc_html( $fs_requirement['description'] ) . '';
95 | }
96 | ?>
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
Degree Description:
110 |
111 |
112 |
113 |
114 |
115 |
116 |
Admission Requirements:
117 |
118 |
119 |
120 |
121 |
122 |
123 |
Student Learning Outcomes:
124 |
125 |
126 |
127 |
128 |
129 |
130 |
Student Opportunities:
131 |
132 |
133 |
134 |
135 |
136 |
137 |
Career Opportunities:
138 |
139 |
140 |
141 |
142 |
143 |
144 |
Career Placements:
145 |
146 |
147 |
148 |
149 |
150 |
Faculty Members:
151 |
154 |
155 |
,
156 |
157 |
158 |
159 |
160 |
Location:
161 |
162 |
163 |
164 |
165 |
166 |
167 |
168 |
169 |
170 |
Research Interests
171 |
172 |
173 |
174 |
175 |
178 |
179 |
180 |
181 |
Contact Information:
182 |
185 |
186 |
187 |
188 |
189 |
190 |
191 |
192 |
193 |
194 |
195 |
196 |
197 |
198 | ,
199 |
200 |
201 |
202 |
203 |
204 |
205 |
206 |
207 |
208 |
209 |
210 |
211 |
212 |
213 |
214 |
215 |
218 |
219 |
220 |
221 |
237 |
244 |
245 | setup_hooks();
32 | }
33 | return self::$instance;
34 | }
35 |
36 | /**
37 | * Setup hooks to include.
38 | *
39 | * @since 0.4.0
40 | */
41 | public function setup_hooks() {
42 | add_action( 'init', array( $this, 'register_taxonomy' ), 20 );
43 |
44 | add_action( "{$this->taxonomy_slug}_add_form_fields", array( $this, 'term_add_form_fields' ), 10 );
45 | add_action( "created_{$this->taxonomy_slug}", array( $this, 'save_new_term_form_fields' ) );
46 |
47 | add_action( "{$this->taxonomy_slug}_edit_form_fields", array( $this, 'term_edit_form_fields' ), 10 );
48 | add_action( "edit_{$this->taxonomy_slug}", array( $this, 'save_term_form_fields' ) );
49 |
50 | add_filter( "manage_edit-{$this->taxonomy_slug}_columns", array( $this, 'add_custom_columns' ) );
51 | add_filter( "manage_edit-{$this->taxonomy_slug}_sortable_columns", array( $this, 'add_custom_columns' ) );
52 | add_filter( "manage_{$this->taxonomy_slug}_custom_column", array( $this, 'manage_custom_columns' ), 10, 3 );
53 |
54 | add_action( 'parse_term_query', array( $this, 'sort_custom_columns' ) );
55 | }
56 |
57 | /**
58 | * Registers the faculty taxonomy that will track faculty members that should be
59 | * displayed in a degree program's factsheet.
60 | *
61 | * @since 0.4.0
62 | */
63 | public function register_taxonomy() {
64 | $labels = array(
65 | 'name' => 'Faculty Members',
66 | 'singular_name' => 'Faculty Member',
67 | 'search_items' => 'Search faculty members',
68 | 'all_items' => 'All Faculty',
69 | 'edit_item' => 'Edit Faculty Member',
70 | 'update_item' => 'Update Faculty Member',
71 | 'add_new_item' => 'Add New Faculty Member',
72 | 'new_item_name' => 'New Faculty Member',
73 | 'menu_name' => 'Faculty Members',
74 | );
75 | $args = array(
76 | 'labels' => $labels,
77 | 'description' => 'Faculty associated with degree program factsheets.',
78 | 'public' => false,
79 | 'hierarchical' => false,
80 | 'show_ui' => true,
81 | 'show_in_menu' => true,
82 | 'rewrite' => false,
83 | 'show_in_rest' => true,
84 | );
85 | register_taxonomy( $this->taxonomy_slug, array( WSUWP_Graduate_Degree_Programs()->post_type_slug ), $args );
86 | }
87 |
88 | /**
89 | * Generates a unique ID to maintain future relationships when a new
90 | * faculty member is created.
91 | *
92 | * @since 0.11.0
93 | *
94 | * @param int $term_id
95 | */
96 | public function save_new_term_form_fields( $term_id ) {
97 | check_admin_referer( 'add-tag', '_wpnonce_add-tag' );
98 |
99 | $uuid = wp_generate_uuid4();
100 | update_term_meta( $term_id, 'gs_relationship_id', $uuid );
101 |
102 | $this->save_common_term_fields( $term_id );
103 | }
104 |
105 | /**
106 | * Saves the additional form fields whenever a term is updated.
107 | *
108 | * @since 0.4.0
109 | *
110 | * @param int $term_id The ID of the term being edited.
111 | */
112 | public function save_term_form_fields( $term_id ) {
113 | global $wp_list_table;
114 |
115 | if ( 'editedtag' !== $wp_list_table->current_action() ) {
116 | return;
117 | }
118 |
119 | // Reuse the default nonce that is checked in `edit-tags.php`.
120 | check_admin_referer( 'update-tag_' . $term_id );
121 |
122 | $this->save_common_term_fields( $term_id );
123 | }
124 |
125 | /**
126 | * Handles the saving of common fields used in the add and edit term forms.
127 | *
128 | * @since 0.11.0
129 | *
130 | * @param int $term_id
131 | */
132 | private function save_common_term_fields( $term_id ) {
133 |
134 | if ( isset( $_POST['degree_abbreviation'] ) ) { // WPCS: CSRF ok. (Nonce already checked)
135 | update_term_meta( $term_id, 'gs_degree_abbreviation', sanitize_text_field( $_POST['degree_abbreviation'] ) ); // WPCS: CSRF ok. (Nonce already checked)
136 | }
137 |
138 | if ( isset( $_POST['email'] ) ) { // WPCS: CSRF ok. (Nonce already checked)
139 | update_term_meta( $term_id, 'gs_faculty_email', sanitize_email( $_POST['email'] ) ); // WPCS: CSRF ok. (Nonce already checked)
140 | }
141 |
142 | if ( isset( $_POST['faculty_location'] ) ) { // WPCS: CSRF ok. (Nonce already checked)
143 | update_term_meta( $term_id, 'gs_faculty_location', sanitize_text_field( $_POST['faculty_location'] ) ); // WPCS: CSRF ok. (Nonce already checked)
144 | }
145 |
146 | if ( isset( $_POST['faculty_url'] ) ) { // WPCS: CSRF ok. (Nonce already checked)
147 | update_term_meta( $term_id, 'gs_faculty_url', sanitize_text_field( $_POST['faculty_url'] ) ); // WPCS: CSRF ok. (Nonce already checked)
148 | }
149 |
150 | if ( isset( $_POST['research_interests'] ) ) { // WPCS: CSRF ok. (Nonce already checked)
151 | update_term_meta( $term_id, 'gs_research_interests', wp_kses_post( $_POST['research_interests'] ) ); // WPCS: CSRF ok. (Nonce already checked)
152 | }
153 | }
154 |
155 |
156 | /**
157 | * Retrieves all of the expected faculty meta assigned to a term.
158 | *
159 | * @since 0.7.0
160 | *
161 | * @param int $term_id
162 | *
163 | * @return array
164 | */
165 | public static function get_all_term_meta( $term_id ) {
166 | $term_meta = array();
167 |
168 | $term_meta['uuid'] = get_term_meta( $term_id, 'gs_relationship_id', true );
169 | $term_meta['degree_abbreviation'] = get_term_meta( $term_id, 'gs_degree_abbreviation', true );
170 | $term_meta['email'] = get_term_meta( $term_id, 'gs_faculty_email', true );
171 | $term_meta['faculty_location'] = get_term_meta( $term_id, 'gs_faculty_location', true );
172 | $term_meta['url'] = get_term_meta( $term_id, 'gs_faculty_url', true );
173 | $term_meta['research_interests'] = get_term_meta( $term_id, 'gs_research_interests', true );
174 |
175 | return $term_meta;
176 | }
177 |
178 | /**
179 | * Captures information about a faculty member on the new term input screen.
180 | *
181 | * @since 0.11.0
182 | */
183 | public function term_add_form_fields() {
184 | ?>
185 |
186 | Degree abbreviation
187 |
188 |
189 |
190 | Email
191 |
192 |
193 |
194 | Campus/Location
195 |
196 |
197 |
198 | URL
199 |
200 |
201 |
202 | Research interests
203 |
204 |
205 | term_id );
217 | ?>
218 |
219 |
220 | Unique ID
221 |
222 |
223 |
224 |
225 |
226 |
227 |
228 | Degree abbreviation
229 |
230 |
231 |
232 |
233 |
234 |
235 |
236 | Email
237 |
238 |
239 |
240 |
241 |
242 |
243 |
244 | Campus/Location:
245 |
246 |
247 |
248 |
249 |
250 |
251 |
252 | URL
253 |
254 |
255 |
256 |
257 |
258 |
259 |
260 | Research interests
261 |
262 |
263 |
264 |
265 |
266 | '
',
279 | 'name' => 'Name',
280 | 'email' => 'Email',
281 | 'url' => 'URL',
282 | 'slug' => 'Slug',
283 | 'posts' => 'Count',
284 | );
285 |
286 | return $columns;
287 | }
288 |
289 | /**
290 | * Displays additional data in the custom columns added to the faculty members
291 | * list table.
292 | *
293 | * @since 0.11.0
294 | *
295 | * @param string $content The current content for the column.
296 | * @param string $column_slug The slug representing the column.
297 | * @param int $term_id ID of the term being displayed.
298 | *
299 | * @return string Replacement content for the column.
300 | */
301 | public function manage_custom_columns( $content, $column_slug, $term_id ) {
302 | if ( 'email' === $column_slug ) {
303 | $content = sanitize_email( get_term_meta( $term_id, 'gs_faculty_email', true ) );
304 | }
305 |
306 | if ( 'url' === $column_slug ) {
307 | $content = sanitize_text_field( get_term_meta( $term_id, 'gs_faculty_url', true ) );
308 | }
309 |
310 | return $content;
311 | }
312 |
313 | /**
314 | * Sorts the term list table by custom column.
315 | *
316 | * @since 0.11.0
317 | *
318 | * @param WP_Term_Query $term_query
319 | */
320 | public function sort_custom_columns( $term_query ) {
321 | if ( ! isset( $_REQUEST['orderby'] ) || ! isset( $_REQUEST['order'] ) ) { // WPCS: CSRF Ok.
322 | return;
323 | }
324 |
325 | if ( 'Email' === $_REQUEST['orderby'] ) { // WPCS: CSRF Ok.
326 | $term_query->query_vars['orderby'] = 'meta_value';
327 | $term_query->query_vars['meta_key'] = 'gs_faculty_email';
328 | } elseif ( 'URL' === $_REQUEST['orderby'] ) { // WPCS: CSRF Ok.
329 | $term_query->query_vars['orderby'] = 'meta_value';
330 | $term_query->query_vars['meta_key'] = 'gs_faculty_url';
331 | }
332 | }
333 | }
334 |
--------------------------------------------------------------------------------
/css/10-stylesheet.css:
--------------------------------------------------------------------------------
1 | /* Rework starts here */
2 | #jacket {
3 | background-color: #23282b;
4 | }
5 |
6 | /* ----- General ----- */
7 | body.home:not(.has-background-image) #jacket,
8 | #jacket {
9 | background-size: 260px;
10 | background-attachment: fixed;
11 | }
12 |
13 | .section-wrapper,
14 | .section-wrapper-has-background {
15 | background-size: cover;
16 | background-position: center top;
17 | }
18 |
19 | /* ----- Main Header ----- */
20 | .style-bookmark .main-header {
21 | left: 0;
22 | }
23 |
24 | .colors-gray .main-header {
25 | background: rgb(148, 25, 43);
26 | background: linear-gradient(to right, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, 1) 50%, rgba(240, 103, 21, 1) 100%);
27 | filter: progid:dximagetransform.microsoft.gradient(startColorstr="#94192b", endColorstr="#f06715", GradientType=1);
28 | border-bottom: none;
29 | padding: 1rem 0;
30 | max-width: 1188px;
31 | height: auto;
32 | z-index: 100;
33 | position: relative;
34 | }
35 |
36 | .progressbar {
37 | background: rgb(148, 25, 43);
38 | background: linear-gradient(to right, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, 1) 50%, rgba(240, 103, 21, 1) 100%);
39 | filter: progid:dximagetransform.microsoft.gradient(startColorstr="#94192b", endColorstr="#f06715", GradientType=1);
40 | background-repeat: repeat;
41 | background-position: left top;
42 | width: 1188px;
43 | top: 0;
44 | height: 4px;
45 | z-index: 99;
46 | position: fixed;
47 | }
48 |
49 | sub.sub-header {
50 | display: none;
51 | }
52 |
53 | .main-header .header-group:not(.unset) {
54 | padding: .7em 2rem;
55 | position: relative;
56 | }
57 |
58 | .main-header sub:not(.unset),
59 | .main-header sup:not(.unset),
60 | .main-header sup a {
61 | display: inline-block;
62 | font-size: 13px;
63 | }
64 |
65 | .main-header .sup-header:not(.unset) a,
66 | .sub-header span,
67 | .sup-header-default {
68 | color: #fff;
69 | font-weight: 700;
70 | letter-spacing: 2px;
71 | }
72 |
73 | .main-header .header-group,
74 | .main-header .header-group:not(.x) {
75 | position: relative;
76 | width: auto;
77 | bottom: 0;
78 | padding-right: 0;
79 | }
80 |
81 | .sub-header span {
82 | border-left: 1px solid #fff;
83 | font-weight: 300;
84 | margin-left: 1em;
85 | padding-left: 1.25em;
86 | text-transform: uppercase;
87 | color: #fff;
88 | }
89 |
90 | /* #f06715, #ab0d24, #94192b, #c60c2f */
91 |
92 | /* ----- HTML Styles ----- */
93 | p,
94 | ol li,
95 | ul li {
96 | font-size: 1em;
97 | font-weight: 300;
98 | color: #464e54;
99 | }
100 |
101 | h1 {
102 | font-size: 3.2em;
103 | font-weight: 300;
104 | text-transform: uppercase;
105 | padding: .5em 0;
106 | color: #23282b;
107 | background: -webkit-linear-gradient(135deg, #f06715, #94192b);
108 | -webkit-background-clip: text;
109 | -webkit-text-fill-color: transparent;
110 | }
111 |
112 | h2 {
113 | font-size: 1.5rem;
114 | line-height: 1.5;
115 | font-weight: 300;
116 | padding: .5em 0;
117 | text-transform: none;
118 | }
119 |
120 | h3 {
121 | font-weight: 300;
122 | font-size: 1.2rem;
123 | line-height: 1.2;
124 | padding: .7em 0 .3em;
125 | text-transform: none;
126 | }
127 |
128 | h4 {
129 | font-size: .95rem;
130 | font-weight: 600;
131 | padding: .7em 0 .5em;
132 | }
133 |
134 | h5 {
135 | font-size: .9em;
136 | font-weight: 700;
137 | padding: .7em 0 .5em;
138 | margin-top: .9em;
139 | text-transform: uppercase;
140 | }
141 |
142 | h6 {
143 | font-size: .8em;
144 | font-weight: 600;
145 | padding: .7em 0 .5em;
146 | margin-top: 1em;
147 | }
148 |
149 | /* ----- A ----- */
150 | .column a {
151 | color: #ab0d24;
152 | transition-property: color, background;
153 | transition-duration: .4s, .4s;
154 | cursor: pointer;
155 | border-bottom: 2px solid rgba(0, 0, 0, .05);
156 | }
157 |
158 | .column a:hover {
159 | color: #b7203d;
160 | border-bottom: 2px solid #b7203d;
161 | }
162 |
163 | a.anchorimage:before,
164 | a.anchorimage:after {
165 | display: none;
166 | }
167 |
168 | b,
169 | strong {
170 | font-weight: 600;
171 | }
172 |
173 | /* #f06715, #ab0d24, #94192b, #c60c2f */
174 |
175 | /* ----- Hero ----- */
176 | .hero-xl,
177 | .hero-xl .column.one,
178 | .hero-lrg,
179 | .hero-lrg .column.one,
180 | .hero-med,
181 | .hero-med .column.one,
182 | .hero-sm,
183 | .hero-sm .column.one {
184 | display: flex;
185 | background-size: cover;
186 | }
187 |
188 | .hero-xl .column.one,
189 | .hero-lrg .column.one,
190 | .hero-med .column.one,
191 | .hero-sm .column.one {
192 | padding-top: 0;
193 | padding-bottom: 0;
194 | }
195 |
196 | .hero-xl h1,
197 | .hero-lrg h1,
198 | .hero-med h1,
199 | .hero-sm h1,
200 | .hero-xl h2,
201 | .hero-lrg h2,
202 | .hero-med h2,
203 | .hero-sm h2,
204 | .hero-xl h3,
205 | .hero-lrg h3,
206 | .hero-med h3,
207 | .hero-sm h3,
208 | .hero-xl h4,
209 | .hero-lrg h4,
210 | .hero-med h4,
211 | .hero-sm h4,
212 | .hero-xl h5,
213 | .hero-lrg h5,
214 | .hero-med h5,
215 | .hero-sm h5,
216 | .hero-xl h6,
217 | .hero-lrg h6,
218 | .hero-med h6,
219 | .hero-sm h6,
220 | .hero-xl p,
221 | .hero-lrg p,
222 | .hero-med p,
223 | .hero-sm p {
224 | color: #fff;
225 | }
226 |
227 | .hero-xl {
228 | min-height: 640px;
229 | }
230 |
231 | .hero-lrg {
232 | min-height: 420px;
233 | }
234 |
235 | .hero-med {
236 | min-height: 320px;
237 | }
238 |
239 | .hero-sm {
240 | min-height: 160px;
241 | }
242 |
243 | .homepage {
244 | background-image: url(https://wsuwp-uploads.s3.amazonaws.com/uploads/sites/1485/2016/10/img-hero.jpg);
245 | }
246 |
247 | .homepage h1 {
248 | font-size: 4.375em;
249 | font-weight: 800;
250 | text-transform: uppercase;
251 | padding-top: 0;
252 | text-align: center;
253 | color: #fff;
254 | background: none;
255 | -webkit-text-fill-color: #fff;
256 | }
257 |
258 | .homepage h1.topsm {
259 | font-size: .825em;
260 | font-weight: 600;
261 | letter-spacing: 8px;
262 | text-transform: uppercase;
263 | padding-top: 0;
264 | padding-bottom: .2em;
265 | color: #fff;
266 | }
267 |
268 | /* ----- Flex Wrapper to Center Content (x-y) ----- */
269 | .flexwrap {
270 | min-height: 100%;
271 | width: 100%;
272 | padding: 0;
273 | margin: 0;
274 | display: flex;
275 | align-items: center;
276 | flex-direction: column;
277 | justify-content: center;
278 | resize: vertical;
279 | }
280 |
281 | .flexwrap.left {
282 | align-items: flex-start;
283 | justify-content: center;
284 | }
285 |
286 | .flexwrap h1 {
287 | animation: fadein 2s;
288 | }
289 |
290 | .white-text h1 {
291 | color: #fff;
292 | background: none;
293 | -webkit-background-clip: initial;
294 | -webkit-text-fill-color: initial;
295 | }
296 |
297 | .hero-xl .flexwrap {
298 | min-height: 640px;
299 | }
300 |
301 | .hero-lrg .flexwrap {
302 | min-height: 420px;
303 | }
304 |
305 | .hero-med .flexwrap {
306 | min-height: 320px;
307 | }
308 |
309 | .hero-sm .flexwrap {
310 | min-height: 160px;
311 | }
312 |
313 | /* ----- UL LI ----- */
314 | .column ul {
315 | padding: 0;
316 | }
317 |
318 | .column ul li {
319 | list-style-type: none;
320 | position: relative;
321 | margin-left: 2em;
322 | }
323 |
324 | .column ul li:before {
325 | content: "\25cf";
326 | display: inline-block;
327 | position: absolute;
328 | left: -1em;
329 | color: #ab0d24;
330 | font-weight: 700;
331 | list-style-type: disc;
332 | }
333 |
334 | /* #f06715, #ab0d24, #94192b, #c60c2f */
335 |
336 | /* ----- OL LI ----- */
337 | aside .wsuwp-content-syndicate-wrapper ul,
338 | ol {
339 | list-style-type: none;
340 | margin: 0;
341 | margin-left: 2em;
342 | padding: 0;
343 | counter-reset: li-counter;
344 | }
345 |
346 | ol > li,
347 | aside .wsuwp-content-syndicate-wrapper ul > li {
348 | position: relative;
349 | margin-bottom: 1em;
350 | padding-left: 1.5em;
351 | }
352 |
353 | ol > li:before,
354 | aside .wsuwp-content-syndicate-wrapper ul li:before {
355 | position: absolute;
356 | top: -.2em;
357 | width: 30px;
358 | height: 30px;
359 | left: -1.6em;
360 | text-align: center;
361 | color: #464e54;
362 | padding: 0;
363 | line-height: 30px;
364 | border-radius: 50%;
365 | border: 1px solid #e5e5e5;
366 | background-color: #f8f8f8;
367 | content: counter(li-counter);
368 | counter-increment: li-counter;
369 | font-weight: 700;
370 | font-size: .8em;
371 | }
372 |
373 | /* ----- MISC ----- */
374 | .clear,
375 | .clear:after {
376 | clear: both;
377 | content: "";
378 | display: block;
379 | }
380 |
381 | /* ----- Pics ----- */
382 | .portrait,
383 | .landscape {
384 | position: relative;
385 | width: 120px;
386 | height: 120px;
387 | overflow: hidden;
388 | display: block;
389 | margin: 10px;
390 | border-radius: 50%;
391 | background: rgba(0, 0, 0, .1) url(./images/landscape-wht-xl.png) no-repeat center center;
392 | background-size: 24px;
393 | }
394 |
395 | .portrait.sm {
396 | width: 72px;
397 | height: 72px;
398 | }
399 |
400 | .portrait a,
401 | .landscape a {
402 | width: 100%;
403 | height: 100%;
404 | position: absolute;
405 | top: 0;
406 | left: 0;
407 | }
408 |
409 | .portrait a:hover,
410 | .landscape a:hover {
411 | filter: grayscale(80%);
412 | opacity: 1;
413 | }
414 |
415 | .portrait img {
416 | width: 100%;
417 | height: auto;
418 | }
419 |
420 | .landscape img {
421 | width: auto;
422 | height: 100%;
423 | }
424 |
425 | .column.two .portrait,
426 | .column.two .landscape {
427 | width: 280px;
428 | height: 280px;
429 | margin: 10px auto;
430 | }
431 |
432 | p.email,
433 | p.title,
434 | p.mobile,
435 | p.phone {
436 | padding: 0 28px;
437 | margin-bottom: 0;
438 | }
439 |
440 | /* ----- Aside ----- */
441 | aside {
442 | min-width: 240px;
443 | margin: 0 10px;
444 | padding: 30px;
445 | text-align: left;
446 | border-radius: 10px;
447 | box-sizing: border-box;
448 | background: #f7f7f8;
449 | }
450 |
451 | aside a {
452 | color: #b7203d;
453 | font-size: .9em;
454 | font-weight: 600;
455 | transition-property: color, background;
456 | transition-duration: .4s, .4s;
457 | cursor: pointer;
458 | border: none;
459 | }
460 |
461 | aside a:hover {
462 | color: rgba(0, 0, 0, .6);
463 | }
464 |
465 | aside a:before,
466 | aside a:after {
467 | display: none !important;
468 | content: none;
469 | }
470 |
471 | .column.one.heromask-gradient {
472 | background: linear-gradient(to left, #23282b, #23282b);
473 | }
474 |
475 | main.spine-blank-template {
476 | background-repeat: no-repeat;
477 | background-position: right bottom;
478 | background-size: 340px;
479 | }
480 |
481 | .pad-bottom {
482 | padding-bottom: 5rem;
483 | }
484 |
485 | .pad-bottom-sm,
486 | .flexwrap p:last-child {
487 | padding-bottom: 2rem;
488 | }
489 |
490 | .right {
491 | float: right;
492 | }
493 |
494 | .left {
495 | float: left;
496 | }
497 |
498 | /* ----- Buttons ----- */
499 | a.btncrimson,
500 | a.btnred,
501 | a.btnmedred,
502 | a.btndrkred,
503 | a.btnlhtgry,
504 | a.btngry,
505 | a.btnmedgry,
506 | a.btndrkgry,
507 | a.btnorange,
508 | a.btnwht,
509 | a.btnblk {
510 | display: inline-block;
511 | min-width: 120px;
512 | margin: 4px;
513 | padding: 15px 40px;
514 | background: rgba(0, 0, 0, 0);
515 | font: 600 12px/12px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
516 | text-transform: uppercase;
517 | text-align: center;
518 | text-shadow: none;
519 | transition-property: color, background;
520 | transition-duration: .4s, .4s;
521 | cursor: pointer;
522 | }
523 |
524 | a.btncrimson:before,
525 | a.btnred:before,
526 | a.btnmedred:before,
527 | a.btndrkred:before,
528 | a.btnlhtgry:before,
529 | a.btngry:before,
530 | a.btnmedgry:before,
531 | a.btndrkgry:before,
532 | a.btnorange:before,
533 | a.btnwht:before,
534 | a.btnblk:before,
535 | a.btncrimson:after,
536 | a.btnred:after,
537 | a.btnmedred:after,
538 | a.btndrkred:after,
539 | a.btnlhtgry:after,
540 | a.btngry:after,
541 | a.btnmedgry:after,
542 | a.btndrkgry:after,
543 | a.btnorange:after,
544 | a.btnwht:after,
545 | a.btnblk:after {
546 | display: none;
547 | }
548 |
549 | /* ----- Buttons (Round Corners) ----- */
550 | a.btncrimson.round,
551 | a.btnred.round,
552 | a.btnmedred.round,
553 | a.btndrkred.round,
554 | a.btnlhtgry.round,
555 | a.btngry.round,
556 | a.btnmedgry.round,
557 | a.btndrkgry.round,
558 | a.btnorange.round,
559 | a.btnwht.round,
560 | a.btnblk.round {
561 | border-radius: 4px;
562 | }
563 |
564 | /* ----- Buttons (Bubble) ----- */
565 | a.btncrimson.bubble,
566 | a.btnred.bubble,
567 | a.btnmedred.bubble,
568 | a.btndrkred.bubble,
569 | a.btnlhtgry.bubble,
570 | a.btngry.bubble,
571 | a.btnmedgry.bubble,
572 | a.btndrkgry.bubble,
573 | a.btnorange.bubble,
574 | a.btnwht.bubble,
575 | a.btnblk.bubble {
576 | border-radius: 50px;
577 | }
578 |
579 | /* ----- Buttons (Small) ----- */
580 | a.btncrimson.sm,
581 | a.btnred.sm,
582 | a.btnmedred.sm,
583 | a.btndrkred.sm,
584 | a.btnlhtgry.sm,
585 | a.btngry.sm,
586 | a.btnmedgry.sm,
587 | a.btndrkgry.sm,
588 | a.btnorange.sm,
589 | a.btnwht.sm,
590 | a.btnblk.sm {
591 | text-transform: capitalize;
592 | padding: 8px 25px;
593 | }
594 |
595 | /* ----- Buttons (X-Large) ----- */
596 | a.btncrimson.xl,
597 | a.btnred.xl,
598 | a.btnmedred.xl,
599 | a.btndrkred.xl,
600 | a.btnlhtgry.xl,
601 | a.btngry.xl,
602 | a.btnmedgry.xl,
603 | a.btndrkgry.xl,
604 | a.btnorange.xl,
605 | a.btnwht.xl,
606 | a.btnblk.xl {
607 | display: block;
608 | }
609 |
610 | /* #f06715, #ab0d24, #94192b, #c60c2f */
611 |
612 | /* ----- Buttons (Colors) ----- */
613 | a.btncrimson {
614 | color: #981e32;
615 | border: 1px solid #981e32;
616 | }
617 |
618 | a.btncrimson:hover {
619 | background: #981e32;
620 | border: 1px solid #981e32;
621 | }
622 |
623 | a.btnred {
624 | color: #c60c2f;
625 | border: 1px solid #c60c2f;
626 | }
627 |
628 | a.btnred:hover {
629 | background: #c60c2f;
630 | border: 1px solid #c60c2f;
631 | }
632 |
633 | a.btnmedred {
634 | color: #ab0d24;
635 | border: 1px solid #ab0d24;
636 | }
637 |
638 | a.btnmedred:hover {
639 | background: #ab0d24;
640 | border: 1px solid #ab0d24;
641 | }
642 |
643 | a.btndrkred {
644 | color: #94192b;
645 | border: 1px solid #94192b;
646 | }
647 |
648 | a.btndrkred:hover {
649 | background: #94192b;
650 | border: 1px solid #94192b;
651 | }
652 |
653 | a.btnlhtgry {
654 | color: rgba(0, 0, 0, .3);
655 | border: 1px solid rgba(0, 0, 0, .3);
656 | }
657 |
658 | a.btnlhtgry:hover {
659 | background: rgba(0, 0, 0, .3);
660 | border: 1px solid rgba(0, 0, 0, .3);
661 | }
662 |
663 | a.btngry {
664 | color: #5e6a71;
665 | border: 1px solid #5e6a71;
666 | }
667 |
668 | a.btngry:hover {
669 | background: #5e6a71;
670 | border: 1px solid #5e6a71;
671 | }
672 |
673 | a.btnmedgry {
674 | color: rgba(59, 59, 59, 1);
675 | border: 1px solid rgba(59, 59, 59, 1);
676 | }
677 |
678 | a.btnmedgry:hover {
679 | background: rgba(59, 59, 59, 1);
680 | border: 1px solid rgba(59, 59, 59, 1);
681 | }
682 |
683 | a.btndrkgry {
684 | color: rgba(34, 34, 34, 1);
685 | border: 1px solid rgba(34, 34, 34, 1);
686 | }
687 |
688 | a.btndrkgry:hover {
689 | background: rgba(34, 34, 34, 1);
690 | border: 1px solid rgba(34, 34, 34, 1);
691 | }
692 |
693 | a.btnorange {
694 | color: #f06715;
695 | border: 1px solid #f06715;
696 | }
697 |
698 | a.btnorange:hover {
699 | background: #f06715;
700 | border: 1px solid #f06715;
701 | }
702 |
703 | a.btnwht {
704 | color: rgba(255, 255, 255, 1);
705 | border: 1px solid rgba(255, 255, 255, 1);
706 | }
707 |
708 | a.btnwht:hover {
709 | color: #ab0d24;
710 | background: rgba(255, 255, 255, 1);
711 | border: 1px solid rgba(255, 255, 255, 1);
712 | }
713 |
714 | a.btnblk {
715 | color: rgba(0, 0, 0, 1);
716 | border: 1px solid rgba(0, 0, 0, 1);
717 | }
718 |
719 | a.btnblk:hover {
720 | background: rgba(0, 0, 0, 1);
721 | border: 1px solid rgba(0, 0, 0, 1);
722 | }
723 |
724 | a.btncrimson:hover,
725 | a.btnlhtgry:hover,
726 | a.btngry:hover,
727 | a.btnmedgry:hover,
728 | a.btndrkgry:hover,
729 | a.btnorange:hover,
730 | a.btnblk:hover {
731 | color: #fff;
732 | opacity: 1;
733 | }
734 |
735 | a.btnwht:hover {
736 | opacity: 1;
737 | }
738 |
739 | /* ----- HR ----- */
740 | hr {
741 | background-color: rgba(93, 105, 112, .1);
742 | margin: 3em 0;
743 | }
744 |
745 | /* ----- Page Footer ----- */
746 | .footer {
747 | z-index: 10;
748 | min-width: 1188px;
749 | position: fixed;
750 | bottom: 0;
751 | display: block;
752 | margin: 0;
753 | padding: 0;
754 | background-color: rgba(255, 255, 255, .9);
755 | }
756 |
757 | .footer:after {
758 | clear: both;
759 | content: "";
760 | display: block;
761 | }
762 |
763 | .footer ul {
764 | border-top: 1px solid rgba(228, 230, 231, .9);
765 | padding: 2px 0 10px;
766 | margin-left: 32px;
767 | display: block;
768 | color: #464e54;
769 | list-style-type: none;
770 | }
771 |
772 | .footer ul li {
773 | display: inline;
774 | margin: 0;
775 | padding: 0;
776 | font-size: .65em;
777 | font-family: "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
778 | font-weight: 400;
779 | text-align: left;
780 | color: #464e54;
781 | list-style-type: none;
782 | }
783 |
784 | .footer ul li:after {
785 | content: ",";
786 | margin: 0;
787 | }
788 |
789 | .footer ul li:before {
790 | content: "";
791 | display: none;
792 | list-style-type: none;
793 | }
794 |
795 | .footer ul li:last-child:after {
796 | content: "";
797 | }
798 |
799 | .team {
800 | min-width: 20%;
801 | min-height: 200px;
802 | align-items: stretch;
803 | text-align: start;
804 | box-sizing: border-box;
805 | padding: 0;
806 | flex: 1;
807 | position: relative;
808 | z-index: 1;
809 | }
810 |
811 | .team .portrait,
812 | .team .landscape {
813 | margin: 0 auto;
814 | }
815 |
816 | main {
817 | background-color: #fff;
818 | }
819 |
820 | /* ----- Graduate News (HOME) ----- */
821 | .newswrap {
822 | min-height: 100%;
823 | width: 100%;
824 | padding: 0;
825 | margin: 0;
826 | display: flex;
827 | align-items: center;
828 | flex-direction: column;
829 | justify-content: center;
830 | resize: vertical;
831 | }
832 |
833 | .newswrap.left {
834 | align-items: flex-start;
835 | justify-content: center;
836 | }
837 |
838 | .newsandevents h1,
839 | .newswrap.left h3.topsm,
840 | .newsandevents h3.topsm,
841 | h3.topsm {
842 | font-size: .825em;
843 | font-weight: 600;
844 | letter-spacing: 8px;
845 | text-transform: uppercase;
846 | padding-top: 0;
847 | padding-bottom: .2em;
848 | }
849 |
850 | .newsandevents h3.topsm {
851 | color: #464e54;
852 | }
853 |
854 | .newsandevents .column {
855 | text-align: left;
856 | }
857 |
858 | .newswrap.left h3 {
859 | padding-top: 0;
860 | }
861 |
862 | .hero-xl .newswrap {
863 | min-height: 640px;
864 | }
865 |
866 | .hero-lrg .newswrap {
867 | min-height: 420px;
868 | }
869 |
870 | .hero-med .newswrap {
871 | min-height: 320px;
872 | }
873 |
874 | .hero-sm .newswrap {
875 | min-height: 160px;
876 | }
877 |
878 | .newswrap:after {
879 | position: absolute;
880 | content: "";
881 | top: 0;
882 | left: 0;
883 | width: 100%;
884 | height: 100%;
885 | z-index: -1;
886 | background: linear-gradient(45deg, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, .1) 50%, rgba(240, 103, 21, .4) 100%);
887 | }
888 |
889 | /* ----- CSS3 Fadein Animation ----- */
890 | @keyframes fadein {
891 |
892 | from {
893 | opacity: 0;
894 | }
895 |
896 | to {
897 | opacity: 1;
898 | }
899 | }
900 |
901 | @-moz-keyframes fadein {
902 |
903 | from {
904 | opacity: 0;
905 | }
906 |
907 | to {
908 | opacity: 1;
909 | }
910 | }
911 |
912 | @-webkit-keyframes fadein {
913 |
914 | from {
915 | opacity: 0;
916 | }
917 |
918 | to {
919 | opacity: 1;
920 | }
921 | }
922 |
923 | @-o-keyframes fadein {
924 |
925 | from {
926 | opacity: 0;
927 | }
928 |
929 | to {
930 | opacity: 1;
931 | }
932 | }
933 |
934 | /* ------------------------- MEDIA SCREEN ------------------------- */
935 | @media screen and (max-width: 990px) {
936 |
937 | main.spine-blank-template {
938 | background-size: 320px;
939 | }
940 |
941 | .colors-gray .main-header {
942 | width: auto;
943 | }
944 |
945 | .progressbar {
946 | width: 100%;
947 | top: 49px;
948 | }
949 |
950 | .gutter-lrg {
951 | padding-left: 0;
952 | padding-right: 0;
953 | }
954 |
955 | .flexwrap p {
956 | font-size: .75em;
957 | }
958 |
959 | .team {
960 | -ms-flex: 1 1 auto;
961 | flex: 1 1 auto;
962 | }
963 |
964 | .team {
965 | min-width: 33.333333333333%;
966 | }
967 | }
968 |
969 | @media screen and (max-width: 693px) {
970 |
971 | .sub-header span {
972 | border-left: none;
973 | margin-left: 0;
974 | padding-left: 0;
975 | }
976 |
977 | .flexwrap h1 {
978 | font: 800 40px/35px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
979 | }
980 |
981 | .smallh1 h1 {
982 | font: 800 40px/40px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
983 | color: #fff;
984 | }
985 |
986 | .homepage h1 {
987 | font: 800 50px/45px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
988 | }
989 |
990 | .homepage h1.topsm {
991 | letter-spacing: 6px;
992 | }
993 |
994 | .homepage .event p {
995 | padding-top: 1.5em;
996 | }
997 |
998 | .team {
999 | width: 50%;
1000 | }
1001 |
1002 | .footer {
1003 | position: relative;
1004 | }
1005 |
1006 | .footer ul li {
1007 | display: block;
1008 | padding-top: 8px;
1009 | font-size: .45em;
1010 | }
1011 |
1012 | .footer ul li:after {
1013 | content: "";
1014 | margin: 0;
1015 | }
1016 |
1017 | .portrait,
1018 | .landscape {
1019 | width: 100px;
1020 | height: 100px;
1021 | }
1022 |
1023 | p.email,
1024 | p.title,
1025 | p.mobile,
1026 | p.phone {
1027 | font-size: smaller;
1028 | }
1029 | }
1030 |
1031 | /* About WSU */
1032 | .whitesection {
1033 | background-color: #fff;
1034 | text-align: center;
1035 | }
1036 |
1037 | .aboutwsugradprogram h3.topsm {
1038 | margin-bottom: 40px;
1039 | text-transform: uppercase;
1040 | padding-top: 0;
1041 | }
1042 |
1043 | h1.smspaced {
1044 | color: #23282b;
1045 | -webkit-text-fill-color: #23282b;
1046 | margin-bottom: 40px;
1047 | font: 800 14px/15px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
1048 | letter-spacing: 6px;
1049 | text-transform: uppercase;
1050 | padding-top: 0;
1051 | }
1052 |
1053 | .whitesection.aboutwsugradprogram {
1054 | padding: 40px 0;
1055 | }
1056 |
1057 | .fluid .aboutwsugradprogram .column.one {
1058 | margin: 0 auto;
1059 | width: auto;
1060 | }
1061 |
1062 | h2.sm {
1063 | font-size: 9px;
1064 | border-left: none;
1065 | }
1066 |
1067 | h2.sm.second {
1068 | min-height: 20px;
1069 | }
1070 |
1071 | .circles {
1072 | display: flex;
1073 | align-items: center;
1074 | flex-wrap: wrap;
1075 | width: 100%;
1076 | justify-content: center;
1077 | }
1078 |
1079 | .circle {
1080 | position: relative;
1081 | width: 250px;
1082 | height: 250px;
1083 | overflow: hidden;
1084 | margin: 10px;
1085 | border-radius: 50%;
1086 | background: rgba(0, 0, 0, .1);
1087 | background-size: 24px;
1088 | text-align: center;
1089 | display: flex;
1090 | justify-content: center;
1091 | align-items: center;
1092 | }
1093 |
1094 | .circle h2,
1095 | .circle h1 {
1096 | color: #23282b;
1097 | }
1098 |
1099 | .circle h1 {
1100 | font-weight: 800;
1101 | padding: 0;
1102 | }
1103 |
1104 | .circle.gradient h2,
1105 | .circle.gradient h1 {
1106 | -webkit-text-fill-color: #fff;
1107 | color: #fff;
1108 | }
1109 |
1110 | .circle.gradient h1 {
1111 | font-weight: 800;
1112 | }
1113 |
1114 | .circle.gradient h2 {
1115 | font-weight: 400;
1116 | }
1117 |
1118 | .circle div {
1119 | margin: 0;
1120 | padding: 20px;
1121 | }
1122 |
1123 | .circle.gradient {
1124 | background: linear-gradient(to top, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, 1) 50%, rgba(240, 103, 21, 1) 100%);
1125 | color: #fff;
1126 | }
1127 |
1128 | .circle h2 {
1129 | left: 0;
1130 | padding-left: 0;
1131 | }
1132 |
1133 | .aboutwsugradprogram h1.topsm {
1134 | font-size: 15px;
1135 | font-weight: 700;
1136 | }
1137 |
1138 | .aboutwsugradprogram h2.bigbtm {
1139 | margin-top: 40px;
1140 | }
1141 |
1142 | .aboutwsugradprogram p {
1143 | margin: 20px;
1144 | }
1145 |
1146 | .row .column .centervertically {
1147 | position: absolute;
1148 | top: 50%;
1149 | transform: translateY(-50%);
1150 | width: 100%;
1151 | }
1152 |
1153 | /* News & Events */
1154 | section.newsandevents {
1155 | padding: 40px 0;
1156 | }
1157 |
1158 | .newsandevents .divider,
1159 | .content-item-event-meta {
1160 | display: block;
1161 | height: 0;
1162 | margin: 0 0 35px;
1163 | }
1164 |
1165 | .newsandevents .content-item-excerpt {
1166 | margin-bottom: 35px;
1167 | }
1168 |
1169 | .newsandevents h1.smspaced {
1170 | -webkit-text-fill-color: #23282b;
1171 | }
1172 |
1173 | .newsandevents .portrait {
1174 | position: absolute;
1175 | left: 0;
1176 | top: -20px;
1177 | }
1178 |
1179 | .newsandevents h1,
1180 | .newsandevents p {
1181 | text-align: left;
1182 | padding: 0;
1183 | margin: 0;
1184 | }
1185 |
1186 | .newsandevents .column.two .portrait {
1187 | width: 120px;
1188 | height: 120px;
1189 | float: left;
1190 | margin-right: 20px;
1191 | position: absolute;
1192 | left: 0;
1193 | }
1194 |
1195 | .column.one ul li.wsuwp-content-syndicate-item:before {
1196 | display: none;
1197 | }
1198 |
1199 | .column ul li.wsuwp-content-syndicate-item {
1200 | margin-left: 0;
1201 | }
1202 |
1203 | .column ul li.wsuwp-content-syndicate-item img {
1204 | display: none;
1205 | }
1206 |
1207 | .wsuwp_university_category-graduate-programs .newsandevents {
1208 | padding: 40px 0;
1209 | }
1210 |
1211 | .newsandevents .content-item-excerpt img {
1212 | display: none;
1213 | }
1214 |
1215 | .newsandevents ul {
1216 | margin-top: 40px;
1217 | }
1218 |
1219 | .newsandevents ul li {
1220 | text-align: left;
1221 | position: relative;
1222 | margin-left: 0;
1223 | }
1224 |
1225 | .newsandevents ul.withportrait li {
1226 | padding-left: 100px;
1227 | min-height: 92px;
1228 | }
1229 |
1230 | .newsandevents ul li h4 {
1231 | color: #262729;
1232 | }
1233 |
1234 | .newsandevents ul.withportrait li:first-child h4 {
1235 | color: #94192b;
1236 | }
1237 |
1238 | .newsandevents ul li p {
1239 | color: #262729;
1240 | }
1241 |
1242 | .newsandevents .wsuwp-content-syndicate-event,
1243 | .newsandevents .wsuwp-content-syndicate-item {
1244 | border-bottom: 1px solid rgba(0, 0, 0, .1);
1245 | display: flex;
1246 | flex-direction: column-reverse;
1247 | margin-bottom: 25px;
1248 | }
1249 |
1250 | .wsuwp-content-syndicate-wrapper {
1251 | margin-top: 40px;
1252 | }
1253 |
1254 | .content-item-event-date,
1255 | .content-item-event-title,
1256 | .content-item-title {
1257 | order: 1;
1258 | }
1259 |
1260 | .content-item-event-meta {
1261 | order: 0;
1262 | }
1263 |
1264 | .content-item-event-date {
1265 | font-weight: 700;
1266 | margin-top: 0;
1267 | }
1268 |
1269 | .content-item-event-title a,
1270 | .content-item-title a {
1271 | font-weight: 600;
1272 | padding: 0;
1273 | font-size: .91rem;
1274 | }
1275 |
1276 | .content-item-byline-author,
1277 | .content-item-byline-date,
1278 | .content-item-read-story {
1279 | display: none;
1280 | }
1281 |
1282 | /* Last Section */
1283 | .greysection {
1284 | padding: 40px 0;
1285 | background-color: rgba(59, 59, 59, 1);
1286 | min-height: 500px;
1287 | }
1288 |
1289 | .greysection h1.smspaced,
1290 | .greysection h3.topsm {
1291 | color: #fff;
1292 | text-align: left;
1293 | }
1294 |
1295 | .footersection ul {
1296 | float: left;
1297 | margin-right: 40px;
1298 | }
1299 |
1300 | .footersection ul li:before {
1301 | display: none;
1302 | }
1303 |
1304 | .footersection ul li {
1305 | margin-bottom: .7em;
1306 | font-size: .91em;
1307 | margin-left: 0;
1308 | }
1309 |
1310 | .footersection ul li a {
1311 | color: #fff;
1312 | }
1313 |
1314 | .footersection div.floatright {
1315 | float: right;
1316 | }
1317 |
1318 | .footersection div.floatleft {
1319 | float: left;
1320 | }
1321 |
1322 | .footersection .directorinfo {
1323 | margin-right: 60px;
1324 | text-align: right;
1325 | font-size: .91em;
1326 | min-width: 300px;
1327 | }
1328 |
1329 | .footersection .directorinfo p a {
1330 | color: #fff;
1331 | }
1332 |
1333 | .footersection .portrait {
1334 | width: 55px;
1335 | height: 55px;
1336 | margin-left: auto;
1337 | }
1338 |
1339 | .directorinfo h3 {
1340 | padding-bottom: 0;
1341 | font-size: .92rem;
1342 | }
1343 |
1344 | .directorinfo h3.worktitle {
1345 | padding-bottom: 10px;
1346 | font-style: italic;
1347 | font-size: .85rem;
1348 | }
1349 |
1350 | .footersection h3.topsm {
1351 | color: #fff;
1352 | background: none;
1353 | -webkit-text-fill-color: #fff;
1354 | margin-bottom: 50px;
1355 | }
1356 |
1357 | .footersection p.email,
1358 | .footersection p.title,
1359 | .footersection p.mobile,
1360 | .footersection p.phone {
1361 | background: none;
1362 | padding: 0;
1363 | }
1364 |
1365 | .column.one.centervertically {
1366 | margin: 0;
1367 | padding: 0;
1368 | }
1369 |
1370 | /* Chrome/Opera/Safari */
1371 | ::-webkit-input-placeholder {
1372 | font-weight: 300;
1373 | }
1374 |
1375 | /* Firefox 19+ */
1376 | ::-moz-placeholder {
1377 | font-weight: 300;
1378 | }
1379 |
1380 | /* IE 10+ */
1381 | :-ms-input-placeholder {
1382 | font-weight: 300;
1383 | }
1384 |
1385 | /* Firefox 18- */
1386 | :-moz-placeholder {
1387 | font-weight: 300;
1388 | }
1389 |
1390 | /* directory */
1391 | .directory {
1392 | min-width: 150px;
1393 | width: 25%;
1394 | margin-top: 15px;
1395 | }
1396 |
1397 | .directory p {
1398 | margin-left: 0;
1399 | padding-left: 0;
1400 | }
1401 |
1402 | .directory .details {
1403 | margin-left: 15px;
1404 | }
1405 |
1406 | .directory p.email {
1407 | background: url(./images/email-gry.png) no-repeat left 6px;
1408 | background-size: 16px;
1409 | padding-left: 25px;
1410 | }
1411 |
1412 | .directory p.title {
1413 | background: url(./images/ribbon-gry.png) no-repeat left 6px;
1414 | background-size: 16px;
1415 | padding-left: 25px;
1416 | }
1417 |
1418 | .directory p.mobile {
1419 | background: url(./images/mobile-gry.png) no-repeat left 6px;
1420 | background-size: 16px;
1421 | padding-left: 25px;
1422 | }
1423 |
1424 | .directory p.phone {
1425 | background: url(./images/phone-gry.png) no-repeat left 6px;
1426 | background-size: 16px;
1427 | padding-left: 25px;
1428 | }
1429 |
1430 | .column.one.heromask-gradient {
1431 | background: linear-gradient(45deg, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, .1) 50%, rgba(240, 103, 21, .4) 100%);
1432 | }
1433 |
1434 | @media screen and (max-width: 768px) {
1435 |
1436 | .footer ul li a {
1437 | font-size: 1.45em;
1438 | }
1439 |
1440 | .centervertically {
1441 | position: relative;
1442 | top: auto;
1443 | transform: none;
1444 | }
1445 |
1446 | .aboutwsugradprogram p {
1447 | margin: auto;
1448 | }
1449 |
1450 | .footersection .directorinfo {
1451 | margin-right: auto;
1452 | }
1453 | }
1454 |
1455 | .flexright {
1456 | order: 1;
1457 | }
1458 |
1459 | .directorywrapper {
1460 | display: flex;
1461 | flex-wrap: wrap;
1462 | }
1463 |
1464 | section.row.siteid {
1465 | background-color: #f7f7f8;
1466 | }
1467 |
1468 | section.padtop {
1469 | margin-top: 15px;
1470 | }
1471 |
1472 | .clr:before,
1473 | .clr:after {
1474 | display: table;
1475 | content: " ";
1476 | clear: both;
1477 | font-size: 0;
1478 | }
1479 |
1480 | section.row .column {
1481 | padding-top: 2rem;
1482 | }
1483 |
1484 | /* Fix events calendar */
1485 | body.events-archive .column.one {
1486 | width: 100%;
1487 | }
1488 |
1489 | /* fix footer padding */
1490 | .lastsectionwithfooter {
1491 | padding-top: 5em;
1492 | }
1493 |
1494 | .column.one .footer a:before,
1495 | .column.one .footer a:after {
1496 | display: none;
1497 | }
1498 |
1499 | .newsandevents ul li:before {
1500 | display: none;
1501 | }
1502 |
1503 | .factsheet-url {
1504 | font-size: 1.2em;
1505 | }
1506 |
1507 | .factsheet-statistics-wrapper {
1508 | margin-top: 2em;
1509 | }
1510 |
1511 | .factsheet-stat {
1512 | font-size: 1.1em;
1513 | display: flex;
1514 | width: 100%;
1515 | margin-bottom: .5em;
1516 | border-top: 1px solid #efefef;
1517 | padding: .3em 0 0;
1518 | }
1519 |
1520 | .factsheet-set,
1521 | .factsheet-value,
1522 | .factsheet-label {
1523 | flex-basis: 50%;
1524 | }
1525 |
1526 | .factsheet-value {
1527 | text-align: left;
1528 | }
1529 |
1530 | .column .factsheet-stat ul li:before {
1531 | display: none;
1532 | content: "";
1533 | }
1534 |
1535 | .column .factsheet-set ul li {
1536 | margin-left: 0;
1537 | }
1538 |
1539 | .factsheet-contact {
1540 | margin-bottom: 1.5em;
1541 | }
1542 |
1543 | .visuallyhidden {
1544 | position: absolute;
1545 | overflow: hidden;
1546 | clip: rect(0 0 0 0);
1547 | height: 1px;
1548 | width: 1px;
1549 | margin: -1px;
1550 | padding: 0;
1551 | border: 0;
1552 | }
1553 |
1554 | .factsheet-faculty {
1555 | margin-left: .75em;
1556 | margin-bottom: 1em;
1557 | border-bottom: 1px solid #eee;
1558 | }
1559 |
1560 | .factsheet-faculty h3 {
1561 | font-weight: 400;
1562 | margin-bottom: 0;
1563 | }
1564 |
1565 | .factsheet-faculty h4 {
1566 | font-weight: 400;
1567 | }
1568 |
1569 | .factsheet-faculty-relationship {
1570 | margin-top: 1em;
1571 | }
1572 |
--------------------------------------------------------------------------------
/style.css:
--------------------------------------------------------------------------------
1 | /*
2 | Theme Name: WSU Grad School
3 | Theme URI: https://gradschool.wsu.edu/
4 | Description: A WSU Spine child theme for the Graduate School.
5 | Author: WSU University Communications
6 | Author URI: https://web.wsu.edu/
7 | Template: spine
8 | Version: 1.4.5
9 | */
10 |
11 | /* Rework starts here */
12 | #jacket {
13 | background-color: #23282b;
14 | }
15 |
16 | /* ----- General ----- */
17 | body.home:not(.has-background-image) #jacket,
18 | #jacket {
19 | background-size: 260px;
20 | background-attachment: fixed;
21 | }
22 |
23 | .section-wrapper,
24 | .section-wrapper-has-background {
25 | background-size: cover;
26 | background-position: center top;
27 | }
28 |
29 | /* ----- Main Header ----- */
30 | .style-bookmark .main-header {
31 | left: 0;
32 | }
33 |
34 | .colors-gray .main-header {
35 | background: rgb(148, 25, 43);
36 | background: linear-gradient(to right, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, 1) 50%, rgba(240, 103, 21, 1) 100%);
37 | -webkit-filter: progid:dximagetransform.microsoft.gradient(startColorstr="#94192b", endColorstr="#f06715", GradientType=1);
38 | filter: progid:dximagetransform.microsoft.gradient(startColorstr="#94192b", endColorstr="#f06715", GradientType=1);
39 | border-bottom: none;
40 | padding: 1rem 0;
41 | max-width: 1188px;
42 | height: auto;
43 | z-index: 100;
44 | position: relative;
45 | }
46 |
47 | .progressbar {
48 | background: rgb(148, 25, 43);
49 | background: linear-gradient(to right, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, 1) 50%, rgba(240, 103, 21, 1) 100%);
50 | -webkit-filter: progid:dximagetransform.microsoft.gradient(startColorstr="#94192b", endColorstr="#f06715", GradientType=1);
51 | filter: progid:dximagetransform.microsoft.gradient(startColorstr="#94192b", endColorstr="#f06715", GradientType=1);
52 | background-repeat: repeat;
53 | background-position: left top;
54 | width: 1188px;
55 | top: 0;
56 | height: 4px;
57 | z-index: 99;
58 | position: fixed;
59 | }
60 |
61 | sub.sub-header {
62 | display: none;
63 | }
64 |
65 | .main-header .header-group:not(.unset) {
66 | padding: .7em 2rem;
67 | position: relative;
68 | }
69 |
70 | .main-header sub:not(.unset),
71 | .main-header sup:not(.unset),
72 | .main-header sup a {
73 | display: inline-block;
74 | font-size: 13px;
75 | }
76 |
77 | .main-header .sup-header:not(.unset) a,
78 | .sub-header span,
79 | .sup-header-default {
80 | color: #fff;
81 | font-weight: 700;
82 | letter-spacing: 2px;
83 | }
84 |
85 | .main-header .header-group,
86 | .main-header .header-group:not(.x) {
87 | position: relative;
88 | width: auto;
89 | bottom: 0;
90 | padding-right: 0;
91 | }
92 |
93 | .sub-header span {
94 | border-left: 1px solid #fff;
95 | font-weight: 300;
96 | margin-left: 1em;
97 | padding-left: 1.25em;
98 | text-transform: uppercase;
99 | color: #fff;
100 | }
101 |
102 | /* #f06715, #ab0d24, #94192b, #c60c2f */
103 |
104 | /* ----- HTML Styles ----- */
105 | p,
106 | ol li,
107 | ul li {
108 | font-size: 1em;
109 | font-weight: 300;
110 | color: #464e54;
111 | }
112 |
113 | h1 {
114 | font-size: 3.2em;
115 | font-weight: 300;
116 | text-transform: uppercase;
117 | padding: .5em 0;
118 | color: #23282b;
119 | background: -webkit-linear-gradient(135deg, #f06715, #94192b);
120 | -webkit-background-clip: text;
121 | -webkit-text-fill-color: transparent;
122 | }
123 |
124 | h2 {
125 | font-size: 1.5rem;
126 | line-height: 1.5;
127 | font-weight: 300;
128 | padding: .5em 0;
129 | text-transform: none;
130 | }
131 |
132 | h3 {
133 | font-weight: 300;
134 | font-size: 1.2rem;
135 | line-height: 1.2;
136 | padding: .7em 0 .3em;
137 | text-transform: none;
138 | }
139 |
140 | h4 {
141 | font-size: .95rem;
142 | font-weight: 600;
143 | padding: .7em 0 .5em;
144 | }
145 |
146 | h5 {
147 | font-size: .9em;
148 | font-weight: 700;
149 | padding: .7em 0 .5em;
150 | margin-top: .9em;
151 | text-transform: uppercase;
152 | }
153 |
154 | h6 {
155 | font-size: .8em;
156 | font-weight: 600;
157 | padding: .7em 0 .5em;
158 | margin-top: 1em;
159 | }
160 |
161 | /* ----- A ----- */
162 | .column a {
163 | color: #ab0d24;
164 | transition-property: color, background;
165 | transition-duration: .4s, .4s;
166 | cursor: pointer;
167 | border-bottom: 2px solid rgba(0, 0, 0, .05);
168 | }
169 |
170 | .column a:hover {
171 | color: #b7203d;
172 | border-bottom: 2px solid #b7203d;
173 | }
174 |
175 | a.anchorimage:before,
176 | a.anchorimage:after {
177 | display: none;
178 | }
179 |
180 | b,
181 | strong {
182 | font-weight: 600;
183 | }
184 |
185 | /* #f06715, #ab0d24, #94192b, #c60c2f */
186 |
187 | /* ----- Hero ----- */
188 | .hero-xl,
189 | .hero-xl .column.one,
190 | .hero-lrg,
191 | .hero-lrg .column.one,
192 | .hero-med,
193 | .hero-med .column.one,
194 | .hero-sm,
195 | .hero-sm .column.one {
196 | display: -webkit-box;
197 | display: -ms-flexbox;
198 | display: flex;
199 | background-size: cover;
200 | }
201 |
202 | .hero-xl .column.one,
203 | .hero-lrg .column.one,
204 | .hero-med .column.one,
205 | .hero-sm .column.one {
206 | padding-top: 0;
207 | padding-bottom: 0;
208 | }
209 |
210 | .hero-xl h1,
211 | .hero-lrg h1,
212 | .hero-med h1,
213 | .hero-sm h1,
214 | .hero-xl h2,
215 | .hero-lrg h2,
216 | .hero-med h2,
217 | .hero-sm h2,
218 | .hero-xl h3,
219 | .hero-lrg h3,
220 | .hero-med h3,
221 | .hero-sm h3,
222 | .hero-xl h4,
223 | .hero-lrg h4,
224 | .hero-med h4,
225 | .hero-sm h4,
226 | .hero-xl h5,
227 | .hero-lrg h5,
228 | .hero-med h5,
229 | .hero-sm h5,
230 | .hero-xl h6,
231 | .hero-lrg h6,
232 | .hero-med h6,
233 | .hero-sm h6,
234 | .hero-xl p,
235 | .hero-lrg p,
236 | .hero-med p,
237 | .hero-sm p {
238 | color: #fff;
239 | }
240 |
241 | .hero-xl {
242 | min-height: 640px;
243 | }
244 |
245 | .hero-lrg {
246 | min-height: 420px;
247 | }
248 |
249 | .hero-med {
250 | min-height: 320px;
251 | }
252 |
253 | .hero-sm {
254 | min-height: 160px;
255 | }
256 |
257 | .homepage {
258 | background-image: url(https://wsuwp-uploads.s3.amazonaws.com/uploads/sites/1485/2016/10/img-hero.jpg);
259 | }
260 |
261 | .homepage h1 {
262 | font-size: 4.375em;
263 | font-weight: 800;
264 | text-transform: uppercase;
265 | padding-top: 0;
266 | text-align: center;
267 | color: #fff;
268 | background: none;
269 | -webkit-text-fill-color: #fff;
270 | }
271 |
272 | .homepage h1.topsm {
273 | font-size: .825em;
274 | font-weight: 600;
275 | letter-spacing: 8px;
276 | text-transform: uppercase;
277 | padding-top: 0;
278 | padding-bottom: .2em;
279 | color: #fff;
280 | }
281 |
282 | /* ----- Flex Wrapper to Center Content (x-y) ----- */
283 | .flexwrap {
284 | min-height: 100%;
285 | width: 100%;
286 | padding: 0;
287 | margin: 0;
288 | display: -webkit-box;
289 | display: -ms-flexbox;
290 | display: flex;
291 | -webkit-box-align: center;
292 | -ms-flex-align: center;
293 | align-items: center;
294 | -webkit-box-orient: vertical;
295 | -webkit-box-direction: normal;
296 | -ms-flex-direction: column;
297 | flex-direction: column;
298 | -webkit-box-pack: center;
299 | -ms-flex-pack: center;
300 | justify-content: center;
301 | resize: vertical;
302 | }
303 |
304 | .flexwrap.left {
305 | -webkit-box-align: start;
306 | -ms-flex-align: start;
307 | align-items: flex-start;
308 | -webkit-box-pack: center;
309 | -ms-flex-pack: center;
310 | justify-content: center;
311 | }
312 |
313 | .flexwrap h1 {
314 | -webkit-animation: fadein 2s;
315 | animation: fadein 2s;
316 | }
317 |
318 | .white-text h1 {
319 | color: #fff;
320 | background: none;
321 | -webkit-background-clip: initial;
322 | -webkit-text-fill-color: initial;
323 | }
324 |
325 | .hero-xl .flexwrap {
326 | min-height: 640px;
327 | }
328 |
329 | .hero-lrg .flexwrap {
330 | min-height: 420px;
331 | }
332 |
333 | .hero-med .flexwrap {
334 | min-height: 320px;
335 | }
336 |
337 | .hero-sm .flexwrap {
338 | min-height: 160px;
339 | }
340 |
341 | /* ----- UL LI ----- */
342 | .column ul {
343 | padding: 0;
344 | }
345 |
346 | .column ul li {
347 | list-style-type: none;
348 | position: relative;
349 | margin-left: 2em;
350 | }
351 |
352 | .column ul li:before {
353 | content: "\25cf";
354 | display: inline-block;
355 | position: absolute;
356 | left: -1em;
357 | color: #ab0d24;
358 | font-weight: 700;
359 | list-style-type: disc;
360 | }
361 |
362 | /* #f06715, #ab0d24, #94192b, #c60c2f */
363 |
364 | /* ----- OL LI ----- */
365 | aside .wsuwp-content-syndicate-wrapper ul,
366 | ol {
367 | list-style-type: none;
368 | margin: 0;
369 | margin-left: 2em;
370 | padding: 0;
371 | counter-reset: li-counter;
372 | }
373 |
374 | ol > li,
375 | aside .wsuwp-content-syndicate-wrapper ul > li {
376 | position: relative;
377 | margin-bottom: 1em;
378 | padding-left: 1.5em;
379 | }
380 |
381 | ol > li:before,
382 | aside .wsuwp-content-syndicate-wrapper ul li:before {
383 | position: absolute;
384 | top: -.2em;
385 | width: 30px;
386 | height: 30px;
387 | left: -1.6em;
388 | text-align: center;
389 | color: #464e54;
390 | padding: 0;
391 | line-height: 30px;
392 | border-radius: 50%;
393 | border: 1px solid #e5e5e5;
394 | background-color: #f8f8f8;
395 | content: counter(li-counter);
396 | counter-increment: li-counter;
397 | font-weight: 700;
398 | font-size: .8em;
399 | }
400 |
401 | /* ----- MISC ----- */
402 | .clear,
403 | .clear:after {
404 | clear: both;
405 | content: "";
406 | display: block;
407 | }
408 |
409 | /* ----- Pics ----- */
410 | .portrait,
411 | .landscape {
412 | position: relative;
413 | width: 120px;
414 | height: 120px;
415 | overflow: hidden;
416 | display: block;
417 | margin: 10px;
418 | border-radius: 50%;
419 | background: rgba(0, 0, 0, .1) url(./images/landscape-wht-xl.png) no-repeat center center;
420 | background-size: 24px;
421 | }
422 |
423 | .portrait.sm {
424 | width: 72px;
425 | height: 72px;
426 | }
427 |
428 | .portrait a,
429 | .landscape a {
430 | width: 100%;
431 | height: 100%;
432 | position: absolute;
433 | top: 0;
434 | left: 0;
435 | }
436 |
437 | .portrait a:hover,
438 | .landscape a:hover {
439 | -webkit-filter: grayscale(80%);
440 | filter: grayscale(80%);
441 | opacity: 1;
442 | }
443 |
444 | .portrait img {
445 | width: 100%;
446 | height: auto;
447 | }
448 |
449 | .landscape img {
450 | width: auto;
451 | height: 100%;
452 | }
453 |
454 | .column.two .portrait,
455 | .column.two .landscape {
456 | width: 280px;
457 | height: 280px;
458 | margin: 10px auto;
459 | }
460 |
461 | p.email,
462 | p.title,
463 | p.mobile,
464 | p.phone {
465 | padding: 0 28px;
466 | margin-bottom: 0;
467 | }
468 |
469 | /* ----- Aside ----- */
470 | aside {
471 | min-width: 240px;
472 | margin: 0 10px;
473 | padding: 30px;
474 | text-align: left;
475 | border-radius: 10px;
476 | box-sizing: border-box;
477 | background: #f7f7f8;
478 | }
479 |
480 | aside a {
481 | color: #b7203d;
482 | font-size: .9em;
483 | font-weight: 600;
484 | transition-property: color, background;
485 | transition-duration: .4s, .4s;
486 | cursor: pointer;
487 | border: none;
488 | }
489 |
490 | aside a:hover {
491 | color: rgba(0, 0, 0, .6);
492 | }
493 |
494 | aside a:before,
495 | aside a:after {
496 | display: none !important;
497 | content: none;
498 | }
499 |
500 | .column.one.heromask-gradient {
501 | background: linear-gradient(to left, #23282b, #23282b);
502 | }
503 |
504 | main.spine-blank-template {
505 | background-repeat: no-repeat;
506 | background-position: right bottom;
507 | background-size: 340px;
508 | }
509 |
510 | .pad-bottom {
511 | padding-bottom: 5rem;
512 | }
513 |
514 | .pad-bottom-sm,
515 | .flexwrap p:last-child {
516 | padding-bottom: 2rem;
517 | }
518 |
519 | .right {
520 | float: right;
521 | }
522 |
523 | .left {
524 | float: left;
525 | }
526 |
527 | /* ----- Buttons ----- */
528 | a.btncrimson,
529 | a.btnred,
530 | a.btnmedred,
531 | a.btndrkred,
532 | a.btnlhtgry,
533 | a.btngry,
534 | a.btnmedgry,
535 | a.btndrkgry,
536 | a.btnorange,
537 | a.btnwht,
538 | a.btnblk {
539 | display: inline-block;
540 | min-width: 120px;
541 | margin: 4px;
542 | padding: 15px 40px;
543 | background: rgba(0, 0, 0, 0);
544 | font: 600 12px/12px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
545 | text-transform: uppercase;
546 | text-align: center;
547 | text-shadow: none;
548 | transition-property: color, background;
549 | transition-duration: .4s, .4s;
550 | cursor: pointer;
551 | }
552 |
553 | a.btncrimson:before,
554 | a.btnred:before,
555 | a.btnmedred:before,
556 | a.btndrkred:before,
557 | a.btnlhtgry:before,
558 | a.btngry:before,
559 | a.btnmedgry:before,
560 | a.btndrkgry:before,
561 | a.btnorange:before,
562 | a.btnwht:before,
563 | a.btnblk:before,
564 | a.btncrimson:after,
565 | a.btnred:after,
566 | a.btnmedred:after,
567 | a.btndrkred:after,
568 | a.btnlhtgry:after,
569 | a.btngry:after,
570 | a.btnmedgry:after,
571 | a.btndrkgry:after,
572 | a.btnorange:after,
573 | a.btnwht:after,
574 | a.btnblk:after {
575 | display: none;
576 | }
577 |
578 | /* ----- Buttons (Round Corners) ----- */
579 | a.btncrimson.round,
580 | a.btnred.round,
581 | a.btnmedred.round,
582 | a.btndrkred.round,
583 | a.btnlhtgry.round,
584 | a.btngry.round,
585 | a.btnmedgry.round,
586 | a.btndrkgry.round,
587 | a.btnorange.round,
588 | a.btnwht.round,
589 | a.btnblk.round {
590 | border-radius: 4px;
591 | }
592 |
593 | /* ----- Buttons (Bubble) ----- */
594 | a.btncrimson.bubble,
595 | a.btnred.bubble,
596 | a.btnmedred.bubble,
597 | a.btndrkred.bubble,
598 | a.btnlhtgry.bubble,
599 | a.btngry.bubble,
600 | a.btnmedgry.bubble,
601 | a.btndrkgry.bubble,
602 | a.btnorange.bubble,
603 | a.btnwht.bubble,
604 | a.btnblk.bubble {
605 | border-radius: 50px;
606 | }
607 |
608 | /* ----- Buttons (Small) ----- */
609 | a.btncrimson.sm,
610 | a.btnred.sm,
611 | a.btnmedred.sm,
612 | a.btndrkred.sm,
613 | a.btnlhtgry.sm,
614 | a.btngry.sm,
615 | a.btnmedgry.sm,
616 | a.btndrkgry.sm,
617 | a.btnorange.sm,
618 | a.btnwht.sm,
619 | a.btnblk.sm {
620 | text-transform: capitalize;
621 | padding: 8px 25px;
622 | }
623 |
624 | /* ----- Buttons (X-Large) ----- */
625 | a.btncrimson.xl,
626 | a.btnred.xl,
627 | a.btnmedred.xl,
628 | a.btndrkred.xl,
629 | a.btnlhtgry.xl,
630 | a.btngry.xl,
631 | a.btnmedgry.xl,
632 | a.btndrkgry.xl,
633 | a.btnorange.xl,
634 | a.btnwht.xl,
635 | a.btnblk.xl {
636 | display: block;
637 | }
638 |
639 | /* #f06715, #ab0d24, #94192b, #c60c2f */
640 |
641 | /* ----- Buttons (Colors) ----- */
642 | a.btncrimson {
643 | color: #981e32;
644 | border: 1px solid #981e32;
645 | }
646 |
647 | a.btncrimson:hover {
648 | background: #981e32;
649 | border: 1px solid #981e32;
650 | }
651 |
652 | a.btnred {
653 | color: #c60c2f;
654 | border: 1px solid #c60c2f;
655 | }
656 |
657 | a.btnred:hover {
658 | background: #c60c2f;
659 | border: 1px solid #c60c2f;
660 | }
661 |
662 | a.btnmedred {
663 | color: #ab0d24;
664 | border: 1px solid #ab0d24;
665 | }
666 |
667 | a.btnmedred:hover {
668 | background: #ab0d24;
669 | border: 1px solid #ab0d24;
670 | }
671 |
672 | a.btndrkred {
673 | color: #94192b;
674 | border: 1px solid #94192b;
675 | }
676 |
677 | a.btndrkred:hover {
678 | background: #94192b;
679 | border: 1px solid #94192b;
680 | }
681 |
682 | a.btnlhtgry {
683 | color: rgba(0, 0, 0, .3);
684 | border: 1px solid rgba(0, 0, 0, .3);
685 | }
686 |
687 | a.btnlhtgry:hover {
688 | background: rgba(0, 0, 0, .3);
689 | border: 1px solid rgba(0, 0, 0, .3);
690 | }
691 |
692 | a.btngry {
693 | color: #5e6a71;
694 | border: 1px solid #5e6a71;
695 | }
696 |
697 | a.btngry:hover {
698 | background: #5e6a71;
699 | border: 1px solid #5e6a71;
700 | }
701 |
702 | a.btnmedgry {
703 | color: rgba(59, 59, 59, 1);
704 | border: 1px solid rgba(59, 59, 59, 1);
705 | }
706 |
707 | a.btnmedgry:hover {
708 | background: rgba(59, 59, 59, 1);
709 | border: 1px solid rgba(59, 59, 59, 1);
710 | }
711 |
712 | a.btndrkgry {
713 | color: rgba(34, 34, 34, 1);
714 | border: 1px solid rgba(34, 34, 34, 1);
715 | }
716 |
717 | a.btndrkgry:hover {
718 | background: rgba(34, 34, 34, 1);
719 | border: 1px solid rgba(34, 34, 34, 1);
720 | }
721 |
722 | a.btnorange {
723 | color: #f06715;
724 | border: 1px solid #f06715;
725 | }
726 |
727 | a.btnorange:hover {
728 | background: #f06715;
729 | border: 1px solid #f06715;
730 | }
731 |
732 | a.btnwht {
733 | color: rgba(255, 255, 255, 1);
734 | border: 1px solid rgba(255, 255, 255, 1);
735 | }
736 |
737 | a.btnwht:hover {
738 | color: #ab0d24;
739 | background: rgba(255, 255, 255, 1);
740 | border: 1px solid rgba(255, 255, 255, 1);
741 | }
742 |
743 | a.btnblk {
744 | color: rgba(0, 0, 0, 1);
745 | border: 1px solid rgba(0, 0, 0, 1);
746 | }
747 |
748 | a.btnblk:hover {
749 | background: rgba(0, 0, 0, 1);
750 | border: 1px solid rgba(0, 0, 0, 1);
751 | }
752 |
753 | a.btncrimson:hover,
754 | a.btnlhtgry:hover,
755 | a.btngry:hover,
756 | a.btnmedgry:hover,
757 | a.btndrkgry:hover,
758 | a.btnorange:hover,
759 | a.btnblk:hover {
760 | color: #fff;
761 | opacity: 1;
762 | }
763 |
764 | a.btnwht:hover {
765 | opacity: 1;
766 | }
767 |
768 | /* ----- HR ----- */
769 | hr {
770 | background-color: rgba(93, 105, 112, .1);
771 | margin: 3em 0;
772 | }
773 |
774 | /* ----- Page Footer ----- */
775 | .footer {
776 | z-index: 10;
777 | min-width: 1188px;
778 | position: fixed;
779 | bottom: 0;
780 | display: block;
781 | margin: 0;
782 | padding: 0;
783 | background-color: rgba(255, 255, 255, .9);
784 | }
785 |
786 | .footer:after {
787 | clear: both;
788 | content: "";
789 | display: block;
790 | }
791 |
792 | .footer ul {
793 | border-top: 1px solid rgba(228, 230, 231, .9);
794 | padding: 2px 0 10px;
795 | margin-left: 32px;
796 | display: block;
797 | color: #464e54;
798 | list-style-type: none;
799 | }
800 |
801 | .footer ul li {
802 | display: inline;
803 | margin: 0;
804 | padding: 0;
805 | font-size: .65em;
806 | font-family: "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
807 | font-weight: 400;
808 | text-align: left;
809 | color: #464e54;
810 | list-style-type: none;
811 | }
812 |
813 | .footer ul li:after {
814 | content: ",";
815 | margin: 0;
816 | }
817 |
818 | .footer ul li:before {
819 | content: "";
820 | display: none;
821 | list-style-type: none;
822 | }
823 |
824 | .footer ul li:last-child:after {
825 | content: "";
826 | }
827 |
828 | .team {
829 | min-width: 20%;
830 | min-height: 200px;
831 | -webkit-box-align: stretch;
832 | -ms-flex-align: stretch;
833 | align-items: stretch;
834 | text-align: start;
835 | box-sizing: border-box;
836 | padding: 0;
837 | -webkit-box-flex: 1;
838 | -ms-flex: 1;
839 | flex: 1;
840 | position: relative;
841 | z-index: 1;
842 | }
843 |
844 | .team .portrait,
845 | .team .landscape {
846 | margin: 0 auto;
847 | }
848 |
849 | main {
850 | background-color: #fff;
851 | }
852 |
853 | /* ----- Graduate News (HOME) ----- */
854 | .newswrap {
855 | min-height: 100%;
856 | width: 100%;
857 | padding: 0;
858 | margin: 0;
859 | display: -webkit-box;
860 | display: -ms-flexbox;
861 | display: flex;
862 | -webkit-box-align: center;
863 | -ms-flex-align: center;
864 | align-items: center;
865 | -webkit-box-orient: vertical;
866 | -webkit-box-direction: normal;
867 | -ms-flex-direction: column;
868 | flex-direction: column;
869 | -webkit-box-pack: center;
870 | -ms-flex-pack: center;
871 | justify-content: center;
872 | resize: vertical;
873 | }
874 |
875 | .newswrap.left {
876 | -webkit-box-align: start;
877 | -ms-flex-align: start;
878 | align-items: flex-start;
879 | -webkit-box-pack: center;
880 | -ms-flex-pack: center;
881 | justify-content: center;
882 | }
883 |
884 | .newsandevents h1,
885 | .newswrap.left h3.topsm,
886 | .newsandevents h3.topsm,
887 | h3.topsm {
888 | font-size: .825em;
889 | font-weight: 600;
890 | letter-spacing: 8px;
891 | text-transform: uppercase;
892 | padding-top: 0;
893 | padding-bottom: .2em;
894 | }
895 |
896 | .newsandevents h3.topsm {
897 | color: #464e54;
898 | }
899 |
900 | .newsandevents .column {
901 | text-align: left;
902 | }
903 |
904 | .newswrap.left h3 {
905 | padding-top: 0;
906 | }
907 |
908 | .hero-xl .newswrap {
909 | min-height: 640px;
910 | }
911 |
912 | .hero-lrg .newswrap {
913 | min-height: 420px;
914 | }
915 |
916 | .hero-med .newswrap {
917 | min-height: 320px;
918 | }
919 |
920 | .hero-sm .newswrap {
921 | min-height: 160px;
922 | }
923 |
924 | .newswrap:after {
925 | position: absolute;
926 | content: "";
927 | top: 0;
928 | left: 0;
929 | width: 100%;
930 | height: 100%;
931 | z-index: -1;
932 | background: linear-gradient(45deg, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, .1) 50%, rgba(240, 103, 21, .4) 100%);
933 | }
934 |
935 | /* ----- CSS3 Fadein Animation ----- */
936 | @keyframes fadein {
937 |
938 | from {
939 | opacity: 0;
940 | }
941 |
942 | to {
943 | opacity: 1;
944 | }
945 | }
946 |
947 | @-webkit-keyframes fadein {
948 |
949 | from {
950 | opacity: 0;
951 | }
952 |
953 | to {
954 | opacity: 1;
955 | }
956 | }
957 |
958 | /* ------------------------- MEDIA SCREEN ------------------------- */
959 | @media screen and (max-width: 990px) {
960 |
961 | main.spine-blank-template {
962 | background-size: 320px;
963 | }
964 |
965 | .colors-gray .main-header {
966 | width: auto;
967 | }
968 |
969 | .progressbar {
970 | width: 100%;
971 | top: 49px;
972 | }
973 |
974 | .gutter-lrg {
975 | padding-left: 0;
976 | padding-right: 0;
977 | }
978 |
979 | .flexwrap p {
980 | font-size: .75em;
981 | }
982 |
983 | .team {
984 | -ms-flex: 1 1 auto;
985 | -webkit-box-flex: 1;
986 | flex: 1 1 auto;
987 | }
988 |
989 | .team {
990 | min-width: 33.333333333333%;
991 | }
992 | }
993 |
994 | @media screen and (max-width: 693px) {
995 |
996 | .sub-header span {
997 | border-left: none;
998 | margin-left: 0;
999 | padding-left: 0;
1000 | }
1001 |
1002 | .flexwrap h1 {
1003 | font: 800 40px/35px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
1004 | }
1005 |
1006 | .smallh1 h1 {
1007 | font: 800 40px/40px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
1008 | color: #fff;
1009 | }
1010 |
1011 | .homepage h1 {
1012 | font: 800 50px/45px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
1013 | }
1014 |
1015 | .homepage h1.topsm {
1016 | letter-spacing: 6px;
1017 | }
1018 |
1019 | .homepage .event p {
1020 | padding-top: 1.5em;
1021 | }
1022 |
1023 | .team {
1024 | width: 50%;
1025 | }
1026 |
1027 | .footer {
1028 | position: relative;
1029 | }
1030 |
1031 | .footer ul li {
1032 | display: block;
1033 | padding-top: 8px;
1034 | font-size: .45em;
1035 | }
1036 |
1037 | .footer ul li:after {
1038 | content: "";
1039 | margin: 0;
1040 | }
1041 |
1042 | .portrait,
1043 | .landscape {
1044 | width: 100px;
1045 | height: 100px;
1046 | }
1047 |
1048 | p.email,
1049 | p.title,
1050 | p.mobile,
1051 | p.phone {
1052 | font-size: smaller;
1053 | }
1054 | }
1055 |
1056 | /* About WSU */
1057 | .whitesection {
1058 | background-color: #fff;
1059 | text-align: center;
1060 | }
1061 |
1062 | .aboutwsugradprogram h3.topsm {
1063 | margin-bottom: 40px;
1064 | text-transform: uppercase;
1065 | padding-top: 0;
1066 | }
1067 |
1068 | h1.smspaced {
1069 | color: #23282b;
1070 | -webkit-text-fill-color: #23282b;
1071 | margin-bottom: 40px;
1072 | font: 800 14px/15px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
1073 | letter-spacing: 6px;
1074 | text-transform: uppercase;
1075 | padding-top: 0;
1076 | }
1077 |
1078 | .whitesection.aboutwsugradprogram {
1079 | padding: 40px 0;
1080 | }
1081 |
1082 | .fluid .aboutwsugradprogram .column.one {
1083 | margin: 0 auto;
1084 | width: auto;
1085 | }
1086 |
1087 | h2.sm {
1088 | font-size: 9px;
1089 | border-left: none;
1090 | }
1091 |
1092 | h2.sm.second {
1093 | min-height: 20px;
1094 | }
1095 |
1096 | .circles {
1097 | display: -webkit-box;
1098 | display: -ms-flexbox;
1099 | display: flex;
1100 | -webkit-box-align: center;
1101 | -ms-flex-align: center;
1102 | align-items: center;
1103 | -ms-flex-wrap: wrap;
1104 | flex-wrap: wrap;
1105 | width: 100%;
1106 | -webkit-box-pack: center;
1107 | -ms-flex-pack: center;
1108 | justify-content: center;
1109 | }
1110 |
1111 | .circle {
1112 | position: relative;
1113 | width: 250px;
1114 | height: 250px;
1115 | overflow: hidden;
1116 | margin: 10px;
1117 | border-radius: 50%;
1118 | background: rgba(0, 0, 0, .1);
1119 | background-size: 24px;
1120 | text-align: center;
1121 | display: -webkit-box;
1122 | display: -ms-flexbox;
1123 | display: flex;
1124 | -webkit-box-pack: center;
1125 | -ms-flex-pack: center;
1126 | justify-content: center;
1127 | -webkit-box-align: center;
1128 | -ms-flex-align: center;
1129 | align-items: center;
1130 | }
1131 |
1132 | .circle h2,
1133 | .circle h1 {
1134 | color: #23282b;
1135 | }
1136 |
1137 | .circle h1 {
1138 | font-weight: 800;
1139 | padding: 0;
1140 | }
1141 |
1142 | .circle.gradient h2,
1143 | .circle.gradient h1 {
1144 | -webkit-text-fill-color: #fff;
1145 | color: #fff;
1146 | }
1147 |
1148 | .circle.gradient h1 {
1149 | font-weight: 800;
1150 | }
1151 |
1152 | .circle.gradient h2 {
1153 | font-weight: 400;
1154 | }
1155 |
1156 | .circle div {
1157 | margin: 0;
1158 | padding: 20px;
1159 | }
1160 |
1161 | .circle.gradient {
1162 | background: linear-gradient(to top, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, 1) 50%, rgba(240, 103, 21, 1) 100%);
1163 | color: #fff;
1164 | }
1165 |
1166 | .circle h2 {
1167 | left: 0;
1168 | padding-left: 0;
1169 | }
1170 |
1171 | .aboutwsugradprogram h1.topsm {
1172 | font-size: 15px;
1173 | font-weight: 700;
1174 | }
1175 |
1176 | .aboutwsugradprogram h2.bigbtm {
1177 | margin-top: 40px;
1178 | }
1179 |
1180 | .aboutwsugradprogram p {
1181 | margin: 20px;
1182 | }
1183 |
1184 | .row .column .centervertically {
1185 | position: absolute;
1186 | top: 50%;
1187 | -webkit-transform: translateY(-50%);
1188 | -ms-transform: translateY(-50%);
1189 | transform: translateY(-50%);
1190 | width: 100%;
1191 | }
1192 |
1193 | /* News & Events */
1194 | section.newsandevents {
1195 | padding: 40px 0;
1196 | }
1197 |
1198 | .newsandevents .divider,
1199 | .content-item-event-meta {
1200 | display: block;
1201 | height: 0;
1202 | margin: 0 0 35px;
1203 | }
1204 |
1205 | .newsandevents .content-item-excerpt {
1206 | margin-bottom: 35px;
1207 | }
1208 |
1209 | .newsandevents h1.smspaced {
1210 | -webkit-text-fill-color: #23282b;
1211 | }
1212 |
1213 | .newsandevents .portrait {
1214 | position: absolute;
1215 | left: 0;
1216 | top: -20px;
1217 | }
1218 |
1219 | .newsandevents h1,
1220 | .newsandevents p {
1221 | text-align: left;
1222 | padding: 0;
1223 | margin: 0;
1224 | }
1225 |
1226 | .newsandevents .column.two .portrait {
1227 | width: 120px;
1228 | height: 120px;
1229 | float: left;
1230 | margin-right: 20px;
1231 | position: absolute;
1232 | left: 0;
1233 | }
1234 |
1235 | .column.one ul li.wsuwp-content-syndicate-item:before {
1236 | display: none;
1237 | }
1238 |
1239 | .column ul li.wsuwp-content-syndicate-item {
1240 | margin-left: 0;
1241 | }
1242 |
1243 | .column ul li.wsuwp-content-syndicate-item img {
1244 | display: none;
1245 | }
1246 |
1247 | .wsuwp_university_category-graduate-programs .newsandevents {
1248 | padding: 40px 0;
1249 | }
1250 |
1251 | .newsandevents .content-item-excerpt img {
1252 | display: none;
1253 | }
1254 |
1255 | .newsandevents ul {
1256 | margin-top: 40px;
1257 | }
1258 |
1259 | .newsandevents ul li {
1260 | text-align: left;
1261 | position: relative;
1262 | margin-left: 0;
1263 | }
1264 |
1265 | .newsandevents ul.withportrait li {
1266 | padding-left: 100px;
1267 | min-height: 92px;
1268 | }
1269 |
1270 | .newsandevents ul li h4 {
1271 | color: #262729;
1272 | }
1273 |
1274 | .newsandevents ul.withportrait li:first-child h4 {
1275 | color: #94192b;
1276 | }
1277 |
1278 | .newsandevents ul li p {
1279 | color: #262729;
1280 | }
1281 |
1282 | .newsandevents .wsuwp-content-syndicate-event,
1283 | .newsandevents .wsuwp-content-syndicate-item {
1284 | border-bottom: 1px solid rgba(0, 0, 0, .1);
1285 | display: -webkit-box;
1286 | display: -ms-flexbox;
1287 | display: flex;
1288 | -webkit-box-orient: vertical;
1289 | -webkit-box-direction: reverse;
1290 | -ms-flex-direction: column-reverse;
1291 | flex-direction: column-reverse;
1292 | margin-bottom: 25px;
1293 | }
1294 |
1295 | .wsuwp-content-syndicate-wrapper {
1296 | margin-top: 40px;
1297 | }
1298 |
1299 | .content-item-event-date,
1300 | .content-item-event-title,
1301 | .content-item-title {
1302 | -webkit-box-ordinal-group: 2;
1303 | -ms-flex-order: 1;
1304 | order: 1;
1305 | }
1306 |
1307 | .content-item-event-meta {
1308 | -webkit-box-ordinal-group: 1;
1309 | -ms-flex-order: 0;
1310 | order: 0;
1311 | }
1312 |
1313 | .content-item-event-date {
1314 | font-weight: 700;
1315 | margin-top: 0;
1316 | }
1317 |
1318 | .content-item-event-title a,
1319 | .content-item-title a {
1320 | font-weight: 600;
1321 | padding: 0;
1322 | font-size: .91rem;
1323 | }
1324 |
1325 | .content-item-byline-author,
1326 | .content-item-byline-date,
1327 | .content-item-read-story {
1328 | display: none;
1329 | }
1330 |
1331 | /* Last Section */
1332 | .greysection {
1333 | padding: 40px 0;
1334 | background-color: rgba(59, 59, 59, 1);
1335 | min-height: 500px;
1336 | }
1337 |
1338 | .greysection h1.smspaced,
1339 | .greysection h3.topsm {
1340 | color: #fff;
1341 | text-align: left;
1342 | }
1343 |
1344 | .footersection ul {
1345 | float: left;
1346 | margin-right: 40px;
1347 | }
1348 |
1349 | .footersection ul li:before {
1350 | display: none;
1351 | }
1352 |
1353 | .footersection ul li {
1354 | margin-bottom: .7em;
1355 | font-size: .91em;
1356 | margin-left: 0;
1357 | }
1358 |
1359 | .footersection ul li a {
1360 | color: #fff;
1361 | }
1362 |
1363 | .footersection div.floatright {
1364 | float: right;
1365 | }
1366 |
1367 | .footersection div.floatleft {
1368 | float: left;
1369 | }
1370 |
1371 | .footersection .directorinfo {
1372 | margin-right: 60px;
1373 | text-align: right;
1374 | font-size: .91em;
1375 | min-width: 300px;
1376 | }
1377 |
1378 | .footersection .directorinfo p a {
1379 | color: #fff;
1380 | }
1381 |
1382 | .footersection .portrait {
1383 | width: 55px;
1384 | height: 55px;
1385 | margin-left: auto;
1386 | }
1387 |
1388 | .directorinfo h3 {
1389 | padding-bottom: 0;
1390 | font-size: .92rem;
1391 | }
1392 |
1393 | .directorinfo h3.worktitle {
1394 | padding-bottom: 10px;
1395 | font-style: italic;
1396 | font-size: .85rem;
1397 | }
1398 |
1399 | .footersection h3.topsm {
1400 | color: #fff;
1401 | background: none;
1402 | -webkit-text-fill-color: #fff;
1403 | margin-bottom: 50px;
1404 | }
1405 |
1406 | .footersection p.email,
1407 | .footersection p.title,
1408 | .footersection p.mobile,
1409 | .footersection p.phone {
1410 | background: none;
1411 | padding: 0;
1412 | }
1413 |
1414 | .column.one.centervertically {
1415 | margin: 0;
1416 | padding: 0;
1417 | }
1418 |
1419 | /* Chrome/Opera/Safari */
1420 | ::-webkit-input-placeholder {
1421 | font-weight: 300;
1422 | }
1423 |
1424 | /* Firefox 19+ */
1425 | ::-moz-placeholder {
1426 | font-weight: 300;
1427 | }
1428 |
1429 | /* IE 10+ */
1430 | :-ms-input-placeholder {
1431 | font-weight: 300;
1432 | }
1433 |
1434 | /* Firefox 18- */
1435 | :-moz-placeholder {
1436 | font-weight: 300;
1437 | }
1438 |
1439 | /* directory */
1440 | .directory {
1441 | min-width: 150px;
1442 | width: 25%;
1443 | margin-top: 15px;
1444 | }
1445 |
1446 | .directory p {
1447 | margin-left: 0;
1448 | padding-left: 0;
1449 | }
1450 |
1451 | .directory .details {
1452 | margin-left: 15px;
1453 | }
1454 |
1455 | .directory p.email {
1456 | background: url(./images/email-gry.png) no-repeat left 6px;
1457 | background-size: 16px;
1458 | padding-left: 25px;
1459 | }
1460 |
1461 | .directory p.title {
1462 | background: url(./images/ribbon-gry.png) no-repeat left 6px;
1463 | background-size: 16px;
1464 | padding-left: 25px;
1465 | }
1466 |
1467 | .directory p.mobile {
1468 | background: url(./images/mobile-gry.png) no-repeat left 6px;
1469 | background-size: 16px;
1470 | padding-left: 25px;
1471 | }
1472 |
1473 | .directory p.phone {
1474 | background: url(./images/phone-gry.png) no-repeat left 6px;
1475 | background-size: 16px;
1476 | padding-left: 25px;
1477 | }
1478 |
1479 | .column.one.heromask-gradient {
1480 | background: linear-gradient(45deg, rgba(148, 25, 43, 1) 0%, rgba(171, 13, 36, .1) 50%, rgba(240, 103, 21, .4) 100%);
1481 | }
1482 |
1483 | @media screen and (max-width: 768px) {
1484 |
1485 | .footer ul li a {
1486 | font-size: 1.45em;
1487 | }
1488 |
1489 | .centervertically {
1490 | position: relative;
1491 | top: auto;
1492 | -webkit-transform: none;
1493 | -ms-transform: none;
1494 | transform: none;
1495 | }
1496 |
1497 | .aboutwsugradprogram p {
1498 | margin: auto;
1499 | }
1500 |
1501 | .footersection .directorinfo {
1502 | margin-right: auto;
1503 | }
1504 | }
1505 |
1506 | .flexright {
1507 | -webkit-box-ordinal-group: 2;
1508 | -ms-flex-order: 1;
1509 | order: 1;
1510 | }
1511 |
1512 | .directorywrapper {
1513 | display: -webkit-box;
1514 | display: -ms-flexbox;
1515 | display: flex;
1516 | -ms-flex-wrap: wrap;
1517 | flex-wrap: wrap;
1518 | }
1519 |
1520 | section.row.siteid {
1521 | background-color: #f7f7f8;
1522 | }
1523 |
1524 | section.padtop {
1525 | margin-top: 15px;
1526 | }
1527 |
1528 | .clr:before,
1529 | .clr:after {
1530 | display: table;
1531 | content: " ";
1532 | clear: both;
1533 | font-size: 0;
1534 | }
1535 |
1536 | section.row .column {
1537 | padding-top: 2rem;
1538 | }
1539 |
1540 | /* Fix events calendar */
1541 | body.events-archive .column.one {
1542 | width: 100%;
1543 | }
1544 |
1545 | /* fix footer padding */
1546 | .lastsectionwithfooter {
1547 | padding-top: 5em;
1548 | }
1549 |
1550 | .column.one .footer a:before,
1551 | .column.one .footer a:after {
1552 | display: none;
1553 | }
1554 |
1555 | .newsandevents ul li:before {
1556 | display: none;
1557 | }
1558 |
1559 | .factsheet-url {
1560 | font-size: 1.2em;
1561 | }
1562 |
1563 | .factsheet-statistics-wrapper {
1564 | margin-top: 2em;
1565 | }
1566 |
1567 | .factsheet-stat {
1568 | font-size: 1.1em;
1569 | display: -webkit-box;
1570 | display: -ms-flexbox;
1571 | display: flex;
1572 | width: 100%;
1573 | margin-bottom: .5em;
1574 | border-top: 1px solid #efefef;
1575 | padding: .3em 0 0;
1576 | }
1577 |
1578 | .factsheet-set,
1579 | .factsheet-value,
1580 | .factsheet-label {
1581 | -ms-flex-preferred-size: 50%;
1582 | flex-basis: 50%;
1583 | }
1584 |
1585 | .factsheet-value {
1586 | text-align: left;
1587 | }
1588 |
1589 | .column .factsheet-stat ul li:before {
1590 | display: none;
1591 | content: "";
1592 | }
1593 |
1594 | .column .factsheet-set ul li {
1595 | margin-left: 0;
1596 | }
1597 |
1598 | .factsheet-contact {
1599 | margin-bottom: 1.5em;
1600 | }
1601 |
1602 | .visuallyhidden {
1603 | position: absolute;
1604 | overflow: hidden;
1605 | clip: rect(0 0 0 0);
1606 | height: 1px;
1607 | width: 1px;
1608 | margin: -1px;
1609 | padding: 0;
1610 | border: 0;
1611 | }
1612 |
1613 | .factsheet-faculty {
1614 | margin-left: .75em;
1615 | margin-bottom: 1em;
1616 | border-bottom: 1px solid #eee;
1617 | }
1618 |
1619 | .factsheet-faculty h3 {
1620 | font-weight: 400;
1621 | margin-bottom: 0;
1622 | }
1623 |
1624 | .factsheet-faculty h4 {
1625 | font-weight: 400;
1626 | }
1627 |
1628 | .factsheet-faculty-relationship {
1629 | margin-top: 1em;
1630 | }
1631 |
1632 |
1633 | .degree-list {
1634 | text-align: left;
1635 | }
1636 |
1637 | .degree-list li {
1638 | border-bottom: 1px solid #cecece;
1639 | width: 100%;
1640 | display: -webkit-box;
1641 | display: -ms-flexbox;
1642 | display: flex;
1643 | }
1644 |
1645 | .degree-list li:after,
1646 | .flexalign:after {
1647 | content: "";
1648 | -webkit-box-flex: 1;
1649 | -ms-flex-positive: 1;
1650 | flex-grow: 1;
1651 | -webkit-box-ordinal-group: 1;
1652 | -ms-flex-order: 0;
1653 | order: 0;
1654 | }
1655 |
1656 | .degree-list .pagination a {
1657 | width: 25px;
1658 | height: 25px;
1659 | border: 1px solid #cecece;
1660 | padding: 5px;
1661 | font-weight: 700;
1662 | color: #333;
1663 | display: -webkit-inline-box;
1664 | display: -ms-inline-flexbox;
1665 | display: inline-flex;
1666 | -webkit-box-pack: center;
1667 | -ms-flex-pack: center;
1668 | justify-content: center;
1669 | margin-bottom: 5px;
1670 | text-align: center;
1671 | }
1672 |
1673 | .degree-list .pagination a.active {
1674 | background-color: #94192b;
1675 | color: #fff;
1676 | }
1677 |
1678 | .bigletter {
1679 | border-radius: 50%;
1680 | width: 60px;
1681 | height: 60px;
1682 | border: 1px solid #cecece;
1683 | color: #cecece;
1684 | text-align: center;
1685 | -webkit-box-orient: vertical;
1686 | -webkit-box-direction: normal;
1687 | -ms-flex-direction: column;
1688 | flex-direction: column;
1689 | display: -webkit-box;
1690 | display: -ms-flexbox;
1691 | display: flex;
1692 | -webkit-box-align: center;
1693 | -ms-flex-align: center;
1694 | align-items: center;
1695 | -webkit-box-pack: center;
1696 | -ms-flex-pack: center;
1697 | justify-content: center;
1698 | font-size: 25px;
1699 | font-weight: 700;
1700 | }
1701 |
1702 | .bigletter.active {
1703 | color: #94192b;
1704 | }
1705 |
1706 | .bigletterline {
1707 | width: calc(100% - 60px);
1708 | border-bottom: 1px solid #cecece;
1709 | margin-left: 61px;
1710 | -webkit-transform: translateY(-30px);
1711 | -ms-transform: translateY(-30px);
1712 | transform: translateY(-30px);
1713 | }
1714 |
1715 | .lettergroup {
1716 | margin-top: 20px;
1717 | }
1718 |
1719 | .lettergroup:first-of-type {
1720 | margin-top: 40px;
1721 | }
1722 |
1723 | .lettergroup ul {
1724 | margin-left: 75px;
1725 | }
1726 |
1727 |
1728 | .degree-programs-header {
1729 | height: 190px;
1730 | background-color: #f7f7f9;
1731 | color: linear-gradient(to left, #ed6615, #880202, #880202);
1732 | }
1733 |
1734 | .degree-programs-header h1 {
1735 | font: 300 50px/45px "Open Sans", "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
1736 | background: -webkit-linear-gradient(135deg, #ed6615, #880202);
1737 | -webkit-background-clip: text;
1738 | -webkit-text-fill-color: transparent;
1739 | }
1740 |
1741 | .degree-search-section {
1742 | height: 80px;
1743 | background-color: #eff0f2;
1744 | display: -webkit-box;
1745 | display: -ms-flexbox;
1746 | display: flex;
1747 | -webkit-box-align: center;
1748 | -ms-flex-align: center;
1749 | align-items: center;
1750 | }
1751 |
1752 | .degree-search-section .column {
1753 | width: 100%;
1754 | }
1755 |
1756 | #degree-search-input {
1757 | border: none;
1758 | font-size: 25px;
1759 | width: 100%;
1760 | background: #eff0f2 url(./images/search-gry.png) no-repeat left 14px;
1761 | background-size: 16px;
1762 | padding-left: 36px;
1763 | outline-width: 0;
1764 | }
1765 |
1766 | .overlay {
1767 | width: 100%;
1768 | height: 100vh;
1769 | background-color: rgba(0, 0, 0, .8);
1770 | z-index: 99999;
1771 | top: 0;
1772 | position: fixed;
1773 | visibility: hidden;
1774 | opacity: 0;
1775 | transition: visibility 0s, opacity .2s linear;
1776 | }
1777 |
1778 | body.searching .overlay {
1779 | visibility: visible;
1780 | opacity: 1;
1781 | }
1782 |
1783 | body.searching .degree-search-section {
1784 | z-index: 100000;
1785 | }
1786 |
1787 | .ui-autocomplete {
1788 | z-index: 100000;
1789 | background: #efefef;
1790 | margin-top: 1.5em;
1791 | padding: 1em;
1792 | }
1793 |
1794 | .ui-menu-item {
1795 | cursor: pointer;
1796 | color: #717171;
1797 | list-style-type: none;
1798 | margin-top: 5px;
1799 | }
1800 |
1801 | .ui-menu-item a {
1802 | color: #717171;
1803 | list-style-type: none;
1804 | margin-top: 5px;
1805 | padding: 1em;
1806 | }
1807 |
1808 | .ui-corner-all {
1809 | width: 100%;
1810 | display: inline-block;
1811 | padding-top: .5em;
1812 | }
1813 |
1814 | .ui-menu-item .ui-state-highlight {
1815 | color: #222;
1816 | }
1817 |
1818 | .ui-state-focus {
1819 | background: #ccc;
1820 | border: none;
1821 | color: #000;
1822 | border-radius: 0;
1823 | }
1824 |
1825 | .post-type-archive-gs-factsheet main ul li a:before,
1826 | .post-type-archive-gs-factsheet main ul li a:after,
1827 | .post-type-archive-gs-factsheet main ul li:before,
1828 | .post-type-archive-gs-factsheet main .pagination a:before,
1829 | .post-type-archive-gs-factsheet main .pagination a:after {
1830 | display: none;
1831 | }
1832 |
1833 | .degree-list ul li {
1834 | margin-left: 0;
1835 | padding: 0;
1836 | }
1837 |
1838 | .degree-list li.degree-row-wrapper {
1839 | display: inline-block;
1840 | }
1841 |
1842 | .degree-row-open .degree-classification,
1843 | .degree-row-bottom {
1844 | display: none;
1845 | }
1846 |
1847 | .degree-row-open .degree-row-bottom .degree-classification {
1848 | display: block;
1849 | }
1850 |
1851 | .degree-row-top,
1852 | .degree-row-open .degree-row-bottom {
1853 | display: -webkit-box;
1854 | display: -ms-flexbox;
1855 | display: flex;
1856 | -webkit-box-orient: horizontal;
1857 | -webkit-box-direction: normal;
1858 | -ms-flex-flow: row;
1859 | flex-flow: row;
1860 | }
1861 |
1862 | .degree-row-multiple .degree-row-top {
1863 | cursor: pointer;
1864 | }
1865 |
1866 | .degree-row-bottom {
1867 | margin-top: 1em;
1868 | margin-left: 2em;
1869 | }
1870 |
1871 | .degree-row-bottom ~ .degree-row-bottom {
1872 | margin-top: 0;
1873 | }
1874 |
1875 | .degree-name,
1876 | .degree-detail {
1877 | -webkit-box-ordinal-group: 2;
1878 | -ms-flex-order: 1;
1879 | order: 1;
1880 | -webkit-box-flex: 1;
1881 | -ms-flex-positive: 1;
1882 | flex-grow: 1;
1883 | padding: .5em 0 0;
1884 | line-height: 38px;
1885 | }
1886 |
1887 | .degree-name .degree-anchor {
1888 | color: #ab0d24;
1889 | transition-property: color, background;
1890 | transition-duration: .4s, .4s;
1891 | border-bottom: 2px solid rgba(0, 0, 0, .05);
1892 | }
1893 |
1894 | .degree-name .degree-anchor:hover {
1895 | color: #b7203d;
1896 | border-bottom: 2px solid #b7203d;
1897 | }
1898 |
1899 | .degree-classification {
1900 | -webkit-box-ordinal-group: 3;
1901 | -ms-flex-order: 2;
1902 | order: 2;
1903 | -ms-flex-preferred-size: 40px;
1904 | flex-basis: 40px;
1905 | height: 40px;
1906 | line-height: 40px;
1907 | width: 40px;
1908 | font-weight: 700;
1909 | background: #ef6615;
1910 | border-radius: 50%;
1911 | color: #fff;
1912 | margin: .3em 5px .3em auto;
1913 | text-transform: uppercase;
1914 | text-align: center;
1915 | font-size: 19px;
1916 | }
1917 |
1918 | .degree-classification:hover {
1919 | cursor: default;
1920 | }
1921 |
1922 | .doctorate {
1923 | background: #931a2b;
1924 | padding: 0;
1925 | }
1926 |
1927 | .other {
1928 | background: #5e6a71;
1929 | }
1930 |
1931 | .graduate-certificate {
1932 | background: #00889d;
1933 | }
1934 |
1935 | .key-group {
1936 | display: -webkit-box;
1937 | display: -ms-flexbox;
1938 | display: flex;
1939 | -webkit-box-orient: horizontal;
1940 | -webkit-box-direction: reverse;
1941 | -ms-flex-direction: row-reverse;
1942 | flex-direction: row-reverse;
1943 | margin-top: 1em;
1944 | margin-bottom: 1em;
1945 | }
1946 |
1947 | .key-classification {
1948 | -ms-flex-preferred-size: auto;
1949 | flex-basis: auto;
1950 | margin-left: 1.5em;
1951 | }
1952 |
1953 | .key-classification span {
1954 | float: left;
1955 | line-height: 49px;
1956 | padding-right: .5em;
1957 | }
1958 |
1959 | .key-classification .degree-classification {
1960 | float: right;
1961 | }
1962 |
1963 | @media screen and (max-width: 768px) {
1964 |
1965 | .lettergroup ul {
1966 | margin-left: 11px;
1967 | margin-top: 0;
1968 | }
1969 |
1970 | .degree-list .degree-name {
1971 | max-width: 79%;
1972 | margin-right: 5px;
1973 | display: -webkit-box;
1974 | display: -ms-flexbox;
1975 | display: flex;
1976 | -webkit-box-pack: center;
1977 | -ms-flex-pack: center;
1978 | justify-content: center;
1979 | }
1980 |
1981 | .degree-list li .other,
1982 | .degree-list li .graduate-certificate,
1983 | .degree-list li .masters,
1984 | .degree-list li .doctorate {
1985 | margin: auto 3px;
1986 | }
1987 |
1988 | .degree-list li {
1989 | min-height: 45px;
1990 | }
1991 | }
1992 | /*# sourceMappingURL=style.css.map */
1993 |
--------------------------------------------------------------------------------