From 1ee4e95491ee9072d1d04bb2a38c6754263010c6 Mon Sep 17 00:00:00 2001 From: Bachir Soussi Chiadmi Date: Mon, 9 Oct 2017 16:38:18 +0200 Subject: [PATCH] advanced search ajax callback for dynamic form building are almost working + started css --- .../gui/materiobasemod/images/addfilter.png | Bin 0 -> 290 bytes .../gui/materiobasemod/images/addfilter.svg | 129 +++ .../materiobasemod/materio_search_api.module | 133 ++- .../gui/materiobasetheme/css/styles.css | 809 +++++++++--------- .../gui/materiobasetheme/scss/styles.scss | 25 + 5 files changed, 685 insertions(+), 411 deletions(-) create mode 100644 sites/all/modules/gui/materiobasemod/images/addfilter.png create mode 100644 sites/all/modules/gui/materiobasemod/images/addfilter.svg diff --git a/sites/all/modules/gui/materiobasemod/images/addfilter.png b/sites/all/modules/gui/materiobasemod/images/addfilter.png new file mode 100644 index 0000000000000000000000000000000000000000..d7fd067c88c4e35bdb51c671b4642844feb49e7c GIT binary patch literal 290 zcmeAS@N?(olHy`uVBq!ia0vp^{24nJ za0`PlBg3pY5mbt*pE0gq5Qf2mkU!ajmZkum1 zKT>M5=i%x3d?6>!?SOkv^nz_QN0%l&aFU+?Og`Y3wH~X^4iyQBf7^l98W|e=iFcj1 cn}dO2dYtMsS-IkeK&LWzy85}Sb4q9e0C6&0ZvX%Q literal 0 HcmV?d00001 diff --git a/sites/all/modules/gui/materiobasemod/images/addfilter.svg b/sites/all/modules/gui/materiobasemod/images/addfilter.svg new file mode 100644 index 00000000..aa2a71a9 --- /dev/null +++ b/sites/all/modules/gui/materiobasemod/images/addfilter.svg @@ -0,0 +1,129 @@ + + + +image/svg+xml \ No newline at end of file diff --git a/sites/all/modules/gui/materiobasemod/materio_search_api.module b/sites/all/modules/gui/materiobasemod/materio_search_api.module index 7fbd1d23..2f610b19 100755 --- a/sites/all/modules/gui/materiobasemod/materio_search_api.module +++ b/sites/all/modules/gui/materiobasemod/materio_search_api.module @@ -613,7 +613,7 @@ function materio_search_api_search_form($form, &$form_state){ $args = arg(); $path = array_shift($args); // dsm($args, 'args'); - if($args[0] == "advanced"){ + if(isset($args[0]) && $args[0] == "advanced"){ $advanced = true; array_shift($args); // dsm($args, 'shifted arsg'); @@ -734,44 +734,145 @@ function materio_search_api_search_form_submit($form, &$form_state){ function materio_search_api_advanced_search_form($form, &$form_state){ // dsm($form_state, 'form_state'); // dsm($form, 'form'); - global $user; + // global $user; $form = array(); + // add a back to search/base home bouton if on explore/foo $args = arg(); $path = array_shift($args); - - // add a back to search/base home bouton if on explore/foo if ($path == 'explore' || $path == 'bookmarks' || $path == 'lists' ) { $link = l('', base_path().'actuality', array( 'html'=>true, 'attributes'=>array('class'=>'back-search-home') )); - $form['actu'] = array( '#type' => 'markup', '#markup' => $link, ); } - $form['searchfield'] = array( - '#type' => 'textfield', - '#default_value' => $path == 'explore' ? $keys : $default_value, // TODO: set the search page path global or a variable in settings - // '#autocomplete_path' => 'materiosearchapi/autocomplete/searchapi', - //'#autocomplete_path' => 'materiosearchapi/autocomplete/dbselect', - '#size' => 30, - '#maxlength' => 1024, - '#attributes' => array("default"=>$default_value), + // filters + $form['filters'] = array( + '#type' => 'container', + '#prefix' => '
', + '#suffix' => '
', ); + // building first level texonomy tree + $taxotree = taxonomy_get_tree(15, 0, 1, false); + // dsm($taxotree, "taxotree"); + $level_0_ops = array(0=>t("Choose a filter")); + foreach ($taxotree as $index => $term) { + $level_0_ops[$term->tid] = $term->name; + } - $form['create'] = array( + $filterlines = isset($form_state['values']['filterlines']) ? $form_state['values']['filterlines'] : 1; + + if (!empty($form_state['triggering_element'])) { + dsm($form_state['values'], 'form state values'); + } + + if(isset($form_state['triggering_element']['#name']) && $form_state['triggering_element']['#name'] == 'addfilters'){ + $filterlines = $filterlines + 1; + } + + $form['filterlines'] = array( + '#type' => 'hidden', + '#value' => $filterlines, + ); + + // build filters lines (ajax enabled) + for ($i=0; $i < $filterlines; $i++) { + + $form['filters']['filterline-'.$i] = array( + '#type' => 'container', + '#attributes' => array( + 'class' => array("filter-line") + ) + ); + + $form['filters']['filterline-'.$i]['filter-'.$i.'-0'] = array( + '#type' => 'select', + '#options' => $level_0_ops, + '#ajax' => array( + 'callback' => 'materio_search_api_advanced_search_callback', + 'wrapper' => 'advancedsearch-filters', + // 'methode' => 'replace', + // 'effect' => 'fade', + ), + ); + + // add level 1 filter if level 0 chosen + if(isset($form_state["values"]['filter-'.$i.'-0']) + & $form_state["values"]['filter-'.$i.'-0'] + ){ + + $value = $form_state["values"]['filter-'.$i.'-0']; + + $taxotree1 = taxonomy_get_tree(15, $value, 1, false); + dsm($taxotree1, "taxotree1"); + $level_1_ops = array( + 0=>t("Choose a filter") + ); + foreach ($taxotree1 as $index => $term) { + $level_1_ops[$term->tid] = $term->name; + } + + $form['filters']['filterline-'.$i]['filter-'.$i.'-1'] = array( + '#type' => 'select', + '#options' => $level_1_ops, + '#ajax' => array( + 'callback' => 'materio_search_api_advanced_search_callback', + 'wrapper' => 'advancedsearch-filters', + 'methode' => 'replace', + // 'effect' => 'fade', + ), + ); + } + + } + + + // add a new line of criterias + $form['addfilters'] = array( '#type' => 'image_button', - '#src' => drupal_get_path('module', 'materio_search_api') . '/images/search.png', - '#value' => t('Search'), + '#src' => drupal_get_path('module', 'materio_search_api') . '/images/addfilter.png', + '#title' => t('Add a filter line'), + '#default_value' => 0, + '#return_value' => 1, + '#name' => "addfilters", + '#executes_submit_callback' => false, + '#ajax' => array( + 'callback' => 'materio_search_api_advanced_search_callback', + 'wrapper' => 'advancedsearch-filters', + 'trigger_as' => array("name"=>"addfilters"), + // 'methode' => 'replacewith', + // 'speed' => 5000, + // 'effect' => 'slide', + ), ); + + // submit + // $form['create'] = array( + // '#type' => 'image_button', + // '#src' => drupal_get_path('module', 'materio_search_api') . '/images/search.png', + // '#value' => t('Search'), + // '#name' => "search", + // '#executes_submit_callback' => false, + // ); + return $form; } +function materio_search_api_advanced_search_callback($form, $form_state) { + // dsm($form_state, "callback form state"); + // $form["filters"]['test']= array( + // "#markup" => "test", + // ); + return $form['filters']; +} + + /** * viewmode */ diff --git a/sites/all/themes/gui/materiobasetheme/css/styles.css b/sites/all/themes/gui/materiobasetheme/css/styles.css index 1b7bddee..4a260e2e 100644 --- a/sites/all/themes/gui/materiobasetheme/css/styles.css +++ b/sites/all/themes/gui/materiobasetheme/css/styles.css @@ -2,11 +2,11 @@ * Primary Drupal Styles * Author: g-u-i.net */ -/*! normalize.css v3.0.2 | MIT License | git.io/normalize */ +/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ /** * 1. Set default font family to sans-serif. - * 2. Prevent iOS text size adjust after orientation change, without disabling - * user zoom. + * 2. Prevent iOS and IE text size adjust after device orientation change, + * without disabling user zoom. */ @import url(../fonts/icon/foundation-icons.css); html { @@ -69,7 +69,7 @@ audio:not([controls]) { /** * Address `[hidden]` styling not present in IE 8/9/10. - * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. + * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22. */ [hidden], template { @@ -84,7 +84,8 @@ a { background-color: transparent; } /** - * Improve readability when focused and also mouse hovered in all browsers. + * Improve readability of focused elements when they are also in an + * active/hover state. */ a:active, a:hover { @@ -296,14 +297,13 @@ input[type="number"]::-webkit-outer-spin-button { /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome. - * 2. Address `box-sizing` set to `border-box` in Safari and Chrome - * (include `-moz` to future-proof). + * 2. Address `box-sizing` set to `border-box` in Safari and Chrome. */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ - /* 2 */ - box-sizing: content-box; } + box-sizing: content-box; + /* 2 */ } /** * Remove inner padding and search cancel button in Safari and Chrome on OS X. @@ -359,7 +359,7 @@ th { padding: 0; } meta.foundation-version { - font-family: "/5.5.1/"; } + font-family: "/5.5.3/"; } meta.foundation-mq-small { font-family: "/only screen/"; @@ -370,32 +370,32 @@ meta.foundation-mq-small-only { width: 0; } meta.foundation-mq-medium { - font-family: "/only screen and (min-width:40.063em)/"; - width: 40.063em; } + font-family: "/only screen and (min-width:40.0625em)/"; + width: 40.0625em; } meta.foundation-mq-medium-only { - font-family: "/only screen and (min-width:40.063em) and (max-width:64em)/"; - width: 40.063em; } + font-family: "/only screen and (min-width:40.0625em) and (max-width:64em)/"; + width: 40.0625em; } meta.foundation-mq-large { - font-family: "/only screen and (min-width:64.063em)/"; - width: 64.063em; } + font-family: "/only screen and (min-width:64.0625em)/"; + width: 64.0625em; } meta.foundation-mq-large-only { - font-family: "/only screen and (min-width:64.063em) and (max-width:90em)/"; - width: 64.063em; } + font-family: "/only screen and (min-width:64.0625em) and (max-width:90em)/"; + width: 64.0625em; } meta.foundation-mq-xlarge { - font-family: "/only screen and (min-width:90.063em)/"; - width: 90.063em; } + font-family: "/only screen and (min-width:90.0625em)/"; + width: 90.0625em; } meta.foundation-mq-xlarge-only { - font-family: "/only screen and (min-width:90.063em) and (max-width:120em)/"; - width: 90.063em; } + font-family: "/only screen and (min-width:90.0625em) and (max-width:120em)/"; + width: 90.0625em; } meta.foundation-mq-xxlarge { - font-family: "/only screen and (min-width:120.063em)/"; - width: 120.063em; } + font-family: "/only screen and (min-width:120.0625em)/"; + width: 120.0625em; } meta.foundation-data-attribute-namespace { font-family: false; } @@ -415,14 +415,14 @@ body { body { background: #fff; color: #222; - padding: 0; - margin: 0; + cursor: auto; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; - font-weight: normal; font-style: normal; + font-weight: normal; line-height: 1.5; - position: relative; - cursor: auto; } + margin: 0; + padding: 0; + position: relative; } a:hover { cursor: pointer; } @@ -439,7 +439,10 @@ img { #map_canvas object, .map_canvas img, .map_canvas embed, -.map_canvas object { +.map_canvas object, +.mqa-display img, +.mqa-display embed, +.mqa-display object { max-width: none !important; } .left { @@ -508,7 +511,7 @@ select { .small-text-justify { text-align: justify !important; } } -@media only screen and (min-width: 40.063em) and (max-width: 64em) { +@media only screen and (min-width: 40.0625em) and (max-width: 64em) { .medium-only-text-left { text-align: left !important; } .medium-only-text-right { @@ -518,7 +521,7 @@ select { .medium-only-text-justify { text-align: justify !important; } } -@media only screen and (min-width: 40.063em) { +@media only screen and (min-width: 40.0625em) { .medium-text-left { text-align: left !important; } .medium-text-right { @@ -528,7 +531,7 @@ select { .medium-text-justify { text-align: justify !important; } } -@media only screen and (min-width: 64.063em) and (max-width: 90em) { +@media only screen and (min-width: 64.0625em) and (max-width: 90em) { .large-only-text-left { text-align: left !important; } .large-only-text-right { @@ -538,7 +541,7 @@ select { .large-only-text-justify { text-align: justify !important; } } -@media only screen and (min-width: 64.063em) { +@media only screen and (min-width: 64.0625em) { .large-text-left { text-align: left !important; } .large-text-right { @@ -548,7 +551,7 @@ select { .large-text-justify { text-align: justify !important; } } -@media only screen and (min-width: 90.063em) and (max-width: 120em) { +@media only screen and (min-width: 90.0625em) and (max-width: 120em) { .xlarge-only-text-left { text-align: left !important; } .xlarge-only-text-right { @@ -558,7 +561,7 @@ select { .xlarge-only-text-justify { text-align: justify !important; } } -@media only screen and (min-width: 90.063em) { +@media only screen and (min-width: 90.0625em) { .xlarge-text-left { text-align: left !important; } .xlarge-text-right { @@ -568,7 +571,7 @@ select { .xlarge-text-justify { text-align: justify !important; } } -@media only screen and (min-width: 120.063em) and (max-width: 99999999em) { +@media only screen and (min-width: 120.0625em) and (max-width: 6249999.9375em) { .xxlarge-only-text-left { text-align: left !important; } .xxlarge-only-text-right { @@ -578,7 +581,7 @@ select { .xxlarge-only-text-justify { text-align: justify !important; } } -@media only screen and (min-width: 120.063em) { +@media only screen and (min-width: 120.0625em) { .xxlarge-text-left { text-align: left !important; } .xxlarge-text-right { @@ -614,8 +617,8 @@ td { /* Default Link Styles */ a { color: #008CBA; - text-decoration: none; - line-height: inherit; } + line-height: inherit; + text-decoration: none; } a:hover, a:focus { color: #0078a0; } a img { @@ -624,8 +627,8 @@ a { /* Default paragraph styles */ p { font-family: inherit; - font-weight: normal; font-size: 1rem; + font-weight: normal; line-height: 1.6; margin-bottom: 1.25rem; text-rendering: optimizeLegibility; } @@ -634,22 +637,22 @@ p { line-height: 1.6; } p aside { font-size: 0.875rem; - line-height: 1.35; - font-style: italic; } + font-style: italic; + line-height: 1.35; } /* Default header styles */ h1, h2, h3, h4, h5, h6 { - font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; - font-weight: normal; - font-style: normal; color: #222222; - text-rendering: optimizeLegibility; - margin-top: 0.2rem; + font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; + font-style: normal; + font-weight: normal; + line-height: 1.4; margin-bottom: 0.5rem; - line-height: 1.4; } + margin-top: 0.2rem; + text-rendering: optimizeLegibility; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { - font-size: 60%; color: #6f6f6f; + font-size: 60%; line-height: 0; } h1 { @@ -681,8 +684,8 @@ hr { border: solid #DDDDDD; border-width: 1px 0 0; clear: both; - margin: 1.25rem 0 1.1875rem; - height: 0; } + height: 0; + margin: 1.25rem 0 1.1875rem; } /* Helpful Typography Defaults */ em, @@ -700,34 +703,27 @@ small { line-height: inherit; } code { + background-color: #f8f8f8; + border-color: #dfdfdf; + border-style: solid; + border-width: 1px; + color: #333333; font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: normal; - color: #333333; - background-color: #f8f8f8; - border-width: 1px; - border-style: solid; - border-color: #dfdfdf; padding: 0.125rem 0.3125rem 0.0625rem; } /* Lists */ ul, ol, dl { + font-family: inherit; font-size: 1rem; line-height: 1.6; - margin-bottom: 1.25rem; list-style-position: outside; - font-family: inherit; } + margin-bottom: 1.25rem; } ul { margin-left: 1.1rem; } - ul.no-bullet { - margin-left: 0; } - ul.no-bullet li ul, - ul.no-bullet li ol { - margin-left: 1.25rem; - margin-bottom: 0; - list-style: none; } /* Unordered Lists */ ul li ul, @@ -750,9 +746,6 @@ ul.disc { list-style-type: disc; margin-left: 1.1rem; } -ul.no-bullet { - list-style: none; } - /* Ordered Lists */ ol { margin-left: 1.4rem; } @@ -761,6 +754,15 @@ ol { margin-left: 1.25rem; margin-bottom: 0; } +.no-bullet { + list-style-type: none; + margin-left: 0; } + .no-bullet li ul, + .no-bullet li ol { + margin-left: 1.25rem; + margin-bottom: 0; + list-style: none; } + /* Definition Lists */ dl dt { margin-bottom: 0.3rem; @@ -825,7 +827,7 @@ blockquote p { border: none; padding: 0 0.0625rem; } -@media only screen and (min-width: 40.063em) { +@media only screen and (min-width: 40.0625em) { h1, h2, h3, h4, h5, h6 { line-height: 1.4; } h1 { @@ -841,11 +843,58 @@ blockquote p { h6 { font-size: 1rem; } } +/* + * Print styles. + * + * Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/ + * Credit to Paul Irish and HTML5 Boilerplate (html5boilerplate.com) + */ +@media print { + * { + background: transparent !important; + color: #000000 !important; + /* Black prints faster: h5bp.com/s */ + box-shadow: none !important; + text-shadow: 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 #999999; + page-break-inside: avoid; } + thead { + display: table-header-group; + /* h5bp.com/t */ } + tr, + img { + page-break-inside: avoid; } + img { + max-width: 100% !important; } + @page { + margin: 0.34in; } + p, + h2, + h3 { + orphans: 3; + widows: 3; } + h2, + h3 { + page-break-after: avoid; } } + /* Clearing Styles */ .clearing-thumbs, [data-clearing] { - margin-bottom: 0; + list-style: none; margin-left: 0; - list-style: none; } + margin-bottom: 0; } .clearing-thumbs:before, .clearing-thumbs:after, [data-clearing]:before, [data-clearing]:after { content: " "; display: table; } @@ -859,28 +908,28 @@ blockquote p { .clearing-blackout { background: #333333; - position: fixed; - width: 100%; height: 100%; + position: fixed; top: 0; - left: 0; - z-index: 998; } + width: 100%; + z-index: 998; + left: 0; } .clearing-blackout .clearing-close { display: block; } .clearing-container { - position: relative; - z-index: 998; height: 100%; + margin: 0; overflow: hidden; - margin: 0; } + position: relative; + z-index: 998; } .clearing-touch-label { - position: absolute; - top: 50%; - left: 50%; color: #AAAAAA; - font-size: 0.6em; } + font-size: .6em; + left: 50%; + position: absolute; + top: 50%; } .visible-img { height: 95%; @@ -890,32 +939,30 @@ blockquote p { left: 50%; top: 50%; transform: translateY(-50%) translateX(-50%); - -webkit-transform: translateY(-50%) translateX(-50%); - -ms-transform: translateY(-50%) translateX(-50%); max-height: 100%; max-width: 100%; } .clearing-caption { + background: #333333; + bottom: 0; color: #CCCCCC; font-size: 0.875em; line-height: 1.3; margin-bottom: 0; - text-align: center; - bottom: 0; - background: #333333; - width: 100%; padding: 10px 30px 20px; position: absolute; + text-align: center; + width: 100%; left: 0; } .clearing-close { - z-index: 999; - padding-left: 20px; - padding-top: 10px; + color: #CCCCCC; + display: none; font-size: 30px; line-height: 1; - color: #CCCCCC; - display: none; } + padding-left: 20px; + padding-top: 10px; + z-index: 999; } .clearing-close:hover, .clearing-close:focus { color: #CCCCCC; } @@ -929,24 +976,24 @@ blockquote p { .clearing-feature li.clearing-featured-img { display: block; } -@media only screen and (min-width: 40.063em) { +@media only screen and (min-width: 40.0625em) { .clearing-main-prev, .clearing-main-next { - position: absolute; height: 100%; - width: 40px; - top: 0; } + position: absolute; + top: 0; + width: 40px; } .clearing-main-prev > span, .clearing-main-next > span { + border: solid 12px; + display: block; + height: 0; position: absolute; top: 50%; - display: block; - width: 0; - height: 0; - border: solid 12px; } + width: 0; } .clearing-main-prev > span:hover, .clearing-main-next > span:hover { - opacity: 0.8; } + opacity: .8; } .clearing-main-prev { left: 0; } .clearing-main-prev > span { @@ -960,7 +1007,7 @@ blockquote p { border-left-color: #CCCCCC; } .clearing-main-prev.disabled, .clearing-main-next.disabled { - opacity: 0.3; } + opacity: .3; } .clearing-assembled .clearing-container .carousel { background: rgba(51, 51, 51, 0.8); height: 120px; @@ -973,17 +1020,17 @@ blockquote p { position: relative; float: none; } .clearing-assembled .clearing-container .carousel > ul li { + clear: none; + cursor: pointer; display: block; - width: 120px; - min-height: inherit; float: left; - overflow: hidden; margin-right: 0; + min-height: inherit; + opacity: .4; + overflow: hidden; padding: 0; position: relative; - cursor: pointer; - opacity: 0.4; - clear: none; } + width: 120px; } .clearing-assembled .clearing-container .carousel > ul li.fix-height img { height: 100%; max-width: none; } @@ -997,34 +1044,38 @@ blockquote p { .clearing-assembled .clearing-container .carousel > ul li.visible { opacity: 1; } .clearing-assembled .clearing-container .carousel > ul li:hover { - opacity: 0.8; } + opacity: .8; } .clearing-assembled .clearing-container .visible-img { background: #333333; - overflow: hidden; - height: 85%; } + height: 85%; + overflow: hidden; } .clearing-close { + padding-left: 0; + padding-top: 0; position: absolute; top: 10px; - right: 20px; - padding-left: 0; - padding-top: 0; } } + right: 20px; } } .inline-list { - margin: 0 auto 1.0625rem auto; + list-style: none; + margin-top: 0; + margin-bottom: 1.0625rem; margin-left: -1.375rem; margin-right: 0; - padding: 0; - list-style: none; - overflow: hidden; } + overflow: hidden; + padding: 0; } .inline-list > li { - list-style: none; + display: block; float: left; - margin-left: 1.375rem; - display: block; } + list-style: none; + margin-left: 1.375rem; } .inline-list > li > * { display: block; } button, .button { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -1033,16 +1084,10 @@ button, .button { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 1rem; - padding-right: 2rem; - padding-bottom: 1.0625rem; - padding-left: 2rem; + padding: 1rem 2rem 1.0625rem 2rem; font-size: 1rem; background-color: #008CBA; border-color: #007095; @@ -1093,26 +1138,21 @@ button, .button { button.info:hover, button.info:focus, .button.info:hover, .button.info:focus { color: #FFFFFF; } button.large, .button.large { - padding-top: 1.125rem; - padding-right: 2.25rem; - padding-bottom: 1.1875rem; - padding-left: 2.25rem; + padding: 1.125rem 2.25rem 1.1875rem 2.25rem; font-size: 1.25rem; } button.small, .button.small { - padding-top: 0.875rem; - padding-right: 1.75rem; - padding-bottom: 0.9375rem; - padding-left: 1.75rem; + padding: 0.875rem 1.75rem 0.9375rem 1.75rem; font-size: 0.8125rem; } button.tiny, .button.tiny { - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; } button.expand, .button.expand { - padding-right: 0; - padding-left: 0; + padding: 1rem 2rem 1.0625rem 2rem; + font-size: 1rem; + padding-bottom: 1.0625rem; + padding-top: 1rem; + padding-left: 1rem; + padding-right: 1rem; width: 100%; } button.left-align, .button.left-align { text-align: left; @@ -1128,9 +1168,9 @@ button, .button { background-color: #008CBA; border-color: #007095; color: #FFFFFF; + box-shadow: none; cursor: default; - opacity: 0.7; - box-shadow: none; } + opacity: 0.7; } button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus { background-color: #007095; } button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus { @@ -1141,9 +1181,9 @@ button, .button { background-color: #e7e7e7; border-color: #b9b9b9; color: #333333; + box-shadow: none; cursor: default; - opacity: 0.7; - box-shadow: none; } + opacity: 0.7; } button.disabled.secondary:hover, button.disabled.secondary:focus, button[disabled].secondary:hover, button[disabled].secondary:focus, .button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus { background-color: #b9b9b9; } button.disabled.secondary:hover, button.disabled.secondary:focus, button[disabled].secondary:hover, button[disabled].secondary:focus, .button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus { @@ -1154,9 +1194,9 @@ button, .button { background-color: #43AC6A; border-color: #368a55; color: #FFFFFF; + box-shadow: none; cursor: default; - opacity: 0.7; - box-shadow: none; } + opacity: 0.7; } button.disabled.success:hover, button.disabled.success:focus, button[disabled].success:hover, button[disabled].success:focus, .button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus { background-color: #368a55; } button.disabled.success:hover, button.disabled.success:focus, button[disabled].success:hover, button[disabled].success:focus, .button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus { @@ -1167,9 +1207,9 @@ button, .button { background-color: #f04124; border-color: #cf2a0e; color: #FFFFFF; + box-shadow: none; cursor: default; - opacity: 0.7; - box-shadow: none; } + opacity: 0.7; } button.disabled.alert:hover, button.disabled.alert:focus, button[disabled].alert:hover, button[disabled].alert:focus, .button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus { background-color: #cf2a0e; } button.disabled.alert:hover, button.disabled.alert:focus, button[disabled].alert:hover, button[disabled].alert:focus, .button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus { @@ -1180,9 +1220,9 @@ button, .button { background-color: #f08a24; border-color: #cf6e0e; color: #FFFFFF; + box-shadow: none; cursor: default; - opacity: 0.7; - box-shadow: none; } + opacity: 0.7; } button.disabled.warning:hover, button.disabled.warning:focus, button[disabled].warning:hover, button[disabled].warning:focus, .button.disabled.warning:hover, .button.disabled.warning:focus, .button[disabled].warning:hover, .button[disabled].warning:focus { background-color: #cf6e0e; } button.disabled.warning:hover, button.disabled.warning:focus, button[disabled].warning:hover, button[disabled].warning:focus, .button.disabled.warning:hover, .button.disabled.warning:focus, .button[disabled].warning:hover, .button[disabled].warning:focus { @@ -1193,9 +1233,9 @@ button, .button { background-color: #a0d3e8; border-color: #61b6d9; color: #333333; + box-shadow: none; cursor: default; - opacity: 0.7; - box-shadow: none; } + opacity: 0.7; } button.disabled.info:hover, button.disabled.info:focus, button[disabled].info:hover, button[disabled].info:focus, .button.disabled.info:hover, .button.disabled.info:focus, .button[disabled].info:hover, .button[disabled].info:focus { background-color: #61b6d9; } button.disabled.info:hover, button.disabled.info:focus, button[disabled].info:hover, button[disabled].info:focus, .button.disabled.info:hover, .button.disabled.info:focus, .button[disabled].info:hover, .button[disabled].info:focus { @@ -1207,7 +1247,7 @@ button::-moz-focus-inner { border: 0; padding: 0; } -@media only screen and (min-width: 40.063em) { +@media only screen and (min-width: 40.0625em) { button, .button { display: inline-block; } } @@ -1221,8 +1261,8 @@ button::-moz-focus-inner { .button-group:after { clear: both; } .button-group.even-2 li { - margin: 0 -2px; display: inline-block; + margin: 0 -2px; width: 50%; } .button-group.even-2 li > button, .button-group.even-2 li .button { border-left: 1px solid; @@ -1232,8 +1272,8 @@ button::-moz-focus-inner { .button-group.even-2 li button, .button-group.even-2 li .button { width: 100%; } .button-group.even-3 li { - margin: 0 -2px; display: inline-block; + margin: 0 -2px; width: 33.33333%; } .button-group.even-3 li > button, .button-group.even-3 li .button { border-left: 1px solid; @@ -1243,8 +1283,8 @@ button::-moz-focus-inner { .button-group.even-3 li button, .button-group.even-3 li .button { width: 100%; } .button-group.even-4 li { - margin: 0 -2px; display: inline-block; + margin: 0 -2px; width: 25%; } .button-group.even-4 li > button, .button-group.even-4 li .button { border-left: 1px solid; @@ -1254,8 +1294,8 @@ button::-moz-focus-inner { .button-group.even-4 li button, .button-group.even-4 li .button { width: 100%; } .button-group.even-5 li { - margin: 0 -2px; display: inline-block; + margin: 0 -2px; width: 20%; } .button-group.even-5 li > button, .button-group.even-5 li .button { border-left: 1px solid; @@ -1265,8 +1305,8 @@ button::-moz-focus-inner { .button-group.even-5 li button, .button-group.even-5 li .button { width: 100%; } .button-group.even-6 li { - margin: 0 -2px; display: inline-block; + margin: 0 -2px; width: 16.66667%; } .button-group.even-6 li > button, .button-group.even-6 li .button { border-left: 1px solid; @@ -1276,8 +1316,8 @@ button::-moz-focus-inner { .button-group.even-6 li button, .button-group.even-6 li .button { width: 100%; } .button-group.even-7 li { - margin: 0 -2px; display: inline-block; + margin: 0 -2px; width: 14.28571%; } .button-group.even-7 li > button, .button-group.even-7 li .button { border-left: 1px solid; @@ -1287,8 +1327,8 @@ button::-moz-focus-inner { .button-group.even-7 li button, .button-group.even-7 li .button { width: 100%; } .button-group.even-8 li { - margin: 0 -2px; display: inline-block; + margin: 0 -2px; width: 12.5%; } .button-group.even-8 li > button, .button-group.even-8 li .button { border-left: 1px solid; @@ -1298,16 +1338,14 @@ button::-moz-focus-inner { .button-group.even-8 li button, .button-group.even-8 li .button { width: 100%; } .button-group > li { - margin: 0 -2px; - display: inline-block; } + display: inline-block; + margin: 0 -2px; } .button-group > li > button, .button-group > li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5); } .button-group > li:first-child button, .button-group > li:first-child .button { border-left: 0; } .button-group.stack > li { - margin: 0 -2px; - display: inline-block; display: block; margin: 0; float: none; } @@ -1317,18 +1355,18 @@ button::-moz-focus-inner { .button-group.stack > li:first-child button, .button-group.stack > li:first-child .button { border-left: 0; } .button-group.stack > li > button, .button-group.stack > li .button { - border-top: 1px solid; border-color: rgba(255, 255, 255, 0.5); border-left-width: 0; - margin: 0; - display: block; } + border-top: 1px solid; + display: block; + margin: 0; } .button-group.stack > li > button { width: 100%; } .button-group.stack > li:first-child button, .button-group.stack > li:first-child .button { border-top: 0; } .button-group.stack-for-small > li { - margin: 0 -2px; - display: inline-block; } + display: inline-block; + margin: 0 -2px; } .button-group.stack-for-small > li > button, .button-group.stack-for-small > li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5); } @@ -1336,28 +1374,27 @@ button::-moz-focus-inner { border-left: 0; } @media only screen and (max-width: 40em) { .button-group.stack-for-small > li { - margin: 0 -2px; - display: inline-block; display: block; - margin: 0; } + margin: 0; + width: 100%; } .button-group.stack-for-small > li > button, .button-group.stack-for-small > li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5); } .button-group.stack-for-small > li:first-child button, .button-group.stack-for-small > li:first-child .button { border-left: 0; } .button-group.stack-for-small > li > button, .button-group.stack-for-small > li .button { - border-top: 1px solid; border-color: rgba(255, 255, 255, 0.5); border-left-width: 0; - margin: 0; - display: block; } + border-top: 1px solid; + display: block; + margin: 0; } .button-group.stack-for-small > li > button { width: 100%; } .button-group.stack-for-small > li:first-child button, .button-group.stack-for-small > li:first-child .button { border-top: 0; } } .button-group.radius > * { - margin: 0 -2px; - display: inline-block; } + display: inline-block; + margin: 0 -2px; } .button-group.radius > * > button, .button-group.radius > * .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5); } @@ -1385,8 +1422,6 @@ button::-moz-focus-inner { border-bottom-right-radius: 3px; border-top-right-radius: 3px; } .button-group.radius.stack > * { - margin: 0 -2px; - display: inline-block; display: block; margin: 0; } .button-group.radius.stack > * > button, .button-group.radius.stack > * .button { @@ -1395,11 +1430,11 @@ button::-moz-focus-inner { .button-group.radius.stack > *:first-child button, .button-group.radius.stack > *:first-child .button { border-left: 0; } .button-group.radius.stack > * > button, .button-group.radius.stack > * .button { - border-top: 1px solid; border-color: rgba(255, 255, 255, 0.5); border-left-width: 0; - margin: 0; - display: block; } + border-top: 1px solid; + display: block; + margin: 0; } .button-group.radius.stack > * > button { width: 100%; } .button-group.radius.stack > *:first-child button, .button-group.radius.stack > *:first-child .button { @@ -1425,10 +1460,10 @@ button::-moz-focus-inner { -webkit-bottom-right-radius: 3px; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } - @media only screen and (min-width: 40.063em) { + @media only screen and (min-width: 40.0625em) { .button-group.radius.stack-for-small > * { - margin: 0 -2px; - display: inline-block; } + display: inline-block; + margin: 0 -2px; } .button-group.radius.stack-for-small > * > button, .button-group.radius.stack-for-small > * .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5); } @@ -1457,8 +1492,6 @@ button::-moz-focus-inner { border-top-right-radius: 3px; } } @media only screen and (max-width: 40em) { .button-group.radius.stack-for-small > * { - margin: 0 -2px; - display: inline-block; display: block; margin: 0; } .button-group.radius.stack-for-small > * > button, .button-group.radius.stack-for-small > * .button { @@ -1467,11 +1500,11 @@ button::-moz-focus-inner { .button-group.radius.stack-for-small > *:first-child button, .button-group.radius.stack-for-small > *:first-child .button { border-left: 0; } .button-group.radius.stack-for-small > * > button, .button-group.radius.stack-for-small > * .button { - border-top: 1px solid; border-color: rgba(255, 255, 255, 0.5); border-left-width: 0; - margin: 0; - display: block; } + border-top: 1px solid; + display: block; + margin: 0; } .button-group.radius.stack-for-small > * > button { width: 100%; } .button-group.radius.stack-for-small > *:first-child button, .button-group.radius.stack-for-small > *:first-child .button { @@ -1498,8 +1531,8 @@ button::-moz-focus-inner { border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } } .button-group.round > * { - margin: 0 -2px; - display: inline-block; } + display: inline-block; + margin: 0 -2px; } .button-group.round > * > button, .button-group.round > * .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5); } @@ -1527,8 +1560,6 @@ button::-moz-focus-inner { border-bottom-right-radius: 1000px; border-top-right-radius: 1000px; } .button-group.round.stack > * { - margin: 0 -2px; - display: inline-block; display: block; margin: 0; } .button-group.round.stack > * > button, .button-group.round.stack > * .button { @@ -1537,11 +1568,11 @@ button::-moz-focus-inner { .button-group.round.stack > *:first-child button, .button-group.round.stack > *:first-child .button { border-left: 0; } .button-group.round.stack > * > button, .button-group.round.stack > * .button { - border-top: 1px solid; border-color: rgba(255, 255, 255, 0.5); border-left-width: 0; - margin: 0; - display: block; } + border-top: 1px solid; + display: block; + margin: 0; } .button-group.round.stack > * > button { width: 100%; } .button-group.round.stack > *:first-child button, .button-group.round.stack > *:first-child .button { @@ -1567,10 +1598,10 @@ button::-moz-focus-inner { -webkit-bottom-right-radius: 1rem; border-bottom-left-radius: 1rem; border-bottom-right-radius: 1rem; } - @media only screen and (min-width: 40.063em) { + @media only screen and (min-width: 40.0625em) { .button-group.round.stack-for-small > * { - margin: 0 -2px; - display: inline-block; } + display: inline-block; + margin: 0 -2px; } .button-group.round.stack-for-small > * > button, .button-group.round.stack-for-small > * .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5); } @@ -1599,8 +1630,6 @@ button::-moz-focus-inner { border-top-right-radius: 1000px; } } @media only screen and (max-width: 40em) { .button-group.round.stack-for-small > * { - margin: 0 -2px; - display: inline-block; display: block; margin: 0; } .button-group.round.stack-for-small > * > button, .button-group.round.stack-for-small > * .button { @@ -1609,11 +1638,11 @@ button::-moz-focus-inner { .button-group.round.stack-for-small > *:first-child button, .button-group.round.stack-for-small > *:first-child .button { border-left: 0; } .button-group.round.stack-for-small > * > button, .button-group.round.stack-for-small > * .button { - border-top: 1px solid; border-color: rgba(255, 255, 255, 0.5); border-left-width: 0; - margin: 0; - display: block; } + border-top: 1px solid; + display: block; + margin: 0; } .button-group.round.stack-for-small > * > button { width: 100%; } .button-group.round.stack-for-small > *:first-child button, .button-group.round.stack-for-small > *:first-child .button { @@ -1654,12 +1683,9 @@ button::-moz-focus-inner { overflow: hidden; } .row { - width: 100%; - margin-left: auto; - margin-right: auto; - margin-top: 0; - margin-bottom: 0; - max-width: 62.5rem; } + margin: 0 auto; + max-width: 62.5rem; + width: 100%; } .row:before, .row:after { content: " "; display: table; } @@ -1673,21 +1699,18 @@ button::-moz-focus-inner { margin-left: 0; margin-right: 0; } .row .row { - width: auto; - margin-left: -0.9375rem; - margin-right: -0.9375rem; - margin-top: 0; - margin-bottom: 0; - max-width: none; } + margin: 0 -0.9375rem; + max-width: none; + width: auto; } .row .row:before, .row .row:after { content: " "; display: table; } .row .row:after { clear: both; } .row .row.collapse { - width: auto; margin: 0; - max-width: none; } + max-width: none; + width: auto; } .row .row.collapse:before, .row .row.collapse:after { content: " "; display: table; } @@ -1701,20 +1724,28 @@ button::-moz-focus-inner { width: 100%; float: left; } -[class*="column"] + [class*="column"]:last-child { +.column + .column:last-child, +.columns + .column:last-child, .column + +.columns:last-child, +.columns + +.columns:last-child { float: right; } -[class*="column"] + [class*="column"].end { +.column + .column.end, +.columns + .column.end, .column + +.columns.end, +.columns + +.columns.end { float: left; } @media only screen { .small-push-0 { position: relative; - left: 0%; + left: 0; right: auto; } .small-pull-0 { position: relative; - right: 0%; + right: 0; left: auto; } .small-push-1 { position: relative; @@ -1835,7 +1866,7 @@ button::-moz-focus-inner { .small-12 { width: 100%; } .small-offset-0 { - margin-left: 0% !important; } + margin-left: 0 !important; } .small-offset-1 { margin-left: 8.33333% !important; } .small-offset-2 { @@ -1859,11 +1890,11 @@ button::-moz-focus-inner { .small-offset-11 { margin-left: 91.66667% !important; } .small-reset-order { + float: left; + left: auto; margin-left: 0; margin-right: 0; - left: auto; - right: auto; - float: left; } + right: auto; } .column.small-centered, .columns.small-centered { margin-left: auto; @@ -1871,9 +1902,9 @@ button::-moz-focus-inner { float: none; } .column.small-uncentered, .columns.small-uncentered { + float: left; margin-left: 0; - margin-right: 0; - float: left; } + margin-right: 0; } .column.small-centered:last-child, .columns.small-centered:last-child { float: none; } @@ -1896,14 +1927,14 @@ button::-moz-focus-inner { padding-right: 0.9375rem; float: left; } } -@media only screen and (min-width: 40.063em) { +@media only screen and (min-width: 40.0625em) { .medium-push-0 { position: relative; - left: 0%; + left: 0; right: auto; } .medium-pull-0 { position: relative; - right: 0%; + right: 0; left: auto; } .medium-push-1 { position: relative; @@ -2024,7 +2055,7 @@ button::-moz-focus-inner { .medium-12 { width: 100%; } .medium-offset-0 { - margin-left: 0% !important; } + margin-left: 0 !important; } .medium-offset-1 { margin-left: 8.33333% !important; } .medium-offset-2 { @@ -2048,11 +2079,11 @@ button::-moz-focus-inner { .medium-offset-11 { margin-left: 91.66667% !important; } .medium-reset-order { + float: left; + left: auto; margin-left: 0; margin-right: 0; - left: auto; - right: auto; - float: left; } + right: auto; } .column.medium-centered, .columns.medium-centered { margin-left: auto; @@ -2060,9 +2091,9 @@ button::-moz-focus-inner { float: none; } .column.medium-uncentered, .columns.medium-uncentered { + float: left; margin-left: 0; - margin-right: 0; - float: left; } + margin-right: 0; } .column.medium-centered:last-child, .columns.medium-centered:last-child { float: none; } @@ -2086,11 +2117,11 @@ button::-moz-focus-inner { float: left; } .push-0 { position: relative; - left: 0%; + left: 0; right: auto; } .pull-0 { position: relative; - right: 0%; + right: 0; left: auto; } .push-1 { position: relative; @@ -2181,14 +2212,14 @@ button::-moz-focus-inner { right: 91.66667%; left: auto; } } -@media only screen and (min-width: 64.063em) { +@media only screen and (min-width: 64.0625em) { .large-push-0 { position: relative; - left: 0%; + left: 0; right: auto; } .large-pull-0 { position: relative; - right: 0%; + right: 0; left: auto; } .large-push-1 { position: relative; @@ -2309,7 +2340,7 @@ button::-moz-focus-inner { .large-12 { width: 100%; } .large-offset-0 { - margin-left: 0% !important; } + margin-left: 0 !important; } .large-offset-1 { margin-left: 8.33333% !important; } .large-offset-2 { @@ -2333,11 +2364,11 @@ button::-moz-focus-inner { .large-offset-11 { margin-left: 91.66667% !important; } .large-reset-order { + float: left; + left: auto; margin-left: 0; margin-right: 0; - left: auto; - right: auto; - float: left; } + right: auto; } .column.large-centered, .columns.large-centered { margin-left: auto; @@ -2345,9 +2376,9 @@ button::-moz-focus-inner { float: none; } .column.large-uncentered, .columns.large-uncentered { + float: left; margin-left: 0; - margin-right: 0; - float: left; } + margin-right: 0; } .column.large-centered:last-child, .columns.large-centered:last-child { float: none; } @@ -2371,11 +2402,11 @@ button::-moz-focus-inner { float: left; } .push-0 { position: relative; - left: 0%; + left: 0; right: auto; } .pull-0 { position: relative; - right: 0%; + right: 0; left: auto; } .push-1 { position: relative; @@ -2539,17 +2570,17 @@ $portrait: "only screen and (orientation: portrait)" !default; $small-up: $screen !default; $small-only: "only screen and (max-width: 40em)" !default; -$medium-up: "only screen and (min-width:40.063em)" !default; -$medium-only: "only screen and (min-width:40.063em) and (max-width:64em)" !default; +$medium-up: "only screen and (min-width:40.0625em)" !default; +$medium-only: "only screen and (min-width:40.0625em) and (max-width:64em)" !default; -$large-up: "only screen and (min-width:64.063em)" !default; -$large-only: "only screen and (min-width:64.063em) and (max-width:90em)" !default; +$large-up: "only screen and (min-width:64.0625em)" !default; +$large-only: "only screen and (min-width:64.0625em) and (max-width:90em)" !default; -$xlarge-up: "only screen and (min-width:90.063em)" !default; -$xlarge-only: "only screen and (min-width:90.063em) and (max-width:120em)" !default; +$xlarge-up: "only screen and (min-width:90.0625em)" !default; +$xlarge-only: "only screen and (min-width:90.0625em) and (max-width:120em)" !default; -$xxlarge-up: "only screen and (min-width:120.063em)" !default; -$xxlarge-only: "only screen and (min-width:120.063em) and (max-width:99999999em)" !default; +$xxlarge-up: "only screen and (min-width:120.0625em)" !default; +$xxlarge-only: "only screen and (min-width:120.0625em) and (max-width:6249999.9375em)" !default; $retina: ( "only screen and (-webkit-min-device-pixel-ratio: 2)", @@ -2709,12 +2740,9 @@ body.node-type-publication #header > .inner, body.node-type-publication #utilities > .inner, body.node-type-publication #center, body.node-type-publication #footer { - width: 100%; - margin-left: auto; - margin-right: auto; - margin-top: 0; - margin-bottom: 0; - max-width: 80rem; } + margin: 0 auto; + max-width: 80rem; + width: 100%; } body.front:not(.page-actuality) #header > .inner:before, body.front:not(.page-actuality) #header > .inner:after, body.front:not(.page-actuality) #utilities > .inner:before, body.front:not(.page-actuality) #utilities > .inner:after, body.front:not(.page-actuality) #center:before, body.front:not(.page-actuality) #center:after, body.front:not(.page-actuality) #footer:before, body.front:not(.page-actuality) #footer:after, body.page-whoweare #header > .inner:before, body.page-whoweare #header > .inner:after, @@ -2886,11 +2914,11 @@ body.node-type-publication #footer { @media only screen and (max-width: 40em) { #header .logo span.slogan { display: none; } } - @media only screen and (min-width: 40.063em) and (max-width: 64em) { + @media only screen and (min-width: 40.0625em) and (max-width: 64em) { #header .logo span.slogan { display: block; margin-left: 0.1em; } } - @media only screen and (min-width: 64.063em) and (max-width: 90em) { + @media only screen and (min-width: 64.0625em) and (max-width: 90em) { #header .logo span.slogan { display: block; margin-left: 0.1em; } } @@ -2916,7 +2944,7 @@ body.node-type-publication #footer { #header #header-blocks > .region { padding-right: 0.3em; margin-right: 0.3em; } } - @media only screen and (min-width: 40.063em) and (max-width: 64em) { + @media only screen and (min-width: 40.0625em) and (max-width: 64em) { #header #header-blocks > .region { padding-right: 0.3em; margin-right: 0.3em; } } @@ -2938,7 +2966,7 @@ body.node-type-publication #footer { font-weight: normal; } #header #header-blocks .block:not(:last-child) { padding-right: 0.8em; } - @media only screen and (min-width: 90.063em) and (max-width: 120em) { + @media only screen and (min-width: 90.0625em) and (max-width: 120em) { #header #header-blocks .block:not(:last-child) { padding-right: 0.3em; } } @media only screen and (max-width: 40em) { @@ -2961,7 +2989,7 @@ body.node-type-publication #footer { background-image: url("../img/socialicons/svg/Vimeo-color.svg"); } #header #header-blocks #block-social-media-links-social-media-links li.rss a { background-image: url("../img/socialicons/svg/RSS-color.svg"); } - @media only screen and (min-width: 40.063em) and (max-width: 64em) { + @media only screen and (min-width: 40.0625em) and (max-width: 64em) { #header #header-blocks #block-social-media-links-social-media-links li.linkedin, #header #header-blocks #block-social-media-links-social-media-links li.pinterest, #header #header-blocks #block-social-media-links-social-media-links li.vimeo { display: none; } } #header #header-blocks #block-social-media-links-social-media-links a { @@ -3064,7 +3092,7 @@ body.node-type-publication #footer { @media only screen and (max-width: 40em) { #header #header-blocks #block-logintoboggan-logintoboggan-logged-in a span.account { display: none; } } - @media only screen and (min-width: 40.063em) and (max-width: 64em) { + @media only screen and (min-width: 40.0625em) and (max-width: 64em) { #header #header-blocks #block-logintoboggan-logintoboggan-logged-in a span.account { display: none; } } #header #header-blocks #block-materio-flag-materio-flag-mylists-nav { @@ -3078,7 +3106,7 @@ body.node-type-publication #footer { @media only screen and (max-width: 40em) { #header #header-blocks #block-materio-flag-materio-flag-mylists-nav h2 span.menu-title { display: none; } } - @media only screen and (min-width: 40.063em) and (max-width: 64em) { + @media only screen and (min-width: 40.0625em) and (max-width: 64em) { #header #header-blocks #block-materio-flag-materio-flag-mylists-nav h2 span.menu-title { display: none; } } #header #header-blocks #block-materio-flag-materio-flag-mylists-nav section.mylists { @@ -3154,7 +3182,7 @@ body.node-type-publication #footer { list-style: none; } .ie8 #header #header-blocks #block-menu-menu-top-menu ul.menu, .ie8 #header #header-blocks #block-menu-menu-top-menu li { display: inline; } - @media only screen and (min-width: 40.063em) { + @media only screen and (min-width: 40.0625em) { #header #header-blocks #block-menu-menu-top-menu h2 { display: none; } #header #header-blocks #block-menu-menu-top-menu ul.menu, #header #header-blocks #block-menu-menu-top-menu li { @@ -3297,7 +3325,7 @@ body.home-v2 #main { box-shadow: 0 0 6px rgba(0, 0, 0, 0.6); padding: 0.5em; position: relative; } - @media only screen and (min-width: 40.063em) { + @media only screen and (min-width: 40.0625em) { #highlighted { margin: 20px 0 6px; } #highlighted .block { @@ -3414,19 +3442,19 @@ body.home-v2 #main { html.js #highlighted .block-materio-didactique .slides .group-column-wrapper .field-name-field-emvideo { width: 290px; height: 163.125px; } } - @media only screen and (min-width: 40.063em) and (max-width: 64em) { + @media only screen and (min-width: 40.0625em) and (max-width: 64em) { html.js #highlighted .block-materio-didactique .slides .group-column-wrapper .field-name-field-emvideo { width: 216px; height: 121.5px; } } - @media only screen and (min-width: 64.063em) and (max-width: 90em) { + @media only screen and (min-width: 64.0625em) and (max-width: 90em) { html.js #highlighted .block-materio-didactique .slides .group-column-wrapper .field-name-field-emvideo { width: 216px; height: 121.5px; } } - @media only screen and (min-width: 90.063em) and (max-width: 120em) { + @media only screen and (min-width: 90.0625em) and (max-width: 120em) { html.js #highlighted .block-materio-didactique .slides .group-column-wrapper .field-name-field-emvideo { width: 280px; height: 157.5px; } } - @media only screen and (min-width: 120.063em) and (max-width: 99999999em) { + @media only screen and (min-width: 120.0625em) and (max-width: 6249999.9375em) { html.js #highlighted .block-materio-didactique .slides .group-column-wrapper .field-name-field-emvideo { width: 340px; height: 191.25px; } } @@ -3852,6 +3880,33 @@ body.home-v2 #main { width: 16em; } #tool-bar #materio-search-api-search-form #edit-bundles-filter { display: none; } } + #tool-bar #block-materio-search-api-mo-searchapi-advanced-search { + float: right; } + #tool-bar #block-materio-search-api-mo-searchapi-advanced-search > .inner { + display: moz-inline-stack; + display: inline-block; + vertical-align: top; + zoom: 1; + *display: inline; + margin: 0 0 0 10px; + padding: 3px 10px; + background-color: #fff; + border-radius: 3px; + background-clip: padding-box; + box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); + transition: box-shadow 0.3s ease-out; + text-align: right; } + #tool-bar #block-materio-search-api-mo-searchapi-advanced-search > .inner:hover, #tool-bar #block-materio-search-api-mo-searchapi-advanced-search > .inner:focus { + box-shadow: 0 0 5px rgba(0, 0, 0, 0.7); } + #tool-bar #block-materio-search-api-mo-searchapi-advanced-search > .inner:active { + transition: box-shadow 0s ease-out; + box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); } + #tool-bar #materio-search-api-advanced-search-form .filter-line .form-item.form-type-select { + display: inline-block; + vertical-align: middle; + font-size: 12px; + line-height: 1; + padding-right: 3em; } #center { border-radius: 10px; @@ -5876,6 +5931,9 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { #modal form .form-actions { text-align: right; } #modal form input.form-submit { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -5884,26 +5942,23 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #008CBA; border-color: #007095; color: #FFFFFF; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #modal form input.form-submit:hover, #modal form input.form-submit:focus { background-color: #007095; } #modal form input.form-submit:hover, #modal form input.form-submit:focus { color: #FFFFFF; } #modal form input.form-submit[name="create"] { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -5912,26 +5967,23 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #43AC6A; border-color: #368a55; color: #FFFFFF; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #modal form input.form-submit[name="create"]:hover, #modal form input.form-submit[name="create"]:focus { background-color: #368a55; } #modal form input.form-submit[name="create"]:hover, #modal form input.form-submit[name="create"]:focus { color: #FFFFFF; } #modal form input.form-submit[name="save"] { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -5940,26 +5992,23 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #43AC6A; border-color: #368a55; color: #FFFFFF; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #modal form input.form-submit[name="save"]:hover, #modal form input.form-submit[name="save"]:focus { background-color: #368a55; } #modal form input.form-submit[name="save"]:hover, #modal form input.form-submit[name="save"]:focus { color: #FFFFFF; } #modal form input.form-submit[name="delete"] { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -5968,26 +6017,23 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #f04124; border-color: #cf2a0e; color: #FFFFFF; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #modal form input.form-submit[name="delete"]:hover, #modal form input.form-submit[name="delete"]:focus { background-color: #cf2a0e; } #modal form input.form-submit[name="delete"]:hover, #modal form input.form-submit[name="delete"]:focus { color: #FFFFFF; } #modal form input.form-submit[name="cancel"] { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -5996,21 +6042,15 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #e7e7e7; border-color: #b9b9b9; color: #333333; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #modal form input.form-submit[name="cancel"]:hover, #modal form input.form-submit[name="cancel"]:focus { background-color: #b9b9b9; } #modal form input.form-submit[name="cancel"]:hover, #modal form input.form-submit[name="cancel"]:focus { @@ -6106,7 +6146,7 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { /_/ /_____/_____/_____/_____/_/ |_\____/_/ |_| */ -@media only screen and (min-width: 40.063em) and (max-width: 64em) { +@media only screen and (min-width: 40.0625em) and (max-width: 64em) { #block-feedback-form { bottom: 5px; left: 5px; @@ -6153,6 +6193,9 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { #block-feedback-form .content form .form-actions { text-align: right; } #block-feedback-form .content form input.form-submit { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -6161,26 +6204,23 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #008CBA; border-color: #007095; color: #FFFFFF; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #block-feedback-form .content form input.form-submit:hover, #block-feedback-form .content form input.form-submit:focus { background-color: #007095; } #block-feedback-form .content form input.form-submit:hover, #block-feedback-form .content form input.form-submit:focus { color: #FFFFFF; } #block-feedback-form .content form input.form-submit[name="create"] { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -6189,26 +6229,23 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #43AC6A; border-color: #368a55; color: #FFFFFF; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #block-feedback-form .content form input.form-submit[name="create"]:hover, #block-feedback-form .content form input.form-submit[name="create"]:focus { background-color: #368a55; } #block-feedback-form .content form input.form-submit[name="create"]:hover, #block-feedback-form .content form input.form-submit[name="create"]:focus { color: #FFFFFF; } #block-feedback-form .content form input.form-submit[name="save"] { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -6217,26 +6254,23 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #43AC6A; border-color: #368a55; color: #FFFFFF; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #block-feedback-form .content form input.form-submit[name="save"]:hover, #block-feedback-form .content form input.form-submit[name="save"]:focus { background-color: #368a55; } #block-feedback-form .content form input.form-submit[name="save"]:hover, #block-feedback-form .content form input.form-submit[name="save"]:focus { color: #FFFFFF; } #block-feedback-form .content form input.form-submit[name="delete"] { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -6245,26 +6279,23 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #f04124; border-color: #cf2a0e; color: #FFFFFF; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #block-feedback-form .content form input.form-submit[name="delete"]:hover, #block-feedback-form .content form input.form-submit[name="delete"]:focus { background-color: #cf2a0e; } #block-feedback-form .content form input.form-submit[name="delete"]:hover, #block-feedback-form .content form input.form-submit[name="delete"]:focus { color: #FFFFFF; } #block-feedback-form .content form input.form-submit[name="cancel"] { + -webkit-appearance: none; + -moz-appearance: none; + border-radius: 0; border-style: solid; border-width: 0; cursor: pointer; @@ -6273,21 +6304,15 @@ article.node-materiau.vm-cardfull, article.node-breve.vm-cardfull { line-height: normal; margin: 0 0 1.25rem; position: relative; - text-decoration: none; text-align: center; - -webkit-appearance: none; - -moz-appearance: none; - border-radius: 0; + text-decoration: none; display: inline-block; - padding-top: 0.625rem; - padding-right: 1.25rem; - padding-bottom: 0.6875rem; - padding-left: 1.25rem; + padding: 0.625rem 1.25rem 0.6875rem 1.25rem; font-size: 0.6875rem; background-color: #e7e7e7; border-color: #b9b9b9; color: #333333; - transition: background-color 300ms ease-out; } + transition: background-color, 300ms, ease-out; } #block-feedback-form .content form input.form-submit[name="cancel"]:hover, #block-feedback-form .content form input.form-submit[name="cancel"]:focus { background-color: #b9b9b9; } #block-feedback-form .content form input.form-submit[name="cancel"]:hover, #block-feedback-form .content form input.form-submit[name="cancel"]:focus { @@ -6578,7 +6603,7 @@ body.node-type-simplenews #content article.node.node-simplenews { |__| |__|__|_____|_____|_____|_|___|_____| */ -@media only screen and (min-width: 40.063em) { +@media only screen and (min-width: 40.0625em) { body.page-node-11187 .node-11187 .field-name-body div.column, body.page-node-11187 .node-11187 .field-name-body div.column:last-child, body.page-node-11187 .node-11187 .field-name-body div.column-demi, body.page-node-11187 .node-11187 .field-name-body div.column-demi:last-child, body.page-node-11187 .node-11187 .field-name-body div.column-full, body.page-node-11187 .node-11187 .field-name-body div.column-full:last-child, body.page-node-11187 .node-11187 .field-name-body div.column-auto, body.page-node-11187 .node-11187 .field-name-body div.column-auto:last-child { display: moz-inline-stack; display: inline-block; @@ -6722,7 +6747,7 @@ body.page-node-11187 .node-11187 .field-name-body { background-color: #e6e6e6; border-radius: 10px; background-clip: padding-box; } - @media only screen and (min-width: 40.063em) { + @media only screen and (min-width: 40.0625em) { #webform-client-form-11186 { padding: 10px 30px; } #webform-client-form-11186 #webform-component-column-left--membership-options { @@ -6771,7 +6796,7 @@ body.page-node-11187 .node-11187 .field-name-body { color: #7f7f7f; } #webform-client-form-11186 input.form-text { width: 13em; } } - @media only screen and (min-width: 40.063em) and (max-width: 64em) { + @media only screen and (min-width: 40.0625em) and (max-width: 64em) { #webform-client-form-11186 { padding: 10px; } #webform-client-form-11186 #webform-component-column-left--membership-options { @@ -7384,7 +7409,7 @@ body.page-node-11187 .node-11187 .field-name-body { #didactique-page .node-didactique .field-name-field-visuel figure, #didactique-page .node-didactique .field-name-field-visuel img { max-width: 100%; } -@media only screen and (min-width: 40.063em) { +@media only screen and (min-width: 40.0625em) { #didactique-page .side { display: moz-inline-stack; display: inline-block; @@ -7561,15 +7586,15 @@ body.home-v2 #center { #home-v2 > .panel-panel > div > .panel-pane.intro-video .field-name-field-emvideo .embedded-video { width: 320px; height: 180px; } } - @media only screen and (min-width: 40.063em) and (max-width: 64em) { + @media only screen and (min-width: 40.0625em) and (max-width: 64em) { #home-v2 > .panel-panel > div > .panel-pane.intro-video .field-name-field-emvideo .embedded-video { width: 640px; height: 360px; } } - @media only screen and (min-width: 64.063em) and (max-width: 90em) { + @media only screen and (min-width: 64.0625em) and (max-width: 90em) { #home-v2 > .panel-panel > div > .panel-pane.intro-video .field-name-field-emvideo .embedded-video { width: 800px; height: 450px; } } - @media only screen and (min-width: 90.063em) { + @media only screen and (min-width: 90.0625em) { #home-v2 > .panel-panel > div > .panel-pane.intro-video .field-name-field-emvideo .embedded-video { width: 1024px; height: 576px; } } @@ -8033,14 +8058,11 @@ body.home-v2 #center { position: relative; } #home-v2 > .panel-panel > div > .pane-news-home-v2 h2 { font-size: 30px; } - @media only screen and (min-width: 40.063em) { + @media only screen and (min-width: 40.0625em) { #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .center-wrapper { - width: 100%; - margin-left: auto; - margin-right: auto; - margin-top: 0; - margin-bottom: 0; - max-width: 80rem; } + margin: 0 auto; + max-width: 80rem; + width: 100%; } #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .center-wrapper:before, #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .center-wrapper:after { content: " "; display: table; } @@ -8064,12 +8086,9 @@ body.home-v2 #center { margin: 0; height: 610px; } } #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom { - width: 100%; - margin-left: auto; - margin-right: auto; - margin-top: 0; - margin-bottom: 0; + margin: 0 auto; max-width: 80rem; + width: 100%; margin-top: 1.5em; margin-bottom: 1.5em; } #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom:before, #home-v2 > .panel-panel > div > .pane-news-home-v2 #mini-panel-news_home_v2 .panel-col-bottom:after { @@ -8191,7 +8210,7 @@ body.home-v2 #center { body.node-type-publication article.node-publication .field figure, body.node-type-publication article.node-publication .field img { max-width: 100%; } -@media only screen and (min-width: 64.063em) { +@media only screen and (min-width: 64.0625em) { body.node-type-publication article.node-publication .field { display: moz-inline-stack; display: inline-block; @@ -8323,7 +8342,7 @@ i { background-color: #fff; } /** embed player */ -@media only screen and (min-width: 40.063em) and (max-width: 64em) { +@media only screen and (min-width: 40.0625em) and (max-width: 64em) { .embedded-video .player iframe { max-width: 100%; height: auto; } } diff --git a/sites/all/themes/gui/materiobasetheme/scss/styles.scss b/sites/all/themes/gui/materiobasetheme/scss/styles.scss index 38c3c092..83e65ee0 100644 --- a/sites/all/themes/gui/materiobasetheme/scss/styles.scss +++ b/sites/all/themes/gui/materiobasetheme/scss/styles.scss @@ -1086,8 +1086,33 @@ $headerouterheight:$headerheight+$headerpaddingtop+$headerpaddingbottom; #edit-bundles-filter{display:none;} } } + + + #block-materio-search-api-mo-searchapi-advanced-search{ + // @include inlineblock(); vertical-align: middle ; + // position:absolute; top:10px; right:0; + float:right; + >.inner{ + @include inlineblock(); margin:0 0 0 10px; + padding: 3px 10px; background-color:#fff; @include rounded(3px); + @include shadowBtn(); text-align: right; + } + } + + #materio-search-api-advanced-search-form{ + .filter-line{ + .form-item.form-type-select{ + display:inline-block; + vertical-align: middle; + @include fs12; line-height:1; + padding-right:3em; + } + } + } + } + #center{ // background-color: #e6e6e6; @include rounded(10px);