diff --git a/Gemfile b/Gemfile index 4898df1..8d9a1e0 100644 --- a/Gemfile +++ b/Gemfile @@ -1,6 +1,5 @@ source "https://rubygems.org" -gem "compass" gem "html-proofer" # https://github.com/github/pages-gem/blob/master/lib/github-pages.rb gem "github-pages" diff --git a/Gemfile.lock b/Gemfile.lock index d0857c2..d691e45 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -12,7 +12,6 @@ GEM blankslate (2.1.2.4) celluloid (0.16.0) timers (~> 4.0.0) - chunky_png (1.3.4) classifier-reborn (2.0.3) fast-stemmer (~> 1.0) coffee-script (2.4.1) @@ -21,18 +20,6 @@ GEM coffee-script-source (1.9.1) colorator (0.1) colored (1.2) - compass (1.0.3) - chunky_png (~> 1.2) - compass-core (~> 1.0.2) - compass-import-once (~> 1.0.5) - rb-fsevent (>= 0.9.3) - rb-inotify (>= 0.9) - sass (>= 3.3.13, < 3.5) - compass-core (1.0.3) - multi_json (~> 1.0) - sass (>= 3.3.0, < 3.5) - compass-import-once (1.0.5) - sass (>= 3.2, < 3.5) ethon (0.7.3) ffi (>= 1.3.0) execjs (2.5.2) @@ -117,7 +104,6 @@ GEM mercenary (0.3.5) mini_portile (0.6.2) minitest (5.5.1) - multi_json (1.11.0) net-dns (0.8.0) nokogiri (1.6.6.2) mini_portile (~> 0.6.0) @@ -153,6 +139,8 @@ PLATFORMS ruby DEPENDENCIES - compass github-pages html-proofer + +BUNDLED WITH + 1.10.6 diff --git a/README.md b/README.md index 3600d49..3224e74 100644 --- a/README.md +++ b/README.md @@ -5,22 +5,20 @@ The source code behind OTS' main web site. -This project is built with the help of +This project is built with the help of * bootstrap - * compass * jekyll -In order to be able to compile the site on your own computer, you can install +In order to be able to compile the site on your own computer, you can install the two ruby dependencies with `bundle install` if you have bundler. ## Building the site 1. run `bundle install` to grab ruby dependencies 2. clean up jekyll's build directory: `rm -rf _site/*` -3. compile styles: `compass clean; compass compile` (you can leave compass running while editing styles with `compass watch`) -4. build and serve the site: `jekyll serve -w` -5. Navigate to http://localhost:4000 +3. build and serve the site: `jekyll serve` +4. Navigate to http://localhost:4000 ## Adding a city @@ -81,7 +79,7 @@ If you want to add a new city to the site, follow these steps: * ***Caveat for non-opentechschool.org accounts:*** If you are adding members to your chapter which do not yet have an opentechschool.org account, you can use an alternative syntax: - + members: - charlie: Charlie Jones diff --git a/_config.yml b/_config.yml index 597db23..ef8194b 100644 --- a/_config.yml +++ b/_config.yml @@ -5,7 +5,7 @@ css_version: 6 markdown: kramdown encoding: UTF-8 -exclude: ['sass', 'config.rb', 'Gemfile', 'Gemfile.lock', 'vendor'] +exclude: ['Gemfile', 'Gemfile.lock', 'vendor'] gems: - jekyll-redirect-from diff --git a/_includes/_head.html b/_includes/_head.html index 50df186..e38d248 100644 --- a/_includes/_head.html +++ b/_includes/_head.html @@ -41,13 +41,10 @@ article, aside, dialog, figure, footer, header, hgroup, menu, nav, section { display: block; } - - diff --git a/sass/imports/_carousel.scss b/_sass/_carousel.scss similarity index 100% rename from sass/imports/_carousel.scss rename to _sass/_carousel.scss diff --git a/sass/imports/_city.scss b/_sass/_city.scss similarity index 100% rename from sass/imports/_city.scss rename to _sass/_city.scss diff --git a/sass/imports/_dropdown.scss b/_sass/_dropdown.scss similarity index 100% rename from sass/imports/_dropdown.scss rename to _sass/_dropdown.scss diff --git a/sass/imports/_grid.scss b/_sass/_grid.scss similarity index 100% rename from sass/imports/_grid.scss rename to _sass/_grid.scss diff --git a/sass/imports/_main.scss b/_sass/_main.scss similarity index 96% rename from sass/imports/_main.scss rename to _sass/_main.scss index 4d50747..2939be2 100644 --- a/sass/imports/_main.scss +++ b/_sass/_main.scss @@ -2,8 +2,6 @@ /* ! Shared styles, OTS branding */ /* ========================================== */ -@import "compass/utilities/general/min"; - body { margin: 0; font-size: 75%; @@ -67,7 +65,7 @@ a:focus { .ots_action { text-shadow: 0 1px 2px rgba(0,0,0,.2); background-color: $ots_blue_l; - @include background-image(linear-gradient(top, $ots_blue_l 0%,$ots_blue_l 50%,$ots_blue 51%,$ots_blue_l 100%)); + background-image: linear-gradient(to bottom, $ots_blue_l 0%,$ots_blue_l 50%,$ots_blue 51%,$ots_blue_l 100%); display: inline-block; border-radius: 4px; cursor: pointer; @@ -111,21 +109,21 @@ a.ots_action:active, a.ots_action:focus { text-decoration: none; background: $ots_blue_h; - @include background-image(linear-gradient(top, $ots_blue_h 0%,$ots_blue_h 50%,$ots_blue_l 51%,$ots_blue_h 100%)); + background-image: linear-gradient(to bottom, $ots_blue_h 0%,$ots_blue_h 50%,$ots_blue_l 51%,$ots_blue_h 100%); } a.ots_action_highlight, a.ots_action_highlight:link, a.ots_action_highlight:visited { background: $ots_red_l; - @include background-image(linear-gradient(top, $ots_red_l 0%,$ots_red_l 50%,#D40000 51%,$ots_red_l 100%)); + background-image: linear-gradient(to bottom, $ots_red_l 0%,$ots_red_l 50%,#D40000 51%,$ots_red_l 100%); } a.ots_action_highlight:hover, a.ots_action_highlight:active, a.ots_action_highlight:focus { background: $ots_red_h; - @include background-image(linear-gradient(top, $ots_red_h 0%,$ots_red_h 50%,$ots_red_l 51%,$ots_red_h 100%)); + background-image: linear-gradient(to bottom, $ots_red_h 0%,$ots_red_h 50%,$ots_red_l 51%,$ots_red_h 100%); } a.ots_action_city { @@ -561,7 +559,7 @@ ul.nav { /* List of OTS members, extends float list. Includes image and links. */ .team_list { > li { - @include min-height(8em); + min-height: 8em; text-align: center; &.member { height: 240px; @@ -615,7 +613,7 @@ ul.nav { } p { font-size: .714em; - @include min-height(6em); + min-height: 6em; } } @@ -870,7 +868,7 @@ footer a:focus { // color: #FFF; position: relative; width: 100%; - @include min-height(400px); + min-height: 400px; header { overflow: hidden; } diff --git a/sass/imports/_mediaq.scss b/_sass/_mediaq.scss similarity index 67% rename from sass/imports/_mediaq.scss rename to _sass/_mediaq.scss index b2de795..469feff 100644 --- a/sass/imports/_mediaq.scss +++ b/_sass/_mediaq.scss @@ -1,9 +1,9 @@ -@import "imports/_vars"; -@import "imports/_mediaqueries"; +@import "vars"; +@import "mediaqueries"; @media screen and (min-width: 440px) { @include min440(); -} +} @media screen and (min-width: 768px) { @include min768(); diff --git a/sass/imports/_mediaqueries.scss b/_sass/_mediaqueries.scss similarity index 100% rename from sass/imports/_mediaqueries.scss rename to _sass/_mediaqueries.scss diff --git a/sass/imports/_modal.scss b/_sass/_modal.scss similarity index 100% rename from sass/imports/_modal.scss rename to _sass/_modal.scss diff --git a/sass/imports/_nav.scss b/_sass/_nav.scss similarity index 100% rename from sass/imports/_nav.scss rename to _sass/_nav.scss diff --git a/_sass/_reset.scss b/_sass/_reset.scss new file mode 100644 index 0000000..0087647 --- /dev/null +++ b/_sass/_reset.scss @@ -0,0 +1,17 @@ +/* this is a copy of the output of compass/reset */ +html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; } + +html { line-height: 1; } + +ol, ul { list-style: none; } + +table { border-collapse: collapse; border-spacing: 0; } + +caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } + +q, blockquote { quotes: none; } +q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; } + +a img { border: none; } + +article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } diff --git a/sass/imports/_vars.scss b/_sass/_vars.scss similarity index 100% rename from sass/imports/_vars.scss rename to _sass/_vars.scss diff --git a/config.rb b/config.rb deleted file mode 100644 index 8b3a85f..0000000 --- a/config.rb +++ /dev/null @@ -1,25 +0,0 @@ -# Require any additional compass plugins here. - -# Set this to the root of your project when deployed: -http_path = "/" -css_dir = "stylesheets" -sass_dir = "sass" -images_dir = "images" -javascripts_dir = "javascripts" - -# You can select your preferred output style here (can be overridden via the command line): -# output_style = :expanded or :nested or :compact or :compressed -output_style = :compact - -# To enable relative paths to assets via compass helper functions. Uncomment: -# relative_assets = true - -# To disable debugging comments that display the original location of your selectors. Uncomment: -line_comments = false - - -# If you prefer the indented syntax, you might want to regenerate this -# project again passing --syntax sass, or you can uncomment this: -# preferred_syntax = :sass -# and then run: -# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass diff --git a/sass/ie.scss b/sass/ie.scss deleted file mode 100644 index 5decadf..0000000 --- a/sass/ie.scss +++ /dev/null @@ -1,11 +0,0 @@ -/* Welcome to Compass. Use this file to write IE specific override styles. - * Import this file using the following HTML or equivalent: - * */ - -@import "imports/_vars"; -@import "imports/_mediaqueries"; - -@include min440(); -@include min768(); diff --git a/sass/print.scss b/sass/print.scss deleted file mode 100644 index b0e9e45..0000000 --- a/sass/print.scss +++ /dev/null @@ -1,3 +0,0 @@ -/* Welcome to Compass. Use this file to define print styles. - * Import this file using the following HTML or equivalent: - * */ diff --git a/sass/screen.scss b/sass/screen.scss deleted file mode 100644 index b493967..0000000 --- a/sass/screen.scss +++ /dev/null @@ -1,16 +0,0 @@ -/* Welcome to Compass. - * In this file you should write your main styles. (or centralize your imports) - * Import this file using the following HTML or equivalent: - * */ -@charset "UTF-8"; -@import "compass"; -@import "compass/reset"; -@import "imports/_vars"; -@import "imports/_grid"; -@import "imports/_main"; -@import "imports/_modal"; -// @import "imports/_dropdown"; -@import "imports/_city"; -@import "imports/_nav"; -@import "imports/_carousel"; -@import "imports/_mediaq"; diff --git a/stylesheets/ie.css b/stylesheets/ie.css deleted file mode 100644 index c0838b7..0000000 --- a/stylesheets/ie.css +++ /dev/null @@ -1,60 +0,0 @@ -/* Welcome to Compass. Use this file to write IE specific override styles. Import this file using the following HTML or equivalent: */ -/* variables */ -/* colors */ -/* main blue, logo */ -/* Blue links */ -/* Blue hover states */ -/* Default text color*/ -/* (Inverted) Text color on dark blue backgrounds */ -/* (Inverted) Link color on dark blue backgrounds */ -/* Highlighted, red links, buttons, other highlights */ -/* Red hover states */ -.float_list > li { float: left; } - -.float_list_4 > li { width: 46%; } - -body { font-size: 87.5%; } - -#shownav + label div { display: none; } - -#shownav + label div:nth-of-type(1) { display: none; } - -.nav_internal { max-height: 1000px; } - -.nav { float: right; clear: none; } -.nav li { float: left; border: none; } - -.btn_navbar { display: none; } - -.collapse { display: block; } - -.container_narrow { width: 100%; padding: 0; } - -.top_bar { position: absolute; height: 2.5em; overflow: hidden; padding: 30px 0; -webkit-transition: padding-bottom .25s ease-in; -moz-transition: padding-bottom .25s ease-in; -o-transition: padding-bottom .25s ease-in; transition: padding-bottom .25s ease-in; } - -.top_bar.affix { position: fixed; padding: 10px 0; } - -.logo_top_bar { width: auto; } - -.col_left { width: 44%; float: left; margin: 0 1.75% 1.5em 0; } - -.col_right { width: 44%; float: right; margin: 0 0 1.5em 1.75%; } - -.two-third { width: 60%; margin-right: 6.4%; float: left; } - -.a-third { width: 30%; margin-right: 3.1%; float: left; } - -.float_list_4 > li { width: 21%; } - -.site_header { padding-top: 7em; } - -.site_header_landing .site_header { padding-top: 4.25em; padding-bottom: 2.5em; } - -.site_header_core img, .carousel_testimonial { padding-top: 3em; } - -.testimonial-caption { font-size: 1em; } - -.site_header_img { background-size: 100%; } - -.name .close-up { margin-right: 1.5em; float: left; } -.name strong { margin-top: 2.4em; } diff --git a/stylesheets/print.css b/stylesheets/print.css deleted file mode 100644 index 0a6606c..0000000 --- a/stylesheets/print.css +++ /dev/null @@ -1 +0,0 @@ -/* Welcome to Compass. Use this file to define print styles. Import this file using the following HTML or equivalent: */ diff --git a/stylesheets/screen.css b/stylesheets/screen.css deleted file mode 100644 index 8ddd173..0000000 --- a/stylesheets/screen.css +++ /dev/null @@ -1,499 +0,0 @@ -/* Welcome to Compass. In this file you should write your main styles. (or centralize your imports) Import this file using the following HTML or equivalent: */ -html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; } - -html { line-height: 1; } - -ol, ul { list-style: none; } - -table { border-collapse: collapse; border-spacing: 0; } - -caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } - -q, blockquote { quotes: none; } -q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; } - -a img { border: none; } - -article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } - -/* variables */ -/* colors */ -/* main blue, logo */ -/* Blue links */ -/* Blue hover states */ -/* Default text color*/ -/* (Inverted) Text color on dark blue backgrounds */ -/* (Inverted) Link color on dark blue backgrounds */ -/* Highlighted, red links, buttons, other highlights */ -/* Red hover states */ -.container { width: 100%; max-width: 1020px; margin: 0 auto; overflow: visible; } - -.container_narrow { max-width: 740px; width: 90%; padding: 0 5%; } - -.container_wide { max-width: 1300px; } - -img, object, embed { max-width: 100%; } - -img { height: auto; } - -/* ========================================== */ -/* ! Shared styles, OTS branding */ -/* ========================================== */ -body { margin: 0; font-size: 75%; line-height: 1.5; -webkit-font-smoothing: antialiased; } - -/* base font size: 12px, line-height: 18px; 14/21 on bigger screens */ -body, button, input, select, textarea { font-family: "Montserrat", "Helvetica Neue", Arial, Helvetica, sans-serif; color: #222222; } - -h1, h2, h3, h4, h5, h6 { line-height: 1.5; font-weight: bold; text-rendering: optimizelegibility; } - -h1 { font-size: 2.5em; } - -h2 { font-size: 2em; } - -h3 { font-size: 1.25em; } - -h4, h5, h6 { font-size: 1em; } - -strong { font-weight: bold; } - -.post_title { text-transform: capitalize; } - -::-moz-selection { background: #FD4B22; color: #fff; text-shadow: none; } - -::selection { background: #FD4B22; color: #fff; text-shadow: none; } - -a, a:link, a:visited { color: #1F8AB6; text-decoration: none; } - -a:hover, a:active, a:focus { color: #2FB0D5; text-decoration: none; outline: none; } - -/* buttons */ -.ots_action { text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); background-color: #1F8AB6; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFmOGFiNiIvPjxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjMWY4YWI2Ii8+PHN0b3Agb2Zmc2V0PSI1MSUiIHN0b3AtY29sb3I9IiMwODU5ODciLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxZjhhYjYiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1f8ab6), color-stop(50%, #1f8ab6), color-stop(51%, #085987), color-stop(100%, #1f8ab6)); background-image: -moz-linear-gradient(top, #1f8ab6 0%, #1f8ab6 50%, #085987 51%, #1f8ab6 100%); background-image: -webkit-linear-gradient(top, #1f8ab6 0%, #1f8ab6 50%, #085987 51%, #1f8ab6 100%); background-image: linear-gradient(to bottom, #1f8ab6 0%, #1f8ab6 50%, #085987 51%, #1f8ab6 100%); display: inline-block; border-radius: 4px; cursor: pointer; padding: .25em 1em; } - -.label-important { background-color: #E04C3E; } - -.label-info { background-color: #1F8AB6; } - -.label-ots { background-color: #085987; } - -.label { display: inline; padding: 0.2em 0.6em 0.3em; font-size: 75%; font-weight: bold; line-height: 1; color: #FFF; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: 0.25em; } - -a.ots_action, a.ots_action:link, a.ots_action:visited { color: #FFF; text-decoration: none; } - -a.ots_action:hover, a.ots_action:active, a.ots_action:focus { text-decoration: none; background: #2FB0D5; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzJmYjBkNSIvPjxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjMmZiMGQ1Ii8+PHN0b3Agb2Zmc2V0PSI1MSUiIHN0b3AtY29sb3I9IiMxZjhhYjYiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyZmIwZDUiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #2fb0d5), color-stop(50%, #2fb0d5), color-stop(51%, #1f8ab6), color-stop(100%, #2fb0d5)); background-image: -moz-linear-gradient(top, #2fb0d5 0%, #2fb0d5 50%, #1f8ab6 51%, #2fb0d5 100%); background-image: -webkit-linear-gradient(top, #2fb0d5 0%, #2fb0d5 50%, #1f8ab6 51%, #2fb0d5 100%); background-image: linear-gradient(to bottom, #2fb0d5 0%, #2fb0d5 50%, #1f8ab6 51%, #2fb0d5 100%); } - -a.ots_action_highlight, a.ots_action_highlight:link, a.ots_action_highlight:visited { background: #E04C3E; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2UwNGMzZSIvPjxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjZTA0YzNlIi8+PHN0b3Agb2Zmc2V0PSI1MSUiIHN0b3AtY29sb3I9IiNkNDAwMDAiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMDRjM2UiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e04c3e), color-stop(50%, #e04c3e), color-stop(51%, #d40000), color-stop(100%, #e04c3e)); background-image: -moz-linear-gradient(top, #e04c3e 0%, #e04c3e 50%, #d40000 51%, #e04c3e 100%); background-image: -webkit-linear-gradient(top, #e04c3e 0%, #e04c3e 50%, #d40000 51%, #e04c3e 100%); background-image: linear-gradient(to bottom, #e04c3e 0%, #e04c3e 50%, #d40000 51%, #e04c3e 100%); } - -a.ots_action_highlight:hover, a.ots_action_highlight:active, a.ots_action_highlight:focus { background: #FD4B22; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZkNGIyMiIvPjxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjZmQ0YjIyIi8+PHN0b3Agb2Zmc2V0PSI1MSUiIHN0b3AtY29sb3I9IiNlMDRjM2UiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZDRiMjIiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fd4b22), color-stop(50%, #fd4b22), color-stop(51%, #e04c3e), color-stop(100%, #fd4b22)); background-image: -moz-linear-gradient(top, #fd4b22 0%, #fd4b22 50%, #e04c3e 51%, #fd4b22 100%); background-image: -webkit-linear-gradient(top, #fd4b22 0%, #fd4b22 50%, #e04c3e 51%, #fd4b22 100%); background-image: linear-gradient(to bottom, #fd4b22 0%, #fd4b22 50%, #e04c3e 51%, #fd4b22 100%); } - -a.ots_action_city { padding: .75em 1.25em; } - -body { line-height: 1.5em; } - -p, ul, ol { margin-bottom: 1.5em; } - -.subtle { color: #666; font-style: italic; } - -small { font-size: .8571em; } - -.tiny_button { font-size: .5em; font-weight: normal; } - -#pledgeRibbon a { background: #20A260; color: #fff; text-decoration: none; font-family: arial, sans-serif; text-align: center; font-weight: bold; padding: 5px 40px; font-size: 1rem; line-height: 2rem; position: relative; transition: 0.5s; } - -#pledgeRibbon a:hover { background: #060; color: #fff; } - -#pledgeRibbon a::before, #pledgeRibbon a::after { content: ""; width: 100%; display: block; position: absolute; top: 1px; left: 0; height: 1px; background: #fff; } - -#pledgeRibbon a::after { bottom: 1px; top: auto; } - -@media screen and (min-width: 800px) { #pledgeRibbon { position: absolute; display: block; top: 0; right: 0; width: 200px; overflow: hidden; height: 200px; z-index: 9; } - #pledgeRibbon a { width: 200px; position: absolute; top: 60px; right: -60px; transform: rotate(45deg); -webkit-transform: rotate(45deg); box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.8); } } -pre, code { font-family: consolas, courier, monospace; font-size: 1em; white-space: pre; border-radius: .25em; } - -code { background-color: #F4FBFD; padding: 0 .25em; } - -pre { line-height: 1.2em; padding: 1em; margin: 1.5em 0; background-color: #085987; color: #C1D5E1; } -pre code { color: inherit; background-color: inherit; } - -.bg_full ul, .bg_full ol { margin-bottom: 1.5em; padding-left: 2em; list-style: none; } -.bg_full ol { list-style: decimal; } -.bg_full ul li:before { content: ""; display: block; height: 3px; width: 1em; left: -2em; top: 0.9em; position: relative; background-color: #84ACC3; border-radius: 1em; } - -/* language switcher on press page */ -ul.switch_lang { padding-left: 0; overflow: hidden; } -ul.switch_lang li:before { display: none; } -ul.switch_lang li { float: left; margin-right: .5em; } -ul.switch_lang li a { display: block; background-color: #FFF; padding: 0 .4em; border-radius: .25em; } -ul.switch_lang li.active a { background-color: #085987; color: #FFF; } - -.bg_full { width: 100%; padding: 5% 0; background: #f4f4f4; } - -.bg_full_white { background: #fff; } - -.ots_logo { margin: 1em auto 0.25em auto; font-size: 4.25em; text-shadow: 0px 0px 1px; } - -a.menu_ots_logo { font-size: 2em; margin: 0 3px 0 0.5em; background: #085987; color: #fff; padding: 8px 13px; } - -.top_bar.affix a.menu_ots_logo { font-size: 1em; top: -5px; position: relative; margin: 0 3px 0 1.5em; } -.top_bar.affix a.quick_nav_btn { font-size: 1.5em; } -.top_bar.affix a.quick_nav_btn.open span:before { font-size: 1.2em; } - -a.quick_nav_btn { font-size: 2em; padding: 5px; color: #085987; } -a.quick_nav_btn span:before { content: "\25BE"; } -a.quick_nav_btn.open span:before { content: "\25B4"; font-size: 1.4em; } - -.quick_nav_btn { font-size: 2em; padding: 5px; color: white; } -.quick_nav_btn span:before { content: "\25BE"; } -.quick_nav_btn.open span:before { content: "\25B4"; } - -ul.nav { margin-right: 7px; } - -.menu_ots_logo, .ots_logo a { margin-bottom: 0; text-indent: 100%; white-space: nowrap; color: #085987; font-family: "Montserrat"; font-style: normal; font-weight: 300; } -.menu_ots_logo:focus, .menu_ots_logo:hover, .menu_ots_logo:active, .ots_logo a:focus, .ots_logo a:hover, .ots_logo a:active { outline: none; outline: none; } - -.site_header { padding: 4.5em 0 3em 0; text-align: center; font-size: 1.5em; } - -.intro { background-color: #FFF; margin-bottom: 2em; opacity: 0.8; padding: 1em 4em 1em 1em; font-size: 0.9em; width: 91%; } -.intro .action-wrap { text-align: right; margin-top: 2.7em; margin-bottom: 0.5em; margin-right: 1em; } -.intro .action-wrap .ots_action { font-size: 1.2em; line-height: 2.5em; } - -.site_header_landing { background-image: url(../images/header.jpg); padding-bottom: 2em; padding-top: 30em; } -.site_header_landing .site_header { color: #000; } -.site_header_landing .intro { color: #000; font-size: 1em; width: 100%; max-width: 92%; margin: 0; } -.site_header_landing .intro em { font-weight: bold; } -.site_header_landing .intro h2 { margin: 0.5em 0 1em; } -.site_header_landing .action-wrap { margin-bottom: 1em; position: relative; text-align: right; left: -72px; } - -.site_header_core img { max-width: 1300px; width: 100%; } - -/* Style for list with floated list items. Responds to screen-width. */ -.float_list { list-style: none; padding: 0; overflow: hidden; } - -.float_list > li { margin: 0 2% 1.5em 2%; } - -.eventsList .event { clear: both; min-height: 80px; } -.eventsList .event .date { float: left; width: 60px; height: 70px; text-align: center; margin: 5px; border: #085987 2px solid; } -.eventsList .event .date > * { width: 100%; display: block; font-style: normal; } -.eventsList .event .date .month { background: #085987; color: white; } -.eventsList .event .date .day { font-size: 18px; line-height: 36px; color: black; } -.eventsList .event .date .time { border-top: 1px #085987 solid; line-height: 12px; } -.eventsList .event .details { padding: 5px; } -.eventsList .event .details .team { cursor: pointer; } - -.discussion { width: 75%; margin: 0 auto; margin-bottom: 0; } - -.topic { padding: 15px 0; width: 50%; display: inline-block; } -.topic .metadata { opacity: 0.6; width: 100%; line-height: 30px; } -.topic .posters { width: 150px; display: block; float: right; } -.topic .posters .avatar { border-radius: 2px; vertical-align: middle; margin: 2px; } -.topic.highlight .metadata { opacity: 1; } - -.sponsor_list img { width: 100%; max-width: 200px; height: auto; margin: 10px; } -.sponsor_list > div { clear: both; margin: 15px; min-height: 200px; } -.sponsor_list h3 { padding-top: 30px; } -.sponsor_list p { font-size: 0.8em; } -.sponsor_list .left { text-align: left; } -.sponsor_list .left img { float: left; } -.sponsor_list .right { text-align: right; } -.sponsor_list .right img { float: right; } - -/* List of OTS members, extends float list. Includes image and links. */ -.team_list > li { min-height: 8em; text-align: center; } -.team_list > li.member { height: 240px; } -.team_list > li.join div { display: inline-block; border: 5px solid #eee; border-radius: 100%; width: 190px; height: 190px; position: relative; } -.team_list > li.join div form { position: absolute; top: 50%; margin-top: -13px; font-size: 90%; } -.team_list > li.join div form input.subscribe_email { width: 180px; height: 22px; padding: 2px; margin-bottom: 3px; border: 1px solid gray; } -.team_list > li:before { display: none !important; } -.team_list img { width: 100%; max-width: 200px; height: auto; border-radius: 100%; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); } -.team_list img:hover { transition: 0.6s; filter: none; } -.team_list h3 { font-size: 1em; } -.team_list p { font-size: .714em; min-height: 6em; } - -.blocky { overflow: display; min-height: 130px; margin-bottom: 1em; } -.blocky .head { border-bottom: 2px #085987 solid; padding-left: 2px; margin-left: 10px; text-transform: uppercase; margin-bottom: 12px; } -.blocky .head a { font-size: 0.7em; text-transform: capitalize; padding-left: 12px; } -.blocky > p, .blocky > div, .blocky > section { padding: 0.5em; } -.blocky.green { border-color: lime; } -.blocky.green .head { border-color: lime; } -.blocky.orange { border-color: orange; } -.blocky.orange .head { border-color: orange; } -.blocky.violet { border-color: violet; } -.blocky.violet .head { border-color: violet; } - -.onoffswitch { position: relative; width: 94px; float: right; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } - -.onoffswitch-label { display: block; overflow: hidden; cursor: pointer; border: 2px solid #84ACC3; border-radius: 22px; } - -.onoffswitch-inner { width: 200%; margin-left: -100%; -moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s; -o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s; } - -.onoffswitch-inner:before, .onoffswitch-inner:after { float: left; width: 50%; height: 20px; padding: 0; line-height: 20px; font-size: 9px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } - -.onoffswitch-inner:before { content: "Show all"; padding-left: 10px; background-color: #085987; color: #FFFFFF; } - -.onoffswitch-inner:after { content: "Matching only"; padding-right: 10px; background-color: #EEEEEE; color: #A69999; text-align: right; } - -.onoffswitch-switch { width: 9px; margin: 6px; background: #FFFFFF; border: 2px solid #84ACC3; border-radius: 10px; position: absolute; top: 0; bottom: 0; right: 70px; -moz-transition: all 0.3s ease-in 0s; -webkit-transition: all 0.3s ease-in 0s; -o-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s; } - -.onoffswitch.checked .onoffswitch-label .onoffswitch-inner { margin-left: 0; } - -.onoffswitch.checked .onoffswitch-label .onoffswitch-switch { right: 0px; } - -.top_bar { width: 100%; z-index: 100; background: #FFF; line-height: 2.5em; color: #FFF; } -.top_bar .container { overflow: visible; vertical-align: middle; } -.top_bar h3 { color: #2FB0D5; } - -.logo_top_bar { float: left; padding: 0.3em 0.75em .5em; width: 70%; } -.logo_top_bar > a { display: block; float: left; width: 192px; height: 24px; margin-right: 1em; text-indent: 100%; white-space: nowrap; overflow: hidden; } -.logo_top_bar > a, .logo_top_bar > a:link, .logo_top_bar > a:visited { background: transparent url("../images/ots_logo_meta.png") no-repeat 0 4px; color: #FFF; opacity: 0.8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* IE8 */ filter: alpha(opacity=80); /* IE 5-7 */ } -.logo_top_bar > a:hover, .logo_top_bar > a:active, .logo_top_bar > a:focus { color: #FFF; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE8 */ filter: alpha(opacity=100); /* IE 5-7 */ } - -footer { font-size: .8571em; background: #085987; color: #84ACC3; padding: 3em 0; height: auto; } -footer p { text-align: center; } -footer small { font-size: .8571em; } - -footer a, footer a:link, footer a:visited { color: #C1D5E1; } - -footer a:hover, footer a:active, footer a:focus { color: #FFF; } - -.main_img { text-align: center; height: 24em; overflow: hidden; } - -/* News blocks, events */ -.event, .blog-post { margin-bottom: 1.5em; } -.event p:last-child, .blog-post p:last-child { margin: 0; } - -.date { font-size: .75em; font-style: italic; color: #666; margin-bottom: 0; } - -/* Style Guide*/ -.sg_list { list-style: none; padding-left: 0 !important; } -.sg_list > li:before { display: none; } - -.sg_list small { display: block; margin-bottom: .75em; color: #888; font-style: italic; } - -.sg_color { display: inline-block; border-radius: 4px; padding: 0 1em; color: transparent; } - -.sg_textarea { width: 90%; font-size: .625em; color: #888; border: 1px solid #888; padding: .5em; font-family: Consolas, "Liberation Mono", Courier, monospace; border-radius: 4px; } - -/* testimonials */ -.testimonials_teaser { overflow: hidden; text-align: center; } -.testimonials_teaser img { width: 100%; height: auto; position: relative; display: inline-block; margin: 0 auto .666em; } - -.testimonial { overflow: hidden; position: relative; width: 100%; min-height: 400px; } -.testimonial header { overflow: hidden; } - -.testimonial_about { font-style: italic; } - -.name { margin-bottom: 1.5em; padding: .666em 0 0 0; text-align: center; border-top: 1px solid #085987; border-bottom: 1px solid #085987; overflow: hidden; } -.name strong { display: block; margin-top: .8751em; } -.name b { color: #666; display: block; font-size: .5714em; margin-bottom: 1em; } -.name .close-up { width: 100%; max-width: 240px; height: auto; position: relative; display: block; margin: 0 auto .666em; border-radius: 100%; } - -.testimonial img { position: absolute; z-index: 1; width: 100%; height: auto; display: block; } - -.testimonial blockquote { position: absolute; z-index: 10; font-size: 2em; float: left; width: 25%; } - -.question { color: #085987; } - -.claim-title { text-align: center; color: #ffffff; background-color: #085987; padding: 2% 0; } - -/* ========================================== */ -/* ! Provide higher res assets for iPhone 4 */ -/* ========================================== */ -@media only screen and (-webkit-min-device-pixel-ratio: 2) { /* .logo { background: url(logo2x.jpg) no-repeat; background-size: 212px 303px; }*/ } -/* ==|== non-semantic helper classes ======================================== */ -.clearfix:before, .clearfix:after { content: ""; display: table; } - -.clearfix:after { clear: both; } - -.clearfix { zoom: 1; } - -.center { text-align: center; } - -/* ==|== print styles ======================================================= */ -@media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter: none !important; -ms-filter: none !important; } - a, a:visited { text-decoration: underline; } - a[href]:after { content: " (" attr(href) ")"; } - abbr[title]:after { content: " (" attr(title) ")"; } - .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } - pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } - thead { display: table-header-group; } - tr, img { page-break-inside: avoid; } - img { max-width: 100% !important; } - @page { margin: 0.5cm; } - p, h2, h3 { orphans: 3; widows: 3; } - h2, h3 { page-break-after: avoid; } } -.modal-backdrop { position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 1040; background-color: #000; opacity: 0.8; display: none; } - -.modal { position: fixed; top: 0px; width: 100%; height: 100%; z-index: 1050; overflow: auto; display: none; color: #222; } - -.modal-outer-container { display: table; width: 100%; height: 100%; } - -.modal-middle-container { display: table-cell; vertical-align: middle; } - -.modal-inner-container { max-width: 710px; margin: 0px auto; background-color: #FFF; border: 1px solid rgba(0, 0, 0, 0.3); box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.3); background-clip: padding-box; } - -.modal-header, .modal-body .clearfix { border-bottom: 1px solid #DDD; } - -.modal-header h3 { padding: 3px 10px; } - -.modal-header .close { float: right; font-size: 20px; margin: -2px 5px 0px; text-decoration: none; color: #B4B4B4; cursor: pointer; } - -.modal-body { padding: 3px 10px; } -.modal-body .btn { display: block; background: #085987; padding: 3px 5px; float: left; color: white; line-height: 28px; text-align: center; margin: 1%; width: 23%; } -.modal-body .btn .ots_icon { display: inline-block; margin-bottom: -10px; } - -body.show-modal .modal-backdrop, body.show-modal .modal { display: block; } - -/* Styles specific for city template */ -.team_title { margin: 0 0 50px 50px; } - -.team_twitter { display: block; margin: 15px auto; width: 522px; } - -.member_count { display: block; font-size: .666em; } - -.tagline { font-size: 35px; line-height: 1.2; margin-bottom: 1em; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.8); } - -.site_header_img { color: #085987; background-size: 768px; background-repeat: no-repeat; padding-top: 30em; } - -.site_header_berlin { background-image: url(../images/bg_berlin.jpg); background-position: 40% 60%; } - -.site_header_bristol { background-image: url(../images/bg_bristol.jpg); background-position: 40% 60%; } - -.site_header_brussels { background-image: url(../images/bg_brussels.jpg); background-position: 0% 25%; } - -.site_header_rheinmain { background-image: url(../images/bg_rheinmain.jpg); background-position: 0% 30%; } - -.site_header_dortmund { background-image: url(../images/bg_dortmund.jpg); background-position: 0% 70%; } - -.site_header_hamburg { background-image: url(../images/bg_hamburg.jpg); background-position: 20% 10%; } - -.site_header_istanbul { background-image: url(../images/bg_istanbul.jpg); background-position: 0% 50%; } - -.site_header_melbourne { background-image: url(../images/bg_melbourne.jpg); background-position: 45% 0%; } - -.site_header_ramallah { background-image: url(../images/bg_ramallah.jpg); background-position: 55% 0%; } - -.site_header_san_francisco { background-image: url(../images/bg_san_francisco.jpg); background-position: 20% 76%; } - -.site_header_stockholm { background-image: url(../images/bg_stockholm.jpg); background-position: 30% 45%; } - -.site_header_zurich { background-image: url(../images/bg_zurich.jpg); background-position: 100% 5%; background-size: 105% !important; } - -.site_header_nairobi { background-image: url(../images/bg_nairobi.jpg); background-position: 50% 34%; background-size: 105%; } - -.site_header_milan { background-image: url("http://www.mytravelingsoul.com/wp-content/uploads/2014/05/Duomo-Milano.jpg"); background-position: 50% 21%; } -.site_header_milan h1 a, .site_header_milan h2 { text-shadow: 1px 1px 3px #E7E8E4; } - -.site_header_about { height: 600px; background-size: 1300px; background-image: url(../images/bg_about.jpg); background-position: 50% 50%; } - -.nav { text-transform: uppercase; clear: both; } -.nav a { display: block; padding: .5em; letter-spacing: 0.05em; } - -.ots_icon { width: 28px; height: 28px; padding: 0; text-indent: 100%; white-space: nowrap; overflow: hidden; display: block; background: transparent url("../images/ots_icons.png") no-repeat 0 0; } -.ots_icon.github { background-position: 0 0; } -.ots_icon.twitter { background-position: 0 -28px; } -.ots_icon.facebook { background-position: 0 -56px; } -.ots_icon.github:hover, .ots_icon.github:focus { background-position: 0 -84px; } -.ots_icon.twitter:hover, .ots_icon.twitter:focus { background-position: 0 -112px; } -.ots_icon.facebook:hover, .ots_icon.facebook:focus { background-position: 0 -140px; } -.ots_icon.discourse { background-position: -28px 0; } -.ots_icon.discourse:hover, .ots_icon.discourse:focus { background-position: -28px -83px; } - -.nav_internal { margin-right: 7px; overflow: hidden; max-height: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } - -#shownav { visibility: hidden; position: absolute; left: -1000px; } - -#shownav + label { position: absolute; right: 10px; top: 5px; bottom: 0; width: 30px; height: 30px; cursor: pointer; } - -#shownav + label div { position: absolute; top: 15px; left: 0; height: 2px; background-color: #cccccc; width: 30px; display: block; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } -#shownav + label div:nth-of-type(1) { -ms-transform: translate3d(0, -10px, 0); -webkit-transform: translate3d(0, -10px, 0); -moz-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } -#shownav + label div:nth-of-type(3) { -ms-transform: translate3d(0, 10px, 0); -webkit-transform: translate3d(0, 10px, 0); -moz-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } - -#shownav:checked + label div:nth-of-type(1) { -ms-transform: translate3d(0, 0, 0) rotate(45deg); -webkit-transform: translate3d(0, 0, 0) rotate(45deg); -moz-transform: translate3d(0, 0, 0) rotate(45deg); transform: translate3d(0, 0, 0) rotate(45deg); } -#shownav:checked + label div:nth-of-type(2) { opacity: 0; } -#shownav:checked + label div:nth-of-type(3) { -webkit-transform: translate3d(0, 0, 0) rotate(-45deg); -moz-transform: translate3d(0, 0, 0) rotate(-45deg); transform: translate3d(0, 0, 0) rotate(-45deg); } - -#shownav:checked ~ .nav_internal { max-height: 1000px; } - -.nav_external { padding-top: .65em; } -.nav_external li { margin: 0 .25em; border-top: none; } -.nav_external a { border: 0; } -.nav_external a.ots_icon { padding: 0px; } - -.btn_navbar { float: right; margin: 0.5em 0.75em; padding: 0; border: 2px solid #1F8AB6; border-radius: .25em; background: transparent; cursor: pointer; } - -.btn_navbar .icon_bar { display: block; width: 1.25em; height: 2px; margin-top: 3px; background-color: #1F8AB6; } - -.btn_navbar .icon_bar_last { margin-bottom: 2px; } - -.collapse { display: none; } -.collapse.in { display: block; } -.collapse.in > li { text-align: center; } -.collapse.in .nav_external { width: 150px; margin: .25em auto; } -.collapse.in .nav_external li { float: left; } - -.carousel { position: relative; margin-bottom: 20px; } - -.carousel-inner { overflow: hidden; width: 100%; position: relative; } - -.carousel .item { display: none; position: relative; -webkit-transition: 0.6s ease-in-out left; -moz-transition: 0.6s ease-in-out left; -o-transition: 0.6s ease-in-out left; transition: 0.6s ease-in-out left; } -.carousel .item > img { display: block; line-height: 1; } -.carousel .active, .carousel .next, .carousel .prev { display: block; } -.carousel .active { left: 0; } -.carousel .next, .carousel .prev { position: absolute; top: 0; width: 100%; } -.carousel .next { left: 100%; } -.carousel .prev { left: -100%; } -.carousel .next.left, .carousel .prev.right { left: 0; } -.carousel .active.left { left: -100%; } -.carousel .active.right { left: 100%; } - -.carousel-control { position: absolute; top: 40%; left: -.5em; width: .7em; height: .7em; padding: .15em; margin-top: -20px; font-size: 3em; font-weight: 100; line-height: .5em; color: white; text-align: right; background: #efefef; border-radius: 100%; opacity: 0.8; filter: alpha(opacity=80); } -.carousel-control.right { left: auto; right: -.5em; text-align: left; } -.carousel-control:hover { text-decoration: none; opacity: 1; filter: alpha(opacity=1); } - -.carousel-caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 15px; background: #EFEFEF; background: rgba(0, 0, 0, 0.5); } - -.testimonial-caption { left: auto; width: 450px; max-width: 86%; bottom: 1em; left: 1em; font-size: .75em; text-shadow: 0 1px 1px #000; } - -.carousel-caption h4, .carousel-caption p { color: #FFF; } - -.carousel-caption h4 { margin: 0 0 5px; } - -.quote { margin-bottom: .8751em; line-height: 1.2; } - -.author { font-size: .8751em; } - -/* variables */ -/* colors */ -/* main blue, logo */ -/* Blue links */ -/* Blue hover states */ -/* Default text color*/ -/* (Inverted) Text color on dark blue backgrounds */ -/* (Inverted) Link color on dark blue backgrounds */ -/* Highlighted, red links, buttons, other highlights */ -/* Red hover states */ -@media screen and (min-width: 440px) { .float_list > li { float: left; } - .float_list_4 > li { width: 46%; } } -@media screen and (min-width: 768px) { body { font-size: 87.5%; } - #shownav + label div { display: none; } - #shownav + label div:nth-of-type(1) { display: none; } - .nav_internal { max-height: 1000px; } - .nav { float: right; clear: none; } - .nav li { float: left; border: none; } - .btn_navbar { display: none; } - .collapse { display: block; } - .container_narrow { width: 100%; padding: 0; } - .top_bar { position: absolute; height: 2.5em; overflow: hidden; padding: 30px 0; -webkit-transition: padding-bottom .25s ease-in; -moz-transition: padding-bottom .25s ease-in; -o-transition: padding-bottom .25s ease-in; transition: padding-bottom .25s ease-in; } - .top_bar.affix { position: fixed; padding: 10px 0; } - .logo_top_bar { width: auto; } - .col_left { width: 44%; float: left; margin: 0 1.75% 1.5em 0; } - .col_right { width: 44%; float: right; margin: 0 0 1.5em 1.75%; } - .two-third { width: 60%; margin-right: 6.4%; float: left; } - .a-third { width: 30%; margin-right: 3.1%; float: left; } - .float_list_4 > li { width: 21%; } - .site_header { padding-top: 7em; } - .site_header_landing .site_header { padding-top: 4.25em; padding-bottom: 2.5em; } - .site_header_core img, .carousel_testimonial { padding-top: 3em; } - .testimonial-caption { font-size: 1em; } - .site_header_img { background-size: 100%; } - .name .close-up { margin-right: 1.5em; float: left; } - .name strong { margin-top: 2.4em; } } diff --git a/stylesheets/screen.scss b/stylesheets/screen.scss new file mode 100644 index 0000000..e47b98a --- /dev/null +++ b/stylesheets/screen.scss @@ -0,0 +1,14 @@ +--- +--- + +@charset "UTF-8"; +@import "reset"; +@import "vars"; +@import "grid"; +@import "main"; +@import "modal"; +// @import "dropdown"; +@import "city"; +@import "nav"; +@import "carousel"; +@import "mediaq";